@retrivora-ai/rag-engine 1.4.1 → 1.4.3

package/dist/index.js

@@ -539,7 +539,7 @@ function MessageBubble({
   }, [productsFromSources, productsFromContent, message.content]);
   const processedMarkdown = import_react5.default.useMemo(() => {
     const raw = cleanContent || message.content;
-    return raw.replace(/([^\n])\n\|/g, "$1\n\n|");
+    return raw.replace(/([^\n])\n\|/g, "$1\n\n|").replace(/(\|[^\n]*\|)\n\n+(?=\|)/g, "$1\n");
   }, [cleanContent, message.content]);
   const markdownComponents = import_react5.default.useMemo(
     () => ({
@@ -547,6 +547,9 @@ function MessageBubble({
       // prose applies display:block and padding:0 to table/th/td — not-prose opts out.
       table: (_a) => {
         var props = __objRest(_a, []);
+        if (isStreaming) {
+          return /* @__PURE__ */ import_react5.default.createElement("div", { className: "my-5 p-6 bg-slate-50 dark:bg-white/5 rounded-xl border border-dashed border-slate-300 dark:border-white/10 flex items-center justify-center gap-3 select-none" }, /* @__PURE__ */ import_react5.default.createElement("div", { className: "w-4 h-4 border-2 border-indigo-500 border-t-transparent rounded-full animate-spin" }), /* @__PURE__ */ import_react5.default.createElement("p", { className: "text-xs text-slate-500 font-medium italic animate-pulse" }, "Generating data table..."));
+        }
         return /* @__PURE__ */ import_react5.default.createElement("div", { className: "not-prose overflow-hidden my-5 rounded-xl border border-slate-200 dark:border-white/10 shadow-sm bg-white dark:bg-slate-900/50" }, /* @__PURE__ */ import_react5.default.createElement("div", { className: "overflow-x-auto" }, /* @__PURE__ */ import_react5.default.createElement(
           "table",
           __spreadValues({

package/dist/index.mjs

@@ -502,7 +502,7 @@ function MessageBubble({
   }, [productsFromSources, productsFromContent, message.content]);
   const processedMarkdown = React5.useMemo(() => {
     const raw = cleanContent || message.content;
-    return raw.replace(/([^\n])\n\|/g, "$1\n\n|");
+    return raw.replace(/([^\n])\n\|/g, "$1\n\n|").replace(/(\|[^\n]*\|)\n\n+(?=\|)/g, "$1\n");
   }, [cleanContent, message.content]);
   const markdownComponents = React5.useMemo(
     () => ({
@@ -510,6 +510,9 @@ function MessageBubble({
       // prose applies display:block and padding:0 to table/th/td — not-prose opts out.
       table: (_a) => {
         var props = __objRest(_a, []);
+        if (isStreaming) {
+          return /* @__PURE__ */ React5.createElement("div", { className: "my-5 p-6 bg-slate-50 dark:bg-white/5 rounded-xl border border-dashed border-slate-300 dark:border-white/10 flex items-center justify-center gap-3 select-none" }, /* @__PURE__ */ React5.createElement("div", { className: "w-4 h-4 border-2 border-indigo-500 border-t-transparent rounded-full animate-spin" }), /* @__PURE__ */ React5.createElement("p", { className: "text-xs text-slate-500 font-medium italic animate-pulse" }, "Generating data table..."));
+        }
         return /* @__PURE__ */ React5.createElement("div", { className: "not-prose overflow-hidden my-5 rounded-xl border border-slate-200 dark:border-white/10 shadow-sm bg-white dark:bg-slate-900/50" }, /* @__PURE__ */ React5.createElement("div", { className: "overflow-x-auto" }, /* @__PURE__ */ React5.createElement(
           "table",
           __spreadValues({

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@retrivora-ai/rag-engine",
-  "version": "1.4.1",
+  "version": "1.4.3",
   "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/MessageBubble.tsx

@@ -358,10 +358,13 @@ export function MessageBubble({
   }, [productsFromSources, productsFromContent, message.content]);
 
   // ── Markdown source fixer ──────────────────────────────────────────────────
-  // GFM tables require a blank line before the | row when preceded by text.
+  // GFM tables require a blank line before the | row when preceded by text,
+  // but MUST NOT have blank lines between rows. LLMs often add extra newlines.
   const processedMarkdown = React.useMemo(() => {
     const raw = cleanContent || message.content;
-    return raw.replace(/([^\n])\n\|/g, '$1\n\n|');
+    return raw
+      .replace(/([^\n])\n\|/g, '$1\n\n|') // Ensure blank line before table
+      .replace(/(\|[^\n]*\|)\n\n+(?=\|)/g, '$1\n'); // Remove blank lines between rows
   }, [cleanContent, message.content]);
 
   // ── Markdown component overrides ───────────────────────────────────────────
@@ -369,16 +372,29 @@ export function MessageBubble({
     () => ({
       // Wrap in not-prose so Tailwind Typography resets don't clobber our styles.
       // prose applies display:block and padding:0 to table/th/td — not-prose opts out.
-      table: ({ ...props }: React.HTMLAttributes<HTMLTableElement>) => (
-        <div className="not-prose overflow-hidden my-5 rounded-xl border border-slate-200 dark:border-white/10 shadow-sm bg-white dark:bg-slate-900/50">
-          <div className="overflow-x-auto">
-            <table
-              className="!table w-full text-left border-collapse min-w-[400px] text-sm"
-              {...props}
-            />
+      table: ({ ...props }: React.HTMLAttributes<HTMLTableElement>) => {
+        if (isStreaming) {
+          return (
+            <div className="my-5 p-6 bg-slate-50 dark:bg-white/5 rounded-xl border border-dashed border-slate-300 dark:border-white/10 flex items-center justify-center gap-3 select-none">
+              <div className="w-4 h-4 border-2 border-indigo-500 border-t-transparent rounded-full animate-spin" />
+              <p className="text-xs text-slate-500 font-medium italic animate-pulse">
+                Generating data table...
+              </p>
+            </div>
+          );
+        }
+
+        return (
+          <div className="not-prose overflow-hidden my-5 rounded-xl border border-slate-200 dark:border-white/10 shadow-sm bg-white dark:bg-slate-900/50">
+            <div className="overflow-x-auto">
+              <table
+                className="!table w-full text-left border-collapse min-w-[400px] text-sm"
+                {...props}
+              />
+            </div>
           </div>
-        </div>
-      ),
+        );
+      },
       thead: ({ ...props }: React.HTMLAttributes<HTMLTableSectionElement>) => (
         <thead
           className="!table-header-group bg-slate-50 dark:bg-white/5 border-b border-slate-200 dark:border-white/10"