#!/usr/bin/env python3 """ Pattern Implementation Generator Generates implementation code from analyzed patterns """ import sys import json import os from datetime import datetime class PatternGenerator: def __init__(self, pattern_file, framework='tailwind'): self.pattern_file = pattern_file self.framework = framework self.patterns = None def load_patterns(self): """Load pattern JSON file""" print(f"š Loading patterns from: {self.pattern_file}") try: with open(self.pattern_file, 'r') as f: self.patterns = json.load(f) print(f"ā Patterns loaded successfully") return True except Exception as e: print(f"ā Error loading patterns: {e}") return False def generate_component_library(self): """Generate component library from patterns""" print(f"\nš§© Generating Component Library for {self.framework}...") if not self.patterns.get('components'): print("ā ļø No components found in patterns") return {} library = {} for comp in self.patterns['components']: comp_type = comp['type'] examples = comp.get('examples', []) if not examples: continue library[comp_type] = { 'count': comp['count'], 'implementations': [] } for i, example in enumerate(examples[:2]): # Max 2 examples impl = self._convert_to_framework(comp_type, example) if impl: library[comp_type]['implementations'].append(impl) print(f" ā Generated {comp_type} component") return library def _convert_to_framework(self, comp_type, html_snippet): """Convert HTML snippet to target framework""" # Clean up the snippet snippet = html_snippet.strip() if self.framework == 'tailwind': return self._convert_tailwind(comp_type, snippet) elif self.framework == 'react': return self._convert_react(comp_type, snippet) elif self.framework == 'vue': return self._convert_vue(comp_type, snippet) else: return {'html': snippet} def _convert_tailwind(self, comp_type, snippet): """Convert to Tailwind HTML""" # Extract classes if present import re classes = re.findall(r'class="([^"]*)"', snippet) all_classes = ' '.join(classes) if classes else '' return { 'framework': 'tailwind', 'html': snippet, 'classes': all_classes, 'usage': f'' } def _convert_react(self, comp_type, snippet): """Convert to React component""" import re # Extract classes classes = re.findall(r'class="([^"]*)"', snippet) # Convert to JSX jsx = snippet # Replace class with className jsx = re.sub(r'class=', 'className=', jsx) # Close self-closing tags jsx = re.sub(r']*)>', r'', jsx) component_name = ''.join([w.capitalize() for w in comp_type.split('_')]) return { 'framework': 'react', 'component_name': component_name, 'jsx': jsx, 'code': f'''export function {component_name}() {{ return ( {self._indent_jsx(jsx, 4)} ); }}''' } def _convert_vue(self, comp_type, snippet): """Convert to Vue component""" component_name = ''.join([w.capitalize() for w in comp_type.split('_')]) return { 'framework': 'vue', 'component_name': component_name, 'template': snippet, 'code': f''' {self._indent_jsx(snippet, 2)} ''' } def _indent_jsx(self, code, spaces): """Indent multi-line JSX/Vue code""" lines = code.split('\n') indent = ' ' * spaces return '\n'.join([indent + line if line.strip() else line for line in lines]) def generate_design_system(self): """Generate design system from tokens""" print(f"\nšØ Generating Design System...") if not self.patterns.get('design_tokens'): print("ā ļø No design tokens found") return {} tokens = self.patterns['design_tokens'] design_system = {} # Colors if 'colors' in tokens: design_system['colors'] = self._generate_color_tokens(tokens['colors']) # Typography if 'typography' in tokens: design_system['typography'] = self._generate_typography_tokens(tokens['typography']) # Spacing if 'spacing' in tokens: design_system['spacing'] = self._generate_spacing_tokens(tokens['spacing']) # Effects if 'effects' in tokens: design_system['effects'] = self._generate_effect_tokens(tokens['effects']) return design_system def _generate_color_tokens(self, colors): """Generate color tokens""" tokens = {'tailwind': {}, 'hex': {}} if 'tailwind' in colors: # Group by color name for color_class in colors['tailwind']: parts = color_class.split('-') if len(parts) >= 3: prop, color, shade = parts[0], parts[1], parts[2] if color not in tokens['tailwind']: tokens['tailwind'][color] = [] tokens['tailwind'][color].append(shade) if 'hex' in colors: tokens['hex'] = colors['hex'][:10] # Limit to 10 return tokens def _generate_typography_tokens(self, typography): """Generate typography tokens""" tokens = {} if 'fonts' in typography: tokens['font_families'] = typography['fonts'] if 'sizes' in typography: tokens['font_sizes'] = typography['sizes'] if 'tailwind' in typography: tokens['tailwind_classes'] = typography['tailwind'] return tokens def _generate_spacing_tokens(self, spacing): """Generate spacing tokens""" tokens = {} if 'tailwind' in spacing: # Extract unique spacing values values = set() for class_name in spacing['tailwind']: parts = class_name.split('-') if len(parts) >= 2: values.add(parts[-1]) tokens['tailwind_scale'] = list(values) if 'css' in spacing: tokens['css_values'] = spacing['css'][:5] return tokens def _generate_effect_tokens(self, effects): """Generate effect tokens""" tokens = {} if 'shadows' in effects: tokens['box_shadows'] = effects['shadows'][:5] if 'tailwind_shadows' in effects: tokens['tailwind_shadows'] = effects['tailwind_shadows'] if 'radius' in effects: tokens['border_radius'] = effects['radius'] return tokens def generate_implementation_guide(self): """Generate implementation guide""" print(f"\nš Generating Implementation Guide...") source = self.patterns.get('source', 'Unknown') timestamp = self.patterns.get('timestamp', datetime.now().isoformat()) guide = f'''# Design Pattern Implementation Guide **Source:** {source} **Analyzed:** {timestamp} **Framework:** {self.framework} ## Quick Start 1. Review the design tokens below 2. Copy component code for your needs 3. Integrate into your project 4. Customize as needed --- ## Design System ### Colors {self._format_colors()} ### Typography {self._format_typography()} ### Spacing {self._format_spacing()} ### Effects {self._format_effects()} --- ## Components {self._format_components()} --- ## Usage Examples ### Applying Design Tokens ```{self.framework}