CtrlK
BlogDocsLog inGet started
Tessl Logo
SkillPublic

dev-create-component

Use when adding a new UI component to an existing module - handles templates, props, and test scaffolding.

Quality

81%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide
SecuritybySnyk

Passed

No findings from the security scan

SKILL.md
Quality
Evals
Security

Quality

Content

86%Weight 40%Scale 1-5

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

A lean, highly actionable scaffolding skill: concrete paths, a copy-adaptable template, and a validation command, with only minor gaps. Adding an error-recovery step after tsc and resolving the [module] placeholder would raise it further.

Suggestions

Add a feedback loop after validation (e.g., 'If tsc reports errors, fix them and re-run before finishing') to satisfy the top workflow-clarity anchor.

Explain how to resolve the '[module]' path segment when $ARGUMENTS only supplies a component name.

Reconcile the line-limit inconsistency: the template comment says '< 100 lines' of JSX while the checklist says '< 200 lines'.

DimensionReasoningScore

Conciseness

The 45-line body contains zero concept explanations and no padding; the template's comments are task instructions rather than teaching, so every token earns its place.

5 / 5

Actionability

Concrete file paths per component type, a complete TypeScript template, and a runnable validation command ('npx tsc --noEmit') give mostly executable guidance, but the '[module]' placeholder is never resolved and the template says 'clean JSX, < 100 lines' while the checklist says '< 200 lines'.

4 / 5

Workflow Clarity

Steps 1-5 form a clear sequence with a checklist (step 4) and a validation checkpoint (step 5), but there is no explicit error-recovery loop after tsc validation, which the top anchor expects.

4 / 5

Progressive Disclosure

The body is under 50 lines with well-organized sections and its single external reference ('docs/ARCHITECTURE.md section 5') is clearly signaled and one level deep; no bundle files exist to misorganize.

5 / 5

Total

18

/

20

Passed

Description

70%Weight 40%Scale 1-5

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

A solid description with an explicit trigger clause and a recognizable niche. Its main weakness is the vague 'handles' verb, which names objects rather than concrete actions.

Suggestions

Replace the generic verb with concrete actions, e.g., 'Creates React component files with typed props interfaces and a standard template'.

Add common trigger variations such as 'create', 'scaffold', or 'React component' to broaden natural keyword coverage.

Note that 'test scaffolding' is claimed but the body has no test step — either add test scaffolding steps or drop the claim.

DimensionReasoningScore

Specificity

'handles templates, props, and test scaffolding' names the domain and three concrete objects, but the verb 'handles' is generic and no specific action (e.g., creates component files, generates typed interfaces) is stated.

3 / 5

Completeness

Both parts are present: an explicit 'when' ('Use when adding a new UI component to an existing module') and a 'what' ('handles templates, props, and test scaffolding'), but the 'what' is not as explicit and concrete as the top anchor requires.

4 / 5

Trigger Term Quality

'adding a new UI component' is a natural user phrase and the description carries several relevant domain terms ('UI component', 'module', 'props', 'templates'), though common variations like 'create', 'React', or '.tsx' are missing.

4 / 5

Distinctiveness Conflict Risk

'adding a new UI component to an existing module' carves a clear niche with only minor overlap risk against generic scaffolding skills; it lacks the multi-synonym trigger coverage of the top anchor.

4 / 5

Total

15

/

20

Passed

Validation

87%

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

Validation — 14 / 16 Passed

Validation for skill structure

CriteriaDescriptionResult

allowed_tools_field

'allowed-tools' contains unusual tool name(s)

Warning

frontmatter_unknown_keys

Unknown frontmatter key(s) found; consider removing or moving to metadata

Warning

Total

14

/

16

Passed

Repository

fernandezbaptiste/specialist-agent

Path

packs/react/skills/dev-create-component/SKILL.md

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.