CtrlK
BlogDocsLog inGet started
Tessl Logo

webiny-admin-ui-extensions

Customizing the Webiny Admin UI -- white-labeling, custom data list columns, page-type forms, named dialogs, named drawers, and Lexical editor plugins. Use this skill when the developer wants to change branding (logo, title, theme colors), add custom columns to content entry list views, create custom forms for Website Builder page types, register named dialogs or drawers that can be opened from anywhere with params, or extend the Lexical rich text editor. Covers AdminConfig, ContentEntryListConfig, useDialog, useDrawer, useOpenDialog, useOpenDrawer.

70

Quality

88%

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

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 strong, example-driven reference: nearly every section delivers executable code, accurate prop tables, and registration/deploy commands, with the .tsx-path warning catching the most likely failure mode. Its weaknesses are the absent bundle structure (everything inline at ~400 lines), one non-compiling form example, a thin Lexical section, and duplicated dialog/drawer patterns.

Suggestions

Split per-feature detail (API tables, Zod param patterns, full worked examples) into references/ files (e.g., references/dialogs.md, references/drawers.md, references/data-list-columns.md) and keep SKILL.md as a concise overview with one-level-deep links, mirroring the existing 'Related Skills' cross-referencing style.

Fix the RetailPageForm example so it compiles as shown: add the missing imports for useForm, Grid, and Input (or note that they come from 'webiny/admin/form' and 'webiny/admin/ui' per the table below the snippet).

Either add a minimal Lexical plugin registration example to the Lexical Editor Plugins section or move that section to a reference file — as written it names import paths but gives no actionable pattern; also deduplicate the identical Zod 'Typed Params' blocks between Dialogs and Drawers.

DimensionReasoningScore

Conciseness

The body is dense code and tables with no tutoring of known concepts, but the Dialogs and Drawers sections are near-structural duplicates (register/open/Zod-params/API-table repeated per section, the Zod block verbatim twice), which is trimmable redundancy. This fits 'efficient; minor instances that could be trimmed' better than 'every token earns its place'.

4 / 5

Actionability

Nearly all examples are copy-paste-ready TSX with registration snippets and watch/deploy commands, but the RetailPageForm example uses useForm(), Grid.Column, and Input while importing only Bind, UnsetOnUnmount, and validation — the snippet won't compile as written. 'Mostly executable with minor gaps' rather than fully executable.

4 / 5

Workflow Clarity

The per-task sequence (create component file, register via <Admin.Extension src={...tsxA}>, run yarn webiny watch/deploy) is consistent, and the bolded .tsx-extension warning functions as a build-failure checkpoint. The Lexical plugins section, however, announces a feature area with no example or steps, leaving a gap that keeps this below the top anchor.

4 / 5

Progressive Disclosure

No bundle files exist, so all ~400 lines are inline, including five API reference tables and full worked examples for six feature areas that would naturally live in references/ files. Section headers and the Quick Reference are well organized, but content that should be separate is inline, matching the anchor for 'could be better organized' rather than 'most content is appropriately placed'.

3 / 5

Total

15

/

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, enumerates natural trigger phrases with synonyms, explicitly covers both what the skill does and when to use it, and is firmly niched to Webiny Admin UI extension work. It is specific without padding.

DimensionReasoningScore

Specificity

Enumerates six concrete capability areas ("white-labeling, custom data list columns, page-type forms, named dialogs, named drawers, and Lexical editor plugins") plus the specific APIs covered ("AdminConfig, ContentEntryListConfig, useDialog, useDrawer, useOpenDialog, useOpenDrawer"), matching the comprehensive-coverage anchor rather than the 'minor gaps' anchor below it.

5 / 5

Completeness

Explicitly answers both halves: the 'what' ("Customizing the Webiny Admin UI -- white-labeling, custom data list columns, page-type forms, named dialogs, named drawers, and Lexical editor plugins") and a concrete 'when' clause ("Use this skill when the developer wants to change branding... or extend the Lexical rich text editor").

5 / 5

Trigger Term Quality

Trigger phrases are natural developer language with parenthetical synonyms — "change branding (logo, title, theme colors), add custom columns to content entry list views, create custom forms for Website Builder page types... extend the Lexical rich text editor" — comprehensive coverage including synonyms, matching the top anchor.

5 / 5

Distinctiveness Conflict Risk

Clearly niched to "Webiny Admin UI" with Webiny-specific API names (AdminConfig, useOpenDrawer), so it is distinguishable from generic React/UI skills with minimal conflict risk. Voice is third person ('Use this skill when the developer wants'), so no voice penalty applies.

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
webiny/webiny-js
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.