claude-code-templates 1.22.1 → 1.24.0

package/README.md

@@ -38,6 +38,7 @@ npx claude-code-templates@latest --health-check
 | **Commands** | Custom slash commands for development tasks | `/generate-tests`, `/check-file`, `/optimize-bundle` |
 | **Agents** | AI specialists for specific domains | API security audit, React performance, database optimization |
 | **MCPs** | External service integrations | GitHub, databases, development tools |
+| **Skills** | Modular capabilities with progressive disclosure | PDF processing, algorithmic art, MCP builder |
 | **Analytics** | Real-time monitoring dashboard | Live session tracking, usage statistics, exports |
 
 ## 🛠️ Supported Technologies
@@ -95,6 +96,61 @@ npx claude-code-templates@latest --remove-agent customer-support
 
 The agents use the Claude Code SDK internally to provide specialized AI assistance with domain-specific knowledge and best practices.
 
+## 🎨 Skills (Anthropic Format)
+
+Install modular capabilities that Claude loads dynamically using Anthropic's progressive disclosure pattern:
+
+```bash
+# Install individual skills
+npx claude-code-templates@latest --skill pdf-processing-pro
+npx claude-code-templates@latest --skill algorithmic-art
+npx claude-code-templates@latest --skill mcp-builder
+
+# Install multiple skills
+npx claude-code-templates@latest --skill pdf-anthropic,docx,xlsx,pptx
+```
+
+### Featured Skills
+
+#### 🎨 Creative & Design
+- **algorithmic-art** - Create generative art using p5.js with seeded randomness
+- **canvas-design** - Design beautiful visual art in .png and .pdf formats
+- **slack-gif-creator** - Create animated GIFs optimized for Slack
+
+#### 💻 Development & Technical
+- **mcp-builder** - Guide for creating high-quality MCP servers
+- **artifacts-builder** - Build complex HTML artifacts with React and Tailwind
+- **webapp-testing** - Test local web applications using Playwright
+- **skill-creator** - Guide for creating effective skills
+
+#### 📄 Document Processing
+- **pdf-processing-pro** - Production-ready PDF toolkit (forms, tables, OCR)
+- **pdf-anthropic** - Anthropic's comprehensive PDF manipulation toolkit
+- **docx** - Create, edit, and analyze Word documents
+- **xlsx** - Create, edit, and analyze Excel spreadsheets
+- **pptx** - Create, edit, and analyze PowerPoint presentations
+
+#### 🏢 Enterprise & Communication
+- **brand-guidelines** - Apply Anthropic's official brand guidelines
+- **internal-comms** - Write internal communications (reports, newsletters, FAQs)
+- **theme-factory** - Style artifacts with professional themes
+
+### Skills Architecture
+
+Skills follow Anthropic's progressive disclosure pattern:
+- **Metadata** - Always loaded (name, description)
+- **Instructions** - Loaded when skill is triggered
+- **Resources** - Reference files loaded only when needed
+- **Scripts** - Execute without loading code into context
+
+### Attribution
+
+Skills from [anthropics/skills](https://github.com/anthropics/skills):
+- **Open Source** (Apache 2.0): algorithmic-art, mcp-builder, skill-creator, artifacts-builder, and more
+- **Source-Available** (Reference): docx, pdf-anthropic, pptx, xlsx
+
+See [ANTHROPIC_ATTRIBUTION.md](cli-tool/components/skills/ANTHROPIC_ATTRIBUTION.md) for complete license information.
+
 ## 📖 Documentation
 
 **[📚 Complete Documentation](https://docs.aitmpl.com/)** - Comprehensive guides, examples, and API reference

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "claude-code-templates",
-  "version": "1.22.1",
+  "version": "1.24.0",
   "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/index.js

@@ -1395,8 +1395,12 @@ async function installIndividualSkill(skillName, targetDir, options) {
   console.log(chalk.blue(`💡 Installing skill: ${skillName}`));
 
   try {
+    // Skills can be in format: "skill-name" or "category/skill-name"
+    // Extract the actual skill name (last part of the path)
+    const skillBaseName = skillName.includes('/') ? skillName.split('/').pop() : skillName;
+
     // Skills always use SKILL.md as the main file (Anthropic standard)
-    // Format: skills/skill-name/SKILL.md
+    // Format: skills/category/skill-name/SKILL.md
     const githubUrl = `https://raw.githubusercontent.com/davila7/claude-code-templates/main/cli-tool/components/skills/${skillName}/SKILL.md`;
 
     console.log(chalk.gray(`📥 Downloading from GitHub (main branch)...`));
@@ -1405,7 +1409,8 @@ async function installIndividualSkill(skillName, targetDir, options) {
     if (!response.ok) {
       if (response.status === 404) {
         console.log(chalk.red(`❌ Skill "${skillName}" not found`));
-        console.log(chalk.yellow('Available skills: pdf-processing, excel-analysis, git-commit-helper, email-composer'));
+        console.log(chalk.yellow('💡 Tip: Use format "category/skill-name" (e.g., creative-design/algorithmic-art)'));
+        console.log(chalk.yellow('Available categories: creative-design, development, document-processing, enterprise-communication'));
         return false;
       }
       throw new Error(`HTTP ${response.status}: ${response.statusText}`);
@@ -1413,16 +1418,15 @@ async function installIndividualSkill(skillName, targetDir, options) {
 
     const skillContent = await response.text();
 
-    // Check if there are additional files to download (e.g., referenced .md files)
+    // Check if there are additional files to download (e.g., referenced .md files, scripts, reference)
     const additionalFiles = {};
 
-    // Look for references to additional files like [FORMS.md](FORMS.md)
-    const referencePattern = /\[([A-Z_]+\.md)\]\(\1\)/g;
+    // 1. Look for references to additional files like [FORMS.md](FORMS.md) or [reference](./reference/)
+    const referencePattern = /\[([A-Z_]+\.md)\]\(\1\)|\[.*?\]\(\.\/([a-z_]+)\/\)/g;
     let match;
-    const skillBaseName = skillName;
 
     while ((match = referencePattern.exec(skillContent)) !== null) {
-      const referencedFile = match[1];
+      const referencedFile = match[1] || match[2];
       const referencedUrl = githubUrl.replace('SKILL.md', referencedFile);
 
       try {
@@ -1442,6 +1446,64 @@ async function installIndividualSkill(skillName, targetDir, options) {
       }
     }
 
+    // 2. Try to download common directories (scripts/, reference/) from GitHub API
+    const githubApiUrl = `https://api.github.com/repos/davila7/claude-code-templates/contents/cli-tool/components/skills/${skillName}`;
+
+    try {
+      const dirResponse = await fetch(githubApiUrl, {
+        headers: {
+          'Accept': 'application/vnd.github.v3+json',
+          'User-Agent': 'claude-code-templates'
+        }
+      });
+
+      if (dirResponse.ok) {
+        const dirContents = await dirResponse.json();
+
+        // Find directories (scripts, reference, templates)
+        for (const item of dirContents) {
+          if (item.type === 'dir' && ['scripts', 'reference', 'templates'].includes(item.name)) {
+            console.log(chalk.gray(`📂 Found directory: ${item.name}/`));
+
+            // Fetch directory contents recursively
+            const subdirResponse = await fetch(item.url, {
+              headers: {
+                'Accept': 'application/vnd.github.v3+json',
+                'User-Agent': 'claude-code-templates'
+              }
+            });
+
+            if (subdirResponse.ok) {
+              const subdirContents = await subdirResponse.json();
+
+              for (const file of subdirContents) {
+                if (file.type === 'file') {
+                  try {
+                    const fileResponse = await fetch(file.download_url);
+                    if (fileResponse.ok) {
+                      const fileContent = await fileResponse.text();
+                      const isExecutable = file.name.endsWith('.py') || file.name.endsWith('.sh');
+
+                      additionalFiles[`.claude/skills/${skillBaseName}/${item.name}/${file.name}`] = {
+                        content: fileContent,
+                        executable: isExecutable
+                      };
+                      console.log(chalk.green(`✓ Downloaded: ${item.name}/${file.name}`));
+                    }
+                  } catch (err) {
+                    console.log(chalk.gray(`  (Could not download ${item.name}/${file.name})`));
+                  }
+                }
+              }
+            }
+          }
+        }
+      }
+    } catch (error) {
+      // GitHub API access optional, continue if not available
+      console.log(chalk.gray(`  (Could not access GitHub API for directory listing)`));
+    }
+
     // Create .claude/skills/skill-name directory (Anthropic standard structure)
     const skillsDir = path.join(targetDir, '.claude', 'skills');
     const skillSubDir = path.join(skillsDir, skillBaseName);