@mastra/react 0.0.0-monorepo-binary-20251013210052 → 0.0.0-new-button-export-20251219130424

package/dist/index.cjs

@@ -5,7 +5,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 const jsxRuntime = require('react/jsx-runtime');
 const react = require('react');
 const clientJs = require('@mastra/client-js');
-const reactDom = require('react-dom');
+const uuid = require('@lukeed/uuid');
 const lucideReact = require('lucide-react');
 const tailwindMerge = require('tailwind-merge');
 const hastUtilToJsxRuntime = require('hast-util-to-jsx-runtime');
@@ -51,7 +51,7 @@ const mapWorkflowStreamChunkToWatchResult = (prev, chunk) => {
     return {
       ...prev,
       status: chunk.payload.workflowStatus,
-      ...finalStatus === "success" && lastStep?.status === "success" ? { result: lastStep?.output } : finalStatus === "failed" && lastStep?.status === "failed" ? { error: lastStep?.error } : {}
+      ...finalStatus === "success" && lastStep?.status === "success" ? { result: lastStep?.output } : finalStatus === "failed" && lastStep?.status === "failed" ? { error: lastStep?.error } : finalStatus === "tripwire" && chunk.payload.tripwire ? { tripwire: chunk.payload.tripwire } : {}
     };
   }
   const { stepCallId, stepName, ...newPayload } = chunk.payload ?? {};
@@ -103,6 +103,34 @@ const mapWorkflowStreamChunkToWatchResult = (prev, chunk) => {
 };
 const toUIMessage = ({ chunk, conversation, metadata }) => {
   const result = [...conversation];
+  if (chunk.type.startsWith("data-")) {
+    const lastMessage = result[result.length - 1];
+    if (!lastMessage || lastMessage.role !== "assistant") {
+      const newMessage = {
+        id: `data-${chunk.runId}-${Date.now()}`,
+        role: "assistant",
+        parts: [
+          {
+            type: chunk.type,
+            data: "data" in chunk ? chunk.data : void 0
+          }
+        ],
+        metadata
+      };
+      return [...result, newMessage];
+    }
+    const updatedMessage = {
+      ...lastMessage,
+      parts: [
+        ...lastMessage.parts,
+        {
+          type: chunk.type,
+          data: "data" in chunk ? chunk.data : void 0
+        }
+      ]
+    };
+    return [...result.slice(0, -1), updatedMessage];
+  }
   switch (chunk.type) {
     case "tripwire": {
       const newMessage = {
@@ -111,19 +139,24 @@ const toUIMessage = ({ chunk, conversation, metadata }) => {
         parts: [
           {
             type: "text",
-            text: chunk.payload.tripwireReason
+            text: chunk.payload.reason
           }
         ],
         metadata: {
           ...metadata,
-          status: "warning"
+          status: "tripwire",
+          tripwire: {
+            retry: chunk.payload.retry,
+            tripwirePayload: chunk.payload.metadata,
+            processorId: chunk.payload.processorId
+          }
         }
       };
       return [...result, newMessage];
     }
     case "start": {
       const newMessage = {
-        id: `start-${chunk.runId + Date.now()}`,
+        id: typeof chunk.payload.messageId === "string" ? chunk.payload.messageId : `start-${chunk.runId + Date.now()}`,
         role: "assistant",
         parts: [],
         metadata
@@ -254,35 +287,48 @@ const toUIMessage = ({ chunk, conversation, metadata }) => {
         }
       ];
     }
+    case "tool-error":
     case "tool-result": {
       const lastMessage = result[result.length - 1];
       if (!lastMessage || lastMessage.role !== "assistant") return result;
       const parts = [...lastMessage.parts];
       const toolPartIndex = parts.findIndex(
-        (part) => part.type === "dynamic-tool" && "toolCallId" in part && part.toolCallId === chunk.payload.toolCallId
+        (part) => (part.type === "dynamic-tool" || typeof part.type === "string" && part.type.startsWith("tool-")) && "toolCallId" in part && part.toolCallId === chunk.payload.toolCallId
       );
       if (toolPartIndex !== -1) {
         const toolPart = parts[toolPartIndex];
-        if (toolPart.type === "dynamic-tool") {
-          if (chunk.payload.isError) {
+        if (toolPart.type === "dynamic-tool" || typeof toolPart.type === "string" && toolPart.type.startsWith("tool-")) {
+          const toolName = "toolName" in toolPart && typeof toolPart.toolName === "string" ? toolPart.toolName : toolPart.type.startsWith("tool-") ? toolPart.type.substring(5) : "";
+          const toolCallId = toolPart.toolCallId;
+          if (chunk.type === "tool-result" && chunk.payload.isError || chunk.type === "tool-error") {
+            const error = chunk.type === "tool-error" ? chunk.payload.error : chunk.payload.result;
             parts[toolPartIndex] = {
               type: "dynamic-tool",
-              toolName: toolPart.toolName,
-              toolCallId: toolPart.toolCallId,
+              toolName,
+              toolCallId,
               state: "output-error",
               input: toolPart.input,
-              errorText: String(chunk.payload.result),
+              errorText: String(error),
               callProviderMetadata: chunk.payload.providerMetadata
             };
           } else {
             const isWorkflow = Boolean(chunk.payload.result?.result?.steps);
+            const isAgent = chunk?.from === "AGENT";
+            let output;
+            if (isWorkflow) {
+              output = chunk.payload.result?.result;
+            } else if (isAgent) {
+              output = parts[toolPartIndex].output ?? chunk.payload.result;
+            } else {
+              output = chunk.payload.result;
+            }
             parts[toolPartIndex] = {
               type: "dynamic-tool",
-              toolName: toolPart.toolName,
-              toolCallId: toolPart.toolCallId,
+              toolName,
+              toolCallId,
               state: "output-available",
               input: toolPart.input,
-              output: isWorkflow ? chunk.payload.result?.result : chunk.payload.result,
+              output,
               callProviderMetadata: chunk.payload.providerMetadata
             };
           }
@@ -301,11 +347,14 @@ const toUIMessage = ({ chunk, conversation, metadata }) => {
       if (!lastMessage || lastMessage.role !== "assistant") return result;
       const parts = [...lastMessage.parts];
       const toolPartIndex = parts.findIndex(
-        (part) => part.type === "dynamic-tool" && "toolCallId" in part && part.toolCallId === chunk.payload.toolCallId
+        (part) => (part.type === "dynamic-tool" || typeof part.type === "string" && part.type.startsWith("tool-")) && "toolCallId" in part && part.toolCallId === chunk.payload.toolCallId
       );
       if (toolPartIndex !== -1) {
         const toolPart = parts[toolPartIndex];
-        if (toolPart.type === "dynamic-tool") {
+        if (toolPart.type === "dynamic-tool" || typeof toolPart.type === "string" && toolPart.type.startsWith("tool-")) {
+          const toolName = "toolName" in toolPart && typeof toolPart.toolName === "string" ? toolPart.toolName : typeof toolPart.type === "string" && toolPart.type.startsWith("tool-") ? toolPart.type.substring(5) : "";
+          const toolCallId = toolPart.toolCallId;
+          const input = toolPart.input;
           if (chunk.payload.output?.type?.startsWith("workflow-")) {
             const existingWorkflowState = toolPart.output || {};
             const updatedWorkflowState = mapWorkflowStreamChunkToWatchResult(
@@ -313,14 +362,24 @@ const toUIMessage = ({ chunk, conversation, metadata }) => {
               chunk.payload.output
             );
             parts[toolPartIndex] = {
-              ...toolPart,
+              type: "dynamic-tool",
+              toolName,
+              toolCallId,
+              state: "input-streaming",
+              input,
               output: updatedWorkflowState
             };
+          } else if (chunk.payload.output?.from === "AGENT" || chunk.payload.output?.from === "USER" && chunk.payload.output?.payload?.output?.type?.startsWith("workflow-")) {
+            return toUIMessageFromAgent(chunk.payload.output, conversation);
           } else {
             const currentOutput = toolPart.output || [];
             const existingOutput = Array.isArray(currentOutput) ? currentOutput : [];
             parts[toolPartIndex] = {
-              ...toolPart,
+              type: "dynamic-tool",
+              toolName,
+              toolCallId,
+              state: "input-streaming",
+              input,
               output: [...existingOutput, chunk.payload.output]
             };
           }
@@ -389,15 +448,61 @@ const toUIMessage = ({ chunk, conversation, metadata }) => {
         }
       ];
     }
+    case "tool-call-approval": {
+      const lastMessage = result[result.length - 1];
+      if (!lastMessage || lastMessage.role !== "assistant") return result;
+      const lastRequireApprovalMetadata = lastMessage.metadata?.mode === "stream" ? lastMessage.metadata?.requireApprovalMetadata : {};
+      return [
+        ...result.slice(0, -1),
+        {
+          ...lastMessage,
+          metadata: {
+            ...lastMessage.metadata,
+            mode: "stream",
+            requireApprovalMetadata: {
+              ...lastRequireApprovalMetadata,
+              [chunk.payload.toolName]: {
+                toolCallId: chunk.payload.toolCallId,
+                toolName: chunk.payload.toolName,
+                args: chunk.payload.args
+              }
+            }
+          }
+        }
+      ];
+    }
+    case "tool-call-suspended": {
+      const lastMessage = result[result.length - 1];
+      if (!lastMessage || lastMessage.role !== "assistant") return result;
+      const lastSuspendedTools = lastMessage.metadata?.mode === "stream" ? lastMessage.metadata?.suspendedTools : {};
+      return [
+        ...result.slice(0, -1),
+        {
+          ...lastMessage,
+          metadata: {
+            ...lastMessage.metadata,
+            mode: "stream",
+            suspendedTools: {
+              ...lastSuspendedTools,
+              [chunk.payload.toolName]: {
+                toolCallId: chunk.payload.toolCallId,
+                toolName: chunk.payload.toolName,
+                args: chunk.payload.args,
+                suspendPayload: chunk.payload.suspendPayload
+              }
+            }
+          }
+        }
+      ];
+    }
     case "finish": {
       const lastMessage = result[result.length - 1];
       if (!lastMessage || lastMessage.role !== "assistant") return result;
       const parts = lastMessage.parts.map((part) => {
-        if (part.type === "text" && part.state === "streaming") {
-          return { ...part, state: "done" };
-        }
-        if (part.type === "reasoning" && part.state === "streaming") {
-          return { ...part, state: "done" };
+        if (typeof part === "object" && part !== null && "type" in part && "state" in part && part.state === "streaming") {
+          if (part.type === "text" || part.type === "reasoning") {
+            return { ...part, state: "done" };
+          }
         }
         return part;
       });
@@ -431,6 +536,105 @@ const toUIMessage = ({ chunk, conversation, metadata }) => {
       return result;
   }
 };
+const toUIMessageFromAgent = (chunk, conversation, metadata) => {
+  const lastMessage = conversation[conversation.length - 1];
+  if (!lastMessage || lastMessage.role !== "assistant") return conversation;
+  const parts = [...lastMessage.parts];
+  if (chunk.type === "text-delta") {
+    const agentChunk = chunk.payload;
+    const toolPartIndex = parts.findIndex((part) => part.type === "dynamic-tool");
+    if (toolPartIndex === -1) return conversation;
+    const toolPart = parts[toolPartIndex];
+    const childMessages = toolPart?.output?.childMessages || [];
+    const lastChildMessage = childMessages[childMessages.length - 1];
+    const textMessage = { type: "text", content: (lastChildMessage?.content || "") + agentChunk.text };
+    const nextMessages = lastChildMessage?.type === "text" ? [...childMessages.slice(0, -1), textMessage] : [...childMessages, textMessage];
+    parts[toolPartIndex] = {
+      ...toolPart,
+      output: {
+        childMessages: nextMessages
+      }
+    };
+  } else if (chunk.type === "tool-call") {
+    const agentChunk = chunk.payload;
+    const toolPartIndex = parts.findIndex((part) => part.type === "dynamic-tool");
+    if (toolPartIndex === -1) return conversation;
+    const toolPart = parts[toolPartIndex];
+    const childMessages = toolPart?.output?.childMessages || [];
+    parts[toolPartIndex] = {
+      ...toolPart,
+      output: {
+        ...toolPart?.output,
+        childMessages: [
+          ...childMessages,
+          {
+            type: "tool",
+            toolCallId: agentChunk.toolCallId,
+            toolName: agentChunk.toolName,
+            args: agentChunk.args
+          }
+        ]
+      }
+    };
+  } else if (chunk.type === "tool-output") {
+    const agentChunk = chunk.payload;
+    const toolPartIndex = parts.findIndex((part) => part.type === "dynamic-tool");
+    if (toolPartIndex === -1) return conversation;
+    const toolPart = parts[toolPartIndex];
+    if (agentChunk?.output?.type?.startsWith("workflow-")) {
+      const childMessages = toolPart?.output?.childMessages || [];
+      const lastToolIndex = childMessages.length - 1;
+      const currentMessage = childMessages[lastToolIndex];
+      const actualExistingWorkflowState = currentMessage?.toolOutput || {};
+      const updatedWorkflowState = mapWorkflowStreamChunkToWatchResult(actualExistingWorkflowState, agentChunk.output);
+      if (lastToolIndex >= 0 && childMessages[lastToolIndex]?.type === "tool") {
+        parts[toolPartIndex] = {
+          ...toolPart,
+          output: {
+            ...toolPart?.output,
+            childMessages: [
+              ...childMessages.slice(0, -1),
+              {
+                ...currentMessage,
+                toolOutput: { ...updatedWorkflowState, runId: agentChunk.output.runId }
+              }
+            ]
+          }
+        };
+      }
+    }
+  } else if (chunk.type === "tool-result") {
+    const agentChunk = chunk.payload;
+    const toolPartIndex = parts.findIndex((part) => part.type === "dynamic-tool");
+    if (toolPartIndex === -1) return conversation;
+    const toolPart = parts[toolPartIndex];
+    const childMessages = toolPart?.output?.childMessages || [];
+    const lastToolIndex = childMessages.length - 1;
+    const isWorkflow = agentChunk?.toolName?.startsWith("workflow-");
+    if (lastToolIndex >= 0 && childMessages[lastToolIndex]?.type === "tool") {
+      parts[toolPartIndex] = {
+        ...toolPart,
+        output: {
+          ...toolPart?.output,
+          childMessages: [
+            ...childMessages.slice(0, -1),
+            {
+              ...childMessages[lastToolIndex],
+              toolOutput: isWorkflow ? { ...agentChunk.result?.result, runId: agentChunk.result?.runId } : agentChunk.result
+            }
+          ]
+        }
+      };
+    }
+  }
+  return [
+    ...conversation.slice(0, -1),
+    {
+      ...lastMessage,
+      parts
+    }
+  ];
+};
 
 const toAssistantUIMessage = (message) => {
   const extendedMessage = message;
@@ -470,13 +674,23 @@ const toAssistantUIMessage = (message) => {
       };
     }
     if (part.type === "file") {
-      return {
-        type: "file",
-        mimeType: part.mediaType,
-        data: part.url,
-        // Use URL as data source
-        metadata: message.metadata
-      };
+      const type = part.mediaType.includes("image/") ? "image" : "file";
+      if (type === "file") {
+        return {
+          type,
+          mimeType: part.mediaType,
+          data: part.url,
+          // Use URL as data source
+          metadata: message.metadata
+        };
+      }
+      if (type === "image") {
+        return {
+          type,
+          image: part.url,
+          metadata: message.metadata
+        };
+      }
     }
     if (part.type === "dynamic-tool") {
       const baseToolCall = {
@@ -496,13 +710,14 @@ const toAssistantUIMessage = (message) => {
       return baseToolCall;
     }
     if (part.type.startsWith("tool-") && part.state !== "input-available") {
-      const toolName = "toolName" in part && typeof part.toolName === "string" ? part.toolName : part.type.substring(5);
+      const toolName2 = "toolName" in part && typeof part.toolName === "string" ? part.toolName : part.type.substring(5);
+      const { suspendedToolRunId, ...cleanInput } = "input" in part ? part.input : {};
       const baseToolCall = {
         type: "tool-call",
         toolCallId: "toolCallId" in part && typeof part.toolCallId === "string" ? part.toolCallId : "",
-        toolName,
-        argsText: "input" in part ? JSON.stringify(part.input) : "{}",
-        args: "input" in part ? part.input : {},
+        toolName: toolName2,
+        argsText: JSON.stringify(cleanInput ?? {}),
+        args: cleanInput ?? {},
         metadata: message.metadata
       };
       if ("output" in part) {
@@ -512,6 +727,31 @@ const toAssistantUIMessage = (message) => {
       }
       return baseToolCall;
     }
+    const toolName = "toolName" in part && typeof part.toolName === "string" ? part.toolName : part.type.startsWith("tool-") ? part.type.substring(5) : "";
+    const requireApprovalMetadata = extendedMessage.metadata?.requireApprovalMetadata;
+    const suspendedTools = extendedMessage.metadata?.suspendedTools;
+    const partToolCallId = "toolCallId" in part && typeof part.toolCallId === "string" ? part.toolCallId : void 0;
+    const suspensionData = toolName ? requireApprovalMetadata?.[toolName] ?? suspendedTools?.[toolName] : void 0;
+    if (suspensionData) {
+      const { suspendedToolRunId, ...cleanInput } = "input" in part ? part.input : {};
+      return {
+        type: "tool-call",
+        toolCallId: partToolCallId,
+        toolName,
+        argsText: JSON.stringify(cleanInput ?? {}),
+        args: cleanInput,
+        metadata: extendedMessage.metadata
+      };
+    }
+    if (part.type.startsWith("data-")) {
+      return {
+        type: "data",
+        name: part.type.substring(5),
+        // Extract name from 'data-{name}'
+        data: part.data,
+        metadata: message.metadata
+      };
+    }
     return {
       type: "text",
       text: "",
@@ -551,9 +791,146 @@ const toAssistantUIMessage = (message) => {
   return threadMessage;
 };
 
+const resolveInitialMessages = (messages) => {
+  return messages.map((message) => {
+    const networkPart = message.parts.find(
+      (part) => typeof part === "object" && part !== null && "type" in part && part.type === "text" && "text" in part && typeof part.text === "string" && part.text.includes('"isNetwork":true')
+    );
+    if (networkPart && networkPart.type === "text") {
+      try {
+        const json = JSON.parse(networkPart.text);
+        if (json.isNetwork === true) {
+          const selectionReason = json.selectionReason || "";
+          const primitiveType = json.primitiveType || "";
+          const primitiveId = json.primitiveId || "";
+          const finalResult = json.finalResult;
+          const messages2 = finalResult?.messages || [];
+          const childMessages = [];
+          const toolResultMap = /* @__PURE__ */ new Map();
+          for (const msg of messages2) {
+            if (Array.isArray(msg.content)) {
+              for (const part of msg.content) {
+                if (typeof part === "object" && part.type === "tool-result") {
+                  toolResultMap.set(part.toolCallId, part);
+                }
+              }
+            }
+          }
+          for (const msg of messages2) {
+            if (msg.type === "tool-call" && Array.isArray(msg.content)) {
+              for (const part of msg.content) {
+                if (typeof part === "object" && part.type === "tool-call") {
+                  const toolCallContent = part;
+                  const toolResult = toolResultMap.get(toolCallContent.toolCallId);
+                  const isWorkflow = Boolean(toolResult?.result?.result?.steps);
+                  childMessages.push({
+                    type: "tool",
+                    toolCallId: toolCallContent.toolCallId,
+                    toolName: toolCallContent.toolName,
+                    args: toolCallContent.args,
+                    toolOutput: isWorkflow ? toolResult?.result?.result : toolResult?.result
+                  });
+                }
+              }
+            }
+          }
+          if (finalResult && finalResult.text) {
+            childMessages.push({
+              type: "text",
+              content: finalResult.text
+            });
+          }
+          const result = {
+            childMessages,
+            result: finalResult?.text || ""
+          };
+          const nextMessage = {
+            role: "assistant",
+            parts: [
+              {
+                type: "dynamic-tool",
+                toolCallId: primitiveId,
+                toolName: primitiveId,
+                state: "output-available",
+                input: json.input,
+                output: result
+              }
+            ],
+            id: message.id,
+            metadata: {
+              ...message.metadata,
+              mode: "network",
+              selectionReason,
+              agentInput: json.input,
+              from: primitiveType === "agent" ? "AGENT" : "WORKFLOW"
+            }
+          };
+          return nextMessage;
+        }
+      } catch (error) {
+        return message;
+      }
+    }
+    const extendedMessage = message;
+    const pendingToolApprovals = extendedMessage.metadata?.pendingToolApprovals;
+    if (pendingToolApprovals && typeof pendingToolApprovals === "object") {
+      return {
+        ...message,
+        metadata: {
+          ...message.metadata,
+          mode: "stream",
+          requireApprovalMetadata: pendingToolApprovals
+        }
+      };
+    }
+    const suspendedTools = extendedMessage.metadata?.suspendedTools;
+    if (suspendedTools && typeof suspendedTools === "object") {
+      return {
+        ...message,
+        metadata: {
+          ...message.metadata,
+          mode: "stream",
+          suspendedTools
+        }
+      };
+    }
+    return message;
+  });
+};
+const resolveToChildMessages = (messages) => {
+  const assistantMessage = messages.find((message) => message.role === "assistant");
+  if (!assistantMessage) return [];
+  const parts = assistantMessage.parts;
+  let childMessages = [];
+  for (const part of parts) {
+    const toolPart = part;
+    if (part.type.startsWith("tool-")) {
+      const toolName = part.type.substring("tool-".length);
+      const isWorkflow = toolName.startsWith("workflow-");
+      childMessages.push({
+        type: "tool",
+        toolCallId: toolPart.toolCallId,
+        toolName,
+        args: toolPart.input,
+        toolOutput: isWorkflow ? { ...toolPart.output?.result, runId: toolPart.output?.runId } : toolPart.output
+      });
+    }
+    if (part.type === "text") {
+      childMessages.push({
+        type: "text",
+        content: toolPart.text
+      });
+    }
+  }
+  return childMessages;
+};
+
 class AISdkNetworkTransformer {
   transform({ chunk, conversation, metadata }) {
     const newConversation = [...conversation];
+    if (chunk.type === "routing-agent-text-delta") {
+      return this.handleRoutingAgentConversation(chunk, newConversation);
+    }
     if (chunk.type.startsWith("agent-execution-")) {
       return this.handleAgentConversation(chunk, newConversation, metadata);
     }
@@ -564,22 +941,80 @@ class AISdkNetworkTransformer {
       return this.handleToolConversation(chunk, newConversation, metadata);
     }
     if (chunk.type === "network-execution-event-step-finish") {
-      const newMessage = {
-        id: `network-execution-event-step-finish-${chunk.runId}-${Date.now()}`,
-        role: "assistant",
-        parts: [
+      const lastMessage = newConversation[newConversation.length - 1];
+      if (!lastMessage || lastMessage.role !== "assistant") return newConversation;
+      const agentChunk = chunk.payload;
+      const parts = [...lastMessage.parts];
+      const textPartIndex = parts.findIndex((part) => part.type === "text");
+      if (textPartIndex === -1) {
+        parts.push({
+          type: "text",
+          text: agentChunk.result,
+          state: "done"
+        });
+        return [
+          ...newConversation.slice(0, -1),
           {
-            type: "text",
-            text: chunk.payload?.result || "",
-            state: "done"
+            ...lastMessage,
+            parts
           }
-        ],
-        metadata
-      };
-      return [...newConversation, newMessage];
+        ];
+      }
+      const textPart = parts[textPartIndex];
+      if (textPart.type === "text") {
+        parts[textPartIndex] = {
+          ...textPart,
+          state: "done"
+        };
+        return [
+          ...newConversation.slice(0, -1),
+          {
+            ...lastMessage,
+            parts
+          }
+        ];
+      }
+      return newConversation;
     }
     return newConversation;
   }
+  handleRoutingAgentConversation = (chunk, newConversation) => {
+    const lastMessage = newConversation[newConversation.length - 1];
+    if (!lastMessage || lastMessage.role !== "assistant") return newConversation;
+    const agentChunk = chunk.payload;
+    const parts = [...lastMessage.parts];
+    const textPartIndex = parts.findIndex((part) => part.type === "text");
+    if (textPartIndex === -1) {
+      parts.push({
+        type: "text",
+        text: agentChunk.text,
+        state: "streaming"
+      });
+      return [
+        ...newConversation.slice(0, -1),
+        {
+          ...lastMessage,
+          parts
+        }
+      ];
+    }
+    const textPart = parts[textPartIndex];
+    if (textPart.type === "text") {
+      parts[textPartIndex] = {
+        ...textPart,
+        text: textPart.text + agentChunk.text,
+        state: "streaming"
+      };
+      return [
+        ...newConversation.slice(0, -1),
+        {
+          ...lastMessage,
+          parts
+        }
+      ];
+    }
+    return newConversation;
+  };
   handleAgentConversation = (chunk, newConversation, metadata) => {
     if (chunk.type === "agent-execution-start") {
       const primitiveId = chunk.payload?.args?.primitiveId;
@@ -862,96 +1297,80 @@ class AISdkNetworkTransformer {
   };
 }
 
-const resolveInitialMessages = (messages) => {
-  return messages.map((message) => {
-    const networkPart = message.parts.find((part) => part.type === "text" && part.text.includes('"isNetwork":true'));
-    if (networkPart && networkPart.type === "text") {
-      try {
-        const json = JSON.parse(networkPart.text);
-        if (json.isNetwork === true) {
-          const selectionReason = json.selectionReason || "";
-          const primitiveType = json.primitiveType || "";
-          const primitiveId = json.primitiveId || "";
-          const finalResult = json.finalResult;
-          const toolCalls = finalResult?.toolCalls || [];
-          const childMessages = [];
-          for (const toolCall of toolCalls) {
-            if (toolCall.type === "tool-call" && toolCall.payload) {
-              const toolCallId = toolCall.payload.toolCallId;
-              let toolResult;
-              for (const message2 of finalResult?.messages || []) {
-                for (const part of message2.content || []) {
-                  if (typeof part === "object" && part.type === "tool-result" && part.toolCallId === toolCallId) {
-                    toolResult = part;
-                    break;
-                  }
-                }
-              }
-              const isWorkflow = Boolean(toolResult?.result?.result?.steps);
-              childMessages.push({
-                type: "tool",
-                toolCallId: toolCall.payload.toolCallId,
-                toolName: toolCall.payload.toolName,
-                args: toolCall.payload.args,
-                toolOutput: isWorkflow ? toolResult?.result?.result : toolResult?.result
-              });
-            }
-          }
-          if (finalResult && finalResult.text) {
-            childMessages.push({
-              type: "text",
-              content: finalResult.text
-            });
-          }
-          const result = {
-            childMessages,
-            result: finalResult?.text || ""
-          };
-          console.log("json", json);
-          const nextMessage = {
-            role: "assistant",
-            parts: [
-              {
-                type: "dynamic-tool",
-                toolCallId: primitiveId,
-                toolName: primitiveId,
-                state: "output-available",
-                input: json.input,
-                output: result
-              }
-            ],
-            id: message.id,
-            metadata: {
-              ...message.metadata,
-              mode: "network",
-              selectionReason,
-              agentInput: json.input,
-              from: primitiveType === "agent" ? "AGENT" : "WORKFLOW"
-            }
-          };
-          return nextMessage;
-        }
-      } catch (error) {
-        return message;
+const fromCoreUserMessageToUIMessage = (coreUserMessage) => {
+  const id = `user-${Date.now()}-${Math.random().toString(36).substring(2, 9)}`;
+  const parts = typeof coreUserMessage.content === "string" ? [
+    {
+      type: "text",
+      text: coreUserMessage.content
+    }
+  ] : coreUserMessage.content.map((part) => {
+    switch (part.type) {
+      case "text": {
+        return {
+          type: "text",
+          text: part.text
+        };
+      }
+      case "image": {
+        const url = typeof part.image === "string" ? part.image : part.image instanceof URL ? part.image.toString() : "";
+        return {
+          type: "file",
+          mediaType: part.mimeType ?? "image/*",
+          url
+        };
+      }
+      case "file": {
+        const url = typeof part.data === "string" ? part.data : part.data instanceof URL ? part.data.toString() : "";
+        return {
+          type: "file",
+          mediaType: part.mimeType,
+          url,
+          ...part.filename !== void 0 ? { filename: part.filename } : {}
+        };
+      }
+      default: {
+        const exhaustiveCheck = part;
+        throw new Error(`Unhandled content part type: ${exhaustiveCheck.type}`);
       }
     }
-    return message;
   });
+  return {
+    id,
+    role: "user",
+    parts
+  };
 };
 
-const useChat = ({ agentId, initializeMessages }) => {
-  const [messages, setMessages] = react.useState(
-    () => resolveInitialMessages(initializeMessages?.() || [])
-  );
+const useChat = ({ agentId, resourceId, initializeMessages }) => {
+  const extractRunIdFromMessages = (messages2) => {
+    for (const message of messages2) {
+      const pendingToolApprovals = message.metadata?.pendingToolApprovals;
+      if (pendingToolApprovals && typeof pendingToolApprovals === "object") {
+        const suspensionData = Object.values(pendingToolApprovals)[0];
+        if (suspensionData?.runId) {
+          return suspensionData.runId;
+        }
+      }
+    }
+    return void 0;
+  };
+  const initialMessages = initializeMessages?.() || [];
+  const initialRunId = extractRunIdFromMessages(initialMessages);
+  const _currentRunId = react.useRef(initialRunId);
+  const _onChunk = react.useRef(void 0);
+  const [messages, setMessages] = react.useState(() => resolveInitialMessages(initialMessages));
+  const [toolCallApprovals, setToolCallApprovals] = react.useState({});
   const baseClient = useMastraClient();
   const [isRunning, setIsRunning] = react.useState(false);
   const generate = async ({
     coreUserMessages,
-    runtimeContext,
+    requestContext,
     threadId,
     modelSettings,
     signal,
-    onFinish
+    onFinish,
+    tracingOptions
   }) => {
     const {
       frequencyPenalty,
@@ -973,7 +1392,7 @@ const useChat = ({ agentId, initializeMessages }) => {
     const agent = clientWithAbort.getAgent(agentId);
     const response = await agent.generate({
       messages: coreUserMessages,
-      runId: agentId,
+      runId: uuid.v4(),
       maxSteps,
       modelSettings: {
         frequencyPenalty,
@@ -985,9 +1404,10 @@ const useChat = ({ agentId, initializeMessages }) => {
         topP
       },
       instructions,
-      runtimeContext,
-      ...threadId ? { threadId, resourceId: agentId } : {},
-      providerOptions
+      requestContext,
+      ...threadId ? { threadId, resourceId: resourceId || agentId } : {},
+      providerOptions,
+      tracingOptions
     });
     setIsRunning(false);
     if (response && "uiMessages" in response.response && response.response.uiMessages) {
@@ -1001,7 +1421,15 @@ const useChat = ({ agentId, initializeMessages }) => {
       setMessages((prev) => [...prev, ...mastraUIMessages]);
     }
   };
-  const stream = async ({ coreUserMessages, runtimeContext, threadId, onChunk, modelSettings, signal }) => {
+  const stream = async ({
+    coreUserMessages,
+    requestContext,
+    threadId,
+    onChunk,
+    modelSettings,
+    signal,
+    tracingOptions
+  }) => {
     const {
       frequencyPenalty,
       presencePenalty,
@@ -1012,7 +1440,8 @@ const useChat = ({ agentId, initializeMessages }) => {
       topP,
       instructions,
       providerOptions,
-      maxSteps
+      maxSteps,
+      requireToolApproval
     } = modelSettings || {};
     setIsRunning(true);
     const clientWithAbort = new clientJs.MastraClient({
@@ -1020,9 +1449,10 @@ const useChat = ({ agentId, initializeMessages }) => {
       abortSignal: signal
     });
     const agent = clientWithAbort.getAgent(agentId);
+    const runId = uuid.v4();
     const response = await agent.stream({
       messages: coreUserMessages,
-      runId: agentId,
+      runId,
       maxSteps,
       modelSettings: {
         frequencyPenalty,
@@ -1034,19 +1464,17 @@ const useChat = ({ agentId, initializeMessages }) => {
         topP
       },
       instructions,
-      runtimeContext,
-      ...threadId ? { threadId, resourceId: agentId } : {},
-      providerOptions
+      requestContext,
+      ...threadId ? { threadId, resourceId: resourceId || agentId } : {},
+      providerOptions,
+      requireToolApproval,
+      tracingOptions
     });
-    if (!response.body) {
-      setIsRunning(false);
-      throw new Error("[Stream] No response body");
-    }
+    _onChunk.current = onChunk;
+    _currentRunId.current = runId;
     await response.processDataStream({
       onChunk: async (chunk) => {
-        reactDom.flushSync(() => {
-          setMessages((prev) => toUIMessage({ chunk, conversation: prev, metadata: { mode: "stream" } }));
-        });
+        setMessages((prev) => toUIMessage({ chunk, conversation: prev, metadata: { mode: "stream" } }));
         onChunk?.(chunk);
       }
     });
@@ -1054,11 +1482,12 @@ const useChat = ({ agentId, initializeMessages }) => {
   };
   const network = async ({
     coreUserMessages,
-    runtimeContext,
+    requestContext,
     threadId,
     onNetworkChunk,
     modelSettings,
-    signal
+    signal,
+    tracingOptions
   }) => {
     const { frequencyPenalty, presencePenalty, maxRetries, maxTokens, temperature, topK, topP, maxSteps } = modelSettings || {};
     setIsRunning(true);
@@ -1067,6 +1496,7 @@ const useChat = ({ agentId, initializeMessages }) => {
       abortSignal: signal
     });
     const agent = clientWithAbort.getAgent(agentId);
+    const runId = uuid.v4();
     const response = await agent.network({
       messages: coreUserMessages,
       maxSteps,
@@ -1079,31 +1509,73 @@ const useChat = ({ agentId, initializeMessages }) => {
         topK,
         topP
       },
-      runId: agentId,
-      runtimeContext,
-      ...threadId ? { thread: threadId, resourceId: agentId } : {}
+      runId,
+      requestContext,
+      ...threadId ? { thread: threadId, resourceId: resourceId || agentId } : {},
+      tracingOptions
     });
     const transformer = new AISdkNetworkTransformer();
     await response.processDataStream({
       onChunk: async (chunk) => {
-        reactDom.flushSync(() => {
-          setMessages((prev) => transformer.transform({ chunk, conversation: prev, metadata: { mode: "network" } }));
-        });
+        setMessages((prev) => transformer.transform({ chunk, conversation: prev, metadata: { mode: "network" } }));
         onNetworkChunk?.(chunk);
       }
     });
     setIsRunning(false);
   };
+  const handleCancelRun = () => {
+    setIsRunning(false);
+    _currentRunId.current = void 0;
+    _onChunk.current = void 0;
+  };
+  const approveToolCall = async (toolCallId) => {
+    const onChunk = _onChunk.current;
+    const currentRunId = _currentRunId.current;
+    if (!currentRunId)
+      return console.info("[approveToolCall] approveToolCall can only be called after a stream has started");
+    setIsRunning(true);
+    setToolCallApprovals((prev) => ({ ...prev, [toolCallId]: { status: "approved" } }));
+    const agent = baseClient.getAgent(agentId);
+    const response = await agent.approveToolCall({ runId: currentRunId, toolCallId });
+    await response.processDataStream({
+      onChunk: async (chunk) => {
+        setMessages((prev) => toUIMessage({ chunk, conversation: prev, metadata: { mode: "stream" } }));
+        onChunk?.(chunk);
+      }
+    });
+    setIsRunning(false);
+  };
+  const declineToolCall = async (toolCallId) => {
+    const onChunk = _onChunk.current;
+    const currentRunId = _currentRunId.current;
+    if (!currentRunId)
+      return console.info("[declineToolCall] declineToolCall can only be called after a stream has started");
+    setIsRunning(true);
+    setToolCallApprovals((prev) => ({ ...prev, [toolCallId]: { status: "declined" } }));
+    const agent = baseClient.getAgent(agentId);
+    const response = await agent.declineToolCall({ runId: currentRunId, toolCallId });
+    await response.processDataStream({
+      onChunk: async (chunk) => {
+        setMessages((prev) => toUIMessage({ chunk, conversation: prev, metadata: { mode: "stream" } }));
+        onChunk?.(chunk);
+      }
+    });
+    setIsRunning(false);
+  };
   const sendMessage = async ({ mode = "stream", ...args }) => {
     const nextMessage = { role: "user", content: [{ type: "text", text: args.message }] };
-    const messages2 = args.coreUserMessages ? [nextMessage, ...args.coreUserMessages] : [nextMessage];
-    setMessages((s) => [...s, { role: "user", parts: [{ type: "text", text: args.message }] }]);
+    const coreUserMessages = [nextMessage];
+    if (args.coreUserMessages) {
+      coreUserMessages.push(...args.coreUserMessages);
+    }
+    const uiMessages = coreUserMessages.map(fromCoreUserMessageToUIMessage);
+    setMessages((s) => [...s, ...uiMessages]);
     if (mode === "generate") {
-      await generate({ ...args, coreUserMessages: messages2 });
+      await generate({ ...args, coreUserMessages });
     } else if (mode === "stream") {
-      await stream({ ...args, coreUserMessages: messages2 });
+      await stream({ ...args, coreUserMessages });
     } else if (mode === "network") {
-      await network({ ...args, coreUserMessages: messages2 });
+      await network({ ...args, coreUserMessages });
     }
   };
   return {
@@ -1111,7 +1583,10 @@ const useChat = ({ agentId, initializeMessages }) => {
     sendMessage,
     isRunning,
     messages,
-    cancelRun: () => setIsRunning(false)
+    approveToolCall,
+    declineToolCall,
+    cancelRun: handleCancelRun,
+    toolCallApprovals
   };
 };
 
@@ -1485,6 +1960,7 @@ exports.TooltipContentClass = TooltipContentClass;
 exports.TooltipTrigger = TooltipTrigger;
 exports.WorkflowIcon = WorkflowIcon;
 exports.mapWorkflowStreamChunkToWatchResult = mapWorkflowStreamChunkToWatchResult;
+exports.resolveToChildMessages = resolveToChildMessages;
 exports.toAssistantUIMessage = toAssistantUIMessage;
 exports.toUIMessage = toUIMessage;
 exports.useChat = useChat;