CtrlK
BlogDocsLog inGet started
Tessl Logo
SkillPublic

json-render-shadcn

Pre-built shadcn/ui components for json-render. Use when working with @json-render/shadcn, adding standard UI components to a catalog, or building web UIs with Radix UI + Tailwind CSS components.

Quality

80%

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

Fix and improve this skill with Tessl

tessl review fix ./skills/json-render-shadcn/SKILL.md
SKILL.md
Quality
Evals
Security

Quality

Content

71%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 highly actionable, efficient reference for a component library: executable code for the core catalog/registry pattern, concrete prop documentation, and useful guardrails, with no time-sensitive or padded content. The main gap is structural — everything lives inline in SKILL.md with no progressive disclosure into reference files, and a couple of minor execution gaps (missing zod import, no mismatch guidance).

Suggestions

Move the 36-component listing (and possibly the Built-in Actions and validateOn details) into a references/ file (e.g., references/components.md), keeping SKILL.md as a lean overview with a well-signaled link.

Add the missing zod import to the "Extending with Custom Components" snippet so it is copy-paste executable.

Add one line noting that registry component keys must match catalog definition keys, so mismatches fail loudly at setup.

DimensionReasoningScore

Conciseness

The body is lean: the component listing carries prop signatures Claude cannot know (not padding), and it never explains Radix/Tailwind basics. Minor redundancy exists — the "Extending with Custom Components" snippet repeats the full catalog/registry boilerplate already shown — which keeps it at the efficient-with-minor-trims anchor rather than the every-token-earns-its-place anchor, but well above anchor 3's noticeable unnecessary explanation.

4 / 5

Actionability

The usage pattern is complete, executable TypeScript with all imports, and per-component prop lists are concrete ("Input - Text input with label, name, type, placeholder, value, checks"). The "Extending" snippet uses z.object without a zod import — a minor gap that puts it at the mostly-executable anchor, clearly above the pseudocode/missing-key-details anchor since no pseudocode is used.

4 / 5

Workflow Clarity

The core workflow — pick definitions into defineCatalog, then pick matching implementations into defineRegistry — is unambiguous and shown as one paired code block, with the explicit guardrail "Do not spread all definitions -- explicitly select what your app uses" and the note that state actions need no declaration. Minor gap: no guidance on what happens if catalog and registry keys mismatch; as a non-destructive reference skill, validation checkpoints are not required, so this sits at clear-sequence-with-minor-gaps rather than the explicit-validation anchor.

4 / 5

Progressive Disclosure

The entire 36-component API reference, built-in actions, and validation-timing details are inlined in a 154-line SKILL.md with no bundle files and no external references. Sections are well-organized with headers and a table (above the wall-of-text anchor), but reference detail that plausibly belongs in a separate file is inline, below the anchor that expects most content appropriately split with clear references.

3 / 5

Total

15

/

20

Passed

Description

78%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 well-formed description that explicitly covers both what the skill provides and when to use it, with concrete, natural trigger terms anchored by a distinctive package name. The main weakness is specificity of capabilities, which describes the artifact rather than enumerating concrete actions.

Suggestions

Convert the opening into action-oriented coverage, e.g., "Provides pre-built shadcn/ui component definitions and React implementations (36 components) for json-render catalogs" to list more concrete capabilities.

Tighten the broad trigger "building web UIs with Radix UI + Tailwind CSS components" to something scoped to json-render catalogs to reduce overlap with generic shadcn/UI skills.

DimensionReasoningScore

Specificity

"Pre-built shadcn/ui components for json-render" names the domain and a concrete deliverable, but the description states what the thing is rather than listing multiple specific actions, matching the anchor for 1-2 concrete actions without comprehensive coverage. It is above the generic-actions anchor (2) but below the several-specific-actions anchors (4-5).

3 / 5

Completeness

It explicitly answers both questions: the "what" ("Pre-built shadcn/ui components for json-render") and the "when" ("Use when working with @json-render/shadcn, adding standard UI components to a catalog, or building web UIs with Radix UI + Tailwind CSS components") with concrete trigger phrases, matching the top anchor. It is well above anchor 4, where the 'when' would be less explicit or specific.

5 / 5

Trigger Term Quality

"@json-render/shadcn", "adding standard UI components to a catalog", and "building web UIs with Radix UI + Tailwind CSS components" are natural phrases a user of this stack would say, giving good keyword coverage. A few natural synonyms (e.g., "shadcn", "UI library") are missing, so it falls short of the comprehensive anchor (5) but is clearly above anchor 3.

4 / 5

Distinctiveness Conflict Risk

The @json-render/shadcn package trigger carves a distinct niche, but "building web UIs with Radix UI + Tailwind CSS components" is broad and could overlap with generic shadcn/web-UI skills, matching the minor-overlap anchor. It is not anchor 5 (which requires minimal conflict risk from all triggers) but is clearly above anchor 3.

4 / 5

Total

16

/

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.

Validation — 16 / 16 Passed

Validation for skill structure

No warnings or errors.

Repository

vercel-labs/json-render

Path

skills/json-render-shadcn/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.