@assistant-ui/react 0.1.8 → 0.1.10

package/README.md

@@ -1,6 +1,8 @@
-# `assistant-ui`
+<a href="https://www.assistant-ui.com">
+  <img src="https://raw.githubusercontent.com/Yonom/assistant-ui/main/.github/assets/header.svg" alt="assistant-ui Header" width="100%" />
+</a>
 
-`assistant-ui` is a set of React components for AI chat.
+assistant-ui is a set of React components for AI chat.
 
 - [Discord](https://discord.gg/S9dwgCNEFs)
 - [Website](https://assistant-ui.com/)
@@ -10,105 +12,21 @@
 
 - [Documentation](https://www.assistant-ui.com/docs/getting-started)
 
-## Starter Template
+## Quick Start
 
-```
-npx assistant-ui@latest create
-```
+[![assistant-ui starter template](https://raw.githubusercontent.com/Yonom/assistant-ui/main/.github/assets/assistant-ui-starter.gif)](https://youtu.be/k6Dc8URmLjk)
 
-## Quick Start In Existing Project
-![Demo of my project](demo.gif)
+Step 1: Create a new project with `assistant-ui` pre-configured:
 
-### PREREQUISITES:
-It is assumed that you have already installed and initialized node.js, tailwind, typescript, react, next.js. If not, follow the instructions:
-```sh
-npx create-next-app@latest my-app --typescript --tailwind
-```
 ```sh
+npx assistant-ui@latest create my-app
 cd my-app
 ```
-```sh
-npm install @ai-sdk/react @assistant-ui/react @assistant-ui/react-ai-sdk
-```
-Install shadcn react components, follow instructins with default answers
-```sh
-npx shadcn-ui init
-```
-
-GETTING STARTED:
-```sh
-npx assistant-ui@latest add modal
-```
-
-Create/edit your desired page file:
-```
-/src/app/pages.tsx
-```
 
-```tsx
-"use client";
+Step 2: Update the `.env` file with your OpenAI API key. 
 
-import { useChat } from "@ai-sdk/react";
-import { AssistantRuntimeProvider } from "@assistant-ui/react";
-import { useVercelUseChatRuntime } from "@assistant-ui/react-ai-sdk";
-import { AssistantModal } from "@/components/ui/assistant-ui/assistant-modal";
-
-const MyApp = () => {
-  const chat = useChat({ 
-    api: "/api/chat" // your backend route
-  });
-  const runtime = useVercelUseChatRuntime(chat);
-
-  return (
-    <AssistantRuntimeProvider runtime={runtime}>
-      <AssistantModal />
-    </AssistantRuntimeProvider>
-);        
-}
-
-export default MyApp; 
-```
-
-
-### Backend connection using Vercel AI SDK:
-
-```sh
-npm install @ai-sdk/openai
-```
-
-```sh
-npm install @assistant-ui/react-hook-form
-```
-
-Create backend route file:
-```
-/src/app/api/chat/route.ts
-```
-
-```tsx
-import { openai } from '@ai-sdk/openai';
-import { streamText } from 'ai';
- 
-export const maxDuration = 30;
- 
-export async function POST(req: Request) {
-  const { messages } = await req.json();
-  
-  const result = await streamText({
-    model: openai('gpt-4o'),
-    messages,
-  });
- 
-  return result.toAIStreamResponse();
-}
-```
-
-```sh
-export OPENAI_API_KEY="skXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX"
-```
+Step 3: Run the app:
 
 ```sh
 npm run dev
 ```
-
-Now Open: [http://localhost:3000](http://localhost:3000)

package/dist/{Thread-CoxBELWy.d.mts → ThreadActions-DqqhRbf1.d.mts}

@@ -80,15 +80,18 @@ type ModelConfigProvider = () => ModelConfig;
 
 type Unsubscribe = () => void;
 
-type ThreadState = {
+type ThreadState = Readonly<{
     messages: readonly ThreadMessage[];
     isRunning: boolean;
+}>;
+
+type ThreadActionsState = Readonly<{
     getBranches: (messageId: string) => readonly string[];
     switchToBranch: (branchId: string) => void;
     append: (message: AppendMessage) => void;
     startRun: (parentId: string | null) => void;
     cancelRun: () => void;
     addToolResult: (toolCallId: string, result: any) => void;
-};
+}>;
 
-export type { AssistantContentPart as A, ImageContentPartComponent as I, ModelConfigProvider as M, TextContentPartComponent as T, UIContentPartComponent as U, ToolCallContentPartComponent as a, ToolCallContentPartProps as b, ThreadState as c, Unsubscribe as d, ThreadMessage as e, ModelConfig as f, AppendMessage as g, AssistantMessage as h, UserMessage as i, UserContentPart as j, AppendContentPart as k, TextContentPart as l, Tool as m, ImageContentPart as n, ToolCallContentPart as o, UIContentPart as p, TextContentPartProps as q, ImageContentPartProps as r, UIContentPartProps as s };
+export type { AssistantContentPart as A, ImageContentPartComponent as I, ModelConfigProvider as M, TextContentPartComponent as T, UIContentPartComponent as U, ToolCallContentPartComponent as a, ToolCallContentPartProps as b, ThreadState as c, ThreadActionsState as d, Unsubscribe as e, ThreadMessage as f, ModelConfig as g, AppendMessage as h, AssistantMessage as i, UserMessage as j, UserContentPart as k, AppendContentPart as l, TextContentPart as m, Tool as n, ImageContentPart as o, ToolCallContentPart as p, UIContentPart as q, TextContentPartProps as r, ImageContentPartProps as s, UIContentPartProps as t };

package/dist/{Thread-CoxBELWy.d.ts → ThreadActions-DqqhRbf1.d.ts}

@@ -80,15 +80,18 @@ type ModelConfigProvider = () => ModelConfig;
 
 type Unsubscribe = () => void;
 
-type ThreadState = {
+type ThreadState = Readonly<{
     messages: readonly ThreadMessage[];
     isRunning: boolean;
+}>;
+
+type ThreadActionsState = Readonly<{
     getBranches: (messageId: string) => readonly string[];
     switchToBranch: (branchId: string) => void;
     append: (message: AppendMessage) => void;
     startRun: (parentId: string | null) => void;
     cancelRun: () => void;
     addToolResult: (toolCallId: string, result: any) => void;
-};
+}>;
 
-export type { AssistantContentPart as A, ImageContentPartComponent as I, ModelConfigProvider as M, TextContentPartComponent as T, UIContentPartComponent as U, ToolCallContentPartComponent as a, ToolCallContentPartProps as b, ThreadState as c, Unsubscribe as d, ThreadMessage as e, ModelConfig as f, AppendMessage as g, AssistantMessage as h, UserMessage as i, UserContentPart as j, AppendContentPart as k, TextContentPart as l, Tool as m, ImageContentPart as n, ToolCallContentPart as o, UIContentPart as p, TextContentPartProps as q, ImageContentPartProps as r, UIContentPartProps as s };
+export type { AssistantContentPart as A, ImageContentPartComponent as I, ModelConfigProvider as M, TextContentPartComponent as T, UIContentPartComponent as U, ToolCallContentPartComponent as a, ToolCallContentPartProps as b, ThreadState as c, ThreadActionsState as d, Unsubscribe as e, ThreadMessage as f, ModelConfig as g, AppendMessage as h, AssistantMessage as i, UserMessage as j, UserContentPart as k, AppendContentPart as l, TextContentPart as m, Tool as n, ImageContentPart as o, ToolCallContentPart as p, UIContentPart as q, TextContentPartProps as r, ImageContentPartProps as s, UIContentPartProps as t };

package/dist/{chunk-RITM2IUH.mjs → chunk-KUACYNLE.mjs}

@@ -4,7 +4,7 @@ var __export = (target, all) => {
     __defProp(target, name, { get: all[name], enumerable: true });
 };
 
-// src/context/MessageContext.ts
+// src/context/react/MessageContext.ts
 import { createContext, useContext } from "react";
 var MessageContext = createContext(null);
 var useMessageContext = () => {
@@ -16,7 +16,7 @@ var useMessageContext = () => {
   return context;
 };
 
-// src/context/ThreadContext.ts
+// src/context/react/ThreadContext.ts
 import { createContext as createContext2, useContext as useContext2 } from "react";
 var ThreadContext = createContext2(null);
 var useThreadContext = () => {
@@ -28,27 +28,13 @@ var useThreadContext = () => {
   return context;
 };
 
-// src/context/ComposerContext.ts
-import { useContext as useContext3, useMemo } from "react";
-var useComposerContext = () => {
-  const { useComposer } = useThreadContext();
-  const { useComposer: useEditComposer } = useContext3(MessageContext) ?? {};
-  return useMemo(
-    () => ({
-      useComposer: useEditComposer ?? useComposer,
-      type: useEditComposer ? "edit" : "new"
-    }),
-    [useEditComposer, useComposer]
-  );
-};
-
-// src/context/AssistantContext.ts
-import { createContext as createContext3, useContext as useContext4 } from "react";
+// src/context/react/AssistantContext.ts
+import { createContext as createContext3, useContext as useContext3 } from "react";
 var AssistantContext = createContext3(
   null
 );
 var useAssistantContext = () => {
-  const context = useContext4(AssistantContext);
+  const context = useContext3(AssistantContext);
   if (!context)
     throw new Error(
       "This component must be used within an AssistantRuntimeProvider."
@@ -56,7 +42,21 @@ var useAssistantContext = () => {
   return context;
 };
 
-// src/context/ContentPartContext.ts
+// src/context/react/ComposerContext.ts
+import { useContext as useContext4, useMemo } from "react";
+var useComposerContext = () => {
+  const { useComposer } = useThreadContext();
+  const { useEditComposer } = useContext4(MessageContext) ?? {};
+  return useMemo(
+    () => ({
+      useComposer: useEditComposer ?? useComposer,
+      type: useEditComposer ? "edit" : "new"
+    }),
+    [useEditComposer, useComposer]
+  );
+};
+
+// src/context/react/ContentPartContext.ts
 import { createContext as createContext4, useContext as useContext5 } from "react";
 var ContentPartContext = createContext4(
   null
@@ -76,10 +76,10 @@ export {
   useMessageContext,
   ThreadContext,
   useThreadContext,
-  useComposerContext,
   AssistantContext,
   useAssistantContext,
+  useComposerContext,
   ContentPartContext,
   useContentPartContext
 };
-//# sourceMappingURL=chunk-RITM2IUH.mjs.map
+//# sourceMappingURL=chunk-KUACYNLE.mjs.map

package/dist/chunk-KUACYNLE.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/context/react/MessageContext.ts","../src/context/react/ThreadContext.ts","../src/context/react/AssistantContext.ts","../src/context/react/ComposerContext.ts","../src/context/react/ContentPartContext.ts"],"sourcesContent":["import { createContext, useContext } from \"react\";\nimport type { MessageState } from \"../stores/Message\";\nimport type { EditComposerState } from \"../stores/EditComposer\";\nimport { ReadonlyStore } from \"../ReadonlyStore\";\nimport { MessageUtilsState } from \"../stores/MessageUtils\";\n\nexport type MessageContextValue = {\n  useMessage: ReadonlyStore<MessageState>;\n  useMessageUtils: ReadonlyStore<MessageUtilsState>;\n  useEditComposer: ReadonlyStore<EditComposerState>;\n};\n\nexport const MessageContext = createContext<MessageContextValue | null>(null);\n\nexport const useMessageContext = () => {\n  const context = useContext(MessageContext);\n  if (!context)\n    throw new Error(\n      \"This component can only be used inside a component passed to <ThreadPrimitive.Messages components={...} />.\",\n    );\n  return context;\n};\n","import { createContext, useContext } from \"react\";\nimport type { ComposerState } from \"../stores/Composer\";\nimport type { ThreadState } from \"../stores/Thread\";\nimport type { ThreadViewportState } from \"../stores/ThreadViewport\";\nimport { ThreadActionsState } from \"../stores/ThreadActions\";\nimport { ReadonlyStore } from \"../ReadonlyStore\";\n\nexport type ThreadContextValue = {\n  useThread: ReadonlyStore<ThreadState>;\n  useThreadActions: ReadonlyStore<ThreadActionsState>;\n  useComposer: ReadonlyStore<ComposerState>;\n  useViewport: ReadonlyStore<ThreadViewportState>;\n};\n\nexport const ThreadContext = createContext<ThreadContextValue | null>(null);\n\nexport const useThreadContext = (): ThreadContextValue => {\n  const context = useContext(ThreadContext);\n  if (!context)\n    throw new Error(\n      \"This component must be used within an AssistantRuntimeProvider.\",\n    );\n  return context;\n};\n","import { createContext, useContext } from \"react\";\nimport type { AssistantModelConfigState } from \"../stores/AssistantModelConfig\";\nimport type { AssistantToolUIsState } from \"../stores/AssistantToolUIs\";\nimport { ReadonlyStore } from \"../ReadonlyStore\";\n\nexport type AssistantContextValue = {\n  useModelConfig: ReadonlyStore<AssistantModelConfigState>;\n  useToolUIs: ReadonlyStore<AssistantToolUIsState>;\n};\n\nexport const AssistantContext = createContext<AssistantContextValue | null>(\n  null,\n);\n\nexport const useAssistantContext = (): AssistantContextValue => {\n  const context = useContext(AssistantContext);\n  if (!context)\n    throw new Error(\n      \"This component must be used within an AssistantRuntimeProvider.\",\n    );\n  return context;\n};\n","import { useContext, useMemo } from \"react\";\nimport { MessageContext } from \"./MessageContext\";\nimport { useThreadContext } from \"./ThreadContext\";\nimport type { ComposerState } from \"../stores/Composer\";\nimport type { EditComposerState } from \"../stores/EditComposer\";\nimport { ReadonlyStore } from \"../ReadonlyStore\";\n\nexport type ComposerContextValue = {\n  useComposer: ReadonlyStore<EditComposerState | ComposerState>;\n  type: \"edit\" | \"new\";\n};\n\nexport const useComposerContext = (): ComposerContextValue => {\n  const { useComposer } = useThreadContext();\n  const { useEditComposer } = useContext(MessageContext) ?? {};\n  return useMemo(\n    () => ({\n      useComposer: (useEditComposer ?? useComposer) as ReadonlyStore<\n        EditComposerState | ComposerState\n      >,\n      type: useEditComposer ? (\"edit\" as const) : (\"new\" as const),\n    }),\n    [useEditComposer, useComposer],\n  );\n};\n","import { createContext, useContext } from \"react\";\nimport type { ContentPartState } from \"../stores/ContentPart\";\nimport { ReadonlyStore } from \"../ReadonlyStore\";\n\nexport type ContentPartContextValue = {\n  useContentPart: ReadonlyStore<ContentPartState>;\n};\n\nexport const ContentPartContext = createContext<ContentPartContextValue | null>(\n  null,\n);\n\nexport const useContentPartContext = (): ContentPartContextValue => {\n  const context = useContext(ContentPartContext);\n  if (!context)\n    throw new Error(\n      \"This component can only be used inside a component passed to <MessagePrimitive.Content components={...} >.\",\n    );\n  return context;\n};\n"],"mappings":";;;;;;;AAAA,SAAS,eAAe,kBAAkB;AAYnC,IAAM,iBAAiB,cAA0C,IAAI;AAErE,IAAM,oBAAoB,MAAM;AACrC,QAAM,UAAU,WAAW,cAAc;AACzC,MAAI,CAAC;AACH,UAAM,IAAI;AAAA,MACR;AAAA,IACF;AACF,SAAO;AACT;;;ACrBA,SAAS,iBAAAA,gBAAe,cAAAC,mBAAkB;AAcnC,IAAM,gBAAgBD,eAAyC,IAAI;AAEnE,IAAM,mBAAmB,MAA0B;AACxD,QAAM,UAAUC,YAAW,aAAa;AACxC,MAAI,CAAC;AACH,UAAM,IAAI;AAAA,MACR;AAAA,IACF;AACF,SAAO;AACT;;;ACvBA,SAAS,iBAAAC,gBAAe,cAAAC,mBAAkB;AAUnC,IAAM,mBAAmBD;AAAA,EAC9B;AACF;AAEO,IAAM,sBAAsB,MAA6B;AAC9D,QAAM,UAAUC,YAAW,gBAAgB;AAC3C,MAAI,CAAC;AACH,UAAM,IAAI;AAAA,MACR;AAAA,IACF;AACF,SAAO;AACT;;;ACrBA,SAAS,cAAAC,aAAY,eAAe;AAY7B,IAAM,qBAAqB,MAA4B;AAC5D,QAAM,EAAE,YAAY,IAAI,iBAAiB;AACzC,QAAM,EAAE,gBAAgB,IAAIC,YAAW,cAAc,KAAK,CAAC;AAC3D,SAAO;AAAA,IACL,OAAO;AAAA,MACL,aAAc,mBAAmB;AAAA,MAGjC,MAAM,kBAAmB,SAAoB;AAAA,IAC/C;AAAA,IACA,CAAC,iBAAiB,WAAW;AAAA,EAC/B;AACF;;;ACxBA,SAAS,iBAAAC,gBAAe,cAAAC,mBAAkB;AAQnC,IAAM,qBAAqBD;AAAA,EAChC;AACF;AAEO,IAAM,wBAAwB,MAA+B;AAClE,QAAM,UAAUC,YAAW,kBAAkB;AAC7C,MAAI,CAAC;AACH,UAAM,IAAI;AAAA,MACR;AAAA,IACF;AACF,SAAO;AACT;","names":["createContext","useContext","createContext","useContext","useContext","useContext","createContext","useContext"]}

package/dist/experimental.d.mts

@@ -1,13 +1,13 @@
-import { M as ModelConfigProvider, e as ThreadMessage, d as Unsubscribe, a as ToolCallContentPartComponent, c as ThreadState, m as Tool } from './Thread-CoxBELWy.mjs';
-export { n as ImageContentPart, I as ImageContentPartComponent, r as ImageContentPartProps, f as ModelConfig, T as TextContentPartComponent, q as TextContentPartProps, o as ToolCallContentPart, b as ToolCallContentPartProps, p as UIContentPart, U as UIContentPartComponent, s as UIContentPartProps } from './Thread-CoxBELWy.mjs';
-import { ReactNode } from 'react';
+import { M as ModelConfigProvider, f as ThreadMessage, e as Unsubscribe, a as ToolCallContentPartComponent, c as ThreadState, d as ThreadActionsState, n as Tool } from './ThreadActions-DqqhRbf1.mjs';
+export { o as ImageContentPart, I as ImageContentPartComponent, s as ImageContentPartProps, g as ModelConfig, T as TextContentPartComponent, r as TextContentPartProps, p as ToolCallContentPart, b as ToolCallContentPartProps, q as UIContentPart, U as UIContentPartComponent, t as UIContentPartProps } from './ThreadActions-DqqhRbf1.mjs';
 import { UseBoundStore, StoreApi } from 'zustand';
+import { ReactNode } from 'react';
 import 'zod';
 
-type AssistantModelConfigState = {
+type AssistantModelConfigState = Readonly<{
     getModelConfig: ModelConfigProvider;
     registerModelConfigProvider: (provider: ModelConfigProvider) => () => void;
-};
+}>;
 
 type ContentPartState = Readonly<{
     status: "in_progress" | "done" | "error";
@@ -19,12 +19,6 @@ type MessageState = Readonly<{
     parentId: string | null;
     branches: readonly string[];
     isLast: boolean;
-    inProgressIndicator: ReactNode | null;
-    setInProgressIndicator: (value: ReactNode | null) => void;
-    isCopied: boolean;
-    setIsCopied: (value: boolean) => void;
-    isHovering: boolean;
-    setIsHovering: (value: boolean) => void;
 }>;
 
 type BaseComposerState = Readonly<{
@@ -32,6 +26,8 @@ type BaseComposerState = Readonly<{
     setValue: (value: string) => void;
 }>;
 
+type ReadonlyStore<T> = UseBoundStore<Omit<StoreApi<T>, "setState" | "destroy" | "getInitialState">>;
+
 type EditComposerState = BaseComposerState & Readonly<{
     isEditing: boolean;
     edit: () => void;
@@ -45,44 +41,55 @@ type ComposerState = BaseComposerState & Readonly<{
     cancel: () => boolean;
 }>;
 
-type ThreadViewportState = {
+type ThreadViewportState = Readonly<{
     isAtBottom: boolean;
     scrollToBottom: () => void;
     onScrollToBottom: (callback: () => void) => Unsubscribe;
-};
+}>;
 
-type AssistantToolUIsState = {
+type AssistantToolUIsState = Readonly<{
     getToolUI: (toolName: string) => ToolCallContentPartComponent | null;
     setToolUI: (toolName: string, render: ToolCallContentPartComponent) => () => void;
-};
+}>;
 
 type AssistantContextValue = {
-    useModelConfig: UseBoundStore<StoreApi<AssistantModelConfigState>>;
-    useToolUIs: UseBoundStore<StoreApi<AssistantToolUIsState>>;
+    useModelConfig: ReadonlyStore<AssistantModelConfigState>;
+    useToolUIs: ReadonlyStore<AssistantToolUIsState>;
 };
 declare const useAssistantContext: () => AssistantContextValue;
 
 type ThreadContextValue = {
-    useThread: UseBoundStore<StoreApi<ThreadState>>;
-    useComposer: UseBoundStore<StoreApi<ComposerState>>;
-    useViewport: UseBoundStore<StoreApi<ThreadViewportState>>;
+    useThread: ReadonlyStore<ThreadState>;
+    useThreadActions: ReadonlyStore<ThreadActionsState>;
+    useComposer: ReadonlyStore<ComposerState>;
+    useViewport: ReadonlyStore<ThreadViewportState>;
 };
 declare const useThreadContext: () => ThreadContextValue;
 
 type ComposerContextValue = {
-    useComposer: UseBoundStore<StoreApi<EditComposerState | ComposerState>>;
+    useComposer: ReadonlyStore<EditComposerState | ComposerState>;
     type: "edit" | "new";
 };
 declare const useComposerContext: () => ComposerContextValue;
 
+type MessageUtilsState = Readonly<{
+    inProgressIndicator: ReactNode | null;
+    setInProgressIndicator: (value: ReactNode | null) => void;
+    isCopied: boolean;
+    setIsCopied: (value: boolean) => void;
+    isHovering: boolean;
+    setIsHovering: (value: boolean) => void;
+}>;
+
 type MessageContextValue = {
-    useMessage: UseBoundStore<StoreApi<MessageState>>;
-    useComposer: UseBoundStore<StoreApi<EditComposerState>>;
+    useMessage: ReadonlyStore<MessageState>;
+    useMessageUtils: ReadonlyStore<MessageUtilsState>;
+    useEditComposer: ReadonlyStore<EditComposerState>;
 };
 declare const useMessageContext: () => MessageContextValue;
 
 type ContentPartContextValue = {
-    useContentPart: UseBoundStore<StoreApi<ContentPartState>>;
+    useContentPart: ReadonlyStore<ContentPartState>;
 };
 declare const useContentPartContext: () => ContentPartContextValue;
 

package/dist/experimental.d.ts

@@ -1,13 +1,13 @@
-import { M as ModelConfigProvider, e as ThreadMessage, d as Unsubscribe, a as ToolCallContentPartComponent, c as ThreadState, m as Tool } from './Thread-CoxBELWy.js';
-export { n as ImageContentPart, I as ImageContentPartComponent, r as ImageContentPartProps, f as ModelConfig, T as TextContentPartComponent, q as TextContentPartProps, o as ToolCallContentPart, b as ToolCallContentPartProps, p as UIContentPart, U as UIContentPartComponent, s as UIContentPartProps } from './Thread-CoxBELWy.js';
-import { ReactNode } from 'react';
+import { M as ModelConfigProvider, f as ThreadMessage, e as Unsubscribe, a as ToolCallContentPartComponent, c as ThreadState, d as ThreadActionsState, n as Tool } from './ThreadActions-DqqhRbf1.js';
+export { o as ImageContentPart, I as ImageContentPartComponent, s as ImageContentPartProps, g as ModelConfig, T as TextContentPartComponent, r as TextContentPartProps, p as ToolCallContentPart, b as ToolCallContentPartProps, q as UIContentPart, U as UIContentPartComponent, t as UIContentPartProps } from './ThreadActions-DqqhRbf1.js';
 import { UseBoundStore, StoreApi } from 'zustand';
+import { ReactNode } from 'react';
 import 'zod';
 
-type AssistantModelConfigState = {
+type AssistantModelConfigState = Readonly<{
     getModelConfig: ModelConfigProvider;
     registerModelConfigProvider: (provider: ModelConfigProvider) => () => void;
-};
+}>;
 
 type ContentPartState = Readonly<{
     status: "in_progress" | "done" | "error";
@@ -19,12 +19,6 @@ type MessageState = Readonly<{
     parentId: string | null;
     branches: readonly string[];
     isLast: boolean;
-    inProgressIndicator: ReactNode | null;
-    setInProgressIndicator: (value: ReactNode | null) => void;
-    isCopied: boolean;
-    setIsCopied: (value: boolean) => void;
-    isHovering: boolean;
-    setIsHovering: (value: boolean) => void;
 }>;
 
 type BaseComposerState = Readonly<{
@@ -32,6 +26,8 @@ type BaseComposerState = Readonly<{
     setValue: (value: string) => void;
 }>;
 
+type ReadonlyStore<T> = UseBoundStore<Omit<StoreApi<T>, "setState" | "destroy" | "getInitialState">>;
+
 type EditComposerState = BaseComposerState & Readonly<{
     isEditing: boolean;
     edit: () => void;
@@ -45,44 +41,55 @@ type ComposerState = BaseComposerState & Readonly<{
     cancel: () => boolean;
 }>;
 
-type ThreadViewportState = {
+type ThreadViewportState = Readonly<{
     isAtBottom: boolean;
     scrollToBottom: () => void;
     onScrollToBottom: (callback: () => void) => Unsubscribe;
-};
+}>;
 
-type AssistantToolUIsState = {
+type AssistantToolUIsState = Readonly<{
     getToolUI: (toolName: string) => ToolCallContentPartComponent | null;
     setToolUI: (toolName: string, render: ToolCallContentPartComponent) => () => void;
-};
+}>;
 
 type AssistantContextValue = {
-    useModelConfig: UseBoundStore<StoreApi<AssistantModelConfigState>>;
-    useToolUIs: UseBoundStore<StoreApi<AssistantToolUIsState>>;
+    useModelConfig: ReadonlyStore<AssistantModelConfigState>;
+    useToolUIs: ReadonlyStore<AssistantToolUIsState>;
 };
 declare const useAssistantContext: () => AssistantContextValue;
 
 type ThreadContextValue = {
-    useThread: UseBoundStore<StoreApi<ThreadState>>;
-    useComposer: UseBoundStore<StoreApi<ComposerState>>;
-    useViewport: UseBoundStore<StoreApi<ThreadViewportState>>;
+    useThread: ReadonlyStore<ThreadState>;
+    useThreadActions: ReadonlyStore<ThreadActionsState>;
+    useComposer: ReadonlyStore<ComposerState>;
+    useViewport: ReadonlyStore<ThreadViewportState>;
 };
 declare const useThreadContext: () => ThreadContextValue;
 
 type ComposerContextValue = {
-    useComposer: UseBoundStore<StoreApi<EditComposerState | ComposerState>>;
+    useComposer: ReadonlyStore<EditComposerState | ComposerState>;
     type: "edit" | "new";
 };
 declare const useComposerContext: () => ComposerContextValue;
 
+type MessageUtilsState = Readonly<{
+    inProgressIndicator: ReactNode | null;
+    setInProgressIndicator: (value: ReactNode | null) => void;
+    isCopied: boolean;
+    setIsCopied: (value: boolean) => void;
+    isHovering: boolean;
+    setIsHovering: (value: boolean) => void;
+}>;
+
 type MessageContextValue = {
-    useMessage: UseBoundStore<StoreApi<MessageState>>;
-    useComposer: UseBoundStore<StoreApi<EditComposerState>>;
+    useMessage: ReadonlyStore<MessageState>;
+    useMessageUtils: ReadonlyStore<MessageUtilsState>;
+    useEditComposer: ReadonlyStore<EditComposerState>;
 };
 declare const useMessageContext: () => MessageContextValue;
 
 type ContentPartContextValue = {
-    useContentPart: UseBoundStore<StoreApi<ContentPartState>>;
+    useContentPart: ReadonlyStore<ContentPartState>;
 };
 declare const useContentPartContext: () => ContentPartContextValue;
 

package/dist/experimental.js

@@ -33,7 +33,7 @@ __export(experimental_exports, {
 });
 module.exports = __toCommonJS(experimental_exports);
 
-// src/context/AssistantContext.ts
+// src/context/react/AssistantContext.ts
 var import_react = require("react");
 var AssistantContext = (0, import_react.createContext)(
   null
@@ -47,7 +47,7 @@ var useAssistantContext = () => {
   return context;
 };
 
-// src/context/ThreadContext.ts
+// src/context/react/ThreadContext.ts
 var import_react2 = require("react");
 var ThreadContext = (0, import_react2.createContext)(null);
 var useThreadContext = () => {
@@ -59,10 +59,10 @@ var useThreadContext = () => {
   return context;
 };
 
-// src/context/ComposerContext.ts
+// src/context/react/ComposerContext.ts
 var import_react4 = require("react");
 
-// src/context/MessageContext.ts
+// src/context/react/MessageContext.ts
 var import_react3 = require("react");
 var MessageContext = (0, import_react3.createContext)(null);
 var useMessageContext = () => {
@@ -74,10 +74,10 @@ var useMessageContext = () => {
   return context;
 };
 
-// src/context/ComposerContext.ts
+// src/context/react/ComposerContext.ts
 var useComposerContext = () => {
   const { useComposer } = useThreadContext();
-  const { useComposer: useEditComposer } = (0, import_react4.useContext)(MessageContext) ?? {};
+  const { useEditComposer } = (0, import_react4.useContext)(MessageContext) ?? {};
   return (0, import_react4.useMemo)(
     () => ({
       useComposer: useEditComposer ?? useComposer,
@@ -87,7 +87,7 @@ var useComposerContext = () => {
   );
 };
 
-// src/context/ContentPartContext.ts
+// src/context/react/ContentPartContext.ts
 var import_react5 = require("react");
 var ContentPartContext = (0, import_react5.createContext)(
   null

package/dist/experimental.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/experimental.ts","../src/context/AssistantContext.ts","../src/context/ThreadContext.ts","../src/context/ComposerContext.ts","../src/context/MessageContext.ts","../src/context/ContentPartContext.ts","../src/model-config/useAssistantInstructions.tsx","../src/model-config/useAssistantTool.tsx","../src/model-config/useAssistantToolUI.tsx","../src/model-config/makeAssistantTool.tsx","../src/model-config/makeAssistantToolUI.tsx"],"sourcesContent":["export type {\n  ImageContentPart,\n  ToolCallContentPart,\n  UIContentPart,\n} from \"./utils/AssistantTypes\";\n\nexport type {\n  ModelConfigProvider,\n  ModelConfig,\n} from \"./utils/ModelConfigTypes\";\n\nexport type {\n  TextContentPartProps,\n  TextContentPartComponent,\n  ImageContentPartProps,\n  ImageContentPartComponent,\n  UIContentPartProps,\n  UIContentPartComponent,\n  ToolCallContentPartProps,\n  ToolCallContentPartComponent,\n} from \"./primitives/message/ContentPartComponentTypes\";\n\nexport * from \"./context\";\nexport { useAssistantInstructions } from \"./model-config/useAssistantInstructions\";\nexport {\n  useAssistantTool,\n  type AssistantToolProps,\n} from \"./model-config/useAssistantTool\";\nexport {\n  useAssistantToolUI,\n  type AssistantToolUIProps,\n} from \"./model-config/useAssistantToolUI\";\nexport { makeAssistantTool } from \"./model-config/makeAssistantTool\";\nexport { makeAssistantToolUI } from \"./model-config/makeAssistantToolUI\";\n","import { createContext, useContext } from \"react\";\nimport type { StoreApi, UseBoundStore } from \"zustand\";\nimport type { AssistantModelConfigState } from \"./stores/AssistantModelConfig\";\nimport type { AssistantToolUIsState } from \"./stores/AssistantToolUIs\";\n\nexport type AssistantContextValue = {\n  useModelConfig: UseBoundStore<StoreApi<AssistantModelConfigState>>;\n  useToolUIs: UseBoundStore<StoreApi<AssistantToolUIsState>>;\n};\n\nexport const AssistantContext = createContext<AssistantContextValue | null>(\n  null,\n);\n\nexport const useAssistantContext = (): AssistantContextValue => {\n  const context = useContext(AssistantContext);\n  if (!context)\n    throw new Error(\n      \"This component must be used within an AssistantRuntimeProvider.\",\n    );\n  return context;\n};\n","import { createContext, useContext } from \"react\";\nimport type { StoreApi, UseBoundStore } from \"zustand\";\nimport type { ComposerState } from \"./stores/Composer\";\nimport type { ThreadState } from \"./stores/Thread\";\nimport type { ThreadViewportState } from \"./stores/ThreadViewport\";\n\nexport type ThreadContextValue = {\n  useThread: UseBoundStore<StoreApi<ThreadState>>;\n  useComposer: UseBoundStore<StoreApi<ComposerState>>;\n  useViewport: UseBoundStore<StoreApi<ThreadViewportState>>;\n};\n\nexport const ThreadContext = createContext<ThreadContextValue | null>(null);\n\nexport const useThreadContext = (): ThreadContextValue => {\n  const context = useContext(ThreadContext);\n  if (!context)\n    throw new Error(\n      \"This component must be used within an AssistantRuntimeProvider.\",\n    );\n  return context;\n};\n","import { useContext, useMemo } from \"react\";\nimport type { StoreApi, UseBoundStore } from \"zustand\";\nimport { MessageContext } from \"./MessageContext\";\nimport { useThreadContext } from \"./ThreadContext\";\nimport type { ComposerState } from \"./stores/Composer\";\nimport type { EditComposerState } from \"./stores/MessageComposer\";\n\nexport type ComposerContextValue = {\n  useComposer: UseBoundStore<StoreApi<EditComposerState | ComposerState>>;\n  type: \"edit\" | \"new\";\n};\n\nexport const useComposerContext = (): ComposerContextValue => {\n  const { useComposer } = useThreadContext();\n  const { useComposer: useEditComposer } = useContext(MessageContext) ?? {};\n  return useMemo(\n    () => ({\n      useComposer: (useEditComposer ?? useComposer) as UseBoundStore<\n        StoreApi<EditComposerState | ComposerState>\n      >,\n      type: useEditComposer ? (\"edit\" as const) : (\"new\" as const),\n    }),\n    [useEditComposer, useComposer],\n  );\n};\n","import { createContext, useContext } from \"react\";\nimport type { StoreApi, UseBoundStore } from \"zustand\";\nimport type { MessageState } from \"./stores/Message\";\nimport type { EditComposerState } from \"./stores/MessageComposer\";\n\nexport type MessageContextValue = {\n  useMessage: UseBoundStore<StoreApi<MessageState>>;\n  useComposer: UseBoundStore<StoreApi<EditComposerState>>;\n};\n\nexport const MessageContext = createContext<MessageContextValue | null>(null);\n\nexport const useMessageContext = () => {\n  const context = useContext(MessageContext);\n  if (!context)\n    throw new Error(\n      \"This component can only be used inside a component passed to <ThreadPrimitive.Messages components={...} />.\",\n    );\n  return context;\n};\n","import { createContext, useContext } from \"react\";\nimport type { StoreApi, UseBoundStore } from \"zustand\";\nimport type { ContentPartState } from \"./stores/ContentPart\";\n\nexport type ContentPartContextValue = {\n  useContentPart: UseBoundStore<StoreApi<ContentPartState>>;\n};\n\nexport const ContentPartContext = createContext<ContentPartContextValue | null>(\n  null,\n);\n\nexport const useContentPartContext = (): ContentPartContextValue => {\n  const context = useContext(ContentPartContext);\n  if (!context)\n    throw new Error(\n      \"This component can only be used inside a component passed to <MessagePrimitive.Content components={...} >.\",\n    );\n  return context;\n};\n","\"use client\";\n\nimport { useEffect } from \"react\";\nimport { useAssistantContext } from \"../context/AssistantContext\";\n\nexport const useAssistantInstructions = (instruction: string) => {\n  const { useModelConfig } = useAssistantContext();\n  const registerModelConfigProvider = useModelConfig(\n    (s) => s.registerModelConfigProvider,\n  );\n  useEffect(() => {\n    const config = {\n      system: instruction,\n    };\n    return registerModelConfigProvider(() => config);\n  }, [registerModelConfigProvider, instruction]);\n};\n","\"use client\";\n\nimport { useEffect } from \"react\";\nimport { useAssistantContext } from \"../context/AssistantContext\";\nimport type { ToolCallContentPartComponent } from \"../primitives/message/ContentPartComponentTypes\";\nimport type { Tool } from \"../utils/ModelConfigTypes\";\n\nexport type AssistantToolProps<TArgs, TResult> = Tool<TArgs, TResult> & {\n  toolName: string;\n  render?: ToolCallContentPartComponent<TArgs, TResult>;\n};\n\nexport const useAssistantTool = <TArgs, TResult>(\n  tool: AssistantToolProps<TArgs, TResult>,\n) => {\n  const { useModelConfig, useToolUIs } = useAssistantContext();\n  const registerModelConfigProvider = useModelConfig(\n    (s) => s.registerModelConfigProvider,\n  );\n  const setToolUI = useToolUIs((s) => s.setToolUI);\n  useEffect(() => {\n    const { toolName, render, ...rest } = tool;\n    const config = {\n      tools: {\n        [tool.toolName]: rest,\n      },\n    };\n    const unsub1 = registerModelConfigProvider(() => config);\n    const unsub2 = render ? setToolUI(toolName, render) : undefined;\n    return () => {\n      unsub1();\n      unsub2?.();\n    };\n  }, [registerModelConfigProvider, setToolUI, tool]);\n};\n","\"use client\";\nimport { useEffect } from \"react\";\nimport { useAssistantContext } from \"../context/AssistantContext\";\nimport type { ToolCallContentPartComponent } from \"../primitives/message/ContentPartComponentTypes\";\n\nexport type AssistantToolUIProps<TArgs, TResult> = {\n  toolName: string;\n  render: ToolCallContentPartComponent<TArgs, TResult>;\n};\n\nexport const useAssistantToolUI = (\n  tool: AssistantToolUIProps<any, any> | null,\n) => {\n  const { useToolUIs } = useAssistantContext();\n  const setToolUI = useToolUIs((s) => s.setToolUI);\n  useEffect(() => {\n    if (!tool) return;\n    const { toolName, render } = tool;\n    return setToolUI(toolName, render);\n  }, [setToolUI, tool]);\n};\n","\"use client\";\nimport { type AssistantToolProps, useAssistantTool } from \"./useAssistantTool\";\n\nexport const makeAssistantTool = <TArgs, TResult>(\n  tool: AssistantToolProps<TArgs, TResult>,\n) => {\n  const Tool = () => {\n    useAssistantTool(tool);\n    return null;\n  };\n  return Tool;\n};\n","\"use client\";\nimport {\n  type AssistantToolUIProps,\n  useAssistantToolUI,\n} from \"./useAssistantToolUI\";\n\nexport const makeAssistantToolUI = <TArgs, TResult>(\n  tool: AssistantToolUIProps<TArgs, TResult>,\n) => {\n  const ToolUI = () => {\n    useAssistantToolUI(tool);\n    return null;\n  };\n  return ToolUI;\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,mBAA0C;AAUnC,IAAM,uBAAmB;AAAA,EAC9B;AACF;AAEO,IAAM,sBAAsB,MAA6B;AAC9D,QAAM,cAAU,yBAAW,gBAAgB;AAC3C,MAAI,CAAC;AACH,UAAM,IAAI;AAAA,MACR;AAAA,IACF;AACF,SAAO;AACT;;;ACrBA,IAAAA,gBAA0C;AAYnC,IAAM,oBAAgB,6BAAyC,IAAI;AAEnE,IAAM,mBAAmB,MAA0B;AACxD,QAAM,cAAU,0BAAW,aAAa;AACxC,MAAI,CAAC;AACH,UAAM,IAAI;AAAA,MACR;AAAA,IACF;AACF,SAAO;AACT;;;ACrBA,IAAAC,gBAAoC;;;ACApC,IAAAC,gBAA0C;AAUnC,IAAM,qBAAiB,6BAA0C,IAAI;AAErE,IAAM,oBAAoB,MAAM;AACrC,QAAM,cAAU,0BAAW,cAAc;AACzC,MAAI,CAAC;AACH,UAAM,IAAI;AAAA,MACR;AAAA,IACF;AACF,SAAO;AACT;;;ADPO,IAAM,qBAAqB,MAA4B;AAC5D,QAAM,EAAE,YAAY,IAAI,iBAAiB;AACzC,QAAM,EAAE,aAAa,gBAAgB,QAAI,0BAAW,cAAc,KAAK,CAAC;AACxE,aAAO;AAAA,IACL,OAAO;AAAA,MACL,aAAc,mBAAmB;AAAA,MAGjC,MAAM,kBAAmB,SAAoB;AAAA,IAC/C;AAAA,IACA,CAAC,iBAAiB,WAAW;AAAA,EAC/B;AACF;;;AExBA,IAAAC,gBAA0C;AAQnC,IAAM,yBAAqB;AAAA,EAChC;AACF;AAEO,IAAM,wBAAwB,MAA+B;AAClE,QAAM,cAAU,0BAAW,kBAAkB;AAC7C,MAAI,CAAC;AACH,UAAM,IAAI;AAAA,MACR;AAAA,IACF;AACF,SAAO;AACT;;;ACjBA,IAAAC,gBAA0B;AAGnB,IAAM,2BAA2B,CAAC,gBAAwB;AAC/D,QAAM,EAAE,eAAe,IAAI,oBAAoB;AAC/C,QAAM,8BAA8B;AAAA,IAClC,CAAC,MAAM,EAAE;AAAA,EACX;AACA,+BAAU,MAAM;AACd,UAAM,SAAS;AAAA,MACb,QAAQ;AAAA,IACV;AACA,WAAO,4BAA4B,MAAM,MAAM;AAAA,EACjD,GAAG,CAAC,6BAA6B,WAAW,CAAC;AAC/C;;;ACdA,IAAAC,gBAA0B;AAUnB,IAAM,mBAAmB,CAC9B,SACG;AACH,QAAM,EAAE,gBAAgB,WAAW,IAAI,oBAAoB;AAC3D,QAAM,8BAA8B;AAAA,IAClC,CAAC,MAAM,EAAE;AAAA,EACX;AACA,QAAM,YAAY,WAAW,CAAC,MAAM,EAAE,SAAS;AAC/C,+BAAU,MAAM;AACd,UAAM,EAAE,UAAU,QAAQ,GAAG,KAAK,IAAI;AACtC,UAAM,SAAS;AAAA,MACb,OAAO;AAAA,QACL,CAAC,KAAK,QAAQ,GAAG;AAAA,MACnB;AAAA,IACF;AACA,UAAM,SAAS,4BAA4B,MAAM,MAAM;AACvD,UAAM,SAAS,SAAS,UAAU,UAAU,MAAM,IAAI;AACtD,WAAO,MAAM;AACX,aAAO;AACP,eAAS;AAAA,IACX;AAAA,EACF,GAAG,CAAC,6BAA6B,WAAW,IAAI,CAAC;AACnD;;;ACjCA,IAAAC,gBAA0B;AASnB,IAAM,qBAAqB,CAChC,SACG;AACH,QAAM,EAAE,WAAW,IAAI,oBAAoB;AAC3C,QAAM,YAAY,WAAW,CAAC,MAAM,EAAE,SAAS;AAC/C,+BAAU,MAAM;AACd,QAAI,CAAC,KAAM;AACX,UAAM,EAAE,UAAU,OAAO,IAAI;AAC7B,WAAO,UAAU,UAAU,MAAM;AAAA,EACnC,GAAG,CAAC,WAAW,IAAI,CAAC;AACtB;;;ACjBO,IAAM,oBAAoB,CAC/B,SACG;AACH,QAAM,OAAO,MAAM;AACjB,qBAAiB,IAAI;AACrB,WAAO;AAAA,EACT;AACA,SAAO;AACT;;;ACLO,IAAM,sBAAsB,CACjC,SACG;AACH,QAAM,SAAS,MAAM;AACnB,uBAAmB,IAAI;AACvB,WAAO;AAAA,EACT;AACA,SAAO;AACT;","names":["import_react","import_react","import_react","import_react","import_react","import_react","import_react"]}
+{"version":3,"sources":["../src/experimental.ts","../src/context/react/AssistantContext.ts","../src/context/react/ThreadContext.ts","../src/context/react/ComposerContext.ts","../src/context/react/MessageContext.ts","../src/context/react/ContentPartContext.ts","../src/model-config/useAssistantInstructions.tsx","../src/model-config/useAssistantTool.tsx","../src/model-config/useAssistantToolUI.tsx","../src/model-config/makeAssistantTool.tsx","../src/model-config/makeAssistantToolUI.tsx"],"sourcesContent":["export type {\n  ImageContentPart,\n  ToolCallContentPart,\n  UIContentPart,\n} from \"./utils/AssistantTypes\";\n\nexport type {\n  ModelConfigProvider,\n  ModelConfig,\n} from \"./utils/ModelConfigTypes\";\n\nexport type {\n  TextContentPartProps,\n  TextContentPartComponent,\n  ImageContentPartProps,\n  ImageContentPartComponent,\n  UIContentPartProps,\n  UIContentPartComponent,\n  ToolCallContentPartProps,\n  ToolCallContentPartComponent,\n} from \"./primitives/message/ContentPartComponentTypes\";\n\nexport * from \"./context\";\nexport { useAssistantInstructions } from \"./model-config/useAssistantInstructions\";\nexport {\n  useAssistantTool,\n  type AssistantToolProps,\n} from \"./model-config/useAssistantTool\";\nexport {\n  useAssistantToolUI,\n  type AssistantToolUIProps,\n} from \"./model-config/useAssistantToolUI\";\nexport { makeAssistantTool } from \"./model-config/makeAssistantTool\";\nexport { makeAssistantToolUI } from \"./model-config/makeAssistantToolUI\";\n","import { createContext, useContext } from \"react\";\nimport type { AssistantModelConfigState } from \"../stores/AssistantModelConfig\";\nimport type { AssistantToolUIsState } from \"../stores/AssistantToolUIs\";\nimport { ReadonlyStore } from \"../ReadonlyStore\";\n\nexport type AssistantContextValue = {\n  useModelConfig: ReadonlyStore<AssistantModelConfigState>;\n  useToolUIs: ReadonlyStore<AssistantToolUIsState>;\n};\n\nexport const AssistantContext = createContext<AssistantContextValue | null>(\n  null,\n);\n\nexport const useAssistantContext = (): AssistantContextValue => {\n  const context = useContext(AssistantContext);\n  if (!context)\n    throw new Error(\n      \"This component must be used within an AssistantRuntimeProvider.\",\n    );\n  return context;\n};\n","import { createContext, useContext } from \"react\";\nimport type { ComposerState } from \"../stores/Composer\";\nimport type { ThreadState } from \"../stores/Thread\";\nimport type { ThreadViewportState } from \"../stores/ThreadViewport\";\nimport { ThreadActionsState } from \"../stores/ThreadActions\";\nimport { ReadonlyStore } from \"../ReadonlyStore\";\n\nexport type ThreadContextValue = {\n  useThread: ReadonlyStore<ThreadState>;\n  useThreadActions: ReadonlyStore<ThreadActionsState>;\n  useComposer: ReadonlyStore<ComposerState>;\n  useViewport: ReadonlyStore<ThreadViewportState>;\n};\n\nexport const ThreadContext = createContext<ThreadContextValue | null>(null);\n\nexport const useThreadContext = (): ThreadContextValue => {\n  const context = useContext(ThreadContext);\n  if (!context)\n    throw new Error(\n      \"This component must be used within an AssistantRuntimeProvider.\",\n    );\n  return context;\n};\n","import { useContext, useMemo } from \"react\";\nimport { MessageContext } from \"./MessageContext\";\nimport { useThreadContext } from \"./ThreadContext\";\nimport type { ComposerState } from \"../stores/Composer\";\nimport type { EditComposerState } from \"../stores/EditComposer\";\nimport { ReadonlyStore } from \"../ReadonlyStore\";\n\nexport type ComposerContextValue = {\n  useComposer: ReadonlyStore<EditComposerState | ComposerState>;\n  type: \"edit\" | \"new\";\n};\n\nexport const useComposerContext = (): ComposerContextValue => {\n  const { useComposer } = useThreadContext();\n  const { useEditComposer } = useContext(MessageContext) ?? {};\n  return useMemo(\n    () => ({\n      useComposer: (useEditComposer ?? useComposer) as ReadonlyStore<\n        EditComposerState | ComposerState\n      >,\n      type: useEditComposer ? (\"edit\" as const) : (\"new\" as const),\n    }),\n    [useEditComposer, useComposer],\n  );\n};\n","import { createContext, useContext } from \"react\";\nimport type { MessageState } from \"../stores/Message\";\nimport type { EditComposerState } from \"../stores/EditComposer\";\nimport { ReadonlyStore } from \"../ReadonlyStore\";\nimport { MessageUtilsState } from \"../stores/MessageUtils\";\n\nexport type MessageContextValue = {\n  useMessage: ReadonlyStore<MessageState>;\n  useMessageUtils: ReadonlyStore<MessageUtilsState>;\n  useEditComposer: ReadonlyStore<EditComposerState>;\n};\n\nexport const MessageContext = createContext<MessageContextValue | null>(null);\n\nexport const useMessageContext = () => {\n  const context = useContext(MessageContext);\n  if (!context)\n    throw new Error(\n      \"This component can only be used inside a component passed to <ThreadPrimitive.Messages components={...} />.\",\n    );\n  return context;\n};\n","import { createContext, useContext } from \"react\";\nimport type { ContentPartState } from \"../stores/ContentPart\";\nimport { ReadonlyStore } from \"../ReadonlyStore\";\n\nexport type ContentPartContextValue = {\n  useContentPart: ReadonlyStore<ContentPartState>;\n};\n\nexport const ContentPartContext = createContext<ContentPartContextValue | null>(\n  null,\n);\n\nexport const useContentPartContext = (): ContentPartContextValue => {\n  const context = useContext(ContentPartContext);\n  if (!context)\n    throw new Error(\n      \"This component can only be used inside a component passed to <MessagePrimitive.Content components={...} >.\",\n    );\n  return context;\n};\n","\"use client\";\n\nimport { useEffect } from \"react\";\nimport { useAssistantContext } from \"../context/react/AssistantContext\";\n\nexport const useAssistantInstructions = (instruction: string) => {\n  const { useModelConfig } = useAssistantContext();\n  const registerModelConfigProvider = useModelConfig(\n    (s) => s.registerModelConfigProvider,\n  );\n  useEffect(() => {\n    const config = {\n      system: instruction,\n    };\n    return registerModelConfigProvider(() => config);\n  }, [registerModelConfigProvider, instruction]);\n};\n","\"use client\";\n\nimport { useEffect } from \"react\";\nimport { useAssistantContext } from \"../context/react/AssistantContext\";\nimport type { ToolCallContentPartComponent } from \"../primitives/message/ContentPartComponentTypes\";\nimport type { Tool } from \"../utils/ModelConfigTypes\";\n\nexport type AssistantToolProps<TArgs, TResult> = Tool<TArgs, TResult> & {\n  toolName: string;\n  render?: ToolCallContentPartComponent<TArgs, TResult>;\n};\n\nexport const useAssistantTool = <TArgs, TResult>(\n  tool: AssistantToolProps<TArgs, TResult>,\n) => {\n  const { useModelConfig, useToolUIs } = useAssistantContext();\n  const registerModelConfigProvider = useModelConfig(\n    (s) => s.registerModelConfigProvider,\n  );\n  const setToolUI = useToolUIs((s) => s.setToolUI);\n  useEffect(() => {\n    const { toolName, render, ...rest } = tool;\n    const config = {\n      tools: {\n        [tool.toolName]: rest,\n      },\n    };\n    const unsub1 = registerModelConfigProvider(() => config);\n    const unsub2 = render ? setToolUI(toolName, render) : undefined;\n    return () => {\n      unsub1();\n      unsub2?.();\n    };\n  }, [registerModelConfigProvider, setToolUI, tool]);\n};\n","\"use client\";\nimport { useEffect } from \"react\";\nimport { useAssistantContext } from \"../context/react/AssistantContext\";\nimport type { ToolCallContentPartComponent } from \"../primitives/message/ContentPartComponentTypes\";\n\nexport type AssistantToolUIProps<TArgs, TResult> = {\n  toolName: string;\n  render: ToolCallContentPartComponent<TArgs, TResult>;\n};\n\nexport const useAssistantToolUI = (\n  tool: AssistantToolUIProps<any, any> | null,\n) => {\n  const { useToolUIs } = useAssistantContext();\n  const setToolUI = useToolUIs((s) => s.setToolUI);\n  useEffect(() => {\n    if (!tool) return;\n    const { toolName, render } = tool;\n    return setToolUI(toolName, render);\n  }, [setToolUI, tool]);\n};\n","\"use client\";\nimport { type AssistantToolProps, useAssistantTool } from \"./useAssistantTool\";\n\nexport const makeAssistantTool = <TArgs, TResult>(\n  tool: AssistantToolProps<TArgs, TResult>,\n) => {\n  const Tool = () => {\n    useAssistantTool(tool);\n    return null;\n  };\n  return Tool;\n};\n","\"use client\";\nimport {\n  type AssistantToolUIProps,\n  useAssistantToolUI,\n} from \"./useAssistantToolUI\";\n\nexport const makeAssistantToolUI = <TArgs, TResult>(\n  tool: AssistantToolUIProps<TArgs, TResult>,\n) => {\n  const ToolUI = () => {\n    useAssistantToolUI(tool);\n    return null;\n  };\n  return ToolUI;\n};\n"],"mappings":"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","names":["import_react","import_react","import_react","import_react","import_react","import_react","import_react"]}

package/dist/experimental.mjs

@@ -4,7 +4,7 @@ import {
   useContentPartContext,
   useMessageContext,
   useThreadContext
-} from "./chunk-RITM2IUH.mjs";
+} from "./chunk-KUACYNLE.mjs";
 
 // src/model-config/useAssistantInstructions.tsx
 import { useEffect } from "react";

package/dist/experimental.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/model-config/useAssistantInstructions.tsx","../src/model-config/useAssistantTool.tsx","../src/model-config/useAssistantToolUI.tsx","../src/model-config/makeAssistantTool.tsx","../src/model-config/makeAssistantToolUI.tsx"],"sourcesContent":["\"use client\";\n\nimport { useEffect } from \"react\";\nimport { useAssistantContext } from \"../context/AssistantContext\";\n\nexport const useAssistantInstructions = (instruction: string) => {\n  const { useModelConfig } = useAssistantContext();\n  const registerModelConfigProvider = useModelConfig(\n    (s) => s.registerModelConfigProvider,\n  );\n  useEffect(() => {\n    const config = {\n      system: instruction,\n    };\n    return registerModelConfigProvider(() => config);\n  }, [registerModelConfigProvider, instruction]);\n};\n","\"use client\";\n\nimport { useEffect } from \"react\";\nimport { useAssistantContext } from \"../context/AssistantContext\";\nimport type { ToolCallContentPartComponent } from \"../primitives/message/ContentPartComponentTypes\";\nimport type { Tool } from \"../utils/ModelConfigTypes\";\n\nexport type AssistantToolProps<TArgs, TResult> = Tool<TArgs, TResult> & {\n  toolName: string;\n  render?: ToolCallContentPartComponent<TArgs, TResult>;\n};\n\nexport const useAssistantTool = <TArgs, TResult>(\n  tool: AssistantToolProps<TArgs, TResult>,\n) => {\n  const { useModelConfig, useToolUIs } = useAssistantContext();\n  const registerModelConfigProvider = useModelConfig(\n    (s) => s.registerModelConfigProvider,\n  );\n  const setToolUI = useToolUIs((s) => s.setToolUI);\n  useEffect(() => {\n    const { toolName, render, ...rest } = tool;\n    const config = {\n      tools: {\n        [tool.toolName]: rest,\n      },\n    };\n    const unsub1 = registerModelConfigProvider(() => config);\n    const unsub2 = render ? setToolUI(toolName, render) : undefined;\n    return () => {\n      unsub1();\n      unsub2?.();\n    };\n  }, [registerModelConfigProvider, setToolUI, tool]);\n};\n","\"use client\";\nimport { useEffect } from \"react\";\nimport { useAssistantContext } from \"../context/AssistantContext\";\nimport type { ToolCallContentPartComponent } from \"../primitives/message/ContentPartComponentTypes\";\n\nexport type AssistantToolUIProps<TArgs, TResult> = {\n  toolName: string;\n  render: ToolCallContentPartComponent<TArgs, TResult>;\n};\n\nexport const useAssistantToolUI = (\n  tool: AssistantToolUIProps<any, any> | null,\n) => {\n  const { useToolUIs } = useAssistantContext();\n  const setToolUI = useToolUIs((s) => s.setToolUI);\n  useEffect(() => {\n    if (!tool) return;\n    const { toolName, render } = tool;\n    return setToolUI(toolName, render);\n  }, [setToolUI, tool]);\n};\n","\"use client\";\nimport { type AssistantToolProps, useAssistantTool } from \"./useAssistantTool\";\n\nexport const makeAssistantTool = <TArgs, TResult>(\n  tool: AssistantToolProps<TArgs, TResult>,\n) => {\n  const Tool = () => {\n    useAssistantTool(tool);\n    return null;\n  };\n  return Tool;\n};\n","\"use client\";\nimport {\n  type AssistantToolUIProps,\n  useAssistantToolUI,\n} from \"./useAssistantToolUI\";\n\nexport const makeAssistantToolUI = <TArgs, TResult>(\n  tool: AssistantToolUIProps<TArgs, TResult>,\n) => {\n  const ToolUI = () => {\n    useAssistantToolUI(tool);\n    return null;\n  };\n  return ToolUI;\n};\n"],"mappings":";;;;;;;;;AAEA,SAAS,iBAAiB;AAGnB,IAAM,2BAA2B,CAAC,gBAAwB;AAC/D,QAAM,EAAE,eAAe,IAAI,oBAAoB;AAC/C,QAAM,8BAA8B;AAAA,IAClC,CAAC,MAAM,EAAE;AAAA,EACX;AACA,YAAU,MAAM;AACd,UAAM,SAAS;AAAA,MACb,QAAQ;AAAA,IACV;AACA,WAAO,4BAA4B,MAAM,MAAM;AAAA,EACjD,GAAG,CAAC,6BAA6B,WAAW,CAAC;AAC/C;;;ACdA,SAAS,aAAAA,kBAAiB;AAUnB,IAAM,mBAAmB,CAC9B,SACG;AACH,QAAM,EAAE,gBAAgB,WAAW,IAAI,oBAAoB;AAC3D,QAAM,8BAA8B;AAAA,IAClC,CAAC,MAAM,EAAE;AAAA,EACX;AACA,QAAM,YAAY,WAAW,CAAC,MAAM,EAAE,SAAS;AAC/C,EAAAC,WAAU,MAAM;AACd,UAAM,EAAE,UAAU,QAAQ,GAAG,KAAK,IAAI;AACtC,UAAM,SAAS;AAAA,MACb,OAAO;AAAA,QACL,CAAC,KAAK,QAAQ,GAAG;AAAA,MACnB;AAAA,IACF;AACA,UAAM,SAAS,4BAA4B,MAAM,MAAM;AACvD,UAAM,SAAS,SAAS,UAAU,UAAU,MAAM,IAAI;AACtD,WAAO,MAAM;AACX,aAAO;AACP,eAAS;AAAA,IACX;AAAA,EACF,GAAG,CAAC,6BAA6B,WAAW,IAAI,CAAC;AACnD;;;ACjCA,SAAS,aAAAC,kBAAiB;AASnB,IAAM,qBAAqB,CAChC,SACG;AACH,QAAM,EAAE,WAAW,IAAI,oBAAoB;AAC3C,QAAM,YAAY,WAAW,CAAC,MAAM,EAAE,SAAS;AAC/C,EAAAC,WAAU,MAAM;AACd,QAAI,CAAC,KAAM;AACX,UAAM,EAAE,UAAU,OAAO,IAAI;AAC7B,WAAO,UAAU,UAAU,MAAM;AAAA,EACnC,GAAG,CAAC,WAAW,IAAI,CAAC;AACtB;;;ACjBO,IAAM,oBAAoB,CAC/B,SACG;AACH,QAAM,OAAO,MAAM;AACjB,qBAAiB,IAAI;AACrB,WAAO;AAAA,EACT;AACA,SAAO;AACT;;;ACLO,IAAM,sBAAsB,CACjC,SACG;AACH,QAAM,SAAS,MAAM;AACnB,uBAAmB,IAAI;AACvB,WAAO;AAAA,EACT;AACA,SAAO;AACT;","names":["useEffect","useEffect","useEffect","useEffect"]}
+{"version":3,"sources":["../src/model-config/useAssistantInstructions.tsx","../src/model-config/useAssistantTool.tsx","../src/model-config/useAssistantToolUI.tsx","../src/model-config/makeAssistantTool.tsx","../src/model-config/makeAssistantToolUI.tsx"],"sourcesContent":["\"use client\";\n\nimport { useEffect } from \"react\";\nimport { useAssistantContext } from \"../context/react/AssistantContext\";\n\nexport const useAssistantInstructions = (instruction: string) => {\n  const { useModelConfig } = useAssistantContext();\n  const registerModelConfigProvider = useModelConfig(\n    (s) => s.registerModelConfigProvider,\n  );\n  useEffect(() => {\n    const config = {\n      system: instruction,\n    };\n    return registerModelConfigProvider(() => config);\n  }, [registerModelConfigProvider, instruction]);\n};\n","\"use client\";\n\nimport { useEffect } from \"react\";\nimport { useAssistantContext } from \"../context/react/AssistantContext\";\nimport type { ToolCallContentPartComponent } from \"../primitives/message/ContentPartComponentTypes\";\nimport type { Tool } from \"../utils/ModelConfigTypes\";\n\nexport type AssistantToolProps<TArgs, TResult> = Tool<TArgs, TResult> & {\n  toolName: string;\n  render?: ToolCallContentPartComponent<TArgs, TResult>;\n};\n\nexport const useAssistantTool = <TArgs, TResult>(\n  tool: AssistantToolProps<TArgs, TResult>,\n) => {\n  const { useModelConfig, useToolUIs } = useAssistantContext();\n  const registerModelConfigProvider = useModelConfig(\n    (s) => s.registerModelConfigProvider,\n  );\n  const setToolUI = useToolUIs((s) => s.setToolUI);\n  useEffect(() => {\n    const { toolName, render, ...rest } = tool;\n    const config = {\n      tools: {\n        [tool.toolName]: rest,\n      },\n    };\n    const unsub1 = registerModelConfigProvider(() => config);\n    const unsub2 = render ? setToolUI(toolName, render) : undefined;\n    return () => {\n      unsub1();\n      unsub2?.();\n    };\n  }, [registerModelConfigProvider, setToolUI, tool]);\n};\n","\"use client\";\nimport { useEffect } from \"react\";\nimport { useAssistantContext } from \"../context/react/AssistantContext\";\nimport type { ToolCallContentPartComponent } from \"../primitives/message/ContentPartComponentTypes\";\n\nexport type AssistantToolUIProps<TArgs, TResult> = {\n  toolName: string;\n  render: ToolCallContentPartComponent<TArgs, TResult>;\n};\n\nexport const useAssistantToolUI = (\n  tool: AssistantToolUIProps<any, any> | null,\n) => {\n  const { useToolUIs } = useAssistantContext();\n  const setToolUI = useToolUIs((s) => s.setToolUI);\n  useEffect(() => {\n    if (!tool) return;\n    const { toolName, render } = tool;\n    return setToolUI(toolName, render);\n  }, [setToolUI, tool]);\n};\n","\"use client\";\nimport { type AssistantToolProps, useAssistantTool } from \"./useAssistantTool\";\n\nexport const makeAssistantTool = <TArgs, TResult>(\n  tool: AssistantToolProps<TArgs, TResult>,\n) => {\n  const Tool = () => {\n    useAssistantTool(tool);\n    return null;\n  };\n  return Tool;\n};\n","\"use client\";\nimport {\n  type AssistantToolUIProps,\n  useAssistantToolUI,\n} from \"./useAssistantToolUI\";\n\nexport const makeAssistantToolUI = <TArgs, TResult>(\n  tool: AssistantToolUIProps<TArgs, TResult>,\n) => {\n  const ToolUI = () => {\n    useAssistantToolUI(tool);\n    return null;\n  };\n  return ToolUI;\n};\n"],"mappings":";;;;;;;;;AAEA,SAAS,iBAAiB;AAGnB,IAAM,2BAA2B,CAAC,gBAAwB;AAC/D,QAAM,EAAE,eAAe,IAAI,oBAAoB;AAC/C,QAAM,8BAA8B;AAAA,IAClC,CAAC,MAAM,EAAE;AAAA,EACX;AACA,YAAU,MAAM;AACd,UAAM,SAAS;AAAA,MACb,QAAQ;AAAA,IACV;AACA,WAAO,4BAA4B,MAAM,MAAM;AAAA,EACjD,GAAG,CAAC,6BAA6B,WAAW,CAAC;AAC/C;;;ACdA,SAAS,aAAAA,kBAAiB;AAUnB,IAAM,mBAAmB,CAC9B,SACG;AACH,QAAM,EAAE,gBAAgB,WAAW,IAAI,oBAAoB;AAC3D,QAAM,8BAA8B;AAAA,IAClC,CAAC,MAAM,EAAE;AAAA,EACX;AACA,QAAM,YAAY,WAAW,CAAC,MAAM,EAAE,SAAS;AAC/C,EAAAC,WAAU,MAAM;AACd,UAAM,EAAE,UAAU,QAAQ,GAAG,KAAK,IAAI;AACtC,UAAM,SAAS;AAAA,MACb,OAAO;AAAA,QACL,CAAC,KAAK,QAAQ,GAAG;AAAA,MACnB;AAAA,IACF;AACA,UAAM,SAAS,4BAA4B,MAAM,MAAM;AACvD,UAAM,SAAS,SAAS,UAAU,UAAU,MAAM,IAAI;AACtD,WAAO,MAAM;AACX,aAAO;AACP,eAAS;AAAA,IACX;AAAA,EACF,GAAG,CAAC,6BAA6B,WAAW,IAAI,CAAC;AACnD;;;ACjCA,SAAS,aAAAC,kBAAiB;AASnB,IAAM,qBAAqB,CAChC,SACG;AACH,QAAM,EAAE,WAAW,IAAI,oBAAoB;AAC3C,QAAM,YAAY,WAAW,CAAC,MAAM,EAAE,SAAS;AAC/C,EAAAC,WAAU,MAAM;AACd,QAAI,CAAC,KAAM;AACX,UAAM,EAAE,UAAU,OAAO,IAAI;AAC7B,WAAO,UAAU,UAAU,MAAM;AAAA,EACnC,GAAG,CAAC,WAAW,IAAI,CAAC;AACtB;;;ACjBO,IAAM,oBAAoB,CAC/B,SACG;AACH,QAAM,OAAO,MAAM;AACjB,qBAAiB,IAAI;AACrB,WAAO;AAAA,EACT;AACA,SAAO;AACT;;;ACLO,IAAM,sBAAsB,CACjC,SACG;AACH,QAAM,SAAS,MAAM;AACnB,uBAAmB,IAAI;AACvB,WAAO;AAAA,EACT;AACA,SAAO;AACT;","names":["useEffect","useEffect","useEffect","useEffect"]}