@ai-sdk/react 0.0.1

package/dist/index.mjs

@@ -0,0 +1,653 @@
+// src/use-chat.ts
+import {
+  callChatApi,
+  generateId as generateIdFunc,
+  processChatStream
+} from "@ai-sdk/ui-utils";
+import { useCallback, useEffect, useId, useRef, useState } 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;
+  const previousMessages = messagesRef.current;
+  mutate(chatRequest.messages, false);
+  const constructedMessagesPayload = sendExtraMessageFields ? chatRequest.messages : chatRequest.messages.map(
+    ({
+      role,
+      content,
+      name,
+      data,
+      annotations,
+      toolInvocations,
+      function_call,
+      tool_calls,
+      tool_call_id
+    }) => ({
+      role,
+      content,
+      ...name !== void 0 && { name },
+      ...data !== void 0 && { data },
+      ...annotations !== void 0 && { annotations },
+      ...toolInvocations !== void 0 && { toolInvocations },
+      // outdated function/tool call handling (TODO deprecate):
+      tool_call_id,
+      ...function_call !== void 0 && { function_call },
+      ...tool_calls !== void 0 && { tool_calls }
+    })
+  );
+  return await callChatApi({
+    api,
+    messages: constructedMessagesPayload,
+    body: {
+      data: chatRequest.data,
+      ...extraMetadataRef.current.body,
+      ...(_a = chatRequest.options) == null ? void 0 : _a.body,
+      ...chatRequest.functions !== void 0 && {
+        functions: chatRequest.functions
+      },
+      ...chatRequest.function_call !== void 0 && {
+        function_call: chatRequest.function_call
+      },
+      ...chatRequest.tools !== void 0 && {
+        tools: chatRequest.tools
+      },
+      ...chatRequest.tool_choice !== void 0 && {
+        tool_choice: chatRequest.tool_choice
+      }
+    },
+    streamMode,
+    credentials: extraMetadataRef.current.credentials,
+    headers: {
+      ...extraMetadataRef.current.headers,
+      ...(_b = chatRequest.options) == null ? void 0 : _b.headers
+    },
+    abortController: () => abortControllerRef.current,
+    restoreMessagesOnFailure() {
+      mutate(previousMessages, false);
+    },
+    onResponse,
+    onUpdate(merged, data) {
+      mutate([...chatRequest.messages, ...merged], false);
+      mutateStreamData([...existingData || [], ...data || []], false);
+    },
+    onToolCall,
+    onFinish,
+    generateId: generateId2
+  });
+};
+function useChat({
+  api = "/api/chat",
+  id,
+  initialMessages,
+  initialInput = "",
+  sendExtraMessageFields,
+  experimental_onFunctionCall,
+  experimental_onToolCall,
+  onToolCall,
+  experimental_maxAutomaticRoundtrips = 0,
+  maxAutomaticRoundtrips = experimental_maxAutomaticRoundtrips,
+  maxToolRoundtrips = maxAutomaticRoundtrips,
+  streamMode,
+  onResponse,
+  onFinish,
+  onError,
+  credentials,
+  headers,
+  body,
+  generateId: generateId2 = generateIdFunc
+} = {}) {
+  const hookId = useId();
+  const idKey = id != null ? id : hookId;
+  const chatKey = typeof api === "string" ? [api, idKey] : idKey;
+  const [initialMessagesFallback] = useState([]);
+  const { data: messages, mutate } = useSWR(
+    [chatKey, "messages"],
+    null,
+    { fallbackData: initialMessages != null ? initialMessages : initialMessagesFallback }
+  );
+  const { data: isLoading = false, mutate: mutateLoading } = useSWR(
+    [chatKey, "loading"],
+    null
+  );
+  const { data: streamData, mutate: mutateStreamData } = useSWR([chatKey, "streamData"], null);
+  const { data: error = void 0, mutate: setError } = useSWR([chatKey, "error"], null);
+  const messagesRef = useRef(messages || []);
+  useEffect(() => {
+    messagesRef.current = messages || [];
+  }, [messages]);
+  const abortControllerRef = useRef(null);
+  const extraMetadataRef = useRef({
+    credentials,
+    headers,
+    body
+  });
+  useEffect(() => {
+    extraMetadataRef.current = {
+      credentials,
+      headers,
+      body
+    };
+  }, [credentials, headers, body]);
+  const triggerRequest = useCallback(
+    async (chatRequest) => {
+      try {
+        mutateLoading(true);
+        setError(void 0);
+        const abortController = new AbortController();
+        abortControllerRef.current = abortController;
+        await processChatStream({
+          getStreamedResponse: () => getStreamedResponse(
+            api,
+            chatRequest,
+            mutate,
+            mutateStreamData,
+            streamData,
+            extraMetadataRef,
+            messagesRef,
+            abortControllerRef,
+            generateId2,
+            streamMode,
+            onFinish,
+            onResponse,
+            onToolCall,
+            sendExtraMessageFields
+          ),
+          experimental_onFunctionCall,
+          experimental_onToolCall,
+          updateChatRequest: (chatRequestParam) => {
+            chatRequest = chatRequestParam;
+          },
+          getCurrentMessages: () => messagesRef.current
+        });
+        abortControllerRef.current = null;
+      } catch (err) {
+        if (err.name === "AbortError") {
+          abortControllerRef.current = null;
+          return null;
+        }
+        if (onError && err instanceof Error) {
+          onError(err);
+        }
+        setError(err);
+      } finally {
+        mutateLoading(false);
+      }
+      const messages2 = messagesRef.current;
+      const lastMessage = messages2[messages2.length - 1];
+      if (
+        // ensure there is a last message:
+        lastMessage != null && // check if the feature is enabled:
+        maxToolRoundtrips > 0 && // check that roundtrip is possible:
+        isAssistantMessageWithCompletedToolCalls(lastMessage) && // limit the number of automatic roundtrips:
+        countTrailingAssistantMessages(messages2) <= maxToolRoundtrips
+      ) {
+        await triggerRequest({ messages: messages2 });
+      }
+    },
+    [
+      mutate,
+      mutateLoading,
+      api,
+      extraMetadataRef,
+      onResponse,
+      onFinish,
+      onError,
+      setError,
+      mutateStreamData,
+      streamData,
+      streamMode,
+      sendExtraMessageFields,
+      experimental_onFunctionCall,
+      experimental_onToolCall,
+      onToolCall,
+      maxToolRoundtrips,
+      messagesRef,
+      abortControllerRef,
+      generateId2
+    ]
+  );
+  const append = useCallback(
+    async (message, {
+      options,
+      functions,
+      function_call,
+      tools,
+      tool_choice,
+      data
+    } = {}) => {
+      if (!message.id) {
+        message.id = generateId2();
+      }
+      const chatRequest = {
+        messages: messagesRef.current.concat(message),
+        options,
+        data,
+        ...functions !== void 0 && { functions },
+        ...function_call !== void 0 && { function_call },
+        ...tools !== void 0 && { tools },
+        ...tool_choice !== void 0 && { tool_choice }
+      };
+      return triggerRequest(chatRequest);
+    },
+    [triggerRequest, generateId2]
+  );
+  const reload = useCallback(
+    async ({
+      options,
+      functions,
+      function_call,
+      tools,
+      tool_choice
+    } = {}) => {
+      if (messagesRef.current.length === 0)
+        return null;
+      const lastMessage = messagesRef.current[messagesRef.current.length - 1];
+      if (lastMessage.role === "assistant") {
+        const chatRequest2 = {
+          messages: messagesRef.current.slice(0, -1),
+          options,
+          ...functions !== void 0 && { functions },
+          ...function_call !== void 0 && { function_call },
+          ...tools !== void 0 && { tools },
+          ...tool_choice !== void 0 && { tool_choice }
+        };
+        return triggerRequest(chatRequest2);
+      }
+      const chatRequest = {
+        messages: messagesRef.current,
+        options,
+        ...functions !== void 0 && { functions },
+        ...function_call !== void 0 && { function_call },
+        ...tools !== void 0 && { tools },
+        ...tool_choice !== void 0 && { tool_choice }
+      };
+      return triggerRequest(chatRequest);
+    },
+    [triggerRequest]
+  );
+  const stop = useCallback(() => {
+    if (abortControllerRef.current) {
+      abortControllerRef.current.abort();
+      abortControllerRef.current = null;
+    }
+  }, []);
+  const setMessages = useCallback(
+    (messages2) => {
+      mutate(messages2, false);
+      messagesRef.current = messages2;
+    },
+    [mutate]
+  );
+  const [input, setInput] = useState(initialInput);
+  const handleSubmit = useCallback(
+    (e, options = {}, metadata) => {
+      if (metadata) {
+        extraMetadataRef.current = {
+          ...extraMetadataRef.current,
+          ...metadata
+        };
+      }
+      e.preventDefault();
+      if (!input)
+        return;
+      append(
+        {
+          content: input,
+          role: "user",
+          createdAt: /* @__PURE__ */ new Date()
+        },
+        options
+      );
+      setInput("");
+    },
+    [input, append]
+  );
+  const handleInputChange = (e) => {
+    setInput(e.target.value);
+  };
+  const addToolResult = ({
+    toolCallId,
+    result
+  }) => {
+    const updatedMessages = messagesRef.current.map(
+      (message, index, arr) => (
+        // update the tool calls in the last assistant message:
+        index === arr.length - 1 && message.role === "assistant" && message.toolInvocations ? {
+          ...message,
+          toolInvocations: message.toolInvocations.map(
+            (toolInvocation) => toolInvocation.toolCallId === toolCallId ? { ...toolInvocation, result } : toolInvocation
+          )
+        } : message
+      )
+    );
+    mutate(updatedMessages, false);
+    const lastMessage = updatedMessages[updatedMessages.length - 1];
+    if (isAssistantMessageWithCompletedToolCalls(lastMessage)) {
+      triggerRequest({ messages: updatedMessages });
+    }
+  };
+  return {
+    messages: messages || [],
+    error,
+    append,
+    reload,
+    stop,
+    setMessages,
+    input,
+    setInput,
+    handleInputChange,
+    handleSubmit,
+    isLoading,
+    data: streamData,
+    addToolResult,
+    experimental_addToolResult: addToolResult
+  };
+}
+function isAssistantMessageWithCompletedToolCalls(message) {
+  return message.role === "assistant" && message.toolInvocations && message.toolInvocations.length > 0 && message.toolInvocations.every((toolInvocation) => "result" in toolInvocation);
+}
+function countTrailingAssistantMessages(messages) {
+  let count = 0;
+  for (let i = messages.length - 1; i >= 0; i--) {
+    if (messages[i].role === "assistant") {
+      count++;
+    } else {
+      break;
+    }
+  }
+  return count;
+}
+
+// src/use-completion.ts
+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 useSWR2 from "swr";
+function useCompletion({
+  api = "/api/completion",
+  id,
+  initialCompletion = "",
+  initialInput = "",
+  credentials,
+  headers,
+  body,
+  streamMode,
+  onResponse,
+  onFinish,
+  onError
+} = {}) {
+  const hookId = useId2();
+  const completionId = id || hookId;
+  const { data, mutate } = useSWR2([api, completionId], null, {
+    fallbackData: initialCompletion
+  });
+  const { data: isLoading = false, mutate: mutateLoading } = useSWR2(
+    [completionId, "loading"],
+    null
+  );
+  const { data: streamData, mutate: mutateStreamData } = useSWR2([completionId, "streamData"], null);
+  const [error, setError] = useState2(void 0);
+  const completion = data;
+  const [abortController, setAbortController] = useState2(null);
+  const extraMetadataRef = useRef2({
+    credentials,
+    headers,
+    body
+  });
+  useEffect2(() => {
+    extraMetadataRef.current = {
+      credentials,
+      headers,
+      body
+    };
+  }, [credentials, headers, body]);
+  const triggerRequest = useCallback2(
+    async (prompt, options) => callCompletionApi({
+      api,
+      prompt,
+      credentials: extraMetadataRef.current.credentials,
+      headers: { ...extraMetadataRef.current.headers, ...options == null ? void 0 : options.headers },
+      body: {
+        ...extraMetadataRef.current.body,
+        ...options == null ? void 0 : options.body
+      },
+      streamMode,
+      setCompletion: (completion2) => mutate(completion2, false),
+      setLoading: mutateLoading,
+      setError,
+      setAbortController,
+      onResponse,
+      onFinish,
+      onError,
+      onData: (data2) => {
+        mutateStreamData([...streamData || [], ...data2 || []], false);
+      }
+    }),
+    [
+      mutate,
+      mutateLoading,
+      api,
+      extraMetadataRef,
+      setAbortController,
+      onResponse,
+      onFinish,
+      onError,
+      setError,
+      streamData,
+      streamMode,
+      mutateStreamData
+    ]
+  );
+  const stop = useCallback2(() => {
+    if (abortController) {
+      abortController.abort();
+      setAbortController(null);
+    }
+  }, [abortController]);
+  const setCompletion = useCallback2(
+    (completion2) => {
+      mutate(completion2, false);
+    },
+    [mutate]
+  );
+  const complete = useCallback2(
+    async (prompt, options) => {
+      return triggerRequest(prompt, options);
+    },
+    [triggerRequest]
+  );
+  const [input, setInput] = useState2(initialInput);
+  const handleSubmit = useCallback2(
+    (e) => {
+      e.preventDefault();
+      if (!input)
+        return;
+      return complete(input);
+    },
+    [input, complete]
+  );
+  const handleInputChange = (e) => {
+    setInput(e.target.value);
+  };
+  return {
+    completion,
+    complete,
+    error,
+    setCompletion,
+    stop,
+    input,
+    setInput,
+    handleInputChange,
+    handleSubmit,
+    isLoading,
+    data: streamData
+  };
+}
+
+// src/use-assistant.ts
+import { isAbortError } from "@ai-sdk/provider-utils";
+import {
+  generateId,
+  readDataStream
+} from "@ai-sdk/ui-utils";
+import { useCallback as useCallback3, useRef as useRef3, useState as useState3 } from "react";
+function useAssistant({
+  api,
+  threadId: threadIdParam,
+  credentials,
+  headers,
+  body,
+  onError
+}) {
+  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()
+        }
+      ];
+    });
+    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;
+export {
+  experimental_useAssistant,
+  useAssistant,
+  useChat,
+  useCompletion
+};
+//# sourceMappingURL=index.mjs.map