@langchain/langgraph-sdk 0.0.45 → 0.0.46-experimental.0

package/dist/react/stream.cjs

@@ -220,7 +220,7 @@ function useStream(options) {
     const messageManagerRef = (0, react_1.useRef)(new MessageTupleManager());
     const submittingRef = (0, react_1.useRef)(false);
     const abortRef = (0, react_1.useRef)(null);
-    const trackStreamModeRef = (0, react_1.useRef)(["values"]);
+    const trackStreamModeRef = (0, react_1.useRef)([]);
     const trackStreamMode = (0, react_1.useCallback)((mode) => {
         if (!trackStreamModeRef.current.includes(mode))
             trackStreamModeRef.current.push(mode);
@@ -434,8 +434,13 @@ function useStream(options) {
             if (isLoading)
                 return undefined;
             const interrupts = threadHead?.tasks?.at(-1)?.interrupts;
-            if (interrupts == null || interrupts.length === 0)
-                return undefined;
+            if (interrupts == null || interrupts.length === 0) {
+                // check if there's a next task present
+                const next = threadHead?.next ?? [];
+                if (!next.length || error != null)
+                    return undefined;
+                return { when: "breakpoint" };
+            }
             // Return only the current interrupt
             return interrupts.at(-1);
         },

package/dist/react/stream.js

@@ -217,7 +217,7 @@ export function useStream(options) {
     const messageManagerRef = useRef(new MessageTupleManager());
     const submittingRef = useRef(false);
     const abortRef = useRef(null);
-    const trackStreamModeRef = useRef(["values"]);
+    const trackStreamModeRef = useRef([]);
     const trackStreamMode = useCallback((mode) => {
         if (!trackStreamModeRef.current.includes(mode))
             trackStreamModeRef.current.push(mode);
@@ -431,8 +431,13 @@ export function useStream(options) {
             if (isLoading)
                 return undefined;
             const interrupts = threadHead?.tasks?.at(-1)?.interrupts;
-            if (interrupts == null || interrupts.length === 0)
-                return undefined;
+            if (interrupts == null || interrupts.length === 0) {
+                // check if there's a next task present
+                const next = threadHead?.next ?? [];
+                if (!next.length || error != null)
+                    return undefined;
+                return { when: "breakpoint" };
+            }
             // Return only the current interrupt
             return interrupts.at(-1);
         },

package/dist/react-ui/client.cjs

@@ -0,0 +1,112 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.LoadExternalComponent = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const React = __importStar(require("react"));
+const ReactDOM = __importStar(require("react-dom"));
+const JsxRuntime = __importStar(require("react/jsx-runtime"));
+const UseStreamContext = React.createContext(null);
+class ComponentStore {
+    constructor() {
+        Object.defineProperty(this, "cache", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: {}
+        });
+        Object.defineProperty(this, "boundCache", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: {}
+        });
+        Object.defineProperty(this, "callbacks", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: {}
+        });
+    }
+    respond(name, comp, targetElement) {
+        this.cache[name] = { comp, target: targetElement };
+        this.callbacks[name]?.forEach((c) => c(comp, targetElement));
+    }
+    getBoundStore(name) {
+        this.boundCache[name] ??= {
+            subscribe: (onStoreChange) => {
+                this.callbacks[name] ??= [];
+                this.callbacks[name].push(onStoreChange);
+                return () => {
+                    this.callbacks[name] = this.callbacks[name].filter((c) => c !== onStoreChange);
+                };
+            },
+            getSnapshot: () => this.cache[name],
+        };
+        return this.boundCache[name];
+    }
+}
+const COMPONENT_STORE = new ComponentStore();
+const EXT_STORE_SYMBOL = Symbol.for("LGUI_EXT_STORE");
+const REQUIRE_SYMBOL = Symbol.for("LGUI_REQUIRE");
+function LoadExternalComponent({ apiUrl = "http://localhost:2024", assistantId, stream, message, className, }) {
+    const ref = React.useRef(null);
+    const id = React.useId();
+    const shadowRootId = `child-shadow-${id}`;
+    const store = React.useMemo(() => COMPONENT_STORE.getBoundStore(shadowRootId), [shadowRootId]);
+    const state = React.useSyncExternalStore(store.subscribe, store.getSnapshot);
+    React.useEffect(() => {
+        fetch(`${apiUrl}/ui/${assistantId}`, {
+            headers: { "Content-Type": "application/json" },
+            method: "POST",
+            body: JSON.stringify({ name: message.name, shadowRootId }),
+        })
+            .then((a) => a.text())
+            .then((html) => {
+            const dom = ref.current;
+            if (!dom)
+                return;
+            const root = dom.shadowRoot ?? dom.attachShadow({ mode: "open" });
+            const fragment = document.createRange().createContextualFragment(html);
+            root.appendChild(fragment);
+        });
+    }, [apiUrl, assistantId, message.name, shadowRootId]);
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { id: shadowRootId, ref: ref, className: className }), (0, jsx_runtime_1.jsx)(UseStreamContext.Provider, { value: stream, children: state?.target &&
+                    ReactDOM.createPortal(React.createElement(state.comp, message.content), state.target) })] }));
+}
+exports.LoadExternalComponent = LoadExternalComponent;
+window[EXT_STORE_SYMBOL] = COMPONENT_STORE;
+window[REQUIRE_SYMBOL] = (name) => {
+    if (name === "react")
+        return React;
+    if (name === "react-dom")
+        return ReactDOM;
+    if (name === "react/jsx-runtime")
+        return JsxRuntime;
+    if (name === "@langchain/langgraph-sdk/react") {
+        return { useStream: () => React.useContext(UseStreamContext) };
+    }
+    throw new Error(`Unknown module...: ${name}`);
+};

package/dist/react-ui/client.d.ts

@@ -0,0 +1,34 @@
+import type { useStream } from "../react/index.js";
+import type { UIMessage } from "./types.js";
+import * as React from "react";
+import * as JsxRuntime from "react/jsx-runtime";
+interface ComponentTarget {
+    comp: React.FunctionComponent | React.ComponentClass;
+    target: HTMLElement;
+}
+declare class ComponentStore {
+    private cache;
+    private boundCache;
+    private callbacks;
+    respond(name: string, comp: React.FunctionComponent | React.ComponentClass, targetElement: HTMLElement): void;
+    getBoundStore(name: string): {
+        subscribe: (onStoreChange: () => void) => () => void;
+        getSnapshot: () => ComponentTarget | undefined;
+    };
+}
+declare const EXT_STORE_SYMBOL: unique symbol;
+declare const REQUIRE_SYMBOL: unique symbol;
+export declare function LoadExternalComponent({ apiUrl, assistantId, stream, message, className, }: {
+    apiUrl?: string;
+    assistantId: string;
+    stream: ReturnType<typeof useStream>;
+    message: UIMessage;
+    className?: string;
+}): JsxRuntime.JSX.Element;
+declare global {
+    interface Window {
+        [EXT_STORE_SYMBOL]: ComponentStore;
+        [REQUIRE_SYMBOL]: (name: string) => unknown;
+    }
+}
+export {};

package/dist/react-ui/client.js

@@ -0,0 +1,85 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import * as ReactDOM from "react-dom";
+import * as JsxRuntime from "react/jsx-runtime";
+const UseStreamContext = React.createContext(null);
+class ComponentStore {
+    constructor() {
+        Object.defineProperty(this, "cache", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: {}
+        });
+        Object.defineProperty(this, "boundCache", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: {}
+        });
+        Object.defineProperty(this, "callbacks", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: {}
+        });
+    }
+    respond(name, comp, targetElement) {
+        this.cache[name] = { comp, target: targetElement };
+        this.callbacks[name]?.forEach((c) => c(comp, targetElement));
+    }
+    getBoundStore(name) {
+        this.boundCache[name] ??= {
+            subscribe: (onStoreChange) => {
+                this.callbacks[name] ??= [];
+                this.callbacks[name].push(onStoreChange);
+                return () => {
+                    this.callbacks[name] = this.callbacks[name].filter((c) => c !== onStoreChange);
+                };
+            },
+            getSnapshot: () => this.cache[name],
+        };
+        return this.boundCache[name];
+    }
+}
+const COMPONENT_STORE = new ComponentStore();
+const EXT_STORE_SYMBOL = Symbol.for("LGUI_EXT_STORE");
+const REQUIRE_SYMBOL = Symbol.for("LGUI_REQUIRE");
+export function LoadExternalComponent({ apiUrl = "http://localhost:2024", assistantId, stream, message, className, }) {
+    const ref = React.useRef(null);
+    const id = React.useId();
+    const shadowRootId = `child-shadow-${id}`;
+    const store = React.useMemo(() => COMPONENT_STORE.getBoundStore(shadowRootId), [shadowRootId]);
+    const state = React.useSyncExternalStore(store.subscribe, store.getSnapshot);
+    React.useEffect(() => {
+        fetch(`${apiUrl}/ui/${assistantId}`, {
+            headers: { "Content-Type": "application/json" },
+            method: "POST",
+            body: JSON.stringify({ name: message.name, shadowRootId }),
+        })
+            .then((a) => a.text())
+            .then((html) => {
+            const dom = ref.current;
+            if (!dom)
+                return;
+            const root = dom.shadowRoot ?? dom.attachShadow({ mode: "open" });
+            const fragment = document.createRange().createContextualFragment(html);
+            root.appendChild(fragment);
+        });
+    }, [apiUrl, assistantId, message.name, shadowRootId]);
+    return (_jsxs(_Fragment, { children: [_jsx("div", { id: shadowRootId, ref: ref, className: className }), _jsx(UseStreamContext.Provider, { value: stream, children: state?.target &&
+                    ReactDOM.createPortal(React.createElement(state.comp, message.content), state.target) })] }));
+}
+window[EXT_STORE_SYMBOL] = COMPONENT_STORE;
+window[REQUIRE_SYMBOL] = (name) => {
+    if (name === "react")
+        return React;
+    if (name === "react-dom")
+        return ReactDOM;
+    if (name === "react/jsx-runtime")
+        return JsxRuntime;
+    if (name === "@langchain/langgraph-sdk/react") {
+        return { useStream: () => React.useContext(UseStreamContext) };
+    }
+    throw new Error(`Unknown module...: ${name}`);
+};

package/dist/react-ui/server.cjs

@@ -0,0 +1,35 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.typedUi = void 0;
+const uuid_1 = require("uuid");
+const typedUi = (config) => {
+    let collect = [];
+    const runId = config.metadata?.run_id ?? config.runId;
+    if (!runId)
+        throw new Error("run_id is required");
+    const metadata = {
+        ...config.metadata,
+        tags: config.tags,
+        name: config.runName,
+        run_id: runId,
+    };
+    const create = (name, props) => ({
+        type: "ui",
+        id: (0, uuid_1.v4)(),
+        name,
+        content: props,
+        additional_kwargs: metadata,
+    });
+    const remove = (id) => ({ type: "remove-ui", id });
+    return {
+        create,
+        remove,
+        collect,
+        write: (name, props) => {
+            const evt = create(name, props);
+            collect.push(evt);
+            config.writer?.(evt);
+        },
+    };
+};
+exports.typedUi = typedUi;

package/dist/react-ui/server.d.ts

@@ -0,0 +1,14 @@
+import type { ComponentPropsWithoutRef, ElementType } from "react";
+import type { RemoveUIMessage, UIMessage } from "./types.js";
+export declare const typedUi: <Decl extends Record<string, ElementType>>(config: {
+    writer?: (chunk: unknown) => void;
+    runId?: string;
+    metadata?: Record<string, unknown>;
+    tags?: string[];
+    runName?: string;
+}) => {
+    create: <K extends keyof Decl & string>(name: K, props: { [K_1 in keyof Decl]: ComponentPropsWithoutRef<Decl[K_1]>; }[K]) => UIMessage;
+    remove: (id: string) => RemoveUIMessage;
+    collect: unknown[];
+    write: <K_2 extends keyof Decl & string>(name: K_2, props: { [K_1 in keyof Decl]: ComponentPropsWithoutRef<Decl[K_1]>; }[K_2]) => void;
+};

package/dist/react-ui/server.js

@@ -0,0 +1,31 @@
+import { v4 as uuidv4 } from "uuid";
+export const typedUi = (config) => {
+    let collect = [];
+    const runId = config.metadata?.run_id ?? config.runId;
+    if (!runId)
+        throw new Error("run_id is required");
+    const metadata = {
+        ...config.metadata,
+        tags: config.tags,
+        name: config.runName,
+        run_id: runId,
+    };
+    const create = (name, props) => ({
+        type: "ui",
+        id: uuidv4(),
+        name,
+        content: props,
+        additional_kwargs: metadata,
+    });
+    const remove = (id) => ({ type: "remove-ui", id });
+    return {
+        create,
+        remove,
+        collect,
+        write: (name, props) => {
+            const evt = create(name, props);
+            collect.push(evt);
+            config.writer?.(evt);
+        },
+    };
+};

package/dist/react-ui/types.cjs

@@ -0,0 +1,22 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.uiMessageReducer = void 0;
+function uiMessageReducer(state, update) {
+    const events = Array.isArray(update) ? update : [update];
+    let newState = state.slice();
+    for (const event of events) {
+        if (event.type === "remove-ui") {
+            newState = newState.filter((ui) => ui.id !== event.id);
+            continue;
+        }
+        const index = state.findIndex((ui) => ui.id === event.id);
+        if (index !== -1) {
+            newState[index] = event;
+        }
+        else {
+            newState.push(event);
+        }
+    }
+    return newState;
+}
+exports.uiMessageReducer = uiMessageReducer;

package/dist/react-ui/types.d.ts

@@ -0,0 +1,15 @@
+export interface UIMessage {
+    type: "ui";
+    id: string;
+    name: string;
+    content: Record<string, unknown>;
+    additional_kwargs: {
+        run_id: string;
+        [key: string]: unknown;
+    };
+}
+export interface RemoveUIMessage {
+    type: "remove-ui";
+    id: string;
+}
+export declare function uiMessageReducer(state: UIMessage[], update: UIMessage | RemoveUIMessage | (UIMessage | RemoveUIMessage)[]): UIMessage[];

package/dist/react-ui/types.js

@@ -0,0 +1,18 @@
+export function uiMessageReducer(state, update) {
+    const events = Array.isArray(update) ? update : [update];
+    let newState = state.slice();
+    for (const event of events) {
+        if (event.type === "remove-ui") {
+            newState = newState.filter((ui) => ui.id !== event.id);
+            continue;
+        }
+        const index = state.findIndex((ui) => ui.id === event.id);
+        if (index !== -1) {
+            newState[index] = event;
+        }
+        else {
+            newState.push(event);
+        }
+    }
+    return newState;
+}

package/dist/schema.d.ts

@@ -104,9 +104,9 @@ export interface AssistantGraph {
  * An interrupt thrown inside a thread.
  */
 export interface Interrupt<TValue = unknown> {
-    value: TValue;
-    when: "during";
-    resumable: boolean;
+    value?: TValue;
+    when: "during" | (string & {});
+    resumable?: boolean;
     ns?: string[];
 }
 export interface Thread<ValuesType = DefaultValues> {

package/package.json

@@ -1,13 +1,13 @@
 {
   "name": "@langchain/langgraph-sdk",
-  "version": "0.0.45",
+  "version": "0.0.46-experimental.0",
   "description": "Client library for interacting with the LangGraph API",
   "type": "module",
   "packageManager": "yarn@1.22.19",
   "scripts": {
     "clean": "rm -rf dist/ dist-cjs/",
     "build": "yarn clean && yarn lc_build --create-entrypoints --pre --tree-shaking",
-    "prepublish": "yarn run build",
+    "prepack": "yarn run build",
     "format": "prettier --write src",
     "lint": "prettier --check src && tsc --noEmit",
     "test": "NODE_OPTIONS=--experimental-vm-modules jest --testPathIgnorePatterns=\\.int\\.test.ts",
@@ -29,7 +29,8 @@
     "@types/jest": "^29.5.12",
     "@types/node": "^20.12.12",
     "@types/uuid": "^9.0.1",
-    "@types/react": "18.3.2",
+    "@types/react": "^19.0.8",
+    "@types/react-dom": "^19.0.3",
     "concat-md": "^0.5.1",
     "jest": "^29.7.0",
     "prettier": "^3.2.5",
@@ -37,7 +38,8 @@
     "typedoc": "^0.27.7",
     "typedoc-plugin-markdown": "^4.4.2",
     "typescript": "^5.4.5",
-    "react": "^18.3.1"
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0"
   },
   "peerDependencies": {
     "react": "^18 || ^19",
@@ -79,6 +81,33 @@
       "import": "./react.js",
       "require": "./react.cjs"
     },
+    "./react-ui/client": {
+      "types": {
+        "import": "./react-ui/client.d.ts",
+        "require": "./react-ui/client.d.cts",
+        "default": "./react-ui/client.d.ts"
+      },
+      "import": "./react-ui/client.js",
+      "require": "./react-ui/client.cjs"
+    },
+    "./react-ui/server": {
+      "types": {
+        "import": "./react-ui/server.d.ts",
+        "require": "./react-ui/server.d.cts",
+        "default": "./react-ui/server.d.ts"
+      },
+      "import": "./react-ui/server.js",
+      "require": "./react-ui/server.cjs"
+    },
+    "./react-ui/types": {
+      "types": {
+        "import": "./react-ui/types.d.ts",
+        "require": "./react-ui/types.d.cts",
+        "default": "./react-ui/types.d.ts"
+      },
+      "import": "./react-ui/types.js",
+      "require": "./react-ui/types.cjs"
+    },
     "./package.json": "./package.json"
   },
   "files": [
@@ -94,6 +123,18 @@
     "react.cjs",
     "react.js",
     "react.d.ts",
-    "react.d.cts"
+    "react.d.cts",
+    "react-ui/client.cjs",
+    "react-ui/client.js",
+    "react-ui/client.d.ts",
+    "react-ui/client.d.cts",
+    "react-ui/server.cjs",
+    "react-ui/server.js",
+    "react-ui/server.d.ts",
+    "react-ui/server.d.cts",
+    "react-ui/types.cjs",
+    "react-ui/types.js",
+    "react-ui/types.d.ts",
+    "react-ui/types.d.cts"
   ]
 }

package/react-ui/client.cjs

@@ -0,0 +1 @@
+module.exports = require('../dist/react-ui/client.cjs');

package/react-ui/client.d.cts

@@ -0,0 +1 @@
+export * from '../dist/react-ui/client.js'

package/react-ui/client.d.ts

@@ -0,0 +1 @@
+export * from '../dist/react-ui/client.js'

package/react-ui/client.js

@@ -0,0 +1 @@
+export * from '../dist/react-ui/client.js'

package/react-ui/server.cjs

@@ -0,0 +1 @@
+module.exports = require('../dist/react-ui/server.cjs');

package/react-ui/server.d.cts

@@ -0,0 +1 @@
+export * from '../dist/react-ui/server.js'

package/react-ui/server.d.ts

@@ -0,0 +1 @@
+export * from '../dist/react-ui/server.js'

package/react-ui/server.js

@@ -0,0 +1 @@
+export * from '../dist/react-ui/server.js'

package/react-ui/types.cjs

@@ -0,0 +1 @@
+module.exports = require('../dist/react-ui/types.cjs');

package/react-ui/types.d.cts

@@ -0,0 +1 @@
+export * from '../dist/react-ui/types.js'

package/react-ui/types.d.ts

@@ -0,0 +1 @@
+export * from '../dist/react-ui/types.js'

package/react-ui/types.js

@@ -0,0 +1 @@
+export * from '../dist/react-ui/types.js'