v1.1.0 - OpenSpec Integration & Page Planning

🚀 Release v1.1.0 - OpenSpec Integration & Page Planning

✨ What's New

1. OpenSpec Integration

Claude Agent Kit is now the perfect companion for OpenSpec spec-driven development!

• ✅ Complete workflow documentation (5 stages)
• ✅ Reads proposal.md + tasks.md from OpenSpec
• ✅ Clear separation: OpenSpec (Planning) → Claude Agent Kit (Implementation)
• ✅ Seamless handoff between spec alignment and code execution

2. /pageplan Command (NEW!)

Generate smart page plans BEFORE implementing UI tasks:

• ✅ Component Reuse Plan - Search existing components before creating duplicates
• ✅ Real Content from PRD - AI drafts actual content (no more lorem ipsum!)
• ✅ Asset Checklist - Prepare images, icons upfront
• ✅ 25% Faster Implementation - Skip redundant searches during coding
• ✅ Visual Consistency - Auto-sync with STYLE_GUIDE.md

Example Output:

## Component Plan
🔄 Reuse: Navbar, Footer (found in codebase)
✅ New: HeroSection, FeatureGrid

## Content Draft
**Headline:** "Master TOEIC with AI-Powered Tests"
**CTA:** "Start Free Test"

## Assets to Prepare
- [ ] hero-image.jpg (1920x1080)

3. Complete Workflow Examples

New documentation with 3 real-world workflows:

• ✅ Workflow A: UI Feature (with /pageplan)
• ✅ Workflow B: Backend Feature (skip /pageplan)
• ✅ Workflow C: Full-Stack Feature (with /pageplan)

4. Documentation Updates

• ✅ Updated README.md with OpenSpec integration flow
• ✅ Added page-plan.md structure documentation
• ✅ Added 8-step complete flow summary
• ✅ Added Before/After comparison tables
• ✅ Clear "When to Use" guidance for each command

---

📦 Installation

npm install -g @champpaba/claude-agent-kit@1.1.0

🔄 Upgrade from 1.0.0

npm update -g @champpaba/claude-agent-kit
cd your-project
cak update --backup

🎯 Breaking Changes

None - Fully backward compatible with v1.0.0

---

📋 Commits Included

• 1.1.0 - Version bump
• docs: update README.md with OpenSpec integration and /pageplan workflow
• chore: remove redito-landing.html
• feat: add /pageplan command for UI content planning
• feat: add /extract command and design extraction data
• refactor: redesign /designsetup to use synthesis approach

---

🔗 Related Links

• npm Package: https://www.npmjs.com/package/@champpaba/claude-agent-kit
• OpenSpec: https://github.com/Fission-AI/OpenSpec
• Documentation: https://github.com/ChampPABA/claude-multi-agent-template#readme

---

💡 Quick Start (New Users)

# Install globally
npm install -g @champpaba/claude-agent-kit

# Initialize in your project
cd your-project
cak init

# Setup project context
/psetup

# Generate style guide (optional)
/designsetup

# Start building (after OpenSpec planning)
/pageplan @prd.md           # UI tasks only
/csetup your-feature
/cdev your-feature

---

🤖 Generated with Claude Code