CtrlK
BlogDocsLog inGet started
Tessl Logo

react-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. Do NOT use for React/Next.js performance optimization (use react-best-practices instead).

68

Quality

Does it follow best practices?

Impact

No eval scenarios have been run

SecuritybySnyk

Passed

No known issues

SKILL.md
Quality
Evals
Security

Quality

Content

65%

Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.

The body is concise and well-structured as an overview, but it lacks concrete executable examples and the rule files it points to are not bundled. Workflow guidance is present but shallow.

Suggestions

Add at least one short executable code example (incorrect vs. correct) for a high-priority rule so the body is actionable on its own.

Bundle the referenced rules/*.md files and AGENTS.md, or remove the references, so progressive disclosure points to real material.

Add a brief application workflow with a validation/review checkpoint (e.g., verify the refactor preserves behavior) before considering a rule applied.

DimensionReasoningScore

Conciseness

The body is lean and well-organized, with a priority table and one-line rule descriptors; it does not over-explain concepts Claude already knows.

3 / 3

Actionability

Rules are named with brief descriptors but there is no executable code or concrete example in the body itself; guidance describes rather than instructs.

2 / 3

Workflow Clarity

A "How to Use" section lists steps and what each rule file contains, but there are no validation checkpoints or feedback loops guiding application of the rules.

2 / 3

Progressive Disclosure

References to rules/*.md and AGENTS.md are clearly signaled, but those bundle files do not exist in the repository, so the referenced structure is not actually present.

2 / 3

Total

9

/

12

Passed

Description

100%

Based on the skill's description, can an agent find and select it at the right time? Clear, specific descriptions lead to better discovery.

The description is concrete, well-triggered, and clearly disambiguated from sibling skills. It answers both what and when with natural user language and a useful negative trigger.

DimensionReasoningScore

Specificity

Lists multiple concrete actions such as "refactoring components with boolean prop proliferation", "building flexible component libraries", and "designing reusable APIs" rather than vague language.

3 / 3

Completeness

Explicitly answers what it does (composition patterns) and when to use it via a "Use when..." clause and a "Triggers on..." clause.

3 / 3

Trigger Term Quality

Natural developer terms users would actually say appear throughout: "boolean prop proliferation", "compound components", "render props", and "context providers".

3 / 3

Distinctiveness Conflict Risk

Clear niche with distinct triggers and an explicit negative disambiguation ("Do NOT use for React/Next.js performance optimization") preventing conflicts.

3 / 3

Total

12

/

12

Passed

Validation

100%

Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.

Validation16 / 16 Passed

Validation for skill structure

No warnings or errors.

Repository
tech-leads-club/agent-skills
Reviewed

Table of Contents

Is this your skill?

If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.