@parhelia/core 0.1.10745

package/dist/editor/ai/AiResponseMessage.js

@@ -0,0 +1,684 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useEffect, useMemo } from "react";
+import { formatTime } from "../utils";
+import { useEditContext } from "../client/editContext";
+import { ToolCallDisplay } from "./ToolCallDisplay";
+import { MediaImage } from "./MediaImage";
+import { X } from "lucide-react";
+import { Button } from "../../components/ui/button";
+import { Checkbox } from "../../components/ui/checkbox";
+import { SecretAgentIcon } from "../ui/Icons";
+// Helper to extract partial quick actions from potentially incomplete JSON during streaming
+const extractPartialQuickActions = (jsonText) => {
+    const actions = [];
+    // First try to parse complete JSON
+    try {
+        const parsed = JSON.parse(jsonText);
+        const rawActions = Array.isArray(parsed)
+            ? parsed
+            : parsed?.actions || parsed?.buttons || parsed?.choices || [];
+        if (Array.isArray(rawActions)) {
+            rawActions.forEach((a) => {
+                if (!a)
+                    return;
+                const label = a.label || a.text || String(a.value || a.prompt || "");
+                if (label) {
+                    actions.push({
+                        id: a.id,
+                        label,
+                        prompt: a.prompt,
+                        value: a.value,
+                        style: a.style,
+                        behavior: a.behavior &&
+                            (a.behavior === "compose" || a.behavior === "submit")
+                            ? a.behavior
+                            : a.submit === false ||
+                                a.compose === true ||
+                                a.draft === true ||
+                                a.mode === "compose"
+                                ? "compose"
+                                : undefined,
+                        placeholder: a.placeholder,
+                    });
+                }
+            });
+        }
+        return actions;
+    }
+    catch (e) {
+        // JSON is incomplete, try to extract whatever complete action objects we can find
+    }
+    // Look for individual action objects in the partial JSON
+    // Match patterns like: { "label": "...", ... }
+    const labelPattern = /"(?:label|text)"\s*:\s*"([^"\\]*(\\.[^"\\]*)*)"/g;
+    const labelMatches = [];
+    let labelMatch;
+    while ((labelMatch = labelPattern.exec(jsonText)) !== null) {
+        if (labelMatch[1]) {
+            labelMatches.push({
+                label: labelMatch[1],
+                startIdx: labelMatch.index,
+            });
+        }
+    }
+    // For each label field found, try to find and parse the enclosing object
+    for (const { label, startIdx } of labelMatches) {
+        // Find the opening brace before this label field
+        let openBrace = -1;
+        for (let i = startIdx - 1; i >= 0; i--) {
+            if (jsonText[i] === "{") {
+                openBrace = i;
+                break;
+            }
+            if (jsonText[i] === "}")
+                break; // Hit another object's end
+        }
+        if (openBrace === -1)
+            continue;
+        // Find the closing brace after this label field
+        let closeBrace = -1;
+        let depth = 0;
+        for (let i = openBrace; i < jsonText.length; i++) {
+            if (jsonText[i] === "{")
+                depth++;
+            if (jsonText[i] === "}") {
+                depth--;
+                if (depth === 0) {
+                    closeBrace = i;
+                    break;
+                }
+            }
+        }
+        // Extract the object and try to parse it
+        const objStr = closeBrace !== -1
+            ? jsonText.substring(openBrace, closeBrace + 1)
+            : jsonText.substring(openBrace) + "}"; // Try to close incomplete object
+        try {
+            const obj = JSON.parse(objStr);
+            const actionLabel = obj.label || obj.text || String(obj.value || obj.prompt || "");
+            if (actionLabel) {
+                actions.push({
+                    id: obj.id,
+                    label: actionLabel,
+                    prompt: obj.prompt,
+                    value: obj.value,
+                    style: obj.style,
+                    behavior: obj.behavior &&
+                        (obj.behavior === "compose" || obj.behavior === "submit")
+                        ? obj.behavior
+                        : obj.submit === false ||
+                            obj.compose === true ||
+                            obj.draft === true ||
+                            obj.mode === "compose"
+                            ? "compose"
+                            : undefined,
+                    placeholder: obj.placeholder,
+                });
+            }
+        }
+        catch (e) {
+            // Skip malformed objects
+        }
+    }
+    return actions;
+};
+function parseContentSegments(content, hideIncomplete) {
+    if (!content)
+        return [];
+    const segments = [];
+    const fencedQuickToken = "```quick_action_buttons";
+    const plainQuickToken = "quick_action_buttons";
+    const fencedTodoToken = "```todo_list";
+    const plainTodoToken = "todo_list";
+    const fencedMediaToken = "```media_item";
+    // Helper: find next valid plain token occurrence (at line start or after newline)
+    const findNextPlainHeader = (token, fromIndex) => {
+        let idx = content.indexOf(token, fromIndex);
+        while (idx !== -1) {
+            const before = idx > 0 ? content[idx - 1] : "\n";
+            const after = content[idx + token.length] || "\n";
+            const isBoundaryBefore = before === "\n" || before === "\r";
+            const isBoundaryAfter = after === "\n" || after === "\r" || after === ":" || /\s/.test(after);
+            // Ensure it's not the fenced token which would have ``` right before
+            const isFencedPrefix = content.slice(Math.max(0, idx - 3), idx) === "```";
+            if (isBoundaryBefore && isBoundaryAfter && !isFencedPrefix)
+                return idx;
+            idx = content.indexOf(token, idx + 1);
+        }
+        return -1;
+    };
+    // Helper: match JSON object braces starting at first '{'
+    const findMatchingBraceEnd = (startPos) => {
+        let i = startPos;
+        let depth = 0;
+        let inString = false;
+        let stringQuote = null;
+        let escaped = false;
+        for (; i < content.length; i++) {
+            const ch = content[i];
+            if (inString) {
+                if (escaped) {
+                    escaped = false;
+                }
+                else if (ch === "\\") {
+                    escaped = true;
+                }
+                else if (ch === stringQuote) {
+                    inString = false;
+                    stringQuote = null;
+                }
+                continue;
+            }
+            else {
+                if (ch === '"' || ch === "'") {
+                    inString = true;
+                    stringQuote = ch;
+                    continue;
+                }
+                if (ch === "{")
+                    depth++;
+                if (ch === "}") {
+                    depth--;
+                    if (depth === 0)
+                        return i;
+                }
+            }
+        }
+        return -1;
+    };
+    let cursor = 0;
+    while (cursor < content.length) {
+        const nextFencedQuick = content.indexOf(fencedQuickToken, cursor);
+        const nextPlainQuick = findNextPlainHeader(plainQuickToken, cursor);
+        const nextFencedTodo = content.indexOf(fencedTodoToken, cursor);
+        const nextPlainTodo = findNextPlainHeader(plainTodoToken, cursor);
+        const nextFencedMedia = content.indexOf(fencedMediaToken, cursor);
+        const candidates = [];
+        if (nextFencedQuick !== -1)
+            candidates.push({
+                start: nextFencedQuick,
+                kind: "fenced",
+                type: "quick",
+            });
+        if (nextPlainQuick !== -1)
+            candidates.push({ start: nextPlainQuick, kind: "plain", type: "quick" });
+        if (nextFencedTodo !== -1)
+            candidates.push({ start: nextFencedTodo, kind: "fenced", type: "todo" });
+        if (nextPlainTodo !== -1)
+            candidates.push({ start: nextPlainTodo, kind: "plain", type: "todo" });
+        if (nextFencedMedia !== -1)
+            candidates.push({ start: nextFencedMedia, kind: "fenced", type: "media" });
+        let pick = null;
+        if (candidates.length > 0) {
+            pick = candidates.reduce((min, cur) => cur.start < min.start ? cur : min);
+        }
+        if (pick === null) {
+            const tail = content.slice(cursor);
+            if (tail)
+                segments.push({ kind: "text", text: tail });
+            break;
+        }
+        // Push any text before the token
+        const textBefore = content.slice(cursor, pick.start);
+        if (textBefore)
+            segments.push({ kind: "text", text: textBefore });
+        if (pick.kind === "fenced") {
+            const openTokenLength = pick.type === "quick"
+                ? fencedQuickToken.length
+                : pick.type === "todo"
+                    ? fencedTodoToken.length
+                    : fencedMediaToken.length;
+            const afterOpenLineStart = pick.start + openTokenLength;
+            const openLineMatch = content
+                .slice(afterOpenLineStart)
+                .match(/^[^\n\r]*\r?\n?/);
+            const openLineLength = openLineMatch ? openLineMatch[0].length : 0;
+            const jsonStart = afterOpenLineStart + openLineLength;
+            const close = content.indexOf("```", jsonStart);
+            const jsonText = (close === -1
+                ? content.slice(jsonStart)
+                : content.slice(jsonStart, close)).trim();
+            if (close === -1) {
+                // Incomplete fenced block during streaming
+                if (hideIncomplete && pick.type === "quick") {
+                    // Try to parse partial quick actions and show what we have so far
+                    const partialActions = extractPartialQuickActions(jsonText);
+                    if (partialActions.length > 0) {
+                        segments.push({ kind: "actions", actions: partialActions });
+                    }
+                    break;
+                }
+                else if (hideIncomplete) {
+                    break;
+                }
+                else {
+                    segments.push({ kind: "text", text: content.slice(pick.start) });
+                    break;
+                }
+            }
+            // Handle media_item blocks separately (pipe-delimited format, not JSON)
+            if (pick.type === "media") {
+                const items = [];
+                // Parse pipe-delimited format: {GUID}|Label or just {GUID}
+                const lines = jsonText.split(/\r?\n/).map(l => l.trim()).filter(l => l);
+                for (const line of lines) {
+                    // Only parse complete lines (must have closing brace)
+                    if (line.includes('}')) {
+                        const pipeIndex = line.indexOf('|');
+                        if (pipeIndex !== -1) {
+                            // Has label
+                            const itemId = line.substring(0, pipeIndex).trim();
+                            const label = line.substring(pipeIndex + 1).trim();
+                            if (itemId && /\{[0-9a-fA-F-]+\}/.test(itemId)) {
+                                items.push({ itemId, label: label || undefined });
+                            }
+                        }
+                        else {
+                            // No label
+                            const itemId = line.trim();
+                            if (itemId && /\{[0-9a-fA-F-]+\}/.test(itemId)) {
+                                items.push({ itemId });
+                            }
+                        }
+                    }
+                }
+                if (items.length > 0) {
+                    segments.push({
+                        kind: "media",
+                        items: items
+                    });
+                }
+                cursor = close + 3;
+                continue;
+            }
+            try {
+                const parsed = JSON.parse(jsonText);
+                if (pick.type === "quick") {
+                    const rawActions = Array.isArray(parsed)
+                        ? parsed
+                        : parsed?.actions || parsed?.buttons || parsed?.choices || [];
+                    const actions = [];
+                    if (Array.isArray(rawActions)) {
+                        rawActions.forEach((a) => {
+                            if (!a)
+                                return;
+                            const action = {
+                                id: a.id,
+                                label: a.label || a.text || String(a.value || a.prompt || ""),
+                                prompt: a.prompt,
+                                value: a.value,
+                                style: a.style,
+                                behavior: a.behavior &&
+                                    (a.behavior === "compose" || a.behavior === "submit")
+                                    ? a.behavior
+                                    : a.submit === false ||
+                                        a.compose === true ||
+                                        a.draft === true ||
+                                        a.mode === "compose"
+                                        ? "compose"
+                                        : undefined,
+                                placeholder: a.placeholder,
+                            };
+                            if (action.label)
+                                actions.push(action);
+                        });
+                    }
+                    if (actions.length > 0) {
+                        segments.push({ kind: "actions", actions });
+                    }
+                }
+                else if (pick.type === "todo") {
+                    // todo_list
+                    const todoItems = Array.isArray(parsed)
+                        ? parsed
+                        : parsed?.items || [];
+                    const title = Array.isArray(parsed) ? undefined : parsed?.title;
+                    const cleaned = (Array.isArray(todoItems) ? todoItems : [])
+                        .map((i) => {
+                        if (!i)
+                            return null;
+                        const text = i.text || i.label || String(i.task || i.title || "");
+                        if (!text)
+                            return null;
+                        return {
+                            id: i.id,
+                            text,
+                            done: !!(i.done ?? i.completed ?? i.checked),
+                            note: i.note || i.description,
+                        };
+                    })
+                        .filter(Boolean);
+                    if (cleaned.length > 0) {
+                        segments.push({ kind: "todo", title, items: cleaned });
+                    }
+                }
+            }
+            catch {
+                if (!hideIncomplete) {
+                    segments.push({
+                        kind: "text",
+                        text: content.slice(pick.start, close + 3),
+                    });
+                }
+            }
+            cursor = close + 3;
+            continue;
+        }
+        // Plain header without backticks
+        const headerTokenLength = pick.type === "quick" ? plainQuickToken.length : plainTodoToken.length;
+        const afterHeaderStart = pick.start + headerTokenLength;
+        const headerRestMatch = content
+            .slice(afterHeaderStart)
+            .match(/^[^\n\r]*\r?\n?/);
+        const headerRestLen = headerRestMatch ? headerRestMatch[0].length : 0;
+        const afterHeader = afterHeaderStart + headerRestLen;
+        // Find first '{' after header (could be same line or following lines)
+        const braceStart = content.indexOf("{", afterHeader);
+        if (braceStart === -1) {
+            if (hideIncomplete) {
+                break;
+            }
+            else {
+                // Treat as plain text if no JSON object is present
+                cursor = afterHeader;
+                continue;
+            }
+        }
+        const braceEnd = findMatchingBraceEnd(braceStart);
+        const jsonText = (braceEnd === -1
+            ? content.slice(braceStart)
+            : content.slice(braceStart, braceEnd + 1)).trim();
+        if (braceEnd === -1) {
+            // Incomplete plain JSON block during streaming
+            if (hideIncomplete && pick.type === "quick") {
+                // Try to parse partial quick actions and show what we have so far
+                const partialActions = extractPartialQuickActions(jsonText);
+                if (partialActions.length > 0) {
+                    segments.push({ kind: "actions", actions: partialActions });
+                }
+                break;
+            }
+            else if (hideIncomplete) {
+                break;
+            }
+            else {
+                // Incomplete JSON; include the rest as text
+                const remaining = content.slice(pick.start);
+                if (remaining)
+                    segments.push({ kind: "text", text: remaining });
+                break;
+            }
+        }
+        try {
+            const parsed = JSON.parse(jsonText);
+            if (pick.type === "quick") {
+                const rawActions = Array.isArray(parsed)
+                    ? parsed
+                    : parsed?.actions || parsed?.buttons || parsed?.choices || [];
+                const actions = [];
+                if (Array.isArray(rawActions)) {
+                    rawActions.forEach((a) => {
+                        if (!a)
+                            return;
+                        const action = {
+                            id: a.id,
+                            label: a.label || a.text || String(a.value || a.prompt || ""),
+                            prompt: a.prompt,
+                            value: a.value,
+                            style: a.style,
+                            behavior: a.behavior &&
+                                (a.behavior === "compose" || a.behavior === "submit")
+                                ? a.behavior
+                                : a.submit === false ||
+                                    a.compose === true ||
+                                    a.draft === true ||
+                                    a.mode === "compose"
+                                    ? "compose"
+                                    : undefined,
+                            placeholder: a.placeholder,
+                        };
+                        if (action.label)
+                            actions.push(action);
+                    });
+                }
+                if (actions.length > 0) {
+                    segments.push({ kind: "actions", actions });
+                }
+            }
+            else {
+                const todoItems = Array.isArray(parsed) ? parsed : parsed?.items || [];
+                const title = Array.isArray(parsed) ? undefined : parsed?.title;
+                const cleaned = (Array.isArray(todoItems) ? todoItems : [])
+                    .map((i) => {
+                    if (!i)
+                        return null;
+                    const text = i.text || i.label || String(i.task || i.title || "");
+                    if (!text)
+                        return null;
+                    return {
+                        id: i.id,
+                        text,
+                        done: !!(i.done ?? i.completed ?? i.checked),
+                        note: i.note || i.description,
+                    };
+                })
+                    .filter(Boolean);
+                if (cleaned.length > 0) {
+                    segments.push({ kind: "todo", title, items: cleaned });
+                }
+            }
+        }
+        catch {
+            // On parse failure, keep original as text (excluding already-pushed prefix)
+            const fallbackText = content.slice(pick.start, braceEnd + 1);
+            if (!hideIncomplete && fallbackText) {
+                segments.push({ kind: "text", text: fallbackText });
+            }
+        }
+        cursor = braceEnd + 1;
+    }
+    return segments;
+}
+// Helper to extract command links from markdown
+function extractCommandLinks(text) {
+    const links = [];
+    const commandLinkPattern = /\[([^\]]+)\]\(command:([^)]+)\)/g;
+    let match;
+    while ((match = commandLinkPattern.exec(text)) !== null) {
+        if (match[1] && match[2]) {
+            links.push({
+                label: match[1],
+                command: match[2],
+                index: match.index,
+            });
+        }
+    }
+    return { text, links };
+}
+function simpleFormatToHtml(text) {
+    return text
+        .replace(/^######\s+(.+)$/gm, '<h6 style="font-size: 0.75rem; font-weight: 500; margin: 0.75rem 0 0.25rem 0; color: #6b7280; letter-spacing: 0.01em; line-height: 1.3;">$1</h6>')
+        .replace(/^#####\s+(.+)$/gm, '<h5 style="font-size: 0.875rem; font-weight: 500; margin: 0.875rem 0 0.375rem 0; color: #4b5563; letter-spacing: 0.01em; line-height: 1.35;">$1</h5>')
+        .replace(/^####\s+(.+)$/gm, '<h4 style="font-size: 1rem; font-weight: 600; margin: 1rem 0 0.5rem 0; color: #374151; letter-spacing: -0.01em; line-height: 1.4;">$1</h4>')
+        .replace(/^###\s+(.+)$/gm, '<h3 style="font-size: 1.125rem; font-weight: 600; margin: 1.125rem 0 0.5rem 0; color: #1f2937; letter-spacing: -0.015em; line-height: 1.4;">$1</h3>')
+        .replace(/^##\s+(.+)$/gm, '<h2 style="font-size: 1.375rem; font-weight: 600; margin: 1.25rem 0 0.625rem 0; color: #111827; letter-spacing: -0.02em; line-height: 1.3;">$1</h2>')
+        .replace(/^#\s+(.+)$/gm, '<h1 style="font-size: 1.75rem; font-weight: 700; margin: 1.5rem 0 0.75rem 0; color: #0f172a; letter-spacing: -0.025em; line-height: 1.2;">$1</h1>')
+        .replace(/\*\*(.*?)\*\*/g, "<strong>$1</strong>")
+        .replace(/\n/g, "<br/>")
+        .replace(/<\/(h[1-6])><br\/>/g, "</$1>");
+}
+export function AiResponseMessage({ messages, finished, editOperations, error, onQuickAction, profileSvgIcon, agentId, agentName, }) {
+    const editContext = useEditContext();
+    // const [showFunctions, setShowFunctions] = useState(false);
+    const [changesRejected, setChangesRejected] = useState(undefined);
+    // Store tool calls to preserve them during streaming
+    const [preservedToolCalls, setPreservedToolCalls] = useState({});
+    // Track popover open state for each tool call
+    const [openPopovers, setOpenPopovers] = useState({});
+    // Helper to avoid unnecessary updates when tool calls are unchanged
+    const areToolCallsEqual = (a, b) => {
+        if (a === b)
+            return true;
+        if (!a || !b)
+            return false;
+        if (a.length !== b.length)
+            return false;
+        for (let i = 0; i < a.length; i++) {
+            const ai = a[i];
+            const bi = b[i];
+            if (ai?.id !== bi?.id ||
+                ai?.displayName !== bi?.displayName ||
+                ai?.function?.name !== bi?.function?.name ||
+                ai?.function?.arguments !== bi?.function?.arguments) {
+                return false;
+            }
+        }
+        return true;
+    };
+    // Update preserved tool calls when messages change, but only if values actually change
+    useEffect(() => {
+        setPreservedToolCalls((prev) => {
+            let changed = false;
+            const next = { ...prev };
+            for (const message of messages) {
+                const hasToolCalls = !!(message.tool_calls && message.tool_calls.length > 0);
+                if (!hasToolCalls)
+                    continue;
+                if (!areToolCallsEqual(next[message.id], message.tool_calls)) {
+                    next[message.id] = message.tool_calls;
+                    changed = true;
+                }
+            }
+            return changed ? next : prev;
+        });
+    }, [messages]);
+    const reversedEditOperations = [...editOperations].reverse();
+    const editHistory = editContext?.editHistory ?? [];
+    const canReject = editHistory.length >= editOperations.length &&
+        reversedEditOperations.find((x, index) => editHistory[index]?.id !== x.id || !editHistory[index]?.canUndo) === undefined;
+    // Calculate if we're currently streaming (for loading indicator)
+    const isStreaming = !finished && messages.length > 0;
+    // Get the last message for timestamp
+    const lastMessage = messages[messages.length - 1];
+    // Memoize filtered messages and their parsed content segments to avoid hooks inside loops
+    const nonToolAssistantMessages = useMemo(() => messages.filter((x) => x.role !== "tool" && x.role !== "user"), [messages]);
+    const flatItems = useMemo(() => {
+        const items = [];
+        nonToolAssistantMessages.forEach((message) => {
+            const contentString = (message.content ||
+                message.formattedContent ||
+                "");
+            const segments = parseContentSegments(contentString, isStreaming);
+            // Add content segments
+            segments.forEach((segment) => {
+                items.push({
+                    type: "segment",
+                    segment,
+                    messageId: message.id,
+                    message,
+                });
+            });
+            // Add tool calls if present
+            const toolCalls = message.tool_calls && message.tool_calls.length > 0
+                ? message.tool_calls
+                : preservedToolCalls[message.id] || [];
+            if (toolCalls.length > 0) {
+                items.push({
+                    type: "toolcalls",
+                    toolCalls,
+                    messageId: message.id,
+                    message,
+                });
+            }
+        });
+        return items;
+    }, [nonToolAssistantMessages, isStreaming, preservedToolCalls]);
+    return (_jsxs("div", { className: "flex gap-3 px-4 py-3", "data-testid": "agent-message", children: [_jsx("div", { className: "flex-shrink-0", children: profileSvgIcon ? (_jsx("div", { className: "text-gray-2 flex h-7 w-7 items-center justify-center [&>svg]:h-full [&>svg]:w-full", dangerouslySetInnerHTML: {
+                        __html: profileSvgIcon,
+                    } })) : (_jsx(SecretAgentIcon, { size: 24, strokeWidth: 1, className: "text-gray-2" })) }), _jsxs("div", { className: "min-w-0 flex-1 select-text", children: [_jsxs("div", { className: "mb-0.5 flex items-center gap-2", children: [_jsx("span", { className: "text-dark text-xs font-medium", children: agentName || "Agent" }), lastMessage && lastMessage.createdDate && (_jsx("span", { className: "text-xs text-gray-400", "data-testid": "agent-message-timestamp", "data-timestamp": lastMessage.createdDate, children: formatTime(new Date(lastMessage.createdDate)) }))] }), error && (_jsx("div", { className: "mb-2 rounded-lg border-l-4 border-red-500 bg-red-50 p-2.5", "data-testid": "agent-error", children: _jsxs("div", { className: "flex items-start", children: [_jsx("div", { className: "flex-shrink-0", children: _jsx(X, { className: "h-5 w-5 text-red-400", strokeWidth: 1 }) }), _jsxs("div", { className: "ml-3", children: [_jsx("p", { className: "text-sm font-medium text-red-800", children: "Agent Error" }), _jsx("p", { className: "mt-1 text-sm text-red-700", children: error })] })] }) })), flatItems.map((item, itemIndex) => {
+                        const prevItem = itemIndex > 0 ? flatItems[itemIndex - 1] : null;
+                        const shouldAddSpacing = prevItem?.type === "toolcalls" && item.type === "segment";
+                        if (item.type === "segment") {
+                            const segment = item.segment;
+                            const message = item.message;
+                            if (segment.kind === "text") {
+                                const trimmedText = segment.text.trim();
+                                if (!trimmedText)
+                                    return null;
+                                // Check for command links in the text
+                                const { text, links } = extractCommandLinks(trimmedText);
+                                if (links.length > 0) {
+                                    // Split text around command links and render buttons
+                                    const parts = [];
+                                    let lastIndex = 0;
+                                    links.forEach((link, linkIdx) => {
+                                        // Add text before the link
+                                        if (link.index > lastIndex) {
+                                            const textBefore = text.substring(lastIndex, link.index);
+                                            const html = simpleFormatToHtml(textBefore);
+                                            if (html) {
+                                                parts.push(_jsx("span", { dangerouslySetInnerHTML: { __html: html } }, `text-${itemIndex}-${linkIdx}`));
+                                            }
+                                        }
+                                        // Add the button
+                                        parts.push(_jsx(Button, { size: "sm", variant: "outline", className: "mx-1 inline-flex", onClick: () => onQuickAction?.({
+                                                label: link.label,
+                                                value: link.command,
+                                                prompt: link.command,
+                                            }, message), children: link.label }, `btn-${itemIndex}-${linkIdx}`));
+                                        // Find the end of this match in the original text
+                                        const matchEnd = link.index +
+                                            `[${link.label}](command:${link.command})`.length;
+                                        lastIndex = matchEnd;
+                                    });
+                                    // Add any remaining text after the last link
+                                    if (lastIndex < text.length) {
+                                        const textAfter = text.substring(lastIndex);
+                                        const html = simpleFormatToHtml(textAfter);
+                                        if (html) {
+                                            parts.push(_jsx("span", { dangerouslySetInnerHTML: { __html: html } }, `text-${itemIndex}-end`));
+                                        }
+                                    }
+                                    return (_jsx("div", { className: `prose prose-sm max-w-none text-xs text-gray-700 select-text ${shouldAddSpacing ? "mt-2" : ""}`, children: parts }, `item-${itemIndex}`));
+                                }
+                                // No command links, render as normal
+                                const html = simpleFormatToHtml(trimmedText);
+                                if (!html)
+                                    return null;
+                                return (_jsx("div", { className: `prose prose-sm max-w-none text-xs text-gray-700 select-text ${shouldAddSpacing ? "mt-2" : ""}`, dangerouslySetInnerHTML: { __html: html } }, `item-${itemIndex}`));
+                            }
+                            if (segment.kind === "todo") {
+                                const todo = segment;
+                                return (_jsxs("div", { className: `my-1 ${shouldAddSpacing ? "mt-2" : ""}`, children: [todo.title && (_jsx("div", { className: "mb-1 text-xs font-medium text-gray-800", children: todo.title })), _jsx("div", { className: "flex flex-col gap-1", children: todo.items.map((todoItem, iIdx) => (_jsxs("label", { className: "flex items-start gap-2 text-xs text-gray-700", children: [_jsx(Checkbox, { checked: !!todoItem.done, onCheckedChange: () => { }, "aria-readonly": true, className: "mt-0.5" }), _jsxs("div", { children: [_jsx("div", { className: todoItem.done ? "line-through opacity-70" : "", children: todoItem.text }), todoItem.note && (_jsx("div", { className: "text-gray-1 text-xs", children: todoItem.note }))] })] }, (todoItem.id || todoItem.text || "todo") + "-" + iIdx))) })] }, `item-${itemIndex}`));
+                            }
+                            if (segment.kind === "media") {
+                                const media = segment;
+                                return (_jsx("div", { className: `my-2 flex flex-col gap-3 ${shouldAddSpacing ? "mt-2" : ""}`, children: media.items.map((mediaItem, mIdx) => (_jsx(MediaImage, { itemId: mediaItem.itemId, label: mediaItem.label }, mediaItem.itemId || `media-${itemIndex}-${mIdx}`))) }, `item-${itemIndex}`));
+                            }
+                            // segment.kind === "actions"
+                            const actions = segment.actions;
+                            return (_jsx("div", { className: `my-3 flex flex-wrap gap-2 ${shouldAddSpacing ? "mt-2" : ""}`, children: actions.map((a, aIdx) => {
+                                    const variant = a.style === "destructive"
+                                        ? "destructive"
+                                        : a.style === "outline"
+                                            ? "outline"
+                                            : a.style === "secondary"
+                                                ? "secondary"
+                                                : "default"; // primary
+                                    return (_jsx(Button, { size: "sm", variant: variant, onClick: () => onQuickAction?.({
+                                            label: a.label,
+                                            prompt: a.prompt,
+                                            value: a.value,
+                                            behavior: a.behavior,
+                                            placeholder: a.placeholder,
+                                        }, message), children: a.label }, (a.id || a.label || "btn") + "-" + aIdx));
+                                }) }, `item-${itemIndex}`));
+                        }
+                        // item.type === "toolcalls"
+                        return (_jsx("div", { className: shouldAddSpacing ? "mt-2" : "", children: _jsx(ToolCallDisplay, { toolCalls: item.toolCalls, finished: finished, openPopovers: openPopovers, setOpenPopovers: setOpenPopovers, messageId: item.messageId, agentId: agentId }) }, `item-${itemIndex}`));
+                    }), finished && editOperations.length > 0 && (_jsxs("div", { className: "mt-2 flex items-center gap-2", children: [_jsxs("div", { className: "tour-ai-response-message-changes text-xs", children: [editOperations.length, " changes"] }), canReject && !changesRejected && (_jsxs("div", { className: "flex cursor-pointer items-center gap-1 text-xs text-red-500", onClick: async () => {
+                                    await editContext?.operations?.undo?.(editOperations.length);
+                                    setChangesRejected(true);
+                                }, children: [_jsx(X, { strokeWidth: 1, size: 14 }), " Reject"] })), changesRejected && (_jsx("div", { className: "text-xs text-red-500", children: "rejected" }))] }))] })] }));
+}
+//# sourceMappingURL=AiResponseMessage.js.map