@tanstack/ai-solid 0.6.3 → 0.6.6

package/dist/use-generation.js

@@ -0,0 +1,86 @@
+import { createEffect, createMemo, createSignal, createUniqueId } from "solid-js";
+import { GenerationClient } from "@tanstack/ai-client";
+
+//#region src/use-generation.ts
+/**
+* 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' })
+* ```
+*/
+function useGeneration(options) {
+	const hookId = createUniqueId();
+	const clientId = options.id || hookId;
+	const [result, setResult] = createSignal(null);
+	const [isLoading, setIsLoading] = createSignal(false);
+	const [error, setError] = createSignal(void 0);
+	const [status, setStatus] = createSignal("idle");
+	const client = createMemo(() => {
+		const clientOptions = {
+			id: clientId,
+			body: options.body,
+			onResult: (r) => options.onResult?.(r),
+			onError: (e) => options.onError?.(e),
+			onProgress: (p, m) => options.onProgress?.(p, m),
+			onChunk: (c) => options.onChunk?.(c),
+			onResultChange: setResult,
+			onLoadingChange: setIsLoading,
+			onErrorChange: setError,
+			onStatusChange: setStatus
+		};
+		if (options.connection) return new GenerationClient({
+			...clientOptions,
+			connection: options.connection
+		});
+		if (options.fetcher) return new GenerationClient({
+			...clientOptions,
+			fetcher: options.fetcher
+		});
+		throw new Error("useGeneration requires either a connection or fetcher option");
+	}, [clientId]);
+	createEffect(() => {
+		const currentBody = options.body;
+		client().updateOptions({ body: currentBody });
+	});
+	createEffect(() => {
+		return () => {
+			client().stop();
+		};
+	});
+	const generate = async (input) => {
+		await client().generate(input);
+	};
+	const stop = () => {
+		client().stop();
+	};
+	const reset = () => {
+		client().reset();
+	};
+	return {
+		generate,
+		result,
+		isLoading,
+		error,
+		status,
+		stop,
+		reset
+	};
+}
+
+//#endregion
+export { useGeneration };
+//# sourceMappingURL=use-generation.js.map

package/dist/use-generation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-generation.js","names":["clientOptions: GenerationClientOptions<TInput, TResult, TOutput>"],"sources":["../src/use-generation.ts"],"sourcesContent":["import { GenerationClient } from '@tanstack/ai-client'\nimport {\n  createEffect,\n  createMemo,\n  createSignal,\n  createUniqueId,\n} from 'solid-js'\nimport type { StreamChunk } from '@tanstack/ai'\nimport type {\n  ConnectionAdapter,\n  GenerationClientOptions,\n  GenerationClientState,\n  GenerationFetcher,\n  InferGenerationOutput,\n} from '@tanstack/ai-client'\nimport type { Accessor } from 'solid-js'\n\n/**\n * Options for the useGeneration hook.\n *\n * Accepts either a `connection` (streaming transport) or a `fetcher` (direct async call).\n *\n * @template TInput - The input type for the generation request\n * @template TResult - The result type returned by the generation\n * @template TOutput - The transformed output type (defaults to TResult)\n */\nexport interface UseGenerationOptions<TInput, TResult, TOutput = TResult> {\n  /** Connection adapter for streaming transport (SSE, HTTP stream, custom) */\n  connection?: ConnectionAdapter\n  /** Direct async function for one-shot generation (no streaming protocol needed) */\n  fetcher?: GenerationFetcher<TInput, TResult>\n  /** Unique identifier for this generation instance */\n  id?: string\n  /** Additional body parameters to send with ConnectionAdapter requests */\n  body?: Record<string, any>\n  /**\n   * Callback when a result is received. 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: TResult) => 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 (ConnectionAdapter mode only) */\n  onChunk?: (chunk: StreamChunk) => void\n}\n\n/**\n * Return type for the useGeneration hook.\n *\n * @template TOutput - The output type (possibly transformed from the raw result)\n */\nexport interface UseGenerationReturn<TOutput> {\n  /** Trigger a generation request */\n  generate: (input: Record<string, any>) => Promise<void>\n  /** The generation result, or null if not yet generated */\n  result: Accessor<TOutput | null>\n  /** Whether a generation is currently in progress */\n  isLoading: Accessor<boolean>\n  /** Current error, if any */\n  error: Accessor<Error | undefined>\n  /** Current state of the generation client */\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 * Generic Solid hook for one-shot generation tasks.\n *\n * This is the base hook used by `useGenerateImage`, `useGenerateSpeech`,\n * `useTranscription`, and `useSummarize`. You can also use it directly\n * for custom generation types.\n *\n * @template TInput - The input type for the generation request\n * @template TResult - The result type returned by the generation\n * @template TOutput - The transformed output type (defaults to TResult)\n *\n * @example\n * ```tsx\n * const { generate, result, isLoading } = useGeneration<MyInput, MyResult>({\n *   connection: fetchServerSentEvents('/api/generate/custom'),\n * })\n *\n * await generate({ prompt: 'Hello' })\n * ```\n */\nexport function useGeneration<\n  TInput extends Record<string, any>,\n  TResult,\n  TOnResult extends ((result: TResult) => any) | undefined = undefined,\n>(\n  options: Omit<UseGenerationOptions<TInput, TResult>, 'onResult'> & {\n    onResult?: TOnResult\n  },\n): UseGenerationReturn<InferGenerationOutput<TResult, TOnResult>> {\n  type TOutput = InferGenerationOutput<TResult, TOnResult>\n  const hookId = createUniqueId()\n  const clientId = options.id || hookId\n\n  const [result, setResult] = createSignal<TOutput | null>(null)\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    const clientOptions: GenerationClientOptions<TInput, TResult, TOutput> = {\n      id: clientId,\n      body: options.body,\n      onResult: (r: TResult) => options.onResult?.(r),\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      onResultChange: setResult,\n      onLoadingChange: setIsLoading,\n      onErrorChange: setError,\n      onStatusChange: setStatus,\n    }\n\n    if (options.connection) {\n      return new GenerationClient<TInput, TResult, TOutput>({\n        ...clientOptions,\n        connection: options.connection,\n      })\n    }\n\n    if (options.fetcher) {\n      return new GenerationClient<TInput, TResult, TOutput>({\n        ...clientOptions,\n        fetcher: options.fetcher,\n      })\n    }\n\n    throw new Error(\n      'useGeneration 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({ body: currentBody })\n  })\n\n  // Cleanup on unmount: stop any in-flight requests\n  createEffect(() => {\n    return () => {\n      client().stop()\n    }\n  })\n\n  const generate = async (input: TInput) => {\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: generate as (input: Record<string, any>) => Promise<void>,\n    result,\n    isLoading,\n    error,\n    status,\n    stop,\n    reset,\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AA6FA,SAAgB,cAKd,SAGgE;CAEhE,MAAM,SAAS,gBAAgB;CAC/B,MAAM,WAAW,QAAQ,MAAM;CAE/B,MAAM,CAAC,QAAQ,aAAa,aAA6B,KAAK;CAC9D,MAAM,CAAC,WAAW,gBAAgB,aAAa,MAAM;CACrD,MAAM,CAAC,OAAO,YAAY,aAAgC,OAAU;CACpE,MAAM,CAAC,QAAQ,aAAa,aAAoC,OAAO;CAEvE,MAAM,SAAS,iBAAiB;EAC9B,MAAMA,gBAAmE;GACvE,IAAI;GACJ,MAAM,QAAQ;GACd,WAAW,MAAe,QAAQ,WAAW,EAAE;GAC/C,UAAU,MAAa,QAAQ,UAAU,EAAE;GAC3C,aAAa,GAAW,MAAe,QAAQ,aAAa,GAAG,EAAE;GACjE,UAAU,MAAmB,QAAQ,UAAU,EAAE;GACjD,gBAAgB;GAChB,iBAAiB;GACjB,eAAe;GACf,gBAAgB;GACjB;AAED,MAAI,QAAQ,WACV,QAAO,IAAI,iBAA2C;GACpD,GAAG;GACH,YAAY,QAAQ;GACrB,CAAC;AAGJ,MAAI,QAAQ,QACV,QAAO,IAAI,iBAA2C;GACpD,GAAG;GACH,SAAS,QAAQ;GAClB,CAAC;AAGJ,QAAM,IAAI,MACR,+DACD;IACA,CAAC,SAAS,CAAC;AAGd,oBAAmB;EACjB,MAAM,cAAc,QAAQ;AAC5B,UAAQ,CAAC,cAAc,EAAE,MAAM,aAAa,CAAC;GAC7C;AAGF,oBAAmB;AACjB,eAAa;AACX,WAAQ,CAAC,MAAM;;GAEjB;CAEF,MAAM,WAAW,OAAO,UAAkB;AACxC,QAAM,QAAQ,CAAC,SAAS,MAAM;;CAGhC,MAAM,aAAa;AACjB,UAAQ,CAAC,MAAM;;CAGjB,MAAM,cAAc;AAClB,UAAQ,CAAC,OAAO;;AAGlB,QAAO;EACK;EACV;EACA;EACA;EACA;EACA;EACA;EACD"}

package/dist/use-summarize.d.ts

@@ -0,0 +1,91 @@
+import { Accessor } from "solid-js";
+import { ConnectionAdapter, GenerationClientState, GenerationFetcher, InferGenerationOutput, SummarizeGenerateInput } from "@tanstack/ai-client";
+import { StreamChunk, SummarizationResult } from "@tanstack/ai";
+
+//#region src/use-summarize.d.ts
+
+/**
+ * Options for the useSummarize hook.
+ *
+ * @template TOutput - The transformed output type (defaults to SummarizationResult)
+ */
+interface UseSummarizeOptions<TOutput = SummarizationResult> {
+  /** Connection adapter for streaming transport (SSE, HTTP stream, custom) */
+  connection?: ConnectionAdapter;
+  /** Direct async function for summarization */
+  fetcher?: GenerationFetcher<SummarizeGenerateInput, SummarizationResult>;
+  /** Unique identifier for this generation instance */
+  id?: string;
+  /** Additional body parameters to send with ConnectionAdapter requests */
+  body?: Record<string, any>;
+  /**
+   * Callback when summarization is complete. 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: SummarizationResult) => 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 (ConnectionAdapter mode only) */
+  onChunk?: (chunk: StreamChunk) => void;
+}
+/**
+ * Return type for the useSummarize hook.
+ *
+ * @template TOutput - The transformed output type (defaults to SummarizationResult)
+ */
+interface UseSummarizeReturn<TOutput = SummarizationResult> {
+  /** Trigger summarization */
+  generate: (input: SummarizeGenerateInput) => Promise<void>;
+  /** The summarization result, or null */
+  result: Accessor<TOutput | null>;
+  /** Whether summarization 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 summarization */
+  stop: () => void;
+  /** Clear result, error, and return to idle */
+  reset: () => void;
+}
+/**
+ * Solid hook for summarizing text using AI models.
+ *
+ * @example
+ * ```tsx
+ * import { useSummarize } from '@tanstack/ai-solid'
+ * import { fetchServerSentEvents } from '@tanstack/ai-client'
+ *
+ * function Summarizer() {
+ *   const { generate, result, isLoading } = useSummarize({
+ *     connection: fetchServerSentEvents('/api/summarize'),
+ *   })
+ *
+ *   return (
+ *     <div>
+ *       <button onClick={() => generate({
+ *         text: 'Long article text...',
+ *         style: 'bullet-points',
+ *         maxLength: 200,
+ *       })}>
+ *         Summarize
+ *       </button>
+ *       {isLoading() && <p>Summarizing...</p>}
+ *       {result() && <p>{result()!.summary}</p>}
+ *     </div>
+ *   )
+ * }
+ * ```
+ */
+declare function useSummarize<TOnResult extends ((result: SummarizationResult) => any) | undefined = undefined>(options: Omit<UseSummarizeOptions, 'onResult'> & {
+  onResult?: TOnResult;
+}): UseSummarizeReturn<InferGenerationOutput<SummarizationResult, TOnResult>>;
+//#endregion
+export { UseSummarizeOptions, UseSummarizeReturn, useSummarize };
+//# sourceMappingURL=use-summarize.d.ts.map

package/dist/use-summarize.js

@@ -0,0 +1,48 @@
+import { useGeneration } from "./use-generation.js";
+
+//#region src/use-summarize.ts
+/**
+* Solid hook for summarizing text using AI models.
+*
+* @example
+* ```tsx
+* import { useSummarize } from '@tanstack/ai-solid'
+* import { fetchServerSentEvents } from '@tanstack/ai-client'
+*
+* function Summarizer() {
+*   const { generate, result, isLoading } = useSummarize({
+*     connection: fetchServerSentEvents('/api/summarize'),
+*   })
+*
+*   return (
+*     <div>
+*       <button onClick={() => generate({
+*         text: 'Long article text...',
+*         style: 'bullet-points',
+*         maxLength: 200,
+*       })}>
+*         Summarize
+*       </button>
+*       {isLoading() && <p>Summarizing...</p>}
+*       {result() && <p>{result()!.summary}</p>}
+*     </div>
+*   )
+* }
+* ```
+*/
+function useSummarize(options) {
+	const { generate, result, isLoading, error, status, stop, reset } = useGeneration(options);
+	return {
+		generate,
+		result,
+		isLoading,
+		error,
+		status,
+		stop,
+		reset
+	};
+}
+
+//#endregion
+export { useSummarize };
+//# sourceMappingURL=use-summarize.js.map

package/dist/use-summarize.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-summarize.js","names":[],"sources":["../src/use-summarize.ts"],"sourcesContent":["import { useGeneration } from './use-generation'\nimport type { StreamChunk, SummarizationResult } from '@tanstack/ai'\nimport type {\n  ConnectionAdapter,\n  GenerationClientState,\n  GenerationFetcher,\n  InferGenerationOutput,\n  SummarizeGenerateInput,\n} from '@tanstack/ai-client'\nimport type { Accessor } from 'solid-js'\n\n/**\n * Options for the useSummarize hook.\n *\n * @template TOutput - The transformed output type (defaults to SummarizationResult)\n */\nexport interface UseSummarizeOptions<TOutput = SummarizationResult> {\n  /** Connection adapter for streaming transport (SSE, HTTP stream, custom) */\n  connection?: ConnectionAdapter\n  /** Direct async function for summarization */\n  fetcher?: GenerationFetcher<SummarizeGenerateInput, SummarizationResult>\n  /** Unique identifier for this generation instance */\n  id?: string\n  /** Additional body parameters to send with ConnectionAdapter requests */\n  body?: Record<string, any>\n  /**\n   * Callback when summarization is complete. 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: SummarizationResult) => 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 (ConnectionAdapter mode only) */\n  onChunk?: (chunk: StreamChunk) => void\n}\n\n/**\n * Return type for the useSummarize hook.\n *\n * @template TOutput - The transformed output type (defaults to SummarizationResult)\n */\nexport interface UseSummarizeReturn<TOutput = SummarizationResult> {\n  /** Trigger summarization */\n  generate: (input: SummarizeGenerateInput) => Promise<void>\n  /** The summarization result, or null */\n  result: Accessor<TOutput | null>\n  /** Whether summarization 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 summarization */\n  stop: () => void\n  /** Clear result, error, and return to idle */\n  reset: () => void\n}\n\n/**\n * Solid hook for summarizing text using AI models.\n *\n * @example\n * ```tsx\n * import { useSummarize } from '@tanstack/ai-solid'\n * import { fetchServerSentEvents } from '@tanstack/ai-client'\n *\n * function Summarizer() {\n *   const { generate, result, isLoading } = useSummarize({\n *     connection: fetchServerSentEvents('/api/summarize'),\n *   })\n *\n *   return (\n *     <div>\n *       <button onClick={() => generate({\n *         text: 'Long article text...',\n *         style: 'bullet-points',\n *         maxLength: 200,\n *       })}>\n *         Summarize\n *       </button>\n *       {isLoading() && <p>Summarizing...</p>}\n *       {result() && <p>{result()!.summary}</p>}\n *     </div>\n *   )\n * }\n * ```\n */\nexport function useSummarize<\n  TOnResult extends ((result: SummarizationResult) => any) | undefined =\n    undefined,\n>(\n  options: Omit<UseSummarizeOptions, 'onResult'> & {\n    onResult?: TOnResult\n  },\n): UseSummarizeReturn<InferGenerationOutput<SummarizationResult, TOnResult>> {\n  const { generate, result, isLoading, error, status, stop, reset } =\n    useGeneration<SummarizeGenerateInput, SummarizationResult, TOnResult>(\n      options,\n    )\n\n  return {\n    generate: generate as (input: SummarizeGenerateInput) => Promise<void>,\n    result,\n    isLoading,\n    error,\n    status,\n    stop,\n    reset,\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4FA,SAAgB,aAId,SAG2E;CAC3E,MAAM,EAAE,UAAU,QAAQ,WAAW,OAAO,QAAQ,MAAM,UACxD,cACE,QACD;AAEH,QAAO;EACK;EACV;EACA;EACA;EACA;EACA;EACA;EACD"}

package/dist/use-transcription.d.ts

@@ -0,0 +1,97 @@
+import { Accessor } from "solid-js";
+import { ConnectionAdapter, GenerationClientState, GenerationFetcher, InferGenerationOutput, TranscriptionGenerateInput } from "@tanstack/ai-client";
+import { StreamChunk, TranscriptionResult } from "@tanstack/ai";
+
+//#region src/use-transcription.d.ts
+
+/**
+ * Options for the useTranscription hook.
+ *
+ * @template TOutput - The transformed output type (defaults to TranscriptionResult)
+ */
+interface UseTranscriptionOptions<TOutput = TranscriptionResult> {
+  /** Connection adapter for streaming transport (SSE, HTTP stream, custom) */
+  connection?: ConnectionAdapter;
+  /** Direct async function for transcription */
+  fetcher?: GenerationFetcher<TranscriptionGenerateInput, TranscriptionResult>;
+  /** Unique identifier for this generation instance */
+  id?: string;
+  /** Additional body parameters to send with ConnectionAdapter requests */
+  body?: Record<string, any>;
+  /**
+   * Callback when transcription is complete. 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: TranscriptionResult) => 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 (ConnectionAdapter mode only) */
+  onChunk?: (chunk: StreamChunk) => void;
+}
+/**
+ * Return type for the useTranscription hook.
+ *
+ * @template TOutput - The transformed output type (defaults to TranscriptionResult)
+ */
+interface UseTranscriptionReturn<TOutput = TranscriptionResult> {
+  /** Trigger transcription */
+  generate: (input: TranscriptionGenerateInput) => Promise<void>;
+  /** The transcription result, or null */
+  result: Accessor<TOutput | null>;
+  /** Whether transcription 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 transcription */
+  stop: () => void;
+  /** Clear result, error, and return to idle */
+  reset: () => void;
+}
+/**
+ * Solid hook for transcribing audio to text using AI models.
+ *
+ * @example
+ * ```tsx
+ * import { useTranscription } from '@tanstack/ai-solid'
+ * import { fetchServerSentEvents } from '@tanstack/ai-client'
+ *
+ * function Transcriber() {
+ *   const { generate, result, isLoading } = useTranscription({
+ *     connection: fetchServerSentEvents('/api/transcribe'),
+ *   })
+ *
+ *   const handleFile = (e: Event) => {
+ *     const input = e.target as HTMLInputElement
+ *     const file = input.files?.[0]
+ *     if (file) {
+ *       const reader = new FileReader()
+ *       reader.onload = () => {
+ *         generate({ audio: reader.result as string, language: 'en' })
+ *       }
+ *       reader.readAsDataURL(file)
+ *     }
+ *   }
+ *
+ *   return (
+ *     <div>
+ *       <input type="file" accept="audio/*" onChange={handleFile} />
+ *       {isLoading() && <p>Transcribing...</p>}
+ *       {result() && <p>{result()!.text}</p>}
+ *     </div>
+ *   )
+ * }
+ * ```
+ */
+declare function useTranscription<TOnResult extends ((result: TranscriptionResult) => any) | undefined = undefined>(options: Omit<UseTranscriptionOptions, 'onResult'> & {
+  onResult?: TOnResult;
+}): UseTranscriptionReturn<InferGenerationOutput<TranscriptionResult, TOnResult>>;
+//#endregion
+export { UseTranscriptionOptions, UseTranscriptionReturn, useTranscription };
+//# sourceMappingURL=use-transcription.d.ts.map

package/dist/use-transcription.js

@@ -0,0 +1,54 @@
+import { useGeneration } from "./use-generation.js";
+
+//#region src/use-transcription.ts
+/**
+* Solid hook for transcribing audio to text using AI models.
+*
+* @example
+* ```tsx
+* import { useTranscription } from '@tanstack/ai-solid'
+* import { fetchServerSentEvents } from '@tanstack/ai-client'
+*
+* function Transcriber() {
+*   const { generate, result, isLoading } = useTranscription({
+*     connection: fetchServerSentEvents('/api/transcribe'),
+*   })
+*
+*   const handleFile = (e: Event) => {
+*     const input = e.target as HTMLInputElement
+*     const file = input.files?.[0]
+*     if (file) {
+*       const reader = new FileReader()
+*       reader.onload = () => {
+*         generate({ audio: reader.result as string, language: 'en' })
+*       }
+*       reader.readAsDataURL(file)
+*     }
+*   }
+*
+*   return (
+*     <div>
+*       <input type="file" accept="audio/*" onChange={handleFile} />
+*       {isLoading() && <p>Transcribing...</p>}
+*       {result() && <p>{result()!.text}</p>}
+*     </div>
+*   )
+* }
+* ```
+*/
+function useTranscription(options) {
+	const { generate, result, isLoading, error, status, stop, reset } = useGeneration(options);
+	return {
+		generate,
+		result,
+		isLoading,
+		error,
+		status,
+		stop,
+		reset
+	};
+}
+
+//#endregion
+export { useTranscription };
+//# sourceMappingURL=use-transcription.js.map

package/dist/use-transcription.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-transcription.js","names":[],"sources":["../src/use-transcription.ts"],"sourcesContent":["import { useGeneration } from './use-generation'\nimport type { StreamChunk, TranscriptionResult } from '@tanstack/ai'\nimport type {\n  ConnectionAdapter,\n  GenerationClientState,\n  GenerationFetcher,\n  InferGenerationOutput,\n  TranscriptionGenerateInput,\n} from '@tanstack/ai-client'\nimport type { Accessor } from 'solid-js'\n\n/**\n * Options for the useTranscription hook.\n *\n * @template TOutput - The transformed output type (defaults to TranscriptionResult)\n */\nexport interface UseTranscriptionOptions<TOutput = TranscriptionResult> {\n  /** Connection adapter for streaming transport (SSE, HTTP stream, custom) */\n  connection?: ConnectionAdapter\n  /** Direct async function for transcription */\n  fetcher?: GenerationFetcher<TranscriptionGenerateInput, TranscriptionResult>\n  /** Unique identifier for this generation instance */\n  id?: string\n  /** Additional body parameters to send with ConnectionAdapter requests */\n  body?: Record<string, any>\n  /**\n   * Callback when transcription is complete. 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: TranscriptionResult) => 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 (ConnectionAdapter mode only) */\n  onChunk?: (chunk: StreamChunk) => void\n}\n\n/**\n * Return type for the useTranscription hook.\n *\n * @template TOutput - The transformed output type (defaults to TranscriptionResult)\n */\nexport interface UseTranscriptionReturn<TOutput = TranscriptionResult> {\n  /** Trigger transcription */\n  generate: (input: TranscriptionGenerateInput) => Promise<void>\n  /** The transcription result, or null */\n  result: Accessor<TOutput | null>\n  /** Whether transcription 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 transcription */\n  stop: () => void\n  /** Clear result, error, and return to idle */\n  reset: () => void\n}\n\n/**\n * Solid hook for transcribing audio to text using AI models.\n *\n * @example\n * ```tsx\n * import { useTranscription } from '@tanstack/ai-solid'\n * import { fetchServerSentEvents } from '@tanstack/ai-client'\n *\n * function Transcriber() {\n *   const { generate, result, isLoading } = useTranscription({\n *     connection: fetchServerSentEvents('/api/transcribe'),\n *   })\n *\n *   const handleFile = (e: Event) => {\n *     const input = e.target as HTMLInputElement\n *     const file = input.files?.[0]\n *     if (file) {\n *       const reader = new FileReader()\n *       reader.onload = () => {\n *         generate({ audio: reader.result as string, language: 'en' })\n *       }\n *       reader.readAsDataURL(file)\n *     }\n *   }\n *\n *   return (\n *     <div>\n *       <input type=\"file\" accept=\"audio/*\" onChange={handleFile} />\n *       {isLoading() && <p>Transcribing...</p>}\n *       {result() && <p>{result()!.text}</p>}\n *     </div>\n *   )\n * }\n * ```\n */\nexport function useTranscription<\n  TOnResult extends ((result: TranscriptionResult) => any) | undefined =\n    undefined,\n>(\n  options: Omit<UseTranscriptionOptions, 'onResult'> & {\n    onResult?: TOnResult\n  },\n): UseTranscriptionReturn<\n  InferGenerationOutput<TranscriptionResult, TOnResult>\n> {\n  const { generate, result, isLoading, error, status, stop, reset } =\n    useGeneration<TranscriptionGenerateInput, TranscriptionResult, TOnResult>(\n      options,\n    )\n\n  return {\n    generate: generate as (input: TranscriptionGenerateInput) => Promise<void>,\n    result,\n    isLoading,\n    error,\n    status,\n    stop,\n    reset,\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkGA,SAAgB,iBAId,SAKA;CACA,MAAM,EAAE,UAAU,QAAQ,WAAW,OAAO,QAAQ,MAAM,UACxD,cACE,QACD;AAEH,QAAO;EACK;EACV;EACA;EACA;EACA;EACA;EACA;EACD"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tanstack/ai-solid",
-  "version": "0.6.3",
+  "version": "0.6.6",
   "description": "Solid hooks for TanStack AI",
   "author": "",
   "license": "MIT",
@@ -31,11 +31,11 @@
     "streaming"
   ],
   "dependencies": {
-    "@tanstack/ai-client": "0.5.3"
+    "@tanstack/ai-client": "0.7.1"
   },
   "peerDependencies": {
     "solid-js": ">=1.9.10",
-    "@tanstack/ai": "^0.6.2"
+    "@tanstack/ai": "^0.8.0"
   },
   "devDependencies": {
     "@solidjs/testing-library": "^0.8.10",
@@ -46,7 +46,7 @@
     "tsdown": "^0.17.0-beta.6",
     "typescript": "5.9.3",
     "vitest": "^4.0.14",
-    "@tanstack/ai": "0.6.2"
+    "@tanstack/ai": "0.8.0"
   },
   "scripts": {
     "clean": "premove ./build ./dist",

package/src/index.ts

@@ -6,6 +6,40 @@ export type {
   ChatRequestBody,
 } from './types'
 
+// Generation hooks
+export { useGeneration } from './use-generation'
+export type {
+  UseGenerationOptions,
+  UseGenerationReturn,
+} from './use-generation'
+
+export { useGenerateImage } from './use-generate-image'
+export type {
+  UseGenerateImageOptions,
+  UseGenerateImageReturn,
+} from './use-generate-image'
+
+export { useGenerateSpeech } from './use-generate-speech'
+export type {
+  UseGenerateSpeechOptions,
+  UseGenerateSpeechReturn,
+} from './use-generate-speech'
+
+export { useTranscription } from './use-transcription'
+export type {
+  UseTranscriptionOptions,
+  UseTranscriptionReturn,
+} from './use-transcription'
+
+export { useSummarize } from './use-summarize'
+export type { UseSummarizeOptions, UseSummarizeReturn } from './use-summarize'
+
+export { useGenerateVideo } from './use-generate-video'
+export type {
+  UseGenerateVideoOptions,
+  UseGenerateVideoReturn,
+} from './use-generate-video'
+
 // Re-export from ai-client for convenience
 export {
   fetchServerSentEvents,
@@ -15,4 +49,12 @@ export {
   type ConnectionAdapter,
   type FetchConnectionOptions,
   type InferChatMessages,
+  type GenerationClientState,
+  type ImageGenerateInput,
+  type SpeechGenerateInput,
+  type TranscriptionGenerateInput,
+  type SummarizeGenerateInput,
+  type VideoGenerateInput,
+  type VideoGenerateResult,
+  type VideoStatusInfo,
 } from '@tanstack/ai-client'

package/src/use-generate-image.ts

@@ -0,0 +1,118 @@
+import { useGeneration } from './use-generation'
+import type { ImageGenerationResult, StreamChunk } from '@tanstack/ai'
+import type {
+  ConnectionAdapter,
+  GenerationClientState,
+  GenerationFetcher,
+  ImageGenerateInput,
+  InferGenerationOutput,
+} from '@tanstack/ai-client'
+import type { Accessor } from 'solid-js'
+
+/**
+ * Options for the useGenerateImage hook.
+ *
+ * @template TOutput - The transformed output type (defaults to ImageGenerationResult)
+ */
+export interface UseGenerateImageOptions<TOutput = ImageGenerationResult> {
+  /** Connection adapter for streaming transport (SSE, HTTP stream, custom) */
+  connection?: ConnectionAdapter
+  /** Direct async function for image generation */
+  fetcher?: GenerationFetcher<ImageGenerateInput, ImageGenerationResult>
+  /** Unique identifier for this generation instance */
+  id?: string
+  /** Additional body parameters to send with ConnectionAdapter requests */
+  body?: Record<string, any>
+  /**
+   * 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 (ConnectionAdapter mode only) */
+  onChunk?: (chunk: StreamChunk) => void
+}
+
+/**
+ * Return type for the useGenerateImage hook.
+ *
+ * @template TOutput - The transformed output type (defaults to ImageGenerationResult)
+ */
+export 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:
+ * - **ConnectionAdapter** -- 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>
+ *   )
+ * }
+ * ```
+ */
+export function useGenerateImage<
+  TOnResult extends ((result: ImageGenerationResult) => any) | undefined =
+    undefined,
+>(
+  options: Omit<UseGenerateImageOptions, 'onResult'> & {
+    onResult?: TOnResult
+  },
+): UseGenerateImageReturn<
+  InferGenerationOutput<ImageGenerationResult, TOnResult>
+> {
+  const { generate, result, isLoading, error, status, stop, reset } =
+    useGeneration<ImageGenerateInput, ImageGenerationResult, TOnResult>(options)
+
+  return {
+    generate: generate as (input: ImageGenerateInput) => Promise<void>,
+    result,
+    isLoading,
+    error,
+    status,
+    stop,
+    reset,
+  }
+}