@assistant-ui/core 0.2.9 → 0.2.11

package/src/store/clients/suggestions.ts

@@ -1,6 +1,7 @@
-import { resource, tapState, withKey } from "@assistant-ui/tap";
+import { useState } from "react";
+import { resource, withKey } from "@assistant-ui/tap";
 import type { ClientOutput } from "@assistant-ui/store";
-import { tapClientLookup } from "@assistant-ui/store";
+import { useClientLookup } from "@assistant-ui/store";
 import type { SuggestionsState } from "../scopes/suggestions";
 import type { SuggestionState } from "../scopes/suggestion";
 
@@ -8,53 +9,53 @@ export type SuggestionConfig =
   | string
   | { title: string; label: string; prompt: string };
 
-const SuggestionClient = resource(
-  (state: SuggestionState): ClientOutput<"suggestion"> => {
-    return {
-      getState: () => state,
-    };
-  },
-);
+const SuggestionClient = resource(function SuggestionClient(
+  state: SuggestionState,
+): ClientOutput<"suggestion"> {
+  return {
+    getState: () => state,
+  };
+});
 
-const SuggestionsResource = resource(
-  (suggestions?: SuggestionConfig[]): ClientOutput<"suggestions"> => {
-    const [state] = tapState<SuggestionsState>(() => {
-      const normalizedSuggestions = (suggestions ?? []).map((s) => {
-        if (typeof s === "string") {
-          return {
-            title: s,
-            label: "",
-            prompt: s,
-          };
-        }
+const SuggestionsResource = resource(function SuggestionsResource(
+  suggestions?: SuggestionConfig[],
+): ClientOutput<"suggestions"> {
+  const [state] = useState<SuggestionsState>(() => {
+    const normalizedSuggestions = (suggestions ?? []).map((s) => {
+      if (typeof s === "string") {
         return {
-          title: s.title,
-          label: s.label,
-          prompt: s.prompt,
+          title: s,
+          label: "",
+          prompt: s,
         };
-      });
-
+      }
       return {
-        suggestions: normalizedSuggestions,
+        title: s.title,
+        label: s.label,
+        prompt: s.prompt,
       };
     });
 
-    const suggestionClients = tapClientLookup(
-      () =>
-        state.suggestions.map((suggestion, index) =>
-          withKey(index, SuggestionClient(suggestion)),
-        ),
-      [state.suggestions],
-    );
-
     return {
-      getState: () => state,
-      suggestion: ({ index }: { index: number }) => {
-        return suggestionClients.get({ index });
-      },
+      suggestions: normalizedSuggestions,
     };
-  },
-);
+  });
+
+  const suggestionClients = useClientLookup(
+    () =>
+      state.suggestions.map((suggestion, index) =>
+        withKey(index, SuggestionClient(suggestion)),
+      ),
+    [state.suggestions],
+  );
+
+  return {
+    getState: () => state,
+    suggestion: ({ index }: { index: number }) => {
+      return suggestionClients.get({ index });
+    },
+  };
+});
 
 export const Suggestions: {
   (): import("@assistant-ui/tap").ResourceElement<

package/src/store/clients/thread-message-client.ts

@@ -4,49 +4,46 @@ import type {
   ThreadMessage,
 } from "../../types/message";
 import type { Attachment } from "../../types/attachment";
-import {
-  resource,
-  tapMemo,
-  tapState,
-  tapResource,
-  withKey,
-} from "@assistant-ui/tap";
+import { useMemo, useState } from "react";
+import { useResource, resource, withKey } from "@assistant-ui/tap";
 import type { ClientOutput } from "@assistant-ui/store";
-import { tapClientLookup } from "@assistant-ui/store";
+import { useClientLookup } from "@assistant-ui/store";
 import type { MessageState } from "../scopes/message";
 import type { PartState } from "../scopes/part";
 import { NoOpComposerClient } from "./no-op-composer-client";
 
-const ThreadMessagePartClient = resource(
-  ({
-    part,
-  }: {
-    part: ThreadAssistantMessagePart | ThreadUserMessagePart;
-  }): ClientOutput<"part"> => {
-    const state = tapMemo<PartState>(() => {
-      return {
-        ...part,
-        status: { type: "complete" },
-      };
-    }, [part]);
-
+const ThreadMessagePartClient = resource(function ThreadMessagePartClient({
+  part,
+}: {
+  part: ThreadAssistantMessagePart | ThreadUserMessagePart;
+}): ClientOutput<"part"> {
+  const state = useMemo<PartState>(() => {
     return {
-      getState: () => state,
-      addToolResult: () => {
-        throw new Error("Not supported");
-      },
-      resumeToolCall: () => {
-        throw new Error("Not supported");
-      },
-      respondToToolApproval: () => {
-        throw new Error("Not supported");
-      },
+      ...part,
+      status: { type: "complete" },
     };
-  },
-);
+  }, [part]);
+
+  return {
+    getState: () => state,
+    addToolResult: () => {
+      throw new Error("Not supported");
+    },
+    resumeToolCall: () => {
+      throw new Error("Not supported");
+    },
+    respondToToolApproval: () => {
+      throw new Error("Not supported");
+    },
+  };
+});
 
 const ThreadMessageAttachmentClient = resource(
-  ({ attachment }: { attachment: Attachment }): ClientOutput<"attachment"> => {
+  function ThreadMessageAttachmentClient({
+    attachment,
+  }: {
+    attachment: Attachment;
+  }): ClientOutput<"attachment"> {
     return {
       getState: () => attachment,
       remove: () => {
@@ -63,111 +60,109 @@ export type ThreadMessageClientProps = {
   branchCount?: number;
 };
 
-export const ThreadMessageClient = resource(
-  ({
-    message,
-    index,
-    isLast = true,
-    branchNumber = 1,
-    branchCount = 1,
-  }: ThreadMessageClientProps): ClientOutput<"message"> => {
-    const [isCopiedState, setIsCopied] = tapState(false);
-    const [isHoveringState, setIsHovering] = tapState(false);
+export const ThreadMessageClient = resource(function ThreadMessageClient({
+  message,
+  index,
+  isLast = true,
+  branchNumber = 1,
+  branchCount = 1,
+}: ThreadMessageClientProps): ClientOutput<"message"> {
+  const [isCopiedState, setIsCopied] = useState(false);
+  const [isHoveringState, setIsHovering] = useState(false);
 
-    const parts = tapClientLookup(
-      () =>
-        message.content.map((part, idx) =>
-          withKey(
-            "toolCallId" in part && part.toolCallId != null
-              ? `toolCallId-${part.toolCallId}`
-              : `index-${idx}`,
-            ThreadMessagePartClient({ part }),
-          ),
+  const parts = useClientLookup(
+    () =>
+      message.content.map((part, idx) =>
+        withKey(
+          "toolCallId" in part && part.toolCallId != null
+            ? `toolCallId-${part.toolCallId}`
+            : `index-${idx}`,
+          ThreadMessagePartClient({ part }),
         ),
-      [message.content],
-    );
+      ),
+    [message.content],
+  );
 
-    const attachments = tapClientLookup(
-      () =>
-        (message.attachments ?? []).map((attachment) =>
-          withKey(attachment.id, ThreadMessageAttachmentClient({ attachment })),
-        ),
-      [message.attachments],
-    );
+  const attachments = useClientLookup(
+    () =>
+      (message.attachments ?? []).map((attachment) =>
+        withKey(attachment.id, ThreadMessageAttachmentClient({ attachment })),
+      ),
+    [message.attachments],
+  );
 
-    const composer = tapResource(NoOpComposerClient({ type: "edit" }));
-    const composerState = composer.getState();
+  const composer = useResource(NoOpComposerClient({ type: "edit" }));
+  const composerState = composer.getState();
 
-    const state = tapMemo<MessageState>(() => {
-      return {
-        ...message,
-        parts: parts.state,
-        composer: composerState,
-        parentId: null,
-        index,
-        isLast,
-        branchNumber,
-        branchCount,
-        speech: undefined,
-        isCopied: isCopiedState,
-        isHovering: isHoveringState,
-      };
-    }, [
-      message,
+  const state = useMemo<MessageState>(() => {
+    return {
+      ...message,
+      parts: parts.state,
+      composer: composerState,
+      parentId: null,
       index,
-      isCopiedState,
-      isHoveringState,
       isLast,
-      parts.state,
-      composerState,
       branchNumber,
       branchCount,
-    ]);
-
-    return {
-      getState: () => state,
-      composer: () => composer,
-      part: (selector) => {
-        if ("index" in selector) {
-          return parts.get({ index: selector.index });
-        } else {
-          return parts.get({ key: `toolCallId-${selector.toolCallId}` });
-        }
-      },
-      attachment: (selector) => {
-        if ("id" in selector) {
-          return attachments.get({ key: selector.id });
-        } else {
-          return attachments.get(selector);
-        }
-      },
-      reload: () => {
-        throw new Error("Not supported in ThreadMessageProvider");
-      },
-      speak: () => {
-        throw new Error("Not supported in ThreadMessageProvider");
-      },
-      stopSpeaking: () => {
-        throw new Error("Not supported in ThreadMessageProvider");
-      },
-      submitFeedback: () => {
-        throw new Error("Not supported in ThreadMessageProvider");
-      },
-      switchToBranch: () => {
-        throw new Error("Not supported in ThreadMessageProvider");
-      },
-      getCopyText: () => {
-        return message.content
-          .map((part) => {
-            if ("text" in part && typeof part.text === "string") {
-              return part.text;
-            }
-            return "";
-          })
-          .join("\n");
-      },
-      setIsCopied,
-      setIsHovering,
+      speech: undefined,
+      isCopied: isCopiedState,
+      isHovering: isHoveringState,
     };
-  },
-);
+  }, [
+    message,
+    index,
+    isCopiedState,
+    isHoveringState,
+    isLast,
+    parts.state,
+    composerState,
+    branchNumber,
+    branchCount,
+  ]);
+
+  return {
+    getState: () => state,
+    composer: () => composer,
+    part: (selector) => {
+      if ("index" in selector) {
+        return parts.get({ index: selector.index });
+      } else {
+        return parts.get({ key: `toolCallId-${selector.toolCallId}` });
+      }
+    },
+    attachment: (selector) => {
+      if ("id" in selector) {
+        return attachments.get({ key: selector.id });
+      } else {
+        return attachments.get(selector);
+      }
+    },
+    reload: () => {
+      throw new Error("Not supported in ThreadMessageProvider");
+    },
+    speak: () => {
+      throw new Error("Not supported in ThreadMessageProvider");
+    },
+    stopSpeaking: () => {
+      throw new Error("Not supported in ThreadMessageProvider");
+    },
+    submitFeedback: () => {
+      throw new Error("Not supported in ThreadMessageProvider");
+    },
+    switchToBranch: () => {
+      throw new Error("Not supported in ThreadMessageProvider");
+    },
+    getCopyText: () => {
+      return message.content
+        .map((part) => {
+          if ("text" in part && typeof part.text === "string") {
+            return part.text;
+          }
+          return "";
+        })
+        .join("\n");
+    },
+    setIsCopied,
+    setIsHovering,
+  };
+});

package/src/store/runtime-clients/attachment-runtime-client.ts

@@ -1,11 +1,15 @@
 import { resource } from "@assistant-ui/tap";
 import type { ClientOutput } from "@assistant-ui/store";
 import type { AttachmentRuntime } from "../../runtime/api/attachment-runtime";
-import { tapSubscribable } from "./tap-subscribable";
+import { useSubscribable } from "./useSubscribable";
 
 export const AttachmentRuntimeClient = resource(
-  ({ runtime }: { runtime: AttachmentRuntime }): ClientOutput<"attachment"> => {
-    const state = tapSubscribable(runtime);
+  function AttachmentRuntimeClient({
+    runtime,
+  }: {
+    runtime: AttachmentRuntime;
+  }): ClientOutput<"attachment"> {
+    const state = useSubscribable(runtime);
 
     return {
       getState: () => state,