@champpaba/claude-agent-kit 3.3.0 → 3.4.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.
@@ -42,30 +42,30 @@ Run: /csetup {change-id}
42
42
 
43
43
  ---
44
44
 
45
- #### ขั้นตอนที่ 1: อ่าน flags.json
45
+ #### Step 2.1: Read flags.json
46
46
 
47
- อ่านไฟล์ `openspec/changes/{change-id}/.claude/flags.json`
48
-
49
- จดข้อมูลต่อไปนี้:
50
- - `current_phase`: ชื่อ phase ปัจจุบัน
51
- - `phases[current_phase].status`: สถานะของ phase
52
- - `phases[current_phase].agent`: agent ที่ต้องใช้
47
+ 1. Read the file `openspec/changes/{change-id}/.claude/flags.json`
48
+ 2. Extract and note these values:
49
+ - `current_phase` - The current phase name
50
+ - `phases[current_phase].status` - The phase status
51
+ - `phases[current_phase].agent` - The assigned agent
53
52
 
54
53
  ---
55
54
 
56
- #### ขั้นตอนที่ 2: ตรวจสอบสถานะ phase
55
+ #### Step 2.2: Check Phase Status
57
56
 
58
- **ถ้า status = "completed":**
59
- - หา phase ถัดไปจาก phases.md
60
- - อัพเดต current_phase เป็น phase ถัดไป
57
+ **If status equals "completed":**
58
+ 1. Look up the next phase in phases.md
59
+ 2. Update current_phase to the next phase name
61
60
 
62
- **ถ้า status = "pending" หรือ "in_progress":**
63
- - ใช้ phase ปัจจุบัน
61
+ **If status equals "pending" or "in_progress":**
62
+ 1. Keep using the current phase (no change)
64
63
 
65
64
  ---
66
65
 
67
- #### ขั้นตอนที่ 3: Report สถานะ
66
+ #### Step 2.3: Report Status
68
67
 
68
+ Display this information:
69
69
  ```
70
70
  📍 Current Phase: {phase_number} - {phase_name}
71
71
  Agent: {agent}
@@ -78,31 +78,33 @@ Run: /csetup {change-id}
78
78
 
79
79
  ---
80
80
 
81
- #### ตรวจสอบว่า phase ต้องการ manual action หรือไม่
81
+ #### Step 3.1: Check for Manual Action
82
82
 
83
- **ถ้า agent = "user":**
84
- ```
85
- 🛑 Phase {phase_number} requires manual action
83
+ **If the agent value equals "user":**
84
+ 1. Display this message:
85
+ ```
86
+ 🛑 Phase {phase_number} requires manual action
86
87
 
87
- Instructions:
88
- {instructions from phases.md}
88
+ Instructions:
89
+ {instructions from phases.md}
89
90
 
90
- When done: /cdev {change-id} --continue
91
- ```
92
- หยุดทำงาน รอ user ทำเสร็จแล้ว run /cdev ใหม่
91
+ When done: /cdev {change-id} --continue
92
+ ```
93
+ 2. Stop execution and wait for user to complete the task
94
+ 3. Wait for user to run /cdev again
93
95
 
94
96
  ---
95
97
 
96
- #### ตรวจสอบว่ามี agent หลายตัวหรือไม่
98
+ #### Step 3.2: Check for Multiple Agents
97
99
 
98
- **ถ้า agent มีเครื่องหมาย "+" (เช่น "backend + database"):**
99
- - แยก agents ออกมาเป็น list
100
- - Invoke agents พร้อมกัน (parallel)
101
- - รอทุก agent เสร็จก่อนไปต่อ
100
+ **If the agent value contains "+" (example: "backend + database"):**
101
+ 1. Split the agent string by "+" into a list of individual agents
102
+ 2. Invoke all agents in parallel
103
+ 3. Wait for all agents to complete before proceeding
102
104
 
103
- **ถ้ามี agent ตัวเดียว:**
104
- - Invoke agent ตัวนั้น
105
- - รอเสร็จแล้วไป Step 4
105
+ **If there is only a single agent:**
106
+ 1. Invoke that single agent
107
+ 2. Wait for completion then proceed to Step 4
106
108
 
107
109
  ### Step 4: Invoke Agent with Retry & Validation
108
110
 
@@ -124,48 +126,53 @@ See: `.claude/lib/agent-executor.md` for full implementation
124
126
 
125
127
  → **Full Protocol:** `.claude/lib/design-validator.md` (Part 2)
126
128
 
127
- **เมื่อไหร่ต้องทำ:** ก่อน invoke uxui-frontend หรือ frontend agent ทุกครั้ง
129
+ **When to execute:** Before invoking uxui-frontend or frontend agent
128
130
 
129
131
  ---
130
132
 
131
- #### ขั้นตอนที่ 1: ตรวจสอบว่าเป็น visual agent หรือไม่
133
+ #### Step 4.0.1: Check if Visual Agent
132
134
 
133
- ดู phase.agent ว่าเป็น `uxui-frontend` หรือ `frontend` หรือไม่
135
+ 1. Look at the phase.agent value
136
+ 2. Check if it equals `uxui-frontend` or `frontend`
134
137
 
135
- **ถ้าไม่ใช่:** ข้าม Step 4.0 ไปเลย
138
+ **If NOT a visual agent:**
139
+ - Skip Step 4.0 entirely and proceed to Step 4.1
136
140
 
137
- **ถ้าใช่:** ทำขั้นตอนถัดไป
141
+ **If it IS a visual agent:**
142
+ - Proceed to next step
138
143
 
139
144
  ---
140
145
 
141
- #### ขั้นตอนที่ 2: ตรวจสอบว่ามี design system หรือไม่
146
+ #### Step 4.0.2: Check for Design System
142
147
 
143
- อ่านไฟล์ `design-system/data.yaml`
148
+ 1. Attempt to read the file `design-system/data.yaml`
144
149
 
145
- **ถ้ามีไฟล์:**
146
- ```
147
- ✅ Design system found: design-system/data.yaml
148
- ```
149
- → ไปขั้นตอนที่ 3
150
+ **If the file exists:**
151
+ 1. Display this message:
152
+ ```
153
+ ✅ Design system found: design-system/data.yaml
154
+ ```
155
+ 2. Proceed to Step 4.0.3
150
156
 
151
- **ถ้าไม่มีไฟล์:**
152
- ```
153
- ⚠️ WARNING: No design system found!
154
- Path: design-system/data.yaml (not found)
157
+ **If the file does NOT exist:**
158
+ 1. Display this warning:
159
+ ```
160
+ ⚠️ WARNING: No design system found!
161
+ Path: design-system/data.yaml (not found)
155
162
 
156
- Options:
157
- 1. Run /designsetup first (recommended)
158
- 2. Continue with fallback design principles
163
+ Options:
164
+ 1. Run /designsetup first (recommended)
165
+ 2. Continue with fallback design principles
159
166
 
160
- Proceeding with fallback...
161
- ```
162
- ไปขั้นตอนที่ 4 โดยไม่ inject instruction
167
+ Proceeding with fallback...
168
+ ```
169
+ 2. Skip to Step 4.1 without injecting design system instructions
163
170
 
164
171
  ---
165
172
 
166
- #### ขั้นตอนที่ 3: บอก agent ให้อ่าน design system
173
+ #### Step 4.0.3: Inject Design System Instructions
167
174
 
168
- เมื่อ invoke agent ต้องบอกใน prompt ว่า:
175
+ When building the agent prompt, include this text:
169
176
 
170
177
  ```
171
178
  MANDATORY: Read design-system/data.yaml before writing any CSS/Tailwind.
@@ -184,9 +191,9 @@ DO NOT use:
184
191
 
185
192
  ---
186
193
 
187
- #### ขั้นตอนที่ 4: Verify agent compliance หลัง agent ตอบกลับ
194
+ #### Step 4.0.4: Verify Agent Compliance
188
195
 
189
- ตรวจสอบว่า agent output มี report นี้หรือไม่:
196
+ After the agent responds, check the output for this report:
190
197
 
191
198
  ```
192
199
  ✅ Design System Loaded (STEP 0.5)
@@ -196,43 +203,47 @@ DO NOT use:
196
203
  - Animation: [list]
197
204
  ```
198
205
 
199
- **ถ้ามี report:** ผ่าน ไปต่อได้
206
+ **If the report is present:**
207
+ - Validation passed, proceed
200
208
 
201
- **ถ้าไม่มี report:** ถาม agent ว่าอ่าน design system หรือยัง
209
+ **If the report is missing:**
210
+ - Ask the agent whether they read the design system
202
211
 
203
212
  ---
204
213
 
205
214
  ### Step 4.1: Build Agent Prompt
206
215
 
207
- **สร้าง prompt สำหรับ agent โดยประกอบด้วย:**
216
+ Build the agent prompt by assembling these sections:
208
217
 
209
218
  ---
210
219
 
211
- #### ส่วนที่ 1: Change Context
220
+ #### Section 1: Change Context
212
221
 
213
- ประกอบข้อมูลจาก:
214
- - `proposal.md` - What we're building and why
215
- - `tasks.md` - Tasks for this phase
216
- - `design.md` - Design decisions (if exists)
217
- - `phases.md` - Phase instructions
222
+ Include information from these files:
223
+ 1. Read `proposal.md` - What we're building and why
224
+ 2. Read `tasks.md` - Tasks for this phase
225
+ 3. Read `design.md` - Design decisions (if the file exists)
226
+ 4. Read `phases.md` - Phase instructions
227
+
228
+ Combine this information into the prompt context.
218
229
 
219
230
  ---
220
231
 
221
- #### ส่วนที่ 2: Library Requirements (v2.1.2)
232
+ #### Section 2: Library Requirements (v2.1.2)
222
233
 
223
- เพิ่มคำสั่งให้ agent:
224
- 1. Scan tasks.md หา patterns: "Install X", "Configure X"
225
- 2. Scan design.md หา: "D1: Use X Library", "Decision: Use X"
226
- 3. ใช้ libraries ที่ระบุ ไม่ใช่ custom implementation
227
- 4. Implement ตาม design spec ไม่ใช่ library defaults
234
+ Add these instructions to the agent prompt:
235
+ 1. Scan tasks.md for patterns like: "Install X", "Configure X"
236
+ 2. Scan design.md for: "D1: Use X Library", "Decision: Use X"
237
+ 3. Use the specified libraries, not custom implementations
238
+ 4. Implement according to design spec, not library defaults
228
239
 
229
240
  ---
230
241
 
231
- #### ส่วนที่ 3: Development Principles (v3.1.0 - ALL agents)
242
+ #### Section 3: Development Principles (v3.1.0 - ALL agents)
232
243
 
233
- **ถ้ามีไฟล์** `.claude/contexts/patterns/development-principles.md`:
244
+ **If the file `.claude/contexts/patterns/development-principles.md` exists:**
234
245
 
235
- เพิ่มใน prompt:
246
+ Add this section to the prompt:
236
247
  ```
237
248
  ## 🏛️ Development Principles (Level 1 - ALL Agents)
238
249
 
@@ -250,56 +261,60 @@ Quick Reference:
250
261
 
251
262
  ---
252
263
 
253
- #### ส่วนที่ 4: Best Practices (agent-specific)
264
+ #### Section 4: Best Practices (agent-specific)
254
265
 
255
- **ถ้ามี directory** `.claude/contexts/domain/project/best-practices/`:
266
+ **If the directory `.claude/contexts/domain/project/best-practices/` exists:**
256
267
 
257
- หา best-practices files ที่ตรงกับ agent:
268
+ 1. Determine which best-practices files match the current agent:
258
269
 
259
- | Agent | Relevant Topics |
260
- |-------|-----------------|
261
- | uxui-frontend | react, nextjs, vue, tailwind |
262
- | frontend | react, nextjs, vue, typescript |
263
- | backend | express, fastapi, django, prisma, drizzle |
264
- | database | prisma, drizzle, postgres, mongodb |
265
- | test-debug | vitest, jest, playwright |
266
- | integration | typescript |
267
- | ux-tester | (none) |
270
+ | Agent | Relevant Topics |
271
+ |-------|-----------------|
272
+ | uxui-frontend | react, nextjs, vue, tailwind |
273
+ | frontend | react, nextjs, vue, typescript |
274
+ | backend | express, fastapi, django, prisma, drizzle |
275
+ | database | prisma, drizzle, postgres, mongodb |
276
+ | test-debug | vitest, jest, playwright |
277
+ | integration | typescript |
278
+ | ux-tester | (none) |
268
279
 
269
- เพิ่มใน prompt:
270
- ```
271
- ## 📚 Best Practices (STEP 0)
280
+ 2. Add this section to the prompt with the relevant file names:
281
+ ```
282
+ ## 📚 Best Practices (STEP 0)
272
283
 
273
- Read these files before implementation:
274
- - Read: .claude/contexts/domain/project/best-practices/{relevant-file}.md
275
- ```
284
+ Read these files before implementation:
285
+ - Read: .claude/contexts/domain/project/best-practices/{relevant-file}.md
286
+ ```
276
287
 
277
288
  ---
278
289
 
279
- #### ส่วนที่ 5: Design System (uxui-frontend only)
290
+ #### Section 5: Design System (uxui-frontend only)
280
291
 
281
- **ถ้า agent = uxui-frontend:**
292
+ **If the agent equals uxui-frontend:**
282
293
 
283
- **ถ้ามี** `design-system/data.yaml`:
284
- ```
285
- ## 🎨 Design System (STEP 0.5)
294
+ 1. Check if `design-system/data.yaml` exists
286
295
 
287
- Files to read:
288
- - design-system/data.yaml
296
+ **If the file exists:**
297
+ Add this section to the prompt:
298
+ ```
299
+ ## 🎨 Design System (STEP 0.5)
289
300
 
290
- Style Guidelines:
291
- | Instead of | Use |
292
- |------------|-----|
293
- | text-gray-500, #64748b | text-foreground, bg-muted |
294
- | p-5, gap-7 | p-4, p-6, gap-8 |
295
- | mixing shadow-sm/lg | consistent shadow-md |
296
- ```
301
+ Files to read:
302
+ - design-system/data.yaml
297
303
 
298
- **ถ้าไม่มี:**
299
- ```
300
- ⚠️ WARNING: No design system found!
301
- Using fallback: .claude/contexts/design/*.md
302
- ```
304
+ Style Guidelines:
305
+ | Instead of | Use |
306
+ |------------|-----|
307
+ | text-gray-500, #64748b | text-foreground, bg-muted |
308
+ | p-5, gap-7 | p-4, p-6, gap-8 |
309
+ | mixing shadow-sm/lg | consistent shadow-md |
310
+ ```
311
+
312
+ **If the file does NOT exist:**
313
+ Add this warning to the prompt:
314
+ ```
315
+ ⚠️ WARNING: No design system found!
316
+ Using fallback: .claude/contexts/design/*.md
317
+ ```
303
318
 
304
319
  ---
305
320
 
@@ -307,45 +322,49 @@ Using fallback: .claude/contexts/design/*.md
307
322
 
308
323
  ---
309
324
 
310
- #### การ invoke agent
325
+ #### Step 4.2.1: Invoke the Agent
311
326
 
312
- Report ก่อน invoke:
313
- ```
314
- 🚀 Invoking {agent} agent (model: opus)...
315
- ```
327
+ 1. Display this message before invoking:
328
+ ```
329
+ 🚀 Invoking {agent} agent (model: opus)...
330
+ ```
316
331
 
317
- Invoke agent ด้วย:
318
- - Model: opus (fixed)
319
- - Timeout: 10 นาที
320
- - Max retries: 2 ครั้ง
332
+ 2. Invoke the agent with these settings:
333
+ - Model: opus (fixed)
334
+ - Timeout: 10 minutes
335
+ - Max retries: 2 attempts
321
336
 
322
337
  ---
323
338
 
324
- #### Handle Result
339
+ #### Step 4.2.2: Handle Result
325
340
 
326
- **ถ้าสำเร็จ:**
327
- ```
328
- ✅ Phase {phase_number} completed successfully!
329
- ⏱️ Execution time: {time}s
330
- 🔄 Retries used: {retries}
331
- Validation: PASSED
332
- ```
333
- → ไป Step 5
341
+ **If execution succeeded:**
342
+ 1. Display this success message:
343
+ ```
344
+ Phase {phase_number} completed successfully!
345
+ ⏱️ Execution time: {time}s
346
+ 🔄 Retries used: {retries}
347
+ ✅ Validation: PASSED
348
+ ```
349
+ 2. Proceed to Step 5
334
350
 
335
- **ถ้าล้มเหลว:**
336
- ```
337
- ❌ Phase {phase_number} failed
338
- Error: {error}
339
- Retries used: {retries}
340
- ```
351
+ **If execution failed:**
352
+ 1. Display this error message:
353
+ ```
354
+ Phase {phase_number} failed
355
+ Error: {error}
356
+ Retries used: {retries}
357
+ ```
341
358
 
342
- ถาม user:
343
- ```
344
- Options:
345
- [retry] - ลองใหม่
346
- [skip] - ข้าม phase นี้
347
- [abort] - หยุดทำงาน
348
- ```
359
+ 2. Ask the user for their choice:
360
+ ```
361
+ Options:
362
+ [retry] - Try again
363
+ [skip] - Skip this phase
364
+ [abort] - Stop execution
365
+ ```
366
+
367
+ 3. Wait for user response and act accordingly
349
368
 
350
369
  ---
351
370
 
@@ -387,24 +406,28 @@ See `.claude/contexts/patterns/validation-framework.md` for complete checklist p
387
406
 
388
407
  ### Step 4.6: Approval Gate Handling (v2.7.0)
389
408
 
390
- **สำหรับ phases ที่มี** `requires_approval: true` (เช่น ux-tester Phase 1.5)
409
+ **For phases with** `requires_approval: true` (example: ux-tester Phase 1.5)
391
410
 
392
411
  ---
393
412
 
394
- #### ขั้นตอนที่ 1: ตรวจสอบว่า phase ต้องการ approval หรือไม่
413
+ #### Step 4.6.1: Check if Approval Required
395
414
 
396
- ดูใน phases.md ว่า phase ปัจจุบันมี:
397
- - `requires_approval: true`
398
- - หรือ metadata มีคำว่า `approval-gate`
415
+ 1. Look in phases.md at the current phase
416
+ 2. Check if it has:
417
+ - `requires_approval: true`
418
+ - OR metadata contains the word `approval-gate`
399
419
 
400
- **ถ้าไม่ต้องการ approval:** ข้าม Step 4.6 ไปเลย
420
+ **If approval is NOT required:**
421
+ - Skip Step 4.6 entirely
401
422
 
402
- **ถ้าต้องการ approval:** ทำขั้นตอนถัดไป
423
+ **If approval IS required:**
424
+ - Proceed to next step
403
425
 
404
426
  ---
405
427
 
406
- #### ขั้นตอนที่ 2: แสดงผลและรอ user ตัดสินใจ
428
+ #### Step 4.6.2: Display Results and Wait for Decision
407
429
 
430
+ Display this message:
408
431
  ```
409
432
  ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
410
433
  🧪 {phase_name} Complete - Awaiting Approval
@@ -416,47 +439,48 @@ See `.claude/contexts/patterns/validation-framework.md` for complete checklist p
416
439
 
417
440
  ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
418
441
 
419
- กรุณาตัดสินใจ:
442
+ Please decide:
420
443
 
421
- ✅ "approve" → ไป Phase ถัดไป
422
- ❌ "reject [feedback]" → กลับแก้ไข Phase ก่อนหน้า
444
+ ✅ "approve" → Continue to next phase
445
+ ❌ "reject [feedback]" → Go back and fix previous phase
423
446
 
424
447
  ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
425
448
  ```
426
449
 
427
- หยุดรอ user ตอบ
450
+ Wait for user response.
428
451
 
429
452
  ---
430
453
 
431
- #### ขั้นตอนที่ 3: Handle user response
454
+ #### Step 4.6.3: Handle User Response
432
455
 
433
- **ถ้า user ตอบ approve:**
434
- - คำที่ยอมรับ: approve, approved, ok, yes, ใช่, อนุมัติ, ผ่าน, ลุย, ได้, ดี
435
- - Output: `✅ {phase_name} approved! Continuing to next phase...`
436
- - อัพเดต flags.json: status = "approved"
437
- - ไป Step 5
456
+ **If user approves:**
457
+ 1. Recognize these words as approval: approve, approved, ok, yes, ใช่, อนุมัติ, ผ่าน, ลุย, ได้, ดี
458
+ 2. Display: `✅ {phase_name} approved! Continuing to next phase...`
459
+ 3. Update flags.json: set status = "approved"
460
+ 4. Proceed to Step 5
438
461
 
439
- **ถ้า user ตอบ reject:**
440
- - คำที่ยอมรับ: reject, ไม่, แก้, no (ตามด้วย feedback)
441
- - ดึง feedback จาก message
442
- - หา phase ที่ต้องกลับไปแก้ (uxui-frontend)
443
- - Output:
444
- ```
445
- 🔄 {phase_name} rejected
462
+ **If user rejects:**
463
+ 1. Recognize these words as rejection: reject, ไม่, แก้, no (followed by feedback)
464
+ 2. Extract the feedback text from the user's message
465
+ 3. Identify which phase needs to be fixed (uxui-frontend)
466
+ 4. Display:
467
+ ```
468
+ 🔄 {phase_name} rejected
446
469
 
447
- 📝 Feedback: {feedback}
448
- 🔙 Looping back to: Phase {X} - {phase_name}
470
+ 📝 Feedback: {feedback}
471
+ 🔙 Looping back to: Phase {X} - {phase_name}
449
472
 
450
- {agent} agent จะได้รับ feedback นี้เพื่อแก้ไข
451
- ```
452
- - อัพเดต flags.json: status = "rejected"
453
- - กลับไป run phase ที่ต้องแก้ไข
473
+ {agent} agent will receive this feedback for fixes
474
+ ```
475
+ 5. Update flags.json: set status = "rejected"
476
+ 6. Return to run the phase that needs fixing
454
477
 
455
- **ถ้าไม่เข้าใจคำตอบ:**
456
- ```
457
- ⚠️ ไม่เข้าใจคำตอบ กรุณาตอบ "approve" หรือ "reject [feedback]"
458
- ```
459
- → ถาม user อีกครั้ง
478
+ **If response is unclear:**
479
+ 1. Display:
480
+ ```
481
+ ⚠️ Response unclear. Please answer "approve" or "reject [feedback]"
482
+ ```
483
+ 2. Ask the user again
460
484
 
461
485
  ---
462
486
 
@@ -466,45 +490,47 @@ See `.claude/contexts/patterns/validation-framework.md` for complete checklist p
466
490
 
467
491
  ### Step 4.7: Validate Page Plan Compliance (uxui-frontend only)
468
492
 
469
- **เฉพาะ uxui-frontend agent เมื่อมี page-plan.md**
493
+ **Only for uxui-frontend agent when page-plan.md exists**
470
494
 
471
- **Purpose:** ตรวจสอบว่า agent implement ครบทุก section ตาม page-plan.md
495
+ **Purpose:** Verify that agent implemented all sections from page-plan.md
472
496
 
473
497
  ---
474
498
 
475
- #### ขั้นตอนที่ 1: ตรวจสอบเงื่อนไข
499
+ #### Step 4.7.1: Check Prerequisites
476
500
 
477
- **ถ้า agent ไม่ใช่ uxui-frontend หรือไม่มี page-plan.md:**
478
- ```
479
- ℹ️ Page plan validation: N/A (agent: {agent}, has plan: {true/false})
480
- ```
481
- → ข้าม Step 4.7 ไปเลย
501
+ **If agent is NOT uxui-frontend OR page-plan.md does NOT exist:**
502
+ 1. Display:
503
+ ```
504
+ ℹ️ Page plan validation: N/A (agent: {agent}, has plan: {true/false})
505
+ ```
506
+ 2. Skip Step 4.7 entirely
482
507
 
483
- **ถ้า agent = uxui-frontend และมี page-plan.md:**
484
- ทำขั้นตอนถัดไป
508
+ **If agent equals uxui-frontend AND page-plan.md exists:**
509
+ - Proceed to next step
485
510
 
486
511
  ---
487
512
 
488
- #### ขั้นตอนที่ 2: วิเคราะห์ page-plan.md
513
+ #### Step 4.7.2: Analyze page-plan.md
489
514
 
490
- อ่าน `openspec/changes/{change-id}/page-plan.md`
515
+ 1. Read `openspec/changes/{change-id}/page-plan.md`
516
+ 2. Find Section 2 (Page Structure)
517
+ 3. Count the components:
518
+ - Look for JSX elements starting with uppercase (example: `<HeroSection>`, `<PricingTable>`)
519
+ - Do NOT count Layout, div (wrapper elements)
520
+ - Remove duplicates
491
521
 
492
- หา Section 2 (Page Structure) และนับจำนวน components:
493
- - ดู JSX elements ที่ขึ้นต้นด้วยตัวใหญ่ (เช่น `<HeroSection>`, `<PricingTable>`)
494
- - ไม่นับ Layout, div (wrapper elements)
495
- - Remove duplicates
496
-
497
- Report:
498
- ```
499
- 📋 Page Plan Analysis:
500
- Expected sections: {count}
501
- Components: {list}
502
- ```
522
+ 4. Display:
523
+ ```
524
+ 📋 Page Plan Analysis:
525
+ Expected sections: {count}
526
+ Components: {list}
527
+ ```
503
528
 
504
529
  ---
505
530
 
506
- #### ขั้นตอนที่ 3: ถาม user ยืนยัน
531
+ #### Step 4.7.3: Ask User for Confirmation
507
532
 
533
+ Display this prompt:
508
534
  ```
509
535
  ⚠️ VALIDATION REQUIRED:
510
536
 
@@ -521,30 +547,35 @@ Options:
521
547
  [skip] - Skip validation (not recommended)
522
548
  ```
523
549
 
550
+ Wait for user response.
551
+
524
552
  ---
525
553
 
526
- #### ขั้นตอนที่ 4: Handle user response
554
+ #### Step 4.7.4: Handle User Response
527
555
 
528
- **ถ้า user ตอบ yes:**
529
- ```
530
- ✅ Page plan compliance confirmed
531
- All {count} sections implemented
532
- ```
533
- → ไป Step 5
556
+ **If user answers yes:**
557
+ 1. Display:
558
+ ```
559
+ Page plan compliance confirmed
560
+ All {count} sections implemented
561
+ ```
562
+ 2. Proceed to Step 5
534
563
 
535
- **ถ้า user ตอบ retry:**
536
- ```
537
- 🔄 Retrying phase with enhanced enforcement...
538
- Agent will be explicitly instructed to implement all {count} sections
539
- ```
540
- → กลับไป run phase อีกครั้งพร้อม enhanced prompt
564
+ **If user answers retry:**
565
+ 1. Display:
566
+ ```
567
+ 🔄 Retrying phase with enhanced enforcement...
568
+ Agent will be explicitly instructed to implement all {count} sections
569
+ ```
570
+ 2. Return to run the phase again with enhanced prompt
541
571
 
542
- **ถ้า user ตอบ skip:**
543
- ```
544
- ⚠️ Skipping validation - proceed with caution
545
- This may result in incomplete implementation
546
- ```
547
- → ไป Step 5
572
+ **If user answers skip:**
573
+ 1. Display:
574
+ ```
575
+ ⚠️ Skipping validation - proceed with caution
576
+ This may result in incomplete implementation
577
+ ```
578
+ 2. Proceed to Step 5
548
579
 
549
580
  ---
550
581
 
@@ -562,7 +593,7 @@ Agent will be explicitly instructed to implement all {count} sections
562
593
 
563
594
  ### Step 5: Post-Execution (Flags Update)
564
595
 
565
- **Main Claude อัพเดต flags.json หลังจบแต่ละ phase**
596
+ **Main Claude updates flags.json after each phase**
566
597
 
567
598
  → See: `.claude/lib/flags-updater.md` for complete protocol
568
599
 
@@ -570,23 +601,25 @@ WHY: Immediate updates ensure /cstatus shows accurate progress.
570
601
 
571
602
  ---
572
603
 
573
- #### ขั้นตอนที่ 1: อัพเดต flags.json
604
+ #### Step 5.1: Update flags.json
574
605
 
575
- ```
576
- 🔄 Updating progress tracking...
577
- ```
606
+ 1. Display:
607
+ ```
608
+ 🔄 Updating progress tracking...
609
+ ```
578
610
 
579
- อัพเดตข้อมูลต่อไปนี้:
580
- - Mark phase as completed
581
- - Record actual duration
582
- - Extract files created/modified
583
- - Update meta statistics (progress %, time remaining)
584
- - Move current_phase to next phase
611
+ 2. Update these fields in flags.json:
612
+ - Mark the phase as completed
613
+ - Record actual duration
614
+ - Extract files created/modified
615
+ - Update meta statistics (progress %, time remaining)
616
+ - Move current_phase to next phase
585
617
 
586
618
  ---
587
619
 
588
- #### ขั้นตอนที่ 2: Report Progress
620
+ #### Step 5.2: Report Progress
589
621
 
622
+ Display this progress summary:
590
623
  ```
591
624
  📊 Progress Update:
592
625
  ✅ {completed}/{total} phases complete
@@ -597,10 +630,11 @@ WHY: Immediate updates ensure /cstatus shows accurate progress.
597
630
 
598
631
  ---
599
632
 
600
- #### ขั้นตอนที่ 3: Check next phase
633
+ #### Step 5.3: Check Next Phase
601
634
 
602
- **ถ้าทุก phases เสร็จหมดแล้ว (ready_to_archive):**
635
+ **If all phases are complete (ready_to_archive equals true):**
603
636
 
637
+ Display this completion report:
604
638
  ```
605
639
  ╔════════════════════════════════════════════════════════════╗
606
640
  ║ ✅ CHANGE COMPLETED SUCCESSFULLY ║
@@ -645,21 +679,24 @@ WHY: Immediate updates ensure /cstatus shows accurate progress.
645
679
  4. Archive: openspec archive {change-id}
646
680
  ```
647
681
 
648
- **ถ้ายังมี phases ที่ยังไม่เสร็จ:**
682
+ **If there are still incomplete phases:**
649
683
 
684
+ Display the next phase information:
650
685
  ```
651
686
  📍 Next: Phase {X}: {phase_name}
652
687
  Agent: {agent}
653
688
  Estimated: {X} min
654
689
  ```
655
690
 
656
- **ถ้า next phase ต้องการ manual action:**
691
+ **If the next phase requires manual action:**
692
+ Display:
657
693
  ```
658
694
  🛑 Next phase requires your action
659
695
  When done: /cdev {change-id} --continue
660
696
  ```
661
697
 
662
- **ถ้า next phase เป็น agent:**
698
+ **If the next phase is an agent:**
699
+ Ask the user:
663
700
  ```
664
701
  Continue? (yes/no)
665
702
  ```