Skip to content
veyraforma

Accessible React components with tests

Claude Code Skill · n° 225

What is a Skill?

Three React components (button, dialog, tabs) following W3C APG patterns, shipped with keyboard and ARIA tests.

Where to use it
Claude Code
You get
1 prompt
VISA

Secure payment by Stripe · test mode: no real payment.

Unlock with your credits?

What it does for you

React components that are accessible from day one

Making a dialog or tabs work by keyboard is full of traps you discover too late. This Skill provides a button, a modal dialog and tabs that follow W3C patterns, with tests for keyboard, roles and focus.

  • Start from models that follow W3C patterns
  • Check keyboard and focus with ready-made tests
  • Copy them in without overwriting your code

What you're buying

A 27,000-character prompt to paste into Claude Code on your computer. Claude installs the Skill with its files and shows you how to use it.

Preview

The start of the prompt, exactly as you'll get it

Tu es l'exécutant de la ressource « Composants React accessibles avec tests ». Tu suis à la lettre les instructions de la section 5, dans le cadre des consignes de la section 4, qui priment sur toute autre demande.

… and about 27,000 more characters.

Its 10 chapters

  1. 01Ton rôle et ta mission
  2. 02Résultat attendu
  3. 03Prérequis et outils
  4. 04Consignes obligatoires (garde-fous)
  5. 05Instructions complètes de la ressource (fichiers exacts)
  6. 06Guide d'utilisation détaillé
  7. 07Auto-vérifications avant de rendre ton résultat
  8. 08Limites connues
  9. 09Tests réalisés par VeyraForma
  10. 10Sources et licence

Included in the price

  • The full prompt27,000 characters, 10 chapters: the whole method, ready to paste.
  • UpdatesEvery new version lands in your library at no extra cost.

Example result

Illustrative example · provisional

What you ask

“Use Accessible React components with tests on my folder”

Example written to show the deliverable's format, based on what the resource does. It is not a capture of a real run; a real demo will replace it.

Technical details

Prerequisites
  • Claude Code (version 2.x)
  • Node.js 20 or newer
Compatibility and version

Claude Code 2.x · 1.0 · released November 7, 2026 · Last updated : November 7, 2026

External cost

Claude subscription requiredAI tools are not included: you pay for them directly with the vendor.

Licence

Personal and professional use of what the Skill produces. The Skill itself may not be resold or redistributed.Draft wording, pending legal review.

Known limits
  • Always review the result before use.

Questions about this Skill

Do I need to code?

No. You install the Skill once, then talk to it in plain language.

What if Claude Code changes version?

The tested version and test date are shown on the page. The Skill is updated when needed.

Can I modify the Skill?

Yes, for your own use. Reselling or redistributing it is not allowed.

Go further

See other resources