langgraph-ui-components 0.0.24 → 0.0.27

package/dist/providers/Thread.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"Thread.cjs.js","sources":["../../src/providers/Thread.tsx"],"sourcesContent":["import { type Thread } from \"@langchain/langgraph-sdk\";\nimport { createContext, useCallback, useContext, useEffect, useState, type Dispatch, type ReactNode, type SetStateAction } from \"react\";\nimport { validate } from \"uuid\";\nimport { useChatRuntime } from \"./ChatRuntime\";\nimport { createClient } from \"./client\";\nimport { logger } from \"@/utils/logger\";\n\n/**\n * Thread context manages the current conversation thread ID and configuration.\n * A thread represents a single conversation session with the AI.\n */\n\nexport type ThreadMode = \"single\" | \"multi\";\n\n/**\n * Typed configuration object passed to the LangGraph API on each stream call.\n * Use `Record<string, unknown>` instead of `any` so consumers are forced to\n * narrow values before using them, preventing silent runtime errors.\n */\nexport type ThreadConfiguration = Record<string, unknown>;\n\nexport interface ThreadContextType {\n  /** Current thread ID, null if no thread exists yet */\n  threadId: string | null;\n  /** Set or update the current thread ID */\n  setThreadId: (id: string | null) => void;\n  /** List of existing threads */\n  threads: Thread[];\n  /** Function to fetch existing threads from the API */\n  getThreads: () => Promise<Thread[]>;\n  /** Function to update the list of threads */\n  setThreads: Dispatch<SetStateAction<Thread[]>>;\n  /** Thread-specific configuration passed to the LangGraph API */\n  configuration: ThreadConfiguration | undefined;\n  /** Update thread configuration */\n  setConfiguration: (config: ThreadConfiguration) => void;\n  /** Whether threads are currently being loaded */\n  threadsLoading: boolean;\n  /** Set the loading state for threads */\n  setThreadsLoading: Dispatch<SetStateAction<boolean>>;\n\n  mode: ThreadMode;\n  setMode: Dispatch<SetStateAction<ThreadMode>>;\n  /** Delete a thread by ID */\n  deleteThread: (threadId: string) => Promise<void>;\n  /** Update thread metadata */\n  updateThread: (threadId: string, metadata: Record<string, unknown>) => Promise<void>;\n}\n\n\nconst ThreadContext = createContext<ThreadContextType | undefined>(undefined);\n\nfunction getThreadSearchMetadata(\n  assistantId: string,\n): { graph_id: string } | { assistant_id: string } {\n  if (validate(assistantId)) {\n    return { assistant_id: assistantId };\n  } else {\n    return { graph_id: assistantId };\n  }\n}\n\n/**\n * Provides thread management for chat conversations.\n * Stores the current thread ID and configuration.\n * \n * @example\n * ```tsx\n * <ThreadProvider>\n *   <YourChatComponent />\n * </ThreadProvider>\n * ```\n */\nexport function ThreadProvider({ children }: { children: ReactNode }) {\n\n  const { apiUrl, assistantId, identity } = useChatRuntime();\n  const [threads, setThreads] = useState<Thread[]>([]);\n  const [threadsLoading, setThreadsLoading] = useState(false);\n\n  const [threadId, setThreadId] = useState<string | null>(null);\n  const [configuration, setConfiguration] = useState<ThreadConfiguration | undefined>();\n\n  const [mode, setMode] = useState<ThreadMode>(\"single\");\n\n  // Extract thread ID from URL query parameter on component mount\n  useEffect(() => {\n    const searchParams = new URLSearchParams(window.location.search);\n    const threadFromUrl = searchParams.get(\"thread\");\n    if (threadFromUrl) {\n      setThreadId(threadFromUrl);\n    }\n  }, []);\n\n\n  const getThreads = useCallback(async (): Promise<Thread[]> => {\n    if (!apiUrl || !assistantId) return [];\n    if (!identity?.authToken) {\n      logger.error(\"No authToken available for getThreads\");\n      return [];\n    }\n    const client = createClient(apiUrl, identity?.authToken ?? undefined);\n\n    const threads = await client.threads.search({\n      metadata: {\n        ...getThreadSearchMetadata(assistantId),\n      },\n      limit: 100,\n    });\n\n    return Array.isArray(threads) ? threads : [];\n  }, [apiUrl, assistantId, identity]);\n\n  const deleteThread = useCallback(async (threadIdToDelete: string) => {\n    if (!apiUrl) return;\n    if (!identity?.authToken) {\n      logger.error(\"No authToken available for deleteThread\");\n      return;\n    }\n    const client = createClient(apiUrl, identity?.authToken ?? undefined);\n\n    await client.threads.delete(threadIdToDelete);\n\n    // Update local state\n    setThreads(prev => prev.filter(t => t.thread_id !== threadIdToDelete));\n\n    // Clear current thread if it was deleted\n    if (threadId === threadIdToDelete) {\n      setThreadId(null);\n    }\n  }, [apiUrl, threadId, identity]);\n\n  const updateThread = useCallback(async (threadIdToUpdate: string, metadata: Record<string, unknown>) => {\n    if (!apiUrl) return;\n    if (!identity?.authToken) {\n      logger.error(\"No authToken available for updateThread\");\n      return;\n    }\n    const client = createClient(apiUrl, identity?.authToken ?? undefined);\n\n    await client.threads.update(threadIdToUpdate, { metadata });\n\n    // Refresh threads to get updated data\n    const updatedThreads = await getThreads();\n    setThreads(updatedThreads);\n  }, [apiUrl, getThreads, identity]);\n\n  return (\n    <ThreadContext.Provider\n      value={{ mode, setMode, threadId, setThreadId, getThreads, threads, setThreads, configuration, setConfiguration, threadsLoading, setThreadsLoading, deleteThread, updateThread }}\n    >\n      {children}\n    </ThreadContext.Provider>\n  );\n}\n\n/**\n * Hook to access the current thread context.\n * Use this to get or set the thread ID and configuration.\n * \n * @throws {Error} If used outside of ThreadProvider\n * \n * @example\n * ```tsx\n * const { threadId, setThreadId, configuration, setConfiguration } = useThread();\n * ```\n */\nexport function useThread() {\n  const context = useContext(ThreadContext);\n  if (!context) {\n    throw new Error(\"useThread must be used within a ThreadProvider\");\n  }\n  return context;\n}"],"names":["ThreadContext","createContext","getThreadSearchMetadata","assistantId","validate","ThreadProvider","children","apiUrl","identity","useChatRuntime","threads","setThreads","useState","threadsLoading","setThreadsLoading","threadId","setThreadId","configuration","setConfiguration","mode","setMode","useEffect","threadFromUrl","getThreads","useCallback","logger","createClient","deleteThread","threadIdToDelete","prev","t","updateThread","threadIdToUpdate","metadata","updatedThreads","jsx","useThread","context","useContext"],"mappings":"2WAkDMA,EAAgBC,EAAAA,cAA6C,MAAS,EAE5E,SAASC,EACPC,EACiD,CACjD,OAAIC,EAASD,CAAW,EACf,CAAE,aAAcA,CAAA,EAEhB,CAAE,SAAUA,CAAA,CAEvB,CAaO,SAASE,EAAe,CAAE,SAAAC,GAAqC,CAEpE,KAAM,CAAE,OAAAC,EAAQ,YAAAJ,EAAa,SAAAK,CAAA,EAAaC,EAAAA,eAAA,EACpC,CAACC,EAASC,CAAU,EAAIC,EAAAA,SAAmB,CAAA,CAAE,EAC7C,CAACC,EAAgBC,CAAiB,EAAIF,EAAAA,SAAS,EAAK,EAEpD,CAACG,EAAUC,CAAW,EAAIJ,EAAAA,SAAwB,IAAI,EACtD,CAACK,EAAeC,CAAgB,EAAIN,WAAA,EAEpC,CAACO,EAAMC,CAAO,EAAIR,EAAAA,SAAqB,QAAQ,EAGrDS,EAAAA,UAAU,IAAM,CAEd,MAAMC,EADe,IAAI,gBAAgB,OAAO,SAAS,MAAM,EAC5B,IAAI,QAAQ,EAC3CA,GACFN,EAAYM,CAAa,CAE7B,EAAG,CAAA,CAAE,EAGL,MAAMC,EAAaC,EAAAA,YAAY,SAA+B,CAC5D,GAAI,CAACjB,GAAU,CAACJ,QAAoB,CAAA,EACpC,GAAI,CAACK,GAAU,UACbiB,OAAAA,EAAAA,OAAO,MAAM,uCAAuC,EAC7C,CAAA,EAIT,MAAMf,EAAU,MAFDgB,EAAAA,aAAanB,EAAQC,GAAU,WAAa,MAAS,EAEvC,QAAQ,OAAO,CAC1C,SAAU,CACR,GAAGN,EAAwBC,CAAW,CAAA,EAExC,MAAO,GAAA,CACR,EAED,OAAO,MAAM,QAAQO,CAAO,EAAIA,EAAU,CAAA,CAC5C,EAAG,CAACH,EAAQJ,EAAaK,CAAQ,CAAC,EAE5BmB,EAAeH,cAAY,MAAOI,GAA6B,CACnE,GAAI,CAACrB,EAAQ,OACb,GAAI,CAACC,GAAU,UAAW,CACxBiB,EAAAA,OAAO,MAAM,yCAAyC,EACtD,MACF,CAGA,MAFeC,EAAAA,aAAanB,EAAQC,GAAU,WAAa,MAAS,EAEvD,QAAQ,OAAOoB,CAAgB,EAG5CjB,KAAmBkB,EAAK,UAAYC,EAAE,YAAcF,CAAgB,CAAC,EAGjEb,IAAaa,GACfZ,EAAY,IAAI,CAEpB,EAAG,CAACT,EAAQQ,EAAUP,CAAQ,CAAC,EAEzBuB,EAAeP,EAAAA,YAAY,MAAOQ,EAA0BC,IAAsC,CACtG,GAAI,CAAC1B,EAAQ,OACb,GAAI,CAACC,GAAU,UAAW,CACxBiB,EAAAA,OAAO,MAAM,yCAAyC,EACtD,MACF,CAGA,MAFeC,EAAAA,aAAanB,EAAQC,GAAU,WAAa,MAAS,EAEvD,QAAQ,OAAOwB,EAAkB,CAAE,SAAAC,EAAU,EAG1D,MAAMC,EAAiB,MAAMX,EAAA,EAC7BZ,EAAWuB,CAAc,CAC3B,EAAG,CAAC3B,EAAQgB,EAAYf,CAAQ,CAAC,EAEjC,OACE2B,EAAAA,IAACnC,EAAc,SAAd,CACC,MAAO,CAAE,KAAAmB,EAAM,QAAAC,EAAS,SAAAL,EAAU,YAAAC,EAAa,WAAAO,EAAY,QAAAb,EAAS,WAAAC,EAAY,cAAAM,EAAe,iBAAAC,EAAkB,eAAAL,EAAgB,kBAAAC,EAAmB,aAAAa,EAAc,aAAAI,CAAA,EAEjK,SAAAzB,CAAA,CAAA,CAGP,CAaO,SAAS8B,GAAY,CAC1B,MAAMC,EAAUC,EAAAA,WAAWtC,CAAa,EACxC,GAAI,CAACqC,EACH,MAAM,IAAI,MAAM,gDAAgD,EAElE,OAAOA,CACT"}
+{"version":3,"file":"Thread.cjs.js","sources":["../../src/providers/Thread.tsx"],"sourcesContent":["import { type Thread } from \"@langchain/langgraph-sdk\";\nimport { createContext, useCallback, useContext, useEffect, useState, type Dispatch, type ReactNode, type SetStateAction } from \"react\";\nimport { validate } from \"uuid\";\nimport { useChatRuntime } from \"./ChatRuntime\";\nimport { createClient } from \"./client\";\nimport { logger } from \"@/utils/logger\";\n\n/**\n * Thread context manages the current conversation thread ID and configuration.\n * A thread represents a single conversation session with the AI.\n */\n\nexport type ThreadMode = \"single\" | \"multi\";\n\n/**\n * Typed configuration object passed to the LangGraph API on each stream call.\n * Use `Record<string, unknown>` instead of `any` so consumers are forced to\n * narrow values before using them, preventing silent runtime errors.\n */\nexport type ThreadConfiguration = Record<string, unknown>;\n\nexport interface ThreadContextType {\n  /** Current thread ID, null if no thread exists yet */\n  threadId: string | null;\n  /** Set or update the current thread ID */\n  setThreadId: (id: string | null) => void;\n  /** List of existing threads */\n  threads: Thread[];\n  /** Function to fetch existing threads from the API */\n  getThreads: () => Promise<Thread[]>;\n  /** Function to update the list of threads */\n  setThreads: Dispatch<SetStateAction<Thread[]>>;\n  /** Thread-specific configuration passed to the LangGraph API */\n  configuration: ThreadConfiguration | undefined;\n  /** Update thread configuration */\n  setConfiguration: (config: ThreadConfiguration) => void;\n  /** Whether threads are currently being loaded */\n  threadsLoading: boolean;\n  /** Set the loading state for threads */\n  setThreadsLoading: Dispatch<SetStateAction<boolean>>;\n\n  mode: ThreadMode;\n  setMode: Dispatch<SetStateAction<ThreadMode>>;\n  /** Delete a thread by ID */\n  deleteThread: (threadId: string) => Promise<void>;\n  /** Update thread metadata */\n  updateThread: (threadId: string, metadata: Record<string, unknown>) => Promise<void>;\n}\n\n\nconst ThreadContext = createContext<ThreadContextType | undefined>(undefined);\n\nfunction getThreadSearchMetadata(\n  assistantId: string,\n): { graph_id: string } | { assistant_id: string } {\n  if (validate(assistantId)) {\n    return { assistant_id: assistantId };\n  } else {\n    return { graph_id: assistantId };\n  }\n}\n\n/**\n * Provides thread management for chat conversations.\n * Stores the current thread ID and configuration.\n * \n * @example\n * ```tsx\n * <ThreadProvider>\n *   <YourChatComponent />\n * </ThreadProvider>\n * ```\n */\nexport function ThreadProvider({ children, initialMode = \"single\" }: { children: ReactNode; initialMode?: ThreadMode }) {\n\n  const { apiUrl, assistantId, identity } = useChatRuntime();\n  const [threads, setThreads] = useState<Thread[]>([]);\n  const [threadsLoading, setThreadsLoading] = useState(false);\n\n  const [threadId, setThreadId] = useState<string | null>(null);\n  const [configuration, setConfiguration] = useState<ThreadConfiguration | undefined>();\n\n  const [mode, setMode] = useState<ThreadMode>(initialMode);\n\n  // Extract thread ID from URL query parameter on component mount\n  useEffect(() => {\n    const searchParams = new URLSearchParams(window.location.search);\n    const threadFromUrl = searchParams.get(\"thread\");\n    if (threadFromUrl) {\n      setThreadId(threadFromUrl);\n    }\n  }, []);\n\n\n  const getThreads = useCallback(async (): Promise<Thread[]> => {\n    if (!apiUrl || !assistantId) return [];\n    if (!identity?.authToken) {\n      logger.error(\"No authToken available for getThreads\");\n      return [];\n    }\n    const client = createClient(apiUrl, identity?.authToken ?? undefined);\n\n    const threads = await client.threads.search({\n      metadata: {\n        ...getThreadSearchMetadata(assistantId),\n      },\n      limit: 100,\n    });\n\n    return Array.isArray(threads) ? threads : [];\n  }, [apiUrl, assistantId, identity]);\n\n  const deleteThread = useCallback(async (threadIdToDelete: string) => {\n    if (!apiUrl) return;\n    if (!identity?.authToken) {\n      logger.error(\"No authToken available for deleteThread\");\n      return;\n    }\n    const client = createClient(apiUrl, identity?.authToken ?? undefined);\n\n    await client.threads.delete(threadIdToDelete);\n\n    // Update local state\n    setThreads(prev => prev.filter(t => t.thread_id !== threadIdToDelete));\n\n    // Clear current thread if it was deleted\n    if (threadId === threadIdToDelete) {\n      setThreadId(null);\n    }\n  }, [apiUrl, threadId, identity]);\n\n  const updateThread = useCallback(async (threadIdToUpdate: string, metadata: Record<string, unknown>) => {\n    if (!apiUrl) return;\n    if (!identity?.authToken) {\n      logger.error(\"No authToken available for updateThread\");\n      return;\n    }\n    const client = createClient(apiUrl, identity?.authToken ?? undefined);\n\n    await client.threads.update(threadIdToUpdate, { metadata });\n\n    // Refresh threads to get updated data\n    const updatedThreads = await getThreads();\n    setThreads(updatedThreads);\n  }, [apiUrl, getThreads, identity]);\n\n  return (\n    <ThreadContext.Provider\n      value={{ mode, setMode, threadId, setThreadId, getThreads, threads, setThreads, configuration, setConfiguration, threadsLoading, setThreadsLoading, deleteThread, updateThread }}\n    >\n      {children}\n    </ThreadContext.Provider>\n  );\n}\n\n/**\n * Hook to access the current thread context.\n * Use this to get or set the thread ID and configuration.\n * \n * @throws {Error} If used outside of ThreadProvider\n * \n * @example\n * ```tsx\n * const { threadId, setThreadId, configuration, setConfiguration } = useThread();\n * ```\n */\nexport function useThread() {\n  const context = useContext(ThreadContext);\n  if (!context) {\n    throw new Error(\"useThread must be used within a ThreadProvider\");\n  }\n  return context;\n}"],"names":["ThreadContext","createContext","getThreadSearchMetadata","assistantId","validate","ThreadProvider","children","initialMode","apiUrl","identity","useChatRuntime","threads","setThreads","useState","threadsLoading","setThreadsLoading","threadId","setThreadId","configuration","setConfiguration","mode","setMode","useEffect","threadFromUrl","getThreads","useCallback","logger","createClient","deleteThread","threadIdToDelete","prev","t","updateThread","threadIdToUpdate","metadata","updatedThreads","jsx","useThread","context","useContext"],"mappings":"2WAkDMA,EAAgBC,EAAAA,cAA6C,MAAS,EAE5E,SAASC,EACPC,EACiD,CACjD,OAAIC,EAASD,CAAW,EACf,CAAE,aAAcA,CAAA,EAEhB,CAAE,SAAUA,CAAA,CAEvB,CAaO,SAASE,EAAe,CAAE,SAAAC,EAAU,YAAAC,EAAc,UAA+D,CAEtH,KAAM,CAAE,OAAAC,EAAQ,YAAAL,EAAa,SAAAM,CAAA,EAAaC,EAAAA,eAAA,EACpC,CAACC,EAASC,CAAU,EAAIC,EAAAA,SAAmB,CAAA,CAAE,EAC7C,CAACC,EAAgBC,CAAiB,EAAIF,EAAAA,SAAS,EAAK,EAEpD,CAACG,EAAUC,CAAW,EAAIJ,EAAAA,SAAwB,IAAI,EACtD,CAACK,EAAeC,CAAgB,EAAIN,WAAA,EAEpC,CAACO,EAAMC,CAAO,EAAIR,EAAAA,SAAqBN,CAAW,EAGxDe,EAAAA,UAAU,IAAM,CAEd,MAAMC,EADe,IAAI,gBAAgB,OAAO,SAAS,MAAM,EAC5B,IAAI,QAAQ,EAC3CA,GACFN,EAAYM,CAAa,CAE7B,EAAG,CAAA,CAAE,EAGL,MAAMC,EAAaC,EAAAA,YAAY,SAA+B,CAC5D,GAAI,CAACjB,GAAU,CAACL,QAAoB,CAAA,EACpC,GAAI,CAACM,GAAU,UACbiB,OAAAA,EAAAA,OAAO,MAAM,uCAAuC,EAC7C,CAAA,EAIT,MAAMf,EAAU,MAFDgB,EAAAA,aAAanB,EAAQC,GAAU,WAAa,MAAS,EAEvC,QAAQ,OAAO,CAC1C,SAAU,CACR,GAAGP,EAAwBC,CAAW,CAAA,EAExC,MAAO,GAAA,CACR,EAED,OAAO,MAAM,QAAQQ,CAAO,EAAIA,EAAU,CAAA,CAC5C,EAAG,CAACH,EAAQL,EAAaM,CAAQ,CAAC,EAE5BmB,EAAeH,cAAY,MAAOI,GAA6B,CACnE,GAAI,CAACrB,EAAQ,OACb,GAAI,CAACC,GAAU,UAAW,CACxBiB,EAAAA,OAAO,MAAM,yCAAyC,EACtD,MACF,CAGA,MAFeC,EAAAA,aAAanB,EAAQC,GAAU,WAAa,MAAS,EAEvD,QAAQ,OAAOoB,CAAgB,EAG5CjB,KAAmBkB,EAAK,UAAYC,EAAE,YAAcF,CAAgB,CAAC,EAGjEb,IAAaa,GACfZ,EAAY,IAAI,CAEpB,EAAG,CAACT,EAAQQ,EAAUP,CAAQ,CAAC,EAEzBuB,EAAeP,EAAAA,YAAY,MAAOQ,EAA0BC,IAAsC,CACtG,GAAI,CAAC1B,EAAQ,OACb,GAAI,CAACC,GAAU,UAAW,CACxBiB,EAAAA,OAAO,MAAM,yCAAyC,EACtD,MACF,CAGA,MAFeC,EAAAA,aAAanB,EAAQC,GAAU,WAAa,MAAS,EAEvD,QAAQ,OAAOwB,EAAkB,CAAE,SAAAC,EAAU,EAG1D,MAAMC,EAAiB,MAAMX,EAAA,EAC7BZ,EAAWuB,CAAc,CAC3B,EAAG,CAAC3B,EAAQgB,EAAYf,CAAQ,CAAC,EAEjC,OACE2B,EAAAA,IAACpC,EAAc,SAAd,CACC,MAAO,CAAE,KAAAoB,EAAM,QAAAC,EAAS,SAAAL,EAAU,YAAAC,EAAa,WAAAO,EAAY,QAAAb,EAAS,WAAAC,EAAY,cAAAM,EAAe,iBAAAC,EAAkB,eAAAL,EAAgB,kBAAAC,EAAmB,aAAAa,EAAc,aAAAI,CAAA,EAEjK,SAAA1B,CAAA,CAAA,CAGP,CAaO,SAAS+B,GAAY,CAC1B,MAAMC,EAAUC,EAAAA,WAAWvC,CAAa,EACxC,GAAI,CAACsC,EACH,MAAM,IAAI,MAAM,gDAAgD,EAElE,OAAOA,CACT"}

package/dist/providers/Thread.d.ts

@@ -48,8 +48,9 @@ export interface ThreadContextType {
  * </ThreadProvider>
  * ```
  */
-export declare function ThreadProvider({ children }: {
+export declare function ThreadProvider({ children, initialMode }: {
     children: ReactNode;
+    initialMode?: ThreadMode;
 }): import("react/jsx-runtime").JSX.Element;
 /**
  * Hook to access the current thread context.

package/dist/providers/Thread.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Thread.d.ts","sourceRoot":"","sources":["../../src/providers/Thread.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,MAAM,EAAE,MAAM,0BAA0B,CAAC;AACvD,OAAO,EAA+D,KAAK,QAAQ,EAAE,KAAK,SAAS,EAAE,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AAMxI;;;GAGG;AAEH,MAAM,MAAM,UAAU,GAAG,QAAQ,GAAG,OAAO,CAAC;AAE5C;;;;GAIG;AACH,MAAM,MAAM,mBAAmB,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;AAE1D,MAAM,WAAW,iBAAiB;IAChC,sDAAsD;IACtD,QAAQ,EAAE,MAAM,GAAG,IAAI,CAAC;IACxB,0CAA0C;IAC1C,WAAW,EAAE,CAAC,EAAE,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IACzC,+BAA+B;IAC/B,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,sDAAsD;IACtD,UAAU,EAAE,MAAM,OAAO,CAAC,MAAM,EAAE,CAAC,CAAC;IACpC,6CAA6C;IAC7C,UAAU,EAAE,QAAQ,CAAC,cAAc,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC;IAC/C,gEAAgE;IAChE,aAAa,EAAE,mBAAmB,GAAG,SAAS,CAAC;IAC/C,kCAAkC;IAClC,gBAAgB,EAAE,CAAC,MAAM,EAAE,mBAAmB,KAAK,IAAI,CAAC;IACxD,iDAAiD;IACjD,cAAc,EAAE,OAAO,CAAC;IACxB,wCAAwC;IACxC,iBAAiB,EAAE,QAAQ,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC;IAErD,IAAI,EAAE,UAAU,CAAC;IACjB,OAAO,EAAE,QAAQ,CAAC,cAAc,CAAC,UAAU,CAAC,CAAC,CAAC;IAC9C,4BAA4B;IAC5B,YAAY,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAClD,6BAA6B;IAC7B,YAAY,EAAE,CAAC,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;CACtF;AAeD;;;;;;;;;;GAUG;AACH,wBAAgB,cAAc,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,2CAgFnE;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,SAAS,sBAMxB"}
+{"version":3,"file":"Thread.d.ts","sourceRoot":"","sources":["../../src/providers/Thread.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,MAAM,EAAE,MAAM,0BAA0B,CAAC;AACvD,OAAO,EAA+D,KAAK,QAAQ,EAAE,KAAK,SAAS,EAAE,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AAMxI;;;GAGG;AAEH,MAAM,MAAM,UAAU,GAAG,QAAQ,GAAG,OAAO,CAAC;AAE5C;;;;GAIG;AACH,MAAM,MAAM,mBAAmB,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;AAE1D,MAAM,WAAW,iBAAiB;IAChC,sDAAsD;IACtD,QAAQ,EAAE,MAAM,GAAG,IAAI,CAAC;IACxB,0CAA0C;IAC1C,WAAW,EAAE,CAAC,EAAE,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IACzC,+BAA+B;IAC/B,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,sDAAsD;IACtD,UAAU,EAAE,MAAM,OAAO,CAAC,MAAM,EAAE,CAAC,CAAC;IACpC,6CAA6C;IAC7C,UAAU,EAAE,QAAQ,CAAC,cAAc,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC;IAC/C,gEAAgE;IAChE,aAAa,EAAE,mBAAmB,GAAG,SAAS,CAAC;IAC/C,kCAAkC;IAClC,gBAAgB,EAAE,CAAC,MAAM,EAAE,mBAAmB,KAAK,IAAI,CAAC;IACxD,iDAAiD;IACjD,cAAc,EAAE,OAAO,CAAC;IACxB,wCAAwC;IACxC,iBAAiB,EAAE,QAAQ,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC;IAErD,IAAI,EAAE,UAAU,CAAC;IACjB,OAAO,EAAE,QAAQ,CAAC,cAAc,CAAC,UAAU,CAAC,CAAC,CAAC;IAC9C,4BAA4B;IAC5B,YAAY,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAClD,6BAA6B;IAC7B,YAAY,EAAE,CAAC,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;CACtF;AAeD;;;;;;;;;;GAUG;AACH,wBAAgB,cAAc,CAAC,EAAE,QAAQ,EAAE,WAAsB,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAC;IAAC,WAAW,CAAC,EAAE,UAAU,CAAA;CAAE,2CAgFrH;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,SAAS,sBAMxB"}

package/dist/providers/Thread.es.js

@@ -1,17 +1,17 @@
-import { jsx as L } from "react/jsx-runtime";
+import { jsx as N } from "react/jsx-runtime";
 import "@langchain/langgraph-sdk";
-import { useContext as N, createContext as S, useState as n, useEffect as U, useCallback as l } from "react";
-import { useChatRuntime as _ } from "./ChatRuntime.es.js";
+import { useContext as S, createContext as U, useState as n, useEffect as _, useCallback as l } from "react";
+import { useChatRuntime as A } from "./ChatRuntime.es.js";
 import { createClient as f } from "./client.es.js";
 import { logger as T } from "../utils/logger.es.js";
-import A from "../node_modules/.pnpm/uuid@13.0.0/node_modules/uuid/dist/validate.es.js";
-const p = S(void 0);
-function E(r) {
-  return A(r) ? { assistant_id: r } : { graph_id: r };
+import E from "../node_modules/.pnpm/uuid@13.0.0/node_modules/uuid/dist/validate.es.js";
+const p = U(void 0);
+function M(r) {
+  return E(r) ? { assistant_id: r } : { graph_id: r };
 }
-function G({ children: r }) {
-  const { apiUrl: e, assistantId: i, identity: t } = _(), [g, s] = n([]), [v, k] = n(!1), [d, c] = n(null), [w, C] = n(), [x, y] = n("single");
-  U(() => {
+function H({ children: r, initialMode: g = "single" }) {
+  const { apiUrl: e, assistantId: i, identity: t } = A(), [v, s] = n([]), [k, w] = n(!1), [d, c] = n(null), [C, x] = n(), [y, P] = n(g);
+  _(() => {
     const a = new URLSearchParams(window.location.search).get("thread");
     a && c(a);
   }, []);
@@ -21,19 +21,19 @@ function G({ children: r }) {
       return T.error("No authToken available for getThreads"), [];
     const a = await f(e, t?.authToken ?? void 0).threads.search({
       metadata: {
-        ...E(i)
+        ...M(i)
       },
       limit: 100
     });
     return Array.isArray(a) ? a : [];
-  }, [e, i, t]), P = l(async (o) => {
+  }, [e, i, t]), b = l(async (o) => {
     if (!e) return;
     if (!t?.authToken) {
       T.error("No authToken available for deleteThread");
       return;
     }
     await f(e, t?.authToken ?? void 0).threads.delete(o), s((m) => m.filter((u) => u.thread_id !== o)), d === o && c(null);
-  }, [e, d, t]), b = l(async (o, a) => {
+  }, [e, d, t]), L = l(async (o, a) => {
     if (!e) return;
     if (!t?.authToken) {
       T.error("No authToken available for updateThread");
@@ -43,22 +43,22 @@ function G({ children: r }) {
     const u = await h();
     s(u);
   }, [e, h, t]);
-  return /* @__PURE__ */ L(
+  return /* @__PURE__ */ N(
     p.Provider,
     {
-      value: { mode: x, setMode: y, threadId: d, setThreadId: c, getThreads: h, threads: g, setThreads: s, configuration: w, setConfiguration: C, threadsLoading: v, setThreadsLoading: k, deleteThread: P, updateThread: b },
+      value: { mode: y, setMode: P, threadId: d, setThreadId: c, getThreads: h, threads: v, setThreads: s, configuration: C, setConfiguration: x, threadsLoading: k, setThreadsLoading: w, deleteThread: b, updateThread: L },
       children: r
     }
   );
 }
-function H() {
-  const r = N(p);
+function J() {
+  const r = S(p);
   if (!r)
     throw new Error("useThread must be used within a ThreadProvider");
   return r;
 }
 export {
-  G as ThreadProvider,
-  H as useThread
+  H as ThreadProvider,
+  J as useThread
 };
 //# sourceMappingURL=Thread.es.js.map

package/dist/providers/Thread.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"Thread.es.js","sources":["../../src/providers/Thread.tsx"],"sourcesContent":["import { type Thread } from \"@langchain/langgraph-sdk\";\nimport { createContext, useCallback, useContext, useEffect, useState, type Dispatch, type ReactNode, type SetStateAction } from \"react\";\nimport { validate } from \"uuid\";\nimport { useChatRuntime } from \"./ChatRuntime\";\nimport { createClient } from \"./client\";\nimport { logger } from \"@/utils/logger\";\n\n/**\n * Thread context manages the current conversation thread ID and configuration.\n * A thread represents a single conversation session with the AI.\n */\n\nexport type ThreadMode = \"single\" | \"multi\";\n\n/**\n * Typed configuration object passed to the LangGraph API on each stream call.\n * Use `Record<string, unknown>` instead of `any` so consumers are forced to\n * narrow values before using them, preventing silent runtime errors.\n */\nexport type ThreadConfiguration = Record<string, unknown>;\n\nexport interface ThreadContextType {\n  /** Current thread ID, null if no thread exists yet */\n  threadId: string | null;\n  /** Set or update the current thread ID */\n  setThreadId: (id: string | null) => void;\n  /** List of existing threads */\n  threads: Thread[];\n  /** Function to fetch existing threads from the API */\n  getThreads: () => Promise<Thread[]>;\n  /** Function to update the list of threads */\n  setThreads: Dispatch<SetStateAction<Thread[]>>;\n  /** Thread-specific configuration passed to the LangGraph API */\n  configuration: ThreadConfiguration | undefined;\n  /** Update thread configuration */\n  setConfiguration: (config: ThreadConfiguration) => void;\n  /** Whether threads are currently being loaded */\n  threadsLoading: boolean;\n  /** Set the loading state for threads */\n  setThreadsLoading: Dispatch<SetStateAction<boolean>>;\n\n  mode: ThreadMode;\n  setMode: Dispatch<SetStateAction<ThreadMode>>;\n  /** Delete a thread by ID */\n  deleteThread: (threadId: string) => Promise<void>;\n  /** Update thread metadata */\n  updateThread: (threadId: string, metadata: Record<string, unknown>) => Promise<void>;\n}\n\n\nconst ThreadContext = createContext<ThreadContextType | undefined>(undefined);\n\nfunction getThreadSearchMetadata(\n  assistantId: string,\n): { graph_id: string } | { assistant_id: string } {\n  if (validate(assistantId)) {\n    return { assistant_id: assistantId };\n  } else {\n    return { graph_id: assistantId };\n  }\n}\n\n/**\n * Provides thread management for chat conversations.\n * Stores the current thread ID and configuration.\n * \n * @example\n * ```tsx\n * <ThreadProvider>\n *   <YourChatComponent />\n * </ThreadProvider>\n * ```\n */\nexport function ThreadProvider({ children }: { children: ReactNode }) {\n\n  const { apiUrl, assistantId, identity } = useChatRuntime();\n  const [threads, setThreads] = useState<Thread[]>([]);\n  const [threadsLoading, setThreadsLoading] = useState(false);\n\n  const [threadId, setThreadId] = useState<string | null>(null);\n  const [configuration, setConfiguration] = useState<ThreadConfiguration | undefined>();\n\n  const [mode, setMode] = useState<ThreadMode>(\"single\");\n\n  // Extract thread ID from URL query parameter on component mount\n  useEffect(() => {\n    const searchParams = new URLSearchParams(window.location.search);\n    const threadFromUrl = searchParams.get(\"thread\");\n    if (threadFromUrl) {\n      setThreadId(threadFromUrl);\n    }\n  }, []);\n\n\n  const getThreads = useCallback(async (): Promise<Thread[]> => {\n    if (!apiUrl || !assistantId) return [];\n    if (!identity?.authToken) {\n      logger.error(\"No authToken available for getThreads\");\n      return [];\n    }\n    const client = createClient(apiUrl, identity?.authToken ?? undefined);\n\n    const threads = await client.threads.search({\n      metadata: {\n        ...getThreadSearchMetadata(assistantId),\n      },\n      limit: 100,\n    });\n\n    return Array.isArray(threads) ? threads : [];\n  }, [apiUrl, assistantId, identity]);\n\n  const deleteThread = useCallback(async (threadIdToDelete: string) => {\n    if (!apiUrl) return;\n    if (!identity?.authToken) {\n      logger.error(\"No authToken available for deleteThread\");\n      return;\n    }\n    const client = createClient(apiUrl, identity?.authToken ?? undefined);\n\n    await client.threads.delete(threadIdToDelete);\n\n    // Update local state\n    setThreads(prev => prev.filter(t => t.thread_id !== threadIdToDelete));\n\n    // Clear current thread if it was deleted\n    if (threadId === threadIdToDelete) {\n      setThreadId(null);\n    }\n  }, [apiUrl, threadId, identity]);\n\n  const updateThread = useCallback(async (threadIdToUpdate: string, metadata: Record<string, unknown>) => {\n    if (!apiUrl) return;\n    if (!identity?.authToken) {\n      logger.error(\"No authToken available for updateThread\");\n      return;\n    }\n    const client = createClient(apiUrl, identity?.authToken ?? undefined);\n\n    await client.threads.update(threadIdToUpdate, { metadata });\n\n    // Refresh threads to get updated data\n    const updatedThreads = await getThreads();\n    setThreads(updatedThreads);\n  }, [apiUrl, getThreads, identity]);\n\n  return (\n    <ThreadContext.Provider\n      value={{ mode, setMode, threadId, setThreadId, getThreads, threads, setThreads, configuration, setConfiguration, threadsLoading, setThreadsLoading, deleteThread, updateThread }}\n    >\n      {children}\n    </ThreadContext.Provider>\n  );\n}\n\n/**\n * Hook to access the current thread context.\n * Use this to get or set the thread ID and configuration.\n * \n * @throws {Error} If used outside of ThreadProvider\n * \n * @example\n * ```tsx\n * const { threadId, setThreadId, configuration, setConfiguration } = useThread();\n * ```\n */\nexport function useThread() {\n  const context = useContext(ThreadContext);\n  if (!context) {\n    throw new Error(\"useThread must be used within a ThreadProvider\");\n  }\n  return context;\n}"],"names":["ThreadContext","createContext","getThreadSearchMetadata","assistantId","validate","ThreadProvider","children","apiUrl","identity","useChatRuntime","threads","setThreads","useState","threadsLoading","setThreadsLoading","threadId","setThreadId","configuration","setConfiguration","mode","setMode","useEffect","threadFromUrl","getThreads","useCallback","logger","createClient","deleteThread","threadIdToDelete","prev","t","updateThread","threadIdToUpdate","metadata","updatedThreads","jsx","useThread","context","useContext"],"mappings":";;;;;;;AAkDA,MAAMA,IAAgBC,EAA6C,MAAS;AAE5E,SAASC,EACPC,GACiD;AACjD,SAAIC,EAASD,CAAW,IACf,EAAE,cAAcA,EAAA,IAEhB,EAAE,UAAUA,EAAA;AAEvB;AAaO,SAASE,EAAe,EAAE,UAAAC,KAAqC;AAEpE,QAAM,EAAE,QAAAC,GAAQ,aAAAJ,GAAa,UAAAK,EAAA,IAAaC,EAAA,GACpC,CAACC,GAASC,CAAU,IAAIC,EAAmB,CAAA,CAAE,GAC7C,CAACC,GAAgBC,CAAiB,IAAIF,EAAS,EAAK,GAEpD,CAACG,GAAUC,CAAW,IAAIJ,EAAwB,IAAI,GACtD,CAACK,GAAeC,CAAgB,IAAIN,EAAA,GAEpC,CAACO,GAAMC,CAAO,IAAIR,EAAqB,QAAQ;AAGrD,EAAAS,EAAU,MAAM;AAEd,UAAMC,IADe,IAAI,gBAAgB,OAAO,SAAS,MAAM,EAC5B,IAAI,QAAQ;AAC/C,IAAIA,KACFN,EAAYM,CAAa;AAAA,EAE7B,GAAG,CAAA,CAAE;AAGL,QAAMC,IAAaC,EAAY,YAA+B;AAC5D,QAAI,CAACjB,KAAU,CAACJ,UAAoB,CAAA;AACpC,QAAI,CAACK,GAAU;AACb,aAAAiB,EAAO,MAAM,uCAAuC,GAC7C,CAAA;AAIT,UAAMf,IAAU,MAFDgB,EAAanB,GAAQC,GAAU,aAAa,MAAS,EAEvC,QAAQ,OAAO;AAAA,MAC1C,UAAU;AAAA,QACR,GAAGN,EAAwBC,CAAW;AAAA,MAAA;AAAA,MAExC,OAAO;AAAA,IAAA,CACR;AAED,WAAO,MAAM,QAAQO,CAAO,IAAIA,IAAU,CAAA;AAAA,EAC5C,GAAG,CAACH,GAAQJ,GAAaK,CAAQ,CAAC,GAE5BmB,IAAeH,EAAY,OAAOI,MAA6B;AACnE,QAAI,CAACrB,EAAQ;AACb,QAAI,CAACC,GAAU,WAAW;AACxB,MAAAiB,EAAO,MAAM,yCAAyC;AACtD;AAAA,IACF;AAGA,UAFeC,EAAanB,GAAQC,GAAU,aAAa,MAAS,EAEvD,QAAQ,OAAOoB,CAAgB,GAG5CjB,EAAW,OAAQkB,EAAK,OAAO,OAAKC,EAAE,cAAcF,CAAgB,CAAC,GAGjEb,MAAaa,KACfZ,EAAY,IAAI;AAAA,EAEpB,GAAG,CAACT,GAAQQ,GAAUP,CAAQ,CAAC,GAEzBuB,IAAeP,EAAY,OAAOQ,GAA0BC,MAAsC;AACtG,QAAI,CAAC1B,EAAQ;AACb,QAAI,CAACC,GAAU,WAAW;AACxB,MAAAiB,EAAO,MAAM,yCAAyC;AACtD;AAAA,IACF;AAGA,UAFeC,EAAanB,GAAQC,GAAU,aAAa,MAAS,EAEvD,QAAQ,OAAOwB,GAAkB,EAAE,UAAAC,GAAU;AAG1D,UAAMC,IAAiB,MAAMX,EAAA;AAC7B,IAAAZ,EAAWuB,CAAc;AAAA,EAC3B,GAAG,CAAC3B,GAAQgB,GAAYf,CAAQ,CAAC;AAEjC,SACE,gBAAA2B;AAAA,IAACnC,EAAc;AAAA,IAAd;AAAA,MACC,OAAO,EAAE,MAAAmB,GAAM,SAAAC,GAAS,UAAAL,GAAU,aAAAC,GAAa,YAAAO,GAAY,SAAAb,GAAS,YAAAC,GAAY,eAAAM,GAAe,kBAAAC,GAAkB,gBAAAL,GAAgB,mBAAAC,GAAmB,cAAAa,GAAc,cAAAI,EAAA;AAAA,MAEjK,UAAAzB;AAAA,IAAA;AAAA,EAAA;AAGP;AAaO,SAAS8B,IAAY;AAC1B,QAAMC,IAAUC,EAAWtC,CAAa;AACxC,MAAI,CAACqC;AACH,UAAM,IAAI,MAAM,gDAAgD;AAElE,SAAOA;AACT;"}
+{"version":3,"file":"Thread.es.js","sources":["../../src/providers/Thread.tsx"],"sourcesContent":["import { type Thread } from \"@langchain/langgraph-sdk\";\nimport { createContext, useCallback, useContext, useEffect, useState, type Dispatch, type ReactNode, type SetStateAction } from \"react\";\nimport { validate } from \"uuid\";\nimport { useChatRuntime } from \"./ChatRuntime\";\nimport { createClient } from \"./client\";\nimport { logger } from \"@/utils/logger\";\n\n/**\n * Thread context manages the current conversation thread ID and configuration.\n * A thread represents a single conversation session with the AI.\n */\n\nexport type ThreadMode = \"single\" | \"multi\";\n\n/**\n * Typed configuration object passed to the LangGraph API on each stream call.\n * Use `Record<string, unknown>` instead of `any` so consumers are forced to\n * narrow values before using them, preventing silent runtime errors.\n */\nexport type ThreadConfiguration = Record<string, unknown>;\n\nexport interface ThreadContextType {\n  /** Current thread ID, null if no thread exists yet */\n  threadId: string | null;\n  /** Set or update the current thread ID */\n  setThreadId: (id: string | null) => void;\n  /** List of existing threads */\n  threads: Thread[];\n  /** Function to fetch existing threads from the API */\n  getThreads: () => Promise<Thread[]>;\n  /** Function to update the list of threads */\n  setThreads: Dispatch<SetStateAction<Thread[]>>;\n  /** Thread-specific configuration passed to the LangGraph API */\n  configuration: ThreadConfiguration | undefined;\n  /** Update thread configuration */\n  setConfiguration: (config: ThreadConfiguration) => void;\n  /** Whether threads are currently being loaded */\n  threadsLoading: boolean;\n  /** Set the loading state for threads */\n  setThreadsLoading: Dispatch<SetStateAction<boolean>>;\n\n  mode: ThreadMode;\n  setMode: Dispatch<SetStateAction<ThreadMode>>;\n  /** Delete a thread by ID */\n  deleteThread: (threadId: string) => Promise<void>;\n  /** Update thread metadata */\n  updateThread: (threadId: string, metadata: Record<string, unknown>) => Promise<void>;\n}\n\n\nconst ThreadContext = createContext<ThreadContextType | undefined>(undefined);\n\nfunction getThreadSearchMetadata(\n  assistantId: string,\n): { graph_id: string } | { assistant_id: string } {\n  if (validate(assistantId)) {\n    return { assistant_id: assistantId };\n  } else {\n    return { graph_id: assistantId };\n  }\n}\n\n/**\n * Provides thread management for chat conversations.\n * Stores the current thread ID and configuration.\n * \n * @example\n * ```tsx\n * <ThreadProvider>\n *   <YourChatComponent />\n * </ThreadProvider>\n * ```\n */\nexport function ThreadProvider({ children, initialMode = \"single\" }: { children: ReactNode; initialMode?: ThreadMode }) {\n\n  const { apiUrl, assistantId, identity } = useChatRuntime();\n  const [threads, setThreads] = useState<Thread[]>([]);\n  const [threadsLoading, setThreadsLoading] = useState(false);\n\n  const [threadId, setThreadId] = useState<string | null>(null);\n  const [configuration, setConfiguration] = useState<ThreadConfiguration | undefined>();\n\n  const [mode, setMode] = useState<ThreadMode>(initialMode);\n\n  // Extract thread ID from URL query parameter on component mount\n  useEffect(() => {\n    const searchParams = new URLSearchParams(window.location.search);\n    const threadFromUrl = searchParams.get(\"thread\");\n    if (threadFromUrl) {\n      setThreadId(threadFromUrl);\n    }\n  }, []);\n\n\n  const getThreads = useCallback(async (): Promise<Thread[]> => {\n    if (!apiUrl || !assistantId) return [];\n    if (!identity?.authToken) {\n      logger.error(\"No authToken available for getThreads\");\n      return [];\n    }\n    const client = createClient(apiUrl, identity?.authToken ?? undefined);\n\n    const threads = await client.threads.search({\n      metadata: {\n        ...getThreadSearchMetadata(assistantId),\n      },\n      limit: 100,\n    });\n\n    return Array.isArray(threads) ? threads : [];\n  }, [apiUrl, assistantId, identity]);\n\n  const deleteThread = useCallback(async (threadIdToDelete: string) => {\n    if (!apiUrl) return;\n    if (!identity?.authToken) {\n      logger.error(\"No authToken available for deleteThread\");\n      return;\n    }\n    const client = createClient(apiUrl, identity?.authToken ?? undefined);\n\n    await client.threads.delete(threadIdToDelete);\n\n    // Update local state\n    setThreads(prev => prev.filter(t => t.thread_id !== threadIdToDelete));\n\n    // Clear current thread if it was deleted\n    if (threadId === threadIdToDelete) {\n      setThreadId(null);\n    }\n  }, [apiUrl, threadId, identity]);\n\n  const updateThread = useCallback(async (threadIdToUpdate: string, metadata: Record<string, unknown>) => {\n    if (!apiUrl) return;\n    if (!identity?.authToken) {\n      logger.error(\"No authToken available for updateThread\");\n      return;\n    }\n    const client = createClient(apiUrl, identity?.authToken ?? undefined);\n\n    await client.threads.update(threadIdToUpdate, { metadata });\n\n    // Refresh threads to get updated data\n    const updatedThreads = await getThreads();\n    setThreads(updatedThreads);\n  }, [apiUrl, getThreads, identity]);\n\n  return (\n    <ThreadContext.Provider\n      value={{ mode, setMode, threadId, setThreadId, getThreads, threads, setThreads, configuration, setConfiguration, threadsLoading, setThreadsLoading, deleteThread, updateThread }}\n    >\n      {children}\n    </ThreadContext.Provider>\n  );\n}\n\n/**\n * Hook to access the current thread context.\n * Use this to get or set the thread ID and configuration.\n * \n * @throws {Error} If used outside of ThreadProvider\n * \n * @example\n * ```tsx\n * const { threadId, setThreadId, configuration, setConfiguration } = useThread();\n * ```\n */\nexport function useThread() {\n  const context = useContext(ThreadContext);\n  if (!context) {\n    throw new Error(\"useThread must be used within a ThreadProvider\");\n  }\n  return context;\n}"],"names":["ThreadContext","createContext","getThreadSearchMetadata","assistantId","validate","ThreadProvider","children","initialMode","apiUrl","identity","useChatRuntime","threads","setThreads","useState","threadsLoading","setThreadsLoading","threadId","setThreadId","configuration","setConfiguration","mode","setMode","useEffect","threadFromUrl","getThreads","useCallback","logger","createClient","deleteThread","threadIdToDelete","prev","t","updateThread","threadIdToUpdate","metadata","updatedThreads","jsx","useThread","context","useContext"],"mappings":";;;;;;;AAkDA,MAAMA,IAAgBC,EAA6C,MAAS;AAE5E,SAASC,EACPC,GACiD;AACjD,SAAIC,EAASD,CAAW,IACf,EAAE,cAAcA,EAAA,IAEhB,EAAE,UAAUA,EAAA;AAEvB;AAaO,SAASE,EAAe,EAAE,UAAAC,GAAU,aAAAC,IAAc,YAA+D;AAEtH,QAAM,EAAE,QAAAC,GAAQ,aAAAL,GAAa,UAAAM,EAAA,IAAaC,EAAA,GACpC,CAACC,GAASC,CAAU,IAAIC,EAAmB,CAAA,CAAE,GAC7C,CAACC,GAAgBC,CAAiB,IAAIF,EAAS,EAAK,GAEpD,CAACG,GAAUC,CAAW,IAAIJ,EAAwB,IAAI,GACtD,CAACK,GAAeC,CAAgB,IAAIN,EAAA,GAEpC,CAACO,GAAMC,CAAO,IAAIR,EAAqBN,CAAW;AAGxD,EAAAe,EAAU,MAAM;AAEd,UAAMC,IADe,IAAI,gBAAgB,OAAO,SAAS,MAAM,EAC5B,IAAI,QAAQ;AAC/C,IAAIA,KACFN,EAAYM,CAAa;AAAA,EAE7B,GAAG,CAAA,CAAE;AAGL,QAAMC,IAAaC,EAAY,YAA+B;AAC5D,QAAI,CAACjB,KAAU,CAACL,UAAoB,CAAA;AACpC,QAAI,CAACM,GAAU;AACb,aAAAiB,EAAO,MAAM,uCAAuC,GAC7C,CAAA;AAIT,UAAMf,IAAU,MAFDgB,EAAanB,GAAQC,GAAU,aAAa,MAAS,EAEvC,QAAQ,OAAO;AAAA,MAC1C,UAAU;AAAA,QACR,GAAGP,EAAwBC,CAAW;AAAA,MAAA;AAAA,MAExC,OAAO;AAAA,IAAA,CACR;AAED,WAAO,MAAM,QAAQQ,CAAO,IAAIA,IAAU,CAAA;AAAA,EAC5C,GAAG,CAACH,GAAQL,GAAaM,CAAQ,CAAC,GAE5BmB,IAAeH,EAAY,OAAOI,MAA6B;AACnE,QAAI,CAACrB,EAAQ;AACb,QAAI,CAACC,GAAU,WAAW;AACxB,MAAAiB,EAAO,MAAM,yCAAyC;AACtD;AAAA,IACF;AAGA,UAFeC,EAAanB,GAAQC,GAAU,aAAa,MAAS,EAEvD,QAAQ,OAAOoB,CAAgB,GAG5CjB,EAAW,OAAQkB,EAAK,OAAO,OAAKC,EAAE,cAAcF,CAAgB,CAAC,GAGjEb,MAAaa,KACfZ,EAAY,IAAI;AAAA,EAEpB,GAAG,CAACT,GAAQQ,GAAUP,CAAQ,CAAC,GAEzBuB,IAAeP,EAAY,OAAOQ,GAA0BC,MAAsC;AACtG,QAAI,CAAC1B,EAAQ;AACb,QAAI,CAACC,GAAU,WAAW;AACxB,MAAAiB,EAAO,MAAM,yCAAyC;AACtD;AAAA,IACF;AAGA,UAFeC,EAAanB,GAAQC,GAAU,aAAa,MAAS,EAEvD,QAAQ,OAAOwB,GAAkB,EAAE,UAAAC,GAAU;AAG1D,UAAMC,IAAiB,MAAMX,EAAA;AAC7B,IAAAZ,EAAWuB,CAAc;AAAA,EAC3B,GAAG,CAAC3B,GAAQgB,GAAYf,CAAQ,CAAC;AAEjC,SACE,gBAAA2B;AAAA,IAACpC,EAAc;AAAA,IAAd;AAAA,MACC,OAAO,EAAE,MAAAoB,GAAM,SAAAC,GAAS,UAAAL,GAAU,aAAAC,GAAa,YAAAO,GAAY,SAAAb,GAAS,YAAAC,GAAY,eAAAM,GAAe,kBAAAC,GAAkB,gBAAAL,GAAgB,mBAAAC,GAAmB,cAAAa,GAAc,cAAAI,EAAA;AAAA,MAEjK,UAAA1B;AAAA,IAAA;AAAA,EAAA;AAGP;AAaO,SAAS+B,IAAY;AAC1B,QAAMC,IAAUC,EAAWvC,CAAa;AACxC,MAAI,CAACsC;AACH,UAAM,IAAI,MAAM,gDAAgD;AAElE,SAAOA;AACT;"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "langgraph-ui-components",
   "private": false,
-  "version": "0.0.24",
+  "version": "0.0.27",
   "type": "module",
   "main": "./dist/index.cjs.js",
   "module": "./dist/index.es.js",
@@ -79,9 +79,9 @@
     "uuid": "^13.0.0"
   },
   "peerDependencies": {
-    "@langchain/core": "^1.1.8",
-    "@langchain/langgraph": "^1.0.7",
-    "@langchain/langgraph-sdk": "^1.3.1",
+    "@langchain/core": "^1.1.33",
+    "@langchain/langgraph": "^1.2.3",
+    "@langchain/langgraph-sdk": "^1.7.4",
     "framer-motion": "^12.23.26",
     "lucide-react": "^0.562.0",
     "openai": "^6.15.0",
@@ -93,9 +93,9 @@
   },
   "devDependencies": {
     "@eslint/js": "^9.39.1",
-    "@langchain/core": "^1.1.12",
-    "@langchain/langgraph": "^1.0.15",
-    "@langchain/langgraph-sdk": "^1.5.3",
+    "@langchain/core": "^1.1.33",
+    "@langchain/langgraph": "^1.2.3",
+    "@langchain/langgraph-sdk": "^1.7.4",
     "@tailwindcss/postcss": "^4.2.0",
     "@types/node": "^24.10.1",
     "@types/react": "^19.2.5",

package/src/components/ChatBody.tsx

@@ -1,5 +1,6 @@
 import { parsePartialJson } from "@langchain/core/output_parsers";
 import { useStreamContext } from "@/providers/Stream";
+import { useCustomComponents } from "@/providers/CustomComponentProvider";
 import type { chatBodyProps } from "@/types/ChatProps";
 import { logger } from "@/utils/logger";
 import { isAiWithToolCalls, isToolMessage } from "@/utils/utils";
@@ -10,10 +11,10 @@ import CustomComponentRender from "./messages/CustomComponentRender";
 import HumanMessage from "./messages/HumanMessage";
 import type { MessageFeedback } from "./messages/MessageActions";
 import Thinking from "./Thinking";
-import ToolCallFunctions from "./ToolCallFunctions";
 
-export default function ChatBody({ setIsFirstMessage, enableToolCallIndicator, chatBodyProps }: { setIsFirstMessage?: React.Dispatch<React.SetStateAction<boolean>>, enableToolCallIndicator?: boolean, chatBodyProps?: chatBodyProps }) {
+export default function ChatBody({ setIsFirstMessage, enableToolCallIndicator = true, chatBodyProps }: { setIsFirstMessage?: React.Dispatch<React.SetStateAction<boolean>>, enableToolCallIndicator?: boolean, chatBodyProps?: chatBodyProps }) {
   const stream = useStreamContext();
+  const { interruptComponents } = useCustomComponents();
   const messages = stream.messages;
   const isLoading = stream.isLoading;
 
@@ -59,6 +60,48 @@ export default function ChatBody({ setIsFirstMessage, enableToolCallIndicator, c
     stream.setBranch(branch);
   }, [stream]);
 
+  // Handler for HITL interrupt responses
+  const handleInterruptRespond = useCallback((response: any) => {
+    stream.submit(null, { command: { resume: response } });
+  }, [stream]);
+
+  // Build interrupt actions for custom renderers
+  const interruptActions = useMemo(() => {
+    const interrupt = stream.interrupt;
+    if (!interrupt) return null;
+    const payload = interrupt.value as any;
+    const actionRequests = payload?.actionRequests ?? [];
+    return {
+      approve: () => {
+        handleInterruptRespond({
+          decisions: actionRequests.map(() => ({ type: "approve" as const })),
+        });
+      },
+      reject: (reason?: string) => {
+        handleInterruptRespond({
+          decisions: actionRequests.map(() => ({
+            type: "reject" as const,
+            message: reason || undefined,
+          })),
+        });
+      },
+      edit: (editedArgs: Record<string, unknown>) => {
+        const action = actionRequests[0];
+        handleInterruptRespond({
+          decisions: [
+            {
+              type: "edit" as const,
+              editedAction: {
+                name: action?.name ?? "",
+                args: { ...action?.args, ...editedArgs },
+              },
+            },
+          ],
+        });
+      },
+    };
+  }, [stream.interrupt, handleInterruptRespond]);
+
   const getToolCallsFromContent = useCallback((content: Message["content"]): AIMessage["tool_calls"] => {
     if (!Array.isArray(content)) return [];
     const toolCallContents = content.filter(
@@ -111,8 +154,8 @@ export default function ChatBody({ setIsFirstMessage, enableToolCallIndicator, c
 
   // Memoize message rendering logic to prevent unnecessary re-renders
   const renderMessage = useCallback((msg: typeof messages[0], index: number, messagesArray: typeof messages) => {
-    // Skip empty content messages UNLESS they have tool calls (which means tool messages will follow)
-    if (!msg.content.length && !isAiWithToolCalls(msg)) return null;
+    const isCurrentlyStreamingMessage = isLoading && index === messagesArray.length - 1 && msg.type === "ai";
+    if (!msg.content.length && !isAiWithToolCalls(msg) && !isCurrentlyStreamingMessage) return null;
 
     if (msg.additional_kwargs?.hidden) {
       return null;
@@ -144,20 +187,17 @@ export default function ChatBody({ setIsFirstMessage, enableToolCallIndicator, c
       }
     }
 
-    // Collect all consecutive AI messages and tool messages
-    const groupedMessages = [msg];
-    const toolMessages = [];
+    const groupedTimelineMessages: Message[] = [msg];
     let nextIndex = index + 1;
 
     while (nextIndex < messagesArray.length) {
       const nextMsg = messagesArray[nextIndex];
 
       if (isToolMessage(nextMsg)) {
-        toolMessages.push(nextMsg);
+        groupedTimelineMessages.push(nextMsg);
         nextIndex++;
       } else if (nextMsg.type === "ai") {
-        // Combine consecutive AI messages
-        groupedMessages.push(nextMsg);
+        groupedTimelineMessages.push(nextMsg);
         nextIndex++;
       } else {
         // Stop at human messages or other types
@@ -165,67 +205,98 @@ export default function ChatBody({ setIsFirstMessage, enableToolCallIndicator, c
       }
     }
 
-    // Combine content from all AI messages
-    const combinedContent = groupedMessages
-      .map(m => {
-        if (typeof m.content === "string") return m.content;
-        if (Array.isArray(m.content)) {
-          return m.content
-            .map((c: any) => c.type === "text" ? c.text : "")
-            .filter(Boolean)
-            .join(" ");
-        }
-        return "";
-      })
-      .filter(Boolean)
-      .join("\n\n");
-
-    const toolCallsFromContent = groupedMessages
+    const groupedAiMessages = groupedTimelineMessages.filter((m) => m.type === "ai");
+    const toolMessages = groupedTimelineMessages.filter((m) => isToolMessage(m));
+
+    // Merge content from all AI messages, preserving r/reasoning blocks
+    const hasArrayContent = groupedAiMessages.some((m) => Array.isArray(m.content));
+    const mergedContent: Message["content"] = hasArrayContent
+      ? groupedAiMessages.flatMap((m) => {
+          if (Array.isArray(m.content)) return m.content as any[];
+          if (typeof m.content === "string" && m.content.length > 0)
+            return [{ type: "text", text: m.content }];
+          return [];
+        })
+      : groupedAiMessages
+          .map((m) => (typeof m.content === "string" ? m.content : ""))
+          .filter(Boolean)
+          .join("\n\n");
+
+    // Extract plain-text portion for legacy checks (tool-call extraction, etc.)
+    const combinedContent = hasArrayContent
+      ? (mergedContent as any[])
+          .map((c: any) => (c.type === "text" ? (c.text as string) : ""))
+          .filter(Boolean)
+          .join(" ")
+      : (mergedContent as string);
+
+    const toolCallsFromContent = groupedAiMessages
       .flatMap((m) => {
         const calls = getToolCallsFromContent(m.content);
         return calls || [];
       })
       .filter((tc): tc is NonNullable<typeof tc> => tc != null && tc !== undefined);
 
-    // Create a combined message object
+    // Create a combined message object preserving full content (including thinking blocks)
     const combinedMessage = {
       ...msg,
-      content: combinedContent,
+      content: mergedContent,
     };
 
     // Get branch metadata from thread
     const meta = msg ? stream.getMessagesMetadata(msg) : undefined;
-    const displayContent = combinedContent;
+
+    // Determine if there is any displayable content (text OR thinking/reasoning blocks)
+    const hasThinkingContent = hasArrayContent
+      ? (mergedContent as any[]).some(
+          (b: any) =>
+            (b.type === "thinking" && (b.thinking as string)?.length > 0) ||
+            (b.type === "reasoning" && (b.reasoning as string)?.length > 0),
+        )
+      : false;
+    const hasKwargsReasoning =
+      groupedAiMessages.some((m) => {
+        const ak = (m as Record<string, unknown>).additional_kwargs as Record<string, unknown> | undefined;
+        return typeof ak?.reasoning_content === "string" && (ak.reasoning_content as string).length > 0;
+      });
+    const hasKwargsToolStatus = groupedAiMessages.some((m) => {
+      const ak = (m as Record<string, unknown>).additional_kwargs as Record<string, unknown> | undefined;
+      return Array.isArray(ak?.tool_status) && (ak.tool_status as unknown[]).length > 0;
+    });
+
+    const hasToolCalls =
+      groupedAiMessages.some((m) => isAiWithToolCalls(m)) ||
+      toolCallsFromContent.length > 0 ||
+      toolMessages.length > 0 ||
+      hasKwargsToolStatus;
+
+    const hasAnyDisplayableContent =
+      !!combinedContent ||
+      hasThinkingContent ||
+      hasKwargsReasoning ||
+      (enableToolCallIndicator && hasToolCalls);
 
     const isLastMessageGroup = nextIndex >= messagesArray.length;
     const isStreamingThisMessage = isLoading && isLastMessageGroup;
 
-    // Check if the first message in the group has tool calls
-    const hasToolCalls = isAiWithToolCalls(msg) || toolCallsFromContent.length > 0;
-
-    // Show thinking if streaming and no content yet (only tool calls exist)
-    const showThinkingIndicator = isStreamingThisMessage && !displayContent && hasToolCalls;
+    // Show Thinking animation whenever streaming with no displayable content yet (plain chat or tool-call)
+    const showThinkingIndicator = isStreamingThisMessage && !hasAnyDisplayableContent;
 
     return (
       <React.Fragment key={msgKey}>
-        {/* 1. Thinking indicator - show when streaming with no content OR when tool messages exist */}
-        {showThinkingIndicator && enableToolCallIndicator && (
+        {/* 1. Thinking indicator - show when streaming with no content yet (no icon shown) */}
+        {showThinkingIndicator && (
           <Thinking />
         )}
-        {enableToolCallIndicator && hasToolCalls && (
-          <ToolCallFunctions
-            title="Agent Thinking"
-            toolMessages={toolMessages}
-            toolCalls={toolCallsFromContent}
-          />
-        )}
-        {/* 2. Agent message (combined content) */}
-        {displayContent && (
+        {/* 2. Agent message — pass full mergedContent and grouped timeline for in-order rendering */}
+        {hasAnyDisplayableContent && (
           <AgentMessage
             agentName={chatBodyProps?.agentName}
             fontSize={chatBodyProps?.fontSize}
             // agentAvatarUrl={chatBodyProps?.agentAvatarUrl}
-            message={{ ...combinedMessage, content: displayContent }}
+            message={combinedMessage}
+            groupedMessages={groupedTimelineMessages}
+            showToolActivity={enableToolCallIndicator}
             isStreaming={isStreamingThisMessage}
             onRegenerate={handleRegenerate}
             feedback={msg.id ? messageFeedback[msg.id] : undefined}
@@ -236,7 +307,7 @@ export default function ChatBody({ setIsFirstMessage, enableToolCallIndicator, c
           />
         )}
         {/* 3. Custom component (from all messages in the group) */}
-        {groupedMessages.map((m) => (
+        {groupedAiMessages.map((m) => (
           <CustomComponentRender key={m.id} message={m} thread={stream} />
         ))}
       </React.Fragment>
@@ -337,6 +408,14 @@ export default function ChatBody({ setIsFirstMessage, enableToolCallIndicator, c
       ) : (
         <>
           {renderedMessages}
+          {/* Show HITL interrupt card when agent is paused for approval */}
+          {!isLoading && stream.interrupt && interruptActions && (() => {
+            const payload = stream.interrupt.value as any;
+            const toolName = payload?.actionRequests?.[0]?.name;
+            const InterruptComponent = toolName ? interruptComponents[toolName] : undefined;
+            if (!InterruptComponent) return null;
+            return <InterruptComponent interrupt={payload} actions={interruptActions} />;
+          })()}
           {/* Show thinking indicator when loading and no AI response has started yet */}
           {isLoading && memoMessages.length > 0 && (() => {
             const lastMsg = memoMessages[memoMessages.length - 1];

package/src/components/Thinking.tsx

@@ -87,7 +87,6 @@ export default function Thinking() {
                 }
             `}</style>
             <div className="loader-wrapper">
-                <div className="loader"></div>
                 <div className="letter-wrapper">
                     <span className="loader-letter">T</span>
                     <span className="loader-letter">h</span>