Guide for implementing React compound component patterns with dot notation in this codebase. Use when creating new UI components that have multiple related sub-components, building forms, dashboards, or pages with distinct sections, or when refactoring components that have complex prop drilling. Activates for component composition, context providers, reusable UI patterns.
70
88%
Does it follow best practices?
Impact
—
No eval scenarios have been run
Passed
No known issues
Patterns for implementing React compound components with dot notation (Component.SubComponent), sharing state through React Context instead of prop drilling. Covers when to reach for the pattern, the Next.js server/client boundary, the implementation steps, TypeScript typing, best practices, and anti-patterns.
SKILL.md - Main skill instructions: when to use the pattern, the server/client boundary caveat, the four-step implementation, TypeScript patterns, and a migration checklistThis skill is automatically discovered by Claude when relevant to the task.