@langchain/react 0.2.3 → 0.3.0
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/dist/context.cjs.map +1 -1
- package/dist/context.js.map +1 -1
- package/dist/index.cjs +43 -0
- package/dist/index.d.cts +2 -2
- package/dist/index.d.ts +2 -2
- package/dist/index.js +2 -1
- package/dist/stream.cjs.map +1 -1
- package/dist/stream.custom.cjs +20 -5
- package/dist/stream.custom.cjs.map +1 -1
- package/dist/stream.custom.js +21 -6
- package/dist/stream.custom.js.map +1 -1
- package/dist/stream.js.map +1 -1
- package/dist/stream.lgp.cjs +25 -7
- package/dist/stream.lgp.cjs.map +1 -1
- package/dist/stream.lgp.js +26 -8
- package/dist/stream.lgp.js.map +1 -1
- package/dist/suspense-stream.cjs.map +1 -1
- package/dist/suspense-stream.js.map +1 -1
- package/dist/thread.cjs.map +1 -1
- package/dist/thread.js.map +1 -1
- package/dist/types.d.ts +1 -1
- package/package.json +5 -19
package/dist/context.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"context.cjs","names":["useStream"],"sources":["../src/context.tsx"],"sourcesContent":["/* __LC_ALLOW_ENTRYPOINT_SIDE_EFFECTS__ */\n\n\"use client\";\n\nimport { createContext, useContext, type ReactNode } from \"react\";\nimport type { BagTemplate } from \"@langchain/langgraph-sdk\";\nimport type {\n ResolveStreamOptions,\n InferBag,\n InferStateType,\n UseStreamCustomOptions,\n} from \"@langchain/langgraph-sdk/ui\";\nimport { useStream } from \"./stream.js\";\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nconst StreamContext = createContext<any | null>(null);\n\n/**\n * Props for the StreamProvider component.\n * Accepts all `useStream` options plus `children`.\n */\nexport type StreamProviderProps<\n T = Record<string, unknown>,\n Bag extends BagTemplate = BagTemplate,\n> = ResolveStreamOptions<T, InferBag<T, Bag>> & { children: ReactNode };\n\n/**\n * Props for the StreamProvider component when using a custom transport.\n * Accepts all `useStream` custom options plus `children`.\n */\nexport type StreamProviderCustomProps<\n T = Record<string, unknown>,\n Bag extends BagTemplate = BagTemplate,\n> = UseStreamCustomOptions<InferStateType<T>, InferBag<T, Bag>> & {\n children: ReactNode;\n};\n\n/**\n * Provides a shared `useStream` instance to all descendants via React Context.\n *\n * Use `StreamProvider` when multiple components in a subtree need access to the\n * same stream state (messages, loading status, errors, interrupts, etc.) without\n * prop drilling.\n *\n * @example\n * ```tsx\n * import { StreamProvider, useStreamContext } from \"@langchain/react\";\n *\n * function App() {\n * return (\n * <StreamProvider assistantId=\"agent\" apiUrl=\"http://localhost:2024\">\n * <ChatHeader />\n * <MessageList />\n * <MessageInput />\n * </StreamProvider>\n * );\n * }\n *\n * function ChatHeader() {\n * const { isLoading, error } = useStreamContext();\n * return (\n * <header>\n * {isLoading && <span>Thinking...</span>}\n * {error && <span>Error</span>}\n * </header>\n * );\n * }\n *\n * function MessageList() {\n * const { messages } = useStreamContext();\n * return messages.map((msg, i) => <div key={msg.id ?? i}>{msg.content}</div>);\n * }\n *\n * function MessageInput() {\n * const { submit } = useStreamContext();\n * return (\n * <button onClick={() => submit({ messages: [{ type: \"human\", content: \"Hi\" }] })}>\n * Send\n * </button>\n * );\n * }\n * ```\n *\n * Multiple providers can be nested for multi-agent scenarios:\n *\n * @example\n * ```tsx\n * <StreamProvider assistantId=\"researcher\" apiUrl=\"http://localhost:2024\">\n * <ResearchPanel />\n * </StreamProvider>\n * <StreamProvider assistantId=\"writer\" apiUrl=\"http://localhost:2024\">\n * <WriterPanel />\n * </StreamProvider>\n * ```\n */\nexport function StreamProvider<\n T = Record<string, unknown>,\n Bag extends BagTemplate = BagTemplate,\n>(\n props: StreamProviderProps<T, Bag> | StreamProviderCustomProps<T, Bag
|
|
1
|
+
{"version":3,"file":"context.cjs","names":["useStream"],"sources":["../src/context.tsx"],"sourcesContent":["/* __LC_ALLOW_ENTRYPOINT_SIDE_EFFECTS__ */\n\n\"use client\";\n\nimport { createContext, useContext, type ReactNode } from \"react\";\nimport type { BagTemplate } from \"@langchain/langgraph-sdk\";\nimport type {\n ResolveStreamOptions,\n InferBag,\n InferStateType,\n UseStreamCustomOptions,\n} from \"@langchain/langgraph-sdk/ui\";\nimport { useStream } from \"./stream.js\";\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nconst StreamContext = createContext<any | null>(null);\n\n/**\n * Props for the StreamProvider component.\n * Accepts all `useStream` options plus `children`.\n */\nexport type StreamProviderProps<\n T = Record<string, unknown>,\n Bag extends BagTemplate = BagTemplate,\n> = ResolveStreamOptions<T, InferBag<T, Bag>> & { children: ReactNode };\n\n/**\n * Props for the StreamProvider component when using a custom transport.\n * Accepts all `useStream` custom options plus `children`.\n */\nexport type StreamProviderCustomProps<\n T = Record<string, unknown>,\n Bag extends BagTemplate = BagTemplate,\n> = UseStreamCustomOptions<InferStateType<T>, InferBag<T, Bag>> & {\n children: ReactNode;\n};\n\n/**\n * Provides a shared `useStream` instance to all descendants via React Context.\n *\n * Use `StreamProvider` when multiple components in a subtree need access to the\n * same stream state (messages, loading status, errors, interrupts, etc.) without\n * prop drilling.\n *\n * @example\n * ```tsx\n * import { StreamProvider, useStreamContext } from \"@langchain/react\";\n *\n * function App() {\n * return (\n * <StreamProvider assistantId=\"agent\" apiUrl=\"http://localhost:2024\">\n * <ChatHeader />\n * <MessageList />\n * <MessageInput />\n * </StreamProvider>\n * );\n * }\n *\n * function ChatHeader() {\n * const { isLoading, error } = useStreamContext();\n * return (\n * <header>\n * {isLoading && <span>Thinking...</span>}\n * {error && <span>Error</span>}\n * </header>\n * );\n * }\n *\n * function MessageList() {\n * const { messages } = useStreamContext();\n * return messages.map((msg, i) => <div key={msg.id ?? i}>{msg.content}</div>);\n * }\n *\n * function MessageInput() {\n * const { submit } = useStreamContext();\n * return (\n * <button onClick={() => submit({ messages: [{ type: \"human\", content: \"Hi\" }] })}>\n * Send\n * </button>\n * );\n * }\n * ```\n *\n * Multiple providers can be nested for multi-agent scenarios:\n *\n * @example\n * ```tsx\n * <StreamProvider assistantId=\"researcher\" apiUrl=\"http://localhost:2024\">\n * <ResearchPanel />\n * </StreamProvider>\n * <StreamProvider assistantId=\"writer\" apiUrl=\"http://localhost:2024\">\n * <WriterPanel />\n * </StreamProvider>\n * ```\n */\nexport function StreamProvider<\n T = Record<string, unknown>,\n Bag extends BagTemplate = BagTemplate,\n>(\n props: StreamProviderProps<T, Bag> | StreamProviderCustomProps<T, Bag>\n): ReactNode {\n const { children, ...options } = props;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const stream = useStream<T, Bag>(options as any);\n\n return (\n <StreamContext.Provider value={stream}>{children}</StreamContext.Provider>\n );\n}\n\n/**\n * Accesses the shared stream instance from the nearest `StreamProvider`.\n *\n * Throws if called outside of a `StreamProvider`.\n *\n * @example\n * ```tsx\n * function MessageList() {\n * const { messages, getMessagesMetadata } = useStreamContext();\n * return messages.map((msg, i) => {\n * const metadata = getMessagesMetadata(msg, i);\n * return <div key={msg.id ?? i}>{msg.content}</div>;\n * });\n * }\n * ```\n *\n * @example With type parameters for full type safety:\n * ```tsx\n * import type { agent } from \"./agent\";\n *\n * function Chat() {\n * const { toolCalls } = useStreamContext<typeof agent>();\n * // toolCalls are fully typed from the agent's tools\n * }\n * ```\n */\nexport function useStreamContext<\n T = Record<string, unknown>,\n Bag extends BagTemplate = BagTemplate,\n>(): ReturnType<typeof useStream<T, Bag>> {\n const context = useContext(StreamContext);\n if (context === null) {\n throw new Error(\n \"useStreamContext must be used within a <StreamProvider>. \" +\n \"Wrap your component tree with <StreamProvider> or use useStream() directly.\"\n );\n }\n return context;\n}\n"],"mappings":";;;;;AAeA,MAAM,iBAAA,GAAA,MAAA,eAA0C,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgFrD,SAAgB,eAId,OACW;CACX,MAAM,EAAE,UAAU,GAAG,YAAY;CAEjC,MAAM,SAASA,eAAAA,UAAkB,QAAe;AAEhD,QACE,iBAAA,GAAA,kBAAA,KAAC,cAAc,UAAf;EAAwB,OAAO;EAAS;EAAkC,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8B9E,SAAgB,mBAG0B;CACxC,MAAM,WAAA,GAAA,MAAA,YAAqB,cAAc;AACzC,KAAI,YAAY,KACd,OAAM,IAAI,MACR,uIAED;AAEH,QAAO"}
|
package/dist/context.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"context.js","names":[],"sources":["../src/context.tsx"],"sourcesContent":["/* __LC_ALLOW_ENTRYPOINT_SIDE_EFFECTS__ */\n\n\"use client\";\n\nimport { createContext, useContext, type ReactNode } from \"react\";\nimport type { BagTemplate } from \"@langchain/langgraph-sdk\";\nimport type {\n ResolveStreamOptions,\n InferBag,\n InferStateType,\n UseStreamCustomOptions,\n} from \"@langchain/langgraph-sdk/ui\";\nimport { useStream } from \"./stream.js\";\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nconst StreamContext = createContext<any | null>(null);\n\n/**\n * Props for the StreamProvider component.\n * Accepts all `useStream` options plus `children`.\n */\nexport type StreamProviderProps<\n T = Record<string, unknown>,\n Bag extends BagTemplate = BagTemplate,\n> = ResolveStreamOptions<T, InferBag<T, Bag>> & { children: ReactNode };\n\n/**\n * Props for the StreamProvider component when using a custom transport.\n * Accepts all `useStream` custom options plus `children`.\n */\nexport type StreamProviderCustomProps<\n T = Record<string, unknown>,\n Bag extends BagTemplate = BagTemplate,\n> = UseStreamCustomOptions<InferStateType<T>, InferBag<T, Bag>> & {\n children: ReactNode;\n};\n\n/**\n * Provides a shared `useStream` instance to all descendants via React Context.\n *\n * Use `StreamProvider` when multiple components in a subtree need access to the\n * same stream state (messages, loading status, errors, interrupts, etc.) without\n * prop drilling.\n *\n * @example\n * ```tsx\n * import { StreamProvider, useStreamContext } from \"@langchain/react\";\n *\n * function App() {\n * return (\n * <StreamProvider assistantId=\"agent\" apiUrl=\"http://localhost:2024\">\n * <ChatHeader />\n * <MessageList />\n * <MessageInput />\n * </StreamProvider>\n * );\n * }\n *\n * function ChatHeader() {\n * const { isLoading, error } = useStreamContext();\n * return (\n * <header>\n * {isLoading && <span>Thinking...</span>}\n * {error && <span>Error</span>}\n * </header>\n * );\n * }\n *\n * function MessageList() {\n * const { messages } = useStreamContext();\n * return messages.map((msg, i) => <div key={msg.id ?? i}>{msg.content}</div>);\n * }\n *\n * function MessageInput() {\n * const { submit } = useStreamContext();\n * return (\n * <button onClick={() => submit({ messages: [{ type: \"human\", content: \"Hi\" }] })}>\n * Send\n * </button>\n * );\n * }\n * ```\n *\n * Multiple providers can be nested for multi-agent scenarios:\n *\n * @example\n * ```tsx\n * <StreamProvider assistantId=\"researcher\" apiUrl=\"http://localhost:2024\">\n * <ResearchPanel />\n * </StreamProvider>\n * <StreamProvider assistantId=\"writer\" apiUrl=\"http://localhost:2024\">\n * <WriterPanel />\n * </StreamProvider>\n * ```\n */\nexport function StreamProvider<\n T = Record<string, unknown>,\n Bag extends BagTemplate = BagTemplate,\n>(\n props: StreamProviderProps<T, Bag> | StreamProviderCustomProps<T, Bag
|
|
1
|
+
{"version":3,"file":"context.js","names":[],"sources":["../src/context.tsx"],"sourcesContent":["/* __LC_ALLOW_ENTRYPOINT_SIDE_EFFECTS__ */\n\n\"use client\";\n\nimport { createContext, useContext, type ReactNode } from \"react\";\nimport type { BagTemplate } from \"@langchain/langgraph-sdk\";\nimport type {\n ResolveStreamOptions,\n InferBag,\n InferStateType,\n UseStreamCustomOptions,\n} from \"@langchain/langgraph-sdk/ui\";\nimport { useStream } from \"./stream.js\";\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nconst StreamContext = createContext<any | null>(null);\n\n/**\n * Props for the StreamProvider component.\n * Accepts all `useStream` options plus `children`.\n */\nexport type StreamProviderProps<\n T = Record<string, unknown>,\n Bag extends BagTemplate = BagTemplate,\n> = ResolveStreamOptions<T, InferBag<T, Bag>> & { children: ReactNode };\n\n/**\n * Props for the StreamProvider component when using a custom transport.\n * Accepts all `useStream` custom options plus `children`.\n */\nexport type StreamProviderCustomProps<\n T = Record<string, unknown>,\n Bag extends BagTemplate = BagTemplate,\n> = UseStreamCustomOptions<InferStateType<T>, InferBag<T, Bag>> & {\n children: ReactNode;\n};\n\n/**\n * Provides a shared `useStream` instance to all descendants via React Context.\n *\n * Use `StreamProvider` when multiple components in a subtree need access to the\n * same stream state (messages, loading status, errors, interrupts, etc.) without\n * prop drilling.\n *\n * @example\n * ```tsx\n * import { StreamProvider, useStreamContext } from \"@langchain/react\";\n *\n * function App() {\n * return (\n * <StreamProvider assistantId=\"agent\" apiUrl=\"http://localhost:2024\">\n * <ChatHeader />\n * <MessageList />\n * <MessageInput />\n * </StreamProvider>\n * );\n * }\n *\n * function ChatHeader() {\n * const { isLoading, error } = useStreamContext();\n * return (\n * <header>\n * {isLoading && <span>Thinking...</span>}\n * {error && <span>Error</span>}\n * </header>\n * );\n * }\n *\n * function MessageList() {\n * const { messages } = useStreamContext();\n * return messages.map((msg, i) => <div key={msg.id ?? i}>{msg.content}</div>);\n * }\n *\n * function MessageInput() {\n * const { submit } = useStreamContext();\n * return (\n * <button onClick={() => submit({ messages: [{ type: \"human\", content: \"Hi\" }] })}>\n * Send\n * </button>\n * );\n * }\n * ```\n *\n * Multiple providers can be nested for multi-agent scenarios:\n *\n * @example\n * ```tsx\n * <StreamProvider assistantId=\"researcher\" apiUrl=\"http://localhost:2024\">\n * <ResearchPanel />\n * </StreamProvider>\n * <StreamProvider assistantId=\"writer\" apiUrl=\"http://localhost:2024\">\n * <WriterPanel />\n * </StreamProvider>\n * ```\n */\nexport function StreamProvider<\n T = Record<string, unknown>,\n Bag extends BagTemplate = BagTemplate,\n>(\n props: StreamProviderProps<T, Bag> | StreamProviderCustomProps<T, Bag>\n): ReactNode {\n const { children, ...options } = props;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const stream = useStream<T, Bag>(options as any);\n\n return (\n <StreamContext.Provider value={stream}>{children}</StreamContext.Provider>\n );\n}\n\n/**\n * Accesses the shared stream instance from the nearest `StreamProvider`.\n *\n * Throws if called outside of a `StreamProvider`.\n *\n * @example\n * ```tsx\n * function MessageList() {\n * const { messages, getMessagesMetadata } = useStreamContext();\n * return messages.map((msg, i) => {\n * const metadata = getMessagesMetadata(msg, i);\n * return <div key={msg.id ?? i}>{msg.content}</div>;\n * });\n * }\n * ```\n *\n * @example With type parameters for full type safety:\n * ```tsx\n * import type { agent } from \"./agent\";\n *\n * function Chat() {\n * const { toolCalls } = useStreamContext<typeof agent>();\n * // toolCalls are fully typed from the agent's tools\n * }\n * ```\n */\nexport function useStreamContext<\n T = Record<string, unknown>,\n Bag extends BagTemplate = BagTemplate,\n>(): ReturnType<typeof useStream<T, Bag>> {\n const context = useContext(StreamContext);\n if (context === null) {\n throw new Error(\n \"useStreamContext must be used within a <StreamProvider>. \" +\n \"Wrap your component tree with <StreamProvider> or use useStream() directly.\"\n );\n }\n return context;\n}\n"],"mappings":";;;;;AAeA,MAAM,gBAAgB,cAA0B,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgFrD,SAAgB,eAId,OACW;CACX,MAAM,EAAE,UAAU,GAAG,YAAY;CAEjC,MAAM,SAAS,UAAkB,QAAe;AAEhD,QACE,oBAAC,cAAc,UAAf;EAAwB,OAAO;EAAS;EAAkC,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8B9E,SAAgB,mBAG0B;CACxC,MAAM,UAAU,WAAW,cAAc;AACzC,KAAI,YAAY,KACd,OAAM,IAAI,MACR,uIAED;AAEH,QAAO"}
|
package/dist/index.cjs
CHANGED
|
@@ -4,6 +4,7 @@ const require_stream = require("./stream.cjs");
|
|
|
4
4
|
const require_suspense_stream = require("./suspense-stream.cjs");
|
|
5
5
|
const require_context = require("./context.cjs");
|
|
6
6
|
let _langchain_langgraph_sdk_ui = require("@langchain/langgraph-sdk/ui");
|
|
7
|
+
let _langchain_langgraph_sdk = require("@langchain/langgraph-sdk");
|
|
7
8
|
exports.FetchStreamTransport = _langchain_langgraph_sdk_ui.FetchStreamTransport;
|
|
8
9
|
exports.StreamProvider = require_context.StreamProvider;
|
|
9
10
|
Object.defineProperty(exports, "SubagentManager", {
|
|
@@ -19,6 +20,12 @@ Object.defineProperty(exports, "calculateDepthFromNamespace", {
|
|
|
19
20
|
}
|
|
20
21
|
});
|
|
21
22
|
exports.createSuspenseCache = require_suspense_stream.createSuspenseCache;
|
|
23
|
+
Object.defineProperty(exports, "executeHeadlessTool", {
|
|
24
|
+
enumerable: true,
|
|
25
|
+
get: function() {
|
|
26
|
+
return _langchain_langgraph_sdk.executeHeadlessTool;
|
|
27
|
+
}
|
|
28
|
+
});
|
|
22
29
|
Object.defineProperty(exports, "extractParentIdFromNamespace", {
|
|
23
30
|
enumerable: true,
|
|
24
31
|
get: function() {
|
|
@@ -31,7 +38,43 @@ Object.defineProperty(exports, "extractToolCallIdFromNamespace", {
|
|
|
31
38
|
return _langchain_langgraph_sdk_ui.extractToolCallIdFromNamespace;
|
|
32
39
|
}
|
|
33
40
|
});
|
|
41
|
+
Object.defineProperty(exports, "filterOutHeadlessToolInterrupts", {
|
|
42
|
+
enumerable: true,
|
|
43
|
+
get: function() {
|
|
44
|
+
return _langchain_langgraph_sdk.filterOutHeadlessToolInterrupts;
|
|
45
|
+
}
|
|
46
|
+
});
|
|
47
|
+
Object.defineProperty(exports, "findHeadlessTool", {
|
|
48
|
+
enumerable: true,
|
|
49
|
+
get: function() {
|
|
50
|
+
return _langchain_langgraph_sdk.findHeadlessTool;
|
|
51
|
+
}
|
|
52
|
+
});
|
|
53
|
+
Object.defineProperty(exports, "flushPendingHeadlessToolInterrupts", {
|
|
54
|
+
enumerable: true,
|
|
55
|
+
get: function() {
|
|
56
|
+
return _langchain_langgraph_sdk.flushPendingHeadlessToolInterrupts;
|
|
57
|
+
}
|
|
58
|
+
});
|
|
59
|
+
Object.defineProperty(exports, "handleHeadlessToolInterrupt", {
|
|
60
|
+
enumerable: true,
|
|
61
|
+
get: function() {
|
|
62
|
+
return _langchain_langgraph_sdk.handleHeadlessToolInterrupt;
|
|
63
|
+
}
|
|
64
|
+
});
|
|
65
|
+
Object.defineProperty(exports, "headlessToolResumeCommand", {
|
|
66
|
+
enumerable: true,
|
|
67
|
+
get: function() {
|
|
68
|
+
return _langchain_langgraph_sdk.headlessToolResumeCommand;
|
|
69
|
+
}
|
|
70
|
+
});
|
|
34
71
|
exports.invalidateSuspenseCache = require_suspense_stream.invalidateSuspenseCache;
|
|
72
|
+
Object.defineProperty(exports, "isHeadlessToolInterrupt", {
|
|
73
|
+
enumerable: true,
|
|
74
|
+
get: function() {
|
|
75
|
+
return _langchain_langgraph_sdk.isHeadlessToolInterrupt;
|
|
76
|
+
}
|
|
77
|
+
});
|
|
35
78
|
Object.defineProperty(exports, "isSubagentNamespace", {
|
|
36
79
|
enumerable: true,
|
|
37
80
|
get: function() {
|
package/dist/index.d.cts
CHANGED
|
@@ -4,11 +4,11 @@ import { SuspenseCache, createSuspenseCache, invalidateSuspenseCache, useSuspens
|
|
|
4
4
|
import { FetchStreamTransport } from "./stream.custom.cjs";
|
|
5
5
|
import { StreamProvider, StreamProviderCustomProps, StreamProviderProps, useStreamContext } from "./context.cjs";
|
|
6
6
|
import { AIMessage, ToolMessage } from "@langchain/core/messages";
|
|
7
|
-
import { DefaultToolCall, DefaultToolCall as DefaultToolCall$1, ToolCallFromTool, ToolCallState, ToolCallWithResult as ToolCallWithResult$1, ToolCallsFromTools } from "@langchain/langgraph-sdk";
|
|
7
|
+
import { AnyHeadlessToolImplementation, DefaultToolCall, DefaultToolCall as DefaultToolCall$1, FlushPendingHeadlessToolInterruptsOptions, HeadlessToolImplementation, HeadlessToolInterrupt, OnToolCallback, ToolCallFromTool, ToolCallState, ToolCallWithResult as ToolCallWithResult$1, ToolCallsFromTools, ToolEvent, executeHeadlessTool, filterOutHeadlessToolInterrupts, findHeadlessTool, flushPendingHeadlessToolInterrupts, handleHeadlessToolInterrupt, headlessToolResumeCommand, isHeadlessToolInterrupt } from "@langchain/langgraph-sdk";
|
|
8
8
|
import { AgentTypeConfigLike, BaseStream, BaseSubagentState, CompiledSubAgentLike, DeepAgentTypeConfigLike, DefaultSubagentStates, ExtractAgentConfig, ExtractDeepAgentConfig, ExtractSubAgentMiddleware, GetToolCallsType, InferAgentToolCalls, InferBag, InferDeepAgentSubagents, InferNodeNames, InferStateType, InferSubagentByName, InferSubagentNames, InferSubagentState, InferSubagentStates, InferToolCalls, IsAgentLike, IsDeepAgentLike, MessageMetadata, QueueEntry, QueueInterface, ResolveStreamInterface, ResolveStreamOptions, SubAgentLike, SubagentManager, SubagentStateMap, SubagentStatus, SubagentToolCall, UseAgentStream, UseAgentStreamOptions, UseDeepAgentStream, UseDeepAgentStreamOptions, UseStreamCustomOptions, UseStreamOptions, UseStreamThread, UseStreamTransport, calculateDepthFromNamespace, extractParentIdFromNamespace, extractToolCallIdFromNamespace, isSubagentNamespace } from "@langchain/langgraph-sdk/ui";
|
|
9
9
|
|
|
10
10
|
//#region src/index.d.ts
|
|
11
11
|
type ToolCallWithResult<ToolCall = DefaultToolCall$1> = ToolCallWithResult$1<ToolCall, ToolMessage, AIMessage>;
|
|
12
12
|
//#endregion
|
|
13
|
-
export { type AgentTypeConfigLike, type BaseStream, type BaseSubagentState, type ClassSubagentStreamInterface, type CompiledSubAgentLike, type DeepAgentTypeConfigLike, type DefaultSubagentStates, type DefaultToolCall, type ExtractAgentConfig, type ExtractDeepAgentConfig, type ExtractSubAgentMiddleware, FetchStreamTransport, type GetToolCallsType, type InferAgentToolCalls, type InferBag, type InferDeepAgentSubagents, type InferNodeNames, type InferStateType, type InferSubagentByName, type InferSubagentNames, type InferSubagentState, type InferSubagentStates, type InferToolCalls, type IsAgentLike, type IsDeepAgentLike, type MessageMetadata, type QueueEntry, type QueueInterface, type ResolveStreamInterface, type ResolveStreamOptions, StreamProvider, type StreamProviderCustomProps, type StreamProviderProps, type SubAgentLike, SubagentManager, type SubagentStateMap, type SubagentStatus, type SubagentStream, type SubagentStreamInterface, type SubagentToolCall, type SuspenseCache, type ToolCallFromTool, type ToolCallState, ToolCallWithResult, type ToolCallsFromTools, type UseAgentStream, type UseAgentStreamOptions, type UseDeepAgentStream, type UseDeepAgentStreamOptions, type UseStream, type UseStreamCustom, type UseStreamCustomOptions, type UseStreamOptions, type UseStreamThread, type UseStreamTransport, type UseSuspenseStream, calculateDepthFromNamespace, createSuspenseCache, extractParentIdFromNamespace, extractToolCallIdFromNamespace, invalidateSuspenseCache, isSubagentNamespace, useStream, useStreamContext, useSuspenseStream };
|
|
13
|
+
export { type AgentTypeConfigLike, type AnyHeadlessToolImplementation, type BaseStream, type BaseSubagentState, type ClassSubagentStreamInterface, type CompiledSubAgentLike, type DeepAgentTypeConfigLike, type DefaultSubagentStates, type DefaultToolCall, type ExtractAgentConfig, type ExtractDeepAgentConfig, type ExtractSubAgentMiddleware, FetchStreamTransport, type FlushPendingHeadlessToolInterruptsOptions, type GetToolCallsType, type HeadlessToolImplementation, type HeadlessToolInterrupt, type InferAgentToolCalls, type InferBag, type InferDeepAgentSubagents, type InferNodeNames, type InferStateType, type InferSubagentByName, type InferSubagentNames, type InferSubagentState, type InferSubagentStates, type InferToolCalls, type IsAgentLike, type IsDeepAgentLike, type MessageMetadata, type OnToolCallback, type QueueEntry, type QueueInterface, type ResolveStreamInterface, type ResolveStreamOptions, StreamProvider, type StreamProviderCustomProps, type StreamProviderProps, type SubAgentLike, SubagentManager, type SubagentStateMap, type SubagentStatus, type SubagentStream, type SubagentStreamInterface, type SubagentToolCall, type SuspenseCache, type ToolCallFromTool, type ToolCallState, ToolCallWithResult, type ToolCallsFromTools, type ToolEvent, type UseAgentStream, type UseAgentStreamOptions, type UseDeepAgentStream, type UseDeepAgentStreamOptions, type UseStream, type UseStreamCustom, type UseStreamCustomOptions, type UseStreamOptions, type UseStreamThread, type UseStreamTransport, type UseSuspenseStream, calculateDepthFromNamespace, createSuspenseCache, executeHeadlessTool, extractParentIdFromNamespace, extractToolCallIdFromNamespace, filterOutHeadlessToolInterrupts, findHeadlessTool, flushPendingHeadlessToolInterrupts, handleHeadlessToolInterrupt, headlessToolResumeCommand, invalidateSuspenseCache, isHeadlessToolInterrupt, isSubagentNamespace, useStream, useStreamContext, useSuspenseStream };
|
|
14
14
|
//# sourceMappingURL=index.d.cts.map
|
package/dist/index.d.ts
CHANGED
|
@@ -4,11 +4,11 @@ import { SuspenseCache, createSuspenseCache, invalidateSuspenseCache, useSuspens
|
|
|
4
4
|
import { FetchStreamTransport } from "./stream.custom.js";
|
|
5
5
|
import { StreamProvider, StreamProviderCustomProps, StreamProviderProps, useStreamContext } from "./context.js";
|
|
6
6
|
import { AgentTypeConfigLike, BaseStream, BaseSubagentState, CompiledSubAgentLike, DeepAgentTypeConfigLike, DefaultSubagentStates, ExtractAgentConfig, ExtractDeepAgentConfig, ExtractSubAgentMiddleware, GetToolCallsType, InferAgentToolCalls, InferBag, InferDeepAgentSubagents, InferNodeNames, InferStateType, InferSubagentByName, InferSubagentNames, InferSubagentState, InferSubagentStates, InferToolCalls, IsAgentLike, IsDeepAgentLike, MessageMetadata, QueueEntry, QueueInterface, ResolveStreamInterface, ResolveStreamOptions, SubAgentLike, SubagentManager, SubagentStateMap, SubagentStatus, SubagentToolCall, UseAgentStream, UseAgentStreamOptions, UseDeepAgentStream, UseDeepAgentStreamOptions, UseStreamCustomOptions, UseStreamOptions, UseStreamThread, UseStreamTransport, calculateDepthFromNamespace, extractParentIdFromNamespace, extractToolCallIdFromNamespace, isSubagentNamespace } from "@langchain/langgraph-sdk/ui";
|
|
7
|
+
import { AnyHeadlessToolImplementation, DefaultToolCall, DefaultToolCall as DefaultToolCall$1, FlushPendingHeadlessToolInterruptsOptions, HeadlessToolImplementation, HeadlessToolInterrupt, OnToolCallback, ToolCallFromTool, ToolCallState, ToolCallWithResult as ToolCallWithResult$1, ToolCallsFromTools, ToolEvent, executeHeadlessTool, filterOutHeadlessToolInterrupts, findHeadlessTool, flushPendingHeadlessToolInterrupts, handleHeadlessToolInterrupt, headlessToolResumeCommand, isHeadlessToolInterrupt } from "@langchain/langgraph-sdk";
|
|
7
8
|
import { AIMessage, ToolMessage } from "@langchain/core/messages";
|
|
8
|
-
import { DefaultToolCall, DefaultToolCall as DefaultToolCall$1, ToolCallFromTool, ToolCallState, ToolCallWithResult as ToolCallWithResult$1, ToolCallsFromTools } from "@langchain/langgraph-sdk";
|
|
9
9
|
|
|
10
10
|
//#region src/index.d.ts
|
|
11
11
|
type ToolCallWithResult<ToolCall = DefaultToolCall$1> = ToolCallWithResult$1<ToolCall, ToolMessage, AIMessage>;
|
|
12
12
|
//#endregion
|
|
13
|
-
export { type AgentTypeConfigLike, type BaseStream, type BaseSubagentState, type ClassSubagentStreamInterface, type CompiledSubAgentLike, type DeepAgentTypeConfigLike, type DefaultSubagentStates, type DefaultToolCall, type ExtractAgentConfig, type ExtractDeepAgentConfig, type ExtractSubAgentMiddleware, FetchStreamTransport, type GetToolCallsType, type InferAgentToolCalls, type InferBag, type InferDeepAgentSubagents, type InferNodeNames, type InferStateType, type InferSubagentByName, type InferSubagentNames, type InferSubagentState, type InferSubagentStates, type InferToolCalls, type IsAgentLike, type IsDeepAgentLike, type MessageMetadata, type QueueEntry, type QueueInterface, type ResolveStreamInterface, type ResolveStreamOptions, StreamProvider, type StreamProviderCustomProps, type StreamProviderProps, type SubAgentLike, SubagentManager, type SubagentStateMap, type SubagentStatus, type SubagentStream, type SubagentStreamInterface, type SubagentToolCall, type SuspenseCache, type ToolCallFromTool, type ToolCallState, ToolCallWithResult, type ToolCallsFromTools, type UseAgentStream, type UseAgentStreamOptions, type UseDeepAgentStream, type UseDeepAgentStreamOptions, type UseStream, type UseStreamCustom, type UseStreamCustomOptions, type UseStreamOptions, type UseStreamThread, type UseStreamTransport, type UseSuspenseStream, calculateDepthFromNamespace, createSuspenseCache, extractParentIdFromNamespace, extractToolCallIdFromNamespace, invalidateSuspenseCache, isSubagentNamespace, useStream, useStreamContext, useSuspenseStream };
|
|
13
|
+
export { type AgentTypeConfigLike, type AnyHeadlessToolImplementation, type BaseStream, type BaseSubagentState, type ClassSubagentStreamInterface, type CompiledSubAgentLike, type DeepAgentTypeConfigLike, type DefaultSubagentStates, type DefaultToolCall, type ExtractAgentConfig, type ExtractDeepAgentConfig, type ExtractSubAgentMiddleware, FetchStreamTransport, type FlushPendingHeadlessToolInterruptsOptions, type GetToolCallsType, type HeadlessToolImplementation, type HeadlessToolInterrupt, type InferAgentToolCalls, type InferBag, type InferDeepAgentSubagents, type InferNodeNames, type InferStateType, type InferSubagentByName, type InferSubagentNames, type InferSubagentState, type InferSubagentStates, type InferToolCalls, type IsAgentLike, type IsDeepAgentLike, type MessageMetadata, type OnToolCallback, type QueueEntry, type QueueInterface, type ResolveStreamInterface, type ResolveStreamOptions, StreamProvider, type StreamProviderCustomProps, type StreamProviderProps, type SubAgentLike, SubagentManager, type SubagentStateMap, type SubagentStatus, type SubagentStream, type SubagentStreamInterface, type SubagentToolCall, type SuspenseCache, type ToolCallFromTool, type ToolCallState, ToolCallWithResult, type ToolCallsFromTools, type ToolEvent, type UseAgentStream, type UseAgentStreamOptions, type UseDeepAgentStream, type UseDeepAgentStreamOptions, type UseStream, type UseStreamCustom, type UseStreamCustomOptions, type UseStreamOptions, type UseStreamThread, type UseStreamTransport, type UseSuspenseStream, calculateDepthFromNamespace, createSuspenseCache, executeHeadlessTool, extractParentIdFromNamespace, extractToolCallIdFromNamespace, filterOutHeadlessToolInterrupts, findHeadlessTool, flushPendingHeadlessToolInterrupts, handleHeadlessToolInterrupt, headlessToolResumeCommand, invalidateSuspenseCache, isHeadlessToolInterrupt, isSubagentNamespace, useStream, useStreamContext, useSuspenseStream };
|
|
14
14
|
//# sourceMappingURL=index.d.ts.map
|
package/dist/index.js
CHANGED
|
@@ -3,4 +3,5 @@ import { useStream } from "./stream.js";
|
|
|
3
3
|
import { createSuspenseCache, invalidateSuspenseCache, useSuspenseStream } from "./suspense-stream.js";
|
|
4
4
|
import { StreamProvider, useStreamContext } from "./context.js";
|
|
5
5
|
import { SubagentManager, calculateDepthFromNamespace, extractParentIdFromNamespace, extractToolCallIdFromNamespace, isSubagentNamespace } from "@langchain/langgraph-sdk/ui";
|
|
6
|
-
|
|
6
|
+
import { executeHeadlessTool, filterOutHeadlessToolInterrupts, findHeadlessTool, flushPendingHeadlessToolInterrupts, handleHeadlessToolInterrupt, headlessToolResumeCommand, isHeadlessToolInterrupt } from "@langchain/langgraph-sdk";
|
|
7
|
+
export { FetchStreamTransport, StreamProvider, SubagentManager, calculateDepthFromNamespace, createSuspenseCache, executeHeadlessTool, extractParentIdFromNamespace, extractToolCallIdFromNamespace, filterOutHeadlessToolInterrupts, findHeadlessTool, flushPendingHeadlessToolInterrupts, handleHeadlessToolInterrupt, headlessToolResumeCommand, invalidateSuspenseCache, isHeadlessToolInterrupt, isSubagentNamespace, useStream, useStreamContext, useSuspenseStream };
|
package/dist/stream.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"stream.cjs","names":["useStreamCustom","useStreamLGP"],"sources":["../src/stream.tsx"],"sourcesContent":["import { useState } from \"react\";\nimport type { BagTemplate } from \"@langchain/langgraph-sdk\";\nimport type {\n UseStreamOptions,\n ResolveStreamInterface,\n ResolveStreamOptions,\n InferBag,\n InferStateType,\n WithClassMessages,\n} from \"@langchain/langgraph-sdk/ui\";\nimport { useStreamLGP } from \"./stream.lgp.js\";\nimport { useStreamCustom } from \"./stream.custom.js\";\nimport type { UseStreamCustomOptions } from \"./types.js\";\n\nfunction isCustomOptions<\n StateType extends Record<string, unknown> = Record<string, unknown>,\n Bag extends BagTemplate = BagTemplate,\n>(\n options:\n | UseStreamOptions<StateType, Bag>\n | UseStreamCustomOptions<StateType, Bag
|
|
1
|
+
{"version":3,"file":"stream.cjs","names":["useStreamCustom","useStreamLGP"],"sources":["../src/stream.tsx"],"sourcesContent":["import { useState } from \"react\";\nimport type { BagTemplate } from \"@langchain/langgraph-sdk\";\nimport type {\n UseStreamOptions,\n ResolveStreamInterface,\n ResolveStreamOptions,\n InferBag,\n InferStateType,\n WithClassMessages,\n} from \"@langchain/langgraph-sdk/ui\";\nimport { useStreamLGP } from \"./stream.lgp.js\";\nimport { useStreamCustom } from \"./stream.custom.js\";\nimport type { UseStreamCustomOptions } from \"./types.js\";\n\nfunction isCustomOptions<\n StateType extends Record<string, unknown> = Record<string, unknown>,\n Bag extends BagTemplate = BagTemplate,\n>(\n options:\n | UseStreamOptions<StateType, Bag>\n | UseStreamCustomOptions<StateType, Bag>\n): options is UseStreamCustomOptions<StateType, Bag> {\n return \"transport\" in options;\n}\n\ntype UseStreamImplementation = typeof useStreamLGP | typeof useStreamCustom;\n\ntype AnyUseStreamOptions =\n | UseStreamOptions<Record<string, unknown>, BagTemplate>\n | UseStreamCustomOptions<Record<string, unknown>, BagTemplate>;\n\nfunction selectStreamImplementation(\n options: AnyUseStreamOptions\n): UseStreamImplementation {\n return isCustomOptions(options) ? useStreamCustom : useStreamLGP;\n}\n\nexport type {\n WithClassMessages,\n ClassSubagentStreamInterface,\n} from \"@langchain/langgraph-sdk/ui\";\n\n/**\n * A React hook that provides seamless integration with LangGraph streaming capabilities.\n *\n * The `useStream` hook handles all the complexities of streaming, state management, and branching logic,\n * letting you focus on building great chat experiences. It provides automatic state management for\n * messages, interrupts, loading states, subagent streams, and errors.\n *\n * ## Usage with ReactAgent (recommended for createAgent users)\n *\n * When using `createAgent` from `@langchain/langgraph`, you can pass `typeof agent` as the\n * type parameter to automatically infer tool call types:\n *\n * @example\n * ```typescript\n * // In your agent file (e.g., agent.ts)\n * import { createAgent, tool } from \"langchain\";\n * import { z } from \"zod\";\n *\n * const getWeather = tool(\n * async ({ location }) => `Weather in ${location}`,\n * { name: \"get_weather\", schema: z.object({ location: z.string() }) }\n * );\n *\n * export const agent = createAgent({\n * model: \"openai:gpt-4o\",\n * tools: [getWeather],\n * });\n *\n * // In your React component\n * import { agent } from \"./agent\";\n *\n * function Chat() {\n * // Tool calls are automatically typed from the agent's tools!\n * const stream = useStream<typeof agent>({\n * assistantId: \"agent\",\n * apiUrl: \"http://localhost:2024\",\n * });\n *\n * // stream.toolCalls[0].call.name is typed as \"get_weather\"\n * // stream.toolCalls[0].call.args is typed as { location: string }\n * }\n * ```\n *\n * ## Usage with StateGraph (for custom LangGraph applications)\n *\n * When building custom graphs with `StateGraph`, embed your tool call types directly\n * in your state's messages property using `Message<MyToolCalls>`:\n *\n * @example\n * ```typescript\n * import { Message } from \"@langchain/langgraph-sdk\";\n *\n * // Define your tool call types as a discriminated union\n * type MyToolCalls =\n * | { name: \"search\"; args: { query: string }; id?: string }\n * | { name: \"calculate\"; args: { expression: string }; id?: string };\n *\n * // Embed tool call types in your state's messages\n * interface MyGraphState {\n * messages: Message<MyToolCalls>[];\n * context?: string;\n * }\n *\n * function Chat() {\n * const stream = useStream<MyGraphState>({\n * assistantId: \"my-graph\",\n * apiUrl: \"http://localhost:2024\",\n * });\n *\n * // stream.values is typed as MyGraphState\n * // stream.toolCalls[0].call.name is typed as \"search\" | \"calculate\"\n * }\n * ```\n *\n * @example\n * ```typescript\n * // With additional type configuration (interrupts, configurable)\n * interface MyGraphState {\n * messages: Message<MyToolCalls>[];\n * }\n *\n * function Chat() {\n * const stream = useStream<MyGraphState, {\n * InterruptType: { question: string };\n * ConfigurableType: { userId: string };\n * }>({\n * assistantId: \"my-graph\",\n * apiUrl: \"http://localhost:2024\",\n * });\n *\n * // stream.interrupt is typed as { question: string } | undefined\n * }\n * ```\n *\n * ## Usage with Deep Agents (subagent streaming, experimental)\n *\n * For agents that spawn subagents (nested graphs), use `filterSubagentMessages`\n * to keep the main message stream clean while tracking subagent activity separately:\n *\n * @example\n * ```typescript\n * import { useStream, SubagentStream } from \"@langchain/langgraph-sdk/react\";\n * import type { agent } from \"./agent\";\n *\n * function DeepAgentChat() {\n * const stream = useStream<typeof agent>({\n * assistantId: \"deepagent\",\n * apiUrl: \"http://localhost:2024\",\n * // Filter subagent messages from main stream\n * filterSubagentMessages: true,\n * });\n *\n * const handleSubmit = (content: string) => {\n * stream.submit(\n * { messages: [{ content, type: \"human\" }] },\n * { streamSubgraphs: true } // Enable subgraph streaming\n * );\n * };\n *\n * // Access subagent streams via stream.subagents (Map<string, SubagentStream>)\n * const subagentList = [...stream.subagents.values()];\n *\n * return (\n * <div>\n * {stream.messages.map((msg) => <Message key={msg.id} message={msg} />)}\n *\n * {subagentList.map((subagent) => (\n * <SubagentCard\n * key={subagent.id}\n * status={subagent.status} // \"pending\" | \"running\" | \"complete\" | \"error\"\n * messages={subagent.messages}\n * toolCalls={subagent.toolCalls}\n * />\n * ))}\n * </div>\n * );\n * }\n * ```\n *\n * @template T Either a ReactAgent type (with `~agentTypes`) or a state type (`Record<string, unknown>`)\n * @template Bag Type configuration bag containing:\n * - `ConfigurableType`: Type for the `config.configurable` property\n * - `InterruptType`: Type for interrupt values\n * - `CustomEventType`: Type for custom events\n * - `UpdateType`: Type for the submit function updates\n *\n * @see {@link https://docs.langchain.com/langgraph-platform/use-stream-react | LangGraph React Integration Guide}\n */\nexport function useStream<\n T = Record<string, unknown>,\n Bag extends BagTemplate = BagTemplate,\n>(\n options: ResolveStreamOptions<T, InferBag<T, Bag>>\n): WithClassMessages<ResolveStreamInterface<T, InferBag<T, Bag>>>;\n\n/**\n * A React hook that provides seamless integration with LangGraph streaming capabilities.\n *\n * The `useStream` hook handles all the complexities of streaming, state management, and branching logic,\n * letting you focus on building great chat experiences. It provides automatic state management for\n * messages, interrupts, loading states, and errors.\n *\n * @template T Either a ReactAgent type (with `~agentTypes`) or a state type (`Record<string, unknown>`)\n * @template Bag Type configuration bag containing:\n * - `ConfigurableType`: Type for the `config.configurable` property\n * - `InterruptType`: Type for interrupt values\n * - `CustomEventType`: Type for custom events\n * - `UpdateType`: Type for the submit function updates\n *\n * @see {@link https://docs.langchain.com/langgraph-platform/use-stream-react | LangGraph React Integration Guide}\n */\nexport function useStream<\n T = Record<string, unknown>,\n Bag extends BagTemplate = BagTemplate,\n>(\n options: UseStreamCustomOptions<InferStateType<T>, InferBag<T, Bag>>\n): WithClassMessages<ResolveStreamInterface<T, InferBag<T, Bag>>>;\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport function useStream(options: any): any {\n // Keep implementation stable for the lifetime of this hook instance.\n const [useSelectedStream] = useState(() =>\n selectStreamImplementation(options)\n );\n return useSelectedStream(options);\n}\n"],"mappings":";;;;AAcA,SAAS,gBAIP,SAGmD;AACnD,QAAO,eAAe;;AASxB,SAAS,2BACP,SACyB;AACzB,QAAO,gBAAgB,QAAQ,GAAGA,sBAAAA,kBAAkBC,mBAAAA;;AA2LtD,SAAgB,UAAU,SAAmB;CAE3C,MAAM,CAAC,sBAAA,GAAA,MAAA,gBACL,2BAA2B,QAAQ,CACpC;AACD,QAAO,kBAAkB,QAAQ"}
|
package/dist/stream.custom.cjs
CHANGED
|
@@ -3,6 +3,7 @@ const require_thread = require("./thread.cjs");
|
|
|
3
3
|
let react = require("react");
|
|
4
4
|
let _langchain_langgraph_sdk_ui = require("@langchain/langgraph-sdk/ui");
|
|
5
5
|
let _langchain_langgraph_sdk_utils = require("@langchain/langgraph-sdk/utils");
|
|
6
|
+
let _langchain_langgraph_sdk = require("@langchain/langgraph-sdk");
|
|
6
7
|
//#region src/stream.custom.tsx
|
|
7
8
|
function createCustomTransportThreadState(values, threadId) {
|
|
8
9
|
return {
|
|
@@ -115,6 +116,24 @@ function useStreamCustom(options) {
|
|
|
115
116
|
const submit = async (values, submitOptions) => {
|
|
116
117
|
await submitDirect(values, submitOptions);
|
|
117
118
|
};
|
|
119
|
+
const handledToolsRef = (0, react.useRef)(/* @__PURE__ */ new Set());
|
|
120
|
+
(0, react.useEffect)(() => {
|
|
121
|
+
handledToolsRef.current.clear();
|
|
122
|
+
}, [threadId]);
|
|
123
|
+
(0, react.useEffect)(() => {
|
|
124
|
+
(0, _langchain_langgraph_sdk.flushPendingHeadlessToolInterrupts)(stream.values, options.tools, handledToolsRef.current, {
|
|
125
|
+
onTool: options.onTool,
|
|
126
|
+
defer: (run) => {
|
|
127
|
+
Promise.resolve().then(run);
|
|
128
|
+
},
|
|
129
|
+
resumeSubmit: (command) => submit(null, { command })
|
|
130
|
+
});
|
|
131
|
+
}, [
|
|
132
|
+
options.onTool,
|
|
133
|
+
options.tools,
|
|
134
|
+
stream.values,
|
|
135
|
+
submit
|
|
136
|
+
]);
|
|
118
137
|
return {
|
|
119
138
|
get values() {
|
|
120
139
|
return stream.values ?? {};
|
|
@@ -137,11 +156,7 @@ function useStreamCustom(options) {
|
|
|
137
156
|
};
|
|
138
157
|
},
|
|
139
158
|
get interrupts() {
|
|
140
|
-
if (stream.values != null && "__interrupt__" in stream.values && Array.isArray(stream.values.__interrupt__))
|
|
141
|
-
const valueInterrupts = stream.values.__interrupt__;
|
|
142
|
-
if (valueInterrupts.length === 0) return [{ when: "breakpoint" }];
|
|
143
|
-
return (0, _langchain_langgraph_sdk_ui.normalizeInterruptsList)(valueInterrupts);
|
|
144
|
-
}
|
|
159
|
+
if (stream.values != null && "__interrupt__" in stream.values && Array.isArray(stream.values.__interrupt__)) return (0, _langchain_langgraph_sdk_ui.userFacingInterruptsFromValuesArray)(stream.values.__interrupt__);
|
|
145
160
|
return [];
|
|
146
161
|
},
|
|
147
162
|
get interrupt() {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"stream.custom.cjs","names":["MessageTupleManager","StreamManager","toMessageClass","useControllableThreadId"],"sources":["../src/stream.custom.tsx"],"sourcesContent":["/* __LC_ALLOW_ENTRYPOINT_SIDE_EFFECTS__ */\n\n\"use client\";\n\nimport {\n useCallback,\n useEffect,\n useRef,\n useState,\n useSyncExternalStore,\n} from \"react\";\nimport {\n StreamManager,\n MessageTupleManager,\n extractInterrupts,\n normalizeInterruptsList,\n FetchStreamTransport,\n toMessageClass,\n ensureMessageInstances,\n type EventStreamEvent,\n type GetUpdateType,\n type GetCustomEventType,\n type GetInterruptType,\n type GetToolCallsType,\n type GetConfigurableType,\n type AnyStreamCustomOptions,\n type CustomSubmitOptions,\n type MessageMetadata,\n} from \"@langchain/langgraph-sdk/ui\";\nimport { getToolCallsWithResults } from \"@langchain/langgraph-sdk/utils\";\nimport type { BaseMessage } from \"@langchain/core/messages\";\nimport type {\n BagTemplate,\n Message,\n Interrupt,\n ThreadState,\n} from \"@langchain/langgraph-sdk\";\nimport { useControllableThreadId } from \"./thread.js\";\nimport type { UseStreamCustom } from \"./types.js\";\n\nexport { FetchStreamTransport };\n\nfunction createCustomTransportThreadState<\n StateType extends Record<string, unknown>,\n>(values: StateType, threadId: string): ThreadState<StateType> {\n return {\n values,\n next: [],\n tasks: [],\n metadata: undefined,\n created_at: null,\n checkpoint: {\n thread_id: threadId,\n checkpoint_id: null,\n checkpoint_ns: \"\",\n checkpoint_map: null,\n },\n parent_checkpoint: null,\n };\n}\n\nexport function useStreamCustom<\n StateType extends Record<string, unknown> = Record<string, unknown>,\n Bag extends BagTemplate = BagTemplate,\n>(\n options: AnyStreamCustomOptions<StateType, Bag>,\n): UseStreamCustom<StateType, Bag> {\n type UpdateType = GetUpdateType<Bag, StateType>;\n type CustomType = GetCustomEventType<Bag>;\n type InterruptType = GetInterruptType<Bag>;\n type ConfigurableType = GetConfigurableType<Bag>;\n type ToolCallType = GetToolCallsType<StateType>;\n\n const [messageManager] = useState(() => new MessageTupleManager());\n const [stream] = useState(\n () =>\n new StreamManager<StateType, Bag>(messageManager, {\n throttle: options.throttle ?? false,\n subagentToolNames: options.subagentToolNames,\n filterSubagentMessages: options.filterSubagentMessages,\n toMessage: options.toMessage ?? toMessageClass,\n }),\n );\n\n useSyncExternalStore(\n stream.subscribe,\n stream.getSnapshot,\n stream.getSnapshot,\n );\n\n const [branch, _setBranch] = useState(\"\");\n\n const [threadId, onThreadId] = useControllableThreadId(options);\n const threadIdRef = useRef<string | null>(threadId);\n\n // Cancel the stream if thread ID has changed\n useEffect(() => {\n if (threadIdRef.current !== threadId) {\n threadIdRef.current = threadId;\n stream.clear();\n }\n }, [threadId, stream]);\n\n const switchThread = useCallback(\n (newThreadId: string | null) => {\n if (newThreadId !== threadIdRef.current) {\n threadIdRef.current = newThreadId;\n stream.clear();\n }\n },\n [stream],\n );\n\n const getMessages = (value: StateType): Message[] => {\n const messagesKey = options.messagesKey ?? \"messages\";\n return Array.isArray(value[messagesKey])\n ? (value[messagesKey] as Message[])\n : [];\n };\n\n const setMessages = (current: StateType, messages: Message[]): StateType => {\n const messagesKey = options.messagesKey ?? \"messages\";\n return { ...current, [messagesKey]: messages };\n };\n\n const historyValues = options.initialValues ?? ({} as StateType);\n\n // Reconstruct subagents from initialValues when:\n // 1. Subagent filtering is enabled\n // 2. Not currently streaming\n // 3. initialValues has messages\n // This ensures subagent visualization works with cached/persisted state\n const historyMessages = getMessages(historyValues);\n const shouldReconstructSubagents =\n options.filterSubagentMessages &&\n !stream.isLoading &&\n historyMessages.length > 0;\n\n useEffect(() => {\n if (shouldReconstructSubagents) {\n // skipIfPopulated: true ensures we don't overwrite subagents from active streaming\n stream.reconstructSubagents(historyMessages, { skipIfPopulated: true });\n }\n // We intentionally only run this when shouldReconstructSubagents changes\n // to avoid unnecessary reconstructions during streaming\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [shouldReconstructSubagents, historyMessages.length]);\n\n const stop = () => stream.stop(historyValues, { onStop: options.onStop });\n\n const submitDirect = async (\n values: UpdateType | null | undefined,\n submitOptions?: CustomSubmitOptions<StateType, ConfigurableType>,\n ) => {\n if (threadId !== threadIdRef.current) {\n threadIdRef.current = threadId;\n stream.clear();\n }\n\n let usableThreadId = threadIdRef.current ?? submitOptions?.threadId;\n\n stream.setStreamValues(() => {\n if (submitOptions?.optimisticValues != null) {\n return {\n ...historyValues,\n ...(typeof submitOptions.optimisticValues === \"function\"\n ? submitOptions.optimisticValues(historyValues)\n : submitOptions.optimisticValues),\n };\n }\n\n return { ...historyValues };\n });\n\n await stream.start(\n async (signal: AbortSignal) => {\n if (!usableThreadId) {\n usableThreadId = crypto.randomUUID();\n threadIdRef.current = usableThreadId;\n onThreadId(usableThreadId);\n }\n\n if (!usableThreadId) {\n throw new Error(\"Failed to obtain valid thread ID.\");\n }\n\n return options.transport.stream({\n input: values,\n context: submitOptions?.context,\n command: submitOptions?.command,\n streamSubgraphs: submitOptions?.streamSubgraphs,\n signal,\n config: {\n ...submitOptions?.config,\n configurable: {\n thread_id: usableThreadId,\n ...submitOptions?.config?.configurable,\n } as unknown as GetConfigurableType<Bag>,\n },\n }) as Promise<\n AsyncGenerator<EventStreamEvent<StateType, UpdateType, CustomType>>\n >;\n },\n {\n getMessages,\n setMessages,\n\n initialValues: {} as StateType,\n callbacks: options,\n\n onSuccess: () => {\n if (!usableThreadId) return undefined;\n\n const finalValues = stream.values ?? historyValues;\n options.onFinish?.(\n createCustomTransportThreadState(finalValues, usableThreadId),\n undefined,\n );\n\n return undefined;\n },\n onError(error) {\n options.onError?.(error, undefined);\n submitOptions?.onError?.(error, undefined);\n },\n },\n );\n };\n\n const submit = async (\n values: UpdateType | null | undefined,\n submitOptions?: CustomSubmitOptions<StateType, ConfigurableType>,\n ) => {\n await submitDirect(values, submitOptions);\n };\n\n return {\n get values() {\n return stream.values ?? ({} as StateType);\n },\n\n error: stream.error,\n isLoading: stream.isLoading,\n\n stop,\n submit,\n switchThread,\n\n branch,\n setBranch: _setBranch,\n\n getMessagesMetadata(\n message: BaseMessage,\n index?: number,\n ): MessageMetadata<StateType> | undefined {\n const streamMetadata = messageManager.get(message.id)?.metadata;\n if (streamMetadata != null) {\n return {\n messageId: message.id ?? String(index),\n firstSeenState: undefined,\n branch: undefined,\n branchOptions: undefined,\n streamMetadata,\n } as MessageMetadata<StateType>;\n }\n return undefined;\n },\n\n get interrupts(): Interrupt<InterruptType>[] {\n if (\n stream.values != null &&\n \"__interrupt__\" in stream.values &&\n Array.isArray(stream.values.__interrupt__)\n ) {\n const valueInterrupts = stream.values.__interrupt__;\n if (valueInterrupts.length === 0) return [{ when: \"breakpoint\" }];\n return normalizeInterruptsList(\n valueInterrupts as Interrupt<InterruptType>[],\n );\n }\n\n return [];\n },\n\n get interrupt(): Interrupt<InterruptType> | undefined {\n return extractInterrupts<InterruptType>(stream.values);\n },\n\n get messages(): BaseMessage[] {\n if (!stream.values) return [];\n return ensureMessageInstances(\n getMessages(stream.values),\n ) as BaseMessage[];\n },\n\n get toolCalls() {\n if (!stream.values) return [];\n const msgs = getMessages(stream.values);\n return getToolCallsWithResults<ToolCallType>(msgs);\n },\n\n getToolCalls(message) {\n if (!stream.values) return [];\n const msgs = getMessages(stream.values);\n const allToolCalls = getToolCallsWithResults<ToolCallType>(msgs);\n return allToolCalls.filter((tc) => tc.aiMessage.id === message.id);\n },\n\n get subagents() {\n return stream.getSubagents();\n },\n\n get activeSubagents() {\n return stream.getActiveSubagents();\n },\n\n getSubagent(toolCallId: string) {\n return stream.getSubagent(toolCallId);\n },\n\n getSubagentsByType(type: string) {\n return stream.getSubagentsByType(type);\n },\n\n getSubagentsByMessage(messageId: string) {\n return stream.getSubagentsByMessage(messageId);\n },\n\n queue: {\n get entries() {\n return [];\n },\n get size() {\n return 0;\n },\n async cancel() {\n return false;\n },\n async clear() {},\n },\n };\n}\n"],"mappings":";;;;;;AA0CA,SAAS,iCAEP,QAAmB,UAA0C;AAC7D,QAAO;EACL;EACA,MAAM,EAAE;EACR,OAAO,EAAE;EACT,UAAU,KAAA;EACV,YAAY;EACZ,YAAY;GACV,WAAW;GACX,eAAe;GACf,eAAe;GACf,gBAAgB;GACjB;EACD,mBAAmB;EACpB;;AAGH,SAAgB,gBAId,SACiC;CAOjC,MAAM,CAAC,mBAAA,GAAA,MAAA,gBAAiC,IAAIA,4BAAAA,qBAAqB,CAAC;CAClE,MAAM,CAAC,WAAA,GAAA,MAAA,gBAEH,IAAIC,4BAAAA,cAA8B,gBAAgB;EAChD,UAAU,QAAQ,YAAY;EAC9B,mBAAmB,QAAQ;EAC3B,wBAAwB,QAAQ;EAChC,WAAW,QAAQ,aAAaC,4BAAAA;EACjC,CAAC,CACL;AAED,EAAA,GAAA,MAAA,sBACE,OAAO,WACP,OAAO,aACP,OAAO,YACR;CAED,MAAM,CAAC,QAAQ,eAAA,GAAA,MAAA,UAAuB,GAAG;CAEzC,MAAM,CAAC,UAAU,cAAcC,eAAAA,wBAAwB,QAAQ;CAC/D,MAAM,eAAA,GAAA,MAAA,QAAoC,SAAS;AAGnD,EAAA,GAAA,MAAA,iBAAgB;AACd,MAAI,YAAY,YAAY,UAAU;AACpC,eAAY,UAAU;AACtB,UAAO,OAAO;;IAEf,CAAC,UAAU,OAAO,CAAC;CAEtB,MAAM,gBAAA,GAAA,MAAA,cACH,gBAA+B;AAC9B,MAAI,gBAAgB,YAAY,SAAS;AACvC,eAAY,UAAU;AACtB,UAAO,OAAO;;IAGlB,CAAC,OAAO,CACT;CAED,MAAM,eAAe,UAAgC;EACnD,MAAM,cAAc,QAAQ,eAAe;AAC3C,SAAO,MAAM,QAAQ,MAAM,aAAa,GACnC,MAAM,eACP,EAAE;;CAGR,MAAM,eAAe,SAAoB,aAAmC;EAC1E,MAAM,cAAc,QAAQ,eAAe;AAC3C,SAAO;GAAE,GAAG;IAAU,cAAc;GAAU;;CAGhD,MAAM,gBAAgB,QAAQ,iBAAkB,EAAE;CAOlD,MAAM,kBAAkB,YAAY,cAAc;CAClD,MAAM,6BACJ,QAAQ,0BACR,CAAC,OAAO,aACR,gBAAgB,SAAS;AAE3B,EAAA,GAAA,MAAA,iBAAgB;AACd,MAAI,2BAEF,QAAO,qBAAqB,iBAAiB,EAAE,iBAAiB,MAAM,CAAC;IAKxE,CAAC,4BAA4B,gBAAgB,OAAO,CAAC;CAExD,MAAM,aAAa,OAAO,KAAK,eAAe,EAAE,QAAQ,QAAQ,QAAQ,CAAC;CAEzE,MAAM,eAAe,OACnB,QACA,kBACG;AACH,MAAI,aAAa,YAAY,SAAS;AACpC,eAAY,UAAU;AACtB,UAAO,OAAO;;EAGhB,IAAI,iBAAiB,YAAY,WAAW,eAAe;AAE3D,SAAO,sBAAsB;AAC3B,OAAI,eAAe,oBAAoB,KACrC,QAAO;IACL,GAAG;IACH,GAAI,OAAO,cAAc,qBAAqB,aAC1C,cAAc,iBAAiB,cAAc,GAC7C,cAAc;IACnB;AAGH,UAAO,EAAE,GAAG,eAAe;IAC3B;AAEF,QAAM,OAAO,MACX,OAAO,WAAwB;AAC7B,OAAI,CAAC,gBAAgB;AACnB,qBAAiB,OAAO,YAAY;AACpC,gBAAY,UAAU;AACtB,eAAW,eAAe;;AAG5B,OAAI,CAAC,eACH,OAAM,IAAI,MAAM,oCAAoC;AAGtD,UAAO,QAAQ,UAAU,OAAO;IAC9B,OAAO;IACP,SAAS,eAAe;IACxB,SAAS,eAAe;IACxB,iBAAiB,eAAe;IAChC;IACA,QAAQ;KACN,GAAG,eAAe;KAClB,cAAc;MACZ,WAAW;MACX,GAAG,eAAe,QAAQ;MAC3B;KACF;IACF,CAAC;KAIJ;GACE;GACA;GAEA,eAAe,EAAE;GACjB,WAAW;GAEX,iBAAiB;AACf,QAAI,CAAC,eAAgB,QAAO,KAAA;IAE5B,MAAM,cAAc,OAAO,UAAU;AACrC,YAAQ,WACN,iCAAiC,aAAa,eAAe,EAC7D,KAAA,EACD;;GAIH,QAAQ,OAAO;AACb,YAAQ,UAAU,OAAO,KAAA,EAAU;AACnC,mBAAe,UAAU,OAAO,KAAA,EAAU;;GAE7C,CACF;;CAGH,MAAM,SAAS,OACb,QACA,kBACG;AACH,QAAM,aAAa,QAAQ,cAAc;;AAG3C,QAAO;EACL,IAAI,SAAS;AACX,UAAO,OAAO,UAAW,EAAE;;EAG7B,OAAO,OAAO;EACd,WAAW,OAAO;EAElB;EACA;EACA;EAEA;EACA,WAAW;EAEX,oBACE,SACA,OACwC;GACxC,MAAM,iBAAiB,eAAe,IAAI,QAAQ,GAAG,EAAE;AACvD,OAAI,kBAAkB,KACpB,QAAO;IACL,WAAW,QAAQ,MAAM,OAAO,MAAM;IACtC,gBAAgB,KAAA;IAChB,QAAQ,KAAA;IACR,eAAe,KAAA;IACf;IACD;;EAKL,IAAI,aAAyC;AAC3C,OACE,OAAO,UAAU,QACjB,mBAAmB,OAAO,UAC1B,MAAM,QAAQ,OAAO,OAAO,cAAc,EAC1C;IACA,MAAM,kBAAkB,OAAO,OAAO;AACtC,QAAI,gBAAgB,WAAW,EAAG,QAAO,CAAC,EAAE,MAAM,cAAc,CAAC;AACjE,YAAA,GAAA,4BAAA,yBACE,gBACD;;AAGH,UAAO,EAAE;;EAGX,IAAI,YAAkD;AACpD,WAAA,GAAA,4BAAA,mBAAwC,OAAO,OAAO;;EAGxD,IAAI,WAA0B;AAC5B,OAAI,CAAC,OAAO,OAAQ,QAAO,EAAE;AAC7B,WAAA,GAAA,4BAAA,wBACE,YAAY,OAAO,OAAO,CAC3B;;EAGH,IAAI,YAAY;AACd,OAAI,CAAC,OAAO,OAAQ,QAAO,EAAE;AAE7B,WAAA,GAAA,+BAAA,yBADa,YAAY,OAAO,OAAO,CACW;;EAGpD,aAAa,SAAS;AACpB,OAAI,CAAC,OAAO,OAAQ,QAAO,EAAE;AAG7B,WAAA,GAAA,+BAAA,yBAFa,YAAY,OAAO,OAAO,CACyB,CAC5C,QAAQ,OAAO,GAAG,UAAU,OAAO,QAAQ,GAAG;;EAGpE,IAAI,YAAY;AACd,UAAO,OAAO,cAAc;;EAG9B,IAAI,kBAAkB;AACpB,UAAO,OAAO,oBAAoB;;EAGpC,YAAY,YAAoB;AAC9B,UAAO,OAAO,YAAY,WAAW;;EAGvC,mBAAmB,MAAc;AAC/B,UAAO,OAAO,mBAAmB,KAAK;;EAGxC,sBAAsB,WAAmB;AACvC,UAAO,OAAO,sBAAsB,UAAU;;EAGhD,OAAO;GACL,IAAI,UAAU;AACZ,WAAO,EAAE;;GAEX,IAAI,OAAO;AACT,WAAO;;GAET,MAAM,SAAS;AACb,WAAO;;GAET,MAAM,QAAQ;GACf;EACF"}
|
|
1
|
+
{"version":3,"file":"stream.custom.cjs","names":["MessageTupleManager","StreamManager","toMessageClass","useControllableThreadId"],"sources":["../src/stream.custom.tsx"],"sourcesContent":["/* __LC_ALLOW_ENTRYPOINT_SIDE_EFFECTS__ */\n\n\"use client\";\n\nimport {\n useCallback,\n useEffect,\n useRef,\n useState,\n useSyncExternalStore,\n} from \"react\";\nimport {\n StreamManager,\n MessageTupleManager,\n extractInterrupts,\n userFacingInterruptsFromValuesArray,\n FetchStreamTransport,\n toMessageClass,\n ensureMessageInstances,\n type EventStreamEvent,\n type GetUpdateType,\n type GetCustomEventType,\n type GetInterruptType,\n type GetToolCallsType,\n type GetConfigurableType,\n type AnyStreamCustomOptions,\n type CustomSubmitOptions,\n type MessageMetadata,\n} from \"@langchain/langgraph-sdk/ui\";\nimport { getToolCallsWithResults } from \"@langchain/langgraph-sdk/utils\";\nimport type { BaseMessage } from \"@langchain/core/messages\";\nimport type {\n BagTemplate,\n Message,\n Interrupt,\n ThreadState,\n} from \"@langchain/langgraph-sdk\";\nimport { flushPendingHeadlessToolInterrupts } from \"@langchain/langgraph-sdk\";\nimport { useControllableThreadId } from \"./thread.js\";\nimport type { UseStreamCustom } from \"./types.js\";\n\nexport { FetchStreamTransport };\n\nfunction createCustomTransportThreadState<\n StateType extends Record<string, unknown>,\n>(values: StateType, threadId: string): ThreadState<StateType> {\n return {\n values,\n next: [],\n tasks: [],\n metadata: undefined,\n created_at: null,\n checkpoint: {\n thread_id: threadId,\n checkpoint_id: null,\n checkpoint_ns: \"\",\n checkpoint_map: null,\n },\n parent_checkpoint: null,\n };\n}\n\nexport function useStreamCustom<\n StateType extends Record<string, unknown> = Record<string, unknown>,\n Bag extends BagTemplate = BagTemplate,\n>(\n options: AnyStreamCustomOptions<StateType, Bag>\n): UseStreamCustom<StateType, Bag> {\n type UpdateType = GetUpdateType<Bag, StateType>;\n type CustomType = GetCustomEventType<Bag>;\n type InterruptType = GetInterruptType<Bag>;\n type ConfigurableType = GetConfigurableType<Bag>;\n type ToolCallType = GetToolCallsType<StateType>;\n\n const [messageManager] = useState(() => new MessageTupleManager());\n const [stream] = useState(\n () =>\n new StreamManager<StateType, Bag>(messageManager, {\n throttle: options.throttle ?? false,\n subagentToolNames: options.subagentToolNames,\n filterSubagentMessages: options.filterSubagentMessages,\n toMessage: options.toMessage ?? toMessageClass,\n })\n );\n\n useSyncExternalStore(\n stream.subscribe,\n stream.getSnapshot,\n stream.getSnapshot\n );\n\n const [branch, _setBranch] = useState(\"\");\n\n const [threadId, onThreadId] = useControllableThreadId(options);\n const threadIdRef = useRef<string | null>(threadId);\n\n // Cancel the stream if thread ID has changed\n useEffect(() => {\n if (threadIdRef.current !== threadId) {\n threadIdRef.current = threadId;\n stream.clear();\n }\n }, [threadId, stream]);\n\n const switchThread = useCallback(\n (newThreadId: string | null) => {\n if (newThreadId !== threadIdRef.current) {\n threadIdRef.current = newThreadId;\n stream.clear();\n }\n },\n [stream]\n );\n\n const getMessages = (value: StateType): Message[] => {\n const messagesKey = options.messagesKey ?? \"messages\";\n return Array.isArray(value[messagesKey])\n ? (value[messagesKey] as Message[])\n : [];\n };\n\n const setMessages = (current: StateType, messages: Message[]): StateType => {\n const messagesKey = options.messagesKey ?? \"messages\";\n return { ...current, [messagesKey]: messages };\n };\n\n const historyValues = options.initialValues ?? ({} as StateType);\n\n // Reconstruct subagents from initialValues when:\n // 1. Subagent filtering is enabled\n // 2. Not currently streaming\n // 3. initialValues has messages\n // This ensures subagent visualization works with cached/persisted state\n const historyMessages = getMessages(historyValues);\n const shouldReconstructSubagents =\n options.filterSubagentMessages &&\n !stream.isLoading &&\n historyMessages.length > 0;\n\n useEffect(() => {\n if (shouldReconstructSubagents) {\n // skipIfPopulated: true ensures we don't overwrite subagents from active streaming\n stream.reconstructSubagents(historyMessages, { skipIfPopulated: true });\n }\n // We intentionally only run this when shouldReconstructSubagents changes\n // to avoid unnecessary reconstructions during streaming\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [shouldReconstructSubagents, historyMessages.length]);\n\n const stop = () => stream.stop(historyValues, { onStop: options.onStop });\n\n const submitDirect = async (\n values: UpdateType | null | undefined,\n submitOptions?: CustomSubmitOptions<StateType, ConfigurableType>\n ) => {\n if (threadId !== threadIdRef.current) {\n threadIdRef.current = threadId;\n stream.clear();\n }\n\n let usableThreadId = threadIdRef.current ?? submitOptions?.threadId;\n\n stream.setStreamValues(() => {\n if (submitOptions?.optimisticValues != null) {\n return {\n ...historyValues,\n ...(typeof submitOptions.optimisticValues === \"function\"\n ? submitOptions.optimisticValues(historyValues)\n : submitOptions.optimisticValues),\n };\n }\n\n return { ...historyValues };\n });\n\n await stream.start(\n async (signal: AbortSignal) => {\n if (!usableThreadId) {\n usableThreadId = crypto.randomUUID();\n threadIdRef.current = usableThreadId;\n onThreadId(usableThreadId);\n }\n\n if (!usableThreadId) {\n throw new Error(\"Failed to obtain valid thread ID.\");\n }\n\n return options.transport.stream({\n input: values,\n context: submitOptions?.context,\n command: submitOptions?.command,\n streamSubgraphs: submitOptions?.streamSubgraphs,\n signal,\n config: {\n ...submitOptions?.config,\n configurable: {\n thread_id: usableThreadId,\n ...submitOptions?.config?.configurable,\n } as unknown as GetConfigurableType<Bag>,\n },\n }) as Promise<\n AsyncGenerator<EventStreamEvent<StateType, UpdateType, CustomType>>\n >;\n },\n {\n getMessages,\n setMessages,\n\n initialValues: {} as StateType,\n callbacks: options,\n\n onSuccess: () => {\n if (!usableThreadId) return undefined;\n\n const finalValues = stream.values ?? historyValues;\n options.onFinish?.(\n createCustomTransportThreadState(finalValues, usableThreadId),\n undefined\n );\n\n return undefined;\n },\n onError(error) {\n options.onError?.(error, undefined);\n submitOptions?.onError?.(error, undefined);\n },\n }\n );\n };\n\n const submit = async (\n values: UpdateType | null | undefined,\n submitOptions?: CustomSubmitOptions<StateType, ConfigurableType>\n ) => {\n await submitDirect(values, submitOptions);\n };\n\n const handledToolsRef = useRef<Set<string>>(new Set());\n useEffect(() => {\n handledToolsRef.current.clear();\n }, [threadId]);\n\n useEffect(() => {\n flushPendingHeadlessToolInterrupts(\n stream.values as Record<string, unknown> | null,\n options.tools,\n handledToolsRef.current,\n {\n onTool: options.onTool,\n defer: (run) => {\n void Promise.resolve().then(run);\n },\n resumeSubmit: (command) =>\n submit(null, {\n command,\n }),\n }\n );\n }, [options.onTool, options.tools, stream.values, submit]);\n\n return {\n get values() {\n return stream.values ?? ({} as StateType);\n },\n\n error: stream.error,\n isLoading: stream.isLoading,\n\n stop,\n submit,\n switchThread,\n\n branch,\n setBranch: _setBranch,\n\n getMessagesMetadata(\n message: BaseMessage,\n index?: number\n ): MessageMetadata<StateType> | undefined {\n const streamMetadata = messageManager.get(message.id)?.metadata;\n if (streamMetadata != null) {\n return {\n messageId: message.id ?? String(index),\n firstSeenState: undefined,\n branch: undefined,\n branchOptions: undefined,\n streamMetadata,\n } as MessageMetadata<StateType>;\n }\n return undefined;\n },\n\n get interrupts(): Interrupt<InterruptType>[] {\n if (\n stream.values != null &&\n \"__interrupt__\" in stream.values &&\n Array.isArray(stream.values.__interrupt__)\n ) {\n return userFacingInterruptsFromValuesArray<InterruptType>(\n stream.values.__interrupt__ as Interrupt<InterruptType>[]\n );\n }\n\n return [];\n },\n\n get interrupt(): Interrupt<InterruptType> | undefined {\n return extractInterrupts<InterruptType>(stream.values);\n },\n\n get messages(): BaseMessage[] {\n if (!stream.values) return [];\n return ensureMessageInstances(\n getMessages(stream.values)\n ) as BaseMessage[];\n },\n\n get toolCalls() {\n if (!stream.values) return [];\n const msgs = getMessages(stream.values);\n return getToolCallsWithResults<ToolCallType>(msgs);\n },\n\n getToolCalls(message) {\n if (!stream.values) return [];\n const msgs = getMessages(stream.values);\n const allToolCalls = getToolCallsWithResults<ToolCallType>(msgs);\n return allToolCalls.filter((tc) => tc.aiMessage.id === message.id);\n },\n\n get subagents() {\n return stream.getSubagents();\n },\n\n get activeSubagents() {\n return stream.getActiveSubagents();\n },\n\n getSubagent(toolCallId: string) {\n return stream.getSubagent(toolCallId);\n },\n\n getSubagentsByType(type: string) {\n return stream.getSubagentsByType(type);\n },\n\n getSubagentsByMessage(messageId: string) {\n return stream.getSubagentsByMessage(messageId);\n },\n\n queue: {\n get entries() {\n return [];\n },\n get size() {\n return 0;\n },\n async cancel() {\n return false;\n },\n async clear() {},\n },\n };\n}\n"],"mappings":"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"}
|
package/dist/stream.custom.js
CHANGED
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { useControllableThreadId } from "./thread.js";
|
|
3
3
|
import { useCallback, useEffect, useRef, useState, useSyncExternalStore } from "react";
|
|
4
|
-
import { FetchStreamTransport, MessageTupleManager, StreamManager, ensureMessageInstances, extractInterrupts,
|
|
4
|
+
import { FetchStreamTransport, MessageTupleManager, StreamManager, ensureMessageInstances, extractInterrupts, toMessageClass, userFacingInterruptsFromValuesArray } from "@langchain/langgraph-sdk/ui";
|
|
5
5
|
import { getToolCallsWithResults } from "@langchain/langgraph-sdk/utils";
|
|
6
|
+
import { flushPendingHeadlessToolInterrupts } from "@langchain/langgraph-sdk";
|
|
6
7
|
//#region src/stream.custom.tsx
|
|
7
8
|
function createCustomTransportThreadState(values, threadId) {
|
|
8
9
|
return {
|
|
@@ -115,6 +116,24 @@ function useStreamCustom(options) {
|
|
|
115
116
|
const submit = async (values, submitOptions) => {
|
|
116
117
|
await submitDirect(values, submitOptions);
|
|
117
118
|
};
|
|
119
|
+
const handledToolsRef = useRef(/* @__PURE__ */ new Set());
|
|
120
|
+
useEffect(() => {
|
|
121
|
+
handledToolsRef.current.clear();
|
|
122
|
+
}, [threadId]);
|
|
123
|
+
useEffect(() => {
|
|
124
|
+
flushPendingHeadlessToolInterrupts(stream.values, options.tools, handledToolsRef.current, {
|
|
125
|
+
onTool: options.onTool,
|
|
126
|
+
defer: (run) => {
|
|
127
|
+
Promise.resolve().then(run);
|
|
128
|
+
},
|
|
129
|
+
resumeSubmit: (command) => submit(null, { command })
|
|
130
|
+
});
|
|
131
|
+
}, [
|
|
132
|
+
options.onTool,
|
|
133
|
+
options.tools,
|
|
134
|
+
stream.values,
|
|
135
|
+
submit
|
|
136
|
+
]);
|
|
118
137
|
return {
|
|
119
138
|
get values() {
|
|
120
139
|
return stream.values ?? {};
|
|
@@ -137,11 +156,7 @@ function useStreamCustom(options) {
|
|
|
137
156
|
};
|
|
138
157
|
},
|
|
139
158
|
get interrupts() {
|
|
140
|
-
if (stream.values != null && "__interrupt__" in stream.values && Array.isArray(stream.values.__interrupt__))
|
|
141
|
-
const valueInterrupts = stream.values.__interrupt__;
|
|
142
|
-
if (valueInterrupts.length === 0) return [{ when: "breakpoint" }];
|
|
143
|
-
return normalizeInterruptsList(valueInterrupts);
|
|
144
|
-
}
|
|
159
|
+
if (stream.values != null && "__interrupt__" in stream.values && Array.isArray(stream.values.__interrupt__)) return userFacingInterruptsFromValuesArray(stream.values.__interrupt__);
|
|
145
160
|
return [];
|
|
146
161
|
},
|
|
147
162
|
get interrupt() {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"stream.custom.js","names":[],"sources":["../src/stream.custom.tsx"],"sourcesContent":["/* __LC_ALLOW_ENTRYPOINT_SIDE_EFFECTS__ */\n\n\"use client\";\n\nimport {\n useCallback,\n useEffect,\n useRef,\n useState,\n useSyncExternalStore,\n} from \"react\";\nimport {\n StreamManager,\n MessageTupleManager,\n extractInterrupts,\n normalizeInterruptsList,\n FetchStreamTransport,\n toMessageClass,\n ensureMessageInstances,\n type EventStreamEvent,\n type GetUpdateType,\n type GetCustomEventType,\n type GetInterruptType,\n type GetToolCallsType,\n type GetConfigurableType,\n type AnyStreamCustomOptions,\n type CustomSubmitOptions,\n type MessageMetadata,\n} from \"@langchain/langgraph-sdk/ui\";\nimport { getToolCallsWithResults } from \"@langchain/langgraph-sdk/utils\";\nimport type { BaseMessage } from \"@langchain/core/messages\";\nimport type {\n BagTemplate,\n Message,\n Interrupt,\n ThreadState,\n} from \"@langchain/langgraph-sdk\";\nimport { useControllableThreadId } from \"./thread.js\";\nimport type { UseStreamCustom } from \"./types.js\";\n\nexport { FetchStreamTransport };\n\nfunction createCustomTransportThreadState<\n StateType extends Record<string, unknown>,\n>(values: StateType, threadId: string): ThreadState<StateType> {\n return {\n values,\n next: [],\n tasks: [],\n metadata: undefined,\n created_at: null,\n checkpoint: {\n thread_id: threadId,\n checkpoint_id: null,\n checkpoint_ns: \"\",\n checkpoint_map: null,\n },\n parent_checkpoint: null,\n };\n}\n\nexport function useStreamCustom<\n StateType extends Record<string, unknown> = Record<string, unknown>,\n Bag extends BagTemplate = BagTemplate,\n>(\n options: AnyStreamCustomOptions<StateType, Bag>,\n): UseStreamCustom<StateType, Bag> {\n type UpdateType = GetUpdateType<Bag, StateType>;\n type CustomType = GetCustomEventType<Bag>;\n type InterruptType = GetInterruptType<Bag>;\n type ConfigurableType = GetConfigurableType<Bag>;\n type ToolCallType = GetToolCallsType<StateType>;\n\n const [messageManager] = useState(() => new MessageTupleManager());\n const [stream] = useState(\n () =>\n new StreamManager<StateType, Bag>(messageManager, {\n throttle: options.throttle ?? false,\n subagentToolNames: options.subagentToolNames,\n filterSubagentMessages: options.filterSubagentMessages,\n toMessage: options.toMessage ?? toMessageClass,\n }),\n );\n\n useSyncExternalStore(\n stream.subscribe,\n stream.getSnapshot,\n stream.getSnapshot,\n );\n\n const [branch, _setBranch] = useState(\"\");\n\n const [threadId, onThreadId] = useControllableThreadId(options);\n const threadIdRef = useRef<string | null>(threadId);\n\n // Cancel the stream if thread ID has changed\n useEffect(() => {\n if (threadIdRef.current !== threadId) {\n threadIdRef.current = threadId;\n stream.clear();\n }\n }, [threadId, stream]);\n\n const switchThread = useCallback(\n (newThreadId: string | null) => {\n if (newThreadId !== threadIdRef.current) {\n threadIdRef.current = newThreadId;\n stream.clear();\n }\n },\n [stream],\n );\n\n const getMessages = (value: StateType): Message[] => {\n const messagesKey = options.messagesKey ?? \"messages\";\n return Array.isArray(value[messagesKey])\n ? (value[messagesKey] as Message[])\n : [];\n };\n\n const setMessages = (current: StateType, messages: Message[]): StateType => {\n const messagesKey = options.messagesKey ?? \"messages\";\n return { ...current, [messagesKey]: messages };\n };\n\n const historyValues = options.initialValues ?? ({} as StateType);\n\n // Reconstruct subagents from initialValues when:\n // 1. Subagent filtering is enabled\n // 2. Not currently streaming\n // 3. initialValues has messages\n // This ensures subagent visualization works with cached/persisted state\n const historyMessages = getMessages(historyValues);\n const shouldReconstructSubagents =\n options.filterSubagentMessages &&\n !stream.isLoading &&\n historyMessages.length > 0;\n\n useEffect(() => {\n if (shouldReconstructSubagents) {\n // skipIfPopulated: true ensures we don't overwrite subagents from active streaming\n stream.reconstructSubagents(historyMessages, { skipIfPopulated: true });\n }\n // We intentionally only run this when shouldReconstructSubagents changes\n // to avoid unnecessary reconstructions during streaming\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [shouldReconstructSubagents, historyMessages.length]);\n\n const stop = () => stream.stop(historyValues, { onStop: options.onStop });\n\n const submitDirect = async (\n values: UpdateType | null | undefined,\n submitOptions?: CustomSubmitOptions<StateType, ConfigurableType>,\n ) => {\n if (threadId !== threadIdRef.current) {\n threadIdRef.current = threadId;\n stream.clear();\n }\n\n let usableThreadId = threadIdRef.current ?? submitOptions?.threadId;\n\n stream.setStreamValues(() => {\n if (submitOptions?.optimisticValues != null) {\n return {\n ...historyValues,\n ...(typeof submitOptions.optimisticValues === \"function\"\n ? submitOptions.optimisticValues(historyValues)\n : submitOptions.optimisticValues),\n };\n }\n\n return { ...historyValues };\n });\n\n await stream.start(\n async (signal: AbortSignal) => {\n if (!usableThreadId) {\n usableThreadId = crypto.randomUUID();\n threadIdRef.current = usableThreadId;\n onThreadId(usableThreadId);\n }\n\n if (!usableThreadId) {\n throw new Error(\"Failed to obtain valid thread ID.\");\n }\n\n return options.transport.stream({\n input: values,\n context: submitOptions?.context,\n command: submitOptions?.command,\n streamSubgraphs: submitOptions?.streamSubgraphs,\n signal,\n config: {\n ...submitOptions?.config,\n configurable: {\n thread_id: usableThreadId,\n ...submitOptions?.config?.configurable,\n } as unknown as GetConfigurableType<Bag>,\n },\n }) as Promise<\n AsyncGenerator<EventStreamEvent<StateType, UpdateType, CustomType>>\n >;\n },\n {\n getMessages,\n setMessages,\n\n initialValues: {} as StateType,\n callbacks: options,\n\n onSuccess: () => {\n if (!usableThreadId) return undefined;\n\n const finalValues = stream.values ?? historyValues;\n options.onFinish?.(\n createCustomTransportThreadState(finalValues, usableThreadId),\n undefined,\n );\n\n return undefined;\n },\n onError(error) {\n options.onError?.(error, undefined);\n submitOptions?.onError?.(error, undefined);\n },\n },\n );\n };\n\n const submit = async (\n values: UpdateType | null | undefined,\n submitOptions?: CustomSubmitOptions<StateType, ConfigurableType>,\n ) => {\n await submitDirect(values, submitOptions);\n };\n\n return {\n get values() {\n return stream.values ?? ({} as StateType);\n },\n\n error: stream.error,\n isLoading: stream.isLoading,\n\n stop,\n submit,\n switchThread,\n\n branch,\n setBranch: _setBranch,\n\n getMessagesMetadata(\n message: BaseMessage,\n index?: number,\n ): MessageMetadata<StateType> | undefined {\n const streamMetadata = messageManager.get(message.id)?.metadata;\n if (streamMetadata != null) {\n return {\n messageId: message.id ?? String(index),\n firstSeenState: undefined,\n branch: undefined,\n branchOptions: undefined,\n streamMetadata,\n } as MessageMetadata<StateType>;\n }\n return undefined;\n },\n\n get interrupts(): Interrupt<InterruptType>[] {\n if (\n stream.values != null &&\n \"__interrupt__\" in stream.values &&\n Array.isArray(stream.values.__interrupt__)\n ) {\n const valueInterrupts = stream.values.__interrupt__;\n if (valueInterrupts.length === 0) return [{ when: \"breakpoint\" }];\n return normalizeInterruptsList(\n valueInterrupts as Interrupt<InterruptType>[],\n );\n }\n\n return [];\n },\n\n get interrupt(): Interrupt<InterruptType> | undefined {\n return extractInterrupts<InterruptType>(stream.values);\n },\n\n get messages(): BaseMessage[] {\n if (!stream.values) return [];\n return ensureMessageInstances(\n getMessages(stream.values),\n ) as BaseMessage[];\n },\n\n get toolCalls() {\n if (!stream.values) return [];\n const msgs = getMessages(stream.values);\n return getToolCallsWithResults<ToolCallType>(msgs);\n },\n\n getToolCalls(message) {\n if (!stream.values) return [];\n const msgs = getMessages(stream.values);\n const allToolCalls = getToolCallsWithResults<ToolCallType>(msgs);\n return allToolCalls.filter((tc) => tc.aiMessage.id === message.id);\n },\n\n get subagents() {\n return stream.getSubagents();\n },\n\n get activeSubagents() {\n return stream.getActiveSubagents();\n },\n\n getSubagent(toolCallId: string) {\n return stream.getSubagent(toolCallId);\n },\n\n getSubagentsByType(type: string) {\n return stream.getSubagentsByType(type);\n },\n\n getSubagentsByMessage(messageId: string) {\n return stream.getSubagentsByMessage(messageId);\n },\n\n queue: {\n get entries() {\n return [];\n },\n get size() {\n return 0;\n },\n async cancel() {\n return false;\n },\n async clear() {},\n },\n };\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"stream.custom.js","names":[],"sources":["../src/stream.custom.tsx"],"sourcesContent":["/* __LC_ALLOW_ENTRYPOINT_SIDE_EFFECTS__ */\n\n\"use client\";\n\nimport {\n useCallback,\n useEffect,\n useRef,\n useState,\n useSyncExternalStore,\n} from \"react\";\nimport {\n StreamManager,\n MessageTupleManager,\n extractInterrupts,\n userFacingInterruptsFromValuesArray,\n FetchStreamTransport,\n toMessageClass,\n ensureMessageInstances,\n type EventStreamEvent,\n type GetUpdateType,\n type GetCustomEventType,\n type GetInterruptType,\n type GetToolCallsType,\n type GetConfigurableType,\n type AnyStreamCustomOptions,\n type CustomSubmitOptions,\n type MessageMetadata,\n} from \"@langchain/langgraph-sdk/ui\";\nimport { getToolCallsWithResults } from \"@langchain/langgraph-sdk/utils\";\nimport type { BaseMessage } from \"@langchain/core/messages\";\nimport type {\n BagTemplate,\n Message,\n Interrupt,\n ThreadState,\n} from \"@langchain/langgraph-sdk\";\nimport { flushPendingHeadlessToolInterrupts } from \"@langchain/langgraph-sdk\";\nimport { useControllableThreadId } from \"./thread.js\";\nimport type { UseStreamCustom } from \"./types.js\";\n\nexport { FetchStreamTransport };\n\nfunction createCustomTransportThreadState<\n StateType extends Record<string, unknown>,\n>(values: StateType, threadId: string): ThreadState<StateType> {\n return {\n values,\n next: [],\n tasks: [],\n metadata: undefined,\n created_at: null,\n checkpoint: {\n thread_id: threadId,\n checkpoint_id: null,\n checkpoint_ns: \"\",\n checkpoint_map: null,\n },\n parent_checkpoint: null,\n };\n}\n\nexport function useStreamCustom<\n StateType extends Record<string, unknown> = Record<string, unknown>,\n Bag extends BagTemplate = BagTemplate,\n>(\n options: AnyStreamCustomOptions<StateType, Bag>\n): UseStreamCustom<StateType, Bag> {\n type UpdateType = GetUpdateType<Bag, StateType>;\n type CustomType = GetCustomEventType<Bag>;\n type InterruptType = GetInterruptType<Bag>;\n type ConfigurableType = GetConfigurableType<Bag>;\n type ToolCallType = GetToolCallsType<StateType>;\n\n const [messageManager] = useState(() => new MessageTupleManager());\n const [stream] = useState(\n () =>\n new StreamManager<StateType, Bag>(messageManager, {\n throttle: options.throttle ?? false,\n subagentToolNames: options.subagentToolNames,\n filterSubagentMessages: options.filterSubagentMessages,\n toMessage: options.toMessage ?? toMessageClass,\n })\n );\n\n useSyncExternalStore(\n stream.subscribe,\n stream.getSnapshot,\n stream.getSnapshot\n );\n\n const [branch, _setBranch] = useState(\"\");\n\n const [threadId, onThreadId] = useControllableThreadId(options);\n const threadIdRef = useRef<string | null>(threadId);\n\n // Cancel the stream if thread ID has changed\n useEffect(() => {\n if (threadIdRef.current !== threadId) {\n threadIdRef.current = threadId;\n stream.clear();\n }\n }, [threadId, stream]);\n\n const switchThread = useCallback(\n (newThreadId: string | null) => {\n if (newThreadId !== threadIdRef.current) {\n threadIdRef.current = newThreadId;\n stream.clear();\n }\n },\n [stream]\n );\n\n const getMessages = (value: StateType): Message[] => {\n const messagesKey = options.messagesKey ?? \"messages\";\n return Array.isArray(value[messagesKey])\n ? (value[messagesKey] as Message[])\n : [];\n };\n\n const setMessages = (current: StateType, messages: Message[]): StateType => {\n const messagesKey = options.messagesKey ?? \"messages\";\n return { ...current, [messagesKey]: messages };\n };\n\n const historyValues = options.initialValues ?? ({} as StateType);\n\n // Reconstruct subagents from initialValues when:\n // 1. Subagent filtering is enabled\n // 2. Not currently streaming\n // 3. initialValues has messages\n // This ensures subagent visualization works with cached/persisted state\n const historyMessages = getMessages(historyValues);\n const shouldReconstructSubagents =\n options.filterSubagentMessages &&\n !stream.isLoading &&\n historyMessages.length > 0;\n\n useEffect(() => {\n if (shouldReconstructSubagents) {\n // skipIfPopulated: true ensures we don't overwrite subagents from active streaming\n stream.reconstructSubagents(historyMessages, { skipIfPopulated: true });\n }\n // We intentionally only run this when shouldReconstructSubagents changes\n // to avoid unnecessary reconstructions during streaming\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [shouldReconstructSubagents, historyMessages.length]);\n\n const stop = () => stream.stop(historyValues, { onStop: options.onStop });\n\n const submitDirect = async (\n values: UpdateType | null | undefined,\n submitOptions?: CustomSubmitOptions<StateType, ConfigurableType>\n ) => {\n if (threadId !== threadIdRef.current) {\n threadIdRef.current = threadId;\n stream.clear();\n }\n\n let usableThreadId = threadIdRef.current ?? submitOptions?.threadId;\n\n stream.setStreamValues(() => {\n if (submitOptions?.optimisticValues != null) {\n return {\n ...historyValues,\n ...(typeof submitOptions.optimisticValues === \"function\"\n ? submitOptions.optimisticValues(historyValues)\n : submitOptions.optimisticValues),\n };\n }\n\n return { ...historyValues };\n });\n\n await stream.start(\n async (signal: AbortSignal) => {\n if (!usableThreadId) {\n usableThreadId = crypto.randomUUID();\n threadIdRef.current = usableThreadId;\n onThreadId(usableThreadId);\n }\n\n if (!usableThreadId) {\n throw new Error(\"Failed to obtain valid thread ID.\");\n }\n\n return options.transport.stream({\n input: values,\n context: submitOptions?.context,\n command: submitOptions?.command,\n streamSubgraphs: submitOptions?.streamSubgraphs,\n signal,\n config: {\n ...submitOptions?.config,\n configurable: {\n thread_id: usableThreadId,\n ...submitOptions?.config?.configurable,\n } as unknown as GetConfigurableType<Bag>,\n },\n }) as Promise<\n AsyncGenerator<EventStreamEvent<StateType, UpdateType, CustomType>>\n >;\n },\n {\n getMessages,\n setMessages,\n\n initialValues: {} as StateType,\n callbacks: options,\n\n onSuccess: () => {\n if (!usableThreadId) return undefined;\n\n const finalValues = stream.values ?? historyValues;\n options.onFinish?.(\n createCustomTransportThreadState(finalValues, usableThreadId),\n undefined\n );\n\n return undefined;\n },\n onError(error) {\n options.onError?.(error, undefined);\n submitOptions?.onError?.(error, undefined);\n },\n }\n );\n };\n\n const submit = async (\n values: UpdateType | null | undefined,\n submitOptions?: CustomSubmitOptions<StateType, ConfigurableType>\n ) => {\n await submitDirect(values, submitOptions);\n };\n\n const handledToolsRef = useRef<Set<string>>(new Set());\n useEffect(() => {\n handledToolsRef.current.clear();\n }, [threadId]);\n\n useEffect(() => {\n flushPendingHeadlessToolInterrupts(\n stream.values as Record<string, unknown> | null,\n options.tools,\n handledToolsRef.current,\n {\n onTool: options.onTool,\n defer: (run) => {\n void Promise.resolve().then(run);\n },\n resumeSubmit: (command) =>\n submit(null, {\n command,\n }),\n }\n );\n }, [options.onTool, options.tools, stream.values, submit]);\n\n return {\n get values() {\n return stream.values ?? ({} as StateType);\n },\n\n error: stream.error,\n isLoading: stream.isLoading,\n\n stop,\n submit,\n switchThread,\n\n branch,\n setBranch: _setBranch,\n\n getMessagesMetadata(\n message: BaseMessage,\n index?: number\n ): MessageMetadata<StateType> | undefined {\n const streamMetadata = messageManager.get(message.id)?.metadata;\n if (streamMetadata != null) {\n return {\n messageId: message.id ?? String(index),\n firstSeenState: undefined,\n branch: undefined,\n branchOptions: undefined,\n streamMetadata,\n } as MessageMetadata<StateType>;\n }\n return undefined;\n },\n\n get interrupts(): Interrupt<InterruptType>[] {\n if (\n stream.values != null &&\n \"__interrupt__\" in stream.values &&\n Array.isArray(stream.values.__interrupt__)\n ) {\n return userFacingInterruptsFromValuesArray<InterruptType>(\n stream.values.__interrupt__ as Interrupt<InterruptType>[]\n );\n }\n\n return [];\n },\n\n get interrupt(): Interrupt<InterruptType> | undefined {\n return extractInterrupts<InterruptType>(stream.values);\n },\n\n get messages(): BaseMessage[] {\n if (!stream.values) return [];\n return ensureMessageInstances(\n getMessages(stream.values)\n ) as BaseMessage[];\n },\n\n get toolCalls() {\n if (!stream.values) return [];\n const msgs = getMessages(stream.values);\n return getToolCallsWithResults<ToolCallType>(msgs);\n },\n\n getToolCalls(message) {\n if (!stream.values) return [];\n const msgs = getMessages(stream.values);\n const allToolCalls = getToolCallsWithResults<ToolCallType>(msgs);\n return allToolCalls.filter((tc) => tc.aiMessage.id === message.id);\n },\n\n get subagents() {\n return stream.getSubagents();\n },\n\n get activeSubagents() {\n return stream.getActiveSubagents();\n },\n\n getSubagent(toolCallId: string) {\n return stream.getSubagent(toolCallId);\n },\n\n getSubagentsByType(type: string) {\n return stream.getSubagentsByType(type);\n },\n\n getSubagentsByMessage(messageId: string) {\n return stream.getSubagentsByMessage(messageId);\n },\n\n queue: {\n get entries() {\n return [];\n },\n get size() {\n return 0;\n },\n async cancel() {\n return false;\n },\n async clear() {},\n },\n };\n}\n"],"mappings":"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"}
|
package/dist/stream.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"stream.js","names":[],"sources":["../src/stream.tsx"],"sourcesContent":["import { useState } from \"react\";\nimport type { BagTemplate } from \"@langchain/langgraph-sdk\";\nimport type {\n UseStreamOptions,\n ResolveStreamInterface,\n ResolveStreamOptions,\n InferBag,\n InferStateType,\n WithClassMessages,\n} from \"@langchain/langgraph-sdk/ui\";\nimport { useStreamLGP } from \"./stream.lgp.js\";\nimport { useStreamCustom } from \"./stream.custom.js\";\nimport type { UseStreamCustomOptions } from \"./types.js\";\n\nfunction isCustomOptions<\n StateType extends Record<string, unknown> = Record<string, unknown>,\n Bag extends BagTemplate = BagTemplate,\n>(\n options:\n | UseStreamOptions<StateType, Bag>\n | UseStreamCustomOptions<StateType, Bag
|
|
1
|
+
{"version":3,"file":"stream.js","names":[],"sources":["../src/stream.tsx"],"sourcesContent":["import { useState } from \"react\";\nimport type { BagTemplate } from \"@langchain/langgraph-sdk\";\nimport type {\n UseStreamOptions,\n ResolveStreamInterface,\n ResolveStreamOptions,\n InferBag,\n InferStateType,\n WithClassMessages,\n} from \"@langchain/langgraph-sdk/ui\";\nimport { useStreamLGP } from \"./stream.lgp.js\";\nimport { useStreamCustom } from \"./stream.custom.js\";\nimport type { UseStreamCustomOptions } from \"./types.js\";\n\nfunction isCustomOptions<\n StateType extends Record<string, unknown> = Record<string, unknown>,\n Bag extends BagTemplate = BagTemplate,\n>(\n options:\n | UseStreamOptions<StateType, Bag>\n | UseStreamCustomOptions<StateType, Bag>\n): options is UseStreamCustomOptions<StateType, Bag> {\n return \"transport\" in options;\n}\n\ntype UseStreamImplementation = typeof useStreamLGP | typeof useStreamCustom;\n\ntype AnyUseStreamOptions =\n | UseStreamOptions<Record<string, unknown>, BagTemplate>\n | UseStreamCustomOptions<Record<string, unknown>, BagTemplate>;\n\nfunction selectStreamImplementation(\n options: AnyUseStreamOptions\n): UseStreamImplementation {\n return isCustomOptions(options) ? useStreamCustom : useStreamLGP;\n}\n\nexport type {\n WithClassMessages,\n ClassSubagentStreamInterface,\n} from \"@langchain/langgraph-sdk/ui\";\n\n/**\n * A React hook that provides seamless integration with LangGraph streaming capabilities.\n *\n * The `useStream` hook handles all the complexities of streaming, state management, and branching logic,\n * letting you focus on building great chat experiences. It provides automatic state management for\n * messages, interrupts, loading states, subagent streams, and errors.\n *\n * ## Usage with ReactAgent (recommended for createAgent users)\n *\n * When using `createAgent` from `@langchain/langgraph`, you can pass `typeof agent` as the\n * type parameter to automatically infer tool call types:\n *\n * @example\n * ```typescript\n * // In your agent file (e.g., agent.ts)\n * import { createAgent, tool } from \"langchain\";\n * import { z } from \"zod\";\n *\n * const getWeather = tool(\n * async ({ location }) => `Weather in ${location}`,\n * { name: \"get_weather\", schema: z.object({ location: z.string() }) }\n * );\n *\n * export const agent = createAgent({\n * model: \"openai:gpt-4o\",\n * tools: [getWeather],\n * });\n *\n * // In your React component\n * import { agent } from \"./agent\";\n *\n * function Chat() {\n * // Tool calls are automatically typed from the agent's tools!\n * const stream = useStream<typeof agent>({\n * assistantId: \"agent\",\n * apiUrl: \"http://localhost:2024\",\n * });\n *\n * // stream.toolCalls[0].call.name is typed as \"get_weather\"\n * // stream.toolCalls[0].call.args is typed as { location: string }\n * }\n * ```\n *\n * ## Usage with StateGraph (for custom LangGraph applications)\n *\n * When building custom graphs with `StateGraph`, embed your tool call types directly\n * in your state's messages property using `Message<MyToolCalls>`:\n *\n * @example\n * ```typescript\n * import { Message } from \"@langchain/langgraph-sdk\";\n *\n * // Define your tool call types as a discriminated union\n * type MyToolCalls =\n * | { name: \"search\"; args: { query: string }; id?: string }\n * | { name: \"calculate\"; args: { expression: string }; id?: string };\n *\n * // Embed tool call types in your state's messages\n * interface MyGraphState {\n * messages: Message<MyToolCalls>[];\n * context?: string;\n * }\n *\n * function Chat() {\n * const stream = useStream<MyGraphState>({\n * assistantId: \"my-graph\",\n * apiUrl: \"http://localhost:2024\",\n * });\n *\n * // stream.values is typed as MyGraphState\n * // stream.toolCalls[0].call.name is typed as \"search\" | \"calculate\"\n * }\n * ```\n *\n * @example\n * ```typescript\n * // With additional type configuration (interrupts, configurable)\n * interface MyGraphState {\n * messages: Message<MyToolCalls>[];\n * }\n *\n * function Chat() {\n * const stream = useStream<MyGraphState, {\n * InterruptType: { question: string };\n * ConfigurableType: { userId: string };\n * }>({\n * assistantId: \"my-graph\",\n * apiUrl: \"http://localhost:2024\",\n * });\n *\n * // stream.interrupt is typed as { question: string } | undefined\n * }\n * ```\n *\n * ## Usage with Deep Agents (subagent streaming, experimental)\n *\n * For agents that spawn subagents (nested graphs), use `filterSubagentMessages`\n * to keep the main message stream clean while tracking subagent activity separately:\n *\n * @example\n * ```typescript\n * import { useStream, SubagentStream } from \"@langchain/langgraph-sdk/react\";\n * import type { agent } from \"./agent\";\n *\n * function DeepAgentChat() {\n * const stream = useStream<typeof agent>({\n * assistantId: \"deepagent\",\n * apiUrl: \"http://localhost:2024\",\n * // Filter subagent messages from main stream\n * filterSubagentMessages: true,\n * });\n *\n * const handleSubmit = (content: string) => {\n * stream.submit(\n * { messages: [{ content, type: \"human\" }] },\n * { streamSubgraphs: true } // Enable subgraph streaming\n * );\n * };\n *\n * // Access subagent streams via stream.subagents (Map<string, SubagentStream>)\n * const subagentList = [...stream.subagents.values()];\n *\n * return (\n * <div>\n * {stream.messages.map((msg) => <Message key={msg.id} message={msg} />)}\n *\n * {subagentList.map((subagent) => (\n * <SubagentCard\n * key={subagent.id}\n * status={subagent.status} // \"pending\" | \"running\" | \"complete\" | \"error\"\n * messages={subagent.messages}\n * toolCalls={subagent.toolCalls}\n * />\n * ))}\n * </div>\n * );\n * }\n * ```\n *\n * @template T Either a ReactAgent type (with `~agentTypes`) or a state type (`Record<string, unknown>`)\n * @template Bag Type configuration bag containing:\n * - `ConfigurableType`: Type for the `config.configurable` property\n * - `InterruptType`: Type for interrupt values\n * - `CustomEventType`: Type for custom events\n * - `UpdateType`: Type for the submit function updates\n *\n * @see {@link https://docs.langchain.com/langgraph-platform/use-stream-react | LangGraph React Integration Guide}\n */\nexport function useStream<\n T = Record<string, unknown>,\n Bag extends BagTemplate = BagTemplate,\n>(\n options: ResolveStreamOptions<T, InferBag<T, Bag>>\n): WithClassMessages<ResolveStreamInterface<T, InferBag<T, Bag>>>;\n\n/**\n * A React hook that provides seamless integration with LangGraph streaming capabilities.\n *\n * The `useStream` hook handles all the complexities of streaming, state management, and branching logic,\n * letting you focus on building great chat experiences. It provides automatic state management for\n * messages, interrupts, loading states, and errors.\n *\n * @template T Either a ReactAgent type (with `~agentTypes`) or a state type (`Record<string, unknown>`)\n * @template Bag Type configuration bag containing:\n * - `ConfigurableType`: Type for the `config.configurable` property\n * - `InterruptType`: Type for interrupt values\n * - `CustomEventType`: Type for custom events\n * - `UpdateType`: Type for the submit function updates\n *\n * @see {@link https://docs.langchain.com/langgraph-platform/use-stream-react | LangGraph React Integration Guide}\n */\nexport function useStream<\n T = Record<string, unknown>,\n Bag extends BagTemplate = BagTemplate,\n>(\n options: UseStreamCustomOptions<InferStateType<T>, InferBag<T, Bag>>\n): WithClassMessages<ResolveStreamInterface<T, InferBag<T, Bag>>>;\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport function useStream(options: any): any {\n // Keep implementation stable for the lifetime of this hook instance.\n const [useSelectedStream] = useState(() =>\n selectStreamImplementation(options)\n );\n return useSelectedStream(options);\n}\n"],"mappings":";;;;AAcA,SAAS,gBAIP,SAGmD;AACnD,QAAO,eAAe;;AASxB,SAAS,2BACP,SACyB;AACzB,QAAO,gBAAgB,QAAQ,GAAG,kBAAkB;;AA2LtD,SAAgB,UAAU,SAAmB;CAE3C,MAAM,CAAC,qBAAqB,eAC1B,2BAA2B,QAAQ,CACpC;AACD,QAAO,kBAAkB,QAAQ"}
|
package/dist/stream.lgp.cjs
CHANGED
|
@@ -4,6 +4,7 @@ let react = require("react");
|
|
|
4
4
|
let _langchain_langgraph_sdk_client = require("@langchain/langgraph-sdk/client");
|
|
5
5
|
let _langchain_langgraph_sdk_ui = require("@langchain/langgraph-sdk/ui");
|
|
6
6
|
let _langchain_langgraph_sdk_utils = require("@langchain/langgraph-sdk/utils");
|
|
7
|
+
let _langchain_langgraph_sdk = require("@langchain/langgraph-sdk");
|
|
7
8
|
//#region src/stream.lgp.tsx
|
|
8
9
|
function getFetchHistoryKey(client, threadId, limit) {
|
|
9
10
|
return [
|
|
@@ -537,6 +538,27 @@ function useStreamLGP(options) {
|
|
|
537
538
|
}, [reconnectKey]);
|
|
538
539
|
const error = stream.error ?? historyError ?? history.error;
|
|
539
540
|
const values = stream.values ?? historyValues;
|
|
541
|
+
const handledToolsRef = (0, react.useRef)(/* @__PURE__ */ new Set());
|
|
542
|
+
(0, react.useEffect)(() => {
|
|
543
|
+
handledToolsRef.current.clear();
|
|
544
|
+
}, [threadId]);
|
|
545
|
+
(0, react.useEffect)(() => {
|
|
546
|
+
(0, _langchain_langgraph_sdk.flushPendingHeadlessToolInterrupts)(values, options.tools, handledToolsRef.current, {
|
|
547
|
+
onTool: options.onTool,
|
|
548
|
+
defer: (run) => {
|
|
549
|
+
Promise.resolve().then(run);
|
|
550
|
+
},
|
|
551
|
+
resumeSubmit: (command) => submit(null, {
|
|
552
|
+
multitaskStrategy: "interrupt",
|
|
553
|
+
command
|
|
554
|
+
})
|
|
555
|
+
});
|
|
556
|
+
}, [
|
|
557
|
+
options.onTool,
|
|
558
|
+
options.tools,
|
|
559
|
+
submit,
|
|
560
|
+
values
|
|
561
|
+
]);
|
|
540
562
|
return {
|
|
541
563
|
get values() {
|
|
542
564
|
trackStreamMode("values");
|
|
@@ -562,14 +584,10 @@ function useStreamLGP(options) {
|
|
|
562
584
|
return branchContext.branchTree;
|
|
563
585
|
},
|
|
564
586
|
get interrupts() {
|
|
565
|
-
if (values != null && "__interrupt__" in values && Array.isArray(values.__interrupt__))
|
|
566
|
-
const valueInterrupts = values.__interrupt__;
|
|
567
|
-
if (valueInterrupts.length === 0) return [{ when: "breakpoint" }];
|
|
568
|
-
return (0, _langchain_langgraph_sdk_ui.normalizeInterruptsList)(valueInterrupts);
|
|
569
|
-
}
|
|
587
|
+
if (values != null && "__interrupt__" in values && Array.isArray(values.__interrupt__)) return (0, _langchain_langgraph_sdk_ui.userFacingInterruptsFromValuesArray)(values.__interrupt__);
|
|
570
588
|
if (stream.isLoading) return [];
|
|
571
|
-
const
|
|
572
|
-
if (
|
|
589
|
+
const taskInterrupts = (0, _langchain_langgraph_sdk_ui.userFacingInterruptsFromThreadTasks)((branchContext.threadHead?.tasks ?? []).flatMap((t) => t.interrupts ?? []));
|
|
590
|
+
if (taskInterrupts != null) return taskInterrupts;
|
|
573
591
|
if (!(branchContext.threadHead?.next ?? []).length || error != null) return [];
|
|
574
592
|
return [{ when: "breakpoint" }];
|
|
575
593
|
},
|