CtrlK
BlogDocsLog inGet started
Tessl Logo

react-component-documentation

Create or update component documentation in Sentry's MDX stories format. Use when asked to "document a component", "add stories", "write component docs", "create an mdx file", "add a stories.mdx", or document a design system component. Generates structured MDX with live demos, accessibility guidance, and auto-generated API docs from TypeScript types.

77

Quality

98%

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

96%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 content is highly actionable, concise, and well-sequenced with a verification checklist. The only gap is progressive disclosure: all material lives inline in a single file with no supporting reference files, so some reference-grade content remains in the main body.

Suggestions

Move the large Complete Example (Alert) into a references/ file (e.g. references/example-alert.mdx) and link to it one level deep, keeping only a compact skeleton in the main body.

Extract the category table and prop-triage tables into a references/ doc (e.g. references/conventions.md) referenced from the relevant steps, reducing the main body to navigation.

Add a short 'References' section near the top signaling the bundle files, so the structure and available detailed materials are discoverable at a glance.

DimensionReasoningScore

Conciseness

Lean, dense reference material — tables for prop triage, categories, and demo helpers, with no padding explaining what MDX or React components are; every section earns its tokens.

5 / 5

Actionability

Provides fully executable templates: exact frontmatter, an ordered import block, demo patterns, a manual props-table format, and a complete worked Alert example that is copy-paste ready.

5 / 5

Workflow Clarity

Sequenced Steps 0–5 with explicit editorial-gathering prompts and a closing Checklist that acts as a validation checkpoint verifying colocated file, import order, demo/code pairing, and accessibility coverage.

5 / 5

Progressive Disclosure

Well-organized with clear headers, but the ~350-line body is a self-contained monolith with no bundle files in references/ scripts/ or assets/ — the prop-triage detail, category tables, and complete worked example could be split into one-level-deep reference files.

4 / 5

Total

19

/

20

Passed

Description

100%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 exemplary: it states concrete capabilities, provides a rich set of natural trigger phrases, and clearly distinguishes when the skill should activate. It fully satisfies the what/when/which-skill questions with no padding.

DimensionReasoningScore

Specificity

Lists multiple concrete actions — 'Create or update component documentation', 'Generates structured MDX with live demos, accessibility guidance, and auto-generated API docs from TypeScript types' — giving comprehensive coverage of the skill's capabilities.

5 / 5

Completeness

Explicitly answers both 'what' (create/update Sentry MDX stories documentation) and 'when' (the 'Use when asked to...' clause with concrete trigger phrases).

5 / 5

Trigger Term Quality

Quotes numerous natural user phrases including 'document a component', 'add stories', 'write component docs', 'create an mdx file', 'add a stories.mdx', and 'document a design system component', covering synonyms and file extensions.

5 / 5

Distinctiveness Conflict Risk

Occupies a clear niche (Sentry MDX stories format) with distinct triggers and specific tooling references, making conflict with unrelated skills minimal.

5 / 5

Total

20

/

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.

Validation14 / 16 Passed

Validation for skill structure

CriteriaDescriptionResult

allowed_tools_field

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

Warning

relative_links

Relative link issues: 2 suspicious

Warning

Total

14

/

16

Passed

Repository
getsentry/sentry
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.