liteagents 3.0.0 → 3.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/CHANGELOG.md +158 -1
- package/README.md +113 -169
- package/installer/cli.js +4 -2
- package/installer/package-manager.js +3 -1
- package/package.json +4 -3
- package/packages/ampcode/AGENT.md +10 -18
- package/packages/ampcode/agents/code-developer.md +11 -17
- package/packages/ampcode/agents/orchestrator.md +1 -1
- package/packages/ampcode/agents/quality-assurance.md +3 -1
- package/packages/ampcode/{commands/brainstorming.md → skills/brainstorming/SKILL.md} +2 -3
- package/packages/ampcode/{commands/branch-review.md → skills/branch-review/SKILL.md} +27 -13
- package/packages/{claude/commands/docs-builder.md → ampcode/skills/docs-builder/SKILL.md} +1 -1
- package/packages/ampcode/{commands/live-canvas.md → skills/live-canvas/SKILL.md} +8 -4
- package/packages/ampcode/{commands/refactor.md → skills/refactor/SKILL.md} +49 -7
- package/packages/ampcode/{commands/release.md → skills/release/SKILL.md} +4 -4
- package/packages/{claude/commands → ampcode/skills}/remember/AGENT_RULES.md +44 -84
- package/packages/ampcode/{commands/remember.md → skills/remember/SKILL.md} +11 -6
- package/packages/ampcode/{commands → skills}/remember/friction.cjs +0 -0
- package/packages/ampcode/{commands → skills}/remember/stub-check.cjs +28 -19
- package/packages/ampcode/{commands → skills}/remember/sync-rules.cjs +28 -19
- package/packages/{claude/commands → ampcode/skills}/remember/version-check.cjs +1 -1
- package/packages/ampcode/skills/root-cause/SKILL.md +220 -0
- package/packages/ampcode/{commands/trace-back → skills/root-cause}/find-polluter.sh +0 -0
- package/packages/{claude/commands/security.md → ampcode/skills/security/SKILL.md} +1 -1
- package/packages/{claude/commands/ship.md → ampcode/skills/ship/SKILL.md} +1 -1
- package/packages/ampcode/skills/skill-creator/LICENSE.txt +202 -0
- package/packages/ampcode/{commands/skill-creator.md → skills/skill-creator/SKILL.md} +1 -2
- package/packages/ampcode/{commands → skills}/skill-creator/scripts/init_skill.py +0 -0
- package/packages/ampcode/{commands → skills}/skill-creator/scripts/package_skill.py +0 -0
- package/packages/ampcode/{commands → skills}/skill-creator/scripts/quick_validate.py +0 -0
- package/packages/ampcode/{commands/stash.md → skills/stash/SKILL.md} +2 -1
- package/packages/{claude/commands/test-generate.md → ampcode/skills/test-generate/SKILL.md} +2 -2
- package/packages/ampcode/variants.json +2 -2
- package/packages/claude/CLAUDE.md +10 -17
- package/packages/claude/agents/code-developer.md +11 -17
- package/packages/claude/agents/orchestrator.md +2 -3
- package/packages/claude/agents/quality-assurance.md +3 -1
- package/packages/claude/skills/brainstorming/SKILL.md +1 -2
- package/packages/claude/{commands/branch-review.md → skills/branch-review/SKILL.md} +15 -1
- package/packages/{ampcode/commands/docs-builder.md → claude/skills/docs-builder/SKILL.md} +7 -7
- package/packages/claude/skills/live-canvas/SKILL.md +5 -1
- package/packages/claude/{commands/refactor.md → skills/refactor/SKILL.md} +45 -3
- package/packages/claude/{commands/release.md → skills/release/SKILL.md} +1 -1
- package/packages/{ampcode/commands → claude/skills}/remember/AGENT_RULES.md +38 -78
- package/packages/claude/{commands/remember.md → skills/remember/SKILL.md} +11 -6
- package/packages/claude/{commands → skills}/remember/friction.cjs +0 -0
- package/packages/claude/{commands → skills}/remember/stub-check.cjs +28 -19
- package/packages/claude/{commands → skills}/remember/sync-rules.cjs +28 -19
- package/packages/{ampcode/commands → claude/skills}/remember/version-check.cjs +3 -3
- package/packages/claude/skills/root-cause/SKILL.md +220 -0
- package/packages/{ampcode/commands/security.md → claude/skills/security/SKILL.md} +2 -2
- package/packages/{ampcode/commands/ship.md → claude/skills/ship/SKILL.md} +2 -2
- package/packages/claude/skills/skill-creator/SKILL.md +1 -2
- package/packages/claude/{commands/stash.md → skills/stash/SKILL.md} +2 -1
- package/packages/{ampcode/commands/test-generate.md → claude/skills/test-generate/SKILL.md} +3 -3
- package/packages/claude/variants.json +1 -2
- package/packages/droid/AGENTS.md +10 -15
- package/packages/droid/commands/brainstorming.md +1 -4
- package/packages/droid/commands/branch-review.md +25 -14
- package/packages/droid/commands/docs-builder.md +0 -3
- package/packages/droid/commands/live-canvas.md +7 -5
- package/packages/droid/commands/refactor.md +47 -8
- package/packages/droid/commands/release.md +2 -5
- package/packages/droid/commands/remember/AGENT_RULES.md +38 -78
- package/packages/droid/commands/remember/stub-check.cjs +28 -19
- package/packages/droid/commands/remember/sync-rules.cjs +28 -19
- package/packages/droid/commands/remember/version-check.cjs +1 -1
- package/packages/droid/commands/remember.md +6 -4
- package/packages/droid/commands/root-cause.md +218 -0
- package/packages/droid/commands/security.md +0 -3
- package/packages/droid/commands/ship.md +0 -3
- package/packages/droid/commands/skill-creator/LICENSE.txt +202 -0
- package/packages/droid/commands/skill-creator.md +0 -4
- package/packages/droid/commands/stash.md +0 -2
- package/packages/droid/commands/test-generate.md +1 -4
- package/packages/droid/droids/1-create-prd.md +6 -2
- package/packages/droid/droids/2-generate-tasks.md +1 -2
- package/packages/droid/droids/3-process-task-list.md +1 -2
- package/packages/droid/droids/code-developer.md +12 -19
- package/packages/droid/droids/feature-planner.md +1 -2
- package/packages/droid/droids/market-researcher.md +1 -2
- package/packages/droid/droids/orchestrator.md +1 -2
- package/packages/droid/droids/quality-assurance.md +4 -3
- package/packages/droid/droids/system-architect.md +1 -2
- package/packages/droid/droids/ui-designer.md +1 -2
- package/packages/opencode/AGENTS.md +10 -15
- package/packages/opencode/agent/code-developer.md +11 -17
- package/packages/opencode/agent/quality-assurance.md +3 -1
- package/packages/opencode/command/brainstorming.md +1 -4
- package/packages/opencode/command/branch-review.md +25 -15
- package/packages/opencode/command/docs-builder.md +0 -4
- package/packages/opencode/command/live-canvas.md +7 -5
- package/packages/opencode/command/refactor.md +47 -9
- package/packages/opencode/command/release.md +2 -5
- package/packages/opencode/command/remember/AGENT_RULES.md +38 -78
- package/packages/opencode/command/remember/stub-check.cjs +28 -19
- package/packages/opencode/command/remember/sync-rules.cjs +28 -19
- package/packages/opencode/command/remember/version-check.cjs +1 -1
- package/packages/opencode/command/remember.md +6 -4
- package/packages/opencode/command/root-cause.md +218 -0
- package/packages/opencode/command/security.md +0 -4
- package/packages/opencode/command/ship.md +0 -3
- package/packages/opencode/command/skill-creator/LICENSE.txt +202 -0
- package/packages/opencode/command/skill-creator.md +0 -4
- package/packages/opencode/command/stash.md +0 -3
- package/packages/opencode/command/test-generate.md +1 -5
- package/packages/opencode/opencode.jsonc +4 -24
- package/packages/subagentic-manual.md +147 -314
- package/tools/ampcode/manifest-template.json +0 -1
- package/tools/claude/manifest-template.json +0 -1
- package/tools/droid/manifest-template.json +0 -1
- package/tools/opencode/manifest-template.json +0 -1
- package/packages/ampcode/commands/debug-method.md +0 -297
- package/packages/ampcode/commands/live-canvas/README.md +0 -264
- package/packages/ampcode/commands/optimize.md +0 -61
- package/packages/ampcode/commands/tdd-flow.md +0 -390
- package/packages/ampcode/commands/test-traps/example.ts +0 -158
- package/packages/ampcode/commands/test-traps.md +0 -378
- package/packages/ampcode/commands/trace-back.md +0 -176
- package/packages/ampcode/commands/verify-done.md +0 -152
- package/packages/claude/commands/optimize.md +0 -61
- package/packages/claude/plugins/live-canvas-marketplace/plugins/live-canvas-channel/README.md +0 -89
- package/packages/claude/skills/debug-method/CREATION-LOG.md +0 -119
- package/packages/claude/skills/debug-method/SKILL.md +0 -296
- package/packages/claude/skills/debug-method/test-academic.md +0 -14
- package/packages/claude/skills/debug-method/test-pressure-1.md +0 -58
- package/packages/claude/skills/debug-method/test-pressure-2.md +0 -68
- package/packages/claude/skills/debug-method/test-pressure-3.md +0 -69
- package/packages/claude/skills/live-canvas/README.md +0 -269
- package/packages/claude/skills/tdd-flow/SKILL.md +0 -392
- package/packages/claude/skills/test-traps/SKILL.md +0 -378
- package/packages/claude/skills/test-traps/example.ts +0 -158
- package/packages/claude/skills/trace-back/SKILL.md +0 -176
- package/packages/claude/skills/verify-done/SKILL.md +0 -152
- package/packages/droid/commands/debug-method.md +0 -297
- package/packages/droid/commands/live-canvas/README.md +0 -264
- package/packages/droid/commands/optimize.md +0 -61
- package/packages/droid/commands/tdd-flow.md +0 -390
- package/packages/droid/commands/test-traps/example.ts +0 -158
- package/packages/droid/commands/test-traps.md +0 -378
- package/packages/droid/commands/trace-back.md +0 -176
- package/packages/droid/commands/verify-done.md +0 -152
- package/packages/opencode/command/debug-method.md +0 -297
- package/packages/opencode/command/live-canvas/README.md +0 -264
- package/packages/opencode/command/optimize.md +0 -61
- package/packages/opencode/command/tdd-flow.md +0 -390
- package/packages/opencode/command/test-traps/example.ts +0 -158
- package/packages/opencode/command/test-traps.md +0 -378
- package/packages/opencode/command/trace-back.md +0 -176
- package/packages/opencode/command/verify-done.md +0 -152
- /package/packages/ampcode/{commands → skills}/docs-builder/docs-builder.cjs +0 -0
- /package/packages/ampcode/{commands → skills}/live-canvas/DESIGN_PRINCIPLES.md +0 -0
- /package/packages/ampcode/{commands → skills}/live-canvas/dev/post-variants.html +0 -0
- /package/packages/ampcode/{commands → skills}/live-canvas/templates/lab-banner.html +0 -0
- /package/packages/ampcode/{commands → skills}/live-canvas/templates/overlay-vanilla.js +0 -0
- /package/packages/claude/{commands → skills}/docs-builder/docs-builder.cjs +0 -0
- /package/packages/claude/skills/{trace-back → root-cause}/find-polluter.sh +0 -0
- /package/packages/droid/commands/{trace-back → root-cause}/find-polluter.sh +0 -0
- /package/packages/opencode/command/{trace-back → root-cause}/find-polluter.sh +0 -0
|
@@ -1,297 +0,0 @@
|
|
|
1
|
-
---
|
|
2
|
-
name: debug-method
|
|
3
|
-
description: Use when encountering any bug, test failure, or unexpected behavior, before proposing fixes - four-phase framework (root cause investigation, pattern analysis, hypothesis testing, implementation) that ensures understanding before attempting solutions
|
|
4
|
-
usage: /debug-method <bug-or-error-description>
|
|
5
|
-
auto_trigger: false
|
|
6
|
-
---
|
|
7
|
-
|
|
8
|
-
# Debug Method
|
|
9
|
-
|
|
10
|
-
## Overview
|
|
11
|
-
|
|
12
|
-
Random fixes waste time and create new bugs. Quick patches mask underlying issues.
|
|
13
|
-
|
|
14
|
-
**Core principle:** ALWAYS find root cause before attempting fixes. Symptom fixes are failure.
|
|
15
|
-
|
|
16
|
-
**Violating the letter of this process is violating the spirit of debugging.**
|
|
17
|
-
|
|
18
|
-
## The Iron Law
|
|
19
|
-
|
|
20
|
-
```
|
|
21
|
-
NO FIXES WITHOUT ROOT CAUSE INVESTIGATION FIRST
|
|
22
|
-
```
|
|
23
|
-
|
|
24
|
-
If you haven't completed Phase 1, you cannot propose fixes.
|
|
25
|
-
|
|
26
|
-
## When to Use
|
|
27
|
-
|
|
28
|
-
Use for ANY technical issue:
|
|
29
|
-
- Test failures
|
|
30
|
-
- Bugs in production
|
|
31
|
-
- Unexpected behavior
|
|
32
|
-
- Performance problems
|
|
33
|
-
- Build failures
|
|
34
|
-
- Integration issues
|
|
35
|
-
|
|
36
|
-
**Use this ESPECIALLY when:**
|
|
37
|
-
- Under time pressure (emergencies make guessing tempting)
|
|
38
|
-
- "Just one quick fix" seems obvious
|
|
39
|
-
- You've already tried multiple fixes
|
|
40
|
-
- Previous fix didn't work
|
|
41
|
-
- You don't fully understand the issue
|
|
42
|
-
|
|
43
|
-
**Don't skip when:**
|
|
44
|
-
- Issue seems simple (simple bugs have root causes too)
|
|
45
|
-
- You're in a hurry (rushing guarantees rework)
|
|
46
|
-
- Manager wants it fixed NOW (systematic is faster than thrashing)
|
|
47
|
-
|
|
48
|
-
## The Four Phases
|
|
49
|
-
|
|
50
|
-
You MUST complete each phase before proceeding to the next.
|
|
51
|
-
|
|
52
|
-
### Phase 1: Root Cause Investigation
|
|
53
|
-
|
|
54
|
-
**BEFORE attempting ANY fix:**
|
|
55
|
-
|
|
56
|
-
1. **Read Error Messages Carefully**
|
|
57
|
-
- Don't skip past errors or warnings
|
|
58
|
-
- They often contain the exact solution
|
|
59
|
-
- Read stack traces completely
|
|
60
|
-
- Note line numbers, file paths, error codes
|
|
61
|
-
|
|
62
|
-
2. **Reproduce Consistently**
|
|
63
|
-
- Can you trigger it reliably?
|
|
64
|
-
- What are the exact steps?
|
|
65
|
-
- Does it happen every time?
|
|
66
|
-
- If not reproducible → gather more data, don't guess
|
|
67
|
-
|
|
68
|
-
3. **Check Recent Changes**
|
|
69
|
-
- What changed that could cause this?
|
|
70
|
-
- Git diff, recent commits
|
|
71
|
-
- New dependencies, config changes
|
|
72
|
-
- Environmental differences
|
|
73
|
-
|
|
74
|
-
4. **Gather Evidence in Multi-Component Systems**
|
|
75
|
-
|
|
76
|
-
**WHEN system has multiple components (CI → build → signing, API → service → database):**
|
|
77
|
-
|
|
78
|
-
**BEFORE proposing fixes, add diagnostic instrumentation:**
|
|
79
|
-
```
|
|
80
|
-
For EACH component boundary:
|
|
81
|
-
- Log what data enters component
|
|
82
|
-
- Log what data exits component
|
|
83
|
-
- Verify environment/config propagation
|
|
84
|
-
- Check state at each layer
|
|
85
|
-
|
|
86
|
-
Run once to gather evidence showing WHERE it breaks
|
|
87
|
-
THEN analyze evidence to identify failing component
|
|
88
|
-
THEN investigate that specific component
|
|
89
|
-
```
|
|
90
|
-
|
|
91
|
-
**Example (multi-layer system):**
|
|
92
|
-
```bash
|
|
93
|
-
# Layer 1: Workflow
|
|
94
|
-
echo "=== Secrets available in workflow: ==="
|
|
95
|
-
echo "IDENTITY: ${IDENTITY:+SET}${IDENTITY:-UNSET}"
|
|
96
|
-
|
|
97
|
-
# Layer 2: Build script
|
|
98
|
-
echo "=== Env vars in build script: ==="
|
|
99
|
-
env | grep IDENTITY || echo "IDENTITY not in environment"
|
|
100
|
-
|
|
101
|
-
# Layer 3: Signing script
|
|
102
|
-
echo "=== Keychain state: ==="
|
|
103
|
-
security list-keychains
|
|
104
|
-
security find-identity -v
|
|
105
|
-
|
|
106
|
-
# Layer 4: Actual signing
|
|
107
|
-
codesign --sign "$IDENTITY" --verbose=4 "$APP"
|
|
108
|
-
```
|
|
109
|
-
|
|
110
|
-
**This reveals:** Which layer fails (secrets → workflow ✓, workflow → build ✗)
|
|
111
|
-
|
|
112
|
-
5. **Trace Data Flow**
|
|
113
|
-
|
|
114
|
-
**WHEN error is deep in call stack:**
|
|
115
|
-
|
|
116
|
-
**REQUIRED SUB-SKILL:** Use trace-back for backward tracing technique
|
|
117
|
-
|
|
118
|
-
**Quick version:**
|
|
119
|
-
- Where does bad value originate?
|
|
120
|
-
- What called this with bad value?
|
|
121
|
-
- Keep tracing up until you find the source
|
|
122
|
-
- Fix at source, not at symptom
|
|
123
|
-
|
|
124
|
-
### Phase 2: Pattern Analysis
|
|
125
|
-
|
|
126
|
-
**Find the pattern before fixing:**
|
|
127
|
-
|
|
128
|
-
1. **Find Working Examples**
|
|
129
|
-
- Locate similar working code in same codebase
|
|
130
|
-
- What works that's similar to what's broken?
|
|
131
|
-
|
|
132
|
-
2. **Compare Against References**
|
|
133
|
-
- If implementing pattern, read reference implementation COMPLETELY
|
|
134
|
-
- Don't skim - read every line
|
|
135
|
-
- Understand the pattern fully before applying
|
|
136
|
-
|
|
137
|
-
3. **Identify Differences**
|
|
138
|
-
- What's different between working and broken?
|
|
139
|
-
- List every difference, however small
|
|
140
|
-
- Don't assume "that can't matter"
|
|
141
|
-
|
|
142
|
-
4. **Understand Dependencies**
|
|
143
|
-
- What other components does this need?
|
|
144
|
-
- What settings, config, environment?
|
|
145
|
-
- What assumptions does it make?
|
|
146
|
-
|
|
147
|
-
### Phase 3: Hypothesis and Testing
|
|
148
|
-
|
|
149
|
-
**Scientific method:**
|
|
150
|
-
|
|
151
|
-
1. **Form Single Hypothesis**
|
|
152
|
-
- State clearly: "I think X is the root cause because Y"
|
|
153
|
-
- Write it down
|
|
154
|
-
- Be specific, not vague
|
|
155
|
-
|
|
156
|
-
2. **Test Minimally**
|
|
157
|
-
- Make the SMALLEST possible change to test hypothesis
|
|
158
|
-
- One variable at a time
|
|
159
|
-
- Don't fix multiple things at once
|
|
160
|
-
|
|
161
|
-
3. **Verify Before Continuing**
|
|
162
|
-
- Did it work? Yes → Phase 4
|
|
163
|
-
- Didn't work? Form NEW hypothesis
|
|
164
|
-
- DON'T add more fixes on top
|
|
165
|
-
|
|
166
|
-
4. **When You Don't Know**
|
|
167
|
-
- Say "I don't understand X"
|
|
168
|
-
- Don't pretend to know
|
|
169
|
-
- Ask for help
|
|
170
|
-
- Research more
|
|
171
|
-
|
|
172
|
-
### Phase 4: Implementation
|
|
173
|
-
|
|
174
|
-
**Fix the root cause, not the symptom:**
|
|
175
|
-
|
|
176
|
-
1. **Create Failing Test Case**
|
|
177
|
-
- Simplest possible reproduction
|
|
178
|
-
- Automated test if possible
|
|
179
|
-
- One-off test script if no framework
|
|
180
|
-
- MUST have before fixing
|
|
181
|
-
- **REQUIRED SUB-SKILL:** Use tdd-flow for writing proper failing tests
|
|
182
|
-
|
|
183
|
-
2. **Implement Single Fix**
|
|
184
|
-
- Address the root cause identified
|
|
185
|
-
- ONE change at a time
|
|
186
|
-
- No "while I'm here" improvements
|
|
187
|
-
- No bundled refactoring
|
|
188
|
-
|
|
189
|
-
3. **Verify Fix**
|
|
190
|
-
- Test passes now?
|
|
191
|
-
- No other tests broken?
|
|
192
|
-
- Issue actually resolved?
|
|
193
|
-
|
|
194
|
-
4. **If Fix Doesn't Work**
|
|
195
|
-
- STOP
|
|
196
|
-
- Count: How many fixes have you tried?
|
|
197
|
-
- If < 3: Return to Phase 1, re-analyze with new information
|
|
198
|
-
- **If ≥ 3: STOP and question the architecture (step 5 below)**
|
|
199
|
-
- DON'T attempt Fix #4 without architectural discussion
|
|
200
|
-
|
|
201
|
-
5. **If 3+ Fixes Failed: Question Architecture**
|
|
202
|
-
|
|
203
|
-
**Pattern indicating architectural problem:**
|
|
204
|
-
- Each fix reveals new shared state/coupling/problem in different place
|
|
205
|
-
- Fixes require "massive refactoring" to implement
|
|
206
|
-
- Each fix creates new symptoms elsewhere
|
|
207
|
-
|
|
208
|
-
**STOP and question fundamentals:**
|
|
209
|
-
- Is this pattern fundamentally sound?
|
|
210
|
-
- Are we "sticking with it through sheer inertia"?
|
|
211
|
-
- Should we refactor architecture vs. continue fixing symptoms?
|
|
212
|
-
|
|
213
|
-
**Discuss with your human partner before attempting more fixes**
|
|
214
|
-
|
|
215
|
-
This is NOT a failed hypothesis - this is a wrong architecture.
|
|
216
|
-
|
|
217
|
-
## Red Flags - STOP and Follow Process
|
|
218
|
-
|
|
219
|
-
If you catch yourself thinking:
|
|
220
|
-
- "Quick fix for now, investigate later"
|
|
221
|
-
- "Just try changing X and see if it works"
|
|
222
|
-
- "Add multiple changes, run tests"
|
|
223
|
-
- "Skip the test, I'll manually verify"
|
|
224
|
-
- "It's probably X, let me fix that"
|
|
225
|
-
- "I don't fully understand but this might work"
|
|
226
|
-
- "Pattern says X but I'll adapt it differently"
|
|
227
|
-
- "Here are the main problems: [lists fixes without investigation]"
|
|
228
|
-
- Proposing solutions before tracing data flow
|
|
229
|
-
- **"One more fix attempt" (when already tried 2+)**
|
|
230
|
-
- **Each fix reveals new problem in different place**
|
|
231
|
-
|
|
232
|
-
**ALL of these mean: STOP. Return to Phase 1.**
|
|
233
|
-
|
|
234
|
-
**If 3+ fixes failed:** Question the architecture (see Phase 4.5)
|
|
235
|
-
|
|
236
|
-
## your human partner's Signals You're Doing It Wrong
|
|
237
|
-
|
|
238
|
-
**Watch for these redirections:**
|
|
239
|
-
- "Is that not happening?" - You assumed without verifying
|
|
240
|
-
- "Will it show us...?" - You should have added evidence gathering
|
|
241
|
-
- "Stop guessing" - You're proposing fixes without understanding
|
|
242
|
-
- "Ultrathink this" - Question fundamentals, not just symptoms
|
|
243
|
-
- "We're stuck?" (frustrated) - Your approach isn't working
|
|
244
|
-
|
|
245
|
-
**When you see these:** STOP. Return to Phase 1.
|
|
246
|
-
|
|
247
|
-
## Common Rationalizations
|
|
248
|
-
|
|
249
|
-
| Excuse | Reality |
|
|
250
|
-
|--------|---------|
|
|
251
|
-
| "Issue is simple, don't need process" | Simple issues have root causes too. Process is fast for simple bugs. |
|
|
252
|
-
| "Emergency, no time for process" | Systematic debugging is FASTER than guess-and-check thrashing. |
|
|
253
|
-
| "Just try this first, then investigate" | First fix sets the pattern. Do it right from the start. |
|
|
254
|
-
| "I'll write test after confirming fix works" | Untested fixes don't stick. Test first proves it. |
|
|
255
|
-
| "Multiple fixes at once saves time" | Can't isolate what worked. Causes new bugs. |
|
|
256
|
-
| "Reference too long, I'll adapt the pattern" | Partial understanding guarantees bugs. Read it completely. |
|
|
257
|
-
| "I see the problem, let me fix it" | Seeing symptoms ≠ understanding root cause. |
|
|
258
|
-
| "One more fix attempt" (after 2+ failures) | 3+ failures = architectural problem. Question pattern, don't fix again. |
|
|
259
|
-
|
|
260
|
-
## Quick Reference
|
|
261
|
-
|
|
262
|
-
| Phase | Key Activities | Success Criteria |
|
|
263
|
-
|-------|---------------|------------------|
|
|
264
|
-
| **1. Root Cause** | Read errors, reproduce, check changes, gather evidence | Understand WHAT and WHY |
|
|
265
|
-
| **2. Pattern** | Find working examples, compare | Identify differences |
|
|
266
|
-
| **3. Hypothesis** | Form theory, test minimally | Confirmed or new hypothesis |
|
|
267
|
-
| **4. Implementation** | Create test, fix, verify | Bug resolved, tests pass |
|
|
268
|
-
|
|
269
|
-
## When Process Reveals "No Root Cause"
|
|
270
|
-
|
|
271
|
-
If systematic investigation reveals issue is truly environmental, timing-dependent, or external:
|
|
272
|
-
|
|
273
|
-
1. You've completed the process
|
|
274
|
-
2. Document what you investigated
|
|
275
|
-
3. Implement appropriate handling (retry, timeout, error message)
|
|
276
|
-
4. Add monitoring/logging for future investigation
|
|
277
|
-
|
|
278
|
-
**But:** 95% of "no root cause" cases are incomplete investigation.
|
|
279
|
-
|
|
280
|
-
## Integration with Other Skills
|
|
281
|
-
|
|
282
|
-
**This skill requires using:**
|
|
283
|
-
- **trace-back** - REQUIRED when error is deep in call stack (see Phase 1, Step 5)
|
|
284
|
-
- **tdd-flow** - REQUIRED for creating failing test case (see Phase 4, Step 1)
|
|
285
|
-
|
|
286
|
-
**Complementary skills:**
|
|
287
|
-
- **defense-in-depth** - Add validation at multiple layers after finding root cause
|
|
288
|
-
- **test-traps** (Anti-Pattern 6) - Replace arbitrary timeouts identified in Phase 2
|
|
289
|
-
- **verify-done** - Verify fix worked before claiming success
|
|
290
|
-
|
|
291
|
-
## Real-World Impact
|
|
292
|
-
|
|
293
|
-
From debugging sessions:
|
|
294
|
-
- Systematic approach: 15-30 minutes to fix
|
|
295
|
-
- Random fixes approach: 2-3 hours of thrashing
|
|
296
|
-
- First-time fix rate: 95% vs 40%
|
|
297
|
-
- New bugs introduced: Near zero vs common
|
|
@@ -1,264 +0,0 @@
|
|
|
1
|
-
# Live Canvas
|
|
2
|
-
|
|
3
|
-
Click-to-annotate UI design tool for Claude Code. Renders N variants of a component or page in your browser, you click an element and type what to change, and Claude edits the variant file while you watch in the browser. No window switching, no pasted JSON.
|
|
4
|
-
|
|
5
|
-
Ships as a Claude Code skill plus an MCP channel plugin. Works in every tool liteagents supports (Claude, Droid, Amp, Opencode), but **Live mode only works in Claude Code** — other tools run in JSON mode only (see modes below).
|
|
6
|
-
|
|
7
|
-
---
|
|
8
|
-
|
|
9
|
-
## How it works
|
|
10
|
-
|
|
11
|
-
```
|
|
12
|
-
┌──────────────────────┐ POST /feedback ┌─────────────────────┐
|
|
13
|
-
│ Overlay in browser │ ─────────────────────────► │ live-canvas-channel │
|
|
14
|
-
│ (vanilla JS, ~500 lines)│ │ (Node MCP server) │
|
|
15
|
-
└──────────────────────┘ └──────────┬──────────┘
|
|
16
|
-
▲ │
|
|
17
|
-
│ dev server hot-reloads the page │ notifications/
|
|
18
|
-
│ after Claude edits the variant │ claude/channel
|
|
19
|
-
│ ▼
|
|
20
|
-
┌──────────────────────┐ ┌─────────────────────┐
|
|
21
|
-
│ Dev server (yours) │ ◄──── Claude edits ─────── │ Claude Code session │
|
|
22
|
-
│ e.g. pnpm dev :3000 │ variant file │ (with --dangerously-│
|
|
23
|
-
└──────────────────────┘ │ load-development- │
|
|
24
|
-
│ channels flag) │
|
|
25
|
-
└─────────────────────┘
|
|
26
|
-
```
|
|
27
|
-
|
|
28
|
-
Each Save in the overlay streams into the Claude session as a `<channel>` tag with the variant, element selector, and user comment. Claude edits the corresponding `.claude-design/lab/variants/Variant<X>.tsx` file. Your dev server hot-reloads. You never leave the browser.
|
|
29
|
-
|
|
30
|
-
---
|
|
31
|
-
|
|
32
|
-
## Modes
|
|
33
|
-
|
|
34
|
-
The skill asks you which mode you want every time `/live-canvas` runs.
|
|
35
|
-
|
|
36
|
-
| Mode | Use when | What happens per Save |
|
|
37
|
-
|---|---|---|
|
|
38
|
-
| **Live** | You launched the session with `live-claude` and the channel is up | Comment streams into Claude's context; Claude edits the file; dev server hot-reloads. Toast: "Pushed to Claude ✨". |
|
|
39
|
-
| **JSON** | Any session, any tool (Claude, Droid, Amp, Opencode) | Comment stays local. On Finish/Submit it writes JSONL (or downloads the file if no endpoint). User pastes or says "check" in the CLI to have the assistant act on the whole batch. |
|
|
40
|
-
|
|
41
|
-
If you pick Live but the channel doesn't answer, the skill stops and tells you to relaunch with `live-claude` (or fall back to JSON). It doesn't silently downgrade — the user always gets to choose.
|
|
42
|
-
|
|
43
|
-
---
|
|
44
|
-
|
|
45
|
-
## One-time setup (Live mode, Claude Code only)
|
|
46
|
-
|
|
47
|
-
Run this once per machine. Without it, the skill still works in JSON mode.
|
|
48
|
-
|
|
49
|
-
### 1. Run the installer
|
|
50
|
-
|
|
51
|
-
```bash
|
|
52
|
-
bash packages/claude/plugins/live-canvas-marketplace/setup.sh
|
|
53
|
-
```
|
|
54
|
-
|
|
55
|
-
The installer:
|
|
56
|
-
- copies the marketplace into `~/.claude/plugins/live-canvas-marketplace/` (overwrites any prior install)
|
|
57
|
-
- runs `npm install` inside the channel plugin
|
|
58
|
-
- adds a `live-claude` shell function to `~/.zshrc` and `~/.bashrc` (idempotent — re-runs replace in place)
|
|
59
|
-
|
|
60
|
-
### 2. Register the marketplace in Claude Code
|
|
61
|
-
|
|
62
|
-
```
|
|
63
|
-
/plugin marketplace add ~/.claude/plugins/live-canvas-marketplace
|
|
64
|
-
```
|
|
65
|
-
|
|
66
|
-
### 3. Install the plugin
|
|
67
|
-
|
|
68
|
-
```
|
|
69
|
-
/plugin install live-canvas-channel@live-canvas-marketplace
|
|
70
|
-
```
|
|
71
|
-
|
|
72
|
-
### 4. Open a fresh shell
|
|
73
|
-
|
|
74
|
-
`live-claude` is now available. Use plain `claude` for everything else; use `live-claude` when you want Live mode for this skill.
|
|
75
|
-
|
|
76
|
-
---
|
|
77
|
-
|
|
78
|
-
## Everyday use
|
|
79
|
-
|
|
80
|
-
### Start a session
|
|
81
|
-
|
|
82
|
-
Either `claude` (JSON only) or `live-claude` (Live available).
|
|
83
|
-
|
|
84
|
-
### Invoke the skill in a project
|
|
85
|
-
|
|
86
|
-
```
|
|
87
|
-
/live-canvas
|
|
88
|
-
```
|
|
89
|
-
|
|
90
|
-
Phase 0 always asks which mode you want — Live channel or JSON file — then probes the channel if you picked Live:
|
|
91
|
-
|
|
92
|
-
| Choice | Channel up? | Skill behavior |
|
|
93
|
-
|---|---|---|
|
|
94
|
-
| Live | yes | Announces Live mode, starts the interview |
|
|
95
|
-
| Live | no | Tells you to relaunch with `live-claude` (or fall back to JSON) |
|
|
96
|
-
| JSON | n/a | Announces JSON mode, starts the interview |
|
|
97
|
-
|
|
98
|
-
### Interview & generation
|
|
99
|
-
|
|
100
|
-
Skill asks 5 short questions (scope, pain points, inspiration, persona, constraints). Then generates 5 variants in `.claude-design/lab/variants/` and wires a route at `/__live_canvas` in your app.
|
|
101
|
-
|
|
102
|
-
### Iterate in the browser
|
|
103
|
-
|
|
104
|
-
Open `http://localhost:<dev-port>/__live_canvas`. Click **Add Feedback** (bottom right), click any element in any variant, type a one-liner, Save.
|
|
105
|
-
|
|
106
|
-
- Live mode: toast says "Pushed to Claude ✨", Claude acknowledges and edits the file, dev server hot-reloads.
|
|
107
|
-
- JSON mode: toast says "Saved — submit when ready", pin stays on the element, counter in the Submit button ticks up.
|
|
108
|
-
|
|
109
|
-
Need the page back? The overlay has a "−" button next to **Add Feedback** that collapses everything to a small circle in the corner — tap to expand again. Useful on mobile where the bar can cover what's underneath.
|
|
110
|
-
|
|
111
|
-
Keep clicking until a winner emerges.
|
|
112
|
-
|
|
113
|
-
### Finish
|
|
114
|
-
|
|
115
|
-
Click the pink **Finish** (Live) or **Submit** (JSON) button:
|
|
116
|
-
|
|
117
|
-
1. Type the overall direction: e.g. *"Go with B's layout, A's button styling"*
|
|
118
|
-
2. Click Finish
|
|
119
|
-
|
|
120
|
-
Skill then:
|
|
121
|
-
- Generates `DESIGN_PLAN.md` in project root (winner, files to change, component API, states, a11y checklist)
|
|
122
|
-
- Updates or creates `DESIGN_MEMORY.md` with the patterns it learned
|
|
123
|
-
- Deletes `.claude-design/` and the `/__live_canvas` route
|
|
124
|
-
|
|
125
|
-
Done.
|
|
126
|
-
|
|
127
|
-
---
|
|
128
|
-
|
|
129
|
-
## Files and where they live
|
|
130
|
-
|
|
131
|
-
### In this repo (source)
|
|
132
|
-
|
|
133
|
-
```
|
|
134
|
-
packages/claude/
|
|
135
|
-
├── skills/live-canvas/
|
|
136
|
-
│ ├── SKILL.md # Skill instructions (phases, flow)
|
|
137
|
-
│ ├── DESIGN_PRINCIPLES.md # UX/a11y/motion reference
|
|
138
|
-
│ ├── README.md # This file
|
|
139
|
-
│ ├── dev/post-variants.html # Standalone demo for local QA of the overlay
|
|
140
|
-
│ └── templates/
|
|
141
|
-
│ ├── overlay-vanilla.js # Framework-agnostic overlay (~500 lines)
|
|
142
|
-
│ └── lab-banner.html # "This is a temp lab" notice snippet
|
|
143
|
-
└── plugins/
|
|
144
|
-
└── live-canvas-marketplace/
|
|
145
|
-
├── .claude-plugin/marketplace.json
|
|
146
|
-
├── setup.sh # Runs npm install and prints manual steps
|
|
147
|
-
└── plugins/live-canvas-channel/
|
|
148
|
-
├── .claude-plugin/plugin.json
|
|
149
|
-
├── server.js # MCP server + HTTP listener on :8788
|
|
150
|
-
├── schema.json # Feedback payload schema (v1.0)
|
|
151
|
-
├── package.json # @modelcontextprotocol/sdk dep
|
|
152
|
-
└── README.md # Plugin-specific docs (protocol, debug)
|
|
153
|
-
```
|
|
154
|
-
|
|
155
|
-
### On the user's disk after liteagents install
|
|
156
|
-
|
|
157
|
-
```
|
|
158
|
-
~/.claude/
|
|
159
|
-
├── skills/live-canvas/ # Copied from packages/claude/skills/
|
|
160
|
-
└── plugins/live-canvas-marketplace/ # Copied from packages/claude/plugins/
|
|
161
|
-
```
|
|
162
|
-
|
|
163
|
-
`node_modules/` is NOT copied — `setup.sh` creates it locally via `npm install`.
|
|
164
|
-
|
|
165
|
-
### After `/plugin install` (Claude Code's own register step)
|
|
166
|
-
|
|
167
|
-
```
|
|
168
|
-
~/.claude/plugins/cache/live-canvas-marketplace/ # Claude Code's registered copy
|
|
169
|
-
```
|
|
170
|
-
|
|
171
|
-
Two different dirs:
|
|
172
|
-
- `~/.claude/plugins/live-canvas-marketplace/` — where liteagents puts the source
|
|
173
|
-
- `~/.claude/plugins/cache/live-canvas-marketplace/` — where Claude Code puts its own registered copy after `/plugin install`
|
|
174
|
-
|
|
175
|
-
The skill checks the cache dir to tell first-time vs returning users apart.
|
|
176
|
-
|
|
177
|
-
### Per-project, during a session
|
|
178
|
-
|
|
179
|
-
```
|
|
180
|
-
<project-root>/
|
|
181
|
-
└── .claude-design/
|
|
182
|
-
├── lab/variants/VariantA.tsx … VariantE.tsx
|
|
183
|
-
├── overlay-vanilla.js (copied into the project's public/static dir)
|
|
184
|
-
├── design-brief.json # Structured output from the interview
|
|
185
|
-
└── feedback.jsonl # JSON mode only; deleted on Finish
|
|
186
|
-
```
|
|
187
|
-
|
|
188
|
-
Plus a temporary route (e.g. `app/__live_canvas/page.tsx` for Next.js App Router). Everything under `.claude-design/` and the temporary route is deleted on Finish or Abort.
|
|
189
|
-
|
|
190
|
-
### What survives after Finish
|
|
191
|
-
|
|
192
|
-
```
|
|
193
|
-
<project-root>/
|
|
194
|
-
├── DESIGN_PLAN.md # Winner + implementation steps
|
|
195
|
-
└── DESIGN_MEMORY.md # Accumulated design-system patterns
|
|
196
|
-
```
|
|
197
|
-
|
|
198
|
-
---
|
|
199
|
-
|
|
200
|
-
## The install pipeline, end to end
|
|
201
|
-
|
|
202
|
-
1. **Liteagents installer** copies the skill:
|
|
203
|
-
- `packages/claude/skills/live-canvas/` → `~/.claude/skills/live-canvas/`
|
|
204
|
-
2. **User, once:** runs `bash packages/claude/plugins/live-canvas-marketplace/setup.sh` → copies marketplace to `~/.claude/plugins/`, runs `npm install`, adds `live-claude` function to `~/.zshrc` and `~/.bashrc`
|
|
205
|
-
3. **User, once:** in a Claude session, runs `/plugin marketplace add ~/.claude/plugins/live-canvas-marketplace` + `/plugin install live-canvas-channel@live-canvas-marketplace`
|
|
206
|
-
4. **User, every session that wants Live mode:** runs `live-claude` (function installed by step 2)
|
|
207
|
-
5. **User, whenever:** `/live-canvas` in any project
|
|
208
|
-
|
|
209
|
-
Steps 1, 2, 3 are truly one-time. Step 4 is per-session. Step 5 is per-project-use.
|
|
210
|
-
|
|
211
|
-
---
|
|
212
|
-
|
|
213
|
-
## Troubleshooting
|
|
214
|
-
|
|
215
|
-
### Channel server starts but skill still routes to JSON
|
|
216
|
-
|
|
217
|
-
Port 8788 is stuck from an earlier session's server process. Kill it:
|
|
218
|
-
|
|
219
|
-
```bash
|
|
220
|
-
lsof -i :8788
|
|
221
|
-
kill <pid>
|
|
222
|
-
```
|
|
223
|
-
|
|
224
|
-
Then `/reload-plugins` in the new session.
|
|
225
|
-
|
|
226
|
-
### Skill says "No response on :8788" even though I set everything up
|
|
227
|
-
|
|
228
|
-
Three common causes, in order of likelihood:
|
|
229
|
-
|
|
230
|
-
1. You didn't start this session with the dev flag. Close it, reopen with `live-claude`.
|
|
231
|
-
2. The plugin subprocess died on startup. In the session, run `/mcp` — look for `live-canvas` with its status. "Failed to connect" means a node/dep error: check `~/.claude/debug/<session-id>.txt` for the stderr.
|
|
232
|
-
3. You never ran step 2 of setup. Re-run `bash ~/.claude/plugins/live-canvas-marketplace/setup.sh`.
|
|
233
|
-
|
|
234
|
-
### Overlay loads in the browser but no pills appear
|
|
235
|
-
|
|
236
|
-
The overlay script didn't load. Most common cause: you started the Python server inside the wrong directory so the relative `../templates/overlay-vanilla.js` path couldn't resolve. Start the server one level up and navigate with the `/dev/` prefix.
|
|
237
|
-
|
|
238
|
-
### "Pushed to Claude ✨" toast appears but nothing happens in the terminal
|
|
239
|
-
|
|
240
|
-
Either (a) you're not in a dev-flag session, or (b) an older channel server process is answering on 8788 and is stdio-connected to a dead session. See the two troubleshooting items above.
|
|
241
|
-
|
|
242
|
-
### I want to uninstall
|
|
243
|
-
|
|
244
|
-
1. Remove the plugin from Claude Code: `/plugin uninstall live-canvas-channel`
|
|
245
|
-
2. Delete the marketplace: `/plugin marketplace remove live-canvas-marketplace`
|
|
246
|
-
3. Remove the dev flag from your alias/shortcut
|
|
247
|
-
4. Rerun liteagents installer in remove mode (or delete `~/.claude/skills/live-canvas/` and `~/.claude/plugins/live-canvas-marketplace/` by hand)
|
|
248
|
-
|
|
249
|
-
---
|
|
250
|
-
|
|
251
|
-
## Why the multi-step setup can't be hidden
|
|
252
|
-
|
|
253
|
-
The `--dangerously-load-development-channels` flag is a per-session startup argument of Claude Code itself. A running session can't promote itself to channel-enabled mid-flight; only the next session launched with the flag gets it. Same reason a skill can't silently do `/plugin install` on your behalf — the plugin system needs explicit user consent for research-preview plugins.
|
|
254
|
-
|
|
255
|
-
Until channels leave research preview and custom channels are allowlisted, step 4 is the irreducible friction. The alias removes the retyping cost.
|
|
256
|
-
|
|
257
|
-
---
|
|
258
|
-
|
|
259
|
-
## Pointers
|
|
260
|
-
|
|
261
|
-
- Plugin details: [`~/.claude/plugins/live-canvas-marketplace/plugins/live-canvas-channel/README.md`](../../plugins/live-canvas-marketplace/plugins/live-canvas-channel/README.md)
|
|
262
|
-
- Skill flow: [`SKILL.md`](./SKILL.md)
|
|
263
|
-
- Design principles reference: [`DESIGN_PRINCIPLES.md`](./DESIGN_PRINCIPLES.md)
|
|
264
|
-
- Channels reference (upstream): <https://code.claude.com/docs/en/channels-reference>
|
|
@@ -1,61 +0,0 @@
|
|
|
1
|
-
---
|
|
2
|
-
name: optimize
|
|
3
|
-
description: Optimize performance [target]
|
|
4
|
-
usage: /optimize <target-area>
|
|
5
|
-
argument-hint: [file-or-function]
|
|
6
|
-
allowed-tools: Read, Edit, Grep, Glob, Bash(git diff *), Bash(git log *), Bash(git grep *), Bash(rg *)
|
|
7
|
-
---
|
|
8
|
-
Analyze $ARGUMENTS for performance.
|
|
9
|
-
|
|
10
|
-
## Examine
|
|
11
|
-
- Time complexity (Big O)
|
|
12
|
-
- Space complexity
|
|
13
|
-
- I/O operations
|
|
14
|
-
- Database queries (N+1?)
|
|
15
|
-
- Unnecessary allocations
|
|
16
|
-
|
|
17
|
-
## Output
|
|
18
|
-
Per bottleneck:
|
|
19
|
-
- **Location** (`file:line`)
|
|
20
|
-
- **Cost** — what's slow and by how much. Concrete ("N+1 over ~1k rows on
|
|
21
|
-
every page load"), not vague ("could be faster").
|
|
22
|
-
- **Optimization** — specific change.
|
|
23
|
-
- **Expected improvement** — order-of-magnitude estimate.
|
|
24
|
-
- **Trade-offs** — readability / memory / consistency cost.
|
|
25
|
-
|
|
26
|
-
## After the analysis — verify, then fix
|
|
27
|
-
|
|
28
|
-
Performance claims are easy to invent. Validate before acting.
|
|
29
|
-
|
|
30
|
-
**Verify each bottleneck.** Re-read the cited `file:line` in context.
|
|
31
|
-
Confirm the path is **actually hot** — look for at least one of:
|
|
32
|
-
- a profile / benchmark / log line showing call frequency or duration,
|
|
33
|
-
- the path sits on an obvious hot loop / per-request handler with real
|
|
34
|
-
volume,
|
|
35
|
-
- the user provided evidence in the request.
|
|
36
|
-
|
|
37
|
-
Without one of those, the claim is **uncertain — don't optimize on
|
|
38
|
-
speculation.** Mark each finding **confirmed**, **false positive** (with
|
|
39
|
-
reason), or **uncertain (needs profiling data)**.
|
|
40
|
-
|
|
41
|
-
**Fix what's confirmed and unambiguous** — minimal change, one obvious
|
|
42
|
-
shape, **no behavior change**, no API change. Apply directly. After
|
|
43
|
-
each edit, re-read the changed region and confirm it still computes the
|
|
44
|
-
same answer (perf optimizations that quietly change semantics are the
|
|
45
|
-
worst kind).
|
|
46
|
-
|
|
47
|
-
**Stop and ask** when (HITL gates — not all the time, only here):
|
|
48
|
-
- the bottleneck is **uncertain** after grounding (no profile / log and
|
|
49
|
-
not obviously hot),
|
|
50
|
-
- the fix has **multiple reasonable shapes** (cache vs precompute vs
|
|
51
|
-
batch vs paginate vs index) — present options with tradeoffs, not a
|
|
52
|
-
chosen path,
|
|
53
|
-
- it changes **public API / response shape / DB schema / caller contract**,
|
|
54
|
-
- it trades **correctness for speed** (lossy approximation, weaker
|
|
55
|
-
consistency, eventual-vs-strict) — even when "obviously" faster, or
|
|
56
|
-
- it touches **concurrency primitives** (locks, atomics, ordering) —
|
|
57
|
-
easy to introduce races.
|
|
58
|
-
|
|
59
|
-
Final report: **confirmed-and-fixed** · **confirmed-but-asking** (why +
|
|
60
|
-
options) · **false-positive** (why) · **uncertain** (what profiling /
|
|
61
|
-
data is needed to decide).
|