@assistant-ui/react 0.3.0 → 0.3.1

package/dist/index.mjs

@@ -148,11 +148,14 @@ var makeBaseComposer = (set) => ({
 });
 
 // src/context/stores/Composer.ts
-var makeComposerStore = (useThread, useThreadMessages, useThreadActions) => {
+var makeComposerStore = (useThreadMessages, useThreadActions) => {
   const focusListeners = /* @__PURE__ */ new Set();
   return create3()((set, get, store) => {
     return {
       ...makeBaseComposer(set, get, store),
+      get canCancel() {
+        return useThreadActions.getState().capabilities.cancel;
+      },
       isEditing: true,
       send: () => {
         const { setValue, value } = get();
@@ -164,10 +167,7 @@ var makeComposerStore = (useThread, useThreadMessages, useThreadActions) => {
         });
       },
       cancel: () => {
-        const thread = useThread.getState();
-        if (!thread.isRunning) return false;
         useThreadActions.getState().cancelRun();
-        return true;
       },
       focus: () => {
         for (const listener of focusListeners) {
@@ -217,6 +217,9 @@ import { create as create6 } from "zustand";
 var makeThreadActionStore = (runtimeRef) => {
   return create6(
     () => Object.freeze({
+      get capabilities() {
+        return runtimeRef.current.capabilities;
+      },
       getBranches: (messageId) => runtimeRef.current.getBranches(messageId),
       switchToBranch: (branchId) => runtimeRef.current.switchToBranch(branchId),
       startRun: (parentId) => runtimeRef.current.startRun(parentId),
@@ -248,11 +251,7 @@ var ThreadProvider = ({
     const useThreadMessages = makeThreadMessagesStore(runtimeRef);
     const useThreadActions = makeThreadActionStore(runtimeRef);
     const useViewport = makeThreadViewportStore();
-    const useComposer = makeComposerStore(
-      useThread,
-      useThreadMessages,
-      useThreadActions
-    );
+    const useComposer = makeComposerStore(useThreadMessages, useThreadActions);
     return {
       useThread,
       useThreadMessages,
@@ -625,7 +624,7 @@ var useBranchPickerPrevious = () => {
 import { useCallback as useCallback9 } from "react";
 var useComposerCancel = () => {
   const { useComposer } = useComposerContext();
-  const disabled = useComposer((c) => !c.isEditing);
+  const disabled = useComposer((c) => !c.canCancel);
   const callback = useCallback9(() => {
     const { cancel } = useComposer.getState();
     cancel();
@@ -757,15 +756,18 @@ var useThreadSuggestion = ({
   autoSend
 }) => {
   const { useThread, useComposer } = useThreadContext();
+  const append = useAppendMessage();
   const disabled = useThread((t) => t.isRunning);
   const callback = useCallback12(() => {
     const thread = useThread.getState();
     const composer = useComposer.getState();
-    composer.setValue(prompt);
     if (autoSend && !thread.isRunning) {
-      composer.send();
+      append(prompt);
+      composer.setValue("");
+    } else {
+      composer.setValue(prompt);
     }
-  }, [useThread, useComposer, prompt, autoSend]);
+  }, [useThread, useComposer, autoSend, append, prompt]);
   if (disabled) return null;
   return callback;
 };
@@ -1203,7 +1205,7 @@ import { jsx as jsx16, jsxs as jsxs2 } from "react/jsx-runtime";
 var defaultComponents = {
   Text: () => /* @__PURE__ */ jsxs2("p", { style: { whiteSpace: "pre-line" }, children: [
     /* @__PURE__ */ jsx16(ContentPartPrimitiveText, {}),
-    /* @__PURE__ */ jsx16(ContentPartPrimitiveInProgress, { children: " \u25CF" })
+    /* @__PURE__ */ jsx16(ContentPartPrimitiveInProgress, { children: /* @__PURE__ */ jsx16("span", { style: { fontFamily: "revert" }, children: " \u25CF" }) })
   ] }),
   Image: () => /* @__PURE__ */ jsx16(ContentPartPrimitiveImage, {}),
   UI: () => /* @__PURE__ */ jsx16(ContentPartPrimitiveDisplay, {}),
@@ -1348,7 +1350,8 @@ var ComposerPrimitiveInput = forwardRef11(
     const ref = useComposedRefs2(forwardedRef, textareaRef);
     useEscapeKeydown((e) => {
       const composer = useComposer.getState();
-      if (composer.cancel()) {
+      if (composer.canCancel) {
+        composer.cancel();
         e.preventDefault();
       }
     });
@@ -1622,20 +1625,19 @@ var makeEditComposerStore = ({
   onSend
 }) => create10()((set, get, store) => ({
   ...makeBaseComposer(set, get, store),
+  canCancel: false,
   isEditing: false,
   edit: () => {
     const value = onEdit();
-    set({ isEditing: true, value });
+    set({ isEditing: true, canCancel: true, value });
   },
   send: () => {
     const value = get().value;
-    set({ isEditing: false });
+    set({ isEditing: false, canCancel: false });
     onSend(value);
   },
   cancel: () => {
-    if (!get().isEditing) return false;
-    set({ isEditing: false });
-    return true;
+    set({ isEditing: false, canCancel: false });
   }
 }));
 
@@ -1756,9 +1758,9 @@ var ThreadMessageImpl = ({
 };
 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
+  (prev, next) => prev.messageIndex === next.messageIndex && prev.components.Message === next.components.Message && prev.components.UserMessage === next.components.UserMessage && prev.components.EditComposer === next.components.EditComposer && prev.components.AssistantMessage === next.components.AssistantMessage
 );
-var ThreadPrimitiveMessages = ({
+var ThreadPrimitiveMessagesImpl = ({
   components
 }) => {
   const { useThreadMessages } = useThreadContext();
@@ -1776,7 +1778,11 @@ var ThreadPrimitiveMessages = ({
     );
   });
 };
-ThreadPrimitiveMessages.displayName = "ThreadPrimitive.Messages";
+ThreadPrimitiveMessagesImpl.displayName = "ThreadPrimitive.Messages";
+var ThreadPrimitiveMessages = memo3(
+  ThreadPrimitiveMessagesImpl,
+  (prev, next) => prev.components?.Message === next.components?.Message && prev.components?.UserMessage === next.components?.UserMessage && prev.components?.EditComposer === next.components?.EditComposer && prev.components?.AssistantMessage === next.components?.AssistantMessage
+);
 
 // src/primitives/thread/ThreadScrollToBottom.tsx
 var ThreadPrimitiveScrollToBottom = createActionButton(
@@ -1960,6 +1966,9 @@ var BaseAssistantRuntime = class {
     this._thread = _thread;
     this._unsubscribe = this._thread.subscribe(this.subscriptionHandler);
   }
+  get capabilities() {
+    return this._thread.capabilities;
+  }
   _unsubscribe;
   get thread() {
     return this._thread;
@@ -2032,6 +2041,12 @@ var LocalRuntime = class extends BaseAssistantRuntime {
     );
   }
 };
+var CAPABILITIES = Object.freeze({
+  edit: true,
+  reload: true,
+  cancel: true,
+  copy: true
+});
 var LocalThreadRuntime = class {
   constructor(_configProviders, adapter) {
     this._configProviders = _configProviders;
@@ -2040,6 +2055,7 @@ var LocalThreadRuntime = class {
   _subscriptions = /* @__PURE__ */ new Set();
   abortController = null;
   repository = new MessageRepository();
+  capabilities = CAPABILITIES;
   get messages() {
     return this.repository.getMessages();
   }