@trigger.dev/react-hooks 0.0.0-langsmith-ai-20250111212321 → 0.0.0-next-20260414123825

package/dist/commonjs/hooks/useApiClient.d.ts

@@ -7,6 +7,8 @@ export type UseApiClientOptions = {
     accessToken?: string;
     /** Optional base URL for the API endpoints */
     baseURL?: string;
+    /** Optional preview branch name for preview environments */
+    previewBranch?: string;
     /** Optional additional request configuration */
     requestOptions?: ApiRequestOptions;
     /**

package/dist/commonjs/hooks/useApiClient.js

@@ -28,6 +28,7 @@ function useApiClient(options) {
     const auth = (0, contexts_js_1.useTriggerAuthContextOptional)();
     const baseUrl = options?.baseURL ?? auth?.baseURL ?? "https://api.trigger.dev";
     const accessToken = options?.accessToken ?? auth?.accessToken;
+    const previewBranch = options?.previewBranch ?? auth?.previewBranch;
     if (!accessToken) {
         if (options?.enabled === false) {
             return undefined;
@@ -38,6 +39,6 @@ function useApiClient(options) {
         ...auth?.requestOptions,
         ...options?.requestOptions,
     };
-    return new v3_1.ApiClient(baseUrl, accessToken, requestOptions);
+    return new v3_1.ApiClient(baseUrl, accessToken, previewBranch, requestOptions);
 }
 //# sourceMappingURL=useApiClient.js.map

package/dist/commonjs/hooks/useApiClient.js.map

@@ -1 +1 @@
-{"version":3,"file":"useApiClient.js","sourceRoot":"","sources":["../../../src/hooks/useApiClient.ts"],"names":[],"mappings":"AAAA,YAAY,CAAC;;;AA4Cb,oCAoBC;AA9DD,6CAAoE;AACpE,gDAA+D;AAqB/D;;;;;;;;;;;;;;;;;;;GAmBG;AACH,SAAgB,YAAY,CAAC,OAA6B;IACxD,MAAM,IAAI,GAAG,IAAA,2CAA6B,GAAE,CAAC;IAE7C,MAAM,OAAO,GAAG,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,OAAO,IAAI,yBAAyB,CAAC;IAC/E,MAAM,WAAW,GAAG,OAAO,EAAE,WAAW,IAAI,IAAI,EAAE,WAAW,CAAC;IAE9D,IAAI,CAAC,WAAW,EAAE,CAAC;QACjB,IAAI,OAAO,EAAE,OAAO,KAAK,KAAK,EAAE,CAAC;YAC/B,OAAO,SAAS,CAAC;QACnB,CAAC;QAED,MAAM,IAAI,KAAK,CAAC,mEAAmE,CAAC,CAAC;IACvF,CAAC;IAED,MAAM,cAAc,GAAsB;QACxC,GAAG,IAAI,EAAE,cAAc;QACvB,GAAG,OAAO,EAAE,cAAc;KAC3B,CAAC;IAEF,OAAO,IAAI,cAAS,CAAC,OAAO,EAAE,WAAW,EAAE,cAAc,CAAC,CAAC;AAC7D,CAAC"}
+{"version":3,"file":"useApiClient.js","sourceRoot":"","sources":["../../../src/hooks/useApiClient.ts"],"names":[],"mappings":"AAAA,YAAY,CAAC;;;AA8Cb,oCAoBC;AAhED,6CAAoE;AACpE,gDAA+D;AAuB/D;;;;;;;;;;;;;;;;;;;GAmBG;AACH,SAAgB,YAAY,CAAC,OAA6B;IACxD,MAAM,IAAI,GAAG,IAAA,2CAA6B,GAAE,CAAC;IAE7C,MAAM,OAAO,GAAG,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,OAAO,IAAI,yBAAyB,CAAC;IAC/E,MAAM,WAAW,GAAG,OAAO,EAAE,WAAW,IAAI,IAAI,EAAE,WAAW,CAAC;IAC9D,MAAM,aAAa,GAAG,OAAO,EAAE,aAAa,IAAI,IAAI,EAAE,aAAa,CAAC;IACpE,IAAI,CAAC,WAAW,EAAE,CAAC;QACjB,IAAI,OAAO,EAAE,OAAO,KAAK,KAAK,EAAE,CAAC;YAC/B,OAAO,SAAS,CAAC;QACnB,CAAC;QAED,MAAM,IAAI,KAAK,CAAC,mEAAmE,CAAC,CAAC;IACvF,CAAC;IAED,MAAM,cAAc,GAAsB;QACxC,GAAG,IAAI,EAAE,cAAc;QACvB,GAAG,OAAO,EAAE,cAAc;KAC3B,CAAC;IAEF,OAAO,IAAI,cAAS,CAAC,OAAO,EAAE,WAAW,EAAE,aAAa,EAAE,cAAc,CAAC,CAAC;AAC5E,CAAC"}

package/dist/commonjs/hooks/useInputStreamSend.d.ts

@@ -0,0 +1,26 @@
+import { UseApiClientOptions } from "./useApiClient.js";
+export interface InputStreamSendInstance<TData> {
+    /** Send data to the input stream */
+    send: (data: TData) => void;
+    /** Whether a send is currently in progress */
+    isLoading: boolean;
+    /** Any error that occurred during the last send */
+    error?: Error;
+    /** Whether the hook is ready to send (has runId and access token) */
+    isReady: boolean;
+}
+/**
+ * Hook to send data to an input stream on a running task.
+ *
+ * @template TData - The type of data to send
+ * @param streamId - The input stream identifier
+ * @param runId - The run to send input stream data to
+ * @param options - API client options (e.g. accessToken)
+ *
+ * @example
+ * ```tsx
+ * const { send, isLoading } = useInputStreamSend("my-stream", runId, { accessToken });
+ * send({ message: "hello" });
+ * ```
+ */
+export declare function useInputStreamSend<TData>(streamId: string, runId?: string, options?: UseApiClientOptions): InputStreamSendInstance<TData>;

package/dist/commonjs/hooks/useInputStreamSend.js

@@ -0,0 +1,45 @@
+"use client";
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useInputStreamSend = useInputStreamSend;
+const mutation_1 = __importDefault(require("swr/mutation"));
+const useApiClient_js_1 = require("./useApiClient.js");
+/**
+ * Hook to send data to an input stream on a running task.
+ *
+ * @template TData - The type of data to send
+ * @param streamId - The input stream identifier
+ * @param runId - The run to send input stream data to
+ * @param options - API client options (e.g. accessToken)
+ *
+ * @example
+ * ```tsx
+ * const { send, isLoading } = useInputStreamSend("my-stream", runId, { accessToken });
+ * send({ message: "hello" });
+ * ```
+ */
+function useInputStreamSend(streamId, runId, options) {
+    const apiClient = (0, useApiClient_js_1.useApiClient)(options);
+    async function sendToStream(key, { arg }) {
+        if (!apiClient) {
+            throw new Error("Could not send to input stream: Missing access token");
+        }
+        if (!runId) {
+            throw new Error("Could not send to input stream: Missing run ID");
+        }
+        return await apiClient.sendInputStream(runId, streamId, arg.data);
+    }
+    const mutation = (0, mutation_1.default)(runId ? `input-stream:${runId}:${streamId}` : null, sendToStream);
+    return {
+        send: (data) => {
+            mutation.trigger({ data });
+        },
+        isLoading: mutation.isMutating,
+        isReady: !!runId && !!apiClient,
+        error: mutation.error,
+    };
+}
+//# sourceMappingURL=useInputStreamSend.js.map

package/dist/commonjs/hooks/useInputStreamSend.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useInputStreamSend.js","sourceRoot":"","sources":["../../../src/hooks/useInputStreamSend.ts"],"names":[],"mappings":"AAAA,YAAY,CAAC;;;;;;AA8Bb,gDA6BC;AAzDD,4DAA0C;AAC1C,uDAAsE;AAatE;;;;;;;;;;;;;GAaG;AACH,SAAgB,kBAAkB,CAChC,QAAgB,EAChB,KAAc,EACd,OAA6B;IAE7B,MAAM,SAAS,GAAG,IAAA,8BAAY,EAAC,OAAO,CAAC,CAAC;IAExC,KAAK,UAAU,YAAY,CAAC,GAAW,EAAE,EAAE,GAAG,EAA4B;QACxE,IAAI,CAAC,SAAS,EAAE,CAAC;YACf,MAAM,IAAI,KAAK,CAAC,sDAAsD,CAAC,CAAC;QAC1E,CAAC;QAED,IAAI,CAAC,KAAK,EAAE,CAAC;YACX,MAAM,IAAI,KAAK,CAAC,gDAAgD,CAAC,CAAC;QACpE,CAAC;QAED,OAAO,MAAM,SAAS,CAAC,eAAe,CAAC,KAAK,EAAE,QAAQ,EAAE,GAAG,CAAC,IAAI,CAAC,CAAC;IACpE,CAAC;IAED,MAAM,QAAQ,GAAG,IAAA,kBAAc,EAAC,KAAK,CAAC,CAAC,CAAC,gBAAgB,KAAK,IAAI,QAAQ,EAAE,CAAC,CAAC,CAAC,IAAI,EAAE,YAAY,CAAC,CAAC;IAElG,OAAO;QACL,IAAI,EAAE,CAAC,IAAI,EAAE,EAAE;YACb,QAAQ,CAAC,OAAO,CAAC,EAAE,IAAI,EAAE,CAAC,CAAC;QAC7B,CAAC;QACD,SAAS,EAAE,QAAQ,CAAC,UAAU;QAC9B,OAAO,EAAE,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,SAAS;QAC/B,KAAK,EAAE,QAAQ,CAAC,KAAK;KACtB,CAAC;AACJ,CAAC"}

package/dist/commonjs/hooks/useRealtime.d.ts

@@ -1,9 +1,14 @@
-import { AnyTask, RealtimeRun } from "@trigger.dev/core/v3";
+import { AnyTask, InferStreamType, RealtimeDefinedStream, RealtimeRun, RealtimeRunSkipColumns } from "@trigger.dev/core/v3";
 import { UseApiClientOptions } from "./useApiClient.js";
 export type UseRealtimeRunOptions = UseApiClientOptions & {
     id?: string;
     enabled?: boolean;
-    experimental_throttleInMs?: number;
+    /**
+     * The number of milliseconds to throttle the stream updates.
+     *
+     * @default 16
+     */
+    throttleInMs?: number;
 };
 export type UseRealtimeSingleRunOptions<TTask extends AnyTask = AnyTask> = UseRealtimeRunOptions & {
     /**
@@ -21,6 +26,12 @@ export type UseRealtimeSingleRunOptions<TTask extends AnyTask = AnyTask> = UseRe
      * Set this to false if you are making updates to the run metadata after completion through child runs
      */
     stopOnCompletion?: boolean;
+    /**
+     * Skip columns from the subscription.
+     *
+     * @default []
+     */
+    skipColumns?: RealtimeRunSkipColumns;
 };
 export type UseRealtimeRunInstance<TTask extends AnyTask = AnyTask> = {
     run: RealtimeRun<TTask> | undefined;
@@ -83,6 +94,30 @@ export type UseRealtimeRunsInstance<TTask extends AnyTask = AnyTask> = {
      */
     stop: () => void;
 };
+export type UseRealtimeRunsWithTagOptions = UseRealtimeRunOptions & {
+    /**
+     * Filter runs by the time they were created. You must specify the duration string like "1h", "10s", "30m", etc.
+     *
+     * @example
+     * "1h" - 1 hour ago
+     * "10s" - 10 seconds ago
+     * "30m" - 30 minutes ago
+     * "1d" - 1 day ago
+     * "1w" - 1 week ago
+     *
+     * The maximum duration is 1 week
+     *
+     * @note The timestamp will be calculated on the server side when you first subscribe to the runs.
+     *
+     */
+    createdAt?: string;
+    /**
+     * Skip columns from the subscription.
+     *
+     * @default []
+     */
+    skipColumns?: RealtimeRunSkipColumns;
+};
 /**
  * Hook to subscribe to realtime updates of task runs filtered by tag(s).
  *
@@ -97,9 +132,11 @@ export type UseRealtimeRunsInstance<TTask extends AnyTask = AnyTask> = {
  * const { runs, error } = useRealtimeRunsWithTag<typeof myTask>('my-tag');
  * // Or with multiple tags
  * const { runs, error } = useRealtimeRunsWithTag<typeof myTask>(['tag1', 'tag2']);
+ * // Or with a createdAt filter
+ * const { runs, error } = useRealtimeRunsWithTag<typeof myTask>('my-tag', { createdAt: '1h' });
  * ```
  */
-export declare function useRealtimeRunsWithTag<TTask extends AnyTask>(tag: string | string[], options?: UseRealtimeRunOptions): UseRealtimeRunsInstance<TTask>;
+export declare function useRealtimeRunsWithTag<TTask extends AnyTask>(tag: string | string[], options?: UseRealtimeRunsWithTagOptions): UseRealtimeRunsInstance<TTask>;
 /**
  * Hook to subscribe to realtime updates of a batch of task runs.
  *
@@ -115,3 +152,143 @@ export declare function useRealtimeRunsWithTag<TTask extends AnyTask>(tag: strin
  * ```
  */
 export declare function useRealtimeBatch<TTask extends AnyTask>(batchId: string, options?: UseRealtimeRunOptions): UseRealtimeRunsInstance<TTask>;
+export type UseRealtimeStreamInstance<TPart> = {
+    parts: Array<TPart>;
+    error: Error | undefined;
+    /**
+     * Abort the current request immediately, keep the generated tokens if any.
+     */
+    stop: () => void;
+};
+export type UseRealtimeStreamOptions<TPart> = UseApiClientOptions & {
+    id?: string;
+    enabled?: boolean;
+    /**
+     * The number of milliseconds to throttle the stream updates.
+     *
+     * @default 16
+     */
+    throttleInMs?: number;
+    /**
+     * The number of seconds to wait for new data to be available,
+     * If no data arrives within the timeout, the stream will be closed.
+     *
+     * @default 60 seconds
+     */
+    timeoutInSeconds?: number;
+    /**
+     * The index to start reading from.
+     * If not provided, the stream will start from the beginning.
+     * @default 0
+     */
+    startIndex?: number;
+    /**
+     * Callback this is called when new data is received.
+     */
+    onData?: (data: TPart) => void;
+};
+export declare function useRealtimeStream<TDefinedStream extends RealtimeDefinedStream<any>>(stream: TDefinedStream, runId: string, options?: UseRealtimeStreamOptions<InferStreamType<TDefinedStream>>): UseRealtimeStreamInstance<InferStreamType<TDefinedStream>>;
+/**
+ * Hook to subscribe to realtime updates of a stream with a specific stream key.
+ *
+ * This hook automatically subscribes to a stream and updates the `parts` array as new data arrives.
+ * The stream subscription is automatically managed: it starts when the component mounts (or when
+ * `enabled` becomes `true`) and stops when the component unmounts or when `stop()` is called.
+ *
+ * @template TPart - The type of each chunk/part in the stream
+ * @param runId - The unique identifier of the run to subscribe to
+ * @param streamKey - The unique identifier of the stream to subscribe to. Use this overload
+ *   when you want to read from a specific stream key.
+ * @param options - Optional configuration for the stream subscription
+ * @returns An object containing:
+ *   - `parts`: An array of all stream chunks received so far (accumulates over time)
+ *   - `error`: Any error that occurred during subscription
+ *   - `stop`: A function to manually stop the subscription
+ *
+ * @example
+ * ```tsx
+ * "use client";
+ * import { useRealtimeStream } from "@trigger.dev/react-hooks";
+ *
+ * function StreamViewer({ runId }: { runId: string }) {
+ *   const { parts, error } = useRealtimeStream<string>(
+ *     runId,
+ *     "my-stream",
+ *     {
+ *       accessToken: process.env.NEXT_PUBLIC_TRIGGER_PUBLIC_KEY,
+ *     }
+ *   );
+ *
+ *   if (error) return <div>Error: {error.message}</div>;
+ *
+ *   // Parts array accumulates all chunks
+ *   const fullText = parts.join("");
+ *
+ *   return <div>{fullText}</div>;
+ * }
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // With custom options
+ * const { parts, error, stop } = useRealtimeStream<ChatChunk>(
+ *   runId,
+ *   "chat-stream",
+ *   {
+ *     accessToken: publicKey,
+ *     timeoutInSeconds: 120,
+ *     startIndex: 10, // Start from the 10th chunk
+ *     throttleInMs: 50, // Throttle updates to every 50ms
+ *     onData: (chunk) => {
+ *       console.log("New chunk received:", chunk);
+ *     },
+ *   }
+ * );
+ *
+ * // Manually stop the subscription
+ * <button onClick={stop}>Stop Stream</button>
+ * ```
+ */
+export declare function useRealtimeStream<TPart>(runId: string, streamKey: string, options?: UseRealtimeStreamOptions<TPart>): UseRealtimeStreamInstance<TPart>;
+/**
+ * Hook to subscribe to realtime updates of a stream using the default stream key (`"default"`).
+ *
+ * This is a convenience overload that allows you to subscribe to the default stream without
+ * specifying a stream key. The stream will be accessed with the key `"default"`.
+ *
+ * @template TPart - The type of each chunk/part in the stream
+ * @param runId - The unique identifier of the run to subscribe to
+ * @param options - Optional configuration for the stream subscription
+ * @returns An object containing:
+ *   - `parts`: An array of all stream chunks received so far (accumulates over time)
+ *   - `error`: Any error that occurred during subscription
+ *   - `stop`: A function to manually stop the subscription
+ *
+ * @example
+ * ```tsx
+ * "use client";
+ * import { useRealtimeStream } from "@trigger.dev/react-hooks";
+ *
+ * function DefaultStreamViewer({ runId }: { runId: string }) {
+ *   // Subscribe to the default stream
+ *   const { parts, error } = useRealtimeStream<string>(runId, {
+ *     accessToken: process.env.NEXT_PUBLIC_TRIGGER_PUBLIC_KEY,
+ *   });
+ *
+ *   if (error) return <div>Error: {error.message}</div>;
+ *
+ *   const fullText = parts.join("");
+ *   return <div>{fullText}</div>;
+ * }
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Conditionally enable the stream
+ * const { parts } = useRealtimeStream<string>(runId, {
+ *   accessToken: publicKey,
+ *   enabled: !!runId && isStreaming, // Only subscribe when runId exists and isStreaming is true
+ * });
+ * ```
+ */
+export declare function useRealtimeStream<TPart>(runId: string, options?: UseRealtimeStreamOptions<TPart>): UseRealtimeStreamInstance<TPart>;

package/dist/commonjs/hooks/useRealtime.js

@@ -5,6 +5,7 @@ exports.useRealtimeRun = useRealtimeRun;
 exports.useRealtimeRunWithStreams = useRealtimeRunWithStreams;
 exports.useRealtimeRunsWithTag = useRealtimeRunsWithTag;
 exports.useRealtimeBatch = useRealtimeBatch;
+exports.useRealtimeStream = useRealtimeStream;
 const react_1 = require("react");
 const trigger_swr_js_1 = require("../utils/trigger-swr.js");
 const useApiClient_js_1 = require("./useApiClient.js");
@@ -47,7 +48,7 @@ function useRealtimeRun(runId, options) {
             }
             const abortController = new AbortController();
             abortControllerRef.current = abortController;
-            await processRealtimeRun(runId, apiClient, mutateRun, setError, abortControllerRef, typeof options?.stopOnCompletion === "boolean" ? options.stopOnCompletion : true);
+            await processRealtimeRun(runId, { skipColumns: options?.skipColumns }, apiClient, mutateRun, setError, abortControllerRef, typeof options?.stopOnCompletion === "boolean" ? options.stopOnCompletion : true);
         }
         catch (err) {
             // Ignore abort errors as they are expected.
@@ -67,8 +68,10 @@ function useRealtimeRun(runId, options) {
     }, [runId, mutateRun, abortControllerRef, apiClient, setError]);
     const hasCalledOnCompleteRef = (0, react_1.useRef)(false);
     // Effect to handle onComplete callback
+    // Only call onComplete when the run has actually finished (has finishedAt),
+    // not just when the subscription stream ends (which can happen due to network issues)
     (0, react_1.useEffect)(() => {
-        if (isComplete && run && options?.onComplete && !hasCalledOnCompleteRef.current) {
+        if (isComplete && run?.finishedAt && options?.onComplete && !hasCalledOnCompleteRef.current) {
             options.onComplete(run, error);
             hasCalledOnCompleteRef.current = true;
         }
@@ -143,7 +146,7 @@ function useRealtimeRunWithStreams(runId, options) {
             }
             const abortController = new AbortController();
             abortControllerRef.current = abortController;
-            await processRealtimeRunWithStreams(runId, apiClient, mutateRun, mutateStreams, streamsRef, setError, abortControllerRef, typeof options?.stopOnCompletion === "boolean" ? options.stopOnCompletion : true, options?.experimental_throttleInMs);
+            await processRealtimeRunWithStreams(runId, { skipColumns: options?.skipColumns }, apiClient, mutateRun, mutateStreams, streamsRef, setError, abortControllerRef, typeof options?.stopOnCompletion === "boolean" ? options.stopOnCompletion : true, options?.throttleInMs ?? 16);
         }
         catch (err) {
             // Ignore abort errors as they are expected.
@@ -163,8 +166,10 @@ function useRealtimeRunWithStreams(runId, options) {
     }, [runId, mutateRun, mutateStreams, streamsRef, abortControllerRef, apiClient, setError]);
     const hasCalledOnCompleteRef = (0, react_1.useRef)(false);
     // Effect to handle onComplete callback
+    // Only call onComplete when the run has actually finished (has finishedAt),
+    // not just when the subscription stream ends (which can happen due to network issues)
     (0, react_1.useEffect)(() => {
-        if (isComplete && run && options?.onComplete && !hasCalledOnCompleteRef.current) {
+        if (isComplete && run?.finishedAt && options?.onComplete && !hasCalledOnCompleteRef.current) {
             options.onComplete(run, error);
             hasCalledOnCompleteRef.current = true;
         }
@@ -202,9 +207,12 @@ function useRealtimeRunWithStreams(runId, options) {
  * const { runs, error } = useRealtimeRunsWithTag<typeof myTask>('my-tag');
  * // Or with multiple tags
  * const { runs, error } = useRealtimeRunsWithTag<typeof myTask>(['tag1', 'tag2']);
+ * // Or with a createdAt filter
+ * const { runs, error } = useRealtimeRunsWithTag<typeof myTask>('my-tag', { createdAt: '1h' });
  * ```
  */
 function useRealtimeRunsWithTag(tag, options) {
+    const normalizedTag = (Array.isArray(tag) ? tag : [tag]).join("-");
     const hookId = (0, react_1.useId)();
     const idKey = options?.id ?? hookId;
     // Store the streams state in SWR, using the idKey as the key to share states.
@@ -233,7 +241,7 @@ function useRealtimeRunsWithTag(tag, options) {
             }
             const abortController = new AbortController();
             abortControllerRef.current = abortController;
-            await processRealtimeRunsWithTag(tag, apiClient, mutateRuns, runsRef, setError, abortControllerRef);
+            await processRealtimeRunsWithTag(tag, { createdAt: options?.createdAt, skipColumns: options?.skipColumns }, apiClient, mutateRuns, runsRef, setError, abortControllerRef);
         }
         catch (err) {
             // Ignore abort errors as they are expected.
@@ -248,7 +256,7 @@ function useRealtimeRunsWithTag(tag, options) {
                 abortControllerRef.current = null;
             }
         }
-    }, [tag, mutateRuns, runsRef, abortControllerRef, apiClient, setError]);
+    }, [normalizedTag, mutateRuns, runsRef, abortControllerRef, apiClient, setError]);
     (0, react_1.useEffect)(() => {
         if (typeof options?.enabled === "boolean" && !options.enabled) {
             return;
@@ -257,7 +265,7 @@ function useRealtimeRunsWithTag(tag, options) {
         return () => {
             stop();
         };
-    }, [tag, stop, options?.enabled]);
+    }, [normalizedTag, stop, options?.enabled]);
     return { runs: runs ?? [], error, stop };
 }
 /**
@@ -330,6 +338,93 @@ function useRealtimeBatch(batchId, options) {
     }, [batchId, stop, options?.enabled]);
     return { runs: runs ?? [], error, stop };
 }
+function useRealtimeStream(runIdOrDefinedStream, streamKeyOrOptionsOrRunId, options) {
+    if (typeof runIdOrDefinedStream === "string") {
+        if (typeof streamKeyOrOptionsOrRunId === "string") {
+            return useRealtimeStreamImplementation(runIdOrDefinedStream, streamKeyOrOptionsOrRunId, options);
+        }
+        else {
+            return useRealtimeStreamImplementation(runIdOrDefinedStream, "default", streamKeyOrOptionsOrRunId);
+        }
+    }
+    else {
+        if (typeof streamKeyOrOptionsOrRunId === "string") {
+            return useRealtimeStreamImplementation(streamKeyOrOptionsOrRunId, runIdOrDefinedStream.id, options);
+        }
+        else {
+            throw new Error("Invalid second argument to useRealtimeStream. When using a defined stream instance, the second argument to useRealtimeStream must be a run ID.");
+        }
+    }
+}
+function useRealtimeStreamImplementation(runId, streamKey, options) {
+    const hookId = (0, react_1.useId)();
+    const idKey = options?.id ?? hookId;
+    const [initialPartsFallback] = (0, react_1.useState)([]);
+    // Store the streams state in SWR, using the idKey as the key to share states.
+    const { data: parts, mutate: mutateParts } = (0, trigger_swr_js_1.useSWR)([idKey, runId, streamKey, "parts"], null, {
+        fallbackData: initialPartsFallback,
+    });
+    // Keep the latest streams in a ref.
+    const partsRef = (0, react_1.useRef)(parts ?? []);
+    (0, react_1.useEffect)(() => {
+        partsRef.current = parts || [];
+    }, [parts]);
+    // Add state to track when the subscription is complete
+    const { data: isComplete = false, mutate: setIsComplete } = (0, trigger_swr_js_1.useSWR)([idKey, runId, streamKey, "complete"], null);
+    const { data: error = undefined, mutate: setError } = (0, trigger_swr_js_1.useSWR)([idKey, runId, streamKey, "error"], null);
+    // Abort controller to cancel the current API call.
+    const abortControllerRef = (0, react_1.useRef)(null);
+    const stop = (0, react_1.useCallback)(() => {
+        if (abortControllerRef.current) {
+            abortControllerRef.current.abort();
+            abortControllerRef.current = null;
+        }
+    }, []);
+    const onData = (0, react_1.useCallback)((data) => {
+        if (options?.onData) {
+            options.onData(data);
+        }
+    }, [options?.onData]);
+    const apiClient = (0, useApiClient_js_1.useApiClient)(options);
+    const triggerRequest = (0, react_1.useCallback)(async () => {
+        try {
+            if (!runId || !apiClient) {
+                return;
+            }
+            const abortController = new AbortController();
+            abortControllerRef.current = abortController;
+            await processRealtimeStream(runId, streamKey, apiClient, mutateParts, partsRef, setError, onData, abortControllerRef, options?.timeoutInSeconds, options?.startIndex, options?.throttleInMs ?? 16);
+        }
+        catch (err) {
+            // Ignore abort errors as they are expected.
+            if (err.name === "AbortError") {
+                abortControllerRef.current = null;
+                return;
+            }
+            setError(err);
+        }
+        finally {
+            if (abortControllerRef.current) {
+                abortControllerRef.current = null;
+            }
+            // Mark the subscription as complete
+            setIsComplete(true);
+        }
+    }, [runId, streamKey, mutateParts, partsRef, abortControllerRef, apiClient, setError]);
+    (0, react_1.useEffect)(() => {
+        if (typeof options?.enabled === "boolean" && !options.enabled) {
+            return;
+        }
+        if (!runId) {
+            return;
+        }
+        triggerRequest().finally(() => { });
+        return () => {
+            stop();
+        };
+    }, [runId, stop, options?.enabled]);
+    return { parts: parts ?? initialPartsFallback, error, stop };
+}
 async function processRealtimeBatch(batchId, apiClient, mutateRunsData, existingRunsRef, onError, abortControllerRef) {
     const subscription = apiClient.subscribeToBatch(batchId, {
         signal: abortControllerRef.current?.signal,
@@ -339,21 +434,21 @@ async function processRealtimeBatch(batchId, apiClient, mutateRunsData, existing
         mutateRunsData(insertRunShapeInOrder(existingRunsRef.current, part));
     }
 }
-// Inserts and then orders by the run number, and ensures that the run is not duplicated
+// Inserts and then orders by the run createdAt timestamp, and ensures that the run is not duplicated
 function insertRunShapeInOrder(previousRuns, run) {
     const existingRun = previousRuns.find((r) => r.id === run.id);
     if (existingRun) {
         return previousRuns.map((r) => (r.id === run.id ? run : r));
     }
-    const runNumber = run.number;
-    const index = previousRuns.findIndex((r) => r.number > runNumber);
+    const runCreatedAt = run.createdAt;
+    const index = previousRuns.findIndex((r) => r.createdAt > runCreatedAt);
     if (index === -1) {
         return [...previousRuns, run];
     }
     return [...previousRuns.slice(0, index), run, ...previousRuns.slice(index)];
 }
-async function processRealtimeRunsWithTag(tag, apiClient, mutateRunsData, existingRunsRef, onError, abortControllerRef) {
-    const subscription = apiClient.subscribeToRunsWithTag(tag, {
+async function processRealtimeRunsWithTag(tag, filters, apiClient, mutateRunsData, existingRunsRef, onError, abortControllerRef) {
+    const subscription = apiClient.subscribeToRunsWithTag(tag, filters, {
         signal: abortControllerRef.current?.signal,
         onFetchError: onError,
     });
@@ -374,11 +469,12 @@ function insertRunShape(previousRuns, run) {
     }
     return [...previousRuns.slice(0, index), run, ...previousRuns.slice(index)];
 }
-async function processRealtimeRunWithStreams(runId, apiClient, mutateRunData, mutateStreamData, existingDataRef, onError, abortControllerRef, stopOnCompletion = true, throttleInMs) {
+async function processRealtimeRunWithStreams(runId, filters, apiClient, mutateRunData, mutateStreamData, existingDataRef, onError, abortControllerRef, stopOnCompletion = true, throttleInMs) {
     const subscription = apiClient.subscribeToRun(runId, {
         signal: abortControllerRef.current?.signal,
         closeOnComplete: stopOnCompletion,
         onFetchError: onError,
+        skipColumns: filters.skipColumns,
     });
     const streamQueue = (0, throttle_js_1.createThrottledQueue)(async (updates) => {
         const nextStreamData = { ...existingDataRef.current };
@@ -410,14 +506,44 @@ async function processRealtimeRunWithStreams(runId, apiClient, mutateRunData, mu
         }
     }
 }
-async function processRealtimeRun(runId, apiClient, mutateRunData, onError, abortControllerRef, stopOnCompletion = true) {
+async function processRealtimeRun(runId, filters, apiClient, mutateRunData, onError, abortControllerRef, stopOnCompletion = true) {
     const subscription = apiClient.subscribeToRun(runId, {
         signal: abortControllerRef.current?.signal,
         closeOnComplete: stopOnCompletion,
         onFetchError: onError,
+        skipColumns: filters.skipColumns,
     });
     for await (const part of subscription) {
         mutateRunData(part);
     }
 }
+async function processRealtimeStream(runId, streamKey, apiClient, mutatePartsData, existingPartsRef, onError, onData, abortControllerRef, timeoutInSeconds, startIndex, throttleInMs) {
+    try {
+        const stream = await apiClient.fetchStream(runId, streamKey, {
+            signal: abortControllerRef.current?.signal,
+            timeoutInSeconds,
+            lastEventId: startIndex ? (startIndex - 1).toString() : undefined,
+        });
+        // Throttle the stream
+        const streamQueue = (0, throttle_js_1.createThrottledQueue)(async (parts) => {
+            mutatePartsData([...existingPartsRef.current, ...parts]);
+        }, throttleInMs);
+        for await (const part of stream) {
+            onData(part);
+            streamQueue.add(part);
+        }
+    }
+    catch (err) {
+        if (err.name === "AbortError") {
+            return;
+        }
+        if (err instanceof Error) {
+            onError(err);
+        }
+        else {
+            onError(new Error(String(err)));
+        }
+        throw err;
+    }
+}
 //# sourceMappingURL=useRealtime.js.map