@heihei0299/matt-skills 1.3.2 → 1.5.2
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/.agents/skills/ci-guard/SKILL.md +94 -0
- package/.agents/skills/ci-guard/agents/openai.yaml +5 -0
- package/.agents/skills/commit-check/SKILL.md +13 -18
- package/.agents/skills/diagnose-fix/SKILL.md +0 -1
- package/.agents/skills/grill-to-spec/SKILL.md +0 -3
- package/.agents/skills/instance-test/SKILL.md +36 -27
- package/.agents/skills/instance-test/agents/openai.yaml +1 -1
- package/.agents/skills/instance-test/references/instances.md +63 -36
- package/.agents/skills/scaffold-functional-test/SKILL.md +75 -0
- package/.agents/skills/scaffold-functional-test/agents/openai.yaml +5 -0
- package/.agents/skills/tdd-implement/SKILL.md +0 -1
- package/.agents/skills/tdd-implement/references/orchestration.md +2 -2
- package/.agents/skills/tdd-implement/references/stages.md +2 -7
- package/README.md +55 -54
- package/bin/cli.js +216 -64
- package/config/engineering.json +20 -0
- package/config/proprietary.json +8 -1
- package/package.json +2 -1
- package/scripts/sync-upstream.js +69 -43
- package/template/.agents/skills/ask-matt/PHASE-BOUNDARIES.md +55 -0
- package/template/.agents/skills/ask-matt/SKILL.md +90 -0
- package/template/.agents/skills/ask-matt/agents/openai.yaml +5 -0
- package/template/.agents/skills/ci-guard/SKILL.md +94 -0
- package/template/.agents/skills/ci-guard/agents/openai.yaml +5 -0
- package/template/.agents/skills/code-review/SKILL.md +87 -0
- package/template/.agents/skills/code-review/agents/openai.yaml +3 -0
- package/template/.agents/skills/codebase-design/DEEPENING.md +37 -0
- package/template/.agents/skills/codebase-design/DESIGN-IT-TWICE.md +44 -0
- package/template/.agents/skills/codebase-design/SKILL.md +114 -0
- package/template/.agents/skills/codebase-design/agents/openai.yaml +3 -0
- package/template/{.opencode → .agents}/skills/commit-check/SKILL.md +13 -18
- package/template/{.pi → .agents}/skills/diagnose-fix/SKILL.md +0 -1
- package/template/.agents/skills/diagnosing-bugs/SKILL.md +138 -0
- package/template/.agents/skills/diagnosing-bugs/agents/openai.yaml +3 -0
- package/template/.agents/skills/diagnosing-bugs/scripts/hitl-loop.template.sh +44 -0
- package/template/.agents/skills/domain-modeling/ADR-FORMAT.md +47 -0
- package/template/.agents/skills/domain-modeling/CONTEXT-FORMAT.md +60 -0
- package/template/.agents/skills/domain-modeling/SKILL.md +74 -0
- package/template/.agents/skills/domain-modeling/agents/openai.yaml +3 -0
- package/template/.agents/skills/grill-me/SKILL.md +7 -0
- package/template/.agents/skills/grill-me/agents/openai.yaml +5 -0
- package/template/{.pi → .agents}/skills/grill-to-spec/SKILL.md +0 -3
- package/template/.agents/skills/grill-with-docs/SKILL.md +7 -0
- package/template/.agents/skills/grill-with-docs/agents/openai.yaml +5 -0
- package/template/.agents/skills/grilling/SKILL.md +28 -0
- package/template/.agents/skills/grilling/agents/openai.yaml +3 -0
- package/template/.agents/skills/handoff/SKILL.md +16 -0
- package/template/.agents/skills/handoff/agents/openai.yaml +5 -0
- package/template/.agents/skills/implement/SKILL.md +15 -0
- package/template/.agents/skills/implement/agents/openai.yaml +5 -0
- package/template/.agents/skills/improve-codebase-architecture/HTML-REPORT.md +123 -0
- package/template/.agents/skills/improve-codebase-architecture/SKILL.md +71 -0
- package/template/.agents/skills/improve-codebase-architecture/agents/openai.yaml +5 -0
- package/template/.agents/skills/instance-test/SKILL.md +70 -0
- package/template/.agents/skills/instance-test/agents/openai.yaml +5 -0
- package/template/.agents/skills/instance-test/references/instances.md +75 -0
- package/template/.agents/skills/prototype/LOGIC.md +67 -0
- package/template/.agents/skills/prototype/SKILL.md +26 -0
- package/template/.agents/skills/prototype/UI.md +112 -0
- package/template/.agents/skills/prototype/agents/openai.yaml +3 -0
- package/template/.agents/skills/research/SKILL.md +12 -0
- package/template/.agents/skills/research/agents/openai.yaml +3 -0
- package/template/.agents/skills/resolving-merge-conflicts/SKILL.md +14 -0
- package/template/.agents/skills/resolving-merge-conflicts/agents/openai.yaml +3 -0
- package/template/.agents/skills/scaffold-functional-test/SKILL.md +75 -0
- package/template/.agents/skills/scaffold-functional-test/agents/openai.yaml +5 -0
- package/template/.agents/skills/setup-matt-pocock-skills/SKILL.md +116 -0
- package/template/.agents/skills/setup-matt-pocock-skills/agents/openai.yaml +5 -0
- package/template/.agents/skills/setup-matt-pocock-skills/domain.md +51 -0
- package/template/.agents/skills/setup-matt-pocock-skills/issue-tracker-github.md +45 -0
- package/template/.agents/skills/setup-matt-pocock-skills/issue-tracker-gitlab.md +46 -0
- package/template/.agents/skills/setup-matt-pocock-skills/issue-tracker-local.md +30 -0
- package/template/.agents/skills/setup-matt-pocock-skills/triage-labels.md +15 -0
- package/template/.agents/skills/tdd/SKILL.md +38 -0
- package/template/.agents/skills/tdd/agents/openai.yaml +3 -0
- package/template/.agents/skills/tdd/mocking.md +59 -0
- package/template/.agents/skills/tdd/tests.md +77 -0
- package/template/{.opencode → .agents}/skills/tdd-implement/SKILL.md +0 -1
- package/template/{.pi → .agents}/skills/tdd-implement/references/orchestration.md +2 -2
- package/template/{.opencode → .agents}/skills/tdd-implement/references/stages.md +2 -7
- package/template/.agents/skills/teach/GLOSSARY-FORMAT.md +35 -0
- package/template/.agents/skills/teach/LEARNING-RECORD-FORMAT.md +46 -0
- package/template/.agents/skills/teach/MISSION-FORMAT.md +31 -0
- package/template/.agents/skills/teach/RESOURCES-FORMAT.md +32 -0
- package/template/.agents/skills/teach/SKILL.md +140 -0
- package/template/.agents/skills/teach/agents/openai.yaml +5 -0
- package/template/.agents/skills/to-questionnaire/SKILL.md +54 -0
- package/template/.agents/skills/to-questionnaire/agents/openai.yaml +5 -0
- package/template/.agents/skills/to-spec/SKILL.md +75 -0
- package/template/.agents/skills/to-spec/agents/openai.yaml +5 -0
- package/template/.agents/skills/to-tickets/SKILL.md +105 -0
- package/template/.agents/skills/to-tickets/agents/openai.yaml +5 -0
- package/template/.agents/skills/triage/AGENT-BRIEF.md +207 -0
- package/template/.agents/skills/triage/OUT-OF-SCOPE.md +105 -0
- package/template/.agents/skills/triage/SKILL.md +112 -0
- package/template/.agents/skills/triage/agents/openai.yaml +5 -0
- package/template/.agents/skills/wait-what/SKILL.md +7 -0
- package/template/.agents/skills/wait-what/agents/openai.yaml +5 -0
- package/template/.agents/skills/wayfinder/SKILL.md +128 -0
- package/template/.agents/skills/wayfinder/agents/openai.yaml +5 -0
- package/template/.agents/skills/wizard/SKILL.md +44 -0
- package/template/.agents/skills/wizard/agents/openai.yaml +3 -0
- package/template/.agents/skills/wizard/template.sh +204 -0
- package/template/.agents/skills/writing-for-agents/SKILL-MECHANICS.md +22 -0
- package/template/.agents/skills/writing-for-agents/SKILL.md +81 -0
- package/template/.agents/skills/writing-for-agents/agents/openai.yaml +3 -0
- package/template/.opencode/CONTEXT.md +8 -8
- package/template/.opencode/skills/.gitkeep +0 -0
- package/template/.opencode/skills/README.md +4 -0
- package/template/.pi/CONTEXT.md +8 -8
- package/template/.pi/skills/.gitkeep +0 -0
- package/template/.pi/skills/README.md +4 -0
- package/template/AGENTS.md +5 -8
- package/template/.opencode/skills/diagnose-fix/SKILL.md +0 -66
- package/template/.opencode/skills/grill-to-spec/SKILL.md +0 -83
- package/template/.opencode/skills/instance-test/SKILL.md +0 -61
- package/template/.opencode/skills/instance-test/agents/openai.yaml +0 -5
- package/template/.opencode/skills/instance-test/references/instances.md +0 -48
- package/template/.opencode/skills/tdd-implement/references/orchestration.md +0 -136
- package/template/.pi/skills/commit-check/SKILL.md +0 -67
- package/template/.pi/skills/commit-check/agents/openai.yaml +0 -5
- package/template/.pi/skills/commit-check/scripts/scan-sensitive.sh +0 -36
- package/template/.pi/skills/diagnose-fix/agents/openai.yaml +0 -5
- package/template/.pi/skills/diagnose-fix/references/anti-patterns.md +0 -20
- package/template/.pi/skills/grill-to-spec/agents/openai.yaml +0 -5
- package/template/.pi/skills/grill-to-spec/references/rules.md +0 -33
- package/template/.pi/skills/instance-test/SKILL.md +0 -61
- package/template/.pi/skills/instance-test/agents/openai.yaml +0 -5
- package/template/.pi/skills/instance-test/references/instances.md +0 -48
- package/template/.pi/skills/tdd-implement/SKILL.md +0 -48
- package/template/.pi/skills/tdd-implement/agents/openai.yaml +0 -5
- package/template/.pi/skills/tdd-implement/references/stages.md +0 -316
- /package/template/{.opencode → .agents}/skills/commit-check/agents/openai.yaml +0 -0
- /package/template/{.opencode → .agents}/skills/commit-check/scripts/scan-sensitive.sh +0 -0
- /package/template/{.opencode → .agents}/skills/diagnose-fix/agents/openai.yaml +0 -0
- /package/template/{.opencode → .agents}/skills/diagnose-fix/references/anti-patterns.md +0 -0
- /package/template/{.opencode → .agents}/skills/grill-to-spec/agents/openai.yaml +0 -0
- /package/template/{.opencode → .agents}/skills/grill-to-spec/references/rules.md +0 -0
- /package/template/{.opencode → .agents}/skills/tdd-implement/agents/openai.yaml +0 -0
|
@@ -57,7 +57,6 @@ disable-model-invocation: true
|
|
|
57
57
|
| 触发点 | 条件 | 动作 |
|
|
58
58
|
|--------|------|------|
|
|
59
59
|
| ② seam 确认 | 用户不同意 seams | → ① 补充 |
|
|
60
|
-
| ② 综合时 | 关键信息缺失 | → ① 补采 |
|
|
61
60
|
| ② 发布后 | spec 有问题 | → ① 重新循环 |
|
|
62
61
|
|
|
63
62
|
## 异常终止
|
|
@@ -72,8 +71,6 @@ disable-model-invocation: true
|
|
|
72
71
|
|
|
73
72
|
- ① 出口达成后方可进入 ②
|
|
74
73
|
- 全程不写代码、不动源码:唯一允许写入的文件是领域文档(`CONTEXT.md`/ADR)与 spec
|
|
75
|
-
- ② 探索代码只为确认 seams 与术语——只读不改
|
|
76
|
-
- 产出物格式细则(Glossary/ADR/Spec 守则)与反模式见 [references/rules.md](references/rules.md),不在本文件重写
|
|
77
74
|
|
|
78
75
|
## 引用
|
|
79
76
|
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: grilling
|
|
3
|
+
description: Grill the user relentlessly about a plan, decision, or idea. Use when the user wants to stress-test their thinking, or uses any 'grill' trigger phrases.
|
|
4
|
+
---
|
|
5
|
+
|
|
6
|
+
Interview the user relentlessly until you reach a shared understanding. Map this as a **design tree**: every decision branches into the decisions that hang off it.
|
|
7
|
+
|
|
8
|
+
Work the tree in **rounds**. The **frontier** is every decision whose prerequisites are already settled: the questions you can ask _now_ without guessing at answers you haven't heard yet. Ask the whole frontier in one round: number each question and give your recommended answer. Then wait for the user's answers before the next round.
|
|
9
|
+
|
|
10
|
+
Format a round like so:
|
|
11
|
+
|
|
12
|
+
```
|
|
13
|
+
❓ **Q1** - **<question title>**: <question body, might be multiple paragraphs, including multiple choices>
|
|
14
|
+
|
|
15
|
+
➡️ <your recommended answer>
|
|
16
|
+
|
|
17
|
+
---
|
|
18
|
+
|
|
19
|
+
❓ **Q2** - **<question title>**: <question body, might be multiple paragraphs, including multiple choices>
|
|
20
|
+
|
|
21
|
+
➡️ <your recommended answer>
|
|
22
|
+
```
|
|
23
|
+
|
|
24
|
+
Each round the user answers reshapes the tree: settled decisions push the frontier outward and unblock questions that depended on them. Recompute the frontier and ask the next round. A question whose answer depends on another question still open in this round belongs to a _later_ round, not this one.
|
|
25
|
+
|
|
26
|
+
Finding _facts_ is your job, never the user's. When a frontier question needs a fact from the environment (filesystem, tools, etc.), dispatch a sub-agent to find it; don't ask the user for anything you could look up yourself. Don't block on it: a running exploration is an unsettled prerequisite, so only the questions downstream of it wait for the sub-agent to report; ask the rest of the frontier now. The _decisions_ are the user's: put each to them and wait.
|
|
27
|
+
|
|
28
|
+
The session is done when the frontier is empty: every branch of the design tree visited, nothing left silently assumed. Do not act on it until the user confirms you have reached a shared understanding.
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: handoff
|
|
3
|
+
description: Compact the current conversation into a handoff document for another agent to pick up.
|
|
4
|
+
argument-hint: "What will the next session be used for?"
|
|
5
|
+
disable-model-invocation: true
|
|
6
|
+
---
|
|
7
|
+
|
|
8
|
+
Write a handoff document summarising the current conversation so a fresh agent can continue the work. Save to the temporary directory of the user's OS - not the current workspace.
|
|
9
|
+
|
|
10
|
+
Include a "suggested skills" section in the document, naming which skills the next agent should call the Skill tool for.
|
|
11
|
+
|
|
12
|
+
Do not duplicate content already captured in other artifacts (specs, plans, ADRs, issues, commits, diffs). Reference them by path or URL instead.
|
|
13
|
+
|
|
14
|
+
Redact any sensitive information, such as API keys, passwords, or personally identifiable information.
|
|
15
|
+
|
|
16
|
+
If the user passed arguments, treat them as a description of what the next session will focus on and tailor the doc accordingly.
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: implement
|
|
3
|
+
description: "Implement a piece of work based on a spec or set of tickets."
|
|
4
|
+
disable-model-invocation: true
|
|
5
|
+
---
|
|
6
|
+
|
|
7
|
+
Implement the work described by the user in the spec or tickets.
|
|
8
|
+
|
|
9
|
+
Use /tdd where possible, at pre-agreed seams.
|
|
10
|
+
|
|
11
|
+
Run typechecking regularly, single test files regularly, and the full test suite once at the end.
|
|
12
|
+
|
|
13
|
+
Once done, use /code-review to review the work.
|
|
14
|
+
|
|
15
|
+
Commit your work to the current branch.
|
|
@@ -0,0 +1,123 @@
|
|
|
1
|
+
# HTML Report Format
|
|
2
|
+
|
|
3
|
+
The architectural review is rendered as a single self-contained HTML file in the OS temp directory. Tailwind and Mermaid both come from CDNs. Mermaid handles graph-shaped diagrams reliably; hand-built divs and inline SVG handle the more editorial visuals (mass diagrams, cross-sections). Mix the two: don't lean on Mermaid for everything, it'll start to look generic.
|
|
4
|
+
|
|
5
|
+
## Scaffold
|
|
6
|
+
|
|
7
|
+
```html
|
|
8
|
+
<!doctype html>
|
|
9
|
+
<html lang="en">
|
|
10
|
+
<head>
|
|
11
|
+
<meta charset="utf-8" />
|
|
12
|
+
<title>Architecture review for {{repo name}}</title>
|
|
13
|
+
<script src="https://cdn.tailwindcss.com"></script>
|
|
14
|
+
<script type="module">
|
|
15
|
+
import mermaid from "https://cdn.jsdelivr.net/npm/mermaid@11/dist/mermaid.esm.min.mjs";
|
|
16
|
+
mermaid.initialize({ startOnLoad: true, theme: "neutral", securityLevel: "loose" });
|
|
17
|
+
</script>
|
|
18
|
+
<style>
|
|
19
|
+
/* small custom layer for things Tailwind doesn't cover cleanly:
|
|
20
|
+
dashed seam lines, hand-drawn-feeling arrow heads, etc. */
|
|
21
|
+
.seam { stroke-dasharray: 4 4; }
|
|
22
|
+
.leak { stroke: #dc2626; }
|
|
23
|
+
.deep { background: linear-gradient(135deg, #0f172a, #1e293b); }
|
|
24
|
+
</style>
|
|
25
|
+
</head>
|
|
26
|
+
<body class="bg-stone-50 text-slate-900 font-sans">
|
|
27
|
+
<main class="max-w-5xl mx-auto px-6 py-12 space-y-12">
|
|
28
|
+
<header>...</header>
|
|
29
|
+
<section id="candidates" class="space-y-10">...</section>
|
|
30
|
+
<section id="top-recommendation">...</section>
|
|
31
|
+
</main>
|
|
32
|
+
</body>
|
|
33
|
+
</html>
|
|
34
|
+
```
|
|
35
|
+
|
|
36
|
+
## Header
|
|
37
|
+
|
|
38
|
+
Repo name, date, and a compact legend: solid box = module, dashed line = seam, red arrow = leakage, thick dark box = deep module. No introduction paragraph. Straight into the candidates.
|
|
39
|
+
|
|
40
|
+
## Candidate card
|
|
41
|
+
|
|
42
|
+
The diagrams carry the weight. Prose is sparse, plain, and uses the glossary terms (from the `/codebase-design` skill) without ceremony.
|
|
43
|
+
|
|
44
|
+
Each candidate is one `<article>`:
|
|
45
|
+
|
|
46
|
+
- **Title**: short, names the deepening (e.g. "Collapse the Order intake pipeline").
|
|
47
|
+
- **Badge row**: recommendation strength (`Strong` = emerald, `Worth exploring` = amber, `Speculative` = slate), plus a tag for the dependency category (`in-process`, `local-substitutable`, `ports & adapters`, `mock`).
|
|
48
|
+
- **Files**: monospaced list, `font-mono text-sm`.
|
|
49
|
+
- **Before / After diagram**: the centrepiece. Two columns, side by side. See patterns below.
|
|
50
|
+
- **Problem**: one sentence. What hurts.
|
|
51
|
+
- **Solution**: one sentence. What changes.
|
|
52
|
+
- **Wins**: bullets, ≤6 words each. e.g. "Tests hit one interface", "Pricing logic stops leaking", "Delete 4 shallow wrappers".
|
|
53
|
+
- **ADR callout** (if applicable): one line in an amber-tinted box.
|
|
54
|
+
|
|
55
|
+
No paragraphs of explanation. If the diagram needs a paragraph to be understood, redraw the diagram.
|
|
56
|
+
|
|
57
|
+
## Diagram patterns
|
|
58
|
+
|
|
59
|
+
Pick the pattern that fits the candidate. Mix them. Don't make every diagram look the same. Variety is part of the point.
|
|
60
|
+
|
|
61
|
+
### Mermaid graph (the workhorse for dependencies / call flow)
|
|
62
|
+
|
|
63
|
+
Use a Mermaid `flowchart` or `graph` when the point is "X calls Y calls Z, and look at the mess." Wrap it in a Tailwind-styled card so it doesn't feel parachuted in. Style with classDef to colour leakage edges red and the deep module dark. Sequence diagrams work well for "before: 6 round-trips; after: 1."
|
|
64
|
+
|
|
65
|
+
```html
|
|
66
|
+
<div class="rounded-lg border border-slate-200 bg-white p-4">
|
|
67
|
+
<pre class="mermaid">
|
|
68
|
+
flowchart LR
|
|
69
|
+
A[OrderHandler] --> B[OrderValidator]
|
|
70
|
+
B --> C[OrderRepo]
|
|
71
|
+
C -.leak.-> D[PricingClient]
|
|
72
|
+
classDef leak stroke:#dc2626,stroke-width:2px;
|
|
73
|
+
class C,D leak
|
|
74
|
+
</pre>
|
|
75
|
+
</div>
|
|
76
|
+
```
|
|
77
|
+
|
|
78
|
+
### Hand-built boxes-and-arrows (when Mermaid's layout fights you)
|
|
79
|
+
|
|
80
|
+
Modules as `<div>`s with borders and labels. Arrows as inline SVG `<line>` or `<path>` elements positioned absolutely over a relative container. Reach for this when you want the "after" diagram to feel like one thick-bordered deep module with greyed-out internals, since Mermaid won't render that with the right weight.
|
|
81
|
+
|
|
82
|
+
### Cross-section (good for layered shallowness)
|
|
83
|
+
|
|
84
|
+
Stack horizontal bands (`h-12 border-l-4`) to show layers a call passes through. Before: 6 thin layers each doing nothing. After: 1 thick band labelled with the consolidated responsibility.
|
|
85
|
+
|
|
86
|
+
### Mass diagram (good for "interface as wide as implementation")
|
|
87
|
+
|
|
88
|
+
Two rectangles per module: one for interface surface area, one for implementation. Before: interface rectangle is nearly as tall as the implementation rectangle (shallow). After: interface rectangle is short, implementation rectangle is tall (deep).
|
|
89
|
+
|
|
90
|
+
### Call-graph collapse
|
|
91
|
+
|
|
92
|
+
Before: a tree of function calls rendered as nested boxes. After: the same tree collapsed into one box, with the now-internal calls shown faded inside it.
|
|
93
|
+
|
|
94
|
+
## Style guidance
|
|
95
|
+
|
|
96
|
+
- Lean editorial, not corporate-dashboard. Generous whitespace. Serif optional for headings (`font-serif` works well with stone/slate).
|
|
97
|
+
- Colour sparingly: one accent (emerald or indigo) plus red for leakage and amber for warnings.
|
|
98
|
+
- Keep diagrams ~320px tall so before/after sits comfortably side by side without scrolling.
|
|
99
|
+
- Use `text-xs uppercase tracking-wider` for module labels inside diagrams, so they read as schematic, not as UI.
|
|
100
|
+
- The only scripts are the Tailwind CDN and the Mermaid ESM import. The report is otherwise static: no app code, no interactivity beyond Mermaid's own rendering.
|
|
101
|
+
|
|
102
|
+
## Top recommendation section
|
|
103
|
+
|
|
104
|
+
One larger card. Candidate name, one sentence on why, anchor link to its card. That's it.
|
|
105
|
+
|
|
106
|
+
## Tone
|
|
107
|
+
|
|
108
|
+
Plain English, concise, but the architectural nouns and verbs come straight from the `/codebase-design` skill. Concision is not an excuse to drift.
|
|
109
|
+
|
|
110
|
+
**Use exactly:** module, interface, implementation, depth, deep, shallow, seam, adapter, leverage, locality.
|
|
111
|
+
|
|
112
|
+
**Never substitute:** component, service, unit (for module) · API, signature (for interface) · boundary (for seam) · layer, wrapper (for module, when you mean module).
|
|
113
|
+
|
|
114
|
+
**Phrasings that fit the style:**
|
|
115
|
+
|
|
116
|
+
- "Order intake module is shallow: interface nearly matches the implementation."
|
|
117
|
+
- "Pricing leaks across the seam."
|
|
118
|
+
- "Deepen: one interface, one place to test."
|
|
119
|
+
- "Two adapters justify the seam: HTTP in prod, in-memory in tests."
|
|
120
|
+
|
|
121
|
+
**Wins bullets** name the gain in glossary terms: *"locality: bugs concentrate in one module"*, *"leverage: one interface, N call sites"*, *"interface shrinks; implementation absorbs the wrappers"*. Don't write *"easier to maintain"* or *"cleaner code"*, because those terms aren't in the glossary and don't earn their place.
|
|
122
|
+
|
|
123
|
+
No hedging, no throat-clearing, no "it's worth noting that…". If a sentence could be a bullet, make it a bullet. If a bullet could be cut, cut it. If a term isn't in the `/codebase-design` glossary, reach for one that is before inventing a new one.
|
|
@@ -0,0 +1,71 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: improve-codebase-architecture
|
|
3
|
+
description: Scan a codebase for deepening opportunities, present them as a visual HTML report, then grill through whichever one you pick.
|
|
4
|
+
disable-model-invocation: true
|
|
5
|
+
---
|
|
6
|
+
|
|
7
|
+
# Improve Codebase Architecture
|
|
8
|
+
|
|
9
|
+
Surface architectural friction and propose **deepening opportunities**: refactors that turn shallow modules into deep ones. The aim is testability and AI-navigability.
|
|
10
|
+
|
|
11
|
+
This command is _informed_ by the project's domain model and built on a shared design vocabulary:
|
|
12
|
+
|
|
13
|
+
- Call the Skill tool with "codebase-design" for the architecture vocabulary (**module**, **interface**, **depth**, **seam**, **adapter**, **leverage**, **locality**) and its principles (the deletion test, "the interface is the test surface", "one adapter = hypothetical seam, two = real"). Use these terms exactly in every suggestion, and don't drift into "component," "service," "API," or "boundary."
|
|
14
|
+
- The domain language in `CONTEXT.md` gives names to good seams; ADRs in `docs/adr/` record decisions this command should not re-litigate.
|
|
15
|
+
|
|
16
|
+
## Process
|
|
17
|
+
|
|
18
|
+
### 1. Explore
|
|
19
|
+
|
|
20
|
+
**Scope before you scan: YAGNI.** Deepening a module pays off by making future changes to it easier, so put extra weight on the parts of the codebase that have recently changed. Decide *where* to look before you look:
|
|
21
|
+
|
|
22
|
+
- If the user named a direction (a module, a subsystem, a pain point), take it, and skip the inference below.
|
|
23
|
+
- Otherwise, walk back a good stretch of the commit history (`git log --oneline`) to find the codebase's hot spots, the files and areas that keep coming up, and let those paths pull your attention first. If the changes are scattered with no clear hot spot, widen the net.
|
|
24
|
+
|
|
25
|
+
Read the project's domain glossary (`CONTEXT.md`) and any ADRs in the area you're touching first.
|
|
26
|
+
|
|
27
|
+
Then spawn a sub-agent to walk the codebase. Don't follow rigid heuristics; explore organically and note where you experience friction:
|
|
28
|
+
|
|
29
|
+
- Where does understanding one concept require bouncing between many small modules?
|
|
30
|
+
- Where are modules **shallow**, with an interface nearly as complex as the implementation?
|
|
31
|
+
- Where have pure functions been extracted just for testability, but the real bugs hide in how they're called (no **locality**)?
|
|
32
|
+
- Where do tightly-coupled modules leak across their seams?
|
|
33
|
+
- Which parts of the codebase are untested, or hard to test through their current interface?
|
|
34
|
+
|
|
35
|
+
Apply the **deletion test** to anything you suspect is shallow: would deleting it concentrate complexity, or just move it? A "yes, concentrates" is the signal you want.
|
|
36
|
+
|
|
37
|
+
### 2. Present candidates as an HTML report
|
|
38
|
+
|
|
39
|
+
Write a self-contained HTML file to the OS temp directory so nothing lands in the repo. Resolve the temp dir from `$TMPDIR`, falling back to `/tmp` (or `%TEMP%` on Windows), and write to `<tmpdir>/architecture-review-<timestamp>.html` so each run gets a fresh file. Open it for the user (`xdg-open <path>` on Linux, `open <path>` on macOS, `start <path>` on Windows) and tell them the absolute path.
|
|
40
|
+
|
|
41
|
+
The report uses **Tailwind via CDN** for layout and styling, and **Mermaid via CDN** for diagrams where a graph/flow/sequence reliably communicates the structure. Mix Mermaid with hand-crafted CSS/SVG visuals: use Mermaid when relationships are graph-shaped (call graphs, dependencies, sequences), and hand-built divs/SVG when you want something more editorial (mass diagrams, cross-sections, collapse animations). Each candidate gets a **before/after visualisation**. Be visual.
|
|
42
|
+
|
|
43
|
+
For each candidate, render a card with:
|
|
44
|
+
|
|
45
|
+
- **Files**: which files/modules are involved
|
|
46
|
+
- **Problem**: why the current architecture is causing friction
|
|
47
|
+
- **Solution**: plain English description of what would change
|
|
48
|
+
- **Benefits**: explained in terms of locality and leverage, and how tests would improve
|
|
49
|
+
- **Before / After diagram**: side-by-side, custom-drawn, illustrating the shallowness and the deepening
|
|
50
|
+
- **Recommendation strength**: one of `Strong`, `Worth exploring`, `Speculative`, rendered as a badge
|
|
51
|
+
|
|
52
|
+
End the report with a **Top recommendation** section: which candidate you'd tackle first and why.
|
|
53
|
+
|
|
54
|
+
**Use CONTEXT.md vocabulary for the domain, and the `/codebase-design` vocabulary for the architecture.** If `CONTEXT.md` defines "Order," talk about "the Order intake module," not "the FooBarHandler," and not "the Order service."
|
|
55
|
+
|
|
56
|
+
**ADR conflicts**: if a candidate contradicts an existing ADR, only surface it when the friction is real enough to warrant revisiting the ADR. Mark it clearly in the card (e.g. a warning callout: _"contradicts ADR-0007, but worth reopening because…"_). Don't list every theoretical refactor an ADR forbids.
|
|
57
|
+
|
|
58
|
+
See [HTML-REPORT.md](HTML-REPORT.md) for the full HTML scaffold, diagram patterns, and styling guidance.
|
|
59
|
+
|
|
60
|
+
Do NOT propose interfaces yet. After the file is written, ask the user: "Which of these would you like to explore?"
|
|
61
|
+
|
|
62
|
+
### 3. Grilling loop
|
|
63
|
+
|
|
64
|
+
Once the user picks a candidate, call the Skill tool with "grilling" to walk the decision tree with them: constraints, dependencies, the shape of the deepened module, what sits behind the seam, what tests survive.
|
|
65
|
+
|
|
66
|
+
Side effects happen inline as decisions crystallize; call the Skill tool with "domain-modeling" to keep the domain model current as you go:
|
|
67
|
+
|
|
68
|
+
- **Naming a deepened module after a concept not in `CONTEXT.md`?** Add the term to `CONTEXT.md`. Create the file lazily if it doesn't exist.
|
|
69
|
+
- **Sharpening a fuzzy term during the conversation?** Update `CONTEXT.md` right there.
|
|
70
|
+
- **User rejects the candidate with a load-bearing reason?** Offer an ADR, framed as: _"Want me to record this as an ADR so future architecture reviews don't re-suggest it?"_ Only offer when the reason would actually be needed by a future explorer to avoid re-suggesting the same thing; skip ephemeral reasons ("not worth it right now") and self-evident ones.
|
|
71
|
+
- **Want to explore alternative interfaces for the deepened module?** Call the Skill tool with "codebase-design" and use its design-it-twice parallel sub-agent pattern.
|
|
@@ -0,0 +1,70 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: instance-test
|
|
3
|
+
disable-model-invocation: true
|
|
4
|
+
description: "matt-skills 专属功能测试示范(由 scaffold-functional-test 从 spec 生成)— 验证 sync 合并 update 后的行为;仅显式调用"
|
|
5
|
+
---
|
|
6
|
+
|
|
7
|
+
# Instance Test — matt-skills 专属示范
|
|
8
|
+
|
|
9
|
+
本 skill 是 **matt-skills 专属**的功能测试示范,由 `scaffold-functional-test` 从 `.scratch/sync-merge-update/spec.md` 生成(见 `references/instances.md` 头部 `spec hash` + `generatedAt`)。它是生成器产出形态的示例,不随 Template Snapshot 分发,仅保留于 Workspace。旧通用执行器文案已废弃。
|
|
10
|
+
|
|
11
|
+
兼容别名:`instance-test` 保留原名以兼容历史调用,实际为 `matt-functional-test` 的示范实现。
|
|
12
|
+
|
|
13
|
+
## Steps
|
|
14
|
+
|
|
15
|
+
### 1. Gather instances
|
|
16
|
+
|
|
17
|
+
实例集已由生成器按**受控扩展模型**落盘于 `references/instances.md`(头部含 `spec hash` + `generatedAt`,每实例含**溯源** `spec.md` 章节/行号,`<!-- manual -->` 段受保护)。
|
|
18
|
+
|
|
19
|
+
执行前校验指纹:若当前 spec 的 `spec hash` 与 `references/instances.md` 头部不一致,提示「spec 已变更,建议重跑 scaffold-functional-test」但不自动覆盖,需用户显式确认才 regenerate(AI 先给 diff 建议)。
|
|
20
|
+
|
|
21
|
+
每实例声明:`prompt/command/expected files/content/expected stdout phrases/expected exit code` 必选,`setup/env/timeout/type/teardown` 可选,默认 `type: cli`。
|
|
22
|
+
|
|
23
|
+
完成:实例清单已固定(含溯源与指纹),`<!-- manual -->` 段未被覆盖。
|
|
24
|
+
|
|
25
|
+
### 2. Run instances
|
|
26
|
+
|
|
27
|
+
For each **instance** in order:
|
|
28
|
+
|
|
29
|
+
1. `mktemp -d` 隔离目录(或项目支持的 `git worktree` / `--dest`),单线程串行,不并行。
|
|
30
|
+
2. 执行实例的 `command` 与可选 `setup`,捕获 stdout/stderr 与 exit code。
|
|
31
|
+
3. 快照 `expected` 声明的文件与副作用。
|
|
32
|
+
|
|
33
|
+
一个 **instance** 一次,失败不阻断后续,产物不碰撞。
|
|
34
|
+
|
|
35
|
+
完成:每实例均有独立 run dir 与捕获输出。
|
|
36
|
+
|
|
37
|
+
### 3. Evaluate
|
|
38
|
+
|
|
39
|
+
对比每实例的 actual vs expected:
|
|
40
|
+
|
|
41
|
+
- 文件存在性/内容(`test -f`/`grep -q`/`diff`)
|
|
42
|
+
- Stdout/stderr 含预期短语
|
|
43
|
+
- Exit code 一致
|
|
44
|
+
- 扩展字段(`env`/`timeout`/`type`)行为符合声明
|
|
45
|
+
|
|
46
|
+
标记 `PASS`/`FAIL`,附 `expected vs actual` diff 与 run dir 证据。
|
|
47
|
+
|
|
48
|
+
完成:每实例均有 `PASS` 或 `FAIL` 且含证据。
|
|
49
|
+
|
|
50
|
+
### 4. Report
|
|
51
|
+
|
|
52
|
+
对话内汇总:
|
|
53
|
+
|
|
54
|
+
- `PASS m/n` + per-instance evidence
|
|
55
|
+
- 失败项列出 gap(expected vs actual)与 run dir 复现路径
|
|
56
|
+
- 成功默认清理临时目录、失败默认保留;`--keep` 保留全部;`--report` 显式开启才落盘报告文件
|
|
57
|
+
|
|
58
|
+
不以文件刷屏——默认输出在对话,报告文件仅显式开启才写。
|
|
59
|
+
|
|
60
|
+
## 实例来源
|
|
61
|
+
|
|
62
|
+
- 源 spec:`.scratch/sync-merge-update/spec.md`(`spec hash` 见 `references/instances.md` 头部)
|
|
63
|
+
- 推导策略:混合推导(验收标准锚点 + 需求/接口/边界补充),每实例含溯源,无溯源视为幻觉
|
|
64
|
+
- 手工段:`<!-- manual -->` 保护
|
|
65
|
+
|
|
66
|
+
## 引用
|
|
67
|
+
|
|
68
|
+
- 生成器:`scaffold-functional-test`(读 spec 产出本 skill)
|
|
69
|
+
- 领域术语:`CONTEXT.md`
|
|
70
|
+
- 技能设计:`docs/agents/skill-design.md`
|
|
@@ -0,0 +1,75 @@
|
|
|
1
|
+
# Instances for matt-skills — sync 行为功能测试(由 scaffold-functional-test 生成)
|
|
2
|
+
|
|
3
|
+
> 源 spec:`.scratch/sync-merge-update/spec.md`
|
|
4
|
+
> spec hash: `062a76fc872d` # .scratch/sync-merge-update/spec.md 的 sha256 前 12 位
|
|
5
|
+
> generatedAt: 2026-05-11
|
|
6
|
+
> 推导策略:混合推导(验收标准锚点 + 需求/行为补充),每实例含溯源,无溯源视为幻觉
|
|
7
|
+
|
|
8
|
+
本文件由 `scaffold-functional-test` 按**受控扩展模型**生成:必选 `prompt/command/expected files/content/expected stdout phrases/expected exit code`,可选 `setup/env/timeout/type/teardown`,默认 `type: cli`。执行语义:`mktemp -d` 隔离、单线程串行、`PASS m/n` 汇总、证据含 `expected vs actual` diff + `run dir`。
|
|
9
|
+
|
|
10
|
+
执行前校验:对比当前 `.scratch/sync-merge-update/spec.md` 的 hash 与本文件头部 `spec hash`,不一致时提示「spec 已变更,建议重跑 scaffold-functional-test」但不自动覆盖。
|
|
11
|
+
|
|
12
|
+
---
|
|
13
|
+
|
|
14
|
+
## 1. sync 默认 check(无参不写盘)
|
|
15
|
+
|
|
16
|
+
- Prompt: 验证 `matt-skills sync` 无参等价 check,打印表且不改 AGENTS.md
|
|
17
|
+
- 溯源: spec.md — 需求/行为「`matt-skills sync` 无参:等价 `check`」+ 验收标准「`sync` 无参在已定制的 `pi-switch` 仓库上不改 `AGENTS.md`」
|
|
18
|
+
- type: cli
|
|
19
|
+
- setup: `node bin/cli.js init --dest <tmp>` 后手工改 `AGENTS.md` 加入 `tdd-implement` 定制行
|
|
20
|
+
- Command: `node bin/cli.js sync --dest <tmp>`(无参)
|
|
21
|
+
- Expected:
|
|
22
|
+
- `git diff HEAD -- AGENTS.md` 为空(`AGENTS.md` 未被覆盖)
|
|
23
|
+
- stdout 含 `上游 HEAD` 与 `新增/更新/删除/一致` 表头
|
|
24
|
+
- stdout 含 `--json` 可解析提示或表格行
|
|
25
|
+
- exit 0 或 1(有差异时 exit 1,判 exit code 符合 check 语义)
|
|
26
|
+
- Expected files/content: `AGENTS.md` 保留定制行,无 `AGENTS.md.bak` 新增
|
|
27
|
+
- Expected stdout phrases: `上游 HEAD`, `一致`
|
|
28
|
+
- Expected exit code: 1(有差异时)/ 0(无差异时)— 按实现定义,测试以实际 check 语义为准
|
|
29
|
+
|
|
30
|
+
## 2. sync --apply 安全增量(AGENTS.md 跳过、上游强制覆盖不删)
|
|
31
|
+
|
|
32
|
+
- Prompt: 验证 `sync --apply` 为安全增量,`AGENTS.md` 定制跳过、上游技能被覆盖但 remove 列表不删
|
|
33
|
+
- 溯源: spec.md — 需求/行为「`sync --apply`:安全增量写盘。`AGENTS.md` 若含独有路由则跳过;上游技能 `rm+cp force` 覆盖,跳过 `PROPRIETARY`,不执行 `remove`」+ 验收标准「`sync --apply` 后上游技能被强制更新为上游 `HEAD`,`remove` 列表的技能仍保留」
|
|
34
|
+
- type: cli
|
|
35
|
+
- setup: 在 `<tmp>` 放置旧版上游技能 `test-skill` 过期文件,并手工改 `AGENTS.md`
|
|
36
|
+
- Command: `node bin/cli.js sync --apply --dest <tmp>`
|
|
37
|
+
- Expected:
|
|
38
|
+
- `AGENTS.md` 仍含定制行(未被模板覆盖)
|
|
39
|
+
- 上游技能文件已更新为上游 HEAD 内容(`diff` 无旧版残留)
|
|
40
|
+
- `remove` 列表中的技能目录仍存在(未被删除)
|
|
41
|
+
- Expected files/content: `AGENTS.md` 定制行存在;`test-skill` 被覆盖为新版;无 `AGENTS.md.bak`(安全档不备份)或按实现保留但不覆盖
|
|
42
|
+
- Expected stdout phrases: `已同步` 或 `已更新` 或 `同步`
|
|
43
|
+
- Expected exit code: 0
|
|
44
|
+
- timeout: 30000
|
|
45
|
+
|
|
46
|
+
## 3. sync --force 硬盖(AGENTS.md 备份后覆盖、全量 add/update/remove)
|
|
47
|
+
|
|
48
|
+
- Prompt: 验证 `sync --force` 硬盖,`AGENTS.md` 备份后被模板覆盖、技能与模板全量同步含删除
|
|
49
|
+
- 溯源: spec.md — 需求/行为「`sync --force`:硬盖。`AGENTS.md` 先 `backupIfExists → .bak` 再 `cp -r force`;技能与模板均 `add/update/remove` 全做」+ 验收标准「`sync --force` 后 `AGENTS.md` 变为模板且 `AGENTS.md.bak` 存在,`remove` 列表的技能被删除」
|
|
50
|
+
- type: cli
|
|
51
|
+
- setup: 在 `<tmp>` 放置 `AGENTS.md` 定制行 + 一个上游已删的本地技能 `obsolete-skill/`
|
|
52
|
+
- Command: `node bin/cli.js sync --force --dest <tmp>`
|
|
53
|
+
- Expected:
|
|
54
|
+
- `AGENTS.md` 已被模板覆盖(定制行消失,与 `template/AGENTS.md` 一致)
|
|
55
|
+
- `AGENTS.md.bak` 存在且含定制行备份
|
|
56
|
+
- `obsolete-skill/` 已被删除
|
|
57
|
+
- Expected files/content: `AGENTS.md` 内容等于 `template/AGENTS.md`;`AGENTS.md.bak` 存在
|
|
58
|
+
- Expected stdout phrases: `已覆盖` 或 `硬盖`
|
|
59
|
+
- Expected exit code: 0
|
|
60
|
+
|
|
61
|
+
## 4. update 已合并到 sync --apply(删除分支、提示已合并)
|
|
62
|
+
|
|
63
|
+
- Prompt: 验证 `matt-skills update` 已删除,执行后报错提示已合并到 `sync --apply`,且 `--help` 不再列 `update`
|
|
64
|
+
- 溯源: spec.md — 需求/行为「`matt-skills update`:删除该分支,`main` 中 `command === 'update'` 改为 `stderr: 'update 已合并到 sync --apply'` 且 `exit 1`,`--help` 不再列 `update`」+ 验收标准「`matt-skills update` 执行后报错提示已合并,`--help` 无 `update`」
|
|
65
|
+
- type: cli
|
|
66
|
+
- Command: `node bin/cli.js update 2>&1; echo "exit:$?"` 与 `node bin/cli.js --help`
|
|
67
|
+
- Expected:
|
|
68
|
+
- `update` 命令 stdout/stderr 含 `已合并到 sync --apply` 且 exit 1
|
|
69
|
+
- `--help` 输出不含独立的 `update` 子命令行(不匹配 `^\s*update`)
|
|
70
|
+
- Expected stdout phrases: `已合并到 sync --apply`
|
|
71
|
+
- Expected exit code: 1(`update` 分支)
|
|
72
|
+
- env: {}
|
|
73
|
+
|
|
74
|
+
<!-- manual -->
|
|
75
|
+
<!-- 以下为人工定制实例保护段:由开发者手写,scaffold-functional-test 重生成时不覆盖此段以上的内容。如需新增手工实例,请在此段后追加。 -->
|
|
@@ -0,0 +1,67 @@
|
|
|
1
|
+
# Logic Prototype
|
|
2
|
+
|
|
3
|
+
A single, self-contained HTML file (a **shareable demo**) that lets anyone drive a state model by clicking buttons. Use this when the question is about **business logic, state transitions, or data shape**: the kind of thing that looks reasonable on paper but only feels wrong once you push it through real cases.
|
|
4
|
+
|
|
5
|
+
Because it's one file with nothing to install, you can hand it to a non-developer (a designer, a PM, a domain expert) and let them feel the model for themselves. So it speaks their language, not the code's.
|
|
6
|
+
|
|
7
|
+
## When this is the right shape
|
|
8
|
+
|
|
9
|
+
- "I'm not sure if this state machine handles the edge case where X then Y."
|
|
10
|
+
- "Does this data model actually let me represent the case where..."
|
|
11
|
+
- "I want to feel out what the API should look like before writing it."
|
|
12
|
+
- Anything where someone wants to **press buttons and watch state change**.
|
|
13
|
+
|
|
14
|
+
If the question is "what should this look like," this is the wrong branch. Use [UI.md](UI.md).
|
|
15
|
+
|
|
16
|
+
## Process
|
|
17
|
+
|
|
18
|
+
### 1. State the question
|
|
19
|
+
|
|
20
|
+
Before writing code, write down what state model and what question you're prototyping. One paragraph, at the top of the demo (in a visible intro, not just a comment). A logic prototype that answers the wrong question is pure waste, so make the question explicit so it can be checked later, whether the user is watching now or returning to it AFK.
|
|
21
|
+
|
|
22
|
+
### 2. Isolate the logic in a portable module
|
|
23
|
+
|
|
24
|
+
Put the actual logic (the bit that's answering the question) in a single `<script>` block written as a small, pure module that could be lifted out and dropped into the real codebase later. The page around it is throwaway; this module isn't.
|
|
25
|
+
|
|
26
|
+
The right shape depends on the question:
|
|
27
|
+
|
|
28
|
+
- **A pure reducer**: `(state, action) => state`. Good when actions are discrete events and state is a single value.
|
|
29
|
+
- **A state machine**: explicit states and transitions. Good when "which actions are even legal right now" is part of the question.
|
|
30
|
+
- **A small set of pure functions** over a plain data type. Good when there's no implicit current state, just transformations.
|
|
31
|
+
- **A class or module with a clear method surface** when the logic genuinely owns ongoing internal state.
|
|
32
|
+
|
|
33
|
+
Pick whichever shape best fits the question being asked, *not* whichever is easiest to wire to a page. Keep it pure: no DOM, no `document`, no button handlers reaching inside it. The page calls into it; nothing flows the other direction. This is what makes the prototype useful past its own lifetime: once the question's answered, the validated reducer / machine / function set lifts into the real module on its own.
|
|
34
|
+
|
|
35
|
+
### 3. Build the shareable HTML file
|
|
36
|
+
|
|
37
|
+
One file, plain HTML/CSS/JS: no framework, no bundler, no server, everything inline so it opens by double-click and survives being emailed around. Anyone should be able to run it by opening it.
|
|
38
|
+
|
|
39
|
+
Write it for a non-developer. Every label is in **domain language**, not code: buttons and state read like the business, not the reducer. Explain in plain words what's happening.
|
|
40
|
+
|
|
41
|
+
Lay it out with a clean hierarchy, top to bottom:
|
|
42
|
+
|
|
43
|
+
1. **Title and one-line explanation** of what this demo lets you explore (the question from step 1).
|
|
44
|
+
2. **Current state**: the full relevant state, rendered as a readable panel (labelled fields, not a raw JSON dump), re-rendered after every click so the change is visible. Where it helps a non-developer follow, call out what just changed.
|
|
45
|
+
3. **Free-play buttons**: one button per action, always available, so anyone can poke at the model in any order. Each click dispatches its action and re-renders the state.
|
|
46
|
+
4. **Guided walkthroughs**: a set of **scenarios**, one per tab. Each tab holds a short plain-language description of the scenario (the situation it sets up and what to watch for) and underneath it, the ordered **buttons to press** for that scenario. Each step is a real button: clicking it performs that action and moves to the next step. Starting a walkthrough resets to a known initial state so the scenario runs the same way every time.
|
|
47
|
+
|
|
48
|
+
Choose scenarios that demonstrate the awkward cases, the ones hard to reason about on paper: the happy path, a tricky edge case, an attempt at something that should be illegal.
|
|
49
|
+
|
|
50
|
+
Keep it beautiful but restrained: clean typography, generous spacing, one accent colour. No animations, no gimmicks: nothing that competes with the state and the buttons.
|
|
51
|
+
|
|
52
|
+
### 4. Hand it over
|
|
53
|
+
|
|
54
|
+
Send them the file, or open it for them. They'll click through the walkthroughs and free-play whenever they get to it; the interesting moments are when they say "wait, that shouldn't be possible" or "huh, I assumed X would be different"; those are the bugs in the _idea_, which is the whole point. If they want new actions or a new scenario, add them. Prototypes evolve.
|
|
55
|
+
|
|
56
|
+
### 5. Capture the answer and the prototype
|
|
57
|
+
|
|
58
|
+
Once the prototype has answered its question, capture the answer, then capture the prototype the way the [SKILL](SKILL.md) describes. The logic-specific mapping: the validated reducer / machine / function set lifts into the real module (the decision, absorbed); the HTML shell rides along to the throwaway branch that keeps the prototype as a primary source, and being one self-contained file, it stays trivially re-runnable there.
|
|
59
|
+
|
|
60
|
+
## Anti-patterns
|
|
61
|
+
|
|
62
|
+
- **Don't add tests.** A prototype that needs tests is no longer a prototype.
|
|
63
|
+
- **Don't wire it to the real database.** Use in-memory state unless the question is specifically about persistence.
|
|
64
|
+
- **Don't generalise.** No "what if we wanted to support X later." The prototype answers one question.
|
|
65
|
+
- **Don't blur the logic and the page together.** If the pure module references the DOM, `document`, or button handlers, it's no longer liftable. Keep the page as a thin shell over a pure module.
|
|
66
|
+
- **Don't reach for a framework, bundler, or server.** One file the recipient double-clicks; a React app or a dev server defeats "shareable".
|
|
67
|
+
- **Don't ship the HTML shell into production.** The page is optimised for being clicked through by hand. The logic module behind it is the bit worth keeping.
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: prototype
|
|
3
|
+
description: Build a throwaway prototype to answer a design question. Use when the user wants to sanity-check whether a state model or logic feels right, or explore what a UI should look like.
|
|
4
|
+
---
|
|
5
|
+
|
|
6
|
+
# Prototype
|
|
7
|
+
|
|
8
|
+
A prototype is **throwaway code that answers a question**. The question decides the shape.
|
|
9
|
+
|
|
10
|
+
## Pick a branch
|
|
11
|
+
|
|
12
|
+
Identify which question is being answered, using the user's prompt, the surrounding code, or by asking if the user is around:
|
|
13
|
+
|
|
14
|
+
- **"Does this logic / state model feel right?"** → [LOGIC.md](LOGIC.md). Build a single shareable HTML file (free-play buttons plus tabbed guided walkthroughs) that pushes the state machine through cases that are hard to reason about on paper, and that a non-developer can drive.
|
|
15
|
+
- **"What should this look like?"** → [UI.md](UI.md). Generate several radically different UI variations on a single route, switchable via a URL search param and a floating bottom bar.
|
|
16
|
+
|
|
17
|
+
The two branches produce very different artifacts, so getting this wrong wastes the whole prototype. If the question is genuinely ambiguous and the user isn't reachable, default to whichever branch better matches the surrounding code (a backend module → logic; a page or component → UI) and state the assumption at the top of the prototype.
|
|
18
|
+
|
|
19
|
+
## Rules that apply to both
|
|
20
|
+
|
|
21
|
+
1. **Throwaway from day one, and clearly marked as such.** Locate the prototype code close to where it will actually be used (next to the module or page it's prototyping for) so context is obvious, but name it so a casual reader can see it's a prototype, not production. For throwaway UI routes, obey whatever routing convention the project already uses; don't invent a new top-level structure.
|
|
22
|
+
2. **Trivial to run.** A UI prototype starts from one command in the project's task runner: `pnpm <name>`, `python <path>`, `bun <path>`, etc. A logic demo is a single HTML file the user double-clicks. Either way, no thinking required to start it.
|
|
23
|
+
3. **No persistence by default.** State lives in memory. Persistence is the thing the prototype is _checking_, not something it should depend on. If the question explicitly involves a database, hit a scratch DB or a local file with a clear "PROTOTYPE, wipe me" name.
|
|
24
|
+
4. **Skip the polish.** No tests, no error handling beyond what makes the prototype _runnable_, no abstractions. The point is to learn something fast.
|
|
25
|
+
5. **Surface the state.** After every action (logic) or on every variant switch (UI), print or render the full relevant state so the user can see what changed.
|
|
26
|
+
6. **Capture it when done.** Fold any validated decision into the real code, then capture the prototype itself as a **primary source**: commit it to a throwaway branch, out of main, and leave a context pointer to that branch on the implementation issue. Capture the answer too (the verdict and the question it settled) in the issue or a commit. The main branch keeps only the validated decision.
|