CtrlK
BlogDocsLog inGet started
Tessl Logo
SkillPublic

assistant-ui-elements

Installs and customizes assistant-ui elements, the styled shadcn-style component catalog served from the r.assistant-ui.com registry through `npx assistant-ui@latest add <item>`. Use when adding a prebuilt chat surface or widget (Thread, ThreadList, AssistantModal, AssistantSidebar, ToolFallback, ToolGroup, MarkdownText, Reasoning, Sources, Attachment, ModelSelector, Voice orb, McpConfig) or one of the 120 standalone elements (approval card, agent plan, code diff, data table, chart, and so on), choosing between runtime-connected `<name>.aui.tsx` files and props-driven standalone files, overriding Thread slots through the `components` prop, editing the copied source under `components/assistant-ui/elements/`, or picking the Radix versus Base UI flavor in `components.json`. Route here when an import from `@/components/assistant-ui/...` fails, an element renders unstyled, or the CLI installs the wrong flavor. For unstyled building blocks use primitives; for the CLI scaffold itself use setup.

76

Quality

96%

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 exemplary lean overview: executable install commands and code for both element kinds, tight tables for the element taxonomy, and clean offloading of per-element detail to three well-described reference files. The only gap is that the install-to-render workflow relies on the gotchas section for validation rather than embedding an explicit verify step in the main sequence.

Suggestions

Add a brief verification step to the Install section (e.g., after `add`, confirm the files exist under `components/assistant-ui/elements/` and that the import from `@/components/assistant-ui/elements/thread.aui` resolves before wiring up the provider) so the main sequence has its own checkpoint.

Consider a short numbered decision flow (pick element kind from the table → `init` once → `add <item>` → wire per section → verify render) at the top of 'Two kinds of element' so the multi-section structure reads as one explicit workflow.

DimensionReasoningScore

Conciseness

Lean and information-dense: every line carries non-inferable, skill-specific data (registry item names, `.aui.tsx` suffix rules, `--thread-max-width`/`--composer-bg` CSS variables, the `elements-` prefix convention) with no explanation of concepts Claude already knows; not score 4, since there is no over-explanation to trim.

5 / 5

Actionability

Fully executable throughout: `npx assistant-ui@latest init` / `add thread thread-list` commands, the `registries` JSON snippet, and complete copy-paste TSX for runtime-connected use, standalone use, and Thread slot overrides, plus exact fixes like "re-add with `--overwrite`" — specific examples cover the common cases.

5 / 5

Workflow Clarity

The flow is clearly sequenced (init once per project → add → wire the element → override slots/restyle) and the Common Gotchas section provides symptom→fix feedback loops for error recovery, but the main install/use flow has no explicit verification checkpoint (e.g., confirming the installed file path or that the element renders with styles) — the checkpoints live in troubleshooting rather than the sequence itself.

4 / 5

Progressive Disclosure

A clear ~135-line overview with three well-signaled, one-level-deep references (catalog, aui-elements, standalone-elements), each annotated with exactly what it contains; all cited paths resolve to real files in `references/`, and the bulk detail (120 elements, prop shapes) is appropriately split out rather than inlined.

5 / 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 a strong third-person, what-and-when statement with an explicit 'Use when' clause, concrete trigger phrases, named components, and explicit routing away from adjacent skills. Its only weakness is density: it packs ~150 words into long run-on sentences, which is dense rather than padded, so no scoring guideline is violated.

DimensionReasoningScore

Specificity

Names multiple concrete actions — "Installs and customizes assistant-ui elements", "overriding Thread slots through the `components` prop", "editing the copied source under `components/assistant-ui/elements/`", "picking the Radix versus Base UI flavor" — with comprehensive coverage of the skill's capability surface; not score 4, since there are no minor gaps in the action list.

5 / 5

Completeness

Explicitly answers what ("Installs and customizes assistant-ui elements, the styled shadcn-style component catalog") and when ("Use when adding a prebuilt chat surface or widget… Route here when an import… fails, an element renders unstyled, or the CLI installs the wrong flavor") with concrete trigger phrases, matching the anchor-5 example structure.

5 / 5

Trigger Term Quality

Comprehensive natural terms users would actually say: component names ("Thread, ThreadList, AssistantModal… Voice orb, McpConfig"), plain-language widgets ("approval card, agent plan, code diff, data table, chart"), and failure phrases ("an import from `@/components/assistant-ui/...` fails", "an element renders unstyled", "the CLI installs the wrong flavor") with synonyms like "chat surface or widget".

5 / 5

Distinctiveness Conflict Risk

Clear niche (the styled element catalog via `npx assistant-ui@latest add <item>`) with explicit disambiguation from sibling skills — "For unstyled building blocks use primitives; for the CLI scaffold itself use setup" — so it is unlikely to trigger for the wrong skill.

5 / 5

Total

20

/

20

Passed

Validation

93%

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

Validation — 15 / 16 Passed

Validation for skill structure

CriteriaDescriptionResult

relative_links

Relative link issues: 7 suspicious

Warning

Total

15

/

16

Passed

Repository

stevenknowswhy/ProfessionalBuyer

Path

.claude/skills/assistant-ui-elements/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.