hatch3r 1.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +21 -0
- package/README.md +437 -0
- package/agents/hatch3r-a11y-auditor.md +126 -0
- package/agents/hatch3r-architect.md +160 -0
- package/agents/hatch3r-ci-watcher.md +123 -0
- package/agents/hatch3r-context-rules.md +97 -0
- package/agents/hatch3r-dependency-auditor.md +164 -0
- package/agents/hatch3r-devops.md +138 -0
- package/agents/hatch3r-docs-writer.md +97 -0
- package/agents/hatch3r-implementer.md +162 -0
- package/agents/hatch3r-learnings-loader.md +108 -0
- package/agents/hatch3r-lint-fixer.md +104 -0
- package/agents/hatch3r-perf-profiler.md +123 -0
- package/agents/hatch3r-researcher.md +642 -0
- package/agents/hatch3r-reviewer.md +81 -0
- package/agents/hatch3r-security-auditor.md +119 -0
- package/agents/hatch3r-test-writer.md +134 -0
- package/commands/hatch3r-agent-customize.md +146 -0
- package/commands/hatch3r-api-spec.md +49 -0
- package/commands/hatch3r-benchmark.md +50 -0
- package/commands/hatch3r-board-fill.md +504 -0
- package/commands/hatch3r-board-init.md +315 -0
- package/commands/hatch3r-board-pickup.md +672 -0
- package/commands/hatch3r-board-refresh.md +198 -0
- package/commands/hatch3r-board-shared.md +369 -0
- package/commands/hatch3r-bug-plan.md +410 -0
- package/commands/hatch3r-codebase-map.md +1182 -0
- package/commands/hatch3r-command-customize.md +94 -0
- package/commands/hatch3r-context-health.md +112 -0
- package/commands/hatch3r-cost-tracking.md +139 -0
- package/commands/hatch3r-dep-audit.md +171 -0
- package/commands/hatch3r-feature-plan.md +379 -0
- package/commands/hatch3r-healthcheck.md +307 -0
- package/commands/hatch3r-hooks.md +282 -0
- package/commands/hatch3r-learn.md +217 -0
- package/commands/hatch3r-migration-plan.md +51 -0
- package/commands/hatch3r-onboard.md +56 -0
- package/commands/hatch3r-project-spec.md +1153 -0
- package/commands/hatch3r-recipe.md +179 -0
- package/commands/hatch3r-refactor-plan.md +426 -0
- package/commands/hatch3r-release.md +328 -0
- package/commands/hatch3r-roadmap.md +556 -0
- package/commands/hatch3r-rule-customize.md +114 -0
- package/commands/hatch3r-security-audit.md +370 -0
- package/commands/hatch3r-skill-customize.md +93 -0
- package/commands/hatch3r-workflow.md +377 -0
- package/dist/cli/hooks-ZOTFDEA3.js +59 -0
- package/dist/cli/index.d.ts +2 -0
- package/dist/cli/index.js +3584 -0
- package/github-agents/hatch3r-docs-agent.md +46 -0
- package/github-agents/hatch3r-lint-agent.md +41 -0
- package/github-agents/hatch3r-security-agent.md +54 -0
- package/github-agents/hatch3r-test-agent.md +66 -0
- package/hooks/hatch3r-ci-failure.md +10 -0
- package/hooks/hatch3r-file-save.md +11 -0
- package/hooks/hatch3r-post-merge.md +10 -0
- package/hooks/hatch3r-pre-commit.md +11 -0
- package/hooks/hatch3r-pre-push.md +10 -0
- package/hooks/hatch3r-session-start.md +10 -0
- package/mcp/mcp.json +62 -0
- package/package.json +84 -0
- package/prompts/hatch3r-bug-triage.md +155 -0
- package/prompts/hatch3r-code-review.md +131 -0
- package/prompts/hatch3r-pr-description.md +173 -0
- package/rules/hatch3r-accessibility-standards.md +77 -0
- package/rules/hatch3r-accessibility-standards.mdc +75 -0
- package/rules/hatch3r-agent-orchestration.md +160 -0
- package/rules/hatch3r-api-design.md +176 -0
- package/rules/hatch3r-api-design.mdc +176 -0
- package/rules/hatch3r-browser-verification.md +73 -0
- package/rules/hatch3r-browser-verification.mdc +73 -0
- package/rules/hatch3r-ci-cd.md +70 -0
- package/rules/hatch3r-ci-cd.mdc +68 -0
- package/rules/hatch3r-code-standards.md +102 -0
- package/rules/hatch3r-code-standards.mdc +100 -0
- package/rules/hatch3r-component-conventions.md +102 -0
- package/rules/hatch3r-component-conventions.mdc +102 -0
- package/rules/hatch3r-data-classification.md +85 -0
- package/rules/hatch3r-data-classification.mdc +83 -0
- package/rules/hatch3r-dependency-management.md +17 -0
- package/rules/hatch3r-dependency-management.mdc +15 -0
- package/rules/hatch3r-error-handling.md +17 -0
- package/rules/hatch3r-error-handling.mdc +15 -0
- package/rules/hatch3r-feature-flags.md +112 -0
- package/rules/hatch3r-feature-flags.mdc +112 -0
- package/rules/hatch3r-git-conventions.md +47 -0
- package/rules/hatch3r-git-conventions.mdc +45 -0
- package/rules/hatch3r-i18n.md +90 -0
- package/rules/hatch3r-i18n.mdc +90 -0
- package/rules/hatch3r-learning-consult.md +29 -0
- package/rules/hatch3r-learning-consult.mdc +27 -0
- package/rules/hatch3r-migrations.md +17 -0
- package/rules/hatch3r-migrations.mdc +15 -0
- package/rules/hatch3r-observability.md +165 -0
- package/rules/hatch3r-observability.mdc +165 -0
- package/rules/hatch3r-performance-budgets.md +109 -0
- package/rules/hatch3r-performance-budgets.mdc +109 -0
- package/rules/hatch3r-secrets-management.md +76 -0
- package/rules/hatch3r-secrets-management.mdc +74 -0
- package/rules/hatch3r-security-patterns.md +211 -0
- package/rules/hatch3r-security-patterns.mdc +211 -0
- package/rules/hatch3r-testing.md +89 -0
- package/rules/hatch3r-testing.mdc +87 -0
- package/rules/hatch3r-theming.md +51 -0
- package/rules/hatch3r-theming.mdc +51 -0
- package/rules/hatch3r-tooling-hierarchy.md +92 -0
- package/rules/hatch3r-tooling-hierarchy.mdc +79 -0
- package/skills/hatch3r-a11y-audit/SKILL.md +131 -0
- package/skills/hatch3r-agent-customize/SKILL.md +75 -0
- package/skills/hatch3r-api-spec/SKILL.md +66 -0
- package/skills/hatch3r-architecture-review/SKILL.md +96 -0
- package/skills/hatch3r-bug-fix/SKILL.md +129 -0
- package/skills/hatch3r-ci-pipeline/SKILL.md +76 -0
- package/skills/hatch3r-command-customize/SKILL.md +67 -0
- package/skills/hatch3r-context-health/SKILL.md +76 -0
- package/skills/hatch3r-cost-tracking/SKILL.md +65 -0
- package/skills/hatch3r-dep-audit/SKILL.md +82 -0
- package/skills/hatch3r-feature/SKILL.md +129 -0
- package/skills/hatch3r-gh-agentic-workflows/SKILL.md +150 -0
- package/skills/hatch3r-incident-response/SKILL.md +86 -0
- package/skills/hatch3r-issue-workflow/SKILL.md +139 -0
- package/skills/hatch3r-logical-refactor/SKILL.md +73 -0
- package/skills/hatch3r-migration/SKILL.md +76 -0
- package/skills/hatch3r-perf-audit/SKILL.md +114 -0
- package/skills/hatch3r-pr-creation/SKILL.md +85 -0
- package/skills/hatch3r-qa-validation/SKILL.md +86 -0
- package/skills/hatch3r-recipe/SKILL.md +67 -0
- package/skills/hatch3r-refactor/SKILL.md +86 -0
- package/skills/hatch3r-release/SKILL.md +93 -0
- package/skills/hatch3r-rule-customize/SKILL.md +70 -0
- package/skills/hatch3r-skill-customize/SKILL.md +67 -0
- package/skills/hatch3r-visual-refactor/SKILL.md +89 -0
package/LICENSE
ADDED
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2026 hatch3r contributors
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
+
in the Software without restriction, including without limitation the rights
|
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
+
furnished to do so, subject to the following conditions:
|
|
11
|
+
|
|
12
|
+
The above copyright notice and this permission notice shall be included in all
|
|
13
|
+
copies or substantial portions of the Software.
|
|
14
|
+
|
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
+
SOFTWARE.
|
package/README.md
ADDED
|
@@ -0,0 +1,437 @@
|
|
|
1
|
+
# hatch3r
|
|
2
|
+
|
|
3
|
+
[](https://www.npmjs.com/package/hatch3r)
|
|
4
|
+
|
|
5
|
+
**Crack the egg. Hatch better agents.**
|
|
6
|
+
|
|
7
|
+
hatch3r is an open-source CLI and Cursor plugin that installs a battle-tested, tool-agnostic agentic coding setup into any repository. One command gives you 11 agents, 22 skills, 18 rules, 25 commands, and MCP integrations -- optimized for your coding tool of choice.
|
|
8
|
+
|
|
9
|
+
## Quick Start
|
|
10
|
+
|
|
11
|
+
Requires Node.js 22+.
|
|
12
|
+
|
|
13
|
+
```bash
|
|
14
|
+
npx hatch3r init
|
|
15
|
+
```
|
|
16
|
+
|
|
17
|
+
That's it. hatch3r detects your repo, asks which tools you use, and generates everything. Run into issues? See [Troubleshooting](docs/troubleshooting.md).
|
|
18
|
+
|
|
19
|
+
## What You Get
|
|
20
|
+
|
|
21
|
+
| Category | Count | Highlights |
|
|
22
|
+
|----------|-------|-----------|
|
|
23
|
+
| **Agents** | 11 | Code reviewer, test writer, security auditor, implementer (sub-agentic), researcher, and more |
|
|
24
|
+
| **Skills** | 22 | Bug fix, feature implementation, issue workflow, release, incident response, context health, cost tracking, recipes, customization, and more |
|
|
25
|
+
| **Rules** | 18 | Code standards, error handling, testing, API design, observability, theming, i18n, security patterns, agent orchestration, and more |
|
|
26
|
+
| **Commands** | 25 | Board init, board fill, board pickup, board refresh, planning (feature, bug, refactor), healthcheck, security-audit, context-health, cost-tracking, customization, and more |
|
|
27
|
+
| **MCP Servers** | 5 | GitHub, Context7, Filesystem, Playwright, Brave Search |
|
|
28
|
+
|
|
29
|
+
## Supported Tools
|
|
30
|
+
|
|
31
|
+
- **Cursor** -- `.mdc` rules, agents, skills, commands, MCP config
|
|
32
|
+
- **GitHub Copilot** -- instructions, prompts, GitHub agents
|
|
33
|
+
- **Claude Code** -- `CLAUDE.md`, skills, `.mcp.json`
|
|
34
|
+
- **OpenCode** -- `AGENTS.md`, `opencode.json`
|
|
35
|
+
- **Windsurf** -- `.windsurfrules`
|
|
36
|
+
- **Amp** -- `AGENTS.md`
|
|
37
|
+
- **Codex CLI** -- `AGENTS.md`, `codex.md`
|
|
38
|
+
- **Gemini CLI** -- `GEMINI.md`
|
|
39
|
+
- **Cline / Roo Code** -- `.clinerules`, `.cursorrules`
|
|
40
|
+
|
|
41
|
+
### MCP Configuration
|
|
42
|
+
|
|
43
|
+
**Connecting MCP servers**
|
|
44
|
+
|
|
45
|
+
- **Cursor (init):** MCP config is written to `.cursor/mcp.json` when you run `npx hatch3r init` and select MCP servers. Restart Cursor after init.
|
|
46
|
+
- **Cursor (plugin):** The plugin provides `mcp.json` at the project root. Cursor loads it from there or from `~/.cursor/mcp.json` (project-level takes precedence).
|
|
47
|
+
- **Claude Code:** Config goes to `.mcp.json` in the project root.
|
|
48
|
+
- **Other tools:** Copilot uses `.vscode/mcp.json`; Cline/Roo uses `.roo/mcp.json`.
|
|
49
|
+
|
|
50
|
+
**Managing secrets**
|
|
51
|
+
|
|
52
|
+
`hatch3r init` creates a `.env.mcp` file at the project root with all required environment variables for your selected MCP servers. This file is gitignored by default. Fill in your API keys:
|
|
53
|
+
|
|
54
|
+
```bash
|
|
55
|
+
# .env.mcp (generated by hatch3r init)
|
|
56
|
+
GITHUB_PAT=ghp_xxxx
|
|
57
|
+
BRAVE_API_KEY=xxxx
|
|
58
|
+
```
|
|
59
|
+
|
|
60
|
+
How secrets are loaded depends on your editor:
|
|
61
|
+
|
|
62
|
+
- **VS Code / Copilot**: Secrets load automatically from `.env.mcp` via the native `envFile` field -- no extra steps.
|
|
63
|
+
- **Cursor / Claude Code / others**: Source the file before launching your editor: `set -a && source .env.mcp && set +a && cursor .`
|
|
64
|
+
|
|
65
|
+
See [docs/mcp-setup.md](docs/mcp-setup.md) for full setup, per-server details, and PAT scope guidance.
|
|
66
|
+
|
|
67
|
+
## How It Works
|
|
68
|
+
|
|
69
|
+
```
|
|
70
|
+
/.agents/ <- Canonical source (tool-agnostic)
|
|
71
|
+
├── agents/
|
|
72
|
+
├── skills/
|
|
73
|
+
├── rules/
|
|
74
|
+
├── commands/
|
|
75
|
+
├── mcp/
|
|
76
|
+
├── AGENTS.md
|
|
77
|
+
└── hatch.json <- Manifest
|
|
78
|
+
|
|
79
|
+
.cursor/ <- Generated (Cursor adapter)
|
|
80
|
+
.github/ <- Generated (Copilot adapter)
|
|
81
|
+
CLAUDE.md <- Generated (Claude adapter)
|
|
82
|
+
.windsurfrules <- Generated (Windsurf adapter)
|
|
83
|
+
AGENTS.md <- Generated (OpenCode, Amp, Codex adapters)
|
|
84
|
+
GEMINI.md <- Generated (Gemini adapter)
|
|
85
|
+
.clinerules <- Generated (Cline adapter)
|
|
86
|
+
```
|
|
87
|
+
|
|
88
|
+
hatch3r keeps one source of truth in `/.agents/` and generates native configuration for each tool.
|
|
89
|
+
|
|
90
|
+
## Workflow
|
|
91
|
+
|
|
92
|
+
hatch3r provides a full project lifecycle, from setup to release. Here is the typical flow:
|
|
93
|
+
|
|
94
|
+
### 1. Initialize
|
|
95
|
+
|
|
96
|
+
```bash
|
|
97
|
+
npx hatch3r init
|
|
98
|
+
```
|
|
99
|
+
|
|
100
|
+
Interactive setup detects your repository, asks which coding tools you use (Cursor, Copilot, Claude Code, OpenCode, Windsurf, Amp, Codex CLI, Gemini CLI, Cline), and generates all agents, skills, rules, commands, and MCP configuration.
|
|
101
|
+
|
|
102
|
+
> **Next steps after init:** For a new project, run `project-spec`. For an existing codebase, run `codebase-map`. To plan a single feature, run `feature-plan`. To investigate a complex bug, run `bug-plan`. To plan a refactoring effort, run `refactor-plan`. Or skip straight to creating a `todo.md` and running `board-fill`.
|
|
103
|
+
|
|
104
|
+
### For new projects (greenfield)
|
|
105
|
+
|
|
106
|
+
If you're starting from scratch, use `project-spec` to generate documentation from your vision, then `roadmap` to create a phased plan:
|
|
107
|
+
|
|
108
|
+
1. Run `project-spec` with your project idea — produces `docs/specs/`, `docs/adr/`, and `todo.md`
|
|
109
|
+
2. Run `roadmap` to refine the plan into dependency-ordered epics
|
|
110
|
+
3. Continue with board-fill (step 4 below) to create GitHub issues
|
|
111
|
+
|
|
112
|
+
### For existing projects (brownfield)
|
|
113
|
+
|
|
114
|
+
If you're adding hatch3r to an existing codebase, use `codebase-map` to analyze what's already there:
|
|
115
|
+
|
|
116
|
+
1. Run `codebase-map` — spawns analyzers to discover modules, conventions, and tech debt
|
|
117
|
+
2. Run `roadmap` to plan improvements from the analysis
|
|
118
|
+
3. Continue with board-fill (step 4 below) to create GitHub issues
|
|
119
|
+
|
|
120
|
+
### 2. Set up the board
|
|
121
|
+
|
|
122
|
+
Run the `board-init` command to create or connect a GitHub Projects V2 board. You do not need to manually create a GitHub Project -- board-init handles project creation via GraphQL, configures status fields (Backlog, Ready, In Progress, In Review, Done), creates the full label taxonomy, and writes all IDs back to `hatch.json`.
|
|
123
|
+
|
|
124
|
+
### 3. Define work
|
|
125
|
+
|
|
126
|
+
Create a `todo.md` file at the project root with your planned work -- epics, features, bugs, refactors, anything. One item per line.
|
|
127
|
+
|
|
128
|
+
### 4. Fill the board
|
|
129
|
+
|
|
130
|
+
Run `board-fill` to parse `todo.md` and turn items into GitHub issues. board-fill classifies each item by type, priority, executor, area, and risk. It groups items into epics, analyzes dependencies, builds a dependency DAG, determines implementation order, identifies parallel work, and marks issues as `status:ready` when all readiness criteria are met.
|
|
131
|
+
|
|
132
|
+
### 5. Pick up work
|
|
133
|
+
|
|
134
|
+
Run `board-pickup` to auto-select the next best issue based on dependency order, priority, and readiness. It performs collision detection against in-progress work and open PRs, creates a branch, delegates implementation to the appropriate skill (or spawns parallel sub-agents for epics), runs quality checks, and creates a pull request with full board status sync.
|
|
135
|
+
|
|
136
|
+
### 6. Review cycle
|
|
137
|
+
|
|
138
|
+
The reviewer, test-writer, and security-auditor agents review the work. Address feedback, push fixes, and re-request review.
|
|
139
|
+
|
|
140
|
+
### 7. Release
|
|
141
|
+
|
|
142
|
+
Run the `release` command to cut a versioned release. It classifies merged PRs to determine the semantic version bump, generates a grouped changelog, runs quality gates, creates a git tag, publishes a GitHub release, and optionally triggers deployment.
|
|
143
|
+
|
|
144
|
+
## Commands
|
|
145
|
+
|
|
146
|
+
### CLI Commands
|
|
147
|
+
|
|
148
|
+
```bash
|
|
149
|
+
npx hatch3r init # Interactive setup
|
|
150
|
+
npx hatch3r sync # Re-generate from canonical state
|
|
151
|
+
npx hatch3r update # Pull latest templates (safe merge)
|
|
152
|
+
npx hatch3r status # Check sync status between canonical and generated files
|
|
153
|
+
npx hatch3r validate # Validate canonical .agents/ structure
|
|
154
|
+
```
|
|
155
|
+
|
|
156
|
+
### Agent Commands
|
|
157
|
+
|
|
158
|
+
These commands are invoked inside your coding tool (e.g., as Cursor commands):
|
|
159
|
+
|
|
160
|
+
**board-init** -- Bootstrap a GitHub Projects V2 board for your repository. Creates a new project or connects to an existing one, configures status fields with five default columns, creates the full hatch3r label taxonomy (type, executor, status, priority, risk, meta), prompts for default branch (main/master), optionally migrates issues from another project, and writes all project IDs back to `hatch.json`. All mutations require user confirmation.
|
|
161
|
+
|
|
162
|
+
**board-fill** -- Parse `todo.md` and create GitHub epics and issues with full board reorganization. Deduplicates against existing issues, classifies each item by type/executor/priority/area/risk, groups into epics, builds a dependency graph, determines implementation order, identifies parallel work lanes, and marks issues as `status:ready` when all readiness criteria are met. Reads project documentation and codebase context to produce well-scoped issues.
|
|
163
|
+
|
|
164
|
+
**board-pickup** -- Pick up the next best issue from the board for development. Auto-selects based on dependency order and priority when no specific issue is referenced. Performs collision detection against in-progress work, creates a branch, marks the issue in-progress, delegates to the appropriate implementation skill (or spawns parallel sub-agents for epics), runs quality checks, and creates a pull request with label transitions and Projects V2 status sync.
|
|
165
|
+
|
|
166
|
+
**board-refresh** -- Regenerate the living board overview dashboard on demand. Scans all open and recently closed issues, computes board health metrics (missing metadata, stale issues, blocked dependency chains), assigns recommended models using the quality-first heuristic, and updates the `meta:board-overview` issue with current status tables, epic progress, and health diagnostics. No user prompts required.
|
|
167
|
+
|
|
168
|
+
**board-shared** -- Shared context and procedures referenced by all board commands. Provides board configuration from `hatch.json`, GitHub context, Projects V2 sync procedure, label taxonomy, tooling directives, and token-saving guidelines. Not invoked directly.
|
|
169
|
+
|
|
170
|
+
**healthcheck** -- Create a full-product QA and testing audit epic. Discovers logical modules from the project's directory structure, creates a parent epic with one sub-issue per module plus cross-cutting audits for inter-module wiring and product vision alignment. Each audit sub-issue, when picked up via board-pickup, performs deep static analysis and produces a findings epic with actionable sub-issues.
|
|
171
|
+
|
|
172
|
+
**security-audit** -- Create a full-product security audit epic. Discovers logical modules from the project's directory structure, creates a parent epic with one sub-issue per module plus cross-cutting audits for trust boundaries and OWASP Top 10 alignment. Each module sub-issue audits 7 security domains (authentication, input validation, data protection, access control, secret management, error handling, API security) and produces a findings epic with severity-rated, actionable sub-issues.
|
|
173
|
+
|
|
174
|
+
**dep-audit** -- Scan, assess, and upgrade npm dependencies. Runs `npm audit` and `npm outdated` across root and workspace packages, categorizes findings by severity (CVEs, major/minor/patch outdated), researches migration paths via Context7 and web search, upgrades packages one at a time with testing after each, and creates tracking issues for any unaddressed items.
|
|
175
|
+
|
|
176
|
+
**release** -- Cut a versioned release with changelog. Determines the semantic version bump from merged PR classifications, generates a grouped changelog (features, fixes, refactors, docs, infra), runs quality verification, bumps `package.json`, creates a git tag, publishes a GitHub release with notes, and optionally verifies deployment.
|
|
177
|
+
|
|
178
|
+
**project-spec** -- Generate complete project documentation from a project vision using parallel researcher sub-agents (stack, features, architecture, pitfalls, UX, business model & market, production & scale). Produces `docs/specs/`, `docs/adr/`, and `todo.md`. Works for any project type -- web apps, APIs, CLIs, libraries, or monorepos.
|
|
179
|
+
|
|
180
|
+
**codebase-map** -- Analyze an existing codebase to reverse-engineer specifications. Spawns parallel analyzer sub-agents to discover modules, dependencies, conventions, and tech debt. Outputs structured documentation to `docs/specs/` and `docs/adr/`.
|
|
181
|
+
|
|
182
|
+
**roadmap** -- Generate a phased roadmap from specs or project vision. Breaks work into epics and features with dependency ordering and parallel work lane identification. Outputs to `todo.md` in `board-fill` format, ready for immediate board population.
|
|
183
|
+
|
|
184
|
+
**feature-plan** -- Plan a single feature in depth. Spawns parallel researcher sub-agents (codebase impact, feature design, architecture, risk & pitfalls) to break a feature idea into a detailed spec, ADR(s) when architectural decisions are involved, and structured `todo.md` entries for `board-fill`. Optionally chains directly into `board-fill` to create GitHub issues.
|
|
185
|
+
|
|
186
|
+
**bug-plan** -- Plan a complex bug investigation. Spawns parallel researcher sub-agents (symptom tracer, root cause investigator, impact assessor, regression researcher) to diagnose ambiguous bugs where the root cause is unknown. Produces an investigation report (`docs/investigations/`) with ranked hypotheses, evidence, and reproduction strategy, plus scoped `todo.md` entries for `board-fill`. Use when reproducing is non-trivial or multiple modules might be involved.
|
|
187
|
+
|
|
188
|
+
**refactor-plan** -- Plan a refactoring or migration effort. Spawns parallel researcher sub-agents (current state analyzer, strategy designer, impact/risk assessor, migration path planner) to design a phased execution plan. Auto-detects the refactoring dimension (structural, logical, visual, migration, or mixed) and adapts researcher prompts accordingly. Produces a refactoring spec, ADR(s), and phased `todo.md` entries mapped to the appropriate execution skill.
|
|
189
|
+
|
|
190
|
+
**workflow** -- Guided development lifecycle with 4 phases: Analyze, Plan, Implement, and Review. Includes a quick mode for small tasks that skips unnecessary ceremony. Scale-adaptive -- adjusts depth based on issue complexity and scope.
|
|
191
|
+
|
|
192
|
+
**hooks** -- Interactive hook management for event-driven agent activation. View, add, remove, and test lifecycle hooks that trigger agents on specific events (e.g., post-commit, pre-push, issue assignment). Supports both local and CI hook targets.
|
|
193
|
+
|
|
194
|
+
**learn** -- Capture learnings from completed issues, code reviews, and architectural decisions into reusable knowledge files. Learnings are indexed by topic and auto-consulted when similar work is encountered in the future.
|
|
195
|
+
|
|
196
|
+
**context-health** -- Monitor conversation context health and detect degradation during long agent sessions. Provides metrics on token usage, context window utilization, and recommendations for when to start a fresh session.
|
|
197
|
+
|
|
198
|
+
**cost-tracking** -- Track token usage and estimated costs across agent workflows. Provides per-command and per-agent cost breakdowns with budget alerts.
|
|
199
|
+
|
|
200
|
+
**recipe** -- Create and manage composable workflow recipes. Recipes are reusable workflow templates that chain multiple commands and skills into repeatable sequences.
|
|
201
|
+
|
|
202
|
+
**agent-customize** -- Configure per-agent customization via `.customize.yaml` files. Allows project-specific agent behavior overrides without modifying managed agent definitions.
|
|
203
|
+
|
|
204
|
+
**command-customize** -- Configure per-command customization via `.customize.yaml` files. Allows project-specific command behavior overrides without modifying managed command definitions.
|
|
205
|
+
|
|
206
|
+
**skill-customize** -- Configure per-skill customization via `.customize.yaml` files. Allows project-specific skill behavior overrides without modifying managed skill definitions.
|
|
207
|
+
|
|
208
|
+
**rule-customize** -- Configure per-rule customization via `.customize.yaml` files. Allows project-specific rule behavior overrides without modifying managed rule definitions.
|
|
209
|
+
|
|
210
|
+
## Agents
|
|
211
|
+
|
|
212
|
+
| Agent | Description |
|
|
213
|
+
|-------|-------------|
|
|
214
|
+
| **a11y-auditor** | Accessibility specialist who audits WCAG AA compliance -- keyboard navigation, color contrast, ARIA attributes, and reduced motion support. |
|
|
215
|
+
| **ci-watcher** | CI/CD specialist who monitors GitHub Actions runs, reads failure logs to identify root causes, and suggests focused fixes with local verification commands. |
|
|
216
|
+
| **dependency-auditor** | Supply chain security analyst who scans for CVEs, evaluates upgrade paths, assesses bundle size impact, and verifies lockfile integrity. |
|
|
217
|
+
| **docs-writer** | Technical writer who maintains specs, ADRs, glossary, and process documentation, keeping them in sync with code changes. |
|
|
218
|
+
| **implementer** | Focused implementation agent for a single sub-issue. Receives issue context from a parent orchestrator, delivers code and tests, and reports structured results. Does not handle git or board operations. |
|
|
219
|
+
| **lint-fixer** | Code quality enforcer who fixes ESLint, Prettier, and TypeScript strict mode violations without changing logic. Removes dead code and unused imports. |
|
|
220
|
+
| **perf-profiler** | Performance engineer who profiles runtime performance, analyzes bundle size, identifies memory leaks, and benchmarks against defined performance budgets. |
|
|
221
|
+
| **researcher** | Research specialist who performs deep investigation on assigned topics using parallel analysis. Used as a sub-agent by planning commands (project-spec, feature-plan, bug-plan, refactor-plan). |
|
|
222
|
+
| **reviewer** | Senior code reviewer who checks for correctness, security, privacy invariants, performance regressions, and accessibility. Outputs structured feedback by priority (critical, warning, suggestion). |
|
|
223
|
+
| **security-auditor** | Security analyst who audits database rules, cloud functions, and data flows. Verifies privacy invariants, writes security rules tests, and validates entitlement enforcement. |
|
|
224
|
+
| **test-writer** | QA engineer who writes deterministic, isolated tests -- unit, integration, E2E, security rules, and contract tests. Focuses on edge cases and regression coverage. |
|
|
225
|
+
|
|
226
|
+
## Skills
|
|
227
|
+
|
|
228
|
+
| Skill | Description |
|
|
229
|
+
|-------|-------------|
|
|
230
|
+
| **a11y-audit** | Comprehensive WCAG AA audit with automated scanning, manual verification, and fix implementation. |
|
|
231
|
+
| **agent-customize** | Configure per-agent customization via `.customize.yaml` files. |
|
|
232
|
+
| **architecture-review** | Evaluate architectural decisions, compare options with pros/cons, and produce ADRs following the project template. |
|
|
233
|
+
| **bug-fix** | Diagnose root cause, implement minimal fix, and write a regression test that fails before the fix. TDD/test-first workflow option. |
|
|
234
|
+
| **command-customize** | Configure per-command customization via `.customize.yaml` files. |
|
|
235
|
+
| **context-health** | Monitor conversation context health and detect degradation during long sessions. |
|
|
236
|
+
| **cost-tracking** | Track token usage and estimated costs across agent workflows. |
|
|
237
|
+
| **dep-audit** | Audit npm dependencies for CVEs and freshness, research migration paths, upgrade one at a time with testing. |
|
|
238
|
+
| **feature** | End-to-end feature implementation as a vertical slice covering data model, domain logic, API, and UI. TDD/test-first workflow option. |
|
|
239
|
+
| **gh-agentic-workflows** | Set up GitHub Agentic Workflows for continuous AI-powered triage, testing, and documentation automation. Includes DoD, verification, troubleshooting, and rollback. |
|
|
240
|
+
| **incident-response** | Structured triage, mitigation, root cause analysis, and post-mortem for production incidents with follow-up issues. |
|
|
241
|
+
| **issue-workflow** | 8-step development workflow for GitHub issues: parse, load skill, read specs, plan, implement, test, PR, address review. |
|
|
242
|
+
| **logical-refactor** | Change business logic or data flows without adding features, with explicit invariant tracking and verification. |
|
|
243
|
+
| **perf-audit** | Profile and optimize against defined performance budgets with before/after measurements for every change. |
|
|
244
|
+
| **pr-creation** | Create pull requests following project conventions -- branch naming, PR template, self-review checklist, and size guidelines. |
|
|
245
|
+
| **qa-validation** | E2E validation workflow producing structured pass/fail reports with evidence and ship/hold recommendations. |
|
|
246
|
+
| **recipe** | Create and manage composable workflow recipes. |
|
|
247
|
+
| **refactor** | Internal code quality improvement without changing external behavior, with behavioral preservation tests. |
|
|
248
|
+
| **release** | Cut a release with semantic versioning, changelog generation, pre-release/RC support, git tagging, and deploy verification. |
|
|
249
|
+
| **rule-customize** | Configure per-rule customization via `.customize.yaml` files. |
|
|
250
|
+
| **skill-customize** | Configure per-skill customization via `.customize.yaml` files. |
|
|
251
|
+
| **visual-refactor** | UI/UX changes matching design mockups with WCAG AA accessibility and responsiveness verification. |
|
|
252
|
+
|
|
253
|
+
## Rules
|
|
254
|
+
|
|
255
|
+
| Rule | Description |
|
|
256
|
+
|------|-------------|
|
|
257
|
+
| **agent-orchestration** | Agent delegation patterns, sub-agent spawning conventions, result aggregation, and multi-agent coordination protocols. |
|
|
258
|
+
| **api-design** | Endpoint versioning, request validation, idempotency keys, structured error responses, auth, CORS, CSP, pagination, and webhook security. |
|
|
259
|
+
| **browser-verification** | When and how to verify UI changes in the browser via automation MCP — dev server lifecycle, navigation, interaction, visual regression, screenshot evidence. |
|
|
260
|
+
| **code-standards** | TypeScript strict mode, naming conventions (`camelCase`/`PascalCase`/`SCREAMING_SNAKE`), and function/file length limits. |
|
|
261
|
+
| **component-conventions** | Component structure, typed props/emits, design tokens, WCAG AA accessibility, loading/error/empty states, form UX, and 60fps render targets. |
|
|
262
|
+
| **dependency-management** | Lockfile hygiene, new-dependency justification, CVE patching timelines (48h for critical), and bundle size budgets. |
|
|
263
|
+
| **error-handling** | Structured error hierarchy, typed error codes, exponential backoff for retries, and correlation IDs for tracing. |
|
|
264
|
+
| **feature-flags** | Flag naming (`FF_AREA_FEATURE`), storage, evaluation, gradual rollout, dependencies, kill switches, 30-day cleanup deadlines, and audit. |
|
|
265
|
+
| **git-conventions** | Git workflow, branch naming, commit message conventions, and merge strategy. |
|
|
266
|
+
| **i18n** | Internationalization, RTL support, locale management, and ICU message format. |
|
|
267
|
+
| **learning-consult** | When and how to consult project learnings during development. |
|
|
268
|
+
| **migrations** | Backward-compatible schema changes, idempotent scripts, rollback plans, and deploy-then-migrate ordering. |
|
|
269
|
+
| **observability** | Structured JSON logging, OpenTelemetry, SLO/SLI, distributed tracing, alerting, dashboards, and no PII in logs. |
|
|
270
|
+
| **performance-budgets** | Core Web Vitals, API latency, database query budgets, bundle size, and enforcement mechanisms. |
|
|
271
|
+
| **security-patterns** | Input validation, output encoding, auth enforcement, AI/agentic security, and OWASP alignment. |
|
|
272
|
+
| **testing** | Deterministic, isolated, fast tests with clear naming, regression coverage, no network in unit tests, no `any`. |
|
|
273
|
+
| **theming** | Dark mode, `prefers-color-scheme`, CSS custom properties, and semantic color tokens. |
|
|
274
|
+
| **tooling-hierarchy** | Priority order for knowledge: project specs > codebase > library docs (Context7 MCP) > web research; GitHub CLI-first. |
|
|
275
|
+
|
|
276
|
+
## Board Management
|
|
277
|
+
|
|
278
|
+
hatch3r includes a complete board management system for GitHub-based workflows:
|
|
279
|
+
|
|
280
|
+
- **board-init** -- Create or connect a GitHub Projects V2 board with status fields, label taxonomy, and optional migration
|
|
281
|
+
- **board-fill** -- Parse `todo.md`, create epics/issues, deduplicate, analyze dependencies, set implementation order
|
|
282
|
+
- **board-pickup** -- Auto-pick the next best issue, check collisions, delegate to sub-agents, create PRs
|
|
283
|
+
- **board-refresh** -- Regenerate the board overview dashboard with current state, health metrics, and model recommendations
|
|
284
|
+
- **board-shared** -- Configurable shared context (org, repo, project board IDs, label taxonomy)
|
|
285
|
+
|
|
286
|
+
Configure your board in `hatch.json`:
|
|
287
|
+
|
|
288
|
+
```json
|
|
289
|
+
{
|
|
290
|
+
"board": {
|
|
291
|
+
"owner": "my-org",
|
|
292
|
+
"repo": "my-repo",
|
|
293
|
+
"projectNumber": 1,
|
|
294
|
+
"areas": ["area:frontend", "area:backend", "area:infra"]
|
|
295
|
+
},
|
|
296
|
+
"models": {
|
|
297
|
+
"default": "opus",
|
|
298
|
+
"agents": {
|
|
299
|
+
"hatch3r-lint-fixer": "sonnet"
|
|
300
|
+
}
|
|
301
|
+
}
|
|
302
|
+
}
|
|
303
|
+
```
|
|
304
|
+
|
|
305
|
+
## Model Selection
|
|
306
|
+
|
|
307
|
+
hatch3r lets you set preferred AI models per agent. Configure via `hatch.json` (global default and per-agent overrides), canonical agent frontmatter (`model: opus` in `.agents/agents/*.md`), or `.hatch3r/agents/{id}.customize.yaml`. Resolution order: customization file > manifest per-agent > agent frontmatter > manifest default. If you omit `models`, each tool uses its own default.
|
|
308
|
+
|
|
309
|
+
See [docs/model-selection.md](docs/model-selection.md) for the full guide, aliases, and platform support.
|
|
310
|
+
|
|
311
|
+
## Sub-Agentic Architecture
|
|
312
|
+
|
|
313
|
+
hatch3r includes a proven sub-agentic delegation system:
|
|
314
|
+
|
|
315
|
+
- **Implementer agent** -- Receives a single sub-issue, delivers code + tests, reports back
|
|
316
|
+
- **Issue workflow skill** -- 8-step structured workflow with parallel sub-agent delegation for epics
|
|
317
|
+
- **Board pickup** -- Dependency-aware auto-pick with collision detection and sub-agent orchestration
|
|
318
|
+
- **Tooling hierarchy** -- Project docs > Codebase search > Library docs (Context7) > Web research
|
|
319
|
+
|
|
320
|
+
## Documentation Structure
|
|
321
|
+
|
|
322
|
+
hatch3r projects use a `docs/` folder with three core subdirectories. The docs-writer agent reads source code and maintains these docs automatically, keeping specs, decisions, and processes in sync with implementation.
|
|
323
|
+
|
|
324
|
+
```
|
|
325
|
+
docs/
|
|
326
|
+
specs/ Modular specifications with stable IDs
|
|
327
|
+
adr/ Architecture Decision Records
|
|
328
|
+
process/ Process documentation
|
|
329
|
+
```
|
|
330
|
+
|
|
331
|
+
### `docs/specs/` -- Specifications
|
|
332
|
+
|
|
333
|
+
Modular spec files that define what the system does. Each spec covers one logical domain (data model, event model, auth, etc.) and uses stable IDs for cross-referencing.
|
|
334
|
+
|
|
335
|
+
| File | Purpose |
|
|
336
|
+
|------|---------|
|
|
337
|
+
| `00_glossary.md` | Term definitions, stable ID prefixes, TOC for all specs |
|
|
338
|
+
| `01_core-engine.md` | Core engine behavior, invariants, acceptance criteria |
|
|
339
|
+
| `02_event-model.md` | Event schemas, lifecycle, validation rules |
|
|
340
|
+
| `03_quality-engineering.md` | Performance budgets, testing pyramid, coverage targets |
|
|
341
|
+
|
|
342
|
+
Conventions:
|
|
343
|
+
- Every spec starts with a **Purpose** section and ends with **Owner / Reviewers / Last updated**.
|
|
344
|
+
- Use stable IDs from the glossary (e.g., `INV-001`, `EVT_USER_CREATED`) so agents and humans can reference specific requirements across docs, issues, and code.
|
|
345
|
+
- Feature matrices, invariants, and schemas use tables. Acceptance criteria use checklists.
|
|
346
|
+
|
|
347
|
+
### `docs/adr/` -- Architecture Decision Records
|
|
348
|
+
|
|
349
|
+
Numbered records that capture significant architectural decisions, their context, and consequences.
|
|
350
|
+
|
|
351
|
+
| File | Purpose |
|
|
352
|
+
|------|---------|
|
|
353
|
+
| `0001_template.md` | ADR template with required sections |
|
|
354
|
+
| `0002_adapter-pattern.md` | Example: why the project uses an adapter pattern |
|
|
355
|
+
|
|
356
|
+
Each ADR includes: Status, Date, Decision Makers, Context, Decision, Alternatives Considered (with pros/cons table), Consequences, Compliance checklist, and Related links. New ADRs use the next available number and are saved as `XXXX_short-title.md`. Superseded ADRs are updated to reference their replacement.
|
|
357
|
+
|
|
358
|
+
### `docs/process/` -- Process Documentation
|
|
359
|
+
|
|
360
|
+
Guides for recurring workflows -- how the team (human or agent) ships, reviews, and maintains the project.
|
|
361
|
+
|
|
362
|
+
Examples: branching strategy, release process, on-call runbook, code review checklist, agent delegation guidelines.
|
|
363
|
+
|
|
364
|
+
### Relationship to the GSD Framework
|
|
365
|
+
|
|
366
|
+
The [GSD (Get Shit Done)](https://github.com/gsd-build/get-shit-done) framework is a spec-driven development system for AI coding assistants. hatch3r shares GSD's conviction that structured documentation prevents context degradation, but the two projects organize that documentation differently.
|
|
367
|
+
|
|
368
|
+
**Shared principles:**
|
|
369
|
+
|
|
370
|
+
- Documentation is the primary context source for AI agents, not just a reference for humans.
|
|
371
|
+
- Specifications are modular and scoped to single domains rather than monolithic.
|
|
372
|
+
- State and decisions are captured in version-controlled markdown, not ephemeral chat.
|
|
373
|
+
- Stable identifiers enable reliable cross-referencing across docs, code, and issues.
|
|
374
|
+
|
|
375
|
+
**Structural differences:**
|
|
376
|
+
|
|
377
|
+
| Concern | GSD | hatch3r |
|
|
378
|
+
|---------|-----|---------|
|
|
379
|
+
| Project state | `STATE.md` (single file, session memory) | `docs/specs/` (distributed across domain specs) |
|
|
380
|
+
| Requirements | `REQUIREMENTS.md` (flat, phase-tagged) | `docs/specs/*.md` (modular, per-domain with stable IDs) |
|
|
381
|
+
| Architectural decisions | Inline in `STATE.md` or plans | `docs/adr/` (dedicated, numbered, templated) |
|
|
382
|
+
| Project vision | `PROJECT.md` | `docs/specs/00_glossary.md` + project README |
|
|
383
|
+
| Process docs | Encoded in GSD commands and agents | `docs/process/` (explicit, human-readable guides) |
|
|
384
|
+
| Planning artifacts | `.planning/` (research, plans, summaries) | GitHub Issues + board commands |
|
|
385
|
+
| Scope | Single-project, single-runtime | Multi-project, multi-editor via adapters |
|
|
386
|
+
|
|
387
|
+
GSD optimizes for a linear milestone-driven workflow with a single AI runtime. hatch3r's `docs/` structure is editor-agnostic and designed to be consumed by any agent system -- Cursor, Copilot, Claude Code, OpenCode, or custom tooling. The explicit `docs/adr/` directory reflects hatch3r's emphasis on long-lived, multi-contributor projects where architectural decisions need formal traceability rather than inline state tracking.
|
|
388
|
+
|
|
389
|
+
## Presets
|
|
390
|
+
|
|
391
|
+
hatch3r currently ships with the `default` preset which includes everything. Additional preset packs (web-app, api-service, cli-tool, monorepo, legacy, security) are planned for future releases.
|
|
392
|
+
|
|
393
|
+
## Customization
|
|
394
|
+
|
|
395
|
+
hatch3r uses a naming convention to separate managed from custom files:
|
|
396
|
+
|
|
397
|
+
- `hatch3r-*` files are managed by hatch3r
|
|
398
|
+
- Files without the prefix are your customizations and are never touched
|
|
399
|
+
|
|
400
|
+
**All hatch3r-generated markdown files** (rules, agents, skills, commands, bridge files, shared instruction files like `AGENTS.md`, `CLAUDE.md`, `.windsurfrules`) use managed blocks. Only the content between `<!-- HATCH3R:BEGIN -->` and `<!-- HATCH3R:END -->` is updated on `hatch3r sync` or `hatch3r update`. Content you add outside these markers is preserved. Config files (JSON, TOML, YAML) are fully regenerated.
|
|
401
|
+
|
|
402
|
+
```
|
|
403
|
+
.cursor/rules/
|
|
404
|
+
hatch3r-code-standards.mdc # Managed — add custom content outside the block
|
|
405
|
+
hatch3r-error-handling.mdc # Managed — add custom content outside the block
|
|
406
|
+
my-project-conventions.mdc # Custom — never touched
|
|
407
|
+
```
|
|
408
|
+
|
|
409
|
+
Example: add your own sections to any hatch3r file:
|
|
410
|
+
|
|
411
|
+
```markdown
|
|
412
|
+
<!-- HATCH3R:BEGIN -->
|
|
413
|
+
...managed content (updated on sync/update)...
|
|
414
|
+
<!-- HATCH3R:END -->
|
|
415
|
+
|
|
416
|
+
## My Custom Section
|
|
417
|
+
...never overwritten...
|
|
418
|
+
```
|
|
419
|
+
|
|
420
|
+
## Cursor Plugin
|
|
421
|
+
|
|
422
|
+
hatch3r is also available as a [Cursor plugin](https://cursor.com/marketplace). Enable it in your Cursor settings for instant access to all rules, skills, agents, and commands without running `init`.
|
|
423
|
+
|
|
424
|
+
## Community Packs
|
|
425
|
+
|
|
426
|
+
Community pack support is coming soon.
|
|
427
|
+
|
|
428
|
+
## Documentation
|
|
429
|
+
|
|
430
|
+
- [MCP Setup](docs/mcp-setup.md) — Connecting MCP servers and managing secrets
|
|
431
|
+
- [Adapter Capability Matrix](docs/adapter-capability-matrix.md) — Per-tool support and output paths
|
|
432
|
+
- [Model Selection](docs/model-selection.md) — Configuring AI models per agent
|
|
433
|
+
- [Troubleshooting](docs/troubleshooting.md) — Common issues and solutions
|
|
434
|
+
|
|
435
|
+
## License
|
|
436
|
+
|
|
437
|
+
MIT
|
|
@@ -0,0 +1,126 @@
|
|
|
1
|
+
---
|
|
2
|
+
id: hatch3r-a11y-auditor
|
|
3
|
+
description: Accessibility specialist who audits for WCAG AA compliance. Use when auditing accessibility, reviewing UI components, or fixing a11y issues.
|
|
4
|
+
model: sonnet
|
|
5
|
+
---
|
|
6
|
+
You are an accessibility specialist for the project.
|
|
7
|
+
|
|
8
|
+
## Your Role
|
|
9
|
+
|
|
10
|
+
- You audit WCAG AA compliance across the web app and embedded surfaces.
|
|
11
|
+
- You verify keyboard navigation for all interactive elements.
|
|
12
|
+
- You check color contrast ratios against the 4.5:1 minimum.
|
|
13
|
+
- You validate ARIA attributes and live regions for dynamic content.
|
|
14
|
+
- You ensure `prefers-reduced-motion` is respected for all animations.
|
|
15
|
+
|
|
16
|
+
## Key Files
|
|
17
|
+
|
|
18
|
+
- UI components (e.g., `src/ui/**/*.vue` or equivalent)
|
|
19
|
+
- Embedded widgets or IDE surfaces
|
|
20
|
+
|
|
21
|
+
## Key Specs
|
|
22
|
+
|
|
23
|
+
- Project documentation on quality engineering and accessibility requirements
|
|
24
|
+
|
|
25
|
+
## Browser-Based Audit
|
|
26
|
+
|
|
27
|
+
Use browser automation MCP to perform live accessibility audits in the running application:
|
|
28
|
+
|
|
29
|
+
- Start the dev server if not already running.
|
|
30
|
+
- Navigate to each page or surface being audited.
|
|
31
|
+
- **Keyboard navigation:** Tab through all interactive elements in the browser. Verify logical tab order, visible focus indicators, and no focus traps. Test Escape for modals, Enter/Space for buttons.
|
|
32
|
+
- **Color contrast:** Inspect rendered text against backgrounds in the live UI. Use browser DevTools or screenshots to verify contrast ratios.
|
|
33
|
+
- **ARIA and screen reader:** Check that dynamic content updates trigger `aria-live` announcements. Verify ARIA attributes render correctly in the DOM via browser inspection.
|
|
34
|
+
- **Reduced motion:** Enable `prefers-reduced-motion: reduce` in browser DevTools and verify animations are disabled or simplified.
|
|
35
|
+
- **Screenshot evidence:** Capture screenshots of each audited surface for the audit report.
|
|
36
|
+
|
|
37
|
+
Browser verification provides ground-truth confirmation that cannot be achieved through static code analysis alone.
|
|
38
|
+
|
|
39
|
+
## Standards to Enforce
|
|
40
|
+
|
|
41
|
+
| Requirement | Standard | Details |
|
|
42
|
+
| ------------------- | -------- | ---------------------------------------------------------------- |
|
|
43
|
+
| Reduced motion | WCAG 2.1 | All animations respect `prefers-reduced-motion` and user setting |
|
|
44
|
+
| Color contrast | WCAG AA | Text contrast ratio ≥ 4.5:1 |
|
|
45
|
+
| Keyboard navigation | WCAG 2.1 | All interactive elements focusable with visible focus indicator |
|
|
46
|
+
| Screen reader | WCAG 2.1 | Dynamic state announced via `aria-live` regions |
|
|
47
|
+
| High contrast mode | Custom | User-configurable high contrast theme supported |
|
|
48
|
+
|
|
49
|
+
## Commands
|
|
50
|
+
|
|
51
|
+
- Run tests to verify no regression after a11y changes
|
|
52
|
+
- Run lint to catch a11y lint rules (e.g., vuejs-accessibility, eslint-plugin-jsx-a11y)
|
|
53
|
+
|
|
54
|
+
## External Knowledge
|
|
55
|
+
|
|
56
|
+
Follow the tooling hierarchy (specs > codebase > Context7 MCP > web research). Prefer `gh` CLI over GitHub MCP tools.
|
|
57
|
+
|
|
58
|
+
## Sub-Agent Delegation
|
|
59
|
+
|
|
60
|
+
When auditing multiple pages or surfaces:
|
|
61
|
+
|
|
62
|
+
1. **Identify audit targets**: List all pages/routes/surfaces to audit.
|
|
63
|
+
2. **Spawn one sub-agent per surface** using the Task tool. Provide: surface URL/route, relevant component files, WCAG criteria to check.
|
|
64
|
+
3. **Run surface audits in parallel** — as many as the platform supports.
|
|
65
|
+
4. **Aggregate findings** from all sub-agents into a single consolidated report.
|
|
66
|
+
5. **De-duplicate findings** that appear across multiple surfaces (e.g., shared component with missing focus indicator).
|
|
67
|
+
|
|
68
|
+
## Output Format
|
|
69
|
+
|
|
70
|
+
```
|
|
71
|
+
## Accessibility Audit Result: {surface/page}
|
|
72
|
+
|
|
73
|
+
**Status:** PASS | PARTIAL | FAIL
|
|
74
|
+
|
|
75
|
+
**Findings:**
|
|
76
|
+
|
|
77
|
+
| # | Severity | WCAG Criterion | Description | Location | Fix Suggestion |
|
|
78
|
+
|---|----------|---------------|-------------|----------|----------------|
|
|
79
|
+
| 1 | Critical | 2.1.1 Keyboard | ... | ... | ... |
|
|
80
|
+
|
|
81
|
+
**Summary:**
|
|
82
|
+
- Critical: {n} | Major: {n} | Minor: {n}
|
|
83
|
+
- WCAG AA compliance: {YES/NO}
|
|
84
|
+
- Reduced motion: {VERIFIED/NOT VERIFIED}
|
|
85
|
+
|
|
86
|
+
**Browser verification:**
|
|
87
|
+
- VERIFIED | SKIPPED | N/A
|
|
88
|
+
- (screenshots or observations)
|
|
89
|
+
|
|
90
|
+
**Issues encountered:**
|
|
91
|
+
- (blockers, missing test infrastructure, etc.)
|
|
92
|
+
|
|
93
|
+
**Notes:**
|
|
94
|
+
- (follow-up items, deferred minor findings)
|
|
95
|
+
```
|
|
96
|
+
|
|
97
|
+
## Boundaries
|
|
98
|
+
|
|
99
|
+
- **Always:** Test keyboard navigation, contrast, ARIA attributes, and reduced motion support. Use browser MCP for live verification when available.
|
|
100
|
+
- **Ask first:** Before changing component APIs or props for a11y (may affect consumers)
|
|
101
|
+
- **Never:** Remove existing a11y features, ignore contrast requirements, or skip `prefers-reduced-motion` for animations
|
|
102
|
+
|
|
103
|
+
## Example
|
|
104
|
+
|
|
105
|
+
**Invocation:** Audit the settings page for WCAG AA compliance.
|
|
106
|
+
|
|
107
|
+
**Output:**
|
|
108
|
+
|
|
109
|
+
```
|
|
110
|
+
## Accessibility Audit Result: Settings Page
|
|
111
|
+
|
|
112
|
+
**Status:** PARTIAL
|
|
113
|
+
|
|
114
|
+
**Findings:**
|
|
115
|
+
|
|
116
|
+
| # | Severity | WCAG Criterion | Description | Location | Fix Suggestion |
|
|
117
|
+
|---|----------|---------------|-------------|----------|----------------|
|
|
118
|
+
| 1 | Critical | 2.1.1 Keyboard | Theme toggle button not focusable via Tab key | src/components/ThemeToggle.vue | Add `tabindex="0"` and `role="switch"` with `aria-checked` |
|
|
119
|
+
| 2 | Major | 1.4.3 Contrast | "Save" button text contrast is 3.2:1 against background | src/components/SettingsForm.vue | Change button text to `--color-text-primary` token (4.8:1) |
|
|
120
|
+
| 3 | Minor | 4.1.2 Name/Role | Dropdown menu has no accessible label | src/components/LocaleSelector.vue | Add `aria-label="Select language"` |
|
|
121
|
+
|
|
122
|
+
**Summary:**
|
|
123
|
+
- Critical: 1 | Major: 1 | Minor: 1
|
|
124
|
+
- WCAG AA compliance: NO (1 keyboard blocker)
|
|
125
|
+
- Reduced motion: VERIFIED — all animations respect prefers-reduced-motion
|
|
126
|
+
```
|