feat (ai/ui): allow JSONValue as data in useChat handleSubmit (#2128)

Co-authored-by: Brian Hung <brianlhung@gmail.com>

Author: lgrammel

.changeset/swift-boats-shout.md

@@ -0,0 +1,6 @@
+---
+'@ai-sdk/ui-utils': patch
+'@ai-sdk/react': patch
+---
+
+feat (ai/ui): allow JSONValue as data in useChat handleSubmit

content/docs/07-reference/ai-sdk-ui/01-use-chat.mdx

@@ -136,7 +136,7 @@ Allows you to easily create a conversational user interface for your chatbot app
     },
     {
       name: 'experimental_prepareRequestBody',
-      type: '(options: { messages: Message[]; requestData?: Record<string, string>; requestBody?: object }) => JSONValue',
+      type: '(options: { messages: Message[]; requestData?: JSONValue; requestBody?: object }) => JSONValue',
       optional: true,
       description:
         'Experimental (React only). When a function is provided, it will be used to prepare the request body for the chat API. This can be useful for customizing the request body based on the messages and data in the chat.',
@@ -232,7 +232,7 @@ Allows you to easily create a conversational user interface for your chatbot app
             },
             {
               name: 'data',
-              type: 'Record<string,string>',
+              type: 'JSONValue',
               description: 'Additional data to be sent to the server.',
             },
           ],

packages/react/src/use-chat.ts

@@ -91,7 +91,7 @@ const getStreamedResponse = async (
   experimental_prepareRequestBody:
     | ((options: {
         messages: Message[];
-        requestData?: Record<string, string>;
+        requestData?: JSONValue;
         requestBody?: object;
       }) => JSONValue)
     | undefined,
@@ -220,7 +220,7 @@ export function useChat({
    */
   experimental_prepareRequestBody?: (options: {
     messages: Message[];
-    requestData?: Record<string, string>;
+    requestData?: JSONValue;
     requestBody?: object;
   }) => JSONValue;
 

packages/ui-utils/src/types.ts

@@ -192,7 +192,7 @@ export type CreateMessage = Omit<Message, 'id'> & {
 export type ChatRequest = {
   messages: Message[];
   options?: RequestOptions;
-  data?: Record<string, string>;
+  data?: JSONValue;
 
   /**
    * @deprecated
@@ -272,7 +272,7 @@ The options to be passed to the fetch call.
   /**
 Additional data to be sent to the server.
    */
-  data?: Record<string, string>;
+  data?: JSONValue;
 };
 
 export type UseChatOptions = {
@@ -468,6 +468,10 @@ or to provide a custom fetch implementation for e.g. testing.
   fetch?: FetchFunction;
 };
 
+/**
+A JSON value can be a string, number, boolean, object, array, or null. 
+JSON values can be serialized and deserialized by the JSON.stringify and JSON.parse methods.
+ */
 export type JSONValue =
   | null
   | string