@assistant-ui/react-langgraph 0.5.5 → 0.5.6

package/dist/LangGraphMessageAccumulator.d.ts

@@ -1,7 +1,3 @@
-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;

package/dist/LangGraphMessageAccumulator.d.ts.map

@@ -1 +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"}
+{"version":3,"file":"LangGraphMessageAccumulator.d.ts","sourceRoot":"","sources":["../src/LangGraphMessageAccumulator.ts"],"names":[],"mappings":"AAEA,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/LangGraphMessageAccumulator.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/LangGraphMessageAccumulator.ts"],"sourcesContent":["import { v4 as uuidv4 } from \"uuid\";\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};\n\nexport type LangGraphStateAccumulatorConfig<TMessage> = {\n  initialMessages?: TMessage[];\n  appendMessage?: (prev: TMessage | undefined, curr: TMessage) => TMessage;\n};\n\nexport class LangGraphMessageAccumulator<TMessage extends { id?: string }> {\n  private messagesMap = new Map<string, TMessage>();\n  private appendMessage: (\n    prev: TMessage | undefined,\n    curr: TMessage,\n  ) => TMessage;\n\n  constructor({\n    initialMessages = [],\n    appendMessage = ((_: TMessage | undefined, curr: TMessage) => curr) as (\n      prev: TMessage | undefined,\n      curr: TMessage,\n    ) => TMessage,\n  }: LangGraphStateAccumulatorConfig<TMessage> = {}) {\n    this.appendMessage = appendMessage;\n    this.addMessages(initialMessages);\n  }\n\n  private ensureMessageId(message: TMessage): TMessage {\n    return message.id ? message : { ...message, id: uuidv4() };\n  }\n\n  public addMessages(newMessages: TMessage[]) {\n    if (newMessages.length === 0) return this.getMessages();\n\n    for (const message of newMessages.map(this.ensureMessageId)) {\n      const previous = message.id\n        ? this.messagesMap.get(message.id)\n        : undefined;\n      this.messagesMap.set(\n        message.id ?? uuidv4(),\n        this.appendMessage(previous, message),\n      );\n    }\n    return this.getMessages();\n  }\n\n  public getMessages(): TMessage[] {\n    return [...this.messagesMap.values()];\n  }\n\n  public clear() {\n    this.messagesMap.clear();\n  }\n}\n"],"mappings":";AAAA,SAAS,MAAM,cAAc;AAkBtB,IAAM,8BAAN,MAAoE;AAAA,EACjE,cAAc,oBAAI,IAAsB;AAAA,EACxC;AAAA,EAKR,YAAY;AAAA,IACV,kBAAkB,CAAC;AAAA,IACnB,gBAAiB,CAAC,GAAyB,SAAmB;AAAA,EAIhE,IAA+C,CAAC,GAAG;AACjD,SAAK,gBAAgB;AACrB,SAAK,YAAY,eAAe;AAAA,EAClC;AAAA,EAEQ,gBAAgB,SAA6B;AACnD,WAAO,QAAQ,KAAK,UAAU,EAAE,GAAG,SAAS,IAAI,OAAO,EAAE;AAAA,EAC3D;AAAA,EAEO,YAAY,aAAyB;AAC1C,QAAI,YAAY,WAAW,EAAG,QAAO,KAAK,YAAY;AAEtD,eAAW,WAAW,YAAY,IAAI,KAAK,eAAe,GAAG;AAC3D,YAAM,WAAW,QAAQ,KACrB,KAAK,YAAY,IAAI,QAAQ,EAAE,IAC/B;AACJ,WAAK,YAAY;AAAA,QACf,QAAQ,MAAM,OAAO;AAAA,QACrB,KAAK,cAAc,UAAU,OAAO;AAAA,MACtC;AAAA,IACF;AACA,WAAO,KAAK,YAAY;AAAA,EAC1B;AAAA,EAEO,cAA0B;AAC/B,WAAO,CAAC,GAAG,KAAK,YAAY,OAAO,CAAC;AAAA,EACtC;AAAA,EAEO,QAAQ;AACb,SAAK,YAAY,MAAM;AAAA,EACzB;AACF;","names":[]}
+{"version":3,"sources":["../src/LangGraphMessageAccumulator.ts"],"sourcesContent":["import { v4 as uuidv4 } from \"uuid\";\n\nexport type LangGraphStateAccumulatorConfig<TMessage> = {\n  initialMessages?: TMessage[];\n  appendMessage?: (prev: TMessage | undefined, curr: TMessage) => TMessage;\n};\n\nexport class LangGraphMessageAccumulator<TMessage extends { id?: string }> {\n  private messagesMap = new Map<string, TMessage>();\n  private appendMessage: (\n    prev: TMessage | undefined,\n    curr: TMessage,\n  ) => TMessage;\n\n  constructor({\n    initialMessages = [],\n    appendMessage = ((_: TMessage | undefined, curr: TMessage) => curr) as (\n      prev: TMessage | undefined,\n      curr: TMessage,\n    ) => TMessage,\n  }: LangGraphStateAccumulatorConfig<TMessage> = {}) {\n    this.appendMessage = appendMessage;\n    this.addMessages(initialMessages);\n  }\n\n  private ensureMessageId(message: TMessage): TMessage {\n    return message.id ? message : { ...message, id: uuidv4() };\n  }\n\n  public addMessages(newMessages: TMessage[]) {\n    if (newMessages.length === 0) return this.getMessages();\n\n    for (const message of newMessages.map(this.ensureMessageId)) {\n      const previous = message.id\n        ? this.messagesMap.get(message.id)\n        : undefined;\n      this.messagesMap.set(\n        message.id ?? uuidv4(),\n        this.appendMessage(previous, message),\n      );\n    }\n    return this.getMessages();\n  }\n\n  public getMessages(): TMessage[] {\n    return [...this.messagesMap.values()];\n  }\n\n  public clear() {\n    this.messagesMap.clear();\n  }\n}\n"],"mappings":";AAAA,SAAS,MAAM,cAAc;AAOtB,IAAM,8BAAN,MAAoE;AAAA,EACjE,cAAc,oBAAI,IAAsB;AAAA,EACxC;AAAA,EAKR,YAAY;AAAA,IACV,kBAAkB,CAAC;AAAA,IACnB,gBAAiB,CAAC,GAAyB,SAAmB;AAAA,EAIhE,IAA+C,CAAC,GAAG;AACjD,SAAK,gBAAgB;AACrB,SAAK,YAAY,eAAe;AAAA,EAClC;AAAA,EAEQ,gBAAgB,SAA6B;AACnD,WAAO,QAAQ,KAAK,UAAU,EAAE,GAAG,SAAS,IAAI,OAAO,EAAE;AAAA,EAC3D;AAAA,EAEO,YAAY,aAAyB;AAC1C,QAAI,YAAY,WAAW,EAAG,QAAO,KAAK,YAAY;AAEtD,eAAW,WAAW,YAAY,IAAI,KAAK,eAAe,GAAG;AAC3D,YAAM,WAAW,QAAQ,KACrB,KAAK,YAAY,IAAI,QAAQ,EAAE,IAC/B;AACJ,WAAK,YAAY;AAAA,QACf,QAAQ,MAAM,OAAO;AAAA,QACrB,KAAK,cAAc,UAAU,OAAO;AAAA,MACtC;AAAA,IACF;AACA,WAAO,KAAK,YAAY;AAAA,EAC1B;AAAA,EAEO,cAA0B;AAC/B,WAAO,CAAC,GAAG,KAAK,YAAY,OAAO,CAAC;AAAA,EACtC;AAAA,EAEO,QAAQ;AACb,SAAK,YAAY,MAAM;AAAA,EACzB;AACF;","names":[]}

package/dist/appendLangChainChunk.d.ts.map

@@ -1 +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"}
+{"version":3,"file":"appendLangChainChunk.d.ts","sourceRoot":"","sources":["../src/appendLangChainChunk.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,gBAAgB,EAChB,qBAAqB,EAEtB,MAAM,SAAS,CAAC;AAGjB,eAAO,MAAM,oBAAoB,GAC/B,MAAM,gBAAgB,GAAG,SAAS,EAClC,MAAM,gBAAgB,GAAG,qBAAqB,KAC7C,gBAgEF,CAAC"}

package/dist/appendLangChainChunk.js

@@ -11,19 +11,32 @@ var appendLangChainChunk = (prev, curr) => {
     };
   }
   const newContent = typeof prev.content === "string" ? [{ type: "text", 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
-      };
+  if (typeof curr?.content === "string") {
+    const lastIndex = newContent.length - 1;
+    if (newContent[lastIndex]?.type === "text") {
+      newContent[lastIndex].text = newContent[lastIndex].text + curr.content;
+    } else {
+      newContent.push({ type: "text", text: curr.content });
+    }
+  } else if (Array.isArray(curr.content)) {
+    const lastIndex = newContent.length - 1;
+    for (const item of curr.content) {
+      if (!("type" in item)) {
+        continue;
+      }
+      if (item.type === "text") {
+        if (newContent[lastIndex]?.type === "text") {
+          newContent[lastIndex].text = newContent[lastIndex].text + item.text;
+        } else {
+          newContent.push({ type: "text", text: item.text });
+        }
+      } else if (item.type === "image_url") {
+        newContent.push(item);
+      }
     }
   }
   const newToolCalls = [...prev.tool_calls ?? []];
-  for (const chunk of curr.tool_call_chunks) {
+  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] = {

package/dist/appendLangChainChunk.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/appendLangChainChunk.ts"],"sourcesContent":["import { LangChainMessage, LangChainMessageChunk } from \"./types\";\nimport { parsePartialJsonObject } from \"assistant-stream/utils\";\n\nexport const appendLangChainChunk = (\n  prev: LangChainMessage | undefined,\n  curr: LangChainMessage | LangChainMessageChunk,\n): LangChainMessage => {\n  if (curr.type !== \"AIMessageChunk\") {\n    return curr;\n  }\n\n  if (!prev || prev.type !== \"ai\") {\n    return {\n      ...curr,\n      type: curr.type.replace(\"MessageChunk\", \"\").toLowerCase(),\n    } as LangChainMessage;\n  }\n\n  const newContent =\n    typeof prev.content === \"string\"\n      ? [{ type: \"text\" as const, text: prev.content }]\n      : [...prev.content];\n\n  for (const chunk of curr.content) {\n    if (chunk.type === \"text\") {\n      const existing = newContent[chunk.index] ?? { type: \"text\", text: \"\" };\n      if (existing.type !== \"text\") throw new Error(\"\");\n      newContent[chunk.index] = {\n        ...existing,\n        ...chunk,\n        text: existing.text + chunk.text,\n      };\n    }\n  }\n\n  const newToolCalls = [...(prev.tool_calls ?? [])];\n  for (const chunk of curr.tool_call_chunks) {\n    const existing = newToolCalls[chunk.index - 1] ?? { argsText: \"\" };\n    const newArgsText = existing.argsText + chunk.args;\n    newToolCalls[chunk.index - 1] = {\n      ...chunk,\n      ...existing,\n      argsText: newArgsText,\n      args:\n        parsePartialJsonObject(newArgsText) ??\n        (\"args\" in existing ? existing.args : {}),\n    };\n  }\n\n  return {\n    ...prev,\n    content: newContent,\n    tool_calls: newToolCalls,\n  };\n};\n"],"mappings":";AACA,SAAS,8BAA8B;AAEhC,IAAM,uBAAuB,CAClC,MACA,SACqB;AACrB,MAAI,KAAK,SAAS,kBAAkB;AAClC,WAAO;AAAA,EACT;AAEA,MAAI,CAAC,QAAQ,KAAK,SAAS,MAAM;AAC/B,WAAO;AAAA,MACL,GAAG;AAAA,MACH,MAAM,KAAK,KAAK,QAAQ,gBAAgB,EAAE,EAAE,YAAY;AAAA,IAC1D;AAAA,EACF;AAEA,QAAM,aACJ,OAAO,KAAK,YAAY,WACpB,CAAC,EAAE,MAAM,QAAiB,MAAM,KAAK,QAAQ,CAAC,IAC9C,CAAC,GAAG,KAAK,OAAO;AAEtB,aAAW,SAAS,KAAK,SAAS;AAChC,QAAI,MAAM,SAAS,QAAQ;AACzB,YAAM,WAAW,WAAW,MAAM,KAAK,KAAK,EAAE,MAAM,QAAQ,MAAM,GAAG;AACrE,UAAI,SAAS,SAAS,OAAQ,OAAM,IAAI,MAAM,EAAE;AAChD,iBAAW,MAAM,KAAK,IAAI;AAAA,QACxB,GAAG;AAAA,QACH,GAAG;AAAA,QACH,MAAM,SAAS,OAAO,MAAM;AAAA,MAC9B;AAAA,IACF;AAAA,EACF;AAEA,QAAM,eAAe,CAAC,GAAI,KAAK,cAAc,CAAC,CAAE;AAChD,aAAW,SAAS,KAAK,kBAAkB;AACzC,UAAM,WAAW,aAAa,MAAM,QAAQ,CAAC,KAAK,EAAE,UAAU,GAAG;AACjE,UAAM,cAAc,SAAS,WAAW,MAAM;AAC9C,iBAAa,MAAM,QAAQ,CAAC,IAAI;AAAA,MAC9B,GAAG;AAAA,MACH,GAAG;AAAA,MACH,UAAU;AAAA,MACV,MACE,uBAAuB,WAAW,MACjC,UAAU,WAAW,SAAS,OAAO,CAAC;AAAA,IAC3C;AAAA,EACF;AAEA,SAAO;AAAA,IACL,GAAG;AAAA,IACH,SAAS;AAAA,IACT,YAAY;AAAA,EACd;AACF;","names":[]}
+{"version":3,"sources":["../src/appendLangChainChunk.ts"],"sourcesContent":["import {\n  LangChainMessage,\n  LangChainMessageChunk,\n  MessageContentText,\n} from \"./types\";\nimport { parsePartialJsonObject } from \"assistant-stream/utils\";\n\nexport const appendLangChainChunk = (\n  prev: LangChainMessage | undefined,\n  curr: LangChainMessage | LangChainMessageChunk,\n): LangChainMessage => {\n  if (curr.type !== \"AIMessageChunk\") {\n    return curr;\n  }\n\n  if (!prev || prev.type !== \"ai\") {\n    return {\n      ...curr,\n      type: curr.type.replace(\"MessageChunk\", \"\").toLowerCase(),\n    } as LangChainMessage;\n  }\n\n  const newContent =\n    typeof prev.content === \"string\"\n      ? [{ type: \"text\" as const, text: prev.content }]\n      : [...prev.content];\n\n  if (typeof curr?.content === \"string\") {\n    const lastIndex = newContent.length - 1;\n    if (newContent[lastIndex]?.type === \"text\") {\n      (newContent[lastIndex] as MessageContentText).text =\n        (newContent[lastIndex] as MessageContentText).text + curr.content;\n    } else {\n      newContent.push({ type: \"text\", text: curr.content });\n    }\n  } else if (Array.isArray(curr.content)) {\n    const lastIndex = newContent.length - 1;\n    for (const item of curr.content) {\n      if (!(\"type\" in item)) {\n        continue;\n      }\n\n      if (item.type === \"text\") {\n        if (newContent[lastIndex]?.type === \"text\") {\n          (newContent[lastIndex] as MessageContentText).text =\n            (newContent[lastIndex] as MessageContentText).text + item.text;\n        } else {\n          newContent.push({ type: \"text\", text: item.text });\n        }\n      } else if (item.type === \"image_url\") {\n        newContent.push(item);\n      }\n    }\n  }\n\n  const newToolCalls = [...(prev.tool_calls ?? [])];\n  for (const chunk of curr.tool_call_chunks ?? []) {\n    const existing = newToolCalls[chunk.index - 1] ?? { argsText: \"\" };\n    const newArgsText = existing.argsText + chunk.args;\n    newToolCalls[chunk.index - 1] = {\n      ...chunk,\n      ...existing,\n      argsText: newArgsText,\n      args:\n        parsePartialJsonObject(newArgsText) ??\n        (\"args\" in existing ? existing.args : {}),\n    };\n  }\n\n  return {\n    ...prev,\n    content: newContent,\n    tool_calls: newToolCalls,\n  };\n};\n"],"mappings":";AAKA,SAAS,8BAA8B;AAEhC,IAAM,uBAAuB,CAClC,MACA,SACqB;AACrB,MAAI,KAAK,SAAS,kBAAkB;AAClC,WAAO;AAAA,EACT;AAEA,MAAI,CAAC,QAAQ,KAAK,SAAS,MAAM;AAC/B,WAAO;AAAA,MACL,GAAG;AAAA,MACH,MAAM,KAAK,KAAK,QAAQ,gBAAgB,EAAE,EAAE,YAAY;AAAA,IAC1D;AAAA,EACF;AAEA,QAAM,aACJ,OAAO,KAAK,YAAY,WACpB,CAAC,EAAE,MAAM,QAAiB,MAAM,KAAK,QAAQ,CAAC,IAC9C,CAAC,GAAG,KAAK,OAAO;AAEtB,MAAI,OAAO,MAAM,YAAY,UAAU;AACrC,UAAM,YAAY,WAAW,SAAS;AACtC,QAAI,WAAW,SAAS,GAAG,SAAS,QAAQ;AAC1C,MAAC,WAAW,SAAS,EAAyB,OAC3C,WAAW,SAAS,EAAyB,OAAO,KAAK;AAAA,IAC9D,OAAO;AACL,iBAAW,KAAK,EAAE,MAAM,QAAQ,MAAM,KAAK,QAAQ,CAAC;AAAA,IACtD;AAAA,EACF,WAAW,MAAM,QAAQ,KAAK,OAAO,GAAG;AACtC,UAAM,YAAY,WAAW,SAAS;AACtC,eAAW,QAAQ,KAAK,SAAS;AAC/B,UAAI,EAAE,UAAU,OAAO;AACrB;AAAA,MACF;AAEA,UAAI,KAAK,SAAS,QAAQ;AACxB,YAAI,WAAW,SAAS,GAAG,SAAS,QAAQ;AAC1C,UAAC,WAAW,SAAS,EAAyB,OAC3C,WAAW,SAAS,EAAyB,OAAO,KAAK;AAAA,QAC9D,OAAO;AACL,qBAAW,KAAK,EAAE,MAAM,QAAQ,MAAM,KAAK,KAAK,CAAC;AAAA,QACnD;AAAA,MACF,WAAW,KAAK,SAAS,aAAa;AACpC,mBAAW,KAAK,IAAI;AAAA,MACtB;AAAA,IACF;AAAA,EACF;AAEA,QAAM,eAAe,CAAC,GAAI,KAAK,cAAc,CAAC,CAAE;AAChD,aAAW,SAAS,KAAK,oBAAoB,CAAC,GAAG;AAC/C,UAAM,WAAW,aAAa,MAAM,QAAQ,CAAC,KAAK,EAAE,UAAU,GAAG;AACjE,UAAM,cAAc,SAAS,WAAW,MAAM;AAC9C,iBAAa,MAAM,QAAQ,CAAC,IAAI;AAAA,MAC9B,GAAG;AAAA,MACH,GAAG;AAAA,MACH,UAAU;AAAA,MACV,MACE,uBAAuB,WAAW,MACjC,UAAU,WAAW,SAAS,OAAO,CAAC;AAAA,IAC3C;AAAA,EACF;AAEA,SAAO;AAAA,IACL,GAAG;AAAA,IACH,SAAS;AAAA,IACT,YAAY;AAAA,EACd;AACF;","names":[]}

package/dist/types.d.ts

@@ -11,11 +11,11 @@ export type LangChainToolCall = {
     argsText: string;
     args: ReadonlyJSONObject;
 };
-type MessageContentText = {
+export type MessageContentText = {
     type: "text";
     text: string;
 };
-type MessageContentImageUrl = {
+export type MessageContentImageUrl = {
     type: "image_url";
     image_url: string | {
         url: string;
@@ -24,8 +24,17 @@ type MessageContentImageUrl = {
 type MessageContentToolUse = {
     type: "tool_use";
 };
+export declare enum LangGraphKnownEventTypes {
+    Messages = "messages",
+    MessagesPartial = "messages/partial",
+    MessagesComplete = "messages/complete",
+    Metadata = "metadata",
+    Updates = "updates"
+}
+type CustomEventType = string;
+export type EventType = LangGraphKnownEventTypes | CustomEventType;
 type UserMessageContentComplex = MessageContentText | MessageContentImageUrl;
-type AssistantMessageContentComplex = MessageContentText | MessageContentToolUse;
+type AssistantMessageContentComplex = MessageContentText | MessageContentImageUrl | MessageContentToolUse;
 type UserMessageContent = string | UserMessageContentComplex[];
 type AssistantMessageContent = string | AssistantMessageContentComplex[];
 export type LangChainMessage = {
@@ -52,16 +61,19 @@ export type LangChainMessage = {
     tool_calls?: LangChainToolCall[];
 };
 export type LangChainMessageChunk = {
-    id: string;
+    id?: string | undefined;
     type: "AIMessageChunk";
-    content: (AssistantMessageContentComplex & {
-        index: number;
-    })[];
-    tool_call_chunks: LangChainToolCallChunk[];
+    content?: AssistantMessageContent | undefined;
+    tool_call_chunks?: LangChainToolCallChunk[] | undefined;
 };
 export type LangChainEvent = {
-    event: "messages/partial" | "messages/complete";
+    event: LangGraphKnownEventTypes.MessagesPartial | LangGraphKnownEventTypes.MessagesComplete;
     data: LangChainMessage[];
 };
+type LangGraphTupleMetadata = Record<string, unknown>;
+export type LangChainMessageTupleEvent = {
+    event: LangGraphKnownEventTypes.Messages;
+    data: [LangChainMessageChunk, LangGraphTupleMetadata];
+};
 export {};
 //# sourceMappingURL=types.d.ts.map

package/dist/types.d.ts.map

@@ -1 +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;IACf,MAAM,EAAE,SAAS,GAAG,OAAO,CAAC;CAC7B,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"}
+{"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,MAAM,MAAM,kBAAkB,GAAG;IAC/B,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,MAAM,MAAM,sBAAsB,GAAG;IACnC,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,oBAAY,wBAAwB;IAClC,QAAQ,aAAa;IACrB,eAAe,qBAAqB;IACpC,gBAAgB,sBAAsB;IACtC,QAAQ,aAAa;IACrB,OAAO,YAAY;CACpB;AACD,KAAK,eAAe,GAAG,MAAM,CAAC;AAE9B,MAAM,MAAM,SAAS,GAAG,wBAAwB,GAAG,eAAe,CAAC;AAEnE,KAAK,yBAAyB,GAAG,kBAAkB,GAAG,sBAAsB,CAAC;AAC7E,KAAK,8BAA8B,GAC/B,kBAAkB,GAClB,sBAAsB,GACtB,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;IACf,MAAM,EAAE,SAAS,GAAG,OAAO,CAAC;CAC7B,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,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACxB,IAAI,EAAE,gBAAgB,CAAC;IACvB,OAAO,CAAC,EAAE,uBAAuB,GAAG,SAAS,CAAC;IAC9C,gBAAgB,CAAC,EAAE,sBAAsB,EAAE,GAAG,SAAS,CAAC;CACzD,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG;IAC3B,KAAK,EACD,wBAAwB,CAAC,eAAe,GACxC,wBAAwB,CAAC,gBAAgB,CAAC;IAC9C,IAAI,EAAE,gBAAgB,EAAE,CAAC;CAC1B,CAAC;AAEF,KAAK,sBAAsB,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;AAEtD,MAAM,MAAM,0BAA0B,GAAG;IACvC,KAAK,EAAE,wBAAwB,CAAC,QAAQ,CAAC;IACzC,IAAI,EAAE,CAAC,qBAAqB,EAAE,sBAAsB,CAAC,CAAC;CACvD,CAAC"}

package/dist/types.js

@@ -1 +1,13 @@
+// src/types.ts
+var LangGraphKnownEventTypes = /* @__PURE__ */ ((LangGraphKnownEventTypes2) => {
+  LangGraphKnownEventTypes2["Messages"] = "messages";
+  LangGraphKnownEventTypes2["MessagesPartial"] = "messages/partial";
+  LangGraphKnownEventTypes2["MessagesComplete"] = "messages/complete";
+  LangGraphKnownEventTypes2["Metadata"] = "metadata";
+  LangGraphKnownEventTypes2["Updates"] = "updates";
+  return LangGraphKnownEventTypes2;
+})(LangGraphKnownEventTypes || {});
+export {
+  LangGraphKnownEventTypes
+};
 //# sourceMappingURL=types.js.map

package/dist/types.js.map

@@ -1 +1 @@
-{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}
+{"version":3,"sources":["../src/types.ts"],"sourcesContent":["import { ReadonlyJSONObject } from \"assistant-stream/utils\";\n\nexport type LangChainToolCallChunk = {\n  index: number;\n  id: string;\n  name: string;\n  args: string;\n};\n\nexport type LangChainToolCall = {\n  id: string;\n  name: string;\n  argsText: string;\n  args: ReadonlyJSONObject;\n};\n\nexport type MessageContentText = {\n  type: \"text\";\n  text: string;\n};\n\nexport type MessageContentImageUrl = {\n  type: \"image_url\";\n  image_url: string | { url: string };\n};\n\ntype MessageContentToolUse = {\n  type: \"tool_use\";\n};\n\nexport enum LangGraphKnownEventTypes {\n  Messages = \"messages\",\n  MessagesPartial = \"messages/partial\",\n  MessagesComplete = \"messages/complete\",\n  Metadata = \"metadata\",\n  Updates = \"updates\",\n}\ntype CustomEventType = string;\n\nexport type EventType = LangGraphKnownEventTypes | CustomEventType;\n\ntype UserMessageContentComplex = MessageContentText | MessageContentImageUrl;\ntype AssistantMessageContentComplex =\n  | MessageContentText\n  | MessageContentImageUrl\n  | MessageContentToolUse;\n\ntype UserMessageContent = string | UserMessageContentComplex[];\ntype AssistantMessageContent = string | AssistantMessageContentComplex[];\n\nexport type LangChainMessage =\n  | {\n      id?: string;\n      type: \"system\";\n      content: string;\n    }\n  | {\n      id?: string;\n      type: \"human\";\n      content: UserMessageContent;\n    }\n  | {\n      id?: string;\n      type: \"tool\";\n      content: string;\n      tool_call_id: string;\n      name: string;\n      artifact?: any;\n      status: \"success\" | \"error\";\n    }\n  | {\n      id?: string;\n      type: \"ai\";\n      content: AssistantMessageContent;\n      tool_call_chunks?: LangChainToolCallChunk[];\n      tool_calls?: LangChainToolCall[];\n    };\n\nexport type LangChainMessageChunk = {\n  id?: string | undefined;\n  type: \"AIMessageChunk\";\n  content?: AssistantMessageContent | undefined;\n  tool_call_chunks?: LangChainToolCallChunk[] | undefined;\n};\n\nexport type LangChainEvent = {\n  event:\n    | LangGraphKnownEventTypes.MessagesPartial\n    | LangGraphKnownEventTypes.MessagesComplete;\n  data: LangChainMessage[];\n};\n\ntype LangGraphTupleMetadata = Record<string, unknown>;\n\nexport type LangChainMessageTupleEvent = {\n  event: LangGraphKnownEventTypes.Messages;\n  data: [LangChainMessageChunk, LangGraphTupleMetadata];\n};\n"],"mappings":";AA8BO,IAAK,2BAAL,kBAAKA,8BAAL;AACL,EAAAA,0BAAA,cAAW;AACX,EAAAA,0BAAA,qBAAkB;AAClB,EAAAA,0BAAA,sBAAmB;AACnB,EAAAA,0BAAA,cAAW;AACX,EAAAA,0BAAA,aAAU;AALA,SAAAA;AAAA,GAAA;","names":["LangGraphKnownEventTypes"]}

package/dist/useLangGraphMessages.d.ts

@@ -1,3 +1,4 @@
+import { EventType } from "./types";
 export type LangGraphCommand = {
     resume: string;
 };
@@ -6,7 +7,7 @@ export type LangGraphSendMessageConfig = {
     runConfig?: unknown;
 };
 export type LangGraphMessagesEvent<TMessage> = {
-    event: "messages" | "messages/partial" | "messages/complete" | "metadata" | "updates" | string;
+    event: EventType;
     data: TMessage[] | any;
 };
 export type LangGraphStreamCallback<TMessage> = (messages: TMessage[], config: LangGraphSendMessageConfig & {

package/dist/useLangGraphMessages.d.ts.map

@@ -1 +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"}
+{"version":3,"file":"useLangGraphMessages.d.ts","sourceRoot":"","sources":["../src/useLangGraphMessages.ts"],"names":[],"mappings":"AAGA,OAAO,EACL,SAAS,EAIV,MAAM,SAAS,CAAC;AAEjB,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,EAAE,SAAS,CAAC;IACjB,IAAI,EAAE,QAAQ,EAAE,GAAG,GAAG,CAAC;CACxB,CAAC;AAEF,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;AAuBF,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;;;;CAoErE,CAAC"}

package/dist/useLangGraphMessages.js

@@ -2,7 +2,15 @@
 import { useState, useCallback, useRef } from "react";
 import { v4 as uuidv4 } from "uuid";
 import { LangGraphMessageAccumulator } from "./LangGraphMessageAccumulator.js";
+import {
+  LangGraphKnownEventTypes
+} from "./types.js";
 var DEFAULT_APPEND_MESSAGE = (_, curr) => curr;
+var isLangChainMessageChunk = (value) => {
+  if (!value || typeof value !== "object") return false;
+  const chunk = value;
+  return "type" in chunk && chunk.type === "AIMessageChunk" && (chunk.content === void 0 || typeof chunk.content === "string" || Array.isArray(chunk.content)) && (chunk.tool_call_chunks === void 0 || Array.isArray(chunk.tool_call_chunks));
+};
 var useLangGraphMessages = ({
   stream,
   appendMessage = DEFAULT_APPEND_MESSAGE
@@ -12,23 +20,48 @@ var useLangGraphMessages = ({
   const abortControllerRef = useRef(null);
   const sendMessage = useCallback(
     async (newMessages, config) => {
-      newMessages = newMessages.map((m) => m.id ? m : { ...m, id: uuidv4() });
+      const newMessagesWithId = newMessages.map(
+        (m) => m.id ? m : { ...m, id: uuidv4() }
+      );
       const accumulator = new LangGraphMessageAccumulator({
         initialMessages: messages,
         appendMessage
       });
-      setMessages(accumulator.addMessages(newMessages));
+      setMessages(accumulator.addMessages(newMessagesWithId));
       const abortController = new AbortController();
       abortControllerRef.current = abortController;
-      const response = await stream(newMessages, {
+      const response = await stream(newMessagesWithId, {
         ...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]);
+        switch (chunk.event) {
+          case LangGraphKnownEventTypes.MessagesPartial:
+          case LangGraphKnownEventTypes.MessagesComplete:
+            setMessages(accumulator.addMessages(chunk.data));
+            break;
+          case LangGraphKnownEventTypes.Updates:
+            setInterrupt(chunk.data.__interrupt__?.[0]);
+            break;
+          case LangGraphKnownEventTypes.Messages: {
+            const [messageChunk] = chunk.data;
+            if (!isLangChainMessageChunk(messageChunk)) {
+              console.warn(
+                "Received invalid message chunk format:",
+                messageChunk
+              );
+              break;
+            }
+            const updatedMessages = accumulator.addMessages([
+              messageChunk
+            ]);
+            setMessages(updatedMessages);
+            break;
+          }
+          case LangGraphKnownEventTypes.Metadata:
+            break;
+          default:
+            console.warn(`The event type ${chunk.event} is not supported.`);
         }
       }
     },

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\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,IAAM,yBAAyB,CAC7B,GACA,SACG;AAEE,IAAM,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\";\nimport {\n  EventType,\n  LangChainMessageTupleEvent,\n  LangGraphKnownEventTypes,\n  LangChainMessageChunk,\n} from \"./types\";\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: EventType;\n  data: TMessage[] | any;\n};\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\nconst isLangChainMessageChunk = (\n  value: unknown,\n): value is LangChainMessageChunk => {\n  if (!value || typeof value !== \"object\") return false;\n  const chunk = value as any;\n  return (\n    \"type\" in chunk &&\n    chunk.type === \"AIMessageChunk\" &&\n    (chunk.content === undefined ||\n      typeof chunk.content === \"string\" ||\n      Array.isArray(chunk.content)) &&\n    (chunk.tool_call_chunks === undefined ||\n      Array.isArray(chunk.tool_call_chunks))\n  );\n};\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      const newMessagesWithId = newMessages.map((m) =>\n        m.id ? m : { ...m, id: uuidv4() },\n      );\n\n      const accumulator = new LangGraphMessageAccumulator({\n        initialMessages: messages,\n        appendMessage,\n      });\n      setMessages(accumulator.addMessages(newMessagesWithId));\n\n      const abortController = new AbortController();\n      abortControllerRef.current = abortController;\n      const response = await stream(newMessagesWithId, {\n        ...config,\n        abortSignal: abortController.signal,\n      });\n\n      for await (const chunk of response) {\n        switch (chunk.event) {\n          case LangGraphKnownEventTypes.MessagesPartial:\n          case LangGraphKnownEventTypes.MessagesComplete:\n            setMessages(accumulator.addMessages(chunk.data));\n            break;\n          case LangGraphKnownEventTypes.Updates:\n            setInterrupt(chunk.data.__interrupt__?.[0]);\n            break;\n          case LangGraphKnownEventTypes.Messages: {\n            const [messageChunk] = (chunk as LangChainMessageTupleEvent).data;\n            if (!isLangChainMessageChunk(messageChunk)) {\n              console.warn(\n                \"Received invalid message chunk format:\",\n                messageChunk,\n              );\n              break;\n            }\n            const updatedMessages = accumulator.addMessages([\n              messageChunk as unknown as TMessage,\n            ]);\n            setMessages(updatedMessages);\n            break;\n          }\n          case LangGraphKnownEventTypes.Metadata:\n            // currently this is a no-op\n            break;\n          default:\n            console.warn(`The event type ${chunk.event} is not supported.`);\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;AAC5C;AAAA,EAGE;AAAA,OAEK;AA8BP,IAAM,yBAAyB,CAC7B,GACA,SACG;AAEL,IAAM,0BAA0B,CAC9B,UACmC;AACnC,MAAI,CAAC,SAAS,OAAO,UAAU,SAAU,QAAO;AAChD,QAAM,QAAQ;AACd,SACE,UAAU,SACV,MAAM,SAAS,qBACd,MAAM,YAAY,UACjB,OAAO,MAAM,YAAY,YACzB,MAAM,QAAQ,MAAM,OAAO,OAC5B,MAAM,qBAAqB,UAC1B,MAAM,QAAQ,MAAM,gBAAgB;AAE1C;AAEO,IAAM,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,YAAM,oBAAoB,YAAY;AAAA,QAAI,CAAC,MACzC,EAAE,KAAK,IAAI,EAAE,GAAG,GAAG,IAAI,OAAO,EAAE;AAAA,MAClC;AAEA,YAAM,cAAc,IAAI,4BAA4B;AAAA,QAClD,iBAAiB;AAAA,QACjB;AAAA,MACF,CAAC;AACD,kBAAY,YAAY,YAAY,iBAAiB,CAAC;AAEtD,YAAM,kBAAkB,IAAI,gBAAgB;AAC5C,yBAAmB,UAAU;AAC7B,YAAM,WAAW,MAAM,OAAO,mBAAmB;AAAA,QAC/C,GAAG;AAAA,QACH,aAAa,gBAAgB;AAAA,MAC/B,CAAC;AAED,uBAAiB,SAAS,UAAU;AAClC,gBAAQ,MAAM,OAAO;AAAA,UACnB,KAAK,yBAAyB;AAAA,UAC9B,KAAK,yBAAyB;AAC5B,wBAAY,YAAY,YAAY,MAAM,IAAI,CAAC;AAC/C;AAAA,UACF,KAAK,yBAAyB;AAC5B,yBAAa,MAAM,KAAK,gBAAgB,CAAC,CAAC;AAC1C;AAAA,UACF,KAAK,yBAAyB,UAAU;AACtC,kBAAM,CAAC,YAAY,IAAK,MAAqC;AAC7D,gBAAI,CAAC,wBAAwB,YAAY,GAAG;AAC1C,sBAAQ;AAAA,gBACN;AAAA,gBACA;AAAA,cACF;AACA;AAAA,YACF;AACA,kBAAM,kBAAkB,YAAY,YAAY;AAAA,cAC9C;AAAA,YACF,CAAC;AACD,wBAAY,eAAe;AAC3B;AAAA,UACF;AAAA,UACA,KAAK,yBAAyB;AAE5B;AAAA,UACF;AACE,oBAAQ,KAAK,kBAAkB,MAAM,KAAK,oBAAoB;AAAA,QAClE;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.5",
+  "version": "0.5.6",
   "license": "MIT",
   "type": "module",
   "exports": {
@@ -23,7 +23,7 @@
     "zod": "^3.25.28"
   },
   "peerDependencies": {
-    "@assistant-ui/react": "^0.10.19",
+    "@assistant-ui/react": "^0.10.20",
     "@types/react": "*",
     "react": "^18 || ^19 || ^19.0.0-rc"
   },
@@ -33,14 +33,18 @@
     }
   },
   "devDependencies": {
-    "@types/node": "^22.15.21",
-    "@types/react": "^19.1.5",
+    "@testing-library/dom": "^10.4.0",
+    "@testing-library/react": "^16.3.0",
+    "@types/node": "^22.15.18",
+    "@types/react": "^19.1.4",
     "@types/uuid": "^10.0.0",
     "eslint": "^9",
     "eslint-config-next": "15.3.2",
+    "jsdom": "^26.1.0",
     "react": "^19.1.0",
     "tsx": "^4.19.4",
-    "@assistant-ui/react": "0.10.19",
+    "vitest": "^3.1.3",
+    "@assistant-ui/react": "0.10.20",
     "@assistant-ui/x-buildutils": "0.0.1"
   },
   "publishConfig": {
@@ -57,6 +61,8 @@
   },
   "scripts": {
     "build": "tsx scripts/build.mts",
-    "lint": "eslint ."
+    "lint": "eslint .",
+    "test": "vitest run",
+    "test:watch": "vitest"
   }
 }

package/src/LangGraphMessageAccumulator.ts

@@ -1,16 +1,5 @@
 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;

package/src/appendLangChainChunk.ts

@@ -1,4 +1,8 @@
-import { LangChainMessage, LangChainMessageChunk } from "./types";
+import {
+  LangChainMessage,
+  LangChainMessageChunk,
+  MessageContentText,
+} from "./types";
 import { parsePartialJsonObject } from "assistant-stream/utils";
 
 export const appendLangChainChunk = (
@@ -21,20 +25,36 @@ export const appendLangChainChunk = (
       ? [{ 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,
-      };
+  if (typeof curr?.content === "string") {
+    const lastIndex = newContent.length - 1;
+    if (newContent[lastIndex]?.type === "text") {
+      (newContent[lastIndex] as MessageContentText).text =
+        (newContent[lastIndex] as MessageContentText).text + curr.content;
+    } else {
+      newContent.push({ type: "text", text: curr.content });
+    }
+  } else if (Array.isArray(curr.content)) {
+    const lastIndex = newContent.length - 1;
+    for (const item of curr.content) {
+      if (!("type" in item)) {
+        continue;
+      }
+
+      if (item.type === "text") {
+        if (newContent[lastIndex]?.type === "text") {
+          (newContent[lastIndex] as MessageContentText).text =
+            (newContent[lastIndex] as MessageContentText).text + item.text;
+        } else {
+          newContent.push({ type: "text", text: item.text });
+        }
+      } else if (item.type === "image_url") {
+        newContent.push(item);
+      }
     }
   }
 
   const newToolCalls = [...(prev.tool_calls ?? [])];
-  for (const chunk of curr.tool_call_chunks) {
+  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] = {

package/src/types.ts

@@ -14,12 +14,12 @@ export type LangChainToolCall = {
   args: ReadonlyJSONObject;
 };
 
-type MessageContentText = {
+export type MessageContentText = {
   type: "text";
   text: string;
 };
 
-type MessageContentImageUrl = {
+export type MessageContentImageUrl = {
   type: "image_url";
   image_url: string | { url: string };
 };
@@ -28,9 +28,21 @@ type MessageContentToolUse = {
   type: "tool_use";
 };
 
+export enum LangGraphKnownEventTypes {
+  Messages = "messages",
+  MessagesPartial = "messages/partial",
+  MessagesComplete = "messages/complete",
+  Metadata = "metadata",
+  Updates = "updates",
+}
+type CustomEventType = string;
+
+export type EventType = LangGraphKnownEventTypes | CustomEventType;
+
 type UserMessageContentComplex = MessageContentText | MessageContentImageUrl;
 type AssistantMessageContentComplex =
   | MessageContentText
+  | MessageContentImageUrl
   | MessageContentToolUse;
 
 type UserMessageContent = string | UserMessageContentComplex[];
@@ -65,13 +77,22 @@ export type LangChainMessage =
     };
 
 export type LangChainMessageChunk = {
-  id: string;
+  id?: string | undefined;
   type: "AIMessageChunk";
-  content: (AssistantMessageContentComplex & { index: number })[];
-  tool_call_chunks: LangChainToolCallChunk[];
+  content?: AssistantMessageContent | undefined;
+  tool_call_chunks?: LangChainToolCallChunk[] | undefined;
 };
 
 export type LangChainEvent = {
-  event: "messages/partial" | "messages/complete";
+  event:
+    | LangGraphKnownEventTypes.MessagesPartial
+    | LangGraphKnownEventTypes.MessagesComplete;
   data: LangChainMessage[];
 };
+
+type LangGraphTupleMetadata = Record<string, unknown>;
+
+export type LangChainMessageTupleEvent = {
+  event: LangGraphKnownEventTypes.Messages;
+  data: [LangChainMessageChunk, LangGraphTupleMetadata];
+};

package/src/useLangGraphMessages.test.ts

@@ -0,0 +1,626 @@
+import { describe, it, expect } from "vitest";
+import { act, renderHook, waitFor } from "@testing-library/react";
+
+import {
+  LangGraphMessagesEvent,
+  useLangGraphMessages,
+} from "./useLangGraphMessages";
+import { appendLangChainChunk } from "./appendLangChainChunk";
+import {
+  LangChainMessage,
+  MessageContentImageUrl,
+  MessageContentText,
+} from "./types";
+
+const metadataEvent = {
+  event: "metadata",
+  data: {
+    thread_id: "123",
+    run_attempt: 1,
+  },
+};
+
+const mockStreamCallbackFactory = (
+  events: Array<LangGraphMessagesEvent<LangChainMessage>>,
+) =>
+  async function* () {
+    for (const event of events) {
+      yield event;
+    }
+  };
+
+describe("useLangGraphMessages", {}, () => {
+  it("processes chunks correctly", async () => {
+    const mockStreamCallback = mockStreamCallbackFactory([
+      metadataEvent,
+      {
+        event: "messages",
+        data: [
+          {
+            id: "run-1",
+            content: "",
+            additional_kwargs: {},
+            response_metadata: { model_name: "claude-3-7-sonnet-latest" },
+            type: "AIMessageChunk",
+            name: null,
+            tool_calls: [],
+            invalid_tool_calls: [],
+            tool_call_chunks: [],
+          },
+          {
+            run_attempt: 1,
+          },
+        ],
+      },
+    ]);
+
+    const { result } = renderHook(() =>
+      useLangGraphMessages({
+        stream: mockStreamCallback,
+        appendMessage: appendLangChainChunk,
+      }),
+    );
+
+    act(() => {
+      result.current.sendMessage(
+        [
+          {
+            type: "human",
+            content: "Hello, world!",
+          },
+        ],
+        {},
+      );
+    });
+
+    await waitFor(() => {
+      expect(result.current.messages.length).toEqual(2);
+      expect(result.current.messages[0].type).toEqual("human");
+      expect(result.current.messages[1].type).toEqual("ai");
+      expect(result.current.messages[1].content).toEqual("");
+    });
+  });
+
+  it("appends chunks w/ same id", async () => {
+    const mockStreamCallback = mockStreamCallbackFactory([
+      metadataEvent,
+      {
+        event: "messages",
+        data: [
+          {
+            id: "run-1",
+            content: "",
+            additional_kwargs: {},
+            response_metadata: { model_name: "claude-3-7-sonnet-latest" },
+            type: "AIMessageChunk",
+            name: null,
+            tool_calls: [],
+            invalid_tool_calls: [],
+            tool_call_chunks: [],
+          },
+          {
+            run_attempt: 1,
+          },
+        ],
+      },
+      {
+        event: "messages",
+        data: [
+          {
+            id: "run-1",
+            content: "Hello!",
+            additional_kwargs: {},
+            response_metadata: { model_name: "claude-3-7-sonnet-latest" },
+            type: "AIMessageChunk",
+            name: null,
+            tool_calls: [],
+            invalid_tool_calls: [],
+            tool_call_chunks: [],
+          },
+          {
+            run_attempt: 1,
+          },
+        ],
+      },
+      {
+        event: "messages",
+        data: [
+          {
+            id: "run-1",
+            content: " How may I assist you today?",
+            additional_kwargs: {},
+            response_metadata: { model_name: "claude-3-7-sonnet-latest" },
+            type: "AIMessageChunk",
+            name: null,
+            tool_calls: [],
+            invalid_tool_calls: [],
+            tool_call_chunks: [],
+          },
+          {
+            run_attempt: 1,
+          },
+        ],
+      },
+    ]);
+
+    const { result } = renderHook(() =>
+      useLangGraphMessages({
+        stream: mockStreamCallback,
+        appendMessage: appendLangChainChunk,
+      }),
+    );
+
+    act(() => {
+      result.current.sendMessage(
+        [
+          {
+            type: "human",
+            content: "Hello!",
+          },
+        ],
+        {},
+      );
+    });
+
+    await waitFor(() => {
+      expect(result.current.messages.length).toEqual(2);
+      expect(result.current.messages[0].type).toEqual("human");
+      expect(result.current.messages[1].type).toEqual("ai");
+      expect(
+        (result.current.messages[1].content[0] as MessageContentText).type,
+      ).toEqual("text");
+      expect(
+        (result.current.messages[1].content[0] as MessageContentText).text,
+      ).toEqual("Hello! How may I assist you today?");
+    });
+  });
+
+  it("separates chunks w/ different ids", async () => {
+    const mockStreamCallback = mockStreamCallbackFactory([
+      metadataEvent,
+      {
+        event: "messages",
+        data: [
+          {
+            id: "run-1",
+            content: "",
+            additional_kwargs: {},
+            response_metadata: { model_name: "claude-3-7-sonnet-latest" },
+            type: "AIMessageChunk",
+            name: null,
+            tool_calls: [],
+            invalid_tool_calls: [],
+            tool_call_chunks: [],
+          },
+          {
+            run_attempt: 1,
+          },
+        ],
+      },
+      {
+        event: "messages",
+        data: [
+          {
+            id: "run-1",
+            content: "Hello!",
+            additional_kwargs: {},
+            response_metadata: { model_name: "claude-3-7-sonnet-latest" },
+            type: "AIMessageChunk",
+            name: null,
+            tool_calls: [],
+            invalid_tool_calls: [],
+            tool_call_chunks: [],
+          },
+          {
+            run_attempt: 1,
+          },
+        ],
+      },
+      {
+        event: "messages",
+        data: [
+          {
+            id: "run-2",
+            content: " How may I assist you today?",
+            additional_kwargs: {},
+            response_metadata: { model_name: "claude-3-7-sonnet-latest" },
+            type: "AIMessageChunk",
+            name: null,
+            tool_calls: [],
+            invalid_tool_calls: [],
+            tool_call_chunks: [],
+          },
+          {
+            run_attempt: 1,
+          },
+        ],
+      },
+    ]);
+
+    const { result } = renderHook(() =>
+      useLangGraphMessages({
+        stream: mockStreamCallback,
+        appendMessage: appendLangChainChunk,
+      }),
+    );
+
+    act(() => {
+      result.current.sendMessage(
+        [
+          {
+            type: "human",
+            content: "Hello!",
+          },
+        ],
+        {},
+      );
+    });
+
+    await waitFor(() => {
+      expect(result.current.messages.length).toEqual(3);
+      expect(result.current.messages[0].type).toEqual("human");
+      expect(result.current.messages[1].type).toEqual("ai");
+      expect(result.current.messages[2].type).toEqual("ai");
+      expect(
+        (result.current.messages[1].content[0] as MessageContentText).type,
+      ).toEqual("text");
+      expect(
+        (result.current.messages[1].content[0] as MessageContentText).text,
+      ).toEqual("Hello!");
+      expect(result.current.messages[2].content as string).toEqual(
+        " How may I assist you today?",
+      );
+    });
+  });
+
+  it("handles a mix of text and image chunks - start with text", async () => {
+    const mockStreamCallback = mockStreamCallbackFactory([
+      metadataEvent,
+      {
+        event: "messages",
+        data: [
+          {
+            id: "run-1",
+            content: "",
+            additional_kwargs: {},
+            response_metadata: { model_name: "claude-3-7-sonnet-latest" },
+            type: "AIMessageChunk",
+            name: null,
+            tool_calls: [],
+            invalid_tool_calls: [],
+            tool_call_chunks: [],
+          },
+          {
+            run_attempt: 1,
+          },
+        ],
+      },
+      {
+        event: "messages",
+        data: [
+          {
+            id: "run-1",
+            content: "Hello!",
+            additional_kwargs: {},
+            response_metadata: { model_name: "claude-3-7-sonnet-latest" },
+            type: "AIMessageChunk",
+            name: null,
+            tool_calls: [],
+            invalid_tool_calls: [],
+            tool_call_chunks: [],
+          },
+          {
+            run_attempt: 1,
+          },
+        ],
+      },
+      {
+        event: "messages",
+        data: [
+          {
+            id: "run-1",
+            content: " How may I assist you today?",
+            additional_kwargs: {},
+            response_metadata: { model_name: "claude-3-7-sonnet-latest" },
+            type: "AIMessageChunk",
+            name: null,
+            tool_calls: [],
+            invalid_tool_calls: [],
+            tool_call_chunks: [],
+          },
+          {
+            run_attempt: 1,
+          },
+        ],
+      },
+      {
+        event: "messages",
+        data: [
+          {
+            id: "run-1",
+            content: [
+              {
+                type: "image_url",
+                image_url: { url: "https://example.com/image.png" },
+              },
+            ],
+            type: "AIMessageChunk",
+            name: null,
+            tool_calls: [],
+            invalid_tool_calls: [],
+            tool_call_chunks: [],
+          },
+          {
+            run_attempt: 1,
+          },
+        ],
+      },
+    ]);
+
+    const { result } = renderHook(() =>
+      useLangGraphMessages({
+        stream: mockStreamCallback,
+        appendMessage: appendLangChainChunk,
+      }),
+    );
+
+    act(() => {
+      result.current.sendMessage(
+        [
+          {
+            type: "human",
+            content: "Hello!",
+          },
+        ],
+        {},
+      );
+    });
+
+    await waitFor(() => {
+      expect(result.current.messages.length).toEqual(2);
+      expect(result.current.messages[0].type).toEqual("human");
+      expect(result.current.messages[1].type).toEqual("ai");
+      expect(
+        (result.current.messages[1].content[0] as MessageContentText).type,
+      ).toEqual("text");
+      expect(
+        (result.current.messages[1].content[0] as MessageContentText).text,
+      ).toEqual("Hello! How may I assist you today?");
+      expect(
+        (result.current.messages[1].content[1] as MessageContentImageUrl).type,
+      ).toEqual("image_url");
+      const imageChunkContent = result.current.messages[1]
+        .content[1] as MessageContentImageUrl;
+      expect(typeof imageChunkContent.image_url).toEqual("object");
+      expect(
+        (
+          (result.current.messages[1].content[1] as MessageContentImageUrl)
+            .image_url as { url: string }
+        ).url,
+      ).toEqual("https://example.com/image.png");
+    });
+  });
+
+  it("handles a mix of text and image chunks - start with image", async () => {
+    const mockStreamCallback = mockStreamCallbackFactory([
+      metadataEvent,
+      {
+        event: "messages",
+        data: [
+          {
+            id: "run-1",
+            content: [
+              {
+                type: "image_url",
+                image_url: { url: "https://example.com/image.png" },
+              },
+            ],
+            type: "AIMessageChunk",
+            name: null,
+            tool_calls: [],
+            invalid_tool_calls: [],
+            tool_call_chunks: [],
+          },
+          {
+            run_attempt: 1,
+          },
+        ],
+      },
+      {
+        event: "messages",
+        data: [
+          {
+            id: "run-1",
+            content: "",
+            additional_kwargs: {},
+            response_metadata: { model_name: "claude-3-7-sonnet-latest" },
+            type: "AIMessageChunk",
+            name: null,
+            tool_calls: [],
+            invalid_tool_calls: [],
+            tool_call_chunks: [],
+          },
+          {
+            run_attempt: 1,
+          },
+        ],
+      },
+      {
+        event: "messages",
+        data: [
+          {
+            id: "run-1",
+            content: "Hello!",
+            additional_kwargs: {},
+            response_metadata: { model_name: "claude-3-7-sonnet-latest" },
+            type: "AIMessageChunk",
+            name: null,
+            tool_calls: [],
+            invalid_tool_calls: [],
+            tool_call_chunks: [],
+          },
+          {
+            run_attempt: 1,
+          },
+        ],
+      },
+      {
+        event: "messages",
+        data: [
+          {
+            id: "run-1",
+            content: " How may I assist you today?",
+            additional_kwargs: {},
+            response_metadata: { model_name: "claude-3-7-sonnet-latest" },
+            type: "AIMessageChunk",
+            name: null,
+            tool_calls: [],
+            invalid_tool_calls: [],
+            tool_call_chunks: [],
+          },
+          {
+            run_attempt: 1,
+          },
+        ],
+      },
+    ]);
+
+    const { result } = renderHook(() =>
+      useLangGraphMessages({
+        stream: mockStreamCallback,
+        appendMessage: appendLangChainChunk,
+      }),
+    );
+
+    act(() => {
+      result.current.sendMessage(
+        [
+          {
+            type: "human",
+            content: "Hello!",
+          },
+        ],
+        {},
+      );
+    });
+
+    await waitFor(() => {
+      expect(result.current.messages.length).toEqual(2);
+      expect(result.current.messages[0].type).toEqual("human");
+      expect(result.current.messages[1].type).toEqual("ai");
+      expect(
+        (result.current.messages[1].content[0] as MessageContentImageUrl).type,
+      ).toEqual("image_url");
+      const imageChunkContent = result.current.messages[1]
+        .content[0] as MessageContentImageUrl;
+      expect(typeof imageChunkContent.image_url).toEqual("object");
+      expect(
+        (
+          (result.current.messages[1].content[0] as MessageContentImageUrl)
+            .image_url as { url: string }
+        ).url,
+      ).toEqual("https://example.com/image.png");
+      expect(
+        (result.current.messages[1].content[1] as MessageContentText).type,
+      ).toEqual("text");
+      expect(
+        (result.current.messages[1].content[1] as MessageContentText).text,
+      ).toEqual("Hello! How may I assist you today?");
+    });
+  });
+
+  it("processes a mix of chunks and messages", async () => {
+    const mockStreamCallback = mockStreamCallbackFactory([
+      metadataEvent,
+      {
+        event: "messages",
+        data: [
+          {
+            id: "run-1",
+            content: "",
+            additional_kwargs: {},
+            response_metadata: { model_name: "claude-3-7-sonnet-latest" },
+            type: "AIMessageChunk",
+            name: null,
+            tool_calls: [],
+            invalid_tool_calls: [],
+            tool_call_chunks: [],
+          },
+          {
+            run_attempt: 1,
+          },
+        ],
+      },
+      {
+        event: "messages",
+        data: [
+          {
+            id: "run-1",
+            content: "Hello!",
+            additional_kwargs: {},
+            response_metadata: { model_name: "claude-3-7-sonnet-latest" },
+            type: "AIMessageChunk",
+            name: null,
+            tool_calls: [],
+            invalid_tool_calls: [],
+            tool_call_chunks: [],
+          },
+          {
+            run_attempt: 1,
+          },
+        ],
+      },
+      {
+        event: "messages/complete",
+        data: [
+          {
+            id: "run-2",
+            content: [{ type: "text", text: "How may I assist you today?" }],
+            additional_kwargs: {},
+            response_metadata: { model_name: "claude-3-7-sonnet-latest" },
+            type: "ai",
+            name: null,
+            tool_calls: [],
+            invalid_tool_calls: [],
+            tool_call_chunks: [],
+          },
+        ],
+      },
+    ]);
+
+    const { result } = renderHook(() =>
+      useLangGraphMessages({
+        stream: mockStreamCallback,
+        appendMessage: appendLangChainChunk,
+      }),
+    );
+
+    act(() => {
+      result.current.sendMessage(
+        [
+          {
+            type: "human",
+            content: "Hello!",
+          },
+        ],
+        {},
+      );
+    });
+
+    await waitFor(() => {
+      expect(result.current.messages.length).toEqual(3);
+      expect(result.current.messages[0].type).toEqual("human");
+      expect(result.current.messages[1].type).toEqual("ai");
+      expect(result.current.messages[2].type).toEqual("ai");
+      expect(
+        (result.current.messages[1].content[0] as MessageContentText).type,
+      ).toEqual("text");
+      expect(
+        (result.current.messages[1].content[0] as MessageContentText).text,
+      ).toEqual("Hello!");
+      expect(
+        (result.current.messages[2].content[0] as MessageContentText).text,
+      ).toEqual("How may I assist you today?");
+    });
+  });
+});

package/src/useLangGraphMessages.ts

@@ -1,6 +1,12 @@
 import { useState, useCallback, useRef } from "react";
 import { v4 as uuidv4 } from "uuid";
 import { LangGraphMessageAccumulator } from "./LangGraphMessageAccumulator";
+import {
+  EventType,
+  LangChainMessageTupleEvent,
+  LangGraphKnownEventTypes,
+  LangChainMessageChunk,
+} from "./types";
 
 export type LangGraphCommand = {
   resume: string;
@@ -12,15 +18,10 @@ export type LangGraphSendMessageConfig = {
 };
 
 export type LangGraphMessagesEvent<TMessage> = {
-  event:
-    | "messages"
-    | "messages/partial"
-    | "messages/complete"
-    | "metadata"
-    | "updates"
-    | string;
+  event: EventType;
   data: TMessage[] | any;
 };
+
 export type LangGraphStreamCallback<TMessage> = (
   messages: TMessage[],
   config: LangGraphSendMessageConfig & { abortSignal: AbortSignal },
@@ -40,6 +41,22 @@ const DEFAULT_APPEND_MESSAGE = <TMessage>(
   curr: TMessage,
 ) => curr;
 
+const isLangChainMessageChunk = (
+  value: unknown,
+): value is LangChainMessageChunk => {
+  if (!value || typeof value !== "object") return false;
+  const chunk = value as any;
+  return (
+    "type" in chunk &&
+    chunk.type === "AIMessageChunk" &&
+    (chunk.content === undefined ||
+      typeof chunk.content === "string" ||
+      Array.isArray(chunk.content)) &&
+    (chunk.tool_call_chunks === undefined ||
+      Array.isArray(chunk.tool_call_chunks))
+  );
+};
+
 export const useLangGraphMessages = <TMessage extends { id?: string }>({
   stream,
   appendMessage = DEFAULT_APPEND_MESSAGE,
@@ -56,29 +73,52 @@ export const useLangGraphMessages = <TMessage extends { id?: string }>({
   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 newMessagesWithId = newMessages.map((m) =>
+        m.id ? m : { ...m, id: uuidv4() },
+      );
 
       const accumulator = new LangGraphMessageAccumulator({
         initialMessages: messages,
         appendMessage,
       });
-      setMessages(accumulator.addMessages(newMessages));
+      setMessages(accumulator.addMessages(newMessagesWithId));
 
       const abortController = new AbortController();
       abortControllerRef.current = abortController;
-      const response = await stream(newMessages, {
+      const response = await stream(newMessagesWithId, {
         ...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]);
+        switch (chunk.event) {
+          case LangGraphKnownEventTypes.MessagesPartial:
+          case LangGraphKnownEventTypes.MessagesComplete:
+            setMessages(accumulator.addMessages(chunk.data));
+            break;
+          case LangGraphKnownEventTypes.Updates:
+            setInterrupt(chunk.data.__interrupt__?.[0]);
+            break;
+          case LangGraphKnownEventTypes.Messages: {
+            const [messageChunk] = (chunk as LangChainMessageTupleEvent).data;
+            if (!isLangChainMessageChunk(messageChunk)) {
+              console.warn(
+                "Received invalid message chunk format:",
+                messageChunk,
+              );
+              break;
+            }
+            const updatedMessages = accumulator.addMessages([
+              messageChunk as unknown as TMessage,
+            ]);
+            setMessages(updatedMessages);
+            break;
+          }
+          case LangGraphKnownEventTypes.Metadata:
+            // currently this is a no-op
+            break;
+          default:
+            console.warn(`The event type ${chunk.event} is not supported.`);
         }
       }
     },