Domains
Forms
Mechanism
Breaks down how the skill works and what it produces, so you can quickly judge whether it fits your scenario and value.
When refactoring components with many boolean props, building reusable component libraries, designing flexible component APIs, reviewing component architecture, or working with compound components/context providers.
rules/ as markdown with bad/good code examplesAGENTS.md for guidanceDevelopers get composition patterns to avoid boolean prop proliferation, producing flexible, maintainable React components easier for humans and AI to scale with.
Use Cases
A frontend dev maintains a UI library where Button has 8 boolean props (loading, disabled, ghost, block...). Using this skill, they read architecture-avoid-boolean-props and patterns-explicit-variants, refactor to compound components and explicit variants. Result: cleaner API, fewer breaking changes, easier maintenance for the team and AI tools.
During a code review, an engineer spots a component using render props and forwardRef on React 19. They invoke this skill to check patterns-children-over-render-props and react19-no-forwardref, then suggest compositional children and use() instead. This aligns the codebase with Vercel's composition patterns and improves AI readability.
Skill Relationships
Dependency relationships read as "the upper tier points to the lower tier." The current Skill sits in the middle tier — above are Skills that depend on it, below are Skills it depends on.
Tier 1 · These Skills Use Me
Tier 2 · Current Skill
Tier 3 · I Use These Skills
Browse this skill's relationships within its skillset. Click a node to switch the side panel; use the search box to jump to any skill.
Skill File