@retrivora-ai/rag-engine 1.8.0 → 1.8.1

package/dist/index.js

@@ -71,18 +71,17 @@ __export(index_exports, {
 module.exports = __toCommonJS(index_exports);
 
 // src/components/ChatWidget.tsx
-var import_react9 = __toESM(require("react"));
+var import_react10 = __toESM(require("react"));
 var import_lucide_react6 = require("lucide-react");
 
 // src/components/ChatWindow.tsx
-var import_react8 = __toESM(require("react"));
+var import_react9 = __toESM(require("react"));
 var import_lucide_react5 = require("lucide-react");
 
 // src/components/MessageBubble.tsx
-var import_react5 = __toESM(require("react"));
+var import_react6 = __toESM(require("react"));
 var import_lucide_react4 = require("lucide-react");
 var import_react_markdown = __toESM(require("react-markdown"));
-var import_remark_gfm = __toESM(require("remark-gfm"));
 
 // src/components/SourceCard.tsx
 var import_react = __toESM(require("react"));
@@ -371,175 +370,232 @@ function DynamicChart({
 }
 
 // src/components/VisualizationRenderer.tsx
-var import_image2 = __toESM(require("next/image"));
+var import_react5 = __toESM(require("react"));
+var import_recharts2 = require("recharts");
+var CHART_COLORS = [
+  "#6366f1",
+  // indigo
+  "#10b981",
+  // emerald
+  "#f59e0b",
+  // amber
+  "#ef4444",
+  // red
+  "#8b5cf6",
+  // purple
+  "#ec4899",
+  // pink
+  "#06b6d4",
+  // cyan
+  "#f97316"
+  // orange
+];
+function getColor(index) {
+  return CHART_COLORS[index % CHART_COLORS.length];
+}
+function CustomTooltip({
+  active,
+  payload,
+  label
+}) {
+  if (!active || !payload || payload.length === 0) return null;
+  return /* @__PURE__ */ import_react5.default.createElement("div", { className: "rounded-xl border border-slate-200 bg-white px-3 py-2 text-xs shadow-xl dark:border-white/10 dark:bg-slate-950" }, label && /* @__PURE__ */ import_react5.default.createElement("p", { className: "mb-2 font-semibold text-slate-800 dark:text-white/90" }, label), payload.map((entry, i) => /* @__PURE__ */ import_react5.default.createElement("div", { key: i, className: "flex items-center justify-between gap-3 text-slate-600 dark:text-white/70" }, /* @__PURE__ */ import_react5.default.createElement("span", { className: "flex items-center gap-1.5" }, entry.color && /* @__PURE__ */ import_react5.default.createElement(
+    "span",
+    {
+      className: "inline-block w-2 h-2 rounded-full flex-shrink-0",
+      style: { background: entry.color }
+    }
+  ), entry.name), /* @__PURE__ */ import_react5.default.createElement("span", { className: "font-medium text-slate-900 dark:text-white/90" }, entry.value))));
+}
 function VisualizationRenderer({
   data,
-  className = ""
+  className = "",
+  primaryColor,
+  onAddToCart
 }) {
+  var _a;
   if (!data) {
-    return /* @__PURE__ */ React.createElement("div", { className: `p-4 text-gray-500 ${className}` }, "No data available for visualization");
+    return /* @__PURE__ */ import_react5.default.createElement("div", { className: `p-4 text-gray-500 ${className}` }, "No data available for visualization");
   }
-  return /* @__PURE__ */ React.createElement("div", { className: `space-y-4 ${className}` }, /* @__PURE__ */ React.createElement("div", { className: "space-y-2" }, /* @__PURE__ */ React.createElement("h3", { className: "text-lg font-semibold text-gray-900 dark:text-white" }, data.title), data.description && /* @__PURE__ */ React.createElement("p", { className: "text-sm text-gray-600 dark:text-gray-400" }, data.description)), renderVisualization(data.type, data.data));
+  return /* @__PURE__ */ import_react5.default.createElement("div", { className: `space-y-4 ${className}` }, /* @__PURE__ */ import_react5.default.createElement("div", { className: "space-y-1" }, /* @__PURE__ */ import_react5.default.createElement("h3", { className: "text-sm font-semibold text-slate-900 dark:text-white" }, data.title), data.description && data.description !== ((_a = data.data) == null ? void 0 : _a.content) && /* @__PURE__ */ import_react5.default.createElement("p", { className: "text-xs text-slate-500 dark:text-slate-400" }, data.description)), renderVisualization(data.type, data.data, onAddToCart, primaryColor));
 }
-function renderVisualization(type, data) {
-  switch (type) {
-    case "pie_chart":
-      return renderPieChart(data);
-    case "bar_chart":
-      return renderBarChart(data);
-    case "line_chart":
-      return renderLineChart(data);
-    case "table":
-      return renderTable(data);
-    case "product_carousel":
-      return renderProductCarousel(data);
-    case "text":
-    default:
-      return renderText(data);
+function renderVisualization(type, data, onAddToCart, primaryColor) {
+  try {
+    switch (type) {
+      case "pie_chart":
+        return /* @__PURE__ */ import_react5.default.createElement(PieChartView, { data });
+      case "bar_chart":
+        return /* @__PURE__ */ import_react5.default.createElement(BarChartView, { data, primaryColor });
+      case "line_chart":
+        return /* @__PURE__ */ import_react5.default.createElement(LineChartView, { data, primaryColor });
+      case "radar_chart":
+        return /* @__PURE__ */ import_react5.default.createElement(RadarChartView, { data });
+      case "table":
+        return /* @__PURE__ */ import_react5.default.createElement(TableView, { data });
+      case "product_carousel":
+      case "carousel":
+        return /* @__PURE__ */ import_react5.default.createElement(CarouselView, { data, onAddToCart, primaryColor });
+      case "text":
+      default:
+        return /* @__PURE__ */ import_react5.default.createElement(TextView, { data });
+    }
+  } catch (error) {
+    console.warn("[VisualizationRenderer] Rendering failed, falling back to text:", error);
+    return /* @__PURE__ */ import_react5.default.createElement(TextView, { data: { content: "Unable to render the requested visualization." } });
   }
 }
-function renderPieChart(data) {
-  if (!Array.isArray(data)) {
-    return /* @__PURE__ */ React.createElement("div", { className: "text-red-500" }, "Invalid pie chart data");
+function PieChartView({ data }) {
+  if (!Array.isArray(data) || data.length === 0) {
+    return /* @__PURE__ */ import_react5.default.createElement("div", { className: "text-xs text-red-500" }, "Invalid pie chart data");
   }
-  return /* @__PURE__ */ React.createElement("div", { className: "bg-white dark:bg-gray-800 p-4 rounded-lg shadow" }, /* @__PURE__ */ React.createElement("div", { className: "flex flex-wrap gap-2" }, data.map((item, idx) => /* @__PURE__ */ React.createElement(
-    "div",
+  const chartData = data.map((item) => ({
+    name: item.label,
+    value: item.value
+  }));
+  return /* @__PURE__ */ import_react5.default.createElement("div", { className: "bg-white dark:bg-slate-900 rounded-xl border border-slate-200 dark:border-white/10 p-4 shadow-sm" }, /* @__PURE__ */ import_react5.default.createElement(import_recharts2.ResponsiveContainer, { width: "100%", height: 280 }, /* @__PURE__ */ import_react5.default.createElement(import_recharts2.PieChart, null, /* @__PURE__ */ import_react5.default.createElement(
+    import_recharts2.Pie,
     {
-      key: idx,
-      className: "flex items-center gap-2 p-2 bg-gray-50 dark:bg-gray-700 rounded"
+      data: chartData,
+      dataKey: "value",
+      nameKey: "name",
+      cx: "50%",
+      cy: "50%",
+      outerRadius: "68%",
+      label: false,
+      labelLine: false
     },
-    /* @__PURE__ */ React.createElement(
-      "div",
-      {
-        className: "w-3 h-3 rounded-full",
-        style: { backgroundColor: generateColor(idx) }
-      }
-    ),
-    /* @__PURE__ */ React.createElement("span", { className: "text-sm font-medium text-gray-700 dark:text-gray-300" }, item.label, ": ", item.value),
-    item.inStock !== void 0 && /* @__PURE__ */ React.createElement(
-      "span",
-      {
-        className: `text-xs px-2 py-1 rounded ${item.inStock ? "bg-green-100 text-green-800" : "bg-red-100 text-red-800"}`
-      },
-      item.inStock ? "In Stock" : "Out of Stock"
-    )
-  ))));
+    chartData.map((_entry, index) => /* @__PURE__ */ import_react5.default.createElement(import_recharts2.Cell, { key: `cell-${index}`, fill: getColor(index) }))
+  ), /* @__PURE__ */ import_react5.default.createElement(import_recharts2.Tooltip, { content: /* @__PURE__ */ import_react5.default.createElement(CustomTooltip, null) }), /* @__PURE__ */ import_react5.default.createElement(import_recharts2.Legend, { wrapperStyle: { fontSize: 12 }, verticalAlign: "bottom" }))));
 }
-function renderBarChart(data) {
-  if (!Array.isArray(data)) {
-    return /* @__PURE__ */ React.createElement("div", { className: "text-red-500" }, "Invalid bar chart data");
+function BarChartView({ data, primaryColor }) {
+  if (!Array.isArray(data) || data.length === 0) {
+    return /* @__PURE__ */ import_react5.default.createElement("div", { className: "text-xs text-red-500" }, "Invalid bar chart data");
   }
-  return /* @__PURE__ */ React.createElement("div", { className: "bg-white dark:bg-gray-800 p-4 rounded-lg shadow overflow-x-auto" }, /* @__PURE__ */ React.createElement("div", { className: "space-y-3" }, data.map((item, idx) => /* @__PURE__ */ React.createElement("div", { key: idx, className: "space-y-1" }, /* @__PURE__ */ React.createElement("div", { className: "flex justify-between items-center" }, /* @__PURE__ */ React.createElement("span", { className: "text-sm font-medium text-gray-700 dark:text-gray-300" }, item.category), /* @__PURE__ */ React.createElement("span", { className: "text-sm text-gray-600 dark:text-gray-400" }, item.value)), /* @__PURE__ */ React.createElement("div", { className: "w-full bg-gray-200 dark:bg-gray-700 rounded-full h-2" }, /* @__PURE__ */ React.createElement(
-    "div",
+  const chartData = data.map((item) => __spreadValues(__spreadValues({
+    category: item.category,
+    value: item.value
+  }, 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__ */ import_react5.default.createElement("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" }, /* @__PURE__ */ import_react5.default.createElement(import_recharts2.ResponsiveContainer, { width: "100%", height: 260 }, /* @__PURE__ */ import_react5.default.createElement(import_recharts2.BarChart, { data: chartData, margin: { top: 10, right: 10, left: -20, bottom: 0 } }, /* @__PURE__ */ import_react5.default.createElement(import_recharts2.CartesianGrid, { strokeDasharray: "3 3", vertical: false, stroke: "#e2e8f0" }), /* @__PURE__ */ import_react5.default.createElement(
+    import_recharts2.XAxis,
     {
-      className: "h-full rounded-full transition-all",
-      style: {
-        width: `${item.value / Math.max(...data.map((d) => d.value)) * 100}%`,
-        backgroundColor: generateColor(idx)
-      }
+      dataKey: "category",
+      tick: { fontSize: 11, fill: "#64748b" },
+      tickLine: false,
+      axisLine: { stroke: "#cbd5e1" }
     }
-  )), item.inStock !== void 0 && /* @__PURE__ */ React.createElement(
-    "span",
-    {
-      className: `text-xs px-2 py-1 rounded inline-block ${item.inStock ? "bg-green-100 text-green-800" : "bg-red-100 text-red-800"}`
-    },
-    item.inStock ? "In Stock" : "Out of Stock"
-  )))));
+  ), /* @__PURE__ */ import_react5.default.createElement(import_recharts2.YAxis, { tick: { fontSize: 11, fill: "#64748b" }, tickLine: false, axisLine: false }), /* @__PURE__ */ import_react5.default.createElement(import_recharts2.Tooltip, { content: /* @__PURE__ */ import_react5.default.createElement(CustomTooltip, null), cursor: { fill: "#f1f5f9" } }), /* @__PURE__ */ import_react5.default.createElement(import_recharts2.Legend, { wrapperStyle: { fontSize: 12 } }), hasStock ? /* @__PURE__ */ import_react5.default.createElement(import_react5.default.Fragment, null, /* @__PURE__ */ import_react5.default.createElement(import_recharts2.Bar, { dataKey: "inStockCount", name: "In Stock", fill: getColor(1), radius: [4, 4, 0, 0] }), /* @__PURE__ */ import_react5.default.createElement(import_recharts2.Bar, { dataKey: "outOfStockCount", name: "Out of Stock", fill: getColor(3), radius: [4, 4, 0, 0] })) : /* @__PURE__ */ import_react5.default.createElement(import_recharts2.Bar, { dataKey: "value", name: "Value", fill: barColor, radius: [4, 4, 0, 0] }))));
 }
-function renderLineChart(data) {
-  if (!Array.isArray(data)) {
-    return /* @__PURE__ */ React.createElement("div", { className: "text-red-500" }, "Invalid line chart data");
+function LineChartView({ data, primaryColor }) {
+  if (!Array.isArray(data) || data.length === 0) {
+    return /* @__PURE__ */ import_react5.default.createElement("div", { className: "text-xs text-red-500" }, "Invalid line chart data");
   }
-  return /* @__PURE__ */ React.createElement("div", { className: "bg-white dark:bg-gray-800 p-4 rounded-lg shadow overflow-x-auto" }, /* @__PURE__ */ React.createElement("div", { className: "space-y-2" }, data.map((point, idx) => /* @__PURE__ */ React.createElement(
-    "div",
+  const chartData = data.map((point) => {
+    var _a;
+    return {
+      label: String((_a = point.label) != null ? _a : point.timestamp),
+      value: Number(point.value)
+    };
+  });
+  const lineColor = primaryColor != null ? primaryColor : getColor(0);
+  return /* @__PURE__ */ import_react5.default.createElement("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" }, /* @__PURE__ */ import_react5.default.createElement(import_recharts2.ResponsiveContainer, { width: "100%", height: 260 }, /* @__PURE__ */ import_react5.default.createElement(import_recharts2.LineChart, { data: chartData, margin: { top: 10, right: 10, left: -20, bottom: 0 } }, /* @__PURE__ */ import_react5.default.createElement(import_recharts2.CartesianGrid, { strokeDasharray: "3 3", vertical: false, stroke: "#e2e8f0" }), /* @__PURE__ */ import_react5.default.createElement(
+    import_recharts2.XAxis,
     {
-      key: idx,
-      className: "flex justify-between items-center p-2 bg-gray-50 dark:bg-gray-700 rounded"
-    },
-    /* @__PURE__ */ React.createElement("span", { className: "text-sm text-gray-600 dark:text-gray-400" }, point.label || point.timestamp),
-    /* @__PURE__ */ React.createElement("span", { className: "text-sm font-semibold text-gray-900 dark:text-white" }, typeof point.value === "number" ? point.value.toFixed(2) : point.value)
+      dataKey: "label",
+      tick: { fontSize: 11, fill: "#64748b" },
+      tickLine: false,
+      axisLine: { stroke: "#cbd5e1" }
+    }
+  ), /* @__PURE__ */ import_react5.default.createElement(import_recharts2.YAxis, { tick: { fontSize: 11, fill: "#64748b" }, tickLine: false, axisLine: false }), /* @__PURE__ */ import_react5.default.createElement(import_recharts2.Tooltip, { content: /* @__PURE__ */ import_react5.default.createElement(CustomTooltip, null) }), /* @__PURE__ */ import_react5.default.createElement(
+    import_recharts2.Line,
+    {
+      type: "monotone",
+      dataKey: "value",
+      name: "Value",
+      stroke: lineColor,
+      strokeWidth: 2.5,
+      dot: { r: 3.5, strokeWidth: 2, fill: lineColor },
+      activeDot: { r: 5 }
+    }
   ))));
 }
-function renderTable(data) {
-  if (!data.columns || !data.rows) {
-    return /* @__PURE__ */ React.createElement("div", { className: "text-red-500" }, "Invalid table data");
+function RadarChartView({ data }) {
+  if (!Array.isArray(data) || data.length === 0) {
+    return /* @__PURE__ */ import_react5.default.createElement("div", { className: "text-xs text-red-500" }, "Invalid radar chart data");
   }
-  return /* @__PURE__ */ React.createElement("div", { className: "bg-white dark:bg-gray-800 rounded-lg shadow overflow-x-auto" }, /* @__PURE__ */ React.createElement("table", { className: "w-full text-sm" }, /* @__PURE__ */ React.createElement("thead", { className: "bg-gray-100 dark:bg-gray-700 border-b border-gray-200 dark:border-gray-600" }, /* @__PURE__ */ React.createElement("tr", null, data.columns.map((col, idx) => /* @__PURE__ */ React.createElement(
+  const productNames = Array.from(
+    new Set(data.flatMap((item) => Object.keys(item).filter((key) => key !== "attribute")))
+  );
+  return /* @__PURE__ */ import_react5.default.createElement("div", { className: "bg-white dark:bg-slate-900 rounded-xl border border-slate-200 dark:border-white/10 p-4 shadow-sm" }, /* @__PURE__ */ import_react5.default.createElement(import_recharts2.ResponsiveContainer, { width: "100%", height: 300 }, /* @__PURE__ */ import_react5.default.createElement(import_recharts2.RadarChart, { cx: "50%", cy: "50%", outerRadius: "80%", data }, /* @__PURE__ */ import_react5.default.createElement(import_recharts2.PolarGrid, { stroke: "#e2e8f0" }), /* @__PURE__ */ import_react5.default.createElement(import_recharts2.PolarAngleAxis, { dataKey: "attribute", tick: { fontSize: 11, fill: "#64748b" } }), /* @__PURE__ */ import_react5.default.createElement(import_recharts2.PolarRadiusAxis, { tick: { fontSize: 10, fill: "#64748b" } }), productNames.map((productName, index) => /* @__PURE__ */ import_react5.default.createElement(
+    import_recharts2.Radar,
+    {
+      key: productName,
+      name: productName,
+      dataKey: productName,
+      stroke: getColor(index),
+      fill: getColor(index),
+      fillOpacity: 0.4
+    }
+  )), /* @__PURE__ */ import_react5.default.createElement(import_recharts2.Tooltip, { content: /* @__PURE__ */ import_react5.default.createElement(CustomTooltip, null) }), /* @__PURE__ */ import_react5.default.createElement(import_recharts2.Legend, { wrapperStyle: { fontSize: 12 } }))));
+}
+function TableView({ data }) {
+  if (!(data == null ? void 0 : data.columns) || !(data == null ? void 0 : data.rows)) {
+    return /* @__PURE__ */ import_react5.default.createElement("div", { className: "text-xs text-red-500" }, "Invalid table data");
+  }
+  return /* @__PURE__ */ import_react5.default.createElement("div", { className: "bg-white dark:bg-slate-900 rounded-xl border border-slate-200 dark:border-white/10 shadow-sm overflow-hidden" }, /* @__PURE__ */ import_react5.default.createElement("div", { className: "overflow-x-auto" }, /* @__PURE__ */ import_react5.default.createElement("table", { className: "w-full text-sm border-collapse" }, /* @__PURE__ */ import_react5.default.createElement("thead", { className: "bg-slate-50 dark:bg-white/5 border-b border-slate-200 dark:border-white/10" }, /* @__PURE__ */ import_react5.default.createElement("tr", null, data.columns.map((col, idx) => /* @__PURE__ */ import_react5.default.createElement(
     "th",
     {
       key: idx,
-      className: "px-4 py-2 text-left font-semibold text-gray-900 dark:text-white"
+      className: "px-4 py-3 text-left text-xs font-semibold text-slate-700 dark:text-white/90 whitespace-nowrap uppercase tracking-wider"
     },
     col
-  )))), /* @__PURE__ */ React.createElement("tbody", { className: "divide-y divide-gray-200 dark:divide-gray-600" }, data.rows.map((row, rowIdx) => /* @__PURE__ */ React.createElement(
+  )))), /* @__PURE__ */ import_react5.default.createElement("tbody", { className: "divide-y divide-slate-100 dark:divide-white/5" }, data.rows.map((row, rowIdx) => /* @__PURE__ */ import_react5.default.createElement(
     "tr",
     {
       key: rowIdx,
-      className: "hover:bg-gray-50 dark:hover:bg-gray-700 transition-colors"
+      className: "hover:bg-slate-50/60 dark:hover:bg-white/5 transition-colors"
     },
-    row.map((cell, cellIdx) => /* @__PURE__ */ React.createElement(
+    row.map((cell, cellIdx) => /* @__PURE__ */ import_react5.default.createElement(
       "td",
       {
         key: cellIdx,
-        className: "px-4 py-2 text-gray-700 dark:text-gray-300"
+        className: "px-4 py-3 text-slate-600 dark:text-white/70 text-sm"
       },
       String(cell)
     ))
-  )))));
+  ))))), /* @__PURE__ */ import_react5.default.createElement("div", { className: "px-4 py-2 bg-slate-50 dark:bg-white/5 border-t border-slate-100 dark:border-white/5" }, /* @__PURE__ */ import_react5.default.createElement("p", { className: "text-[11px] text-slate-400 dark:text-white/30" }, data.rows.length, " row", data.rows.length !== 1 ? "s" : "")));
 }
-function renderProductCarousel(data) {
+function CarouselView({
+  data,
+  onAddToCart,
+  primaryColor
+}) {
   if (!Array.isArray(data)) {
-    return /* @__PURE__ */ React.createElement("div", { className: "text-red-500" }, "Invalid carousel data");
+    return /* @__PURE__ */ import_react5.default.createElement("div", { className: "text-xs text-red-500" }, "Invalid carousel data");
   }
-  return /* @__PURE__ */ React.createElement("div", { className: "overflow-x-auto" }, /* @__PURE__ */ React.createElement("div", { className: "flex gap-4 pb-4" }, data.map((product) => /* @__PURE__ */ React.createElement(
-    "div",
+  const products = data.map((product) => ({
+    id: product.id,
+    name: product.name,
+    brand: product.brand,
+    price: product.price,
+    image: product.image,
+    link: typeof product.link === "string" ? product.link : void 0,
+    description: product.description,
+    inStock: product.inStock
+  }));
+  return /* @__PURE__ */ import_react5.default.createElement("div", { className: "w-full" }, /* @__PURE__ */ import_react5.default.createElement(
+    ProductCarousel,
     {
-      key: product.id,
-      className: "flex-shrink-0 w-64 bg-white dark:bg-gray-800 rounded-lg shadow-md overflow-hidden hover:shadow-lg transition-shadow"
-    },
-    product.image && /* @__PURE__ */ React.createElement("div", { className: "relative w-full h-40 bg-gray-200" }, /* @__PURE__ */ React.createElement(
-      import_image2.default,
-      {
-        src: product.image,
-        alt: product.name,
-        fill: true,
-        className: "object-cover",
-        sizes: "(max-width: 768px) 100vw, (max-width: 1200px) 50vw, 33vw"
-      }
-    )),
-    /* @__PURE__ */ React.createElement("div", { className: "p-4 space-y-2" }, /* @__PURE__ */ React.createElement("h4", { className: "font-semibold text-gray-900 dark:text-white line-clamp-2" }, product.name), product.brand && /* @__PURE__ */ React.createElement("p", { className: "text-xs text-gray-500 dark:text-gray-400" }, "Brand: ", product.brand), product.price && /* @__PURE__ */ React.createElement("p", { className: "text-lg font-bold text-gray-900 dark:text-white" }, "$", typeof product.price === "number" ? product.price.toFixed(2) : product.price), product.description && /* @__PURE__ */ React.createElement("p", { className: "text-sm text-gray-600 dark:text-gray-400 line-clamp-2" }, product.description), /* @__PURE__ */ React.createElement("div", { className: "flex gap-2 pt-2" }, /* @__PURE__ */ React.createElement(
-      "span",
-      {
-        className: `text-xs px-2 py-1 rounded flex-1 text-center ${product.inStock ? "bg-green-100 text-green-800" : "bg-red-100 text-red-800"}`
-      },
-      product.inStock ? "In Stock" : "Out of Stock"
-    )))
-  ))));
-}
-function renderText(data) {
-  const content = (data == null ? void 0 : data.content) || String(data);
-  return /* @__PURE__ */ React.createElement("div", { className: "bg-white dark:bg-gray-800 p-4 rounded-lg shadow prose dark:prose-invert max-w-none" }, /* @__PURE__ */ React.createElement("p", { className: "text-gray-700 dark:text-gray-300 whitespace-pre-wrap" }, content));
+      products,
+      primaryColor: primaryColor != null ? primaryColor : "#6366f1",
+      onAddToCart: (p) => onAddToCart == null ? void 0 : onAddToCart(p)
+    }
+  ));
 }
-function generateColor(index) {
-  const colors = [
-    "#3B82F6",
-    // blue
-    "#10B981",
-    // green
-    "#F59E0B",
-    // amber
-    "#EF4444",
-    // red
-    "#8B5CF6",
-    // purple
-    "#EC4899",
-    // pink
-    "#06B6D4",
-    // cyan
-    "#F97316"
-    // orange
-  ];
-  return colors[index % colors.length];
+function TextView({ data }) {
+  const content = (data == null ? void 0 : data.content) || String(data != null ? data : "");
+  return /* @__PURE__ */ import_react5.default.createElement("div", { className: "bg-white dark:bg-slate-900 rounded-xl border border-slate-200 dark:border-white/10 p-4 shadow-sm" }, /* @__PURE__ */ import_react5.default.createElement("p", { className: "text-sm text-slate-700 dark:text-slate-300 whitespace-pre-wrap leading-relaxed" }, content));
 }
 
 // src/components/MessageBubble.tsx
@@ -623,41 +679,51 @@ function stripStructuredUiLabels(raw) {
   );
 }
 function extractBareJsonObject(raw) {
-  const start = raw.indexOf("{");
+  let start = raw.indexOf("{");
   if (start === -1) return null;
-  let depth = 0;
-  let inString = false;
-  let escape = false;
-  for (let i = start; i < raw.length; i += 1) {
-    const ch = raw[i];
-    if (escape) {
-      escape = false;
-      continue;
-    }
-    if (ch === "\\" && inString) {
-      escape = true;
-      continue;
-    }
-    if (ch === '"') {
-      inString = !inString;
-      continue;
-    }
-    if (inString) continue;
-    if (ch === "{") depth += 1;
-    if (ch === "}") {
-      depth -= 1;
-      if (depth === 0) {
-        return raw.slice(start, i + 1);
+  let bestJson = null;
+  let maxLen = 0;
+  while (start !== -1) {
+    let depth = 0;
+    let inString = false;
+    let escape = false;
+    for (let i = start; i < raw.length; i += 1) {
+      const ch = raw[i];
+      if (escape) {
+        escape = false;
+        continue;
+      }
+      if (ch === "\\" && inString) {
+        escape = true;
+        continue;
+      }
+      if (ch === '"') {
+        inString = !inString;
+        continue;
+      }
+      if (inString) continue;
+      if (ch === "{") depth += 1;
+      else if (ch === "}") {
+        depth -= 1;
+        if (depth === 0) {
+          const candidate = raw.slice(start, i + 1);
+          if (candidate.length > maxLen) {
+            maxLen = candidate.length;
+            bestJson = candidate;
+          }
+          break;
+        }
       }
     }
+    start = raw.indexOf("{", start + 1);
   }
-  return null;
+  return bestJson;
 }
 function extractStructuredPayload(raw) {
   var _a, _b;
   let working = raw;
   const fenceRegex = /```(?:[a-z]+)?\s*([\s\S]*?)```/gi;
-  for (const match of raw.matchAll(fenceRegex)) {
+  for (const match of Array.from(raw.matchAll(fenceRegex))) {
     const body = (_b = (_a = match[1]) == null ? void 0 : _a.trim()) != null ? _b : "";
     if (!looksLikeStructuredPayload(body)) continue;
     working = working.replace(match[0], "");
@@ -681,21 +747,30 @@ function extractStructuredPayload(raw) {
 }
 function isLikelyUiOnlyMessage(text) {
   const trimmed = text.trim();
-  return trimmed.length === 0 || /^(chart data|table data|visualization|visual representation|product catalog|product recommendations|catalog summary)\s*:?\s*$/i.test(trimmed);
+  return trimmed.length === 0 || trimmed.length < 30 || /^(chart data|table data|visualization|visual representation|product catalog|product recommendations|catalog summary|availability|inventory status|details)\s*:?\s*$/i.test(trimmed);
 }
 function resolveImage(data) {
   const isPlaceholder = (val) => typeof val === "string" && (val === "..." || val === "" || val.toLowerCase() === "null" || val.toLowerCase() === "undefined");
-  for (const key of ["image", "img", "thumbnail"]) {
+  for (const key of ["image", "img", "thumbnail", "images", "product_image", "Image", "Thumbnail"]) {
     const v = data[key];
     if (typeof v === "string" && v && !isPlaceholder(v)) return v;
-  }
-  if (Array.isArray(data.images) && typeof data.images[0] === "string" && !isPlaceholder(data.images[0])) {
-    return data.images[0];
+    if (Array.isArray(v) && typeof v[0] === "string" && v[0] && !isPlaceholder(v[0])) return v[0];
   }
   return void 0;
 }
+function getMetadataValue(meta, keys) {
+  const searchKeys = keys.map((k) => k.toLowerCase());
+  const metaKeys = Object.keys(meta);
+  const foundKey = metaKeys.find((k) => searchKeys.includes(k.toLowerCase()));
+  if (foundKey) return meta[foundKey];
+  const partialKey = metaKeys.find((k) => {
+    const kLow = k.toLowerCase();
+    return searchKeys.some((sk) => kLow.includes(sk) || sk.includes(kLow));
+  });
+  return partialKey ? meta[partialKey] : void 0;
+}
 function normaliseChild(children) {
-  if (typeof children === "object" && children !== null && !Array.isArray(children) && !import_react5.default.isValidElement(children)) {
+  if (typeof children === "object" && children !== null && !Array.isArray(children) && !import_react6.default.isValidElement(children)) {
     return JSON.stringify(children);
   }
   return children;
@@ -709,7 +784,7 @@ function formatColumnLabel(value) {
 function DataTable({ config, viewportSize = "large" }) {
   const isCompact = viewportSize === "compact";
   const isMedium = viewportSize === "medium";
-  const columns = import_react5.default.useMemo(() => {
+  const columns = import_react6.default.useMemo(() => {
     const rowKeys = Array.from(
       new Set(
         config.data.flatMap((row) => Object.keys(row))
@@ -739,27 +814,27 @@ function DataTable({ config, viewportSize = "large" }) {
     return rowKeys.map((key) => ({ label: formatColumnLabel(key), accessor: key }));
   }, [config]);
   if (!config.data.length || !columns.length) {
-    return /* @__PURE__ */ import_react5.default.createElement("p", { className: "text-xs text-slate-400 italic my-2" }, "No data to display.");
+    return /* @__PURE__ */ import_react6.default.createElement("p", { className: "text-xs text-slate-400 italic my-2" }, "No data to display.");
   }
   const formatCell = (val) => {
     if (val === null || val === void 0) return "\u2014";
     if (typeof val === "boolean") return val ? "\u2713" : "\u2717";
     return String(val);
   };
-  return /* @__PURE__ */ import_react5.default.createElement("div", { className: "my-4 rounded-xl border border-slate-200 dark:border-white/10 shadow-sm overflow-hidden" }, config.title && /* @__PURE__ */ import_react5.default.createElement("div", { className: "px-4 py-2.5 bg-slate-50 dark:bg-white/5 border-b border-slate-200 dark:border-white/10" }, /* @__PURE__ */ import_react5.default.createElement("p", { className: "text-xs font-semibold text-slate-600 dark:text-white/70 uppercase tracking-wide" }, config.title)), /* @__PURE__ */ import_react5.default.createElement("div", { className: "overflow-x-auto" }, /* @__PURE__ */ import_react5.default.createElement("table", { className: `w-full text-left border-collapse ${isCompact ? "min-w-[240px] text-xs" : isMedium ? "min-w-[280px] text-[13px]" : "min-w-[320px] text-sm"}` }, /* @__PURE__ */ import_react5.default.createElement("thead", { className: "bg-slate-50 dark:bg-white/5 border-b border-slate-200 dark:border-white/10" }, /* @__PURE__ */ import_react5.default.createElement("tr", null, columns.map((column) => /* @__PURE__ */ import_react5.default.createElement(
+  return /* @__PURE__ */ import_react6.default.createElement("div", { className: "my-4 rounded-xl border border-slate-200 dark:border-white/10 shadow-sm overflow-hidden" }, config.title && /* @__PURE__ */ import_react6.default.createElement("div", { className: "px-4 py-2.5 bg-slate-50 dark:bg-white/5 border-b border-slate-200 dark:border-white/10" }, /* @__PURE__ */ import_react6.default.createElement("p", { className: "text-xs font-semibold text-slate-600 dark:text-white/70 uppercase tracking-wide" }, config.title)), /* @__PURE__ */ import_react6.default.createElement("div", { className: "overflow-x-auto" }, /* @__PURE__ */ import_react6.default.createElement("table", { className: `w-full text-left border-collapse ${isCompact ? "min-w-[240px] text-xs" : isMedium ? "min-w-[280px] text-[13px]" : "min-w-[320px] text-sm"}` }, /* @__PURE__ */ import_react6.default.createElement("thead", { className: "bg-slate-50 dark:bg-white/5 border-b border-slate-200 dark:border-white/10" }, /* @__PURE__ */ import_react6.default.createElement("tr", null, columns.map((column) => /* @__PURE__ */ import_react6.default.createElement(
     "th",
     {
       key: column.label,
       className: `${isCompact ? "px-2.5 py-2" : "px-4 py-3"} font-semibold text-slate-700 dark:text-white/90 whitespace-nowrap`
     },
     column.label
-  )))), /* @__PURE__ */ import_react5.default.createElement("tbody", null, config.data.map((row, ri) => /* @__PURE__ */ import_react5.default.createElement(
+  )))), /* @__PURE__ */ import_react6.default.createElement("tbody", null, config.data.map((row, ri) => /* @__PURE__ */ import_react6.default.createElement(
     "tr",
     {
       key: ri,
       className: "border-b border-slate-100 dark:border-white/5 last:border-0 hover:bg-slate-50/60 dark:hover:bg-white/5 transition-colors"
     },
-    columns.map((column) => /* @__PURE__ */ import_react5.default.createElement(
+    columns.map((column) => /* @__PURE__ */ import_react6.default.createElement(
       "td",
       {
         key: column.label,
@@ -767,10 +842,17 @@ function DataTable({ config, viewportSize = "large" }) {
       },
       formatCell(row[column.accessor])
     ))
-  ))))), /* @__PURE__ */ import_react5.default.createElement("div", { className: "px-4 py-2 bg-slate-50 dark:bg-white/5 border-t border-slate-100 dark:border-white/5" }, /* @__PURE__ */ import_react5.default.createElement("p", { className: "text-[11px] text-slate-400 dark:text-white/30" }, config.data.length, " row", config.data.length !== 1 ? "s" : "")));
+  ))))), /* @__PURE__ */ import_react6.default.createElement("div", { className: "px-4 py-2 bg-slate-50 dark:bg-white/5 border-t border-slate-100 dark:border-white/5" }, /* @__PURE__ */ import_react6.default.createElement("p", { className: "text-[11px] text-slate-400 dark:text-white/30" }, config.data.length, " row", config.data.length !== 1 ? "s" : "")));
 }
 function normalizeTabularRows(rows, columns) {
   if (!Array.isArray(rows)) return [];
+  const SYNONYMS = {
+    name: ["product", "item", "title", "label", "heading", "product name", "item name"],
+    price: ["cost", "amount", "msrp", "price", "rate", "value", "price_usd"],
+    brand: ["manufacturer", "vendor", "make", "company", "brand_name", "supplier"],
+    image: ["imageUrl", "thumbnail", "img", "url", "photo", "picture", "media"],
+    stock: ["inventory", "quantity", "count", "availability", "stock_level", "in stock", "status"]
+  };
   return rows.map((row) => {
     if (Array.isArray(row)) {
       const keys = Array.isArray(columns) && columns.length > 0 ? columns : row.map((_, index) => `column_${index + 1}`);
@@ -780,7 +862,36 @@ function normalizeTabularRows(rows, columns) {
       }, {});
     }
     if (row && typeof row === "object") {
-      return row;
+      const result = __spreadValues({}, row);
+      if (Array.isArray(columns)) {
+        columns.forEach((col) => {
+          if (result[col] !== void 0) return;
+          const rowKeys = Object.keys(row);
+          const colLower = col.toLowerCase().replace(/_/g, " ");
+          const foundKey = rowKeys.find((rk) => {
+            const rkLower = rk.toLowerCase().replace(/_/g, " ");
+            return rkLower === colLower || rkLower.includes(colLower) || colLower.includes(rkLower);
+          });
+          if (foundKey) {
+            result[col] = row[foundKey];
+            return;
+          }
+          for (const [target, aliases] of Object.entries(SYNONYMS)) {
+            const isMatch = target === colLower || aliases.some((a) => colLower.includes(a) || a.includes(colLower));
+            if (isMatch) {
+              const mappedKey = rowKeys.find((rk) => {
+                const rkL = rk.toLowerCase();
+                return rkL === target || aliases.some((a) => rkL.includes(a) || a.includes(rkL));
+              });
+              if (mappedKey) {
+                result[col] = row[mappedKey];
+                break;
+              }
+            }
+          }
+        });
+      }
+      return result;
     }
     return { value: row };
   }).filter((row) => Object.keys(row).length > 0);
@@ -800,7 +911,7 @@ function resolveStructuredRows(config) {
 }
 function UIDispatcher({ rawContent, primaryColor, accentColor, isStreaming, onAddToCart, viewportSize = "large" }) {
   var _a;
-  const result = import_react5.default.useMemo(() => {
+  const result = import_react6.default.useMemo(() => {
     if (isStreaming) return { loading: true };
     try {
       const clean = rawContent.replace(/^```[a-z]*\s*/i, "").replace(/```\s*$/, "").trim();
@@ -845,10 +956,10 @@ function UIDispatcher({ rawContent, primaryColor, accentColor, isStreaming, onAd
     }
   }, [rawContent, isStreaming]);
   if ("loading" in result) {
-    return /* @__PURE__ */ import_react5.default.createElement("div", { className: "my-4 p-8 bg-slate-50 dark:bg-white/5 rounded-xl border border-dashed border-slate-300 dark:border-white/10 flex flex-col items-center justify-center gap-3 animate-pulse" }, /* @__PURE__ */ import_react5.default.createElement("div", { className: "w-5 h-5 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" }, "Preparing view..."));
+    return /* @__PURE__ */ import_react6.default.createElement("div", { className: "my-4 p-8 bg-slate-50 dark:bg-white/5 rounded-xl border border-dashed border-slate-300 dark:border-white/10 flex flex-col items-center justify-center gap-3 animate-pulse" }, /* @__PURE__ */ import_react6.default.createElement("div", { className: "w-5 h-5 border-2 border-indigo-500 border-t-transparent rounded-full animate-spin" }), /* @__PURE__ */ import_react6.default.createElement("p", { className: "text-xs text-slate-500 font-medium italic" }, "Preparing view..."));
   }
   if ("error" in result) {
-    return /* @__PURE__ */ import_react5.default.createElement("pre", { className: "p-4 my-2 bg-slate-900 text-slate-100 rounded-lg text-[10px] overflow-auto max-h-40" }, /* @__PURE__ */ import_react5.default.createElement("code", null, rawContent));
+    return /* @__PURE__ */ import_react6.default.createElement("pre", { className: "p-4 my-2 bg-slate-900 text-slate-100 rounded-lg text-[10px] overflow-auto max-h-40" }, /* @__PURE__ */ import_react6.default.createElement("code", null, rawContent));
   }
   const { config } = result;
   const isCompact = viewportSize === "compact";
@@ -856,7 +967,7 @@ function UIDispatcher({ rawContent, primaryColor, accentColor, isStreaming, onAd
   const hasDescription = typeof config.description === "string" && config.description.trim().length > 0;
   switch (config.view) {
     case "chart":
-      return /* @__PURE__ */ import_react5.default.createElement("div", { className: `${isCompact ? "my-4 p-3" : "my-6 p-4"} bg-white dark:bg-slate-900 rounded-2xl border border-slate-200 dark:border-white/10 shadow-sm overflow-hidden` }, config.title && /* @__PURE__ */ import_react5.default.createElement("h4", { className: `${isCompact ? "text-[11px] mb-3" : "text-xs mb-4"} font-semibold text-slate-500 px-2` }, config.title), hasDescription && /* @__PURE__ */ import_react5.default.createElement("p", { className: `px-2 ${isCompact ? "text-xs" : "text-sm"} text-slate-500 dark:text-white/60` }, config.description), /* @__PURE__ */ import_react5.default.createElement(
+      return /* @__PURE__ */ import_react6.default.createElement("div", { className: `${isCompact ? "my-4 p-3" : "my-6 p-4"} bg-white dark:bg-slate-900 rounded-2xl border border-slate-200 dark:border-white/10 shadow-sm overflow-hidden` }, config.title && /* @__PURE__ */ import_react6.default.createElement("h4", { className: `${isCompact ? "text-[11px] mb-3" : "text-xs mb-4"} font-semibold text-slate-500 px-2` }, config.title), hasDescription && /* @__PURE__ */ import_react6.default.createElement("p", { className: `px-2 ${isCompact ? "text-xs" : "text-sm"} text-slate-500 dark:text-white/60` }, config.description), /* @__PURE__ */ import_react6.default.createElement(
         DynamicChart,
         {
           config: {
@@ -870,7 +981,7 @@ function UIDispatcher({ rawContent, primaryColor, accentColor, isStreaming, onAd
           accentColor,
           viewportSize
         }
-      ), hasInsights && /* @__PURE__ */ import_react5.default.createElement("div", { className: "mt-4 flex flex-wrap gap-2 px-2" }, (_a = config.insights) == null ? void 0 : _a.map((insight, i) => /* @__PURE__ */ import_react5.default.createElement(
+      ), hasInsights && /* @__PURE__ */ import_react6.default.createElement("div", { className: "mt-4 flex flex-wrap gap-2 px-2" }, (_a = config.insights) == null ? void 0 : _a.map((insight, i) => /* @__PURE__ */ import_react6.default.createElement(
         "span",
         {
           key: `insight-${i}`,
@@ -879,14 +990,14 @@ function UIDispatcher({ rawContent, primaryColor, accentColor, isStreaming, onAd
         String(insight)
       ))));
     case "carousel":
-      return /* @__PURE__ */ import_react5.default.createElement("div", { className: "my-4" }, config.title && /* @__PURE__ */ import_react5.default.createElement("h4", { className: `${isCompact ? "mb-1.5 text-[11px]" : "mb-2 text-xs"} font-semibold text-slate-500` }, config.title), hasDescription && /* @__PURE__ */ import_react5.default.createElement("p", { className: `mb-3 ${isCompact ? "text-xs" : "text-sm"} text-slate-500 dark:text-white/60` }, config.description), /* @__PURE__ */ import_react5.default.createElement(ProductCarousel, { products: config.data.map((item) => {
+      return /* @__PURE__ */ import_react6.default.createElement("div", { className: "my-4" }, config.title && /* @__PURE__ */ import_react6.default.createElement("h4", { className: `${isCompact ? "mb-1.5 text-[11px]" : "mb-2 text-xs"} font-semibold text-slate-500` }, config.title), hasDescription && /* @__PURE__ */ import_react6.default.createElement("p", { className: `mb-3 ${isCompact ? "text-xs" : "text-sm"} text-slate-500 dark:text-white/60` }, config.description), /* @__PURE__ */ import_react6.default.createElement(ProductCarousel, { products: config.data.map((item) => {
         var _a2;
         return __spreadProps(__spreadValues({}, item), {
           image: (_a2 = item.image) != null ? _a2 : typeof resolveImage === "function" ? resolveImage(item) : void 0
         });
       }), primaryColor, onAddToCart }));
     case "table":
-      return /* @__PURE__ */ import_react5.default.createElement("div", { className: `${isCompact ? "my-3 p-3 max-h-[320px]" : "my-4 p-4 max-h-[400px]"} bg-white dark:bg-slate-900 rounded-xl border border-slate-200 dark:border-white/10 shadow-sm overflow-auto` }, config.title && /* @__PURE__ */ import_react5.default.createElement("h4", { className: `${isCompact ? "text-[11px]" : "text-xs"} font-semibold text-slate-500 mb-2` }, config.title), hasDescription && /* @__PURE__ */ import_react5.default.createElement("p", { className: `mb-3 ${isCompact ? "text-xs" : "text-sm"} text-slate-500 dark:text-white/60` }, config.description), /* @__PURE__ */ import_react5.default.createElement(DataTable, { config: {
+      return /* @__PURE__ */ import_react6.default.createElement("div", { className: `${isCompact ? "my-3 p-3 max-h-[320px]" : "my-4 p-4 max-h-[400px]"} bg-white dark:bg-slate-900 rounded-xl border border-slate-200 dark:border-white/10 shadow-sm overflow-auto` }, config.title && /* @__PURE__ */ import_react6.default.createElement("h4", { className: `${isCompact ? "text-[11px]" : "text-xs"} font-semibold text-slate-500 mb-2` }, config.title), hasDescription && /* @__PURE__ */ import_react6.default.createElement("p", { className: `mb-3 ${isCompact ? "text-xs" : "text-sm"} text-slate-500 dark:text-white/60` }, config.description), /* @__PURE__ */ import_react6.default.createElement(DataTable, { config: {
         type: "table",
         title: config.title,
         description: config.description,
@@ -911,44 +1022,59 @@ function MessageBubble({
   const isUser = message.role === "user";
   const isCompact = viewportSize === "compact";
   const isMedium = viewportSize === "medium";
-  const [showSources, setShowSources] = import_react5.default.useState(false);
-  const hasStructuredProductBlock = import_react5.default.useMemo(
-    () => /```(?:ui|json|chart)\s*[\s\S]*?"?(?:view|type|data|products)"?\s*:\s*"?(?:carousel|products|table)"?/i.test(message.content) || /\{[\s\S]*?"?(?:view|type|data|products)"?\s*:\s*"?(?:carousel|products)"?[\s\S]*\}/i.test(message.content) && looksLikeStructuredPayload(message.content),
-    [message.content]
-  );
-  const structuredContent = import_react5.default.useMemo(
+  const [showSources, setShowSources] = import_react6.default.useState(false);
+  const structuredContent = import_react6.default.useMemo(
     () => isUser ? { payload: null, text: message.content } : extractStructuredPayload(message.content),
     [isUser, message.content]
   );
-  const shouldRenderStructuredOnly = !isUser && Boolean(structuredContent.payload) && isLikelyUiOnlyMessage(structuredContent.text);
-  const productsFromSources = import_react5.default.useMemo(() => {
+  const hasRichUI = import_react6.default.useMemo(() => {
+    if (message.uiTransformation) {
+      const type = message.uiTransformation.type;
+      if (type && !["text", "table"].includes(type)) return true;
+    }
+    if (structuredContent.payload) {
+      return /"?(?:view|type|chartType)"?\s*:\s*"?(?:chart|carousel|pie|bar|line|product_carousel)"?/i.test(structuredContent.payload);
+    }
+    return false;
+  }, [message.uiTransformation, structuredContent.payload]);
+  const shouldRenderStructuredOnly = !isUser && hasRichUI && isLikelyUiOnlyMessage(structuredContent.text);
+  const productsFromSources = import_react6.default.useMemo(() => {
     if (isUser || !sources) return [];
     return sources.filter((s) => {
       var _a;
       const m = (_a = s.metadata) != null ? _a : {};
-      return m.price || m.image || m.img || m.thumbnail || m.images || m.brand || m.type === "product";
+      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 hasPricePattern = /\$\s*\d+/.test(s.content);
+      return hasProductKey || hasPricePattern || m.type === "product";
     }).map((s) => {
-      var _a, _b, _c, _d;
+      var _a, _b;
       const m = (_a = s.metadata) != null ? _a : {};
+      const name = getMetadataValue(m, ["name", "product", "title", "label", "item"]);
+      const brand = getMetadataValue(m, ["brand", "manufacturer", "vendor", "make"]);
+      const price = getMetadataValue(m, ["price", "cost", "amount", "msrp", "rate"]);
       return {
         id: s.id,
-        name: (_d = (_c = (_b = m.name) != null ? _b : m.title) != null ? _c : s.content.split("\n")[0]) != null ? _d : "Unknown Product",
-        brand: m.brand,
-        price: m.price,
+        name: (_b = name != null ? name : s.content.split("\n")[0]) != null ? _b : "Unknown Product",
+        brand,
+        price,
         image: resolveImage(m),
-        link: m.link,
+        link: getMetadataValue(m, ["link", "url", "product_url"]),
         description: s.content
       };
     });
   }, [sources, isUser]);
-  const { productsFromContent, cleanContent } = import_react5.default.useMemo(() => {
+  const { productsFromContent, cleanContent } = import_react6.default.useMemo(() => {
+    var _a, _b;
     if (isUser) {
       return { productsFromContent: [], cleanContent: message.content };
     }
     const jsonRegex = /```(?:json|ui)?\s*([\s\S]*?)\s*```/g;
     const products = [];
     let content = structuredContent.text;
-    const payloadCandidates = [structuredContent.payload, ...content.matchAll(jsonRegex).map((match) => match[1])].filter(Boolean);
+    const payloadCandidates = [structuredContent.payload, ...Array.from(content.matchAll(jsonRegex)).map((match) => match[1])].filter(Boolean);
     for (const candidate of payloadCandidates) {
       try {
         const data = JSON.parse(sanitizeJson(candidate));
@@ -956,9 +1082,9 @@ function MessageBubble({
         if ((data.type === "products" || data.view === "carousel" || data.view === "table" || Array.isArray(data.products)) && itemSet) {
           products.push(
             ...itemSet.map((item) => {
-              var _a;
+              var _a2;
               return __spreadProps(__spreadValues({}, item), {
-                image: (_a = item.image) != null ? _a : resolveImage(item)
+                image: (_a2 = item.image) != null ? _a2 : resolveImage(item)
               });
             })
           );
@@ -967,15 +1093,15 @@ function MessageBubble({
       }
     }
     if (content.includes('"type": "products"') || content.includes('"type":"products"')) {
-      for (const match of content.matchAll(jsonRegex)) {
+      for (const match of Array.from(content.matchAll(jsonRegex))) {
         try {
           const data = JSON.parse(sanitizeJson(match[1]));
           if (data.type === "products" && Array.isArray(data.items)) {
             products.push(
               ...data.items.map((item) => {
-                var _a;
+                var _a2;
                 return __spreadProps(__spreadValues({}, item), {
-                  image: (_a = item.image) != null ? _a : resolveImage(item)
+                  image: (_a2 = item.image) != null ? _a2 : resolveImage(item)
                 });
               })
             );
@@ -985,9 +1111,42 @@ function MessageBubble({
         }
       }
     }
+    const bulletRegex = /(?:[•*-]\s*)?([^•\n\-\$*–—\(]+?)(?:\s*\(?Price\s*[:\-–—]?\s*)?(?:\s*[:\-–—]\s*|\s+)\$?([\d,.]+)(?:\s*USD)?/gi;
+    const matches = Array.from(content.matchAll(bulletRegex));
+    if (matches.length >= 2) {
+      const normalize = (s) => s.toLowerCase().replace(/[^a-z0-9]/g, "");
+      for (const match of matches) {
+        let name = ((_a = match[1]) == null ? void 0 : _a.trim()) || "";
+        name = name.replace(/\s*\(?Price\s*$/i, "").replace(/[:\-–—]\s*$/g, "").trim();
+        let price = ((_b = match[2]) == null ? void 0 : _b.trim()) || "";
+        price = price.replace(/[,\s]+$/, "").trim();
+        if (name && price) {
+          const newProduct = {
+            id: `text-prod-${name}-${price}`,
+            name,
+            price: `$${price}`
+          };
+          const normName = normalize(name);
+          const sourceMatch = productsFromSources.find((s) => {
+            const sn = normalize(s.name);
+            return sn.includes(normName) || normName.includes(sn);
+          });
+          if (sourceMatch) {
+            newProduct.image = sourceMatch.image;
+            newProduct.brand = sourceMatch.brand;
+            newProduct.link = sourceMatch.link;
+            newProduct.description = sourceMatch.description;
+          }
+          products.push(newProduct);
+          content = content.replace(match[0], `
+**${name}** \u2014 $${price}`);
+        }
+      }
+      content = content.replace(/\n{3,}/g, "\n\n").trim();
+    }
     return { productsFromContent: products, cleanContent: content.trim() };
-  }, [message.content, isUser, structuredContent]);
-  const allProducts = import_react5.default.useMemo(() => {
+  }, [message.content, isUser, structuredContent, productsFromSources]);
+  const allProducts = import_react6.default.useMemo(() => {
     if (productsFromContent.length > 0) return productsFromContent;
     const seen = /* @__PURE__ */ new Set();
     const contentLower = message.content.toLowerCase();
@@ -1003,7 +1162,7 @@ function MessageBubble({
       return false;
     });
   }, [productsFromSources, productsFromContent, message.content]);
-  const processedMarkdown = import_react5.default.useMemo(() => {
+  const processedMarkdown = import_react6.default.useMemo(() => {
     let raw = structuredContent.payload ? structuredContent.text : cleanContent || message.content;
     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");
@@ -1037,16 +1196,16 @@ ${match.trim()}
     }
     return raw;
   }, [cleanContent, message.content, isStreaming, structuredContent]);
-  const markdownComponents = import_react5.default.useMemo(
+  const markdownComponents = import_react6.default.useMemo(
     () => ({
       // 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: (_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_react6.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_react6.default.createElement("div", { className: "w-4 h-4 border-2 border-indigo-500 border-t-transparent rounded-full animate-spin" }), /* @__PURE__ */ import_react6.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(
+        return /* @__PURE__ */ import_react6.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_react6.default.createElement("div", { className: "overflow-x-auto" }, /* @__PURE__ */ import_react6.default.createElement(
           "table",
           __spreadValues({
             className: "!table w-full text-left border-collapse min-w-[400px] text-sm"
@@ -1055,7 +1214,7 @@ ${match.trim()}
       },
       thead: (_b) => {
         var props = __objRest(_b, []);
-        return /* @__PURE__ */ import_react5.default.createElement(
+        return /* @__PURE__ */ import_react6.default.createElement(
           "thead",
           __spreadValues({
             className: "!table-header-group bg-slate-50 dark:bg-white/5 border-b border-slate-200 dark:border-white/10"
@@ -1064,11 +1223,11 @@ ${match.trim()}
       },
       tbody: (_c) => {
         var props = __objRest(_c, []);
-        return /* @__PURE__ */ import_react5.default.createElement("tbody", __spreadValues({ className: "!table-row-group divide-y divide-slate-100 dark:divide-white/5" }, props));
+        return /* @__PURE__ */ import_react6.default.createElement("tbody", __spreadValues({ className: "!table-row-group divide-y divide-slate-100 dark:divide-white/5" }, props));
       },
       tr: (_d) => {
         var props = __objRest(_d, []);
-        return /* @__PURE__ */ import_react5.default.createElement(
+        return /* @__PURE__ */ import_react6.default.createElement(
           "tr",
           __spreadValues({
             className: "!table-row hover:bg-slate-50/70 dark:hover:bg-white/5 transition-colors"
@@ -1077,7 +1236,7 @@ ${match.trim()}
       },
       th: (_e) => {
         var _f = _e, { children } = _f, props = __objRest(_f, ["children"]);
-        return /* @__PURE__ */ import_react5.default.createElement(
+        return /* @__PURE__ */ import_react6.default.createElement(
           "th",
           __spreadValues({
             className: "!table-cell px-4 py-3 font-bold text-slate-700 dark:text-white/90 whitespace-nowrap text-[11px] uppercase tracking-wider text-left"
@@ -1087,7 +1246,7 @@ ${match.trim()}
       },
       td: (_g) => {
         var _h = _g, { children } = _h, props = __objRest(_h, ["children"]);
-        return /* @__PURE__ */ import_react5.default.createElement(
+        return /* @__PURE__ */ import_react6.default.createElement(
           "td",
           __spreadValues({
             className: "!table-cell px-4 py-3 text-slate-600 dark:text-white/70 whitespace-nowrap text-sm"
@@ -1108,7 +1267,7 @@ ${match.trim()}
         var _a;
         const lang = (_a = /language-(\w+)/.exec(className != null ? className : "")) == null ? void 0 : _a[1];
         if (!inline && (lang === "ui" || lang === "chart")) {
-          return /* @__PURE__ */ import_react5.default.createElement(
+          return /* @__PURE__ */ import_react6.default.createElement(
             UIDispatcher,
             {
               rawContent: String(children != null ? children : "").trim(),
@@ -1123,7 +1282,7 @@ ${match.trim()}
         if (!inline && lang === "json") {
           const content = String(children != null ? children : "").trim();
           if (looksLikeStructuredPayload(content)) {
-            return /* @__PURE__ */ import_react5.default.createElement(
+            return /* @__PURE__ */ import_react6.default.createElement(
               UIDispatcher,
               {
                 rawContent: content,
@@ -1139,7 +1298,7 @@ ${match.trim()}
         if (!inline) {
           const content = String(children != null ? children : "").trim();
           if (looksLikeStructuredPayload(content)) {
-            return /* @__PURE__ */ import_react5.default.createElement(
+            return /* @__PURE__ */ import_react6.default.createElement(
               UIDispatcher,
               {
                 rawContent: content,
@@ -1153,27 +1312,27 @@ ${match.trim()}
           }
         }
         if (!inline && lang === "table-loading") {
-          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_react6.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_react6.default.createElement("div", { className: "w-4 h-4 border-2 border-indigo-500 border-t-transparent rounded-full animate-spin" }), /* @__PURE__ */ import_react6.default.createElement("p", { className: "text-xs text-slate-500 font-medium italic animate-pulse" }, "Generating data table..."));
         }
-        return /* @__PURE__ */ import_react5.default.createElement("code", __spreadValues({ className }, props), typeof children === "string" || typeof children === "number" ? children : JSON.stringify(children));
+        return /* @__PURE__ */ import_react6.default.createElement("code", __spreadValues({ className }, props), typeof children === "string" || typeof children === "number" ? children : JSON.stringify(children));
       }
     }),
     [primaryColor, accentColor, isStreaming, onAddToCart, viewportSize]
   );
-  return /* @__PURE__ */ import_react5.default.createElement("div", { className: `flex ${isCompact ? "gap-2" : "gap-3"} ${isUser ? "flex-row-reverse" : "flex-row"} items-start` }, /* @__PURE__ */ import_react5.default.createElement(
+  return /* @__PURE__ */ import_react6.default.createElement("div", { className: `flex ${isCompact ? "gap-2" : "gap-3"} ${isUser ? "flex-row-reverse" : "flex-row"} items-start` }, /* @__PURE__ */ import_react6.default.createElement(
     "div",
     {
       className: `flex-shrink-0 ${isCompact ? "w-7 h-7" : "w-8 h-8"} rounded-full flex items-center justify-center shadow-lg ${isUser ? "text-white" : "bg-slate-100 dark:bg-white/10 text-slate-700 dark:text-white/80"}`,
       style: isUser ? { background: `linear-gradient(135deg, ${primaryColor}, ${accentColor})` } : {}
     },
-    isUser ? /* @__PURE__ */ import_react5.default.createElement(import_lucide_react4.User, { className: `${isCompact ? "w-3.5 h-3.5" : "w-4 h-4"} text-white` }) : /* @__PURE__ */ import_react5.default.createElement(import_lucide_react4.Bot, { className: `${isCompact ? "w-3.5 h-3.5" : "w-4 h-4"}` })
-  ), /* @__PURE__ */ import_react5.default.createElement("div", { className: `flex flex-col gap-1 ${isCompact ? "max-w-[94%]" : isMedium ? "max-w-[92%]" : "max-w-[90%]"} ${isUser ? "items-end" : "items-start"}` }, /* @__PURE__ */ import_react5.default.createElement(
+    isUser ? /* @__PURE__ */ import_react6.default.createElement(import_lucide_react4.User, { className: `${isCompact ? "w-3.5 h-3.5" : "w-4 h-4"} text-white` }) : /* @__PURE__ */ import_react6.default.createElement(import_lucide_react4.Bot, { className: `${isCompact ? "w-3.5 h-3.5" : "w-4 h-4"}` })
+  ), /* @__PURE__ */ import_react6.default.createElement("div", { className: `flex flex-col gap-1 ${isCompact ? "max-w-[94%]" : isMedium ? "max-w-[92%]" : "max-w-[90%]"} ${isUser ? "items-end" : "items-start"}` }, /* @__PURE__ */ import_react6.default.createElement(
     "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"}`,
       style: isUser ? { background: `linear-gradient(135deg, ${primaryColor}, ${accentColor})` } : {}
     },
-    isStreaming && !message.content ? /* @__PURE__ */ import_react5.default.createElement("span", { className: "flex items-center gap-1 py-1" }, /* @__PURE__ */ import_react5.default.createElement("span", { className: "w-1.5 h-1.5 rounded-full bg-slate-400 dark:bg-white/60 animate-bounce [animation-delay:0ms]" }), /* @__PURE__ */ import_react5.default.createElement("span", { className: "w-1.5 h-1.5 rounded-full bg-slate-400 dark:bg-white/60 animate-bounce [animation-delay:150ms]" }), /* @__PURE__ */ import_react5.default.createElement("span", { className: "w-1.5 h-1.5 rounded-full bg-slate-400 dark:bg-white/60 animate-bounce [animation-delay:300ms]" })) : /* @__PURE__ */ import_react5.default.createElement("div", { className: `prose ${isCompact ? "prose-xs" : "prose-sm"} max-w-none break-words ${isUser ? "prose-invert" : "dark:prose-invert"}` }, !isUser && structuredContent.payload && /* @__PURE__ */ import_react5.default.createElement(
+    isStreaming && !message.content ? /* @__PURE__ */ import_react6.default.createElement("span", { className: "flex items-center gap-1 py-1" }, /* @__PURE__ */ import_react6.default.createElement("span", { className: "w-1.5 h-1.5 rounded-full bg-slate-400 dark:bg-white/60 animate-bounce [animation-delay:0ms]" }), /* @__PURE__ */ import_react6.default.createElement("span", { className: "w-1.5 h-1.5 rounded-full bg-slate-400 dark:bg-white/60 animate-bounce [animation-delay:150ms]" }), /* @__PURE__ */ import_react6.default.createElement("span", { className: "w-1.5 h-1.5 rounded-full bg-slate-400 dark:bg-white/60 animate-bounce [animation-delay:300ms]" })) : /* @__PURE__ */ import_react6.default.createElement("div", { className: `prose ${isCompact ? "prose-xs" : "prose-sm"} max-w-none break-words ${isUser ? "prose-invert" : "dark:prose-invert"}` }, !isUser && structuredContent.payload && /* @__PURE__ */ import_react6.default.createElement(
       UIDispatcher,
       {
         rawContent: structuredContent.payload,
@@ -1183,30 +1342,46 @@ ${match.trim()}
         onAddToCart,
         viewportSize
       }
-    ), !shouldRenderStructuredOnly && /* @__PURE__ */ import_react5.default.createElement(import_react_markdown.default, { remarkPlugins: [import_remark_gfm.default], components: markdownComponents }, processedMarkdown), !isUser && !structuredContent.payload && !!message.uiTransformation && /* @__PURE__ */ import_react5.default.createElement("div", { className: "mt-4 border-t border-slate-100 dark:border-white/5 pt-4" }, /* @__PURE__ */ import_react5.default.createElement(VisualizationRenderer, { data: message.uiTransformation })), isStreaming && message.content && /* @__PURE__ */ import_react5.default.createElement("span", { className: "inline-block w-1.5 h-3.5 ml-1 bg-emerald-500 animate-pulse align-middle" }))
-  ), !isUser && !hasStructuredProductBlock && allProducts.length > 0 && /* @__PURE__ */ import_react5.default.createElement("div", { className: "w-full mt-1" }, /* @__PURE__ */ import_react5.default.createElement(
+    ), !shouldRenderStructuredOnly && /* @__PURE__ */ import_react6.default.createElement(import_react_markdown.default, { components: markdownComponents }, processedMarkdown), isStreaming && message.content && /* @__PURE__ */ import_react6.default.createElement("span", { className: "inline-block w-1.5 h-3.5 ml-1 bg-emerald-500 animate-pulse align-middle" }))
+  ), (() => {
+    var _a, _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());
+    if (!shouldShow) return null;
+    return /* @__PURE__ */ import_react6.default.createElement("div", { className: "w-full mt-3" }, /* @__PURE__ */ import_react6.default.createElement(
+      VisualizationRenderer,
+      {
+        data: ui,
+        primaryColor,
+        onAddToCart,
+        className: "rounded-3xl border border-slate-200/60 dark:border-white/10 bg-white/90 dark:bg-slate-900/80 p-4"
+      }
+    ));
+  })(), !isUser && !hasRichUI && allProducts.length > 0 && /* @__PURE__ */ import_react6.default.createElement("div", { className: "w-full mt-1" }, /* @__PURE__ */ import_react6.default.createElement(
     ProductCarousel,
     {
       products: allProducts,
       primaryColor,
       onAddToCart
     }
-  )), !isUser && sources && sources.length > 0 && /* @__PURE__ */ import_react5.default.createElement("div", { className: "w-full" }, /* @__PURE__ */ import_react5.default.createElement(
+  )), !isUser && sources && sources.length > 0 && /* @__PURE__ */ import_react6.default.createElement("div", { className: "w-full" }, /* @__PURE__ */ import_react6.default.createElement(
     "button",
     {
       onClick: () => setShowSources((s) => !s),
       className: "text-[11px] text-indigo-400 hover:text-indigo-300 transition-colors flex items-center gap-1 mt-1"
     },
-    showSources ? /* @__PURE__ */ import_react5.default.createElement(import_lucide_react4.ChevronDown, { className: "w-3 h-3" }) : /* @__PURE__ */ import_react5.default.createElement(import_lucide_react4.ChevronRight, { className: "w-3 h-3" }),
+    showSources ? /* @__PURE__ */ import_react6.default.createElement(import_lucide_react4.ChevronDown, { className: "w-3 h-3" }) : /* @__PURE__ */ import_react6.default.createElement(import_lucide_react4.ChevronRight, { className: "w-3 h-3" }),
     sources.length,
     " source",
     sources.length !== 1 ? "s" : "",
     " used"
-  ), showSources && /* @__PURE__ */ import_react5.default.createElement("div", { className: "mt-2 flex flex-col gap-2" }, sources.map((src, i) => /* @__PURE__ */ import_react5.default.createElement(SourceCard, { key: src.id, source: src, index: i }))))));
+  ), showSources && /* @__PURE__ */ import_react6.default.createElement("div", { className: "mt-2 flex flex-col gap-2" }, sources.map((src, i) => /* @__PURE__ */ import_react6.default.createElement(SourceCard, { key: src.id, source: src, index: i }))))));
 }
 
 // src/components/ConfigProvider.tsx
-var import_react6 = __toESM(require("react"));
+var import_react7 = __toESM(require("react"));
 
 // src/utils/templateUtils.ts
 function mergeDefined(base, override) {
@@ -1258,7 +1433,7 @@ var CHAT_SUGGESTIONS = [
 ];
 
 // src/components/ConfigProvider.tsx
-var ConfigContext = (0, import_react6.createContext)(DEFAULT_CONFIG);
+var ConfigContext = (0, import_react7.createContext)(DEFAULT_CONFIG);
 function ConfigProvider({
   config,
   children
@@ -1267,14 +1442,14 @@ function ConfigProvider({
     projectId: (config == null ? void 0 : config.projectId) || DEFAULT_CONFIG.projectId,
     ui: mergeDefined(DEFAULT_CONFIG.ui, config == null ? void 0 : config.ui)
   };
-  return /* @__PURE__ */ import_react6.default.createElement(ConfigContext.Provider, { value: merged }, children);
+  return /* @__PURE__ */ import_react7.default.createElement(ConfigContext.Provider, { value: merged }, children);
 }
 function useConfig() {
-  return (0, import_react6.useContext)(ConfigContext);
+  return (0, import_react7.useContext)(ConfigContext);
 }
 
 // src/hooks/useRagChat.ts
-var import_react7 = require("react");
+var import_react8 = require("react");
 
 // src/hooks/useStoredMessages.ts
 var React8 = __toESM(require("react"));
@@ -1335,14 +1510,14 @@ function useRagChat(projectId, options = {}) {
   } = options;
   const storageKey = `rag_chat_${projectId}`;
   const [messages, setMessages] = useStoredMessages(storageKey, persist);
-  const [isLoading, setIsLoading] = (0, import_react7.useState)(false);
-  const [error, setError] = (0, import_react7.useState)(null);
-  const lastInputRef = (0, import_react7.useRef)("");
-  const messagesRef = (0, import_react7.useRef)(messages);
-  (0, import_react7.useEffect)(() => {
+  const [isLoading, setIsLoading] = (0, import_react8.useState)(false);
+  const [error, setError] = (0, import_react8.useState)(null);
+  const lastInputRef = (0, import_react8.useRef)("");
+  const messagesRef = (0, import_react8.useRef)(messages);
+  (0, import_react8.useEffect)(() => {
     messagesRef.current = messages;
   }, [messages]);
-  const sendMessage = (0, import_react7.useCallback)(
+  const sendMessage = (0, import_react8.useCallback)(
     async (text, opts) => {
       var _a, _b;
       const trimmed = text.trim();
@@ -1402,7 +1577,7 @@ function useRagChat(projectId, options = {}) {
           const complete = buffer.slice(0, lastBoundary + 2);
           buffer = buffer.slice(lastBoundary + 2);
           for (const frame of parseSseChunk(complete)) {
-            if (frame.type === "text") {
+            if (frame.type === "text" && frame.text) {
               assistantContent += frame.text;
             } else if (frame.type === "metadata") {
               sources = (_a = frame.sources) != null ? _a : [];
@@ -1424,7 +1599,7 @@ function useRagChat(projectId, options = {}) {
         }
         if (buffer.trim()) {
           for (const frame of parseSseChunk(buffer)) {
-            if (frame.type === "text") assistantContent += frame.text;
+            if (frame.type === "text" && frame.text) assistantContent += frame.text;
             else if (frame.type === "metadata") sources = (_b = frame.sources) != null ? _b : [];
           }
         }
@@ -1447,12 +1622,12 @@ function useRagChat(projectId, options = {}) {
     },
     [apiUrl, isLoading, namespace, onError, onReply, projectId, setMessages]
   );
-  const clear = (0, import_react7.useCallback)(() => {
+  const clear = (0, import_react8.useCallback)(() => {
     setMessages([]);
     setError(null);
     if (persist) localStorage.removeItem(storageKey);
   }, [persist, setMessages, storageKey]);
-  const retry = (0, import_react7.useCallback)(async () => {
+  const retry = (0, import_react8.useCallback)(async () => {
     if (lastInputRef.current) {
       const latestMessage = messagesRef.current[messagesRef.current.length - 1];
       await sendMessage(lastInputRef.current, {
@@ -1486,20 +1661,20 @@ function ChatWindow({
 }) {
   var _a;
   const { ui, projectId } = useConfig();
-  const [input, setInput] = (0, import_react8.useState)("");
-  const [mounted, setMounted] = (0, import_react8.useState)(false);
-  const [viewportSize, setViewportSize] = (0, import_react8.useState)("large");
-  const windowRef = (0, import_react8.useRef)(null);
-  const bottomRef = (0, import_react8.useRef)(null);
-  const inputRef = (0, import_react8.useRef)(null);
+  const [input, setInput] = (0, import_react9.useState)("");
+  const [mounted, setMounted] = (0, import_react9.useState)(false);
+  const [viewportSize, setViewportSize] = (0, import_react9.useState)("large");
+  const windowRef = (0, import_react9.useRef)(null);
+  const bottomRef = (0, import_react9.useRef)(null);
+  const inputRef = (0, import_react9.useRef)(null);
   const { messages, send, clear, isLoading, error } = useRagChat(projectId, {
     namespace: projectId
   });
-  const [suggestions, setSuggestions] = (0, import_react8.useState)([]);
-  const [isSuggesting, setIsSuggesting] = (0, import_react8.useState)(false);
-  const [isListening, setIsListening] = (0, import_react8.useState)(false);
-  const recognitionRef = (0, import_react8.useRef)(null);
-  (0, import_react8.useEffect)(() => {
+  const [suggestions, setSuggestions] = (0, import_react9.useState)([]);
+  const [isSuggesting, setIsSuggesting] = (0, import_react9.useState)(false);
+  const [isListening, setIsListening] = (0, import_react9.useState)(false);
+  const recognitionRef = (0, import_react9.useRef)(null);
+  (0, import_react9.useEffect)(() => {
     if (typeof window !== "undefined") {
       const win = window;
       const SpeechRecognition = win.SpeechRecognition || win.webkitSpeechRecognition;
@@ -1545,10 +1720,10 @@ function ChatWindow({
       }
     }
   };
-  (0, import_react8.useEffect)(() => {
+  (0, import_react9.useEffect)(() => {
     setMounted(true);
   }, []);
-  (0, import_react8.useEffect)(() => {
+  (0, import_react9.useEffect)(() => {
     const element = windowRef.current;
     if (!element || typeof ResizeObserver === "undefined") return;
     const resolveViewportSize = (width) => {
@@ -1564,13 +1739,13 @@ function ChatWindow({
     observer.observe(element);
     return () => observer.disconnect();
   }, []);
-  (0, import_react8.useEffect)(() => {
+  (0, import_react9.useEffect)(() => {
     var _a2;
     if (messages.length > 0 || isLoading) {
       (_a2 = bottomRef.current) == null ? void 0 : _a2.scrollIntoView({ behavior: "smooth" });
     }
   }, [messages, isLoading]);
-  const sendMessage = (0, import_react8.useCallback)(async () => {
+  const sendMessage = (0, import_react9.useCallback)(async () => {
     var _a2;
     const text = input.trim();
     if (!text || isLoading) return;
@@ -1600,7 +1775,7 @@ function ChatWindow({
   const isEmpty = messages.length === 0;
   const currentRadius = BORDER_RADIUS_MAP[ui.borderRadius || "xl"];
   const isGlass = ui.visualStyle !== "solid";
-  (0, import_react8.useEffect)(() => {
+  (0, import_react9.useEffect)(() => {
     if (input.trim().length < 3) {
       return;
     }
@@ -1624,84 +1799,84 @@ function ChatWindow({
     }, 800);
     return () => clearTimeout(timer);
   }, [input, projectId]);
-  return /* @__PURE__ */ import_react8.default.createElement(
+  return /* @__PURE__ */ import_react9.default.createElement(
     "div",
     {
       ref: windowRef,
       className: `relative flex flex-col border border-slate-200 dark:border-white/10 shadow-2xl transition-all duration-300 ${currentRadius} ${isGlass ? "bg-white/90 dark:bg-[#0f0f1a]/90 backdrop-blur-xl" : "bg-white dark:bg-[#0f0f1a]"} ${className}`,
       style: __spreadValues({ "--primary": ui.primaryColor, "--accent": ui.accentColor }, style)
     },
-    onResizeStart && /* @__PURE__ */ import_react8.default.createElement(
+    onResizeStart && /* @__PURE__ */ import_react9.default.createElement(
       "div",
       {
         onMouseDown: onResizeStart,
         className: "absolute top-0 left-0 w-6 h-6 cursor-nw-resize z-[100] group flex items-start justify-start p-1",
         title: "Drag to resize"
       },
-      /* @__PURE__ */ import_react8.default.createElement("div", { className: "w-2.5 h-2.5 border-t-2 border-l-2 border-slate-300 dark:border-white/20 group-hover:border-slate-500 dark:group-hover:border-white/50 transition-colors rounded-tl-[2px]" })
+      /* @__PURE__ */ import_react9.default.createElement("div", { className: "w-2.5 h-2.5 border-t-2 border-l-2 border-slate-300 dark:border-white/20 group-hover:border-slate-500 dark:group-hover:border-white/50 transition-colors rounded-tl-[2px]" })
     ),
-    /* @__PURE__ */ import_react8.default.createElement(
+    /* @__PURE__ */ import_react9.default.createElement(
       "div",
       {
         className: "flex items-center justify-between px-5 py-4 border-b border-slate-200 dark:border-white/10",
         style: { background: `linear-gradient(135deg, ${ui.primaryColor}15, ${ui.accentColor}10)` }
       },
-      /* @__PURE__ */ import_react8.default.createElement("div", { className: "flex items-center gap-3" }, ui.logoUrl ? (
+      /* @__PURE__ */ import_react9.default.createElement("div", { className: "flex items-center gap-3" }, ui.logoUrl ? (
         // eslint-disable-next-line @next/next/no-img-element
-        /* @__PURE__ */ import_react8.default.createElement("img", { src: ui.logoUrl, alt: "logo", className: "w-8 h-8 rounded-lg object-cover" })
-      ) : /* @__PURE__ */ import_react8.default.createElement(
+        /* @__PURE__ */ import_react9.default.createElement("img", { src: ui.logoUrl, alt: "logo", className: "w-8 h-8 rounded-lg object-cover" })
+      ) : /* @__PURE__ */ import_react9.default.createElement(
         "div",
         {
           className: `w-9 h-9 flex items-center justify-center shadow-md ${ui.borderRadius === "full" ? "rounded-full" : "rounded-xl"}`,
           style: { background: `linear-gradient(135deg, ${ui.primaryColor}, ${ui.accentColor})` }
         },
-        /* @__PURE__ */ import_react8.default.createElement(import_lucide_react5.Bot, { className: "w-5 h-5 text-white" })
-      ), /* @__PURE__ */ import_react8.default.createElement("div", null, /* @__PURE__ */ import_react8.default.createElement("h2", { className: "text-slate-900 dark:text-white font-semibold text-sm leading-tight" }, ui.title), ui.poweredBy && /* @__PURE__ */ import_react8.default.createElement("p", { className: "text-slate-500 dark:text-white/40 text-[11px] leading-tight" }, `Powered by ${ui.poweredBy}`))),
-      /* @__PURE__ */ import_react8.default.createElement("div", { className: "flex items-center gap-1.5" }, /* @__PURE__ */ import_react8.default.createElement("span", { className: "flex items-center gap-1 text-[10px] text-emerald-500 dark:text-emerald-400 mr-2" }, /* @__PURE__ */ import_react8.default.createElement("span", { className: "w-1.5 h-1.5 rounded-full bg-emerald-500 dark:bg-emerald-400 animate-pulse" }), "Online"), /* @__PURE__ */ import_react8.default.createElement("div", { className: "flex items-center bg-slate-100/50 dark:bg-white/5 rounded-lg p-0.5 border border-slate-200/50 dark:border-white/5" }, mounted && messages.length > 0 && /* @__PURE__ */ import_react8.default.createElement(
+        /* @__PURE__ */ import_react9.default.createElement(import_lucide_react5.Bot, { className: "w-5 h-5 text-white" })
+      ), /* @__PURE__ */ import_react9.default.createElement("div", null, /* @__PURE__ */ import_react9.default.createElement("h2", { className: "text-slate-900 dark:text-white font-semibold text-sm leading-tight" }, ui.title), ui.poweredBy && /* @__PURE__ */ import_react9.default.createElement("p", { className: "text-slate-500 dark:text-white/40 text-[11px] leading-tight" }, `Powered by ${ui.poweredBy}`))),
+      /* @__PURE__ */ import_react9.default.createElement("div", { className: "flex items-center gap-1.5" }, /* @__PURE__ */ import_react9.default.createElement("span", { className: "flex items-center gap-1 text-[10px] text-emerald-500 dark:text-emerald-400 mr-2" }, /* @__PURE__ */ import_react9.default.createElement("span", { className: "w-1.5 h-1.5 rounded-full bg-emerald-500 dark:bg-emerald-400 animate-pulse" }), "Online"), /* @__PURE__ */ import_react9.default.createElement("div", { className: "flex items-center bg-slate-100/50 dark:bg-white/5 rounded-lg p-0.5 border border-slate-200/50 dark:border-white/5" }, mounted && messages.length > 0 && /* @__PURE__ */ import_react9.default.createElement(
         "button",
         {
           onClick: clearHistory,
           title: "Clear conversation",
           className: "w-7 h-7 rounded-md flex items-center justify-center text-slate-400 hover:text-rose-500 dark:text-white/40 dark:hover:text-rose-400 hover:bg-white dark:hover:bg-white/10 transition-all cursor-pointer"
         },
-        /* @__PURE__ */ import_react8.default.createElement(import_lucide_react5.Trash2, { className: "w-3.5 h-3.5" })
-      ), isResized && onResetResize && /* @__PURE__ */ import_react8.default.createElement(
+        /* @__PURE__ */ import_react9.default.createElement(import_lucide_react5.Trash2, { className: "w-3.5 h-3.5" })
+      ), isResized && onResetResize && /* @__PURE__ */ import_react9.default.createElement(
         "button",
         {
           onClick: onResetResize,
           title: "Reset to default size",
           className: "w-7 h-7 rounded-md flex items-center justify-center text-slate-400 hover:text-blue-500 dark:text-white/40 dark:hover:text-blue-400 hover:bg-white dark:hover:bg-white/10 transition-all cursor-pointer"
         },
-        /* @__PURE__ */ import_react8.default.createElement(import_lucide_react5.RotateCcw, { className: "w-3.5 h-3.5" })
-      ), onMaximize && /* @__PURE__ */ import_react8.default.createElement(
+        /* @__PURE__ */ import_react9.default.createElement(import_lucide_react5.RotateCcw, { className: "w-3.5 h-3.5" })
+      ), onMaximize && /* @__PURE__ */ import_react9.default.createElement(
         "button",
         {
           onClick: onMaximize,
           title: isMaximized ? "Minimize" : "Maximize",
           className: "w-7 h-7 rounded-md flex items-center justify-center text-slate-400 hover:text-blue-500 dark:text-white/40 dark:hover:text-blue-400 hover:bg-white dark:hover:bg-white/10 transition-all cursor-pointer"
         },
-        isMaximized ? /* @__PURE__ */ import_react8.default.createElement(import_lucide_react5.Minimize2, { className: "w-3.5 h-3.5" }) : /* @__PURE__ */ import_react8.default.createElement(import_lucide_react5.Maximize2, { className: "w-3.5 h-3.5" })
-      ), showClose && onClose && /* @__PURE__ */ import_react8.default.createElement(
+        isMaximized ? /* @__PURE__ */ import_react9.default.createElement(import_lucide_react5.Minimize2, { className: "w-3.5 h-3.5" }) : /* @__PURE__ */ import_react9.default.createElement(import_lucide_react5.Maximize2, { className: "w-3.5 h-3.5" })
+      ), showClose && onClose && /* @__PURE__ */ import_react9.default.createElement(
         "button",
         {
           onClick: onClose,
           title: "Close chat",
           className: "w-7 h-7 rounded-md flex items-center justify-center text-slate-400 hover:text-slate-600 dark:text-white/40 dark:hover:text-white/70 hover:bg-white dark:hover:bg-white/10 transition-all cursor-pointer"
         },
-        /* @__PURE__ */ import_react8.default.createElement(import_lucide_react5.X, { className: "w-4 h-4" })
+        /* @__PURE__ */ import_react9.default.createElement(import_lucide_react5.X, { className: "w-4 h-4" })
       )))
     ),
-    /* @__PURE__ */ import_react8.default.createElement("div", { className: "flex-1 overflow-y-auto px-4 py-4 space-y-5 scrollbar-thin scrollbar-thumb-slate-200 dark:scrollbar-thumb-white/10 scrollbar-track-transparent min-h-0 bg-slate-50 dark:bg-transparent" }, !mounted || isEmpty ? (
+    /* @__PURE__ */ import_react9.default.createElement("div", { className: "flex-1 overflow-y-auto px-4 py-4 space-y-5 scrollbar-thin scrollbar-thumb-slate-200 dark:scrollbar-thumb-white/10 scrollbar-track-transparent min-h-0 bg-slate-50 dark:bg-transparent" }, !mounted || isEmpty ? (
       /* Welcome state */
-      /* @__PURE__ */ import_react8.default.createElement("div", { className: "h-full flex flex-col items-center justify-center text-center gap-4 px-6 py-12" }, /* @__PURE__ */ import_react8.default.createElement(
+      /* @__PURE__ */ import_react9.default.createElement("div", { className: "h-full flex flex-col items-center justify-center text-center gap-4 px-6 py-12" }, /* @__PURE__ */ import_react9.default.createElement(
         "div",
         {
           className: `w-16 h-16 flex items-center justify-center shadow-lg ${ui.borderRadius === "full" ? "rounded-full" : "rounded-2xl"}`,
           style: { background: `linear-gradient(135deg, ${ui.primaryColor}, ${ui.accentColor})` }
         },
-        /* @__PURE__ */ import_react8.default.createElement(import_lucide_react5.Sparkles, { className: "w-8 h-8 text-white" })
-      ), /* @__PURE__ */ import_react8.default.createElement("div", null, /* @__PURE__ */ import_react8.default.createElement("p", { className: "text-slate-800 dark:text-white/80 font-medium leading-relaxed" }, ui.welcomeMessage), /* @__PURE__ */ import_react8.default.createElement("p", { className: "text-slate-500 dark:text-white/30 text-sm mt-2" }, "Ask a question to get started")), /* @__PURE__ */ import_react8.default.createElement("div", { className: "flex flex-wrap gap-2 justify-center mt-2" }, CHAT_SUGGESTIONS.map(
-        (suggestion) => /* @__PURE__ */ import_react8.default.createElement(
+        /* @__PURE__ */ import_react9.default.createElement(import_lucide_react5.Sparkles, { className: "w-8 h-8 text-white" })
+      ), /* @__PURE__ */ import_react9.default.createElement("div", null, /* @__PURE__ */ import_react9.default.createElement("p", { className: "text-slate-800 dark:text-white/80 font-medium leading-relaxed" }, ui.welcomeMessage), /* @__PURE__ */ import_react9.default.createElement("p", { className: "text-slate-500 dark:text-white/30 text-sm mt-2" }, "Ask a question to get started")), /* @__PURE__ */ import_react9.default.createElement("div", { className: "flex flex-wrap gap-2 justify-center mt-2" }, CHAT_SUGGESTIONS.map(
+        (suggestion) => /* @__PURE__ */ import_react9.default.createElement(
           "button",
           {
             key: suggestion,
@@ -1715,7 +1890,7 @@ function ChatWindow({
           suggestion
         )
       )))
-    ) : messages.map((msg, index) => /* @__PURE__ */ import_react8.default.createElement(
+    ) : messages.map((msg, index) => /* @__PURE__ */ import_react9.default.createElement(
       MessageBubble,
       {
         key: msg.id,
@@ -1727,7 +1902,7 @@ function ChatWindow({
         onAddToCart,
         viewportSize
       }
-    )), isLoading && ((_a = messages[messages.length - 1]) == null ? void 0 : _a.role) !== "assistant" && /* @__PURE__ */ import_react8.default.createElement(
+    )), isLoading && ((_a = messages[messages.length - 1]) == null ? void 0 : _a.role) !== "assistant" && /* @__PURE__ */ import_react9.default.createElement(
       MessageBubble,
       {
         message: { id: "loading", role: "assistant", content: "", createdAt: (/* @__PURE__ */ new Date()).toISOString() },
@@ -1737,8 +1912,8 @@ function ChatWindow({
         onAddToCart,
         viewportSize
       }
-    ), error && /* @__PURE__ */ import_react8.default.createElement("div", { className: "flex items-center gap-2 text-rose-500 dark:text-rose-400 text-sm bg-rose-50 dark:bg-rose-400/10 border border-rose-200 dark:border-rose-400/20 rounded-xl px-4 py-3" }, /* @__PURE__ */ import_react8.default.createElement(import_lucide_react5.TriangleAlert, { className: "w-4 h-4 flex-shrink-0" }), /* @__PURE__ */ import_react8.default.createElement("span", null, error)), /* @__PURE__ */ import_react8.default.createElement("div", { ref: bottomRef })),
-    /* @__PURE__ */ import_react8.default.createElement("div", { className: `px-4 pb-4 pt-2 border-t border-slate-200 dark:border-white/10 ${isGlass ? "bg-transparent" : "bg-white dark:bg-[#0f0f1a]"}` }, (suggestions.length > 0 || isSuggesting) && !isLoading && /* @__PURE__ */ import_react8.default.createElement("div", { className: "mb-3 flex flex-wrap gap-2 animate-in fade-in slide-in-from-bottom-2 duration-300" }, suggestions.map((suggestion) => /* @__PURE__ */ import_react8.default.createElement(
+    ), error && /* @__PURE__ */ import_react9.default.createElement("div", { className: "flex items-center gap-2 text-rose-500 dark:text-rose-400 text-sm bg-rose-50 dark:bg-rose-400/10 border border-rose-200 dark:border-rose-400/20 rounded-xl px-4 py-3" }, /* @__PURE__ */ import_react9.default.createElement(import_lucide_react5.TriangleAlert, { className: "w-4 h-4 flex-shrink-0" }), /* @__PURE__ */ import_react9.default.createElement("span", null, error)), /* @__PURE__ */ import_react9.default.createElement("div", { ref: bottomRef })),
+    /* @__PURE__ */ import_react9.default.createElement("div", { className: `px-4 pb-4 pt-2 border-t border-slate-200 dark:border-white/10 ${isGlass ? "bg-transparent" : "bg-white dark:bg-[#0f0f1a]"}` }, (suggestions.length > 0 || isSuggesting) && !isLoading && /* @__PURE__ */ import_react9.default.createElement("div", { className: "mb-3 flex flex-wrap gap-2 animate-in fade-in slide-in-from-bottom-2 duration-300" }, suggestions.map((suggestion) => /* @__PURE__ */ import_react9.default.createElement(
       "button",
       {
         key: suggestion,
@@ -1750,9 +1925,9 @@ function ChatWindow({
         },
         className: "flex items-center gap-1.5 px-3 py-1.5 rounded-xl text-[11px] font-medium bg-white dark:bg-white/5 border border-slate-200 dark:border-white/10 text-slate-600 dark:text-white/60 hover:text-slate-900 dark:hover:text-white/90 hover:border-slate-300 dark:hover:border-white/20 transition-all shadow-sm cursor-pointer group"
       },
-      /* @__PURE__ */ import_react8.default.createElement(import_lucide_react5.Sparkles, { className: "w-3 h-3 text-amber-400" }),
+      /* @__PURE__ */ import_react9.default.createElement(import_lucide_react5.Sparkles, { className: "w-3 h-3 text-amber-400" }),
       suggestion
-    )), isSuggesting && suggestions.length === 0 && /* @__PURE__ */ import_react8.default.createElement("div", { className: "flex items-center gap-1.5 px-3 py-1.5 rounded-xl text-[11px] font-medium text-slate-400 dark:text-white/30 animate-pulse" }, /* @__PURE__ */ import_react8.default.createElement(import_lucide_react5.Sparkles, { className: "w-3 h-3" }), "Thinking...")), /* @__PURE__ */ import_react8.default.createElement("div", { className: `flex items-end gap-2 bg-slate-50 dark:bg-white/5 border border-slate-200 dark:border-white/10 p-2 focus-within:border-slate-300 dark:focus-within:border-white/20 transition-all ${ui.borderRadius === "full" ? "rounded-3xl" : "rounded-2xl"}` }, /* @__PURE__ */ import_react8.default.createElement(
+    )), isSuggesting && suggestions.length === 0 && /* @__PURE__ */ import_react9.default.createElement("div", { className: "flex items-center gap-1.5 px-3 py-1.5 rounded-xl text-[11px] font-medium text-slate-400 dark:text-white/30 animate-pulse" }, /* @__PURE__ */ import_react9.default.createElement(import_lucide_react5.Sparkles, { className: "w-3 h-3" }), "Thinking...")), /* @__PURE__ */ import_react9.default.createElement("div", { className: `flex items-end gap-2 bg-slate-50 dark:bg-white/5 border border-slate-200 dark:border-white/10 p-2 focus-within:border-slate-300 dark:focus-within:border-white/20 transition-all ${ui.borderRadius === "full" ? "rounded-3xl" : "rounded-2xl"}` }, /* @__PURE__ */ import_react9.default.createElement(
       "textarea",
       {
         ref: inputRef,
@@ -1771,7 +1946,7 @@ function ChatWindow({
         className: "flex-1 bg-transparent text-slate-900 dark:text-white/90 placeholder-slate-400 dark:placeholder-white/30 text-sm resize-none outline-none py-1.5 px-2 max-h-32 leading-relaxed disabled:opacity-50",
         style: { scrollbarWidth: "none" }
       }
-    ), ui.enableVoiceInput !== false && /* @__PURE__ */ import_react8.default.createElement(
+    ), ui.enableVoiceInput !== false && /* @__PURE__ */ import_react9.default.createElement(
       "button",
       {
         type: "button",
@@ -1780,8 +1955,8 @@ function ChatWindow({
         className: `flex-shrink-0 w-9 h-9 rounded-xl flex items-center justify-center transition-all hover:scale-105 active:scale-95 disabled:opacity-50 disabled:cursor-not-allowed disabled:hover:scale-100 disabled:active:scale-100 ${isListening ? "bg-rose-500 text-white animate-pulse shadow-md shadow-rose-500/20" : "text-slate-400 dark:text-white/40 hover:bg-slate-200 dark:hover:bg-white/10"}`,
         title: isListening ? "Stop listening" : "Start voice input"
       },
-      isListening ? /* @__PURE__ */ import_react8.default.createElement(import_lucide_react5.MicOff, { className: "w-4 h-4" }) : /* @__PURE__ */ import_react8.default.createElement(import_lucide_react5.Mic, { className: "w-4 h-4" })
-    ), /* @__PURE__ */ import_react8.default.createElement(
+      isListening ? /* @__PURE__ */ import_react9.default.createElement(import_lucide_react5.MicOff, { className: "w-4 h-4" }) : /* @__PURE__ */ import_react9.default.createElement(import_lucide_react5.Mic, { className: "w-4 h-4" })
+    ), /* @__PURE__ */ import_react9.default.createElement(
       "button",
       {
         onClick: sendMessage,
@@ -1792,8 +1967,8 @@ function ChatWindow({
           // slate-400/20 for light mode disabled
         }
       },
-      /* @__PURE__ */ import_react8.default.createElement(import_lucide_react5.ArrowUp, { className: "w-4 h-4 text-white" })
-    )), /* @__PURE__ */ import_react8.default.createElement("p", { className: "text-center text-[10px] text-slate-400 dark:text-white/20 mt-2" }, "Press Enter to send \xB7 Shift+Enter for new line"))
+      /* @__PURE__ */ import_react9.default.createElement(import_lucide_react5.ArrowUp, { className: "w-4 h-4 text-white" })
+    )), /* @__PURE__ */ import_react9.default.createElement("p", { className: "text-center text-[10px] text-slate-400 dark:text-white/20 mt-2" }, "Press Enter to send \xB7 Shift+Enter for new line"))
   );
 }
 
@@ -1801,12 +1976,12 @@ function ChatWindow({
 var DEFAULT_DIMENSIONS = { width: 380, height: 600 };
 function ChatWidget({ position = "bottom-right", onAddToCart }) {
   const { ui } = useConfig();
-  const [isOpen, setIsOpen] = (0, import_react9.useState)(false);
-  const [hasUnread, setHasUnread] = (0, import_react9.useState)(false);
-  const [dimensions, setDimensions] = (0, import_react9.useState)(DEFAULT_DIMENSIONS);
-  const [isResizing, setIsResizing] = (0, import_react9.useState)(false);
-  const [isMaximized, setIsMaximized] = (0, import_react9.useState)(false);
-  const [prevDimensions, setPrevDimensions] = (0, import_react9.useState)(DEFAULT_DIMENSIONS);
+  const [isOpen, setIsOpen] = (0, import_react10.useState)(false);
+  const [hasUnread, setHasUnread] = (0, import_react10.useState)(false);
+  const [dimensions, setDimensions] = (0, import_react10.useState)(DEFAULT_DIMENSIONS);
+  const [isResizing, setIsResizing] = (0, import_react10.useState)(false);
+  const [isMaximized, setIsMaximized] = (0, import_react10.useState)(false);
+  const [prevDimensions, setPrevDimensions] = (0, import_react10.useState)(DEFAULT_DIMENSIONS);
   if (ui.showWidget === false) return null;
   const positionClass = position === "bottom-left" ? "bottom-6 left-6" : "bottom-6 right-6";
   const windowPositionClass = position === "bottom-left" ? "bottom-20 left-6" : "bottom-20 right-6";
@@ -1856,7 +2031,7 @@ function ChatWidget({ position = "bottom-right", onAddToCart }) {
     }
   };
   const isResized = dimensions.width !== DEFAULT_DIMENSIONS.width || dimensions.height !== DEFAULT_DIMENSIONS.height;
-  return /* @__PURE__ */ import_react9.default.createElement(import_react9.default.Fragment, null, /* @__PURE__ */ import_react9.default.createElement(
+  return /* @__PURE__ */ import_react10.default.createElement(import_react10.default.Fragment, null, /* @__PURE__ */ import_react10.default.createElement(
     "div",
     {
       className: `fixed z-[9998] max-w-[calc(100vw-3rem)] ease-in-out ${windowPositionClass} ${isOpen ? "opacity-100 translate-y-0 pointer-events-auto" : "opacity-0 translate-y-4 pointer-events-none"} ${isResizing ? "" : "transition-all duration-300"}`,
@@ -1866,7 +2041,7 @@ function ChatWidget({ position = "bottom-right", onAddToCart }) {
         maxHeight: "calc(100vh - 6rem)"
       }
     },
-    /* @__PURE__ */ import_react9.default.createElement(
+    /* @__PURE__ */ import_react10.default.createElement(
       ChatWindow,
       {
         className: "h-full relative z-10",
@@ -1880,13 +2055,13 @@ function ChatWidget({ position = "bottom-right", onAddToCart }) {
         onAddToCart
       }
     ),
-    /* @__PURE__ */ import_react9.default.createElement(
+    /* @__PURE__ */ import_react10.default.createElement(
       "div",
       {
         className: `absolute -bottom-1.5 w-4 h-4 rotate-45 border-r border-b border-slate-200 dark:border-white/10 z-0 ${ui.visualStyle === "solid" ? "bg-white dark:bg-[#0f0f1a]" : "bg-white/90 dark:bg-[#0f0f1a]/90 backdrop-blur-xl"} ${position === "bottom-left" ? "left-5" : "right-5"}`
       }
     )
-  ), /* @__PURE__ */ import_react9.default.createElement(
+  ), /* @__PURE__ */ import_react10.default.createElement(
     "button",
     {
       onClick: isOpen ? () => setIsOpen(false) : handleOpen,
@@ -1894,32 +2069,32 @@ function ChatWidget({ position = "bottom-right", onAddToCart }) {
       style: { background: `linear-gradient(135deg, ${ui.primaryColor}, ${ui.accentColor})` },
       "aria-label": "Open chat"
     },
-    /* @__PURE__ */ import_react9.default.createElement(
+    /* @__PURE__ */ import_react10.default.createElement(
       "span",
       {
         className: "absolute inset-0 rounded-full animate-ping opacity-20",
         style: { background: ui.primaryColor }
       }
     ),
-    /* @__PURE__ */ import_react9.default.createElement(
+    /* @__PURE__ */ import_react10.default.createElement(
       "span",
       {
         className: `transition-transform duration-300 ${isOpen ? "rotate-90 scale-90" : "rotate-0 scale-100"}`
       },
-      isOpen ? /* @__PURE__ */ import_react9.default.createElement(import_lucide_react6.X, { className: "w-6 h-6 text-white" }) : /* @__PURE__ */ import_react9.default.createElement(import_lucide_react6.MessageSquare, { className: "w-6 h-6 text-white" })
+      isOpen ? /* @__PURE__ */ import_react10.default.createElement(import_lucide_react6.X, { className: "w-6 h-6 text-white" }) : /* @__PURE__ */ import_react10.default.createElement(import_lucide_react6.MessageSquare, { className: "w-6 h-6 text-white" })
     ),
-    hasUnread && !isOpen && /* @__PURE__ */ import_react9.default.createElement("span", { className: "absolute top-0 right-0 w-4 h-4 bg-rose-500 rounded-full border-2 border-white flex items-center justify-center text-[9px] font-bold text-white" }, "1")
+    hasUnread && !isOpen && /* @__PURE__ */ import_react10.default.createElement("span", { className: "absolute top-0 right-0 w-4 h-4 bg-rose-500 rounded-full border-2 border-white flex items-center justify-center text-[9px] font-bold text-white" }, "1")
   ));
 }
 
 // src/components/DocumentUpload.tsx
-var import_react10 = __toESM(require("react"));
+var import_react11 = __toESM(require("react"));
 var import_lucide_react7 = require("lucide-react");
 function DocumentUpload({ namespace, onUploadComplete, className = "" }) {
   const { ui } = useConfig();
-  const [fileStates, setFileStates] = (0, import_react10.useState)([]);
-  const [isDragging, setIsDragging] = (0, import_react10.useState)(false);
-  const fileInputRef = (0, import_react10.useRef)(null);
+  const [fileStates, setFileStates] = (0, import_react11.useState)([]);
+  const [isDragging, setIsDragging] = (0, import_react11.useState)(false);
+  const fileInputRef = (0, import_react11.useRef)(null);
   const addFiles = (files) => {
     const newStates = files.map((file) => ({ file, status: "idle" }));
     setFileStates((prev) => [...prev, ...newStates]);
@@ -1969,7 +2144,7 @@ function DocumentUpload({ namespace, onUploadComplete, className = "" }) {
   };
   const isUploading = fileStates.some((s) => s.status === "uploading");
   const hasIdle = fileStates.some((s) => s.status === "idle");
-  return /* @__PURE__ */ import_react10.default.createElement(
+  return /* @__PURE__ */ import_react11.default.createElement(
     "div",
     {
       className: `p-6 border-2 border-dashed transition-all duration-300 rounded-2xl ${isDragging ? "border-emerald-500 bg-emerald-50/50 dark:bg-emerald-500/5" : "border-slate-200 dark:border-white/10 bg-white dark:bg-white/5"} ${className}`,
@@ -1977,14 +2152,14 @@ function DocumentUpload({ namespace, onUploadComplete, className = "" }) {
       onDragLeave,
       onDrop
     },
-    /* @__PURE__ */ import_react10.default.createElement("div", { className: "flex flex-col items-center justify-center text-center" }, /* @__PURE__ */ import_react10.default.createElement(
+    /* @__PURE__ */ import_react11.default.createElement("div", { className: "flex flex-col items-center justify-center text-center" }, /* @__PURE__ */ import_react11.default.createElement(
       "div",
       {
         className: "w-12 h-12 rounded-full flex items-center justify-center mb-4 shadow-sm",
         style: { background: `linear-gradient(135deg, ${ui.primaryColor}20, ${ui.accentColor}20)` }
       },
-      /* @__PURE__ */ import_react10.default.createElement(import_lucide_react7.Upload, { className: "w-6 h-6", style: { color: ui.primaryColor } })
-    ), /* @__PURE__ */ import_react10.default.createElement("h3", { className: "text-slate-900 dark:text-white font-semibold mb-1" }, "Upload Documents"), /* @__PURE__ */ import_react10.default.createElement("p", { className: "text-slate-500 dark:text-white/40 text-sm mb-6 max-w-xs" }, "Drag and drop PDF, DOCX, TXT, or JSON files to train your AI on your own data."), /* @__PURE__ */ import_react10.default.createElement(
+      /* @__PURE__ */ import_react11.default.createElement(import_lucide_react7.Upload, { className: "w-6 h-6", style: { color: ui.primaryColor } })
+    ), /* @__PURE__ */ import_react11.default.createElement("h3", { className: "text-slate-900 dark:text-white font-semibold mb-1" }, "Upload Documents"), /* @__PURE__ */ import_react11.default.createElement("p", { className: "text-slate-500 dark:text-white/40 text-sm mb-6 max-w-xs" }, "Drag and drop PDF, DOCX, TXT, or JSON files to train your AI on your own data."), /* @__PURE__ */ import_react11.default.createElement(
       "button",
       {
         onClick: () => {
@@ -2000,7 +2175,7 @@ function DocumentUpload({ namespace, onUploadComplete, className = "" }) {
         }
       },
       "Select Files"
-    ), /* @__PURE__ */ import_react10.default.createElement(
+    ), /* @__PURE__ */ import_react11.default.createElement(
       "input",
       {
         ref: fileInputRef,
@@ -2011,22 +2186,22 @@ function DocumentUpload({ namespace, onUploadComplete, className = "" }) {
         accept: ".pdf,.docx,.txt,.md,.json,.csv"
       }
     )),
-    fileStates.length > 0 && /* @__PURE__ */ import_react10.default.createElement("div", { className: "mt-8 space-y-3" }, fileStates.map((state, i) => /* @__PURE__ */ import_react10.default.createElement(
+    fileStates.length > 0 && /* @__PURE__ */ import_react11.default.createElement("div", { className: "mt-8 space-y-3" }, fileStates.map((state, i) => /* @__PURE__ */ import_react11.default.createElement(
       "div",
       {
         key: i,
         className: "flex items-center justify-between p-3 rounded-xl bg-slate-50 dark:bg-white/5 border border-slate-100 dark:border-white/10"
       },
-      /* @__PURE__ */ import_react10.default.createElement("div", { className: "flex items-center gap-3 overflow-hidden" }, /* @__PURE__ */ import_react10.default.createElement("div", { className: "w-8 h-8 rounded-lg bg-white dark:bg-white/10 flex items-center justify-center shadow-sm" }, /* @__PURE__ */ import_react10.default.createElement(import_lucide_react7.File, { className: "w-4 h-4 text-slate-400" })), /* @__PURE__ */ import_react10.default.createElement("div", { className: "truncate" }, /* @__PURE__ */ import_react10.default.createElement("p", { className: "text-xs font-medium text-slate-700 dark:text-white/80 truncate" }, state.file.name), /* @__PURE__ */ import_react10.default.createElement("p", { className: "text-[10px] text-slate-400" }, (state.file.size / 1024).toFixed(1), " KB"))),
-      /* @__PURE__ */ import_react10.default.createElement("div", { className: "flex items-center gap-2" }, state.status === "uploading" && /* @__PURE__ */ import_react10.default.createElement(import_lucide_react7.Loader2, { className: "w-4 h-4 text-slate-400 animate-spin" }), state.status === "success" && /* @__PURE__ */ import_react10.default.createElement(import_lucide_react7.CheckCircle, { className: "w-4 h-4 text-emerald-500" }), state.status === "error" && /* @__PURE__ */ import_react10.default.createElement("div", { title: state.error }, /* @__PURE__ */ import_react10.default.createElement(import_lucide_react7.AlertCircle, { className: "w-4 h-4 text-rose-500" })), state.status !== "uploading" && /* @__PURE__ */ import_react10.default.createElement(
+      /* @__PURE__ */ import_react11.default.createElement("div", { className: "flex items-center gap-3 overflow-hidden" }, /* @__PURE__ */ import_react11.default.createElement("div", { className: "w-8 h-8 rounded-lg bg-white dark:bg-white/10 flex items-center justify-center shadow-sm" }, /* @__PURE__ */ import_react11.default.createElement(import_lucide_react7.File, { className: "w-4 h-4 text-slate-400" })), /* @__PURE__ */ import_react11.default.createElement("div", { className: "truncate" }, /* @__PURE__ */ import_react11.default.createElement("p", { className: "text-xs font-medium text-slate-700 dark:text-white/80 truncate" }, state.file.name), /* @__PURE__ */ import_react11.default.createElement("p", { className: "text-[10px] text-slate-400" }, (state.file.size / 1024).toFixed(1), " KB"))),
+      /* @__PURE__ */ import_react11.default.createElement("div", { className: "flex items-center gap-2" }, state.status === "uploading" && /* @__PURE__ */ import_react11.default.createElement(import_lucide_react7.Loader2, { className: "w-4 h-4 text-slate-400 animate-spin" }), state.status === "success" && /* @__PURE__ */ import_react11.default.createElement(import_lucide_react7.CheckCircle, { className: "w-4 h-4 text-emerald-500" }), state.status === "error" && /* @__PURE__ */ import_react11.default.createElement("div", { title: state.error }, /* @__PURE__ */ import_react11.default.createElement(import_lucide_react7.AlertCircle, { className: "w-4 h-4 text-rose-500" })), state.status !== "uploading" && /* @__PURE__ */ import_react11.default.createElement(
         "button",
         {
           onClick: () => removeFile(i),
           className: "p-1 rounded-md hover:bg-slate-200 dark:hover:bg-white/10 transition-colors"
         },
-        /* @__PURE__ */ import_react10.default.createElement(import_lucide_react7.X, { className: "w-3.5 h-3.5 text-slate-400" })
+        /* @__PURE__ */ import_react11.default.createElement(import_lucide_react7.X, { className: "w-3.5 h-3.5 text-slate-400" })
       ))
-    )), hasIdle && !isUploading && /* @__PURE__ */ import_react10.default.createElement(
+    )), hasIdle && !isUploading && /* @__PURE__ */ import_react11.default.createElement(
       "button",
       {
         onClick: uploadFiles,