@assistant-ui/react 0.1.12 → 0.2.2

package/dist/index.mjs

@@ -1,24 +1,479 @@
+var __defProp = Object.defineProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+
+// src/context/providers/AssistantRuntimeProvider.tsx
+import { memo } from "react";
+
+// src/context/providers/AssistantProvider.tsx
+import { useEffect as useEffect2, useInsertionEffect as useInsertionEffect2, useRef as useRef2, useState as useState2 } from "react";
+
+// src/context/react/AssistantContext.ts
+import { createContext, useContext } from "react";
+var AssistantContext = createContext(
+  null
+);
+var useAssistantContext = () => {
+  const context = useContext(AssistantContext);
+  if (!context)
+    throw new Error(
+      "This component must be used within an AssistantRuntimeProvider."
+    );
+  return context;
+};
+
+// src/context/stores/AssistantModelConfig.ts
+import { create } from "zustand";
+
+// src/types/ModelConfigTypes.ts
+var mergeModelConfigs = (configSet) => {
+  const configs = Array.from(configSet).map((c) => c()).sort((a, b) => (b.priority ?? 0) - (a.priority ?? 0));
+  return configs.reduce((acc, config) => {
+    if (config.system) {
+      if (acc.system) {
+        acc.system += `
+
+${config.system}`;
+      } else {
+        acc.system = config.system;
+      }
+    }
+    if (config.tools) {
+      for (const [name, tool] of Object.entries(config.tools)) {
+        if (acc.tools?.[name]) {
+          throw new Error(
+            `You tried to define a tool with the name ${name}, but it already exists.`
+          );
+        }
+        if (!acc.tools) acc.tools = {};
+        acc.tools[name] = tool;
+      }
+    }
+    return acc;
+  }, {});
+};
+
+// src/utils/ProxyConfigProvider.ts
+var ProxyConfigProvider = class {
+  _providers = /* @__PURE__ */ new Set();
+  getModelConfig() {
+    return mergeModelConfigs(this._providers);
+  }
+  registerModelConfigProvider(provider) {
+    this._providers.add(provider);
+    return () => {
+      this._providers.delete(provider);
+    };
+  }
+};
+
+// src/context/stores/AssistantModelConfig.ts
+var makeAssistantModelConfigStore = () => create(() => {
+  const proxy = new ProxyConfigProvider();
+  return Object.freeze({
+    getModelConfig: () => {
+      return proxy.getModelConfig();
+    },
+    registerModelConfigProvider: (provider) => {
+      return proxy.registerModelConfigProvider(provider);
+    }
+  });
+});
+
+// src/context/stores/AssistantToolUIs.ts
+import { create as create2 } from "zustand";
+var makeAssistantToolUIsStore = () => create2((set) => {
+  const renderers = /* @__PURE__ */ new Map();
+  return Object.freeze({
+    getToolUI: (name) => {
+      const arr = renderers.get(name);
+      const last = arr?.at(-1);
+      if (last) return last;
+      return null;
+    },
+    setToolUI: (name, render) => {
+      let arr = renderers.get(name);
+      if (!arr) {
+        arr = [];
+        renderers.set(name, arr);
+      }
+      arr.push(render);
+      set({});
+      return () => {
+        const index = arr.indexOf(render);
+        if (index !== -1) {
+          arr.splice(index, 1);
+        }
+        if (index === arr.length) {
+          set({});
+        }
+      };
+    }
+  });
+});
+
+// src/context/providers/ThreadProvider.tsx
 import {
-  AssistantContext,
-  ContentPartContext,
-  MessageContext,
-  ThreadContext,
-  __export,
-  useAssistantContext,
-  useComposerContext,
-  useContentPartContext,
-  useMessageContext,
-  useThreadContext
-} from "./chunk-KUACYNLE.mjs";
+  useCallback,
+  useEffect,
+  useInsertionEffect,
+  useRef,
+  useState,
+  useSyncExternalStore
+} from "react";
+
+// src/context/react/ThreadContext.ts
+import { createContext as createContext2, useContext as useContext2 } from "react";
+var ThreadContext = createContext2(null);
+var useThreadContext = () => {
+  const context = useContext2(ThreadContext);
+  if (!context)
+    throw new Error(
+      "This component must be used within an AssistantRuntimeProvider."
+    );
+  return context;
+};
+
+// src/context/stores/Composer.ts
+import { create as create3 } from "zustand";
+
+// src/context/stores/BaseComposer.ts
+var makeBaseComposer = (set) => ({
+  value: "",
+  setValue: (value) => {
+    set({ value });
+  }
+});
+
+// src/context/stores/Composer.ts
+var makeComposerStore = (useThread, useThreadActions) => {
+  const focusListeners = /* @__PURE__ */ new Set();
+  return create3()((set, get, store) => {
+    return {
+      ...makeBaseComposer(set, get, store),
+      isEditing: true,
+      send: () => {
+        const { setValue, value } = get();
+        setValue("");
+        useThreadActions.getState().append({
+          parentId: useThread.getState().messages.at(-1)?.id ?? null,
+          role: "user",
+          content: [{ type: "text", text: value }]
+        });
+      },
+      cancel: () => {
+        const thread = useThread.getState();
+        if (!thread.isRunning) return false;
+        useThreadActions.getState().cancelRun();
+        return true;
+      },
+      focus: () => {
+        for (const listener of focusListeners) {
+          listener();
+        }
+      },
+      onFocus: (listener) => {
+        focusListeners.add(listener);
+        return () => {
+          focusListeners.delete(listener);
+        };
+      }
+    };
+  });
+};
+
+// src/context/stores/Thread.ts
+import { create as create4 } from "zustand";
+var makeThreadStore = (runtimeRef) => {
+  return create4(() => ({
+    messages: runtimeRef.current.messages,
+    isRunning: runtimeRef.current.isRunning
+  }));
+};
+
+// src/context/stores/ThreadViewport.tsx
+import { create as create5 } from "zustand";
+var makeThreadViewportStore = () => {
+  const scrollToBottomListeners = /* @__PURE__ */ new Set();
+  return create5(() => ({
+    isAtBottom: true,
+    scrollToBottom: () => {
+      for (const listener of scrollToBottomListeners) {
+        listener();
+      }
+    },
+    onScrollToBottom: (callback) => {
+      scrollToBottomListeners.add(callback);
+      return () => {
+        scrollToBottomListeners.delete(callback);
+      };
+    }
+  }));
+};
+
+// src/context/stores/ThreadActions.ts
+import { create as create6 } from "zustand";
+var makeThreadActionStore = (runtimeRef) => {
+  return create6(
+    () => Object.freeze({
+      getBranches: (messageId) => runtimeRef.current.getBranches(messageId),
+      switchToBranch: (branchId) => runtimeRef.current.switchToBranch(branchId),
+      startRun: (parentId) => runtimeRef.current.startRun(parentId),
+      append: (message) => runtimeRef.current.append(message),
+      cancelRun: () => runtimeRef.current.cancelRun(),
+      addToolResult: (toolCallId, result) => runtimeRef.current.addToolResult(toolCallId, result)
+    })
+  );
+};
+
+// src/context/providers/ThreadProvider.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+var ThreadProvider = ({
+  children,
+  runtime
+}) => {
+  const runtimeRef = useRef(runtime);
+  useInsertionEffect(() => {
+    runtimeRef.current = runtime;
+  });
+  const [context] = useState(() => {
+    const useThread = makeThreadStore(runtimeRef);
+    const useThreadActions = makeThreadActionStore(runtimeRef);
+    const useViewport = makeThreadViewportStore();
+    const useComposer = makeComposerStore(useThread, useThreadActions);
+    return {
+      useThread,
+      useThreadActions,
+      useComposer,
+      useViewport
+    };
+  });
+  useEffect(() => {
+    const onRuntimeUpdate = () => {
+      context.useThread.setState(
+        Object.freeze({
+          messages: runtimeRef.current.messages,
+          isRunning: runtimeRef.current.isRunning
+        }),
+        true
+      );
+    };
+    onRuntimeUpdate();
+    return runtime.subscribe(onRuntimeUpdate);
+  }, [context, runtime]);
+  const subscribe = useCallback(
+    (c) => runtime.subscribe(c),
+    [runtime]
+  );
+  const RuntimeSynchronizer = useSyncExternalStore(
+    subscribe,
+    () => runtime.unstable_synchronizer,
+    () => void 0
+  );
+  return /* @__PURE__ */ jsxs(ThreadContext.Provider, { value: context, children: [
+    RuntimeSynchronizer && /* @__PURE__ */ jsx(RuntimeSynchronizer, {}),
+    children
+  ] });
+};
+
+// src/context/stores/AssistantActions.tsx
+import { create as create7 } from "zustand";
+var makeAssistantActionsStore = (runtimeRef) => create7(
+  () => Object.freeze({
+    switchToThread: () => runtimeRef.current.switchToThread(null)
+  })
+);
+
+// src/context/providers/AssistantProvider.tsx
+import { jsx as jsx2 } from "react/jsx-runtime";
+var AssistantProvider = ({ children, runtime }) => {
+  const runtimeRef = useRef2(runtime);
+  useInsertionEffect2(() => {
+    runtimeRef.current = runtime;
+  });
+  const [context] = useState2(() => {
+    const useModelConfig = makeAssistantModelConfigStore();
+    const useToolUIs = makeAssistantToolUIsStore();
+    const useAssistantActions = makeAssistantActionsStore(runtimeRef);
+    return { useModelConfig, useToolUIs, useAssistantActions };
+  });
+  const getModelCOnfig = context.useModelConfig((c) => c.getModelConfig);
+  useEffect2(() => {
+    return runtime.registerModelConfigProvider(getModelCOnfig);
+  }, [runtime, getModelCOnfig]);
+  return /* @__PURE__ */ jsx2(AssistantContext.Provider, { value: context, children: /* @__PURE__ */ jsx2(ThreadProvider, { runtime, children }) });
+};
+
+// src/context/providers/AssistantRuntimeProvider.tsx
+import { jsx as jsx3 } from "react/jsx-runtime";
+var AssistantRuntimeProviderImpl = ({ children, runtime }) => {
+  return /* @__PURE__ */ jsx3(AssistantProvider, { runtime, children });
+};
+var AssistantRuntimeProvider = memo(AssistantRuntimeProviderImpl);
+
+// src/context/react/ComposerContext.ts
+import { useContext as useContext4, useMemo } from "react";
+
+// src/context/react/MessageContext.ts
+import { createContext as createContext3, useContext as useContext3 } from "react";
+var MessageContext = createContext3(null);
+var useMessageContext = () => {
+  const context = useContext3(MessageContext);
+  if (!context)
+    throw new Error(
+      "This component can only be used inside a component passed to <ThreadPrimitive.Messages components={...} />."
+    );
+  return context;
+};
+
+// src/context/react/ComposerContext.ts
+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
+);
+var useContentPartContext = () => {
+  const context = useContext5(ContentPartContext);
+  if (!context)
+    throw new Error(
+      "This component can only be used inside a component passed to <MessagePrimitive.Content components={...} >."
+    );
+  return context;
+};
+
+// src/hooks/useAppendMessage.tsx
+import { useCallback as useCallback2 } from "react";
+var toAppendMessage = (useThread, message) => {
+  if (typeof message === "string") {
+    return {
+      parentId: useThread.getState().messages.at(-1)?.id ?? null,
+      role: "user",
+      content: [{ type: "text", text: message }]
+    };
+  }
+  return {
+    parentId: message.parentId ?? useThread.getState().messages.at(-1)?.id ?? null,
+    role: message.role ?? "user",
+    content: message.content
+  };
+};
+var useAppendMessage = () => {
+  const { useThread, useThreadActions, useViewport, useComposer } = useThreadContext();
+  const append = useCallback2(
+    (message) => {
+      const appendMessage = toAppendMessage(useThread, message);
+      useThreadActions.getState().append(appendMessage);
+      useViewport.getState().scrollToBottom();
+      useComposer.getState().focus();
+    },
+    [useThread, useThreadActions, useViewport, useComposer]
+  );
+  return append;
+};
+
+// src/hooks/useSwitchToNewThread.tsx
+import { useCallback as useCallback3 } from "react";
+var useSwitchToNewThread = () => {
+  const { useAssistantActions } = useAssistantContext();
+  const { useComposer } = useThreadContext();
+  const switchToNewThread = useCallback3(() => {
+    useAssistantActions.getState().switchToThread(null);
+    useComposer.getState().focus();
+  }, [useAssistantActions, useComposer]);
+  return switchToNewThread;
+};
+
+// src/model-config/useAssistantTool.tsx
+import { useEffect as useEffect3 } from "react";
+var useAssistantTool = (tool) => {
+  const { useModelConfig, useToolUIs } = useAssistantContext();
+  const registerModelConfigProvider = useModelConfig(
+    (s) => s.registerModelConfigProvider
+  );
+  const setToolUI = useToolUIs((s) => s.setToolUI);
+  useEffect3(() => {
+    const { toolName, render, ...rest } = tool;
+    const config = {
+      tools: {
+        [tool.toolName]: rest
+      }
+    };
+    const unsub1 = registerModelConfigProvider(() => config);
+    const unsub2 = render ? setToolUI(toolName, render) : void 0;
+    return () => {
+      unsub1();
+      unsub2?.();
+    };
+  }, [registerModelConfigProvider, setToolUI, tool]);
+};
+
+// src/model-config/makeAssistantTool.tsx
+var makeAssistantTool = (tool) => {
+  const Tool = () => {
+    useAssistantTool(tool);
+    return null;
+  };
+  return Tool;
+};
+
+// src/model-config/useAssistantToolUI.tsx
+import { useEffect as useEffect4 } from "react";
+var useAssistantToolUI = (tool) => {
+  const { useToolUIs } = useAssistantContext();
+  const setToolUI = useToolUIs((s) => s.setToolUI);
+  useEffect4(() => {
+    if (!tool) return;
+    const { toolName, render } = tool;
+    return setToolUI(toolName, render);
+  }, [setToolUI, tool]);
+};
+
+// src/model-config/makeAssistantToolUI.tsx
+var makeAssistantToolUI = (tool) => {
+  const ToolUI = () => {
+    useAssistantToolUI(tool);
+    return null;
+  };
+  return ToolUI;
+};
+
+// src/model-config/useAssistantInstructions.tsx
+import { useEffect as useEffect5 } from "react";
+var useAssistantInstructions = (instruction) => {
+  const { useModelConfig } = useAssistantContext();
+  const registerModelConfigProvider = useModelConfig(
+    (s) => s.registerModelConfigProvider
+  );
+  useEffect5(() => {
+    const config = {
+      system: instruction
+    };
+    return registerModelConfigProvider(() => config);
+  }, [registerModelConfigProvider, instruction]);
+};
 
 // src/primitive-hooks/actionBar/useActionBarCopy.tsx
-import { useCallback } from "react";
+import { useCallback as useCallback4 } from "react";
 
 // src/utils/combined/useCombinedStore.ts
-import { useMemo } from "react";
+import { useMemo as useMemo2 } from "react";
 
 // src/utils/combined/createCombinedStore.ts
-import { useSyncExternalStore } from "react";
+import { useSyncExternalStore as useSyncExternalStore2 } from "react";
 var createCombinedStore = (stores) => {
   const subscribe = (callback) => {
     const unsubscribes = stores.map((store) => store.subscribe(callback));
@@ -30,13 +485,13 @@ var createCombinedStore = (stores) => {
   };
   return (selector) => {
     const getSnapshot = () => selector(...stores.map((store) => store.getState()));
-    return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);
+    return useSyncExternalStore2(subscribe, getSnapshot, getSnapshot);
   };
 };
 
 // src/utils/combined/useCombinedStore.ts
 var useCombinedStore = (stores, selector) => {
-  const useCombined = useMemo(() => createCombinedStore(stores), stores);
+  const useCombined = useMemo2(() => createCombinedStore(stores), stores);
   return useCombined(selector);
 };
 
@@ -59,7 +514,7 @@ var useActionBarCopy = ({
       return !c.isEditing && m.message.content.some((c2) => c2.type === "text");
     }
   );
-  const callback = useCallback(() => {
+  const callback = useCallback4(() => {
     const { message } = useMessage.getState();
     const { setIsCopied } = useMessageUtils.getState();
     const { isEditing, value: composerValue } = useEditComposer.getState();
@@ -73,14 +528,14 @@ var useActionBarCopy = ({
 };
 
 // src/primitive-hooks/actionBar/useActionBarEdit.tsx
-import { useCallback as useCallback2 } from "react";
+import { useCallback as useCallback5 } from "react";
 var useActionBarEdit = () => {
   const { useMessage, useEditComposer } = useMessageContext();
   const disabled = useCombinedStore(
     [useMessage, useEditComposer],
     (m, c) => m.message.role !== "user" || c.isEditing
   );
-  const callback = useCallback2(() => {
+  const callback = useCallback5(() => {
     const { edit } = useEditComposer.getState();
     edit();
   }, [useEditComposer]);
@@ -89,7 +544,7 @@ var useActionBarEdit = () => {
 };
 
 // src/primitive-hooks/actionBar/useActionBarReload.tsx
-import { useCallback as useCallback3 } from "react";
+import { useCallback as useCallback6 } from "react";
 var useActionBarReload = () => {
   const { useThread, useThreadActions, useComposer, useViewport } = useThreadContext();
   const { useMessage } = useMessageContext();
@@ -97,7 +552,7 @@ var useActionBarReload = () => {
     [useThread, useMessage],
     (t, m) => t.isRunning || m.message.role !== "assistant"
   );
-  const callback = useCallback3(() => {
+  const callback = useCallback6(() => {
     const { parentId } = useMessage.getState();
     useThreadActions.getState().startRun(parentId);
     useViewport.getState().scrollToBottom();
@@ -115,7 +570,7 @@ var useBranchPickerCount = () => {
 };
 
 // src/primitive-hooks/branchPicker/useBranchPickerNext.tsx
-import { useCallback as useCallback4 } from "react";
+import { useCallback as useCallback7 } from "react";
 var useBranchPickerNext = () => {
   const { useThreadActions } = useThreadContext();
   const { useMessage, useEditComposer } = useMessageContext();
@@ -123,7 +578,7 @@ var useBranchPickerNext = () => {
     [useMessage, useEditComposer],
     (m, c) => c.isEditing || m.branches.indexOf(m.message.id) + 1 >= m.branches.length
   );
-  const callback = useCallback4(() => {
+  const callback = useCallback7(() => {
     const { message, branches } = useMessage.getState();
     useThreadActions.getState().switchToBranch(branches[branches.indexOf(message.id) + 1]);
   }, [useThreadActions, useMessage]);
@@ -139,7 +594,7 @@ var useBranchPickerNumber = () => {
 };
 
 // src/primitive-hooks/branchPicker/useBranchPickerPrevious.tsx
-import { useCallback as useCallback5 } from "react";
+import { useCallback as useCallback8 } from "react";
 var useBranchPickerPrevious = () => {
   const { useThreadActions } = useThreadContext();
   const { useMessage, useEditComposer } = useMessageContext();
@@ -147,7 +602,7 @@ var useBranchPickerPrevious = () => {
     [useMessage, useEditComposer],
     (m, c) => c.isEditing || m.branches.indexOf(m.message.id) <= 0
   );
-  const callback = useCallback5(() => {
+  const callback = useCallback8(() => {
     const { message, branches } = useMessage.getState();
     useThreadActions.getState().switchToBranch(branches[branches.indexOf(message.id) - 1]);
   }, [useThreadActions, useMessage]);
@@ -156,11 +611,11 @@ var useBranchPickerPrevious = () => {
 };
 
 // src/primitive-hooks/composer/useComposerCancel.tsx
-import { useCallback as useCallback6 } from "react";
+import { useCallback as useCallback9 } from "react";
 var useComposerCancel = () => {
   const { useComposer } = useComposerContext();
   const disabled = useComposer((c) => !c.isEditing);
-  const callback = useCallback6(() => {
+  const callback = useCallback9(() => {
     const { cancel } = useComposer.getState();
     cancel();
   }, [useComposer]);
@@ -179,12 +634,12 @@ var useComposerIf = (props) => {
 };
 
 // src/primitive-hooks/composer/useComposerSend.tsx
-import { useCallback as useCallback7 } from "react";
+import { useCallback as useCallback10 } from "react";
 var useComposerSend = () => {
   const { useViewport, useComposer: useNewComposer } = useThreadContext();
   const { useComposer } = useComposerContext();
   const disabled = useComposer((c) => !c.isEditing || c.value.length === 0);
-  const callback = useCallback7(() => {
+  const callback = useCallback10(() => {
     const composerState = useComposer.getState();
     if (!composerState.isEditing) return;
     composerState.send();
@@ -280,11 +735,11 @@ var useThreadEmpty = () => {
 };
 
 // src/primitive-hooks/thread/useThreadScrollToBottom.tsx
-import { useCallback as useCallback8 } from "react";
+import { useCallback as useCallback11 } from "react";
 var useThreadScrollToBottom = () => {
   const { useComposer, useViewport } = useThreadContext();
   const isAtBottom = useViewport((s) => s.isAtBottom);
-  const handleScrollToBottom = useCallback8(() => {
+  const handleScrollToBottom = useCallback11(() => {
     useViewport.getState().scrollToBottom();
     useComposer.getState().focus();
   }, [useViewport, useComposer]);
@@ -293,14 +748,14 @@ var useThreadScrollToBottom = () => {
 };
 
 // src/primitive-hooks/thread/useThreadSuggestion.tsx
-import { useCallback as useCallback9 } from "react";
+import { useCallback as useCallback12 } from "react";
 var useThreadSuggestion = ({
   prompt,
   autoSend
 }) => {
   const { useThread, useComposer } = useThreadContext();
   const disabled = useThread((t) => t.isRunning);
-  const callback = useCallback9(() => {
+  const callback = useCallback12(() => {
     const thread = useThread.getState();
     const composer = useComposer.getState();
     composer.setValue(prompt);
@@ -315,16 +770,17 @@ var useThreadSuggestion = ({
 // src/primitives/actionBar/index.ts
 var actionBar_exports = {};
 __export(actionBar_exports, {
-  Copy: () => ActionBarCopy,
-  Edit: () => ActionBarEdit,
-  Reload: () => ActionBarReload,
-  Root: () => ActionBarRoot
+  Copy: () => ActionBarPrimitiveCopy,
+  Edit: () => ActionBarPrimitiveEdit,
+  Reload: () => ActionBarPrimitiveReload,
+  Root: () => ActionBarPrimitiveRoot
 });
 
 // src/primitives/actionBar/ActionBarRoot.tsx
 import { Primitive } from "@radix-ui/react-primitive";
 import { forwardRef } from "react";
-import { jsx } from "react/jsx-runtime";
+
+// src/primitives/actionBar/useActionBarFloatStatus.tsx
 var useActionBarFloatStatus = ({
   hideWhenRunning,
   autohide,
@@ -345,14 +801,17 @@ var useActionBarFloatStatus = ({
     }
   );
 };
-var ActionBarRoot = forwardRef(({ hideWhenRunning, autohide, autohideFloat, ...rest }, ref) => {
+
+// src/primitives/actionBar/ActionBarRoot.tsx
+import { jsx as jsx4 } from "react/jsx-runtime";
+var ActionBarPrimitiveRoot = forwardRef(({ hideWhenRunning, autohide, autohideFloat, ...rest }, ref) => {
   const hideAndfloatStatus = useActionBarFloatStatus({
     hideWhenRunning,
     autohide,
     autohideFloat
   });
   if (hideAndfloatStatus === "hidden" /* Hidden */) return null;
-  return /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsx4(
     Primitive.div,
     {
       ...hideAndfloatStatus === "floating" /* Floating */ ? { "data-floating": "true" } : null,
@@ -361,17 +820,17 @@ var ActionBarRoot = forwardRef(({ hideWhenRunning, autohide, autohideFloat, ...r
     }
   );
 });
-ActionBarRoot.displayName = "ActionBarRoot";
+ActionBarPrimitiveRoot.displayName = "ActionBarPrimitive.Root";
 
 // src/utils/createActionButton.tsx
 import { composeEventHandlers } from "@radix-ui/primitive";
 import { Primitive as Primitive2 } from "@radix-ui/react-primitive";
 import { forwardRef as forwardRef2 } from "react";
-import { jsx as jsx2 } from "react/jsx-runtime";
+import { jsx as jsx5 } from "react/jsx-runtime";
 var createActionButton = (displayName, useActionButton) => {
   const ActionButton = forwardRef2((props, forwardedRef) => {
     const callback = useActionButton(props);
-    return /* @__PURE__ */ jsx2(
+    return /* @__PURE__ */ jsx5(
       Primitive2.button,
       {
         type: "button",
@@ -389,61 +848,64 @@ var createActionButton = (displayName, useActionButton) => {
 };
 
 // src/primitives/actionBar/ActionBarCopy.tsx
-var ActionBarCopy = createActionButton(
-  "ActionBarCopy",
+var ActionBarPrimitiveCopy = createActionButton(
+  "ActionBarPrimitive.Copy",
   useActionBarCopy
 );
 
 // src/primitives/actionBar/ActionBarReload.tsx
-var ActionBarReload = createActionButton(
-  "ActionBarReload",
+var ActionBarPrimitiveReload = createActionButton(
+  "ActionBarPrimitive.Reload",
   useActionBarReload
 );
 
 // src/primitives/actionBar/ActionBarEdit.tsx
-var ActionBarEdit = createActionButton(
-  "ActionBarEdit",
+var ActionBarPrimitiveEdit = createActionButton(
+  "ActionBarPrimitive.Edit",
   useActionBarEdit
 );
 
 // src/primitives/assistantModal/index.ts
 var assistantModal_exports = {};
 __export(assistantModal_exports, {
-  Content: () => AssistantModalContent,
-  Root: () => AssistantModalRoot,
-  Trigger: () => AssistantModalTrigger
+  Content: () => AssistantModalPrimitiveContent,
+  Root: () => AssistantModalPrimitiveRoot,
+  Trigger: () => AssistantModalPrimitiveTrigger
 });
 
 // src/primitives/assistantModal/AssistantModalRoot.tsx
-import { useState } from "react";
-import * as PopoverPrimitive from "@radix-ui/react-popover";
+import { useState as useState3 } from "react";
+import * as PopoverPrimitive2 from "@radix-ui/react-popover";
 import { composeEventHandlers as composeEventHandlers2 } from "@radix-ui/primitive";
 
 // src/utils/hooks/useOnComposerFocus.tsx
 import { useCallbackRef } from "@radix-ui/react-use-callback-ref";
-import { useEffect } from "react";
+import { useEffect as useEffect6 } from "react";
 var useOnComposerFocus = (callback) => {
   const callbackRef = useCallbackRef(callback);
   const { useComposer } = useThreadContext();
-  useEffect(() => {
+  useEffect6(() => {
     return useComposer.getState().onFocus(() => {
       callbackRef();
     });
   }, [useComposer, callbackRef]);
 };
 
-// src/primitives/assistantModal/AssistantModalRoot.tsx
-import { jsx as jsx3 } from "react/jsx-runtime";
+// src/primitives/assistantModal/scope.tsx
+import * as PopoverPrimitive from "@radix-ui/react-popover";
 var usePopoverScope = PopoverPrimitive.createPopoverScope();
+
+// src/primitives/assistantModal/AssistantModalRoot.tsx
+import { jsx as jsx6 } from "react/jsx-runtime";
 var useAssistantModalOpenState = (defaultOpen = false) => {
-  const state = useState(defaultOpen);
+  const state = useState3(defaultOpen);
   const [, setOpen] = state;
   useOnComposerFocus(() => {
     setOpen(true);
   });
   return state;
 };
-var AssistantModalRoot = ({
+var AssistantModalPrimitiveRoot = ({
   __scopeAssistantModal,
   defaultOpen,
   open,
@@ -452,8 +914,8 @@ var AssistantModalRoot = ({
 }) => {
   const scope = usePopoverScope(__scopeAssistantModal);
   const [modalOpen, setOpen] = useAssistantModalOpenState(defaultOpen);
-  return /* @__PURE__ */ jsx3(
-    PopoverPrimitive.Root,
+  return /* @__PURE__ */ jsx6(
+    PopoverPrimitive2.Root,
     {
       ...scope,
       open: open === void 0 ? modalOpen : open,
@@ -462,26 +924,29 @@ var AssistantModalRoot = ({
     }
   );
 };
-AssistantModalRoot.displayName = "AssistantModalRoot";
+AssistantModalPrimitiveRoot.displayName = "AssistantModalPrimitive.Root";
 
 // src/primitives/assistantModal/AssistantModalTrigger.tsx
 import { forwardRef as forwardRef3 } from "react";
-import * as PopoverPrimitive2 from "@radix-ui/react-popover";
-import { jsx as jsx4 } from "react/jsx-runtime";
-var AssistantModalTrigger = forwardRef3(
-  ({ __scopeAssistantModal, ...rest }, ref) => {
+import * as PopoverPrimitive3 from "@radix-ui/react-popover";
+import { jsx as jsx7 } from "react/jsx-runtime";
+var AssistantModalPrimitiveTrigger = forwardRef3(
+  ({
+    __scopeAssistantModal,
+    ...rest
+  }, ref) => {
     const scope = usePopoverScope(__scopeAssistantModal);
-    return /* @__PURE__ */ jsx4(PopoverPrimitive2.Trigger, { ...scope, ...rest, ref });
+    return /* @__PURE__ */ jsx7(PopoverPrimitive3.Trigger, { ...scope, ...rest, ref });
   }
 );
-AssistantModalTrigger.displayName = "AssistantModalTrigger";
+AssistantModalPrimitiveTrigger.displayName = "AssistantModalPrimitive.Trigger";
 
 // src/primitives/assistantModal/AssistantModalContent.tsx
 import { forwardRef as forwardRef4 } from "react";
-import * as PopoverPrimitive3 from "@radix-ui/react-popover";
+import * as PopoverPrimitive4 from "@radix-ui/react-popover";
 import { composeEventHandlers as composeEventHandlers3 } from "@radix-ui/primitive";
-import { jsx as jsx5 } from "react/jsx-runtime";
-var AssistantModalContent = forwardRef4(
+import { jsx as jsx8 } from "react/jsx-runtime";
+var AssistantModalPrimitiveContent = forwardRef4(
   ({
     __scopeAssistantModal,
     side,
@@ -491,8 +956,8 @@ var AssistantModalContent = forwardRef4(
     ...props
   }, forwardedRef) => {
     const scope = usePopoverScope(__scopeAssistantModal);
-    return /* @__PURE__ */ jsx5(PopoverPrimitive3.Portal, { ...scope, children: /* @__PURE__ */ jsx5(
-      PopoverPrimitive3.Content,
+    return /* @__PURE__ */ jsx8(PopoverPrimitive4.Portal, { ...scope, children: /* @__PURE__ */ jsx8(
+      PopoverPrimitive4.Content,
       {
         ...scope,
         ...props,
@@ -507,43 +972,45 @@ var AssistantModalContent = forwardRef4(
     ) });
   }
 );
-AssistantModalContent.displayName = "AssistantModalContent";
+AssistantModalPrimitiveContent.displayName = "AssistantModalPrimitive.Content";
 
 // src/primitives/branchPicker/index.ts
 var branchPicker_exports = {};
 __export(branchPicker_exports, {
-  Count: () => BranchPickerCount,
-  Next: () => BranchPickerNext,
-  Number: () => BranchPickerNumber,
+  Count: () => BranchPickerPrimitiveCount,
+  Next: () => BranchPickerPrimitiveNext,
+  Number: () => BranchPickerPrimitiveNumber,
   Previous: () => BranchPickerPrevious,
-  Root: () => BranchPickerRoot
+  Root: () => BranchPickerPrimitiveRoot
 });
 
 // src/primitives/branchPicker/BranchPickerNext.tsx
-var BranchPickerNext = createActionButton(
-  "BranchPickerNext",
+var BranchPickerPrimitiveNext = createActionButton(
+  "BranchPickerPrimitive.Next",
   useBranchPickerNext
 );
 
 // src/primitives/branchPicker/BranchPickerPrevious.tsx
 var BranchPickerPrevious = createActionButton(
-  "BranchPickerPrevious",
+  "BranchPickerPrimitive.Previous",
   useBranchPickerPrevious
 );
 
 // src/primitives/branchPicker/BranchPickerCount.tsx
-import { Fragment, jsx as jsx6 } from "react/jsx-runtime";
-var BranchPickerCount = () => {
+import { Fragment, jsx as jsx9 } from "react/jsx-runtime";
+var BranchPickerPrimitiveCount = () => {
   const branchCount = useBranchPickerCount();
-  return /* @__PURE__ */ jsx6(Fragment, { children: branchCount });
+  return /* @__PURE__ */ jsx9(Fragment, { children: branchCount });
 };
+BranchPickerPrimitiveCount.displayName = "BranchPickerPrimitive.Count";
 
 // src/primitives/branchPicker/BranchPickerNumber.tsx
-import { Fragment as Fragment2, jsx as jsx7 } from "react/jsx-runtime";
-var BranchPickerNumber = () => {
+import { Fragment as Fragment2, jsx as jsx10 } from "react/jsx-runtime";
+var BranchPickerPrimitiveNumber = () => {
   const branchNumber = useBranchPickerNumber();
-  return /* @__PURE__ */ jsx7(Fragment2, { children: branchNumber });
+  return /* @__PURE__ */ jsx10(Fragment2, { children: branchNumber });
 };
+BranchPickerPrimitiveNumber.displayName = "BranchPickerPrimitive.Number";
 
 // src/primitives/branchPicker/BranchPickerRoot.tsx
 import { Primitive as Primitive6 } from "@radix-ui/react-primitive";
@@ -552,53 +1019,55 @@ import { forwardRef as forwardRef8 } from "react";
 // src/primitives/message/index.ts
 var message_exports = {};
 __export(message_exports, {
-  Content: () => MessageContent,
-  If: () => MessageIf,
-  InProgress: () => MessageInProgress,
-  Root: () => MessageRoot
+  Content: () => MessagePrimitiveContent,
+  If: () => MessagePrimitiveIf,
+  InProgress: () => MessagePrimitiveInProgress,
+  Root: () => MessagePrimitiveRoot
 });
 
 // src/primitives/message/MessageRoot.tsx
 import { composeEventHandlers as composeEventHandlers4 } from "@radix-ui/primitive";
 import { Primitive as Primitive3 } from "@radix-ui/react-primitive";
 import { forwardRef as forwardRef5 } from "react";
-import { jsx as jsx8 } from "react/jsx-runtime";
-var MessageRoot = forwardRef5(
-  ({ onMouseEnter, onMouseLeave, ...rest }, ref) => {
-    const { useMessageUtils } = useMessageContext();
-    const setIsHovering = useMessageUtils((s) => s.setIsHovering);
-    const handleMouseEnter = () => {
-      setIsHovering(true);
-    };
-    const handleMouseLeave = () => {
-      setIsHovering(false);
-    };
-    return /* @__PURE__ */ jsx8(
-      Primitive3.div,
-      {
-        ...rest,
-        ref,
-        onMouseEnter: composeEventHandlers4(onMouseEnter, handleMouseEnter),
-        onMouseLeave: composeEventHandlers4(onMouseLeave, handleMouseLeave)
-      }
-    );
-  }
-);
-MessageRoot.displayName = "MessageRoot";
+import { jsx as jsx11 } from "react/jsx-runtime";
+var MessagePrimitiveRoot = forwardRef5(({ onMouseEnter, onMouseLeave, ...rest }, ref) => {
+  const { useMessageUtils } = useMessageContext();
+  const setIsHovering = useMessageUtils((s) => s.setIsHovering);
+  const handleMouseEnter = () => {
+    setIsHovering(true);
+  };
+  const handleMouseLeave = () => {
+    setIsHovering(false);
+  };
+  return /* @__PURE__ */ jsx11(
+    Primitive3.div,
+    {
+      ...rest,
+      ref,
+      onMouseEnter: composeEventHandlers4(onMouseEnter, handleMouseEnter),
+      onMouseLeave: composeEventHandlers4(onMouseLeave, handleMouseLeave)
+    }
+  );
+});
+MessagePrimitiveRoot.displayName = "MessagePrimitive.Root";
 
 // src/primitives/message/MessageIf.tsx
-var MessageIf = ({ children, ...query }) => {
+var MessagePrimitiveIf = ({
+  children,
+  ...query
+}) => {
   const result = useMessageIf(query);
   return result ? children : null;
 };
+MessagePrimitiveIf.displayName = "MessagePrimitive.If";
 
 // src/primitives/message/MessageContent.tsx
-import { memo } from "react";
+import { memo as memo2 } from "react";
 
 // src/context/providers/ContentPartProvider.tsx
-import { useEffect as useEffect2, useState as useState2 } from "react";
-import { create } from "zustand";
-import { jsx as jsx9 } from "react/jsx-runtime";
+import { useEffect as useEffect7, useState as useState4 } from "react";
+import { create as create8 } from "zustand";
+import { jsx as jsx12 } from "react/jsx-runtime";
 var syncContentPart = ({ message }, useContentPart, partIndex) => {
   const part = message.content[partIndex];
   if (!part) return;
@@ -615,14 +1084,14 @@ var syncContentPart = ({ message }, useContentPart, partIndex) => {
 };
 var useContentPartContext2 = (partIndex) => {
   const { useMessage } = useMessageContext();
-  const [context] = useState2(() => {
-    const useContentPart = create(
+  const [context] = useState4(() => {
+    const useContentPart = create8(
       () => ({})
     );
     syncContentPart(useMessage.getState(), useContentPart, partIndex);
     return { useContentPart };
   });
-  useEffect2(() => {
+  useEffect7(() => {
     syncContentPart(useMessage.getState(), context.useContentPart, partIndex);
     return useMessage.subscribe((message) => {
       syncContentPart(message, context.useContentPart, partIndex);
@@ -635,46 +1104,48 @@ var ContentPartProvider = ({
   children
 }) => {
   const context = useContentPartContext2(partIndex);
-  return /* @__PURE__ */ jsx9(ContentPartContext.Provider, { value: context, children });
+  return /* @__PURE__ */ jsx12(ContentPartContext.Provider, { value: context, children });
 };
 
 // src/primitives/contentPart/ContentPartDisplay.tsx
-var ContentPartDisplay = () => {
+var ContentPartPrimitiveDisplay = () => {
   const display = useContentPartDisplay();
   return display ?? null;
 };
+ContentPartPrimitiveDisplay.displayName = "ContentPartPrimitive.Display";
 
 // src/primitives/contentPart/ContentPartInProgressIndicator.tsx
-var ContentPartInProgressIndicator = () => {
+var ContentPartPrimitiveInProgressIndicator = () => {
   const indicator = useContentPartInProgressIndicator();
   return indicator;
 };
+ContentPartPrimitiveInProgressIndicator.displayName = "ContentPartPrimitive.InProgressIndicator";
 
 // src/primitives/contentPart/ContentPartText.tsx
 import { Primitive as Primitive4 } from "@radix-ui/react-primitive";
 import { forwardRef as forwardRef6 } from "react";
-import { jsx as jsx10 } from "react/jsx-runtime";
-var ContentPartText = forwardRef6((props, forwardedRef) => {
+import { jsx as jsx13 } from "react/jsx-runtime";
+var ContentPartPrimitiveText = forwardRef6((props, forwardedRef) => {
   const text = useContentPartText();
-  return /* @__PURE__ */ jsx10(Primitive4.span, { ...props, ref: forwardedRef, children: text });
+  return /* @__PURE__ */ jsx13(Primitive4.p, { ...props, ref: forwardedRef, children: text });
 });
-ContentPartText.displayName = "ContentPartText";
+ContentPartPrimitiveText.displayName = "ContentPartPrimitive.Text";
 
 // src/primitives/message/MessageContent.tsx
-import { Fragment as Fragment3, jsx as jsx11, jsxs } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx14, jsxs as jsxs2 } from "react/jsx-runtime";
 var defaultComponents = {
-  Text: () => /* @__PURE__ */ jsxs(Fragment3, { children: [
-    /* @__PURE__ */ jsx11(ContentPartText, {}),
-    /* @__PURE__ */ jsx11(ContentPartInProgressIndicator, {})
+  Text: () => /* @__PURE__ */ jsxs2(Fragment3, { children: [
+    /* @__PURE__ */ jsx14(ContentPartPrimitiveText, { style: { whiteSpace: "pre-line" } }),
+    /* @__PURE__ */ jsx14(ContentPartPrimitiveInProgressIndicator, {})
   ] }),
   Image: () => null,
-  UI: () => /* @__PURE__ */ jsx11(ContentPartDisplay, {}),
+  UI: () => /* @__PURE__ */ jsx14(ContentPartPrimitiveDisplay, {}),
   tools: {
     Fallback: (props) => {
       const { useToolUIs } = useAssistantContext();
       const Render = useToolUIs((s) => s.getToolUI(props.part.toolName));
       if (!Render) return null;
-      return /* @__PURE__ */ jsx11(Render, { ...props });
+      return /* @__PURE__ */ jsx14(Render, { ...props });
     }
   }
 };
@@ -693,15 +1164,15 @@ var MessageContentPartComponent = ({
   const type = part.type;
   switch (type) {
     case "text":
-      return /* @__PURE__ */ jsx11(Text, { part, status });
+      return /* @__PURE__ */ jsx14(Text, { part, status });
     case "image":
-      return /* @__PURE__ */ jsx11(Image, { part, status });
+      return /* @__PURE__ */ jsx14(Image, { part, status });
     case "ui":
-      return /* @__PURE__ */ jsx11(UI, { part, status });
+      return /* @__PURE__ */ jsx14(UI, { part, status });
     case "tool-call": {
       const Tool = by_name[part.toolName] || Fallback;
       const addResult = (result) => addToolResult(part.toolCallId, result);
-      return /* @__PURE__ */ jsx11(Tool, { part, status, addResult });
+      return /* @__PURE__ */ jsx14(Tool, { part, status, addResult });
     }
     default:
       throw new Error(`Unknown content part type: ${type}`);
@@ -711,18 +1182,20 @@ var MessageContentPartImpl = ({
   partIndex,
   components
 }) => {
-  return /* @__PURE__ */ jsx11(ContentPartProvider, { partIndex, children: /* @__PURE__ */ jsx11(MessageContentPartComponent, { components }) });
+  return /* @__PURE__ */ jsx14(ContentPartProvider, { partIndex, children: /* @__PURE__ */ jsx14(MessageContentPartComponent, { components }) });
 };
-var MessageContentPart = memo(
+var MessageContentPart = memo2(
   MessageContentPartImpl,
   (prev, next) => prev.partIndex === next.partIndex && prev.components?.Text === next.components?.Text && prev.components?.Image === next.components?.Image && prev.components?.UI === next.components?.UI && prev.components?.tools === next.components?.tools
 );
-var MessageContent = ({ components }) => {
+var MessagePrimitiveContent = ({
+  components
+}) => {
   const { useMessage } = useMessageContext();
   const contentLength = useMessage((s) => s.message.content.length);
   return new Array(contentLength).fill(null).map((_, idx) => {
     const partIndex = idx;
-    return /* @__PURE__ */ jsx11(
+    return /* @__PURE__ */ jsx14(
       MessageContentPart,
       {
         partIndex,
@@ -732,38 +1205,42 @@ var MessageContent = ({ components }) => {
     );
   });
 };
+MessagePrimitiveContent.displayName = "MessagePrimitive.Content";
 
 // src/primitives/message/MessageInProgress.tsx
 import { Primitive as Primitive5 } from "@radix-ui/react-primitive";
 import {
   forwardRef as forwardRef7,
-  useMemo as useMemo2
+  useEffect as useEffect8
 } from "react";
-import { jsx as jsx12 } from "react/jsx-runtime";
-var MessageInProgress = forwardRef7((props, ref) => {
+import { jsx as jsx15 } from "react/jsx-runtime";
+var MessagePrimitiveInProgress = forwardRef7((props, ref) => {
   const { useMessageUtils } = useMessageContext();
-  useMemo2(() => {
-    useMessageUtils.getState().setInProgressIndicator(/* @__PURE__ */ jsx12(Primitive5.span, { ...props, ref }));
+  useEffect8(() => {
+    useMessageUtils.getState().setInProgressIndicator(/* @__PURE__ */ jsx15(Primitive5.span, { ...props, ref }));
+    return () => {
+      useMessageUtils.getState().setInProgressIndicator(null);
+    };
   }, [useMessageUtils, props, ref]);
   return null;
 });
-MessageInProgress.displayName = "MessageInProgress";
+MessagePrimitiveInProgress.displayName = "MessagePrimitive.InProgress";
 
 // src/primitives/branchPicker/BranchPickerRoot.tsx
-import { jsx as jsx13 } from "react/jsx-runtime";
-var BranchPickerRoot = forwardRef8(({ hideWhenSingleBranch, ...rest }, ref) => {
-  return /* @__PURE__ */ jsx13(MessageIf, { hasBranches: hideWhenSingleBranch ? true : void 0, children: /* @__PURE__ */ jsx13(Primitive6.div, { ...rest, ref }) });
+import { jsx as jsx16 } from "react/jsx-runtime";
+var BranchPickerPrimitiveRoot = forwardRef8(({ hideWhenSingleBranch, ...rest }, ref) => {
+  return /* @__PURE__ */ jsx16(MessagePrimitiveIf, { hasBranches: hideWhenSingleBranch ? true : void 0, children: /* @__PURE__ */ jsx16(Primitive6.div, { ...rest, ref }) });
 });
-BranchPickerRoot.displayName = "BranchPickerRoot";
+BranchPickerPrimitiveRoot.displayName = "BranchPickerPrimitive.Root";
 
 // src/primitives/composer/index.ts
 var composer_exports = {};
 __export(composer_exports, {
-  Cancel: () => ComposerCancel,
-  If: () => ComposerIf,
-  Input: () => ComposerInput,
-  Root: () => ComposerRoot,
-  Send: () => ComposerSend
+  Cancel: () => ComposerPrimitiveCancel,
+  If: () => ComposerPrimitiveIf,
+  Input: () => ComposerPrimitiveInput,
+  Root: () => ComposerPrimitiveRoot,
+  Send: () => ComposerPrimitiveSend
 });
 
 // src/primitives/composer/ComposerRoot.tsx
@@ -772,26 +1249,24 @@ import { Primitive as Primitive7 } from "@radix-ui/react-primitive";
 import {
   forwardRef as forwardRef9
 } from "react";
-import { jsx as jsx14 } from "react/jsx-runtime";
-var ComposerRoot = forwardRef9(
-  ({ onSubmit, ...rest }, forwardedRef) => {
-    const send = useComposerSend();
-    const handleSubmit = (e) => {
-      if (!send) return;
-      e.preventDefault();
-      send();
-    };
-    return /* @__PURE__ */ jsx14(
-      Primitive7.form,
-      {
-        ...rest,
-        ref: forwardedRef,
-        onSubmit: composeEventHandlers5(onSubmit, handleSubmit)
-      }
-    );
-  }
-);
-ComposerRoot.displayName = "ComposerRoot";
+import { jsx as jsx17 } from "react/jsx-runtime";
+var ComposerPrimitiveRoot = forwardRef9(({ onSubmit, ...rest }, forwardedRef) => {
+  const send = useComposerSend();
+  const handleSubmit = (e) => {
+    e.preventDefault();
+    if (!send) return;
+    send();
+  };
+  return /* @__PURE__ */ jsx17(
+    Primitive7.form,
+    {
+      ...rest,
+      ref: forwardedRef,
+      onSubmit: composeEventHandlers5(onSubmit, handleSubmit)
+    }
+  );
+});
+ComposerPrimitiveRoot.displayName = "ComposerPrimitive.Root";
 
 // src/primitives/composer/ComposerInput.tsx
 import { composeEventHandlers as composeEventHandlers6 } from "@radix-ui/primitive";
@@ -799,14 +1274,14 @@ import { useComposedRefs } from "@radix-ui/react-compose-refs";
 import { Slot } from "@radix-ui/react-slot";
 import {
   forwardRef as forwardRef10,
-  useCallback as useCallback10,
-  useEffect as useEffect3,
-  useRef
+  useCallback as useCallback13,
+  useEffect as useEffect9,
+  useRef as useRef3
 } from "react";
 import TextareaAutosize from "react-textarea-autosize";
 import { useEscapeKeydown } from "@radix-ui/react-use-escape-keydown";
-import { jsx as jsx15 } from "react/jsx-runtime";
-var ComposerInput = forwardRef10(
+import { jsx as jsx18 } from "react/jsx-runtime";
+var ComposerPrimitiveInput = forwardRef10(
   ({ autoFocus = false, asChild, disabled, onChange, onKeyDown, ...rest }, forwardedRef) => {
     const { useThread } = useThreadContext();
     const { useComposer, type } = useComposerContext();
@@ -815,7 +1290,7 @@ var ComposerInput = forwardRef10(
       return c.value;
     });
     const Component = asChild ? Slot : TextareaAutosize;
-    const textareaRef = useRef(null);
+    const textareaRef = useRef3(null);
     const ref = useComposedRefs(forwardedRef, textareaRef);
     useEscapeKeydown((e) => {
       const composer = useComposer.getState();
@@ -834,7 +1309,7 @@ var ComposerInput = forwardRef10(
       }
     };
     const autoFocusEnabled = autoFocus && !disabled;
-    const focus = useCallback10(() => {
+    const focus = useCallback13(() => {
       const textarea = textareaRef.current;
       if (!textarea || !autoFocusEnabled) return;
       textarea.focus({ preventScroll: true });
@@ -843,13 +1318,13 @@ var ComposerInput = forwardRef10(
         textareaRef.current.value.length
       );
     }, [autoFocusEnabled]);
-    useEffect3(() => focus(), [focus]);
+    useEffect9(() => focus(), [focus]);
     useOnComposerFocus(() => {
       if (type === "new") {
         focus();
       }
     });
-    return /* @__PURE__ */ jsx15(
+    return /* @__PURE__ */ jsx18(
       Component,
       {
         value,
@@ -866,94 +1341,101 @@ var ComposerInput = forwardRef10(
     );
   }
 );
-ComposerInput.displayName = "ComposerInput";
+ComposerPrimitiveInput.displayName = "ComposerPrimitive.Input";
 
 // src/primitives/composer/ComposerSend.tsx
 import { forwardRef as forwardRef11 } from "react";
 import { Primitive as Primitive8 } from "@radix-ui/react-primitive";
-import { jsx as jsx16 } from "react/jsx-runtime";
-var ComposerSend = forwardRef11(
-  ({ disabled, ...rest }, ref) => {
-    const { useComposer } = useComposerContext();
-    const hasValue = useComposer((c) => c.isEditing && c.value.length > 0);
-    return /* @__PURE__ */ jsx16(
-      Primitive8.button,
-      {
-        type: "submit",
-        ...rest,
-        ref,
-        disabled: disabled || !hasValue
-      }
-    );
-  }
-);
-ComposerSend.displayName = "ComposerSend";
+import { jsx as jsx19 } from "react/jsx-runtime";
+var ComposerPrimitiveSend = forwardRef11(({ disabled, ...rest }, ref) => {
+  const { useComposer } = useComposerContext();
+  const hasValue = useComposer((c) => c.isEditing && c.value.length > 0);
+  return /* @__PURE__ */ jsx19(
+    Primitive8.button,
+    {
+      type: "submit",
+      ...rest,
+      ref,
+      disabled: disabled || !hasValue
+    }
+  );
+});
+ComposerPrimitiveSend.displayName = "ComposerPrimitive.Send";
 
 // src/primitives/composer/ComposerCancel.tsx
-var ComposerCancel = createActionButton(
-  "ComposerCancel",
+var ComposerPrimitiveCancel = createActionButton(
+  "ComposerPrimitive.Cancel",
   useComposerCancel
 );
 
 // src/primitives/composer/ComposerIf.tsx
-var ComposerIf = ({ children, ...query }) => {
+var ComposerPrimitiveIf = ({
+  children,
+  ...query
+}) => {
   const result = useComposerIf(query);
   return result ? children : null;
 };
+ComposerPrimitiveIf.displayName = "ComposerPrimitive.If";
 
 // src/primitives/contentPart/index.ts
 var contentPart_exports = {};
 __export(contentPart_exports, {
-  Display: () => ContentPartDisplay,
-  Image: () => ContentPartImage,
-  InProgressIndicator: () => ContentPartInProgressIndicator,
-  Text: () => ContentPartText
+  Display: () => ContentPartPrimitiveDisplay,
+  Image: () => ContentPartPrimitiveImage,
+  InProgressIndicator: () => ContentPartPrimitiveInProgressIndicator,
+  Text: () => ContentPartPrimitiveText
 });
 
 // src/primitives/contentPart/ContentPartImage.tsx
 import { Primitive as Primitive9 } from "@radix-ui/react-primitive";
 import { forwardRef as forwardRef12 } from "react";
-import { jsx as jsx17 } from "react/jsx-runtime";
-var ContentPartImage = forwardRef12((props, forwardedRef) => {
+import { jsx as jsx20 } from "react/jsx-runtime";
+var ContentPartPrimitiveImage = forwardRef12((props, forwardedRef) => {
   const image = useContentPartImage();
-  return /* @__PURE__ */ jsx17(Primitive9.img, { src: image, ...props, ref: forwardedRef });
+  return /* @__PURE__ */ jsx20(Primitive9.img, { src: image, ...props, ref: forwardedRef });
 });
-ContentPartImage.displayName = "ContentPartImage";
+ContentPartPrimitiveImage.displayName = "ContentPartPrimitive.Image";
 
 // src/primitives/thread/index.ts
 var thread_exports = {};
 __export(thread_exports, {
-  Empty: () => ThreadEmpty,
-  If: () => ThreadIf,
-  Messages: () => ThreadMessages,
-  Root: () => ThreadRoot,
-  ScrollToBottom: () => ThreadScrollToBottom,
-  Suggestion: () => ThreadSuggestion,
-  Viewport: () => ThreadViewport
+  Empty: () => ThreadPrimitiveEmpty,
+  If: () => ThreadPrimitiveIf,
+  Messages: () => ThreadPrimitiveMessages,
+  Root: () => ThreadPrimitiveRoot,
+  ScrollToBottom: () => ThreadPrimitiveScrollToBottom,
+  Suggestion: () => ThreadPrimitiveSuggestion,
+  Viewport: () => ThreadPrimitiveViewport
 });
 
 // src/primitives/thread/ThreadRoot.tsx
 import { Primitive as Primitive10 } from "@radix-ui/react-primitive";
 import { forwardRef as forwardRef13 } from "react";
-import { jsx as jsx18 } from "react/jsx-runtime";
-var ThreadRoot = forwardRef13(
-  (props, ref) => {
-    return /* @__PURE__ */ jsx18(Primitive10.div, { ...props, ref });
-  }
-);
-ThreadRoot.displayName = "ThreadRoot";
+import { jsx as jsx21 } from "react/jsx-runtime";
+var ThreadPrimitiveRoot = forwardRef13((props, ref) => {
+  return /* @__PURE__ */ jsx21(Primitive10.div, { ...props, ref });
+});
+ThreadPrimitiveRoot.displayName = "ThreadPrimitive.Root";
 
 // src/primitives/thread/ThreadEmpty.tsx
-var ThreadEmpty = ({ children }) => {
+var ThreadPrimitiveEmpty = ({
+  children
+}) => {
   const empty = useThreadEmpty();
   return empty ? children : null;
 };
+ThreadPrimitiveEmpty.displayName = "ThreadPrimitive.Empty";
 
 // src/primitives/thread/ThreadIf.tsx
-var ThreadIf = ({ children, ...query }) => {
+var ThreadPrimitiveIf = ({
+  children,
+  ...query
+}) => {
   const result = useThreadIf(query);
   return result ? children : null;
 };
+ThreadPrimitiveIf.displayName = "ThreadPrimitive.If";
 
 // src/primitives/thread/ThreadViewport.tsx
 import { useComposedRefs as useComposedRefs3 } from "@radix-ui/react-compose-refs";
@@ -962,17 +1444,17 @@ import { forwardRef as forwardRef14 } from "react";
 
 // src/primitive-hooks/thread/useThreadViewportAutoScroll.tsx
 import { useComposedRefs as useComposedRefs2 } from "@radix-ui/react-compose-refs";
-import { useRef as useRef3 } from "react";
+import { useRef as useRef5 } from "react";
 
 // src/utils/hooks/useOnResizeContent.tsx
 import { useCallbackRef as useCallbackRef2 } from "@radix-ui/react-use-callback-ref";
-import { useCallback as useCallback12 } from "react";
+import { useCallback as useCallback15 } from "react";
 
 // src/utils/hooks/useManagedRef.ts
-import { useCallback as useCallback11, useRef as useRef2 } from "react";
+import { useCallback as useCallback14, useRef as useRef4 } from "react";
 var useManagedRef = (callback) => {
-  const cleanupRef = useRef2();
-  const ref = useCallback11(
+  const cleanupRef = useRef4();
+  const ref = useCallback14(
     (el) => {
       if (cleanupRef.current) {
         cleanupRef.current();
@@ -989,7 +1471,7 @@ var useManagedRef = (callback) => {
 // src/utils/hooks/useOnResizeContent.tsx
 var useOnResizeContent = (callback) => {
   const callbackRef = useCallbackRef2(callback);
-  const refCallback = useCallback12(
+  const refCallback = useCallback15(
     (el) => {
       const resizeObserver = new ResizeObserver(() => {
         callbackRef();
@@ -1026,11 +1508,11 @@ var useOnResizeContent = (callback) => {
 
 // src/utils/hooks/useOnScrollToBottom.tsx
 import { useCallbackRef as useCallbackRef3 } from "@radix-ui/react-use-callback-ref";
-import { useEffect as useEffect4 } from "react";
+import { useEffect as useEffect10 } from "react";
 var useOnScrollToBottom = (callback) => {
   const callbackRef = useCallbackRef3(callback);
   const { useViewport } = useThreadContext();
-  useEffect4(() => {
+  useEffect10(() => {
     return useViewport.getState().onScrollToBottom(() => {
       callbackRef();
     });
@@ -1041,11 +1523,11 @@ var useOnScrollToBottom = (callback) => {
 var useThreadViewportAutoScroll = ({
   autoScroll = true
 }) => {
-  const divRef = useRef3(null);
+  const divRef = useRef5(null);
   const { useViewport } = useThreadContext();
-  const firstRenderRef = useRef3(true);
-  const lastScrollTop = useRef3(0);
-  const isScrollingToBottomRef = useRef3(false);
+  const firstRenderRef = useRef5(true);
+  const lastScrollTop = useRef5(0);
+  const isScrollingToBottomRef = useRef5(false);
   const scrollToBottom = () => {
     const div = divRef.current;
     if (!div || !autoScroll) return;
@@ -1091,39 +1573,29 @@ var useThreadViewportAutoScroll = ({
 };
 
 // src/primitives/thread/ThreadViewport.tsx
-import { jsx as jsx19 } from "react/jsx-runtime";
-var ThreadViewport = forwardRef14(({ autoScroll, onScroll, children, ...rest }, forwardedRef) => {
+import { jsx as jsx22 } from "react/jsx-runtime";
+var ThreadPrimitiveViewport = forwardRef14(({ autoScroll, onScroll, children, ...rest }, forwardedRef) => {
   const autoScrollRef = useThreadViewportAutoScroll({
     autoScroll
   });
   const ref = useComposedRefs3(forwardedRef, autoScrollRef);
-  return /* @__PURE__ */ jsx19(Primitive11.div, { ...rest, ref, children });
+  return /* @__PURE__ */ jsx22(Primitive11.div, { ...rest, ref, children });
 });
-ThreadViewport.displayName = "ThreadViewport";
+ThreadPrimitiveViewport.displayName = "ThreadPrimitive.Viewport";
 
 // src/primitives/thread/ThreadMessages.tsx
-import { memo as memo2 } from "react";
+import { memo as memo3 } from "react";
 
 // src/context/providers/MessageProvider.tsx
-import { useEffect as useEffect5, useState as useState3 } from "react";
-import { create as create4 } from "zustand";
-
-// src/context/stores/EditComposer.ts
-import { create as create2 } from "zustand";
-
-// src/context/stores/BaseComposer.ts
-var makeBaseComposer = (set) => ({
-  value: "",
-  setValue: (value) => {
-    set({ value });
-  }
-});
+import { useEffect as useEffect11, useState as useState5 } from "react";
+import { create as create11 } from "zustand";
 
 // src/context/stores/EditComposer.ts
+import { create as create9 } from "zustand";
 var makeEditComposerStore = ({
   onEdit,
   onSend
-}) => create2()((set, get, store) => ({
+}) => create9()((set, get, store) => ({
   ...makeBaseComposer(set, get, store),
   isEditing: false,
   edit: () => {
@@ -1143,8 +1615,8 @@ var makeEditComposerStore = ({
 }));
 
 // src/context/stores/MessageUtils.ts
-import { create as create3 } from "zustand";
-var makeMessageUtilsStore = () => create3((set) => ({
+import { create as create10 } from "zustand";
+var makeMessageUtilsStore = () => create10((set) => ({
   inProgressIndicator: null,
   setInProgressIndicator: (value) => {
     set({ inProgressIndicator: value });
@@ -1160,7 +1632,7 @@ var makeMessageUtilsStore = () => create3((set) => ({
 }));
 
 // src/context/providers/MessageProvider.tsx
-import { jsx as jsx20 } from "react/jsx-runtime";
+import { jsx as jsx23 } from "react/jsx-runtime";
 var getIsLast = (thread, message) => {
   return thread.messages[thread.messages.length - 1]?.id === message.id;
 };
@@ -1182,8 +1654,8 @@ var syncMessage = (thread, getBranches, useMessage, messageIndex) => {
 };
 var useMessageContext2 = (messageIndex) => {
   const { useThread, useThreadActions } = useThreadContext();
-  const [context] = useState3(() => {
-    const useMessage = create4(() => ({}));
+  const [context] = useState5(() => {
+    const useMessage = create11(() => ({}));
     const useMessageUtils = makeMessageUtilsStore();
     const useEditComposer = makeEditComposerStore({
       onEdit: () => {
@@ -1219,7 +1691,7 @@ var useMessageContext2 = (messageIndex) => {
     );
     return { useMessage, useMessageUtils, useEditComposer };
   });
-  useEffect5(() => {
+  useEffect11(() => {
     return useThread.subscribe((thread) => {
       syncMessage(
         thread,
@@ -1236,11 +1708,11 @@ var MessageProvider = ({
   children
 }) => {
   const context = useMessageContext2(messageIndex);
-  return /* @__PURE__ */ jsx20(MessageContext.Provider, { value: context, children });
+  return /* @__PURE__ */ jsx23(MessageContext.Provider, { value: context, children });
 };
 
 // src/primitives/thread/ThreadMessages.tsx
-import { jsx as jsx21, jsxs as jsxs2 } from "react/jsx-runtime";
+import { jsx as jsx24, jsxs as jsxs3 } from "react/jsx-runtime";
 var getComponents = (components) => {
   return {
     EditComposer: components.EditComposer ?? components.UserMessage ?? components.Message,
@@ -1253,25 +1725,27 @@ var ThreadMessageImpl = ({
   components
 }) => {
   const { UserMessage, EditComposer, AssistantMessage } = getComponents(components);
-  return /* @__PURE__ */ jsxs2(MessageProvider, { messageIndex, children: [
-    /* @__PURE__ */ jsxs2(MessageIf, { user: true, children: [
-      /* @__PURE__ */ jsx21(ComposerIf, { editing: false, children: /* @__PURE__ */ jsx21(UserMessage, {}) }),
-      /* @__PURE__ */ jsx21(ComposerIf, { editing: true, children: /* @__PURE__ */ jsx21(EditComposer, {}) })
+  return /* @__PURE__ */ jsxs3(MessageProvider, { messageIndex, children: [
+    /* @__PURE__ */ jsxs3(MessagePrimitiveIf, { user: true, children: [
+      /* @__PURE__ */ jsx24(ComposerPrimitiveIf, { editing: false, children: /* @__PURE__ */ jsx24(UserMessage, {}) }),
+      /* @__PURE__ */ jsx24(ComposerPrimitiveIf, { editing: true, children: /* @__PURE__ */ jsx24(EditComposer, {}) })
     ] }),
-    /* @__PURE__ */ jsx21(MessageIf, { assistant: true, children: /* @__PURE__ */ jsx21(AssistantMessage, {}) })
+    /* @__PURE__ */ jsx24(MessagePrimitiveIf, { assistant: true, children: /* @__PURE__ */ jsx24(AssistantMessage, {}) })
   ] });
 };
-var ThreadMessage = memo2(
+var ThreadMessage = memo3(
   ThreadMessageImpl,
   (prev, next) => prev.messageIndex === next.messageIndex && prev.components.UserMessage === next.components.UserMessage && prev.components.EditComposer === next.components.EditComposer && prev.components.AssistantMessage === next.components.AssistantMessage
 );
-var ThreadMessages = ({ components }) => {
+var ThreadPrimitiveMessages = ({
+  components
+}) => {
   const { useThread } = useThreadContext();
   const messagesLength = useThread((t) => t.messages.length);
   if (messagesLength === 0) return null;
   return new Array(messagesLength).fill(null).map((_, idx) => {
     const messageIndex = idx;
-    return /* @__PURE__ */ jsx21(
+    return /* @__PURE__ */ jsx24(
       ThreadMessage,
       {
         messageIndex,
@@ -1281,49 +1755,22 @@ var ThreadMessages = ({ components }) => {
     );
   });
 };
+ThreadPrimitiveMessages.displayName = "ThreadPrimitive.Messages";
 
-// src/primitives/thread/ThreadScrollToBottom.tsx
-var ThreadScrollToBottom = createActionButton(
-  "ThreadScrollToBottom",
-  useThreadScrollToBottom
-);
-
-// src/primitives/thread/ThreadSuggestion.tsx
-var ThreadSuggestion = createActionButton(
-  "ThreadSuggestion",
-  useThreadSuggestion
-);
-
-// src/runtime/local/useLocalRuntime.tsx
-import { useInsertionEffect, useState as useState4 } from "react";
-
-// src/utils/ModelConfigTypes.ts
-var mergeModelConfigs = (configSet) => {
-  const configs = Array.from(configSet).map((c) => c()).sort((a, b) => (b.priority ?? 0) - (a.priority ?? 0));
-  return configs.reduce((acc, config) => {
-    if (config.system) {
-      if (acc.system) {
-        acc.system += `
-
-${config.system}`;
-      } else {
-        acc.system = config.system;
-      }
-    }
-    if (config.tools) {
-      for (const [name, tool] of Object.entries(config.tools)) {
-        if (acc.tools?.[name]) {
-          throw new Error(
-            `You tried to define a tool with the name ${name}, but it already exists.`
-          );
-        }
-        if (!acc.tools) acc.tools = {};
-        acc.tools[name] = tool;
-      }
-    }
-    return acc;
-  }, {});
-};
+// src/primitives/thread/ThreadScrollToBottom.tsx
+var ThreadPrimitiveScrollToBottom = createActionButton(
+  "ThreadPrimitive.ScrollToBottom",
+  useThreadScrollToBottom
+);
+
+// src/primitives/thread/ThreadSuggestion.tsx
+var ThreadPrimitiveSuggestion = createActionButton(
+  "ThreadPrimitive.Suggestion",
+  useThreadSuggestion
+);
+
+// src/runtime/local/useLocalRuntime.tsx
+import { useInsertionEffect as useInsertionEffect3, useState as useState6 } from "react";
 
 // src/runtime/utils/idUtils.tsx
 import { customAlphabet } from "nanoid/non-secure";
@@ -1485,13 +1932,91 @@ var MessageRepository = class {
   }
 };
 
+// src/runtime/core/BaseAssistantRuntime.tsx
+var BaseAssistantRuntime = class {
+  constructor(_thread) {
+    this._thread = _thread;
+    this._thread = _thread;
+    this._unsubscribe = this._thread.subscribe(this.subscriptionHandler);
+  }
+  _unsubscribe;
+  get thread() {
+    return this._thread;
+  }
+  set thread(thread) {
+    this._unsubscribe();
+    this._thread = thread;
+    this._unsubscribe = this._thread.subscribe(this.subscriptionHandler);
+    this.subscriptionHandler();
+  }
+  get messages() {
+    return this.thread.messages;
+  }
+  get isRunning() {
+    return this.thread.isRunning;
+  }
+  getBranches(messageId) {
+    return this.thread.getBranches(messageId);
+  }
+  switchToBranch(branchId) {
+    return this.thread.switchToBranch(branchId);
+  }
+  append(message) {
+    return this.thread.append(message);
+  }
+  startRun(parentId) {
+    return this.thread.startRun(parentId);
+  }
+  cancelRun() {
+    return this.thread.cancelRun();
+  }
+  addToolResult(toolCallId, result) {
+    return this.thread.addToolResult(toolCallId, result);
+  }
+  _subscriptions = /* @__PURE__ */ new Set();
+  subscribe(callback) {
+    this._subscriptions.add(callback);
+    return () => this._subscriptions.delete(callback);
+  }
+  subscriptionHandler = () => {
+    for (const callback of this._subscriptions) callback();
+  };
+  get unstable_synchronizer() {
+    return this.thread.unstable_synchronizer;
+  }
+};
+
 // src/runtime/local/LocalRuntime.tsx
-var LocalRuntime = class {
+var LocalRuntime = class extends BaseAssistantRuntime {
+  _configProviders;
   constructor(adapter) {
+    const configProviders = /* @__PURE__ */ new Set();
+    super(new LocalThreadRuntime(configProviders, adapter));
+    this._configProviders = configProviders;
+  }
+  set adapter(adapter) {
+    this.thread.adapter = adapter;
+  }
+  registerModelConfigProvider(provider) {
+    this._configProviders.add(provider);
+    return () => this._configProviders.delete(provider);
+  }
+  switchToThread(threadId) {
+    if (threadId) {
+      throw new Error("LocalRuntime does not yet support switching threads");
+    }
+    return this.thread = new LocalThreadRuntime(
+      this._configProviders,
+      this.thread.adapter
+    );
+  }
+};
+var LocalThreadRuntime = class {
+  constructor(_configProviders, adapter) {
+    this._configProviders = _configProviders;
     this.adapter = adapter;
   }
   _subscriptions = /* @__PURE__ */ new Set();
-  _configProviders = /* @__PURE__ */ new Set();
   abortController = null;
   repository = new MessageRepository();
   get messages() {
@@ -1570,248 +2095,24 @@ var LocalRuntime = class {
     this._subscriptions.add(callback);
     return () => this._subscriptions.delete(callback);
   }
-  registerModelConfigProvider(provider) {
-    this._configProviders.add(provider);
-    return () => this._configProviders.delete(provider);
-  }
   addToolResult() {
-    throw new Error("LocalRuntime does not yet support tool results");
+    throw new Error("LocalRuntime does not yet support adding tool results");
   }
 };
 
 // src/runtime/local/useLocalRuntime.tsx
 var useLocalRuntime = (adapter) => {
-  const [runtime] = useState4(() => new LocalRuntime(adapter));
-  useInsertionEffect(() => {
+  const [runtime] = useState6(() => new LocalRuntime(adapter));
+  useInsertionEffect3(() => {
     runtime.adapter = adapter;
   });
   return runtime;
 };
 
-// src/context/providers/AssistantRuntimeProvider.tsx
-import { memo as memo3 } from "react";
-
-// src/context/providers/AssistantProvider.tsx
-import { useEffect as useEffect7, useInsertionEffect as useInsertionEffect3, useRef as useRef5, useState as useState6 } from "react";
-
-// src/context/stores/AssistantModelConfig.ts
-import { create as create5 } from "zustand";
-
-// src/utils/ProxyConfigProvider.ts
-var ProxyConfigProvider = class {
-  _providers = /* @__PURE__ */ new Set();
-  getModelConfig() {
-    return mergeModelConfigs(this._providers);
-  }
-  registerModelConfigProvider(provider) {
-    this._providers.add(provider);
-    return () => {
-      this._providers.delete(provider);
-    };
-  }
-};
-
-// src/context/stores/AssistantModelConfig.ts
-var makeAssistantModelConfigStore = () => create5(() => {
-  const proxy = new ProxyConfigProvider();
-  return Object.freeze({
-    getModelConfig: () => {
-      return proxy.getModelConfig();
-    },
-    registerModelConfigProvider: (provider) => {
-      return proxy.registerModelConfigProvider(provider);
-    }
-  });
-});
-
-// src/context/stores/AssistantToolUIs.ts
-import { create as create6 } from "zustand";
-var makeAssistantToolUIsStore = () => create6((set) => {
-  const renderers = /* @__PURE__ */ new Map();
-  return Object.freeze({
-    getToolUI: (name) => {
-      const arr = renderers.get(name);
-      const last = arr?.at(-1);
-      if (last) return last;
-      return null;
-    },
-    setToolUI: (name, render) => {
-      let arr = renderers.get(name);
-      if (!arr) {
-        arr = [];
-        renderers.set(name, arr);
-      }
-      arr.push(render);
-      set({});
-      return () => {
-        const index = arr.indexOf(render);
-        if (index !== -1) {
-          arr.splice(index, 1);
-        }
-        if (index === arr.length) {
-          set({});
-        }
-      };
-    }
-  });
-});
-
-// src/context/providers/ThreadProvider.tsx
-import { useEffect as useEffect6, useInsertionEffect as useInsertionEffect2, useRef as useRef4, useState as useState5 } from "react";
-
-// src/context/stores/Composer.ts
-import { create as create7 } from "zustand";
-var makeComposerStore = (useThread, useThreadActions) => {
-  const focusListeners = /* @__PURE__ */ new Set();
-  return create7()((set, get, store) => {
-    return {
-      ...makeBaseComposer(set, get, store),
-      isEditing: true,
-      send: () => {
-        const { setValue, value } = get();
-        setValue("");
-        useThreadActions.getState().append({
-          parentId: useThread.getState().messages.at(-1)?.id ?? null,
-          role: "user",
-          content: [{ type: "text", text: value }]
-        });
-      },
-      cancel: () => {
-        const thread = useThread.getState();
-        if (!thread.isRunning) return false;
-        useThreadActions.getState().cancelRun();
-        return true;
-      },
-      focus: () => {
-        for (const listener of focusListeners) {
-          listener();
-        }
-      },
-      onFocus: (listener) => {
-        focusListeners.add(listener);
-        return () => {
-          focusListeners.delete(listener);
-        };
-      }
-    };
-  });
-};
-
-// src/context/stores/Thread.ts
-import { create as create8 } from "zustand";
-var makeThreadStore = (runtimeRef) => {
-  return create8(() => ({
-    messages: runtimeRef.current.messages,
-    isRunning: runtimeRef.current.isRunning
-  }));
-};
-
-// src/context/stores/ThreadViewport.tsx
-import { create as create9 } from "zustand";
-var makeThreadViewportStore = () => {
-  const scrollToBottomListeners = /* @__PURE__ */ new Set();
-  return create9(() => ({
-    isAtBottom: true,
-    scrollToBottom: () => {
-      for (const listener of scrollToBottomListeners) {
-        listener();
-      }
-    },
-    onScrollToBottom: (callback) => {
-      scrollToBottomListeners.add(callback);
-      return () => {
-        scrollToBottomListeners.delete(callback);
-      };
-    }
-  }));
-};
-
-// src/context/stores/ThreadActions.ts
-import { create as create10 } from "zustand";
-var makeThreadActionStore = (runtimeRef) => {
-  return create10(
-    () => Object.freeze({
-      getBranches: (messageId) => runtimeRef.current.getBranches(messageId),
-      switchToBranch: (branchId) => runtimeRef.current.switchToBranch(branchId),
-      startRun: (parentId) => runtimeRef.current.startRun(parentId),
-      append: (message) => runtimeRef.current.append(message),
-      cancelRun: () => runtimeRef.current.cancelRun(),
-      addToolResult: (toolCallId, result) => runtimeRef.current.addToolResult(toolCallId, result)
-    })
-  );
-};
-
-// src/context/providers/ThreadProvider.tsx
-import { jsx as jsx22, jsxs as jsxs3 } from "react/jsx-runtime";
-var ThreadProvider = ({
-  children,
-  runtime
-}) => {
-  const runtimeRef = useRef4(runtime);
-  useInsertionEffect2(() => {
-    runtimeRef.current = runtime;
-  });
-  const [context] = useState5(() => {
-    const useThread = makeThreadStore(runtimeRef);
-    const useThreadActions = makeThreadActionStore(runtimeRef);
-    const useViewport = makeThreadViewportStore();
-    const useComposer = makeComposerStore(useThread, useThreadActions);
-    return {
-      useThread,
-      useThreadActions,
-      useComposer,
-      useViewport
-    };
-  });
-  useEffect6(() => {
-    const onRuntimeUpdate = () => {
-      context.useThread.setState(
-        Object.freeze({
-          messages: runtimeRef.current.messages,
-          isRunning: runtimeRef.current.isRunning
-        }),
-        true
-      );
-    };
-    onRuntimeUpdate();
-    return runtime.subscribe(onRuntimeUpdate);
-  }, [context, runtime]);
-  const RuntimeSynchronizer = runtime.unstable_synchronizer;
-  return /* @__PURE__ */ jsxs3(ThreadContext.Provider, { value: context, children: [
-    RuntimeSynchronizer && /* @__PURE__ */ jsx22(RuntimeSynchronizer, {}),
-    children
-  ] });
-};
-
-// src/context/providers/AssistantProvider.tsx
-import { jsx as jsx23 } from "react/jsx-runtime";
-var AssistantProvider = ({ children, runtime }) => {
-  const runtimeRef = useRef5(runtime);
-  useInsertionEffect3(() => {
-    runtimeRef.current = runtime;
-  });
-  const [context] = useState6(() => {
-    const useModelConfig = makeAssistantModelConfigStore();
-    const useToolUIs = makeAssistantToolUIsStore();
-    return { useModelConfig, useToolUIs };
-  });
-  const getModelCOnfig = context.useModelConfig((c) => c.getModelConfig);
-  useEffect7(() => {
-    return runtime.registerModelConfigProvider(getModelCOnfig);
-  }, [runtime, getModelCOnfig]);
-  return /* @__PURE__ */ jsx23(AssistantContext.Provider, { value: context, children: /* @__PURE__ */ jsx23(ThreadProvider, { runtime, children }) });
-};
-
-// src/context/providers/AssistantRuntimeProvider.tsx
-import { jsx as jsx24 } from "react/jsx-runtime";
-var AssistantRuntimeProviderImpl = ({ children, runtime }) => {
-  return /* @__PURE__ */ jsx24(AssistantProvider, { runtime, children });
-};
-var AssistantRuntimeProvider = memo3(AssistantRuntimeProviderImpl);
-
 // src/internal.ts
 var internal_exports = {};
 __export(internal_exports, {
+  BaseAssistantRuntime: () => BaseAssistantRuntime,
   MessageRepository: () => MessageRepository,
   ProxyConfigProvider: () => ProxyConfigProvider
 });
@@ -1825,22 +2126,34 @@ export {
   internal_exports as INTERNAL,
   message_exports as MessagePrimitive,
   thread_exports as ThreadPrimitive,
+  makeAssistantTool,
+  makeAssistantToolUI,
   useActionBarCopy,
   useActionBarEdit,
   useActionBarReload,
+  useAppendMessage,
+  useAssistantContext,
+  useAssistantInstructions,
+  useAssistantTool,
+  useAssistantToolUI,
   useBranchPickerCount,
   useBranchPickerNext,
   useBranchPickerNumber,
   useBranchPickerPrevious,
   useComposerCancel,
+  useComposerContext,
   useComposerIf,
   useComposerSend,
+  useContentPartContext,
   useContentPartDisplay,
   useContentPartImage,
   useContentPartInProgressIndicator,
   useContentPartText,
   useLocalRuntime,
+  useMessageContext,
   useMessageIf,
+  useSwitchToNewThread,
+  useThreadContext,
   useThreadEmpty,
   useThreadIf,
   useThreadScrollToBottom,