@retrivora-ai/rag-engine 1.4.6 → 1.4.8

package/dist/{chunk-C4KDS26Q.mjs → chunk-YCL23GST.mjs}

@@ -2261,25 +2261,18 @@ var Pipeline = class {
     if (this.initialised) return;
     const chartInstruction = `
 
-When presenting structured data, statistics, or comparisons, decide if it is best presented as a table or a chart.
-- For tables: use standard Markdown tables.
-- For charts (bar, line, pie): You MUST output a fenced code block with the language 'chart'.
-- CRITICAL RULES:
-  1. Use ONLY valid JSON (double quotes, no trailing commas).
-  2. NO math expressions (e.g., use 100, NOT 50+50).
-  3. dataKeys MUST exactly match the property names in the data objects.
-  4. data objects MUST be FLAT (no nested objects or arrays).
-  5. DO NOT output naked JSON or markdown tables for visualizations.
-  6. ALWAYS wrap your visualization data in a \`\`\`chart ... \`\`\` code block.
-\`\`\`chart
-{
-  "type": "bar" | "line" | "pie",
-  "xAxisKey": "name",
-  "dataKeys": ["value"],
-  "data": [{"name": "A", "value": 10}]
-}
-\`\`\``;
-    if (!this.config.llm.systemPrompt || !this.config.llm.systemPrompt.includes("```chart")) {
+### VISUALIZATION PROTOCOL:
+When requested to show data visually (charts, graphs, or comparisons), you MUST use this format:
+1. Wrap the data in a fenced code block with the language 'chart'.
+2. Use ONLY valid JSON matching this schema:
+   {
+     "type": "bar" | "line" | "pie",
+     "xAxisKey": "property_for_label",
+     "dataKeys": ["property_for_value"],
+     "data": [{ "property_for_label": "A", "property_for_value": 10 }]
+   }
+3. RULES: Data objects MUST be FLAT (no nesting). No math expressions in JSON. NEVER draw charts with text or markdown tables.`;
+    if (!this.config.llm.systemPrompt || !this.config.llm.systemPrompt.includes("chart")) {
       this.config.llm.systemPrompt = (this.config.llm.systemPrompt || "") + chartInstruction;
     }
     console.log(`[Pipeline] Initializing with provider: ${this.config.vectorDb.provider}...`);

package/dist/handlers/index.js

@@ -3824,25 +3824,18 @@ var Pipeline = class {
     if (this.initialised) return;
     const chartInstruction = `
 
-When presenting structured data, statistics, or comparisons, decide if it is best presented as a table or a chart.
-- For tables: use standard Markdown tables.
-- For charts (bar, line, pie): You MUST output a fenced code block with the language 'chart'.
-- CRITICAL RULES:
-  1. Use ONLY valid JSON (double quotes, no trailing commas).
-  2. NO math expressions (e.g., use 100, NOT 50+50).
-  3. dataKeys MUST exactly match the property names in the data objects.
-  4. data objects MUST be FLAT (no nested objects or arrays).
-  5. DO NOT output naked JSON or markdown tables for visualizations.
-  6. ALWAYS wrap your visualization data in a \`\`\`chart ... \`\`\` code block.
-\`\`\`chart
-{
-  "type": "bar" | "line" | "pie",
-  "xAxisKey": "name",
-  "dataKeys": ["value"],
-  "data": [{"name": "A", "value": 10}]
-}
-\`\`\``;
-    if (!this.config.llm.systemPrompt || !this.config.llm.systemPrompt.includes("```chart")) {
+### VISUALIZATION PROTOCOL:
+When requested to show data visually (charts, graphs, or comparisons), you MUST use this format:
+1. Wrap the data in a fenced code block with the language 'chart'.
+2. Use ONLY valid JSON matching this schema:
+   {
+     "type": "bar" | "line" | "pie",
+     "xAxisKey": "property_for_label",
+     "dataKeys": ["property_for_value"],
+     "data": [{ "property_for_label": "A", "property_for_value": 10 }]
+   }
+3. RULES: Data objects MUST be FLAT (no nesting). No math expressions in JSON. NEVER draw charts with text or markdown tables.`;
+    if (!this.config.llm.systemPrompt || !this.config.llm.systemPrompt.includes("chart")) {
       this.config.llm.systemPrompt = (this.config.llm.systemPrompt || "") + chartInstruction;
     }
     console.log(`[Pipeline] Initializing with provider: ${this.config.vectorDb.provider}...`);

package/dist/handlers/index.mjs

@@ -9,7 +9,7 @@ import {
   sseFrame,
   sseMetaFrame,
   sseTextFrame
-} from "../chunk-C4KDS26Q.mjs";
+} from "../chunk-YCL23GST.mjs";
 import "../chunk-YLTMFW4M.mjs";
 import "../chunk-X4TOT24V.mjs";
 export {

package/dist/index.js

@@ -235,13 +235,21 @@ function DynamicChart({ config, primaryColor = "#6366f1", accentColor = "#8b5cf6
               Object.keys(subItem).forEach((sk) => {
                 const subVal = subItem[sk];
                 if (typeof subVal !== "object" || subVal === null) {
-                  newItem[sk] = subVal;
+                  if (typeof subVal === "string" && !isNaN(Number(subVal)) && subVal.trim() !== "") {
+                    newItem[sk] = Number(subVal);
+                  } else {
+                    newItem[sk] = subVal;
+                  }
                 }
               });
             }
           });
         } else if (typeof val !== "object" || val === null) {
-          newItem[k] = val;
+          if (typeof val === "string" && !isNaN(Number(val)) && val.trim() !== "") {
+            newItem[k] = Number(val);
+          } else {
+            newItem[k] = val;
+          }
         }
       });
       return newItem;
@@ -250,7 +258,7 @@ function DynamicChart({ config, primaryColor = "#6366f1", accentColor = "#8b5cf6
   if (!data || data.length === 0) {
     return /* @__PURE__ */ import_react4.default.createElement("div", { className: "p-4 text-sm text-slate-500" }, "No data available for chart.");
   }
-  const firstItem = data[0];
+  const firstItem = sanitizedData[0];
   const allKeys = Object.keys(firstItem);
   const resolvedXKey = config.xAxisKey && firstItem[config.xAxisKey] !== void 0 ? config.xAxisKey : allKeys.find((k) => k.toLowerCase() === "name" || k.toLowerCase() === "label" || k.toLowerCase() === "category") || allKeys.find((k) => typeof firstItem[k] === "string") || allKeys[0];
   const resolvedDataKeys = config.dataKeys && config.dataKeys.every((k) => {
@@ -497,6 +505,9 @@ function MessageBubble({
   }, [sources, isUser]);
   const { productsFromContent, cleanContent } = import_react5.default.useMemo(() => {
     if (isUser) return { productsFromContent: [], cleanContent: message.content };
+    if (message.content.includes("```chart")) {
+      return { productsFromContent: [], cleanContent: message.content };
+    }
     const jsonRegex = /```json\s*([\s\S]*?)\s*```/g;
     const products = [];
     let content = message.content;

package/dist/index.mjs

@@ -198,13 +198,21 @@ function DynamicChart({ config, primaryColor = "#6366f1", accentColor = "#8b5cf6
               Object.keys(subItem).forEach((sk) => {
                 const subVal = subItem[sk];
                 if (typeof subVal !== "object" || subVal === null) {
-                  newItem[sk] = subVal;
+                  if (typeof subVal === "string" && !isNaN(Number(subVal)) && subVal.trim() !== "") {
+                    newItem[sk] = Number(subVal);
+                  } else {
+                    newItem[sk] = subVal;
+                  }
                 }
               });
             }
           });
         } else if (typeof val !== "object" || val === null) {
-          newItem[k] = val;
+          if (typeof val === "string" && !isNaN(Number(val)) && val.trim() !== "") {
+            newItem[k] = Number(val);
+          } else {
+            newItem[k] = val;
+          }
         }
       });
       return newItem;
@@ -213,7 +221,7 @@ function DynamicChart({ config, primaryColor = "#6366f1", accentColor = "#8b5cf6
   if (!data || data.length === 0) {
     return /* @__PURE__ */ React4.createElement("div", { className: "p-4 text-sm text-slate-500" }, "No data available for chart.");
   }
-  const firstItem = data[0];
+  const firstItem = sanitizedData[0];
   const allKeys = Object.keys(firstItem);
   const resolvedXKey = config.xAxisKey && firstItem[config.xAxisKey] !== void 0 ? config.xAxisKey : allKeys.find((k) => k.toLowerCase() === "name" || k.toLowerCase() === "label" || k.toLowerCase() === "category") || allKeys.find((k) => typeof firstItem[k] === "string") || allKeys[0];
   const resolvedDataKeys = config.dataKeys && config.dataKeys.every((k) => {
@@ -460,6 +468,9 @@ function MessageBubble({
   }, [sources, isUser]);
   const { productsFromContent, cleanContent } = React5.useMemo(() => {
     if (isUser) return { productsFromContent: [], cleanContent: message.content };
+    if (message.content.includes("```chart")) {
+      return { productsFromContent: [], cleanContent: message.content };
+    }
     const jsonRegex = /```json\s*([\s\S]*?)\s*```/g;
     const products = [];
     let content = message.content;

package/dist/server.js

@@ -3915,25 +3915,18 @@ var Pipeline = class {
     if (this.initialised) return;
     const chartInstruction = `
 
-When presenting structured data, statistics, or comparisons, decide if it is best presented as a table or a chart.
-- For tables: use standard Markdown tables.
-- For charts (bar, line, pie): You MUST output a fenced code block with the language 'chart'.
-- CRITICAL RULES:
-  1. Use ONLY valid JSON (double quotes, no trailing commas).
-  2. NO math expressions (e.g., use 100, NOT 50+50).
-  3. dataKeys MUST exactly match the property names in the data objects.
-  4. data objects MUST be FLAT (no nested objects or arrays).
-  5. DO NOT output naked JSON or markdown tables for visualizations.
-  6. ALWAYS wrap your visualization data in a \`\`\`chart ... \`\`\` code block.
-\`\`\`chart
-{
-  "type": "bar" | "line" | "pie",
-  "xAxisKey": "name",
-  "dataKeys": ["value"],
-  "data": [{"name": "A", "value": 10}]
-}
-\`\`\``;
-    if (!this.config.llm.systemPrompt || !this.config.llm.systemPrompt.includes("```chart")) {
+### VISUALIZATION PROTOCOL:
+When requested to show data visually (charts, graphs, or comparisons), you MUST use this format:
+1. Wrap the data in a fenced code block with the language 'chart'.
+2. Use ONLY valid JSON matching this schema:
+   {
+     "type": "bar" | "line" | "pie",
+     "xAxisKey": "property_for_label",
+     "dataKeys": ["property_for_value"],
+     "data": [{ "property_for_label": "A", "property_for_value": 10 }]
+   }
+3. RULES: Data objects MUST be FLAT (no nesting). No math expressions in JSON. NEVER draw charts with text or markdown tables.`;
+    if (!this.config.llm.systemPrompt || !this.config.llm.systemPrompt.includes("chart")) {
       this.config.llm.systemPrompt = (this.config.llm.systemPrompt || "") + chartInstruction;
     }
     console.log(`[Pipeline] Initializing with provider: ${this.config.vectorDb.provider}...`);

package/dist/server.mjs

@@ -39,7 +39,7 @@ import {
   sseFrame,
   sseMetaFrame,
   sseTextFrame
-} from "./chunk-C4KDS26Q.mjs";
+} from "./chunk-YCL23GST.mjs";
 import "./chunk-YLTMFW4M.mjs";
 import {
   PineconeProvider

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@retrivora-ai/rag-engine",
-  "version": "1.4.6",
+  "version": "1.4.8",
   "description": "Retrivora AI is a plug-and-play AI engine for RAG chat experiences — generic vector DB + LLM provider, embeddable or standalone.",
   "author": "Abhinav Alkuchi",
   "license": "MIT",

package/src/components/DynamicChart.tsx

@@ -29,6 +29,8 @@ export function DynamicChart({ config, primaryColor = '#6366f1', accentColor = '
   // CRITICAL: Sanitize the data array to remove any non-primitive values (objects/arrays)
   // This prevents the "Objects are not valid as a React child" error in Tooltips/Legends
   // This hook MUST be called before any early returns to satisfy React rules
+  // CRITICAL: Sanitize the data array to remove any non-primitive values (objects/arrays)
+  // Also ensures numeric strings are converted to actual numbers for Recharts.
   const sanitizedData = React.useMemo(() => {
     if (!data) return [];
     return data.map(item => {
@@ -36,19 +38,28 @@ export function DynamicChart({ config, primaryColor = '#6366f1', accentColor = '
       Object.keys(item).forEach(k => {
         const val = item[k];
         if (Array.isArray(val)) {
-          // If the LLM output nested arrays, attempt to flatten them
           val.forEach(subItem => {
             if (typeof subItem === 'object' && subItem !== null) {
               Object.keys(subItem).forEach(sk => {
                 const subVal = (subItem as Record<string, unknown>)[sk];
                 if (typeof subVal !== 'object' || subVal === null) {
-                  newItem[sk] = subVal as string | number | null;
+                  // Auto-convert numeric strings
+                  if (typeof subVal === 'string' && !isNaN(Number(subVal)) && subVal.trim() !== '') {
+                    newItem[sk] = Number(subVal);
+                  } else {
+                    newItem[sk] = subVal as string | number | null;
+                  }
                 }
               });
             }
           });
         } else if (typeof val !== 'object' || val === null) {
-          newItem[k] = val as string | number | null;
+          // Auto-convert numeric strings
+          if (typeof val === 'string' && !isNaN(Number(val)) && val.trim() !== '') {
+            newItem[k] = Number(val);
+          } else {
+            newItem[k] = val as string | number | null;
+          }
         }
       });
       return newItem;
@@ -60,7 +71,7 @@ export function DynamicChart({ config, primaryColor = '#6366f1', accentColor = '
   }
 
   // Smart key resolution: if the provided keys don't exist in the data, try to guess them
-  const firstItem = data[0];
+  const firstItem = sanitizedData[0];
   const allKeys = Object.keys(firstItem);
   
   // Resolve xAxisKey: use provided, fallback to 'name', 'label', 'category', or the first string key
@@ -71,7 +82,6 @@ export function DynamicChart({ config, primaryColor = '#6366f1', accentColor = '
       || allKeys[0];
 
   // Resolve dataKeys: use provided, fallback to 'value', 'count', 'amount', or all numeric keys
-  // CRITICAL: Filter out any keys that point to objects/arrays to prevent React render errors
   const resolvedDataKeys = config.dataKeys && config.dataKeys.every(k => {
     const val = firstItem[k];
     return val !== undefined && typeof val !== 'object';

package/src/components/MessageBubble.tsx

@@ -313,6 +313,11 @@ export function MessageBubble({
   const { productsFromContent, cleanContent } = React.useMemo(() => {
     if (isUser) return { productsFromContent: [] as Product[], cleanContent: message.content };
 
+    // If the message contains a chart, suppress the product carousel to keep focus on visualization
+    if (message.content.includes('```chart')) {
+      return { productsFromContent: [] as Product[], cleanContent: message.content };
+    }
+
     const jsonRegex = /```json\s*([\s\S]*?)\s*```/g;
     const products: Product[] = [];
     let content = message.content;

package/src/core/Pipeline.ts

@@ -99,28 +99,21 @@ export class Pipeline {
   async initialize(): Promise<void> {
     if (this.initialised) return;
 
-    // Augment system prompt with Chart/Table instructions if not already present
-    const chartInstruction = `\n\nWhen presenting structured data, statistics, or comparisons, decide if it is best presented as a table or a chart.
-- For tables: use standard Markdown tables.
-- For charts (bar, line, pie): You MUST output a fenced code block with the language 'chart'.
-- CRITICAL RULES:
-  1. Use ONLY valid JSON (double quotes, no trailing commas).
-  2. NO math expressions (e.g., use 100, NOT 50+50).
-  3. dataKeys MUST exactly match the property names in the data objects.
-  4. data objects MUST be FLAT (no nested objects or arrays).
-  5. DO NOT output naked JSON or markdown tables for visualizations.
-  6. ALWAYS wrap your visualization data in a \`\`\`chart ... \`\`\` code block.
-\`\`\`chart
-{
-  "type": "bar" | "line" | "pie",
-  "xAxisKey": "name",
-  "dataKeys": ["value"],
-  "data": [{"name": "A", "value": 10}]
-}
-\`\`\``;
+    // Augment system prompt with a Universal Visualization Protocol
+    const chartInstruction = `\n\n### VISUALIZATION PROTOCOL:
+When requested to show data visually (charts, graphs, or comparisons), you MUST use this format:
+1. Wrap the data in a fenced code block with the language 'chart'.
+2. Use ONLY valid JSON matching this schema:
+   {
+     "type": "bar" | "line" | "pie",
+     "xAxisKey": "property_for_label",
+     "dataKeys": ["property_for_value"],
+     "data": [{ "property_for_label": "A", "property_for_value": 10 }]
+   }
+3. RULES: Data objects MUST be FLAT (no nesting). No math expressions in JSON. NEVER draw charts with text or markdown tables.`;
 
     // Inject chart instructions if not already present (including when systemPrompt is undefined)
-    if (!this.config.llm.systemPrompt || !this.config.llm.systemPrompt.includes('```chart')) {
+    if (!this.config.llm.systemPrompt || !this.config.llm.systemPrompt.includes('chart')) {
       this.config.llm.systemPrompt = (this.config.llm.systemPrompt || '') + chartInstruction;
     }