@adoptai/genui-components 0.1.32 → 0.1.33

package/dist/renderer.cjs

@@ -228,6 +228,24 @@ function renderInline(text) {
   }
   return parts;
 }
+function parseTableRow(line) {
+  let s = line.trim();
+  if (s.startsWith("|")) s = s.slice(1);
+  if (s.endsWith("|") && !s.endsWith("\\|")) s = s.slice(0, -1);
+  return s.split(new RegExp("(?<!\\\\)\\|")).map((c) => c.trim().replace(/\\\|/g, "|"));
+}
+function isTableSeparator(line) {
+  if (!line.includes("-")) return false;
+  const cells = parseTableRow(line);
+  return cells.length > 0 && cells.every((c) => /^:?-{1,}:?$/.test(c));
+}
+function alignFromSeparator(cell) {
+  const left = cell.startsWith(":");
+  const right = cell.endsWith(":");
+  if (left && right) return "center";
+  if (right) return "right";
+  return "left";
+}
 function MarkdownBlock({ content }) {
   var _a;
   const lines = content.split("\n");
@@ -358,6 +376,74 @@ function MarkdownBlock({ content }) {
       );
       continue;
     }
+    if (trimmed.includes("|") && i + 1 < lines.length && isTableSeparator(lines[i + 1])) {
+      const headers = parseTableRow(trimmed);
+      const aligns = parseTableRow(lines[i + 1]).map(alignFromSeparator);
+      i += 2;
+      const rows = [];
+      while (i < lines.length) {
+        const li = lines[i].trim();
+        if (!li || !li.includes("|")) break;
+        rows.push(parseTableRow(li));
+        i++;
+      }
+      const colAlign = (idx) => {
+        var _a2;
+        return (_a2 = aligns[idx]) != null ? _a2 : "left";
+      };
+      elements.push(
+        /* @__PURE__ */ jsxRuntime.jsx("div", { style: { margin: "6px 0 10px 0", overflowX: "auto" }, children: /* @__PURE__ */ jsxRuntime.jsxs(
+          "table",
+          {
+            style: {
+              borderCollapse: "collapse",
+              width: "100%",
+              fontSize: "12px",
+              lineHeight: 1.4
+            },
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx("thead", { children: /* @__PURE__ */ jsxRuntime.jsx("tr", { children: headers.map((h, idx) => /* @__PURE__ */ jsxRuntime.jsx(
+                "th",
+                {
+                  style: {
+                    textAlign: colAlign(idx),
+                    padding: "6px 10px",
+                    borderBottom: `1px solid ${BORDER}`,
+                    background: PAPER,
+                    fontWeight: 600,
+                    color: MUTED,
+                    fontSize: "10px",
+                    textTransform: "uppercase",
+                    letterSpacing: "0.04em",
+                    whiteSpace: "nowrap"
+                  },
+                  children: renderInline(h)
+                },
+                idx
+              )) }) }),
+              /* @__PURE__ */ jsxRuntime.jsx("tbody", { children: rows.map((cells, rIdx) => /* @__PURE__ */ jsxRuntime.jsx("tr", { children: headers.map((_, cIdx) => {
+                var _a2;
+                return /* @__PURE__ */ jsxRuntime.jsx(
+                  "td",
+                  {
+                    style: {
+                      textAlign: colAlign(cIdx),
+                      padding: "6px 10px",
+                      borderBottom: `1px solid ${BORDER}`,
+                      color: "var(--foreground)",
+                      verticalAlign: "top"
+                    },
+                    children: renderInline((_a2 = cells[cIdx]) != null ? _a2 : "")
+                  },
+                  cIdx
+                );
+              }) }, rIdx)) })
+            ]
+          }
+        ) }, key++)
+      );
+      continue;
+    }
     elements.push(
       /* @__PURE__ */ jsxRuntime.jsx("p", { style: { margin: "0 0 8px 0", lineHeight: 1.65 }, children: renderInline(trimmed) }, key++)
     );