@ai-sdk/react 1.2.6 → 2.0.0-canary.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/CHANGELOG.md +20 -4
- package/README.md +1 -1
- package/dist/index.d.mts +2 -61
- package/dist/index.d.ts +2 -61
- package/dist/index.js +73 -242
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +44 -215
- package/dist/index.mjs.map +1 -1
- package/package.json +3 -3
package/dist/index.mjs
CHANGED
|
@@ -1,173 +1,3 @@
|
|
|
1
|
-
// src/use-assistant.ts
|
|
2
|
-
import { isAbortError } from "@ai-sdk/provider-utils";
|
|
3
|
-
import {
|
|
4
|
-
generateId,
|
|
5
|
-
processAssistantStream
|
|
6
|
-
} from "@ai-sdk/ui-utils";
|
|
7
|
-
import { useCallback, useRef, useState } from "react";
|
|
8
|
-
var getOriginalFetch = () => fetch;
|
|
9
|
-
function useAssistant({
|
|
10
|
-
api,
|
|
11
|
-
threadId: threadIdParam,
|
|
12
|
-
credentials,
|
|
13
|
-
headers,
|
|
14
|
-
body,
|
|
15
|
-
onError,
|
|
16
|
-
fetch: fetch2
|
|
17
|
-
}) {
|
|
18
|
-
const [messages, setMessages] = useState([]);
|
|
19
|
-
const [input, setInput] = useState("");
|
|
20
|
-
const [currentThreadId, setCurrentThreadId] = useState(
|
|
21
|
-
void 0
|
|
22
|
-
);
|
|
23
|
-
const [status, setStatus] = useState("awaiting_message");
|
|
24
|
-
const [error, setError] = useState(void 0);
|
|
25
|
-
const handleInputChange = (event) => {
|
|
26
|
-
setInput(event.target.value);
|
|
27
|
-
};
|
|
28
|
-
const abortControllerRef = useRef(null);
|
|
29
|
-
const stop = useCallback(() => {
|
|
30
|
-
if (abortControllerRef.current) {
|
|
31
|
-
abortControllerRef.current.abort();
|
|
32
|
-
abortControllerRef.current = null;
|
|
33
|
-
}
|
|
34
|
-
}, []);
|
|
35
|
-
const append = async (message, requestOptions) => {
|
|
36
|
-
var _a, _b;
|
|
37
|
-
setStatus("in_progress");
|
|
38
|
-
setMessages((messages2) => {
|
|
39
|
-
var _a2;
|
|
40
|
-
return [
|
|
41
|
-
...messages2,
|
|
42
|
-
{
|
|
43
|
-
...message,
|
|
44
|
-
id: (_a2 = message.id) != null ? _a2 : generateId()
|
|
45
|
-
}
|
|
46
|
-
];
|
|
47
|
-
});
|
|
48
|
-
setInput("");
|
|
49
|
-
const abortController = new AbortController();
|
|
50
|
-
try {
|
|
51
|
-
abortControllerRef.current = abortController;
|
|
52
|
-
const actualFetch = fetch2 != null ? fetch2 : getOriginalFetch();
|
|
53
|
-
const response = await actualFetch(api, {
|
|
54
|
-
method: "POST",
|
|
55
|
-
credentials,
|
|
56
|
-
signal: abortController.signal,
|
|
57
|
-
headers: { "Content-Type": "application/json", ...headers },
|
|
58
|
-
body: JSON.stringify({
|
|
59
|
-
...body,
|
|
60
|
-
// always use user-provided threadId when available:
|
|
61
|
-
threadId: (_a = threadIdParam != null ? threadIdParam : currentThreadId) != null ? _a : null,
|
|
62
|
-
message: message.content,
|
|
63
|
-
// optional request data:
|
|
64
|
-
data: requestOptions == null ? void 0 : requestOptions.data
|
|
65
|
-
})
|
|
66
|
-
});
|
|
67
|
-
if (!response.ok) {
|
|
68
|
-
throw new Error(
|
|
69
|
-
(_b = await response.text()) != null ? _b : "Failed to fetch the assistant response."
|
|
70
|
-
);
|
|
71
|
-
}
|
|
72
|
-
if (response.body == null) {
|
|
73
|
-
throw new Error("The response body is empty.");
|
|
74
|
-
}
|
|
75
|
-
await processAssistantStream({
|
|
76
|
-
stream: response.body,
|
|
77
|
-
onAssistantMessagePart(value) {
|
|
78
|
-
setMessages((messages2) => [
|
|
79
|
-
...messages2,
|
|
80
|
-
{
|
|
81
|
-
id: value.id,
|
|
82
|
-
role: value.role,
|
|
83
|
-
content: value.content[0].text.value,
|
|
84
|
-
parts: []
|
|
85
|
-
}
|
|
86
|
-
]);
|
|
87
|
-
},
|
|
88
|
-
onTextPart(value) {
|
|
89
|
-
setMessages((messages2) => {
|
|
90
|
-
const lastMessage = messages2[messages2.length - 1];
|
|
91
|
-
return [
|
|
92
|
-
...messages2.slice(0, messages2.length - 1),
|
|
93
|
-
{
|
|
94
|
-
id: lastMessage.id,
|
|
95
|
-
role: lastMessage.role,
|
|
96
|
-
content: lastMessage.content + value,
|
|
97
|
-
parts: lastMessage.parts
|
|
98
|
-
}
|
|
99
|
-
];
|
|
100
|
-
});
|
|
101
|
-
},
|
|
102
|
-
onAssistantControlDataPart(value) {
|
|
103
|
-
setCurrentThreadId(value.threadId);
|
|
104
|
-
setMessages((messages2) => {
|
|
105
|
-
const lastMessage = messages2[messages2.length - 1];
|
|
106
|
-
lastMessage.id = value.messageId;
|
|
107
|
-
return [...messages2.slice(0, messages2.length - 1), lastMessage];
|
|
108
|
-
});
|
|
109
|
-
},
|
|
110
|
-
onDataMessagePart(value) {
|
|
111
|
-
setMessages((messages2) => {
|
|
112
|
-
var _a2;
|
|
113
|
-
return [
|
|
114
|
-
...messages2,
|
|
115
|
-
{
|
|
116
|
-
id: (_a2 = value.id) != null ? _a2 : generateId(),
|
|
117
|
-
role: "data",
|
|
118
|
-
content: "",
|
|
119
|
-
data: value.data,
|
|
120
|
-
parts: []
|
|
121
|
-
}
|
|
122
|
-
];
|
|
123
|
-
});
|
|
124
|
-
},
|
|
125
|
-
onErrorPart(value) {
|
|
126
|
-
setError(new Error(value));
|
|
127
|
-
}
|
|
128
|
-
});
|
|
129
|
-
} catch (error2) {
|
|
130
|
-
if (isAbortError(error2) && abortController.signal.aborted) {
|
|
131
|
-
abortControllerRef.current = null;
|
|
132
|
-
return;
|
|
133
|
-
}
|
|
134
|
-
if (onError && error2 instanceof Error) {
|
|
135
|
-
onError(error2);
|
|
136
|
-
}
|
|
137
|
-
setError(error2);
|
|
138
|
-
} finally {
|
|
139
|
-
abortControllerRef.current = null;
|
|
140
|
-
setStatus("awaiting_message");
|
|
141
|
-
}
|
|
142
|
-
};
|
|
143
|
-
const submitMessage = async (event, requestOptions) => {
|
|
144
|
-
var _a;
|
|
145
|
-
(_a = event == null ? void 0 : event.preventDefault) == null ? void 0 : _a.call(event);
|
|
146
|
-
if (input === "") {
|
|
147
|
-
return;
|
|
148
|
-
}
|
|
149
|
-
append({ role: "user", content: input, parts: [] }, requestOptions);
|
|
150
|
-
};
|
|
151
|
-
const setThreadId = (threadId) => {
|
|
152
|
-
setCurrentThreadId(threadId);
|
|
153
|
-
setMessages([]);
|
|
154
|
-
};
|
|
155
|
-
return {
|
|
156
|
-
append,
|
|
157
|
-
messages,
|
|
158
|
-
setMessages,
|
|
159
|
-
threadId: currentThreadId,
|
|
160
|
-
setThreadId,
|
|
161
|
-
input,
|
|
162
|
-
setInput,
|
|
163
|
-
handleInputChange,
|
|
164
|
-
submitMessage,
|
|
165
|
-
status,
|
|
166
|
-
error,
|
|
167
|
-
stop
|
|
168
|
-
};
|
|
169
|
-
}
|
|
170
|
-
|
|
171
1
|
// src/use-chat.ts
|
|
172
2
|
import {
|
|
173
3
|
callChatApi,
|
|
@@ -180,7 +10,7 @@ import {
|
|
|
180
10
|
shouldResubmitMessages,
|
|
181
11
|
updateToolCallResult
|
|
182
12
|
} from "@ai-sdk/ui-utils";
|
|
183
|
-
import { useCallback
|
|
13
|
+
import { useCallback, useEffect as useEffect2, useMemo, useRef, useState as useState2 } from "react";
|
|
184
14
|
import useSWR from "swr";
|
|
185
15
|
|
|
186
16
|
// src/throttle.ts
|
|
@@ -191,9 +21,9 @@ function throttle(fn, waitMs) {
|
|
|
191
21
|
|
|
192
22
|
// src/util/use-stable-value.ts
|
|
193
23
|
import { isDeepEqualData } from "@ai-sdk/ui-utils";
|
|
194
|
-
import { useEffect, useState
|
|
24
|
+
import { useEffect, useState } from "react";
|
|
195
25
|
function useStableValue(latestValue) {
|
|
196
|
-
const [value, setValue] =
|
|
26
|
+
const [value, setValue] = useState(latestValue);
|
|
197
27
|
useEffect(() => {
|
|
198
28
|
if (!isDeepEqualData(latestValue, value)) {
|
|
199
29
|
setValue(latestValue);
|
|
@@ -219,12 +49,12 @@ function useChat({
|
|
|
219
49
|
credentials,
|
|
220
50
|
headers,
|
|
221
51
|
body,
|
|
222
|
-
generateId
|
|
52
|
+
generateId = generateIdFunc,
|
|
223
53
|
fetch: fetch2,
|
|
224
54
|
keepLastMessageOnError = true,
|
|
225
55
|
experimental_throttle: throttleWaitMs
|
|
226
56
|
} = {}) {
|
|
227
|
-
const [hookId] =
|
|
57
|
+
const [hookId] = useState2(generateId);
|
|
228
58
|
const chatId = id != null ? id : hookId;
|
|
229
59
|
const chatKey = typeof api === "string" ? [api, chatId] : chatId;
|
|
230
60
|
const stableInitialMessages = useStableValue(initialMessages != null ? initialMessages : []);
|
|
@@ -237,19 +67,19 @@ function useChat({
|
|
|
237
67
|
null,
|
|
238
68
|
{ fallbackData: processedInitialMessages }
|
|
239
69
|
);
|
|
240
|
-
const messagesRef =
|
|
70
|
+
const messagesRef = useRef(messages || []);
|
|
241
71
|
useEffect2(() => {
|
|
242
72
|
messagesRef.current = messages || [];
|
|
243
73
|
}, [messages]);
|
|
244
74
|
const { data: streamData, mutate: mutateStreamData } = useSWR([chatKey, "streamData"], null);
|
|
245
|
-
const streamDataRef =
|
|
75
|
+
const streamDataRef = useRef(streamData);
|
|
246
76
|
useEffect2(() => {
|
|
247
77
|
streamDataRef.current = streamData;
|
|
248
78
|
}, [streamData]);
|
|
249
79
|
const { data: status = "ready", mutate: mutateStatus } = useSWR([chatKey, "status"], null);
|
|
250
80
|
const { data: error = void 0, mutate: setError } = useSWR([chatKey, "error"], null);
|
|
251
|
-
const abortControllerRef =
|
|
252
|
-
const extraMetadataRef =
|
|
81
|
+
const abortControllerRef = useRef(null);
|
|
82
|
+
const extraMetadataRef = useRef({
|
|
253
83
|
credentials,
|
|
254
84
|
headers,
|
|
255
85
|
body
|
|
@@ -261,7 +91,7 @@ function useChat({
|
|
|
261
91
|
body
|
|
262
92
|
};
|
|
263
93
|
}, [credentials, headers, body]);
|
|
264
|
-
const triggerRequest =
|
|
94
|
+
const triggerRequest = useCallback(
|
|
265
95
|
async (chatRequest) => {
|
|
266
96
|
var _a, _b;
|
|
267
97
|
mutateStatus("submitted");
|
|
@@ -348,7 +178,7 @@ function useChat({
|
|
|
348
178
|
},
|
|
349
179
|
onToolCall,
|
|
350
180
|
onFinish,
|
|
351
|
-
generateId
|
|
181
|
+
generateId,
|
|
352
182
|
fetch: fetch2,
|
|
353
183
|
lastMessage: chatMessages[chatMessages.length - 1]
|
|
354
184
|
});
|
|
@@ -394,14 +224,14 @@ function useChat({
|
|
|
394
224
|
maxSteps,
|
|
395
225
|
messagesRef,
|
|
396
226
|
abortControllerRef,
|
|
397
|
-
|
|
227
|
+
generateId,
|
|
398
228
|
fetch2,
|
|
399
229
|
keepLastMessageOnError,
|
|
400
230
|
throttleWaitMs,
|
|
401
231
|
chatId
|
|
402
232
|
]
|
|
403
233
|
);
|
|
404
|
-
const append =
|
|
234
|
+
const append = useCallback(
|
|
405
235
|
async (message, {
|
|
406
236
|
data,
|
|
407
237
|
headers: headers2,
|
|
@@ -414,16 +244,16 @@ function useChat({
|
|
|
414
244
|
);
|
|
415
245
|
const messages2 = messagesRef.current.concat({
|
|
416
246
|
...message,
|
|
417
|
-
id: (_a = message.id) != null ? _a :
|
|
247
|
+
id: (_a = message.id) != null ? _a : generateId(),
|
|
418
248
|
createdAt: (_b = message.createdAt) != null ? _b : /* @__PURE__ */ new Date(),
|
|
419
249
|
experimental_attachments: attachmentsForRequest.length > 0 ? attachmentsForRequest : void 0,
|
|
420
250
|
parts: getMessageParts(message)
|
|
421
251
|
});
|
|
422
252
|
return triggerRequest({ messages: messages2, headers: headers2, body: body2, data });
|
|
423
253
|
},
|
|
424
|
-
[triggerRequest,
|
|
254
|
+
[triggerRequest, generateId]
|
|
425
255
|
);
|
|
426
|
-
const reload =
|
|
256
|
+
const reload = useCallback(
|
|
427
257
|
async ({ data, headers: headers2, body: body2 } = {}) => {
|
|
428
258
|
const messages2 = messagesRef.current;
|
|
429
259
|
if (messages2.length === 0) {
|
|
@@ -439,13 +269,13 @@ function useChat({
|
|
|
439
269
|
},
|
|
440
270
|
[triggerRequest]
|
|
441
271
|
);
|
|
442
|
-
const stop =
|
|
272
|
+
const stop = useCallback(() => {
|
|
443
273
|
if (abortControllerRef.current) {
|
|
444
274
|
abortControllerRef.current.abort();
|
|
445
275
|
abortControllerRef.current = null;
|
|
446
276
|
}
|
|
447
277
|
}, []);
|
|
448
|
-
const setMessages =
|
|
278
|
+
const setMessages = useCallback(
|
|
449
279
|
(messages2) => {
|
|
450
280
|
if (typeof messages2 === "function") {
|
|
451
281
|
messages2 = messages2(messagesRef.current);
|
|
@@ -456,7 +286,7 @@ function useChat({
|
|
|
456
286
|
},
|
|
457
287
|
[mutate]
|
|
458
288
|
);
|
|
459
|
-
const setData =
|
|
289
|
+
const setData = useCallback(
|
|
460
290
|
(data) => {
|
|
461
291
|
if (typeof data === "function") {
|
|
462
292
|
data = data(streamDataRef.current);
|
|
@@ -466,8 +296,8 @@ function useChat({
|
|
|
466
296
|
},
|
|
467
297
|
[mutateStreamData]
|
|
468
298
|
);
|
|
469
|
-
const [input, setInput] =
|
|
470
|
-
const handleSubmit =
|
|
299
|
+
const [input, setInput] = useState2(initialInput);
|
|
300
|
+
const handleSubmit = useCallback(
|
|
471
301
|
async (event, options = {}, metadata) => {
|
|
472
302
|
var _a;
|
|
473
303
|
(_a = event == null ? void 0 : event.preventDefault) == null ? void 0 : _a.call(event);
|
|
@@ -483,7 +313,7 @@ function useChat({
|
|
|
483
313
|
options.experimental_attachments
|
|
484
314
|
);
|
|
485
315
|
const messages2 = messagesRef.current.concat({
|
|
486
|
-
id:
|
|
316
|
+
id: generateId(),
|
|
487
317
|
createdAt: /* @__PURE__ */ new Date(),
|
|
488
318
|
role: "user",
|
|
489
319
|
content: input,
|
|
@@ -499,12 +329,12 @@ function useChat({
|
|
|
499
329
|
triggerRequest(chatRequest);
|
|
500
330
|
setInput("");
|
|
501
331
|
},
|
|
502
|
-
[input,
|
|
332
|
+
[input, generateId, triggerRequest]
|
|
503
333
|
);
|
|
504
334
|
const handleInputChange = (e) => {
|
|
505
335
|
setInput(e.target.value);
|
|
506
336
|
};
|
|
507
|
-
const addToolResult =
|
|
337
|
+
const addToolResult = useCallback(
|
|
508
338
|
({ toolCallId, result }) => {
|
|
509
339
|
const currentMessages = messagesRef.current;
|
|
510
340
|
updateToolCallResult({
|
|
@@ -553,7 +383,7 @@ function useChat({
|
|
|
553
383
|
import {
|
|
554
384
|
callCompletionApi
|
|
555
385
|
} from "@ai-sdk/ui-utils";
|
|
556
|
-
import { useCallback as
|
|
386
|
+
import { useCallback as useCallback2, useEffect as useEffect3, useId, useRef as useRef2, useState as useState3 } from "react";
|
|
557
387
|
import useSWR2 from "swr";
|
|
558
388
|
function useCompletion({
|
|
559
389
|
api = "/api/completion",
|
|
@@ -580,10 +410,10 @@ function useCompletion({
|
|
|
580
410
|
null
|
|
581
411
|
);
|
|
582
412
|
const { data: streamData, mutate: mutateStreamData } = useSWR2([completionId, "streamData"], null);
|
|
583
|
-
const [error, setError] =
|
|
413
|
+
const [error, setError] = useState3(void 0);
|
|
584
414
|
const completion = data;
|
|
585
|
-
const [abortController, setAbortController] =
|
|
586
|
-
const extraMetadataRef =
|
|
415
|
+
const [abortController, setAbortController] = useState3(null);
|
|
416
|
+
const extraMetadataRef = useRef2({
|
|
587
417
|
credentials,
|
|
588
418
|
headers,
|
|
589
419
|
body
|
|
@@ -595,7 +425,7 @@ function useCompletion({
|
|
|
595
425
|
body
|
|
596
426
|
};
|
|
597
427
|
}, [credentials, headers, body]);
|
|
598
|
-
const triggerRequest =
|
|
428
|
+
const triggerRequest = useCallback2(
|
|
599
429
|
async (prompt, options) => callCompletionApi({
|
|
600
430
|
api,
|
|
601
431
|
prompt,
|
|
@@ -640,26 +470,26 @@ function useCompletion({
|
|
|
640
470
|
throttleWaitMs
|
|
641
471
|
]
|
|
642
472
|
);
|
|
643
|
-
const stop =
|
|
473
|
+
const stop = useCallback2(() => {
|
|
644
474
|
if (abortController) {
|
|
645
475
|
abortController.abort();
|
|
646
476
|
setAbortController(null);
|
|
647
477
|
}
|
|
648
478
|
}, [abortController]);
|
|
649
|
-
const setCompletion =
|
|
479
|
+
const setCompletion = useCallback2(
|
|
650
480
|
(completion2) => {
|
|
651
481
|
mutate(completion2, false);
|
|
652
482
|
},
|
|
653
483
|
[mutate]
|
|
654
484
|
);
|
|
655
|
-
const complete =
|
|
485
|
+
const complete = useCallback2(
|
|
656
486
|
async (prompt, options) => {
|
|
657
487
|
return triggerRequest(prompt, options);
|
|
658
488
|
},
|
|
659
489
|
[triggerRequest]
|
|
660
490
|
);
|
|
661
|
-
const [input, setInput] =
|
|
662
|
-
const handleSubmit =
|
|
491
|
+
const [input, setInput] = useState3(initialInput);
|
|
492
|
+
const handleSubmit = useCallback2(
|
|
663
493
|
(event) => {
|
|
664
494
|
var _a;
|
|
665
495
|
(_a = event == null ? void 0 : event.preventDefault) == null ? void 0 : _a.call(event);
|
|
@@ -667,7 +497,7 @@ function useCompletion({
|
|
|
667
497
|
},
|
|
668
498
|
[input, complete]
|
|
669
499
|
);
|
|
670
|
-
const handleInputChange =
|
|
500
|
+
const handleInputChange = useCallback2(
|
|
671
501
|
(e) => {
|
|
672
502
|
setInput(e.target.value);
|
|
673
503
|
},
|
|
@@ -690,7 +520,7 @@ function useCompletion({
|
|
|
690
520
|
|
|
691
521
|
// src/use-object.ts
|
|
692
522
|
import {
|
|
693
|
-
isAbortError
|
|
523
|
+
isAbortError,
|
|
694
524
|
safeValidateTypes
|
|
695
525
|
} from "@ai-sdk/provider-utils";
|
|
696
526
|
import {
|
|
@@ -698,9 +528,9 @@ import {
|
|
|
698
528
|
isDeepEqualData as isDeepEqualData2,
|
|
699
529
|
parsePartialJson
|
|
700
530
|
} from "@ai-sdk/ui-utils";
|
|
701
|
-
import { useCallback as
|
|
531
|
+
import { useCallback as useCallback3, useId as useId2, useRef as useRef3, useState as useState4 } from "react";
|
|
702
532
|
import useSWR3 from "swr";
|
|
703
|
-
var
|
|
533
|
+
var getOriginalFetch = () => fetch;
|
|
704
534
|
function useObject({
|
|
705
535
|
api,
|
|
706
536
|
id,
|
|
@@ -720,10 +550,10 @@ function useObject({
|
|
|
720
550
|
null,
|
|
721
551
|
{ fallbackData: initialValue }
|
|
722
552
|
);
|
|
723
|
-
const [error, setError] =
|
|
724
|
-
const [isLoading, setIsLoading] =
|
|
725
|
-
const abortControllerRef =
|
|
726
|
-
const stop =
|
|
553
|
+
const [error, setError] = useState4(void 0);
|
|
554
|
+
const [isLoading, setIsLoading] = useState4(false);
|
|
555
|
+
const abortControllerRef = useRef3(null);
|
|
556
|
+
const stop = useCallback3(() => {
|
|
727
557
|
var _a;
|
|
728
558
|
try {
|
|
729
559
|
(_a = abortControllerRef.current) == null ? void 0 : _a.abort();
|
|
@@ -741,7 +571,7 @@ function useObject({
|
|
|
741
571
|
setError(void 0);
|
|
742
572
|
const abortController = new AbortController();
|
|
743
573
|
abortControllerRef.current = abortController;
|
|
744
|
-
const actualFetch = fetch2 != null ? fetch2 :
|
|
574
|
+
const actualFetch = fetch2 != null ? fetch2 : getOriginalFetch();
|
|
745
575
|
const response = await actualFetch(api, {
|
|
746
576
|
method: "POST",
|
|
747
577
|
headers: {
|
|
@@ -789,7 +619,7 @@ function useObject({
|
|
|
789
619
|
})
|
|
790
620
|
);
|
|
791
621
|
} catch (error2) {
|
|
792
|
-
if (
|
|
622
|
+
if (isAbortError(error2)) {
|
|
793
623
|
return;
|
|
794
624
|
}
|
|
795
625
|
if (onError && error2 instanceof Error) {
|
|
@@ -810,7 +640,6 @@ function useObject({
|
|
|
810
640
|
var experimental_useObject = useObject;
|
|
811
641
|
export {
|
|
812
642
|
experimental_useObject,
|
|
813
|
-
useAssistant,
|
|
814
643
|
useChat,
|
|
815
644
|
useCompletion
|
|
816
645
|
};
|