Angular Toolkit MCP

🚀 Cursor Flows

This directory houses AI-assisted workflow templates (flows) tailored for Angular component refactoring and design system migration tasks. These flows are integrated with Cursor IDE's rule system, offering structured, step - by - step guidance for complex refactoring operations.

🚀 Quick Start

✨ Features

• Flows are collections of rule files (.mdc) that guide the AI through multi - step processes.
• Each flow consists of rule files, documentation, and templates.

📦 Installation

Before using any flow, ensure you have:

• Cursor IDE with MCP (Model Context Protocol) server connected
• Git branch for your refactoring work
• Component files accessible in your workspace
• Angular project with proper TypeScript configuration

💻 Usage Examples

1. Available Flows
   • Component Refactoring Flow
     • Location: component - refactoring/
     • Purpose: Improve individual Angular components according to modern best practices
     • Files:
       • 01 - review - component.mdc - Analyze component and create improvement plan
       • 02 - refactor - component.mdc - Execute refactoring checklist
       • 03 - validate - component.mdc - Verify improvements through contract comparison
       • angular - 20.md - Angular best practices reference
     • Use Case: When you need to modernize a single component's code quality, performance, or maintainability.
   • Design System Refactoring Flow
     • Location: ds - refactoring - flow/
     • Purpose: Migrate components from deprecated design system patterns to modern alternatives
     • Note: This flow appears to be empty in the current directory but rule files exist in .cursor/rules/ for finding violations, planning refactoring, fixing violations, validating changes, and preparing reports.
2. How to Use Flows
   • Copy the desired flow's .mdc files to your .cursor/rules/ directory.
   • The rules will be automatically available in Cursor.
   • Follow the flow documentation for step - by - step guidance.

📚 Documentation

For detailed information about each flow, see:

• [Component Refactoring Flow](../../docs/component - refactoring - flow.md)
• [Architecture & Design](../../docs/architecture - internal - design.md)
• Contracts Documentation

🔧 Technical Details

• Flow Process Overview Most flows follow a similar pattern:
  • Analysis - Review current state and identify issues
  • Planning - Create actionable improvement checklist
  • Execution - Implement changes systematically
  • Validation - Verify improvements and quality gates
  • Reporting - Document changes and results
• Quality Gates Flows include human review checkpoints to ensure:
  • ✅ Analysis accuracy
  • ✅ Refactoring plan approval
  • ✅ Code quality validation
  • ✅ Final acceptance