@assistant-ui/react 0.1.6 → 0.1.8

package/dist/index.mjs

@@ -9,7 +9,7 @@ import {
   useContentPartContext,
   useMessageContext,
   useThreadContext
-} from "./chunk-KIP3YFVM.mjs";
+} from "./chunk-RITM2IUH.mjs";
 
 // src/actions/useCopyMessage.tsx
 import { useCallback } from "react";
@@ -150,9 +150,7 @@ __export(thread_exports, {
 });
 
 // src/primitives/thread/ThreadRoot.tsx
-import {
-  Primitive
-} from "@radix-ui/react-primitive";
+import { Primitive } from "@radix-ui/react-primitive";
 import { forwardRef } from "react";
 import { jsx } from "react/jsx-runtime";
 var ThreadRoot = forwardRef(
@@ -160,6 +158,7 @@ var ThreadRoot = forwardRef(
     return /* @__PURE__ */ jsx(Primitive.div, { ...props, ref });
   }
 );
+ThreadRoot.displayName = "ThreadRoot";
 
 // src/primitives/thread/ThreadIf.tsx
 var useThreadIf = (props) => {
@@ -186,18 +185,19 @@ var ThreadEmpty = ({ children }) => {
 // src/primitives/thread/ThreadViewport.tsx
 import { composeEventHandlers } from "@radix-ui/primitive";
 import { useComposedRefs } from "@radix-ui/react-compose-refs";
+import { Primitive as Primitive2 } from "@radix-ui/react-primitive";
 import {
-  Primitive as Primitive2
-} from "@radix-ui/react-primitive";
-import { forwardRef as forwardRef2, useRef } from "react";
+  forwardRef as forwardRef2,
+  useRef
+} from "react";
 
 // src/utils/hooks/useOnResizeContent.tsx
 import { useCallbackRef } from "@radix-ui/react-use-callback-ref";
 import { useEffect } from "react";
 var useOnResizeContent = (ref, callback) => {
   const callbackRef = useCallbackRef(callback);
+  const el = ref.current;
   useEffect(() => {
-    const el = ref.current;
     if (!el) return;
     const resizeObserver = new ResizeObserver(() => {
       callbackRef();
@@ -226,7 +226,7 @@ var useOnResizeContent = (ref, callback) => {
       resizeObserver.disconnect();
       mutationObserver.disconnect();
     };
-  }, [ref.current, callbackRef]);
+  }, [el, callbackRef]);
 };
 
 // src/utils/hooks/useOnScrollToBottom.tsx
@@ -295,6 +295,7 @@ var ThreadViewport = forwardRef2(({ autoScroll = true, onScroll, children, ...re
     }
   );
 });
+ThreadViewport.displayName = "ThreadViewport";
 
 // src/primitives/thread/ThreadMessages.tsx
 import { memo } from "react";
@@ -499,9 +500,7 @@ var ThreadMessages = ({ components }) => {
 
 // src/primitives/thread/ThreadScrollToBottom.tsx
 import { composeEventHandlers as composeEventHandlers2 } from "@radix-ui/primitive";
-import {
-  Primitive as Primitive3
-} from "@radix-ui/react-primitive";
+import { Primitive as Primitive3 } from "@radix-ui/react-primitive";
 import { forwardRef as forwardRef3 } from "react";
 import { jsx as jsx6 } from "react/jsx-runtime";
 var ThreadScrollToBottom = forwardRef3(({ onClick, ...rest }, ref) => {
@@ -520,12 +519,11 @@ var ThreadScrollToBottom = forwardRef3(({ onClick, ...rest }, ref) => {
     }
   );
 });
+ThreadScrollToBottom.displayName = "ThreadScrollToBottom";
 
 // src/primitives/thread/ThreadSuggestion.tsx
 import { composeEventHandlers as composeEventHandlers3 } from "@radix-ui/primitive";
-import {
-  Primitive as Primitive4
-} from "@radix-ui/react-primitive";
+import { Primitive as Primitive4 } from "@radix-ui/react-primitive";
 import { forwardRef as forwardRef4 } from "react";
 import { jsx as jsx7 } from "react/jsx-runtime";
 var ThreadSuggestion = forwardRef4(({ onClick, prompt, method, autoSend: send, ...rest }, ref) => {
@@ -549,6 +547,7 @@ var ThreadSuggestion = forwardRef4(({ onClick, prompt, method, autoSend: send, .
     }
   );
 });
+ThreadSuggestion.displayName = "ThreadSuggestion";
 
 // src/primitives/composer/index.ts
 var composer_exports = {};
@@ -563,10 +562,11 @@ __export(composer_exports, {
 // src/primitives/composer/ComposerRoot.tsx
 import { composeEventHandlers as composeEventHandlers4 } from "@radix-ui/primitive";
 import { useComposedRefs as useComposedRefs2 } from "@radix-ui/react-compose-refs";
+import { Primitive as Primitive5 } from "@radix-ui/react-primitive";
 import {
-  Primitive as Primitive5
-} from "@radix-ui/react-primitive";
-import { forwardRef as forwardRef5, useRef as useRef2 } from "react";
+  forwardRef as forwardRef5,
+  useRef as useRef2
+} from "react";
 import { jsx as jsx8 } from "react/jsx-runtime";
 var ComposerRoot = forwardRef5(
   ({ onSubmit, ...rest }, forwardedRef) => {
@@ -591,6 +591,7 @@ var ComposerRoot = forwardRef5(
     );
   }
 );
+ComposerRoot.displayName = "ComposerRoot";
 
 // src/primitives/composer/ComposerInput.tsx
 import { composeEventHandlers as composeEventHandlers5 } from "@radix-ui/primitive";
@@ -665,11 +666,10 @@ var ComposerInput = forwardRef6(
     );
   }
 );
+ComposerInput.displayName = "ComposerInput";
 
 // src/primitives/composer/ComposerSend.tsx
-import {
-  Primitive as Primitive6
-} from "@radix-ui/react-primitive";
+import { Primitive as Primitive6 } from "@radix-ui/react-primitive";
 import { forwardRef as forwardRef7 } from "react";
 import { jsx as jsx10 } from "react/jsx-runtime";
 var ComposerSend = forwardRef7(
@@ -687,12 +687,11 @@ var ComposerSend = forwardRef7(
     );
   }
 );
+ComposerSend.displayName = "ComposerSend";
 
 // src/primitives/composer/ComposerCancel.tsx
 import { composeEventHandlers as composeEventHandlers6 } from "@radix-ui/primitive";
-import {
-  Primitive as Primitive7
-} from "@radix-ui/react-primitive";
+import { Primitive as Primitive7 } from "@radix-ui/react-primitive";
 import { forwardRef as forwardRef8 } from "react";
 import { jsx as jsx11 } from "react/jsx-runtime";
 var ComposerCancel = forwardRef8(({ onClick, ...rest }, ref) => {
@@ -710,6 +709,7 @@ var ComposerCancel = forwardRef8(({ onClick, ...rest }, ref) => {
     }
   );
 });
+ComposerCancel.displayName = "ComposerCancel";
 
 // src/primitives/message/index.ts
 var message_exports = {};
@@ -722,9 +722,7 @@ __export(message_exports, {
 
 // src/primitives/message/MessageRoot.tsx
 import { composeEventHandlers as composeEventHandlers7 } from "@radix-ui/primitive";
-import {
-  Primitive as Primitive8
-} from "@radix-ui/react-primitive";
+import { Primitive as Primitive8 } from "@radix-ui/react-primitive";
 import { forwardRef as forwardRef9 } from "react";
 import { jsx as jsx12 } from "react/jsx-runtime";
 var MessageRoot = forwardRef9(
@@ -748,6 +746,7 @@ var MessageRoot = forwardRef9(
     );
   }
 );
+MessageRoot.displayName = "MessageRoot";
 
 // src/primitives/message/MessageContent.tsx
 import { memo as memo2 } from "react";
@@ -815,9 +814,7 @@ var ContentPartInProgressIndicator = () => {
 };
 
 // src/primitives/contentPart/ContentPartText.tsx
-import {
-  Primitive as Primitive9
-} from "@radix-ui/react-primitive";
+import { Primitive as Primitive9 } from "@radix-ui/react-primitive";
 import { forwardRef as forwardRef10 } from "react";
 import { jsx as jsx14 } from "react/jsx-runtime";
 var ContentPartText = forwardRef10((props, forwardedRef) => {
@@ -831,6 +828,7 @@ var ContentPartText = forwardRef10((props, forwardedRef) => {
   });
   return /* @__PURE__ */ jsx14(Primitive9.span, { ...props, ref: forwardedRef, children: text });
 });
+ContentPartText.displayName = "ContentPartText";
 
 // src/primitives/message/MessageContent.tsx
 import { Fragment, jsx as jsx15, jsxs as jsxs3 } from "react/jsx-runtime";
@@ -843,10 +841,8 @@ var defaultComponents = {
   UI: () => /* @__PURE__ */ jsx15(ContentPartDisplay, {}),
   tools: {
     Fallback: (props) => {
-      const { useToolRenderers } = useAssistantContext();
-      const Render = useToolRenderers(
-        (s) => s.getToolRenderer(props.part.toolName)
-      );
+      const { useToolUIs } = useAssistantContext();
+      const Render = useToolUIs((s) => s.getToolUI(props.part.toolName));
       if (!Render) return null;
       return /* @__PURE__ */ jsx15(Render, { ...props });
     }
@@ -860,6 +856,8 @@ var MessageContentPartComponent = ({
     tools: { by_name = {}, Fallback = defaultComponents.tools.Fallback } = {}
   } = {}
 }) => {
+  const { useThread } = useThreadContext();
+  const addToolResult = useThread((t) => t.addToolResult);
   const { useContentPart } = useContentPartContext();
   const { part, status } = useContentPart();
   const type = part.type;
@@ -872,7 +870,8 @@ var MessageContentPartComponent = ({
       return /* @__PURE__ */ jsx15(UI, { part, status });
     case "tool-call": {
       const Tool = by_name[part.toolName] || Fallback;
-      return /* @__PURE__ */ jsx15(Tool, { part, status });
+      const addResult = (result) => addToolResult(part.toolCallId, result);
+      return /* @__PURE__ */ jsx15(Tool, { part, status, addResult });
     }
     default:
       throw new Error(`Unknown content part type: ${type}`);
@@ -905,10 +904,11 @@ var MessageContent = ({ components }) => {
 };
 
 // src/primitives/message/MessageInProgress.tsx
+import { Primitive as Primitive10 } from "@radix-ui/react-primitive";
 import {
-  Primitive as Primitive10
-} from "@radix-ui/react-primitive";
-import { forwardRef as forwardRef11, useMemo as useMemo2 } from "react";
+  forwardRef as forwardRef11,
+  useMemo as useMemo2
+} from "react";
 import { jsx as jsx16 } from "react/jsx-runtime";
 var MessageInProgress = forwardRef11((props, ref) => {
   const { useMessage } = useMessageContext();
@@ -917,6 +917,7 @@ var MessageInProgress = forwardRef11((props, ref) => {
   }, [useMessage, props, ref]);
   return null;
 });
+MessageInProgress.displayName = "MessageInProgress";
 
 // src/primitives/branchPicker/index.ts
 var branchPicker_exports = {};
@@ -930,27 +931,25 @@ __export(branchPicker_exports, {
 
 // src/utils/createActionButton.tsx
 import { composeEventHandlers as composeEventHandlers8 } from "@radix-ui/primitive";
-import {
-  Primitive as Primitive11
-} from "@radix-ui/react-primitive";
+import { Primitive as Primitive11 } from "@radix-ui/react-primitive";
 import { forwardRef as forwardRef12 } from "react";
 import { jsx as jsx17 } from "react/jsx-runtime";
 var createActionButton = (useActionButton) => {
-  return forwardRef12(
-    (props, forwardedRef) => {
-      const onClick = useActionButton(props);
-      return /* @__PURE__ */ jsx17(
-        Primitive11.button,
-        {
-          type: "button",
-          disabled: !onClick,
-          ...props,
-          ref: forwardedRef,
-          onClick: composeEventHandlers8(props.onClick, onClick ?? void 0)
-        }
-      );
-    }
-  );
+  const ActionButton = forwardRef12((props, forwardedRef) => {
+    const onClick = useActionButton(props);
+    return /* @__PURE__ */ jsx17(
+      Primitive11.button,
+      {
+        type: "button",
+        disabled: !onClick,
+        ...props,
+        ref: forwardedRef,
+        onClick: composeEventHandlers8(props.onClick, onClick ?? void 0)
+      }
+    );
+  });
+  ActionButton.displayName = "ActionButton";
+  return ActionButton;
 };
 
 // src/primitives/branchPicker/BranchPickerNext.tsx
@@ -976,14 +975,13 @@ var BranchPickerNumber = () => {
 };
 
 // src/primitives/branchPicker/BranchPickerRoot.tsx
-import {
-  Primitive as Primitive12
-} from "@radix-ui/react-primitive";
+import { Primitive as Primitive12 } from "@radix-ui/react-primitive";
 import { forwardRef as forwardRef13 } from "react";
 import { jsx as jsx20 } from "react/jsx-runtime";
 var BranchPickerRoot = forwardRef13(({ hideWhenSingleBranch, ...rest }, ref) => {
   return /* @__PURE__ */ jsx20(MessageIf, { hasBranches: hideWhenSingleBranch ? true : void 0, children: /* @__PURE__ */ jsx20(Primitive12.div, { ...rest, ref }) });
 });
+BranchPickerRoot.displayName = "BranchPickerRoot";
 
 // src/primitives/actionBar/index.ts
 var actionBar_exports = {};
@@ -995,9 +993,7 @@ __export(actionBar_exports, {
 });
 
 // src/primitives/actionBar/ActionBarRoot.tsx
-import {
-  Primitive as Primitive13
-} from "@radix-ui/react-primitive";
+import { Primitive as Primitive13 } from "@radix-ui/react-primitive";
 import { forwardRef as forwardRef14 } from "react";
 import { jsx as jsx21 } from "react/jsx-runtime";
 var ActionBarRoot = forwardRef14(({ hideWhenRunning, autohide, autohideFloat, ...rest }, ref) => {
@@ -1025,6 +1021,7 @@ var ActionBarRoot = forwardRef14(({ hideWhenRunning, autohide, autohideFloat, ..
     }
   );
 });
+ActionBarRoot.displayName = "ActionBarRoot";
 
 // src/primitives/actionBar/ActionBarCopy.tsx
 var ActionBarCopy = createActionButton(useCopyMessage);
@@ -1045,9 +1042,7 @@ __export(contentPart_exports, {
 });
 
 // src/primitives/contentPart/ContentPartImage.tsx
-import {
-  Primitive as Primitive14
-} from "@radix-ui/react-primitive";
+import { Primitive as Primitive14 } from "@radix-ui/react-primitive";
 import { forwardRef as forwardRef15 } from "react";
 import { jsx as jsx22 } from "react/jsx-runtime";
 var ContentPartImage = forwardRef15((props, forwardedRef) => {
@@ -1061,6 +1056,7 @@ var ContentPartImage = forwardRef15((props, forwardedRef) => {
   });
   return /* @__PURE__ */ jsx22(Primitive14.img, { src: image, ...props, ref: forwardedRef });
 });
+ContentPartImage.displayName = "ContentPartImage";
 
 // src/runtime/local/useLocalRuntime.tsx
 import { useInsertionEffect, useState as useState3 } from "react";
@@ -1342,6 +1338,9 @@ var LocalRuntime = class {
     this._configProviders.add(provider);
     return () => this._configProviders.delete(provider);
   }
+  addToolResult() {
+    throw new Error("LocalRuntime does not yet support tool results");
+  }
 };
 
 // src/runtime/local/useLocalRuntime.tsx
@@ -1389,18 +1388,18 @@ var makeAssistantModelConfigStore = () => create4(() => {
   };
 });
 
-// src/context/stores/AssistantToolRenderers.ts
+// src/context/stores/AssistantToolUIs.ts
 import { create as create5 } from "zustand";
-var makeAssistantToolRenderersStore = () => create5((set) => {
+var makeAssistantToolUIsStore = () => create5((set) => {
   const renderers = /* @__PURE__ */ new Map();
   return {
-    getToolRenderer: (name) => {
+    getToolUI: (name) => {
       const arr = renderers.get(name);
       const last = arr?.at(-1);
       if (last) return last;
       return null;
     },
-    setToolRenderer: (name, render) => {
+    setToolUI: (name, render) => {
       let arr = renderers.get(name);
       if (!arr) {
         arr = [];
@@ -1455,7 +1454,8 @@ var makeThreadStore = (runtimeRef) => {
     switchToBranch: (branchId) => runtimeRef.current.switchToBranch(branchId),
     startRun: (parentId) => runtimeRef.current.startRun(parentId),
     append: (message) => runtimeRef.current.append(message),
-    cancelRun: () => runtimeRef.current.cancelRun()
+    cancelRun: () => runtimeRef.current.cancelRun(),
+    addToolResult: (toolCallId, result) => runtimeRef.current.addToolResult(toolCallId, result)
   }));
   const onRuntimeUpdate = () => {
     useThread.setState({
@@ -1532,8 +1532,8 @@ var AssistantProvider = ({ children, runtime }) => {
   });
   const [context] = useState5(() => {
     const useModelConfig = makeAssistantModelConfigStore();
-    const useToolRenderers = makeAssistantToolRenderersStore();
-    return { useModelConfig, useToolRenderers };
+    const useToolUIs = makeAssistantToolUIsStore();
+    return { useModelConfig, useToolUIs };
   });
   const getModelCOnfig = context.useModelConfig((c) => c.getModelConfig);
   useEffect7(() => {