Skip to content

Repository files navigation

Component Showcase Generator

A Claude Code plugin that audits any existing frontend codebase and auto-generates an enterprise-grade, brand-agnostic component showcase plus full design-system documentation — delivered as a self-contained, no-build /showcase/ folder of HTML that opens in any browser and imports statically into Figma.

This repository is both the plugin and the provenance of the prompt that powers it.

The plugin

component-showcase-generator/ — the installable Claude Code plugin. See its README for full details.

It ships a long-running, resumable workflow:

/showcase-ideate   →   /showcase-html   →   /showcase        →   /showcase-verify
  (ideate brand)       (generate branded     (audit codebase →      (fresh-session
                        HTML to document)      produce /showcase/   Phase 4 re-check,
                                               docs)                report-only)

Install (local)

/plugin marketplace add <path-to-this-repo>
/plugin install component-showcase-generator

Repository layout

Path What it is
component-showcase-generator/ The installable Claude Code plugin (skill, 4 commands, 2 agents, manifest).
engineered-prompt-options/ The 9 source prompts (1 seed + 8 technique variations) the engine was synthesized from.
ultimate-meta-prompt-workspace/ The synthesis audit trail — technique assessments, seed requirements, 2026 research, synthesis log, two review rounds, and the approved final outputs/ultimate-meta-prompt.md.
deliverables/ Reserved for generated /showcase/ output.
.claude-plugin/marketplace.json Marketplace manifest so this repo installs as a local plugin source.

How the engine was built

The 490-line meta-prompt at component-showcase-generator/skills/component-showcase/reference/showcase-meta-prompt.md was synthesized from the 9 source prompts via a multi-agent pipeline (assess → research → synthesize → independently review → revise), reaching an APPROVED verdict at 5/5 across all seven prompt-effectiveness criteria with full requirements traceability.

License

MIT

About

Brand-agnostic Claude Code plugin: audit any frontend codebase and auto-generate an enterprise-grade component showcase + design-system docs as a self-contained /showcase/ folder of HTML.

Resources

Stars

1 star

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages