#!/usr/bin/env python3 # -*- coding: utf-8 -*- """ Design System Generator - Aggregates search results and applies reasoning to generate comprehensive design system recommendations. Usage: from design_system import generate_design_system result = generate_design_system("SaaS dashboard", "My Project") # With persistence (Master + Overrides pattern) result = generate_design_system("SaaS dashboard", "My Project", persist=True) result = generate_design_system("SaaS dashboard", "My Project", persist=True, page="dashboard") """ import csv import json from datetime import datetime from pathlib import Path from core import search, DATA_DIR # ============ CONFIGURATION ============ REASONING_FILE = "ui-reasoning.csv" SEARCH_CONFIG = { "product": {"max_results": 1}, "style": {"max_results": 3}, "color": {"max_results": 2}, "landing": {"max_results": 2}, "typography": {"max_results": 2}, "accessibility": {"max_results": 2}, "animations": {"max_results": 2} } # ============ DESIGN SYSTEM GENERATOR ============ class DesignSystemGenerator: """Generates design system recommendations from aggregated searches.""" def __init__(self): self.reasoning_data = self._load_reasoning() def _load_reasoning(self) -> list: """Load reasoning rules from CSV.""" filepath = DATA_DIR / REASONING_FILE if not filepath.exists(): return [] with open(filepath, 'r', encoding='utf-8') as f: return list(csv.DictReader(f)) def _multi_domain_search(self, query: str, style_priority: list = None) -> dict: """Execute searches across multiple domains.""" results = {} for domain, config in SEARCH_CONFIG.items(): if domain == "style" and style_priority: # For style, also search with priority keywords priority_query = " ".join(style_priority[:2]) if style_priority else query combined_query = f"{query} {priority_query}" results[domain] = search(combined_query, domain, config["max_results"]) else: results[domain] = search(query, domain, config["max_results"]) return results def _find_reasoning_rule(self, category: str) -> dict: """Find matching reasoning rule for a category.""" category_lower = category.lower() # Try exact match first for rule in self.reasoning_data: if rule.get("UI_Category", "").lower() == category_lower: return rule # Try partial match for rule in self.reasoning_data: ui_cat = rule.get("UI_Category", "").lower() if ui_cat in category_lower or category_lower in ui_cat: return rule # Try keyword match for rule in self.reasoning_data: ui_cat = rule.get("UI_Category", "").lower() keywords = ui_cat.replace("/", " ").replace("-", " ").split() if any(kw in category_lower for kw in keywords): return rule return {} def _apply_reasoning(self, category: str, search_results: dict) -> dict: """Apply reasoning rules to search results.""" rule = self._find_reasoning_rule(category) if not rule: return { "pattern": "Hero + Features + CTA", "style_priority": ["Minimalism", "Flat Design"], "color_mood": "Professional", "typography_mood": "Clean", "key_effects": "Subtle hover transitions", "anti_patterns": "", "decision_rules": {}, "severity": "MEDIUM" } # Parse decision rules JSON decision_rules = {} try: decision_rules = json.loads(rule.get("Decision_Rules", "{}")) except json.JSONDecodeError: pass return { "pattern": rule.get("Recommended_Pattern", ""), "style_priority": [s.strip() for s in rule.get("Style_Priority", "").split("+")], "color_mood": rule.get("Color_Mood", ""), "typography_mood": rule.get("Typography_Mood", ""), "key_effects": rule.get("Key_Effects", ""), "anti_patterns": rule.get("Anti_Patterns", ""), "decision_rules": decision_rules, "severity": rule.get("Severity", "MEDIUM"), "dark_mode_strategy": rule.get("Dark_Mode_Strategy", "light-first+toggle"), "ai_integration_level": rule.get("AI_Integration_Level", "basic-assist"), "privacy_tier": rule.get("Privacy_Tier", "GDPR+CCPA"), "agent_readiness": rule.get("Agent_Readiness", "3/5"), "performance_budget": rule.get("Performance_Budget", "LCP<2.5s; CLS<0.1; INP<200ms") } def _select_best_match(self, results: list, priority_keywords: list) -> dict: """Select best matching result based on priority keywords.""" if not results: return {} if not priority_keywords: return results[0] # First: try exact style name match for priority in priority_keywords: priority_lower = priority.lower().strip() for result in results: style_name = result.get("Style Category", "").lower() if priority_lower in style_name or style_name in priority_lower: return result # Second: score by keyword match in all fields scored = [] for result in results: result_str = str(result).lower() score = 0 for kw in priority_keywords: kw_lower = kw.lower().strip() # Higher score for style name match if kw_lower in result.get("Style Category", "").lower(): score += 10 # Lower score for keyword field match elif kw_lower in result.get("Keywords", "").lower(): score += 3 # Even lower for other field matches elif kw_lower in result_str: score += 1 scored.append((score, result)) scored.sort(key=lambda x: x[0], reverse=True) return scored[0][1] if scored and scored[0][0] > 0 else results[0] def _extract_results(self, search_result: dict) -> list: """Extract results list from search result dict.""" return search_result.get("results", []) def generate(self, query: str, project_name: str = None) -> dict: """Generate complete design system recommendation.""" # Step 1: First search product to get category product_result = search(query, "product", 1) product_results = product_result.get("results", []) category = "General" if product_results: category = product_results[0].get("Product Type", "General") # Step 2: Get reasoning rules for this category reasoning = self._apply_reasoning(category, {}) style_priority = reasoning.get("style_priority", []) # Step 3: Multi-domain search with style priority hints search_results = self._multi_domain_search(query, style_priority) search_results["product"] = product_result # Reuse product search # Step 4: Select best matches from each domain using priority style_results = self._extract_results(search_results.get("style", {})) color_results = self._extract_results(search_results.get("color", {})) typography_results = self._extract_results(search_results.get("typography", {})) landing_results = self._extract_results(search_results.get("landing", {})) best_style = self._select_best_match(style_results, reasoning.get("style_priority", [])) best_color = color_results[0] if color_results else {} best_typography = typography_results[0] if typography_results else {} best_landing = landing_results[0] if landing_results else {} # Step 5: Build final recommendation # Combine effects from both reasoning and style search style_effects = best_style.get("Effects & Animation", "") reasoning_effects = reasoning.get("key_effects", "") combined_effects = style_effects if style_effects else reasoning_effects return { "project_name": project_name or query.upper(), "category": category, "pattern": { "name": best_landing.get("Pattern Name", reasoning.get("pattern", "Hero + Features + CTA")), "sections": best_landing.get("Section Order", "Hero > Features > CTA"), "cta_placement": best_landing.get("Primary CTA Placement", "Above fold"), "color_strategy": best_landing.get("Color Strategy", ""), "conversion": best_landing.get("Conversion Optimization", "") }, "style": { "name": best_style.get("Style Category", "Minimalism"), "type": best_style.get("Type", "General"), "effects": style_effects, "keywords": best_style.get("Keywords", ""), "best_for": best_style.get("Best For", ""), "performance": best_style.get("Performance", ""), "accessibility": best_style.get("Accessibility", "") }, "colors": { "primary": best_color.get("Primary (Hex)", "#2563EB"), "secondary": best_color.get("Secondary (Hex)", "#3B82F6"), "cta": best_color.get("CTA (Hex)", "#F97316"), "background": best_color.get("Background (Hex)", "#F8FAFC"), "text": best_color.get("Text (Hex)", "#1E293B"), "notes": best_color.get("Notes", "") }, "typography": { "heading": best_typography.get("Heading Font", "Inter"), "body": best_typography.get("Body Font", "Inter"), "mood": best_typography.get("Mood/Style Keywords", reasoning.get("typography_mood", "")), "best_for": best_typography.get("Best For", ""), "google_fonts_url": best_typography.get("Google Fonts URL", ""), "css_import": best_typography.get("CSS Import", "") }, "key_effects": combined_effects, "anti_patterns": reasoning.get("anti_patterns", ""), "decision_rules": reasoning.get("decision_rules", {}), "severity": reasoning.get("severity", "MEDIUM"), "dark_mode": { "strategy": reasoning.get("dark_mode_strategy", "light-first+toggle") }, "ai_integration": { "level": reasoning.get("ai_integration_level", "basic-assist") }, "privacy": { "tier": reasoning.get("privacy_tier", "GDPR+CCPA") }, "agent_readiness": reasoning.get("agent_readiness", "3/5"), "performance_budget": reasoning.get("performance_budget", "LCP<2.5s; CLS<0.1; INP<200ms") } # ============ OUTPUT FORMATTERS ============ BOX_WIDTH = 90 # Wider box for more content def format_ascii_box(design_system: dict) -> str: """Format design system as ASCII box with emojis (MCP-style).""" project = design_system.get("project_name", "PROJECT") pattern = design_system.get("pattern", {}) style = design_system.get("style", {}) colors = design_system.get("colors", {}) typography = design_system.get("typography", {}) effects = design_system.get("key_effects", "") anti_patterns = design_system.get("anti_patterns", "") def wrap_text(text: str, prefix: str, width: int) -> list: """Wrap long text into multiple lines.""" if not text: return [] words = text.split() lines = [] current_line = prefix for word in words: if len(current_line) + len(word) + 1 <= width - 2: current_line += (" " if current_line != prefix else "") + word else: if current_line != prefix: lines.append(current_line) current_line = prefix + word if current_line != prefix: lines.append(current_line) return lines # Build sections from pattern sections = pattern.get("sections", "").split(">") sections = [s.strip() for s in sections if s.strip()] # Build output lines lines = [] w = BOX_WIDTH - 1 lines.append("+" + "-" * w + "+") lines.append(f"| TARGET: {project} - RECOMMENDED DESIGN SYSTEM".ljust(BOX_WIDTH) + "|") lines.append("+" + "-" * w + "+") lines.append("|" + " " * BOX_WIDTH + "|") # Pattern section lines.append(f"| PATTERN: {pattern.get('name', '')}".ljust(BOX_WIDTH) + "|") if pattern.get('conversion'): lines.append(f"| Conversion: {pattern.get('conversion', '')}".ljust(BOX_WIDTH) + "|") if pattern.get('cta_placement'): lines.append(f"| CTA: {pattern.get('cta_placement', '')}".ljust(BOX_WIDTH) + "|") lines.append("| Sections:".ljust(BOX_WIDTH) + "|") for i, section in enumerate(sections, 1): lines.append(f"| {i}. {section}".ljust(BOX_WIDTH) + "|") lines.append("|" + " " * BOX_WIDTH + "|") # Style section lines.append(f"| STYLE: {style.get('name', '')}".ljust(BOX_WIDTH) + "|") if style.get("keywords"): for line in wrap_text(f"Keywords: {style.get('keywords', '')}", "| ", BOX_WIDTH): lines.append(line.ljust(BOX_WIDTH) + "|") if style.get("best_for"): for line in wrap_text(f"Best For: {style.get('best_for', '')}", "| ", BOX_WIDTH): lines.append(line.ljust(BOX_WIDTH) + "|") if style.get("performance") or style.get("accessibility"): perf_a11y = f"Performance: {style.get('performance', '')} | Accessibility: {style.get('accessibility', '')}" lines.append(f"| {perf_a11y}".ljust(BOX_WIDTH) + "|") lines.append("|" + " " * BOX_WIDTH + "|") # Colors section lines.append("| COLORS:".ljust(BOX_WIDTH) + "|") lines.append(f"| Primary: {colors.get('primary', '')}".ljust(BOX_WIDTH) + "|") lines.append(f"| Secondary: {colors.get('secondary', '')}".ljust(BOX_WIDTH) + "|") lines.append(f"| CTA: {colors.get('cta', '')}".ljust(BOX_WIDTH) + "|") lines.append(f"| Background: {colors.get('background', '')}".ljust(BOX_WIDTH) + "|") lines.append(f"| Text: {colors.get('text', '')}".ljust(BOX_WIDTH) + "|") if colors.get("notes"): for line in wrap_text(f"Notes: {colors.get('notes', '')}", "| ", BOX_WIDTH): lines.append(line.ljust(BOX_WIDTH) + "|") lines.append("|" + " " * BOX_WIDTH + "|") # Typography section lines.append(f"| TYPOGRAPHY: {typography.get('heading', '')} / {typography.get('body', '')}".ljust(BOX_WIDTH) + "|") if typography.get("mood"): for line in wrap_text(f"Mood: {typography.get('mood', '')}", "| ", BOX_WIDTH): lines.append(line.ljust(BOX_WIDTH) + "|") if typography.get("best_for"): for line in wrap_text(f"Best For: {typography.get('best_for', '')}", "| ", BOX_WIDTH): lines.append(line.ljust(BOX_WIDTH) + "|") if typography.get("google_fonts_url"): lines.append(f"| Google Fonts: {typography.get('google_fonts_url', '')}".ljust(BOX_WIDTH) + "|") if typography.get("css_import"): lines.append(f"| CSS Import: {typography.get('css_import', '')[:70]}...".ljust(BOX_WIDTH) + "|") lines.append("|" + " " * BOX_WIDTH + "|") # Key Effects section if effects: lines.append("| KEY EFFECTS:".ljust(BOX_WIDTH) + "|") for line in wrap_text(effects, "| ", BOX_WIDTH): lines.append(line.ljust(BOX_WIDTH) + "|") lines.append("|" + " " * BOX_WIDTH + "|") # Anti-patterns section if anti_patterns: lines.append("| AVOID (Anti-patterns):".ljust(BOX_WIDTH) + "|") for line in wrap_text(anti_patterns, "| ", BOX_WIDTH): lines.append(line.ljust(BOX_WIDTH) + "|") lines.append("|" + " " * BOX_WIDTH + "|") # AI & Agent section dark_mode = design_system.get("dark_mode", {}) ai_integration = design_system.get("ai_integration", {}) privacy = design_system.get("privacy", {}) agent_readiness = design_system.get("agent_readiness", "") perf_budget = design_system.get("performance_budget", "") if any([dark_mode.get("strategy"), ai_integration.get("level"), privacy.get("tier")]): lines.append("| 2026 CAPABILITIES:".ljust(BOX_WIDTH) + "|") if dark_mode.get("strategy"): lines.append(f"| Dark Mode: {dark_mode['strategy']}".ljust(BOX_WIDTH) + "|") if ai_integration.get("level"): lines.append(f"| AI Integration: {ai_integration['level']}".ljust(BOX_WIDTH) + "|") if privacy.get("tier"): lines.append(f"| Privacy Tier: {privacy['tier']}".ljust(BOX_WIDTH) + "|") if agent_readiness: lines.append(f"| Agent Readiness: {agent_readiness}".ljust(BOX_WIDTH) + "|") if perf_budget: lines.append(f"| Performance Budget: {perf_budget}".ljust(BOX_WIDTH) + "|") lines.append("|" + " " * BOX_WIDTH + "|") # Pre-Delivery Checklist section lines.append("| PRE-DELIVERY CHECKLIST:".ljust(BOX_WIDTH) + "|") checklist_items = [ "[ ] No emojis as icons (use SVG: Heroicons/Lucide)", "[ ] cursor-pointer on all clickable elements", "[ ] Hover states with smooth transitions (150-300ms)", "[ ] Light mode: text contrast 4.5:1 minimum", "[ ] Focus states visible for keyboard nav", "[ ] prefers-reduced-motion respected", "[ ] Responsive: 375px, 768px, 1024px, 1440px", "[ ] Dark mode: prefers-color-scheme + manual toggle", "[ ] AI responses: streaming + confidence indicators", "[ ] Privacy: consent-before-track + GDPR delete flow", "[ ] Performance: LCP<2.5s, CLS<0.1, INP<200ms" ] for item in checklist_items: lines.append(f"| {item}".ljust(BOX_WIDTH) + "|") lines.append("|" + " " * BOX_WIDTH + "|") lines.append("+" + "-" * w + "+") return "\n".join(lines) from string import Template # Assuming DATA_DIR is defined elsewhere, e.g., in core.py or config.py # For this snippet, we'll define a placeholder if it's not globally available try: DATA_DIR # Check if DATA_DIR is already defined except NameError: # Placeholder for DATA_DIR if not defined in the provided context # In a real application, this would be imported or defined globally DATA_DIR = Path(__file__).parent / "data" def _render_template(design_system: dict) -> str: template_path = DATA_DIR.parent / "templates" / "design_system.md.tpl" if not template_path.exists(): return "# Error: Template not found at " + str(template_path) with open(template_path, "r", encoding="utf-8") as f: tpl_str = f.read() mapping = { "project": design_system.get("project_name", "PROJECT"), "timestamp": datetime.now().strftime("%Y-%m-%d %H:%M:%S"), "color_mood": design_system.get("color_mood", ""), "colors_primary": design_system.get("colors", {}).get("primary", ""), "colors_secondary": design_system.get("colors", {}).get("secondary", ""), "colors_cta": design_system.get("colors", {}).get("cta", ""), "colors_background": design_system.get("colors", {}).get("background", ""), "colors_text": design_system.get("colors", {}).get("text", ""), "colors_border": design_system.get("colors", {}).get("border", ""), "typography_mood": design_system.get("typography", {}).get("mood", ""), # Corrected to use 'mood' from typography "typography_heading": design_system.get("typography", {}).get("heading", ""), "typography_body": design_system.get("typography", {}).get("body", ""), "typography_import": design_system.get("typography", {}).get("css_import", ""), "style_name": design_system.get("style", {}).get("name", ""), "style_keywords": design_system.get("style", {}).get("keywords", ""), "style_best_for": design_system.get("style", {}).get("best_for", ""), "key_effects": design_system.get("key_effects", ""), "pattern_name": design_system.get("pattern", {}).get("name", ""), "pattern_conversion": design_system.get("pattern", {}).get("conversion", ""), "pattern_cta_placement": design_system.get("pattern", {}).get("cta_placement", ""), "pattern_sections": design_system.get("pattern", {}).get("sections", ""), "anti_patterns": "\n".join([f"- ❌ {a.strip()}" for a in design_system.get("anti_patterns", "").split("+") if a.strip()]), "dark_mode_strategy": design_system.get("dark_mode", {}).get("strategy", ""), "ai_integration": design_system.get("ai_integration", {}).get("level", ""), "privacy_tier": design_system.get("privacy", {}).get("tier", ""), "agent_readiness": design_system.get("agent_readiness", ""), "performance_budget": design_system.get("performance_budget", "") } return Template(tpl_str).safe_substitute(mapping) def format_json(design_system: dict) -> str: """Format design system as a JSON string.""" return json.dumps(design_system, indent=2) def format_markdown(design_system: dict) -> str: """Format design system as markdown.""" return _render_template(design_system) # ============ MAIN ENTRY POINT ============ def generate_design_system(query: str, project_name: str = None, output_format: str = "ascii", persist: bool = False, page: str = None, output_dir: str = None) -> str: """ Main entry point for design system generation. Args: query: Search query (e.g., "SaaS dashboard", "e-commerce luxury") project_name: Optional project name for output header output_format: "ascii", "markdown", or "json" persist: If True, save design system to design-system/ folder page: Optional page name for page-specific override file output_dir: Optional output directory (defaults to current working directory) Returns: Formatted design system string """ generator = DesignSystemGenerator() design_system = generator.generate(query, project_name) # Persist to files if requested if persist: persist_design_system(design_system, page, output_dir, query) if output_format == "json": return format_json(design_system) elif output_format == "markdown": return format_markdown(design_system) return format_ascii_box(design_system) # ============ PERSISTENCE FUNCTIONS ============ def persist_design_system(design_system: dict, page: str = None, output_dir: str = None, page_query: str = None) -> dict: """ Persist design system to design-system// folder using Master + Overrides pattern. Args: design_system: The generated design system dictionary page: Optional page name for page-specific override file output_dir: Optional output directory (defaults to current working directory) page_query: Optional query string for intelligent page override generation Returns: dict with created file paths and status """ base_dir = Path(output_dir) if output_dir else Path.cwd() # Use project name for project-specific folder project_name = design_system.get("project_name", "default") project_slug = project_name.lower().replace(' ', '-') design_system_dir = base_dir / "design-system" / project_slug pages_dir = design_system_dir / "pages" created_files = [] # Create directories design_system_dir.mkdir(parents=True, exist_ok=True) pages_dir.mkdir(parents=True, exist_ok=True) master_file = design_system_dir / "MASTER.md" # Generate and write MASTER.md master_content = format_master_md(design_system) with open(master_file, 'w', encoding='utf-8') as f: f.write(master_content) created_files.append(str(master_file)) # If page is specified, create page override file with intelligent content if page: page_file = pages_dir / f"{page.lower().replace(' ', '-')}.md" page_content = format_page_override_md(design_system, page, page_query) with open(page_file, 'w', encoding='utf-8') as f: f.write(page_content) created_files.append(str(page_file)) return { "status": "success", "design_system_dir": str(design_system_dir), "created_files": created_files } def format_master_md(design_system: dict) -> str: """Format design system as MASTER.md with hierarchical override logic.""" return _render_template(design_system) def format_page_override_md(design_system: dict, page_name: str, page_query: str = None) -> str: """Format a page-specific override file with intelligent AI-generated content.""" project = design_system.get("project_name", "PROJECT") timestamp = datetime.now().strftime("%Y-%m-%d %H:%M:%S") page_title = page_name.replace("-", " ").replace("_", " ").title() # Detect page type and generate intelligent overrides page_overrides = _generate_intelligent_overrides(page_name, page_query, design_system) template_path = DATA_DIR.parent / "templates" / "page_override.md.tpl" if not template_path.exists(): return "# Error: Template not found at " + str(template_path) with open(template_path, "r", encoding="utf-8") as f: tpl_str = f.read() def format_dict(d: dict, empty_msg: str) -> str: if not d: return f"- {empty_msg}" return "\n".join([f"- **{k}:** {v}" for k, v in d.items()]) def format_list(l: list, empty_msg: str) -> str: if not l: return f"- {empty_msg}" return "\n".join([f"- {i}" for i in l]) mapping = { "page_title": page_title, "project": project, "timestamp": timestamp, "page_type": page_overrides.get('page_type', 'General'), "layout_overrides": format_dict(page_overrides.get("layout", {}), "No overrides — use Master layout"), "spacing_overrides": format_dict(page_overrides.get("spacing", {}), "No overrides — use Master spacing"), "typography_overrides": format_dict(page_overrides.get("typography", {}), "No overrides — use Master typography"), "color_overrides": format_dict(page_overrides.get("colors", {}), "No overrides — use Master colors"), "component_overrides": format_list(page_overrides.get("components", []), "No overrides — use Master component specs"), "unique_components": format_list(page_overrides.get("unique_components", []), "No unique components for this page"), "recommendations": format_list(page_overrides.get("recommendations", []), "No specific recommendations") } return Template(tpl_str).safe_substitute(mapping) def _generate_intelligent_overrides(page_name: str, page_query: str, design_system: dict) -> dict: """ Generate intelligent overrides based on page type using layered search. Uses the existing search infrastructure to find relevant style, UX, and layout data instead of hardcoded page types. """ from core import search page_lower = page_name.lower() query_lower = (page_query or "").lower() combined_context = f"{page_lower} {query_lower}" # Search across multiple domains for page-specific guidance style_search = search(combined_context, "style", max_results=1) ux_search = search(combined_context, "ux", max_results=3) landing_search = search(combined_context, "landing", max_results=1) # Extract results from search response style_results = style_search.get("results", []) ux_results = ux_search.get("results", []) landing_results = landing_search.get("results", []) # Detect page type from search results or context page_type = _detect_page_type(combined_context, style_results) # Build overrides from search results layout = {} spacing = {} typography = {} colors = {} components = [] unique_components = [] recommendations = [] # Extract style-based overrides if style_results: style = style_results[0] style_name = style.get("Style Category", "") keywords = style.get("Keywords", "") best_for = style.get("Best For", "") effects = style.get("Effects & Animation", "") # Infer layout from style keywords if any(kw in keywords.lower() for kw in ["data", "dense", "dashboard", "grid"]): layout["Max Width"] = "1400px or full-width" layout["Grid"] = "12-column grid for data flexibility" spacing["Content Density"] = "High — optimize for information display" elif any(kw in keywords.lower() for kw in ["minimal", "simple", "clean", "single"]): layout["Max Width"] = "800px (narrow, focused)" layout["Layout"] = "Single column, centered" spacing["Content Density"] = "Low — focus on clarity" else: layout["Max Width"] = "1200px (standard)" layout["Layout"] = "Full-width sections, centered content" if effects: recommendations.append(f"Effects: {effects}") # Extract UX guidelines as recommendations for ux in ux_results: category = ux.get("Category", "") do_text = ux.get("Do", "") dont_text = ux.get("Don't", "") if do_text: recommendations.append(f"{category}: {do_text}") if dont_text: components.append(f"Avoid: {dont_text}") # Extract landing pattern info for section structure if landing_results: landing = landing_results[0] sections = landing.get("Section Order", "") cta_placement = landing.get("Primary CTA Placement", "") color_strategy = landing.get("Color Strategy", "") if sections: layout["Sections"] = sections if cta_placement: recommendations.append(f"CTA Placement: {cta_placement}") if color_strategy: colors["Strategy"] = color_strategy # Add page-type specific defaults if no search results if not layout: layout["Max Width"] = "1200px" layout["Layout"] = "Responsive grid" if not recommendations: recommendations = [ "Refer to MASTER.md for all design rules", "Add specific overrides as needed for this page" ] return { "page_type": page_type, "layout": layout, "spacing": spacing, "typography": typography, "colors": colors, "components": components, "unique_components": unique_components, "recommendations": recommendations } def _detect_page_type(context: str, style_results: list) -> str: """Detect page type from context and search results.""" context_lower = context.lower() # Check for common page type patterns page_patterns = [ (["dashboard", "admin", "analytics", "data", "metrics", "stats", "monitor", "overview"], "Dashboard / Data View"), (["checkout", "payment", "cart", "purchase", "order", "billing"], "Checkout / Payment"), (["settings", "profile", "account", "preferences", "config"], "Settings / Profile"), (["landing", "marketing", "homepage", "hero", "home", "promo"], "Landing / Marketing"), (["login", "signin", "signup", "register", "auth", "password"], "Authentication"), (["pricing", "plans", "subscription", "tiers", "packages"], "Pricing / Plans"), (["blog", "article", "post", "news", "content", "story"], "Blog / Article"), (["product", "item", "detail", "pdp", "shop", "store"], "Product Detail"), (["search", "results", "browse", "filter", "catalog", "list"], "Search Results"), (["empty", "404", "error", "not found", "zero"], "Empty State"), ] for keywords, page_type in page_patterns: if any(kw in context_lower for kw in keywords): return page_type # Fallback: try to infer from style results if style_results: style_name = style_results[0].get("Style Category", "").lower() best_for = style_results[0].get("Best For", "").lower() if "dashboard" in best_for or "data" in best_for: return "Dashboard / Data View" elif "landing" in best_for or "marketing" in best_for: return "Landing / Marketing" return "General" # ============ CLI SUPPORT ============ if __name__ == "__main__": import argparse parser = argparse.ArgumentParser(description="Generate Design System") parser.add_argument("query", help="Search query (e.g., 'SaaS dashboard')") parser.add_argument("--project-name", "-p", type=str, default=None, help="Project name") parser.add_argument("--format", choices=["ascii", "markdown", "json"], default="ascii", help="Output format (ascii, markdown, or json)") args = parser.parse_args() result = generate_design_system(args.query, args.project_name, args.format) print(result)