feat: Add modern XD format support and pixel-perfect design analysis tools

[achilleleduc]

Summary

This PR adds comprehensive pixel-perfect design analysis capabilities and extends the XD parser to support modern XD file formats (v2.33+).

Problem Solved

The original parser only supported legacy XD file format (single artwork.agc file). Modern Adobe XD (v2.33+) uses a different structure with per-artboard graphicContent.agc files, causing the parser to fail with "Invalid XD file: no artwork found" error.

Major Enhancements

1. Modern XD Format Support ✨

• Backward compatible - Works with both legacy and modern XD files
• Enhanced parser to handle per-artboard graphics files
• Updated color parsing for new RGB value format (0-255 range vs 0-1)
• Support for new XD file structure with manifest-based artboard discovery

2. Eight New Pixel-Perfect Design Analysis Tools 🎯

1. analyze_layout_spacing - Detect spacing patterns and generate spacing tokens
2. generate_design_tokens - Export complete design systems in CSS/Tailwind/TypeScript/JSON
3. detect_ui_patterns - Automatically identify buttons, cards, inputs with confidence scores
4. extract_typography_system - Organize all text styles with semantic naming
5. detect_layout_system - Suggest flexbox/grid CSS from layout patterns
6. get_element_styles - Export detailed CSS and Tailwind classes for elements
7. get_artboard_details - Get comprehensive artboard information
8. export_artboard_preview - View design previews in terminal

Technical Improvements

• New DesignSystemAnalyzer class for design token generation
• Enhanced XDParser with dual-format support via parseNewFormat()
• Comprehensive test suite (test-features.ts) for all 11 tools
• Updated documentation with examples and troubleshooting
• Version bumped to 2.0.0

Files Changed

• src/parsers/xd-parser.ts - Added modern format parsing
• src/tools/xd-tools.ts - Added 8 new analysis tools
• src/analyzers/design-system-analyzer.ts - New design system analyzer
• src/test-features.ts - Comprehensive test suite
• src/index.ts - Registered new tools
• README.md - Updated documentation
• package.json - Version 2.0.0

Testing

Tested with:

• Legacy XD files (v1.x format)
• Modern XD files (v2.33 format with 4 artboards, 363 elements)
• All 11 tools verified working

Breaking Changes

None - fully backward compatible with existing code.

Example Usage

// Works with both old and new XD formats
const info = await getDocumentInfo({ path: 'design.xd' });

// Generate design tokens
const tokens = await generateDesignTokens({ 
  path: 'design.xd', 
  format: 'tailwind' 
});

// Analyze spacing
const spacing = await analyzeLayoutSpacing({ 
  path: 'design.xd', 
  artboardName: 'Homepage' 
});

---

Would love to contribute this back to help others working with modern XD files! Let me know if you'd like any changes.