@tanstack/ai-react 0.7.1 → 0.7.2
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/README.md +6 -6
- package/dist/esm/types.d.ts +23 -2
- package/dist/esm/use-chat.js +28 -2
- package/dist/esm/use-chat.js.map +1 -1
- package/dist/esm/use-generate-image.d.ts +6 -6
- package/dist/esm/use-generate-image.js.map +1 -1
- package/dist/esm/use-generate-speech.d.ts +5 -5
- package/dist/esm/use-generate-speech.js.map +1 -1
- package/dist/esm/use-generate-video.d.ts +5 -5
- package/dist/esm/use-generate-video.js.map +1 -1
- package/dist/esm/use-generation.d.ts +5 -5
- package/dist/esm/use-generation.js.map +1 -1
- package/dist/esm/use-summarize.d.ts +5 -5
- package/dist/esm/use-summarize.js.map +1 -1
- package/dist/esm/use-transcription.d.ts +5 -5
- package/dist/esm/use-transcription.js.map +1 -1
- package/package.json +4 -4
- package/src/types.ts +33 -2
- package/src/use-chat.ts +33 -4
- package/src/use-generate-image.ts +6 -6
- package/src/use-generate-speech.ts +5 -5
- package/src/use-generate-video.ts +5 -5
- package/src/use-generation.ts +5 -5
- package/src/use-summarize.ts +5 -5
- package/src/use-transcription.ts +5 -5
package/README.md
CHANGED
|
@@ -87,18 +87,18 @@ Available adapters: `openaiText`, `openaiEmbed`, `openaiSummarize`, `anthropicTe
|
|
|
87
87
|
<td>
|
|
88
88
|
<a href="https://www.coderabbit.ai/?via=tanstack&dub_id=aCcEEdAOqqutX6OS" >
|
|
89
89
|
<picture>
|
|
90
|
-
<source media="(prefers-color-scheme: dark)" srcset="https://tanstack.com/assets/coderabbit-dark-
|
|
91
|
-
<source media="(prefers-color-scheme: light)" srcset="https://tanstack.com/assets/coderabbit-light-
|
|
92
|
-
<img src="https://tanstack.com/assets/coderabbit-light-
|
|
90
|
+
<source media="(prefers-color-scheme: dark)" srcset="https://tanstack.com/assets/coderabbit-dark-D643Zkrv.svg" height="40" />
|
|
91
|
+
<source media="(prefers-color-scheme: light)" srcset="https://tanstack.com/assets/coderabbit-light-CIzGLYU_.svg" height="40" />
|
|
92
|
+
<img src="https://tanstack.com/assets/coderabbit-light-CIzGLYU_.svg" height="40" alt="CodeRabbit" />
|
|
93
93
|
</picture>
|
|
94
94
|
</a>
|
|
95
95
|
</td>
|
|
96
96
|
<td>
|
|
97
97
|
<a href="https://www.cloudflare.com?utm_source=tanstack">
|
|
98
98
|
<picture>
|
|
99
|
-
<source media="(prefers-color-scheme: dark)" srcset="https://tanstack.com/assets/cloudflare-white-
|
|
100
|
-
<source media="(prefers-color-scheme: light)" srcset="https://tanstack.com/assets/cloudflare-black-
|
|
101
|
-
<img src="https://tanstack.com/assets/cloudflare-black-
|
|
99
|
+
<source media="(prefers-color-scheme: dark)" srcset="https://tanstack.com/assets/cloudflare-white-Co-Tyjbl.svg" height="60" />
|
|
100
|
+
<source media="(prefers-color-scheme: light)" srcset="https://tanstack.com/assets/cloudflare-black-6Ojsn8yh.svg" height="60" />
|
|
101
|
+
<img src="https://tanstack.com/assets/cloudflare-black-6Ojsn8yh.svg" height="60" alt="Cloudflare" />
|
|
102
102
|
</picture>
|
|
103
103
|
</a>
|
|
104
104
|
</td>
|
package/dist/esm/types.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { AnyClientTool, ModelMessage } from '@tanstack/ai';
|
|
2
|
-
import { ChatClientOptions, ChatClientState, ChatRequestBody, MultimodalContent, UIMessage } from '@tanstack/ai-client';
|
|
2
|
+
import { ChatClientOptions, ChatClientState, ChatRequestBody, ConnectionStatus, MultimodalContent, UIMessage } from '@tanstack/ai-client';
|
|
3
3
|
export type { ChatRequestBody, MultimodalContent, UIMessage };
|
|
4
4
|
/**
|
|
5
5
|
* Options for the useChat hook.
|
|
@@ -17,7 +17,13 @@ export type { ChatRequestBody, MultimodalContent, UIMessage };
|
|
|
17
17
|
* Note: Connection and body changes will recreate the ChatClient instance.
|
|
18
18
|
* To update these options, remount the component or use a key prop.
|
|
19
19
|
*/
|
|
20
|
-
export type UseChatOptions<TTools extends ReadonlyArray<AnyClientTool> = any> = Omit<ChatClientOptions<TTools>, 'onMessagesChange' | 'onLoadingChange' | 'onErrorChange' | 'onStatusChange'
|
|
20
|
+
export type UseChatOptions<TTools extends ReadonlyArray<AnyClientTool> = any> = Omit<ChatClientOptions<TTools>, 'onMessagesChange' | 'onLoadingChange' | 'onErrorChange' | 'onStatusChange' | 'onSubscriptionChange' | 'onConnectionStatusChange' | 'onSessionGeneratingChange'> & {
|
|
21
|
+
/**
|
|
22
|
+
* Opt into mount-time live subscription behavior.
|
|
23
|
+
* When enabled, the hook subscribes on mount and unsubscribes on unmount.
|
|
24
|
+
*/
|
|
25
|
+
live?: boolean;
|
|
26
|
+
};
|
|
21
27
|
export interface UseChatReturn<TTools extends ReadonlyArray<AnyClientTool> = any> {
|
|
22
28
|
/**
|
|
23
29
|
* Current messages in the conversation
|
|
@@ -69,6 +75,21 @@ export interface UseChatReturn<TTools extends ReadonlyArray<AnyClientTool> = any
|
|
|
69
75
|
* Current status of the chat client
|
|
70
76
|
*/
|
|
71
77
|
status: ChatClientState;
|
|
78
|
+
/**
|
|
79
|
+
* Whether the subscription loop is currently active
|
|
80
|
+
*/
|
|
81
|
+
isSubscribed: boolean;
|
|
82
|
+
/**
|
|
83
|
+
* Current connection lifecycle status
|
|
84
|
+
*/
|
|
85
|
+
connectionStatus: ConnectionStatus;
|
|
86
|
+
/**
|
|
87
|
+
* Whether the shared session is actively generating.
|
|
88
|
+
* Derived from stream run events (RUN_STARTED / RUN_FINISHED / RUN_ERROR).
|
|
89
|
+
* Unlike `isLoading` (request-local), this reflects shared generation
|
|
90
|
+
* activity visible to all subscribers (e.g. across tabs/devices).
|
|
91
|
+
*/
|
|
92
|
+
sessionGenerating: boolean;
|
|
72
93
|
/**
|
|
73
94
|
* Set messages manually
|
|
74
95
|
*/
|
package/dist/esm/use-chat.js
CHANGED
|
@@ -9,6 +9,9 @@ function useChat(options) {
|
|
|
9
9
|
const [isLoading, setIsLoading] = useState(false);
|
|
10
10
|
const [error, setError] = useState(void 0);
|
|
11
11
|
const [status, setStatus] = useState("ready");
|
|
12
|
+
const [isSubscribed, setIsSubscribed] = useState(false);
|
|
13
|
+
const [connectionStatus, setConnectionStatus] = useState("disconnected");
|
|
14
|
+
const [sessionGenerating, setSessionGenerating] = useState(false);
|
|
12
15
|
const messagesRef = useRef(
|
|
13
16
|
options.initialMessages || []
|
|
14
17
|
);
|
|
@@ -48,6 +51,15 @@ function useChat(options) {
|
|
|
48
51
|
},
|
|
49
52
|
onStatusChange: (status2) => {
|
|
50
53
|
setStatus(status2);
|
|
54
|
+
},
|
|
55
|
+
onSubscriptionChange: (nextIsSubscribed) => {
|
|
56
|
+
setIsSubscribed(nextIsSubscribed);
|
|
57
|
+
},
|
|
58
|
+
onConnectionStatusChange: (nextStatus) => {
|
|
59
|
+
setConnectionStatus(nextStatus);
|
|
60
|
+
},
|
|
61
|
+
onSessionGeneratingChange: (isGenerating) => {
|
|
62
|
+
setSessionGenerating(isGenerating);
|
|
51
63
|
}
|
|
52
64
|
});
|
|
53
65
|
}, [clientId]);
|
|
@@ -61,11 +73,22 @@ function useChat(options) {
|
|
|
61
73
|
}
|
|
62
74
|
}
|
|
63
75
|
}, []);
|
|
76
|
+
useEffect(() => {
|
|
77
|
+
if (options.live) {
|
|
78
|
+
client.subscribe();
|
|
79
|
+
} else {
|
|
80
|
+
client.unsubscribe();
|
|
81
|
+
}
|
|
82
|
+
}, [client, options.live]);
|
|
64
83
|
useEffect(() => {
|
|
65
84
|
return () => {
|
|
66
|
-
|
|
85
|
+
if (options.live) {
|
|
86
|
+
client.unsubscribe();
|
|
87
|
+
} else {
|
|
88
|
+
client.stop();
|
|
89
|
+
}
|
|
67
90
|
};
|
|
68
|
-
}, [client]);
|
|
91
|
+
}, [client, options.live]);
|
|
69
92
|
const sendMessage = useCallback(
|
|
70
93
|
async (content) => {
|
|
71
94
|
await client.sendMessage(content);
|
|
@@ -114,6 +137,9 @@ function useChat(options) {
|
|
|
114
137
|
isLoading,
|
|
115
138
|
error,
|
|
116
139
|
status,
|
|
140
|
+
isSubscribed,
|
|
141
|
+
connectionStatus,
|
|
142
|
+
sessionGenerating,
|
|
117
143
|
setMessages: setMessagesManually,
|
|
118
144
|
clear,
|
|
119
145
|
addToolResult,
|
package/dist/esm/use-chat.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-chat.js","sources":["../../src/use-chat.ts"],"sourcesContent":["import { ChatClient } from '@tanstack/ai-client'\nimport { useCallback, useEffect, useId, useMemo, useRef, useState } from 'react'\nimport type { AnyClientTool, ModelMessage } from '@tanstack/ai'\nimport type { ChatClientState } from '@tanstack/ai-client'\n\nimport type {\n MultimodalContent,\n UIMessage,\n UseChatOptions,\n UseChatReturn,\n} from './types'\n\nexport function useChat<TTools extends ReadonlyArray<AnyClientTool> = any>(\n options: UseChatOptions<TTools>,\n): UseChatReturn<TTools> {\n const hookId = useId()\n const clientId = options.id || hookId\n\n const [messages, setMessages] = useState<Array<UIMessage<TTools>>>(\n options.initialMessages || [],\n )\n const [isLoading, setIsLoading] = useState(false)\n const [error, setError] = useState<Error | undefined>(undefined)\n const [status, setStatus] = useState<ChatClientState>('ready')\n\n // Track current messages in a ref to preserve them when client is recreated\n const messagesRef = useRef<Array<UIMessage<TTools>>>(\n options.initialMessages || [],\n )\n const isFirstMountRef = useRef(true)\n\n // Update ref whenever messages change\n useEffect(() => {\n messagesRef.current = messages\n }, [messages])\n\n // Track current options in a ref to avoid recreating client when options change\n const optionsRef = useRef<UseChatOptions<TTools>>(options)\n optionsRef.current = options\n\n // Create ChatClient instance with callbacks to sync state\n // Note: Options are captured at client creation time.\n // The connection adapter can use functions for dynamic values (url, headers, etc.)\n // which are evaluated lazily on each request.\n const client = useMemo(() => {\n // On first mount, use initialMessages. On subsequent recreations, preserve existing messages.\n const messagesToUse = isFirstMountRef.current\n ? options.initialMessages || []\n : messagesRef.current\n\n isFirstMountRef.current = false\n\n return new ChatClient({\n connection: optionsRef.current.connection,\n id: clientId,\n initialMessages: messagesToUse,\n body: optionsRef.current.body,\n onResponse: optionsRef.current.onResponse,\n onChunk: optionsRef.current.onChunk,\n onFinish: (message: UIMessage<TTools>) => {\n optionsRef.current.onFinish?.(message)\n },\n onError: (error: Error) => {\n optionsRef.current.onError?.(error)\n },\n tools: optionsRef.current.tools,\n onCustomEvent: optionsRef.current.onCustomEvent,\n streamProcessor: options.streamProcessor,\n onMessagesChange: (newMessages: Array<UIMessage<TTools>>) => {\n setMessages(newMessages)\n },\n onLoadingChange: (newIsLoading: boolean) => {\n setIsLoading(newIsLoading)\n },\n onErrorChange: (newError: Error | undefined) => {\n setError(newError)\n },\n onStatusChange: (status: ChatClientState) => {\n setStatus(status)\n },\n })\n }, [clientId])\n\n // Sync body changes to the client\n // This allows dynamic body values (like model selection) to be updated without recreating the client\n useEffect(() => {\n client.updateOptions({ body: options.body })\n }, [client, options.body])\n\n // Sync initial messages on mount only\n // Note: initialMessages are passed to ChatClient constructor, but we also\n // set them here to ensure React state is in sync\n useEffect(() => {\n if (options.initialMessages && options.initialMessages.length > 0) {\n // Only set if current messages are empty (initial state)\n if (messages.length === 0) {\n client.setMessagesManually(options.initialMessages)\n }\n }\n }, []) // Only run on mount - initialMessages are handled by ChatClient constructor\n\n // Cleanup on unmount: stop any in-flight requests\n // Note: We only cleanup when client changes or component unmounts.\n // DO NOT include isLoading in dependencies - that would cause the cleanup\n // to run when isLoading changes, aborting continuation requests.\n useEffect(() => {\n return () => {\n //
|
|
1
|
+
{"version":3,"file":"use-chat.js","sources":["../../src/use-chat.ts"],"sourcesContent":["import { ChatClient } from '@tanstack/ai-client'\nimport { useCallback, useEffect, useId, useMemo, useRef, useState } from 'react'\nimport type { AnyClientTool, ModelMessage } from '@tanstack/ai'\nimport type { ChatClientState, ConnectionStatus } from '@tanstack/ai-client'\n\nimport type {\n MultimodalContent,\n UIMessage,\n UseChatOptions,\n UseChatReturn,\n} from './types'\n\nexport function useChat<TTools extends ReadonlyArray<AnyClientTool> = any>(\n options: UseChatOptions<TTools>,\n): UseChatReturn<TTools> {\n const hookId = useId()\n const clientId = options.id || hookId\n\n const [messages, setMessages] = useState<Array<UIMessage<TTools>>>(\n options.initialMessages || [],\n )\n const [isLoading, setIsLoading] = useState(false)\n const [error, setError] = useState<Error | undefined>(undefined)\n const [status, setStatus] = useState<ChatClientState>('ready')\n const [isSubscribed, setIsSubscribed] = useState(false)\n const [connectionStatus, setConnectionStatus] =\n useState<ConnectionStatus>('disconnected')\n const [sessionGenerating, setSessionGenerating] = useState(false)\n\n // Track current messages in a ref to preserve them when client is recreated\n const messagesRef = useRef<Array<UIMessage<TTools>>>(\n options.initialMessages || [],\n )\n const isFirstMountRef = useRef(true)\n\n // Update ref whenever messages change\n useEffect(() => {\n messagesRef.current = messages\n }, [messages])\n\n // Track current options in a ref to avoid recreating client when options change\n const optionsRef = useRef<UseChatOptions<TTools>>(options)\n optionsRef.current = options\n\n // Create ChatClient instance with callbacks to sync state\n // Note: Options are captured at client creation time.\n // The connection adapter can use functions for dynamic values (url, headers, etc.)\n // which are evaluated lazily on each request.\n const client = useMemo(() => {\n // On first mount, use initialMessages. On subsequent recreations, preserve existing messages.\n const messagesToUse = isFirstMountRef.current\n ? options.initialMessages || []\n : messagesRef.current\n\n isFirstMountRef.current = false\n\n return new ChatClient({\n connection: optionsRef.current.connection,\n id: clientId,\n initialMessages: messagesToUse,\n body: optionsRef.current.body,\n onResponse: optionsRef.current.onResponse,\n onChunk: optionsRef.current.onChunk,\n onFinish: (message: UIMessage<TTools>) => {\n optionsRef.current.onFinish?.(message)\n },\n onError: (error: Error) => {\n optionsRef.current.onError?.(error)\n },\n tools: optionsRef.current.tools,\n onCustomEvent: optionsRef.current.onCustomEvent,\n streamProcessor: options.streamProcessor,\n onMessagesChange: (newMessages: Array<UIMessage<TTools>>) => {\n setMessages(newMessages)\n },\n onLoadingChange: (newIsLoading: boolean) => {\n setIsLoading(newIsLoading)\n },\n onErrorChange: (newError: Error | undefined) => {\n setError(newError)\n },\n onStatusChange: (status: ChatClientState) => {\n setStatus(status)\n },\n onSubscriptionChange: (nextIsSubscribed: boolean) => {\n setIsSubscribed(nextIsSubscribed)\n },\n onConnectionStatusChange: (nextStatus: ConnectionStatus) => {\n setConnectionStatus(nextStatus)\n },\n onSessionGeneratingChange: (isGenerating: boolean) => {\n setSessionGenerating(isGenerating)\n },\n })\n }, [clientId])\n\n // Sync body changes to the client\n // This allows dynamic body values (like model selection) to be updated without recreating the client\n useEffect(() => {\n client.updateOptions({ body: options.body })\n }, [client, options.body])\n\n // Sync initial messages on mount only\n // Note: initialMessages are passed to ChatClient constructor, but we also\n // set them here to ensure React state is in sync\n useEffect(() => {\n if (options.initialMessages && options.initialMessages.length > 0) {\n // Only set if current messages are empty (initial state)\n if (messages.length === 0) {\n client.setMessagesManually(options.initialMessages)\n }\n }\n }, []) // Only run on mount - initialMessages are handled by ChatClient constructor\n\n // Keep connection lifecycle opt-in and explicit.\n useEffect(() => {\n if (options.live) {\n client.subscribe()\n } else {\n client.unsubscribe()\n }\n }, [client, options.live])\n\n // Cleanup on unmount: stop any in-flight requests\n // Note: We only cleanup when client changes or component unmounts.\n // DO NOT include isLoading in dependencies - that would cause the cleanup\n // to run when isLoading changes, aborting continuation requests.\n useEffect(() => {\n return () => {\n // live mode owns the connection lifecycle; non-live keeps request-only stop.\n if (options.live) {\n client.unsubscribe()\n } else {\n client.stop()\n }\n }\n }, [client, options.live])\n\n // Note: Callback options (onResponse, onChunk, onFinish, onError, onToolCall)\n // are captured at client creation time. Changes to these callbacks require\n // remounting the component or changing the connection to recreate the client.\n\n const sendMessage = useCallback(\n async (content: string | MultimodalContent) => {\n await client.sendMessage(content)\n },\n [client],\n )\n\n const append = useCallback(\n async (message: ModelMessage | UIMessage) => {\n await client.append(message)\n },\n [client],\n )\n\n const reload = useCallback(async () => {\n await client.reload()\n }, [client])\n\n const stop = useCallback(() => {\n client.stop()\n }, [client])\n\n const clear = useCallback(() => {\n client.clear()\n }, [client])\n\n const setMessagesManually = useCallback(\n (newMessages: Array<UIMessage<TTools>>) => {\n client.setMessagesManually(newMessages)\n },\n [client],\n )\n\n const addToolResult = useCallback(\n async (result: {\n toolCallId: string\n tool: string\n output: any\n state?: 'output-available' | 'output-error'\n errorText?: string\n }) => {\n await client.addToolResult(result)\n },\n [client],\n )\n\n const addToolApprovalResponse = useCallback(\n async (response: { id: string; approved: boolean }) => {\n await client.addToolApprovalResponse(response)\n },\n [client],\n )\n\n return {\n messages,\n sendMessage,\n append,\n reload,\n stop,\n isLoading,\n error,\n status,\n isSubscribed,\n connectionStatus,\n sessionGenerating,\n setMessages: setMessagesManually,\n clear,\n addToolResult,\n addToolApprovalResponse,\n }\n}\n"],"names":["error","status"],"mappings":";;AAYO,SAAS,QACd,SACuB;AACvB,QAAM,SAAS,MAAA;AACf,QAAM,WAAW,QAAQ,MAAM;AAE/B,QAAM,CAAC,UAAU,WAAW,IAAI;AAAA,IAC9B,QAAQ,mBAAmB,CAAA;AAAA,EAAC;AAE9B,QAAM,CAAC,WAAW,YAAY,IAAI,SAAS,KAAK;AAChD,QAAM,CAAC,OAAO,QAAQ,IAAI,SAA4B,MAAS;AAC/D,QAAM,CAAC,QAAQ,SAAS,IAAI,SAA0B,OAAO;AAC7D,QAAM,CAAC,cAAc,eAAe,IAAI,SAAS,KAAK;AACtD,QAAM,CAAC,kBAAkB,mBAAmB,IAC1C,SAA2B,cAAc;AAC3C,QAAM,CAAC,mBAAmB,oBAAoB,IAAI,SAAS,KAAK;AAGhE,QAAM,cAAc;AAAA,IAClB,QAAQ,mBAAmB,CAAA;AAAA,EAAC;AAE9B,QAAM,kBAAkB,OAAO,IAAI;AAGnC,YAAU,MAAM;AACd,gBAAY,UAAU;AAAA,EACxB,GAAG,CAAC,QAAQ,CAAC;AAGb,QAAM,aAAa,OAA+B,OAAO;AACzD,aAAW,UAAU;AAMrB,QAAM,SAAS,QAAQ,MAAM;AAE3B,UAAM,gBAAgB,gBAAgB,UAClC,QAAQ,mBAAmB,CAAA,IAC3B,YAAY;AAEhB,oBAAgB,UAAU;AAE1B,WAAO,IAAI,WAAW;AAAA,MACpB,YAAY,WAAW,QAAQ;AAAA,MAC/B,IAAI;AAAA,MACJ,iBAAiB;AAAA,MACjB,MAAM,WAAW,QAAQ;AAAA,MACzB,YAAY,WAAW,QAAQ;AAAA,MAC/B,SAAS,WAAW,QAAQ;AAAA,MAC5B,UAAU,CAAC,YAA+B;AACxC,mBAAW,QAAQ,WAAW,OAAO;AAAA,MACvC;AAAA,MACA,SAAS,CAACA,WAAiB;AACzB,mBAAW,QAAQ,UAAUA,MAAK;AAAA,MACpC;AAAA,MACA,OAAO,WAAW,QAAQ;AAAA,MAC1B,eAAe,WAAW,QAAQ;AAAA,MAClC,iBAAiB,QAAQ;AAAA,MACzB,kBAAkB,CAAC,gBAA0C;AAC3D,oBAAY,WAAW;AAAA,MACzB;AAAA,MACA,iBAAiB,CAAC,iBAA0B;AAC1C,qBAAa,YAAY;AAAA,MAC3B;AAAA,MACA,eAAe,CAAC,aAAgC;AAC9C,iBAAS,QAAQ;AAAA,MACnB;AAAA,MACA,gBAAgB,CAACC,YAA4B;AAC3C,kBAAUA,OAAM;AAAA,MAClB;AAAA,MACA,sBAAsB,CAAC,qBAA8B;AACnD,wBAAgB,gBAAgB;AAAA,MAClC;AAAA,MACA,0BAA0B,CAAC,eAAiC;AAC1D,4BAAoB,UAAU;AAAA,MAChC;AAAA,MACA,2BAA2B,CAAC,iBAA0B;AACpD,6BAAqB,YAAY;AAAA,MACnC;AAAA,IAAA,CACD;AAAA,EACH,GAAG,CAAC,QAAQ,CAAC;AAIb,YAAU,MAAM;AACd,WAAO,cAAc,EAAE,MAAM,QAAQ,MAAM;AAAA,EAC7C,GAAG,CAAC,QAAQ,QAAQ,IAAI,CAAC;AAKzB,YAAU,MAAM;AACd,QAAI,QAAQ,mBAAmB,QAAQ,gBAAgB,SAAS,GAAG;AAEjE,UAAI,SAAS,WAAW,GAAG;AACzB,eAAO,oBAAoB,QAAQ,eAAe;AAAA,MACpD;AAAA,IACF;AAAA,EACF,GAAG,CAAA,CAAE;AAGL,YAAU,MAAM;AACd,QAAI,QAAQ,MAAM;AAChB,aAAO,UAAA;AAAA,IACT,OAAO;AACL,aAAO,YAAA;AAAA,IACT;AAAA,EACF,GAAG,CAAC,QAAQ,QAAQ,IAAI,CAAC;AAMzB,YAAU,MAAM;AACd,WAAO,MAAM;AAEX,UAAI,QAAQ,MAAM;AAChB,eAAO,YAAA;AAAA,MACT,OAAO;AACL,eAAO,KAAA;AAAA,MACT;AAAA,IACF;AAAA,EACF,GAAG,CAAC,QAAQ,QAAQ,IAAI,CAAC;AAMzB,QAAM,cAAc;AAAA,IAClB,OAAO,YAAwC;AAC7C,YAAM,OAAO,YAAY,OAAO;AAAA,IAClC;AAAA,IACA,CAAC,MAAM;AAAA,EAAA;AAGT,QAAM,SAAS;AAAA,IACb,OAAO,YAAsC;AAC3C,YAAM,OAAO,OAAO,OAAO;AAAA,IAC7B;AAAA,IACA,CAAC,MAAM;AAAA,EAAA;AAGT,QAAM,SAAS,YAAY,YAAY;AACrC,UAAM,OAAO,OAAA;AAAA,EACf,GAAG,CAAC,MAAM,CAAC;AAEX,QAAM,OAAO,YAAY,MAAM;AAC7B,WAAO,KAAA;AAAA,EACT,GAAG,CAAC,MAAM,CAAC;AAEX,QAAM,QAAQ,YAAY,MAAM;AAC9B,WAAO,MAAA;AAAA,EACT,GAAG,CAAC,MAAM,CAAC;AAEX,QAAM,sBAAsB;AAAA,IAC1B,CAAC,gBAA0C;AACzC,aAAO,oBAAoB,WAAW;AAAA,IACxC;AAAA,IACA,CAAC,MAAM;AAAA,EAAA;AAGT,QAAM,gBAAgB;AAAA,IACpB,OAAO,WAMD;AACJ,YAAM,OAAO,cAAc,MAAM;AAAA,IACnC;AAAA,IACA,CAAC,MAAM;AAAA,EAAA;AAGT,QAAM,0BAA0B;AAAA,IAC9B,OAAO,aAAgD;AACrD,YAAM,OAAO,wBAAwB,QAAQ;AAAA,IAC/C;AAAA,IACA,CAAC,MAAM;AAAA,EAAA;AAGT,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,aAAa;AAAA,IACb;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAEJ;"}
|
|
@@ -1,18 +1,18 @@
|
|
|
1
1
|
import { ImageGenerationResult, StreamChunk } from '@tanstack/ai';
|
|
2
|
-
import {
|
|
2
|
+
import { ConnectConnectionAdapter, GenerationClientState, GenerationFetcher, ImageGenerateInput, InferGenerationOutput } from '@tanstack/ai-client';
|
|
3
3
|
/**
|
|
4
4
|
* Options for the useGenerateImage hook.
|
|
5
5
|
*
|
|
6
6
|
* @template TOutput - The output type after optional transform (defaults to ImageGenerationResult)
|
|
7
7
|
*/
|
|
8
8
|
export interface UseGenerateImageOptions<TOutput = ImageGenerationResult> {
|
|
9
|
-
/**
|
|
10
|
-
connection?:
|
|
9
|
+
/** Connect-based adapter for streaming transport (SSE, HTTP stream, custom) */
|
|
10
|
+
connection?: ConnectConnectionAdapter;
|
|
11
11
|
/** Direct async function for image generation */
|
|
12
12
|
fetcher?: GenerationFetcher<ImageGenerateInput, ImageGenerationResult>;
|
|
13
13
|
/** Unique identifier for this generation instance */
|
|
14
14
|
id?: string;
|
|
15
|
-
/** Additional body parameters to send with
|
|
15
|
+
/** Additional body parameters to send with connect-based adapter requests */
|
|
16
16
|
body?: Record<string, any>;
|
|
17
17
|
/**
|
|
18
18
|
* Callback when images are generated. Can optionally return a transformed value.
|
|
@@ -26,7 +26,7 @@ export interface UseGenerateImageOptions<TOutput = ImageGenerationResult> {
|
|
|
26
26
|
onError?: (error: Error) => void;
|
|
27
27
|
/** Callback when progress is reported (0-100) */
|
|
28
28
|
onProgress?: (progress: number, message?: string) => void;
|
|
29
|
-
/** Callback for each stream chunk (
|
|
29
|
+
/** Callback for each stream chunk (connect-based adapter mode only) */
|
|
30
30
|
onChunk?: (chunk: StreamChunk) => void;
|
|
31
31
|
}
|
|
32
32
|
/**
|
|
@@ -54,7 +54,7 @@ export interface UseGenerateImageReturn<TOutput = ImageGenerationResult> {
|
|
|
54
54
|
* React hook for generating images using AI models.
|
|
55
55
|
*
|
|
56
56
|
* Supports two transport modes:
|
|
57
|
-
* - **
|
|
57
|
+
* - **ConnectConnectionAdapter** — Streaming transport (SSE, HTTP stream, custom)
|
|
58
58
|
* - **Fetcher** — Direct async function call
|
|
59
59
|
*
|
|
60
60
|
* @example
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-generate-image.js","sources":["../../src/use-generate-image.ts"],"sourcesContent":["import { useGeneration } from './use-generation'\nimport type { ImageGenerationResult, StreamChunk } from '@tanstack/ai'\nimport type {\n
|
|
1
|
+
{"version":3,"file":"use-generate-image.js","sources":["../../src/use-generate-image.ts"],"sourcesContent":["import { useGeneration } from './use-generation'\nimport type { ImageGenerationResult, StreamChunk } from '@tanstack/ai'\nimport type {\n ConnectConnectionAdapter,\n GenerationClientState,\n GenerationFetcher,\n ImageGenerateInput,\n InferGenerationOutput,\n} from '@tanstack/ai-client'\n\n/**\n * Options for the useGenerateImage hook.\n *\n * @template TOutput - The output type after optional transform (defaults to ImageGenerationResult)\n */\nexport interface UseGenerateImageOptions<TOutput = ImageGenerationResult> {\n /** Connect-based adapter for streaming transport (SSE, HTTP stream, custom) */\n connection?: ConnectConnectionAdapter\n /** Direct async function for image generation */\n fetcher?: GenerationFetcher<ImageGenerateInput, ImageGenerationResult>\n /** Unique identifier for this generation instance */\n id?: string\n /** Additional body parameters to send with connect-based adapter requests */\n body?: Record<string, any>\n /**\n * Callback when images are generated. Can optionally return a transformed value.\n *\n * - Return a non-null value to transform and store it as the result\n * - Return `null` to keep the previous result unchanged\n * - Return nothing (`void`) to store the raw result as-is\n */\n onResult?: (result: ImageGenerationResult) => TOutput | null | void\n /** Callback when an error occurs */\n onError?: (error: Error) => void\n /** Callback when progress is reported (0-100) */\n onProgress?: (progress: number, message?: string) => void\n /** Callback for each stream chunk (connect-based adapter mode only) */\n onChunk?: (chunk: StreamChunk) => void\n}\n\n/**\n * Return type for the useGenerateImage hook.\n *\n * @template TOutput - The output type (after optional transform)\n */\nexport interface UseGenerateImageReturn<TOutput = ImageGenerationResult> {\n /** Trigger image generation */\n generate: (input: ImageGenerateInput) => Promise<void>\n /** The generation result containing images, or null */\n result: TOutput | null\n /** Whether generation is in progress */\n isLoading: boolean\n /** Current error, if any */\n error: Error | undefined\n /** Current state of the generation */\n status: GenerationClientState\n /** Abort the current generation */\n stop: () => void\n /** Clear result, error, and return to idle */\n reset: () => void\n}\n\n/**\n * React hook for generating images using AI models.\n *\n * Supports two transport modes:\n * - **ConnectConnectionAdapter** — Streaming transport (SSE, HTTP stream, custom)\n * - **Fetcher** — Direct async function call\n *\n * @example\n * ```tsx\n * import { useGenerateImage } from '@tanstack/ai-react'\n * import { fetchServerSentEvents } from '@tanstack/ai-client'\n *\n * function ImageGenerator() {\n * const { generate, result, isLoading, error, reset } = useGenerateImage({\n * connection: fetchServerSentEvents('/api/generate/image'),\n * })\n *\n * return (\n * <div>\n * <button onClick={() => generate({ prompt: 'A sunset over mountains' })}>\n * Generate\n * </button>\n * {isLoading && <p>Generating...</p>}\n * {error && <p>Error: {error.message}</p>}\n * {result?.images.map((img, i) => (\n * <img key={i} src={img.url || `data:image/png;base64,${img.b64Json}`} />\n * ))}\n * </div>\n * )\n * }\n * ```\n */\nexport function useGenerateImage<\n TOnResult extends ((result: ImageGenerationResult) => any) | undefined =\n undefined,\n>(\n options: Omit<UseGenerateImageOptions, 'onResult'> & {\n onResult?: TOnResult\n },\n): UseGenerateImageReturn<\n InferGenerationOutput<ImageGenerationResult, TOnResult>\n> {\n const { generate, result, isLoading, error, status, stop, reset } =\n useGeneration<ImageGenerateInput, ImageGenerationResult, TOnResult>(options)\n\n return {\n generate: generate as (input: ImageGenerateInput) => Promise<void>,\n result,\n isLoading,\n error,\n status,\n stop,\n reset,\n }\n}\n"],"names":[],"mappings":";AA8FO,SAAS,iBAId,SAKA;AACA,QAAM,EAAE,UAAU,QAAQ,WAAW,OAAO,QAAQ,MAAM,MAAA,IACxD,cAAoE,OAAO;AAE7E,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAEJ;"}
|
|
@@ -1,18 +1,18 @@
|
|
|
1
1
|
import { StreamChunk, TTSResult } from '@tanstack/ai';
|
|
2
|
-
import {
|
|
2
|
+
import { ConnectConnectionAdapter, GenerationClientState, GenerationFetcher, InferGenerationOutput, SpeechGenerateInput } from '@tanstack/ai-client';
|
|
3
3
|
/**
|
|
4
4
|
* Options for the useGenerateSpeech hook.
|
|
5
5
|
*
|
|
6
6
|
* @template TOutput - The output type after optional transform (defaults to TTSResult)
|
|
7
7
|
*/
|
|
8
8
|
export interface UseGenerateSpeechOptions<TOutput = TTSResult> {
|
|
9
|
-
/**
|
|
10
|
-
connection?:
|
|
9
|
+
/** Connect-based adapter for streaming transport (SSE, HTTP stream, custom) */
|
|
10
|
+
connection?: ConnectConnectionAdapter;
|
|
11
11
|
/** Direct async function for speech generation */
|
|
12
12
|
fetcher?: GenerationFetcher<SpeechGenerateInput, TTSResult>;
|
|
13
13
|
/** Unique identifier for this generation instance */
|
|
14
14
|
id?: string;
|
|
15
|
-
/** Additional body parameters to send with
|
|
15
|
+
/** Additional body parameters to send with connect-based adapter requests */
|
|
16
16
|
body?: Record<string, any>;
|
|
17
17
|
/**
|
|
18
18
|
* Callback when speech is generated. Can optionally return a transformed value.
|
|
@@ -26,7 +26,7 @@ export interface UseGenerateSpeechOptions<TOutput = TTSResult> {
|
|
|
26
26
|
onError?: (error: Error) => void;
|
|
27
27
|
/** Callback when progress is reported (0-100) */
|
|
28
28
|
onProgress?: (progress: number, message?: string) => void;
|
|
29
|
-
/** Callback for each stream chunk (
|
|
29
|
+
/** Callback for each stream chunk (connect-based adapter mode only) */
|
|
30
30
|
onChunk?: (chunk: StreamChunk) => void;
|
|
31
31
|
}
|
|
32
32
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-generate-speech.js","sources":["../../src/use-generate-speech.ts"],"sourcesContent":["import { useGeneration } from './use-generation'\nimport type { StreamChunk, TTSResult } from '@tanstack/ai'\nimport type {\n
|
|
1
|
+
{"version":3,"file":"use-generate-speech.js","sources":["../../src/use-generate-speech.ts"],"sourcesContent":["import { useGeneration } from './use-generation'\nimport type { StreamChunk, TTSResult } from '@tanstack/ai'\nimport type {\n ConnectConnectionAdapter,\n GenerationClientState,\n GenerationFetcher,\n InferGenerationOutput,\n SpeechGenerateInput,\n} from '@tanstack/ai-client'\n\n/**\n * Options for the useGenerateSpeech hook.\n *\n * @template TOutput - The output type after optional transform (defaults to TTSResult)\n */\nexport interface UseGenerateSpeechOptions<TOutput = TTSResult> {\n /** Connect-based adapter for streaming transport (SSE, HTTP stream, custom) */\n connection?: ConnectConnectionAdapter\n /** Direct async function for speech generation */\n fetcher?: GenerationFetcher<SpeechGenerateInput, TTSResult>\n /** Unique identifier for this generation instance */\n id?: string\n /** Additional body parameters to send with connect-based adapter requests */\n body?: Record<string, any>\n /**\n * Callback when speech is generated. Can optionally return a transformed value.\n *\n * - Return a non-null value to transform and store it as the result\n * - Return `null` to keep the previous result unchanged\n * - Return nothing (`void`) to store the raw result as-is\n */\n onResult?: (result: TTSResult) => TOutput | null | void\n /** Callback when an error occurs */\n onError?: (error: Error) => void\n /** Callback when progress is reported (0-100) */\n onProgress?: (progress: number, message?: string) => void\n /** Callback for each stream chunk (connect-based adapter mode only) */\n onChunk?: (chunk: StreamChunk) => void\n}\n\n/**\n * Return type for the useGenerateSpeech hook.\n *\n * @template TOutput - The output type (after optional transform)\n */\nexport interface UseGenerateSpeechReturn<TOutput = TTSResult> {\n /** Trigger speech generation */\n generate: (input: SpeechGenerateInput) => Promise<void>\n /** The TTS result containing audio data, or null */\n result: TOutput | null\n /** Whether generation is in progress */\n isLoading: boolean\n /** Current error, if any */\n error: Error | undefined\n /** Current state of the generation */\n status: GenerationClientState\n /** Abort the current generation */\n stop: () => void\n /** Clear result, error, and return to idle */\n reset: () => void\n}\n\n/**\n * React hook for generating speech (text-to-speech) using AI models.\n *\n * @example\n * ```tsx\n * import { useGenerateSpeech } from '@tanstack/ai-react'\n * import { fetchServerSentEvents } from '@tanstack/ai-client'\n *\n * function SpeechGenerator() {\n * const { generate, result, isLoading } = useGenerateSpeech({\n * connection: fetchServerSentEvents('/api/generate/speech'),\n * })\n *\n * return (\n * <div>\n * <button onClick={() => generate({ text: 'Hello world', voice: 'alloy' })}>\n * Generate Speech\n * </button>\n * {result && (\n * <audio src={`data:audio/${result.format};base64,${result.audio}`} controls />\n * )}\n * </div>\n * )\n * }\n * ```\n */\nexport function useGenerateSpeech<\n TOnResult extends ((result: TTSResult) => any) | undefined = undefined,\n>(\n options: Omit<UseGenerateSpeechOptions, 'onResult'> & {\n onResult?: TOnResult\n },\n): UseGenerateSpeechReturn<InferGenerationOutput<TTSResult, TOnResult>> {\n const { generate, result, isLoading, error, status, stop, reset } =\n useGeneration<SpeechGenerateInput, TTSResult, TOnResult>(options)\n\n return {\n generate: generate as (input: SpeechGenerateInput) => Promise<void>,\n result,\n isLoading,\n error,\n status,\n stop,\n reset,\n }\n}\n"],"names":[],"mappings":";AAwFO,SAAS,kBAGd,SAGsE;AACtE,QAAM,EAAE,UAAU,QAAQ,WAAW,OAAO,QAAQ,MAAM,MAAA,IACxD,cAAyD,OAAO;AAElE,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAEJ;"}
|
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
import { StreamChunk } from '@tanstack/ai';
|
|
2
|
-
import {
|
|
2
|
+
import { ConnectConnectionAdapter, GenerationClientState, GenerationFetcher, InferGenerationOutput, VideoGenerateInput, VideoGenerateResult, VideoStatusInfo } from '@tanstack/ai-client';
|
|
3
3
|
/**
|
|
4
4
|
* Options for the useGenerateVideo hook.
|
|
5
5
|
*/
|
|
6
6
|
export interface UseGenerateVideoOptions<TOutput = VideoGenerateResult> {
|
|
7
|
-
/**
|
|
8
|
-
connection?:
|
|
7
|
+
/** Connect-based adapter for streaming transport (server handles polling) */
|
|
8
|
+
connection?: ConnectConnectionAdapter;
|
|
9
9
|
/** Direct async function that returns a completed video result */
|
|
10
10
|
fetcher?: GenerationFetcher<VideoGenerateInput, VideoGenerateResult>;
|
|
11
11
|
/** Unique identifier for this generation instance */
|
|
12
12
|
id?: string;
|
|
13
|
-
/** Additional body parameters to send with
|
|
13
|
+
/** Additional body parameters to send with connect-based adapter requests */
|
|
14
14
|
body?: Record<string, any>;
|
|
15
15
|
/**
|
|
16
16
|
* Callback when video generation completes. Can optionally return a transformed value.
|
|
@@ -28,7 +28,7 @@ export interface UseGenerateVideoOptions<TOutput = VideoGenerateResult> {
|
|
|
28
28
|
onJobCreated?: (jobId: string) => void;
|
|
29
29
|
/** Callback on each status update */
|
|
30
30
|
onStatusUpdate?: (status: VideoStatusInfo) => void;
|
|
31
|
-
/** Callback for each stream chunk (
|
|
31
|
+
/** Callback for each stream chunk (connect-based adapter mode only) */
|
|
32
32
|
onChunk?: (chunk: StreamChunk) => void;
|
|
33
33
|
}
|
|
34
34
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-generate-video.js","sources":["../../src/use-generate-video.ts"],"sourcesContent":["import { VideoGenerationClient } from '@tanstack/ai-client'\nimport { useCallback, useEffect, useId, useMemo, useRef, useState } from 'react'\nimport type { StreamChunk } from '@tanstack/ai'\nimport type {\n
|
|
1
|
+
{"version":3,"file":"use-generate-video.js","sources":["../../src/use-generate-video.ts"],"sourcesContent":["import { VideoGenerationClient } from '@tanstack/ai-client'\nimport { useCallback, useEffect, useId, useMemo, useRef, useState } from 'react'\nimport type { StreamChunk } from '@tanstack/ai'\nimport type {\n ConnectConnectionAdapter,\n GenerationClientState,\n GenerationFetcher,\n InferGenerationOutput,\n VideoGenerateInput,\n VideoGenerateResult,\n VideoStatusInfo,\n} from '@tanstack/ai-client'\n\n/**\n * Options for the useGenerateVideo hook.\n */\nexport interface UseGenerateVideoOptions<TOutput = VideoGenerateResult> {\n /** Connect-based adapter for streaming transport (server handles polling) */\n connection?: ConnectConnectionAdapter\n /** Direct async function that returns a completed video result */\n fetcher?: GenerationFetcher<VideoGenerateInput, VideoGenerateResult>\n /** Unique identifier for this generation instance */\n id?: string\n /** Additional body parameters to send with connect-based adapter requests */\n body?: Record<string, any>\n /**\n * Callback when video generation completes. Can optionally return a transformed value.\n *\n * - Return a non-null value to transform and store it as the result\n * - Return `null` to keep the previous result unchanged\n * - Return nothing (`void`) to store the raw result as-is\n */\n onResult?: (result: VideoGenerateResult) => TOutput | null | void\n /** Callback when an error occurs */\n onError?: (error: Error) => void\n /** Callback when progress is reported (0-100) */\n onProgress?: (progress: number, message?: string) => void\n /** Callback when a video job is created */\n onJobCreated?: (jobId: string) => void\n /** Callback on each status update */\n onStatusUpdate?: (status: VideoStatusInfo) => void\n /** Callback for each stream chunk (connect-based adapter mode only) */\n onChunk?: (chunk: StreamChunk) => void\n}\n\n/**\n * Return type for the useGenerateVideo hook.\n *\n * @template TOutput - The output type (after optional transform)\n */\nexport interface UseGenerateVideoReturn<TOutput = VideoGenerateResult> {\n /** Trigger video generation */\n generate: (input: VideoGenerateInput) => Promise<void>\n /** The final video result (with URL), or null */\n result: TOutput | null\n /** The current job ID, or null */\n jobId: string | null\n /** Current video generation status info, or null */\n videoStatus: VideoStatusInfo | null\n /** Whether generation/polling is in progress */\n isLoading: boolean\n /** Current error, if any */\n error: Error | undefined\n /** Current state of the generation */\n status: GenerationClientState\n /** Abort the current generation/polling */\n stop: () => void\n /** Clear all state and return to idle */\n reset: () => void\n}\n\n/**\n * React hook for generating videos using AI models.\n *\n * Video generation is asynchronous: a job is created, then polled for status\n * until completion. This hook handles the full lifecycle.\n *\n * @example\n * ```tsx\n * import { useGenerateVideo } from '@tanstack/ai-react'\n * import { fetchServerSentEvents } from '@tanstack/ai-client'\n *\n * function VideoGenerator() {\n * const { generate, result, videoStatus, isLoading } = useGenerateVideo({\n * connection: fetchServerSentEvents('/api/generate/video'),\n * onStatusUpdate: (status) => console.log(`Progress: ${status.progress}%`),\n * })\n *\n * return (\n * <div>\n * <button onClick={() => generate({ prompt: 'A flying car over a city' })}>\n * Generate Video\n * </button>\n * {isLoading && videoStatus && (\n * <p>Status: {videoStatus.status} ({videoStatus.progress}%)</p>\n * )}\n * {result && <video src={result.url} controls />}\n * </div>\n * )\n * }\n * ```\n */\nexport function useGenerateVideo<\n TOnResult extends ((result: VideoGenerateResult) => any) | undefined =\n undefined,\n>(\n options: Omit<UseGenerateVideoOptions, 'onResult'> & {\n onResult?: TOnResult\n },\n): UseGenerateVideoReturn<\n InferGenerationOutput<VideoGenerateResult, TOnResult>\n> {\n type TOutput = InferGenerationOutput<VideoGenerateResult, TOnResult>\n const hookId = useId()\n const clientId = options.id || hookId\n\n const [result, setResult] = useState<TOutput | null>(null)\n const [jobId, setJobId] = useState<string | null>(null)\n const [videoStatus, setVideoStatus] = useState<VideoStatusInfo | null>(null)\n const [isLoading, setIsLoading] = useState(false)\n const [error, setError] = useState<Error | undefined>(undefined)\n const [status, setStatus] = useState<GenerationClientState>('idle')\n\n const optionsRef = useRef(options)\n optionsRef.current = options\n\n const client = useMemo(() => {\n const opts = optionsRef.current\n\n const baseOptions = {\n id: clientId,\n body: opts.body,\n onResult: (r: VideoGenerateResult) => optionsRef.current.onResult?.(r),\n onError: (e: Error) => optionsRef.current.onError?.(e),\n onProgress: (p: number, m?: string) =>\n optionsRef.current.onProgress?.(p, m),\n onChunk: (c: StreamChunk) => optionsRef.current.onChunk?.(c),\n onJobCreated: (id: string) => optionsRef.current.onJobCreated?.(id),\n onStatusUpdate: (s: VideoStatusInfo) =>\n optionsRef.current.onStatusUpdate?.(s),\n onResultChange: setResult,\n onLoadingChange: setIsLoading,\n onErrorChange: setError,\n onStatusChange: setStatus,\n onJobIdChange: setJobId,\n onVideoStatusChange: setVideoStatus,\n }\n\n if (opts.connection) {\n return new VideoGenerationClient<TOutput>({\n ...baseOptions,\n connection: opts.connection,\n })\n }\n\n if (opts.fetcher) {\n return new VideoGenerationClient<TOutput>({\n ...baseOptions,\n fetcher: opts.fetcher,\n })\n }\n\n throw new Error(\n 'useGenerateVideo requires either a connection or fetcher option',\n )\n }, [clientId])\n\n // Sync body changes without recreating client\n useEffect(() => {\n client.updateOptions({ body: options.body })\n }, [client, options.body])\n\n // Cleanup on unmount\n useEffect(() => {\n return () => {\n client.stop()\n }\n }, [client])\n\n const generate = useCallback(\n async (input: VideoGenerateInput) => {\n await client.generate(input)\n },\n [client],\n )\n\n const stop = useCallback(() => {\n client.stop()\n }, [client])\n\n const reset = useCallback(() => {\n client.reset()\n }, [client])\n\n return {\n generate,\n result,\n jobId,\n videoStatus,\n isLoading,\n error,\n status,\n stop,\n reset,\n }\n}\n"],"names":[],"mappings":";;AAsGO,SAAS,iBAId,SAKA;AAEA,QAAM,SAAS,MAAA;AACf,QAAM,WAAW,QAAQ,MAAM;AAE/B,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAyB,IAAI;AACzD,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAwB,IAAI;AACtD,QAAM,CAAC,aAAa,cAAc,IAAI,SAAiC,IAAI;AAC3E,QAAM,CAAC,WAAW,YAAY,IAAI,SAAS,KAAK;AAChD,QAAM,CAAC,OAAO,QAAQ,IAAI,SAA4B,MAAS;AAC/D,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAgC,MAAM;AAElE,QAAM,aAAa,OAAO,OAAO;AACjC,aAAW,UAAU;AAErB,QAAM,SAAS,QAAQ,MAAM;AAC3B,UAAM,OAAO,WAAW;AAExB,UAAM,cAAc;AAAA,MAClB,IAAI;AAAA,MACJ,MAAM,KAAK;AAAA,MACX,UAAU,CAAC,MAA2B,WAAW,QAAQ,WAAW,CAAC;AAAA,MACrE,SAAS,CAAC,MAAa,WAAW,QAAQ,UAAU,CAAC;AAAA,MACrD,YAAY,CAAC,GAAW,MACtB,WAAW,QAAQ,aAAa,GAAG,CAAC;AAAA,MACtC,SAAS,CAAC,MAAmB,WAAW,QAAQ,UAAU,CAAC;AAAA,MAC3D,cAAc,CAAC,OAAe,WAAW,QAAQ,eAAe,EAAE;AAAA,MAClE,gBAAgB,CAAC,MACf,WAAW,QAAQ,iBAAiB,CAAC;AAAA,MACvC,gBAAgB;AAAA,MAChB,iBAAiB;AAAA,MACjB,eAAe;AAAA,MACf,gBAAgB;AAAA,MAChB,eAAe;AAAA,MACf,qBAAqB;AAAA,IAAA;AAGvB,QAAI,KAAK,YAAY;AACnB,aAAO,IAAI,sBAA+B;AAAA,QACxC,GAAG;AAAA,QACH,YAAY,KAAK;AAAA,MAAA,CAClB;AAAA,IACH;AAEA,QAAI,KAAK,SAAS;AAChB,aAAO,IAAI,sBAA+B;AAAA,QACxC,GAAG;AAAA,QACH,SAAS,KAAK;AAAA,MAAA,CACf;AAAA,IACH;AAEA,UAAM,IAAI;AAAA,MACR;AAAA,IAAA;AAAA,EAEJ,GAAG,CAAC,QAAQ,CAAC;AAGb,YAAU,MAAM;AACd,WAAO,cAAc,EAAE,MAAM,QAAQ,MAAM;AAAA,EAC7C,GAAG,CAAC,QAAQ,QAAQ,IAAI,CAAC;AAGzB,YAAU,MAAM;AACd,WAAO,MAAM;AACX,aAAO,KAAA;AAAA,IACT;AAAA,EACF,GAAG,CAAC,MAAM,CAAC;AAEX,QAAM,WAAW;AAAA,IACf,OAAO,UAA8B;AACnC,YAAM,OAAO,SAAS,KAAK;AAAA,IAC7B;AAAA,IACA,CAAC,MAAM;AAAA,EAAA;AAGT,QAAM,OAAO,YAAY,MAAM;AAC7B,WAAO,KAAA;AAAA,EACT,GAAG,CAAC,MAAM,CAAC;AAEX,QAAM,QAAQ,YAAY,MAAM;AAC9B,WAAO,MAAA;AAAA,EACT,GAAG,CAAC,MAAM,CAAC;AAEX,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAEJ;"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { StreamChunk } from '@tanstack/ai';
|
|
2
|
-
import {
|
|
2
|
+
import { ConnectConnectionAdapter, GenerationClientState, GenerationFetcher, InferGenerationOutput } from '@tanstack/ai-client';
|
|
3
3
|
/**
|
|
4
4
|
* Options for the useGeneration hook.
|
|
5
5
|
*
|
|
@@ -10,13 +10,13 @@ import { ConnectionAdapter, GenerationClientState, GenerationFetcher, InferGener
|
|
|
10
10
|
* @template TOutput - The output type after optional transform (defaults to TResult)
|
|
11
11
|
*/
|
|
12
12
|
export interface UseGenerationOptions<TInput, TResult, TOutput = TResult> {
|
|
13
|
-
/**
|
|
14
|
-
connection?:
|
|
13
|
+
/** Connect-based adapter for streaming transport (SSE, HTTP stream, custom) */
|
|
14
|
+
connection?: ConnectConnectionAdapter;
|
|
15
15
|
/** Direct async function for one-shot generation (no streaming protocol needed) */
|
|
16
16
|
fetcher?: GenerationFetcher<TInput, TResult>;
|
|
17
17
|
/** Unique identifier for this generation instance */
|
|
18
18
|
id?: string;
|
|
19
|
-
/** Additional body parameters to send with
|
|
19
|
+
/** Additional body parameters to send with connect-based adapter requests */
|
|
20
20
|
body?: Record<string, any>;
|
|
21
21
|
/**
|
|
22
22
|
* Callback when a result is received. Can optionally return a transformed value.
|
|
@@ -30,7 +30,7 @@ export interface UseGenerationOptions<TInput, TResult, TOutput = TResult> {
|
|
|
30
30
|
onError?: (error: Error) => void;
|
|
31
31
|
/** Callback when progress is reported (0-100) */
|
|
32
32
|
onProgress?: (progress: number, message?: string) => void;
|
|
33
|
-
/** Callback for each stream chunk (
|
|
33
|
+
/** Callback for each stream chunk (connect-based adapter mode only) */
|
|
34
34
|
onChunk?: (chunk: StreamChunk) => void;
|
|
35
35
|
}
|
|
36
36
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-generation.js","sources":["../../src/use-generation.ts"],"sourcesContent":["import { GenerationClient } from '@tanstack/ai-client'\nimport { useCallback, useEffect, useId, useMemo, useRef, useState } from 'react'\nimport type { StreamChunk } from '@tanstack/ai'\nimport type {\n
|
|
1
|
+
{"version":3,"file":"use-generation.js","sources":["../../src/use-generation.ts"],"sourcesContent":["import { GenerationClient } from '@tanstack/ai-client'\nimport { useCallback, useEffect, useId, useMemo, useRef, useState } from 'react'\nimport type { StreamChunk } from '@tanstack/ai'\nimport type {\n ConnectConnectionAdapter,\n GenerationClientOptions,\n GenerationClientState,\n GenerationFetcher,\n InferGenerationOutput,\n} from '@tanstack/ai-client'\n\n/**\n * Options for the useGeneration hook.\n *\n * Accepts either a `connection` (streaming transport) or a `fetcher` (direct async call).\n *\n * @template TInput - The input type for the generation request\n * @template TResult - The result type returned by the generation\n * @template TOutput - The output type after optional transform (defaults to TResult)\n */\nexport interface UseGenerationOptions<TInput, TResult, TOutput = TResult> {\n /** Connect-based adapter for streaming transport (SSE, HTTP stream, custom) */\n connection?: ConnectConnectionAdapter\n /** Direct async function for one-shot generation (no streaming protocol needed) */\n fetcher?: GenerationFetcher<TInput, TResult>\n /** Unique identifier for this generation instance */\n id?: string\n /** Additional body parameters to send with connect-based adapter requests */\n body?: Record<string, any>\n /**\n * Callback when a result is received. Can optionally return a transformed value.\n *\n * - Return a non-null value to transform and store it as the result\n * - Return `null` to keep the previous result unchanged\n * - Return nothing (`void`) to store the raw result as-is\n */\n onResult?: (result: TResult) => TOutput | null | void\n /** Callback when an error occurs */\n onError?: (error: Error) => void\n /** Callback when progress is reported (0-100) */\n onProgress?: (progress: number, message?: string) => void\n /** Callback for each stream chunk (connect-based adapter mode only) */\n onChunk?: (chunk: StreamChunk) => void\n}\n\n/**\n * Return type for the useGeneration hook.\n *\n * @template TOutput - The output type (after optional transform)\n */\nexport interface UseGenerationReturn<TOutput> {\n /** Trigger a generation request */\n generate: (input: Record<string, any>) => Promise<void>\n /** The generation result, or null if not yet generated */\n result: TOutput | null\n /** Whether a generation is currently in progress */\n isLoading: boolean\n /** Current error, if any */\n error: Error | undefined\n /** Current state of the generation client */\n status: GenerationClientState\n /** Abort the current generation */\n stop: () => void\n /** Clear result, error, and return to idle */\n reset: () => void\n}\n\n/**\n * Generic React hook for one-shot generation tasks.\n *\n * This is the base hook used by `useGenerateImage`, `useGenerateSpeech`,\n * `useTranscription`, and `useSummarize`. You can also use it directly\n * for custom generation types.\n *\n * @template TInput - The input type for the generation request\n * @template TResult - The result type returned by the generation\n *\n * @example\n * ```tsx\n * const { generate, result, isLoading } = useGeneration<MyInput, MyResult>({\n * connection: fetchServerSentEvents('/api/generate/custom'),\n * })\n *\n * await generate({ prompt: 'Hello' })\n * ```\n */\nexport function useGeneration<\n TInput extends Record<string, any>,\n TResult,\n TOnResult extends ((result: TResult) => any) | undefined = undefined,\n>(\n options: Omit<UseGenerationOptions<TInput, TResult>, 'onResult'> & {\n onResult?: TOnResult\n },\n): UseGenerationReturn<InferGenerationOutput<TResult, TOnResult>> {\n type TOutput = InferGenerationOutput<TResult, TOnResult>\n const hookId = useId()\n const clientId = options.id || hookId\n\n const [result, setResult] = useState<TOutput | null>(null)\n const [isLoading, setIsLoading] = useState(false)\n const [error, setError] = useState<Error | undefined>(undefined)\n const [status, setStatus] = useState<GenerationClientState>('idle')\n\n const optionsRef = useRef(options)\n optionsRef.current = options\n\n const client = useMemo(() => {\n const opts = optionsRef.current\n\n const clientOptions: GenerationClientOptions<TInput, TResult, TOutput> = {\n id: clientId,\n body: opts.body,\n onResult: (r: TResult) => optionsRef.current.onResult?.(r),\n onError: (e: Error) => optionsRef.current.onError?.(e),\n onProgress: (p: number, m?: string) =>\n optionsRef.current.onProgress?.(p, m),\n onChunk: (c: StreamChunk) => optionsRef.current.onChunk?.(c),\n onResultChange: setResult,\n onLoadingChange: setIsLoading,\n onErrorChange: setError,\n onStatusChange: setStatus,\n }\n\n if (opts.connection) {\n return new GenerationClient<TInput, TResult, TOutput>({\n ...clientOptions,\n connection: opts.connection,\n })\n }\n\n if (opts.fetcher) {\n return new GenerationClient<TInput, TResult, TOutput>({\n ...clientOptions,\n fetcher: opts.fetcher,\n })\n }\n\n throw new Error(\n 'useGeneration requires either a connection or fetcher option',\n )\n }, [clientId])\n\n // Sync body changes without recreating client\n useEffect(() => {\n client.updateOptions({ body: options.body })\n }, [client, options.body])\n\n // Cleanup on unmount\n useEffect(() => {\n return () => {\n client.stop()\n }\n }, [client])\n\n const generate = useCallback(\n async (input: TInput) => {\n await client.generate(input)\n },\n [client],\n )\n\n const stop = useCallback(() => {\n client.stop()\n }, [client])\n\n const reset = useCallback(() => {\n client.reset()\n }, [client])\n\n return {\n generate: generate as (input: Record<string, any>) => Promise<void>,\n result,\n isLoading,\n error,\n status,\n stop,\n reset,\n }\n}\n"],"names":[],"mappings":";;AAsFO,SAAS,cAKd,SAGgE;AAEhE,QAAM,SAAS,MAAA;AACf,QAAM,WAAW,QAAQ,MAAM;AAE/B,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAyB,IAAI;AACzD,QAAM,CAAC,WAAW,YAAY,IAAI,SAAS,KAAK;AAChD,QAAM,CAAC,OAAO,QAAQ,IAAI,SAA4B,MAAS;AAC/D,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAgC,MAAM;AAElE,QAAM,aAAa,OAAO,OAAO;AACjC,aAAW,UAAU;AAErB,QAAM,SAAS,QAAQ,MAAM;AAC3B,UAAM,OAAO,WAAW;AAExB,UAAM,gBAAmE;AAAA,MACvE,IAAI;AAAA,MACJ,MAAM,KAAK;AAAA,MACX,UAAU,CAAC,MAAe,WAAW,QAAQ,WAAW,CAAC;AAAA,MACzD,SAAS,CAAC,MAAa,WAAW,QAAQ,UAAU,CAAC;AAAA,MACrD,YAAY,CAAC,GAAW,MACtB,WAAW,QAAQ,aAAa,GAAG,CAAC;AAAA,MACtC,SAAS,CAAC,MAAmB,WAAW,QAAQ,UAAU,CAAC;AAAA,MAC3D,gBAAgB;AAAA,MAChB,iBAAiB;AAAA,MACjB,eAAe;AAAA,MACf,gBAAgB;AAAA,IAAA;AAGlB,QAAI,KAAK,YAAY;AACnB,aAAO,IAAI,iBAA2C;AAAA,QACpD,GAAG;AAAA,QACH,YAAY,KAAK;AAAA,MAAA,CAClB;AAAA,IACH;AAEA,QAAI,KAAK,SAAS;AAChB,aAAO,IAAI,iBAA2C;AAAA,QACpD,GAAG;AAAA,QACH,SAAS,KAAK;AAAA,MAAA,CACf;AAAA,IACH;AAEA,UAAM,IAAI;AAAA,MACR;AAAA,IAAA;AAAA,EAEJ,GAAG,CAAC,QAAQ,CAAC;AAGb,YAAU,MAAM;AACd,WAAO,cAAc,EAAE,MAAM,QAAQ,MAAM;AAAA,EAC7C,GAAG,CAAC,QAAQ,QAAQ,IAAI,CAAC;AAGzB,YAAU,MAAM;AACd,WAAO,MAAM;AACX,aAAO,KAAA;AAAA,IACT;AAAA,EACF,GAAG,CAAC,MAAM,CAAC;AAEX,QAAM,WAAW;AAAA,IACf,OAAO,UAAkB;AACvB,YAAM,OAAO,SAAS,KAAK;AAAA,IAC7B;AAAA,IACA,CAAC,MAAM;AAAA,EAAA;AAGT,QAAM,OAAO,YAAY,MAAM;AAC7B,WAAO,KAAA;AAAA,EACT,GAAG,CAAC,MAAM,CAAC;AAEX,QAAM,QAAQ,YAAY,MAAM;AAC9B,WAAO,MAAA;AAAA,EACT,GAAG,CAAC,MAAM,CAAC;AAEX,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAEJ;"}
|
|
@@ -1,18 +1,18 @@
|
|
|
1
1
|
import { StreamChunk, SummarizationResult } from '@tanstack/ai';
|
|
2
|
-
import {
|
|
2
|
+
import { ConnectConnectionAdapter, GenerationClientState, GenerationFetcher, InferGenerationOutput, SummarizeGenerateInput } from '@tanstack/ai-client';
|
|
3
3
|
/**
|
|
4
4
|
* Options for the useSummarize hook.
|
|
5
5
|
*
|
|
6
6
|
* @template TOutput - The output type after optional transform (defaults to SummarizationResult)
|
|
7
7
|
*/
|
|
8
8
|
export interface UseSummarizeOptions<TOutput = SummarizationResult> {
|
|
9
|
-
/**
|
|
10
|
-
connection?:
|
|
9
|
+
/** Connect-based adapter for streaming transport (SSE, HTTP stream, custom) */
|
|
10
|
+
connection?: ConnectConnectionAdapter;
|
|
11
11
|
/** Direct async function for summarization */
|
|
12
12
|
fetcher?: GenerationFetcher<SummarizeGenerateInput, SummarizationResult>;
|
|
13
13
|
/** Unique identifier for this generation instance */
|
|
14
14
|
id?: string;
|
|
15
|
-
/** Additional body parameters to send with
|
|
15
|
+
/** Additional body parameters to send with connect-based adapter requests */
|
|
16
16
|
body?: Record<string, any>;
|
|
17
17
|
/**
|
|
18
18
|
* Callback when summarization is complete. Can optionally return a transformed value.
|
|
@@ -26,7 +26,7 @@ export interface UseSummarizeOptions<TOutput = SummarizationResult> {
|
|
|
26
26
|
onError?: (error: Error) => void;
|
|
27
27
|
/** Callback when progress is reported (0-100) */
|
|
28
28
|
onProgress?: (progress: number, message?: string) => void;
|
|
29
|
-
/** Callback for each stream chunk (
|
|
29
|
+
/** Callback for each stream chunk (connect-based adapter mode only) */
|
|
30
30
|
onChunk?: (chunk: StreamChunk) => void;
|
|
31
31
|
}
|
|
32
32
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-summarize.js","sources":["../../src/use-summarize.ts"],"sourcesContent":["import { useGeneration } from './use-generation'\nimport type { StreamChunk, SummarizationResult } from '@tanstack/ai'\nimport type {\n
|
|
1
|
+
{"version":3,"file":"use-summarize.js","sources":["../../src/use-summarize.ts"],"sourcesContent":["import { useGeneration } from './use-generation'\nimport type { StreamChunk, SummarizationResult } from '@tanstack/ai'\nimport type {\n ConnectConnectionAdapter,\n GenerationClientState,\n GenerationFetcher,\n InferGenerationOutput,\n SummarizeGenerateInput,\n} from '@tanstack/ai-client'\n\n/**\n * Options for the useSummarize hook.\n *\n * @template TOutput - The output type after optional transform (defaults to SummarizationResult)\n */\nexport interface UseSummarizeOptions<TOutput = SummarizationResult> {\n /** Connect-based adapter for streaming transport (SSE, HTTP stream, custom) */\n connection?: ConnectConnectionAdapter\n /** Direct async function for summarization */\n fetcher?: GenerationFetcher<SummarizeGenerateInput, SummarizationResult>\n /** Unique identifier for this generation instance */\n id?: string\n /** Additional body parameters to send with connect-based adapter requests */\n body?: Record<string, any>\n /**\n * Callback when summarization is complete. Can optionally return a transformed value.\n *\n * - Return a non-null value to transform and store it as the result\n * - Return `null` to keep the previous result unchanged\n * - Return nothing (`void`) to store the raw result as-is\n */\n onResult?: (result: SummarizationResult) => TOutput | null | void\n /** Callback when an error occurs */\n onError?: (error: Error) => void\n /** Callback when progress is reported (0-100) */\n onProgress?: (progress: number, message?: string) => void\n /** Callback for each stream chunk (connect-based adapter mode only) */\n onChunk?: (chunk: StreamChunk) => void\n}\n\n/**\n * Return type for the useSummarize hook.\n *\n * @template TOutput - The output type (after optional transform)\n */\nexport interface UseSummarizeReturn<TOutput = SummarizationResult> {\n /** Trigger summarization */\n generate: (input: SummarizeGenerateInput) => Promise<void>\n /** The summarization result, or null */\n result: TOutput | null\n /** Whether summarization is in progress */\n isLoading: boolean\n /** Current error, if any */\n error: Error | undefined\n /** Current state of the generation */\n status: GenerationClientState\n /** Abort the current summarization */\n stop: () => void\n /** Clear result, error, and return to idle */\n reset: () => void\n}\n\n/**\n * React hook for summarizing text using AI models.\n *\n * @example\n * ```tsx\n * import { useSummarize } from '@tanstack/ai-react'\n * import { fetchServerSentEvents } from '@tanstack/ai-client'\n *\n * function Summarizer() {\n * const { generate, result, isLoading } = useSummarize({\n * connection: fetchServerSentEvents('/api/summarize'),\n * })\n *\n * return (\n * <div>\n * <button onClick={() => generate({\n * text: 'Long article text...',\n * style: 'bullet-points',\n * maxLength: 200,\n * })}>\n * Summarize\n * </button>\n * {isLoading && <p>Summarizing...</p>}\n * {result && <p>{result.summary}</p>}\n * </div>\n * )\n * }\n * ```\n */\nexport function useSummarize<\n TOnResult extends ((result: SummarizationResult) => any) | undefined =\n undefined,\n>(\n options: Omit<UseSummarizeOptions, 'onResult'> & {\n onResult?: TOnResult\n },\n): UseSummarizeReturn<InferGenerationOutput<SummarizationResult, TOnResult>> {\n const { generate, result, isLoading, error, status, stop, reset } =\n useGeneration<SummarizeGenerateInput, SummarizationResult, TOnResult>(\n options,\n )\n\n return {\n generate: generate as (input: SummarizeGenerateInput) => Promise<void>,\n result,\n isLoading,\n error,\n status,\n stop,\n reset,\n }\n}\n"],"names":[],"mappings":";AA2FO,SAAS,aAId,SAG2E;AAC3E,QAAM,EAAE,UAAU,QAAQ,WAAW,OAAO,QAAQ,MAAM,UACxD;AAAA,IACE;AAAA,EAAA;AAGJ,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAEJ;"}
|
|
@@ -1,18 +1,18 @@
|
|
|
1
1
|
import { StreamChunk, TranscriptionResult } from '@tanstack/ai';
|
|
2
|
-
import {
|
|
2
|
+
import { ConnectConnectionAdapter, GenerationClientState, GenerationFetcher, InferGenerationOutput, TranscriptionGenerateInput } from '@tanstack/ai-client';
|
|
3
3
|
/**
|
|
4
4
|
* Options for the useTranscription hook.
|
|
5
5
|
*
|
|
6
6
|
* @template TOutput - The output type after optional transform (defaults to TranscriptionResult)
|
|
7
7
|
*/
|
|
8
8
|
export interface UseTranscriptionOptions<TOutput = TranscriptionResult> {
|
|
9
|
-
/**
|
|
10
|
-
connection?:
|
|
9
|
+
/** Connect-based adapter for streaming transport (SSE, HTTP stream, custom) */
|
|
10
|
+
connection?: ConnectConnectionAdapter;
|
|
11
11
|
/** Direct async function for transcription */
|
|
12
12
|
fetcher?: GenerationFetcher<TranscriptionGenerateInput, TranscriptionResult>;
|
|
13
13
|
/** Unique identifier for this generation instance */
|
|
14
14
|
id?: string;
|
|
15
|
-
/** Additional body parameters to send with
|
|
15
|
+
/** Additional body parameters to send with connect-based adapter requests */
|
|
16
16
|
body?: Record<string, any>;
|
|
17
17
|
/**
|
|
18
18
|
* Callback when transcription is complete. Can optionally return a transformed value.
|
|
@@ -26,7 +26,7 @@ export interface UseTranscriptionOptions<TOutput = TranscriptionResult> {
|
|
|
26
26
|
onError?: (error: Error) => void;
|
|
27
27
|
/** Callback when progress is reported (0-100) */
|
|
28
28
|
onProgress?: (progress: number, message?: string) => void;
|
|
29
|
-
/** Callback for each stream chunk (
|
|
29
|
+
/** Callback for each stream chunk (connect-based adapter mode only) */
|
|
30
30
|
onChunk?: (chunk: StreamChunk) => void;
|
|
31
31
|
}
|
|
32
32
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-transcription.js","sources":["../../src/use-transcription.ts"],"sourcesContent":["import { useGeneration } from './use-generation'\nimport type { StreamChunk, TranscriptionResult } from '@tanstack/ai'\nimport type {\n
|
|
1
|
+
{"version":3,"file":"use-transcription.js","sources":["../../src/use-transcription.ts"],"sourcesContent":["import { useGeneration } from './use-generation'\nimport type { StreamChunk, TranscriptionResult } from '@tanstack/ai'\nimport type {\n ConnectConnectionAdapter,\n GenerationClientState,\n GenerationFetcher,\n InferGenerationOutput,\n TranscriptionGenerateInput,\n} from '@tanstack/ai-client'\n\n/**\n * Options for the useTranscription hook.\n *\n * @template TOutput - The output type after optional transform (defaults to TranscriptionResult)\n */\nexport interface UseTranscriptionOptions<TOutput = TranscriptionResult> {\n /** Connect-based adapter for streaming transport (SSE, HTTP stream, custom) */\n connection?: ConnectConnectionAdapter\n /** Direct async function for transcription */\n fetcher?: GenerationFetcher<TranscriptionGenerateInput, TranscriptionResult>\n /** Unique identifier for this generation instance */\n id?: string\n /** Additional body parameters to send with connect-based adapter requests */\n body?: Record<string, any>\n /**\n * Callback when transcription is complete. Can optionally return a transformed value.\n *\n * - Return a non-null value to transform and store it as the result\n * - Return `null` to keep the previous result unchanged\n * - Return nothing (`void`) to store the raw result as-is\n */\n onResult?: (result: TranscriptionResult) => TOutput | null | void\n /** Callback when an error occurs */\n onError?: (error: Error) => void\n /** Callback when progress is reported (0-100) */\n onProgress?: (progress: number, message?: string) => void\n /** Callback for each stream chunk (connect-based adapter mode only) */\n onChunk?: (chunk: StreamChunk) => void\n}\n\n/**\n * Return type for the useTranscription hook.\n *\n * @template TOutput - The output type (after optional transform)\n */\nexport interface UseTranscriptionReturn<TOutput = TranscriptionResult> {\n /** Trigger transcription */\n generate: (input: TranscriptionGenerateInput) => Promise<void>\n /** The transcription result, or null */\n result: TOutput | null\n /** Whether transcription is in progress */\n isLoading: boolean\n /** Current error, if any */\n error: Error | undefined\n /** Current state of the generation */\n status: GenerationClientState\n /** Abort the current transcription */\n stop: () => void\n /** Clear result, error, and return to idle */\n reset: () => void\n}\n\n/**\n * React hook for transcribing audio to text using AI models.\n *\n * @example\n * ```tsx\n * import { useTranscription } from '@tanstack/ai-react'\n * import { fetchServerSentEvents } from '@tanstack/ai-client'\n *\n * function Transcriber() {\n * const { generate, result, isLoading } = useTranscription({\n * connection: fetchServerSentEvents('/api/transcribe'),\n * })\n *\n * const handleFile = (e: React.ChangeEvent<HTMLInputElement>) => {\n * const file = e.target.files?.[0]\n * if (file) {\n * const reader = new FileReader()\n * reader.onload = () => {\n * generate({ audio: reader.result as string, language: 'en' })\n * }\n * reader.readAsDataURL(file)\n * }\n * }\n *\n * return (\n * <div>\n * <input type=\"file\" accept=\"audio/*\" onChange={handleFile} />\n * {isLoading && <p>Transcribing...</p>}\n * {result && <p>{result.text}</p>}\n * </div>\n * )\n * }\n * ```\n */\nexport function useTranscription<\n TOnResult extends ((result: TranscriptionResult) => any) | undefined =\n undefined,\n>(\n options: Omit<UseTranscriptionOptions, 'onResult'> & {\n onResult?: TOnResult\n },\n): UseTranscriptionReturn<\n InferGenerationOutput<TranscriptionResult, TOnResult>\n> {\n const { generate, result, isLoading, error, status, stop, reset } =\n useGeneration<TranscriptionGenerateInput, TranscriptionResult, TOnResult>(\n options,\n )\n\n return {\n generate: generate as (input: TranscriptionGenerateInput) => Promise<void>,\n result,\n isLoading,\n error,\n status,\n stop,\n reset,\n }\n}\n"],"names":[],"mappings":";AAgGO,SAAS,iBAId,SAKA;AACA,QAAM,EAAE,UAAU,QAAQ,WAAW,OAAO,QAAQ,MAAM,UACxD;AAAA,IACE;AAAA,EAAA;AAGJ,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAEJ;"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tanstack/ai-react",
|
|
3
|
-
"version": "0.7.
|
|
3
|
+
"version": "0.7.2",
|
|
4
4
|
"description": "React hooks for TanStack AI",
|
|
5
5
|
"author": "",
|
|
6
6
|
"license": "MIT",
|
|
@@ -31,12 +31,12 @@
|
|
|
31
31
|
"streaming"
|
|
32
32
|
],
|
|
33
33
|
"dependencies": {
|
|
34
|
-
"@tanstack/ai-client": "0.7.
|
|
34
|
+
"@tanstack/ai-client": "0.7.2"
|
|
35
35
|
},
|
|
36
36
|
"peerDependencies": {
|
|
37
37
|
"@types/react": ">=18.0.0",
|
|
38
38
|
"react": ">=18.0.0",
|
|
39
|
-
"@tanstack/ai": "^0.8.
|
|
39
|
+
"@tanstack/ai": "^0.8.1"
|
|
40
40
|
},
|
|
41
41
|
"devDependencies": {
|
|
42
42
|
"@testing-library/react": "^16.3.0",
|
|
@@ -45,7 +45,7 @@
|
|
|
45
45
|
"jsdom": "^27.2.0",
|
|
46
46
|
"react": "^19.2.3",
|
|
47
47
|
"vite": "^7.2.7",
|
|
48
|
-
"@tanstack/ai": "0.8.
|
|
48
|
+
"@tanstack/ai": "0.8.1"
|
|
49
49
|
},
|
|
50
50
|
"scripts": {
|
|
51
51
|
"clean": "premove ./build ./dist",
|
package/src/types.ts
CHANGED
|
@@ -3,6 +3,7 @@ import type {
|
|
|
3
3
|
ChatClientOptions,
|
|
4
4
|
ChatClientState,
|
|
5
5
|
ChatRequestBody,
|
|
6
|
+
ConnectionStatus,
|
|
6
7
|
MultimodalContent,
|
|
7
8
|
UIMessage,
|
|
8
9
|
} from '@tanstack/ai-client'
|
|
@@ -29,8 +30,20 @@ export type { ChatRequestBody, MultimodalContent, UIMessage }
|
|
|
29
30
|
export type UseChatOptions<TTools extends ReadonlyArray<AnyClientTool> = any> =
|
|
30
31
|
Omit<
|
|
31
32
|
ChatClientOptions<TTools>,
|
|
32
|
-
|
|
33
|
-
|
|
33
|
+
| 'onMessagesChange'
|
|
34
|
+
| 'onLoadingChange'
|
|
35
|
+
| 'onErrorChange'
|
|
36
|
+
| 'onStatusChange'
|
|
37
|
+
| 'onSubscriptionChange'
|
|
38
|
+
| 'onConnectionStatusChange'
|
|
39
|
+
| 'onSessionGeneratingChange'
|
|
40
|
+
> & {
|
|
41
|
+
/**
|
|
42
|
+
* Opt into mount-time live subscription behavior.
|
|
43
|
+
* When enabled, the hook subscribes on mount and unsubscribes on unmount.
|
|
44
|
+
*/
|
|
45
|
+
live?: boolean
|
|
46
|
+
}
|
|
34
47
|
|
|
35
48
|
export interface UseChatReturn<
|
|
36
49
|
TTools extends ReadonlyArray<AnyClientTool> = any,
|
|
@@ -95,6 +108,24 @@ export interface UseChatReturn<
|
|
|
95
108
|
*/
|
|
96
109
|
status: ChatClientState
|
|
97
110
|
|
|
111
|
+
/**
|
|
112
|
+
* Whether the subscription loop is currently active
|
|
113
|
+
*/
|
|
114
|
+
isSubscribed: boolean
|
|
115
|
+
|
|
116
|
+
/**
|
|
117
|
+
* Current connection lifecycle status
|
|
118
|
+
*/
|
|
119
|
+
connectionStatus: ConnectionStatus
|
|
120
|
+
|
|
121
|
+
/**
|
|
122
|
+
* Whether the shared session is actively generating.
|
|
123
|
+
* Derived from stream run events (RUN_STARTED / RUN_FINISHED / RUN_ERROR).
|
|
124
|
+
* Unlike `isLoading` (request-local), this reflects shared generation
|
|
125
|
+
* activity visible to all subscribers (e.g. across tabs/devices).
|
|
126
|
+
*/
|
|
127
|
+
sessionGenerating: boolean
|
|
128
|
+
|
|
98
129
|
/**
|
|
99
130
|
* Set messages manually
|
|
100
131
|
*/
|
package/src/use-chat.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { ChatClient } from '@tanstack/ai-client'
|
|
2
2
|
import { useCallback, useEffect, useId, useMemo, useRef, useState } from 'react'
|
|
3
3
|
import type { AnyClientTool, ModelMessage } from '@tanstack/ai'
|
|
4
|
-
import type { ChatClientState } from '@tanstack/ai-client'
|
|
4
|
+
import type { ChatClientState, ConnectionStatus } from '@tanstack/ai-client'
|
|
5
5
|
|
|
6
6
|
import type {
|
|
7
7
|
MultimodalContent,
|
|
@@ -22,6 +22,10 @@ export function useChat<TTools extends ReadonlyArray<AnyClientTool> = any>(
|
|
|
22
22
|
const [isLoading, setIsLoading] = useState(false)
|
|
23
23
|
const [error, setError] = useState<Error | undefined>(undefined)
|
|
24
24
|
const [status, setStatus] = useState<ChatClientState>('ready')
|
|
25
|
+
const [isSubscribed, setIsSubscribed] = useState(false)
|
|
26
|
+
const [connectionStatus, setConnectionStatus] =
|
|
27
|
+
useState<ConnectionStatus>('disconnected')
|
|
28
|
+
const [sessionGenerating, setSessionGenerating] = useState(false)
|
|
25
29
|
|
|
26
30
|
// Track current messages in a ref to preserve them when client is recreated
|
|
27
31
|
const messagesRef = useRef<Array<UIMessage<TTools>>>(
|
|
@@ -78,6 +82,15 @@ export function useChat<TTools extends ReadonlyArray<AnyClientTool> = any>(
|
|
|
78
82
|
onStatusChange: (status: ChatClientState) => {
|
|
79
83
|
setStatus(status)
|
|
80
84
|
},
|
|
85
|
+
onSubscriptionChange: (nextIsSubscribed: boolean) => {
|
|
86
|
+
setIsSubscribed(nextIsSubscribed)
|
|
87
|
+
},
|
|
88
|
+
onConnectionStatusChange: (nextStatus: ConnectionStatus) => {
|
|
89
|
+
setConnectionStatus(nextStatus)
|
|
90
|
+
},
|
|
91
|
+
onSessionGeneratingChange: (isGenerating: boolean) => {
|
|
92
|
+
setSessionGenerating(isGenerating)
|
|
93
|
+
},
|
|
81
94
|
})
|
|
82
95
|
}, [clientId])
|
|
83
96
|
|
|
@@ -99,16 +112,29 @@ export function useChat<TTools extends ReadonlyArray<AnyClientTool> = any>(
|
|
|
99
112
|
}
|
|
100
113
|
}, []) // Only run on mount - initialMessages are handled by ChatClient constructor
|
|
101
114
|
|
|
115
|
+
// Keep connection lifecycle opt-in and explicit.
|
|
116
|
+
useEffect(() => {
|
|
117
|
+
if (options.live) {
|
|
118
|
+
client.subscribe()
|
|
119
|
+
} else {
|
|
120
|
+
client.unsubscribe()
|
|
121
|
+
}
|
|
122
|
+
}, [client, options.live])
|
|
123
|
+
|
|
102
124
|
// Cleanup on unmount: stop any in-flight requests
|
|
103
125
|
// Note: We only cleanup when client changes or component unmounts.
|
|
104
126
|
// DO NOT include isLoading in dependencies - that would cause the cleanup
|
|
105
127
|
// to run when isLoading changes, aborting continuation requests.
|
|
106
128
|
useEffect(() => {
|
|
107
129
|
return () => {
|
|
108
|
-
//
|
|
109
|
-
|
|
130
|
+
// live mode owns the connection lifecycle; non-live keeps request-only stop.
|
|
131
|
+
if (options.live) {
|
|
132
|
+
client.unsubscribe()
|
|
133
|
+
} else {
|
|
134
|
+
client.stop()
|
|
135
|
+
}
|
|
110
136
|
}
|
|
111
|
-
}, [client])
|
|
137
|
+
}, [client, options.live])
|
|
112
138
|
|
|
113
139
|
// Note: Callback options (onResponse, onChunk, onFinish, onError, onToolCall)
|
|
114
140
|
// are captured at client creation time. Changes to these callbacks require
|
|
@@ -176,6 +202,9 @@ export function useChat<TTools extends ReadonlyArray<AnyClientTool> = any>(
|
|
|
176
202
|
isLoading,
|
|
177
203
|
error,
|
|
178
204
|
status,
|
|
205
|
+
isSubscribed,
|
|
206
|
+
connectionStatus,
|
|
207
|
+
sessionGenerating,
|
|
179
208
|
setMessages: setMessagesManually,
|
|
180
209
|
clear,
|
|
181
210
|
addToolResult,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { useGeneration } from './use-generation'
|
|
2
2
|
import type { ImageGenerationResult, StreamChunk } from '@tanstack/ai'
|
|
3
3
|
import type {
|
|
4
|
-
|
|
4
|
+
ConnectConnectionAdapter,
|
|
5
5
|
GenerationClientState,
|
|
6
6
|
GenerationFetcher,
|
|
7
7
|
ImageGenerateInput,
|
|
@@ -14,13 +14,13 @@ import type {
|
|
|
14
14
|
* @template TOutput - The output type after optional transform (defaults to ImageGenerationResult)
|
|
15
15
|
*/
|
|
16
16
|
export interface UseGenerateImageOptions<TOutput = ImageGenerationResult> {
|
|
17
|
-
/**
|
|
18
|
-
connection?:
|
|
17
|
+
/** Connect-based adapter for streaming transport (SSE, HTTP stream, custom) */
|
|
18
|
+
connection?: ConnectConnectionAdapter
|
|
19
19
|
/** Direct async function for image generation */
|
|
20
20
|
fetcher?: GenerationFetcher<ImageGenerateInput, ImageGenerationResult>
|
|
21
21
|
/** Unique identifier for this generation instance */
|
|
22
22
|
id?: string
|
|
23
|
-
/** Additional body parameters to send with
|
|
23
|
+
/** Additional body parameters to send with connect-based adapter requests */
|
|
24
24
|
body?: Record<string, any>
|
|
25
25
|
/**
|
|
26
26
|
* Callback when images are generated. Can optionally return a transformed value.
|
|
@@ -34,7 +34,7 @@ export interface UseGenerateImageOptions<TOutput = ImageGenerationResult> {
|
|
|
34
34
|
onError?: (error: Error) => void
|
|
35
35
|
/** Callback when progress is reported (0-100) */
|
|
36
36
|
onProgress?: (progress: number, message?: string) => void
|
|
37
|
-
/** Callback for each stream chunk (
|
|
37
|
+
/** Callback for each stream chunk (connect-based adapter mode only) */
|
|
38
38
|
onChunk?: (chunk: StreamChunk) => void
|
|
39
39
|
}
|
|
40
40
|
|
|
@@ -64,7 +64,7 @@ export interface UseGenerateImageReturn<TOutput = ImageGenerationResult> {
|
|
|
64
64
|
* React hook for generating images using AI models.
|
|
65
65
|
*
|
|
66
66
|
* Supports two transport modes:
|
|
67
|
-
* - **
|
|
67
|
+
* - **ConnectConnectionAdapter** — Streaming transport (SSE, HTTP stream, custom)
|
|
68
68
|
* - **Fetcher** — Direct async function call
|
|
69
69
|
*
|
|
70
70
|
* @example
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { useGeneration } from './use-generation'
|
|
2
2
|
import type { StreamChunk, TTSResult } from '@tanstack/ai'
|
|
3
3
|
import type {
|
|
4
|
-
|
|
4
|
+
ConnectConnectionAdapter,
|
|
5
5
|
GenerationClientState,
|
|
6
6
|
GenerationFetcher,
|
|
7
7
|
InferGenerationOutput,
|
|
@@ -14,13 +14,13 @@ import type {
|
|
|
14
14
|
* @template TOutput - The output type after optional transform (defaults to TTSResult)
|
|
15
15
|
*/
|
|
16
16
|
export interface UseGenerateSpeechOptions<TOutput = TTSResult> {
|
|
17
|
-
/**
|
|
18
|
-
connection?:
|
|
17
|
+
/** Connect-based adapter for streaming transport (SSE, HTTP stream, custom) */
|
|
18
|
+
connection?: ConnectConnectionAdapter
|
|
19
19
|
/** Direct async function for speech generation */
|
|
20
20
|
fetcher?: GenerationFetcher<SpeechGenerateInput, TTSResult>
|
|
21
21
|
/** Unique identifier for this generation instance */
|
|
22
22
|
id?: string
|
|
23
|
-
/** Additional body parameters to send with
|
|
23
|
+
/** Additional body parameters to send with connect-based adapter requests */
|
|
24
24
|
body?: Record<string, any>
|
|
25
25
|
/**
|
|
26
26
|
* Callback when speech is generated. Can optionally return a transformed value.
|
|
@@ -34,7 +34,7 @@ export interface UseGenerateSpeechOptions<TOutput = TTSResult> {
|
|
|
34
34
|
onError?: (error: Error) => void
|
|
35
35
|
/** Callback when progress is reported (0-100) */
|
|
36
36
|
onProgress?: (progress: number, message?: string) => void
|
|
37
|
-
/** Callback for each stream chunk (
|
|
37
|
+
/** Callback for each stream chunk (connect-based adapter mode only) */
|
|
38
38
|
onChunk?: (chunk: StreamChunk) => void
|
|
39
39
|
}
|
|
40
40
|
|
|
@@ -2,7 +2,7 @@ import { VideoGenerationClient } from '@tanstack/ai-client'
|
|
|
2
2
|
import { useCallback, useEffect, useId, useMemo, useRef, useState } from 'react'
|
|
3
3
|
import type { StreamChunk } from '@tanstack/ai'
|
|
4
4
|
import type {
|
|
5
|
-
|
|
5
|
+
ConnectConnectionAdapter,
|
|
6
6
|
GenerationClientState,
|
|
7
7
|
GenerationFetcher,
|
|
8
8
|
InferGenerationOutput,
|
|
@@ -15,13 +15,13 @@ import type {
|
|
|
15
15
|
* Options for the useGenerateVideo hook.
|
|
16
16
|
*/
|
|
17
17
|
export interface UseGenerateVideoOptions<TOutput = VideoGenerateResult> {
|
|
18
|
-
/**
|
|
19
|
-
connection?:
|
|
18
|
+
/** Connect-based adapter for streaming transport (server handles polling) */
|
|
19
|
+
connection?: ConnectConnectionAdapter
|
|
20
20
|
/** Direct async function that returns a completed video result */
|
|
21
21
|
fetcher?: GenerationFetcher<VideoGenerateInput, VideoGenerateResult>
|
|
22
22
|
/** Unique identifier for this generation instance */
|
|
23
23
|
id?: string
|
|
24
|
-
/** Additional body parameters to send with
|
|
24
|
+
/** Additional body parameters to send with connect-based adapter requests */
|
|
25
25
|
body?: Record<string, any>
|
|
26
26
|
/**
|
|
27
27
|
* Callback when video generation completes. Can optionally return a transformed value.
|
|
@@ -39,7 +39,7 @@ export interface UseGenerateVideoOptions<TOutput = VideoGenerateResult> {
|
|
|
39
39
|
onJobCreated?: (jobId: string) => void
|
|
40
40
|
/** Callback on each status update */
|
|
41
41
|
onStatusUpdate?: (status: VideoStatusInfo) => void
|
|
42
|
-
/** Callback for each stream chunk (
|
|
42
|
+
/** Callback for each stream chunk (connect-based adapter mode only) */
|
|
43
43
|
onChunk?: (chunk: StreamChunk) => void
|
|
44
44
|
}
|
|
45
45
|
|
package/src/use-generation.ts
CHANGED
|
@@ -2,7 +2,7 @@ import { GenerationClient } from '@tanstack/ai-client'
|
|
|
2
2
|
import { useCallback, useEffect, useId, useMemo, useRef, useState } from 'react'
|
|
3
3
|
import type { StreamChunk } from '@tanstack/ai'
|
|
4
4
|
import type {
|
|
5
|
-
|
|
5
|
+
ConnectConnectionAdapter,
|
|
6
6
|
GenerationClientOptions,
|
|
7
7
|
GenerationClientState,
|
|
8
8
|
GenerationFetcher,
|
|
@@ -19,13 +19,13 @@ import type {
|
|
|
19
19
|
* @template TOutput - The output type after optional transform (defaults to TResult)
|
|
20
20
|
*/
|
|
21
21
|
export interface UseGenerationOptions<TInput, TResult, TOutput = TResult> {
|
|
22
|
-
/**
|
|
23
|
-
connection?:
|
|
22
|
+
/** Connect-based adapter for streaming transport (SSE, HTTP stream, custom) */
|
|
23
|
+
connection?: ConnectConnectionAdapter
|
|
24
24
|
/** Direct async function for one-shot generation (no streaming protocol needed) */
|
|
25
25
|
fetcher?: GenerationFetcher<TInput, TResult>
|
|
26
26
|
/** Unique identifier for this generation instance */
|
|
27
27
|
id?: string
|
|
28
|
-
/** Additional body parameters to send with
|
|
28
|
+
/** Additional body parameters to send with connect-based adapter requests */
|
|
29
29
|
body?: Record<string, any>
|
|
30
30
|
/**
|
|
31
31
|
* Callback when a result is received. Can optionally return a transformed value.
|
|
@@ -39,7 +39,7 @@ export interface UseGenerationOptions<TInput, TResult, TOutput = TResult> {
|
|
|
39
39
|
onError?: (error: Error) => void
|
|
40
40
|
/** Callback when progress is reported (0-100) */
|
|
41
41
|
onProgress?: (progress: number, message?: string) => void
|
|
42
|
-
/** Callback for each stream chunk (
|
|
42
|
+
/** Callback for each stream chunk (connect-based adapter mode only) */
|
|
43
43
|
onChunk?: (chunk: StreamChunk) => void
|
|
44
44
|
}
|
|
45
45
|
|
package/src/use-summarize.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { useGeneration } from './use-generation'
|
|
2
2
|
import type { StreamChunk, SummarizationResult } from '@tanstack/ai'
|
|
3
3
|
import type {
|
|
4
|
-
|
|
4
|
+
ConnectConnectionAdapter,
|
|
5
5
|
GenerationClientState,
|
|
6
6
|
GenerationFetcher,
|
|
7
7
|
InferGenerationOutput,
|
|
@@ -14,13 +14,13 @@ import type {
|
|
|
14
14
|
* @template TOutput - The output type after optional transform (defaults to SummarizationResult)
|
|
15
15
|
*/
|
|
16
16
|
export interface UseSummarizeOptions<TOutput = SummarizationResult> {
|
|
17
|
-
/**
|
|
18
|
-
connection?:
|
|
17
|
+
/** Connect-based adapter for streaming transport (SSE, HTTP stream, custom) */
|
|
18
|
+
connection?: ConnectConnectionAdapter
|
|
19
19
|
/** Direct async function for summarization */
|
|
20
20
|
fetcher?: GenerationFetcher<SummarizeGenerateInput, SummarizationResult>
|
|
21
21
|
/** Unique identifier for this generation instance */
|
|
22
22
|
id?: string
|
|
23
|
-
/** Additional body parameters to send with
|
|
23
|
+
/** Additional body parameters to send with connect-based adapter requests */
|
|
24
24
|
body?: Record<string, any>
|
|
25
25
|
/**
|
|
26
26
|
* Callback when summarization is complete. Can optionally return a transformed value.
|
|
@@ -34,7 +34,7 @@ export interface UseSummarizeOptions<TOutput = SummarizationResult> {
|
|
|
34
34
|
onError?: (error: Error) => void
|
|
35
35
|
/** Callback when progress is reported (0-100) */
|
|
36
36
|
onProgress?: (progress: number, message?: string) => void
|
|
37
|
-
/** Callback for each stream chunk (
|
|
37
|
+
/** Callback for each stream chunk (connect-based adapter mode only) */
|
|
38
38
|
onChunk?: (chunk: StreamChunk) => void
|
|
39
39
|
}
|
|
40
40
|
|
package/src/use-transcription.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { useGeneration } from './use-generation'
|
|
2
2
|
import type { StreamChunk, TranscriptionResult } from '@tanstack/ai'
|
|
3
3
|
import type {
|
|
4
|
-
|
|
4
|
+
ConnectConnectionAdapter,
|
|
5
5
|
GenerationClientState,
|
|
6
6
|
GenerationFetcher,
|
|
7
7
|
InferGenerationOutput,
|
|
@@ -14,13 +14,13 @@ import type {
|
|
|
14
14
|
* @template TOutput - The output type after optional transform (defaults to TranscriptionResult)
|
|
15
15
|
*/
|
|
16
16
|
export interface UseTranscriptionOptions<TOutput = TranscriptionResult> {
|
|
17
|
-
/**
|
|
18
|
-
connection?:
|
|
17
|
+
/** Connect-based adapter for streaming transport (SSE, HTTP stream, custom) */
|
|
18
|
+
connection?: ConnectConnectionAdapter
|
|
19
19
|
/** Direct async function for transcription */
|
|
20
20
|
fetcher?: GenerationFetcher<TranscriptionGenerateInput, TranscriptionResult>
|
|
21
21
|
/** Unique identifier for this generation instance */
|
|
22
22
|
id?: string
|
|
23
|
-
/** Additional body parameters to send with
|
|
23
|
+
/** Additional body parameters to send with connect-based adapter requests */
|
|
24
24
|
body?: Record<string, any>
|
|
25
25
|
/**
|
|
26
26
|
* Callback when transcription is complete. Can optionally return a transformed value.
|
|
@@ -34,7 +34,7 @@ export interface UseTranscriptionOptions<TOutput = TranscriptionResult> {
|
|
|
34
34
|
onError?: (error: Error) => void
|
|
35
35
|
/** Callback when progress is reported (0-100) */
|
|
36
36
|
onProgress?: (progress: number, message?: string) => void
|
|
37
|
-
/** Callback for each stream chunk (
|
|
37
|
+
/** Callback for each stream chunk (connect-based adapter mode only) */
|
|
38
38
|
onChunk?: (chunk: StreamChunk) => void
|
|
39
39
|
}
|
|
40
40
|
|