tessl install https://github.com/softaworks/agent-toolkit --skill react-devgithub.com/softaworks/agent-toolkit
This skill should be used when building React components with TypeScript, typing hooks, handling events, or when React TypeScript, React 19, Server Components are mentioned. Covers type-safe patterns for React 18-19 including generic components, proper event typing, and routing integration (TanStack Router, React Router).
Average Score
91%
Content
100%
Description
82%
Generated
Validations
Total score
11/16| Criteria | Score |
|---|---|
skill_md_line_count SKILL.md line count is 392 (<= 500) | |
frontmatter_valid YAML frontmatter is valid | |
name_field 'name' field is valid: 'react-dev' | |
description_field 'description' field is valid (323 chars) | |
description_voice 'description' uses third person voice | |
description_trigger_hint Description may be missing an explicit 'when to use' trigger hint (e.g., 'Use when...') | |
compatibility_field 'compatibility' field not present (optional) | |
allowed_tools_field 'allowed-tools' field not present (optional) | |
metadata_version 'metadata' field is not a dictionary | |
metadata_field 'metadata' field not present (optional) | |
license_field 'license' field is missing | |
frontmatter_unknown_keys Unknown frontmatter key(s) found; consider removing or moving to metadata | |
body_present SKILL.md body is present | |
body_examples Examples detected (code fence or 'Example' wording) | |
body_output_format Output/return/format terms detected | |
body_steps No step-by-step structure detected (no ordered list); consider adding a simple workflow |
Content
Total score
12/12| Dimension | Score |
|---|---|
conciseness The content is lean and efficient, assuming Claude's competence with TypeScript and React. Every section provides direct, actionable patterns without explaining basic concepts like what React or TypeScript are. | 3/3 |
actionability All code examples are fully executable and copy-paste ready. The skill provides specific, concrete patterns for every use case including component props, event handlers, hooks, generics, and routing with real TypeScript syntax. | 3/3 |
workflow_clarity For a reference/pattern skill, the workflow is clear through well-organized sections. The when_to_use section establishes scope, and the rules section provides explicit ALWAYS/NEVER guidance that serves as validation checkpoints for correct implementation. | 3/3 |
progressive_disclosure Excellent structure with a clear overview in the main file and well-signaled one-level-deep references to detailed materials (hooks.md, event-handlers.md, react-19-patterns.md, etc.). Content is appropriately split between quick patterns and detailed reference files. | 3/3 |
Overall Assessment
This is an exemplary skill file that demonstrates excellent token efficiency while providing comprehensive, actionable guidance for React TypeScript development. The content is well-organized with clear sections, executable code examples, and appropriate progressive disclosure through linked reference files. The ALWAYS/NEVER rules section provides clear guardrails for correct usage.
Description
Suggestions 2
Total score
10/12| Dimension | Score |
|---|---|
specificity Names the domain (React/TypeScript) and mentions some actions like 'building React components', 'typing hooks', 'handling events', but doesn't list comprehensive concrete actions. Terms like 'type-safe patterns' and 'routing integration' are somewhat vague. | 2/3 |
completeness Explicitly answers both what ('building React components with TypeScript, typing hooks, handling events, generic components, proper event typing, routing integration') and when ('should be used when building React components with TypeScript... or when React TypeScript, React 19, Server Components are mentioned'). | 3/3 |
trigger_term_quality Good coverage of natural terms users would say: 'React components', 'TypeScript', 'hooks', 'events', 'React 19', 'Server Components', 'TanStack Router', 'React Router', 'React 18'. These are terms developers naturally use when seeking help. | 3/3 |
distinctiveness_conflict_risk While specific to React+TypeScript, it could overlap with general TypeScript skills or general React skills. The mention of specific versions (18-19) and Server Components helps, but 'routing integration' could conflict with router-specific skills. | 2/3 |
Suggestions
Replace vague phrases like 'type-safe patterns' and 'routing integration' with specific concrete actions (e.g., 'define typed props and state', 'configure TanStack Router type inference')
Add file extensions or patterns that would trigger selection (e.g., '.tsx files', 'React.FC', 'useState<T>')
Overall Assessment
This is a reasonably well-crafted description that clearly identifies when to use the skill and covers relevant trigger terms for React TypeScript development. The main weakness is moderate specificity - it could benefit from more concrete action verbs describing what the skill actually does (e.g., 'defines prop types', 'configures generic components'). The description also risks some overlap with adjacent skills.