@ai-sdk/react 0.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/.eslintrc.js ADDED
@@ -0,0 +1,4 @@
1
+ module.exports = {
2
+ root: true,
3
+ extends: ['vercel-ai'],
4
+ };
@@ -0,0 +1,21 @@
1
+
2
+ > @ai-sdk/react@0.0.1 build /home/runner/work/ai/ai/packages/react
3
+ > tsup
4
+
5
+ CLI Building entry: src/index.ts
6
+ CLI Using tsconfig: tsconfig.json
7
+ CLI tsup v7.2.0
8
+ CLI Using tsup config: /home/runner/work/ai/ai/packages/react/tsup.config.ts
9
+ CLI Target: es2018
10
+ CJS Build start
11
+ ESM Build start
12
+ CJS dist/index.js 20.18 KB
13
+ CJS dist/index.js.map 40.03 KB
14
+ CJS ⚡️ Build success in 43ms
15
+ ESM dist/index.mjs 17.85 KB
16
+ ESM dist/index.mjs.map 39.94 KB
17
+ ESM ⚡️ Build success in 46ms
18
+ DTS Build start
19
+ DTS ⚡️ Build success in 4168ms
20
+ DTS dist/index.d.ts 7.36 KB
21
+ DTS dist/index.d.mts 7.36 KB
@@ -0,0 +1,4 @@
1
+
2
+ > @ai-sdk/react@0.0.1 clean /home/runner/work/ai/ai/packages/react
3
+ > rm -rf dist
4
+
package/CHANGELOG.md ADDED
@@ -0,0 +1,9 @@
1
+ # @ai-sdk/react
2
+
3
+ ## 0.0.1
4
+
5
+ ### Patch Changes
6
+
7
+ - 85f209a4: chore: extracted ui library support into separate modules
8
+ - Updated dependencies [85f209a4]
9
+ - @ai-sdk/ui-utils@0.0.1
package/LICENSE ADDED
@@ -0,0 +1,13 @@
1
+ Copyright 2023 Vercel, Inc.
2
+
3
+ Licensed under the Apache License, Version 2.0 (the "License");
4
+ you may not use this file except in compliance with the License.
5
+ You may obtain a copy of the License at
6
+
7
+ http://www.apache.org/licenses/LICENSE-2.0
8
+
9
+ Unless required by applicable law or agreed to in writing, software
10
+ distributed under the License is distributed on an "AS IS" BASIS,
11
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12
+ See the License for the specific language governing permissions and
13
+ limitations under the License.
package/README.md ADDED
@@ -0,0 +1,7 @@
1
+ # Vercel AI SDK: React provider
2
+
3
+ [React](https://react.dev/) UI components for the [Vercel AI SDK](https://sdk.vercel.ai/docs):
4
+
5
+ - [`useChat`](https://sdk.vercel.ai/docs/reference/ai-sdk-ui/use-chat) hook
6
+ - [`useCompletion`](https://sdk.vercel.ai/docs/reference/ai-sdk-ui/use-completion) hook
7
+ - [`useAssistant`](https://sdk.vercel.ai/docs/reference/ai-sdk-ui/use-assistant) hook
@@ -0,0 +1,189 @@
1
+ import { Message, CreateMessage, ChatRequestOptions, JSONValue, UseChatOptions, RequestOptions, UseCompletionOptions, AssistantStatus, UseAssistantOptions } from '@ai-sdk/ui-utils';
2
+ export { CreateMessage, Message, UseChatOptions, UseCompletionOptions } from '@ai-sdk/ui-utils';
3
+
4
+ type UseChatHelpers = {
5
+ /** Current messages in the chat */
6
+ messages: Message[];
7
+ /** The error object of the API request */
8
+ error: undefined | Error;
9
+ /**
10
+ * Append a user message to the chat list. This triggers the API call to fetch
11
+ * the assistant's response.
12
+ * @param message The message to append
13
+ * @param options Additional options to pass to the API call
14
+ */
15
+ append: (message: Message | CreateMessage, chatRequestOptions?: ChatRequestOptions) => Promise<string | null | undefined>;
16
+ /**
17
+ * Reload the last AI chat response for the given chat history. If the last
18
+ * message isn't from the assistant, it will request the API to generate a
19
+ * new response.
20
+ */
21
+ reload: (chatRequestOptions?: ChatRequestOptions) => Promise<string | null | undefined>;
22
+ /**
23
+ * Abort the current request immediately, keep the generated tokens if any.
24
+ */
25
+ stop: () => void;
26
+ /**
27
+ * Update the `messages` state locally. This is useful when you want to
28
+ * edit the messages on the client, and then trigger the `reload` method
29
+ * manually to regenerate the AI response.
30
+ */
31
+ setMessages: (messages: Message[]) => void;
32
+ /** The current value of the input */
33
+ input: string;
34
+ /** setState-powered method to update the input value */
35
+ setInput: React.Dispatch<React.SetStateAction<string>>;
36
+ /** An input/textarea-ready onChange handler to control the value of the input */
37
+ handleInputChange: (e: React.ChangeEvent<HTMLInputElement> | React.ChangeEvent<HTMLTextAreaElement>) => void;
38
+ /** Form submission handler to automatically reset input and append a user message */
39
+ handleSubmit: (e: React.FormEvent<HTMLFormElement>, chatRequestOptions?: ChatRequestOptions) => void;
40
+ metadata?: Object;
41
+ /** Whether the API request is in progress */
42
+ isLoading: boolean;
43
+ /** Additional data added on the server via StreamData */
44
+ data?: JSONValue[];
45
+ };
46
+ declare function useChat({ api, id, initialMessages, initialInput, sendExtraMessageFields, experimental_onFunctionCall, experimental_onToolCall, onToolCall, experimental_maxAutomaticRoundtrips, maxAutomaticRoundtrips, maxToolRoundtrips, streamMode, onResponse, onFinish, onError, credentials, headers, body, generateId, }?: Omit<UseChatOptions, 'api'> & {
47
+ api?: string;
48
+ key?: string;
49
+ /**
50
+ @deprecated Use `maxToolRoundtrips` instead.
51
+ */
52
+ experimental_maxAutomaticRoundtrips?: number;
53
+ /**
54
+ @deprecated Use `maxToolRoundtrips` instead.
55
+ */
56
+ maxAutomaticRoundtrips?: number;
57
+ /**
58
+ Maximal number of automatic roundtrips for tool calls.
59
+
60
+ An automatic tool call roundtrip is a call to the server with the
61
+ tool call results when all tool calls in the last assistant
62
+ message have results.
63
+
64
+ A maximum number is required to prevent infinite loops in the
65
+ case of misconfigured tools.
66
+
67
+ By default, it's set to 0, which will disable the feature.
68
+ */
69
+ maxToolRoundtrips?: number;
70
+ }): UseChatHelpers & {
71
+ /**
72
+ * @deprecated Use `addToolResult` instead.
73
+ */
74
+ experimental_addToolResult: ({ toolCallId, result, }: {
75
+ toolCallId: string;
76
+ result: any;
77
+ }) => void;
78
+ addToolResult: ({ toolCallId, result, }: {
79
+ toolCallId: string;
80
+ result: any;
81
+ }) => void;
82
+ };
83
+
84
+ type UseCompletionHelpers = {
85
+ /** The current completion result */
86
+ completion: string;
87
+ /**
88
+ * Send a new prompt to the API endpoint and update the completion state.
89
+ */
90
+ complete: (prompt: string, options?: RequestOptions) => Promise<string | null | undefined>;
91
+ /** The error object of the API request */
92
+ error: undefined | Error;
93
+ /**
94
+ * Abort the current API request but keep the generated tokens.
95
+ */
96
+ stop: () => void;
97
+ /**
98
+ * Update the `completion` state locally.
99
+ */
100
+ setCompletion: (completion: string) => void;
101
+ /** The current value of the input */
102
+ input: string;
103
+ /** setState-powered method to update the input value */
104
+ setInput: React.Dispatch<React.SetStateAction<string>>;
105
+ /**
106
+ * An input/textarea-ready onChange handler to control the value of the input
107
+ * @example
108
+ * ```jsx
109
+ * <input onChange={handleInputChange} value={input} />
110
+ * ```
111
+ */
112
+ handleInputChange: (e: React.ChangeEvent<HTMLInputElement> | React.ChangeEvent<HTMLTextAreaElement>) => void;
113
+ /**
114
+ * Form submission handler to automatically reset input and append a user message
115
+ * @example
116
+ * ```jsx
117
+ * <form onSubmit={handleSubmit}>
118
+ * <input onChange={handleInputChange} value={input} />
119
+ * </form>
120
+ * ```
121
+ */
122
+ handleSubmit: (e: React.FormEvent<HTMLFormElement>) => void;
123
+ /** Whether the API request is in progress */
124
+ isLoading: boolean;
125
+ /** Additional data added on the server via StreamData */
126
+ data?: JSONValue[];
127
+ };
128
+ declare function useCompletion({ api, id, initialCompletion, initialInput, credentials, headers, body, streamMode, onResponse, onFinish, onError, }?: UseCompletionOptions): UseCompletionHelpers;
129
+
130
+ type UseAssistantHelpers = {
131
+ /**
132
+ * The current array of chat messages.
133
+ */
134
+ messages: Message[];
135
+ /**
136
+ * Update the message store with a new array of messages.
137
+ */
138
+ setMessages: React.Dispatch<React.SetStateAction<Message[]>>;
139
+ /**
140
+ * The current thread ID.
141
+ */
142
+ threadId: string | undefined;
143
+ /**
144
+ * The current value of the input field.
145
+ */
146
+ input: string;
147
+ /**
148
+ * Append a user message to the chat list. This triggers the API call to fetch
149
+ * the assistant's response.
150
+ * @param message The message to append
151
+ * @param requestOptions Additional options to pass to the API call
152
+ */
153
+ append: (message: Message | CreateMessage, requestOptions?: {
154
+ data?: Record<string, string>;
155
+ }) => Promise<void>;
156
+ /**
157
+ Abort the current request immediately, keep the generated tokens if any.
158
+ */
159
+ stop: () => void;
160
+ /**
161
+ * setState-powered method to update the input value.
162
+ */
163
+ setInput: React.Dispatch<React.SetStateAction<string>>;
164
+ /**
165
+ * Handler for the `onChange` event of the input field to control the input's value.
166
+ */
167
+ handleInputChange: (event: React.ChangeEvent<HTMLInputElement> | React.ChangeEvent<HTMLTextAreaElement>) => void;
168
+ /**
169
+ * Form submission handler that automatically resets the input field and appends a user message.
170
+ */
171
+ submitMessage: (event?: React.FormEvent<HTMLFormElement>, requestOptions?: {
172
+ data?: Record<string, string>;
173
+ }) => Promise<void>;
174
+ /**
175
+ * The current status of the assistant. This can be used to show a loading indicator.
176
+ */
177
+ status: AssistantStatus;
178
+ /**
179
+ * The error thrown during the assistant message processing, if any.
180
+ */
181
+ error: undefined | unknown;
182
+ };
183
+ declare function useAssistant({ api, threadId: threadIdParam, credentials, headers, body, onError, }: UseAssistantOptions): UseAssistantHelpers;
184
+ /**
185
+ @deprecated Use `useAssistant` instead.
186
+ */
187
+ declare const experimental_useAssistant: typeof useAssistant;
188
+
189
+ export { UseAssistantHelpers, UseChatHelpers, UseCompletionHelpers, experimental_useAssistant, useAssistant, useChat, useCompletion };
@@ -0,0 +1,189 @@
1
+ import { Message, CreateMessage, ChatRequestOptions, JSONValue, UseChatOptions, RequestOptions, UseCompletionOptions, AssistantStatus, UseAssistantOptions } from '@ai-sdk/ui-utils';
2
+ export { CreateMessage, Message, UseChatOptions, UseCompletionOptions } from '@ai-sdk/ui-utils';
3
+
4
+ type UseChatHelpers = {
5
+ /** Current messages in the chat */
6
+ messages: Message[];
7
+ /** The error object of the API request */
8
+ error: undefined | Error;
9
+ /**
10
+ * Append a user message to the chat list. This triggers the API call to fetch
11
+ * the assistant's response.
12
+ * @param message The message to append
13
+ * @param options Additional options to pass to the API call
14
+ */
15
+ append: (message: Message | CreateMessage, chatRequestOptions?: ChatRequestOptions) => Promise<string | null | undefined>;
16
+ /**
17
+ * Reload the last AI chat response for the given chat history. If the last
18
+ * message isn't from the assistant, it will request the API to generate a
19
+ * new response.
20
+ */
21
+ reload: (chatRequestOptions?: ChatRequestOptions) => Promise<string | null | undefined>;
22
+ /**
23
+ * Abort the current request immediately, keep the generated tokens if any.
24
+ */
25
+ stop: () => void;
26
+ /**
27
+ * Update the `messages` state locally. This is useful when you want to
28
+ * edit the messages on the client, and then trigger the `reload` method
29
+ * manually to regenerate the AI response.
30
+ */
31
+ setMessages: (messages: Message[]) => void;
32
+ /** The current value of the input */
33
+ input: string;
34
+ /** setState-powered method to update the input value */
35
+ setInput: React.Dispatch<React.SetStateAction<string>>;
36
+ /** An input/textarea-ready onChange handler to control the value of the input */
37
+ handleInputChange: (e: React.ChangeEvent<HTMLInputElement> | React.ChangeEvent<HTMLTextAreaElement>) => void;
38
+ /** Form submission handler to automatically reset input and append a user message */
39
+ handleSubmit: (e: React.FormEvent<HTMLFormElement>, chatRequestOptions?: ChatRequestOptions) => void;
40
+ metadata?: Object;
41
+ /** Whether the API request is in progress */
42
+ isLoading: boolean;
43
+ /** Additional data added on the server via StreamData */
44
+ data?: JSONValue[];
45
+ };
46
+ declare function useChat({ api, id, initialMessages, initialInput, sendExtraMessageFields, experimental_onFunctionCall, experimental_onToolCall, onToolCall, experimental_maxAutomaticRoundtrips, maxAutomaticRoundtrips, maxToolRoundtrips, streamMode, onResponse, onFinish, onError, credentials, headers, body, generateId, }?: Omit<UseChatOptions, 'api'> & {
47
+ api?: string;
48
+ key?: string;
49
+ /**
50
+ @deprecated Use `maxToolRoundtrips` instead.
51
+ */
52
+ experimental_maxAutomaticRoundtrips?: number;
53
+ /**
54
+ @deprecated Use `maxToolRoundtrips` instead.
55
+ */
56
+ maxAutomaticRoundtrips?: number;
57
+ /**
58
+ Maximal number of automatic roundtrips for tool calls.
59
+
60
+ An automatic tool call roundtrip is a call to the server with the
61
+ tool call results when all tool calls in the last assistant
62
+ message have results.
63
+
64
+ A maximum number is required to prevent infinite loops in the
65
+ case of misconfigured tools.
66
+
67
+ By default, it's set to 0, which will disable the feature.
68
+ */
69
+ maxToolRoundtrips?: number;
70
+ }): UseChatHelpers & {
71
+ /**
72
+ * @deprecated Use `addToolResult` instead.
73
+ */
74
+ experimental_addToolResult: ({ toolCallId, result, }: {
75
+ toolCallId: string;
76
+ result: any;
77
+ }) => void;
78
+ addToolResult: ({ toolCallId, result, }: {
79
+ toolCallId: string;
80
+ result: any;
81
+ }) => void;
82
+ };
83
+
84
+ type UseCompletionHelpers = {
85
+ /** The current completion result */
86
+ completion: string;
87
+ /**
88
+ * Send a new prompt to the API endpoint and update the completion state.
89
+ */
90
+ complete: (prompt: string, options?: RequestOptions) => Promise<string | null | undefined>;
91
+ /** The error object of the API request */
92
+ error: undefined | Error;
93
+ /**
94
+ * Abort the current API request but keep the generated tokens.
95
+ */
96
+ stop: () => void;
97
+ /**
98
+ * Update the `completion` state locally.
99
+ */
100
+ setCompletion: (completion: string) => void;
101
+ /** The current value of the input */
102
+ input: string;
103
+ /** setState-powered method to update the input value */
104
+ setInput: React.Dispatch<React.SetStateAction<string>>;
105
+ /**
106
+ * An input/textarea-ready onChange handler to control the value of the input
107
+ * @example
108
+ * ```jsx
109
+ * <input onChange={handleInputChange} value={input} />
110
+ * ```
111
+ */
112
+ handleInputChange: (e: React.ChangeEvent<HTMLInputElement> | React.ChangeEvent<HTMLTextAreaElement>) => void;
113
+ /**
114
+ * Form submission handler to automatically reset input and append a user message
115
+ * @example
116
+ * ```jsx
117
+ * <form onSubmit={handleSubmit}>
118
+ * <input onChange={handleInputChange} value={input} />
119
+ * </form>
120
+ * ```
121
+ */
122
+ handleSubmit: (e: React.FormEvent<HTMLFormElement>) => void;
123
+ /** Whether the API request is in progress */
124
+ isLoading: boolean;
125
+ /** Additional data added on the server via StreamData */
126
+ data?: JSONValue[];
127
+ };
128
+ declare function useCompletion({ api, id, initialCompletion, initialInput, credentials, headers, body, streamMode, onResponse, onFinish, onError, }?: UseCompletionOptions): UseCompletionHelpers;
129
+
130
+ type UseAssistantHelpers = {
131
+ /**
132
+ * The current array of chat messages.
133
+ */
134
+ messages: Message[];
135
+ /**
136
+ * Update the message store with a new array of messages.
137
+ */
138
+ setMessages: React.Dispatch<React.SetStateAction<Message[]>>;
139
+ /**
140
+ * The current thread ID.
141
+ */
142
+ threadId: string | undefined;
143
+ /**
144
+ * The current value of the input field.
145
+ */
146
+ input: string;
147
+ /**
148
+ * Append a user message to the chat list. This triggers the API call to fetch
149
+ * the assistant's response.
150
+ * @param message The message to append
151
+ * @param requestOptions Additional options to pass to the API call
152
+ */
153
+ append: (message: Message | CreateMessage, requestOptions?: {
154
+ data?: Record<string, string>;
155
+ }) => Promise<void>;
156
+ /**
157
+ Abort the current request immediately, keep the generated tokens if any.
158
+ */
159
+ stop: () => void;
160
+ /**
161
+ * setState-powered method to update the input value.
162
+ */
163
+ setInput: React.Dispatch<React.SetStateAction<string>>;
164
+ /**
165
+ * Handler for the `onChange` event of the input field to control the input's value.
166
+ */
167
+ handleInputChange: (event: React.ChangeEvent<HTMLInputElement> | React.ChangeEvent<HTMLTextAreaElement>) => void;
168
+ /**
169
+ * Form submission handler that automatically resets the input field and appends a user message.
170
+ */
171
+ submitMessage: (event?: React.FormEvent<HTMLFormElement>, requestOptions?: {
172
+ data?: Record<string, string>;
173
+ }) => Promise<void>;
174
+ /**
175
+ * The current status of the assistant. This can be used to show a loading indicator.
176
+ */
177
+ status: AssistantStatus;
178
+ /**
179
+ * The error thrown during the assistant message processing, if any.
180
+ */
181
+ error: undefined | unknown;
182
+ };
183
+ declare function useAssistant({ api, threadId: threadIdParam, credentials, headers, body, onError, }: UseAssistantOptions): UseAssistantHelpers;
184
+ /**
185
+ @deprecated Use `useAssistant` instead.
186
+ */
187
+ declare const experimental_useAssistant: typeof useAssistant;
188
+
189
+ export { UseAssistantHelpers, UseChatHelpers, UseCompletionHelpers, experimental_useAssistant, useAssistant, useChat, useCompletion };