claude-code-templates 1.12.0 → 1.12.2

package/bin/create-claude-config.js

@@ -5,32 +5,39 @@ const chalk = require('chalk');
 const boxen = require('boxen');
 const { createClaudeConfig } = require('../src/index');
 
-// ASCII Art for Claude Code Templates
-const banner = chalk.hex('#D97706')(`
- ██████╗██╗      █████╗ ██╗   ██╗██████╗ ███████╗
-██╔════╝██║     ██╔══██╗██║   ██║██╔══██╗██╔════╝
-██║     ██║     ███████║██║   ██║██║  ██║█████╗  
-██║     ██║     ██╔══██║██║   ██║██║  ██║██╔══╝  
-╚██████╗███████╗██║  ██║╚██████╔╝██████╔╝███████╗
- ╚═════╝╚══════╝╚═╝  ╚═╝ ╚═════╝ ╚═════╝ ╚══════╝
-
- ██████╗ ██████╗ ██████╗ ███████╗
-██╔════╝██╔═══██╗██╔══██╗██╔════╝
-██║     ██║   ██║██║  ██║█████╗  
-██║     ██║   ██║██║  ██║██╔══╝  
-╚██████╗╚██████╔╝██████╔╝███████╗
- ╚═════╝ ╚═════╝ ╚═════╝ ╚══════╝
-
-████████╗███████╗███╗   ███╗██████╗ ██╗      █████╗ ████████╗███████╗███████╗
-╚══██╔══╝██╔════╝████╗ ████║██╔══██╗██║     ██╔══██╗╚══██╔══╝██╔════╝██╔════╝
-   ██║   █████╗  ██╔████╔██║██████╔╝██║     ███████║   ██║   █████╗  ███████╗
-   ██║   ██╔══╝  ██║╚██╔╝██║██╔═══╝ ██║     ██╔══██║   ██║   ██╔══╝  ╚════██║
-   ██║   ███████╗██║ ╚═╝ ██║██║     ███████╗██║  ██║   ██║   ███████╗███████║
-   ╚═╝   ╚══════╝╚═╝     ╚═╝╚═╝     ╚══════╝╚═╝  ╚═╝   ╚═╝   ╚══════╝╚══════╝
-`) +
-chalk.yellow('\n     🚀 Setup Claude Code for any project language 🚀');
-
-console.log(banner);
+const pkg = require('../package.json');
+
+const title = 'Claude Code Templates';
+const subtitle = 'Your starting point for Claude Code projects';
+
+const colorGradient = ['#EA580C', '#F97316', '#FB923C', '#FDBA74', '#FED7AA', '#FFEBD6'];
+
+function colorizeTitle(text) {
+  const chars = text.split('');
+  const steps = colorGradient.length;
+  return chars
+    .map((char, i) => {
+      const color = colorGradient[i % steps];
+      return chalk.hex(color)(char);
+    })
+    .join('');
+}
+
+console.clear();
+console.log(chalk.hex('#F97316')('════════════════════════════════════════════════════════════════'));
+console.log('\n');
+console.log('       🔮 ' + colorizeTitle(title));
+console.log('\n');
+console.log('       ' + chalk.hex('#FDBA74')(subtitle));
+console.log('\n');
+console.log(chalk.hex('#F97316')('════════════════════════════════════════════════════════════════\n'));
+
+console.log(
+  chalk.hex('#D97706')('🚀 Setup Claude Code for any project language 🚀') +
+  chalk.gray(`\n                             v${pkg.version}\n\n`) +
+  chalk.blue('🌐 Templates: ') + chalk.underline('https://davila7.github.io/claude-code-templates/') + '\n' +
+  chalk.blue('📖 Documentation: ') + chalk.underline('https://davila7.github.io/claude-code-templates/docu/')
+);
 
 program
   .name('create-claude-config')

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "claude-code-templates",
-  "version": "1.12.0",
+  "version": "1.12.2",
   "description": "CLI tool to setup Claude Code configurations with framework-specific commands, automation hooks and MCP Servers for your projects",
   "main": "src/index.js",
   "bin": {

package/src/agents.js

@@ -0,0 +1,262 @@
+const fs = require('fs-extra');
+const path = require('path');
+const chalk = require('chalk');
+
+const TEMPLATES_DIR = path.join(__dirname, '..', 'templates');
+
+/**
+ * Get all available agents from the templates directory structure
+ * @returns {Array} Array of agent objects with name, description, and color
+ */
+function getAvailableAgents() {
+  const agents = [];
+  
+  try {
+    // Scan all language directories
+    const languageDirs = fs.readdirSync(TEMPLATES_DIR)
+      .filter(dir => {
+        const dirPath = path.join(TEMPLATES_DIR, dir);
+        return fs.statSync(dirPath).isDirectory() && dir !== 'common';
+      });
+    
+    for (const langDir of languageDirs) {
+      const frameworksPath = path.join(TEMPLATES_DIR, langDir, 'examples');
+      
+      if (fs.existsSync(frameworksPath)) {
+        const frameworks = fs.readdirSync(frameworksPath)
+          .filter(dir => {
+            const dirPath = path.join(frameworksPath, dir);
+            return fs.statSync(dirPath).isDirectory();
+          });
+        
+        for (const framework of frameworks) {
+          const agentsPath = path.join(frameworksPath, framework, 'agents');
+          
+          if (fs.existsSync(agentsPath)) {
+            const agentFiles = fs.readdirSync(agentsPath)
+              .filter(file => file.endsWith('.md'));
+            
+            for (const file of agentFiles) {
+              const filePath = path.join(agentsPath, file);
+              const content = fs.readFileSync(filePath, 'utf8');
+              const agent = parseAgentFile(content, file);
+              
+              if (agent) {
+                agent.language = langDir;
+                agent.framework = framework;
+                agent.filePath = filePath;
+                agents.push(agent);
+              }
+            }
+          }
+        }
+      }
+    }
+    
+    return agents;
+  } catch (error) {
+    console.log(chalk.yellow('⚠️  No agents templates found'));
+    return [];
+  }
+}
+
+/**
+ * Parse agent markdown file to extract frontmatter
+ * @param {string} content - File content
+ * @param {string} filename - File name
+ * @returns {Object|null} Agent object or null if parsing fails
+ */
+function parseAgentFile(content, filename) {
+  try {
+    const frontmatterMatch = content.match(/^---\n([\s\S]*?)\n---/);
+    if (!frontmatterMatch) {
+      return null;
+    }
+
+    const frontmatter = frontmatterMatch[1];
+    const lines = frontmatter.split('\n');
+    const agent = { filename };
+
+    for (const line of lines) {
+      const [key, ...valueParts] = line.split(':');
+      if (key && valueParts.length > 0) {
+        const value = valueParts.join(':').trim();
+        agent[key.trim()] = value;
+      }
+    }
+
+    // Extract description without examples for display
+    if (agent.description) {
+      const shortDesc = agent.description.split('Examples:')[0].trim();
+      agent.shortDescription = shortDesc;
+    }
+
+    return agent;
+  } catch (error) {
+    console.log(chalk.yellow(`⚠️  Failed to parse agent file: ${filename}`));
+    return null;
+  }
+}
+
+/**
+ * Get agents that are relevant for a specific language/framework
+ * @param {string} language - Programming language
+ * @param {string} framework - Framework (optional)
+ * @returns {Array} Array of relevant agents
+ */
+function getAgentsForLanguageAndFramework(language, framework) {
+  const allAgents = getAvailableAgents();
+  
+  // Filter agents based on language and framework
+  return allAgents.filter(agent => {
+    // First check exact language match
+    if (agent.language !== language) {
+      return false;
+    }
+    
+    // If framework is specified and not 'none', check framework match
+    if (framework && framework !== 'none') {
+      // Extract framework name from framework path (e.g., 'react-app' -> 'react')
+      const frameworkName = framework.includes('-') ? framework.split('-')[0] : framework;
+      const agentFrameworkName = agent.framework.includes('-') ? agent.framework.split('-')[0] : agent.framework;
+      
+      return agentFrameworkName.toLowerCase().includes(frameworkName.toLowerCase());
+    }
+    
+    // If no specific framework, return all agents for this language
+    return true;
+  });
+}
+
+/**
+ * Install selected agents to the project's .claude/agents directory
+ * @param {Array} selectedAgents - Array of agent names to install
+ * @param {string} projectPath - Project directory path
+ * @returns {Promise<boolean>} Success status
+ */
+async function installAgents(selectedAgents, projectPath = process.cwd()) {
+  try {
+    const claudeDir = path.join(projectPath, '.claude');
+    const agentsDir = path.join(claudeDir, 'agents');
+    
+    // Create .claude/agents directory if it doesn't exist
+    await fs.ensureDir(agentsDir);
+    
+    let installedCount = 0;
+    const allAgents = getAvailableAgents();
+    
+    for (const agentName of selectedAgents) {
+      // Find the agent by name in the available agents
+      const agent = allAgents.find(a => a.name === agentName);
+      
+      if (agent && agent.filePath) {
+        const targetFile = path.join(agentsDir, `${agentName}.md`);
+        
+        if (await fs.pathExists(agent.filePath)) {
+          await fs.copy(agent.filePath, targetFile);
+          installedCount++;
+          console.log(chalk.green(`✓ Installed agent: ${agentName} (${agent.language}/${agent.framework})`));
+        } else {
+          console.log(chalk.yellow(`⚠️  Agent source file not found: ${agent.filePath}`));
+        }
+      } else {
+        console.log(chalk.yellow(`⚠️  Agent not found: ${agentName}`));
+      }
+    }
+    
+    if (installedCount > 0) {
+      console.log(chalk.green(`\n🎉 Successfully installed ${installedCount} agent(s) to .claude/agents/`));
+      console.log(chalk.blue('   You can now use these agents in your Claude Code conversations!'));
+      return true;
+    } else {
+      console.log(chalk.yellow('⚠️  No agents were installed'));
+      return false;
+    }
+    
+  } catch (error) {
+    console.error(chalk.red('❌ Failed to install agents:'), error.message);
+    return false;
+  }
+}
+
+/**
+ * Check if project already has agents installed
+ * @param {string} projectPath - Project directory path
+ * @returns {Promise<Array>} Array of installed agent names
+ */
+async function getInstalledAgents(projectPath = process.cwd()) {
+  try {
+    const agentsDir = path.join(projectPath, '.claude', 'agents');
+    
+    if (!(await fs.pathExists(agentsDir))) {
+      return [];
+    }
+    
+    const agentFiles = await fs.readdir(agentsDir);
+    return agentFiles
+      .filter(file => file.endsWith('.md'))
+      .map(file => path.basename(file, '.md'));
+      
+  } catch (error) {
+    return [];
+  }
+}
+
+/**
+ * Format agent choices for inquirer prompt
+ * @param {Array} agents - Array of agent objects
+ * @param {Array} installedAgents - Array of already installed agent names
+ * @returns {Array} Formatted choices for inquirer
+ */
+function formatAgentChoices(agents, installedAgents = []) {
+  return agents.map(agent => {
+    const isInstalled = installedAgents.includes(agent.name);
+    const colorFn = getColorFunction(agent.color);
+    
+    const name = isInstalled 
+      ? `${colorFn(agent.name)} ${chalk.dim('(already installed)')}`
+      : colorFn(agent.name);
+    
+    const description = agent.shortDescription || agent.description || 'No description available';
+    // Truncate description if too long
+    const truncatedDesc = description.length > 80 
+      ? description.substring(0, 80) + '...' 
+      : description;
+    
+    return {
+      name: `${name}\n  ${chalk.dim(truncatedDesc)}`,
+      value: agent.name,
+      short: agent.name,
+      disabled: isInstalled ? 'Already installed' : false
+    };
+  });
+}
+
+/**
+ * Get chalk color function based on color name
+ * @param {string} colorName - Color name
+ * @returns {Function} Chalk color function
+ */
+function getColorFunction(colorName) {
+  const colorMap = {
+    red: chalk.red,
+    green: chalk.green,
+    yellow: chalk.yellow,
+    blue: chalk.blue,
+    magenta: chalk.magenta,
+    cyan: chalk.cyan,
+    white: chalk.white,
+    gray: chalk.gray,
+    grey: chalk.gray
+  };
+  
+  return colorMap[colorName] || chalk.white;
+}
+
+module.exports = {
+  getAvailableAgents,
+  getAgentsForLanguageAndFramework,
+  installAgents,
+  getInstalledAgents,
+  formatAgentChoices
+};

package/src/command-scanner.js

@@ -25,14 +25,14 @@ function getAvailableCommands(language) {
   }
   
   // Scan framework-specific commands in examples
-  const examplesDir = path.join(languageDir, 'examples');
-  if (fs.existsSync(examplesDir)) {
-    const frameworkDirs = fs.readdirSync(examplesDir).filter(dir => {
-      return fs.statSync(path.join(examplesDir, dir)).isDirectory();
+  const frameworksDir = path.join(languageDir, 'examples');
+  if (fs.existsSync(frameworksDir)) {
+    const frameworkDirs = fs.readdirSync(frameworksDir).filter(dir => {
+      return fs.statSync(path.join(frameworksDir, dir)).isDirectory();
     });
     
     frameworkDirs.forEach(framework => {
-      const frameworkCommandsDir = path.join(examplesDir, framework, '.claude', 'commands');
+      const frameworkCommandsDir = path.join(frameworksDir, framework, '.claude', 'commands');
       if (fs.existsSync(frameworkCommandsDir)) {
         const frameworkCommands = scanCommandsInDirectory(frameworkCommandsDir, framework);
         commands.push(...frameworkCommands);

package/src/index.js

@@ -8,6 +8,7 @@ const { getTemplateConfig, TEMPLATES_CONFIG } = require('./templates');
 const { createPrompts, interactivePrompts } = require('./prompts');
 const { copyTemplateFiles, runPostInstallationValidation } = require('./file-operations');
 const { getHooksForLanguage, getMCPsForLanguage } = require('./hook-scanner');
+const { installAgents } = require('./agents');
 const { runCommandStats } = require('./command-stats');
 const { runHookStats } = require('./hook-stats');
 const { runMCPStats } = require('./mcp-stats');
@@ -15,7 +16,6 @@ const { runAnalytics } = require('./analytics');
 const { runHealthCheck } = require('./health-check');
 
 async function showMainMenu() {
-  console.log(chalk.blue('🚀 Welcome to Claude Code Templates!'));
   console.log('');
   
   const initialChoice = await inquirer.prompt([{
@@ -33,15 +33,15 @@ async function showMainMenu() {
         value: 'chats',
         short: 'Chats Dashboard'
       },
-      {
-        name: '🔍 Health Check - Verify your Claude Code setup and configuration',
-        value: 'health',
-        short: 'Health Check'
-      },
       {
         name: '⚙️ Project Setup - Configure Claude Code for your project',
         value: 'setup',
         short: 'Project Setup'
+      },
+      {
+        name: '🔍 Health Check - Verify your Claude Code setup and configuration',
+        value: 'health',
+        short: 'Health Check'
       }
     ],
     default: 'analytics'
@@ -193,6 +193,12 @@ async function createClaudeConfig(options = {}) {
     templateConfig.language = config.language; // Ensure language is available for MCP filtering
   }
   
+  // Install selected agents
+  if (config.agents && config.agents.length > 0) {
+    console.log(chalk.blue('🤖 Installing Claude Code agents...'));
+    await installAgents(config.agents, targetDir);
+  }
+  
   if (options.dryRun) {
     console.log(chalk.yellow('🔍 Dry run - showing what would be copied:'));
     templateConfig.files.forEach(file => {
@@ -223,6 +229,7 @@ async function createClaudeConfig(options = {}) {
   console.log(chalk.white('  3. Start using Claude Code with: claude'));
   console.log('');
   console.log(chalk.blue('🌐 View all available templates at: https://davila7.github.io/claude-code-templates/'));
+  console.log(chalk.blue('📖 Read the complete documentation at: https://davila7.github.io/claude-code-templates/docu/'));
   
   if (config.language !== 'common') {
     console.log(chalk.yellow(`💡 Language-specific features for ${config.language} have been configured`));

package/src/prompts.js

@@ -6,6 +6,7 @@ const inquirer = require('inquirer');
 const { getAvailableLanguages, getFrameworksForLanguage } = require('./templates');
 const { getCommandsForLanguageAndFramework } = require('./command-scanner');
 const { getHooksForLanguage, getMCPsForLanguage } = require('./hook-scanner');
+const { getAgentsForLanguageAndFramework, getInstalledAgents, formatAgentChoices } = require('./agents');
 
 async function interactivePrompts(projectInfo, options = {}) {
   const state = {
@@ -17,7 +18,7 @@ async function interactivePrompts(projectInfo, options = {}) {
   // Build steps array based on options
   if (!options.language) state.steps.push('language');
   if (!options.framework) state.steps.push('framework');
-  state.steps.push('commands', 'hooks', 'mcps', 'analytics', 'confirm');
+  state.steps.push('commands', 'hooks', 'mcps', 'agents', 'analytics', 'confirm');
 
   while (state.currentStep < state.steps.length) {
     const stepName = state.steps[state.currentStep];
@@ -41,7 +42,13 @@ async function interactivePrompts(projectInfo, options = {}) {
 }
 
 async function showStep(stepName, currentAnswers, projectInfo, options) {
-  const stepConfig = getStepConfig(stepName, currentAnswers, projectInfo, options);
+  // Handle async data fetching for agents step
+  let additionalData = {};
+  if (stepName === 'agents') {
+    additionalData.installedAgents = await getInstalledAgents();
+  }
+  
+  const stepConfig = getStepConfig(stepName, currentAnswers, projectInfo, options, additionalData);
   
   if (!stepConfig) {
     return { action: 'next', value: null };
@@ -69,7 +76,7 @@ async function showStep(stepName, currentAnswers, projectInfo, options) {
   return { action: 'next', value };
 }
 
-function getStepConfig(stepName, currentAnswers, projectInfo, options) {
+function getStepConfig(stepName, currentAnswers, projectInfo, options, additionalData = {}) {
   switch (stepName) {
     case 'language':
       return {
@@ -188,6 +195,32 @@ function getStepConfig(stepName, currentAnswers, projectInfo, options) {
         pageSize: 15
       };
 
+    case 'agents':
+      const agentLanguage = currentAnswers.language || options.language;
+      const agentFramework = currentAnswers.framework || options.framework;
+      
+      if (!agentLanguage) {
+        return null; // Skip if no language selected
+      }
+      
+      const availableAgents = getAgentsForLanguageAndFramework(agentLanguage, agentFramework);
+      
+      if (availableAgents.length === 0) {
+        return null; // Skip if no agents available
+      }
+      
+      const installedAgents = additionalData.installedAgents || [];
+      const agentChoices = formatAgentChoices(availableAgents, installedAgents);
+      
+      return {
+        type: 'checkbox',
+        name: 'agents',
+        message: 'Select Claude Code agents to install (use space to select):',
+        choices: agentChoices,
+        prefix: chalk.magenta('🤖'),
+        pageSize: 10
+      };
+
     case 'analytics':
       return {
         type: 'confirm',
@@ -203,6 +236,7 @@ function getStepConfig(stepName, currentAnswers, projectInfo, options) {
       const commandCount = currentAnswers.commands ? currentAnswers.commands.length : 0;
       const hookCount = currentAnswers.hooks ? currentAnswers.hooks.length : 0;
       const mcpCount = currentAnswers.mcps ? currentAnswers.mcps.length : 0;
+      const agentCount = currentAnswers.agents ? currentAnswers.agents.length : 0;
       
       let message = `Setup Claude Code for ${chalk.cyan(confirmLanguage)}`;
       if (confirmFramework !== 'none') {
@@ -217,6 +251,9 @@ function getStepConfig(stepName, currentAnswers, projectInfo, options) {
       if (mcpCount > 0) {
         message += ` (${chalk.blue(mcpCount)} MCP)`;
       }
+      if (agentCount > 0) {
+        message += ` (${chalk.magenta(agentCount)} agents)`;
+      }
       message += '?';
       
       return {

package/src/templates.js

@@ -6,10 +6,7 @@ const TEMPLATES_CONFIG = {
     name: 'Common (Language-agnostic)',
     description: 'Universal configuration for any project',
     files: [
-      { source: 'common/CLAUDE.md', destination: 'CLAUDE.md' },
-      { source: 'common/.claude', destination: '.claude' },
-      { source: 'common/.claude/settings.json', destination: '.claude/settings.json' },
-      { source: 'common/.mcp.json', destination: '.mcp.json' }
+      { source: 'common/CLAUDE.md', destination: 'CLAUDE.md' }
     ]
   },
   'javascript-typescript': {