@lvce-editor/static-server 0.75.13 → 0.75.15

package/static/{5da550e → 9fb8eae}/packages/chat-view/dist/chatViewWorkerMain.js

@@ -1079,6 +1079,7 @@ const {
 } = create$2(6002);
 
 const Div$1 = 4;
+const Ol$1 = 49;
 
 const ClientX = 'event.clientX';
 const ClientY = 'event.clientY';
@@ -1120,6 +1121,9 @@ const sendMessagePortToExtensionHostWorker$1 = async (port, rpcId = 0) => {
 const activateByEvent$1 = (event, assetDir, platform) => {
   return invoke('ExtensionHostManagement.activateByEvent', event, assetDir, platform);
 };
+const getWorkspacePath = () => {
+  return invoke('Workspace.getPath');
+};
 const getPreference = async key => {
   return await invoke('Preferences.get', key);
 };
@@ -1469,6 +1473,7 @@ const createDefaultState = () => {
     composerHeight: composerLineHeight + 8,
     composerLineHeight,
     composerValue: '',
+    emitStreamingFunctionCallEvents: false,
     errorCount: 0,
     focus: 'composer',
     focused: false,
@@ -1511,6 +1516,7 @@ const createDefaultState = () => {
     useMockApi: false,
     viewMode: 'list',
     warningCount: 0,
+    webSearchEnabled: true,
     width: 0,
     x: 0,
     y: 0
@@ -1540,8 +1546,56 @@ const create = (uid, x, y, width, height, platform, assetDir) => {
   set(uid, state, state);
 };
 
+const parseRenderHtmlArguments = rawArguments => {
+  try {
+    const parsed = JSON.parse(rawArguments);
+    if (!parsed || typeof parsed !== 'object' || Array.isArray(parsed)) {
+      return undefined;
+    }
+    const html = typeof Reflect.get(parsed, 'html') === 'string' ? String(Reflect.get(parsed, 'html')) : '';
+    if (!html) {
+      return undefined;
+    }
+    const css = typeof Reflect.get(parsed, 'css') === 'string' ? String(Reflect.get(parsed, 'css')) : '';
+    const title = typeof Reflect.get(parsed, 'title') === 'string' ? String(Reflect.get(parsed, 'title')) : 'visual preview';
+    return {
+      css,
+      html,
+      title
+    };
+  } catch {
+    return undefined;
+  }
+};
+
+const getRenderHtmlCss = (sessions, selectedSessionId) => {
+  const selectedSession = sessions.find(session => session.id === selectedSessionId);
+  if (!selectedSession) {
+    return '';
+  }
+  const cssRules = new Set();
+  for (const message of selectedSession.messages) {
+    if (message.role !== 'assistant' || !message.toolCalls) {
+      continue;
+    }
+    for (const toolCall of message.toolCalls) {
+      if (toolCall.name !== 'render_html') {
+        continue;
+      }
+      const parsed = parseRenderHtmlArguments(toolCall.arguments);
+      if (!parsed || !parsed.css.trim()) {
+        continue;
+      }
+      cssRules.add(parsed.css);
+    }
+  }
+  return [...cssRules].join('\n\n');
+};
+
 const isEqual$1 = (oldState, newState) => {
-  return oldState.initial === newState.initial && oldState.chatMessageFontFamily === newState.chatMessageFontFamily && oldState.chatMessageFontSize === newState.chatMessageFontSize && oldState.chatMessageLineHeight === newState.chatMessageLineHeight && oldState.composerHeight === newState.composerHeight && oldState.composerLineHeight === newState.composerLineHeight && oldState.composerFontFamily === newState.composerFontFamily && oldState.composerFontSize === newState.composerFontSize && oldState.listItemHeight === newState.listItemHeight;
+  const oldRenderHtmlCss = getRenderHtmlCss(oldState.sessions, oldState.selectedSessionId);
+  const newRenderHtmlCss = getRenderHtmlCss(newState.sessions, newState.selectedSessionId);
+  return oldState.initial === newState.initial && oldState.chatMessageFontFamily === newState.chatMessageFontFamily && oldState.chatMessageFontSize === newState.chatMessageFontSize && oldState.chatMessageLineHeight === newState.chatMessageLineHeight && oldState.composerHeight === newState.composerHeight && oldState.composerLineHeight === newState.composerLineHeight && oldState.composerFontFamily === newState.composerFontFamily && oldState.composerFontSize === newState.composerFontSize && oldState.listItemHeight === newState.listItemHeight && oldRenderHtmlCss === newRenderHtmlCss;
 };
 
 const diffFocus = (oldState, newState) => {
@@ -1599,17 +1653,57 @@ const diff2 = uid => {
 
 const Button$2 = 'button';
 
+const Audio = 0;
 const Button$1 = 1;
+const Col = 2;
+const ColGroup = 3;
 const Div = 4;
+const H1 = 5;
 const Input = 6;
 const Span = 8;
+const Table = 9;
+const TBody = 10;
+const Td = 11;
 const Text = 12;
+const Th = 13;
+const THead = 14;
+const Tr = 15;
+const I = 16;
+const Img = 17;
+const H2 = 22;
+const H3 = 23;
+const H4 = 24;
+const H5 = 25;
+const H6 = 26;
+const Article = 27;
+const Aside = 28;
+const Footer = 29;
+const Header = 30;
+const Nav = 40;
+const Section = 41;
+const Dd = 43;
+const Dl = 44;
+const Figcaption = 45;
+const Figure = 46;
+const Hr = 47;
 const Li = 48;
 const Ol = 49;
 const P = 50;
+const Pre = 51;
+const A = 53;
+const Abbr = 54;
+const Br = 55;
+const Tfoot = 59;
+const Ul = 60;
 const TextArea = 62;
 const Select$1 = 63;
 const Option$1 = 64;
+const Code = 65;
+const Label$1 = 66;
+const Dt = 67;
+const Main = 69;
+const Strong = 70;
+const Em = 71;
 const Reference = 100;
 
 const Enter = 3;
@@ -2646,7 +2740,8 @@ const deleteSession = async (state, id) => {
 };
 
 const handleClickOpenApiApiKeySettings = async state => {
-  await openExternal(state.openApiApiKeysSettingsUrl);
+  // Open the built-in settings editor so the user can inspect or edit their OpenAI API key.
+  await invoke('Main.openUri', 'app://settings.json');
   return state;
 };
 
@@ -3050,7 +3145,42 @@ const getMockOpenRouterAssistantText = async (messages, modelId, openRouterApiBa
   }
 };
 
-const OnFileSystem = 'onFileSystem';
+const executeGetWorkspaceUriTool = async (_args, _options) => {
+  try {
+    const workspaceUri = await getWorkspacePath();
+    return JSON.stringify({
+      workspaceUri
+    });
+  } catch (error) {
+    return JSON.stringify({
+      error: String(error)
+    });
+  }
+};
+
+const isAbsoluteUri$1 = value => {
+  return /^[a-zA-Z][a-zA-Z0-9+.-]*:\/\//.test(value);
+};
+const executeListFilesTool = async (args, _options) => {
+  const uri = typeof args.uri === 'string' ? args.uri : '';
+  if (!uri || !isAbsoluteUri$1(uri)) {
+    return JSON.stringify({
+      error: 'Invalid argument: uri must be an absolute URI.'
+    });
+  }
+  try {
+    const entries = await invoke('FileSystem.readDirWithFileTypes', uri);
+    return JSON.stringify({
+      entries,
+      uri
+    });
+  } catch (error) {
+    return JSON.stringify({
+      error: String(error),
+      uri
+    });
+  }
+};
 
 const isPathTraversalAttempt = path => {
   if (!path) {
@@ -3068,6 +3198,7 @@ const isPathTraversalAttempt = path => {
   const segments = path.split(/[\\/]/);
   return segments.includes('..');
 };
+
 const normalizeRelativePath = path => {
   const segments = path.split(/[\\/]/).filter(segment => segment && segment !== '.');
   if (segments.length === 0) {
@@ -3075,6 +3206,111 @@ const normalizeRelativePath = path => {
   }
   return segments.join('/');
 };
+
+const isAbsoluteUri = value => {
+  return /^[a-zA-Z][a-zA-Z0-9+.-]*:\/\//.test(value);
+};
+const executeReadFileTool = async (args, _options) => {
+  const uri = typeof args.uri === 'string' ? args.uri : '';
+  if (uri) {
+    if (!isAbsoluteUri(uri)) {
+      return JSON.stringify({
+        error: 'Invalid argument: uri must be an absolute URI.'
+      });
+    }
+    try {
+      const content = await readFile(uri);
+      return JSON.stringify({
+        content,
+        uri
+      });
+    } catch (error) {
+      return JSON.stringify({
+        error: String(error),
+        uri
+      });
+    }
+  }
+  const filePath = typeof args.path === 'string' ? args.path : '';
+  if (!filePath || isPathTraversalAttempt(filePath)) {
+    return JSON.stringify({
+      error: 'Access denied: path must be relative and stay within the open workspace folder.'
+    });
+  }
+  const normalizedPath = normalizeRelativePath(filePath);
+  try {
+    const content = await readFile(normalizedPath);
+    return JSON.stringify({
+      content,
+      path: normalizedPath
+    });
+  } catch (error) {
+    return JSON.stringify({
+      error: String(error),
+      path: normalizedPath
+    });
+  }
+};
+
+const maxPayloadLength = 40_000;
+const executeRenderHtmlTool = async (args, _options) => {
+  const html = typeof args.html === 'string' ? args.html : '';
+  const css = typeof args.css === 'string' ? args.css : '';
+  const title = typeof args.title === 'string' ? args.title : '';
+  if (!html) {
+    return JSON.stringify({
+      error: 'Missing required argument: html'
+    });
+  }
+  if (html.length > maxPayloadLength || css.length > maxPayloadLength) {
+    return JSON.stringify({
+      error: 'Payload too large: keep html/css under 40,000 characters each.'
+    });
+  }
+  return JSON.stringify({
+    css,
+    html,
+    ok: true,
+    title
+  });
+};
+
+const OnFileSystem = 'onFileSystem';
+
+const executeFileSystemCommand = async (method, params, options) => {
+  return executeProvider({
+    assetDir: options.assetDir,
+    event: OnFileSystem,
+    method,
+    noProviderFoundMessage: 'No file system provider found',
+    params,
+    platform: options.platform
+  });
+};
+
+const executeWriteFileTool = async (args, options) => {
+  const filePath = typeof args.path === 'string' ? args.path : '';
+  const content = typeof args.content === 'string' ? args.content : '';
+  if (!filePath || isPathTraversalAttempt(filePath)) {
+    return JSON.stringify({
+      error: 'Access denied: path must be relative and stay within the open workspace folder.'
+    });
+  }
+  const normalizedPath = normalizeRelativePath(filePath);
+  try {
+    await executeFileSystemCommand(FileSystemWriteFile, ['file', normalizedPath, content], options);
+    return JSON.stringify({
+      ok: true,
+      path: normalizedPath
+    });
+  } catch (error) {
+    return JSON.stringify({
+      error: String(error),
+      path: normalizedPath
+    });
+  }
+};
+
 const parseToolArguments = rawArguments => {
   if (typeof rawArguments !== 'string') {
     return {};
@@ -3089,35 +3325,51 @@ const parseToolArguments = rawArguments => {
     return {};
   }
 };
-const executeFileSystemCommand = async (method, params, options) => {
-  return executeProvider({
-    assetDir: options.assetDir,
-    event: OnFileSystem,
-    method,
-    noProviderFoundMessage: 'No file system provider found',
-    params,
-    platform: options.platform
+
+const executeChatTool = async (name, rawArguments, options) => {
+  const args = parseToolArguments(rawArguments);
+  if (name === 'read_file') {
+    return executeReadFileTool(args);
+  }
+  if (name === 'write_file') {
+    return executeWriteFileTool(args, options);
+  }
+  if (name === 'list_files') {
+    return executeListFilesTool(args);
+  }
+  if (name === 'getWorkspaceUri') {
+    return executeGetWorkspaceUriTool();
+  }
+  if (name === 'render_html') {
+    return executeRenderHtmlTool(args);
+  }
+  return JSON.stringify({
+    error: `Unknown tool: ${name}`
   });
 };
-const getBasicChatTools = () => {
-  return [{
+
+const getReadFileTool = () => {
+  return {
     function: {
-      description: 'Read UTF-8 text content from a file inside the currently open workspace folder.',
+      description: 'Read UTF-8 text content from a file inside the currently open workspace folder. Only pass an absolute URI.',
       name: 'read_file',
       parameters: {
         additionalProperties: false,
         properties: {
-          path: {
-            description: 'Relative file path within the workspace (for example: src/index.ts).',
+          uri: {
+            description: 'Absolute file URI within the workspace (for example: file:///workspace/src/index.ts).',
             type: 'string'
           }
         },
-        required: ['path'],
+        required: ['uri'],
         type: 'object'
       }
     },
     type: 'function'
-  }, {
+  };
+};
+const getWriteFileTool = () => {
+  return {
     function: {
       description: 'Write UTF-8 text content to a file inside the currently open workspace folder.',
       name: 'write_file',
@@ -3138,93 +3390,72 @@ const getBasicChatTools = () => {
       }
     },
     type: 'function'
-  }, {
+  };
+};
+const getListFilesTool = () => {
+  return {
     function: {
-      description: 'List direct children (files and folders) for a folder inside the currently open workspace folder.',
+      description: 'List direct children (files and folders) for a folder URI inside the currently open workspace folder. Only pass an absolute URI.',
       name: 'list_files',
       parameters: {
         additionalProperties: false,
         properties: {
-          path: {
-            description: 'Relative folder path within the workspace. Use "." for the workspace root.',
+          uri: {
+            description: 'Absolute folder URI within the workspace (for example: file:///workspace/src).',
             type: 'string'
           }
         },
+        required: ['uri'],
         type: 'object'
       }
     },
     type: 'function'
-  }];
+  };
 };
-const executeChatTool = async (name, rawArguments, options) => {
-  const args = parseToolArguments(rawArguments);
-  if (name === 'read_file') {
-    const filePath = typeof args.path === 'string' ? args.path : '';
-    if (!filePath || isPathTraversalAttempt(filePath)) {
-      return JSON.stringify({
-        error: 'Access denied: path must be relative and stay within the open workspace folder.'
-      });
-    }
-    const normalizedPath = normalizeRelativePath(filePath);
-    try {
-      const content = await readFile(normalizedPath);
-      return JSON.stringify({
-        content,
-        path: normalizedPath
-      });
-    } catch (error) {
-      return JSON.stringify({
-        error: String(error),
-        path: normalizedPath
-      });
-    }
-  }
-  if (name === 'write_file') {
-    const filePath = typeof args.path === 'string' ? args.path : '';
-    const content = typeof args.content === 'string' ? args.content : '';
-    if (!filePath || isPathTraversalAttempt(filePath)) {
-      return JSON.stringify({
-        error: 'Access denied: path must be relative and stay within the open workspace folder.'
-      });
-    }
-    const normalizedPath = normalizeRelativePath(filePath);
-    try {
-      await executeFileSystemCommand(FileSystemWriteFile, ['file', normalizedPath, content], options);
-      return JSON.stringify({
-        ok: true,
-        path: normalizedPath
-      });
-    } catch (error) {
-      return JSON.stringify({
-        error: String(error),
-        path: normalizedPath
-      });
-    }
-  }
-  if (name === 'list_files') {
-    const folderPath = typeof args.path === 'string' && args.path ? args.path : '.';
-    if (isPathTraversalAttempt(folderPath)) {
-      return JSON.stringify({
-        error: 'Access denied: path must be relative and stay within the open workspace folder.'
-      });
-    }
-    const normalizedPath = normalizeRelativePath(folderPath);
-    try {
-      const entries = await invoke('FileSystem.readDirWithFileTypes', normalizedPath);
-      return JSON.stringify({
-        entries,
-        path: normalizedPath
-      });
-    } catch (error) {
-      return JSON.stringify({
-        error: String(error),
-        path: normalizedPath
-      });
-    }
-  }
-  return JSON.stringify({
-    error: `Unknown tool: ${name}`
-  });
+const getGetWorkspaceUriTool = () => {
+  return {
+    function: {
+      description: 'Get the URI of the currently open workspace folder.',
+      name: 'getWorkspaceUri',
+      parameters: {
+        additionalProperties: false,
+        properties: {},
+        type: 'object'
+      }
+    },
+    type: 'function'
+  };
+};
+const getRenderHtmlTool = () => {
+  return {
+    function: {
+      description: 'Render custom HTML and optional CSS directly in the chat tool call list using native chat UI rendering. Use this for structured cards, tables, and small dashboards. After calling this tool, do not repeat the same HTML, data table, or long content again as plain text unless the user explicitly asks for a text-only version.',
+      name: 'render_html',
+      parameters: {
+        additionalProperties: false,
+        properties: {
+          css: {
+            description: 'Optional CSS string applied inside the preview document.',
+            type: 'string'
+          },
+          html: {
+            description: 'HTML string to render in the preview document.',
+            type: 'string'
+          },
+          title: {
+            description: 'Optional short title for the preview.',
+            type: 'string'
+          }
+        },
+        required: ['html'],
+        type: 'object'
+      }
+    },
+    type: 'function'
+  };
+};
+const getBasicChatTools = () => {
+  return [getReadFileTool(), getWriteFileTool(), getListFilesTool(), getGetWorkspaceUriTool(), getRenderHtmlTool()];
 };
 
 const getClientRequestIdHeader = () => {
@@ -3285,7 +3516,8 @@ const getOpenAiTools = tools => {
     };
   });
 };
-const getOpenAiParams = (input, modelId, stream, includeObfuscation, tools, previousResponseId) => {
+const getOpenAiParams = (input, modelId, stream, includeObfuscation, tools, webSearchEnabled, previousResponseId) => {
+  const openAiTools = getOpenAiTools(tools);
   return {
     input,
     model: modelId,
@@ -3301,7 +3533,9 @@ const getOpenAiParams = (input, modelId, stream, includeObfuscation, tools, prev
       previous_response_id: previousResponseId
     } : {}),
     tool_choice: 'auto',
-    tools: getOpenAiTools(tools)
+    tools: webSearchEnabled ? [...openAiTools, {
+      type: 'web_search'
+    }] : openAiTools
   };
 };
 const getStreamChunkText = content => {
@@ -3319,6 +3553,47 @@ const getStreamChunkText = content => {
     return typeof text === 'string' ? text : '';
   }).join('');
 };
+const getShortToolErrorMessage = error => {
+  const trimmed = error.trim().replace(/^Error:\s*/, '');
+  const firstLine = trimmed.split('\n')[0];
+  if (firstLine.length <= 80) {
+    return firstLine;
+  }
+  return `${firstLine.slice(0, 77)}...`;
+};
+const getToolCallExecutionStatus = content => {
+  let parsed;
+  try {
+    parsed = JSON.parse(content);
+  } catch {
+    return {
+      errorMessage: 'Invalid tool output',
+      status: 'error'
+    };
+  }
+  if (!parsed || typeof parsed !== 'object') {
+    return {
+      errorMessage: 'Invalid tool output',
+      status: 'error'
+    };
+  }
+  const rawError = Reflect.get(parsed, 'error');
+  if (typeof rawError !== 'string' || !rawError.trim()) {
+    return {
+      status: 'success'
+    };
+  }
+  const errorMessage = getShortToolErrorMessage(rawError);
+  if (/not[\s_-]?found|enoent/i.test(errorMessage)) {
+    return {
+      status: 'not-found'
+    };
+  }
+  return {
+    errorMessage,
+    status: 'error'
+  };
+};
 const getResponseOutputText = parsed => {
   if (!parsed || typeof parsed !== 'object') {
     return '';
@@ -3455,7 +3730,31 @@ const updateToolCallAccumulator = (accumulator, chunk) => {
     toolCalls
   };
 };
-const parseOpenApiStream = async (response, onTextChunk, onToolCallsChunk, onDataEvent, onEventStreamFinished) => {
+const getResponseFunctionCallsFromStreamingAccumulator = toolCallAccumulator => {
+  return Object.entries(toolCallAccumulator).toSorted((a, b) => a[0].localeCompare(b[0])).map(entry => entry[1]).filter(toolCall => typeof toolCall.id === 'string' && !!toolCall.id && !!toolCall.name).map(toolCall => ({
+    arguments: toolCall.arguments,
+    callId: toolCall.id,
+    name: toolCall.name
+  }));
+};
+const getStreamingToolCallKey = value => {
+  if (!value || typeof value !== 'object') {
+    return undefined;
+  }
+  const outputIndex = Reflect.get(value, 'output_index');
+  if (typeof outputIndex === 'number') {
+    return String(outputIndex);
+  }
+  if (typeof outputIndex === 'string' && outputIndex) {
+    return outputIndex;
+  }
+  const itemId = Reflect.get(value, 'item_id');
+  if (typeof itemId === 'string' && itemId) {
+    return itemId;
+  }
+  return undefined;
+};
+const parseOpenApiStream = async (response, onTextChunk, onToolCallsChunk, onDataEvent) => {
   if (!response.body) {
     return {
       details: 'request-failed',
@@ -3467,22 +3766,14 @@ const parseOpenApiStream = async (response, onTextChunk, onToolCallsChunk, onDat
   let remainder = '';
   let text = '';
   let done = false;
-  let finishedNotified = false;
   let toolCallAccumulator = {};
-  const notifyFinished = async () => {
-    if (finishedNotified) {
-      return;
-    }
-    finishedNotified = true;
-    if (onEventStreamFinished) {
-      await onEventStreamFinished();
-    }
-  };
+  let responseId;
+  let completedResponseFunctionCalls = [];
   const emitToolCallAccumulator = async () => {
     if (!onToolCallsChunk) {
       return;
     }
-    const toolCalls = Object.entries(toolCallAccumulator).toSorted((a, b) => Number(a[0]) - Number(b[0])).map(entry => entry[1]).filter(toolCall => !!toolCall.name);
+    const toolCalls = Object.entries(toolCallAccumulator).toSorted((a, b) => a[0].localeCompare(b[0])).map(entry => entry[1]).filter(toolCall => !!toolCall.name);
     if (toolCalls.length === 0) {
       return;
     }
@@ -3497,7 +3788,25 @@ const parseOpenApiStream = async (response, onTextChunk, onToolCallsChunk, onDat
     }
     const eventType = Reflect.get(parsed, 'type');
     if (eventType === 'response.completed') {
-      await notifyFinished();
+      const response = Reflect.get(parsed, 'response');
+      if (response && typeof response === 'object') {
+        const parsedResponseId = Reflect.get(response, 'id');
+        if (typeof parsedResponseId === 'string' && parsedResponseId) {
+          responseId = parsedResponseId;
+        }
+        completedResponseFunctionCalls = getResponseFunctionCalls(response);
+      }
+      return;
+    }
+    if (eventType === 'response.created' || eventType === 'response.in_progress') {
+      const response = Reflect.get(parsed, 'response');
+      if (!response || typeof response !== 'object') {
+        return;
+      }
+      const parsedResponseId = Reflect.get(response, 'id');
+      if (typeof parsedResponseId === 'string' && parsedResponseId) {
+        responseId = parsedResponseId;
+      }
       return;
     }
     if (eventType === 'response.output_text.delta') {
@@ -3512,9 +3821,9 @@ const parseOpenApiStream = async (response, onTextChunk, onToolCallsChunk, onDat
       return;
     }
     if (eventType === 'response.output_item.added') {
-      const outputIndex = Reflect.get(parsed, 'output_index');
+      const toolCallKey = getStreamingToolCallKey(parsed);
       const item = Reflect.get(parsed, 'item');
-      if (typeof outputIndex !== 'number' || !item || typeof item !== 'object') {
+      if (!toolCallKey || !item || typeof item !== 'object') {
         return;
       }
       const itemType = Reflect.get(item, 'type');
@@ -3533,17 +3842,49 @@ const parseOpenApiStream = async (response, onTextChunk, onToolCallsChunk, onDat
       };
       toolCallAccumulator = {
         ...toolCallAccumulator,
-        [outputIndex]: next
+        [toolCallKey]: next
+      };
+      await emitToolCallAccumulator();
+      return;
+    }
+    if (eventType === 'response.output_item.done') {
+      const toolCallKey = getStreamingToolCallKey(parsed);
+      const item = Reflect.get(parsed, 'item');
+      if (!toolCallKey || !item || typeof item !== 'object') {
+        return;
+      }
+      const itemType = Reflect.get(item, 'type');
+      if (itemType !== 'function_call') {
+        return;
+      }
+      const callId = Reflect.get(item, 'call_id');
+      const name = Reflect.get(item, 'name');
+      const rawArguments = Reflect.get(item, 'arguments');
+      const current = toolCallAccumulator[toolCallKey] || {
+        arguments: '',
+        name: ''
+      };
+      toolCallAccumulator = {
+        ...toolCallAccumulator,
+        [toolCallKey]: {
+          arguments: typeof rawArguments === 'string' ? rawArguments : current.arguments,
+          ...(typeof callId === 'string' ? {
+            id: callId
+          } : current.id ? {
+            id: current.id
+          } : {}),
+          name: typeof name === 'string' && name ? name : current.name
+        }
       };
       await emitToolCallAccumulator();
       return;
     }
     if (eventType === 'response.function_call_arguments.delta' || eventType === 'response.function_call_arguments.done') {
-      const outputIndex = Reflect.get(parsed, 'output_index');
-      if (typeof outputIndex !== 'number') {
+      const toolCallKey = getStreamingToolCallKey(parsed);
+      if (!toolCallKey) {
         return;
       }
-      const current = toolCallAccumulator[outputIndex] || {
+      const current = toolCallAccumulator[toolCallKey] || {
         arguments: '',
         name: ''
       };
@@ -3562,7 +3903,7 @@ const parseOpenApiStream = async (response, onTextChunk, onToolCallsChunk, onDat
       };
       toolCallAccumulator = {
         ...toolCallAccumulator,
-        [outputIndex]: next
+        [toolCallKey]: next
       };
       await emitToolCallAccumulator();
       return;
@@ -3622,7 +3963,6 @@ const parseOpenApiStream = async (response, onTextChunk, onToolCallsChunk, onDat
       }
       for (const line of dataLines) {
         if (line === '[DONE]') {
-          await notifyFinished();
           done = true;
           break;
         }
@@ -3640,7 +3980,6 @@ const parseOpenApiStream = async (response, onTextChunk, onToolCallsChunk, onDat
     const dataLines = parseSseEvent(remainder);
     for (const line of dataLines) {
       if (line === '[DONE]') {
-        await notifyFinished();
         continue;
       }
       let parsed;
@@ -3652,8 +3991,12 @@ const parseOpenApiStream = async (response, onTextChunk, onToolCallsChunk, onDat
       await handleParsedStreamEvent(parsed);
     }
   }
-  await notifyFinished();
+  const responseFunctionCalls = completedResponseFunctionCalls.length > 0 ? completedResponseFunctionCalls : getResponseFunctionCallsFromStreamingAccumulator(toolCallAccumulator);
   return {
+    ...(responseId ? {
+      responseId
+    } : {}),
+    responseFunctionCalls,
     text,
     type: 'success'
   };
@@ -3694,7 +4037,8 @@ const getOpenApiAssistantText = async (messages, modelId, openApiApiKey, openApi
     onEventStreamFinished,
     onTextChunk,
     onToolCallsChunk,
-    stream
+    stream,
+    webSearchEnabled = false
   } = options ?? {
     stream: false
   };
@@ -3709,7 +4053,7 @@ const getOpenApiAssistantText = async (messages, modelId, openApiApiKey, openApi
     let response;
     try {
       response = await fetch(getOpenApiApiEndpoint(openApiApiBaseUrl), {
-        body: JSON.stringify(getOpenAiParams(openAiInput, modelId, stream, includeObfuscation, tools, previousResponseId)),
+        body: JSON.stringify(getOpenAiParams(openAiInput, modelId, stream, includeObfuscation, tools, webSearchEnabled, previousResponseId)),
         headers: {
           Authorization: `Bearer ${openApiApiKey}`,
           'Content-Type': 'application/json',
@@ -3744,9 +4088,53 @@ const getOpenApiAssistantText = async (messages, modelId, openApiApiKey, openApi
         type: 'error'
       };
     }
-    if (stream) {
-      return parseOpenApiStream(response, onTextChunk, onToolCallsChunk, onDataEvent, onEventStreamFinished);
-    }
+    if (stream) {
+      const streamResult = await parseOpenApiStream(response, onTextChunk, onToolCallsChunk, onDataEvent);
+      if (streamResult.type !== 'success') {
+        return streamResult;
+      }
+      if (streamResult.responseId) {
+        previousResponseId = streamResult.responseId;
+      }
+      if (streamResult.responseFunctionCalls.length > 0) {
+        openAiInput.length = 0;
+        const executedToolCalls = [];
+        for (const toolCall of streamResult.responseFunctionCalls) {
+          const content = await executeChatTool(toolCall.name, toolCall.arguments, {
+            assetDir,
+            platform
+          });
+          const executionStatus = getToolCallExecutionStatus(content);
+          executedToolCalls.push({
+            arguments: toolCall.arguments,
+            ...(executionStatus.errorMessage ? {
+              errorMessage: executionStatus.errorMessage
+            } : {}),
+            id: toolCall.callId,
+            name: toolCall.name,
+            ...(executionStatus.status ? {
+              status: executionStatus.status
+            } : {})
+          });
+          openAiInput.push({
+            call_id: toolCall.callId,
+            output: content,
+            type: 'function_call_output'
+          });
+        }
+        if (onToolCallsChunk && executedToolCalls.length > 0) {
+          await onToolCallsChunk(executedToolCalls);
+        }
+        continue;
+      }
+      if (onEventStreamFinished) {
+        await onEventStreamFinished();
+      }
+      return {
+        text: streamResult.text,
+        type: 'success'
+      };
+    }
     let parsed;
     try {
       parsed = await response.json();
@@ -3769,17 +4157,33 @@ const getOpenApiAssistantText = async (messages, modelId, openApiApiKey, openApi
     const responseFunctionCalls = getResponseFunctionCalls(parsed);
     if (responseFunctionCalls.length > 0) {
       openAiInput.length = 0;
+      const executedToolCalls = [];
       for (const toolCall of responseFunctionCalls) {
         const content = await executeChatTool(toolCall.name, toolCall.arguments, {
           assetDir,
           platform
         });
+        const executionStatus = getToolCallExecutionStatus(content);
+        executedToolCalls.push({
+          arguments: toolCall.arguments,
+          ...(executionStatus.errorMessage ? {
+            errorMessage: executionStatus.errorMessage
+          } : {}),
+          id: toolCall.callId,
+          name: toolCall.name,
+          ...(executionStatus.status ? {
+            status: executionStatus.status
+          } : {})
+        });
         openAiInput.push({
           call_id: toolCall.callId,
           output: content,
           type: 'function_call_output'
         });
       }
+      if (onToolCallsChunk && executedToolCalls.length > 0) {
+        await onToolCallsChunk(executedToolCalls);
+      }
       continue;
     }
     const outputText = getResponseOutputText(parsed);
@@ -3808,6 +4212,7 @@ const getOpenApiAssistantText = async (messages, modelId, openApiApiKey, openApi
       const toolCalls = Reflect.get(message, 'tool_calls');
       if (Array.isArray(toolCalls) && toolCalls.length > 0) {
         openAiInput.length = 0;
+        const executedToolCalls = [];
         for (const toolCall of toolCalls) {
           if (!toolCall || typeof toolCall !== 'object') {
             continue;
@@ -3823,12 +4228,29 @@ const getOpenApiAssistantText = async (messages, modelId, openApiApiKey, openApi
             assetDir,
             platform
           }) : '{}';
+          if (typeof name === 'string') {
+            const executionStatus = getToolCallExecutionStatus(content);
+            executedToolCalls.push({
+              arguments: typeof rawArguments === 'string' ? rawArguments : '',
+              ...(executionStatus.errorMessage ? {
+                errorMessage: executionStatus.errorMessage
+              } : {}),
+              id,
+              name,
+              ...(executionStatus.status ? {
+                status: executionStatus.status
+              } : {})
+            });
+          }
           openAiInput.push({
             call_id: id,
             output: content,
             type: 'function_call_output'
           });
         }
+        if (onToolCallsChunk && executedToolCalls.length > 0) {
+          await onToolCallsChunk(executedToolCalls);
+        }
         continue;
       }
       const content = Reflect.get(message, 'content');
@@ -3855,6 +4277,12 @@ const getOpenApiErrorMessage = errorResult => {
         const errorMessage = errorResult.errorMessage?.trim();
         const hasErrorCode = typeof errorResult.errorCode === 'string' && errorResult.errorCode.length > 0;
         const hasErrorType = typeof errorResult.errorType === 'string' && errorResult.errorType.length > 0;
+
+        // Provide a concise, user-friendly message when OpenAI reports an invalid API key.
+        if (errorResult.errorCode === 'invalid_api_key') {
+          const status = typeof errorResult.statusCode === 'number' ? errorResult.statusCode : 401;
+          return `OpenAI request failed (status ${status}): Invalid API key. Please verify your OpenAI API key in Chat settings.`;
+        }
         if (errorResult.statusCode === 429) {
           let prefix = 'OpenAI rate limit exceeded (429)';
           if (hasErrorCode) {
@@ -4218,7 +4646,8 @@ const getAiResponse = async ({
   selectedModelId,
   streamingEnabled = false,
   useMockApi,
-  userText
+  userText,
+  webSearchEnabled = false
 }) => {
   let text = '';
   const usesOpenApiModel = isOpenApiModel(selectedModelId, models);
@@ -4249,7 +4678,8 @@ const getAiResponse = async ({
         ...(onToolCallsChunk ? {
           onToolCallsChunk
         } : {}),
-        stream: streamingEnabled
+        stream: streamingEnabled,
+        webSearchEnabled
       });
       if (result.type === 'success') {
         const {
@@ -4576,10 +5006,53 @@ const appendMessageToSelectedSession = (sessions, selectedSessionId, message) =>
     };
   });
 };
+const hasLegacyStreamingToolCalls = parsed => {
+  if (!parsed || typeof parsed !== 'object') {
+    return false;
+  }
+  const choices = Reflect.get(parsed, 'choices');
+  if (!Array.isArray(choices) || choices.length === 0) {
+    return false;
+  }
+  const firstChoice = choices[0];
+  if (!firstChoice || typeof firstChoice !== 'object') {
+    return false;
+  }
+  const delta = Reflect.get(firstChoice, 'delta');
+  if (!delta || typeof delta !== 'object') {
+    return false;
+  }
+  const toolCalls = Reflect.get(delta, 'tool_calls');
+  return Array.isArray(toolCalls) && toolCalls.length > 0;
+};
+const isStreamingFunctionCallEvent = parsed => {
+  if (hasLegacyStreamingToolCalls(parsed)) {
+    return true;
+  }
+  if (!parsed || typeof parsed !== 'object') {
+    return false;
+  }
+  const type = Reflect.get(parsed, 'type');
+  if (type === 'response.function_call_arguments.delta' || type === 'response.function_call_arguments.done') {
+    return true;
+  }
+  if (type !== 'response.output_item.added' && type !== 'response.output_item.done') {
+    return false;
+  }
+  const item = Reflect.get(parsed, 'item');
+  if (!item || typeof item !== 'object') {
+    return false;
+  }
+  return Reflect.get(item, 'type') === 'function_call';
+};
+const getSseEventType = value => {
+  return value && typeof value === 'object' && Reflect.get(value, 'type') === 'response.completed' ? 'sse-response-completed' : 'sse-response-part';
+};
 const handleSubmit = async state => {
   const {
     assetDir,
     composerValue,
+    emitStreamingFunctionCallEvents,
     mockAiResponseDelay,
     mockApiCommandId,
     models,
@@ -4595,7 +5068,8 @@ const handleSubmit = async state => {
     sessions,
     streamingEnabled,
     useMockApi,
-    viewMode
+    viewMode,
+    webSearchEnabled
   } = state;
   const userText = composerValue.trim();
   if (!userText) {
@@ -4705,10 +5179,14 @@ const handleSubmit = async state => {
     mockApiCommandId,
     models,
     onDataEvent: async value => {
+      if (!emitStreamingFunctionCallEvents && isStreamingFunctionCallEvent(value)) {
+        return;
+      }
+      const sseEventType = getSseEventType(value);
       await appendChatViewEvent({
         sessionId: optimisticState.selectedSessionId,
         timestamp: new Date().toISOString(),
-        type: 'sse-response-part',
+        type: sseEventType,
         value
       });
     },
@@ -4735,7 +5213,8 @@ const handleSubmit = async state => {
     selectedModelId,
     streamingEnabled,
     useMockApi,
-    userText
+    userText,
+    webSearchEnabled
   });
   const {
     latestState
@@ -4916,6 +5395,13 @@ const handleClickNew = async state => {
   return createSession(state);
 };
 
+const handleClickReadFile = async uri => {
+  if (!uri) {
+    return;
+  }
+  await invoke('Main.openUri', uri);
+};
+
 const handleClickSessionDebug = async state => {
   await invoke('Main.openUri', `chat-debug://${state.selectedSessionId}`);
   return state;
@@ -5049,6 +5535,11 @@ const handleKeyDown = async (state, key, shiftKey) => {
   return handleSubmit(submitState);
 };
 
+const handleMessagesContextMenu = async state => {
+  await invoke('ContextMenu.show', 1234);
+  return state;
+};
+
 const handleModelChange = async (state, value) => {
   return {
     ...state,
@@ -5186,6 +5677,15 @@ const getSavedViewMode = savedState => {
   return viewMode;
 };
 
+const loadEmitStreamingFunctionCallEvents = async () => {
+  try {
+    const savedEmitStreamingFunctionCallEvents = await get('chatView.emitStreamingFunctionCallEvents');
+    return typeof savedEmitStreamingFunctionCallEvents === 'boolean' ? savedEmitStreamingFunctionCallEvents : false;
+  } catch {
+    return false;
+  }
+};
+
 const loadOpenApiApiKey = async () => {
   try {
     const savedOpenApiKey = await get('secrets.openApiKey');
@@ -5233,9 +5733,11 @@ const loadStreamingEnabled = async () => {
 const loadPreferences = async () => {
   const openApiApiKey = await loadOpenApiApiKey();
   const openRouterApiKey = await loadOpenRouterApiKey();
+  const emitStreamingFunctionCallEvents = await loadEmitStreamingFunctionCallEvents();
   const streamingEnabled = await loadStreamingEnabled();
   const passIncludeObfuscation = await loadPassIncludeObfuscation();
   return {
+    emitStreamingFunctionCallEvents,
     openApiApiKey,
     openRouterApiKey,
     passIncludeObfuscation,
@@ -5270,6 +5772,7 @@ const loadContent = async (state, savedState) => {
   const savedSelectedModelId = getSavedSelectedModelId(savedState);
   const savedViewMode = getSavedViewMode(savedState);
   const {
+    emitStreamingFunctionCallEvents,
     openApiApiKey,
     openRouterApiKey,
     passIncludeObfuscation,
@@ -5302,6 +5805,7 @@ const loadContent = async (state, savedState) => {
   return {
     ...state,
     chatListScrollTop,
+    emitStreamingFunctionCallEvents,
     initial: false,
     messagesScrollTop,
     openApiApiKey,
@@ -5371,14 +5875,77 @@ const openMockSession = async (state, mockSessionId, mockChatMessages) => {
   };
 };
 
-const getCss = (composerHeight, listItemHeight, chatMessageFontSize, chatMessageLineHeight, chatMessageFontFamily) => {
-  return `:root {
+const getCss = (composerHeight, listItemHeight, chatMessageFontSize, chatMessageLineHeight, chatMessageFontFamily, renderHtmlCss) => {
+  const baseCss = `:root {
   --ChatInputBoxHeight: ${composerHeight}px;
   --ChatListItemHeight: ${listItemHeight}px;
   --ChatMessageFontSize: ${chatMessageFontSize}px;
   --ChatMessageLineHeight: ${chatMessageLineHeight}px;
   --ChatMessageFontFamily: ${chatMessageFontFamily};
+}
+
+.ChatToolCalls {
+  position: relative;
+  border: 1px solid var(--vscode-editorWidget-border);
+  border-radius: 4px;
+  margin-bottom: 8px;
+  padding: 10px 8px 6px;
+  background: var(--vscode-editorWidget-background);
+}
+
+.ChatToolCallsLabel {
+  position: absolute;
+  top: -8px;
+  left: 8px;
+  padding: 0 4px;
+  border-radius: 3px;
+  background: var(--vscode-editor-background);
+  color: var(--vscode-descriptionForeground);
+  font-size: 10px;
+  line-height: 14px;
+  text-transform: lowercase;
+  letter-spacing: 0.02em;
+}
+
+.ChatToolCallReadFileLink {
+  color: var(--vscode-textLink-foreground);
+  text-decoration: underline;
+}
+
+.ChatToolCallRenderHtmlLabel {
+  margin-bottom: 6px;
+  color: var(--vscode-descriptionForeground);
+  font-size: 12px;
+}
+
+.ChatToolCallRenderHtmlContent {
+  border: 1px solid var(--vscode-editorWidget-border);
+  border-radius: 6px;
+  background: var(--vscode-editor-background);
+  overflow: hidden;
+}
+
+.ChatToolCallRenderHtmlBody {
+  min-height: 180px;
+  padding: 12px;
+}
+
+.ChatToolCallRenderHtmlBody * {
+  box-sizing: border-box;
+}
+
+.ChatMessageLink {
+  color: #4d94ff;
+  text-decoration: underline;
+  cursor: pointer;
 }`;
+  if (!renderHtmlCss.trim()) {
+    return baseCss;
+  }
+  return `${baseCss}
+
+/* render_html tool css */
+${renderHtmlCss}`;
 };
 
 // TODO render things like scrollbar height,scrollbar offset, textarea height,
@@ -5391,9 +5958,12 @@ const renderCss = (oldState, newState) => {
     chatMessageLineHeight,
     composerHeight,
     listItemHeight,
+    selectedSessionId,
+    sessions,
     uid
   } = newState;
-  const css = getCss(composerHeight, listItemHeight, chatMessageFontSize, chatMessageLineHeight, chatMessageFontFamily);
+  const renderHtmlCss = getRenderHtmlCss(sessions, selectedSessionId);
+  const css = getCss(composerHeight, listItemHeight, chatMessageFontSize, chatMessageLineHeight, chatMessageFontFamily, renderHtmlCss);
   return [SetCss, uid, css];
 };
 
@@ -5433,6 +6003,7 @@ const ChatHeader = 'ChatHeader';
 const Button = 'Button';
 const ButtonPrimary = 'ButtonPrimary';
 const ButtonSecondary = 'ButtonSecondary';
+const FileIcon = 'FileIcon';
 const IconButton = 'IconButton';
 const InputBox = 'InputBox';
 const Label = 'Label';
@@ -5444,6 +6015,13 @@ const ChatListItemLabel = 'ChatListItemLabel';
 const Markdown = 'Markdown';
 const Message = 'Message';
 const ChatMessageContent = 'ChatMessageContent';
+const ChatToolCalls = 'ChatToolCalls';
+const ChatToolCallsLabel = 'ChatToolCallsLabel';
+const ChatToolCallReadFileLink = 'ChatToolCallReadFileLink';
+const ChatToolCallRenderHtmlLabel = 'ChatToolCallRenderHtmlLabel';
+const ChatToolCallRenderHtmlContent = 'ChatToolCallRenderHtmlContent';
+const ChatToolCallRenderHtmlBody = 'ChatToolCallRenderHtmlBody';
+const ChatMessageLink = 'ChatMessageLink';
 const ChatOrderedList = 'ChatOrderedList';
 const ChatOrderedListItem = 'ChatOrderedListItem';
 const MessageUser = 'MessageUser';
@@ -5473,6 +6051,8 @@ const HandleModelChange = 20;
 const HandleChatListScroll = 21;
 const HandleMessagesScroll = 22;
 const HandleClickSessionDebug = 23;
+const HandleClickReadFile = 24;
+const HandleMessagesContextMenu = 25;
 
 const getModelLabel = model => {
   if (model.provider === 'openRouter') {
@@ -5666,6 +6246,47 @@ const getChatHeaderDomDetailMode = selectedSessionTitle => {
   }, text(selectedSessionTitle), ...getChatHeaderActionsDom()];
 };
 
+const getInlineNodeDom = inlineNode => {
+  if (inlineNode.type === 'text') {
+    return [text(inlineNode.text)];
+  }
+  return [{
+    childCount: 1,
+    className: ChatMessageLink,
+    href: inlineNode.href,
+    rel: 'noopener noreferrer',
+    target: '_blank',
+    title: inlineNode.href,
+    type: A
+  }, text(inlineNode.text)];
+};
+
+const getOrderedListItemDom = item => {
+  return [{
+    childCount: item.children.length,
+    className: ChatOrderedListItem,
+    type: Li
+  }, ...item.children.flatMap(getInlineNodeDom)];
+};
+const getMessageNodeDom = node => {
+  if (node.type === 'text') {
+    return [{
+      childCount: node.children.length,
+      className: Markdown,
+      type: P
+    }, ...node.children.flatMap(getInlineNodeDom)];
+  }
+  return [{
+    childCount: node.items.length,
+    className: ChatOrderedList,
+    type: Ol
+  }, ...node.items.flatMap(getOrderedListItemDom)];
+};
+
+const getMessageContentDom = nodes => {
+  return nodes.flatMap(getMessageNodeDom);
+};
+
 const getMissingApiKeyDom = ({
   getApiKeyText,
   inputName,
@@ -5787,13 +6408,401 @@ const getToolCallArgumentPreview = rawArguments => {
   return rawArguments;
 };
 
+const RE_QUERY_OR_HASH = /[?#].*$/;
+const RE_TRAILING_SLASH = /\/$/;
+const getFileNameFromUri = uri => {
+  const stripped = uri.replace(RE_QUERY_OR_HASH, '').replace(RE_TRAILING_SLASH, '');
+  const slashIndex = Math.max(stripped.lastIndexOf('/'), stripped.lastIndexOf('\\\\'));
+  const fileName = slashIndex === -1 ? stripped : stripped.slice(slashIndex + 1);
+  return fileName || uri;
+};
+
+const getReadFileTarget = rawArguments => {
+  let parsed;
+  try {
+    parsed = JSON.parse(rawArguments);
+  } catch {
+    return undefined;
+  }
+  if (!parsed || typeof parsed !== 'object') {
+    return undefined;
+  }
+  const uri = Reflect.get(parsed, 'uri');
+  const path = Reflect.get(parsed, 'path');
+  const uriValue = typeof uri === 'string' ? uri : '';
+  const pathValue = typeof path === 'string' ? path : '';
+  const title = uriValue || pathValue;
+  if (!title) {
+    return undefined;
+  }
+  // `read_file` tool calls now use absolute `uri`; keep `path` as a legacy fallback for old transcripts.
+  const clickableUri = uriValue || pathValue;
+  return {
+    clickableUri,
+    title
+  };
+};
+
+const getToolCallStatusLabel = toolCall => {
+  if (toolCall.status === 'not-found') {
+    return ' (not-found)';
+  }
+  if (toolCall.status === 'error') {
+    if (toolCall.errorMessage) {
+      return ` (error: ${toolCall.errorMessage})`;
+    }
+    return ' (error)';
+  }
+  return '';
+};
+
+const getToolCallReadFileVirtualDom = toolCall => {
+  const target = getReadFileTarget(toolCall.arguments);
+  if (!target) {
+    return [];
+  }
+  const fileName = getFileNameFromUri(target.title);
+  const toolNameLabel = `${toolCall.name} `;
+  const statusLabel = getToolCallStatusLabel(toolCall);
+  const fileNameClickableProps = target.clickableUri ? {
+    'data-uri': target.clickableUri,
+    onClick: HandleClickReadFile
+  } : {};
+  return [{
+    childCount: statusLabel ? 4 : 3,
+    className: ChatOrderedListItem,
+    title: target.title,
+    type: Li
+  }, {
+    childCount: 0,
+    className: FileIcon,
+    type: Div
+  }, text(toolNameLabel), {
+    childCount: 1,
+    className: ChatToolCallReadFileLink,
+    ...fileNameClickableProps,
+    type: Span
+  }, text(fileName), ...(statusLabel ? [text(statusLabel)] : [])];
+};
+
+const maxHtmlLength = 40_000;
+const tokenRegex = /<!--[\s\S]*?-->|<\/?[a-zA-Z][\w:-]*(?:\s[^<>]*?)?>|[^<]+/g;
+const attributeRegex = /([^\s=/>]+)(?:\s*=\s*(?:"([^"]*)"|'([^']*)'|([^\s"'=<>`]+)))?/g;
+const inlineTags = new Set(['a', 'abbr', 'b', 'code', 'em', 'i', 'label', 'small', 'span', 'strong', 'sub', 'sup', 'u']);
+const voidElements = new Set(['area', 'base', 'br', 'col', 'embed', 'hr', 'img', 'input', 'link', 'meta', 'param', 'source', 'track', 'wbr']);
+const sanitizeHtml = value => {
+  return value.slice(0, maxHtmlLength).replaceAll(/<script\b[\s\S]*?<\/script>/gi, '').replaceAll(/<style\b[\s\S]*?<\/style>/gi, '').replaceAll(/<head\b[\s\S]*?<\/head>/gi, '').replaceAll(/<meta\b[^>]*>/gi, '').replaceAll(/<link\b[^>]*>/gi, '');
+};
+const decodeEntities = value => {
+  return value.replaceAll('&nbsp;', ' ').replaceAll('&quot;', '"').replaceAll('&#39;', "'").replaceAll('&lt;', '<').replaceAll('&gt;', '>').replaceAll('&amp;', '&');
+};
+const parseAttributes = token => {
+  const withoutTag = token.replace(/^<\/?\s*[a-zA-Z][\w:-]*/, '').replace(/\/?\s*>$/, '').trim();
+  if (!withoutTag) {
+    return Object.create(null);
+  }
+  const attributes = Object.create(null);
+  const matches = withoutTag.matchAll(attributeRegex);
+  for (const match of matches) {
+    const name = String(match[1] || '').toLowerCase();
+    if (!name || name.startsWith('on')) {
+      continue;
+    }
+    const value = String(match[2] ?? match[3] ?? match[4] ?? '');
+    attributes[name] = decodeEntities(value);
+  }
+  return attributes;
+};
+const parseHtml = value => {
+  const root = {
+    attributes: Object.create(null),
+    children: [],
+    tagName: 'root',
+    type: 'element'
+  };
+  const stack = [root];
+  const matches = sanitizeHtml(value).match(tokenRegex);
+  if (!matches) {
+    return [];
+  }
+  for (const token of matches) {
+    if (token.startsWith('<!--')) {
+      continue;
+    }
+    if (token.startsWith('</')) {
+      const closingTagName = token.slice(2, -1).trim().toLowerCase();
+      while (stack.length > 1) {
+        const top = stack.at(-1);
+        if (!top) {
+          break;
+        }
+        stack.pop();
+        if (top.tagName === closingTagName) {
+          break;
+        }
+      }
+      continue;
+    }
+    if (token.startsWith('<')) {
+      const openTagNameMatch = /^<\s*([a-zA-Z][\w:-]*)/.exec(token);
+      if (!openTagNameMatch) {
+        continue;
+      }
+      const tagName = openTagNameMatch[1].toLowerCase();
+      const elementNode = {
+        attributes: parseAttributes(token),
+        children: [],
+        tagName,
+        type: 'element'
+      };
+      const parent = stack.at(-1);
+      if (!parent) {
+        continue;
+      }
+      parent.children.push(elementNode);
+      const selfClosing = token.endsWith('/>') || voidElements.has(tagName);
+      if (!selfClosing) {
+        stack.push(elementNode);
+      }
+      continue;
+    }
+    const decoded = decodeEntities(token);
+    if (!decoded) {
+      continue;
+    }
+    const parent = stack.at(-1);
+    if (!parent) {
+      continue;
+    }
+    parent.children.push({
+      type: 'text',
+      value: decoded
+    });
+  }
+  return root.children;
+};
+const getElementType = tagName => {
+  switch (tagName) {
+    case 'a':
+      return A;
+    case 'abbr':
+      return Abbr;
+    case 'article':
+      return Article;
+    case 'aside':
+      return Aside;
+    case 'audio':
+      return Audio;
+    case 'br':
+      return Br;
+    case 'button':
+      return Button$1;
+    case 'code':
+      return Code;
+    case 'col':
+      return Col;
+    case 'colgroup':
+      return ColGroup;
+    case 'dd':
+      return Dd;
+    case 'dl':
+      return Dl;
+    case 'dt':
+      return Dt;
+    case 'em':
+      return Em;
+    case 'figcaption':
+      return Figcaption;
+    case 'figure':
+      return Figure;
+    case 'footer':
+      return Footer;
+    case 'h1':
+      return H1;
+    case 'h2':
+      return H2;
+    case 'h3':
+      return H3;
+    case 'h4':
+      return H4;
+    case 'h5':
+      return H5;
+    case 'h6':
+      return H6;
+    case 'header':
+      return Header;
+    case 'hr':
+      return Hr;
+    case 'i':
+      return I;
+    case 'img':
+      return Img;
+    case 'input':
+      return Input;
+    case 'label':
+      return Label$1;
+    case 'li':
+      return Li;
+    case 'main':
+      return Main;
+    case 'nav':
+      return Nav;
+    case 'ol':
+      return Ol;
+    case 'option':
+      return Option$1;
+    case 'p':
+      return P;
+    case 'pre':
+      return Pre;
+    case 'section':
+      return Section;
+    case 'select':
+      return Select$1;
+    case 'span':
+      return Span;
+    case 'strong':
+      return Strong;
+    case 'table':
+      return Table;
+    case 'tbody':
+      return TBody;
+    case 'td':
+      return Td;
+    case 'textarea':
+      return TextArea;
+    case 'tfoot':
+      return Tfoot;
+    case 'th':
+      return Th;
+    case 'thead':
+      return THead;
+    case 'tr':
+      return Tr;
+    case 'ul':
+      return Ul;
+    default:
+      return inlineTags.has(tagName) ? Span : Div;
+  }
+};
+const normalizeUrl = url => {
+  return url.toLowerCase().startsWith('javascript:') ? '#' : url;
+};
+const getElementAttributes = node => {
+  const attributes = {};
+  const className = node.attributes.class || node.attributes.classname;
+  if (className) {
+    attributes.className = className;
+  }
+  if (node.attributes.style) {
+    attributes.style = node.attributes.style;
+  }
+  if (node.attributes.id) {
+    attributes.id = node.attributes.id;
+  }
+  if (node.attributes.name) {
+    attributes.name = node.attributes.name;
+  }
+  if (node.attributes.placeholder) {
+    attributes.placeholder = node.attributes.placeholder;
+  }
+  if (node.attributes.title) {
+    attributes.title = node.attributes.title;
+  }
+  if (node.attributes.value) {
+    attributes.value = node.attributes.value;
+  }
+  if (node.attributes.href) {
+    attributes.href = normalizeUrl(node.attributes.href);
+  }
+  if (node.attributes.src) {
+    attributes.src = normalizeUrl(node.attributes.src);
+  }
+  if (node.attributes.target) {
+    attributes.target = node.attributes.target;
+  }
+  if (node.attributes.rel) {
+    attributes.rel = node.attributes.rel;
+  }
+  if ('checked' in node.attributes) {
+    attributes.checked = node.attributes.checked !== 'false';
+  }
+  if ('disabled' in node.attributes) {
+    attributes.disabled = node.attributes.disabled !== 'false';
+  }
+  if ('readonly' in node.attributes) {
+    attributes.readOnly = node.attributes.readonly !== 'false';
+  }
+  return attributes;
+};
+const toVirtualDom = node => {
+  if (node.type === 'text') {
+    return [text(node.value)];
+  }
+  const children = node.children.flatMap(toVirtualDom);
+  return [{
+    childCount: node.children.length,
+    ...getElementAttributes(node),
+    type: getElementType(node.tagName)
+  }, ...children];
+};
+const parseHtmlToVirtualDomWithRootCount = value => {
+  const rootNodes = parseHtml(value);
+  return {
+    rootChildCount: rootNodes.length,
+    virtualDom: rootNodes.flatMap(toVirtualDom)
+  };
+};
+
+const getToolCallRenderHtmlVirtualDom = toolCall => {
+  const parsed = parseRenderHtmlArguments(toolCall.arguments);
+  if (!parsed) {
+    return [];
+  }
+  const statusLabel = getToolCallStatusLabel(toolCall);
+  const label = `${toolCall.name}: ${parsed.title}${statusLabel}`;
+  const parsedHtml = parseHtmlToVirtualDomWithRootCount(parsed.html);
+  const {
+    rootChildCount
+  } = parsedHtml;
+  return [{
+    childCount: 2,
+    className: ChatOrderedListItem,
+    type: Li
+  }, {
+    childCount: 1,
+    className: ChatToolCallRenderHtmlLabel,
+    type: Div
+  }, text(label), {
+    childCount: 1,
+    className: ChatToolCallRenderHtmlContent,
+    type: Div
+  }, {
+    childCount: rootChildCount,
+    className: ChatToolCallRenderHtmlBody,
+    type: Div
+  }, ...parsedHtml.virtualDom];
+};
+
 const getToolCallDom = toolCall => {
+  if (toolCall.name === 'read_file') {
+    const virtualDom = getToolCallReadFileVirtualDom(toolCall);
+    if (virtualDom.length > 0) {
+      return virtualDom;
+    }
+  }
+  if (toolCall.name === 'render_html') {
+    const virtualDom = getToolCallRenderHtmlVirtualDom(toolCall);
+    if (virtualDom.length > 0) {
+      return virtualDom;
+    }
+  }
   const argumentPreview = getToolCallArgumentPreview(toolCall.arguments);
-  const label = `${toolCall.name} ${argumentPreview}`;
+  const label = `${toolCall.name} ${argumentPreview}${getToolCallStatusLabel(toolCall)}`;
   return [{
     childCount: 1,
-    className: Markdown,
-    type: P
+    className: ChatOrderedListItem,
+    type: Li
   }, text(label)];
 };
 
@@ -5802,17 +6811,65 @@ const getToolCallsDom = message => {
     return [];
   }
   return [{
-    childCount: message.toolCalls.length,
-    className: 'ToolCallsContainer',
+    childCount: 2,
+    className: ChatToolCalls,
+    type: Div$1
+  }, {
+    childCount: 1,
+    className: ChatToolCallsLabel,
     type: Div$1
+  }, text('tools'), {
+    childCount: message.toolCalls.length,
+    className: ChatOrderedList,
+    type: Ol$1
   }, ...message.toolCalls.flatMap(getToolCallDom)];
 };
 
 const orderedListItemRegex = /^\s*\d+\.\s+(.*)$/;
+const markdownLinkRegex = /\[([^\]]+)\]\(([^)]+)\)/g;
+const parseInlineNodes = value => {
+  const matches = value.matchAll(markdownLinkRegex);
+  const nodes = [];
+  let lastIndex = 0;
+  for (const match of matches) {
+    const fullMatch = match[0];
+    const linkText = match[1];
+    const href = match[2];
+    const index = match.index ?? 0;
+    if (index > lastIndex) {
+      nodes.push({
+        text: value.slice(lastIndex, index),
+        type: 'text'
+      });
+    }
+    nodes.push({
+      href,
+      text: linkText,
+      type: 'link'
+    });
+    lastIndex = index + fullMatch.length;
+  }
+  if (lastIndex < value.length) {
+    nodes.push({
+      text: value.slice(lastIndex),
+      type: 'text'
+    });
+  }
+  if (nodes.length === 0) {
+    return [{
+      text: value,
+      type: 'text'
+    }];
+  }
+  return nodes;
+};
 const parseMessageContent = rawMessage => {
   if (rawMessage === '') {
     return [{
-      text: '',
+      children: [{
+        text: '',
+        type: 'text'
+      }],
       type: 'text'
     }];
   }
@@ -5825,7 +6882,7 @@ const parseMessageContent = rawMessage => {
       return;
     }
     nodes.push({
-      text: paragraphLines.join('\n'),
+      children: parseInlineNodes(paragraphLines.join('\n')),
       type: 'text'
     });
     paragraphLines = [];
@@ -5850,7 +6907,7 @@ const parseMessageContent = rawMessage => {
     if (match) {
       flushParagraph();
       listItems.push({
-        text: match[1],
+        children: parseInlineNodes(match[1]),
         type: 'list-item'
       });
       continue;
@@ -5861,32 +6918,13 @@ const parseMessageContent = rawMessage => {
   flushList();
   flushParagraph();
   return nodes.length === 0 ? [{
-    text: '',
+    children: [{
+      text: '',
+      type: 'text'
+    }],
     type: 'text'
   }] : nodes;
 };
-const getMessageContentDom = nodes => {
-  return nodes.flatMap(node => {
-    if (node.type === 'text') {
-      return [{
-        childCount: 1,
-        className: Markdown,
-        type: P
-      }, text(node.text)];
-    }
-    return [{
-      childCount: node.items.length,
-      className: ChatOrderedList,
-      type: Ol
-    }, ...node.items.flatMap(item => {
-      return [{
-        childCount: 1,
-        className: ChatOrderedListItem,
-        type: Li
-      }, text(item.text)];
-    })];
-  });
-};
 
 const getChatMessageDom = (message, openRouterApiKeyInput, openApiApiKeyInput = '', openRouterApiKeyState = 'idle') => {
   const roleClassName = message.role === 'user' ? MessageUser : MessageAssistant;
@@ -5907,7 +6945,7 @@ const getChatMessageDom = (message, openRouterApiKeyInput, openApiApiKeyInput =
     childCount: extraChildCount,
     className: ChatMessageContent,
     type: Div
-  }, ...messageDom, ...toolCallsDom, ...(isOpenApiApiKeyMissingMessage ? getMissingOpenApiApiKeyDom(openApiApiKeyInput) : []), ...(isOpenRouterApiKeyMissingMessage ? getMissingOpenRouterApiKeyDom(openRouterApiKeyInput, openRouterApiKeyState) : []), ...(isOpenRouterRequestFailedMessage ? getOpenRouterRequestFailedDom() : []), ...(isOpenRouterTooManyRequestsMessage ? getOpenRouterTooManyRequestsDom() : [])];
+  }, ...toolCallsDom, ...messageDom, ...(isOpenApiApiKeyMissingMessage ? getMissingOpenApiApiKeyDom(openApiApiKeyInput) : []), ...(isOpenRouterApiKeyMissingMessage ? getMissingOpenRouterApiKeyDom(openRouterApiKeyInput, openRouterApiKeyState) : []), ...(isOpenRouterRequestFailedMessage ? getOpenRouterRequestFailedDom() : []), ...(isOpenRouterTooManyRequestsMessage ? getOpenRouterTooManyRequestsDom() : [])];
 };
 
 const getEmptyMessagesDom = () => {
@@ -5925,6 +6963,7 @@ const getMessagesDom = (messages, openRouterApiKeyInput, openApiApiKeyInput = ''
   return [{
     childCount: messages.length,
     className: 'ChatMessages',
+    onContextMenu: HandleMessagesContextMenu,
     onScroll: HandleMessagesScroll,
     scrollTop: messagesScrollTop,
     type: Div
@@ -6139,6 +7178,9 @@ const renderEventListeners = () => {
   }, {
     name: HandleClick,
     params: ['handleClick', TargetName, 'event.target.dataset.id']
+  }, {
+    name: HandleClickReadFile,
+    params: ['handleClickReadFile', 'event.target.dataset.uri']
   }, {
     name: HandleClickDelete,
     params: ['handleClickDelete', 'event.target.dataset.id']
@@ -6172,6 +7214,10 @@ const renderEventListeners = () => {
   }, {
     name: HandleMessagesScroll,
     params: ['handleMessagesScroll', 'event.target.scrollTop']
+  }, {
+    name: HandleMessagesContextMenu,
+    params: ['handleMessagesContextMenu'],
+    preventDefault: true
   }, {
     name: HandleFocus,
     params: ['handleInputFocus', TargetName]
@@ -6215,30 +7261,22 @@ const saveState = state => {
   const {
     chatListScrollTop,
     composerValue,
-    height,
     messagesScrollTop,
     nextMessageId,
     renamingSessionId,
     selectedModelId,
     selectedSessionId,
-    viewMode,
-    width,
-    x,
-    y
+    viewMode
   } = state;
   return {
     chatListScrollTop,
     composerValue,
-    height,
     messagesScrollTop,
     nextMessageId,
     renamingSessionId,
     selectedModelId,
     selectedSessionId,
-    viewMode,
-    width,
-    x,
-    y
+    viewMode
   };
 };
 
@@ -6264,6 +7302,13 @@ const setChatList = state => {
   };
 };
 
+const setEmitStreamingFunctionCallEvents = (state, emitStreamingFunctionCallEvents) => {
+  return {
+    ...state,
+    emitStreamingFunctionCallEvents
+  };
+};
+
 const setStreamingEnabled = (state, streamingEnabled) => {
   return {
     ...state,
@@ -6302,11 +7347,13 @@ const commandMap = {
   'Chat.handleClickDelete': wrapCommand(handleClickDelete),
   'Chat.handleClickList': wrapCommand(handleClickList),
   'Chat.handleClickNew': wrapCommand(handleClickNew),
+  'Chat.handleClickReadFile': handleClickReadFile,
   'Chat.handleClickSessionDebug': wrapCommand(handleClickSessionDebug),
   'Chat.handleClickSettings': handleClickSettings,
   'Chat.handleInput': wrapCommand(handleInput),
   'Chat.handleInputFocus': wrapCommand(handleInputFocus),
   'Chat.handleKeyDown': wrapCommand(handleKeyDown),
+  'Chat.handleMessagesContextMenu': wrapCommand(handleMessagesContextMenu),
   'Chat.handleMessagesScroll': wrapCommand(handleMessagesScroll),
   'Chat.handleModelChange': wrapCommand(handleModelChange),
   'Chat.handleSubmit': wrapCommand(handleSubmit),
@@ -6325,6 +7372,7 @@ const commandMap = {
   'Chat.resize': wrapCommand(resize),
   'Chat.saveState': wrapGetter(saveState),
   'Chat.setChatList': wrapCommand(setChatList),
+  'Chat.setEmitStreamingFunctionCallEvents': wrapCommand(setEmitStreamingFunctionCallEvents),
   'Chat.setOpenRouterApiKey': wrapCommand(setOpenRouterApiKey),
   'Chat.setStreamingEnabled': wrapCommand(setStreamingEnabled),
   'Chat.terminate': terminate,