@nockdev/awf 6.2.0 → 6.2.1

package/.agent/skills/cross-cutting/ui-ux-pro-max/scripts/design_system.py

@@ -1,496 +0,0 @@
-#!/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")
-"""
-
-import csv
-import json
-import yaml
-from pathlib import Path
-from core import search, DATA_DIR
-
-
-# ============ CONFIGURATION ============
-REASONING_FILE = "ui-reasoning.yaml"
-
-SEARCH_CONFIG = {
-    "product": {"max_results": 1},
-    "style": {"max_results": 3},
-    "color": {"max_results": 2},
-    "landing": {"max_results": 2},
-    "typography": {"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 YAML (with CSV fallback)."""
-        filepath = DATA_DIR / REASONING_FILE
-        if not filepath.exists():
-            # Fallback to CSV if YAML not found
-            csv_path = filepath.with_suffix('.csv')
-            if csv_path.exists():
-                with open(csv_path, 'r', encoding='utf-8') as f:
-                    return list(csv.DictReader(f))
-            return []
-        with open(filepath, 'r', encoding='utf-8') as f:
-            data = yaml.safe_load(f)
-        if isinstance(data, dict):
-            return data.get('patterns', data.get('rules', []))
-        return data if isinstance(data, list) else []
-
-    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")
-        }
-
-    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")
-        }
-
-
-# ============ 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 + "|")
-
-    # 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"
-    ]
-    for item in checklist_items:
-        lines.append(f"|     {item}".ljust(BOX_WIDTH) + "|")
-    lines.append("|" + " " * BOX_WIDTH + "|")
-
-    lines.append("+" + "-" * w + "+")
-
-    return "\n".join(lines)
-
-
-def format_markdown(design_system: dict) -> str:
-    """Format design system as markdown."""
-    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", "")
-
-    lines = []
-    lines.append(f"## Design System: {project}")
-    lines.append("")
-
-    # Pattern section
-    lines.append("### Pattern")
-    lines.append(f"- **Name:** {pattern.get('name', '')}")
-    if pattern.get('conversion'):
-        lines.append(f"- **Conversion Focus:** {pattern.get('conversion', '')}")
-    if pattern.get('cta_placement'):
-        lines.append(f"- **CTA Placement:** {pattern.get('cta_placement', '')}")
-    if pattern.get('color_strategy'):
-        lines.append(f"- **Color Strategy:** {pattern.get('color_strategy', '')}")
-    lines.append(f"- **Sections:** {pattern.get('sections', '')}")
-    lines.append("")
-
-    # Style section
-    lines.append("### Style")
-    lines.append(f"- **Name:** {style.get('name', '')}")
-    if style.get('keywords'):
-        lines.append(f"- **Keywords:** {style.get('keywords', '')}")
-    if style.get('best_for'):
-        lines.append(f"- **Best For:** {style.get('best_for', '')}")
-    if style.get('performance') or style.get('accessibility'):
-        lines.append(f"- **Performance:** {style.get('performance', '')} | **Accessibility:** {style.get('accessibility', '')}")
-    lines.append("")
-
-    # Colors section
-    lines.append("### Colors")
-    lines.append(f"| Role | Hex |")
-    lines.append(f"|------|-----|")
-    lines.append(f"| Primary | {colors.get('primary', '')} |")
-    lines.append(f"| Secondary | {colors.get('secondary', '')} |")
-    lines.append(f"| CTA | {colors.get('cta', '')} |")
-    lines.append(f"| Background | {colors.get('background', '')} |")
-    lines.append(f"| Text | {colors.get('text', '')} |")
-    if colors.get("notes"):
-        lines.append(f"\n*Notes: {colors.get('notes', '')}*")
-    lines.append("")
-
-    # Typography section
-    lines.append("### Typography")
-    lines.append(f"- **Heading:** {typography.get('heading', '')}")
-    lines.append(f"- **Body:** {typography.get('body', '')}")
-    if typography.get("mood"):
-        lines.append(f"- **Mood:** {typography.get('mood', '')}")
-    if typography.get("best_for"):
-        lines.append(f"- **Best For:** {typography.get('best_for', '')}")
-    if typography.get("google_fonts_url"):
-        lines.append(f"- **Google Fonts:** {typography.get('google_fonts_url', '')}")
-    if typography.get("css_import"):
-        lines.append(f"- **CSS Import:**")
-        lines.append(f"```css")
-        lines.append(f"{typography.get('css_import', '')}")
-        lines.append(f"```")
-    lines.append("")
-
-    # Key Effects section
-    if effects:
-        lines.append("### Key Effects")
-        lines.append(f"{effects}")
-        lines.append("")
-
-    # Anti-patterns section
-    if anti_patterns:
-        lines.append("### Avoid (Anti-patterns)")
-        lines.append(f"- {anti_patterns.replace(' + ', '\n- ')}")
-        lines.append("")
-
-    # Pre-Delivery Checklist section
-    lines.append("### Pre-Delivery Checklist")
-    lines.append("- [ ] No emojis as icons (use SVG: Heroicons/Lucide)")
-    lines.append("- [ ] cursor-pointer on all clickable elements")
-    lines.append("- [ ] Hover states with smooth transitions (150-300ms)")
-    lines.append("- [ ] Light mode: text contrast 4.5:1 minimum")
-    lines.append("- [ ] Focus states visible for keyboard nav")
-    lines.append("- [ ] prefers-reduced-motion respected")
-    lines.append("- [ ] Responsive: 375px, 768px, 1024px, 1440px")
-    lines.append("")
-
-    return "\n".join(lines)
-
-
-# ============ MAIN ENTRY POINT ============
-def generate_design_system(query: str, project_name: str = None, output_format: str = "ascii") -> 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" (default) or "markdown"
-
-    Returns:
-        Formatted design system string
-    """
-    generator = DesignSystemGenerator()
-    design_system = generator.generate(query, project_name)
-
-    if output_format == "markdown":
-        return format_markdown(design_system)
-    return format_ascii_box(design_system)
-
-
-# ============ 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", "-f", choices=["ascii", "markdown"], default="ascii", help="Output format")
-
-    args = parser.parse_args()
-
-    result = generate_design_system(args.query, args.project_name, args.format)
-    print(result)

package/.agent/skills/cross-cutting/ui-ux-pro-max/scripts/search.py

@@ -1,76 +0,0 @@
-#!/usr/bin/env python3
-# -*- coding: utf-8 -*-
-"""
-UI/UX Pro Max Search - BM25 search engine for UI/UX style guides
-Usage: python search.py "<query>" [--domain <domain>] [--stack <stack>] [--max-results 3]
-       python search.py "<query>" --design-system [-p "Project Name"]
-
-Domains: style, prompt, color, chart, landing, product, ux, typography
-Stacks: html-tailwind, react, nextjs
-"""
-
-import argparse
-from core import CSV_CONFIG, AVAILABLE_STACKS, MAX_RESULTS, search, search_stack
-from design_system import generate_design_system
-
-
-def format_output(result):
-    """Format results for Claude consumption (token-optimized)"""
-    if "error" in result:
-        return f"Error: {result['error']}"
-
-    output = []
-    if result.get("stack"):
-        output.append(f"## UI Pro Max Stack Guidelines")
-        output.append(f"**Stack:** {result['stack']} | **Query:** {result['query']}")
-    else:
-        output.append(f"## UI Pro Max Search Results")
-        output.append(f"**Domain:** {result['domain']} | **Query:** {result['query']}")
-    output.append(f"**Source:** {result['file']} | **Found:** {result['count']} results\n")
-
-    for i, row in enumerate(result['results'], 1):
-        output.append(f"### Result {i}")
-        for key, value in row.items():
-            value_str = str(value)
-            if len(value_str) > 300:
-                value_str = value_str[:300] + "..."
-            output.append(f"- **{key}:** {value_str}")
-        output.append("")
-
-    return "\n".join(output)
-
-
-if __name__ == "__main__":
-    parser = argparse.ArgumentParser(description="UI Pro Max Search")
-    parser.add_argument("query", help="Search query")
-    parser.add_argument("--domain", "-d", choices=list(CSV_CONFIG.keys()), help="Search domain")
-    parser.add_argument("--stack", "-s", choices=AVAILABLE_STACKS, help="Stack-specific search (html-tailwind, react, nextjs)")
-    parser.add_argument("--max-results", "-n", type=int, default=MAX_RESULTS, help="Max results (default: 3)")
-    parser.add_argument("--json", action="store_true", help="Output as JSON")
-    # Design system generation
-    parser.add_argument("--design-system", "-ds", action="store_true", help="Generate complete design system recommendation")
-    parser.add_argument("--project-name", "-p", type=str, default=None, help="Project name for design system output")
-    parser.add_argument("--format", "-f", choices=["ascii", "markdown"], default="ascii", help="Output format for design system")
-
-    args = parser.parse_args()
-
-    # Design system takes priority
-    if args.design_system:
-        result = generate_design_system(args.query, args.project_name, args.format)
-        print(result)
-    # Stack search
-    elif args.stack:
-        result = search_stack(args.query, args.stack, args.max_results)
-        if args.json:
-            import json
-            print(json.dumps(result, indent=2, ensure_ascii=False))
-        else:
-            print(format_output(result))
-    # Domain search
-    else:
-        result = search(args.query, args.domain, args.max_results)
-        if args.json:
-            import json
-            print(json.dumps(result, indent=2, ensure_ascii=False))
-        else:
-            print(format_output(result))