@ai-sdk/react 0.0.3 → 0.0.4

package/dist/index.mjs

@@ -1,10 +1,171 @@
+// src/use-assistant.ts
+import { isAbortError } from "@ai-sdk/provider-utils";
+import {
+  generateId,
+  readDataStream
+} from "@ai-sdk/ui-utils";
+import { useCallback, useRef, useState } from "react";
+function useAssistant({
+  api,
+  threadId: threadIdParam,
+  credentials,
+  headers,
+  body,
+  onError
+}) {
+  const [messages, setMessages] = useState([]);
+  const [input, setInput] = useState("");
+  const [threadId, setThreadId] = useState(void 0);
+  const [status, setStatus] = useState("awaiting_message");
+  const [error, setError] = useState(void 0);
+  const handleInputChange = (event) => {
+    setInput(event.target.value);
+  };
+  const abortControllerRef = useRef(null);
+  const stop = useCallback(() => {
+    if (abortControllerRef.current) {
+      abortControllerRef.current.abort();
+      abortControllerRef.current = null;
+    }
+  }, []);
+  const append = async (message, requestOptions) => {
+    var _a;
+    setStatus("in_progress");
+    setMessages((messages2) => {
+      var _a2;
+      return [
+        ...messages2,
+        {
+          ...message,
+          id: (_a2 = message.id) != null ? _a2 : generateId()
+        }
+      ];
+    });
+    setInput("");
+    const abortController = new AbortController();
+    try {
+      abortControllerRef.current = abortController;
+      const result = await fetch(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 : threadId) != null ? _a : null,
+          message: message.content,
+          // optional request data:
+          data: requestOptions == null ? void 0 : requestOptions.data
+        })
+      });
+      if (result.body == null) {
+        throw new Error("The response body is empty.");
+      }
+      for await (const { type, value } of readDataStream(
+        result.body.getReader()
+      )) {
+        switch (type) {
+          case "assistant_message": {
+            setMessages((messages2) => [
+              ...messages2,
+              {
+                id: value.id,
+                role: value.role,
+                content: value.content[0].text.value
+              }
+            ]);
+            break;
+          }
+          case "text": {
+            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
+                }
+              ];
+            });
+            break;
+          }
+          case "data_message": {
+            setMessages((messages2) => {
+              var _a2;
+              return [
+                ...messages2,
+                {
+                  id: (_a2 = value.id) != null ? _a2 : generateId(),
+                  role: "data",
+                  content: "",
+                  data: value.data
+                }
+              ];
+            });
+            break;
+          }
+          case "assistant_control_data": {
+            setThreadId(value.threadId);
+            setMessages((messages2) => {
+              const lastMessage = messages2[messages2.length - 1];
+              lastMessage.id = value.messageId;
+              return [...messages2.slice(0, messages2.length - 1), lastMessage];
+            });
+            break;
+          }
+          case "error": {
+            setError(new Error(value));
+            break;
+          }
+        }
+      }
+    } catch (error2) {
+      if (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 }, requestOptions);
+  };
+  return {
+    append,
+    messages,
+    setMessages,
+    threadId,
+    input,
+    setInput,
+    handleInputChange,
+    submitMessage,
+    status,
+    error,
+    stop
+  };
+}
+var experimental_useAssistant = useAssistant;
+
 // src/use-chat.ts
 import {
   callChatApi,
   generateId as generateIdFunc,
   processChatStream
 } from "@ai-sdk/ui-utils";
-import { useCallback, useEffect, useId, useRef, useState } from "react";
+import { useCallback as useCallback2, useEffect, useId, useRef as useRef2, useState as useState2 } from "react";
 import useSWR from "swr";
 var getStreamedResponse = async (api, chatRequest, mutate, mutateStreamData, existingData, extraMetadataRef, messagesRef, abortControllerRef, generateId2, streamMode, onFinish, onResponse, onToolCall, sendExtraMessageFields) => {
   var _a, _b;
@@ -98,7 +259,7 @@ function useChat({
   const hookId = useId();
   const idKey = id != null ? id : hookId;
   const chatKey = typeof api === "string" ? [api, idKey] : idKey;
-  const [initialMessagesFallback] = useState([]);
+  const [initialMessagesFallback] = useState2([]);
   const { data: messages, mutate } = useSWR(
     [chatKey, "messages"],
     null,
@@ -110,12 +271,12 @@ function useChat({
   );
   const { data: streamData, mutate: mutateStreamData } = useSWR([chatKey, "streamData"], null);
   const { data: error = void 0, mutate: setError } = useSWR([chatKey, "error"], null);
-  const messagesRef = useRef(messages || []);
+  const messagesRef = useRef2(messages || []);
   useEffect(() => {
     messagesRef.current = messages || [];
   }, [messages]);
-  const abortControllerRef = useRef(null);
-  const extraMetadataRef = useRef({
+  const abortControllerRef = useRef2(null);
+  const extraMetadataRef = useRef2({
     credentials,
     headers,
     body
@@ -127,7 +288,7 @@ function useChat({
       body
     };
   }, [credentials, headers, body]);
-  const triggerRequest = useCallback(
+  const triggerRequest = useCallback2(
     async (chatRequest) => {
       try {
         mutateLoading(true);
@@ -205,7 +366,7 @@ function useChat({
       generateId2
     ]
   );
-  const append = useCallback(
+  const append = useCallback2(
     async (message, {
       options,
       functions,
@@ -230,7 +391,7 @@ function useChat({
     },
     [triggerRequest, generateId2]
   );
-  const reload = useCallback(
+  const reload = useCallback2(
     async ({
       options,
       functions,
@@ -264,21 +425,21 @@ function useChat({
     },
     [triggerRequest]
   );
-  const stop = useCallback(() => {
+  const stop = useCallback2(() => {
     if (abortControllerRef.current) {
       abortControllerRef.current.abort();
       abortControllerRef.current = null;
     }
   }, []);
-  const setMessages = useCallback(
+  const setMessages = useCallback2(
     (messages2) => {
       mutate(messages2, false);
       messagesRef.current = messages2;
     },
     [mutate]
   );
-  const [input, setInput] = useState(initialInput);
-  const handleSubmit = useCallback(
+  const [input, setInput] = useState2(initialInput);
+  const handleSubmit = useCallback2(
     (e, options = {}, metadata) => {
       if (metadata) {
         extraMetadataRef.current = {
@@ -361,7 +522,7 @@ function countTrailingAssistantMessages(messages) {
 import {
   callCompletionApi
 } from "@ai-sdk/ui-utils";
-import { useCallback as useCallback2, useEffect as useEffect2, useId as useId2, useRef as useRef2, useState as useState2 } from "react";
+import { useCallback as useCallback3, useEffect as useEffect2, useId as useId2, useRef as useRef3, useState as useState3 } from "react";
 import useSWR2 from "swr";
 function useCompletion({
   api = "/api/completion",
@@ -386,10 +547,10 @@ function useCompletion({
     null
   );
   const { data: streamData, mutate: mutateStreamData } = useSWR2([completionId, "streamData"], null);
-  const [error, setError] = useState2(void 0);
+  const [error, setError] = useState3(void 0);
   const completion = data;
-  const [abortController, setAbortController] = useState2(null);
-  const extraMetadataRef = useRef2({
+  const [abortController, setAbortController] = useState3(null);
+  const extraMetadataRef = useRef3({
     credentials,
     headers,
     body
@@ -401,7 +562,7 @@ function useCompletion({
       body
     };
   }, [credentials, headers, body]);
-  const triggerRequest = useCallback2(
+  const triggerRequest = useCallback3(
     async (prompt, options) => callCompletionApi({
       api,
       prompt,
@@ -438,26 +599,26 @@ function useCompletion({
       mutateStreamData
     ]
   );
-  const stop = useCallback2(() => {
+  const stop = useCallback3(() => {
     if (abortController) {
       abortController.abort();
       setAbortController(null);
     }
   }, [abortController]);
-  const setCompletion = useCallback2(
+  const setCompletion = useCallback3(
     (completion2) => {
       mutate(completion2, false);
     },
     [mutate]
   );
-  const complete = useCallback2(
+  const complete = useCallback3(
     async (prompt, options) => {
       return triggerRequest(prompt, options);
     },
     [triggerRequest]
   );
-  const [input, setInput] = useState2(initialInput);
-  const handleSubmit = useCallback2(
+  const [input, setInput] = useState3(initialInput);
+  const handleSubmit = useCallback3(
     (e) => {
       e.preventDefault();
       if (!input)
@@ -484,168 +645,74 @@ function useCompletion({
   };
 }
 
-// src/use-assistant.ts
-import { isAbortError } from "@ai-sdk/provider-utils";
+// src/use-object.ts
 import {
-  generateId,
-  readDataStream
+  isDeepEqualData,
+  parsePartialJson
 } from "@ai-sdk/ui-utils";
-import { useCallback as useCallback3, useRef as useRef3, useState as useState3 } from "react";
-function useAssistant({
+import { useId as useId3, useState as useState4 } from "react";
+import useSWR3 from "swr";
+function useObject({
   api,
-  threadId: threadIdParam,
-  credentials,
-  headers,
-  body,
-  onError
+  id,
+  schema,
+  // required, in the future we will use it for validation
+  initialValue
 }) {
-  const [messages, setMessages] = useState3([]);
-  const [input, setInput] = useState3("");
-  const [threadId, setThreadId] = useState3(void 0);
-  const [status, setStatus] = useState3("awaiting_message");
-  const [error, setError] = useState3(void 0);
-  const handleInputChange = (event) => {
-    setInput(event.target.value);
-  };
-  const abortControllerRef = useRef3(null);
-  const stop = useCallback3(() => {
-    if (abortControllerRef.current) {
-      abortControllerRef.current.abort();
-      abortControllerRef.current = null;
-    }
-  }, []);
-  const append = async (message, requestOptions) => {
-    var _a;
-    setStatus("in_progress");
-    setMessages((messages2) => {
-      var _a2;
-      return [
-        ...messages2,
-        {
-          ...message,
-          id: (_a2 = message.id) != null ? _a2 : generateId()
+  const hookId = useId3();
+  const completionId = id != null ? id : hookId;
+  const { data, mutate } = useSWR3(
+    [api, completionId],
+    null,
+    { fallbackData: initialValue }
+  );
+  const [error, setError] = useState4(void 0);
+  return {
+    async setInput(input) {
+      var _a;
+      try {
+        const response = await fetch(api, {
+          method: "POST",
+          headers: { "Content-Type": "application/json" },
+          body: JSON.stringify(input)
+        });
+        if (!response.ok) {
+          throw new Error(
+            (_a = await response.text()) != null ? _a : "Failed to fetch the response."
+          );
         }
-      ];
-    });
-    setInput("");
-    const abortController = new AbortController();
-    try {
-      abortControllerRef.current = abortController;
-      const result = await fetch(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 : threadId) != null ? _a : null,
-          message: message.content,
-          // optional request data:
-          data: requestOptions == null ? void 0 : requestOptions.data
-        })
-      });
-      if (result.body == null) {
-        throw new Error("The response body is empty.");
-      }
-      for await (const { type, value } of readDataStream(
-        result.body.getReader()
-      )) {
-        switch (type) {
-          case "assistant_message": {
-            setMessages((messages2) => [
-              ...messages2,
-              {
-                id: value.id,
-                role: value.role,
-                content: value.content[0].text.value
-              }
-            ]);
-            break;
-          }
-          case "text": {
-            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
-                }
-              ];
-            });
-            break;
-          }
-          case "data_message": {
-            setMessages((messages2) => {
-              var _a2;
-              return [
-                ...messages2,
-                {
-                  id: (_a2 = value.id) != null ? _a2 : generateId(),
-                  role: "data",
-                  content: "",
-                  data: value.data
-                }
-              ];
-            });
-            break;
-          }
-          case "assistant_control_data": {
-            setThreadId(value.threadId);
-            setMessages((messages2) => {
-              const lastMessage = messages2[messages2.length - 1];
-              lastMessage.id = value.messageId;
-              return [...messages2.slice(0, messages2.length - 1), lastMessage];
-            });
-            break;
-          }
-          case "error": {
-            setError(new Error(value));
-            break;
-          }
+        if (response.body == null) {
+          throw new Error("The response body is empty.");
         }
+        let accumulatedText = "";
+        let latestObject = void 0;
+        response.body.pipeThrough(new TextDecoderStream()).pipeTo(
+          new WritableStream({
+            write(chunk) {
+              accumulatedText += chunk;
+              const currentObject = parsePartialJson(
+                accumulatedText
+              );
+              if (!isDeepEqualData(latestObject, currentObject)) {
+                latestObject = currentObject;
+                mutate(currentObject);
+              }
+            }
+          })
+        );
+        setError(void 0);
+      } catch (error2) {
+        setError(error2);
       }
-    } catch (error2) {
-      if (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 }, requestOptions);
-  };
-  return {
-    append,
-    messages,
-    setMessages,
-    threadId,
-    input,
-    setInput,
-    handleInputChange,
-    submitMessage,
-    status,
-    error,
-    stop
+    },
+    object: data,
+    error
   };
 }
-var experimental_useAssistant = useAssistant;
+var experimental_useObject = useObject;
 export {
   experimental_useAssistant,
+  experimental_useObject,
   useAssistant,
   useChat,
   useCompletion