@langchain/langgraph-api 0.0.18 → 0.0.20

package/dist/api/assistants.mjs

@@ -76,9 +76,10 @@ api.get("/assistants/:assistant_id/graph", zValidator("query", z.object({ xray:
     const assistantId = getAssistantId(c.req.param("assistant_id"));
     const assistant = await Assistants.get(assistantId);
     const { xray } = c.req.valid("query");
-    const graph = getGraph(assistant.graph_id);
+    const config = getRunnableConfig(assistant.config);
+    const graph = await getGraph(assistant.graph_id, config);
     const drawable = await graph.getGraphAsync({
-        ...getRunnableConfig(assistant.config),
+        ...config,
         xray: xray ?? undefined,
     });
     return c.json(drawable.toJSON());
@@ -106,7 +107,8 @@ api.get("/assistants/:assistant_id/subgraphs/:namespace?", zValidator("param", z
     const { recurse } = c.req.valid("query");
     const assistantId = getAssistantId(assistant_id);
     const assistant = await Assistants.get(assistantId);
-    const graph = getGraph(assistant.graph_id);
+    const config = getRunnableConfig(assistant.config);
+    const graph = await getGraph(assistant.graph_id, config);
     const graphSchema = await getGraphSchema(assistant.graph_id);
     const rootGraphId = Object.keys(graphSchema).find((i) => !i.includes("|"));
     if (!rootGraphId) {

package/dist/cli/spawn.d.mts

@@ -6,6 +6,9 @@ export declare function spawnServer(args: {
     config: {
         graphs: Record<string, string>;
         ui?: Record<string, string>;
+        ui_config?: {
+            shared?: string[];
+        };
     };
     env: NodeJS.ProcessEnv;
     hostUrl: string;

package/dist/cli/spawn.mjs

@@ -31,6 +31,7 @@ For production use, please use LangGraph Cloud.
             host: args.host,
             graphs: context.config.graphs,
             ui: context.config.ui,
+            ui_config: context.config.ui_config,
             cwd: options.projectCwd,
         }),
     ], {

package/dist/graph/load.mjs

@@ -41,11 +41,12 @@ export async function registerFromEnv(specs, options) {
         return resolved;
     }));
 }
-export function getGraph(graphId, options) {
+export async function getGraph(graphId, config, options) {
     if (!GRAPHS[graphId])
         throw new HTTPException(404, { message: `Graph "${graphId}" not found` });
-    // TODO: have a check for the type of graph
-    const compiled = GRAPHS[graphId];
+    const compiled = typeof GRAPHS[graphId] === "function"
+        ? await GRAPHS[graphId](config ?? { configurable: {} })
+        : GRAPHS[graphId];
     if (typeof options?.checkpointer !== "undefined") {
         compiled.checkpointer = options?.checkpointer ?? undefined;
     }

package/dist/graph/load.utils.mjs

@@ -23,10 +23,17 @@ export async function resolveGraph(spec, options) {
     const resolved = await (async () => {
         if (!graph)
             throw new Error("Failed to load graph: graph is nullush");
-        const graphLike = typeof graph === "function" ? await graph() : await graph;
-        if (isGraph(graphLike))
-            return graphLike.compile();
-        return graphLike;
+        const afterResolve = (graphLike) => {
+            const graph = isGraph(graphLike) ? graphLike.compile() : graphLike;
+            return graph;
+        };
+        if (typeof graph === "function") {
+            return async (config) => {
+                const graphLike = await graph(config);
+                return afterResolve(graphLike);
+            };
+        }
+        return afterResolve(await graph);
     })();
     return { sourceFile, exportSymbol, resolved };
 }

package/dist/server.mjs

@@ -50,6 +50,7 @@ export const StartServerSchema = z.object({
     cwd: z.string(),
     graphs: z.record(z.string()),
     ui: z.record(z.string()).optional(),
+    ui_config: z.object({ shared: z.array(z.string()).optional() }).optional(),
 });
 export async function startServer(options) {
     logger.info(`Initializing storage...`);
@@ -69,7 +70,10 @@ export async function startServer(options) {
         const { api, registerGraphUi } = await import("./ui/load.mjs");
         app.route("/", api);
         logger.info(`Registering UI from ${options.cwd}`);
-        await registerGraphUi(options.ui, { cwd: options.cwd });
+        await registerGraphUi(options.ui, {
+            cwd: options.cwd,
+            config: options.ui_config,
+        });
     }
     logger.info(`Starting ${options.nWorkers} workers`);
     for (let i = 0; i < options.nWorkers; i++)

package/dist/storage/ops.mjs

@@ -447,7 +447,10 @@ export class Threads {
                     tasks: [],
                 };
             }
-            const graph = await getGraph(graphId, { checkpointer, store });
+            const graph = await getGraph(graphId, thread.config, {
+                checkpointer,
+                store,
+            });
             const result = await graph.getState(config, { subgraphs });
             if (result.metadata != null &&
                 "checkpoint_ns" in result.metadata &&
@@ -471,7 +474,10 @@ export class Threads {
             }
             config.configurable ??= {};
             config.configurable.graph_id ??= graphId;
-            const graph = await getGraph(graphId, { checkpointer, store });
+            const graph = await getGraph(graphId, thread.config, {
+                checkpointer,
+                store,
+            });
             const updateConfig = structuredClone(config);
             updateConfig.configurable ??= {};
             updateConfig.configurable.checkpoint_ns ??= "";
@@ -501,7 +507,10 @@ export class Threads {
             }
             config.configurable ??= {};
             config.configurable.graph_id ??= graphId;
-            const graph = await getGraph(graphId, { checkpointer, store });
+            const graph = await getGraph(graphId, thread.config, {
+                checkpointer,
+                store,
+            });
             const updateConfig = structuredClone(config);
             updateConfig.configurable ??= {};
             updateConfig.configurable.checkpoint_ns ??= "";
@@ -531,7 +540,10 @@ export class Threads {
             const graphId = thread.metadata?.graph_id;
             if (graphId == null)
                 return [];
-            const graph = await getGraph(graphId, { checkpointer, store });
+            const graph = await getGraph(graphId, thread.config, {
+                checkpointer,
+                store,
+            });
             const before = typeof options?.before === "string"
                 ? { configurable: { checkpoint_id: options.before } }
                 : options?.before;

package/dist/stream.mjs

@@ -57,7 +57,7 @@ export async function* streamState(run, attempt = 1, options) {
     if (!graphId || typeof graphId !== "string") {
         throw new Error("Invalid or missing graph_id");
     }
-    const graph = getGraph(graphId, {
+    const graph = await getGraph(graphId, kwargs.config, {
         checkpointer: kwargs.temporary ? null : undefined,
     });
     const userStreamMode = kwargs.stream_mode ?? [];

package/dist/ui/load.mjs

@@ -2,17 +2,16 @@ import { z } from "zod";
 import { Hono } from "hono";
 import { getMimeType } from "hono/utils/mime";
 import { zValidator } from "@hono/zod-validator";
+import { watch } from "@langchain/langgraph-ui";
 import * as path from "node:path";
-import { watch } from "./bundler.mjs";
 const GRAPH_UI = {};
 export async function registerGraphUi(defs, options) {
-    const result = await Promise.all(Object.entries(defs).map(async ([agentName, userPath]) => {
-        const ctx = await watch(agentName, { cwd: options.cwd, userPath }, (result) => {
-            GRAPH_UI[agentName] = result;
-        });
-        return [agentName, ctx];
-    }));
-    return Object.fromEntries(result);
+    await watch({
+        defs,
+        cwd: options.cwd,
+        config: options.config,
+        onOutput: (graphId, files) => (GRAPH_UI[graphId] = files),
+    });
 }
 export const api = new Hono();
 api.post("/ui/:agent", zValidator("json", z.object({ name: z.string() })), async (c) => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@langchain/langgraph-api",
-  "version": "0.0.18",
+  "version": "0.0.20",
   "type": "module",
   "engines": {
     "node": "^18.19.0 || >=20.16.0"
@@ -14,10 +14,6 @@
     ".": {
       "types": "./dist/cli/spawn.d.ts",
       "default": "./dist/cli/spawn.mjs"
-    },
-    "./ui/bundler": {
-      "types": "./dist/ui/bundler.d.ts",
-      "default": "./dist/ui/bundler.mjs"
     }
   },
   "repository": {
@@ -39,12 +35,11 @@
     "stacktrace-parser": "^0.1.10",
     "superjson": "^2.2.2",
     "tsx": "^4.19.3",
-    "esbuild": "^0.25.0",
-    "esbuild-plugin-tailwindcss": "^2.0.1",
     "uuid": "^10.0.0",
     "winston": "^3.17.0",
     "winston-console-format": "^1.0.8",
-    "zod": "^3.23.8"
+    "zod": "^3.23.8",
+    "@langchain/langgraph-ui": "0.0.20"
   },
   "peerDependencies": {
     "@langchain/core": "^0.3.42",
@@ -66,7 +61,7 @@
   "scripts": {
     "clean": "npx -y bun scripts/clean.mjs",
     "build": "npx -y bun scripts/build.mjs",
-    "dev": "tsx ./tests/utils.server.mts",
+    "dev": "tsx ./tests/utils.server.mts --dev",
     "typecheck": "tsc --noEmit",
     "test": "vitest",
     "test:parser": "vitest run ./tests/parser.test.mts --testTimeout 15000",

package/dist/ui/bundler.d.mts

@@ -1,15 +0,0 @@
-import { type BuildOptions } from "esbuild";
-export declare function build(agentName: string, args: {
-    cwd: string;
-    userPath: string;
-}): Promise<{
-    basename: string;
-    contents: Uint8Array;
-}[]>;
-export declare function watch(agentName: string, args: {
-    cwd: string;
-    userPath: string;
-}, onResult: (result: {
-    basename: string;
-    contents: Uint8Array;
-}[]) => void): Promise<import("esbuild").BuildContext<BuildOptions>>;

package/dist/ui/bundler.mjs

@@ -1,85 +0,0 @@
-import * as path from "node:path";
-import * as url from "node:url";
-import * as fs from "node:fs";
-import { build as runBuild, context as runContext, } from "esbuild";
-import tailwind from "esbuild-plugin-tailwindcss";
-const renderTemplate = await fs.promises.readFile(url.fileURLToPath(new URL("./render.template.mts", import.meta.url)), "utf-8");
-function entrypointPlugin(paths) {
-    const fullPath = path.resolve(paths.cwd, paths.userPath);
-    let relativeUiPath = path
-        .relative(paths.cwd, fullPath)
-        .replaceAll(path.sep, "/");
-    if (relativeUiPath.startsWith("../")) {
-        throw new Error(`UI path must be relative to the project root. Received: "${relativeUiPath}"`);
-    }
-    if (!relativeUiPath.startsWith("./"))
-        relativeUiPath = `./${relativeUiPath}`;
-    return {
-        name: "entrypoint",
-        setup(build) {
-            build.onResolve({ filter: /^entrypoint$/ }, () => ({
-                path: path.resolve(path.dirname(fullPath), "ui.entrypoint.tsx"),
-                namespace: "entrypoint-ns",
-            }));
-            build.onLoad({ filter: /.*/, namespace: "entrypoint-ns" }, () => ({
-                resolveDir: paths.cwd,
-                contents: [
-                    `import ui from "${relativeUiPath}"`,
-                    renderTemplate,
-                    `export const render = createRenderer(ui)`,
-                ].join("\n"),
-                loader: "tsx",
-            }));
-        },
-    };
-}
-function registerPlugin(onEnd) {
-    const textEncoder = new TextEncoder();
-    return {
-        name: "require-transform",
-        setup(build) {
-            build.onEnd(async (result) => {
-                const newResult = [];
-                for (const item of result.outputFiles ?? []) {
-                    let basename = path.basename(item.path);
-                    let contents = item.contents;
-                    if (basename === "entrypoint.js") {
-                        contents = textEncoder.encode(item.text.replaceAll(`typeof require !== "undefined" ? require`, `typeof globalThis[Symbol.for("LGUI_REQUIRE")] !== "undefined" ? globalThis[Symbol.for("LGUI_REQUIRE")]`));
-                    }
-                    newResult.push({ basename, contents });
-                }
-                if (newResult.length > 0)
-                    onEnd(newResult);
-            });
-        },
-    };
-}
-function setup(agentName, args, onResult) {
-    return {
-        write: false,
-        outdir: path.resolve(args.cwd, "dist"),
-        entryPoints: ["entrypoint"],
-        bundle: true,
-        platform: "browser",
-        target: "es2020",
-        jsx: "automatic",
-        external: [
-            "react",
-            "react-dom",
-            "@langchain/langgraph-sdk",
-            "@langchain/langgraph-sdk/react-ui",
-        ],
-        plugins: [tailwind(), entrypointPlugin(args), registerPlugin(onResult)],
-        globalName: `__LGUI_${agentName}`,
-    };
-}
-export async function build(agentName, args) {
-    let results = [];
-    await runBuild(setup(agentName, args, (result) => (results = result)));
-    return results;
-}
-export async function watch(agentName, args, onResult) {
-    const ctx = await runContext(setup(agentName, args, onResult));
-    await ctx.watch();
-    return ctx;
-}

package/dist/ui/render.template.mts

@@ -1,27 +0,0 @@
-import type { ComponentClass, FunctionComponent } from "react";
-
-const STORE_SYMBOL = Symbol.for("LGUI_EXT_STORE");
-
-declare global {
-  interface Window {
-    [STORE_SYMBOL]: {
-      respond: (
-        shadowRootId: string,
-        component: FunctionComponent | ComponentClass,
-        renderEl: HTMLElement,
-      ) => void;
-    };
-  }
-}
-
-// @ts-ignore
-function createRenderer(
-  components: Record<string, FunctionComponent | ComponentClass>,
-) {
-  return (name: string, shadowRootId: string) => {
-    const root = document.getElementById(shadowRootId)!.shadowRoot;
-    const renderEl = document.createElement("div");
-    root!.appendChild(renderEl);
-    window[STORE_SYMBOL].respond(shadowRootId, components[name], renderEl);
-  };
-}