vercel-composition-patterns
Official sourceReact composition patterns that scale—compound components, lifted state, context interfaces, explicit variants over boolean props—plus React 19 API changes.
Source: Vercel Labs
At a glance
Verified source- Best for
- Refactoring components plagued by boolean prop proliferation
- Works with
- Cursor · OpenAI Codex · Claude Code
- Outcome
- Building flexible, reusable component libraries
- Source
- vercel-labs/agent-skills
01 / Understand the skill
About vercel-composition-patterns
React composition patterns that scale. Use when refactoring components with boolean prop proliferation, building flexible component libraries, or designing reusable APIs. Triggers on tasks involving compound components, render props, context providers, or component architecture. Includes React 19 API changes.
React composition patterns that scale. Use when refactoring components with boolean prop proliferation, building flexible component libraries, or designing reusable APIs. Triggers on tasks involving compound components, render props, context providers, or component architecture. Includes React 19 API changes.
02 / Confirm the fit
Use vercel-composition-patterns when you need to
- Refactoring components plagued by boolean prop proliferation
- Building flexible, reusable component libraries
- Designing compound components and context-driven state
- Reviewing component API architecture
03 / See the workflow
How vercel-composition-patterns works
- 01Install: npx skills add https://github.com/vercel-labs/agent-skills --skill composition-patterns
- 02Try: Refactor this component with eight boolean props into compound components.
- 03Get: A composition-based redesign with shared context and explicit variant components.
Check before installing
Compatible platforms
Cursor · OpenAI Codex · Claude Code
Best fit
Refactoring components plagued by boolean prop proliferation
Review the source instructions if the required output differs from the formats described above.
Install and use
Compatible with Cursor and OpenAI Codex and Claude Code · Published by Vercel Labs
Ready to add vercel-composition-patterns?
Use the published instructions below, then provide the required input and describe the result you need.
General instructions · Cursor · OpenAI Codex · Claude Code
npx skills add https://github.com/vercel-labs/agent-skills --skill composition-patterns
Review the source repository and license before installing third-party skills.
Continue exploring
Similar skills
Authoritative reference for the Claude API and Anthropic SDKs: model IDs, pricing, thinking/effort params, streaming, tool use, caching, managed agents, and model migration.
Read, edit, create, and fix Excel/CSV files — formulas, formatting, charts, and clean financial models with zero formula errors.
Generate distinctive, production-grade frontend UI that avoids generic AI aesthetics — pages, components, dashboards, and landing pages.
Build high-quality MCP (Model Context Protocol) servers in Python (FastMCP) or Node/TypeScript that let LLMs use external services through well-designed tools.