Claude Marketplaces
SkillsMCP serversMarketplacesDigestTools
Submit

This week in Claude

Every Monday: Claude Code, Agent SDK, MCP, and the Anthropic platform moves worth your time.

Skills by category
Frontend DevelopmentBackend & APIsTesting & QASecurityDevOps & CI/CDGit & Pull RequestsDocumentationCode Review & QualityAI & Agent BuildingSkill Development
MCP servers by category
Sales & MarketingWeb & Browser AutomationDatabasesAI & LLM ToolsCloud & InfrastructureCommunication & MessagingDeveloper ToolsDesign & CreativeDocuments & KnowledgeSearch & Web Crawling
Marketplaces by category
AI Agents & OrchestrationLLM IntegrationDevelopment ToolsFrontend & UIBackend & APIsDatabasesTesting & Code QualityDevOps & CloudSecurity & ComplianceGit & Version Control
Claude Marketplaces

An independent directory of skills, plugins and MCP servers for Claude Code. Not affiliated with Anthropic.

Browse

  • Skills
  • MCP servers
  • Marketplaces
  • Weekly digest
  • Skill index
  • MCP index
  • Marketplace index

Site

  • About
  • Tools
  • Submit
  • Feedback
  • Privacy
  • llms.txt
  • Plugins reference

Maker

  • Agent Caffeine
  • knobs
  • Wax
  • Snug
  • mertduzgun.com
Made by mertduzgun.com
Skills/AI & Agent Building
vercel-labs avatar

Vercel Composition Patterns

vercel-labs/agent-skillsOfficial

Vercel's take on keeping React components maintainable as they grow.

GitHub stars
27.8K
last updated
Jun 10, 2026
View on GitHubSave

Install

$ npx -y skills add vercel-labs/agent-skills --skill vercel-composition-patterns --agent claude-code

Installs into .claude/skills of the current project.

Sponsors

CodeRabbitSponsoredTry For FreeLid closed, agents workingTry itOpen StepsSponsoredDownload for freeAppSignalSponsoredStart Free TrialKeep API keys from agentsGet SnugBlock apps on your iPhoneGet WaxDevtools for design engineersTry it livebelt - the only tool your agent needsSponsoredone prompt install

What it does

The main insight is practical: stop adding boolean props to handle variants, use composition and compound components instead. Covers lifting state into providers, building flexible APIs with context, and structuring component libraries that don't turn into prop soup. Also includes React 19 specific guidance like dropping forwardRef. The rules are prioritized by impact, so you can focus on architecture patterns first before diving into implementation details. If you're refactoring a component that's accumulated six boolean flags or building a design system, this gives you patterns that scale better for both humans and AI agents working in the codebase.

Files

Select a file.

Details

Repository
github.com/vercel-labs/agent-skills
Categories
AI & Agent Building, Cloud & Infrastructure
First seen
Jun 11, 2026

More from vercel-labs/agent-skills

All 14
  • Vercel React Best Practices
  • Vercel React Native Skills
  • Vercel React View Transitions
  • Vercel React Best Practices829.9K
  • Web Design Guidelines772.5K
  • Vercel Composition Patterns412.5K
  • Vercel React Native Skills251.4K
  • Deploy To Vercel166.4K
  • Vercel React View Transitions164.1K
  • Vercel Cli With Tokens133.2K
  • Vercel Optimize107.9K
  • Writing Guidelines103.6K
  • Vercel Deploy533

Recommended

More AI & Agent Building
1vercel-labs avatarvercel-react-best-practicesvercel-labs/agent-skillsReact and Next.js performance optimization guidelines from Vercel Engineering. This skill should be used when writing, reviewing, or refactoring React/Next.js c0installs
2vercel-labs avatarvercel-react-native-skillsvercel-labs/agent-skillsVercel's official collection of agent skills0installs
3vercel-labs avatarvercel-react-view-transitionsvercel-labs/agent-skillsGuide for implementing smooth, native-feeling animations using React's View Transition API (`<ViewTransition>` component, `addTransitionType`, and CSS view tran0installs
4Wania-Kazmi avatardatabase-patternsWania-Kazmi/claude-code-autonomous-agent-workflow|0installs
5yoloshii avatarsimple-fetchyoloshii/mcp-code-execution-enhancedBasic MCP skill demonstrating CLI-based execution pattern for fetching URL content0installs
6vercel-labs avatarfind-skillsvercel-labs/skillsHelps users discover and install agent skills when they ask questions like "how do I do X", "find a skill for X", "is there a skill that can...", or express int4Minstalls