@tanstack/ai-preact 0.14.3 → 0.15.0

package/README.md

@@ -61,12 +61,8 @@ framework bindings as your app needs them.
 
 - [Overview](https://tanstack.com/ai/latest/docs/getting-started/overview) -
   what TanStack AI is and how the packages fit together.
-- [Quick Start: React](https://tanstack.com/ai/latest/docs/getting-started/quick-start) -
-  add streaming chat to a React app.
-- [Quick Start: Vue](https://tanstack.com/ai/latest/docs/getting-started/quick-start-vue) -
-  build with Vue composables.
-- [Quick Start: Svelte](https://tanstack.com/ai/latest/docs/getting-started/quick-start-svelte) -
-  build with Svelte 5 runes.
+- [Quick Start](https://tanstack.com/ai/latest/docs/getting-started/quick-start) -
+  add streaming chat. Pick your framework at the top of the page.
 - [Quick Start: Server Only](https://tanstack.com/ai/latest/docs/getting-started/quick-start-server) -
   use TanStack AI from a server endpoint, script, or backend service.
 - [TanStack AI vs Vercel AI SDK](https://tanstack.com/ai/latest/docs/comparison/vercel-ai-sdk) -
@@ -226,15 +222,15 @@ on.
 
 ## Framework Packages
 
-| Package                                                                    | What it provides                                                         |
-| -------------------------------------------------------------------------- | ------------------------------------------------------------------------ |
-| [`@tanstack/ai-client`](https://tanstack.com/ai/latest/docs/api/ai-client) | Headless chat, realtime, and generation clients                          |
-| [`@tanstack/ai-react`](https://tanstack.com/ai/latest/docs/api/ai-react)   | React hooks including `useChat`, `useRealtimeChat`, and generation hooks |
-| [`@tanstack/ai-solid`](https://tanstack.com/ai/latest/docs/api/ai-solid)   | Solid hooks for chat and generations                                     |
-| [`@tanstack/ai-vue`](https://tanstack.com/ai/latest/docs/api/ai-vue)       | Vue composables for chat and generations                                 |
-| [`@tanstack/ai-svelte`](https://tanstack.com/ai/latest/docs/api/ai-svelte) | Svelte 5 factories for chat and generations                              |
-| [`@tanstack/ai-preact`](https://tanstack.com/ai/latest/docs/api/ai-preact) | Preact hooks for chat                                                    |
-| `@tanstack/ai-react-ui`, `@tanstack/ai-solid-ui`, `@tanstack/ai-vue-ui`    | Headless UI components for chat interfaces                               |
+| Package                                                                                           | What it provides                                                                                                                        |
+| ------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------- |
+| [`@tanstack/ai-client`](https://tanstack.com/ai/latest/docs/api/ai-client)                        | Headless chat, realtime, and generation clients                                                                                         |
+| [`@tanstack/ai-react`](https://tanstack.com/ai/latest/docs/api/ai-react)                          | React hooks including `useChat`, `useRealtimeChat`, and generation hooks                                                                |
+| [`@tanstack/ai-solid`](https://tanstack.com/ai/latest/docs/api/ai-solid)                          | Solid hooks for chat and generations                                                                                                    |
+| [`@tanstack/ai-vue`](https://tanstack.com/ai/latest/docs/api/ai-vue)                              | Vue composables for chat and generations                                                                                                |
+| [`@tanstack/ai-svelte`](https://tanstack.com/ai/latest/docs/api/ai-svelte)                        | Svelte 5 factories for chat and generations                                                                                             |
+| [`@tanstack/ai-preact`](https://tanstack.com/ai/latest/docs/api/ai-preact)                        | Preact hooks for chat                                                                                                                   |
+| `@tanstack/ai-react/ui`, `@tanstack/ai-solid/ui`, `@tanstack/ai-vue/ui`, `@tanstack/ai-svelte/ui` | Headless UI components for chat interfaces. `@tanstack/ai-react-ui`, `@tanstack/ai-solid-ui`, and `@tanstack/ai-vue-ui` are deprecated. |
 
 ## Advanced Docs
 

package/dist/esm/chat-ui/create-chat-hook.d.ts

@@ -0,0 +1,48 @@
+import { ComponentType } from 'preact/compat';
+import { InferredClientContext } from '@tanstack/ai-client';
+import { ChatUIInterruptsOf, ChatUIToolsOf } from '@tanstack/ai-client/ui';
+import { UseChatOptions } from '../types.js';
+import { ChatUIFactoryConfig, ChatUIHost, InputProps } from './create-ui.js';
+type HeadlessOptions<TOptions> = UseChatOptions<ChatUIToolsOf<TOptions>, InferredClientContext<ChatUIToolsOf<TOptions>>, ChatUIInterruptsOf<TOptions>>;
+type ChatInstanceOverrides<TOptions> = {
+    threadId?: string;
+    live?: boolean;
+    forwardedProps?: Record<string, any>;
+    body?: Record<string, any>;
+    initialMessages?: HeadlessOptions<TOptions>['initialMessages'];
+};
+/**
+ * Bind chat options and UI widgets once at module scope.
+ *
+ * This matches Form `createFormHook` and Table `createTableHook`. The
+ * returned `useAppChat` creates a chat instance. `chat.AppChat` renders it.
+ * `useChatContext` reads that instance. Part and interrupt widgets take
+ * `part` / `interrupt` as props. Do not read those from context.
+ *
+ * Pass instance overrides such as `threadId` into `useAppChat()`.
+ *
+ * @example
+ * ```tsx
+ * const { useAppChat, useChatContext } = createChatHook({
+ *   options: chatOptions,
+ *   components: { layout: ChatLayout, message: ChatMessage },
+ *   partsComponents: { fallback: FallbackPart },
+ *   toolsComponents: { getWeather: WeatherTool, purchaseItem: PurchaseTool },
+ *   interruptsComponents: { generic: { choosePlan: ChoosePlan } },
+ * })
+ *
+ * function Support() {
+ *   const chat = useAppChat({ threadId: 'support-1' })
+ *   return <chat.AppChat />
+ * }
+ * ```
+ */
+export declare function createChatHook<const TOptions, TInput extends ComponentType<any> | undefined = ComponentType<InputProps<NoInfer<TOptions>>> | undefined>({ options, ...chatComponents }: {
+    options: TOptions;
+} & ChatUIFactoryConfig<NoInfer<TOptions>, TInput>): {
+    useAppChat: (overrides?: ChatInstanceOverrides<TOptions>) => ChatUIHost<TOptions> & {
+        AppChat: ComponentType;
+    };
+    useChatContext: () => ChatUIHost<TOptions>;
+};
+export {};

package/dist/esm/chat-ui/create-chat-hook.js

@@ -0,0 +1,57 @@
+import { useChat } from "../use-chat.js";
+import { createChatUI } from "./create-ui.js";
+import { useMemo, useRef } from "preact/compat";
+import { jsx } from "preact/jsx-runtime";
+//#region src/chat-ui/create-chat-hook.tsx
+/**
+* Bind chat options and UI widgets once at module scope.
+*
+* This matches Form `createFormHook` and Table `createTableHook`. The
+* returned `useAppChat` creates a chat instance. `chat.AppChat` renders it.
+* `useChatContext` reads that instance. Part and interrupt widgets take
+* `part` / `interrupt` as props. Do not read those from context.
+*
+* Pass instance overrides such as `threadId` into `useAppChat()`.
+*
+* @example
+* ```tsx
+* const { useAppChat, useChatContext } = createChatHook({
+*   options: chatOptions,
+*   components: { layout: ChatLayout, message: ChatMessage },
+*   partsComponents: { fallback: FallbackPart },
+*   toolsComponents: { getWeather: WeatherTool, purchaseItem: PurchaseTool },
+*   interruptsComponents: { generic: { choosePlan: ChoosePlan } },
+* })
+*
+* function Support() {
+*   const chat = useAppChat({ threadId: 'support-1' })
+*   return <chat.AppChat />
+* }
+* ```
+*/
+function createChatHook({ options, ...chatComponents }) {
+	const ui = createChatUI(options, chatComponents);
+	function useAppChat(overrides) {
+		const chat = overrides ? useChat({
+			...options,
+			...overrides
+		}) : useChat(options);
+		const chatRef = useRef(chat);
+		chatRef.current = chat;
+		const AppChat = useMemo(() => {
+			function AppChatImpl() {
+				return /* @__PURE__ */ jsx(ui.Chat, { chat: chatRef.current });
+			}
+			return AppChatImpl;
+		}, []);
+		return Object.assign(chat, { AppChat });
+	}
+	return {
+		useAppChat,
+		useChatContext: ui.useChatContext
+	};
+}
+//#endregion
+export { createChatHook };
+
+//# sourceMappingURL=create-chat-hook.js.map

package/dist/esm/chat-ui/create-chat-hook.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"create-chat-hook.js","names":[],"sources":["../../../src/chat-ui/create-chat-hook.tsx"],"sourcesContent":["import { useMemo, useRef } from 'preact/compat'\nimport type { ComponentType } from 'preact/compat'\nimport type { InferredClientContext } from '@tanstack/ai-client'\nimport type { ChatUIInterruptsOf, ChatUIToolsOf } from '@tanstack/ai-client/ui'\nimport { useChat as useUnboundChat } from '../use-chat'\nimport type { UseChatOptions } from '../types'\nimport { createChatUI } from './create-ui'\nimport type { ChatUIFactoryConfig, ChatUIHost, InputProps } from './create-ui'\n\ntype HeadlessOptions<TOptions> = UseChatOptions<\n  ChatUIToolsOf<TOptions>,\n  InferredClientContext<ChatUIToolsOf<TOptions>>,\n  ChatUIInterruptsOf<TOptions>\n>\n\ntype ChatInstanceOverrides<TOptions> = {\n  threadId?: string\n  live?: boolean\n  forwardedProps?: Record<string, any>\n  body?: Record<string, any>\n  initialMessages?: HeadlessOptions<TOptions>['initialMessages']\n}\n\n/**\n * Bind chat options and UI widgets once at module scope.\n *\n * This matches Form `createFormHook` and Table `createTableHook`. The\n * returned `useAppChat` creates a chat instance. `chat.AppChat` renders it.\n * `useChatContext` reads that instance. Part and interrupt widgets take\n * `part` / `interrupt` as props. Do not read those from context.\n *\n * Pass instance overrides such as `threadId` into `useAppChat()`.\n *\n * @example\n * ```tsx\n * const { useAppChat, useChatContext } = createChatHook({\n *   options: chatOptions,\n *   components: { layout: ChatLayout, message: ChatMessage },\n *   partsComponents: { fallback: FallbackPart },\n *   toolsComponents: { getWeather: WeatherTool, purchaseItem: PurchaseTool },\n *   interruptsComponents: { generic: { choosePlan: ChoosePlan } },\n * })\n *\n * function Support() {\n *   const chat = useAppChat({ threadId: 'support-1' })\n *   return <chat.AppChat />\n * }\n * ```\n */\nexport function createChatHook<\n  const TOptions,\n  TInput extends ComponentType<any> | undefined =\n    | ComponentType<InputProps<NoInfer<TOptions>>>\n    | undefined,\n>({\n  options,\n  ...chatComponents\n}: {\n  options: TOptions\n} & ChatUIFactoryConfig<NoInfer<TOptions>, TInput>) {\n  const ui = createChatUI(\n    options,\n    chatComponents as ChatUIFactoryConfig<NoInfer<TOptions>, TInput>,\n  )\n\n  function useAppChat(overrides?: ChatInstanceOverrides<TOptions>) {\n    const chat = (\n      overrides\n        ? useUnboundChat({\n            ...(options as HeadlessOptions<TOptions>),\n            ...overrides,\n          })\n        : useUnboundChat(options as HeadlessOptions<TOptions>)\n    ) as ChatUIHost<TOptions>\n\n    // `useChat` returns a fresh object on every render. The mixed Chat\n    // component must stay stable, or React remounts the tree on each\n    // update. Read the current instance from a ref.\n    const chatRef = useRef(chat)\n    chatRef.current = chat\n\n    const AppChat = useMemo(() => {\n      function AppChatImpl() {\n        return <ui.Chat chat={chatRef.current} />\n      }\n      return AppChatImpl\n    }, [])\n\n    return Object.assign(chat, { AppChat }) as ChatUIHost<TOptions> & {\n      AppChat: ComponentType\n    }\n  }\n\n  return {\n    useAppChat,\n    useChatContext: ui.useChatContext,\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiDA,SAAgB,eAKd,EACA,SACA,GAAG,kBAG+C;CAClD,MAAM,KAAK,aACT,SACA,cACF;CAEA,SAAS,WAAW,WAA6C;EAC/D,MAAM,OACJ,YACI,QAAe;GACb,GAAI;GACJ,GAAG;EACL,CAAC,IACD,QAAe,OAAoC;EAMzD,MAAM,UAAU,OAAO,IAAI;EAC3B,QAAQ,UAAU;EAElB,MAAM,UAAU,cAAc;GAC5B,SAAS,cAAc;IACrB,OAAO,oBAAC,GAAG,MAAJ,EAAS,MAAM,QAAQ,QAAU,CAAA;GAC1C;GACA,OAAO;EACT,GAAG,CAAC,CAAC;EAEL,OAAO,OAAO,OAAO,MAAM,EAAE,QAAQ,CAAC;CAGxC;CAEA,OAAO;EACL;EACA,gBAAgB,GAAG;CACrB;AACF"}

package/dist/esm/chat-ui/create-ui-contexts.d.ts

@@ -0,0 +1,29 @@
+import { Context } from 'preact/compat';
+import { ChatUIInterrupt, ChatUISelectedPart } from '@tanstack/ai-client/ui';
+import { UseChatReturn } from '../types.js';
+/**
+ * Scoped chat, part, and interrupt contexts plus matching context hooks.
+ * Pass these into {@link createChatHook} when widgets live in other files, or
+ * when two chat trees nest and must not share the default contexts.
+ */
+export interface ChatUIContexts {
+    chatContext: Context<UseChatReturn<any, any> | null>;
+    partContext: Context<ChatUISelectedPart | null>;
+    interruptContext: Context<ChatUIInterrupt | null>;
+    useChatContext: () => UseChatReturn<any, any>;
+}
+/**
+ * Create a fresh set of chat UI contexts. This matches Form
+ * `createFormHookContexts` and Table `createTableHookContexts`.
+ *
+ * Most apps can skip this. `createChatHook` uses shared module contexts by
+ * default. The hooks on this object are the escape hatch for a widget file
+ * that cannot import the `createChatHook` result (circular import), or for
+ * nested chats that need isolated providers.
+ *
+ * Prefer the `useChatContext` hook returned from `createChatHook` when you
+ * can import that result. That hook knows the `chatComponents` types. Part
+ * and interrupt widgets take `part` / `interrupt` as props.
+ */
+export declare function createChatHookContexts(): ChatUIContexts;
+export declare const defaultChatUIContexts: ChatUIContexts;

package/dist/esm/chat-ui/create-ui-contexts.js

@@ -0,0 +1,36 @@
+import { createContext, useContext } from "preact/compat";
+//#region src/chat-ui/create-ui-contexts.tsx
+/**
+* Create a fresh set of chat UI contexts. This matches Form
+* `createFormHookContexts` and Table `createTableHookContexts`.
+*
+* Most apps can skip this. `createChatHook` uses shared module contexts by
+* default. The hooks on this object are the escape hatch for a widget file
+* that cannot import the `createChatHook` result (circular import), or for
+* nested chats that need isolated providers.
+*
+* Prefer the `useChatContext` hook returned from `createChatHook` when you
+* can import that result. That hook knows the `chatComponents` types. Part
+* and interrupt widgets take `part` / `interrupt` as props.
+*/
+function createChatHookContexts() {
+	const chatContext = createContext(null);
+	const partContext = createContext(null);
+	const interruptContext = createContext(null);
+	function useChatContext() {
+		const chat = useContext(chatContext);
+		if (!chat) throw new Error("`useChatContext` must be used within `UI.Provider` or `UI.Chat`.");
+		return chat;
+	}
+	return {
+		chatContext,
+		partContext,
+		interruptContext,
+		useChatContext
+	};
+}
+var defaultChatUIContexts = createChatHookContexts();
+//#endregion
+export { createChatHookContexts, defaultChatUIContexts };
+
+//# sourceMappingURL=create-ui-contexts.js.map

package/dist/esm/chat-ui/create-ui-contexts.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"create-ui-contexts.js","names":[],"sources":["../../../src/chat-ui/create-ui-contexts.tsx"],"sourcesContent":["import { createContext, useContext } from 'preact/compat'\nimport type { Context } from 'preact/compat'\nimport type {\n  ChatUIInterrupt,\n  ChatUISelectedPart,\n} from '@tanstack/ai-client/ui'\nimport type { UseChatReturn } from '../types'\n\n/**\n * Scoped chat, part, and interrupt contexts plus matching context hooks.\n * Pass these into {@link createChatHook} when widgets live in other files, or\n * when two chat trees nest and must not share the default contexts.\n */\nexport interface ChatUIContexts {\n  chatContext: Context<UseChatReturn<any, any> | null>\n  partContext: Context<ChatUISelectedPart | null>\n  interruptContext: Context<ChatUIInterrupt | null>\n  useChatContext: () => UseChatReturn<any, any>\n}\n\n/**\n * Create a fresh set of chat UI contexts. This matches Form\n * `createFormHookContexts` and Table `createTableHookContexts`.\n *\n * Most apps can skip this. `createChatHook` uses shared module contexts by\n * default. The hooks on this object are the escape hatch for a widget file\n * that cannot import the `createChatHook` result (circular import), or for\n * nested chats that need isolated providers.\n *\n * Prefer the `useChatContext` hook returned from `createChatHook` when you\n * can import that result. That hook knows the `chatComponents` types. Part\n * and interrupt widgets take `part` / `interrupt` as props.\n */\nexport function createChatHookContexts(): ChatUIContexts {\n  const chatContext = createContext<UseChatReturn<any, any> | null>(null)\n  const partContext = createContext<ChatUISelectedPart | null>(null)\n  const interruptContext = createContext<ChatUIInterrupt | null>(null)\n\n  function useChatContext() {\n    const chat = useContext(chatContext)\n    if (!chat) {\n      throw new Error(\n        '`useChatContext` must be used within `UI.Provider` or `UI.Chat`.',\n      )\n    }\n    return chat\n  }\n\n  return {\n    chatContext,\n    partContext,\n    interruptContext,\n    useChatContext,\n  }\n}\n\nexport const defaultChatUIContexts = createChatHookContexts()\n"],"mappings":";;;;;;;;;;;;;;;AAiCA,SAAgB,yBAAyC;CACvD,MAAM,cAAc,cAA8C,IAAI;CACtE,MAAM,cAAc,cAAyC,IAAI;CACjE,MAAM,mBAAmB,cAAsC,IAAI;CAEnE,SAAS,iBAAiB;EACxB,MAAM,OAAO,WAAW,WAAW;EACnC,IAAI,CAAC,MACH,MAAM,IAAI,MACR,kEACF;EAEF,OAAO;CACT;CAEA,OAAO;EACL;EACA;EACA;EACA;CACF;AACF;AAEA,IAAa,wBAAwB,uBAAuB"}

package/dist/esm/chat-ui/create-ui.d.ts

@@ -0,0 +1,154 @@
+import { ComponentChildren } from 'preact';
+import { ComponentType } from 'preact/compat';
+import { ChatUIData, ChatUIHasNamedInterrupts, ChatUIHasNamedTools, ChatUIInterrupt, ChatUIInterruptName, ChatUIInterruptOf, ChatUIInterruptsOf, ChatUIMessages, ChatUINamedInterruptId, ChatUIPartKey, ChatUIPartOf, ChatUISelectedPart, ChatUIToolApproval, ChatUIToolName, ChatUIToolsOf } from '@tanstack/ai-client/ui';
+import { MessagePart, QueuedMessage, ToolCallPart, ToolResultPart, UIMessage } from '@tanstack/ai-client';
+import { UseChatReturn } from '../types.js';
+import { ChatUIContexts } from './create-ui-contexts.js';
+export type ChatUIHost<TOptions = unknown> = UseChatReturn<ChatUIToolsOf<TOptions>, ChatUIInterruptsOf<TOptions>>;
+export type ChatUIQueueItem = QueuedMessage & {
+    cancelQueued: () => void;
+};
+export type LayoutProps<TOptions, TInput extends ComponentType<any> | undefined = ComponentType<InputProps<TOptions>>> = {
+    Messages: ComponentType;
+    Interrupts: ComponentType;
+    Queue: ComponentType;
+    readonly __ui?: TOptions;
+} & (TInput extends ComponentType<any> ? {
+    Input: ComponentType;
+} : {});
+export type MessageProps<TOptions> = {
+    message: UIMessage<ChatUIToolsOf<TOptions>, ChatUIData<TOptions>>;
+    Parts: ComponentType;
+};
+export type InputProps<TOptions> = {
+    readonly __ui?: TOptions;
+};
+export type QueueProps<TOptions> = {
+    item: ChatUIQueueItem;
+    readonly __ui?: TOptions;
+};
+export type PartProps<TOptions, TKey extends ChatUIPartKey = ChatUIPartKey> = {
+    part: ChatUIPartOf<TOptions, TKey>;
+};
+export type ToolProps<TOptions, TName extends ChatUIToolName<TOptions> = ChatUIToolName<TOptions>> = {
+    part: Extract<ToolCallPart<ChatUIToolsOf<TOptions>>, {
+        name: TName;
+    }>;
+    result?: ToolResultPart;
+    interrupt?: ChatUIToolApproval<TOptions, TName>;
+};
+export type InterruptProps<TOptions, TName extends ChatUIInterruptName<TOptions> = never> = {
+    interrupt: ChatUIInterruptOf<TOptions, TName>;
+    readonly __ui?: TOptions;
+};
+type GenericInterruptComponents<TOptions> = ChatUIHasNamedInterrupts<TOptions> extends true ? {
+    [K in ChatUINamedInterruptId<TOptions>]: ComponentType<InterruptProps<TOptions, K & ChatUIInterruptName<TOptions>>>;
+} & {
+    fallback?: ComponentType<InterruptProps<TOptions>>;
+} : {
+    fallback?: ComponentType<InterruptProps<TOptions>>;
+};
+type ToolApprovalMap<TOptions> = {
+    [K in ChatUIToolName<TOptions>]?: ComponentType<InterruptProps<TOptions, K & ChatUIInterruptName<TOptions>>>;
+};
+/** The chrome around the message list: `layout`, `message`, and `input`. */
+export type ChatUIChromeComponents<TOptions, TInput extends ComponentType<InputProps<TOptions>> | undefined = ComponentType<InputProps<TOptions>>> = {
+    layout: ComponentType<LayoutProps<TOptions, TInput>>;
+    message: ComponentType<MessageProps<TOptions>>;
+    input?: TInput;
+    queue?: ComponentType<QueueProps<TOptions>>;
+};
+export type ChatUIPartsComponents<TOptions> = {
+    [K in ChatUIPartKey]?: ComponentType<PartProps<TOptions, K>>;
+} & {
+    fallback?: ComponentType<PartProps<TOptions>>;
+};
+export type ChatUIInterruptsComponents<TOptions> = {
+    tools?: ToolApprovalMap<TOptions>;
+    generic: GenericInterruptComponents<TOptions>;
+};
+export type ChatUIComponents<TOptions, TInput extends ComponentType<InputProps<TOptions>> | undefined = ComponentType<InputProps<TOptions>>> = {
+    components: ChatUIChromeComponents<TOptions, TInput>;
+    partsComponents: ChatUIPartsComponents<TOptions>;
+} & (ChatUIHasNamedTools<TOptions> extends true ? {
+    toolsComponents: {
+        [K in ChatUIToolName<TOptions>]: ComponentType<ToolProps<TOptions, K>>;
+    };
+} : {
+    toolsComponents?: {
+        [K in ChatUIToolName<TOptions>]?: ComponentType<ToolProps<TOptions, K>>;
+    };
+}) & (ChatUIHasNamedInterrupts<TOptions> extends true ? {
+    interruptsComponents: ChatUIInterruptsComponents<TOptions>;
+} : {
+    interruptsComponents?: {
+        tools?: ToolApprovalMap<TOptions>;
+        generic?: GenericInterruptComponents<TOptions>;
+    };
+});
+/** Scoped contexts, for widgets in other files or nested chat trees. */
+export type ChatUIContextConfig = {
+    chatContext?: ChatUIContexts['chatContext'];
+    partContext?: ChatUIContexts['partContext'];
+    interruptContext?: ChatUIContexts['interruptContext'];
+};
+export type ChatUIFactoryConfig<TOptions, TInput extends ComponentType<InputProps<TOptions>> | undefined = ComponentType<InputProps<TOptions>>> = ChatUIComponents<TOptions, TInput> & {
+    context?: ChatUIContextConfig;
+};
+type BoundWidget = ComponentType<Record<string, never>>;
+type PartMixins<TOptions> = {
+    [K in ChatUIPartKey]?: BoundWidget;
+} & {
+    [K in ChatUIToolName<TOptions>]: BoundWidget;
+} & {
+    Render: BoundWidget;
+};
+type InterruptMixins<TOptions> = {
+    [K in ChatUINamedInterruptId<TOptions>]: BoundWidget;
+} & {
+    [K in ChatUIToolName<TOptions>]?: BoundWidget;
+} & {
+    fallback?: BoundWidget;
+    Render: BoundWidget;
+};
+/**
+ * Bind chat options and UI widgets once at module scope. This matches Form
+ * `createFormHook` and Table `createTableHook`: widgets register here, mix
+ * onto Part / Interrupt / the UI kit, and automatic dispatch still walks the
+ * message list.
+ *
+ * `chatOptions` is type-only at runtime. Pass optional `chatContext`,
+ * `partContext`, and `interruptContext` from {@link createChatHookContexts}
+ * when widgets live in other files or when nested chats need isolation.
+ */
+export declare function createChatUI<const TOptions, TInput extends ComponentType<any> | undefined = ComponentType<InputProps<NoInfer<TOptions>>> | undefined>(options: TOptions, config: ChatUIFactoryConfig<NoInfer<TOptions>, TInput>): {
+    Chat: ({ chat }: {
+        chat: ChatUIHost<TOptions>;
+    }) => import("preact").JSX.Element;
+    Provider: ({ chat, children, }: {
+        chat: ChatUIHost<TOptions>;
+        children?: ComponentChildren;
+    }) => import("preact").JSX.Element;
+    Messages: ({ children, }?: {
+        children?: (messages: ChatUIMessages<TOptions>) => ComponentChildren;
+    }) => import("preact").JSX.Element;
+    Message: ({ message, children, }: {
+        message: ChatUIMessages<TOptions>[number];
+        children?: (parts: Array<ChatUISelectedPart>) => ComponentChildren;
+    }) => import("preact").JSX.Element;
+    Part: ({ part, children, }: {
+        part: MessagePart | ChatUISelectedPart;
+        children?: (mixed: ChatUISelectedPart & PartMixins<TOptions>) => ComponentChildren;
+    }) => import("preact").JSX.Element | null;
+    Interrupts: ({ children, }?: {
+        children?: (interrupts: ReadonlyArray<ChatUIInterrupt>) => ComponentChildren;
+    }) => import("preact").JSX.Element;
+    Interrupt: ({ interrupt, children, }: {
+        interrupt: ChatUIInterrupt;
+        children?: (mixed: ChatUIInterrupt & InterruptMixins<TOptions>) => ComponentChildren;
+    }) => import("preact").JSX.Element;
+    Queue: () => import("preact").JSX.Element | null;
+    useChatContext: () => ChatUIHost<TOptions>;
+    Input: TInput | undefined;
+};
+export {};