agentic-loop 3.23.0 → 3.26.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/commands/color.md +74 -0
- package/.claude/commands/tab-rename.md +53 -0
- package/.claude/commands/tour.md +2 -2
- package/.claude/commands/vibe-help.md +1 -1
- package/.claude/commands/vibe-list.md +7 -7
- package/.claude/skills/color/SKILL.md +74 -0
- package/.claude/skills/prd/SKILL.md +97 -21
- package/.claude/skills/prd-check/SKILL.md +67 -10
- package/.claude/skills/tour/SKILL.md +2 -2
- package/.claude/skills/vibe-help/SKILL.md +1 -1
- package/.claude/skills/vibe-list/SKILL.md +8 -8
- package/README.md +40 -38
- package/package.json +1 -1
- package/ralph/hooks/install.sh +47 -63
- package/ralph/init.sh +6 -6
- package/ralph/loop.sh +127 -3
- package/ralph/prd-check.sh +5 -5
- package/ralph/prd.sh +1 -1
- package/ralph/setup/feature-tour.sh +1 -1
- package/ralph/setup/tutorial.sh +3 -3
- package/ralph/setup.sh +14 -6
- package/ralph/utils.sh +48 -0
- package/templates/examples/CLAUDE-fullstack.md +3 -3
- package/.claude/commands/idea.md +0 -216
- package/.claude/skills/idea/SKILL.md +0 -272
|
@@ -0,0 +1,74 @@
|
|
|
1
|
+
---
|
|
2
|
+
description: Pick the terminal background color Ralph uses to distinguish its terminal from Claude Code.
|
|
3
|
+
---
|
|
4
|
+
|
|
5
|
+
# Terminal Color
|
|
6
|
+
|
|
7
|
+
The user wants to change Ralph's terminal background tint - the color applied during `npx agentic-loop run` to visually distinguish Ralph's terminal from Claude Code.
|
|
8
|
+
|
|
9
|
+
> **Note:** This only works in macOS Terminal.app. On other terminals (iTerm2, VS Code, Linux), Ralph skips tinting automatically.
|
|
10
|
+
|
|
11
|
+
## Step 1: Show Current Color
|
|
12
|
+
|
|
13
|
+
Read `.ralph/config.json` and check for `terminalTint`. Show the current setting:
|
|
14
|
+
- If set: "Current tint: `{value}`"
|
|
15
|
+
- If not set: "Current tint: `#1a2e2e` (default dark teal)"
|
|
16
|
+
|
|
17
|
+
## Step 2: Ask Color Preference
|
|
18
|
+
|
|
19
|
+
Use AskUserQuestion:
|
|
20
|
+
|
|
21
|
+
**Question:** "What color should Ralph's terminal background be?"
|
|
22
|
+
**Header:** "Tint color"
|
|
23
|
+
**Options:**
|
|
24
|
+
- **Dark Teal (default)** - "`#1a2e2e` - subtle blue-green, easy on the eyes"
|
|
25
|
+
- **Dark Purple** - "`#1a1a2e` - cool and distinct from standard dark themes"
|
|
26
|
+
- **Dark Red** - "`#2e1a1a` - warm undertone, clearly different"
|
|
27
|
+
- **Off** - "Disable terminal tinting entirely"
|
|
28
|
+
|
|
29
|
+
If the user selects "Other", ask them to provide a hex color (e.g., `#2e2e1a`).
|
|
30
|
+
|
|
31
|
+
## Step 3: Validate (if custom hex)
|
|
32
|
+
|
|
33
|
+
If the user provided a custom hex:
|
|
34
|
+
- Must match `#` followed by exactly 6 hex characters (`/^#[0-9a-fA-F]{6}$/`)
|
|
35
|
+
- If invalid, say "That doesn't look like a valid hex color (e.g., `#1a2e2e`). Try again." and re-ask.
|
|
36
|
+
|
|
37
|
+
## Step 4: Save to Config
|
|
38
|
+
|
|
39
|
+
Read `.ralph/config.json`, set the `terminalTint` field, and write it back.
|
|
40
|
+
|
|
41
|
+
- **If a color was chosen:** Set `"terminalTint": "#xxxxxx"`
|
|
42
|
+
- **If "Off" was chosen:** Set `"terminalTint": "off"`
|
|
43
|
+
|
|
44
|
+
Use jq to update:
|
|
45
|
+
```bash
|
|
46
|
+
jq --arg color "THE_HEX_VALUE" '.terminalTint = $color' .ralph/config.json > .ralph/config.json.tmp && mv .ralph/config.json.tmp .ralph/config.json
|
|
47
|
+
```
|
|
48
|
+
|
|
49
|
+
## Step 5: Preview (macOS Terminal.app only)
|
|
50
|
+
|
|
51
|
+
If running in Terminal.app, apply the color immediately so the user can see it:
|
|
52
|
+
|
|
53
|
+
```bash
|
|
54
|
+
# Apply preview (will be restored when Claude session ends)
|
|
55
|
+
osascript -e 'tell application "Terminal" to set background color of front window to {R, G, B}' 2>/dev/null
|
|
56
|
+
```
|
|
57
|
+
|
|
58
|
+
Where R, G, B are the hex values converted to 16-bit (multiply each 8-bit value by 257).
|
|
59
|
+
|
|
60
|
+
If "Off" was chosen, skip the preview.
|
|
61
|
+
|
|
62
|
+
## Step 6: Confirm
|
|
63
|
+
|
|
64
|
+
Say:
|
|
65
|
+
|
|
66
|
+
"Done! Ralph will use `#xxxxxx` as the terminal tint.
|
|
67
|
+
|
|
68
|
+
Next time you run `npx agentic-loop run`, the terminal background will change to this color. It restores to your original background when the loop ends.
|
|
69
|
+
|
|
70
|
+
Run `/color` again anytime to change it."
|
|
71
|
+
|
|
72
|
+
If "Off" was chosen, say:
|
|
73
|
+
|
|
74
|
+
"Done! Terminal tinting is now disabled. Ralph will run without changing your terminal background."
|
|
@@ -0,0 +1,53 @@
|
|
|
1
|
+
---
|
|
2
|
+
description: Rename the current terminal tab so you can tell your Claude Code tabs apart.
|
|
3
|
+
---
|
|
4
|
+
|
|
5
|
+
# Tab Rename
|
|
6
|
+
|
|
7
|
+
The user wants to rename the current terminal tab. This is useful when you have multiple Claude Code sessions open and every tab just shows "...skip-permissions".
|
|
8
|
+
|
|
9
|
+
> **Note:** This uses AppleScript and only works in macOS Terminal.app and iTerm2.
|
|
10
|
+
|
|
11
|
+
## Step 1: Determine the Tab Name
|
|
12
|
+
|
|
13
|
+
Check if the user provided an argument: `$ARGUMENTS`
|
|
14
|
+
|
|
15
|
+
- **If provided:** Use it as the tab name (e.g., `/tab-rename my-api` → tab name is "my-api").
|
|
16
|
+
- **If not provided:** Auto-detect a sensible name from the project. Read the `name` field from `package.json` if it exists, or use the current directory's basename. Then ask the user to confirm or customize:
|
|
17
|
+
|
|
18
|
+
Use AskUserQuestion:
|
|
19
|
+
|
|
20
|
+
**Question:** "What should this tab be called?"
|
|
21
|
+
**Header:** "Tab name"
|
|
22
|
+
**Options:**
|
|
23
|
+
- **{detected_name}** - "Auto-detected from the project"
|
|
24
|
+
- **Claude: {detected_name}** - "Prefixed to distinguish from Ralph's terminal"
|
|
25
|
+
|
|
26
|
+
If the user selects "Other", use their custom text as the tab name.
|
|
27
|
+
|
|
28
|
+
## Step 2: Set the Tab Title
|
|
29
|
+
|
|
30
|
+
Detect which terminal is running and set the title:
|
|
31
|
+
|
|
32
|
+
```bash
|
|
33
|
+
# Try Terminal.app first
|
|
34
|
+
osascript -e 'tell application "Terminal" to set custom title of selected tab of front window to "TAB_NAME"' 2>/dev/null
|
|
35
|
+
```
|
|
36
|
+
|
|
37
|
+
If that fails (not Terminal.app), try iTerm2:
|
|
38
|
+
|
|
39
|
+
```bash
|
|
40
|
+
osascript -e 'tell application "iTerm2" to tell current session of current window to set name to "TAB_NAME"' 2>/dev/null
|
|
41
|
+
```
|
|
42
|
+
|
|
43
|
+
**Important:** Escape any double quotes in the tab name before embedding in the AppleScript string.
|
|
44
|
+
|
|
45
|
+
## Step 3: Confirm
|
|
46
|
+
|
|
47
|
+
If the rename succeeded, say:
|
|
48
|
+
|
|
49
|
+
"Tab renamed to **{tab_name}**."
|
|
50
|
+
|
|
51
|
+
If both osascript commands fail, say:
|
|
52
|
+
|
|
53
|
+
"Tab renaming requires macOS Terminal.app or iTerm2. On other terminals, you can set the tab title manually with: `printf '\033]0;my-title\007'`"
|
package/.claude/commands/tour.md
CHANGED
|
@@ -337,7 +337,7 @@ Quick Reference
|
|
|
337
337
|
───────────────
|
|
338
338
|
|
|
339
339
|
Workflow:
|
|
340
|
-
/
|
|
340
|
+
/prd [feature] Brainstorm → PRD
|
|
341
341
|
npx ralph run Execute autonomously
|
|
342
342
|
npx ralph status Check progress
|
|
343
343
|
npx ralph stop Stop after current story
|
|
@@ -354,4 +354,4 @@ Other:
|
|
|
354
354
|
/vibe-help Full cheatsheet
|
|
355
355
|
```
|
|
356
356
|
|
|
357
|
-
Say: "You're all set! Run `/
|
|
357
|
+
Say: "You're all set! Run `/prd [your next feature]` to get started."
|
|
@@ -11,7 +11,7 @@ Print this cheatsheet for the user. Do not add any commentary or explanation.
|
|
|
11
11
|
## The Loop
|
|
12
12
|
|
|
13
13
|
```
|
|
14
|
-
/
|
|
14
|
+
/prd [feature] brainstorm & generate PRD
|
|
15
15
|
npx ralph run autonomous coding loop (live activity feed)
|
|
16
16
|
npx ralph run --quiet same, but suppress activity feed
|
|
17
17
|
npx ralph status check progress
|
|
@@ -12,7 +12,7 @@ Print this complete reference for the user. Do not add any commentary.
|
|
|
12
12
|
|
|
13
13
|
| Command | Description |
|
|
14
14
|
|---------|-------------|
|
|
15
|
-
| `/
|
|
15
|
+
| `/prd [feature]` | Brainstorm feature, generate executable PRD for Ralph |
|
|
16
16
|
| `/setup-review` | Review config against project, fix mismatches |
|
|
17
17
|
| `/sign` | Add a learned pattern for Ralph to remember |
|
|
18
18
|
| `/my-dna` | Set up your personal style preferences |
|
|
@@ -90,7 +90,7 @@ Print this complete reference for the user. Do not add any commentary.
|
|
|
90
90
|
## The Loop
|
|
91
91
|
|
|
92
92
|
```
|
|
93
|
-
/
|
|
93
|
+
/prd [feature] Brainstorm → PRD
|
|
94
94
|
npx ralph run Autonomous coding
|
|
95
95
|
npx ralph status Check progress
|
|
96
96
|
npx ralph stop Stop after current story
|
|
@@ -100,10 +100,10 @@ npx ralph stop Stop after current story
|
|
|
100
100
|
|
|
101
101
|
## Slash Command Details
|
|
102
102
|
|
|
103
|
-
### /
|
|
104
|
-
Brainstorm
|
|
105
|
-
-
|
|
106
|
-
-
|
|
103
|
+
### /prd [feature description]
|
|
104
|
+
Brainstorm feature, explore codebase, ask clarifying questions.
|
|
105
|
+
- Accepts a description or plan file (`docs/ideas/{feature}.md`)
|
|
106
|
+
- Splits into executable PRD stories
|
|
107
107
|
- Writes to `.ralph/prd.json`
|
|
108
108
|
|
|
109
109
|
### /review [file or selection]
|
|
@@ -206,7 +206,7 @@ npx ralph unsign "camelCase"
|
|
|
206
206
|
|
|
207
207
|
CLAUDE.md # Project standards (shared with team)
|
|
208
208
|
PROMPT.md # Base prompt for Ralph sessions
|
|
209
|
-
docs/ideas/ # Brainstorm outputs from /
|
|
209
|
+
docs/ideas/ # Brainstorm outputs from /prd
|
|
210
210
|
|
|
211
211
|
# Global files (your home directory)
|
|
212
212
|
~/.claude/
|
|
@@ -0,0 +1,74 @@
|
|
|
1
|
+
---
|
|
2
|
+
description: Pick the terminal background color Ralph uses to distinguish its terminal from Claude Code.
|
|
3
|
+
---
|
|
4
|
+
|
|
5
|
+
# Terminal Color
|
|
6
|
+
|
|
7
|
+
The user wants to change Ralph's terminal background tint - the color applied during `npx agentic-loop run` to visually distinguish Ralph's terminal from Claude Code.
|
|
8
|
+
|
|
9
|
+
> **Note:** This only works in macOS Terminal.app. On other terminals (iTerm2, VS Code, Linux), Ralph skips tinting automatically.
|
|
10
|
+
|
|
11
|
+
## Step 1: Show Current Color
|
|
12
|
+
|
|
13
|
+
Read `.ralph/config.json` and check for `terminalTint`. Show the current setting:
|
|
14
|
+
- If set: "Current tint: `{value}`"
|
|
15
|
+
- If not set: "Current tint: `#1a2e2e` (default dark teal)"
|
|
16
|
+
|
|
17
|
+
## Step 2: Ask Color Preference
|
|
18
|
+
|
|
19
|
+
Use AskUserQuestion:
|
|
20
|
+
|
|
21
|
+
**Question:** "What color should Ralph's terminal background be?"
|
|
22
|
+
**Header:** "Tint color"
|
|
23
|
+
**Options:**
|
|
24
|
+
- **Dark Teal (default)** - "`#1a2e2e` - subtle blue-green, easy on the eyes"
|
|
25
|
+
- **Dark Purple** - "`#1a1a2e` - cool and distinct from standard dark themes"
|
|
26
|
+
- **Dark Red** - "`#2e1a1a` - warm undertone, clearly different"
|
|
27
|
+
- **Off** - "Disable terminal tinting entirely"
|
|
28
|
+
|
|
29
|
+
If the user selects "Other", ask them to provide a hex color (e.g., `#2e2e1a`).
|
|
30
|
+
|
|
31
|
+
## Step 3: Validate (if custom hex)
|
|
32
|
+
|
|
33
|
+
If the user provided a custom hex:
|
|
34
|
+
- Must match `#` followed by exactly 6 hex characters (`/^#[0-9a-fA-F]{6}$/`)
|
|
35
|
+
- If invalid, say "That doesn't look like a valid hex color (e.g., `#1a2e2e`). Try again." and re-ask.
|
|
36
|
+
|
|
37
|
+
## Step 4: Save to Config
|
|
38
|
+
|
|
39
|
+
Read `.ralph/config.json`, set the `terminalTint` field, and write it back.
|
|
40
|
+
|
|
41
|
+
- **If a color was chosen:** Set `"terminalTint": "#xxxxxx"`
|
|
42
|
+
- **If "Off" was chosen:** Set `"terminalTint": "off"`
|
|
43
|
+
|
|
44
|
+
Use jq to update:
|
|
45
|
+
```bash
|
|
46
|
+
jq --arg color "THE_HEX_VALUE" '.terminalTint = $color' .ralph/config.json > .ralph/config.json.tmp && mv .ralph/config.json.tmp .ralph/config.json
|
|
47
|
+
```
|
|
48
|
+
|
|
49
|
+
## Step 5: Preview (macOS Terminal.app only)
|
|
50
|
+
|
|
51
|
+
If running in Terminal.app, apply the color immediately so the user can see it:
|
|
52
|
+
|
|
53
|
+
```bash
|
|
54
|
+
# Apply preview (will be restored when Claude session ends)
|
|
55
|
+
osascript -e 'tell application "Terminal" to set background color of front window to {R, G, B}' 2>/dev/null
|
|
56
|
+
```
|
|
57
|
+
|
|
58
|
+
Where R, G, B are the hex values converted to 16-bit (multiply each 8-bit value by 257).
|
|
59
|
+
|
|
60
|
+
If "Off" was chosen, skip the preview.
|
|
61
|
+
|
|
62
|
+
## Step 6: Confirm
|
|
63
|
+
|
|
64
|
+
Say:
|
|
65
|
+
|
|
66
|
+
"Done! Ralph will use `#xxxxxx` as the terminal tint.
|
|
67
|
+
|
|
68
|
+
Next time you run `npx agentic-loop run`, the terminal background will change to this color. It restores to your original background when the loop ends.
|
|
69
|
+
|
|
70
|
+
Run `/color` again anytime to change it."
|
|
71
|
+
|
|
72
|
+
If "Off" was chosen, say:
|
|
73
|
+
|
|
74
|
+
"Done! Terminal tinting is now disabled. Ralph will run without changing your terminal background."
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
---
|
|
2
|
-
description:
|
|
2
|
+
description: Brainstorm, harden, and generate an executable PRD for Ralph from a description, idea file, or plan file.
|
|
3
3
|
---
|
|
4
4
|
|
|
5
5
|
# /prd - Generate PRD for Ralph
|
|
@@ -19,21 +19,27 @@ $ARGUMENTS
|
|
|
19
19
|
### Step 1: Determine Input Type
|
|
20
20
|
|
|
21
21
|
**If `$ARGUMENTS` is empty:**
|
|
22
|
-
1.
|
|
22
|
+
1. Scan for existing source files:
|
|
23
23
|
```bash
|
|
24
|
-
ls docs/ideas/*.md 2>/dev/null || echo "No
|
|
24
|
+
ls docs/ideas/*.md 2>/dev/null || echo "No idea files found"
|
|
25
|
+
ls docs/plans/*.md 2>/dev/null || echo "No plan files found"
|
|
25
26
|
```
|
|
26
|
-
2.
|
|
27
|
-
- Convert
|
|
27
|
+
2. List what's available and ask: "Would you like to:
|
|
28
|
+
- Convert a source file (e.g., `/prd auth` or `/prd plans/my-feature`)
|
|
28
29
|
- Describe a feature directly (e.g., `/prd 'Add user logout button'`)"
|
|
29
30
|
|
|
30
|
-
**If `$ARGUMENTS` looks like a file
|
|
31
|
+
**If `$ARGUMENTS` looks like a plan file** (`plans/` prefix, `docs/plans/` path, or full path to a plan file):
|
|
31
32
|
- If it's a full path, use it directly
|
|
32
|
-
- If it's just a
|
|
33
|
+
- If it's `plans/name` or just a prefix, look for `docs/plans/{name}.md`
|
|
34
|
+
- Proceed to "Read and Understand the Plan"
|
|
35
|
+
|
|
36
|
+
**If `$ARGUMENTS` looks like an idea file reference** (no spaces, matches `docs/ideas/*.md`):
|
|
37
|
+
- If it's a full path, use it directly
|
|
38
|
+
- If it's just a name like `content-engine`, check `docs/ideas/content-engine.md` first, fall back to `docs/plans/content-engine.md`
|
|
33
39
|
- Proceed to "Read and Understand the Idea"
|
|
34
40
|
|
|
35
41
|
**If `$ARGUMENTS` is a description** (has spaces, is a sentence):
|
|
36
|
-
- This is the **quick PRD flow** - no
|
|
42
|
+
- This is the **quick PRD flow** - no source file created
|
|
37
43
|
- Good for small features that don't need documentation
|
|
38
44
|
- Skip to "Confirm Understanding" below
|
|
39
45
|
|
|
@@ -48,9 +54,9 @@ Say: "I've read `{path}`. Here's my understanding:
|
|
|
48
54
|
**Solution:** {one line}
|
|
49
55
|
**Scope:** {key items}
|
|
50
56
|
|
|
51
|
-
I'll now
|
|
57
|
+
I'll now ask a few hardening questions before generating stories."
|
|
52
58
|
|
|
53
|
-
**
|
|
59
|
+
**Proceed to Step 2.5.**
|
|
54
60
|
|
|
55
61
|
### Step 2b: Confirm Understanding (from description)
|
|
56
62
|
|
|
@@ -65,12 +71,58 @@ Use the detected tech stack, test runners, and constraints when building each st
|
|
|
65
71
|
|
|
66
72
|
Then say: "I'll create a PRD for: **{description}**
|
|
67
73
|
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
74
|
+
Here's what I found in your codebase: [brief summary of tech stack, existing patterns]
|
|
75
|
+
|
|
76
|
+
I'll now ask a few hardening questions before generating stories."
|
|
77
|
+
|
|
78
|
+
**Proceed to Step 2.5.**
|
|
79
|
+
|
|
80
|
+
### Step 2c: Read and Understand the Plan (from plan file)
|
|
81
|
+
|
|
82
|
+
Read the plan file and summarize:
|
|
83
|
+
|
|
84
|
+
Say: "I've read `{path}`. Here's my understanding:
|
|
85
|
+
|
|
86
|
+
**Feature/Goal:** {name}
|
|
87
|
+
**Approach:** {summary of approach}
|
|
88
|
+
**Key Files:** {files mentioned}
|
|
89
|
+
**Scope:** {key items}
|
|
90
|
+
|
|
91
|
+
I'll now ask a few hardening questions before generating stories."
|
|
92
|
+
|
|
93
|
+
**Proceed to Step 2.5.**
|
|
94
|
+
|
|
95
|
+
### Step 2.5: Harden the Requirements
|
|
96
|
+
|
|
97
|
+
**This step runs for ALL input types** (idea file, plan file, or description). Review what you already know from the input and ask ONLY about gaps — skip questions the input already answers.
|
|
72
98
|
|
|
73
|
-
|
|
99
|
+
Say: "Before I generate stories, I want to make sure we've covered the key areas:"
|
|
100
|
+
|
|
101
|
+
**Scope & UX** (always ask):
|
|
102
|
+
- What's in scope vs out of scope?
|
|
103
|
+
- Is this user-facing? What does the user see/do?
|
|
104
|
+
- What are the edge cases?
|
|
105
|
+
- **Responsive design** (if frontend): Must it work on mobile/tablet? What breakpoints? Any layout changes between screen sizes?
|
|
106
|
+
|
|
107
|
+
**Security** (ask if feature involves auth, user input, or sensitive data):
|
|
108
|
+
- Authentication: Who can access this? Login required?
|
|
109
|
+
- Passwords: How stored? (must be hashed, never plain text)
|
|
110
|
+
- User input: What validation needed? (SQL injection, XSS)
|
|
111
|
+
- Sensitive data: What should NEVER be in API responses?
|
|
112
|
+
- Rate limiting: Should this be rate limited?
|
|
113
|
+
|
|
114
|
+
**Scale** (ask if feature involves lists, data, or APIs):
|
|
115
|
+
- How many items expected? (10s, 1000s, millions?)
|
|
116
|
+
- Pagination needed? What's the max per page?
|
|
117
|
+
- Caching needed? How fresh must data be?
|
|
118
|
+
- Database indexes: What will be queried/sorted frequently?
|
|
119
|
+
|
|
120
|
+
**Migration** (ask if feature involves restructuring or moving code):
|
|
121
|
+
- Source → destination mapping: Where does code currently live? Where should it end up?
|
|
122
|
+
- Phases: What's the logical order?
|
|
123
|
+
- Verification: What commands prove each phase worked?
|
|
124
|
+
|
|
125
|
+
End with: "(Or say **'go'** to proceed with defaults for anything not answered)"
|
|
74
126
|
|
|
75
127
|
**STOP and wait for user input** (can be brief or 'go').
|
|
76
128
|
|
|
@@ -176,7 +228,7 @@ Does acceptanceCriteria include:
|
|
|
176
228
|
- Large datasets → "Database query uses index on [column]"
|
|
177
229
|
|
|
178
230
|
#### 6e. Context (for all stories)
|
|
179
|
-
- Does `contextFiles` include the idea file
|
|
231
|
+
- Does `contextFiles` include the source file (idea or plan file, especially if it has ASCII mockups)?
|
|
180
232
|
- Does `contextFiles` include styleguide (if exists)?
|
|
181
233
|
- Does `techStack` include the relevant stack for this story?
|
|
182
234
|
- Does `constraints` include any rules this story must follow?
|
|
@@ -192,6 +244,26 @@ If the feature has ANY frontend stories that add or modify user-facing UI:
|
|
|
192
244
|
- The E2E story should be the LAST story (depends on all others) to test the full integrated flow
|
|
193
245
|
- If no E2E story exists, CREATE one as the final story
|
|
194
246
|
|
|
247
|
+
#### 6h. Responsive Design (for frontend stories)
|
|
248
|
+
Every frontend story that creates or modifies user-facing UI MUST include:
|
|
249
|
+
- `acceptanceCriteria` with responsive behavior: "Layout adapts to mobile (< 768px), tablet (768-1024px), and desktop (> 1024px)"
|
|
250
|
+
- `testSteps` with a viewport resize check OR Playwright test that validates mobile layout
|
|
251
|
+
- `notes` with Playwright MCP instructions to screenshot at mobile and desktop widths
|
|
252
|
+
|
|
253
|
+
**Example acceptanceCriteria:**
|
|
254
|
+
```
|
|
255
|
+
"Component renders in single-column layout on mobile (< 768px)",
|
|
256
|
+
"Navigation collapses to hamburger menu on mobile",
|
|
257
|
+
"Touch targets are at least 44x44px on mobile"
|
|
258
|
+
```
|
|
259
|
+
|
|
260
|
+
**Example testSteps:**
|
|
261
|
+
```
|
|
262
|
+
"npx playwright test tests/e2e/dashboard.spec.ts --project=mobile"
|
|
263
|
+
```
|
|
264
|
+
|
|
265
|
+
If a frontend story has no responsive criteria and the feature is user-facing, add them.
|
|
266
|
+
|
|
195
267
|
#### 6g. Test Scenario Specificity
|
|
196
268
|
Every story's `notes` field MUST include **3+ specific test scenarios** that describe what to test and how. Vague notes like "Test the service methods" are not acceptable.
|
|
197
269
|
|
|
@@ -214,7 +286,7 @@ Bad example:
|
|
|
214
286
|
| Story depends on something not created | Reorder or add missing dependency |
|
|
215
287
|
| Auth story missing security criteria | Add password hashing, rate limiting to acceptanceCriteria |
|
|
216
288
|
| List endpoint missing pagination | Add pagination criteria to acceptanceCriteria |
|
|
217
|
-
| Frontend missing contextFiles | Add
|
|
289
|
+
| Frontend missing contextFiles | Add source file (idea or plan) + styleguide paths |
|
|
218
290
|
| Frontend missing testUrl | Add URL from config |
|
|
219
291
|
| Frontend missing mcp | Add `"mcp": ["playwright", "devtools"]` |
|
|
220
292
|
| Frontend notes missing Playwright MCP guidance | Add visual verification instructions to notes (see Playwright MCP section) |
|
|
@@ -223,6 +295,7 @@ Bad example:
|
|
|
223
295
|
| testSteps use import-checks (`python -c "from X import Y"`) | Replace with curl, pytest, or real behavioral tests |
|
|
224
296
|
| No E2E story for user-facing feature | Add a final E2E story with Playwright tests |
|
|
225
297
|
| Story notes lack specific test scenarios | Add 3+ concrete scenarios with inputs, expected outputs, and fixture references |
|
|
298
|
+
| Frontend story missing responsive design | Add mobile/tablet/desktop acceptanceCriteria and viewport test steps |
|
|
226
299
|
|
|
227
300
|
### Step 7: Reorder if Needed
|
|
228
301
|
|
|
@@ -274,7 +347,7 @@ Once approved, say:
|
|
|
274
347
|
|
|
275
348
|
"PRD is ready!
|
|
276
349
|
|
|
277
|
-
**Source:** `{
|
|
350
|
+
**Source:** `{source-file-path}`
|
|
278
351
|
**PRD:** `.ralph/prd.json` ({N} stories)
|
|
279
352
|
|
|
280
353
|
To start autonomous development, open another terminal and run:
|
|
@@ -296,7 +369,7 @@ Ralph will work through each story, running tests and committing as it goes."
|
|
|
296
369
|
{
|
|
297
370
|
"feature": {
|
|
298
371
|
"name": "Feature Name",
|
|
299
|
-
"ideaFile": "docs/ideas/{feature-name}.md",
|
|
372
|
+
"ideaFile": "docs/ideas/{feature-name}.md or docs/plans/{feature-name}.md",
|
|
300
373
|
"branch": "feature/{feature-name}",
|
|
301
374
|
"status": "pending"
|
|
302
375
|
},
|
|
@@ -404,7 +477,7 @@ Ralph will work through each story, running tests and committing as it goes."
|
|
|
404
477
|
|
|
405
478
|
| Field | Required | Description |
|
|
406
479
|
|-------|----------|-------------|
|
|
407
|
-
| `feature` | Yes | Feature name, ideaFile, branch, status |
|
|
480
|
+
| `feature` | Yes | Feature name, ideaFile (idea or plan path), branch, status |
|
|
408
481
|
| `metadata` | Yes | Created date, estimated stories, complexity |
|
|
409
482
|
|
|
410
483
|
**Note:** URLs come from `.ralph/config.json`, not the PRD. Use `{config.urls.backend}` in testSteps.
|
|
@@ -786,6 +859,7 @@ Use `contextFiles` to point Claude to important reference material:
|
|
|
786
859
|
```json
|
|
787
860
|
"contextFiles": [
|
|
788
861
|
"docs/ideas/dashboard.md",
|
|
862
|
+
"docs/plans/auth-feature.md",
|
|
789
863
|
"src/styles/styleguide.html",
|
|
790
864
|
"docs/api-spec.md"
|
|
791
865
|
]
|
|
@@ -807,7 +881,9 @@ This is where ASCII mockups, design specs, and detailed requirements live. Claud
|
|
|
807
881
|
### UI Stories Must Include
|
|
808
882
|
- `testUrl` - Where to verify
|
|
809
883
|
- `mcp: ["playwright", "devtools"]` - Browser tools
|
|
810
|
-
- Acceptance criteria for: page loads, elements render
|
|
884
|
+
- Acceptance criteria for: page loads, elements render correctly
|
|
885
|
+
- **Responsive design criteria**: layout adapts at mobile (< 768px), tablet (768-1024px), desktop (> 1024px) breakpoints
|
|
886
|
+
- Playwright test or MCP verification at multiple viewport widths
|
|
811
887
|
|
|
812
888
|
### API Stories Must Include
|
|
813
889
|
- `apiContract` - Expected request/response
|
|
@@ -4,7 +4,7 @@ description: Run PRD validation to check story quality, test coverage, and struc
|
|
|
4
4
|
|
|
5
5
|
# PRD Check
|
|
6
6
|
|
|
7
|
-
Run PRD validation on demand to check story quality, test coverage, and structure before starting the autonomous loop.
|
|
7
|
+
Run PRD validation on demand to check story quality, test coverage, and structure before starting the autonomous loop. Cross-references against learned signs and past failure patterns.
|
|
8
8
|
|
|
9
9
|
## Instructions
|
|
10
10
|
|
|
@@ -17,32 +17,89 @@ ls -la .ralph/prd.json 2>/dev/null || echo "NOT_FOUND"
|
|
|
17
17
|
```
|
|
18
18
|
|
|
19
19
|
If no PRD exists, tell the user:
|
|
20
|
-
> No PRD found at `.ralph/prd.json`. Generate one first with `/
|
|
20
|
+
> No PRD found at `.ralph/prd.json`. Generate one first with `/prd`.
|
|
21
21
|
|
|
22
22
|
**STOP** if no PRD found.
|
|
23
23
|
|
|
24
|
-
### Step 2:
|
|
24
|
+
### Step 2: Load Project Knowledge
|
|
25
25
|
|
|
26
|
-
|
|
26
|
+
Read the project's accumulated knowledge:
|
|
27
|
+
|
|
28
|
+
1. Read signs:
|
|
29
|
+
```bash
|
|
30
|
+
cat .ralph/signs.json 2>/dev/null
|
|
31
|
+
```
|
|
32
|
+
|
|
33
|
+
2. Read suggested signs (last 50 lines — file can be huge):
|
|
34
|
+
```bash
|
|
35
|
+
tail -50 .ralph/suggested-signs.txt 2>/dev/null
|
|
36
|
+
```
|
|
37
|
+
|
|
38
|
+
3. Read recent progress for failure patterns:
|
|
39
|
+
```bash
|
|
40
|
+
tail -100 .ralph/progress.txt 2>/dev/null
|
|
41
|
+
```
|
|
42
|
+
|
|
43
|
+
### Step 3: Run Structural Validation (dry-run)
|
|
27
44
|
|
|
28
45
|
```bash
|
|
29
46
|
npx ralph prd-check --dry-run 2>&1
|
|
30
47
|
```
|
|
31
48
|
|
|
32
|
-
|
|
49
|
+
Present any structural issues found.
|
|
50
|
+
|
|
51
|
+
### Step 4: Cross-Reference Against Signs
|
|
52
|
+
|
|
53
|
+
Read `.ralph/prd.json` and for each story, check if any sign applies:
|
|
54
|
+
|
|
55
|
+
- **Backend signs** → check against backend stories
|
|
56
|
+
- **Frontend signs** → check against frontend stories
|
|
57
|
+
- **General signs** → check against all stories
|
|
58
|
+
|
|
59
|
+
For each applicable sign, verify the story's `acceptanceCriteria`, `constraints`,
|
|
60
|
+
`notes`, or `testSteps` reflect the pattern. Flag stories that should account for
|
|
61
|
+
a sign but don't.
|
|
62
|
+
|
|
63
|
+
**Examples:**
|
|
64
|
+
- Sign: "Always use bcrypt cost 10+ for passwords" → Flag auth stories missing
|
|
65
|
+
bcrypt in acceptanceCriteria
|
|
66
|
+
- Sign: "Use date-fns instead of moment.js" → Flag frontend stories that create
|
|
67
|
+
date utilities without this constraint
|
|
68
|
+
- Sign: "Add data-testid for Playwright selectors" → Flag frontend stories missing
|
|
69
|
+
this in constraints
|
|
70
|
+
|
|
71
|
+
### Step 5: Check Against Suggested Learnings
|
|
72
|
+
|
|
73
|
+
Scan `suggested-signs.txt` for patterns relevant to the current PRD's feature area.
|
|
74
|
+
Flag any recurring failure patterns that the PRD's stories don't address.
|
|
75
|
+
|
|
76
|
+
### Step 6: Present Results
|
|
77
|
+
|
|
78
|
+
Summarize all findings in categories:
|
|
33
79
|
|
|
34
|
-
|
|
80
|
+
> **Structural Issues** (from prd-check):
|
|
81
|
+
> - [list]
|
|
82
|
+
>
|
|
83
|
+
> **Sign Conflicts** (stories that don't account for known patterns):
|
|
84
|
+
> - TASK-003: Missing sign "bcrypt cost 10+" in auth story
|
|
85
|
+
> - TASK-005: Missing sign "data-testid attributes" in frontend story
|
|
86
|
+
>
|
|
87
|
+
> **Suggested Improvements** (from past learnings):
|
|
88
|
+
> - [relevant patterns from suggested-signs.txt]
|
|
35
89
|
|
|
36
|
-
|
|
37
|
-
> "Would you like me to fix these issues in the PRD?"
|
|
90
|
+
Ask: "Would you like me to fix these issues in the PRD?"
|
|
38
91
|
|
|
39
92
|
**STOP and wait for user response.**
|
|
40
93
|
|
|
41
|
-
If
|
|
94
|
+
If yes, update `.ralph/prd.json`:
|
|
95
|
+
- Add missing sign patterns to relevant story `constraints` or `acceptanceCriteria`
|
|
96
|
+
- Fix structural issues per PRD best practices
|
|
97
|
+
- Write the fixed file back
|
|
42
98
|
|
|
43
99
|
## Notes
|
|
44
100
|
|
|
45
|
-
- This is the same validation that runs automatically at `ralph run` startup
|
|
101
|
+
- This is the same structural validation that runs automatically at `ralph run` startup
|
|
46
102
|
- `--dry-run` skips auto-fix so you have control over what changes
|
|
47
103
|
- Custom checks in `.ralph/checks/prd/` are also evaluated
|
|
104
|
+
- Signs cross-referencing catches patterns that structural validation can't
|
|
48
105
|
- Run this before `ralph run` to catch and fix issues interactively
|
|
@@ -337,7 +337,7 @@ Quick Reference
|
|
|
337
337
|
───────────────
|
|
338
338
|
|
|
339
339
|
Workflow:
|
|
340
|
-
/
|
|
340
|
+
/prd [feature] Brainstorm → PRD
|
|
341
341
|
npx ralph run Execute autonomously
|
|
342
342
|
npx ralph status Check progress
|
|
343
343
|
npx ralph stop Stop after current story
|
|
@@ -354,4 +354,4 @@ Other:
|
|
|
354
354
|
/vibe-help Full cheatsheet
|
|
355
355
|
```
|
|
356
356
|
|
|
357
|
-
Say: "You're all set! Run `/
|
|
357
|
+
Say: "You're all set! Run `/prd [your next feature]` to get started."
|
|
@@ -11,7 +11,7 @@ Print this cheatsheet for the user. Do not add any commentary or explanation.
|
|
|
11
11
|
## The Loop
|
|
12
12
|
|
|
13
13
|
```
|
|
14
|
-
/
|
|
14
|
+
/prd [feature] brainstorm & generate PRD
|
|
15
15
|
npx ralph run autonomous coding loop (live activity feed)
|
|
16
16
|
npx ralph run --quiet same, but suppress activity feed
|
|
17
17
|
npx ralph status check progress
|
|
@@ -12,8 +12,8 @@ Print this complete reference for the user. Do not add any commentary.
|
|
|
12
12
|
|
|
13
13
|
| Command | Description |
|
|
14
14
|
|---------|-------------|
|
|
15
|
-
| `/
|
|
16
|
-
| `/sign
|
|
15
|
+
| `/prd [feature]` | Brainstorm feature, generate executable PRD for Ralph |
|
|
16
|
+
| `/sign`| Add a learned pattern for Ralph to remember |
|
|
17
17
|
| `/my-dna` | Set up your personal style preferences |
|
|
18
18
|
| `/vibe-check` | Audit code quality before shipping |
|
|
19
19
|
| `/review` | Code review with OWASP security checks |
|
|
@@ -78,7 +78,7 @@ Print this complete reference for the user. Do not add any commentary.
|
|
|
78
78
|
## The Loop
|
|
79
79
|
|
|
80
80
|
```
|
|
81
|
-
/
|
|
81
|
+
/prd [feature] Brainstorm → PRD
|
|
82
82
|
npx ralph run Autonomous coding
|
|
83
83
|
npx ralph status Check progress
|
|
84
84
|
npx ralph stop Stop after current story
|
|
@@ -88,10 +88,10 @@ npx ralph stop Stop after current story
|
|
|
88
88
|
|
|
89
89
|
## Slash Command Details
|
|
90
90
|
|
|
91
|
-
### /
|
|
92
|
-
Brainstorm
|
|
93
|
-
-
|
|
94
|
-
-
|
|
91
|
+
### /prd [feature description]
|
|
92
|
+
Brainstorm feature, explore codebase, ask clarifying questions.
|
|
93
|
+
- Accepts a description, idea file (`docs/ideas/{name}.md`), or plan file (`docs/plans/{name}.md`)
|
|
94
|
+
- Splits into executable PRD stories
|
|
95
95
|
- Writes to `.ralph/prd.json`
|
|
96
96
|
|
|
97
97
|
### /review [file or selection]
|
|
@@ -194,7 +194,7 @@ npx ralph unsign "camelCase"
|
|
|
194
194
|
|
|
195
195
|
CLAUDE.md # Project standards (shared with team)
|
|
196
196
|
PROMPT.md # Base prompt for Ralph sessions
|
|
197
|
-
docs/ideas/ # Brainstorm outputs from /
|
|
197
|
+
docs/ideas/ # Brainstorm outputs from /prd
|
|
198
198
|
|
|
199
199
|
# Global files (your home directory)
|
|
200
200
|
~/.claude/
|