get-shit-pretty 0.5.2 → 0.6.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/.claude-plugin/plugin.json +1 -1
- package/bin/install.js +3 -0
- package/gsp/agents/gsp-builder.md +1 -1
- package/gsp/skills/gsp-accessibility/SKILL.md +51 -186
- package/gsp/skills/gsp-accessibility-audit/SKILL.md +218 -0
- package/gsp/skills/gsp-brand-audit/SKILL.md +1 -3
- package/gsp/skills/gsp-brand-identity/SKILL.md +1 -3
- package/gsp/skills/gsp-brand-patterns/SKILL.md +3 -9
- package/gsp/skills/gsp-brand-refine/SKILL.md +147 -0
- package/gsp/skills/gsp-brand-research/SKILL.md +1 -3
- package/gsp/skills/gsp-brand-strategy/SKILL.md +1 -3
- package/gsp/skills/gsp-brand-sync/SKILL.md +2 -4
- package/gsp/skills/gsp-doctor/SKILL.md +1 -1
- package/gsp/skills/gsp-help/SKILL.md +1 -0
- package/gsp/skills/gsp-launch/SKILL.md +3 -8
- package/gsp/skills/gsp-palette/SKILL.md +2 -0
- package/gsp/skills/gsp-project-brief/SKILL.md +3 -11
- package/gsp/skills/gsp-project-build/SKILL.md +2 -5
- package/gsp/skills/gsp-project-critique/SKILL.md +4 -8
- package/gsp/skills/gsp-project-design/SKILL.md +3 -9
- package/gsp/skills/gsp-project-research/SKILL.md +2 -5
- package/gsp/skills/gsp-project-review/SKILL.md +4 -6
- package/gsp/skills/gsp-start/SKILL.md +21 -118
- package/gsp/skills/gsp-style/SKILL.md +11 -174
- package/gsp/skills/gsp-typescale/SKILL.md +38 -161
- package/package.json +1 -1
package/bin/install.js
CHANGED
|
@@ -1704,6 +1704,9 @@ function finishInstall(settingsPath, settings, statuslineCommand, shouldInstallS
|
|
|
1704
1704
|
if (!onboardingShown && !hasQuiet) {
|
|
1705
1705
|
onboardingShown = true;
|
|
1706
1706
|
console.log(`
|
|
1707
|
+
${c.secondary}Design engineering for AI coding tools.${c.reset}
|
|
1708
|
+
${c.secondary}Brand strategy, visual identity, design systems, UI — built by agents.${c.reset}
|
|
1709
|
+
|
|
1707
1710
|
${c.bold}Get started:${c.reset}
|
|
1708
1711
|
${c.accent}${newCmd}${c.reset} ${c.secondary}start here — brand, project, or both${c.reset}
|
|
1709
1712
|
${c.accent}${helpCmd}${c.reset} ${c.secondary}all commands${c.reset}
|
|
@@ -50,7 +50,7 @@ Build a single screen. You receive only that screen's design chunk and its refer
|
|
|
50
50
|
### `full`
|
|
51
51
|
Legacy mode — build everything in one pass. Used as backward-compatible default.
|
|
52
52
|
|
|
53
|
-
**Chunk-aware mode:**
|
|
53
|
+
**Chunk-aware mode:** Work with the chunk context provided. Do not request additional files unless the chunks are insufficient for the task. This keeps your context lean and focused on the specific screen being built.
|
|
54
54
|
|
|
55
55
|
**Revision mode:** When `review/issues.md` is provided, you are re-entering the build phase to address QA issues. Read the issues, fix them in the codebase, and update BUILD-LOG.md with the revision.
|
|
56
56
|
</role>
|
|
@@ -1,42 +1,37 @@
|
|
|
1
1
|
---
|
|
2
2
|
name: accessibility
|
|
3
|
-
description:
|
|
3
|
+
description: Quick contrast checks and token WCAG audits — inline, no agent
|
|
4
4
|
user-invocable: true
|
|
5
5
|
allowed-tools:
|
|
6
6
|
- Read
|
|
7
7
|
- Write
|
|
8
8
|
- Bash
|
|
9
|
-
- Agent
|
|
10
9
|
- Glob
|
|
11
10
|
- Grep
|
|
12
11
|
- AskUserQuestion
|
|
13
12
|
---
|
|
14
13
|
<context>
|
|
15
14
|
Standalone composable accessibility skill. Works two ways:
|
|
16
|
-
1. **Standalone** — user runs `/gsp:accessibility` directly for
|
|
15
|
+
1. **Standalone** — user runs `/gsp:accessibility` directly for quick contrast checks or token audits
|
|
17
16
|
2. **As a building block** — critique and review phases detect prior accessibility output and reuse it
|
|
18
17
|
|
|
19
18
|
Follows the composable pattern: deterministic modes, predictable output paths, filesystem as integration layer.
|
|
19
|
+
|
|
20
|
+
For full design audits, code audits, or statement generation, use `/gsp:accessibility-audit`.
|
|
20
21
|
</context>
|
|
21
22
|
|
|
22
23
|
<objective>
|
|
23
|
-
Run accessibility
|
|
24
|
+
Run lightweight accessibility checks inline — contrast ratio lookups and token WCAG verification.
|
|
24
25
|
|
|
25
26
|
**Input:** Mode flag + optional arguments
|
|
26
|
-
**Output:**
|
|
27
|
-
**Agent:**
|
|
27
|
+
**Output:** Display output (check mode) or audit chunk (token mode)
|
|
28
|
+
**Agent:** None — this skill runs entirely inline
|
|
28
29
|
</objective>
|
|
29
30
|
|
|
30
|
-
<execution_context>
|
|
31
|
-
@${CLAUDE_SKILL_DIR}/../../prompts/08-accessibility-auditor.md
|
|
32
|
-
@${CLAUDE_SKILL_DIR}/../../references/wcag-checklist.md
|
|
33
|
-
</execution_context>
|
|
34
|
-
|
|
35
31
|
<rules>
|
|
36
32
|
- Always use `AskUserQuestion` for user interaction — never prompt via plain text
|
|
37
33
|
- Quick check mode (`--check`) produces display output only — no files written
|
|
38
34
|
- Token audit mode runs inline — no agent spawned
|
|
39
|
-
- Statement mode reads prior audit results — fails gracefully if none exist
|
|
40
35
|
- Default conformance level is AA unless overridden by `--level AAA` or config
|
|
41
36
|
- Foundation chunks follow `references/chunk-format.md` format
|
|
42
37
|
</rules>
|
|
@@ -46,39 +41,34 @@ Run accessibility audits in multiple modes — design, code, tokens, quick check
|
|
|
46
41
|
|
|
47
42
|
Read `$ARGUMENTS` to determine the mode:
|
|
48
43
|
|
|
49
|
-
| Input | Mode |
|
|
50
|
-
|
|
51
|
-
|
|
|
52
|
-
| `--tokens` | Token-only: contrast pairs, sizing, spacing |
|
|
53
|
-
|
|
|
54
|
-
| `--statement` | Generate accessibility statement from prior audits | No (inline) | `exports/accessibility-statement.md` |
|
|
55
|
-
| `--check #FG #BG` | Quick contrast check | No (inline, no files) | Display only |
|
|
44
|
+
| Input | Mode | Output |
|
|
45
|
+
|-------|------|--------|
|
|
46
|
+
| `--check #FG #BG` | Quick contrast check | Display only |
|
|
47
|
+
| `--tokens` | Token-only: contrast pairs, sizing, spacing | `critique/accessibility-token-audit.md` |
|
|
48
|
+
| (no args) | Mode picker | Prompt user |
|
|
56
49
|
|
|
57
50
|
Additional flag: `--level AAA` overrides conformance level (default: AA).
|
|
58
51
|
|
|
59
|
-
## Step 2:
|
|
52
|
+
## Step 2: Route by mode
|
|
60
53
|
|
|
61
|
-
###
|
|
54
|
+
### No args → mode picker
|
|
62
55
|
|
|
63
|
-
If
|
|
56
|
+
If no arguments provided, use `AskUserQuestion`:
|
|
64
57
|
|
|
65
|
-
|
|
58
|
+
**"What would you like to do?"**
|
|
59
|
+
- **Quick contrast check** — "check specific color pairs for WCAG contrast compliance"
|
|
60
|
+
- **Token audit** — "audit tokens.json for WCAG compliance"
|
|
61
|
+
- **Full design/code audit** — "run `/gsp:accessibility-audit` for full WCAG audits, code audits, or statement generation"
|
|
66
62
|
|
|
67
|
-
|
|
63
|
+
If user picks "Full design/code audit", tell them to run `/gsp:accessibility-audit` and stop.
|
|
68
64
|
|
|
69
|
-
|
|
65
|
+
### Quick check mode (`--check`)
|
|
70
66
|
|
|
71
|
-
|
|
72
|
-
- `accessibility_level` — override conformance level (if not set via `--level` flag)
|
|
73
|
-
- `implementation_target` — needed for code mode
|
|
67
|
+
If args contain `--check`, extract the two hex color values and skip to Step 3.
|
|
74
68
|
|
|
75
|
-
|
|
76
|
-
- Set `BRAND_PATH` = `.design/branding/{brand}`
|
|
69
|
+
### Token audit mode (`--tokens`)
|
|
77
70
|
|
|
78
|
-
|
|
79
|
-
1. `--level` flag (highest priority)
|
|
80
|
-
2. `accessibility_level` from config.json
|
|
81
|
-
3. Default: "WCAG 2.2 AA"
|
|
71
|
+
Skip to Step 4.
|
|
82
72
|
|
|
83
73
|
## Step 3: Quick check mode (`--check #FG #BG`)
|
|
84
74
|
|
|
@@ -114,7 +104,24 @@ Convert hex to relative luminance (sRGB linearization), then:
|
|
|
114
104
|
|
|
115
105
|
## Step 4: Token audit mode (`--tokens`)
|
|
116
106
|
|
|
117
|
-
|
|
107
|
+
### Resolve context
|
|
108
|
+
|
|
109
|
+
Resolve project from `.design/projects/` (one → use it, multiple → ask). Set `PROJECT_PATH`.
|
|
110
|
+
|
|
111
|
+
Read `{PROJECT_PATH}/config.json` to get:
|
|
112
|
+
- `accessibility_level` — override conformance level (if not set via `--level` flag)
|
|
113
|
+
|
|
114
|
+
Read `{PROJECT_PATH}/brand.ref` to resolve brand path:
|
|
115
|
+
- Set `BRAND_PATH` = `.design/branding/{brand}`
|
|
116
|
+
|
|
117
|
+
Determine final conformance level:
|
|
118
|
+
1. `--level` flag (highest priority)
|
|
119
|
+
2. `accessibility_level` from config.json
|
|
120
|
+
3. Default: "WCAG 2.2 AA"
|
|
121
|
+
|
|
122
|
+
### Read token and palette files
|
|
123
|
+
|
|
124
|
+
Read from the brand/project:
|
|
118
125
|
- `{BRAND_PATH}/identity/palettes.json`
|
|
119
126
|
- `{BRAND_PATH}/identity/color-system.md`
|
|
120
127
|
- `{BRAND_PATH}/patterns/tokens.json`
|
|
@@ -124,28 +131,28 @@ If files don't exist, report which are missing and stop.
|
|
|
124
131
|
|
|
125
132
|
### Token checks
|
|
126
133
|
|
|
127
|
-
**
|
|
134
|
+
**4.1 Contrast Pairs:**
|
|
128
135
|
- Extract every semantic foreground/background pair from tokens.json
|
|
129
136
|
- Calculate WCAG 2.x contrast ratio for each pair
|
|
130
137
|
- Flag failures: normal text < 4.5:1, large text < 3:1, non-text < 3:1
|
|
131
138
|
|
|
132
|
-
**
|
|
139
|
+
**4.2 Interactive States:**
|
|
133
140
|
- Check hover, active, focus, disabled state color pairs
|
|
134
141
|
- Verify disabled states still meet 3:1 non-text contrast
|
|
135
142
|
|
|
136
|
-
**
|
|
143
|
+
**4.3 Focus Ring:**
|
|
137
144
|
- Find focus ring token — check >= 3:1 contrast against adjacent backgrounds
|
|
138
145
|
- Verify ring width >= 2px
|
|
139
146
|
|
|
140
|
-
**
|
|
147
|
+
**4.4 Dark Mode:**
|
|
141
148
|
- If dark mode tokens exist, re-verify all contrast pairs
|
|
142
149
|
- Dark mode is a separate verification pass, not assumed from light mode
|
|
143
150
|
|
|
144
|
-
**
|
|
151
|
+
**4.5 Touch Targets:**
|
|
145
152
|
- Check button/link sizing tokens >= 44px for primary actions, >= 24px minimum
|
|
146
153
|
- Check spacing tokens between adjacent interactive elements
|
|
147
154
|
|
|
148
|
-
**
|
|
155
|
+
**4.6 Typography Minimums:**
|
|
149
156
|
- Body text >= 16px (1rem)
|
|
150
157
|
- Caption/small text >= 12px
|
|
151
158
|
- Line-height >= 1.5 for body text
|
|
@@ -193,156 +200,14 @@ Conformance target: {level}
|
|
|
193
200
|
### Completion
|
|
194
201
|
|
|
195
202
|
Display result and use `AskUserQuestion`:
|
|
196
|
-
- **Run full design audit** — "audit
|
|
197
|
-
- **Run code audit** — "check the codebase
|
|
203
|
+
- **Run full design audit** — "run `/gsp:accessibility-audit` for full WCAG design audit"
|
|
204
|
+
- **Run code audit** — "run `/gsp:accessibility-audit --code` to check the codebase"
|
|
198
205
|
- **Done** — "that's all for now"
|
|
199
206
|
|
|
200
|
-
## Step 5:
|
|
201
|
-
|
|
202
|
-
Verify design chunks exist:
|
|
203
|
-
- Read `{PROJECT_PATH}/design/INDEX.md` to find screen chunks
|
|
204
|
-
- If no design chunks, tell user to complete design phase first and stop
|
|
205
|
-
|
|
206
|
-
### Spawn agent
|
|
207
|
-
|
|
208
|
-
Spawn `gsp-accessibility-auditor` with:
|
|
209
|
-
- All design chunks from `{PROJECT_PATH}/design/`
|
|
210
|
-
- Brand identity context (color system, typography)
|
|
211
|
-
- Brand system context (tokens, components)
|
|
212
|
-
- Conformance level
|
|
213
|
-
- WCAG checklist reference
|
|
214
|
-
- **Output path:** `{PROJECT_PATH}/critique/`
|
|
215
|
-
- **Instructions:** "Audit all design screens against {level}. Write `accessibility-audit.md` and `accessibility-fixes.md` to the output path."
|
|
216
|
-
|
|
217
|
-
### Completion
|
|
218
|
-
|
|
219
|
-
Display result:
|
|
220
|
-
|
|
221
|
-
```
|
|
222
|
-
/gsp:accessibility — design audit complete
|
|
223
|
-
═══════════════════════════════════════
|
|
224
|
-
|
|
225
|
-
{PROJECT_PATH}/critique/
|
|
226
|
-
├── accessibility-audit.md
|
|
227
|
-
└── accessibility-fixes.md
|
|
228
|
-
|
|
229
|
-
─────────────────────────────────────
|
|
230
|
-
```
|
|
231
|
-
|
|
232
|
-
Use `AskUserQuestion`:
|
|
233
|
-
- **Run token audit** — "check design token contrast pairs"
|
|
234
|
-
- **Continue to build** — "implement designs in the codebase"
|
|
235
|
-
- **View audit** — "read the accessibility report"
|
|
236
|
-
- **Done** — "that's all for now"
|
|
237
|
-
|
|
238
|
-
## Step 6: Code audit mode (`--code`)
|
|
239
|
-
|
|
240
|
-
Determine codebase scope:
|
|
241
|
-
- Read `{PROJECT_PATH}/config.json` for `implementation_target`
|
|
242
|
-
- If build phase completed, read `{PROJECT_PATH}/build/BUILD-LOG.md` for file paths
|
|
243
|
-
- Otherwise, use `implementation_target` to determine where to look
|
|
244
|
-
|
|
245
|
-
### Spawn agent
|
|
246
|
-
|
|
247
|
-
Spawn `gsp-accessibility-auditor` with:
|
|
248
|
-
- Codebase paths to audit
|
|
249
|
-
- Brand system tokens (for contrast verification against hardcoded values)
|
|
250
|
-
- Conformance level
|
|
251
|
-
- WCAG checklist reference
|
|
252
|
-
- **Output path:** `{PROJECT_PATH}/review/`
|
|
253
|
-
- **Instructions:** "Code audit mode. Use Grep and Glob to find accessibility issues in the codebase. Check ARIA, keyboard handlers, semantic HTML, heading hierarchy, alt text, lang attributes, skip-nav, focus management. Write `accessibility-audit.md` and `accessibility-fixes.md` to the output path with actual file paths and line numbers."
|
|
254
|
-
|
|
255
|
-
### Completion
|
|
256
|
-
|
|
257
|
-
Display result:
|
|
258
|
-
|
|
259
|
-
```
|
|
260
|
-
/gsp:accessibility --code — code audit complete
|
|
261
|
-
═══════════════════════════════════════
|
|
262
|
-
|
|
263
|
-
{PROJECT_PATH}/review/
|
|
264
|
-
├── accessibility-audit.md
|
|
265
|
-
└── accessibility-fixes.md
|
|
266
|
-
|
|
267
|
-
─────────────────────────────────────
|
|
268
|
-
```
|
|
269
|
-
|
|
270
|
-
Use `AskUserQuestion`:
|
|
271
|
-
- **Fix issues** — "address the accessibility issues found"
|
|
272
|
-
- **Generate statement** — "create an accessibility statement"
|
|
273
|
-
- **View audit** — "read the code accessibility report"
|
|
274
|
-
- **Done** — "that's all for now"
|
|
275
|
-
|
|
276
|
-
## Step 7: Statement mode (`--statement`)
|
|
277
|
-
|
|
278
|
-
Read prior audit results:
|
|
279
|
-
- `{PROJECT_PATH}/critique/accessibility-audit.md`
|
|
280
|
-
- `{PROJECT_PATH}/critique/accessibility-token-audit.md`
|
|
281
|
-
- `{PROJECT_PATH}/review/accessibility-audit.md`
|
|
282
|
-
|
|
283
|
-
If none exist, tell the user to run an audit first and stop.
|
|
284
|
-
|
|
285
|
-
### Generate statement
|
|
286
|
-
|
|
287
|
-
Write `{PROJECT_PATH}/exports/accessibility-statement.md`:
|
|
288
|
-
|
|
289
|
-
```markdown
|
|
290
|
-
# Accessibility Statement
|
|
291
|
-
|
|
292
|
-
> Project: {name} | Generated: {DATE}
|
|
293
|
-
|
|
294
|
-
---
|
|
295
|
-
|
|
296
|
-
## Conformance Status
|
|
297
|
-
|
|
298
|
-
**Target:** {level}
|
|
299
|
-
**Status:** {Partially Conformant / Fully Conformant}
|
|
300
|
-
|
|
301
|
-
This {project description} has been evaluated against {level} standards.
|
|
302
|
-
|
|
303
|
-
## Scope
|
|
304
|
-
|
|
305
|
-
{Brief description of what was audited — design, code, or both}
|
|
306
|
-
|
|
307
|
-
## Known Limitations
|
|
308
|
-
|
|
309
|
-
{List from audit findings — critical/major issues not yet resolved}
|
|
310
|
-
|
|
311
|
-
- {Issue}: {brief description} — {planned resolution or workaround}
|
|
312
|
-
|
|
313
|
-
## Testing Methodology
|
|
314
|
-
|
|
315
|
-
- Design audit: WCAG 2.2 checklist review of all screens
|
|
316
|
-
- Token audit: Automated contrast ratio verification of all semantic color pairs
|
|
317
|
-
- Code audit: Manual and grep-based review of ARIA, keyboard, semantic HTML
|
|
318
|
-
- Tools used: {list from testing methodology}
|
|
319
|
-
|
|
320
|
-
## Feedback
|
|
321
|
-
|
|
322
|
-
If you encounter accessibility barriers, please contact:
|
|
323
|
-
|
|
324
|
-
- **Email:** [placeholder@example.com]
|
|
325
|
-
- **Response time:** [X business days]
|
|
326
|
-
|
|
327
|
-
## Assessment Date
|
|
328
|
-
|
|
329
|
-
Last reviewed: {DATE}
|
|
330
|
-
```
|
|
331
|
-
|
|
332
|
-
### Completion
|
|
333
|
-
|
|
334
|
-
Display result and use `AskUserQuestion`:
|
|
335
|
-
- **View statement** — "read the accessibility statement"
|
|
336
|
-
- **Done** — "that's all for now"
|
|
337
|
-
|
|
338
|
-
## Step 8: Update STATE.md
|
|
207
|
+
## Step 5: Update STATE.md
|
|
339
208
|
|
|
340
209
|
If within a project and files were written:
|
|
341
210
|
- Read `{PROJECT_PATH}/STATE.md`
|
|
342
211
|
- Note accessibility audit completion in the relevant phase section
|
|
343
212
|
- Do not change phase status — accessibility is a supplementary check
|
|
344
|
-
|
|
345
|
-
## Step 9: Completion output
|
|
346
|
-
|
|
347
|
-
If not already displayed by a mode-specific step above, display the appropriate completion output and `AskUserQuestion` routing.
|
|
348
213
|
</process>
|
|
@@ -0,0 +1,218 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: accessibility-audit
|
|
3
|
+
description: Full WCAG accessibility audit — design screens, codebase, or generate compliance statement
|
|
4
|
+
user-invocable: true
|
|
5
|
+
allowed-tools:
|
|
6
|
+
- Read
|
|
7
|
+
- Write
|
|
8
|
+
- Edit
|
|
9
|
+
- Bash
|
|
10
|
+
- Agent
|
|
11
|
+
- Glob
|
|
12
|
+
- Grep
|
|
13
|
+
- AskUserQuestion
|
|
14
|
+
---
|
|
15
|
+
<context>
|
|
16
|
+
Full accessibility audit skill that spawns the `gsp-accessibility-auditor` agent for deep WCAG analysis. Works two ways:
|
|
17
|
+
1. **Standalone** — user runs `/gsp:accessibility-audit` directly for design, code, or statement generation
|
|
18
|
+
2. **As a building block** — critique and review phases detect prior accessibility output and reuse it
|
|
19
|
+
|
|
20
|
+
For quick contrast checks or token audits, use `/gsp:accessibility` instead.
|
|
21
|
+
|
|
22
|
+
Follows the composable pattern: deterministic modes, predictable output paths, filesystem as integration layer.
|
|
23
|
+
</context>
|
|
24
|
+
|
|
25
|
+
<objective>
|
|
26
|
+
Run full accessibility audits — design screen reviews, codebase ARIA/keyboard/semantic checks, or compliance statement generation.
|
|
27
|
+
|
|
28
|
+
**Input:** Mode flag + optional arguments
|
|
29
|
+
**Output:** Audit chunks and fix lists in the appropriate project directory
|
|
30
|
+
**Agent:** `gsp-accessibility-auditor` (for design and code modes), inline for statement
|
|
31
|
+
</objective>
|
|
32
|
+
|
|
33
|
+
<execution_context>
|
|
34
|
+
@${CLAUDE_SKILL_DIR}/../../prompts/08-accessibility-auditor.md
|
|
35
|
+
@${CLAUDE_SKILL_DIR}/../../references/wcag-checklist.md
|
|
36
|
+
</execution_context>
|
|
37
|
+
|
|
38
|
+
<rules>
|
|
39
|
+
- Always use `AskUserQuestion` for user interaction — never prompt via plain text
|
|
40
|
+
- Statement mode reads prior audit results — fails gracefully if none exist
|
|
41
|
+
- Default conformance level is AA unless overridden by `--level AAA` or config
|
|
42
|
+
- Foundation chunks follow `references/chunk-format.md` format
|
|
43
|
+
</rules>
|
|
44
|
+
|
|
45
|
+
<process>
|
|
46
|
+
## Step 1: Parse invocation
|
|
47
|
+
|
|
48
|
+
Read `$ARGUMENTS` to determine the mode:
|
|
49
|
+
|
|
50
|
+
| Input | Mode | Agent? | Output |
|
|
51
|
+
|-------|------|--------|--------|
|
|
52
|
+
| (no args) | Design audit on `.design/` chunks | Yes (`gsp-accessibility-auditor`) | `critique/accessibility-audit.md` + `accessibility-fixes.md` |
|
|
53
|
+
| `--code` | Codebase audit: ARIA, keyboard, semantic HTML | Yes (`gsp-accessibility-auditor`) | `review/accessibility-audit.md` + `accessibility-fixes.md` |
|
|
54
|
+
| `--statement` | Generate accessibility statement from prior audits | No (inline) | `exports/accessibility-statement.md` |
|
|
55
|
+
|
|
56
|
+
Additional flag: `--level AAA` overrides conformance level (default: AA).
|
|
57
|
+
|
|
58
|
+
## Step 2: Resolve context
|
|
59
|
+
|
|
60
|
+
Resolve project from `.design/projects/` (one → use it, multiple → ask). Set `PROJECT_PATH`.
|
|
61
|
+
|
|
62
|
+
Read `{PROJECT_PATH}/config.json` to get:
|
|
63
|
+
- `accessibility_level` — override conformance level (if not set via `--level` flag)
|
|
64
|
+
- `implementation_target` — needed for code mode
|
|
65
|
+
|
|
66
|
+
Read `{PROJECT_PATH}/brand.ref` to resolve brand path:
|
|
67
|
+
- Set `BRAND_PATH` = `.design/branding/{brand}`
|
|
68
|
+
|
|
69
|
+
Determine final conformance level:
|
|
70
|
+
1. `--level` flag (highest priority)
|
|
71
|
+
2. `accessibility_level` from config.json
|
|
72
|
+
3. Default: "WCAG 2.2 AA"
|
|
73
|
+
|
|
74
|
+
## Step 3: Design audit mode (default, no flags)
|
|
75
|
+
|
|
76
|
+
Verify design chunks exist:
|
|
77
|
+
- Read `{PROJECT_PATH}/design/INDEX.md` to find screen chunks
|
|
78
|
+
- If no design chunks, tell user to complete design phase first and stop
|
|
79
|
+
|
|
80
|
+
### Spawn agent
|
|
81
|
+
|
|
82
|
+
Spawn `gsp-accessibility-auditor` with:
|
|
83
|
+
- All design chunks from `{PROJECT_PATH}/design/`
|
|
84
|
+
- Brand identity context (color system, typography)
|
|
85
|
+
- Brand system context (tokens, components)
|
|
86
|
+
- Conformance level
|
|
87
|
+
- WCAG checklist reference
|
|
88
|
+
- **Output path:** `{PROJECT_PATH}/critique/`
|
|
89
|
+
- **Instructions:** "Audit all design screens against {level}. Write `accessibility-audit.md` and `accessibility-fixes.md` to the output path."
|
|
90
|
+
|
|
91
|
+
### Completion
|
|
92
|
+
|
|
93
|
+
Display result:
|
|
94
|
+
|
|
95
|
+
```
|
|
96
|
+
/gsp:accessibility-audit — design audit complete
|
|
97
|
+
═══════════════════════════════════════
|
|
98
|
+
|
|
99
|
+
{PROJECT_PATH}/critique/
|
|
100
|
+
├── accessibility-audit.md
|
|
101
|
+
└── accessibility-fixes.md
|
|
102
|
+
|
|
103
|
+
─────────────────────────────────────
|
|
104
|
+
```
|
|
105
|
+
|
|
106
|
+
Use `AskUserQuestion`:
|
|
107
|
+
- **Run token audit** — "run `/gsp:accessibility --tokens` to check design token contrast pairs"
|
|
108
|
+
- **Continue to build** — "implement designs in the codebase"
|
|
109
|
+
- **View audit** — "read the accessibility report"
|
|
110
|
+
- **Done** — "that's all for now"
|
|
111
|
+
|
|
112
|
+
## Step 4: Code audit mode (`--code`)
|
|
113
|
+
|
|
114
|
+
Determine codebase scope:
|
|
115
|
+
- Read `{PROJECT_PATH}/config.json` for `implementation_target`
|
|
116
|
+
- If build phase completed, read `{PROJECT_PATH}/build/BUILD-LOG.md` for file paths
|
|
117
|
+
- Otherwise, use `implementation_target` to determine where to look
|
|
118
|
+
|
|
119
|
+
### Spawn agent
|
|
120
|
+
|
|
121
|
+
Spawn `gsp-accessibility-auditor` with:
|
|
122
|
+
- Codebase paths to audit
|
|
123
|
+
- Brand system tokens (for contrast verification against hardcoded values)
|
|
124
|
+
- Conformance level
|
|
125
|
+
- WCAG checklist reference
|
|
126
|
+
- **Output path:** `{PROJECT_PATH}/review/`
|
|
127
|
+
- **Instructions:** "Code audit mode. Use Grep and Glob to find accessibility issues in the codebase. Check ARIA, keyboard handlers, semantic HTML, heading hierarchy, alt text, lang attributes, skip-nav, focus management. Write `accessibility-audit.md` and `accessibility-fixes.md` to the output path with actual file paths and line numbers."
|
|
128
|
+
|
|
129
|
+
### Completion
|
|
130
|
+
|
|
131
|
+
Display result:
|
|
132
|
+
|
|
133
|
+
```
|
|
134
|
+
/gsp:accessibility-audit --code — code audit complete
|
|
135
|
+
═══════════════════════════════════════
|
|
136
|
+
|
|
137
|
+
{PROJECT_PATH}/review/
|
|
138
|
+
├── accessibility-audit.md
|
|
139
|
+
└── accessibility-fixes.md
|
|
140
|
+
|
|
141
|
+
─────────────────────────────────────
|
|
142
|
+
```
|
|
143
|
+
|
|
144
|
+
Use `AskUserQuestion`:
|
|
145
|
+
- **Fix issues** — "address the accessibility issues found"
|
|
146
|
+
- **Generate statement** — "create an accessibility statement"
|
|
147
|
+
- **View audit** — "read the code accessibility report"
|
|
148
|
+
- **Done** — "that's all for now"
|
|
149
|
+
|
|
150
|
+
## Step 5: Statement mode (`--statement`)
|
|
151
|
+
|
|
152
|
+
Read prior audit results:
|
|
153
|
+
- `{PROJECT_PATH}/critique/accessibility-audit.md`
|
|
154
|
+
- `{PROJECT_PATH}/critique/accessibility-token-audit.md`
|
|
155
|
+
- `{PROJECT_PATH}/review/accessibility-audit.md`
|
|
156
|
+
|
|
157
|
+
If none exist, tell the user to run an audit first and stop.
|
|
158
|
+
|
|
159
|
+
### Generate statement
|
|
160
|
+
|
|
161
|
+
Write `{PROJECT_PATH}/exports/accessibility-statement.md`:
|
|
162
|
+
|
|
163
|
+
```markdown
|
|
164
|
+
# Accessibility Statement
|
|
165
|
+
|
|
166
|
+
> Project: {name} | Generated: {DATE}
|
|
167
|
+
|
|
168
|
+
---
|
|
169
|
+
|
|
170
|
+
## Conformance Status
|
|
171
|
+
|
|
172
|
+
**Target:** {level}
|
|
173
|
+
**Status:** {Partially Conformant / Fully Conformant}
|
|
174
|
+
|
|
175
|
+
This {project description} has been evaluated against {level} standards.
|
|
176
|
+
|
|
177
|
+
## Scope
|
|
178
|
+
|
|
179
|
+
{Brief description of what was audited — design, code, or both}
|
|
180
|
+
|
|
181
|
+
## Known Limitations
|
|
182
|
+
|
|
183
|
+
{List from audit findings — critical/major issues not yet resolved}
|
|
184
|
+
|
|
185
|
+
- {Issue}: {brief description} — {planned resolution or workaround}
|
|
186
|
+
|
|
187
|
+
## Testing Methodology
|
|
188
|
+
|
|
189
|
+
- Design audit: WCAG 2.2 checklist review of all screens
|
|
190
|
+
- Token audit: Automated contrast ratio verification of all semantic color pairs
|
|
191
|
+
- Code audit: Manual and grep-based review of ARIA, keyboard, semantic HTML
|
|
192
|
+
- Tools used: {list from testing methodology}
|
|
193
|
+
|
|
194
|
+
## Feedback
|
|
195
|
+
|
|
196
|
+
If you encounter accessibility barriers, please contact:
|
|
197
|
+
|
|
198
|
+
- **Email:** [placeholder@example.com]
|
|
199
|
+
- **Response time:** [X business days]
|
|
200
|
+
|
|
201
|
+
## Assessment Date
|
|
202
|
+
|
|
203
|
+
Last reviewed: {DATE}
|
|
204
|
+
```
|
|
205
|
+
|
|
206
|
+
### Completion
|
|
207
|
+
|
|
208
|
+
Display result and use `AskUserQuestion`:
|
|
209
|
+
- **View statement** — "read the accessibility statement"
|
|
210
|
+
- **Done** — "that's all for now"
|
|
211
|
+
|
|
212
|
+
## Step 6: Update STATE.md
|
|
213
|
+
|
|
214
|
+
If within a project and files were written:
|
|
215
|
+
- Read `{PROJECT_PATH}/STATE.md`
|
|
216
|
+
- Note accessibility audit completion in the relevant phase section
|
|
217
|
+
- Do not change phase status — accessibility is a supplementary check
|
|
218
|
+
</process>
|
|
@@ -36,9 +36,7 @@ Audit an existing brand. Produce evolution map that guides research, strategy, a
|
|
|
36
36
|
<process>
|
|
37
37
|
## Step 1: Resolve brand
|
|
38
38
|
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
Set `BRAND_PATH` = `.design/branding/{brand}`
|
|
39
|
+
Resolve brand from `.design/branding/` (one → use it, multiple → ask). Set `BRAND_PATH`.
|
|
42
40
|
|
|
43
41
|
Read `{BRAND_PATH}/BRIEF.md` for aspirational direction.
|
|
44
42
|
Read `{BRAND_PATH}/config.json` to confirm `brand_mode` is `evolve`.
|
|
@@ -38,9 +38,7 @@ Build the brand's visual identity.
|
|
|
38
38
|
<process>
|
|
39
39
|
## Step 0: Resolve brand
|
|
40
40
|
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
Set `BRAND_PATH` = `.design/branding/{brand}`
|
|
41
|
+
Resolve brand from `.design/branding/` (one → use it, multiple → ask). Set `BRAND_PATH`.
|
|
44
42
|
If missing, tell user to run `/gsp:start` first.
|
|
45
43
|
|
|
46
44
|
## Step 1: Validate prerequisites
|
|
@@ -33,10 +33,7 @@ Build the design system, generate brand guidelines, and complete the branding di
|
|
|
33
33
|
<process>
|
|
34
34
|
## Step 0: Resolve brand
|
|
35
35
|
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
Set `BRAND_PATH` = `.design/branding/{brand}`
|
|
39
|
-
|
|
36
|
+
Resolve brand from `.design/branding/` (one → use it, multiple → ask). Set `BRAND_PATH`.
|
|
40
37
|
If BRAND_PATH doesn't exist, tell the user to run `/gsp:start` first.
|
|
41
38
|
|
|
42
39
|
## Step 1: Load context
|
|
@@ -45,14 +42,11 @@ If BRAND_PATH doesn't exist, tell the user to run `/gsp:start` first.
|
|
|
45
42
|
|
|
46
43
|
Read `{BRAND_PATH}/identity/INDEX.md`. If it exists, load all identity chunks + `palettes.json`.
|
|
47
44
|
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
If neither exists, check if identity phase is complete in brand STATE.md. If not, tell the user to complete brand identity first (run `/gsp:brand-identity`).
|
|
45
|
+
If INDEX.md doesn't exist, check if identity phase is complete in brand STATE.md. If not, tell the user to complete brand identity first (run `/gsp:brand-identity`).
|
|
51
46
|
|
|
52
47
|
### Strategy (selective, chunk-first)
|
|
53
48
|
|
|
54
49
|
Read `{BRAND_PATH}/strategy/INDEX.md`. If it exists, load selective chunks (voice-and-tone.md, brand-platform.md).
|
|
55
|
-
Fallback: read `{BRAND_PATH}/strategy/STRATEGY.md`.
|
|
56
50
|
|
|
57
51
|
### Brand context
|
|
58
52
|
|
|
@@ -109,7 +103,7 @@ Redesign the system from the ground up, informed by what exists.
|
|
|
109
103
|
## Step 3: Spawn pattern architect — Pass 1: Foundations
|
|
110
104
|
|
|
111
105
|
Spawn the `gsp-pattern-architect` agent with:
|
|
112
|
-
- All identity chunks
|
|
106
|
+
- All identity chunks + palettes.json
|
|
113
107
|
- The BRIEF.md content
|
|
114
108
|
- The Design System Architect prompt (01)
|
|
115
109
|
- The patterns output template
|