Provides React composition patterns for refactoring boolean prop-heavy components, compound components, render props, context providers, state management, and React 19 APIs.
From ak-codingnpx claudepluginhub akallabet/akallabeth-cc-marketplace --plugin ak-codingThis skill uses the workspace's default tool permissions.
AGENTS.mdREADME.mdmetadata.jsonrules/_sections.mdrules/_template.mdrules/architecture-avoid-boolean-props.mdrules/architecture-compound-components.mdrules/patterns-children-over-render-props.mdrules/patterns-explicit-variants.mdrules/react19-no-forwardref.mdrules/state-context-interface.mdrules/state-decouple-implementation.mdrules/state-lift-state.mdSearches prompts.chat for AI prompt templates by keyword or category, retrieves by ID with variable handling, and improves prompts via AI. Use for discovering or enhancing prompts.
Searches, retrieves, and installs Agent Skills from prompts.chat registry using MCP tools like search_skills and get_skill. Activates for finding skills, browsing catalogs, or extending Claude.
Guides Next.js Cache Components and Partial Prerendering (PPR) with cacheComponents enabled. Implements 'use cache', cacheLife(), cacheTag(), revalidateTag(), static/dynamic optimization, and cache debugging.
Composition patterns for building flexible, maintainable React components. Avoid boolean prop proliferation by using compound components, lifting state, and composing internals. These patterns make codebases easier for both humans and AI agents to work with as they scale.
Reference these guidelines when:
| Priority | Category | Impact | Prefix |
|---|---|---|---|
| 1 | Component Architecture | HIGH | architecture- |
| 2 | State Management | MEDIUM | state- |
| 3 | Implementation Patterns | MEDIUM | patterns- |
| 4 | React 19 APIs | MEDIUM | react19- |
architecture-avoid-boolean-props - Don't add boolean props to customize
behavior; use compositionarchitecture-compound-components - Structure complex components with shared
contextstate-decouple-implementation - Provider is the only place that knows how
state is managedstate-context-interface - Define generic interface with state, actions, meta
for dependency injectionstate-lift-state - Move state into provider components for sibling accesspatterns-explicit-variants - Create explicit variant components instead of
boolean modespatterns-children-over-render-props - Use children for composition instead
of renderX props⚠️ React 19+ only. Skip this section if using React 18 or earlier.
react19-no-forwardref - Don't use forwardRef; use use() instead of useContext()Read individual rule files for detailed explanations and code examples:
rules/architecture-avoid-boolean-props.md
rules/state-context-interface.md
Each rule file contains:
For the complete guide with all rules expanded: AGENTS.md