@retrivora-ai/rag-engine 1.9.0 → 1.9.2

package/dist/index.mjs

@@ -316,7 +316,7 @@ function DocumentUpload({ namespace, onUploadComplete, className = "" }) {
 
 // src/components/MessageBubble.tsx
 import React9 from "react";
-import { Bot, User, ChevronDown as ChevronDown3, ChevronRight as ChevronRight3, Activity } from "lucide-react";
+import { Bot, User, ChevronDown as ChevronDown3, ChevronRight as ChevronRight3, Activity, Copy, Check } from "lucide-react";
 import ReactMarkdown from "react-markdown";
 
 // src/components/SourceCard.tsx
@@ -368,7 +368,20 @@ import { ChevronLeft, ChevronRight } from "lucide-react";
 import Image from "next/image";
 import { ShoppingCart, ExternalLink } from "lucide-react";
 import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
+function cleanProductDescription(raw) {
+  var _a;
+  if (raw === null || raw === void 0) return "";
+  const source = String(raw);
+  const bodyMatch = source.match(
+    /\bBody\s*\(HTML\)\s*:\s*([\s\S]*?)(?=\s*[,.]?\s+\b(?:Handle|Title|Vendor|Type|Tags|Published|Option\d*\s+Name|Option\d*\s+Value|Option|Variant|Image|SKU|Price|Status|Category)\b\s*:|$)/i
+  );
+  const descriptionMatch = bodyMatch != null ? bodyMatch : source.match(
+    /\b(?:Description|Summary|Details|Body)\s*:\s*([\s\S]*?)(?=\s*[,.]?\s+\b(?:Handle|Title|Vendor|Type|Tags|Published|Option\d*\s+Name|Option\d*\s+Value|Option|Variant|Image|SKU|Price|Status|Category)\b\s*:|$)/i
+  );
+  return ((_a = descriptionMatch == null ? void 0 : descriptionMatch[1]) != null ? _a : source).replace(/<[^>]*>/g, " ").replace(/&nbsp;/gi, " ").replace(/&amp;/gi, "&").replace(/&quot;/gi, '"').replace(/&#39;/gi, "'").replace(/\[[^\]]*TYPE[^\]]*\]/gi, " ").replace(/\b(?:Handle|Title|Vendor|Type|Tags|Published|Option\d*\s+Name|Option\d*\s+Value|Option|Variant|Image|SKU|Price|Status|Category)\s*:\s*[^,.\n:]+[,.]?/gi, " ").replace(/\bBody\s*\(HTML\)\s*:\s*/gi, " ").replace(/\b(?:Description|Summary|Details|Body|Content)\s*:\s*/gi, " ").replace(/\s+/g, " ").trim();
+}
 function ProductCard({ product, primaryColor = "#6366f1", onAddToCart }) {
+  const description = cleanProductDescription(product.description);
   return /* @__PURE__ */ jsxs3("div", { className: "flex-shrink-0 w-full bg-white dark:bg-white/5 border border-slate-200 dark:border-white/10 rounded-xl overflow-hidden shadow-sm hover:shadow-md transition-all duration-300 group", children: [
     /* @__PURE__ */ jsxs3("div", { className: "relative h-40 w-full bg-slate-100 dark:bg-white/5 flex items-center justify-center overflow-hidden", children: [
       product.image ? /* @__PURE__ */ jsx4(
@@ -388,7 +401,7 @@ function ProductCard({ product, primaryColor = "#6366f1", onAddToCart }) {
         /* @__PURE__ */ jsx4("h3", { className: "text-sm font-semibold text-slate-800 dark:text-white/90 line-clamp-1", children: product.name }),
         product.price && /* @__PURE__ */ jsx4("span", { className: "text-sm font-bold", style: { color: primaryColor }, children: typeof product.price === "number" ? `$${product.price}` : String(product.price).match(/^[\d.]/) ? `$${product.price}` : product.price })
       ] }),
-      product.description && /* @__PURE__ */ jsx4("p", { className: "text-[11px] text-slate-500 dark:text-white/50 line-clamp-2 leading-relaxed", children: product.description }),
+      description && /* @__PURE__ */ jsx4("p", { className: "text-[11px] text-slate-500 dark:text-white/50 line-clamp-2 leading-relaxed", children: description }),
       /* @__PURE__ */ jsxs3("div", { className: "mt-2 flex gap-2", children: [
         /* @__PURE__ */ jsxs3(
           "button",
@@ -503,6 +516,8 @@ import {
   Bar as Bar2,
   LineChart as LineChart2,
   Line as Line2,
+  ScatterChart,
+  Scatter,
   XAxis as XAxis2,
   YAxis as YAxis2,
   CartesianGrid as CartesianGrid2,
@@ -726,6 +741,9 @@ import { Fragment as Fragment3, jsx as jsx7, jsxs as jsxs6 } from "react/jsx-run
 function getColor(index) {
   return CHART_COLORS[index % CHART_COLORS.length];
 }
+function stripLeakedAnswerWrappers(raw) {
+  return raw.replace(/<prose\s+answer(?:\s+in\s+[^>]*)?>\s*([\s\S]*?)\s*<\/prose>/gi, "$1").replace(/<\/?prose(?:\s+answer)?[^>]*>/gi, "").trim();
+}
 function CustomTooltip({
   active,
   payload,
@@ -775,10 +793,20 @@ function renderVisualization(type, data, onAddToCart, primaryColor, isStreaming)
         return /* @__PURE__ */ jsx7(PieChartView, { data, isStreaming });
       case "bar_chart":
         return /* @__PURE__ */ jsx7(BarChartView, { data, primaryColor, isStreaming });
+      case "histogram":
+        return /* @__PURE__ */ jsx7(BarChartView, { data, primaryColor, isStreaming });
+      case "horizontal_bar":
+        return /* @__PURE__ */ jsx7(BarChartView, { data, primaryColor, isStreaming, layout: "vertical" });
       case "line_chart":
         return /* @__PURE__ */ jsx7(LineChartView, { data, primaryColor, isStreaming });
+      case "scatter_plot":
+        return /* @__PURE__ */ jsx7(ScatterPlotView, { data, primaryColor, isStreaming });
       case "radar_chart":
         return /* @__PURE__ */ jsx7(RadarChartView, { data, isStreaming });
+      case "metric_card":
+        return /* @__PURE__ */ jsx7(MetricCardView, { data, isStreaming });
+      case "geo_map":
+        return /* @__PURE__ */ jsx7(BarChartView, { data, primaryColor, isStreaming });
       case "table":
         return /* @__PURE__ */ jsx7(TableView, { data, isStreaming });
       case "product_carousel":
@@ -813,28 +841,74 @@ function PieChartView({ data, isStreaming }) {
   }
   const chartData = data.map((item) => ({
     name: item.label,
-    value: item.value
+    value: item.value,
+    inStockCount: item.inStockCount,
+    outOfStockCount: item.outOfStockCount
   }));
-  return /* @__PURE__ */ jsx7("div", { className: "bg-white dark:bg-slate-900 rounded-xl border border-slate-200 dark:border-white/10 p-4 shadow-sm", children: /* @__PURE__ */ jsx7(ResponsiveContainer2, { width: "100%", height: 280, children: /* @__PURE__ */ jsxs6(PieChart2, { children: [
-    /* @__PURE__ */ jsx7(
-      Pie2,
-      {
-        data: chartData,
-        dataKey: "value",
-        nameKey: "name",
-        cx: "50%",
-        cy: "50%",
-        outerRadius: "68%",
-        label: false,
-        labelLine: false,
-        children: chartData.map((_entry, index) => /* @__PURE__ */ jsx7(Cell2, { fill: getColor(index) }, `cell-${index}`))
-      }
-    ),
-    /* @__PURE__ */ jsx7(Tooltip2, { content: /* @__PURE__ */ jsx7(CustomTooltip, {}) }),
-    /* @__PURE__ */ jsx7(Legend2, { wrapperStyle: { fontSize: 12 }, verticalAlign: "bottom" })
-  ] }) }) });
+  const hasStockBreakdown = chartData.some(
+    (item) => item.inStockCount !== void 0 || item.outOfStockCount !== void 0
+  );
+  return /* @__PURE__ */ jsxs6("div", { className: "bg-white dark:bg-slate-900 rounded-xl border border-slate-200 dark:border-white/10 p-4 shadow-sm", children: [
+    /* @__PURE__ */ jsx7(ResponsiveContainer2, { width: "100%", height: 280, children: /* @__PURE__ */ jsxs6(PieChart2, { children: [
+      /* @__PURE__ */ jsx7(
+        Pie2,
+        {
+          data: chartData,
+          dataKey: "value",
+          nameKey: "name",
+          cx: "50%",
+          cy: "50%",
+          outerRadius: "68%",
+          label: false,
+          labelLine: false,
+          children: chartData.map((_entry, index) => /* @__PURE__ */ jsx7(Cell2, { fill: getColor(index) }, `cell-${index}`))
+        }
+      ),
+      /* @__PURE__ */ jsx7(Tooltip2, { content: /* @__PURE__ */ jsx7(CustomTooltip, {}) }),
+      /* @__PURE__ */ jsx7(Legend2, { wrapperStyle: { fontSize: 12 }, verticalAlign: "bottom" })
+    ] }) }),
+    hasStockBreakdown && /* @__PURE__ */ jsx7("div", { className: "mt-3 grid gap-2 sm:grid-cols-2", children: chartData.map((item, index) => {
+      var _a, _b;
+      const inStock = Number((_a = item.inStockCount) != null ? _a : 0);
+      const outOfStock = Number((_b = item.outOfStockCount) != null ? _b : 0);
+      const status = inStock > 0 ? `${inStock} in stock` : "Out of stock";
+      const mutedStatus = outOfStock > 0 ? `${outOfStock} out` : null;
+      return /* @__PURE__ */ jsxs6(
+        "div",
+        {
+          className: "flex min-w-0 items-center justify-between gap-3 rounded-md border border-slate-100 px-2.5 py-2 text-xs dark:border-white/10",
+          children: [
+            /* @__PURE__ */ jsxs6("span", { className: "flex min-w-0 items-center gap-2 text-slate-700 dark:text-white/75", children: [
+              /* @__PURE__ */ jsx7(
+                "span",
+                {
+                  className: "h-2.5 w-2.5 flex-shrink-0 rounded-full",
+                  style: { background: getColor(index) }
+                }
+              ),
+              /* @__PURE__ */ jsx7("span", { className: "truncate", children: item.name })
+            ] }),
+            /* @__PURE__ */ jsxs6("span", { className: inStock > 0 ? "whitespace-nowrap font-medium text-emerald-600" : "whitespace-nowrap font-medium text-rose-600", children: [
+              status,
+              mutedStatus && /* @__PURE__ */ jsxs6("span", { className: "ml-1 text-slate-400", children: [
+                "(",
+                mutedStatus,
+                ")"
+              ] })
+            ] })
+          ]
+        },
+        item.name
+      );
+    }) })
+  ] });
 }
-function BarChartView({ data, primaryColor, isStreaming }) {
+function BarChartView({
+  data,
+  primaryColor,
+  isStreaming,
+  layout = "horizontal"
+}) {
   if (isStreaming) return /* @__PURE__ */ jsx7(ChartSkeleton, { type: "bar" });
   if (!Array.isArray(data) || data.length === 0) {
     return /* @__PURE__ */ jsx7("div", { className: "text-xs text-red-500", children: "Invalid bar chart data" });
@@ -845,26 +919,66 @@ function BarChartView({ data, primaryColor, isStreaming }) {
   }, item.inStockCount !== void 0 && { inStockCount: item.inStockCount }), item.outOfStockCount !== void 0 && { outOfStockCount: item.outOfStockCount }));
   const barColor = primaryColor != null ? primaryColor : getColor(0);
   const hasStock = chartData.some((d) => "inStockCount" in d);
-  return /* @__PURE__ */ jsx7("div", { className: "bg-white dark:bg-slate-900 rounded-xl border border-slate-200 dark:border-white/10 p-4 shadow-sm overflow-x-auto", children: /* @__PURE__ */ jsx7(ResponsiveContainer2, { width: "100%", height: 260, children: /* @__PURE__ */ jsxs6(BarChart2, { data: chartData, margin: { top: 10, right: 10, left: -20, bottom: 0 }, children: [
-    /* @__PURE__ */ jsx7(CartesianGrid2, { strokeDasharray: "3 3", vertical: false, stroke: "#e2e8f0" }),
-    /* @__PURE__ */ jsx7(
-      XAxis2,
-      {
-        dataKey: "category",
-        tick: { fontSize: 11, fill: "#64748b" },
-        tickLine: false,
-        axisLine: { stroke: "#cbd5e1" }
-      }
-    ),
-    /* @__PURE__ */ jsx7(YAxis2, { tick: { fontSize: 11, fill: "#64748b" }, tickLine: false, axisLine: false }),
-    /* @__PURE__ */ jsx7(Tooltip2, { content: /* @__PURE__ */ jsx7(CustomTooltip, {}), cursor: { fill: "#f1f5f9" } }),
-    /* @__PURE__ */ jsx7(Legend2, { wrapperStyle: { fontSize: 12 } }),
-    hasStock ? /* @__PURE__ */ jsxs6(Fragment3, { children: [
-      /* @__PURE__ */ jsx7(Bar2, { dataKey: "inStockCount", name: "In Stock", fill: getColor(1), radius: [4, 4, 0, 0] }),
-      /* @__PURE__ */ jsx7(Bar2, { dataKey: "outOfStockCount", name: "Out of Stock", fill: getColor(3), radius: [4, 4, 0, 0] })
-    ] }) : /* @__PURE__ */ jsx7(Bar2, { dataKey: "value", name: "Value", fill: barColor, radius: [4, 4, 0, 0] })
+  return /* @__PURE__ */ jsx7("div", { className: "bg-white dark:bg-slate-900 rounded-xl border border-slate-200 dark:border-white/10 p-4 shadow-sm overflow-x-auto", children: /* @__PURE__ */ jsx7(ResponsiveContainer2, { width: "100%", height: 260, children: /* @__PURE__ */ jsxs6(
+    BarChart2,
+    {
+      data: chartData,
+      layout,
+      margin: { top: 10, right: 10, left: layout === "vertical" ? 20 : -20, bottom: 0 },
+      children: [
+        /* @__PURE__ */ jsx7(CartesianGrid2, { strokeDasharray: "3 3", vertical: false, stroke: "#e2e8f0" }),
+        layout === "vertical" ? /* @__PURE__ */ jsxs6(Fragment3, { children: [
+          /* @__PURE__ */ jsx7(XAxis2, { type: "number", tick: { fontSize: 11, fill: "#64748b" }, tickLine: false, axisLine: { stroke: "#cbd5e1" } }),
+          /* @__PURE__ */ jsx7(YAxis2, { type: "category", dataKey: "category", width: 110, tick: { fontSize: 11, fill: "#64748b" }, tickLine: false, axisLine: false })
+        ] }) : /* @__PURE__ */ jsxs6(Fragment3, { children: [
+          /* @__PURE__ */ jsx7(
+            XAxis2,
+            {
+              dataKey: "category",
+              tick: { fontSize: 11, fill: "#64748b" },
+              tickLine: false,
+              axisLine: { stroke: "#cbd5e1" }
+            }
+          ),
+          /* @__PURE__ */ jsx7(YAxis2, { tick: { fontSize: 11, fill: "#64748b" }, tickLine: false, axisLine: false })
+        ] }),
+        /* @__PURE__ */ jsx7(Tooltip2, { content: /* @__PURE__ */ jsx7(CustomTooltip, {}), cursor: { fill: "#f1f5f9" } }),
+        /* @__PURE__ */ jsx7(Legend2, { wrapperStyle: { fontSize: 12 } }),
+        hasStock ? /* @__PURE__ */ jsxs6(Fragment3, { children: [
+          /* @__PURE__ */ jsx7(Bar2, { dataKey: "inStockCount", name: "In Stock", fill: getColor(1), radius: [4, 4, 0, 0] }),
+          /* @__PURE__ */ jsx7(Bar2, { dataKey: "outOfStockCount", name: "Out of Stock", fill: getColor(3), radius: [4, 4, 0, 0] })
+        ] }) : /* @__PURE__ */ jsx7(Bar2, { dataKey: "value", name: "Value", fill: barColor, radius: [4, 4, 0, 0] })
+      ]
+    }
+  ) }) });
+}
+function ScatterPlotView({ data, primaryColor, isStreaming }) {
+  if (isStreaming) return /* @__PURE__ */ jsx7(ChartSkeleton, { type: "bar" });
+  if (!Array.isArray(data) || data.length === 0) {
+    return /* @__PURE__ */ jsx7("div", { className: "text-xs text-red-500", children: "Invalid scatter plot data" });
+  }
+  return /* @__PURE__ */ jsx7("div", { className: "bg-white dark:bg-slate-900 rounded-xl border border-slate-200 dark:border-white/10 p-4 shadow-sm overflow-x-auto", children: /* @__PURE__ */ jsx7(ResponsiveContainer2, { width: "100%", height: 260, children: /* @__PURE__ */ jsxs6(ScatterChart, { margin: { top: 10, right: 10, left: -20, bottom: 0 }, children: [
+    /* @__PURE__ */ jsx7(CartesianGrid2, { strokeDasharray: "3 3", stroke: "#e2e8f0" }),
+    /* @__PURE__ */ jsx7(XAxis2, { type: "number", dataKey: "x", tick: { fontSize: 11, fill: "#64748b" }, tickLine: false, axisLine: { stroke: "#cbd5e1" } }),
+    /* @__PURE__ */ jsx7(YAxis2, { type: "number", dataKey: "y", tick: { fontSize: 11, fill: "#64748b" }, tickLine: false, axisLine: false }),
+    /* @__PURE__ */ jsx7(Tooltip2, { content: /* @__PURE__ */ jsx7(CustomTooltip, {}), cursor: { strokeDasharray: "3 3" } }),
+    /* @__PURE__ */ jsx7(Scatter, { name: "Value", data, fill: primaryColor != null ? primaryColor : getColor(0) })
   ] }) }) });
 }
+function MetricCardView({ data, isStreaming }) {
+  if (isStreaming) return /* @__PURE__ */ jsx7(ChartSkeleton, { type: "bar" });
+  if (!data || typeof data.value !== "number") {
+    return /* @__PURE__ */ jsx7("div", { className: "text-xs text-red-500", children: "Invalid metric data" });
+  }
+  return /* @__PURE__ */ jsxs6("div", { className: "rounded-xl border border-slate-200 bg-white p-4 shadow-sm dark:border-white/10 dark:bg-slate-900", children: [
+    /* @__PURE__ */ jsx7("div", { className: "text-xs font-medium uppercase text-slate-500 dark:text-slate-400", children: data.label }),
+    /* @__PURE__ */ jsxs6("div", { className: "mt-2 text-3xl font-semibold text-slate-900 dark:text-white", children: [
+      data.value.toLocaleString(),
+      data.unit && /* @__PURE__ */ jsx7("span", { className: "ml-1 text-base text-slate-500", children: data.unit })
+    ] }),
+    data.operation && /* @__PURE__ */ jsx7("div", { className: "mt-1 text-xs text-slate-500 dark:text-slate-400", children: data.operation })
+  ] });
+}
 function LineChartView({ data, primaryColor, isStreaming }) {
   if (isStreaming) return /* @__PURE__ */ jsx7(ChartSkeleton, { type: "bar" });
   if (!Array.isArray(data) || data.length === 0) {
@@ -998,7 +1112,7 @@ function CarouselView({
   ) });
 }
 function TextView({ data }) {
-  const content = (data == null ? void 0 : data.content) || String(data != null ? data : "");
+  const content = stripLeakedAnswerWrappers((data == null ? void 0 : data.content) || String(data != null ? data : ""));
   return /* @__PURE__ */ jsx7("div", { className: "bg-white dark:bg-slate-900 rounded-xl border border-slate-200 dark:border-white/10 p-4 shadow-sm", children: /* @__PURE__ */ jsx7("p", { className: "text-sm text-slate-700 dark:text-slate-300 whitespace-pre-wrap leading-relaxed", children: content }) });
 }
 
@@ -1421,7 +1535,7 @@ var HourglassLoader_default = HourglassLoader;
 // src/utils/synonyms.ts
 var FIELD_SYNONYMS = {
   name: ["product", "item", "title", "label", "heading", "subject", "product name", "item name"],
-  price: ["cost", "amount", "msrp", "price", "rate", "value", "price_usd"],
+  price: ["cost", "amount", "msrp", "price", "rate", "value", "price_usd", "variant price"],
   brand: ["manufacturer", "vendor", "make", "company", "brand_name", "supplier"],
   image: [
     "imageUrl",
@@ -1434,7 +1548,9 @@ var FIELD_SYNONYMS = {
     "image_url",
     "main_image",
     "product_image",
-    "thumb"
+    "thumb",
+    "image src",
+    "variant image"
   ],
   stock: [
     "inventory",
@@ -1445,9 +1561,19 @@ var FIELD_SYNONYMS = {
     "inStock",
     "is_available",
     "in stock",
-    "status"
+    "status",
+    "variant inventory qty"
   ],
-  description: ["summary", "content", "body", "text", "info", "details"],
+  category: [
+    "product_category",
+    "product category",
+    "category_name",
+    "category name",
+    "department",
+    "collection",
+    "type"
+  ],
+  description: ["summary", "content", "body", "text", "info", "details", "body (html)", "seo description"],
   link: ["url", "href", "product_url", "page_url", "link"]
 };
 function addSynonyms(customSynonyms) {
@@ -1654,11 +1780,12 @@ function extractProductsFromSources(sources, isUser) {
     var _a;
     const m = (_a = s.metadata) != null ? _a : {};
     const keys = Object.keys(m).map((k) => k.toLowerCase());
-    const hasProductKey = keys.some(
-      (k) => ["price", "image", "img", "thumbnail", "images", "brand", "product", "sku", "category", "model", "cost"].includes(k)
+    const hasStrongProductKey = keys.some(
+      (k) => ["price", "image", "img", "thumbnail", "images", "product", "sku", "cost"].includes(k)
     );
+    const hasProductIdentity = keys.some((k) => ["brand", "model"].includes(k)) && keys.some((k) => ["name", "title", "product_name", "product"].includes(k));
     const hasPricePattern = /\$\s*\d+/.test(s.content);
-    return hasProductKey || hasPricePattern || m.type === "product";
+    return hasStrongProductKey || hasProductIdentity || hasPricePattern || m.type === "product";
   }).map((s) => {
     var _a, _b;
     const m = (_a = s.metadata) != null ? _a : {};
@@ -1845,6 +1972,7 @@ function resolveStructuredRows(config) {
 }
 function UIDispatcher({ rawContent, primaryColor, accentColor, isStreaming, onAddToCart, viewportSize = "large" }) {
   var _a;
+  console.log("rawContent", rawContent);
   const result = React7.useMemo(() => {
     try {
       const clean = rawContent.replace(/^```[a-z]*\s*/i, "").replace(/```\s*$/, "").trim();
@@ -1979,12 +2107,11 @@ function createMarkdownComponents({
   viewportSize
 }) {
   return {
-    p: (_a) => {
+    // p: ({ ...props }: React.HTMLAttributes<HTMLParagraphElement>) => (
+    //   <p className="whitespace-pre-line" {...props} />
+    // ),
+    table: (_a) => {
       var props = __objRest(_a, []);
-      return /* @__PURE__ */ jsx11("p", __spreadValues({ className: "whitespace-pre-line" }, props));
-    },
-    table: (_b) => {
-      var props = __objRest(_b, []);
       if (isStreaming) {
         return /* @__PURE__ */ jsxs10("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", children: [
           /* @__PURE__ */ jsx11("div", { className: "w-4 h-4 border-2 border-indigo-500 border-t-transparent rounded-full animate-spin" }),
@@ -1998,8 +2125,8 @@ function createMarkdownComponents({
         }, props)
       ) }) });
     },
-    thead: (_c) => {
-      var props = __objRest(_c, []);
+    thead: (_b) => {
+      var props = __objRest(_b, []);
       return /* @__PURE__ */ jsx11(
         "thead",
         __spreadValues({
@@ -2007,12 +2134,12 @@ function createMarkdownComponents({
         }, props)
       );
     },
-    tbody: (_d) => {
-      var props = __objRest(_d, []);
+    tbody: (_c) => {
+      var props = __objRest(_c, []);
       return /* @__PURE__ */ jsx11("tbody", __spreadValues({ className: "!table-row-group divide-y divide-slate-100 dark:divide-white/5" }, props));
     },
-    tr: (_e) => {
-      var props = __objRest(_e, []);
+    tr: (_d) => {
+      var props = __objRest(_d, []);
       return /* @__PURE__ */ jsx11(
         "tr",
         __spreadValues({
@@ -2020,8 +2147,8 @@ function createMarkdownComponents({
         }, props)
       );
     },
-    th: (_f) => {
-      var _g = _f, { children } = _g, props = __objRest(_g, ["children"]);
+    th: (_e) => {
+      var _f = _e, { children } = _f, props = __objRest(_f, ["children"]);
       return /* @__PURE__ */ jsx11(
         "th",
         __spreadProps(__spreadValues({
@@ -2031,8 +2158,8 @@ function createMarkdownComponents({
         })
       );
     },
-    td: (_h) => {
-      var _i = _h, { children } = _i, props = __objRest(_i, ["children"]);
+    td: (_g) => {
+      var _h = _g, { children } = _h, props = __objRest(_h, ["children"]);
       return /* @__PURE__ */ jsx11(
         "td",
         __spreadProps(__spreadValues({
@@ -2042,12 +2169,12 @@ function createMarkdownComponents({
         })
       );
     },
-    code(_j) {
-      var _k = _j, {
+    code(_i) {
+      var _j = _i, {
         inline,
         className,
         children
-      } = _k, props = __objRest(_k, [
+      } = _j, props = __objRest(_j, [
         "inline",
         "className",
         "children"
@@ -2097,6 +2224,16 @@ function normaliseChild(children) {
 
 // src/components/MessageBubble.tsx
 import { jsx as jsx12, jsxs as jsxs11 } from "react/jsx-runtime";
+function normalizePlusSeparatedLists(raw) {
+  return raw.split("\n").map((line) => {
+    const productListLine = /[—:]\s*\d+\s+\+\s+[A-Za-z]/.test(line) || /\b(products?|categories?|in stock|out of stock)\b/i.test(line);
+    if (!productListLine) return line;
+    return line.replace(/\s+\+\s+(?=[A-Za-z0-9])/g, ", ");
+  }).join("\n");
+}
+function stripLeakedAnswerWrappers2(raw) {
+  return raw.replace(/<prose\s+answer(?:\s+in\s+[^>]*)?>\s*([\s\S]*?)\s*<\/prose>/gi, "$1").replace(/<\/?prose(?:\s+answer)?[^>]*>/gi, "").replace(/\n{3,}/g, "\n\n").trim();
+}
 function MessageBubble({
   message,
   sources,
@@ -2106,11 +2243,22 @@ function MessageBubble({
   onAddToCart,
   viewportSize = "large"
 }) {
+  var _a;
   const isUser = message.role === "user";
   const isCompact = viewportSize === "compact";
   const isMedium = viewportSize === "medium";
   const [showSources, setShowSources] = React9.useState(false);
   const [showTrace, setShowTrace] = React9.useState(false);
+  const [copied, setCopied] = React9.useState(false);
+  const handleCopy = React9.useCallback(async () => {
+    try {
+      await navigator.clipboard.writeText(message.content);
+      setCopied(true);
+      setTimeout(() => setCopied(false), 2e3);
+    } catch (err) {
+      console.error("Failed to copy text:", err);
+    }
+  }, [message.content]);
   const structuredContent = React9.useMemo(
     () => isUser ? { payload: null, text: message.content } : extractStructuredPayload(message.content),
     [isUser, message.content]
@@ -2125,6 +2273,10 @@ function MessageBubble({
     }
     return false;
   }, [message.uiTransformation, structuredContent.payload]);
+  const uiTransformationType = (_a = message.uiTransformation) == null ? void 0 : _a.type;
+  const shouldSuppressProductCarousel = Boolean(
+    uiTransformationType && !["text", "product_carousel", "carousel"].includes(uiTransformationType)
+  );
   const shouldRenderStructuredOnly = !isUser && hasRichUI && isLikelyUiOnlyMessage(structuredContent.text);
   const productsFromSources = React9.useMemo(() => {
     return extractProductsFromSources(sources, isUser);
@@ -2150,6 +2302,14 @@ function MessageBubble({
   }, [productsFromSources, productsFromContent, message.content]);
   const processedMarkdown = React9.useMemo(() => {
     let raw = structuredContent.payload ? structuredContent.text : cleanContent || message.content;
+    raw = raw.replace(/\$\s*(\d+)(?!\.\d)/g, "$1");
+    raw = normalizePlusSeparatedLists(raw);
+    raw = stripLeakedAnswerWrappers2(raw);
+    raw = raw.replace(/\*\*([^*\n]+)\*\*(\s*[—\-–:]\s*)/g, "$1$2");
+    raw = raw.split("\n").filter((line, idx, arr) => {
+      const trimmed = line.trim();
+      return !trimmed || arr.findIndex((l) => l.trim() === trimmed) === idx;
+    }).join("\n");
     const hasStructuredUiBlock = Boolean(structuredContent.payload) || /```(?:ui|json|chart)\s*[\s\S]*?"(?:view|chartType|type|data|items|rows|products|results)"\s*:/i.test(raw);
     raw = raw.replace(/([^\n])\n\|/g, "$1\n\n|").replace(/(\|[^\n]*\|)\n\n+(?=\|)/g, "$1\n");
     if (!isStreaming) {
@@ -2185,49 +2345,61 @@ ${match.trim()}
       }
     ),
     /* @__PURE__ */ jsxs11("div", { className: `flex flex-col gap-1 min-w-0 ${isCompact ? "max-w-[94%]" : isMedium ? "max-w-[92%]" : "max-w-[90%]"} ${isUser ? "items-end" : "items-start"}`, children: [
-      /* @__PURE__ */ jsx12(
+      /* @__PURE__ */ jsxs11(
         "div",
         {
-          className: `relative ${isCompact ? "px-3 py-2.5 text-[13px]" : "px-4 py-3 text-sm"} rounded-2xl leading-relaxed shadow-sm dark:shadow-lg ${isUser ? "text-white rounded-tr-sm" : "bg-white dark:bg-white/5 border border-slate-200 dark:border-white/10 text-slate-800 dark:text-white/90 rounded-tl-sm"}`,
+          className: `relative group ${isCompact ? "px-3 py-2.5 text-[13px]" : "px-4 py-3 text-sm"} rounded-2xl leading-relaxed shadow-sm dark:shadow-lg ${isUser ? "text-white rounded-tr-sm" : "bg-white dark:bg-white/5 border border-slate-200 dark:border-white/10 text-slate-800 dark:text-white/90 rounded-tl-sm"}`,
           style: isUser ? { background: `linear-gradient(135deg, ${primaryColor}, ${accentColor})` } : {},
-          children: isStreaming && !message.content ? /* @__PURE__ */ jsxs11("span", { className: "flex items-center gap-1 py-1", children: [
-            /* @__PURE__ */ jsx12("span", { className: "w-1.5 h-1.5 rounded-full bg-slate-400 dark:bg-white/60 animate-bounce [animation-delay:0ms]" }),
-            /* @__PURE__ */ jsx12("span", { className: "w-1.5 h-1.5 rounded-full bg-slate-400 dark:bg-white/60 animate-bounce [animation-delay:150ms]" }),
-            /* @__PURE__ */ jsx12("span", { className: "w-1.5 h-1.5 rounded-full bg-slate-400 dark:bg-white/60 animate-bounce [animation-delay:300ms]" })
-          ] }) : /* @__PURE__ */ jsxs11("div", { className: `prose ${isCompact ? "prose-xs" : "prose-sm"} max-w-none break-words ${isUser ? "prose-invert" : "dark:prose-invert"}`, children: [
-            !isUser && structuredContent.payload && /* @__PURE__ */ jsx12(
-              UIDispatcher,
+          children: [
+            !isUser && !isStreaming && message.content && /* @__PURE__ */ jsx12(
+              "button",
               {
-                rawContent: structuredContent.payload,
-                primaryColor,
-                accentColor,
-                isStreaming,
-                onAddToCart,
-                viewportSize
+                onClick: handleCopy,
+                className: `absolute top-2 right-2 p-1.5 rounded-lg border transition-all duration-200 cursor-pointer ${copied ? "bg-emerald-500/10 border-emerald-500/20 text-emerald-500 dark:text-emerald-400" : "bg-slate-500/5 hover:bg-slate-500/10 border-slate-200 dark:border-white/10 text-slate-400 dark:text-white/30 hover:text-slate-600 dark:hover:text-white/60"} opacity-0 group-hover:opacity-100 backdrop-blur-sm shadow-sm scale-95 group-hover:scale-100`,
+                title: copied ? "Copied!" : "Copy response",
+                children: copied ? /* @__PURE__ */ jsx12(Check, { className: "w-3.5 h-3.5" }) : /* @__PURE__ */ jsx12(Copy, { className: "w-3.5 h-3.5" })
               }
             ),
-            !shouldRenderStructuredOnly && /* @__PURE__ */ jsx12(ReactMarkdown, { components: markdownComponents, children: processedMarkdown }),
-            isStreaming && /* @__PURE__ */ jsxs11("span", { className: "inline-flex items-center gap-1.5 ml-2 text-emerald-500 animate-pulse align-middle text-xs font-medium", children: [
-              /* @__PURE__ */ jsx12(
-                HourglassLoader_default,
+            isStreaming && !message.content ? /* @__PURE__ */ jsxs11("span", { className: "flex items-center gap-1 py-1", children: [
+              /* @__PURE__ */ jsx12("span", { className: "w-1.5 h-1.5 rounded-full bg-slate-400 dark:bg-white/60 animate-bounce [animation-delay:0ms]" }),
+              /* @__PURE__ */ jsx12("span", { className: "w-1.5 h-1.5 rounded-full bg-slate-400 dark:bg-white/60 animate-bounce [animation-delay:150ms]" }),
+              /* @__PURE__ */ jsx12("span", { className: "w-1.5 h-1.5 rounded-full bg-slate-400 dark:bg-white/60 animate-bounce [animation-delay:300ms]" })
+            ] }) : /* @__PURE__ */ jsxs11("div", { className: `prose ${isCompact ? "prose-xs" : "prose-sm"} max-w-none break-words ${isUser ? "prose-invert" : "dark:prose-invert"}`, children: [
+              !isUser && structuredContent.payload && /* @__PURE__ */ jsx12(
+                UIDispatcher,
                 {
-                  size: 18,
+                  rawContent: structuredContent.payload,
                   primaryColor,
                   accentColor,
-                  glow: false
+                  isStreaming,
+                  onAddToCart,
+                  viewportSize
                 }
               ),
-              "Thinking..."
+              !shouldRenderStructuredOnly && /* @__PURE__ */ jsx12(ReactMarkdown, { components: markdownComponents, children: processedMarkdown }),
+              isStreaming && /* @__PURE__ */ jsxs11("span", { className: "inline-flex items-center gap-1.5 ml-2 text-emerald-500 animate-pulse align-middle text-xs font-medium", children: [
+                /* @__PURE__ */ jsx12(
+                  HourglassLoader_default,
+                  {
+                    size: 18,
+                    primaryColor,
+                    accentColor,
+                    glow: false
+                  }
+                ),
+                "Thinking..."
+              ] })
             ] })
-          ] })
+          ]
         }
       ),
       (() => {
-        var _a, _b;
+        var _a2, _b;
         if (isUser || structuredContent.payload || !message.uiTransformation) return null;
         const ui = message.uiTransformation;
-        const textContent = (_b = (_a = ui.data) == null ? void 0 : _a.content) != null ? _b : "";
-        const shouldShow = ui.type === "table" && allProducts.length === 0 || !["text", "table"].includes(ui.type) || ui.type === "text" && !hasRichUI && allProducts.length === 0 && textContent && !processedMarkdown.toLowerCase().includes(textContent.trim().toLowerCase());
+        const textContent = (_b = (_a2 = ui.data) == null ? void 0 : _a2.content) != null ? _b : "";
+        const isNegativeOrFallbackText = textContent.toLowerCase().includes("cannot answer") || textContent.toLowerCase().includes("no relevant data") || textContent.toLowerCase().includes("no data available") || typeof ui.title === "string" && ui.title.toLowerCase().includes("no data") || typeof ui.description === "string" && ui.description.toLowerCase().includes("no relevant data");
+        const shouldShow = !isNegativeOrFallbackText && (ui.type === "table" || !["text", "table"].includes(ui.type) || ui.type === "text" && !hasRichUI && allProducts.length === 0 && textContent && !processedMarkdown.toLowerCase().includes(textContent.trim().toLowerCase()));
         if (!shouldShow) return null;
         return /* @__PURE__ */ jsx12("div", { className: "w-full mt-3", children: /* @__PURE__ */ jsx12(
           VisualizationRenderer,
@@ -2240,7 +2412,7 @@ ${match.trim()}
           }
         ) });
       })(),
-      !isUser && !hasRichUI && allProducts.length > 0 && /* @__PURE__ */ jsx12("div", { className: "w-full mt-1", children: /* @__PURE__ */ jsx12(
+      !isUser && !hasRichUI && !shouldSuppressProductCarousel && allProducts.length > 0 && /* @__PURE__ */ jsx12("div", { className: "w-full mt-1", children: /* @__PURE__ */ jsx12(
         ProductCarousel,
         {
           products: allProducts,
@@ -2349,6 +2521,7 @@ function useRagChat(projectId, options = {}) {
   const [error, setError] = useState4(null);
   const lastInputRef = useRef3("");
   const messagesRef = useRef3(messages);
+  const abortControllerRef = useRef3(null);
   useEffect3(() => {
     messagesRef.current = messages;
   }, [messages]);
@@ -2369,11 +2542,17 @@ function useRagChat(projectId, options = {}) {
       }
       setError(null);
       setIsLoading(true);
+      if (abortControllerRef.current) {
+        abortControllerRef.current.abort();
+      }
+      const controller = new AbortController();
+      abortControllerRef.current = controller;
       try {
         const history = messagesRef.current.map(({ role, content }) => ({ role, content }));
         const response = await fetch(apiUrl, {
           method: "POST",
           headers: { "Content-Type": "application/json" },
+          signal: controller.signal,
           body: JSON.stringify({
             message: trimmed,
             history,
@@ -2394,6 +2573,23 @@ function useRagChat(projectId, options = {}) {
         let uiTransformation = null;
         let trace;
         let buffer = "";
+        let pendingFlush = false;
+        const pendingContentRef = { current: "" };
+        const flushTextUpdate = (msgId) => {
+          pendingFlush = false;
+          const snapshot = pendingContentRef.current;
+          setMessages(
+            (prev) => prev.map(
+              (msg) => msg.id === msgId ? __spreadProps(__spreadValues({}, msg), { content: snapshot }) : msg
+            )
+          );
+        };
+        const scheduleFlush = (msgId) => {
+          if (!pendingFlush) {
+            pendingFlush = true;
+            requestAnimationFrame(() => flushTextUpdate(msgId));
+          }
+        };
         const assistantMessageId = `assistant_${Date.now()}`;
         setMessages((prev) => [
           ...prev,
@@ -2412,28 +2608,37 @@ function useRagChat(projectId, options = {}) {
           if (lastBoundary === -1) continue;
           const complete = buffer.slice(0, lastBoundary + 2);
           buffer = buffer.slice(lastBoundary + 2);
+          let hasNonTextFrame = false;
           for (const frame of parseSseChunk(complete)) {
             if (frame.type === "text" && frame.text) {
               assistantContent += frame.text;
+              pendingContentRef.current = assistantContent;
+              scheduleFlush(assistantMessageId);
             } else if (frame.type === "metadata") {
               sources = (_a = frame.sources) != null ? _a : [];
+              hasNonTextFrame = true;
             } else if (frame.type === "ui_transformation") {
               uiTransformation = frame.data;
+              hasNonTextFrame = true;
             } else if (frame.type === "observability") {
               trace = frame.data;
+              hasNonTextFrame = true;
             } else if (frame.type === "error") {
               setError(frame.error || "Stream error");
             }
           }
-          setMessages(
-            (prev) => prev.map(
-              (msg) => msg.id === assistantMessageId ? __spreadProps(__spreadValues({}, msg), {
-                content: assistantContent,
-                sources: sources.length > 0 ? sources : msg.sources,
-                uiTransformation: uiTransformation || msg.uiTransformation
-              }) : msg
-            )
-          );
+          if (hasNonTextFrame) {
+            pendingFlush = false;
+            setMessages(
+              (prev) => prev.map(
+                (msg) => msg.id === assistantMessageId ? __spreadProps(__spreadValues({}, msg), {
+                  content: assistantContent,
+                  sources: sources.length > 0 ? sources : msg.sources,
+                  uiTransformation: uiTransformation || msg.uiTransformation
+                }) : msg
+              )
+            );
+          }
         }
         if (buffer.trim()) {
           for (const frame of parseSseChunk(buffer)) {
@@ -2456,11 +2661,16 @@ function useRagChat(projectId, options = {}) {
         );
         onReply == null ? void 0 : onReply(finalMsg);
       } catch (err) {
+        if (err instanceof Error && err.name === "AbortError") {
+          console.log("[useRagChat] Streaming stopped by user.");
+          return;
+        }
         const msg = err instanceof Error ? err.message : "Something went wrong. Please try again.";
         setError(msg);
         onError == null ? void 0 : onError(msg);
       } finally {
         setIsLoading(false);
+        abortControllerRef.current = null;
       }
     },
     [apiUrl, isLoading, namespace, onError, onReply, projectId, setMessages]
@@ -2478,6 +2688,13 @@ function useRagChat(projectId, options = {}) {
       });
     }
   }, [sendMessage]);
+  const stop = useCallback(() => {
+    if (abortControllerRef.current) {
+      abortControllerRef.current.abort();
+      abortControllerRef.current = null;
+    }
+    setIsLoading(false);
+  }, []);
   return {
     messages,
     isLoading,
@@ -2485,7 +2702,8 @@ function useRagChat(projectId, options = {}) {
     send: sendMessage,
     clear,
     retry,
-    setMessages
+    setMessages,
+    stop
   };
 }
 
@@ -2511,7 +2729,7 @@ function ChatWindow({
   const windowRef = useRef4(null);
   const bottomRef = useRef4(null);
   const inputRef = useRef4(null);
-  const { messages, send, clear, isLoading, error } = useRagChat(projectId, {
+  const { messages, send, clear, isLoading, error, stop } = useRagChat(projectId, {
     namespace: projectId
   });
   const [suggestions, setSuggestions] = useState5([]);
@@ -2875,14 +3093,22 @@ function ChatWindow({
                 children: /* @__PURE__ */ jsx13(Paperclip, { className: "w-4 h-4" })
               }
             ),
-            /* @__PURE__ */ jsx13(
+            isLoading ? /* @__PURE__ */ jsx13(
+              "button",
+              {
+                onClick: stop,
+                className: "flex-shrink-0 w-9 h-9 rounded-xl flex items-center justify-center transition-all hover:scale-105 active:scale-95 shadow-md bg-rose-500 hover:bg-rose-600 text-white cursor-pointer",
+                title: "Stop generating",
+                children: /* @__PURE__ */ jsx13("div", { className: "w-3.5 h-3.5 bg-white rounded-[2px]" })
+              }
+            ) : /* @__PURE__ */ jsx13(
               "button",
               {
                 onClick: sendMessage,
-                disabled: !input.trim() || isLoading,
+                disabled: !input.trim(),
                 className: "flex-shrink-0 w-9 h-9 rounded-xl flex items-center justify-center transition-all disabled:opacity-30 disabled:cursor-not-allowed hover:scale-105 active:scale-95 shadow-md",
                 style: {
-                  background: input.trim() && !isLoading ? `linear-gradient(135deg, ${ui.primaryColor}, ${ui.accentColor})` : "rgba(148, 163, 184, 0.2)"
+                  background: input.trim() ? `linear-gradient(135deg, ${ui.primaryColor}, ${ui.accentColor})` : "rgba(148, 163, 184, 0.2)"
                   // slate-400/20 for light mode disabled
                 },
                 children: /* @__PURE__ */ jsx13(ArrowUp, { className: "w-4 h-4 text-white" })