Upload app.py

app.py

@@ -360,6 +360,35 @@ async def extract_tokens(pages_data, progress=gr.Progress()):
         except Exception as e:
             state.log(f"   ⚠️ Firecrawl extraction skipped: {str(e)}")
         
+        # === SEMANTIC COLOR ANALYSIS (Agent 1C) ===
+        progress(0.92, desc="🧠 Semantic color analysis...")
+        
+        semantic_result = {}
+        semantic_preview_html = ""
+        
+        try:
+            from agents.semantic_analyzer import SemanticColorAnalyzer, generate_semantic_preview_html
+            
+            # Create analyzer (using rule-based for now, can add LLM later)
+            semantic_analyzer = SemanticColorAnalyzer(llm_provider=None)
+            
+            # Run analysis
+            semantic_result = semantic_analyzer.analyze_sync(
+                colors=state.desktop_normalized.colors,
+                log_callback=state.log
+            )
+            
+            # Store in state for Stage 2
+            state.semantic_analysis = semantic_result
+            
+            # Generate preview HTML
+            semantic_preview_html = generate_semantic_preview_html(semantic_result)
+            
+        except Exception as e:
+            state.log(f"   ⚠️ Semantic analysis skipped: {str(e)}")
+            import traceback
+            state.log(traceback.format_exc())
+        
         progress(0.95, desc="📊 Preparing results...")
         
         # Format results for Stage 1 UI
@@ -399,7 +428,10 @@ async def extract_tokens(pages_data, progress=gr.Progress()):
                 "value": c.value,
                 "frequency": c.frequency,
                 "contexts": c.contexts[:3] if c.contexts else [],
+                "elements": c.elements[:3] if c.elements else [],
+                "css_properties": c.css_properties[:3] if c.css_properties else [],
                 "contrast_white": c.contrast_white,
+                "contrast_black": getattr(c, 'contrast_black', 0),
             }
         
         # Convert spacing tokens to dict format
@@ -449,10 +481,16 @@ async def extract_tokens(pages_data, progress=gr.Progress()):
         
         state.log("   ✅ Typography preview generated")
         state.log("   ✅ Colors AS-IS preview generated (no ramps)")
+        state.log("   ✅ Semantic color analysis preview generated")
         state.log("   ✅ Spacing AS-IS preview generated")
         state.log("   ✅ Radius AS-IS preview generated")
         state.log("   ✅ Shadows AS-IS preview generated")
         
+        # Get semantic summary for status
+        brand_count = len(semantic_result.get("brand", {}))
+        text_count = len(semantic_result.get("text", {}))
+        bg_count = len(semantic_result.get("background", {}))
+        
         state.log("")
         state.log("=" * 50)
         state.log("✅ EXTRACTION COMPLETE!")
@@ -462,6 +500,10 @@ async def extract_tokens(pages_data, progress=gr.Progress()):
         state.log(f"   • {len(state.desktop_normalized.spacing)} spacing values")
         state.log(f"   • {len(state.desktop_normalized.radius)} radius values")
         state.log(f"   • {len(state.desktop_normalized.shadows)} shadow values")
+        state.log(f"   Semantic Analysis:")
+        state.log(f"   • {brand_count} brand colors identified")
+        state.log(f"   • {text_count} text colors identified")
+        state.log(f"   • {bg_count} background colors identified")
         state.log("=" * 50)
         
         progress(1.0, desc="✅ Complete!")
@@ -475,12 +517,14 @@ async def extract_tokens(pages_data, progress=gr.Progress()):
 
 **Primary Font:** {primary_font}
 
-**Enhanced Extraction:** DOM styles + CSS Variables + SVG colors + Inline styles + Stylesheets
+**Semantic Analysis:** {brand_count} brand, {text_count} text, {bg_count} background colors
+
+**Enhanced Extraction:** DOM + CSS Variables + SVG + Inline + Stylesheets + Firecrawl
 
 **Next:** Review the tokens below. Accept or reject, then proceed to Stage 2.
 """
         
-        # Return all AS-IS previews
+        # Return all AS-IS previews including semantic
         return (
             status, 
             state.get_logs(), 
@@ -488,6 +532,7 @@ async def extract_tokens(pages_data, progress=gr.Progress()):
             mobile_data, 
             typography_preview_html, 
             colors_asis_preview_html,
+            semantic_preview_html,
             spacing_asis_preview_html,
             radius_asis_preview_html,
             shadows_asis_preview_html,
@@ -497,7 +542,7 @@ async def extract_tokens(pages_data, progress=gr.Progress()):
         import traceback
         state.log(f"❌ Error: {str(e)}")
         state.log(traceback.format_exc())
-        return f"❌ Error: {str(e)}", state.get_logs(), None, None, "", "", "", "", ""
+        return f"❌ Error: {str(e)}", state.get_logs(), None, None, "", "", "", "", "", ""
 
 
 def format_tokens_for_display(normalized) -> dict:
@@ -600,7 +645,7 @@ async def run_stage2_analysis(competitors_str: str = "", progress=gr.Progress())
         desktop_dict = normalized_to_dict(state.desktop_normalized)
         mobile_dict = normalized_to_dict(state.mobile_normalized)
         
-        # Run multi-agent analysis
+        # Run multi-agent analysis with semantic context
         progress(0.1, desc="🚀 Running parallel LLM analysis...")
         
         result = await run_stage2_multi_agent(
@@ -608,6 +653,7 @@ async def run_stage2_analysis(competitors_str: str = "", progress=gr.Progress())
             mobile_tokens=mobile_dict,
             competitors=competitors,
             log_callback=state.log,
+            semantic_analysis=getattr(state, 'semantic_analysis', None),  # Pass semantic context!
         )
         
         progress(0.8, desc="📊 Processing results...")
@@ -677,10 +723,13 @@ async def run_stage2_analysis(competitors_str: str = "", progress=gr.Progress())
                 "letter_spacing": "0",
             }
         
-        # Convert color tokens to dict format for preview
+        # Convert color tokens to dict format for preview (with frequency for sorting)
         color_dict = {}
         for name, c in state.desktop_normalized.colors.items():
-            color_dict[name] = {"value": c.value}
+            color_dict[name] = {
+                "value": c.value,
+                "frequency": c.frequency,
+            }
         
         typography_preview_html = generate_typography_preview_html(
             typography_tokens=typo_dict,
@@ -1845,6 +1894,13 @@ def create_ui():
                         label="Colors Preview"
                     )
                 
+                with gr.Tab("🧠 Semantic Colors"):
+                    gr.Markdown("*Colors categorized by usage: Brand, Text, Background, Border, Feedback*")
+                    stage1_semantic_preview = gr.HTML(
+                        value="<div style='padding: 20px; background: #f5f5f5; border-radius: 8px; color: #666;'>Semantic color analysis will appear after extraction...</div>",
+                        label="Semantic Colors Preview"
+                    )
+                
                 with gr.Tab("📏 Spacing"):
                     gr.Markdown("*All detected spacing values*")
                     stage1_spacing_preview = gr.HTML(
@@ -2083,6 +2139,7 @@ def create_ui():
             inputs=[pages_table],
             outputs=[extraction_status, log_output, desktop_data, mobile_data, 
                      stage1_typography_preview, stage1_colors_preview,
+                     stage1_semantic_preview,
                      stage1_spacing_preview, stage1_radius_preview, stage1_shadows_preview],
         ).then(
             fn=lambda d: (d.get("colors", []), d.get("typography", []), d.get("spacing", [])),