CtrlK
BlogDocsLog inGet started
Tessl Logo
SkillPublic

bestax-migrate

Migrate an existing React app to @allxsmith/bestax-bulma on Bulma v1, from raw Bulma CSS classes on plain JSX (className="button is-primary") or in static HTML pages and templates styled with Bulma, or from an unmaintained React Bulma library (react-bulma-components v4, rbx v2, bloomer 0.6). Run the bestax-migrate codemod, then resolve every TODO(bestax-migrate) comment it leaves using the per-source mapping references. Use when a React app styles its markup with Bulma classes and wants bestax components instead, when static HTML pages or templates styled with Bulma should become React components, when a repo imports react-bulma-components, rbx or bloomer, when TODO(bestax-migrate) comments are present in a codebase, or when asked to convert Bulma classNames to bestax-bulma.

Quality

95%

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

92%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 workflow-oriented skill body: fully executable commands with real paths, a clearly sequenced six-step process with dry-run validation and error-recovery loops, and clean progressive disclosure into verified per-source reference files. Its only weakness is prose density — a handful of sentences pack multiple clauses and would benefit from being split or trimmed.

Suggestions

Split the most clause-heavy sentences (the Font Awesome/Icon rules in the bulma-classes headline, the step-1 HTML-module paragraph) into shorter declarative statements or a small list — the information density is high but several sentences require multiple reads to parse.

Move or compress the version-history asides inside the source table (e.g. "abandoned 2019, pins Bulma 0.7.5 plus four extensions") into the per-source reference pages, keeping only the decision-relevant fact (Bulma version gap) inline.

DimensionReasoningScore

Conciseness

The body assumes Claude's competence throughout — no explanations of what React, Bulma, or codemods are — and nearly every token carries codemod-specific knowledge Claude cannot know (exit-code semantics, re-run safety, per-source risks), so token efficiency is high. It falls at 4 rather than 5 because several sentences are syntactically overloaded and could be tightened without losing information, e.g. "Font Awesome's own hidden `<i>` in a `.icon` that carries nothing else assistive tech reads becomes `Icon`, which hides the `.icon` instead, the glyph hidden either way" and the long paragraph in step 1 about HTML page modules.

4 / 5

Actionability

Commands are copy-paste ready with real paths and flags: `pnpm dlx bestax-migrate <source> src/ --dry`, `pnpm dlx bestax-migrate bulma-classes src/pages/login/index.html --dry`, `pnpm dlx bestax-migrate bulma-classes -e html src/pages/ --dry`, `grep -rn "TODO(bestax-migrate)" src/`, `npm install`. The `<source>` placeholder is concretely resolved by the table, flags (--css bulma|keep, --no-deps, -e html,htm) are documented, and report entry types are named. This matches the 5 anchor's executable guidance covering the common cases; it is not 4 because there are no meaningful gaps in executable detail.

5 / 5

Workflow Clarity

Six clearly ordered steps (dry-run → apply → install → resolve TODOs → stylesheet → finish) with explicit validation up front ("Dry-run the codemod... and review the report") and error-recovery feedback loops: "A file that fails to parse or transform... Fix that file and run the codemod on it again", plus re-run guidance after fixing a TODO and a final typecheck/build with side-by-side UI review. The batch-operation cap of 3 does not apply because validation checkpoints are explicit; this matches the 5 anchor (clear sequence, explicit validation, feedback loops).

5 / 5

Progressive Disclosure

The body is an overview that drives the workflow while per-source detail is split one level deep into references/<source>/component-map.md, prop-map.md, unmappables.md plus the shared references/css-migration.md — all verified to exist and to contain the claimed content (e.g. dynamic-class and html-* recipes in references/bulma-classes/unmappables.md). References are clearly signaled via the source table and inline links, and the "Source-specific headlines" stay at headline level to inform source selection rather than duplicating the reference detail. This matches the 5 anchor: clear overview, well-signaled one-level-deep references, easy navigation.

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.

An exemplary description: it states concrete actions with a comprehensive enumeration of migration sources, provides an explicit multi-trigger "Use when" clause covering natural user phrasings, and occupies a distinct niche via named libraries. The length is dense but every clause carries information — no fluff to penalize.

DimensionReasoningScore

Specificity

Multiple concrete actions are stated — "Migrate an existing React app to @allxsmith/bestax-bulma on Bulma v1", "Run the bestax-migrate codemod, then resolve every TODO(bestax-migrate) comment" — and the migration sources are enumerated concretely ("raw Bulma CSS classes on plain JSX (className="button is-primary")", "react-bulma-components v4, rbx v2, bloomer 0.6"). Coverage is comprehensive rather than having minor gaps, matching the 5 anchor; it is well above the 4 anchor's "several specific actions; minor gaps".

5 / 5

Completeness

Both questions are answered explicitly: the what ("Run the bestax-migrate codemod, then resolve every TODO... using the per-source mapping references") and the when, via a full "Use when..." clause listing five concrete triggers. This matches the 5 anchor's "clearly and explicitly answers both what AND when with concrete trigger phrases"; a missing or weak 'when' would cap it at 3, but the trigger clause is explicit and specific.

5 / 5

Trigger Term Quality

Natural phrases a user would actually say are comprehensively covered: "Bulma classes", "react-bulma-components, rbx or bloomer", "static HTML pages or templates", "convert Bulma classNames to bestax-bulma", "TODO(bestax-migrate) comments". Synonyms are included (classes/classNames, HTML pages/templates), and library names are exactly what a user with this need would mention. Not 4: no common variation of the request is missing.

5 / 5

Distinctiveness Conflict Risk

The description names its exact niche — migrating to a specific library (@allxsmith/bestax-bulma) from specific named predecessors or Bulma classes — so triggers are distinct and unlikely to fire for an unrelated skill. It matches the 5 anchor ("clear niche with distinct triggers; minimal conflict risk"); the 4 anchor's "minor overlap risk with closely related skills" does not apply since the library names are unique to this task.

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.

Validation — 14 / 16 Passed

Validation for skill structure

CriteriaDescriptionResult

relative_links

Relative link issues: 5 deeper-than-1-level

Warning

referenced_paths_exist

Referenced path issues: 7 deeper-than-1-level

Warning

Total

14

/

16

Passed

Repository

allxsmith/bestax

Path

skills/bestax-migrate/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.