Description
vercel-composition-patterns is an agent skill from the Supabase repository that teaches React composition patterns for building components that scale. Its main aim is to avoid boolean prop proliferation, where a component collects so many true-or-false props that its behavior is hard to follow. The skill recommends compound components, lifting state, and composing a component's internals, so that callers assemble the pieces they need rather than passing flags. It also covers designing flexible component APIs and working with context providers. The skill lists when to apply it: when refactoring components with many boolean props, when building reusable component libraries, when designing flexible component APIs, when reviewing component architecture, and when working with compound components or context providers. Its rules are grouped into categories ordered by priority. The skill states that these patterns make codebases easier for both humans and AI agents to work with as they grow. It suits React developers who maintain component libraries or large trees of components.…
Highlights
- Avoids boolean prop proliferation
- Compound components and lifted state
- Flexible component APIs
- Rules grouped by priority
Ratings & Reviews
No ratings yet
Be the first to rate vercel-composition-patterns.
People also visit
canvas-design
Create beautiful visual art in .png and .pdf documents using design philosophy
vercel-composition-patterns FAQ
What does the vercel-composition-patterns skill do?
It gives an agent React composition patterns for refactoring and designing components, so they scale without piling up boolean props.
How do I install it?
Run: npx skills add https://github.com/supabase/supabase --skill vercel-composition-patterns
What is boolean prop proliferation?
A component that collects many true-or-false props, which makes its behavior hard to follow. The skill recommends compound components and lifted state instead.
When should I apply it?
When refactoring components with many boolean props, building reusable libraries, designing component APIs, reviewing architecture, or working with compound components and context providers.
What security checks has it passed?
skills.sh lists three audits: Gen Agent Trust Hub Pass, Socket Pass and Snyk Pass.
What are the best vercel-composition-patterns alternatives?
Popular alternatives to vercel-composition-patterns include implement, brand-guidelines and canvas-design. See all vercel-composition-patterns alternatives