Add anti-pattern detection CLI, browser visualizer, gallery page, and build DRY refactor

- Anti-pattern detector script (source/skills/critique/scripts/detect-antipatterns.mjs): CLI tool that scans files/dirs for UI anti-patterns via regex. Detects side-tab accent borders and border-accent-on-rounded patterns across Tailwind, CSS, JSX. Context-aware: skips safe elements (blockquotes, nav, inputs, code), neutral colors, and adjusts thresholds based on border-radius co-occurrence. - Browser visualizer (public/js/detect-antipatterns-browser.js): Drop-in script that highlights anti-patterns directly in the browser with labeled overlays. Two modes: "static" (regex, matches CLI) and "computed" (getComputedStyle, catches CSS cascade). Scans both inline styles and <style> blocks. - Gallery of Shame (public/gallery.html): Standalone page showcasing 11 AI anti-pattern examples with thumbnails and links. Anti-pattern example pages updated from 1080x1080 Twitter format to responsive layouts, labels removed, screenshots retaken at 16:10. - Critique skill updated to run detector before manual review. - Build system: skills now support scripts/ directories alongside reference/. All 8 provider transformers refactored to use shared.js (DRY). - 58 new tests covering detection logic, fixtures, CLI integration. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-09-14 07:06:45 +03:00 · 2026-03-17 10:54:06 -07:00
parent 2bf7fce2d6
commit f9bfe18d26
46 changed files with 2600 additions and 4658 deletions
@@ -82,6 +82,7 @@ async function buildStaticSite() {
  const entrypoints = [
    path.join(ROOT_DIR, 'public', 'index.html'),
    path.join(ROOT_DIR, 'public', 'cheatsheet.html'),
+    path.join(ROOT_DIR, 'public', 'gallery.html'),
  ];
  const outdir = path.join(ROOT_DIR, 'build');

@@ -383,7 +384,6 @@ async function build() {

  // Remove existing and copy fresh
  if (fs.existsSync(skillsDest)) fs.rmSync(skillsDest, { recursive: true });
-
  copyDirSync(skillsSrc, skillsDest);

  console.log(`📋 Synced to .claude/: skills`);
@@ -1,69 +1,24 @@
-import path from 'path';
-import { cleanDir, ensureDir, writeFile, generateYamlFrontmatter, replacePlaceholders, prefixSkillReferences } from '../utils.js';
+import { transformProvider } from './shared.js';

 /**
 * Agents Transformer (VS Code Copilot + Antigravity)
- *
- * All skills output to .agents/skills/{name}/SKILL.md
- * Frontmatter: name, description, user-invokable (if true), argument-hint (from args)
- *
- * @param {Array} skills - All skills (including user-invokable ones)
- * @param {string} distDir - Distribution output directory
- * @param {Object} patterns - Design patterns data (unused)
- * @param {Object} options - Optional settings
+ * Output: .agents/skills/{name}/SKILL.md
 */
 export function transformAgents(skills, distDir, patterns = null, options = {}) {
-  const { prefix = '', outputSuffix = '' } = options;
-  const agentsDir = path.join(distDir, `agents${outputSuffix}`);
-  const skillsDir = path.join(agentsDir, '.agents/skills');
-
-  cleanDir(agentsDir);
-  ensureDir(skillsDir);
-
-  const allSkillNames = skills.map(s => s.name);
-  const commandNames = skills.filter(s => s.userInvokable).map(s => `${prefix}${s.name}`);
-  let refCount = 0;
-  for (const skill of skills) {
-    const skillName = `${prefix}${skill.name}`;
-    const skillDir = path.join(skillsDir, skillName);
-
-    const frontmatterObj = {
-      name: skillName,
-      description: skill.description,
-    };
-
-    if (skill.userInvokable) frontmatterObj['user-invokable'] = true;
-
-    // Build argument-hint from args array for user-invokable skills
-    if (skill.userInvokable && skill.args && skill.args.length > 0) {
-      const hints = skill.args.map(arg => {
-        return arg.required ? `<${arg.name}>` : `[${arg.name.toUpperCase()}=<value>]`;
-      });
-      frontmatterObj['argument-hint'] = hints.join(' ');
-    }
-
-    const frontmatter = generateYamlFrontmatter(frontmatterObj);
-    let skillBody = replacePlaceholders(skill.body, 'agents', commandNames);
-    if (prefix) skillBody = prefixSkillReferences(skillBody, prefix, allSkillNames);
-    const content = `${frontmatter}\n\n${skillBody}`;
-    const outputPath = path.join(skillDir, 'SKILL.md');
-    writeFile(outputPath, content);
-
-    // Copy reference files if they exist
-    if (skill.references && skill.references.length > 0) {
-      const refDir = path.join(skillDir, 'reference');
-      ensureDir(refDir);
-      for (const ref of skill.references) {
-        const refOutputPath = path.join(refDir, `${ref.name}.md`);
-        const refContent = replacePlaceholders(ref.content, 'agents');
-        writeFile(refOutputPath, refContent);
-        refCount++;
+  transformProvider({
+    provider: 'agents',
+    displayName: 'Agents',
+    configDir: '.agents',
+    buildFrontmatter: (skill, skillName) => {
+      const obj = { name: skillName, description: skill.description };
+      if (skill.userInvokable) obj['user-invokable'] = true;
+      if (skill.userInvokable && skill.args && skill.args.length > 0) {
+        const hints = skill.args.map(arg =>
+          arg.required ? `<${arg.name}>` : `[${arg.name.toUpperCase()}=<value>]`
+        );
+        obj['argument-hint'] = hints.join(' ');
      }
-    }
-  }
-
-  const userInvokableCount = skills.filter(s => s.userInvokable).length;
-  const refInfo = refCount > 0 ? ` (${refCount} reference files)` : '';
-  const prefixInfo = prefix ? ` [${prefix}prefixed]` : '';
-  console.log(`✓ Agents${prefixInfo}: ${skills.length} skills (${userInvokableCount} user-invokable)${refInfo}`);
+      return obj;
+    },
+  }, skills, distDir, options);
 }
@@ -1,68 +1,23 @@
-import path from 'path';
-import { cleanDir, ensureDir, writeFile, generateYamlFrontmatter, replacePlaceholders, prefixSkillReferences } from '../utils.js';
+import { transformProvider } from './shared.js';

 /**
- * Claude Code Transformer (Skills Only)
- *
- * All skills output to .claude/skills/{name}/SKILL.md
- * User-invokable skills get args support in frontmatter.
- *
- * @param {Array} skills - All skills (including user-invokable ones)
- * @param {string} distDir - Distribution output directory
- * @param {Object} patterns - Design patterns data (unused, kept for interface consistency)
- * @param {Object} options - Optional settings
- * @param {string} options.prefix - Prefix to add to user-invokable skill names (e.g., 'i-')
- * @param {string} options.outputSuffix - Suffix for output directory (e.g., '-prefixed')
+ * Claude Code Transformer
+ * Output: .claude/skills/{name}/SKILL.md
 */
 export function transformClaudeCode(skills, distDir, patterns = null, options = {}) {
-  const { prefix = '', outputSuffix = '' } = options;
-  const claudeDir = path.join(distDir, `claude-code${outputSuffix}`);
-  const skillsDir = path.join(claudeDir, '.claude/skills');
-
-  cleanDir(claudeDir);
-  ensureDir(skillsDir);
-
-  const allSkillNames = skills.map(s => s.name);
-  const commandNames = skills.filter(s => s.userInvokable).map(s => `${prefix}${s.name}`);
-  let refCount = 0;
-  for (const skill of skills) {
-    const skillName = `${prefix}${skill.name}`;
-    const skillDir = path.join(skillsDir, skillName);
-
-    const frontmatterObj = {
-      name: skillName,
-      description: skill.description,
-    };
-
-    if (skill.userInvokable) frontmatterObj['user-invokable'] = true;
-    if (skill.args && skill.args.length > 0) frontmatterObj.args = skill.args;
-    if (skill.license) frontmatterObj.license = skill.license;
-    if (skill.compatibility) frontmatterObj.compatibility = skill.compatibility;
-    if (skill.metadata) frontmatterObj.metadata = skill.metadata;
-    if (skill.allowedTools) frontmatterObj['allowed-tools'] = skill.allowedTools;
-
-    const frontmatter = generateYamlFrontmatter(frontmatterObj);
-    let skillBody = replacePlaceholders(skill.body, 'claude-code', commandNames);
-    if (prefix) skillBody = prefixSkillReferences(skillBody, prefix, allSkillNames);
-    const content = `${frontmatter}\n\n${skillBody}`;
-    const outputPath = path.join(skillDir, 'SKILL.md');
-    writeFile(outputPath, content);
-
-    // Copy reference files if they exist
-    if (skill.references && skill.references.length > 0) {
-      const refDir = path.join(skillDir, 'reference');
-      ensureDir(refDir);
-      for (const ref of skill.references) {
-        const refOutputPath = path.join(refDir, `${ref.name}.md`);
-        const refContent = replacePlaceholders(ref.content, 'claude-code');
-        writeFile(refOutputPath, refContent);
-        refCount++;
-      }
-    }
-  }
-
-  const userInvokableCount = skills.filter(s => s.userInvokable).length;
-  const refInfo = refCount > 0 ? ` (${refCount} reference files)` : '';
-  const prefixInfo = prefix ? ` [${prefix}prefixed]` : '';
-  console.log(`✓ Claude Code${prefixInfo}: ${skills.length} skills (${userInvokableCount} user-invokable)${refInfo}`);
+  transformProvider({
+    provider: 'claude-code',
+    displayName: 'Claude Code',
+    configDir: '.claude',
+    buildFrontmatter: (skill, skillName) => {
+      const obj = { name: skillName, description: skill.description };
+      if (skill.userInvokable) obj['user-invokable'] = true;
+      if (skill.args && skill.args.length > 0) obj.args = skill.args;
+      if (skill.license) obj.license = skill.license;
+      if (skill.compatibility) obj.compatibility = skill.compatibility;
+      if (skill.metadata) obj.metadata = skill.metadata;
+      if (skill.allowedTools) obj['allowed-tools'] = skill.allowedTools;
+      return obj;
+    },
+  }, skills, distDir, options);
 }
@@ -1,79 +1,31 @@
-import path from 'path';
-import { cleanDir, ensureDir, writeFile, generateYamlFrontmatter, replacePlaceholders, prefixSkillReferences } from '../utils.js';
+import { transformProvider } from './shared.js';

 /**
- * Codex Transformer (Skills Only)
- *
- * All skills output to .codex/skills/{name}/SKILL.md
- * Frontmatter: name, description, argument-hint (from args for user-invokable)
- * For user-invokable skills: {{argname}} becomes $ARGNAME in body
- *
- * @param {Array} skills - All skills (including user-invokable ones)
- * @param {string} distDir - Distribution output directory
- * @param {Object} patterns - Design patterns data (unused)
- * @param {Object} options - Optional settings
- * @param {string} options.prefix - Prefix to add to user-invokable skill names (e.g., 'i-')
- * @param {string} options.outputSuffix - Suffix for output directory (e.g., '-prefixed')
+ * Codex Transformer
+ * Output: .codex/skills/{name}/SKILL.md
+ * User-invokable: {{argname}} becomes $ARGNAME, argument-hint in frontmatter
 */
 export function transformCodex(skills, distDir, patterns = null, options = {}) {
-  const { prefix = '', outputSuffix = '' } = options;
-  const codexDir = path.join(distDir, `codex${outputSuffix}`);
-  const skillsDir = path.join(codexDir, '.codex/skills');
-
-  cleanDir(codexDir);
-  ensureDir(skillsDir);
-
-  const allSkillNames = skills.map(s => s.name);
-  const commandNames = skills.filter(s => s.userInvokable).map(s => `${prefix}${s.name}`);
-  let refCount = 0;
-  for (const skill of skills) {
-    const skillName = `${prefix}${skill.name}`;
-    const skillDir = path.join(skillsDir, skillName);
-
-    const frontmatterObj = {
-      name: skillName,
-      description: skill.description,
-    };
-
-    // Build argument-hint from args array for user-invokable skills
-    if (skill.userInvokable && skill.args && skill.args.length > 0) {
-      const hints = skill.args.map(arg => {
-        return arg.required ? `<${arg.name}>` : `[${arg.name.toUpperCase()}=<value>]`;
-      });
-      frontmatterObj['argument-hint'] = hints.join(' ');
-    }
-    if (skill.license) frontmatterObj.license = skill.license;
-
-    const frontmatter = generateYamlFrontmatter(frontmatterObj);
-
-    let skillBody = replacePlaceholders(skill.body, 'codex', commandNames);
-    if (prefix) skillBody = prefixSkillReferences(skillBody, prefix, allSkillNames);
-    // For user-invokable skills, transform remaining {{argname}} to $ARGNAME
-    if (skill.userInvokable) {
-      skillBody = skillBody.replace(/\{\{([^}]+)\}\}/g, (match, argName) => {
-        return `$${argName.toUpperCase()}`;
-      });
-    }
-
-    const content = `${frontmatter}\n\n${skillBody}`;
-    const outputPath = path.join(skillDir, 'SKILL.md');
-    writeFile(outputPath, content);
-
-    // Copy reference files if they exist
-    if (skill.references && skill.references.length > 0) {
-      const refDir = path.join(skillDir, 'reference');
-      ensureDir(refDir);
-      for (const ref of skill.references) {
-        const refOutputPath = path.join(refDir, `${ref.name}.md`);
-        const refContent = replacePlaceholders(ref.content, 'codex');
-        writeFile(refOutputPath, refContent);
-        refCount++;
+  transformProvider({
+    provider: 'codex',
+    displayName: 'Codex',
+    configDir: '.codex',
+    buildFrontmatter: (skill, skillName) => {
+      const obj = { name: skillName, description: skill.description };
+      if (skill.userInvokable && skill.args && skill.args.length > 0) {
+        const hints = skill.args.map(arg =>
+          arg.required ? `<${arg.name}>` : `[${arg.name.toUpperCase()}=<value>]`
+        );
+        obj['argument-hint'] = hints.join(' ');
      }
-    }
-  }
-
-  const userInvokableCount = skills.filter(s => s.userInvokable).length;
-  const refInfo = refCount > 0 ? ` (${refCount} reference files)` : '';
-  const prefixInfo = prefix ? ` [${prefix}prefixed]` : '';
-  console.log(`✓ Codex${prefixInfo}: ${skills.length} skills (${userInvokableCount} user-invokable)${refInfo}`);
+      if (skill.license) obj.license = skill.license;
+      return obj;
+    },
+    transformBody: (body, skill) => {
+      if (skill.userInvokable) {
+        return body.replace(/\{\{([^}]+)\}\}/g, (_, argName) => `$${argName.toUpperCase()}`);
+      }
+      return body;
+    },
+  }, skills, distDir, options);
 }
@@ -1,62 +1,18 @@
-import path from 'path';
-import { cleanDir, ensureDir, writeFile, generateYamlFrontmatter, replacePlaceholders, prefixSkillReferences } from '../utils.js';
+import { transformProvider } from './shared.js';

 /**
- * Cursor Transformer (Skills Only)
- *
- * All skills output to .cursor/skills/{name}/SKILL.md
- * Frontmatter: name, description, license
- *
- * @param {Array} skills - All skills (including user-invokable ones)
- * @param {string} distDir - Distribution output directory
- * @param {Object} patterns - Design patterns data (unused)
- * @param {Object} options - Optional settings
- * @param {string} options.prefix - Prefix to add to user-invokable skill names (e.g., 'i-')
- * @param {string} options.outputSuffix - Suffix for output directory (e.g., '-prefixed')
+ * Cursor Transformer
+ * Output: .cursor/skills/{name}/SKILL.md
 */
 export function transformCursor(skills, distDir, patterns = null, options = {}) {
-  const { prefix = '', outputSuffix = '' } = options;
-  const cursorDir = path.join(distDir, `cursor${outputSuffix}`);
-  const skillsDir = path.join(cursorDir, '.cursor/skills');
-
-  cleanDir(cursorDir);
-  ensureDir(skillsDir);
-
-  const allSkillNames = skills.map(s => s.name);
-  const commandNames = skills.filter(s => s.userInvokable).map(s => `${prefix}${s.name}`);
-  let refCount = 0;
-  for (const skill of skills) {
-    const skillName = `${prefix}${skill.name}`;
-    const skillDir = path.join(skillsDir, skillName);
-
-    const frontmatterObj = {
-      name: skillName,
-      description: skill.description,
-    };
-    if (skill.license) frontmatterObj.license = skill.license;
-
-    const frontmatter = generateYamlFrontmatter(frontmatterObj);
-    let skillBody = replacePlaceholders(skill.body, 'cursor', commandNames);
-    if (prefix) skillBody = prefixSkillReferences(skillBody, prefix, allSkillNames);
-    const content = `${frontmatter}\n\n${skillBody}`;
-    const outputPath = path.join(skillDir, 'SKILL.md');
-    writeFile(outputPath, content);
-
-    // Copy reference files if they exist
-    if (skill.references && skill.references.length > 0) {
-      const refDir = path.join(skillDir, 'reference');
-      ensureDir(refDir);
-      for (const ref of skill.references) {
-        const refOutputPath = path.join(refDir, `${ref.name}.md`);
-        const refContent = replacePlaceholders(ref.content, 'cursor');
-        writeFile(refOutputPath, refContent);
-        refCount++;
-      }
-    }
-  }
-
-  const userInvokableCount = skills.filter(s => s.userInvokable).length;
-  const refInfo = refCount > 0 ? ` (${refCount} reference files)` : '';
-  const prefixInfo = prefix ? ` [${prefix}prefixed]` : '';
-  console.log(`✓ Cursor${prefixInfo}: ${skills.length} skills (${userInvokableCount} user-invokable)${refInfo}`);
+  transformProvider({
+    provider: 'cursor',
+    displayName: 'Cursor',
+    configDir: '.cursor',
+    buildFrontmatter: (skill, skillName) => {
+      const obj = { name: skillName, description: skill.description };
+      if (skill.license) obj.license = skill.license;
+      return obj;
+    },
+  }, skills, distDir, options);
 }
@@ -1,66 +1,24 @@
-import path from 'path';
-import { cleanDir, ensureDir, writeFile, generateYamlFrontmatter, replacePlaceholders, prefixSkillReferences } from '../utils.js';
+import { transformProvider } from './shared.js';

 /**
- * Gemini Transformer (Skills Only)
- *
- * All skills output to .gemini/skills/{name}/SKILL.md
- * Frontmatter: name, description
- * For user-invokable skills: {{arg}} placeholders become {{args}} in body
- *
- * @param {Array} skills - All skills (including user-invokable ones)
- * @param {string} distDir - Distribution output directory
- * @param {Object} patterns - Design patterns data (unused)
- * @param {Object} options - Optional settings
- * @param {string} options.prefix - Prefix to add to user-invokable skill names (e.g., 'i-')
- * @param {string} options.outputSuffix - Suffix for output directory (e.g., '-prefixed')
+ * Gemini Transformer
+ * Output: .gemini/skills/{name}/SKILL.md
+ * User-invokable: {{arg}} placeholders become {{args}}
 */
 export function transformGemini(skills, distDir, patterns = null, options = {}) {
-  const { prefix = '', outputSuffix = '' } = options;
-  const geminiDir = path.join(distDir, `gemini${outputSuffix}`);
-  const skillsDir = path.join(geminiDir, '.gemini/skills');
-
-  cleanDir(geminiDir);
-  ensureDir(skillsDir);
-
-  const allSkillNames = skills.map(s => s.name);
-  const commandNames = skills.filter(s => s.userInvokable).map(s => `${prefix}${s.name}`);
-  let refCount = 0;
-  for (const skill of skills) {
-    const skillName = `${prefix}${skill.name}`;
-    const skillDir = path.join(skillsDir, skillName);
-
-    const frontmatter = generateYamlFrontmatter({
+  transformProvider({
+    provider: 'gemini',
+    displayName: 'Gemini',
+    configDir: '.gemini',
+    buildFrontmatter: (skill, skillName) => ({
      name: skillName,
      description: skill.description,
-    });
-
-    let skillBody = replacePlaceholders(skill.body, 'gemini', commandNames);
-    if (prefix) skillBody = prefixSkillReferences(skillBody, prefix, allSkillNames);
-    // For user-invokable skills, replace remaining {{arg}} placeholders with {{args}}
-    if (skill.userInvokable) {
-      skillBody = skillBody.replace(/\{\{[^}]+\}\}/g, '{{args}}');
-    }
-
-    const content = `${frontmatter}\n\n${skillBody}`;
-    const outputPath = path.join(skillDir, 'SKILL.md');
-    writeFile(outputPath, content);
-
-    // Copy reference files if they exist
-    if (skill.references && skill.references.length > 0) {
-      const refDir = path.join(skillDir, 'reference');
-      ensureDir(refDir);
-      for (const ref of skill.references) {
-        const refOutputPath = path.join(refDir, `${ref.name}.md`);
-        const refContent = replacePlaceholders(ref.content, 'gemini');
-        writeFile(refOutputPath, refContent);
-        refCount++;
+    }),
+    transformBody: (body, skill) => {
+      if (skill.userInvokable) {
+        return body.replace(/\{\{[^}]+\}\}/g, '{{args}}');
      }
-    }
-  }
-
-  const userInvokableCount = skills.filter(s => s.userInvokable).length;
-  const refInfo = refCount > 0 ? ` (${refCount} reference files)` : '';
-  const prefixInfo = prefix ? ` [${prefix}prefixed]` : '';
-  console.log(`✓ Gemini${prefixInfo}: ${skills.length} skills (${userInvokableCount} user-invokable)${refInfo}`);
+      return body;
+    },
+  }, skills, distDir, options);
 }
@@ -1,65 +1,20 @@
-import path from 'path';
-import { cleanDir, ensureDir, writeFile, generateYamlFrontmatter, replacePlaceholders, prefixSkillReferences } from '../utils.js';
+import { transformProvider } from './shared.js';

 /**
- * Kiro Transformer (Skills Only)
- *
- * All skills output to .kiro/skills/{name}/SKILL.md
- * Frontmatter: name, description, license, compatibility, metadata
- *
- * @param {Array} skills - All skills (including user-invokable ones)
- * @param {string} distDir - Distribution output directory
- * @param {Object} patterns - Design patterns data (unused)
- * @param {Object} options - Optional settings
- * @param {string} options.prefix - Prefix to add to skill names (e.g., 'i-')
- * @param {string} options.outputSuffix - Suffix for output directory (e.g., '-prefixed')
+ * Kiro Transformer
+ * Output: .kiro/skills/{name}/SKILL.md
 */
 export function transformKiro(skills, distDir, patterns = null, options = {}) {
-  const { prefix = '', outputSuffix = '' } = options;
-  const kiroDir = path.join(distDir, `kiro${outputSuffix}`);
-  const skillsDir = path.join(kiroDir, '.kiro/skills');
-
-  cleanDir(kiroDir);
-  ensureDir(skillsDir);
-
-  const allSkillNames = skills.map(s => s.name);
-  const commandNames = skills.filter(s => s.userInvokable).map(s => `${prefix}${s.name}`);
-  let refCount = 0;
-  for (const skill of skills) {
-    const skillName = `${prefix}${skill.name}`;
-    const skillDir = path.join(skillsDir, skillName);
-
-    const frontmatterObj = {
-      name: skillName,
-      description: skill.description,
-    };
-
-    if (skill.license) frontmatterObj.license = skill.license;
-    if (skill.compatibility) frontmatterObj.compatibility = skill.compatibility;
-    if (skill.metadata) frontmatterObj.metadata = skill.metadata;
-
-    const frontmatter = generateYamlFrontmatter(frontmatterObj);
-    let skillBody = replacePlaceholders(skill.body, 'kiro', commandNames);
-    if (prefix) skillBody = prefixSkillReferences(skillBody, prefix, allSkillNames);
-    const content = `${frontmatter}\n\n${skillBody}`;
-    const outputPath = path.join(skillDir, 'SKILL.md');
-    writeFile(outputPath, content);
-
-    // Copy reference files if they exist
-    if (skill.references && skill.references.length > 0) {
-      const refDir = path.join(skillDir, 'reference');
-      ensureDir(refDir);
-      for (const ref of skill.references) {
-        const refOutputPath = path.join(refDir, `${ref.name}.md`);
-        const refContent = replacePlaceholders(ref.content, 'kiro');
-        writeFile(refOutputPath, refContent);
-        refCount++;
-      }
-    }
-  }
-
-  const userInvokableCount = skills.filter(s => s.userInvokable).length;
-  const refInfo = refCount > 0 ? ` (${refCount} reference files)` : '';
-  const prefixInfo = prefix ? ` [${prefix}prefixed]` : '';
-  console.log(`✓ Kiro${prefixInfo}: ${skills.length} skills (${userInvokableCount} user-invokable)${refInfo}`);
+  transformProvider({
+    provider: 'kiro',
+    displayName: 'Kiro',
+    configDir: '.kiro',
+    buildFrontmatter: (skill, skillName) => {
+      const obj = { name: skillName, description: skill.description };
+      if (skill.license) obj.license = skill.license;
+      if (skill.compatibility) obj.compatibility = skill.compatibility;
+      if (skill.metadata) obj.metadata = skill.metadata;
+      return obj;
+    },
+  }, skills, distDir, options);
 }
@@ -1,84 +1,23 @@
-import path from 'path';
-import {
-  cleanDir,
-  ensureDir,
-  generateYamlFrontmatter,
-  prefixSkillReferences,
-  replacePlaceholders,
-  writeFile,
-} from '../utils.js';
+import { transformProvider } from './shared.js';

 /**
- * OpenCode Transformer (Skills Only)
- *
- * All skills output to .opencode/skills/{name}/SKILL.md
- * User-invokable skills get args support in frontmatter.
- *
- * @param {Array} skills - All skills (including user-invokable ones)
- * @param {string} distDir - Distribution output directory
- * @param {Object} patterns - Design patterns data (unused, kept for interface consistency)
- * @param {Object} options - Optional settings
- * @param {string} options.prefix - Prefix to add to user-invokable skill names (e.g., 'i-')
- * @param {string} options.outputSuffix - Suffix for output directory (e.g., '-prefixed')
+ * OpenCode Transformer
+ * Output: .opencode/skills/{name}/SKILL.md
 */
-export function transformOpenCode(
-  skills,
-  distDir,
-  patterns = null,
-  options = {},
-) {
-  const { prefix = '', outputSuffix = '' } = options;
-  const opencodeDir = path.join(distDir, `opencode${outputSuffix}`);
-  const skillsDir = path.join(opencodeDir, '.opencode/skills');
-
-  cleanDir(opencodeDir);
-  ensureDir(skillsDir);
-
-  const allSkillNames = skills.map((s) => s.name);
-  const commandNames = skills
-    .filter((s) => s.userInvokable)
-    .map((s) => `${prefix}${s.name}`);
-  let refCount = 0;
-  for (const skill of skills) {
-    const skillName = `${prefix}${skill.name}`;
-    const skillDir = path.join(skillsDir, skillName);
-
-    const frontmatterObj = {
-      name: skillName,
-      description: skill.description,
-    };
-
-    if (skill.userInvokable) frontmatterObj['user-invokable'] = true;
-    if (skill.args && skill.args.length > 0) frontmatterObj.args = skill.args;
-    if (skill.license) frontmatterObj.license = skill.license;
-    if (skill.compatibility) frontmatterObj.compatibility = skill.compatibility;
-    if (skill.metadata) frontmatterObj.metadata = skill.metadata;
-    if (skill.allowedTools)
-      frontmatterObj['allowed-tools'] = skill.allowedTools;
-
-    const frontmatter = generateYamlFrontmatter(frontmatterObj);
-    let skillBody = replacePlaceholders(skill.body, 'opencode', commandNames);
-    if (prefix)
-      skillBody = prefixSkillReferences(skillBody, prefix, allSkillNames);
-    const content = `${frontmatter}\n\n${skillBody}`;
-    const outputPath = path.join(skillDir, 'SKILL.md');
-    writeFile(outputPath, content);
-
-    // Copy reference files if they exist
-    if (skill.references && skill.references.length > 0) {
-      const refDir = path.join(skillDir, 'reference');
-      ensureDir(refDir);
-      for (const ref of skill.references) {
-        const refOutputPath = path.join(refDir, `${ref.name}.md`);
-        const refContent = replacePlaceholders(ref.content, 'opencode');
-        writeFile(refOutputPath, refContent);
-        refCount++;
-      }
-    }
-  }
-
-  const userInvokableCount = skills.filter((s) => s.userInvokable).length;
-  const refInfo = refCount > 0 ? ` (${refCount} reference files)` : '';
-  const prefixInfo = prefix ? ` [${prefix}prefixed]` : '';
-  console.log(`✓ OpenCode${prefixInfo}: ${skills.length} skills (${userInvokableCount} user-invokable)${refInfo}`);
+export function transformOpenCode(skills, distDir, patterns = null, options = {}) {
+  transformProvider({
+    provider: 'opencode',
+    displayName: 'OpenCode',
+    configDir: '.opencode',
+    buildFrontmatter: (skill, skillName) => {
+      const obj = { name: skillName, description: skill.description };
+      if (skill.userInvokable) obj['user-invokable'] = true;
+      if (skill.args && skill.args.length > 0) obj.args = skill.args;
+      if (skill.license) obj.license = skill.license;
+      if (skill.compatibility) obj.compatibility = skill.compatibility;
+      if (skill.metadata) obj.metadata = skill.metadata;
+      if (skill.allowedTools) obj['allowed-tools'] = skill.allowedTools;
+      return obj;
+    },
+  }, skills, distDir, options);
 }
@@ -1,65 +1,20 @@
-import path from 'path';
-import { cleanDir, ensureDir, writeFile, generateYamlFrontmatter, replacePlaceholders, prefixSkillReferences } from '../utils.js';
+import { transformProvider } from './shared.js';

 /**
- * Pi Transformer (Skills Only)
- *
- * All skills output to .pi/skills/{name}/SKILL.md
- * Frontmatter: name, description, license, compatibility, metadata
- *
- * @param {Array} skills - All skills (including user-invokable ones)
- * @param {string} distDir - Distribution output directory
- * @param {Object} patterns - Design patterns data (unused)
- * @param {Object} options - Optional settings
- * @param {string} options.prefix - Prefix to add to skill names (e.g., 'i-')
- * @param {string} options.outputSuffix - Suffix for output directory (e.g., '-prefixed')
+ * Pi Transformer
+ * Output: .pi/skills/{name}/SKILL.md
 */
 export function transformPi(skills, distDir, patterns = null, options = {}) {
-  const { prefix = '', outputSuffix = '' } = options;
-  const piDir = path.join(distDir, `pi${outputSuffix}`);
-  const skillsDir = path.join(piDir, '.pi/skills');
-
-  cleanDir(piDir);
-  ensureDir(skillsDir);
-
-  const allSkillNames = skills.map(s => s.name);
-  const commandNames = skills.filter(s => s.userInvokable).map(s => `${prefix}${s.name}`);
-  let refCount = 0;
-  for (const skill of skills) {
-    const skillName = `${prefix}${skill.name}`;
-    const skillDir = path.join(skillsDir, skillName);
-
-    const frontmatterObj = {
-      name: skillName,
-      description: skill.description,
-    };
-
-    if (skill.license) frontmatterObj.license = skill.license;
-    if (skill.compatibility) frontmatterObj.compatibility = skill.compatibility;
-    if (skill.metadata) frontmatterObj.metadata = skill.metadata;
-
-    const frontmatter = generateYamlFrontmatter(frontmatterObj);
-    let skillBody = replacePlaceholders(skill.body, 'pi', commandNames);
-    if (prefix) skillBody = prefixSkillReferences(skillBody, prefix, allSkillNames);
-    const content = `${frontmatter}\n\n${skillBody}`;
-    const outputPath = path.join(skillDir, 'SKILL.md');
-    writeFile(outputPath, content);
-
-    // Copy reference files if they exist
-    if (skill.references && skill.references.length > 0) {
-      const refDir = path.join(skillDir, 'reference');
-      ensureDir(refDir);
-      for (const ref of skill.references) {
-        const refOutputPath = path.join(refDir, `${ref.name}.md`);
-        const refContent = replacePlaceholders(ref.content, 'pi');
-        writeFile(refOutputPath, refContent);
-        refCount++;
-      }
-    }
-  }
-
-  const userInvokableCount = skills.filter(s => s.userInvokable).length;
-  const refInfo = refCount > 0 ? ` (${refCount} reference files)` : '';
-  const prefixInfo = prefix ? ` [${prefix}prefixed]` : '';
-  console.log(`✓ Pi${prefixInfo}: ${skills.length} skills (${userInvokableCount} user-invokable)${refInfo}`);
+  transformProvider({
+    provider: 'pi',
+    displayName: 'Pi',
+    configDir: '.pi',
+    buildFrontmatter: (skill, skillName) => {
+      const obj = { name: skillName, description: skill.description };
+      if (skill.license) obj.license = skill.license;
+      if (skill.compatibility) obj.compatibility = skill.compatibility;
+      if (skill.metadata) obj.metadata = skill.metadata;
+      return obj;
+    },
+  }, skills, distDir, options);
 }
@@ -0,0 +1,74 @@
+import path from 'path';
+import { cleanDir, ensureDir, writeFile, generateYamlFrontmatter, replacePlaceholders, prefixSkillReferences } from '../utils.js';
+
+/**
+ * Shared transformer logic for all providers.
+ *
+ * @param {Object} config - Provider-specific configuration
+ * @param {string} config.provider - Provider key for placeholders (e.g., 'claude-code')
+ * @param {string} config.displayName - Display name for logging (e.g., 'Claude Code')
+ * @param {string} config.configDir - Dot-directory name (e.g., '.claude')
+ * @param {Function} config.buildFrontmatter - (skill, skillName) => frontmatter object
+ * @param {Function} [config.transformBody] - Optional (body, skill) => transformed body
+ * @param {Array} skills - All skills
+ * @param {string} distDir - Distribution output directory
+ * @param {Object} options - Optional settings (prefix, outputSuffix)
+ */
+export function transformProvider(config, skills, distDir, options = {}) {
+  const { provider, displayName, configDir, buildFrontmatter, transformBody } = config;
+  const { prefix = '', outputSuffix = '' } = options;
+  const providerDir = path.join(distDir, `${provider}${outputSuffix}`);
+  const skillsDir = path.join(providerDir, `${configDir}/skills`);
+
+  cleanDir(providerDir);
+  ensureDir(skillsDir);
+
+  const allSkillNames = skills.map(s => s.name);
+  const commandNames = skills.filter(s => s.userInvokable).map(s => `${prefix}${s.name}`);
+  let refCount = 0;
+  let scriptCount = 0;
+
+  for (const skill of skills) {
+    const skillName = `${prefix}${skill.name}`;
+    const skillDir = path.join(skillsDir, skillName);
+
+    const frontmatterObj = buildFrontmatter(skill, skillName);
+    const frontmatter = generateYamlFrontmatter(frontmatterObj);
+
+    let skillBody = replacePlaceholders(skill.body, provider, commandNames);
+    if (prefix) skillBody = prefixSkillReferences(skillBody, prefix, allSkillNames);
+    if (transformBody) skillBody = transformBody(skillBody, skill);
+
+    const content = `${frontmatter}\n\n${skillBody}`;
+    writeFile(path.join(skillDir, 'SKILL.md'), content);
+
+    // Copy reference files if they exist
+    if (skill.references && skill.references.length > 0) {
+      const refDir = path.join(skillDir, 'reference');
+      ensureDir(refDir);
+      for (const ref of skill.references) {
+        writeFile(
+          path.join(refDir, `${ref.name}.md`),
+          replacePlaceholders(ref.content, provider)
+        );
+        refCount++;
+      }
+    }
+
+    // Copy script files if they exist
+    if (skill.scripts && skill.scripts.length > 0) {
+      const scriptsOutDir = path.join(skillDir, 'scripts');
+      ensureDir(scriptsOutDir);
+      for (const script of skill.scripts) {
+        writeFile(path.join(scriptsOutDir, script.name), script.content);
+        scriptCount++;
+      }
+    }
+  }
+
+  const userInvokableCount = skills.filter(s => s.userInvokable).length;
+  const refInfo = refCount > 0 ? ` (${refCount} reference files)` : '';
+  const scriptInfo = scriptCount > 0 ? ` (${scriptCount} script files)` : '';
+  const prefixInfo = prefix ? ` [${prefix}prefixed]` : '';
+  console.log(`✓ ${displayName}${prefixInfo}: ${skills.length} skills (${userInvokableCount} user-invokable)${refInfo}${scriptInfo}`);
+}
@@ -140,6 +140,22 @@ export function readSourceFiles(rootDir) {
            }
          }

+          // Read script files if they exist
+          const scripts = [];
+          const scriptsDir = path.join(entryPath, 'scripts');
+          if (fs.existsSync(scriptsDir)) {
+            const scriptFiles = fs.readdirSync(scriptsDir).filter(f => fs.statSync(path.join(scriptsDir, f)).isFile());
+            for (const scriptFile of scriptFiles) {
+              const scriptPath = path.join(scriptsDir, scriptFile);
+              const scriptContent = fs.readFileSync(scriptPath, 'utf-8');
+              scripts.push({
+                name: scriptFile,
+                content: scriptContent,
+                filePath: scriptPath
+              });
+            }
+          }
+
          skills.push({
            name: frontmatter.name || entry.name,
            description: frontmatter.description || '',
@@ -152,7 +168,8 @@ export function readSourceFiles(rootDir) {
            context: frontmatter.context || null,
            body,
            filePath: skillMdPath,
-            references
+            references,
+            scripts
          });
        }
      }