skills/pbakaus_impeccable
1
0
Fork 0
mirror of https://github.com/pbakaus/impeccable.git synced 2026-09-17 08:36:25 +03:00
Code Issues Packages Projects Releases Wiki Activity

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

Browse Source 
- 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>
This commit is contained in:
Paul Bakaus
2026-03-17 10:54:06 -07:00
co-authored by Claude Opus 4.6
parent 2bf7fce2d6
commit f9bfe18d26
46 changed files with 2600 additions and 4658 deletions
Download Patch File Download Diff File Expand all files Collapse all files
scripts/lib/transformers/agents.js
+17 -62
View File
@@ -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);
}