Claude Code plugin with a systematic process for identifying repeated UI patterns, designing minimal shared components, and applying them across codebases.

When you say "I want to create a new component" or ask to audit UI patterns, Claude follows a 6-phase process:

1. Audit — Search the codebase for all instances of the pattern
2. Present — Generate a visual HTML report you open in the browser
3. Decide — Design the minimal API (props, slots, emits)
4. Create — Build the component
5. Apply — Migrate all instances, running tests between batches
6. Report — Document which cases don't apply and why

It also works when building new features — checks if existing shared components cover the use case before writing inline code.

claude plugin add https://github.com/josschavez/creating-shared-components-plugin

The skill activates automatically when you:

• Say "I want to create a new component"
• Ask to standardize a repeated UI pattern
• Ask to audit for reusable components
• Build a new feature that may need a reusable component

Josue Chavez — github.com/josschavez

MIT