halflength-ampleness75

Component Gen

Name: Component Gen
Author: halflength-ampleness75

Development community

SOURCE https://github.com/halflength-ampleness75/claude-code-recipes/blob/main/commands/component-gen.md

Description

--- model: sonnet description: Generate React or Vue components with prop types, styling, accessibility, and tests --- Generate a production-quality UI component from the description provided in `$ARGUMENTS`. ## Step 1 — Parse the Request Extract from `$ARGUMENTS`: - **Component name** (e.g., "DataTable", "Modal", "SearchBar") - **Feature requirements** (what the component should do) - **Framework preference** (React or Vue — detect from project if not stated) - **Variants or states** (e.g.,

Installation

Installs to ~/.claude/skills/halflength-ampleness75-claude-code-recipes-component-gen/SKILL.md

Terminal

mkdir -p ~/.claude/skills/halflength-ampleness75-claude-code-recipes-component-gen && curl -fsSL https://raw.githubusercontent.com/halflength-ampleness75/claude-code-recipes/HEAD/commands/component-gen.md -o ~/.claude/skills/halflength-ampleness75-claude-code-recipes-component-gen/SKILL.md

Restart Claude Code, or start a new session, for it to be picked up.