@tanstack/ai-solid 0.13.14 → 0.14.0

package/dist/use-generate-image.d.ts

@@ -0,0 +1,96 @@
+import { Accessor } from "solid-js";
+import { AIDevtoolsDisplayOptions, ConnectConnectionAdapter, GenerationClientState, GenerationFetcher, ImageGenerateInput, InferGenerationOutputFromReturn } from "@tanstack/ai-client";
+import { ImageGenerationResult, StreamChunk } from "@tanstack/ai";
+
+//#region src/use-generate-image.d.ts
+
+/**
+ * Options for the useGenerateImage hook.
+ *
+ * @template TOutput - The transformed output type (defaults to ImageGenerationResult)
+ */
+interface UseGenerateImageOptions<TOutput = ImageGenerationResult> {
+  /** Connect-based adapter for streaming transport (SSE, HTTP stream, custom) */
+  connection?: ConnectConnectionAdapter;
+  /** Direct async function for image generation */
+  fetcher?: GenerationFetcher<ImageGenerateInput, ImageGenerationResult>;
+  /** Unique identifier for this generation instance */
+  id?: string;
+  /** Additional body parameters to send with connect-based adapter requests */
+  body?: Record<string, any>;
+  /** Display options for TanStack AI Devtools. */
+  devtools?: AIDevtoolsDisplayOptions;
+  /**
+   * Callback when images are generated. Can optionally return a transformed value.
+   *
+   * - Return a non-null value to transform and store it as the result
+   * - Return `null` to keep the previous result unchanged
+   * - Return nothing (`void`) to store the raw result as-is
+   */
+  onResult?: (result: ImageGenerationResult) => TOutput | null | void;
+  /** Callback when an error occurs */
+  onError?: (error: Error) => void;
+  /** Callback when progress is reported (0-100) */
+  onProgress?: (progress: number, message?: string) => void;
+  /** Callback for each stream chunk (connect-based adapter mode only) */
+  onChunk?: (chunk: StreamChunk) => void;
+}
+/**
+ * Return type for the useGenerateImage hook.
+ *
+ * @template TOutput - The transformed output type (defaults to ImageGenerationResult)
+ */
+interface UseGenerateImageReturn<TOutput = ImageGenerationResult> {
+  /** Trigger image generation */
+  generate: (input: ImageGenerateInput) => Promise<void>;
+  /** The generation result containing images, or null */
+  result: Accessor<TOutput | null>;
+  /** Whether generation is in progress */
+  isLoading: Accessor<boolean>;
+  /** Current error, if any */
+  error: Accessor<Error | undefined>;
+  /** Current state of the generation */
+  status: Accessor<GenerationClientState>;
+  /** Abort the current generation */
+  stop: () => void;
+  /** Clear result, error, and return to idle */
+  reset: () => void;
+}
+/**
+ * Solid hook for generating images using AI models.
+ *
+ * Supports two transport modes:
+ * - **ConnectConnectionAdapter** -- Streaming transport (SSE, HTTP stream, custom)
+ * - **Fetcher** -- Direct async function call
+ *
+ * @example
+ * ```tsx
+ * import { useGenerateImage } from '@tanstack/ai-solid'
+ * import { fetchServerSentEvents } from '@tanstack/ai-client'
+ *
+ * function ImageGenerator() {
+ *   const { generate, result, isLoading, error, reset } = useGenerateImage({
+ *     connection: fetchServerSentEvents('/api/generate/image'),
+ *   })
+ *
+ *   return (
+ *     <div>
+ *       <button onClick={() => generate({ prompt: 'A sunset over mountains' })}>
+ *         Generate
+ *       </button>
+ *       {isLoading() && <p>Generating...</p>}
+ *       {error() && <p>Error: {error()!.message}</p>}
+ *       {result()?.images.map((img, i) => (
+ *         <img src={img.url || `data:image/png;base64,${img.b64Json}`} />
+ *       ))}
+ *     </div>
+ *   )
+ * }
+ * ```
+ */
+declare function useGenerateImage<TTransformed = void>(options: Omit<UseGenerateImageOptions, 'onResult'> & {
+  onResult?: (result: ImageGenerationResult) => TTransformed;
+}): UseGenerateImageReturn<InferGenerationOutputFromReturn<ImageGenerationResult, TTransformed>>;
+//#endregion
+export { UseGenerateImageOptions, UseGenerateImageReturn, useGenerateImage };
+//# sourceMappingURL=use-generate-image.d.ts.map

package/dist/use-generate-image.js

@@ -0,0 +1,60 @@
+import { useGeneration } from "./use-generation.js";
+
+//#region src/use-generate-image.ts
+/**
+* Solid hook for generating images using AI models.
+*
+* Supports two transport modes:
+* - **ConnectConnectionAdapter** -- Streaming transport (SSE, HTTP stream, custom)
+* - **Fetcher** -- Direct async function call
+*
+* @example
+* ```tsx
+* import { useGenerateImage } from '@tanstack/ai-solid'
+* import { fetchServerSentEvents } from '@tanstack/ai-client'
+*
+* function ImageGenerator() {
+*   const { generate, result, isLoading, error, reset } = useGenerateImage({
+*     connection: fetchServerSentEvents('/api/generate/image'),
+*   })
+*
+*   return (
+*     <div>
+*       <button onClick={() => generate({ prompt: 'A sunset over mountains' })}>
+*         Generate
+*       </button>
+*       {isLoading() && <p>Generating...</p>}
+*       {error() && <p>Error: {error()!.message}</p>}
+*       {result()?.images.map((img, i) => (
+*         <img src={img.url || `data:image/png;base64,${img.b64Json}`} />
+*       ))}
+*     </div>
+*   )
+* }
+* ```
+*/
+function useGenerateImage(options) {
+	const devtools = {
+		...options.devtools,
+		framework: "solid",
+		hookName: "useGenerateImage",
+		outputKind: "image"
+	};
+	const { generate, result, isLoading, error, status, stop, reset } = useGeneration({
+		...options,
+		devtools
+	});
+	return {
+		generate,
+		result,
+		isLoading,
+		error,
+		status,
+		stop,
+		reset
+	};
+}
+
+//#endregion
+export { useGenerateImage };
+//# sourceMappingURL=use-generate-image.js.map

package/dist/use-generate-image.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-generate-image.js","names":[],"sources":["../src/use-generate-image.ts"],"sourcesContent":["import { useGeneration } from './use-generation'\nimport type { ImageGenerationResult, StreamChunk } from '@tanstack/ai'\nimport type {\n  AIDevtoolsDisplayOptions,\n  ConnectConnectionAdapter,\n  GenerationClientState,\n  GenerationFetcher,\n  ImageGenerateInput,\n  InferGenerationOutputFromReturn,\n} from '@tanstack/ai-client'\nimport type { Accessor } from 'solid-js'\n\n/**\n * Options for the useGenerateImage hook.\n *\n * @template TOutput - The transformed output type (defaults to ImageGenerationResult)\n */\nexport interface UseGenerateImageOptions<TOutput = ImageGenerationResult> {\n  /** Connect-based adapter for streaming transport (SSE, HTTP stream, custom) */\n  connection?: ConnectConnectionAdapter\n  /** Direct async function for image generation */\n  fetcher?: GenerationFetcher<ImageGenerateInput, ImageGenerationResult>\n  /** Unique identifier for this generation instance */\n  id?: string\n  /** Additional body parameters to send with connect-based adapter requests */\n  body?: Record<string, any>\n  /** Display options for TanStack AI Devtools. */\n  devtools?: AIDevtoolsDisplayOptions\n  /**\n   * Callback when images are generated. Can optionally return a transformed value.\n   *\n   * - Return a non-null value to transform and store it as the result\n   * - Return `null` to keep the previous result unchanged\n   * - Return nothing (`void`) to store the raw result as-is\n   */\n  onResult?: (result: ImageGenerationResult) => TOutput | null | void\n  /** Callback when an error occurs */\n  onError?: (error: Error) => void\n  /** Callback when progress is reported (0-100) */\n  onProgress?: (progress: number, message?: string) => void\n  /** Callback for each stream chunk (connect-based adapter mode only) */\n  onChunk?: (chunk: StreamChunk) => void\n}\n\n/**\n * Return type for the useGenerateImage hook.\n *\n * @template TOutput - The transformed output type (defaults to ImageGenerationResult)\n */\nexport interface UseGenerateImageReturn<TOutput = ImageGenerationResult> {\n  /** Trigger image generation */\n  generate: (input: ImageGenerateInput) => Promise<void>\n  /** The generation result containing images, or null */\n  result: Accessor<TOutput | null>\n  /** Whether generation is in progress */\n  isLoading: Accessor<boolean>\n  /** Current error, if any */\n  error: Accessor<Error | undefined>\n  /** Current state of the generation */\n  status: Accessor<GenerationClientState>\n  /** Abort the current generation */\n  stop: () => void\n  /** Clear result, error, and return to idle */\n  reset: () => void\n}\n\n/**\n * Solid hook for generating images using AI models.\n *\n * Supports two transport modes:\n * - **ConnectConnectionAdapter** -- Streaming transport (SSE, HTTP stream, custom)\n * - **Fetcher** -- Direct async function call\n *\n * @example\n * ```tsx\n * import { useGenerateImage } from '@tanstack/ai-solid'\n * import { fetchServerSentEvents } from '@tanstack/ai-client'\n *\n * function ImageGenerator() {\n *   const { generate, result, isLoading, error, reset } = useGenerateImage({\n *     connection: fetchServerSentEvents('/api/generate/image'),\n *   })\n *\n *   return (\n *     <div>\n *       <button onClick={() => generate({ prompt: 'A sunset over mountains' })}>\n *         Generate\n *       </button>\n *       {isLoading() && <p>Generating...</p>}\n *       {error() && <p>Error: {error()!.message}</p>}\n *       {result()?.images.map((img, i) => (\n *         <img src={img.url || `data:image/png;base64,${img.b64Json}`} />\n *       ))}\n *     </div>\n *   )\n * }\n * ```\n */\nexport function useGenerateImage<TTransformed = void>(\n  options: Omit<UseGenerateImageOptions, 'onResult'> & {\n    onResult?: (result: ImageGenerationResult) => TTransformed\n  },\n): UseGenerateImageReturn<\n  InferGenerationOutputFromReturn<ImageGenerationResult, TTransformed>\n> {\n  const devtools = {\n    ...options.devtools,\n    framework: 'solid',\n    hookName: 'useGenerateImage',\n    outputKind: 'image' as const,\n  }\n  const { generate, result, isLoading, error, status, stop, reset } =\n    useGeneration<ImageGenerateInput, ImageGenerationResult, TTransformed>({\n      ...options,\n      devtools,\n    })\n\n  return {\n    generate: generate as (input: ImageGenerateInput) => Promise<void>,\n    result,\n    isLoading,\n    error,\n    status,\n    stop,\n    reset,\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkGA,SAAgB,iBACd,SAKA;CACA,MAAM,WAAW;EACf,GAAG,QAAQ;EACX,WAAW;EACX,UAAU;EACV,YAAY;EACb;CACD,MAAM,EAAE,UAAU,QAAQ,WAAW,OAAO,QAAQ,MAAM,UACxD,cAAuE;EACrE,GAAG;EACH;EACD,CAAC;AAEJ,QAAO;EACK;EACV;EACA;EACA;EACA;EACA;EACA;EACD"}

package/dist/use-generate-speech.d.ts

@@ -0,0 +1,90 @@
+import { Accessor } from "solid-js";
+import { AIDevtoolsDisplayOptions, ConnectConnectionAdapter, GenerationClientState, GenerationFetcher, InferGenerationOutputFromReturn, SpeechGenerateInput } from "@tanstack/ai-client";
+import { StreamChunk, TTSResult } from "@tanstack/ai";
+
+//#region src/use-generate-speech.d.ts
+
+/**
+ * Options for the useGenerateSpeech hook.
+ *
+ * @template TOutput - The transformed output type (defaults to TTSResult)
+ */
+interface UseGenerateSpeechOptions<TOutput = TTSResult> {
+  /** Connect-based adapter for streaming transport (SSE, HTTP stream, custom) */
+  connection?: ConnectConnectionAdapter;
+  /** Direct async function for speech generation */
+  fetcher?: GenerationFetcher<SpeechGenerateInput, TTSResult>;
+  /** Unique identifier for this generation instance */
+  id?: string;
+  /** Additional body parameters to send with connect-based adapter requests */
+  body?: Record<string, any>;
+  /** Display options for TanStack AI Devtools. */
+  devtools?: AIDevtoolsDisplayOptions;
+  /**
+   * Callback when speech is generated. Can optionally return a transformed value.
+   *
+   * - Return a non-null value to transform and store it as the result
+   * - Return `null` to keep the previous result unchanged
+   * - Return nothing (`void`) to store the raw result as-is
+   */
+  onResult?: (result: TTSResult) => TOutput | null | void;
+  /** Callback when an error occurs */
+  onError?: (error: Error) => void;
+  /** Callback when progress is reported (0-100) */
+  onProgress?: (progress: number, message?: string) => void;
+  /** Callback for each stream chunk (connect-based adapter mode only) */
+  onChunk?: (chunk: StreamChunk) => void;
+}
+/**
+ * Return type for the useGenerateSpeech hook.
+ *
+ * @template TOutput - The transformed output type (defaults to TTSResult)
+ */
+interface UseGenerateSpeechReturn<TOutput = TTSResult> {
+  /** Trigger speech generation */
+  generate: (input: SpeechGenerateInput) => Promise<void>;
+  /** The TTS result containing audio data, or null */
+  result: Accessor<TOutput | null>;
+  /** Whether generation is in progress */
+  isLoading: Accessor<boolean>;
+  /** Current error, if any */
+  error: Accessor<Error | undefined>;
+  /** Current state of the generation */
+  status: Accessor<GenerationClientState>;
+  /** Abort the current generation */
+  stop: () => void;
+  /** Clear result, error, and return to idle */
+  reset: () => void;
+}
+/**
+ * Solid hook for generating speech (text-to-speech) using AI models.
+ *
+ * @example
+ * ```tsx
+ * import { useGenerateSpeech } from '@tanstack/ai-solid'
+ * import { fetchServerSentEvents } from '@tanstack/ai-client'
+ *
+ * function SpeechGenerator() {
+ *   const { generate, result, isLoading } = useGenerateSpeech({
+ *     connection: fetchServerSentEvents('/api/generate/speech'),
+ *   })
+ *
+ *   return (
+ *     <div>
+ *       <button onClick={() => generate({ text: 'Hello world', voice: 'alloy' })}>
+ *         Generate Speech
+ *       </button>
+ *       {result() && (
+ *         <audio src={`data:audio/${result()!.format};base64,${result()!.audio}`} controls />
+ *       )}
+ *     </div>
+ *   )
+ * }
+ * ```
+ */
+declare function useGenerateSpeech<TTransformed = void>(options: Omit<UseGenerateSpeechOptions, 'onResult'> & {
+  onResult?: (result: TTSResult) => TTransformed;
+}): UseGenerateSpeechReturn<InferGenerationOutputFromReturn<TTSResult, TTransformed>>;
+//#endregion
+export { UseGenerateSpeechOptions, UseGenerateSpeechReturn, useGenerateSpeech };
+//# sourceMappingURL=use-generate-speech.d.ts.map

package/dist/use-generate-speech.js

@@ -0,0 +1,54 @@
+import { useGeneration } from "./use-generation.js";
+
+//#region src/use-generate-speech.ts
+/**
+* Solid hook for generating speech (text-to-speech) using AI models.
+*
+* @example
+* ```tsx
+* import { useGenerateSpeech } from '@tanstack/ai-solid'
+* import { fetchServerSentEvents } from '@tanstack/ai-client'
+*
+* function SpeechGenerator() {
+*   const { generate, result, isLoading } = useGenerateSpeech({
+*     connection: fetchServerSentEvents('/api/generate/speech'),
+*   })
+*
+*   return (
+*     <div>
+*       <button onClick={() => generate({ text: 'Hello world', voice: 'alloy' })}>
+*         Generate Speech
+*       </button>
+*       {result() && (
+*         <audio src={`data:audio/${result()!.format};base64,${result()!.audio}`} controls />
+*       )}
+*     </div>
+*   )
+* }
+* ```
+*/
+function useGenerateSpeech(options) {
+	const devtools = {
+		...options.devtools,
+		framework: "solid",
+		hookName: "useGenerateSpeech",
+		outputKind: "audio"
+	};
+	const { generate, result, isLoading, error, status, stop, reset } = useGeneration({
+		...options,
+		devtools
+	});
+	return {
+		generate,
+		result,
+		isLoading,
+		error,
+		status,
+		stop,
+		reset
+	};
+}
+
+//#endregion
+export { useGenerateSpeech };
+//# sourceMappingURL=use-generate-speech.js.map

package/dist/use-generate-speech.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-generate-speech.js","names":[],"sources":["../src/use-generate-speech.ts"],"sourcesContent":["import { useGeneration } from './use-generation'\nimport type { StreamChunk, TTSResult } from '@tanstack/ai'\nimport type {\n  AIDevtoolsDisplayOptions,\n  ConnectConnectionAdapter,\n  GenerationClientState,\n  GenerationFetcher,\n  InferGenerationOutputFromReturn,\n  SpeechGenerateInput,\n} from '@tanstack/ai-client'\nimport type { Accessor } from 'solid-js'\n\n/**\n * Options for the useGenerateSpeech hook.\n *\n * @template TOutput - The transformed output type (defaults to TTSResult)\n */\nexport interface UseGenerateSpeechOptions<TOutput = TTSResult> {\n  /** Connect-based adapter for streaming transport (SSE, HTTP stream, custom) */\n  connection?: ConnectConnectionAdapter\n  /** Direct async function for speech generation */\n  fetcher?: GenerationFetcher<SpeechGenerateInput, TTSResult>\n  /** Unique identifier for this generation instance */\n  id?: string\n  /** Additional body parameters to send with connect-based adapter requests */\n  body?: Record<string, any>\n  /** Display options for TanStack AI Devtools. */\n  devtools?: AIDevtoolsDisplayOptions\n  /**\n   * Callback when speech is generated. Can optionally return a transformed value.\n   *\n   * - Return a non-null value to transform and store it as the result\n   * - Return `null` to keep the previous result unchanged\n   * - Return nothing (`void`) to store the raw result as-is\n   */\n  onResult?: (result: TTSResult) => TOutput | null | void\n  /** Callback when an error occurs */\n  onError?: (error: Error) => void\n  /** Callback when progress is reported (0-100) */\n  onProgress?: (progress: number, message?: string) => void\n  /** Callback for each stream chunk (connect-based adapter mode only) */\n  onChunk?: (chunk: StreamChunk) => void\n}\n\n/**\n * Return type for the useGenerateSpeech hook.\n *\n * @template TOutput - The transformed output type (defaults to TTSResult)\n */\nexport interface UseGenerateSpeechReturn<TOutput = TTSResult> {\n  /** Trigger speech generation */\n  generate: (input: SpeechGenerateInput) => Promise<void>\n  /** The TTS result containing audio data, or null */\n  result: Accessor<TOutput | null>\n  /** Whether generation is in progress */\n  isLoading: Accessor<boolean>\n  /** Current error, if any */\n  error: Accessor<Error | undefined>\n  /** Current state of the generation */\n  status: Accessor<GenerationClientState>\n  /** Abort the current generation */\n  stop: () => void\n  /** Clear result, error, and return to idle */\n  reset: () => void\n}\n\n/**\n * Solid hook for generating speech (text-to-speech) using AI models.\n *\n * @example\n * ```tsx\n * import { useGenerateSpeech } from '@tanstack/ai-solid'\n * import { fetchServerSentEvents } from '@tanstack/ai-client'\n *\n * function SpeechGenerator() {\n *   const { generate, result, isLoading } = useGenerateSpeech({\n *     connection: fetchServerSentEvents('/api/generate/speech'),\n *   })\n *\n *   return (\n *     <div>\n *       <button onClick={() => generate({ text: 'Hello world', voice: 'alloy' })}>\n *         Generate Speech\n *       </button>\n *       {result() && (\n *         <audio src={`data:audio/${result()!.format};base64,${result()!.audio}`} controls />\n *       )}\n *     </div>\n *   )\n * }\n * ```\n */\nexport function useGenerateSpeech<TTransformed = void>(\n  options: Omit<UseGenerateSpeechOptions, 'onResult'> & {\n    onResult?: (result: TTSResult) => TTransformed\n  },\n): UseGenerateSpeechReturn<\n  InferGenerationOutputFromReturn<TTSResult, TTransformed>\n> {\n  const devtools = {\n    ...options.devtools,\n    framework: 'solid',\n    hookName: 'useGenerateSpeech',\n    outputKind: 'audio' as const,\n  }\n  const { generate, result, isLoading, error, status, stop, reset } =\n    useGeneration<SpeechGenerateInput, TTSResult, TTransformed>({\n      ...options,\n      devtools,\n    })\n\n  return {\n    generate: generate as (input: SpeechGenerateInput) => Promise<void>,\n    result,\n    isLoading,\n    error,\n    status,\n    stop,\n    reset,\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4FA,SAAgB,kBACd,SAKA;CACA,MAAM,WAAW;EACf,GAAG,QAAQ;EACX,WAAW;EACX,UAAU;EACV,YAAY;EACb;CACD,MAAM,EAAE,UAAU,QAAQ,WAAW,OAAO,QAAQ,MAAM,UACxD,cAA4D;EAC1D,GAAG;EACH;EACD,CAAC;AAEJ,QAAO;EACK;EACV;EACA;EACA;EACA;EACA;EACA;EACD"}

package/dist/use-generate-video.d.ts

@@ -0,0 +1,103 @@
+import { Accessor } from "solid-js";
+import { AIDevtoolsDisplayOptions, ConnectConnectionAdapter, GenerationClientState, GenerationFetcher, InferGenerationOutputFromReturn, VideoGenerateInput, VideoGenerateResult, VideoStatusInfo } from "@tanstack/ai-client";
+import { StreamChunk } from "@tanstack/ai";
+
+//#region src/use-generate-video.d.ts
+
+/**
+ * Options for the useGenerateVideo hook.
+ *
+ * @template TOutput - The transformed output type (defaults to VideoGenerateResult)
+ */
+interface UseGenerateVideoOptions<TOutput = VideoGenerateResult> {
+  /** Connect-based adapter for streaming transport (server handles polling) */
+  connection?: ConnectConnectionAdapter;
+  /** Direct async function that returns a completed video result */
+  fetcher?: GenerationFetcher<VideoGenerateInput, VideoGenerateResult>;
+  /** Unique identifier for this generation instance */
+  id?: string;
+  /** Additional body parameters to send with connect-based adapter requests */
+  body?: Record<string, any>;
+  /** Display options for TanStack AI Devtools. */
+  devtools?: AIDevtoolsDisplayOptions;
+  /**
+   * Callback when video generation completes. Can optionally return a transformed value.
+   *
+   * - Return a non-null value to transform and store it as the result
+   * - Return `null` to keep the previous result unchanged
+   * - Return nothing (`void`) to store the raw result as-is
+   */
+  onResult?: (result: VideoGenerateResult) => TOutput | null | void;
+  /** Callback when an error occurs */
+  onError?: (error: Error) => void;
+  /** Callback when progress is reported (0-100) */
+  onProgress?: (progress: number, message?: string) => void;
+  /** Callback when a video job is created */
+  onJobCreated?: (jobId: string) => void;
+  /** Callback on each status update */
+  onStatusUpdate?: (status: VideoStatusInfo) => void;
+  /** Callback for each stream chunk (connect-based adapter mode only) */
+  onChunk?: (chunk: StreamChunk) => void;
+}
+/**
+ * Return type for the useGenerateVideo hook.
+ *
+ * @template TOutput - The transformed output type (defaults to VideoGenerateResult)
+ */
+interface UseGenerateVideoReturn<TOutput = VideoGenerateResult> {
+  /** Trigger video generation */
+  generate: (input: VideoGenerateInput) => Promise<void>;
+  /** The final video result (with URL), or null */
+  result: Accessor<TOutput | null>;
+  /** The current job ID, or null */
+  jobId: Accessor<string | null>;
+  /** Current video generation status info, or null */
+  videoStatus: Accessor<VideoStatusInfo | null>;
+  /** Whether generation/polling is in progress */
+  isLoading: Accessor<boolean>;
+  /** Current error, if any */
+  error: Accessor<Error | undefined>;
+  /** Current state of the generation */
+  status: Accessor<GenerationClientState>;
+  /** Abort the current generation/polling */
+  stop: () => void;
+  /** Clear all state and return to idle */
+  reset: () => void;
+}
+/**
+ * Solid hook for generating videos using AI models.
+ *
+ * Video generation is asynchronous: a job is created, then polled for status
+ * until completion. This hook handles the full lifecycle.
+ *
+ * @example
+ * ```tsx
+ * import { useGenerateVideo } from '@tanstack/ai-solid'
+ * import { fetchServerSentEvents } from '@tanstack/ai-client'
+ *
+ * function VideoGenerator() {
+ *   const { generate, result, videoStatus, isLoading } = useGenerateVideo({
+ *     connection: fetchServerSentEvents('/api/generate/video'),
+ *     onStatusUpdate: (status) => console.log(`Progress: ${status.progress}%`),
+ *   })
+ *
+ *   return (
+ *     <div>
+ *       <button onClick={() => generate({ prompt: 'A flying car over a city' })}>
+ *         Generate Video
+ *       </button>
+ *       {isLoading() && videoStatus() && (
+ *         <p>Status: {videoStatus()!.status} ({videoStatus()!.progress}%)</p>
+ *       )}
+ *       {result() && <video src={result()!.url} controls />}
+ *     </div>
+ *   )
+ * }
+ * ```
+ */
+declare function useGenerateVideo<TTransformed = void>(options: Omit<UseGenerateVideoOptions, 'onResult'> & {
+  onResult?: (result: VideoGenerateResult) => TTransformed;
+}): UseGenerateVideoReturn<InferGenerationOutputFromReturn<VideoGenerateResult, TTransformed>>;
+//#endregion
+export { UseGenerateVideoOptions, UseGenerateVideoReturn, useGenerateVideo };
+//# sourceMappingURL=use-generate-video.d.ts.map

package/dist/use-generate-video.js

@@ -0,0 +1,114 @@
+import { createEffect, createMemo, createSignal, createUniqueId, onCleanup, onMount } from "solid-js";
+import { VideoGenerationClient } from "@tanstack/ai-client";
+import { createVideoDevtoolsBridge } from "@tanstack/ai-client/devtools";
+
+//#region src/use-generate-video.ts
+/**
+* Solid hook for generating videos using AI models.
+*
+* Video generation is asynchronous: a job is created, then polled for status
+* until completion. This hook handles the full lifecycle.
+*
+* @example
+* ```tsx
+* import { useGenerateVideo } from '@tanstack/ai-solid'
+* import { fetchServerSentEvents } from '@tanstack/ai-client'
+*
+* function VideoGenerator() {
+*   const { generate, result, videoStatus, isLoading } = useGenerateVideo({
+*     connection: fetchServerSentEvents('/api/generate/video'),
+*     onStatusUpdate: (status) => console.log(`Progress: ${status.progress}%`),
+*   })
+*
+*   return (
+*     <div>
+*       <button onClick={() => generate({ prompt: 'A flying car over a city' })}>
+*         Generate Video
+*       </button>
+*       {isLoading() && videoStatus() && (
+*         <p>Status: {videoStatus()!.status} ({videoStatus()!.progress}%)</p>
+*       )}
+*       {result() && <video src={result()!.url} controls />}
+*     </div>
+*   )
+* }
+* ```
+*/
+function useGenerateVideo(options) {
+	const hookId = createUniqueId();
+	const clientId = options.id || hookId;
+	const [result, setResult] = createSignal(null);
+	const [jobId, setJobId] = createSignal(null);
+	const [videoStatus, setVideoStatus] = createSignal(null);
+	const [isLoading, setIsLoading] = createSignal(false);
+	const [error, setError] = createSignal(void 0);
+	const [status, setStatus] = createSignal("idle");
+	const client = createMemo(() => {
+		const baseOptions = {
+			id: clientId,
+			body: options.body,
+			devtoolsBridgeFactory: createVideoDevtoolsBridge,
+			devtools: {
+				...options.devtools,
+				framework: "solid",
+				hookName: "useGenerateVideo",
+				outputKind: "video"
+			},
+			onResult: ((r) => options.onResult?.(r)),
+			onError: (e) => options.onError?.(e),
+			onProgress: (p, m) => options.onProgress?.(p, m),
+			onChunk: (c) => options.onChunk?.(c),
+			onJobCreated: (id) => options.onJobCreated?.(id),
+			onStatusUpdate: (s) => options.onStatusUpdate?.(s),
+			onResultChange: setResult,
+			onLoadingChange: setIsLoading,
+			onErrorChange: setError,
+			onStatusChange: setStatus,
+			onJobIdChange: setJobId,
+			onVideoStatusChange: setVideoStatus
+		};
+		if (options.connection) return new VideoGenerationClient({
+			...baseOptions,
+			connection: options.connection
+		});
+		if (options.fetcher) return new VideoGenerationClient({
+			...baseOptions,
+			fetcher: options.fetcher
+		});
+		throw new Error("useGenerateVideo requires either a connection or fetcher option");
+	}, [clientId]);
+	createEffect(() => {
+		const currentBody = options.body;
+		client().updateOptions({ ...currentBody !== void 0 && { body: currentBody } });
+	});
+	onMount(() => {
+		client().mountDevtools();
+	});
+	onCleanup(() => {
+		client().dispose();
+	});
+	const generate = async (input) => {
+		await client().generate(input);
+	};
+	const stop = () => {
+		client().stop();
+	};
+	const reset = () => {
+		client().reset();
+	};
+	return {
+		generate,
+		result,
+		jobId,
+		videoStatus,
+		isLoading,
+		error,
+		status,
+		stop,
+		reset
+	};
+}
+
+//#endregion
+export { useGenerateVideo };
+//# sourceMappingURL=use-generate-video.js.map

package/dist/use-generate-video.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-generate-video.js","names":[],"sources":["../src/use-generate-video.ts"],"sourcesContent":["import { VideoGenerationClient } from '@tanstack/ai-client'\nimport { createVideoDevtoolsBridge } from '@tanstack/ai-client/devtools'\nimport {\n  createEffect,\n  createMemo,\n  createSignal,\n  createUniqueId,\n  onCleanup,\n  onMount,\n} from 'solid-js'\nimport type { StreamChunk } from '@tanstack/ai'\nimport type {\n  AIDevtoolsDisplayOptions,\n  ConnectConnectionAdapter,\n  GenerationClientState,\n  GenerationFetcher,\n  InferGenerationOutputFromReturn,\n  VideoGenerateInput,\n  VideoGenerateResult,\n  VideoStatusInfo,\n} from '@tanstack/ai-client'\nimport type { Accessor } from 'solid-js'\n\n/**\n * Options for the useGenerateVideo hook.\n *\n * @template TOutput - The transformed output type (defaults to VideoGenerateResult)\n */\nexport interface UseGenerateVideoOptions<TOutput = VideoGenerateResult> {\n  /** Connect-based adapter for streaming transport (server handles polling) */\n  connection?: ConnectConnectionAdapter\n  /** Direct async function that returns a completed video result */\n  fetcher?: GenerationFetcher<VideoGenerateInput, VideoGenerateResult>\n  /** Unique identifier for this generation instance */\n  id?: string\n  /** Additional body parameters to send with connect-based adapter requests */\n  body?: Record<string, any>\n  /** Display options for TanStack AI Devtools. */\n  devtools?: AIDevtoolsDisplayOptions\n  /**\n   * Callback when video generation completes. Can optionally return a transformed value.\n   *\n   * - Return a non-null value to transform and store it as the result\n   * - Return `null` to keep the previous result unchanged\n   * - Return nothing (`void`) to store the raw result as-is\n   */\n  onResult?: (result: VideoGenerateResult) => TOutput | null | void\n  /** Callback when an error occurs */\n  onError?: (error: Error) => void\n  /** Callback when progress is reported (0-100) */\n  onProgress?: (progress: number, message?: string) => void\n  /** Callback when a video job is created */\n  onJobCreated?: (jobId: string) => void\n  /** Callback on each status update */\n  onStatusUpdate?: (status: VideoStatusInfo) => void\n  /** Callback for each stream chunk (connect-based adapter mode only) */\n  onChunk?: (chunk: StreamChunk) => void\n}\n\n/**\n * Return type for the useGenerateVideo hook.\n *\n * @template TOutput - The transformed output type (defaults to VideoGenerateResult)\n */\nexport interface UseGenerateVideoReturn<TOutput = VideoGenerateResult> {\n  /** Trigger video generation */\n  generate: (input: VideoGenerateInput) => Promise<void>\n  /** The final video result (with URL), or null */\n  result: Accessor<TOutput | null>\n  /** The current job ID, or null */\n  jobId: Accessor<string | null>\n  /** Current video generation status info, or null */\n  videoStatus: Accessor<VideoStatusInfo | null>\n  /** Whether generation/polling is in progress */\n  isLoading: Accessor<boolean>\n  /** Current error, if any */\n  error: Accessor<Error | undefined>\n  /** Current state of the generation */\n  status: Accessor<GenerationClientState>\n  /** Abort the current generation/polling */\n  stop: () => void\n  /** Clear all state and return to idle */\n  reset: () => void\n}\n\n/**\n * Solid hook for generating videos using AI models.\n *\n * Video generation is asynchronous: a job is created, then polled for status\n * until completion. This hook handles the full lifecycle.\n *\n * @example\n * ```tsx\n * import { useGenerateVideo } from '@tanstack/ai-solid'\n * import { fetchServerSentEvents } from '@tanstack/ai-client'\n *\n * function VideoGenerator() {\n *   const { generate, result, videoStatus, isLoading } = useGenerateVideo({\n *     connection: fetchServerSentEvents('/api/generate/video'),\n *     onStatusUpdate: (status) => console.log(`Progress: ${status.progress}%`),\n *   })\n *\n *   return (\n *     <div>\n *       <button onClick={() => generate({ prompt: 'A flying car over a city' })}>\n *         Generate Video\n *       </button>\n *       {isLoading() && videoStatus() && (\n *         <p>Status: {videoStatus()!.status} ({videoStatus()!.progress}%)</p>\n *       )}\n *       {result() && <video src={result()!.url} controls />}\n *     </div>\n *   )\n * }\n * ```\n */\n// `TTransformed` infers from the `onResult` return position so the callback\n// parameter is typed as `VideoGenerateResult` and `result` narrows to the\n// transform's return. See issue #848.\nexport function useGenerateVideo<TTransformed = void>(\n  options: Omit<UseGenerateVideoOptions, 'onResult'> & {\n    onResult?: (result: VideoGenerateResult) => TTransformed\n  },\n): UseGenerateVideoReturn<\n  InferGenerationOutputFromReturn<VideoGenerateResult, TTransformed>\n> {\n  type TOutput = InferGenerationOutputFromReturn<\n    VideoGenerateResult,\n    TTransformed\n  >\n  const hookId = createUniqueId()\n  const clientId = options.id || hookId\n\n  const [result, setResult] = createSignal<TOutput | null>(null)\n  const [jobId, setJobId] = createSignal<string | null>(null)\n  const [videoStatus, setVideoStatus] = createSignal<VideoStatusInfo | null>(\n    null,\n  )\n  const [isLoading, setIsLoading] = createSignal(false)\n  const [error, setError] = createSignal<Error | undefined>(undefined)\n  const [status, setStatus] = createSignal<GenerationClientState>('idle')\n\n  const client = createMemo(() => {\n    // Conditional spread on `body`: VideoGenerationClientOptions.body\n    // is a strict optional; EOPT forbids passing `T | undefined`.\n    const baseOptions = {\n      id: clientId,\n      body: options.body,\n      devtoolsBridgeFactory: createVideoDevtoolsBridge,\n      devtools: {\n        ...options.devtools,\n        framework: 'solid',\n        hookName: 'useGenerateVideo',\n        outputKind: 'video' as const,\n      },\n      // The transform's raw return type (`TTransformed`) and the stored output\n      // (`TOutput`, with null/void/undefined stripped) are identical at runtime;\n      // the cast bridges the relationship that the conditional type hides.\n      onResult: ((r: VideoGenerateResult) => options.onResult?.(r)) as (\n        result: VideoGenerateResult,\n      ) => TOutput | null | void,\n      onError: (e: Error) => options.onError?.(e),\n      onProgress: (p: number, m?: string) => options.onProgress?.(p, m),\n      onChunk: (c: StreamChunk) => options.onChunk?.(c),\n      onJobCreated: (id: string) => options.onJobCreated?.(id),\n      onStatusUpdate: (s: VideoStatusInfo) => options.onStatusUpdate?.(s),\n      onResultChange: setResult,\n      onLoadingChange: setIsLoading,\n      onErrorChange: setError,\n      onStatusChange: setStatus,\n      onJobIdChange: setJobId,\n      onVideoStatusChange: setVideoStatus,\n    }\n\n    if (options.connection) {\n      return new VideoGenerationClient<TOutput>({\n        ...baseOptions,\n        connection: options.connection,\n      })\n    }\n\n    if (options.fetcher) {\n      return new VideoGenerationClient<TOutput>({\n        ...baseOptions,\n        fetcher: options.fetcher,\n      })\n    }\n\n    throw new Error(\n      'useGenerateVideo requires either a connection or fetcher option',\n    )\n  }, [clientId])\n\n  // Sync body changes without recreating client\n  createEffect(() => {\n    const currentBody = options.body\n    client().updateOptions({\n      ...(currentBody !== undefined && { body: currentBody }),\n    })\n  })\n\n  onMount(() => {\n    client().mountDevtools()\n  })\n\n  // Cleanup on unmount: stop any in-flight requests and unregister devtools\n  onCleanup(() => {\n    client().dispose()\n  })\n\n  const generate = async (input: VideoGenerateInput) => {\n    await client().generate(input)\n  }\n\n  const stop = () => {\n    client().stop()\n  }\n\n  const reset = () => {\n    client().reset()\n  }\n\n  return {\n    generate,\n    result,\n    jobId,\n    videoStatus,\n    isLoading,\n    error,\n    status,\n    stop,\n    reset,\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuHA,SAAgB,iBACd,SAKA;CAKA,MAAM,SAAS,gBAAgB;CAC/B,MAAM,WAAW,QAAQ,MAAM;CAE/B,MAAM,CAAC,QAAQ,aAAa,aAA6B,KAAK;CAC9D,MAAM,CAAC,OAAO,YAAY,aAA4B,KAAK;CAC3D,MAAM,CAAC,aAAa,kBAAkB,aACpC,KACD;CACD,MAAM,CAAC,WAAW,gBAAgB,aAAa,MAAM;CACrD,MAAM,CAAC,OAAO,YAAY,aAAgC,OAAU;CACpE,MAAM,CAAC,QAAQ,aAAa,aAAoC,OAAO;CAEvE,MAAM,SAAS,iBAAiB;EAG9B,MAAM,cAAc;GAClB,IAAI;GACJ,MAAM,QAAQ;GACd,uBAAuB;GACvB,UAAU;IACR,GAAG,QAAQ;IACX,WAAW;IACX,UAAU;IACV,YAAY;IACb;GAID,YAAY,MAA2B,QAAQ,WAAW,EAAE;GAG5D,UAAU,MAAa,QAAQ,UAAU,EAAE;GAC3C,aAAa,GAAW,MAAe,QAAQ,aAAa,GAAG,EAAE;GACjE,UAAU,MAAmB,QAAQ,UAAU,EAAE;GACjD,eAAe,OAAe,QAAQ,eAAe,GAAG;GACxD,iBAAiB,MAAuB,QAAQ,iBAAiB,EAAE;GACnE,gBAAgB;GAChB,iBAAiB;GACjB,eAAe;GACf,gBAAgB;GAChB,eAAe;GACf,qBAAqB;GACtB;AAED,MAAI,QAAQ,WACV,QAAO,IAAI,sBAA+B;GACxC,GAAG;GACH,YAAY,QAAQ;GACrB,CAAC;AAGJ,MAAI,QAAQ,QACV,QAAO,IAAI,sBAA+B;GACxC,GAAG;GACH,SAAS,QAAQ;GAClB,CAAC;AAGJ,QAAM,IAAI,MACR,kEACD;IACA,CAAC,SAAS,CAAC;AAGd,oBAAmB;EACjB,MAAM,cAAc,QAAQ;AAC5B,UAAQ,CAAC,cAAc,EACrB,GAAI,gBAAgB,UAAa,EAAE,MAAM,aAAa,EACvD,CAAC;GACF;AAEF,eAAc;AACZ,UAAQ,CAAC,eAAe;GACxB;AAGF,iBAAgB;AACd,UAAQ,CAAC,SAAS;GAClB;CAEF,MAAM,WAAW,OAAO,UAA8B;AACpD,QAAM,QAAQ,CAAC,SAAS,MAAM;;CAGhC,MAAM,aAAa;AACjB,UAAQ,CAAC,MAAM;;CAGjB,MAAM,cAAc;AAClB,UAAQ,CAAC,OAAO;;AAGlB,QAAO;EACL;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD"}

package/dist/use-generation.d.ts

@@ -0,0 +1,88 @@
+import { Accessor } from "solid-js";
+import { AIDevtoolsDisplayOptions, ConnectConnectionAdapter, GenerationClientState, GenerationFetcher, InferGenerationOutputFromReturn } from "@tanstack/ai-client";
+import { StreamChunk } from "@tanstack/ai";
+
+//#region src/use-generation.d.ts
+
+/**
+ * Options for the useGeneration hook.
+ *
+ * Accepts either a `connection` (streaming transport) or a `fetcher` (direct async call).
+ *
+ * @template TInput - The input type for the generation request
+ * @template TResult - The result type returned by the generation
+ * @template TOutput - The transformed output type (defaults to TResult)
+ */
+interface UseGenerationOptions<TInput, TResult, TOutput = TResult> {
+  /** Connect-based adapter for streaming transport (SSE, HTTP stream, custom) */
+  connection?: ConnectConnectionAdapter;
+  /** Direct async function for one-shot generation (no streaming protocol needed) */
+  fetcher?: GenerationFetcher<TInput, TResult>;
+  /** Unique identifier for this generation instance */
+  id?: string;
+  /** Additional body parameters to send with connect-based adapter requests */
+  body?: Record<string, any>;
+  /** Display options for TanStack AI Devtools. */
+  devtools?: AIDevtoolsDisplayOptions;
+  /**
+   * Callback when a result is received. Can optionally return a transformed value.
+   *
+   * - Return a non-null value to transform and store it as the result
+   * - Return `null` to keep the previous result unchanged
+   * - Return nothing (`void`) to store the raw result as-is
+   */
+  onResult?: (result: TResult) => TOutput | null | void;
+  /** Callback when an error occurs */
+  onError?: (error: Error) => void;
+  /** Callback when progress is reported (0-100) */
+  onProgress?: (progress: number, message?: string) => void;
+  /** Callback for each stream chunk (connect-based adapter mode only) */
+  onChunk?: (chunk: StreamChunk) => void;
+}
+/**
+ * Return type for the useGeneration hook.
+ *
+ * @template TOutput - The output type (possibly transformed from the raw result)
+ */
+interface UseGenerationReturn<TOutput> {
+  /** Trigger a generation request */
+  generate: (input: Record<string, any>) => Promise<void>;
+  /** The generation result, or null if not yet generated */
+  result: Accessor<TOutput | null>;
+  /** Whether a generation is currently in progress */
+  isLoading: Accessor<boolean>;
+  /** Current error, if any */
+  error: Accessor<Error | undefined>;
+  /** Current state of the generation client */
+  status: Accessor<GenerationClientState>;
+  /** Abort the current generation */
+  stop: () => void;
+  /** Clear result, error, and return to idle */
+  reset: () => void;
+}
+/**
+ * Generic Solid hook for one-shot generation tasks.
+ *
+ * This is the base hook used by `useGenerateImage`, `useGenerateSpeech`,
+ * `useTranscription`, and `useSummarize`. You can also use it directly
+ * for custom generation types.
+ *
+ * @template TInput - The input type for the generation request
+ * @template TResult - The result type returned by the generation
+ * @template TOutput - The transformed output type (defaults to TResult)
+ *
+ * @example
+ * ```tsx
+ * const { generate, result, isLoading } = useGeneration<MyInput, MyResult>({
+ *   connection: fetchServerSentEvents('/api/generate/custom'),
+ * })
+ *
+ * await generate({ prompt: 'Hello' })
+ * ```
+ */
+declare function useGeneration<TInput extends Record<string, any>, TResult, TTransformed = void>(options: Omit<UseGenerationOptions<TInput, TResult>, 'onResult'> & {
+  onResult?: (result: TResult) => TTransformed;
+}): UseGenerationReturn<InferGenerationOutputFromReturn<TResult, TTransformed>>;
+//#endregion
+export { UseGenerationOptions, UseGenerationReturn, useGeneration };
+//# sourceMappingURL=use-generation.d.ts.map