guford-ui 0.1.0 → 0.3.0

package/bin.mjs

@@ -25,13 +25,15 @@
 import { readFileSync, writeFileSync, existsSync, mkdirSync } from 'node:fs';
 import { dirname, basename, join, resolve, relative } from 'node:path';
 import { fileURLToPath } from 'node:url';
+import { execSync } from 'node:child_process';
 
 const __dirname = dirname(fileURLToPath(import.meta.url));
 const ROOT = resolve(__dirname, '..'); // racine du dépôt guford-ui (mode local)
 const CONFIG_FILE = 'guford-ui.json';
 
-// Base distante par défaut (à adapter après publication : GitHub raw, host statique…).
-const DEFAULT_REMOTE = 'https://raw.githubusercontent.com/bekmarc/guford-ui/main';
+// Dépôt GitHub par défaut (privé → lu via l'API Contents avec token).
+const DEFAULT_REPO = 'bekmarc/guford-ui';
+const DEFAULT_REF = 'main';
 
 // --- couleurs ANSI ---------------------------------------------------------
 const c = {
@@ -48,42 +50,72 @@ function fail(msg) {
   process.exit(1);
 }
 
-// --- source du registry (local FS ou URL distante) -------------------------
+// --- source du registry (local FS | URL statique | API GitHub privée) ------
 /**
- * @param {{registry?: string}} flags
- * @returns {{remote: boolean, base: string}}
+ * Résout la source du registry. 3 modes :
+ *  - 'local'  : fichiers du dépôt (exécution depuis quitus-ui/guford-ui)
+ *  - 'url'    : base HTTP statique (--registry / $GUFORD_UI_REGISTRY), token facultatif
+ *  - 'github' : dépôt GitHub privé via l'API Contents (--repo/--ref + token requis)
  */
 function resolveSource(flags) {
+  const token = flags.token || process.env.GUFORD_UI_TOKEN || process.env.GITHUB_TOKEN;
   const explicit = flags.registry || process.env.GUFORD_UI_REGISTRY;
-  if (explicit) return { remote: true, base: explicit.replace(/\/+$/, '') };
-  if (existsSync(join(ROOT, 'registry.json'))) return { remote: false, base: ROOT };
-  return { remote: true, base: DEFAULT_REMOTE };
+  if (explicit) return { kind: 'url', base: explicit.replace(/\/+$/, ''), token };
+  if (!flags.repo && existsSync(join(ROOT, 'registry.json'))) return { kind: 'local', base: ROOT };
+  return { kind: 'github', repo: flags.repo || DEFAULT_REPO, ref: flags.ref || DEFAULT_REF, token };
+}
+
+function sourceUrl(source, rel) {
+  if (source.kind === 'url') return `${source.base}/${rel}`;
+  // GitHub Contents API : renvoie le contenu brut (texte + binaire) avec Accept: raw
+  return `https://api.github.com/repos/${source.repo}/contents/${rel}?ref=${source.ref}`;
+}
+
+function sourceHeaders(source) {
+  const h = { 'User-Agent': 'guford-ui-cli' };
+  if (source.kind === 'github') {
+    if (!source.token)
+      fail(
+        'Dépôt privé : un token est requis.\n' +
+          '  → crée un PAT GitHub (Contents: read) puis:  set GUFORD_UI_TOKEN=<token>\n' +
+          '  (ou passe --token <token>, ou utilise --registry <url-publique>)',
+      );
+    h.Authorization = `Bearer ${source.token}`;
+    h.Accept = 'application/vnd.github.raw';
+  } else if (source.token) {
+    h.Authorization = `Bearer ${source.token}`;
+  }
+  return h;
+}
+
+async function fetchEntry(source, rel) {
+  const url = sourceUrl(source, rel);
+  const res = await fetch(url, { headers: sourceHeaders(source) });
+  if (!res.ok) {
+    const hint = res.status === 404 ? ' (introuvable, ou token sans accès au dépôt privé)' : '';
+    fail(`Téléchargement échoué (${res.status})${hint} : ${url}`);
+  }
+  return Buffer.from(await res.arrayBuffer());
 }
 
 /** Lit un fichier texte du registry (chemin relatif à la racine, ex: 'registry.json'). */
 async function readText(source, rel) {
-  if (source.remote) {
-    const url = `${source.base}/${rel}`;
-    const res = await fetch(url);
-    if (!res.ok) fail(`Téléchargement échoué (${res.status}) : ${url}`);
-    return await res.text();
+  if (source.kind === 'local') {
+    const path = join(source.base, rel);
+    if (!existsSync(path)) fail(`Fichier introuvable: ${path}`);
+    return readFileSync(path, 'utf8');
   }
-  const path = join(source.base, rel);
-  if (!existsSync(path)) fail(`Fichier introuvable: ${path}`);
-  return readFileSync(path, 'utf8');
+  return (await fetchEntry(source, rel)).toString('utf8');
 }
 
 /** Lit un fichier (texte ou binaire) du registry → Buffer. */
 async function readBuffer(source, rel) {
-  if (source.remote) {
-    const url = `${source.base}/${rel}`;
-    const res = await fetch(url);
-    if (!res.ok) fail(`Téléchargement échoué (${res.status}) : ${url}`);
-    return Buffer.from(await res.arrayBuffer());
+  if (source.kind === 'local') {
+    const path = join(source.base, rel);
+    if (!existsSync(path)) fail(`Fichier introuvable: ${path}`);
+    return readFileSync(path);
   }
-  const path = join(source.base, rel);
-  if (!existsSync(path)) fail(`Fichier introuvable: ${path}`);
-  return readFileSync(path);
+  return await fetchEntry(source, rel);
 }
 
 async function loadRegistry(source) {
@@ -119,17 +151,147 @@ function loadProjectConfig(cwd) {
   return null;
 }
 
+// --- auto-câblage du projet cible ------------------------------------------
+/** Détecte la structure du projet Angular consommateur. */
+function detectProject(cwd) {
+  const root = resolve(process.cwd(), cwd);
+  const out = { root, ngMajor: null, ngJsonPath: null, ngJson: null, projName: null, sourceRoot: 'src', stylesFile: null, appConfig: null, hasTailwind: false };
+
+  const pkgPath = join(root, 'package.json');
+  if (existsSync(pkgPath)) {
+    try {
+      const pkg = JSON.parse(readFileSync(pkgPath, 'utf8'));
+      const deps = { ...(pkg.dependencies || {}), ...(pkg.devDependencies || {}) };
+      const ver = deps['@angular/core'];
+      const m = ver && ver.match(/(\d+)/);
+      if (m) out.ngMajor = Number(m[1]);
+      out.hasTailwind = !!deps['tailwindcss'];
+    } catch {}
+  }
+
+  const ngJsonPath = join(root, 'angular.json');
+  if (existsSync(ngJsonPath)) {
+    try {
+      const ngJson = JSON.parse(readFileSync(ngJsonPath, 'utf8'));
+      out.ngJsonPath = ngJsonPath;
+      out.ngJson = ngJson;
+      for (const [name, proj] of Object.entries(ngJson.projects || {})) {
+        const build = proj.architect?.build || proj.targets?.build;
+        if (build) {
+          out.projName = name;
+          out.sourceRoot = proj.sourceRoot || 'src';
+          const styles = build.options?.styles || [];
+          out.stylesFile = styles.find((s) => typeof s === 'string' && /\.(scss|css)$/.test(s)) || `${out.sourceRoot}/styles.scss`;
+          break;
+        }
+      }
+    } catch {}
+  }
+  out.appConfig = join(root, out.sourceRoot, 'app', 'app.config.ts');
+  return out;
+}
+
+/** Versions CoreUI/CDK alignées sur la version d'Angular du projet. */
+function coreuiVersions(ngMajor) {
+  const map = { 19: '^5.4', 20: '^5.5', 21: '^5.6', 22: '^5.6' };
+  const cu = map[ngMajor] || '^5.5';
+  const ng = ngMajor ? `^${ngMajor}.0.0` : '^20.0.0';
+  return {
+    list: [`@coreui/angular@${cu}`, '@coreui/coreui@~5.4', `@coreui/icons-angular@${cu}`, `@angular/cdk@${ng}`, `@angular/animations@${ng}`],
+    ng,
+  };
+}
+
+function runNpmInstall(root, pkgs, { dryRun, dev = false } = {}) {
+  if (!pkgs.length) return;
+  const cmd = `npm install ${dev ? '-D ' : ''}${pkgs.join(' ')} --legacy-peer-deps`;
+  console.log(`  ${c.cyan('$')} ${cmd}`);
+  if (dryRun) return;
+  try {
+    execSync(cmd, { cwd: root, stdio: 'inherit' });
+  } catch {
+    console.log(c.yellow(`  ⚠ npm install a échoué — lance-le manuellement : ${cmd}`));
+  }
+}
+
+/** Ajoute une ligne à un fichier si absente (création si besoin). */
+function ensureLine(path, line, { dryRun, prepend = false } = {}) {
+  let content = existsSync(path) ? readFileSync(path, 'utf8') : '';
+  if (content.includes(line.trim())) return false;
+  content = prepend ? `${line}\n${content}` : `${content}${content.endsWith('\n') || content === '' ? '' : '\n'}${line}\n`;
+  if (!dryRun) {
+    mkdirSync(dirname(path), { recursive: true });
+    writeFileSync(path, content);
+  }
+  return true;
+}
+
+/** Crée/complète tailwind.config.js avec le preset partagé. */
+function wireTailwind(root, dryRun) {
+  const path = join(root, 'tailwind.config.js');
+  if (!existsSync(path)) {
+    const content = `/** @type {import('tailwindcss').Config} */\nmodule.exports = {\n  presets: [require('./tailwind.preset.cjs')],\n  content: ['./src/**/*.{html,ts}'],\n};\n`;
+    if (!dryRun) writeFileSync(path, content);
+    return 'créé';
+  }
+  let s = readFileSync(path, 'utf8');
+  if (s.includes('tailwind.preset.cjs')) return 'déjà présent';
+  const m = s.match(/(module\.exports\s*=\s*\{|export\s+default\s*\{)/);
+  if (!m) return 'à compléter à la main';
+  const idx = m.index + m[0].length;
+  s = `${s.slice(0, idx)}\n  presets: [require('./tailwind.preset.cjs')],${s.slice(idx)}`;
+  if (!dryRun) writeFileSync(path, s);
+  return 'preset ajouté';
+}
+
+/** Ajoute le CSS CoreUI au tableau styles d'angular.json. */
+function wireCoreuiCss(proj, dryRun) {
+  if (!proj.ngJson || !proj.projName) return 'angular.json introuvable';
+  const cssPath = 'node_modules/@coreui/coreui/dist/css/coreui.min.css';
+  const p = proj.ngJson.projects[proj.projName];
+  const build = p.architect?.build || p.targets?.build;
+  build.options = build.options || {};
+  build.options.styles = build.options.styles || [];
+  if (build.options.styles.includes(cssPath)) return 'déjà présent';
+  build.options.styles.unshift(cssPath);
+  if (!dryRun) writeFileSync(proj.ngJsonPath, JSON.stringify(proj.ngJson, null, 2) + '\n');
+  return 'ajouté';
+}
+
+/** Ajoute provideAnimations() dans app.config.ts. */
+function wireProvideAnimations(appConfigPath, dryRun) {
+  if (!existsSync(appConfigPath)) return 'app.config.ts introuvable';
+  let s = readFileSync(appConfigPath, 'utf8');
+  if (s.includes('provideAnimations')) return 'déjà présent';
+  if (!s.includes('@angular/platform-browser/animations')) {
+    s = `import { provideAnimations } from '@angular/platform-browser/animations';\n${s}`;
+  }
+  const m = s.match(/providers\s*:\s*\[/);
+  if (!m) return 'providers[] introuvable';
+  const idx = m.index + m[0].length;
+  s = `${s.slice(0, idx)}\n    provideAnimations(),${s.slice(idx)}`;
+  if (!dryRun) writeFileSync(appConfigPath, s);
+  return 'ajouté';
+}
+
 // --- parseur d'arguments ---------------------------------------------------
 function parseArgs(argv) {
   const positionals = [];
-  const flags = { cwd: '.', dir: undefined, overwrite: false, dryRun: false, registry: undefined };
+  const flags = {
+    cwd: '.', dir: undefined, overwrite: false, dryRun: false,
+    registry: undefined, token: undefined, repo: undefined, ref: undefined, install: true,
+  };
   for (let i = 0; i < argv.length; i++) {
     const a = argv[i];
     if (a === '--overwrite') flags.overwrite = true;
     else if (a === '--dry-run') flags.dryRun = true;
+    else if (a === '--no-install') flags.install = false;
     else if (a === '--cwd') flags.cwd = argv[++i];
     else if (a === '--dir') flags.dir = argv[++i];
     else if (a === '--registry') flags.registry = argv[++i];
+    else if (a === '--token') flags.token = argv[++i];
+    else if (a === '--repo') flags.repo = argv[++i];
+    else if (a === '--ref') flags.ref = argv[++i];
     else if (a.startsWith('--')) fail(`Option inconnue: ${a}`);
     else positionals.push(a);
   }
@@ -137,7 +299,9 @@ function parseArgs(argv) {
 }
 
 function sourceLabel(source) {
-  return source.remote ? c.dim(`(registry distant: ${source.base})`) : c.dim('(registry local)');
+  if (source.kind === 'local') return c.dim('(registry local)');
+  if (source.kind === 'url') return c.dim(`(registry: ${source.base})`);
+  return c.dim(`(registry GitHub: ${source.repo}@${source.ref})`);
 }
 
 // --- commandes -------------------------------------------------------------
@@ -222,14 +386,45 @@ async function cmdAdd(names, flags) {
   }
 
   console.log(log.join('\n'));
+
+  // --- Dépendances npm + câblage CoreUI automatiques ---
+  const proj = detectProject(flags.cwd);
+  const usesCoreui = npmDeps.has('@coreui/angular');
+
+  // Liste à installer : deps registry (hors @coreui/angular et @angular/cdk gérés à part) + peers CoreUI alignés
+  const installList = [...npmDeps].filter((d) => d !== '@coreui/angular' && d !== '@angular/cdk');
+  if (usesCoreui) {
+    const { list } = coreuiVersions(proj.ngMajor);
+    installList.push(...list);
+    console.log(
+      c.dim(
+        `\n  CoreUI détecté → versions alignées sur Angular ${proj.ngMajor ?? '?'} ` +
+          `(${coreuiVersions(proj.ngMajor).list.join(' ')})`,
+      ),
+    );
+  } else if (npmDeps.has('@angular/cdk')) {
+    installList.push(`@angular/cdk${proj.ngMajor ? '@^' + proj.ngMajor + '.0.0' : ''}`);
+  }
+
   console.log('');
-  if (npmDeps.size) {
-    console.log(c.cyan('  Dépendances npm à installer dans le projet cible:'));
-    console.log(`    ${c.bold('npm install ' + [...npmDeps].join(' '))}\n`);
+  if (installList.length) {
+    if (flags.install) runNpmInstall(proj.root, installList, { dryRun: flags.dryRun });
+    else {
+      console.log(c.cyan('  Dépendances npm (à installer — sauté: --no-install):'));
+      console.log(`    ${c.bold('npm install ' + installList.join(' '))}`);
+    }
+  }
+
+  // Câblage CoreUI (CSS + animations) si nécessaire
+  if (usesCoreui) {
+    console.log(c.cyan('\n  Câblage CoreUI:'));
+    console.log(`    ${c.green('✓')} angular.json styles — ${wireCoreuiCss(proj, flags.dryRun)}`);
+    console.log(`    ${c.green('✓')} app.config.ts provideAnimations() — ${wireProvideAnimations(proj.appConfig, flags.dryRun)}`);
   }
+
   console.log(
     c.dim(
-      `  ${written} fichier(s) ${flags.dryRun ? 'seraient écrits' : 'écrits'}` +
+      `\n  ${written} fichier(s) ${flags.dryRun ? 'seraient écrits' : 'écrits'}` +
         (skipped ? `, ${skipped} ignoré(s)` : '') +
         '.\n',
     ),
@@ -293,12 +488,30 @@ async function cmdInit(flags) {
   }
 
   console.log(log.join('\n'));
-  console.log(c.cyan('\n  Étapes de câblage:'));
-  console.log(`    1. Styles globaux — ajoutez:  ${c.bold(`@import './styles/guford-ui-tokens.css';`)}`);
-  console.log(`       ${c.dim(`(dans ${dir}/styles.scss ou ${dir}/styles.css)`)}`);
-  console.log(`    2. tailwind.config.js — ajoutez:  ${c.bold(`presets: [require('./tailwind.preset.cjs')]`)}`);
-  console.log(`    3. Peer-deps de base:  ${c.bold('npm install clsx tailwind-merge')}`);
-  console.log(`       ${c.dim('(certains composants requièrent aussi @coreui/angular — voir `info <name>`)')}`);
+
+  // --- Câblage automatique du projet cible ---
+  const proj = detectProject(flags.cwd);
+  console.log(c.cyan('\n  Câblage automatique:'));
+
+  // 1. Fichier de styles global : directives Tailwind (si absentes) + @import tokens
+  const stylesFile = proj.stylesFile ? join(proj.root, proj.stylesFile) : join(projectRoot, dir, 'styles.scss');
+  if (!existsSync(stylesFile) || !readFileSync(stylesFile, 'utf8').includes('@tailwind base')) {
+    ensureLine(stylesFile, '@tailwind base;\n@tailwind components;\n@tailwind utilities;', { dryRun: flags.dryRun, prepend: true });
+  }
+  const addedImport = ensureLine(stylesFile, `@import './styles/guford-ui-tokens.css';`, { dryRun: flags.dryRun });
+  console.log(`    ${addedImport ? c.green('✓') : c.dim('•')} tokens importés → ${relative(process.cwd(), stylesFile)}`);
+
+  // 2. tailwind.config.js (preset partagé)
+  console.log(`    ${c.green('✓')} tailwind.config.js — ${wireTailwind(proj.root, flags.dryRun)}`);
+
+  // 3. Peer-deps de base (+ Tailwind si absent)
+  if (flags.install) {
+    runNpmInstall(proj.root, ['clsx', 'tailwind-merge'], { dryRun: flags.dryRun });
+    if (!proj.hasTailwind) runNpmInstall(proj.root, ['tailwindcss@3', 'postcss', 'autoprefixer'], { dryRun: flags.dryRun, dev: true });
+  } else {
+    console.log(c.dim('    • npm install clsx tailwind-merge' + (proj.hasTailwind ? '' : ' (+ -D tailwindcss@3 postcss autoprefixer)') + '  (sauté: --no-install)'));
+  }
+
   console.log(
     c.dim(
       `\n  ${written} fichier(s) ${flags.dryRun ? 'seraient écrits' : 'écrits'}` +
@@ -321,9 +534,20 @@ function help() {
   ${c.cyan('Options:')}
     --cwd <path>         Projet cible (défaut: .)
     --dir <path>         Racine d'installation (défaut: guford-ui.json puis src)
-    --registry <url>     Base distante du registry (sinon $GUFORD_UI_REGISTRY, sinon local)
+    --registry <url>     Base HTTP statique du registry (sinon $GUFORD_UI_REGISTRY)
+    --repo <owner/repo>  Dépôt GitHub (défaut: ${DEFAULT_REPO})
+    --ref <branch|tag>   Réf GitHub (défaut: ${DEFAULT_REF}) — pin sur un tag pour reproductibilité
+    --token <token>      Token GitHub pour dépôt privé (sinon $GUFORD_UI_TOKEN / $GITHUB_TOKEN)
+    --no-install         Ne lance pas npm install (affiche les commandes)
     --overwrite          Écrase les fichiers existants
-    --dry-run            Simule sans écrire
+    --dry-run            Simule sans écrire ni installer
+
+  ${c.cyan('Auto-câblage:')} init/add modifient le projet cible (npm install avec
+    CoreUI aligné sur votre Angular, @import des tokens, preset Tailwind,
+    CSS CoreUI dans angular.json, provideAnimations dans app.config.ts).
+
+  ${c.cyan('Dépôt privé:')} crée un PAT GitHub (Contents: read), puis
+    ${c.dim('set GUFORD_UI_TOKEN=<token>   # Windows (cmd)   |   $env:GUFORD_UI_TOKEN="<token>" (PowerShell)')}
 `);
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "guford-ui",
-  "version": "0.1.0",
+  "version": "0.3.0",
   "description": "CLI pour installer les composants du registry guford-ui (façon shadcn).",
   "type": "module",
   "bin": {