@ai-matrx/chat 0.4.2 → 0.4.8

package/dist/tool-call-visualization/renderers/fs/FsInline.js

@@ -4,7 +4,7 @@ import React from "react";
 import { ChevronRight, File, Folder, FolderOpen } from "lucide-react";
 import { formatFileSize } from "@ai-matrx/kit/format";
 import { cn } from "@ai-matrx/design-system";
-import { BasicMarkdownContent } from "../../../host/markdown-slots.js";
+import { BasicMarkdownContent } from "@ai-matrx/rich-content/display/chat-markdown/BasicMarkdownContent";
 import { getArg, isTerminal, resultAsObject } from "../_shared.js";
 import { GenericRenderer } from "../../registry/GenericRenderer.js";
 import { ToolErrorCard } from "../../result-fields/ToolErrorCard.js";

package/dist/tool-call-visualization/renderers/random-wheel/RandomWheelInline.js

@@ -22,7 +22,7 @@ import {
 import { useAppDispatch } from "../../../store/hooks.js";
 import { cn } from "@ai-matrx/design-system";
 import { setContextEntry } from "../../../agents/redux/execution-system/instance-context/instance-context.slice.js";
-import { BasicMarkdownContent } from "../../../host/markdown-slots.js";
+import { BasicMarkdownContent } from "@ai-matrx/rich-content/display/chat-markdown/BasicMarkdownContent";
 import { filterStepEvents, isTerminal, resultAsObject } from "../_shared.js";
 import { ErrorAlchemyMenu } from "../../../host/ui-slots.js";
 const SPIN_FULL_TURNS = 6;

package/dist/tool-call-visualization/renderers/research/ResearchOverlay.js

@@ -12,10 +12,7 @@ import {
   Link2
 } from "lucide-react";
 import { cn } from "@ai-matrx/design-system";
-import { RichContent } from "../../../host/ui-slots.js";
-import { copyRichContent } from "../../../host/ui-slots.js";
-import { RichDocument } from "../../../host/ui-slots.js";
-import { BasicMarkdownContent } from "../../../host/markdown-slots.js";
+import { BasicMarkdownContent } from "@ai-matrx/rich-content/display/chat-markdown/BasicMarkdownContent";
 import { resultAsString } from "../_shared.js";
 import {
   parseSearch,
@@ -23,6 +20,9 @@ import {
   getDomain
 } from "../search/parseSearch.js";
 import { Button } from "@ai-matrx/design-system/controls";
+import { RichContent } from "@ai-matrx/rich-content/levels/RichContent";
+import { copyRichContent } from "@ai-matrx/rich-content/copy/copy-commands";
+import { RichDocument } from "@ai-matrx/rich-content/rich-document/RichDocument";
 const Favicon = ({ url, className }) => {
   const [failed, setFailed] = useState(false);
   const src = url ? getFaviconUrl(url) : "";

package/dist/tool-call-visualization/renderers/research/SubagentReportBlock.js

@@ -10,10 +10,10 @@ import {
   Minimize2
 } from "lucide-react";
 import { cn } from "@ai-matrx/design-system";
-import { RichContent } from "../../../host/ui-slots.js";
-import { RichDocument } from "../../../host/ui-slots.js";
 import { useAutoScrollOnStream } from "../useAutoScrollOnStream.js";
 import { AGENT_ICON } from "@ai-matrx/icons/domain";
+import { RichContent } from "@ai-matrx/rich-content/levels/RichContent";
+import { RichDocument } from "@ai-matrx/rich-content/rich-document/RichDocument";
 const PARTIAL_MAX_PX = 400;
 const SubagentReportBlock = ({
   report,

package/dist/tool-call-visualization/renderers/scrape/ScrapeOverlay.js

@@ -10,7 +10,7 @@ import {
 } from "lucide-react";
 import { cn } from "@ai-matrx/design-system";
 import { InlineMediaRef } from "@ai-matrx/media/react";
-import { BasicMarkdownContent } from "../../../host/markdown-slots.js";
+import { BasicMarkdownContent } from "@ai-matrx/rich-content/display/chat-markdown/BasicMarkdownContent";
 import { getFaviconUrl } from "../search/parseSearch.js";
 import { parseScrape } from "./parseScrape.js";
 import { AGENT_ICON } from "@ai-matrx/icons/domain";

package/dist/tool-call-visualization/renderers/search/SearchInline.js

@@ -10,7 +10,7 @@ import {
   BookOpen
 } from "lucide-react";
 import { cn } from "@ai-matrx/design-system";
-import { BasicMarkdownContent } from "../../../host/markdown-slots.js";
+import { BasicMarkdownContent } from "@ai-matrx/rich-content/display/chat-markdown/BasicMarkdownContent";
 import { useAppSelector } from "../../../store/hooks.js";
 import { useOpenScraperWindow } from "../../../host/window-openers.js";
 import { selectIsLatestToolActivity } from "../../../agents/redux/execution-system/active-requests/active-requests.selectors.js";

package/dist/tool-call-visualization/renderers/search/SearchOverlay.js

@@ -12,7 +12,7 @@ import {
   Lightbulb
 } from "lucide-react";
 import { cn } from "@ai-matrx/design-system";
-import { BasicMarkdownContent } from "../../../host/markdown-slots.js";
+import { BasicMarkdownContent } from "@ai-matrx/rich-content/display/chat-markdown/BasicMarkdownContent";
 import { PartPeekPopover } from "../_shared-entity/PartPeekPopover.js";
 import { resultAsString } from "../_shared.js";
 import {

package/dist/tool-call-visualization/renderers/sql/SqlInline.js

@@ -7,7 +7,7 @@ import {
   CollapsibleContent,
   CollapsibleTrigger
 } from "@ai-matrx/design-system";
-import { BasicMarkdownContent } from "../../../host/markdown-slots.js";
+import { BasicMarkdownContent } from "@ai-matrx/rich-content/display/chat-markdown/BasicMarkdownContent";
 import { getArg, isTerminal, resultAsObject } from "../_shared.js";
 import { ResultValue } from "../../result-fields/ResultValue.js";
 import { ToolResultValue } from "../../result-fields/ToolResultValue.js";

package/dist/tool-call-visualization/result-fields/KeyValueGrid.js

@@ -16,7 +16,7 @@ import {
 } from "./document-presentation.js";
 import { KindValueNode } from "./KindValueNode.js";
 import { rootKindSlug } from "../../utils/content-ir/surfaces/json-kind-signal.js";
-import { useReportKindAtRawRenderer } from "../../utils/content-ir/report-kind-at-raw-renderer.js";
+import { useReportKindAtRawRenderer } from "@ai-matrx/rich-content/utils/report-kind-at-raw-renderer";
 import { humanizeIdentifier } from "@ai-matrx/kit/text-case";
 import { Button } from "@ai-matrx/design-system/controls";
 const INLINE_ENTRY_CAP = 8;

package/dist/tool-call-visualization/result-fields/ResultMarkdown.js

@@ -2,7 +2,7 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import React from "react";
 import { ChevronDown, ChevronUp } from "lucide-react";
-import { BasicMarkdownContent } from "../../host/markdown-slots.js";
+import { BasicMarkdownContent } from "@ai-matrx/rich-content/display/chat-markdown/BasicMarkdownContent";
 import { Collapsible, CollapsibleContent } from "@ai-matrx/design-system";
 import { cn } from "@ai-matrx/design-system";
 import { Button } from "@ai-matrx/design-system/controls";

package/dist/tool-call-visualization/result-fields/ResultValue.js

@@ -17,7 +17,7 @@ import { KindValueNode } from "./KindValueNode.js";
 import { ResultRecordRef } from "./ResultRecordRef.js";
 import { TextWithDoors } from "../../host/ui-slots.js";
 import { valueCarriesKind } from "../../utils/content-ir/surfaces/json-kind-signal.js";
-import { useReportKindAtRawRenderer } from "../../utils/content-ir/report-kind-at-raw-renderer.js";
+import { useReportKindAtRawRenderer } from "@ai-matrx/rich-content/utils/report-kind-at-raw-renderer";
 import { Button } from "@ai-matrx/design-system/controls";
 const INLINE_MAX_DEPTH = 2;
 const INLINE_ROW_CAP = 3;

package/dist/tool-call-visualization/surface-write/SurfaceWriteDiff.js

@@ -7,7 +7,6 @@ import {
   LARGE_INPUT_CHARS,
   TextDiff
 } from "@ai-matrx/diff/react";
-import { RichContent } from "../../host/ui-slots.js";
 import { useIsMobile } from "@ai-matrx/kit/media-query";
 import { useSessionKnob } from "../../host/prefs-react.js";
 import { cn } from "@ai-matrx/design-system";
@@ -16,6 +15,7 @@ import {
   diffLanguageOf
 } from "./readSurfaceWrite.js";
 import { formatCount } from "@ai-matrx/kit/format";
+import { RichContent } from "@ai-matrx/rich-content/levels/RichContent";
 function viewFromKnob(value) {
   if (value === "split") return "split";
   if (value === "changes") return "highlight";

package/dist/ui/AudioOutputBlockSkeleton.d.ts

@@ -0,0 +1,17 @@
+/**
+ * components/mardown-display/blocks/audio/AudioOutputBlockSkeleton.tsx
+ *
+ * The loading twin of `<AudioOutputBlock>` (landscape layout). Same outer
+ * card, same dimensions, same internal grid — so when generation finishes and
+ * the real player mounts, NOTHING shifts. Use this anywhere an audio response
+ * is being generated/resolved instead of a bare "Generating audio…" line.
+ *
+ * Purely presentational; no audio engine, no file actions.
+ */
+import React from "react";
+export interface AudioOutputBlockSkeletonProps {
+    /** Status line shown next to the shimmer. Default "Generating audio…". */
+    label?: string;
+}
+declare const AudioOutputBlockSkeleton: React.FC<AudioOutputBlockSkeletonProps>;
+export default AudioOutputBlockSkeleton;

package/dist/ui/AudioOutputBlockSkeleton.js

@@ -0,0 +1,78 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Music } from "lucide-react";
+function Bar({ className = "" }) {
+  return /* @__PURE__ */ jsx("div", { className: `rounded-full bg-muted/70 animate-pulse ${className}` });
+}
+const AudioOutputBlockSkeleton = ({
+  label = "Generating audio\u2026"
+}) => {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: "relative rounded-xl border border-border bg-card p-4 my-2 shadow-sm overflow-hidden",
+      role: "status",
+      "aria-label": label,
+      children: [
+        /* @__PURE__ */ jsx("div", { className: "pointer-events-none absolute inset-0 animate-[audio-shimmer_1.6s_ease-in-out_infinite] bg-gradient-to-r from-transparent via-primary/10 to-transparent" }),
+        /* @__PURE__ */ jsxs("div", { className: "relative flex gap-4 items-start", children: [
+          /* @__PURE__ */ jsx("div", { className: "w-16 h-16 rounded-xl flex-shrink-0 bg-gradient-to-br from-[hsl(var(--primary)/0.15)] to-[hsl(var(--secondary)/0.15)] border border-border flex items-center justify-center", children: /* @__PURE__ */ jsx(
+            Music,
+            {
+              size: 24,
+              className: "text-primary/60 animate-pulse",
+              strokeWidth: 1.5
+            }
+          ) }),
+          /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between mb-2", children: [
+              /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1 space-y-1.5", children: [
+                /* @__PURE__ */ jsx(Bar, { className: "h-3 w-2/3" }),
+                /* @__PURE__ */ jsx(Bar, { className: "h-2.5 w-1/3" })
+              ] }),
+              /* @__PURE__ */ jsx("div", { className: "flex items-end gap-[2px] h-5 w-8", "aria-hidden": true, children: [60, 90, 45, 75].map((h, i) => /* @__PURE__ */ jsx(
+                "span",
+                {
+                  className: "w-[3px] rounded-full bg-primary/50 animate-pulse",
+                  style: { height: `${h}%` }
+                },
+                i
+              )) })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "mb-2", children: [
+              /* @__PURE__ */ jsx(Bar, { className: "h-1.5 w-full" }),
+              /* @__PURE__ */ jsxs("div", { className: "flex justify-between mt-1", children: [
+                /* @__PURE__ */ jsx(Bar, { className: "h-2 w-8" }),
+                /* @__PURE__ */ jsx(Bar, { className: "h-2 w-8" })
+              ] })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+              /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1", children: [
+                /* @__PURE__ */ jsx(Bar, { className: "h-7 w-7 !rounded-full" }),
+                /* @__PURE__ */ jsx(Bar, { className: "h-9 w-9 !rounded-full bg-primary/30" }),
+                /* @__PURE__ */ jsx(Bar, { className: "h-7 w-7 !rounded-full" }),
+                /* @__PURE__ */ jsx(Bar, { className: "h-7 w-7 !rounded-full" })
+              ] }),
+              /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5 w-28", children: [
+                /* @__PURE__ */ jsx(Bar, { className: "h-4 w-4 !rounded-full" }),
+                /* @__PURE__ */ jsx(Bar, { className: "h-1.5 flex-1" })
+              ] })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 mt-2 pt-2 border-t border-border", children: [
+              /* @__PURE__ */ jsx(Bar, { className: "h-4 w-20" }),
+              /* @__PURE__ */ jsx(Bar, { className: "h-4 w-16" }),
+              /* @__PURE__ */ jsxs("span", { className: "ml-auto inline-flex items-center gap-1.5 text-[11px] text-muted-foreground", children: [
+                /* @__PURE__ */ jsx(Music, { size: 11, className: "text-primary/60" }),
+                label
+              ] })
+            ] })
+          ] })
+        ] })
+      ]
+    }
+  );
+};
+var AudioOutputBlockSkeleton_default = AudioOutputBlockSkeleton;
+export {
+  AudioOutputBlockSkeleton_default as default
+};

package/dist/ui/chat-protocol-from-stream.d.ts

@@ -0,0 +1,60 @@
+/**
+ * lib/chat-protocol/from-stream.ts
+ *
+ * Converts raw TypedStreamEvent arrays into CanonicalBlock[] / StreamingState.
+ *
+ * DESIGN PRINCIPLES
+ * ─────────────────
+ * • Zero platform deps — pure TypeScript, no JSX, no React.
+ * • Single source of truth — all stream-to-canonical logic lives here.
+ * • Immutable output — every returned object is readonly.
+ * • Event engine stays here — no consumer should pick through TypedStreamEvent[].
+ *
+ * STREAM CONTRACT (backend ToolEventPayload.event values)
+ * ────────────────────────────────────────────────────────
+ *   tool_started        → creates ToolCallBlock (phase: 'running')
+ *   tool_progress       → appends ToolProgress to existing block
+ *   tool_step           → appends ToolProgress to existing block
+ *   tool_result_preview → appends ToolProgress to existing block
+ *   tool_completed      → sets output, phase: 'complete'
+ *   tool_error          → sets error, phase: 'error'
+ *   chunk               → appends to / creates TextBlock
+ *   reasoning_chunk     → appends to / creates ThinkingBlock
+ *   error               → creates ErrorBlock
+ */
+import type { TypedStreamEvent } from "@ai-matrx/agents/generated/stream-events";
+import type { CanonicalBlock, ToolCallBlock, StreamingState, CanonicalMessage, MessageStatus } from "./chat-protocol-types.js";
+/**
+ * Incrementally converts a stream of StreamEvents into an ordered array of
+ * canonical blocks.
+ *
+ * Call this once on a complete array, or call it progressively in real time
+ * (the function is pure and O(n) — safe to call on every new event batch).
+ */
+export declare function buildCanonicalBlocks(events: TypedStreamEvent[]): CanonicalBlock[];
+/**
+ * Build a live StreamingState from the events received so far.
+ *
+ * This is a pure function — call it on every new event batch during streaming.
+ * The output is immutable and safe to pass directly to renderers.
+ */
+export declare function buildStreamingState(events: TypedStreamEvent[]): StreamingState;
+/**
+ * Extract the persistable subset of tool blocks from a completed stream.
+ *
+ * Progress notifications are stripped — only the final input/output/error
+ * state needs to be stored in the DB.
+ */
+export declare function extractPersistableToolBlocks(events: TypedStreamEvent[]): ReadonlyArray<ToolCallBlock>;
+/**
+ * Build a complete CanonicalMessage from a finished stream.
+ *
+ * Typically called in the `onComplete` callback of a streaming hook,
+ * immediately before the message is persisted and the stream events cleared.
+ */
+export declare function buildCanonicalMessageFromStream(params: {
+    id: string;
+    timestamp?: Date;
+    status?: MessageStatus;
+    events: TypedStreamEvent[];
+}): CanonicalMessage;

package/dist/ui/chat-protocol-from-stream.js

@@ -0,0 +1,135 @@
+import { PROTOCOL_VERSION } from "./chat-protocol-types.js";
+import { streamErrorText } from "@ai-matrx/agents/matrx";
+function buildCanonicalBlocks(events) {
+  const blocks = [];
+  const toolIndex = /* @__PURE__ */ new Map();
+  function getOrCreateToolBlock(callId, toolName) {
+    const existingIdx = toolIndex.get(callId);
+    if (existingIdx !== void 0) return existingIdx;
+    const idx = blocks.length;
+    blocks.push({
+      type: "tool_call",
+      callId,
+      toolName,
+      input: { name: toolName, arguments: {} },
+      progress: [],
+      phase: "pending"
+    });
+    toolIndex.set(callId, idx);
+    return idx;
+  }
+  for (const event of events) {
+    if (event.event === "chunk") {
+      const text = event.data.text;
+      if (!text) continue;
+      const last = blocks[blocks.length - 1];
+      if (last && last.type === "text") {
+        last.content += text;
+      } else {
+        blocks.push({ type: "text", content: text });
+      }
+      continue;
+    }
+    if (event.event === "reasoning_chunk") {
+      const text = event.data.text;
+      if (!text) continue;
+      const last = blocks[blocks.length - 1];
+      if (last && last.type === "thinking") {
+        last.content += text;
+      } else {
+        blocks.push({ type: "thinking", content: text });
+      }
+      continue;
+    }
+    if (event.event === "tool_event") {
+      const te = event.data;
+      const { call_id: callId, tool_name: toolName, message } = te;
+      const data = te.data ?? {};
+      switch (te.event) {
+        case "tool_started": {
+          const idx = getOrCreateToolBlock(callId, toolName);
+          const tb = blocks[idx];
+          const args = data.arguments;
+          tb.input = {
+            name: toolName,
+            arguments: args && typeof args === "object" && !Array.isArray(args) ? args : {}
+          };
+          tb.phase = "running";
+          if (message) tb.progress.push({ message });
+          break;
+        }
+        case "tool_progress":
+        case "tool_step":
+        case "tool_result_preview": {
+          const idx = getOrCreateToolBlock(callId, toolName);
+          const tb = blocks[idx];
+          if (message) tb.progress.push({ message });
+          break;
+        }
+        case "tool_completed": {
+          const idx = getOrCreateToolBlock(callId, toolName);
+          const tb = blocks[idx];
+          tb.output = {
+            status: "success",
+            result: data.result ?? data
+          };
+          tb.phase = "complete";
+          if (message) tb.progress.push({ message });
+          break;
+        }
+        case "tool_error": {
+          const idx = getOrCreateToolBlock(callId, toolName);
+          const tb = blocks[idx];
+          tb.error = { message: message ?? "Tool execution failed" };
+          tb.phase = "error";
+          break;
+        }
+      }
+      continue;
+    }
+    if (event.event === "error") {
+      const err = event.data;
+      blocks.push({
+        type: "error",
+        errorType: err.error_type,
+        message: streamErrorText(event) ?? err.message
+      });
+      continue;
+    }
+  }
+  return blocks;
+}
+function buildStreamingState(events) {
+  const blocks = buildCanonicalBlocks(events);
+  const hasEnd = events.some((e) => e.event === "end");
+  const hasError = events.some((e) => e.event === "error");
+  const isLive = !hasEnd && !hasError;
+  const streamError = blocks.find((b) => b.type === "error");
+  return {
+    blocks,
+    isLive,
+    streamError
+  };
+}
+function extractPersistableToolBlocks(events) {
+  const blocks = buildCanonicalBlocks(events);
+  return blocks.filter((b) => b.type === "tool_call");
+}
+function buildCanonicalMessageFromStream(params) {
+  const { id, timestamp = /* @__PURE__ */ new Date(), status = "complete", events } = params;
+  return {
+    id,
+    role: "assistant",
+    timestamp,
+    status,
+    isCondensed: false,
+    blocks: buildCanonicalBlocks(events),
+    schemaVersion: PROTOCOL_VERSION
+  };
+}
+export {
+  buildCanonicalBlocks,
+  buildCanonicalMessageFromStream,
+  buildStreamingState,
+  extractPersistableToolBlocks
+};

package/dist/ui/markdown-stream/EnhancedChatMarkdown.d.ts

@@ -0,0 +1,59 @@
+import type { AnswerEditRemarkMeta } from "../../agents/redux/execution-system/instance-resources/remarks.js";
+import React from "react";
+/** Server-processed block from the content_block protocol. */
+export interface ServerProcessedBlock {
+    blockId: string;
+    blockIndex: number;
+    type: string;
+    status: "streaming" | "complete" | "error";
+    content?: string | null;
+    data?: Record<string, unknown> | null;
+    metadata?: Record<string, unknown>;
+}
+export interface ChatMarkdownDisplayProps {
+    requestId?: string;
+    /**
+     * Every committed row this render stands for, in transcript order, when a
+     * multi-iteration turn renders as ONE member (its last row is `messageId`).
+     * Settled, the turn renders every row's record — each as its own run, so
+     * grouping and folding match a per-row reload.
+     */
+    recordMessageIds?: readonly string[];
+    streamSlotStart?: number;
+    streamSlotEnd?: number;
+    /**
+     * Render ONE collaboration `agent_call` child's live blocks from `requestId`
+     * (the parent request it streams inside) — the call id of the owning card.
+     * Its blocks go through the normal BlockRenderer path, so kinds route as in
+     * the parent (`selectAgentCallChildSlots`; the transcript still hides them).
+     */
+    agentCallId?: string;
+    /** Turn ID for DB-loaded turn rendering */
+    turnId?: string;
+    /** Conversation ID for DB-loaded turn rendering */
+    conversationId?: string;
+    content: string;
+    taskId?: string;
+    className?: string;
+    isStreamActive?: boolean;
+    /**
+     * An in-body edit produced the full new text. `previousContent` is the text
+     * the edit was applied to (this renderer's current content) — a persisting
+     * host diffs the two and splices ONLY the changed span into its stored bytes,
+     * because this content is display text (whitespace-normalized, reasoning
+     * scrubbed), never the stored row (RC-B5).
+     */
+    onContentChange?: (newContent: string, previousContent: string, remark?: AnswerEditRemarkMeta) => void;
+    analysisData?: Record<string, unknown>;
+    messageId?: string;
+    allowFullScreenEditor?: boolean;
+    hideCopyButton?: boolean;
+    /** Pre-processed blocks from server (new content_block protocol). Bypasses client-side parsing. */
+    serverProcessedBlocks?: ServerProcessedBlock[];
+    /**
+     * When false with onContentChange, edits call onContentChange(fullMarkdown) but the
+     * rendered document does not switch to local `editedContent` (UI keeps `content` prop).
+     */
+    applyLocalEdits?: boolean;
+}
+export declare const EnhancedChatMarkdownInternal: React.FC<ChatMarkdownDisplayProps>;