sonance-brand-mcp 1.3.74 → 1.3.76

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

@@ -91,6 +91,39 @@ 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
+ */
+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 });
+    return extracted;
+  }
+  
+  // Find the JSON object in the text (for responses with preamble)
+  const jsonStart = text.indexOf('{');
+  const jsonEnd = text.lastIndexOf('}');
+  if (jsonStart !== -1 && jsonEnd > jsonStart) {
+    const extracted = text.slice(jsonStart, jsonEnd + 1);
+    debugLog("Extracted JSON from preamble text", { 
+      preambleLength: jsonStart,
+      jsonLength: extracted.length 
+    });
+    return extracted;
+  }
+  
+  // Return as-is if no JSON structure found
+  return text;
+}
+
 /**
  * AST-based syntax validation using Babel parser
  * This catches actual syntax errors, not just tag counting
@@ -177,6 +210,48 @@ interface ScreenshotAnalysis {
   visibleText: string[];
   componentNames: string[];
   codePatterns: string[];
+  elementTypes: string[]; // Detected UI element types: table, button, form, card, list, modal, dropdown, input
+}
+
+/**
+ * Map element types to JSX/HTML patterns to search for in files
+ * This is the key to Cursor-style file discovery - search for WHAT we see, not guessed names
+ */
+const ELEMENT_PATTERNS: Record<string, string[]> = {
+  table: ['<Table', 'TableRow', 'TableCell', 'TableHeader', 'TableBody', '<table', '<tr', '<td', '<th'],
+  button: ['<Button', '<button', 'onClick={', 'handleClick'],
+  form: ['<Form', '<form', 'onSubmit', '<Input', '<input', 'handleSubmit'],
+  card: ['<Card', 'CardContent', 'CardHeader', 'CardTitle', 'CardDescription'],
+  list: ['<List', '<ul', '<li', 'ListItem', '.map(('],
+  modal: ['<Modal', '<Dialog', 'DialogContent', 'isOpen', 'onClose', 'onOpenChange'],
+  dropdown: ['<Dropdown', '<Select', 'DropdownMenu', 'SelectContent', 'SelectTrigger'],
+  input: ['<Input', '<input', '<Textarea', '<textarea', 'onChange={'],
+  header: ['<Header', '<header', '<Navbar', '<Nav', 'navigation'],
+  sidebar: ['<Sidebar', '<aside', 'SidebarContent', 'NavigationMenu'],
+};
+
+/**
+ * Score a file based on whether it contains patterns for a specific element type
+ * Higher scores indicate the file is more likely to contain the target element
+ */
+function scoreFileByElementType(content: string, elementType: string): number {
+  const patterns = ELEMENT_PATTERNS[elementType.toLowerCase()] || [];
+  let score = 0;
+  let matchCount = 0;
+  
+  for (const pattern of patterns) {
+    if (content.includes(pattern)) {
+      score += 300; // High score per pattern match
+      matchCount++;
+    }
+  }
+  
+  // Bonus for multiple pattern matches (indicates primary component for this element type)
+  if (matchCount >= 3) {
+    score += 500;
+  }
+  
+  return score;
 }
 
 /**
@@ -216,15 +291,17 @@ Analyze this UI to help find the correct source file. Return:
 1. **visibleText**: Extract the EXACT text visible in UI elements (button labels, headings, tab names, etc.)
 2. **componentNames**: Deduce likely React component names based on what you see (e.g., "ProcessDetailPanel", "UserSettings", "DataTable"). Think about common React naming conventions.
 3. **codePatterns**: Suggest code identifiers that might exist (e.g., "handleEdit", "isLoading", "activeTab", "onDelete")
+4. **elementTypes**: What TYPE of UI element is the user's request about? Pick from: table, button, form, card, list, modal, dropdown, input, header, sidebar. List the most relevant first.
 
 Return ONLY valid JSON:
 {
   "visibleText": ["Assets", "Flowchart", "Edit", "Delete"],
   "componentNames": ["ProcessDetailPanel", "ProcessActions", "QuickActions"],
-  "codePatterns": ["handleEdit", "handleDelete", "activeTab", "setActiveTab"]
+  "codePatterns": ["handleEdit", "handleDelete", "activeTab", "setActiveTab"],
+  "elementTypes": ["table", "button"]
 }
 
-Be smart - use your knowledge of React patterns to make educated guesses about component and variable names.`,
+Be smart - use your knowledge of React patterns to identify what type of element the user wants to modify.`,
           },
         ],
       },
@@ -234,7 +311,7 @@ Be smart - use your knowledge of React patterns to make educated guesses about c
   try {
     const textBlock = response.content.find((block) => block.type === "text");
     if (!textBlock || textBlock.type !== "text") {
-      return { visibleText: [], componentNames: [], codePatterns: [] };
+      return { visibleText: [], componentNames: [], codePatterns: [], elementTypes: [] };
     }
 
     let jsonText = textBlock.text.trim();
@@ -249,13 +326,14 @@ Be smart - use your knowledge of React patterns to make educated guesses about c
       visibleText: parsed.visibleText || parsed.textStrings || [],
       componentNames: parsed.componentNames || [],
       codePatterns: parsed.codePatterns || [],
+      elementTypes: parsed.elementTypes || [],
     };
 
     debugLog("Phase 1: Analyzed screenshot for search", result);
     return result;
   } catch (e) {
     debugLog("Phase 1: Failed to parse screenshot analysis response", { error: String(e) });
-    return { visibleText: [], componentNames: [], codePatterns: [] };
+    return { visibleText: [], componentNames: [], codePatterns: [], elementTypes: [] };
   }
 }
 
@@ -547,12 +625,18 @@ function searchFilesSmart(
   projectRoot: string,
   maxFiles: number = 10
 ): { path: string; content: string; score: number; filenameMatch: boolean }[] {
-  const { visibleText, componentNames, codePatterns } = analysis;
+  const { visibleText, componentNames, codePatterns, elementTypes } = analysis;
   
   // Combine all search terms
   const allSearchTerms = [...visibleText, ...codePatterns];
   
-  if (allSearchTerms.length === 0 && componentNames.length === 0) return [];
+  // Get the primary element type for pattern-based scoring (Cursor-style)
+  const primaryElementType = elementTypes?.[0] || null;
+  if (primaryElementType) {
+    debugLog("Phase 2: Element type detected for pattern matching", { primaryElementType });
+  }
+  
+  if (allSearchTerms.length === 0 && componentNames.length === 0 && !primaryElementType) return [];
 
   const results: Map<string, { path: string; content: string; score: number; filenameMatch: boolean }> = new Map();
   const searchDirs = ["components", "src/components", "app", "src/app", "pages", "src/pages"];
@@ -619,23 +703,47 @@ function searchFilesSmart(
               }
             }
 
+            // Calculate content score based on text matches
+            let contentScore = 0;
             if (uniqueMatches > 0) {
               // Score: unique matches * 10 + total matches
-              const contentScore = (uniqueMatches * 10) + totalMatches;
-              
+              contentScore = (uniqueMatches * 10) + totalMatches;
+            }
+            
+            // CURSOR-STYLE: Add element type pattern scoring
+            // Files containing patterns for the detected element type get a big boost
+            let elementTypeScore = 0;
+            if (primaryElementType) {
+              elementTypeScore = scoreFileByElementType(content, primaryElementType);
+            }
+            
+            const totalScore = contentScore + elementTypeScore;
+            
+            if (totalScore > 0) {
               // Check if we already have this file (from component name search)
               const existing = results.get(entryPath);
               if (existing) {
-                // Add content score to existing filename match score
-                existing.score += contentScore;
+                // Add scores to existing entry
+                existing.score += totalScore;
               } else {
                 results.set(entryPath, { 
                   path: entryPath, 
                   content, 
-                  score: contentScore,
+                  score: totalScore,
                   filenameMatch: false 
                 });
               }
+              
+              // Log high-confidence element type matches
+              if (elementTypeScore >= 800) {
+                debugLog("Phase 2: High-confidence element type match", {
+                  file: entryPath,
+                  elementType: primaryElementType,
+                  elementScore: elementTypeScore,
+                  contentScore,
+                  totalScore
+                });
+              }
             }
           } catch {
             // Skip files that can't be read
@@ -673,7 +781,10 @@ function searchFilesSmart(
 
 const VISION_SYSTEM_PROMPT = `You are an expert frontend developer. Edit the code to fulfill the user's request.
 
-Output ONLY this JSON (no other text):
+CRITICAL: Return ONLY the JSON object. No explanations, no preamble, no markdown code fences.
+Start your response with { and end with }
+
+Output format:
 {"modifications":[{"filePath":"path","patches":[{"search":"exact original code","replace":"modified code"}]}]}
 
 The "search" field must match the file EXACTLY (copy-paste from the code provided).`;
@@ -958,7 +1069,7 @@ User Request: "${userPrompt}"
         
         // Search for element IDs in the file to enable precise targeting
         let idMatch: { lineNumber: number; matchedId: string; snippet: string } | null = null;
-        if (focusedElements && focusedElements.length > 0) {
+      if (focusedElements && focusedElements.length > 0) {
           for (const el of focusedElements) {
             idMatch = findElementIdInFile(content, el.elementId, el.childIds);
             if (idMatch) break;
@@ -1049,7 +1160,7 @@ ${linesWithNumbers}
           // Only include the variants/props section, not the whole file
           const variantsMatch = comp.content.match(/variants:\s*\{[\s\S]*?\n\s*\},\n\s*defaultVariants/);
           if (variantsMatch) {
-            textContent += `
+          textContent += `
 --- UI Component: ${comp.path} (variants only) ---
 ${variantsMatch[0]}
 ---
@@ -1123,7 +1234,7 @@ CRITICAL: Your "search" string MUST exist in the file. If you can't find the exa
 
       // Call Claude Vision API with retry mechanism
       const anthropic = new Anthropic({ apiKey });
-      
+
       // Build set of valid file paths from page context (needed for validation)
       const validFilePaths = new Set<string>();
       if (pageContext.pageFile) {
@@ -1220,62 +1331,8 @@ This is better than generating patches with made-up code.`,
       };
 
       try {
-        let jsonText = textResponse.text.trim();
-
-        // Try to extract JSON from markdown code blocks
-        const jsonMatch = jsonText.match(/```json\n([\s\S]*?)\n```/) ||
-                         jsonText.match(/```\n([\s\S]*?)\n```/);
-
-        if (jsonMatch) {
-          jsonText = jsonMatch[1];
-        } else if (jsonText.includes("```json")) {
-          const start = jsonText.indexOf("```json") + 7;
-          const end = jsonText.lastIndexOf("```");
-          if (end > start) {
-            jsonText = jsonText.substring(start, end);
-          }
-        }
-
-        jsonText = jsonText.trim();
-        
-        // Robust JSON extraction: look for {"modifications" pattern specifically
-        // This handles cases where the LLM includes preamble text with code blocks
-        const jsonStartPatterns = ['{"modifications"', '{ "modifications"', '{\n  "modifications"'];
-        let jsonStart = -1;
-        
-        for (const pattern of jsonStartPatterns) {
-          const idx = jsonText.indexOf(pattern);
-          if (idx !== -1 && (jsonStart === -1 || idx < jsonStart)) {
-            jsonStart = idx;
-          }
-        }
-        
-        if (jsonStart !== -1) {
-          // Find the matching closing brace by counting braces
-          let braceCount = 0;
-          let jsonEnd = -1;
-          for (let i = jsonStart; i < jsonText.length; i++) {
-            if (jsonText[i] === '{') braceCount++;
-            if (jsonText[i] === '}') {
-              braceCount--;
-              if (braceCount === 0) {
-                jsonEnd = i;
-                break;
-              }
-            }
-          }
-          if (jsonEnd !== -1) {
-            jsonText = jsonText.substring(jsonStart, jsonEnd + 1);
-          }
-        } else {
-          // Fallback: try first { to last }
-        const firstBrace = jsonText.indexOf('{');
-        const lastBrace = jsonText.lastIndexOf('}');
-        if (firstBrace !== -1 && lastBrace > firstBrace) {
-          jsonText = jsonText.substring(firstBrace, lastBrace + 1);
-          }
-        }
-        
+        // Use robust JSON extraction that handles preamble text, code fences, etc.
+        const jsonText = extractJsonFromResponse(textResponse.text);
         aiResponse = JSON.parse(jsonText);
       } catch {
         console.error("Failed to parse AI response:", textResponse.text);

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

@@ -87,6 +87,39 @@ 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
+ */
+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 });
+    return extracted;
+  }
+  
+  // Find the JSON object in the text (for responses with preamble)
+  const jsonStart = text.indexOf('{');
+  const jsonEnd = text.lastIndexOf('}');
+  if (jsonStart !== -1 && jsonEnd > jsonStart) {
+    const extracted = text.slice(jsonStart, jsonEnd + 1);
+    debugLog("Extracted JSON from preamble text", { 
+      preambleLength: jsonStart,
+      jsonLength: extracted.length 
+    });
+    return extracted;
+  }
+  
+  // Return as-is if no JSON structure found
+  return text;
+}
+
 /**
  * AST-based syntax validation using Babel parser
  * This catches actual syntax errors, not just tag counting
@@ -173,6 +206,48 @@ interface ScreenshotAnalysis {
   visibleText: string[];
   componentNames: string[];
   codePatterns: string[];
+  elementTypes: string[]; // Detected UI element types: table, button, form, card, list, modal, dropdown, input
+}
+
+/**
+ * Map element types to JSX/HTML patterns to search for in files
+ * This is the key to Cursor-style file discovery - search for WHAT we see, not guessed names
+ */
+const ELEMENT_PATTERNS: Record<string, string[]> = {
+  table: ['<Table', 'TableRow', 'TableCell', 'TableHeader', 'TableBody', '<table', '<tr', '<td', '<th'],
+  button: ['<Button', '<button', 'onClick={', 'handleClick'],
+  form: ['<Form', '<form', 'onSubmit', '<Input', '<input', 'handleSubmit'],
+  card: ['<Card', 'CardContent', 'CardHeader', 'CardTitle', 'CardDescription'],
+  list: ['<List', '<ul', '<li', 'ListItem', '.map(('],
+  modal: ['<Modal', '<Dialog', 'DialogContent', 'isOpen', 'onClose', 'onOpenChange'],
+  dropdown: ['<Dropdown', '<Select', 'DropdownMenu', 'SelectContent', 'SelectTrigger'],
+  input: ['<Input', '<input', '<Textarea', '<textarea', 'onChange={'],
+  header: ['<Header', '<header', '<Navbar', '<Nav', 'navigation'],
+  sidebar: ['<Sidebar', '<aside', 'SidebarContent', 'NavigationMenu'],
+};
+
+/**
+ * Score a file based on whether it contains patterns for a specific element type
+ * Higher scores indicate the file is more likely to contain the target element
+ */
+function scoreFileByElementType(content: string, elementType: string): number {
+  const patterns = ELEMENT_PATTERNS[elementType.toLowerCase()] || [];
+  let score = 0;
+  let matchCount = 0;
+  
+  for (const pattern of patterns) {
+    if (content.includes(pattern)) {
+      score += 300; // High score per pattern match
+      matchCount++;
+    }
+  }
+  
+  // Bonus for multiple pattern matches (indicates primary component for this element type)
+  if (matchCount >= 3) {
+    score += 500;
+  }
+  
+  return score;
 }
 
 /**
@@ -212,15 +287,17 @@ Analyze this UI to help find the correct source file. Return:
 1. **visibleText**: Extract the EXACT text visible in UI elements (button labels, headings, tab names, etc.)
 2. **componentNames**: Deduce likely React component names based on what you see (e.g., "ProcessDetailPanel", "UserSettings", "DataTable"). Think about common React naming conventions.
 3. **codePatterns**: Suggest code identifiers that might exist (e.g., "handleEdit", "isLoading", "activeTab", "onDelete")
+4. **elementTypes**: What TYPE of UI element is the user's request about? Pick from: table, button, form, card, list, modal, dropdown, input, header, sidebar. List the most relevant first.
 
 Return ONLY valid JSON:
 {
   "visibleText": ["Assets", "Flowchart", "Edit", "Delete"],
   "componentNames": ["ProcessDetailPanel", "ProcessActions", "QuickActions"],
-  "codePatterns": ["handleEdit", "handleDelete", "activeTab", "setActiveTab"]
+  "codePatterns": ["handleEdit", "handleDelete", "activeTab", "setActiveTab"],
+  "elementTypes": ["table", "button"]
 }
 
-Be smart - use your knowledge of React patterns to make educated guesses about component and variable names.`,
+Be smart - use your knowledge of React patterns to identify what type of element the user wants to modify.`,
           },
         ],
       },
@@ -230,7 +307,7 @@ Be smart - use your knowledge of React patterns to make educated guesses about c
   try {
     const textBlock = response.content.find((block) => block.type === "text");
     if (!textBlock || textBlock.type !== "text") {
-      return { visibleText: [], componentNames: [], codePatterns: [] };
+      return { visibleText: [], componentNames: [], codePatterns: [], elementTypes: [] };
     }
 
     let jsonText = textBlock.text.trim();
@@ -245,13 +322,14 @@ Be smart - use your knowledge of React patterns to make educated guesses about c
       visibleText: parsed.visibleText || parsed.textStrings || [],
       componentNames: parsed.componentNames || [],
       codePatterns: parsed.codePatterns || [],
+      elementTypes: parsed.elementTypes || [],
     };
 
     debugLog("Phase 1: Analyzed screenshot for search", result);
     return result;
   } catch (e) {
     debugLog("Phase 1: Failed to parse screenshot analysis response", { error: String(e) });
-    return { visibleText: [], componentNames: [], codePatterns: [] };
+    return { visibleText: [], componentNames: [], codePatterns: [], elementTypes: [] };
   }
 }
 
@@ -543,12 +621,18 @@ function searchFilesSmart(
   projectRoot: string,
   maxFiles: number = 10
 ): { path: string; content: string; score: number; filenameMatch: boolean }[] {
-  const { visibleText, componentNames, codePatterns } = analysis;
+  const { visibleText, componentNames, codePatterns, elementTypes } = analysis;
   
   // Combine all search terms
   const allSearchTerms = [...visibleText, ...codePatterns];
   
-  if (allSearchTerms.length === 0 && componentNames.length === 0) return [];
+  // Get the primary element type for pattern-based scoring (Cursor-style)
+  const primaryElementType = elementTypes?.[0] || null;
+  if (primaryElementType) {
+    debugLog("Phase 2: Element type detected for pattern matching", { primaryElementType });
+  }
+  
+  if (allSearchTerms.length === 0 && componentNames.length === 0 && !primaryElementType) return [];
 
   const results: Map<string, { path: string; content: string; score: number; filenameMatch: boolean }> = new Map();
   const searchDirs = ["components", "src/components", "app", "src/app", "pages", "src/pages"];
@@ -615,23 +699,47 @@ function searchFilesSmart(
               }
             }
 
+            // Calculate content score based on text matches
+            let contentScore = 0;
             if (uniqueMatches > 0) {
               // Score: unique matches * 10 + total matches
-              const contentScore = (uniqueMatches * 10) + totalMatches;
-              
+              contentScore = (uniqueMatches * 10) + totalMatches;
+            }
+            
+            // CURSOR-STYLE: Add element type pattern scoring
+            // Files containing patterns for the detected element type get a big boost
+            let elementTypeScore = 0;
+            if (primaryElementType) {
+              elementTypeScore = scoreFileByElementType(content, primaryElementType);
+            }
+            
+            const totalScore = contentScore + elementTypeScore;
+            
+            if (totalScore > 0) {
               // Check if we already have this file (from component name search)
               const existing = results.get(entryPath);
               if (existing) {
-                // Add content score to existing filename match score
-                existing.score += contentScore;
+                // Add scores to existing entry
+                existing.score += totalScore;
               } else {
                 results.set(entryPath, { 
                   path: entryPath, 
                   content, 
-                  score: contentScore,
+                  score: totalScore,
                   filenameMatch: false 
                 });
               }
+              
+              // Log high-confidence element type matches
+              if (elementTypeScore >= 800) {
+                debugLog("Phase 2: High-confidence element type match", {
+                  file: entryPath,
+                  elementType: primaryElementType,
+                  elementScore: elementTypeScore,
+                  contentScore,
+                  totalScore
+                });
+              }
             }
           } catch {
             // Skip files that can't be read
@@ -669,7 +777,10 @@ function searchFilesSmart(
 
 const VISION_SYSTEM_PROMPT = `You are an expert frontend developer. Edit the code to fulfill the user's request.
 
-Output ONLY this JSON (no other text):
+CRITICAL: Return ONLY the JSON object. No explanations, no preamble, no markdown code fences.
+Start your response with { and end with }
+
+Output format:
 {"modifications":[{"filePath":"path","patches":[{"search":"exact original code","replace":"modified code"}]}]}
 
 The "search" field must match the file EXACTLY (copy-paste from the code provided).`;
@@ -927,7 +1038,7 @@ User Request: "${userPrompt}"
         
         // Search for element IDs in the file to enable precise targeting
         let idMatch: { lineNumber: number; matchedId: string; snippet: string } | null = null;
-        if (focusedElements && focusedElements.length > 0) {
+      if (focusedElements && focusedElements.length > 0) {
           for (const el of focusedElements) {
             idMatch = findElementIdInFile(content, el.elementId, el.childIds);
             if (idMatch) break;
@@ -1018,7 +1129,7 @@ ${linesWithNumbers}
           // Only include the variants/props section, not the whole file
           const variantsMatch = comp.content.match(/variants:\s*\{[\s\S]*?\n\s*\},\n\s*defaultVariants/);
           if (variantsMatch) {
-            textContent += `
+          textContent += `
 --- UI Component: ${comp.path} (variants only) ---
 ${variantsMatch[0]}
 ---
@@ -1092,7 +1203,7 @@ CRITICAL: Your "search" string MUST exist in the file. If you can't find the exa
 
       // Call Claude Vision API with retry mechanism
       const anthropic = new Anthropic({ apiKey });
-      
+
       // Build list of known file paths (for logging)
       const knownPaths = new Set<string>();
       if (pageContext.pageFile) {
@@ -1185,64 +1296,8 @@ This is better than generating patches with made-up code.`,
       };
 
       try {
-        let jsonText = textResponse.text.trim();
-        
-        // Try to extract JSON from markdown code blocks
-        const jsonMatch = jsonText.match(/```json\n([\s\S]*?)\n```/) || 
-                         jsonText.match(/```\n([\s\S]*?)\n```/);
-        
-        if (jsonMatch) {
-          jsonText = jsonMatch[1];
-        } else if (jsonText.includes("```json")) {
-            // Fallback for cases where regex might miss due to newlines
-            const start = jsonText.indexOf("```json") + 7;
-            const end = jsonText.lastIndexOf("```");
-            if (end > start) {
-                jsonText = jsonText.substring(start, end);
-            }
-        }
-
-        // Clean up any remaining whitespace
-        jsonText = jsonText.trim();
-        
-        // Robust JSON extraction: look for {"modifications" pattern specifically
-        // This handles cases where the LLM includes preamble text with code blocks
-        const jsonStartPatterns = ['{"modifications"', '{ "modifications"', '{\n  "modifications"'];
-        let jsonStart = -1;
-        
-        for (const pattern of jsonStartPatterns) {
-          const idx = jsonText.indexOf(pattern);
-          if (idx !== -1 && (jsonStart === -1 || idx < jsonStart)) {
-            jsonStart = idx;
-          }
-        }
-        
-        if (jsonStart !== -1) {
-          // Find the matching closing brace by counting braces
-          let braceCount = 0;
-          let jsonEnd = -1;
-          for (let i = jsonStart; i < jsonText.length; i++) {
-            if (jsonText[i] === '{') braceCount++;
-            if (jsonText[i] === '}') {
-              braceCount--;
-              if (braceCount === 0) {
-                jsonEnd = i;
-                break;
-              }
-            }
-          }
-          if (jsonEnd !== -1) {
-            jsonText = jsonText.substring(jsonStart, jsonEnd + 1);
-          }
-        } else {
-          // Fallback: try first { to last }
-        const firstBrace = jsonText.indexOf('{');
-        const lastBrace = jsonText.lastIndexOf('}');
-        if (firstBrace !== -1 && lastBrace > firstBrace) {
-          jsonText = jsonText.substring(firstBrace, lastBrace + 1);
-          }
-        }
-        
+        // Use robust JSON extraction that handles preamble text, code fences, etc.
+        const jsonText = extractJsonFromResponse(textResponse.text);
         aiResponse = JSON.parse(jsonText);
       } catch {
         console.error("Failed to parse AI response:", textResponse.text);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sonance-brand-mcp",
-  "version": "1.3.74",
+  "version": "1.3.76",
   "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",