CtrlK
BlogDocsLog inGet started
Tessl Logo
SkillPublic

extend-ui-files-primitives

This skill should be used when the user asks to add file upload, a drop zone, or drag and drop files, show file thumbnails or a PDF page preview, build a file browser or file tree, open a file picked from a tree, use the color picker, toggle, toggle group, group or button group component, or wire these into a form in an app built with the extend-ui-svelte Svelte 5 library (FileUpload, FileThumbnail, FileSystem, ColorPicker, ColorPickerPanel, Toggle, ToggleGroup, Group).

78

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.

An excellent skill body: dense with non-obvious gotchas, fully executable examples, well-sequenced flows with error feedback, and appropriate offloading of prop tables to six real reference files. The one real defect is that both cited examples/*.svelte files are missing from the bundle, leaving two dangling pointers in the navigation the skill relies on.

Suggestions

Add the missing examples/ files (upload-thumbnails-viewer.svelte and file-browser-viewer.svelte) to the bundle, or remove/replace the two 'See examples/...' pointers in the body — currently they resolve to nothing.

If the examples are intentionally out of bundle scope, inline a short representative excerpt (e.g., the FileSystem + PdfViewer wiring) so the 'file browser and opening a file in a viewer' flow does not depend on an absent file.

DimensionReasoningScore

Conciseness

The body is lean and assumes Claude's competence: it never explains what Svelte, forms, or file uploads are; instead it spends every token on non-obvious knowledge — scoped-vs-Tailwind styling split ('a parent's scoped <style> does not reach a child component's root'), callback-controlled state ('bind:value and bind:pressed do not write back'), object-URL revocation hazards, and upstream parity gaps. It matches anchor 5 ('every token earns its place'); there is no padded or already-known explanation that would justify level 4.

5 / 5

Actionability

Every example is complete, executable Svelte 5 code (runes, real imports, real props): a minimal example per component, a full upload-with-validation-and-FormData server post, a form-posting pattern with hidden inputs, plus concrete install layouts for both package and registry copy-in ('The copied files import ../../dark-mode.js, ../../utils.js...'). This matches anchor 5 ('copy-paste ready code covering the common cases'), exceeding anchor 4's 'minor gaps'.

5 / 5

Workflow Clarity

The three multi-step flows are numbered and concrete, with validation and error feedback built in: the upload flow filters oversized files into an errors list, caps file count, and tracks 'uploading' / 'done' / 'failed' per file with a res.ok check (an explicit feedback loop for a batch operation); the browser flow specifies event payloads, null-url handling, and content-type routing. This matches anchor 5 ('clear sequence with explicit validation steps; feedback loops for error recovery'), not anchor 4 which requires missing checkpoints.

5 / 5

Progressive Disclosure

Structure is good: a component-to-reference table routes to six real, substantive files in references/, bulk prop tables live there rather than inline, and sibling skills are linked. However, the body twice directs the reader to example files ('See examples/upload-thumbnails-viewer.svelte' and 'examples/file-browser-viewer.svelte') that do not exist in the bundle — a broken navigation pointer. This fits anchor 4 ('good structure; references mostly clear; minor organization gaps') rather than anchor 5 ('easy navigation' with fully resolvable, well-signaled references), and is above anchor 3 since references are clearly signaled and content is appropriately split.

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.

A model triggering description: it enumerates concrete capabilities for all six components, uses natural user phrasing with synonyms, includes an explicit 'use when' clause, and is tightly scoped to the extend-ui-svelte library to avoid cross-skill conflicts. It is long, but every clause is a distinct trigger, not padding.

DimensionReasoningScore

Specificity

The description lists many concrete, distinct actions — 'add file upload, a drop zone, or drag and drop files, show file thumbnails or a PDF page preview, build a file browser or file tree, open a file picked from a tree, use the color picker, toggle, toggle group, group or button group component, or wire these into a form' — comprehensively covering all six bundled components. It matches the anchor 'multiple specific concrete actions; comprehensive coverage'; it is not the level-4 anchor because there are no minor gaps — every component's primary use case is named.

5 / 5

Completeness

Both 'what' and 'when' are explicit: 'This skill should be used when the user asks to...' is a concrete trigger clause, and the enumerated actions plus the library qualifier ('in an app built with the extend-ui-svelte Svelte 5 library (FileUpload, FileThumbnail, FileSystem, ColorPicker, Toggle, ToggleGroup, Group)') clearly state what the skill covers. This matches anchor 5 ('clearly and explicitly answers both what AND when with concrete trigger phrases') rather than anchor 4, where the 'when' would be less specific.

5 / 5

Trigger Term Quality

Natural user phrasings and their synonyms are covered: 'file upload', 'drop zone' / 'drag and drop files', 'file thumbnails' / 'PDF page preview', 'file browser' / 'file tree', 'color picker', 'toggle' / 'toggle group', 'group' / 'button group', 'form'. This is comprehensive natural-term coverage including synonyms (matching anchor 5), not merely 'good coverage with a few natural terms missing' (anchor 4).

5 / 5

Distinctiveness Conflict Risk

The description has a clear niche — file and primitive components of the specific 'extend-ui-svelte Svelte 5 library' — and even implicitly carves boundaries against sibling skills (viewers, core). Generic component words ('toggle', 'group') are scoped by the library qualifier, so conflict risk is minimal, matching anchor 5 rather than anchor 4's 'minor overlap risk'.

5 / 5

Total

20

/

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

freightCognition/linehaulai-claude-marketplace

Path

plugins/extend-ui-svelte/skills/extend-ui-files-primitives/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.