@a11y-gate/cli

Dev-time CLI that scans your React/Next.js project via AST and generates the a11y-gate.config.json consumed by @a11y-gate/core.

Install

npm install --save-dev @a11y-gate/cli
# or
pnpm add -D @a11y-gate/cli

Commands

a11y-gate scan

Walks your src/ directory, identifies React components with typed props, and outputs raw-metadata.json.

npx a11y-gate scan
# or with options:
npx a11y-gate scan --src src --output raw-metadata.json

Options:

| Flag | Default | Description | |---|---|---| | -s, --src <dir> | src | Source directory to scan | | -o, --output <file> | raw-metadata.json | Output path |

Output example (raw-metadata.json):

[
  {
    "componentName": "LegacyDrawer",
    "path": "src/components/layout/Drawer.tsx",
    "props": ["isOpen", "title", "onClose", "width"]
  }
]

a11y-gate review

Interactive prompt that annotates raw-metadata.json and writes a11y-gate.config.json. Re-running preserves existing values as defaults.

npx a11y-gate review

Options:

| Flag | Default | Description | |---|---|---| | -i, --input <file> | raw-metadata.json | Input metadata file | | -o, --output <file> | a11y-gate.config.json | Output config path | | -e, --existing <file> | (auto-detected) | Existing config for defaults |

Output example (a11y-gate.config.json):

{
  "version": "1",
  "components": [
    {
      "componentName": "LegacyDrawer",
      "componentType": "side-tray",
      "triggerProp": "isOpen",
      "closeHandler": "onClose",
      "rootSelector": "#root"
    }
  ]
}

Workflow

npx a11y-gate scan       # 1. Extract component metadata
# (optional) pipe raw-metadata.json through an LLM via your IDE to pre-fill intent
npx a11y-gate review     # 2. Annotate and approve → a11y-gate.config.json

The CLI is LLM-agnostic. The scan output is structured for easy LLM processing, but annotating manually via review works equally well.