@ai-sdk/react 1.2.4 → 2.0.0-canary.0

package/dist/index.js

@@ -31,182 +31,14 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 var src_exports = {};
 __export(src_exports, {
   experimental_useObject: () => experimental_useObject,
-  useAssistant: () => useAssistant,
   useChat: () => useChat,
   useCompletion: () => useCompletion
 });
 module.exports = __toCommonJS(src_exports);
 
-// src/use-assistant.ts
-var import_provider_utils = require("@ai-sdk/provider-utils");
-var import_ui_utils = require("@ai-sdk/ui-utils");
-var import_react = require("react");
-var getOriginalFetch = () => fetch;
-function useAssistant({
-  api,
-  threadId: threadIdParam,
-  credentials,
-  headers,
-  body,
-  onError,
-  fetch: fetch2
-}) {
-  const [messages, setMessages] = (0, import_react.useState)([]);
-  const [input, setInput] = (0, import_react.useState)("");
-  const [currentThreadId, setCurrentThreadId] = (0, import_react.useState)(
-    void 0
-  );
-  const [status, setStatus] = (0, import_react.useState)("awaiting_message");
-  const [error, setError] = (0, import_react.useState)(void 0);
-  const handleInputChange = (event) => {
-    setInput(event.target.value);
-  };
-  const abortControllerRef = (0, import_react.useRef)(null);
-  const stop = (0, import_react.useCallback)(() => {
-    if (abortControllerRef.current) {
-      abortControllerRef.current.abort();
-      abortControllerRef.current = null;
-    }
-  }, []);
-  const append = async (message, requestOptions) => {
-    var _a, _b;
-    setStatus("in_progress");
-    setMessages((messages2) => {
-      var _a2;
-      return [
-        ...messages2,
-        {
-          ...message,
-          id: (_a2 = message.id) != null ? _a2 : (0, import_ui_utils.generateId)()
-        }
-      ];
-    });
-    setInput("");
-    const abortController = new AbortController();
-    try {
-      abortControllerRef.current = abortController;
-      const actualFetch = fetch2 != null ? fetch2 : getOriginalFetch();
-      const response = await actualFetch(api, {
-        method: "POST",
-        credentials,
-        signal: abortController.signal,
-        headers: { "Content-Type": "application/json", ...headers },
-        body: JSON.stringify({
-          ...body,
-          // always use user-provided threadId when available:
-          threadId: (_a = threadIdParam != null ? threadIdParam : currentThreadId) != null ? _a : null,
-          message: message.content,
-          // optional request data:
-          data: requestOptions == null ? void 0 : requestOptions.data
-        })
-      });
-      if (!response.ok) {
-        throw new Error(
-          (_b = await response.text()) != null ? _b : "Failed to fetch the assistant response."
-        );
-      }
-      if (response.body == null) {
-        throw new Error("The response body is empty.");
-      }
-      await (0, import_ui_utils.processAssistantStream)({
-        stream: response.body,
-        onAssistantMessagePart(value) {
-          setMessages((messages2) => [
-            ...messages2,
-            {
-              id: value.id,
-              role: value.role,
-              content: value.content[0].text.value,
-              parts: []
-            }
-          ]);
-        },
-        onTextPart(value) {
-          setMessages((messages2) => {
-            const lastMessage = messages2[messages2.length - 1];
-            return [
-              ...messages2.slice(0, messages2.length - 1),
-              {
-                id: lastMessage.id,
-                role: lastMessage.role,
-                content: lastMessage.content + value,
-                parts: lastMessage.parts
-              }
-            ];
-          });
-        },
-        onAssistantControlDataPart(value) {
-          setCurrentThreadId(value.threadId);
-          setMessages((messages2) => {
-            const lastMessage = messages2[messages2.length - 1];
-            lastMessage.id = value.messageId;
-            return [...messages2.slice(0, messages2.length - 1), lastMessage];
-          });
-        },
-        onDataMessagePart(value) {
-          setMessages((messages2) => {
-            var _a2;
-            return [
-              ...messages2,
-              {
-                id: (_a2 = value.id) != null ? _a2 : (0, import_ui_utils.generateId)(),
-                role: "data",
-                content: "",
-                data: value.data,
-                parts: []
-              }
-            ];
-          });
-        },
-        onErrorPart(value) {
-          setError(new Error(value));
-        }
-      });
-    } catch (error2) {
-      if ((0, import_provider_utils.isAbortError)(error2) && abortController.signal.aborted) {
-        abortControllerRef.current = null;
-        return;
-      }
-      if (onError && error2 instanceof Error) {
-        onError(error2);
-      }
-      setError(error2);
-    } finally {
-      abortControllerRef.current = null;
-      setStatus("awaiting_message");
-    }
-  };
-  const submitMessage = async (event, requestOptions) => {
-    var _a;
-    (_a = event == null ? void 0 : event.preventDefault) == null ? void 0 : _a.call(event);
-    if (input === "") {
-      return;
-    }
-    append({ role: "user", content: input, parts: [] }, requestOptions);
-  };
-  const setThreadId = (threadId) => {
-    setCurrentThreadId(threadId);
-    setMessages([]);
-  };
-  return {
-    append,
-    messages,
-    setMessages,
-    threadId: currentThreadId,
-    setThreadId,
-    input,
-    setInput,
-    handleInputChange,
-    submitMessage,
-    status,
-    error,
-    stop
-  };
-}
-
 // src/use-chat.ts
-var import_ui_utils3 = require("@ai-sdk/ui-utils");
-var import_react3 = require("react");
+var import_ui_utils2 = require("@ai-sdk/ui-utils");
+var import_react2 = require("react");
 var import_swr = __toESM(require("swr"));
 
 // src/throttle.ts
@@ -216,12 +48,12 @@ function throttle(fn, waitMs) {
 }
 
 // src/util/use-stable-value.ts
-var import_ui_utils2 = require("@ai-sdk/ui-utils");
-var import_react2 = require("react");
+var import_ui_utils = require("@ai-sdk/ui-utils");
+var import_react = require("react");
 function useStableValue(latestValue) {
-  const [value, setValue] = (0, import_react2.useState)(latestValue);
-  (0, import_react2.useEffect)(() => {
-    if (!(0, import_ui_utils2.isDeepEqualData)(latestValue, value)) {
+  const [value, setValue] = (0, import_react.useState)(latestValue);
+  (0, import_react.useEffect)(() => {
+    if (!(0, import_ui_utils.isDeepEqualData)(latestValue, value)) {
       setValue(latestValue);
     }
   }, [latestValue, value]);
@@ -245,17 +77,17 @@ function useChat({
   credentials,
   headers,
   body,
-  generateId: generateId2 = import_ui_utils3.generateId,
+  generateId = import_ui_utils2.generateId,
   fetch: fetch2,
   keepLastMessageOnError = true,
   experimental_throttle: throttleWaitMs
 } = {}) {
-  const [hookId] = (0, import_react3.useState)(generateId2);
+  const [hookId] = (0, import_react2.useState)(generateId);
   const chatId = id != null ? id : hookId;
   const chatKey = typeof api === "string" ? [api, chatId] : chatId;
   const stableInitialMessages = useStableValue(initialMessages != null ? initialMessages : []);
-  const processedInitialMessages = (0, import_react3.useMemo)(
-    () => (0, import_ui_utils3.fillMessageParts)(stableInitialMessages),
+  const processedInitialMessages = (0, import_react2.useMemo)(
+    () => (0, import_ui_utils2.fillMessageParts)(stableInitialMessages),
     [stableInitialMessages]
   );
   const { data: messages, mutate } = (0, import_swr.default)(
@@ -263,38 +95,38 @@ function useChat({
     null,
     { fallbackData: processedInitialMessages }
   );
-  const messagesRef = (0, import_react3.useRef)(messages || []);
-  (0, import_react3.useEffect)(() => {
+  const messagesRef = (0, import_react2.useRef)(messages || []);
+  (0, import_react2.useEffect)(() => {
     messagesRef.current = messages || [];
   }, [messages]);
   const { data: streamData, mutate: mutateStreamData } = (0, import_swr.default)([chatKey, "streamData"], null);
-  const streamDataRef = (0, import_react3.useRef)(streamData);
-  (0, import_react3.useEffect)(() => {
+  const streamDataRef = (0, import_react2.useRef)(streamData);
+  (0, import_react2.useEffect)(() => {
     streamDataRef.current = streamData;
   }, [streamData]);
   const { data: status = "ready", mutate: mutateStatus } = (0, import_swr.default)([chatKey, "status"], null);
   const { data: error = void 0, mutate: setError } = (0, import_swr.default)([chatKey, "error"], null);
-  const abortControllerRef = (0, import_react3.useRef)(null);
-  const extraMetadataRef = (0, import_react3.useRef)({
+  const abortControllerRef = (0, import_react2.useRef)(null);
+  const extraMetadataRef = (0, import_react2.useRef)({
     credentials,
     headers,
     body
   });
-  (0, import_react3.useEffect)(() => {
+  (0, import_react2.useEffect)(() => {
     extraMetadataRef.current = {
       credentials,
       headers,
       body
     };
   }, [credentials, headers, body]);
-  const triggerRequest = (0, import_react3.useCallback)(
+  const triggerRequest = (0, import_react2.useCallback)(
     async (chatRequest) => {
       var _a, _b;
       mutateStatus("submitted");
       setError(void 0);
-      const chatMessages = (0, import_ui_utils3.fillMessageParts)(chatRequest.messages);
+      const chatMessages = (0, import_ui_utils2.fillMessageParts)(chatRequest.messages);
       const messageCount = chatMessages.length;
-      const maxStep = (0, import_ui_utils3.extractMaxToolInvocationStep)(
+      const maxStep = (0, import_ui_utils2.extractMaxToolInvocationStep)(
         (_a = chatMessages[chatMessages.length - 1]) == null ? void 0 : _a.toolInvocations
       );
       try {
@@ -329,7 +161,7 @@ function useChat({
           })
         );
         const existingData = streamDataRef.current;
-        await (0, import_ui_utils3.callChatApi)({
+        await (0, import_ui_utils2.callChatApi)({
           api,
           body: (_b = experimental_prepareRequestBody == null ? void 0 : experimental_prepareRequestBody({
             id: chatId,
@@ -374,7 +206,7 @@ function useChat({
           },
           onToolCall,
           onFinish,
-          generateId: generateId2,
+          generateId,
           fetch: fetch2,
           lastMessage: chatMessages[chatMessages.length - 1]
         });
@@ -393,7 +225,7 @@ function useChat({
         mutateStatus("error");
       }
       const messages2 = messagesRef.current;
-      if ((0, import_ui_utils3.shouldResubmitMessages)({
+      if ((0, import_ui_utils2.shouldResubmitMessages)({
         originalMaxToolInvocationStep: maxStep,
         originalMessageCount: messageCount,
         maxSteps,
@@ -420,14 +252,14 @@ function useChat({
       maxSteps,
       messagesRef,
       abortControllerRef,
-      generateId2,
+      generateId,
       fetch2,
       keepLastMessageOnError,
       throttleWaitMs,
       chatId
     ]
   );
-  const append = (0, import_react3.useCallback)(
+  const append = (0, import_react2.useCallback)(
     async (message, {
       data,
       headers: headers2,
@@ -435,21 +267,21 @@ function useChat({
       experimental_attachments
     } = {}) => {
       var _a, _b;
-      const attachmentsForRequest = await (0, import_ui_utils3.prepareAttachmentsForRequest)(
+      const attachmentsForRequest = await (0, import_ui_utils2.prepareAttachmentsForRequest)(
         experimental_attachments
       );
       const messages2 = messagesRef.current.concat({
         ...message,
-        id: (_a = message.id) != null ? _a : generateId2(),
+        id: (_a = message.id) != null ? _a : generateId(),
         createdAt: (_b = message.createdAt) != null ? _b : /* @__PURE__ */ new Date(),
         experimental_attachments: attachmentsForRequest.length > 0 ? attachmentsForRequest : void 0,
-        parts: (0, import_ui_utils3.getMessageParts)(message)
+        parts: (0, import_ui_utils2.getMessageParts)(message)
       });
       return triggerRequest({ messages: messages2, headers: headers2, body: body2, data });
     },
-    [triggerRequest, generateId2]
+    [triggerRequest, generateId]
   );
-  const reload = (0, import_react3.useCallback)(
+  const reload = (0, import_react2.useCallback)(
     async ({ data, headers: headers2, body: body2 } = {}) => {
       const messages2 = messagesRef.current;
       if (messages2.length === 0) {
@@ -465,24 +297,24 @@ function useChat({
     },
     [triggerRequest]
   );
-  const stop = (0, import_react3.useCallback)(() => {
+  const stop = (0, import_react2.useCallback)(() => {
     if (abortControllerRef.current) {
       abortControllerRef.current.abort();
       abortControllerRef.current = null;
     }
   }, []);
-  const setMessages = (0, import_react3.useCallback)(
+  const setMessages = (0, import_react2.useCallback)(
     (messages2) => {
       if (typeof messages2 === "function") {
         messages2 = messages2(messagesRef.current);
       }
-      const messagesWithParts = (0, import_ui_utils3.fillMessageParts)(messages2);
+      const messagesWithParts = (0, import_ui_utils2.fillMessageParts)(messages2);
       mutate(messagesWithParts, false);
       messagesRef.current = messagesWithParts;
     },
     [mutate]
   );
-  const setData = (0, import_react3.useCallback)(
+  const setData = (0, import_react2.useCallback)(
     (data) => {
       if (typeof data === "function") {
         data = data(streamDataRef.current);
@@ -492,8 +324,8 @@ function useChat({
     },
     [mutateStreamData]
   );
-  const [input, setInput] = (0, import_react3.useState)(initialInput);
-  const handleSubmit = (0, import_react3.useCallback)(
+  const [input, setInput] = (0, import_react2.useState)(initialInput);
+  const handleSubmit = (0, import_react2.useCallback)(
     async (event, options = {}, metadata) => {
       var _a;
       (_a = event == null ? void 0 : event.preventDefault) == null ? void 0 : _a.call(event);
@@ -505,11 +337,11 @@ function useChat({
           ...metadata
         };
       }
-      const attachmentsForRequest = await (0, import_ui_utils3.prepareAttachmentsForRequest)(
+      const attachmentsForRequest = await (0, import_ui_utils2.prepareAttachmentsForRequest)(
         options.experimental_attachments
       );
       const messages2 = messagesRef.current.concat({
-        id: generateId2(),
+        id: generateId(),
         createdAt: /* @__PURE__ */ new Date(),
         role: "user",
         content: input,
@@ -525,26 +357,35 @@ function useChat({
       triggerRequest(chatRequest);
       setInput("");
     },
-    [input, generateId2, triggerRequest]
+    [input, generateId, triggerRequest]
   );
   const handleInputChange = (e) => {
     setInput(e.target.value);
   };
-  const addToolResult = (0, import_react3.useCallback)(
+  const addToolResult = (0, import_react2.useCallback)(
     ({ toolCallId, result }) => {
       const currentMessages = messagesRef.current;
-      (0, import_ui_utils3.updateToolCallResult)({
+      (0, import_ui_utils2.updateToolCallResult)({
         messages: currentMessages,
         toolCallId,
         toolResult: result
       });
-      mutate(currentMessages, false);
+      mutate(
+        [
+          ...currentMessages.slice(0, currentMessages.length - 1),
+          { ...currentMessages[currentMessages.length - 1] }
+        ],
+        false
+      );
+      if (status === "submitted" || status === "streaming") {
+        return;
+      }
       const lastMessage = currentMessages[currentMessages.length - 1];
-      if ((0, import_ui_utils3.isAssistantMessageWithCompletedToolCalls)(lastMessage)) {
+      if ((0, import_ui_utils2.isAssistantMessageWithCompletedToolCalls)(lastMessage)) {
         triggerRequest({ messages: currentMessages });
       }
     },
-    [mutate, triggerRequest]
+    [mutate, status, triggerRequest]
   );
   return {
     messages: messages != null ? messages : [],
@@ -567,8 +408,8 @@ function useChat({
 }
 
 // src/use-completion.ts
-var import_ui_utils4 = require("@ai-sdk/ui-utils");
-var import_react4 = require("react");
+var import_ui_utils3 = require("@ai-sdk/ui-utils");
+var import_react3 = require("react");
 var import_swr2 = __toESM(require("swr"));
 function useCompletion({
   api = "/api/completion",
@@ -585,7 +426,7 @@ function useCompletion({
   onError,
   experimental_throttle: throttleWaitMs
 } = {}) {
-  const hookId = (0, import_react4.useId)();
+  const hookId = (0, import_react3.useId)();
   const completionId = id || hookId;
   const { data, mutate } = (0, import_swr2.default)([api, completionId], null, {
     fallbackData: initialCompletion
@@ -595,23 +436,23 @@ function useCompletion({
     null
   );
   const { data: streamData, mutate: mutateStreamData } = (0, import_swr2.default)([completionId, "streamData"], null);
-  const [error, setError] = (0, import_react4.useState)(void 0);
+  const [error, setError] = (0, import_react3.useState)(void 0);
   const completion = data;
-  const [abortController, setAbortController] = (0, import_react4.useState)(null);
-  const extraMetadataRef = (0, import_react4.useRef)({
+  const [abortController, setAbortController] = (0, import_react3.useState)(null);
+  const extraMetadataRef = (0, import_react3.useRef)({
     credentials,
     headers,
     body
   });
-  (0, import_react4.useEffect)(() => {
+  (0, import_react3.useEffect)(() => {
     extraMetadataRef.current = {
       credentials,
       headers,
       body
     };
   }, [credentials, headers, body]);
-  const triggerRequest = (0, import_react4.useCallback)(
-    async (prompt, options) => (0, import_ui_utils4.callCompletionApi)({
+  const triggerRequest = (0, import_react3.useCallback)(
+    async (prompt, options) => (0, import_ui_utils3.callCompletionApi)({
       api,
       prompt,
       credentials: extraMetadataRef.current.credentials,
@@ -655,26 +496,26 @@ function useCompletion({
       throttleWaitMs
     ]
   );
-  const stop = (0, import_react4.useCallback)(() => {
+  const stop = (0, import_react3.useCallback)(() => {
     if (abortController) {
       abortController.abort();
       setAbortController(null);
     }
   }, [abortController]);
-  const setCompletion = (0, import_react4.useCallback)(
+  const setCompletion = (0, import_react3.useCallback)(
     (completion2) => {
       mutate(completion2, false);
     },
     [mutate]
   );
-  const complete = (0, import_react4.useCallback)(
+  const complete = (0, import_react3.useCallback)(
     async (prompt, options) => {
       return triggerRequest(prompt, options);
     },
     [triggerRequest]
   );
-  const [input, setInput] = (0, import_react4.useState)(initialInput);
-  const handleSubmit = (0, import_react4.useCallback)(
+  const [input, setInput] = (0, import_react3.useState)(initialInput);
+  const handleSubmit = (0, import_react3.useCallback)(
     (event) => {
       var _a;
       (_a = event == null ? void 0 : event.preventDefault) == null ? void 0 : _a.call(event);
@@ -682,7 +523,7 @@ function useCompletion({
     },
     [input, complete]
   );
-  const handleInputChange = (0, import_react4.useCallback)(
+  const handleInputChange = (0, import_react3.useCallback)(
     (e) => {
       setInput(e.target.value);
     },
@@ -704,11 +545,11 @@ function useCompletion({
 }
 
 // src/use-object.ts
-var import_provider_utils2 = require("@ai-sdk/provider-utils");
-var import_ui_utils5 = require("@ai-sdk/ui-utils");
-var import_react5 = require("react");
+var import_provider_utils = require("@ai-sdk/provider-utils");
+var import_ui_utils4 = require("@ai-sdk/ui-utils");
+var import_react4 = require("react");
 var import_swr3 = __toESM(require("swr"));
-var getOriginalFetch2 = () => fetch;
+var getOriginalFetch = () => fetch;
 function useObject({
   api,
   id,
@@ -721,17 +562,17 @@ function useObject({
   headers,
   credentials
 }) {
-  const hookId = (0, import_react5.useId)();
+  const hookId = (0, import_react4.useId)();
   const completionId = id != null ? id : hookId;
   const { data, mutate } = (0, import_swr3.default)(
     [api, completionId],
     null,
     { fallbackData: initialValue }
   );
-  const [error, setError] = (0, import_react5.useState)(void 0);
-  const [isLoading, setIsLoading] = (0, import_react5.useState)(false);
-  const abortControllerRef = (0, import_react5.useRef)(null);
-  const stop = (0, import_react5.useCallback)(() => {
+  const [error, setError] = (0, import_react4.useState)(void 0);
+  const [isLoading, setIsLoading] = (0, import_react4.useState)(false);
+  const abortControllerRef = (0, import_react4.useRef)(null);
+  const stop = (0, import_react4.useCallback)(() => {
     var _a;
     try {
       (_a = abortControllerRef.current) == null ? void 0 : _a.abort();
@@ -749,7 +590,7 @@ function useObject({
       setError(void 0);
       const abortController = new AbortController();
       abortControllerRef.current = abortController;
-      const actualFetch = fetch2 != null ? fetch2 : getOriginalFetch2();
+      const actualFetch = fetch2 != null ? fetch2 : getOriginalFetch();
       const response = await actualFetch(api, {
         method: "POST",
         headers: {
@@ -774,9 +615,9 @@ function useObject({
         new WritableStream({
           write(chunk) {
             accumulatedText += chunk;
-            const { value } = (0, import_ui_utils5.parsePartialJson)(accumulatedText);
+            const { value } = (0, import_ui_utils4.parsePartialJson)(accumulatedText);
             const currentObject = value;
-            if (!(0, import_ui_utils5.isDeepEqualData)(latestObject, currentObject)) {
+            if (!(0, import_ui_utils4.isDeepEqualData)(latestObject, currentObject)) {
               latestObject = currentObject;
               mutate(currentObject);
             }
@@ -785,9 +626,9 @@ function useObject({
             setIsLoading(false);
             abortControllerRef.current = null;
             if (onFinish != null) {
-              const validationResult = (0, import_provider_utils2.safeValidateTypes)({
+              const validationResult = (0, import_provider_utils.safeValidateTypes)({
                 value: latestObject,
-                schema: (0, import_ui_utils5.asSchema)(schema)
+                schema: (0, import_ui_utils4.asSchema)(schema)
               });
               onFinish(
                 validationResult.success ? { object: validationResult.value, error: void 0 } : { object: void 0, error: validationResult.error }
@@ -797,7 +638,7 @@ function useObject({
         })
       );
     } catch (error2) {
-      if ((0, import_provider_utils2.isAbortError)(error2)) {
+      if ((0, import_provider_utils.isAbortError)(error2)) {
         return;
       }
       if (onError && error2 instanceof Error) {
@@ -819,7 +660,6 @@ var experimental_useObject = useObject;
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   experimental_useObject,
-  useAssistant,
   useChat,
   useCompletion
 });