CtrlK
BlogDocsLog inGet started
Tessl Logo

new-component

Scaffold a new React component following this project's conventions (kel-ui-components first, data-driven content, co-located tests, accessibility by default). Use when asked to create a new component or homepage section.

73

Quality

90%

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

93%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.

The body is an efficient, highly actionable checklist with concrete paths and commands and a verification step. The only gap is the absence of an explicit error-recovery loop on the verification step.

Suggestions

Add a short feedback loop to step 6: 'If lint/tests fail, fix and re-run until clean' to lift workflow_clarity to 5.

Consider noting what to do if a requested primitive is missing from kel-ui-components (the fallback path) to close the small actionability gap.

DimensionReasoningScore

Conciseness

Lean 26-line body that assumes Claude's competence — every line states a convention, path, or command with no padding or explanation of basic concepts; matches the 'every token earns its place' anchor.

5 / 5

Actionability

Provides concrete executable guidance throughout — exact import syntax ("import { Button } from 'kel-ui-components'"), path aliases ("@/lib/animations"), file locations, and runnable commands ("bun run lint", "bunx vitest run src/components/__tests__/<Name>.test.tsx") covering the common cases.

5 / 5

Workflow Clarity

Six steps are clearly sequenced with an explicit verification checkpoint (step 6: "Verify: bun run lint and bunx vitest run..."); not a 5 because there is no explicit feedback loop (fix-and-re-run) for when verification fails.

4 / 5

Progressive Disclosure

Self-contained skill under 50 lines with no need for external references, organized into clear 'Conventions to follow' and 'Steps' sections — meeting the simple-skill exception for a top score.

5 / 5

Total

19

/

20

Passed

Description

87%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.

The description is strong: concrete, third-person, with both a clear capability statement and an explicit 'Use when' trigger clause. Minor room to broaden trigger synonyms and enumerate actions more discretely.

DimensionReasoningScore

Specificity

Lists several concrete capabilities in parentheses — "kel-ui-components first, data-driven content, co-located tests, accessibility by default" — matching the 'several specific actions, minor gaps' anchor; not a 5 because these are conventions rather than fully distinct enumerated actions.

4 / 5

Completeness

Explicitly answers both what ("Scaffold a new React component following this project's conventions...") and when ("Use when asked to create a new component or homepage section") with a concrete trigger phrase, matching the top anchor.

5 / 5

Trigger Term Quality

Natural trigger phrases "create a new component or homepage section" and "new component" are what users would actually say; not a 5 because synonyms and more variations (e.g. 'add a section', 'make a component') are thin.

4 / 5

Distinctiveness Conflict Risk

Targets a clear niche — new React components in a specific project with named conventions (kel-ui-components, homepage sections) — giving it distinct triggers with minimal overlap risk.

5 / 5

Total

18

/

20

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
RaquelSousa/kel-portfolio-2.0
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.