@assistant-ui/react-langgraph 0.5.0 → 0.5.1

package/dist/LangGraphMessageAccumulator.d.ts

@@ -0,0 +1,20 @@
+export type LangGraphMessagesEvent<TMessage> = {
+    event: "messages" | "messages/partial" | "messages/complete" | "metadata" | "updates" | string;
+    data: TMessage[] | any;
+};
+export type LangGraphStateAccumulatorConfig<TMessage> = {
+    initialMessages?: TMessage[];
+    appendMessage?: (prev: TMessage | undefined, curr: TMessage) => TMessage;
+};
+export declare class LangGraphMessageAccumulator<TMessage extends {
+    id?: string;
+}> {
+    private messagesMap;
+    private appendMessage;
+    constructor({ initialMessages, appendMessage, }?: LangGraphStateAccumulatorConfig<TMessage>);
+    private ensureMessageId;
+    addMessages(newMessages: TMessage[]): TMessage[];
+    getMessages(): TMessage[];
+    clear(): void;
+}
+//# sourceMappingURL=LangGraphMessageAccumulator.d.ts.map

package/dist/LangGraphMessageAccumulator.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LangGraphMessageAccumulator.d.ts","sourceRoot":"","sources":["../src/LangGraphMessageAccumulator.ts"],"names":[],"mappings":"AAEA,MAAM,MAAM,sBAAsB,CAAC,QAAQ,IAAI;IAC7C,KAAK,EACD,UAAU,GACV,kBAAkB,GAClB,mBAAmB,GACnB,UAAU,GACV,SAAS,GACT,MAAM,CAAC;IACX,IAAI,EAAE,QAAQ,EAAE,GAAG,GAAG,CAAC;CACxB,CAAC;AAEF,MAAM,MAAM,+BAA+B,CAAC,QAAQ,IAAI;IACtD,eAAe,CAAC,EAAE,QAAQ,EAAE,CAAC;IAC7B,aAAa,CAAC,EAAE,CAAC,IAAI,EAAE,QAAQ,GAAG,SAAS,EAAE,IAAI,EAAE,QAAQ,KAAK,QAAQ,CAAC;CAC1E,CAAC;AAEF,qBAAa,2BAA2B,CAAC,QAAQ,SAAS;IAAE,EAAE,CAAC,EAAE,MAAM,CAAA;CAAE;IACvE,OAAO,CAAC,WAAW,CAA+B;IAClD,OAAO,CAAC,aAAa,CAGP;gBAEF,EACV,eAAoB,EACpB,aAGa,GACd,GAAE,+BAA+B,CAAC,QAAQ,CAAM;IAKjD,OAAO,CAAC,eAAe;IAIhB,WAAW,CAAC,WAAW,EAAE,QAAQ,EAAE;IAenC,WAAW,IAAI,QAAQ,EAAE;IAIzB,KAAK;CAGb"}

package/dist/appendLangChainChunk.d.ts

@@ -0,0 +1,3 @@
+import { LangChainMessage, LangChainMessageChunk } from "./types";
+export declare const appendLangChainChunk: (prev: LangChainMessage | undefined, curr: LangChainMessage | LangChainMessageChunk) => LangChainMessage;
+//# sourceMappingURL=appendLangChainChunk.d.ts.map

package/dist/appendLangChainChunk.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"appendLangChainChunk.d.ts","sourceRoot":"","sources":["../src/appendLangChainChunk.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAC;AAGlE,eAAO,MAAM,oBAAoB,GAC/B,MAAM,gBAAgB,GAAG,SAAS,EAClC,MAAM,gBAAgB,GAAG,qBAAqB,KAC7C,gBAgDF,CAAC"}

package/dist/convertLangChainMessages.d.ts

@@ -0,0 +1,3 @@
+import { LangChainMessage } from "./types";
+export declare const convertLangChainMessages: useExternalMessageConverter.Callback<LangChainMessage>;
+//# sourceMappingURL=convertLangChainMessages.d.ts.map

package/dist/convertLangChainMessages.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"convertLangChainMessages.d.ts","sourceRoot":"","sources":["../src/convertLangChainMessages.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAiC3C,eAAO,MAAM,wBAAwB,EAAE,2BAA2B,CAAC,QAAQ,CACzE,gBAAgB,CA2CjB,CAAC"}

package/dist/index.d.ts

@@ -0,0 +1,11 @@
+export { useLangGraphRuntime, useLangGraphSend, useLangGraphSendCommand, useLangGraphInterruptState, } from "./useLangGraphRuntime";
+export { useLangGraphMessages, type LangGraphInterruptState, type LangGraphCommand, type LangGraphSendMessageConfig, type LangGraphStreamCallback, type LangGraphMessagesEvent, } from "./useLangGraphMessages";
+export { convertLangChainMessages } from "./convertLangChainMessages";
+/**
+ * @deprecated Use `convertLangChainMessages` instead.
+ */
+export { convertLangChainMessages as convertLangchainMessages } from "./convertLangChainMessages";
+export type { LangChainMessage, LangChainEvent, LangChainToolCall, LangChainToolCallChunk, } from "./types";
+export { LangGraphMessageAccumulator } from "./LangGraphMessageAccumulator";
+export { appendLangChainChunk } from "./appendLangChainChunk";
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,mBAAmB,EACnB,gBAAgB,EAChB,uBAAuB,EACvB,0BAA0B,GAC3B,MAAM,uBAAuB,CAAC;AAE/B,OAAO,EACL,oBAAoB,EACpB,KAAK,uBAAuB,EAC5B,KAAK,gBAAgB,EACrB,KAAK,0BAA0B,EAC/B,KAAK,uBAAuB,EAC5B,KAAK,sBAAsB,GAC5B,MAAM,wBAAwB,CAAC;AAChC,OAAO,EAAE,wBAAwB,EAAE,MAAM,4BAA4B,CAAC;AAEtE;;GAEG;AACH,OAAO,EAAE,wBAAwB,IAAI,wBAAwB,EAAE,MAAM,4BAA4B,CAAC;AAElG,YAAY,EACV,gBAAgB,EAChB,cAAc,EACd,iBAAiB,EACjB,sBAAsB,GACvB,MAAM,SAAS,CAAC;AAEjB,OAAO,EAAE,2BAA2B,EAAE,MAAM,+BAA+B,CAAC;AAC5E,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC"}

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n  useLangGraphRuntime,\n  useLangGraphSend,\n  useLangGraphSendCommand,\n  useLangGraphInterruptState,\n} from \"./useLangGraphRuntime\";\n\nexport {\n  useLangGraphMessages,\n  type LangGraphInterruptState,\n  type LangGraphCommand,\n  type LangGraphSendMessageConfig,\n  type LangGraphStreamCallback,\n} from \"./useLangGraphMessages\";\nexport { convertLangChainMessages } from \"./convertLangChainMessages\";\n\n/**\n * @deprecated Use `convertLangChainMessages` instead.\n */\nexport { convertLangChainMessages as convertLangchainMessages } from \"./convertLangChainMessages\";\n\nexport type {\n  LangChainMessage,\n  LangChainEvent,\n  LangChainToolCall,\n  LangChainToolCallChunk,\n} from \"./types\";\n\nexport { LangGraphMessageAccumulator } from \"./LangGraphMessageAccumulator\";\nexport { appendLangChainChunk } from \"./appendLangChainChunk\";\n"],"mappings":"AAAA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP;AAAA,EACE;AAAA,OAKK;AACP,SAAS,gCAAgC;AAKzC,SAAqC,4BAA5BA,iCAA4D;AASrE,SAAS,mCAAmC;AAC5C,SAAS,4BAA4B;","names":["convertLangChainMessages"]}
+{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n  useLangGraphRuntime,\n  useLangGraphSend,\n  useLangGraphSendCommand,\n  useLangGraphInterruptState,\n} from \"./useLangGraphRuntime\";\n\nexport {\n  useLangGraphMessages,\n  type LangGraphInterruptState,\n  type LangGraphCommand,\n  type LangGraphSendMessageConfig,\n  type LangGraphStreamCallback,\n  type LangGraphMessagesEvent,\n} from \"./useLangGraphMessages\";\nexport { convertLangChainMessages } from \"./convertLangChainMessages\";\n\n/**\n * @deprecated Use `convertLangChainMessages` instead.\n */\nexport { convertLangChainMessages as convertLangchainMessages } from \"./convertLangChainMessages\";\n\nexport type {\n  LangChainMessage,\n  LangChainEvent,\n  LangChainToolCall,\n  LangChainToolCallChunk,\n} from \"./types\";\n\nexport { LangGraphMessageAccumulator } from \"./LangGraphMessageAccumulator\";\nexport { appendLangChainChunk } from \"./appendLangChainChunk\";\n"],"mappings":"AAAA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP;AAAA,EACE;AAAA,OAMK;AACP,SAAS,gCAAgC;AAKzC,SAAqC,4BAA5BA,iCAA4D;AASrE,SAAS,mCAAmC;AAC5C,SAAS,4BAA4B;","names":["convertLangChainMessages"]}

package/dist/types.d.ts

@@ -0,0 +1,66 @@
+import { ReadonlyJSONObject } from "assistant-stream/utils";
+export type LangChainToolCallChunk = {
+    index: number;
+    id: string;
+    name: string;
+    args: string;
+};
+export type LangChainToolCall = {
+    id: string;
+    name: string;
+    argsText: string;
+    args: ReadonlyJSONObject;
+};
+type MessageContentText = {
+    type: "text";
+    text: string;
+};
+type MessageContentImageUrl = {
+    type: "image_url";
+    image_url: string | {
+        url: string;
+    };
+};
+type MessageContentToolUse = {
+    type: "tool_use";
+};
+type UserMessageContentComplex = MessageContentText | MessageContentImageUrl;
+type AssistantMessageContentComplex = MessageContentText | MessageContentToolUse;
+type UserMessageContent = string | UserMessageContentComplex[];
+type AssistantMessageContent = string | AssistantMessageContentComplex[];
+export type LangChainMessage = {
+    id?: string;
+    type: "system";
+    content: string;
+} | {
+    id?: string;
+    type: "human";
+    content: UserMessageContent;
+} | {
+    id?: string;
+    type: "tool";
+    content: string;
+    tool_call_id: string;
+    name: string;
+    artifact?: any;
+} | {
+    id?: string;
+    type: "ai";
+    content: AssistantMessageContent;
+    tool_call_chunks?: LangChainToolCallChunk[];
+    tool_calls?: LangChainToolCall[];
+};
+export type LangChainMessageChunk = {
+    id: string;
+    type: "AIMessageChunk";
+    content: (AssistantMessageContentComplex & {
+        index: number;
+    })[];
+    tool_call_chunks: LangChainToolCallChunk[];
+};
+export type LangChainEvent = {
+    event: "messages/partial" | "messages/complete";
+    data: LangChainMessage[];
+};
+export {};
+//# sourceMappingURL=types.d.ts.map

package/dist/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AAE5D,MAAM,MAAM,sBAAsB,GAAG;IACnC,KAAK,EAAE,MAAM,CAAC;IACd,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG;IAC9B,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,MAAM,CAAC;IACjB,IAAI,EAAE,kBAAkB,CAAC;CAC1B,CAAC;AAEF,KAAK,kBAAkB,GAAG;IACxB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,KAAK,sBAAsB,GAAG;IAC5B,IAAI,EAAE,WAAW,CAAC;IAClB,SAAS,EAAE,MAAM,GAAG;QAAE,GAAG,EAAE,MAAM,CAAA;KAAE,CAAC;CACrC,CAAC;AAEF,KAAK,qBAAqB,GAAG;IAC3B,IAAI,EAAE,UAAU,CAAC;CAClB,CAAC;AAEF,KAAK,yBAAyB,GAAG,kBAAkB,GAAG,sBAAsB,CAAC;AAC7E,KAAK,8BAA8B,GAC/B,kBAAkB,GAClB,qBAAqB,CAAC;AAE1B,KAAK,kBAAkB,GAAG,MAAM,GAAG,yBAAyB,EAAE,CAAC;AAC/D,KAAK,uBAAuB,GAAG,MAAM,GAAG,8BAA8B,EAAE,CAAC;AAEzE,MAAM,MAAM,gBAAgB,GACxB;IACE,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,QAAQ,CAAC;IACf,OAAO,EAAE,MAAM,CAAC;CACjB,GACD;IACE,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,kBAAkB,CAAC;CAC7B,GACD;IACE,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,MAAM,CAAC;IAChB,YAAY,EAAE,MAAM,CAAC;IACrB,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,GAAG,CAAC;CAChB,GACD;IACE,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,IAAI,CAAC;IACX,OAAO,EAAE,uBAAuB,CAAC;IACjC,gBAAgB,CAAC,EAAE,sBAAsB,EAAE,CAAC;IAC5C,UAAU,CAAC,EAAE,iBAAiB,EAAE,CAAC;CAClC,CAAC;AAEN,MAAM,MAAM,qBAAqB,GAAG;IAClC,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,gBAAgB,CAAC;IACvB,OAAO,EAAE,CAAC,8BAA8B,GAAG;QAAE,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,EAAE,CAAC;IAChE,gBAAgB,EAAE,sBAAsB,EAAE,CAAC;CAC5C,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG;IAC3B,KAAK,EAAE,kBAAkB,GAAG,mBAAmB,CAAC;IAChD,IAAI,EAAE,gBAAgB,EAAE,CAAC;CAC1B,CAAC"}

package/dist/useLangGraphMessages.d.ts

@@ -0,0 +1,34 @@
+export type LangGraphCommand = {
+    resume: string;
+};
+export type LangGraphSendMessageConfig = {
+    command?: LangGraphCommand;
+    runConfig?: unknown;
+};
+export type LangGraphMessagesEvent<TMessage> = {
+    event: "messages" | "messages/partial" | "messages/complete" | "metadata" | "updates" | string;
+    data: TMessage[] | any;
+};
+export type LangGraphStreamCallback<TMessage> = (messages: TMessage[], config: LangGraphSendMessageConfig & {
+    abortSignal: AbortSignal;
+}) => Promise<AsyncGenerator<LangGraphMessagesEvent<TMessage>>> | AsyncGenerator<LangGraphMessagesEvent<TMessage>>;
+export type LangGraphInterruptState = {
+    value?: any;
+    resumable?: boolean;
+    when: string;
+    ns?: string[];
+};
+export declare const useLangGraphMessages: <TMessage extends {
+    id?: string;
+}>({ stream, appendMessage, }: {
+    stream: LangGraphStreamCallback<TMessage>;
+    appendMessage?: (prev: TMessage | undefined, curr: TMessage) => TMessage;
+}) => {
+    interrupt: LangGraphInterruptState | undefined;
+    messages: TMessage[];
+    sendMessage: (newMessages: TMessage[], config: LangGraphSendMessageConfig) => Promise<void>;
+    cancel: () => void;
+    setInterrupt: import("react").Dispatch<import("react").SetStateAction<LangGraphInterruptState | undefined>>;
+    setMessages: import("react").Dispatch<import("react").SetStateAction<TMessage[]>>;
+};
+//# sourceMappingURL=useLangGraphMessages.d.ts.map

package/dist/useLangGraphMessages.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useLangGraphMessages.d.ts","sourceRoot":"","sources":["../src/useLangGraphMessages.ts"],"names":[],"mappings":"AAIA,MAAM,MAAM,gBAAgB,GAAG;IAC7B,MAAM,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,MAAM,MAAM,0BAA0B,GAAG;IACvC,OAAO,CAAC,EAAE,gBAAgB,CAAC;IAC3B,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,sBAAsB,CAAC,QAAQ,IAAI;IAC7C,KAAK,EACD,UAAU,GACV,kBAAkB,GAClB,mBAAmB,GACnB,UAAU,GACV,SAAS,GACT,MAAM,CAAC;IACX,IAAI,EAAE,QAAQ,EAAE,GAAG,GAAG,CAAC;CACxB,CAAC;AACF,MAAM,MAAM,uBAAuB,CAAC,QAAQ,IAAI,CAC9C,QAAQ,EAAE,QAAQ,EAAE,EACpB,MAAM,EAAE,0BAA0B,GAAG;IAAE,WAAW,EAAE,WAAW,CAAA;CAAE,KAE/D,OAAO,CAAC,cAAc,CAAC,sBAAsB,CAAC,QAAQ,CAAC,CAAC,CAAC,GACzD,cAAc,CAAC,sBAAsB,CAAC,QAAQ,CAAC,CAAC,CAAC;AAErD,MAAM,MAAM,uBAAuB,GAAG;IACpC,KAAK,CAAC,EAAE,GAAG,CAAC;IACZ,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,IAAI,EAAE,MAAM,CAAC;IACb,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC;CACf,CAAC;AAOF,eAAO,MAAM,oBAAoB,GAAI,QAAQ,SAAS;IAAE,EAAE,CAAC,EAAE,MAAM,CAAA;CAAE,EAAE,4BAGpE;IACD,MAAM,EAAE,uBAAuB,CAAC,QAAQ,CAAC,CAAC;IAC1C,aAAa,CAAC,EAAE,CAAC,IAAI,EAAE,QAAQ,GAAG,SAAS,EAAE,IAAI,EAAE,QAAQ,KAAK,QAAQ,CAAC;CAC1E;;;+BAQuB,QAAQ,EAAE,UAAU,0BAA0B;;;;CA6CrE,CAAC"}

package/dist/useLangGraphMessages.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/useLangGraphMessages.ts"],"sourcesContent":["import { useState, useCallback, useRef } from \"react\";\nimport { v4 as uuidv4 } from \"uuid\";\nimport { LangGraphMessageAccumulator } from \"./LangGraphMessageAccumulator\";\n\nexport type LangGraphCommand = {\n  resume: string;\n};\n\nexport type LangGraphSendMessageConfig = {\n  command?: LangGraphCommand;\n  runConfig?: unknown;\n};\n\ntype LangGraphMessagesEvent<TMessage> = {\n  event:\n    | \"messages\"\n    | \"messages/partial\"\n    | \"messages/complete\"\n    | \"metadata\"\n    | \"updates\"\n    | string;\n  data: TMessage[] | any;\n};\nexport type LangGraphStreamCallback<TMessage> = (\n  messages: TMessage[],\n  config: LangGraphSendMessageConfig & { abortSignal: AbortSignal },\n) =>\n  | Promise<AsyncGenerator<LangGraphMessagesEvent<TMessage>>>\n  | AsyncGenerator<LangGraphMessagesEvent<TMessage>>;\n\nexport type LangGraphInterruptState = {\n  value?: any;\n  resumable?: boolean;\n  when: string;\n  ns?: string[];\n};\n\nconst DEFAULT_APPEND_MESSAGE = <TMessage>(\n  _: TMessage | undefined,\n  curr: TMessage,\n) => curr;\n\nexport const useLangGraphMessages = <TMessage extends { id?: string }>({\n  stream,\n  appendMessage = DEFAULT_APPEND_MESSAGE,\n}: {\n  stream: LangGraphStreamCallback<TMessage>;\n  appendMessage?: (prev: TMessage | undefined, curr: TMessage) => TMessage;\n}) => {\n  const [interrupt, setInterrupt] = useState<\n    LangGraphInterruptState | undefined\n  >();\n  const [messages, setMessages] = useState<TMessage[]>([]);\n  const abortControllerRef = useRef<AbortController | null>(null);\n\n  const sendMessage = useCallback(\n    async (newMessages: TMessage[], config: LangGraphSendMessageConfig) => {\n      // ensure all messages have an ID\n      newMessages = newMessages.map((m) => (m.id ? m : { ...m, id: uuidv4() }));\n\n      const accumulator = new LangGraphMessageAccumulator({\n        initialMessages: messages,\n        appendMessage,\n      });\n      setMessages(accumulator.addMessages(newMessages));\n\n      const abortController = new AbortController();\n      abortControllerRef.current = abortController;\n      const response = await stream(newMessages, {\n        ...config,\n        abortSignal: abortController.signal,\n      });\n\n      for await (const chunk of response) {\n        if (\n          chunk.event === \"messages/partial\" ||\n          chunk.event === \"messages/complete\"\n        ) {\n          setMessages(accumulator.addMessages(chunk.data));\n        } else if (chunk.event === \"updates\") {\n          setInterrupt(chunk.data.__interrupt__?.[0]);\n        }\n      }\n    },\n    [messages, stream, appendMessage],\n  );\n\n  const cancel = useCallback(() => {\n    if (abortControllerRef.current) {\n      abortControllerRef.current.abort();\n    }\n  }, [abortControllerRef]);\n\n  return {\n    interrupt,\n    messages,\n    sendMessage,\n    cancel,\n    setInterrupt,\n    setMessages,\n  };\n};\n"],"mappings":"AAAA,SAAS,UAAU,aAAa,cAAc;AAC9C,SAAS,MAAM,cAAc;AAC7B,SAAS,mCAAmC;AAmC5C,MAAM,yBAAyB,CAC7B,GACA,SACG;AAEE,MAAM,uBAAuB,CAAmC;AAAA,EACrE;AAAA,EACA,gBAAgB;AAClB,MAGM;AACJ,QAAM,CAAC,WAAW,YAAY,IAAI,SAEhC;AACF,QAAM,CAAC,UAAU,WAAW,IAAI,SAAqB,CAAC,CAAC;AACvD,QAAM,qBAAqB,OAA+B,IAAI;AAE9D,QAAM,cAAc;AAAA,IAClB,OAAO,aAAyB,WAAuC;AAErE,oBAAc,YAAY,IAAI,CAAC,MAAO,EAAE,KAAK,IAAI,EAAE,GAAG,GAAG,IAAI,OAAO,EAAE,CAAE;AAExE,YAAM,cAAc,IAAI,4BAA4B;AAAA,QAClD,iBAAiB;AAAA,QACjB;AAAA,MACF,CAAC;AACD,kBAAY,YAAY,YAAY,WAAW,CAAC;AAEhD,YAAM,kBAAkB,IAAI,gBAAgB;AAC5C,yBAAmB,UAAU;AAC7B,YAAM,WAAW,MAAM,OAAO,aAAa;AAAA,QACzC,GAAG;AAAA,QACH,aAAa,gBAAgB;AAAA,MAC/B,CAAC;AAED,uBAAiB,SAAS,UAAU;AAClC,YACE,MAAM,UAAU,sBAChB,MAAM,UAAU,qBAChB;AACA,sBAAY,YAAY,YAAY,MAAM,IAAI,CAAC;AAAA,QACjD,WAAW,MAAM,UAAU,WAAW;AACpC,uBAAa,MAAM,KAAK,gBAAgB,CAAC,CAAC;AAAA,QAC5C;AAAA,MACF;AAAA,IACF;AAAA,IACA,CAAC,UAAU,QAAQ,aAAa;AAAA,EAClC;AAEA,QAAM,SAAS,YAAY,MAAM;AAC/B,QAAI,mBAAmB,SAAS;AAC9B,yBAAmB,QAAQ,MAAM;AAAA,IACnC;AAAA,EACF,GAAG,CAAC,kBAAkB,CAAC;AAEvB,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;","names":[]}
+{"version":3,"sources":["../src/useLangGraphMessages.ts"],"sourcesContent":["import { useState, useCallback, useRef } from \"react\";\nimport { v4 as uuidv4 } from \"uuid\";\nimport { LangGraphMessageAccumulator } from \"./LangGraphMessageAccumulator\";\n\nexport type LangGraphCommand = {\n  resume: string;\n};\n\nexport type LangGraphSendMessageConfig = {\n  command?: LangGraphCommand;\n  runConfig?: unknown;\n};\n\nexport type LangGraphMessagesEvent<TMessage> = {\n  event:\n    | \"messages\"\n    | \"messages/partial\"\n    | \"messages/complete\"\n    | \"metadata\"\n    | \"updates\"\n    | string;\n  data: TMessage[] | any;\n};\nexport type LangGraphStreamCallback<TMessage> = (\n  messages: TMessage[],\n  config: LangGraphSendMessageConfig & { abortSignal: AbortSignal },\n) =>\n  | Promise<AsyncGenerator<LangGraphMessagesEvent<TMessage>>>\n  | AsyncGenerator<LangGraphMessagesEvent<TMessage>>;\n\nexport type LangGraphInterruptState = {\n  value?: any;\n  resumable?: boolean;\n  when: string;\n  ns?: string[];\n};\n\nconst DEFAULT_APPEND_MESSAGE = <TMessage>(\n  _: TMessage | undefined,\n  curr: TMessage,\n) => curr;\n\nexport const useLangGraphMessages = <TMessage extends { id?: string }>({\n  stream,\n  appendMessage = DEFAULT_APPEND_MESSAGE,\n}: {\n  stream: LangGraphStreamCallback<TMessage>;\n  appendMessage?: (prev: TMessage | undefined, curr: TMessage) => TMessage;\n}) => {\n  const [interrupt, setInterrupt] = useState<\n    LangGraphInterruptState | undefined\n  >();\n  const [messages, setMessages] = useState<TMessage[]>([]);\n  const abortControllerRef = useRef<AbortController | null>(null);\n\n  const sendMessage = useCallback(\n    async (newMessages: TMessage[], config: LangGraphSendMessageConfig) => {\n      // ensure all messages have an ID\n      newMessages = newMessages.map((m) => (m.id ? m : { ...m, id: uuidv4() }));\n\n      const accumulator = new LangGraphMessageAccumulator({\n        initialMessages: messages,\n        appendMessage,\n      });\n      setMessages(accumulator.addMessages(newMessages));\n\n      const abortController = new AbortController();\n      abortControllerRef.current = abortController;\n      const response = await stream(newMessages, {\n        ...config,\n        abortSignal: abortController.signal,\n      });\n\n      for await (const chunk of response) {\n        if (\n          chunk.event === \"messages/partial\" ||\n          chunk.event === \"messages/complete\"\n        ) {\n          setMessages(accumulator.addMessages(chunk.data));\n        } else if (chunk.event === \"updates\") {\n          setInterrupt(chunk.data.__interrupt__?.[0]);\n        }\n      }\n    },\n    [messages, stream, appendMessage],\n  );\n\n  const cancel = useCallback(() => {\n    if (abortControllerRef.current) {\n      abortControllerRef.current.abort();\n    }\n  }, [abortControllerRef]);\n\n  return {\n    interrupt,\n    messages,\n    sendMessage,\n    cancel,\n    setInterrupt,\n    setMessages,\n  };\n};\n"],"mappings":"AAAA,SAAS,UAAU,aAAa,cAAc;AAC9C,SAAS,MAAM,cAAc;AAC7B,SAAS,mCAAmC;AAmC5C,MAAM,yBAAyB,CAC7B,GACA,SACG;AAEE,MAAM,uBAAuB,CAAmC;AAAA,EACrE;AAAA,EACA,gBAAgB;AAClB,MAGM;AACJ,QAAM,CAAC,WAAW,YAAY,IAAI,SAEhC;AACF,QAAM,CAAC,UAAU,WAAW,IAAI,SAAqB,CAAC,CAAC;AACvD,QAAM,qBAAqB,OAA+B,IAAI;AAE9D,QAAM,cAAc;AAAA,IAClB,OAAO,aAAyB,WAAuC;AAErE,oBAAc,YAAY,IAAI,CAAC,MAAO,EAAE,KAAK,IAAI,EAAE,GAAG,GAAG,IAAI,OAAO,EAAE,CAAE;AAExE,YAAM,cAAc,IAAI,4BAA4B;AAAA,QAClD,iBAAiB;AAAA,QACjB;AAAA,MACF,CAAC;AACD,kBAAY,YAAY,YAAY,WAAW,CAAC;AAEhD,YAAM,kBAAkB,IAAI,gBAAgB;AAC5C,yBAAmB,UAAU;AAC7B,YAAM,WAAW,MAAM,OAAO,aAAa;AAAA,QACzC,GAAG;AAAA,QACH,aAAa,gBAAgB;AAAA,MAC/B,CAAC;AAED,uBAAiB,SAAS,UAAU;AAClC,YACE,MAAM,UAAU,sBAChB,MAAM,UAAU,qBAChB;AACA,sBAAY,YAAY,YAAY,MAAM,IAAI,CAAC;AAAA,QACjD,WAAW,MAAM,UAAU,WAAW;AACpC,uBAAa,MAAM,KAAK,gBAAgB,CAAC,CAAC;AAAA,QAC5C;AAAA,MACF;AAAA,IACF;AAAA,IACA,CAAC,UAAU,QAAQ,aAAa;AAAA,EAClC;AAEA,QAAM,SAAS,YAAY,MAAM;AAC/B,QAAI,mBAAmB,SAAS;AAC9B,yBAAmB,QAAQ,MAAM;AAAA,IACnC;AAAA,EACF,GAAG,CAAC,kBAAkB,CAAC;AAEvB,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;","names":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@assistant-ui/react-langgraph",
-  "version": "0.5.0",
+  "version": "0.5.1",
   "license": "MIT",
   "type": "module",
   "exports": {
@@ -13,6 +13,7 @@
   "types": "./dist/index.d.ts",
   "files": [
     "dist",
+    "src",
     "README.md"
   ],
   "sideEffects": false,
@@ -22,9 +23,9 @@
     "zod": "^3.24.3"
   },
   "peerDependencies": {
-    "@assistant-ui/react": "^0.10.0",
+    "@assistant-ui/react": "^0.10.1",
     "@types/react": "*",
-    "assistant-stream": "^0.2.0",
+    "assistant-stream": "^0.2.1",
     "react": "^18 || ^19 || ^19.0.0-rc"
   },
   "peerDependenciesMeta": {
@@ -34,8 +35,8 @@
   },
   "devDependencies": {
     "@types/node": "^22.14.1",
-    "@types/react": "^19.1.0",
-    "@types/uuid": "^9.0.8",
+    "@types/react": "^19.1.2",
+    "@types/uuid": "^10.0.0",
     "eslint": "^9",
     "eslint-config-next": "15.3.1",
     "react": "^19.1.0",
@@ -50,7 +51,7 @@
   "homepage": "https://www.assistant-ui.com/",
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/assistant-ui/assistant-ui.git"
+    "url": "https://github.com/assistant-ui/assistant-ui/tree/main/packages/react-langgraph"
   },
   "bugs": {
     "url": "https://github.com/assistant-ui/assistant-ui/issues"

package/src/LangGraphMessageAccumulator.ts

@@ -0,0 +1,63 @@
+import { v4 as uuidv4 } from "uuid";
+
+export type LangGraphMessagesEvent<TMessage> = {
+  event:
+    | "messages"
+    | "messages/partial"
+    | "messages/complete"
+    | "metadata"
+    | "updates"
+    | string;
+  data: TMessage[] | any;
+};
+
+export type LangGraphStateAccumulatorConfig<TMessage> = {
+  initialMessages?: TMessage[];
+  appendMessage?: (prev: TMessage | undefined, curr: TMessage) => TMessage;
+};
+
+export class LangGraphMessageAccumulator<TMessage extends { id?: string }> {
+  private messagesMap = new Map<string, TMessage>();
+  private appendMessage: (
+    prev: TMessage | undefined,
+    curr: TMessage,
+  ) => TMessage;
+
+  constructor({
+    initialMessages = [],
+    appendMessage = ((_: TMessage | undefined, curr: TMessage) => curr) as (
+      prev: TMessage | undefined,
+      curr: TMessage,
+    ) => TMessage,
+  }: LangGraphStateAccumulatorConfig<TMessage> = {}) {
+    this.appendMessage = appendMessage;
+    this.addMessages(initialMessages);
+  }
+
+  private ensureMessageId(message: TMessage): TMessage {
+    return message.id ? message : { ...message, id: uuidv4() };
+  }
+
+  public addMessages(newMessages: TMessage[]) {
+    if (newMessages.length === 0) return this.getMessages();
+
+    for (const message of newMessages.map(this.ensureMessageId)) {
+      const previous = message.id
+        ? this.messagesMap.get(message.id)
+        : undefined;
+      this.messagesMap.set(
+        message.id ?? uuidv4(),
+        this.appendMessage(previous, message),
+      );
+    }
+    return this.getMessages();
+  }
+
+  public getMessages(): TMessage[] {
+    return [...this.messagesMap.values()];
+  }
+
+  public clear() {
+    this.messagesMap.clear();
+  }
+}

package/src/appendLangChainChunk.ts

@@ -0,0 +1,55 @@
+import { LangChainMessage, LangChainMessageChunk } from "./types";
+import { parsePartialJsonObject } from "assistant-stream/utils";
+
+export const appendLangChainChunk = (
+  prev: LangChainMessage | undefined,
+  curr: LangChainMessage | LangChainMessageChunk,
+): LangChainMessage => {
+  if (curr.type !== "AIMessageChunk") {
+    return curr;
+  }
+
+  if (!prev || prev.type !== "ai") {
+    return {
+      ...curr,
+      type: curr.type.replace("MessageChunk", "").toLowerCase(),
+    } as LangChainMessage;
+  }
+
+  const newContent =
+    typeof prev.content === "string"
+      ? [{ type: "text" as const, text: prev.content }]
+      : [...prev.content];
+
+  for (const chunk of curr.content) {
+    if (chunk.type === "text") {
+      const existing = newContent[chunk.index] ?? { type: "text", text: "" };
+      if (existing.type !== "text") throw new Error("");
+      newContent[chunk.index] = {
+        ...existing,
+        ...chunk,
+        text: existing.text + chunk.text,
+      };
+    }
+  }
+
+  const newToolCalls = [...(prev.tool_calls ?? [])];
+  for (const chunk of curr.tool_call_chunks) {
+    const existing = newToolCalls[chunk.index - 1] ?? { argsText: "" };
+    const newArgsText = existing.argsText + chunk.args;
+    newToolCalls[chunk.index - 1] = {
+      ...chunk,
+      ...existing,
+      argsText: newArgsText,
+      args:
+        parsePartialJsonObject(newArgsText) ??
+        ("args" in existing ? existing.args : {}),
+    };
+  }
+
+  return {
+    ...prev,
+    content: newContent,
+    tool_calls: newToolCalls,
+  };
+};

package/src/convertLangChainMessages.ts

@@ -0,0 +1,81 @@
+"use client";
+
+import { useExternalMessageConverter } from "@assistant-ui/react";
+import { LangChainMessage } from "./types";
+import { ToolCallContentPart } from "@assistant-ui/react";
+import { ThreadUserMessage } from "@assistant-ui/react";
+
+const contentToParts = (content: LangChainMessage["content"]) => {
+  if (typeof content === "string")
+    return [{ type: "text" as const, text: content }];
+  return content
+    .map((part): ThreadUserMessage["content"][number] | null => {
+      const type = part.type;
+      switch (type) {
+        case "text":
+          return { type: "text", text: part.text };
+        case "image_url":
+          if (typeof part.image_url === "string") {
+            return { type: "image", image: part.image_url };
+          } else {
+            return {
+              type: "image",
+              image: part.image_url.url,
+            };
+          }
+
+        case "tool_use":
+          return null;
+        default:
+          const _exhaustiveCheck: never = type;
+          throw new Error(`Unknown content part type: ${_exhaustiveCheck}`);
+      }
+    })
+    .filter((a) => a !== null);
+};
+
+export const convertLangChainMessages: useExternalMessageConverter.Callback<
+  LangChainMessage
+> = (message) => {
+  switch (message.type) {
+    case "system":
+      return {
+        role: "system",
+        id: message.id,
+        content: [{ type: "text", text: message.content }],
+      };
+    case "human":
+      return {
+        role: "user",
+        id: message.id,
+        content: contentToParts(message.content),
+      };
+    case "ai":
+      return {
+        role: "assistant",
+        id: message.id,
+        content: [
+          ...contentToParts(message.content),
+          ...(message.tool_calls?.map(
+            (chunk): ToolCallContentPart => ({
+              type: "tool-call",
+              toolCallId: chunk.id,
+              toolName: chunk.name,
+              args: chunk.args,
+              argsText:
+                message.tool_call_chunks?.find((c) => c.id === chunk.id)
+                  ?.args ?? JSON.stringify(chunk.args),
+            }),
+          ) ?? []),
+        ],
+      };
+    case "tool":
+      return {
+        role: "tool",
+        toolName: message.name,
+        toolCallId: message.tool_call_id,
+        result: message.content,
+        artifact: message.artifact,
+      };
+  }
+};

package/src/index.ts

@@ -0,0 +1,31 @@
+export {
+  useLangGraphRuntime,
+  useLangGraphSend,
+  useLangGraphSendCommand,
+  useLangGraphInterruptState,
+} from "./useLangGraphRuntime";
+
+export {
+  useLangGraphMessages,
+  type LangGraphInterruptState,
+  type LangGraphCommand,
+  type LangGraphSendMessageConfig,
+  type LangGraphStreamCallback,
+  type LangGraphMessagesEvent,
+} from "./useLangGraphMessages";
+export { convertLangChainMessages } from "./convertLangChainMessages";
+
+/**
+ * @deprecated Use `convertLangChainMessages` instead.
+ */
+export { convertLangChainMessages as convertLangchainMessages } from "./convertLangChainMessages";
+
+export type {
+  LangChainMessage,
+  LangChainEvent,
+  LangChainToolCall,
+  LangChainToolCallChunk,
+} from "./types";
+
+export { LangGraphMessageAccumulator } from "./LangGraphMessageAccumulator";
+export { appendLangChainChunk } from "./appendLangChainChunk";

package/src/types.ts

@@ -0,0 +1,76 @@
+import { ReadonlyJSONObject } from "assistant-stream/utils";
+
+export type LangChainToolCallChunk = {
+  index: number;
+  id: string;
+  name: string;
+  args: string;
+};
+
+export type LangChainToolCall = {
+  id: string;
+  name: string;
+  argsText: string;
+  args: ReadonlyJSONObject;
+};
+
+type MessageContentText = {
+  type: "text";
+  text: string;
+};
+
+type MessageContentImageUrl = {
+  type: "image_url";
+  image_url: string | { url: string };
+};
+
+type MessageContentToolUse = {
+  type: "tool_use";
+};
+
+type UserMessageContentComplex = MessageContentText | MessageContentImageUrl;
+type AssistantMessageContentComplex =
+  | MessageContentText
+  | MessageContentToolUse;
+
+type UserMessageContent = string | UserMessageContentComplex[];
+type AssistantMessageContent = string | AssistantMessageContentComplex[];
+
+export type LangChainMessage =
+  | {
+      id?: string;
+      type: "system";
+      content: string;
+    }
+  | {
+      id?: string;
+      type: "human";
+      content: UserMessageContent;
+    }
+  | {
+      id?: string;
+      type: "tool";
+      content: string;
+      tool_call_id: string;
+      name: string;
+      artifact?: any;
+    }
+  | {
+      id?: string;
+      type: "ai";
+      content: AssistantMessageContent;
+      tool_call_chunks?: LangChainToolCallChunk[];
+      tool_calls?: LangChainToolCall[];
+    };
+
+export type LangChainMessageChunk = {
+  id: string;
+  type: "AIMessageChunk";
+  content: (AssistantMessageContentComplex & { index: number })[];
+  tool_call_chunks: LangChainToolCallChunk[];
+};
+
+export type LangChainEvent = {
+  event: "messages/partial" | "messages/complete";
+  data: LangChainMessage[];
+};

package/src/useLangGraphMessages.ts

@@ -0,0 +1,102 @@
+import { useState, useCallback, useRef } from "react";
+import { v4 as uuidv4 } from "uuid";
+import { LangGraphMessageAccumulator } from "./LangGraphMessageAccumulator";
+
+export type LangGraphCommand = {
+  resume: string;
+};
+
+export type LangGraphSendMessageConfig = {
+  command?: LangGraphCommand;
+  runConfig?: unknown;
+};
+
+export type LangGraphMessagesEvent<TMessage> = {
+  event:
+    | "messages"
+    | "messages/partial"
+    | "messages/complete"
+    | "metadata"
+    | "updates"
+    | string;
+  data: TMessage[] | any;
+};
+export type LangGraphStreamCallback<TMessage> = (
+  messages: TMessage[],
+  config: LangGraphSendMessageConfig & { abortSignal: AbortSignal },
+) =>
+  | Promise<AsyncGenerator<LangGraphMessagesEvent<TMessage>>>
+  | AsyncGenerator<LangGraphMessagesEvent<TMessage>>;
+
+export type LangGraphInterruptState = {
+  value?: any;
+  resumable?: boolean;
+  when: string;
+  ns?: string[];
+};
+
+const DEFAULT_APPEND_MESSAGE = <TMessage>(
+  _: TMessage | undefined,
+  curr: TMessage,
+) => curr;
+
+export const useLangGraphMessages = <TMessage extends { id?: string }>({
+  stream,
+  appendMessage = DEFAULT_APPEND_MESSAGE,
+}: {
+  stream: LangGraphStreamCallback<TMessage>;
+  appendMessage?: (prev: TMessage | undefined, curr: TMessage) => TMessage;
+}) => {
+  const [interrupt, setInterrupt] = useState<
+    LangGraphInterruptState | undefined
+  >();
+  const [messages, setMessages] = useState<TMessage[]>([]);
+  const abortControllerRef = useRef<AbortController | null>(null);
+
+  const sendMessage = useCallback(
+    async (newMessages: TMessage[], config: LangGraphSendMessageConfig) => {
+      // ensure all messages have an ID
+      newMessages = newMessages.map((m) => (m.id ? m : { ...m, id: uuidv4() }));
+
+      const accumulator = new LangGraphMessageAccumulator({
+        initialMessages: messages,
+        appendMessage,
+      });
+      setMessages(accumulator.addMessages(newMessages));
+
+      const abortController = new AbortController();
+      abortControllerRef.current = abortController;
+      const response = await stream(newMessages, {
+        ...config,
+        abortSignal: abortController.signal,
+      });
+
+      for await (const chunk of response) {
+        if (
+          chunk.event === "messages/partial" ||
+          chunk.event === "messages/complete"
+        ) {
+          setMessages(accumulator.addMessages(chunk.data));
+        } else if (chunk.event === "updates") {
+          setInterrupt(chunk.data.__interrupt__?.[0]);
+        }
+      }
+    },
+    [messages, stream, appendMessage],
+  );
+
+  const cancel = useCallback(() => {
+    if (abortControllerRef.current) {
+      abortControllerRef.current.abort();
+    }
+  }, [abortControllerRef]);
+
+  return {
+    interrupt,
+    messages,
+    sendMessage,
+    cancel,
+    setInterrupt,
+    setMessages,
+  };
+};

package/src/useLangGraphRuntime.ts

@@ -0,0 +1,273 @@
+import { useEffect, useRef, useState } from "react";
+import { LangChainMessage, LangChainToolCall } from "./types";
+import {
+  useExternalMessageConverter,
+  useExternalStoreRuntime,
+  useThread,
+  useThreadListItemRuntime,
+} from "@assistant-ui/react";
+import { convertLangChainMessages } from "./convertLangChainMessages";
+import {
+  LangGraphCommand,
+  LangGraphInterruptState,
+  LangGraphSendMessageConfig,
+  LangGraphStreamCallback,
+  useLangGraphMessages,
+} from "./useLangGraphMessages";
+import { AttachmentAdapter } from "@assistant-ui/react";
+import { AppendMessage } from "@assistant-ui/react";
+import { ExternalStoreAdapter } from "@assistant-ui/react";
+import { FeedbackAdapter } from "@assistant-ui/react";
+import { SpeechSynthesisAdapter } from "@assistant-ui/react";
+import { appendLangChainChunk } from "./appendLangChainChunk";
+
+const getPendingToolCalls = (messages: LangChainMessage[]) => {
+  const pendingToolCalls = new Map<string, LangChainToolCall>();
+  for (const message of messages) {
+    if (message.type === "ai") {
+      for (const toolCall of message.tool_calls ?? []) {
+        pendingToolCalls.set(toolCall.id, toolCall);
+      }
+    }
+    if (message.type === "tool") {
+      pendingToolCalls.delete(message.tool_call_id);
+    }
+  }
+
+  return [...pendingToolCalls.values()];
+};
+
+const getMessageContent = (msg: AppendMessage) => {
+  const allContent = [
+    ...msg.content,
+    ...(msg.attachments?.flatMap((a) => a.content) ?? []),
+  ];
+  const content = allContent.map((part) => {
+    const type = part.type;
+    switch (type) {
+      case "text":
+        return { type: "text" as const, text: part.text };
+      case "image":
+        return { type: "image_url" as const, image_url: { url: part.image } };
+
+      case "tool-call":
+        throw new Error("Tool call appends are not supported.");
+
+      default:
+        const _exhaustiveCheck: "reasoning" | "source" | "file" | "audio" =
+          type;
+        throw new Error(
+          `Unsupported append content part type: ${_exhaustiveCheck}`,
+        );
+    }
+  });
+
+  if (content.length === 1 && content[0]?.type === "text") {
+    return content[0].text ?? "";
+  }
+
+  return content;
+};
+
+const symbolLangGraphRuntimeExtras = Symbol("langgraph-runtime-extras");
+type LangGraphRuntimeExtras = {
+  [symbolLangGraphRuntimeExtras]: true;
+  send: (
+    messages: LangChainMessage[],
+    config: LangGraphSendMessageConfig,
+  ) => Promise<void>;
+  interrupt: LangGraphInterruptState | undefined;
+};
+
+const asLangGraphRuntimeExtras = (extras: unknown): LangGraphRuntimeExtras => {
+  if (
+    typeof extras !== "object" ||
+    extras == null ||
+    !(symbolLangGraphRuntimeExtras in extras)
+  )
+    throw new Error(
+      "This method can only be called when you are using useLangGraphRuntime",
+    );
+
+  return extras as LangGraphRuntimeExtras;
+};
+
+export const useLangGraphInterruptState = () => {
+  const { interrupt } = useThread((t) => asLangGraphRuntimeExtras(t.extras));
+  return interrupt;
+};
+
+export const useLangGraphSend = () => {
+  const { send } = useThread((t) => asLangGraphRuntimeExtras(t.extras));
+  return send;
+};
+
+export const useLangGraphSendCommand = () => {
+  const send = useLangGraphSend();
+  return (command: LangGraphCommand) => send([], { command });
+};
+
+export const useLangGraphRuntime = ({
+  autoCancelPendingToolCalls,
+  adapters: { attachments, feedback, speech } = {},
+  unstable_allowCancellation,
+  stream,
+  threadId,
+  onSwitchToNewThread,
+  onSwitchToThread,
+}: {
+  /**
+   * @deprecated For thread management use `useCloudThreadListRuntime` instead. This option will be removed in a future version.
+   */
+  threadId?: string | undefined;
+  autoCancelPendingToolCalls?: boolean | undefined;
+  unstable_allowCancellation?: boolean | undefined;
+  stream: LangGraphStreamCallback<LangChainMessage>;
+  /**
+   * @deprecated For thread management use `useCloudThreadListRuntime` instead. This option will be removed in a future version.
+   */
+  onSwitchToNewThread?: () => Promise<void> | void;
+  onSwitchToThread?: (threadId: string) => Promise<{
+    messages: LangChainMessage[];
+    interrupts?: LangGraphInterruptState[];
+  }>;
+  adapters?:
+    | {
+        attachments?: AttachmentAdapter;
+        speech?: SpeechSynthesisAdapter;
+        feedback?: FeedbackAdapter;
+      }
+    | undefined;
+}) => {
+  const {
+    interrupt,
+    setInterrupt,
+    messages,
+    sendMessage,
+    cancel,
+    setMessages,
+  } = useLangGraphMessages({
+    appendMessage: appendLangChainChunk,
+    stream,
+  });
+
+  const [isRunning, setIsRunning] = useState(false);
+  const handleSendMessage = async (
+    messages: LangChainMessage[],
+    config: LangGraphSendMessageConfig,
+  ) => {
+    try {
+      setIsRunning(true);
+      await sendMessage(messages, config);
+    } catch (error) {
+      console.error("Error streaming messages:", error);
+    } finally {
+      setIsRunning(false);
+    }
+  };
+
+  const threadMessages = useExternalMessageConverter({
+    callback: convertLangChainMessages,
+    messages,
+    isRunning,
+  });
+
+  const switchToThread = !onSwitchToThread
+    ? undefined
+    : async (externalId: string) => {
+        const { messages, interrupts } = await onSwitchToThread(externalId);
+        setMessages(messages);
+        setInterrupt(interrupts?.[0]);
+      };
+
+  const threadList: NonNullable<
+    ExternalStoreAdapter["adapters"]
+  >["threadList"] = {
+    threadId,
+    onSwitchToNewThread: !onSwitchToNewThread
+      ? undefined
+      : async () => {
+          await onSwitchToNewThread();
+          setMessages([]);
+        },
+    onSwitchToThread: switchToThread,
+  };
+
+  const loadingRef = useRef(false);
+  const threadListItemRuntime = useThreadListItemRuntime({ optional: true });
+  useEffect(() => {
+    if (!threadListItemRuntime || !switchToThread || loadingRef.current) return;
+
+    const externalId = threadListItemRuntime.getState().externalId;
+    if (externalId) {
+      loadingRef.current = true;
+      switchToThread(externalId).finally(() => {
+        loadingRef.current = false;
+      });
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+
+  return useExternalStoreRuntime({
+    isRunning,
+    messages: threadMessages,
+    adapters: {
+      attachments,
+      feedback,
+      speech,
+      threadList,
+    },
+    extras: {
+      [symbolLangGraphRuntimeExtras]: true,
+      interrupt,
+      send: handleSendMessage,
+    } satisfies LangGraphRuntimeExtras,
+    onNew: (msg) => {
+      const cancellations =
+        autoCancelPendingToolCalls !== false
+          ? getPendingToolCalls(messages).map(
+              (t) =>
+                ({
+                  type: "tool",
+                  name: t.name,
+                  tool_call_id: t.id,
+                  content: JSON.stringify({ cancelled: true }),
+                }) satisfies LangChainMessage & { type: "tool" },
+            )
+          : [];
+
+      return handleSendMessage(
+        [
+          ...cancellations,
+          {
+            type: "human",
+            content: getMessageContent(msg),
+          },
+        ],
+        {
+          runConfig: msg.runConfig,
+        },
+      );
+    },
+    onAddToolResult: async ({ toolCallId, toolName, result }) => {
+      // TODO parallel human in the loop calls
+      await handleSendMessage(
+        [
+          {
+            type: "tool",
+            name: toolName,
+            tool_call_id: toolCallId,
+            content: JSON.stringify(result),
+          },
+        ],
+        // TODO reuse runconfig here!
+        {},
+      );
+    },
+    onCancel: unstable_allowCancellation
+      ? async () => {
+          cancel();
+        }
+      : undefined,
+  });
+};