sonance-brand-mcp 1.3.86 → 1.3.88

package/dist/assets/api/sonance-vision-apply/route.ts

@@ -94,22 +94,36 @@ function debugLog(message: string, data?: unknown) {
 /**
  * Extract JSON from LLM response that may contain preamble text
  * Handles: pure JSON, markdown code fences, and text with embedded JSON
+ * 
+ * PRIORITY ORDER:
+ * 1. Direct JSON (starts with {)
+ * 2. Explicit ```json fence (most reliable)
+ * 3. Raw JSON object in text (handles prose + JSON responses)
+ * 4. Generic code fence (last resort, may match tsx/js fences incorrectly)
  */
 function extractJsonFromResponse(text: string): string {
   // Try direct parse first - if it starts with {, it's likely pure JSON
   const trimmed = text.trim();
   if (trimmed.startsWith('{')) return trimmed;
   
-  // Extract from markdown code fence (```json ... ``` or ``` ... ```)
-  const fenceMatch = text.match(/```(?:json)?\s*([\s\S]*?)```/);
-  if (fenceMatch) {
-    const extracted = fenceMatch[1].trim();
-    debugLog("Extracted JSON from markdown fence", { previewLength: extracted.length });
+  // PRIORITY 1: Look specifically for ```json fence (most reliable)
+  const jsonFenceMatch = text.match(/```json\s*([\s\S]*?)```/);
+  if (jsonFenceMatch) {
+    const extracted = jsonFenceMatch[1].trim();
+    debugLog("Extracted JSON from explicit json fence", { previewLength: extracted.length });
     return extracted;
   }
   
-  // Find the JSON object in the text (for responses with preamble)
-  const jsonStart = text.indexOf('{');
+  // PRIORITY 2: Find raw JSON object in text (handles prose + JSON at end)
+  // Look for {"modifications" pattern which is our expected response format
+  const modMatch = text.match(/(\{"modifications"\s*:\s*\[[\s\S]*\](?:\s*,\s*"explanation"\s*:\s*"[^"]*")?\s*\})/);
+  if (modMatch) {
+    debugLog("Extracted JSON via modifications pattern", { length: modMatch[1].length });
+    return modMatch[1];
+  }
+  
+  // PRIORITY 3: Find any JSON object starting with {"
+  const jsonStart = text.indexOf('{"');
   const jsonEnd = text.lastIndexOf('}');
   if (jsonStart !== -1 && jsonEnd > jsonStart) {
     const extracted = text.slice(jsonStart, jsonEnd + 1);
@@ -120,6 +134,18 @@ function extractJsonFromResponse(text: string): string {
     return extracted;
   }
   
+  // PRIORITY 4 (last resort): Try generic code fence
+  // This may incorrectly match tsx/js fences, so it's lowest priority
+  const fenceMatch = text.match(/```\s*([\s\S]*?)```/);
+  if (fenceMatch) {
+    const extracted = fenceMatch[1].trim();
+    // Only use if it looks like JSON
+    if (extracted.startsWith('{')) {
+      debugLog("Extracted JSON from generic fence", { previewLength: extracted.length });
+      return extracted;
+    }
+  }
+  
   // Return as-is if no JSON structure found
   return text;
 }
@@ -955,6 +981,49 @@ export async function POST(request: Request) {
           const phase2aConfirmed = phase2aMatches.length > 0 && 
             focusedElementHints.some(h => phase2aMatches.includes(h.path) && h.score > 0);
 
+          // Helper: Find best Phase 2a match based on user prompt keywords
+          // e.g., "duplicate button" should prefer ProcessRow.tsx over ProcessCatalogueView.tsx
+          const findBestPhase2aMatch = (): string | null => {
+            if (phase2aMatches.length === 0) return null;
+            if (phase2aMatches.length === 1) return phase2aMatches[0];
+            
+            // Extract keywords from user prompt
+            const promptLower = userPrompt.toLowerCase();
+            const keywords = ['row', 'cell', 'item', 'button', 'action', 'duplicate', 'edit', 'delete'];
+            
+            // Prefer more specific files (Row > View, Cell > Table, etc.)
+            const specificity = ['row', 'cell', 'item', 'card', 'modal', 'panel', 'detail'];
+            
+            // Score each Phase 2a match
+            let bestMatch = phase2aMatches[0];
+            let bestScore = 0;
+            
+            for (const match of phase2aMatches) {
+              const matchLower = match.toLowerCase();
+              let score = 0;
+              
+              // Bonus for specificity (Row/Cell/Item components)
+              for (const spec of specificity) {
+                if (matchLower.includes(spec)) score += 10;
+              }
+              
+              // Bonus for keyword match (prompt mentions button → prefer file with button/action)
+              for (const kw of keywords) {
+                if (promptLower.includes(kw) && matchLower.includes(kw)) score += 20;
+              }
+              
+              // Penalty for generic view/container files
+              if (matchLower.includes('view.tsx') && !matchLower.includes('detail')) score -= 5;
+              
+              if (score > bestScore) {
+                bestScore = score;
+                bestMatch = match;
+              }
+            }
+            
+            return bestMatch;
+          };
+
           if (phase2aConfirmed) {
             // PRIORITY 1: Phase 2a match confirmed by element search - highest confidence
             const confirmedPath = phase2aMatches.find(p => 
@@ -972,6 +1041,18 @@ export async function POST(request: Request) {
               reason: `Focused element match (score: ${focusedTopScore}, exceeds threshold)`
             };
             debugLog("PRIORITY 2: Strong focused element match", recommendedFile);
+          } else if (phase2aMatches.length > 0) {
+            // PRIORITY 2.5: Phase 2a match WITHOUT focused element - still strong signal
+            // Use prompt-aware selection to pick the best match
+            const bestMatch = findBestPhase2aMatch()!;
+            recommendedFile = {
+              path: bestMatch,
+              reason: `Phase 2a component-name match (prompt-aware selection from ${phase2aMatches.length} candidates)`
+            };
+            debugLog("PRIORITY 2.5: Phase 2a match (no focused element)", { 
+              selectedPath: bestMatch,
+              allCandidates: phase2aMatches 
+            });
           } else if (smartSearchTopPath) {
             // PRIORITY 3: Smart search top result - trusted baseline
             recommendedFile = {

package/dist/assets/api/sonance-vision-edit/route.ts

@@ -90,22 +90,36 @@ function debugLog(message: string, data?: unknown) {
 /**
  * Extract JSON from LLM response that may contain preamble text
  * Handles: pure JSON, markdown code fences, and text with embedded JSON
+ * 
+ * PRIORITY ORDER:
+ * 1. Direct JSON (starts with {)
+ * 2. Explicit ```json fence (most reliable)
+ * 3. Raw JSON object in text (handles prose + JSON responses)
+ * 4. Generic code fence (last resort, may match tsx/js fences incorrectly)
  */
 function extractJsonFromResponse(text: string): string {
   // Try direct parse first - if it starts with {, it's likely pure JSON
   const trimmed = text.trim();
   if (trimmed.startsWith('{')) return trimmed;
   
-  // Extract from markdown code fence (```json ... ``` or ``` ... ```)
-  const fenceMatch = text.match(/```(?:json)?\s*([\s\S]*?)```/);
-  if (fenceMatch) {
-    const extracted = fenceMatch[1].trim();
-    debugLog("Extracted JSON from markdown fence", { previewLength: extracted.length });
+  // PRIORITY 1: Look specifically for ```json fence (most reliable)
+  const jsonFenceMatch = text.match(/```json\s*([\s\S]*?)```/);
+  if (jsonFenceMatch) {
+    const extracted = jsonFenceMatch[1].trim();
+    debugLog("Extracted JSON from explicit json fence", { previewLength: extracted.length });
     return extracted;
   }
   
-  // Find the JSON object in the text (for responses with preamble)
-  const jsonStart = text.indexOf('{');
+  // PRIORITY 2: Find raw JSON object in text (handles prose + JSON at end)
+  // Look for {"modifications" pattern which is our expected response format
+  const modMatch = text.match(/(\{"modifications"\s*:\s*\[[\s\S]*\](?:\s*,\s*"explanation"\s*:\s*"[^"]*")?\s*\})/);
+  if (modMatch) {
+    debugLog("Extracted JSON via modifications pattern", { length: modMatch[1].length });
+    return modMatch[1];
+  }
+  
+  // PRIORITY 3: Find any JSON object starting with {"
+  const jsonStart = text.indexOf('{"');
   const jsonEnd = text.lastIndexOf('}');
   if (jsonStart !== -1 && jsonEnd > jsonStart) {
     const extracted = text.slice(jsonStart, jsonEnd + 1);
@@ -116,6 +130,18 @@ function extractJsonFromResponse(text: string): string {
     return extracted;
   }
   
+  // PRIORITY 4 (last resort): Try generic code fence
+  // This may incorrectly match tsx/js fences, so it's lowest priority
+  const fenceMatch = text.match(/```\s*([\s\S]*?)```/);
+  if (fenceMatch) {
+    const extracted = fenceMatch[1].trim();
+    // Only use if it looks like JSON
+    if (extracted.startsWith('{')) {
+      debugLog("Extracted JSON from generic fence", { previewLength: extracted.length });
+      return extracted;
+    }
+  }
+  
   // Return as-is if no JSON structure found
   return text;
 }
@@ -924,6 +950,49 @@ export async function POST(request: Request) {
           const phase2aConfirmed = phase2aMatches.length > 0 && 
             focusedElementHints.some(h => phase2aMatches.includes(h.path) && h.score > 0);
 
+          // Helper: Find best Phase 2a match based on user prompt keywords
+          // e.g., "duplicate button" should prefer ProcessRow.tsx over ProcessCatalogueView.tsx
+          const findBestPhase2aMatch = (): string | null => {
+            if (phase2aMatches.length === 0) return null;
+            if (phase2aMatches.length === 1) return phase2aMatches[0];
+            
+            // Extract keywords from user prompt
+            const promptLower = userPrompt.toLowerCase();
+            const keywords = ['row', 'cell', 'item', 'button', 'action', 'duplicate', 'edit', 'delete'];
+            
+            // Prefer more specific files (Row > View, Cell > Table, etc.)
+            const specificity = ['row', 'cell', 'item', 'card', 'modal', 'panel', 'detail'];
+            
+            // Score each Phase 2a match
+            let bestMatch = phase2aMatches[0];
+            let bestScore = 0;
+            
+            for (const match of phase2aMatches) {
+              const matchLower = match.toLowerCase();
+              let score = 0;
+              
+              // Bonus for specificity (Row/Cell/Item components)
+              for (const spec of specificity) {
+                if (matchLower.includes(spec)) score += 10;
+              }
+              
+              // Bonus for keyword match (prompt mentions button → prefer file with button/action)
+              for (const kw of keywords) {
+                if (promptLower.includes(kw) && matchLower.includes(kw)) score += 20;
+              }
+              
+              // Penalty for generic view/container files
+              if (matchLower.includes('view.tsx') && !matchLower.includes('detail')) score -= 5;
+              
+              if (score > bestScore) {
+                bestScore = score;
+                bestMatch = match;
+              }
+            }
+            
+            return bestMatch;
+          };
+
           if (phase2aConfirmed) {
             // PRIORITY 1: Phase 2a match confirmed by element search - highest confidence
             const confirmedPath = phase2aMatches.find(p => 
@@ -941,6 +1010,18 @@ export async function POST(request: Request) {
               reason: `Focused element match (score: ${focusedTopScore}, exceeds threshold)`
             };
             debugLog("PRIORITY 2: Strong focused element match", recommendedFile);
+          } else if (phase2aMatches.length > 0) {
+            // PRIORITY 2.5: Phase 2a match WITHOUT focused element - still strong signal
+            // Use prompt-aware selection to pick the best match
+            const bestMatch = findBestPhase2aMatch()!;
+            recommendedFile = {
+              path: bestMatch,
+              reason: `Phase 2a component-name match (prompt-aware selection from ${phase2aMatches.length} candidates)`
+            };
+            debugLog("PRIORITY 2.5: Phase 2a match (no focused element)", { 
+              selectedPath: bestMatch,
+              allCandidates: phase2aMatches 
+            });
           } else if (smartSearchTopPath) {
             // PRIORITY 3: Smart search top result - trusted baseline
             recommendedFile = {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sonance-brand-mcp",
-  "version": "1.3.86",
+  "version": "1.3.88",
   "description": "MCP Server for Sonance Brand Guidelines and Component Library - gives Claude instant access to brand colors, typography, and UI components.",
   "main": "dist/index.js",
   "type": "module",