chore: add changeset (#760)

.changeset/gorgeous-bears-count.md

@@ -0,0 +1,5 @@
+---
+"@assistant-ui/react": patch
+---
+
+perf: memoize tool Ul components

packages/react/src/primitives/message/MessageContent.tsx

@@ -164,16 +164,9 @@ export const MessagePrimitiveContent: FC<MessagePrimitiveContentProps> = ({
 
   const contentLength = useMessage((s) => s.message.content.length) || 1;
 
-  return new Array(contentLength).fill(null).map((_, idx) => {
-    const partIndex = idx; // use the index as key, as message is generally append only
-    return (
-      <MessageContentPart
-        key={partIndex}
-        partIndex={partIndex}
-        components={components}
-      />
-    );
-  });
+  return Array.from({ length: contentLength }, (_, index) => (
+    <MessageContentPart key={index} partIndex={index} components={components} />
+  ));
 };
 
 MessagePrimitiveContent.displayName = "MessagePrimitive.Content";

packages/react/src/primitives/thread/ThreadMessages.tsx

@@ -92,16 +92,9 @@ export const ThreadPrimitiveMessagesImpl: FC<ThreadPrimitiveMessagesProps> = ({
   const messagesLength = useThreadMessages((t) => t.length);
   if (messagesLength === 0) return null;
 
-  return new Array(messagesLength).fill(null).map((_, idx) => {
-    const messageIndex = idx; // keep the same key when switching branches for better a11y support
-    return (
-      <ThreadMessage
-        key={messageIndex}
-        messageIndex={messageIndex}
-        components={components}
-      />
-    );
-  });
+  return Array.from({ length: messagesLength }, (_, index) => (
+    <ThreadMessage key={index} messageIndex={index} components={components} />
+  ));
 };
 
 ThreadPrimitiveMessagesImpl.displayName = "ThreadPrimitive.Messages";