@liveblocks/react-ui 2.25.0-aiprivatebeta8 → 2.25.0-aiprivatebeta9

package/dist/components/internal/AiChatAssistantMessage.js

@@ -1,20 +1,13 @@
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import { kInternal } from '@liveblocks/core';
-import { useClient } from '@liveblocks/react';
-import { useSignal } from '@liveblocks/react/_private';
-import { Lexer } from 'marked';
-import { memo, forwardRef, useMemo, useState, useRef, useEffect, useCallback } from 'react';
-import '../../_private/index.js';
-import { useComponents } from '../../components.js';
-import { CheckIcon } from '../../icons/Check.js';
+import { memo, forwardRef, useState } from 'react';
+import { ComponentsProvider } from '../../components.js';
 import { ChevronRightIcon } from '../../icons/ChevronRight.js';
-import { CopyIcon } from '../../icons/Copy.js';
 import { WarningIcon } from '../../icons/Warning.js';
 import { useOverrides } from '../../overrides.js';
-import { Root, Trigger, Content } from '../../primitives/internal/Collapsible/index.js';
-import { BlockTokenComp } from '../../primitives/internal/Markdown.js';
+import { Content as AiMessageContent } from '../../primitives/AiMessage/index.js';
+import { Root as CollapsibleRoot, Trigger as CollapsibleTrigger, Content as CollapsibleContent } from '../../primitives/Collapsible/index.js';
 import { classNames } from '../../utils/class-names.js';
-import { Button } from './Button.js';
+import { Prose } from './Prose.js';
 
 const AiChatAssistantMessage = memo(
   forwardRef(
@@ -34,35 +27,23 @@ const AiChatAssistantMessage = memo(
           });
         } else {
           children = /* @__PURE__ */ jsx(AssistantMessageContent, {
-            content: message.contentSoFar,
-            chatId: message.chatId,
-            messageId: message.id,
-            components
+            message
           });
         }
       } else if (message.status === "completed") {
         children = /* @__PURE__ */ jsx(AssistantMessageContent, {
-          content: message.content,
-          chatId: message.chatId,
-          messageId: message.id,
-          components
+          message
         });
       } else if (message.status === "failed") {
         if (message.errorReason === "Aborted by user") {
           children = /* @__PURE__ */ jsx(AssistantMessageContent, {
-            content: message.contentSoFar,
-            chatId: message.chatId,
-            messageId: message.id,
-            components
+            message
           });
         } else {
           children = /* @__PURE__ */ jsxs(Fragment, {
             children: [
               /* @__PURE__ */ jsx(AssistantMessageContent, {
-                content: message.contentSoFar,
-                chatId: message.chatId,
-                messageId: message.id,
-                components
+                message
               }),
               /* @__PURE__ */ jsxs("div", {
                 className: "lb-ai-chat-message-error",
@@ -85,206 +66,69 @@ const AiChatAssistantMessage = memo(
         ),
         ...props,
         ref: forwardedRef,
-        children
+        children: /* @__PURE__ */ jsx(ComponentsProvider, {
+          components,
+          children
+        })
       });
     }
   )
 );
-function AssistantMessageContent({
-  content,
-  chatId,
-  messageId,
-  components
-}) {
-  const isReasoning = content.some((part) => part.type === "reasoning") && content.every((part) => part.type === "reasoning");
-  return /* @__PURE__ */ jsx("div", {
-    className: "lb-ai-chat-message-content",
-    children: content.map((part, index) => {
-      switch (part.type) {
-        case "text": {
-          return /* @__PURE__ */ jsx(TextPart, {
-            text: part.text,
-            components,
-            className: "lb-ai-chat-message-text"
-          }, index);
-        }
-        case "tool-invocation": {
-          return /* @__PURE__ */ jsx(ToolInvocationPart, {
-            chatId,
-            messageId,
-            part
-          }, index);
-        }
-        case "reasoning": {
-          return /* @__PURE__ */ jsx(ReasoningPart, {
-            text: part.text,
-            isPending: isReasoning,
-            components
-          }, index);
-        }
-        default: {
-          return null;
-        }
-      }
-    })
-  });
-}
-const TextPart = forwardRef(
-  ({ text, components, ...props }, forwardedRef) => {
-    const tokens = useMemo(() => {
-      return new Lexer().lex(text);
-    }, [text]);
-    return /* @__PURE__ */ jsx("div", {
-      ref: forwardedRef,
-      ...props,
-      children: tokens.map((token, index) => {
-        return /* @__PURE__ */ jsx(MemoizedBlockTokenComp, {
-          token,
-          components
-        }, index);
-      })
-    });
-  }
-);
-function CodeBlock({
-  language,
-  code
-}) {
-  const [isCopied, setCopied] = useState(false);
-  const timeoutRef = useRef(null);
-  useEffect(() => {
-    if (isCopied) {
-      timeoutRef.current = setTimeout(() => {
-        setCopied(false);
-      }, 1e3);
-    }
-    return () => {
-      if (timeoutRef.current) {
-        clearTimeout(timeoutRef.current);
-      }
-    };
-  }, [isCopied]);
-  return /* @__PURE__ */ jsxs("div", {
-    className: "lb-code-block",
-    children: [
-      /* @__PURE__ */ jsxs("div", {
-        className: "lb-code-block-header",
-        children: [
-          /* @__PURE__ */ jsx("span", {
-            className: "lb-code-block-title",
-            children: language ?? "Plain text"
-          }),
-          /* @__PURE__ */ jsx("div", {
-            className: "lb-code-block-header-actions",
-            children: /* @__PURE__ */ jsx(Button, {
-              className: "lb-code-block-header-action",
-              icon: isCopied ? /* @__PURE__ */ jsx(CheckIcon, {}) : /* @__PURE__ */ jsx(CopyIcon, {}),
-              onClick: () => {
-                setCopied(true);
-                navigator.clipboard.writeText(code);
-              }
-            })
-          })
-        ]
-      }),
-      /* @__PURE__ */ jsx("pre", {
-        className: "lb-code-block-content",
-        children: /* @__PURE__ */ jsx("code", {
-          children: code
-        })
-      })
-    ]
+function AssistantMessageContent({ message }) {
+  return /* @__PURE__ */ jsx(AiMessageContent, {
+    message,
+    components: {
+      TextPart,
+      ReasoningPart,
+      ToolInvocationPart
+    },
+    className: "lb-ai-chat-message-content"
   });
 }
-const MemoizedBlockTokenComp = memo(
-  function BlockTokenComp$1({
-    token,
-    components
-  }) {
-    const { Anchor } = useComponents(components);
-    return /* @__PURE__ */ jsx(BlockTokenComp, {
-      token,
-      components: { CodeBlock, Anchor }
-    });
-  },
-  (prevProps, nextProps) => {
-    const prevToken = prevProps.token;
-    const nextToken = nextProps.token;
-    if (prevToken.raw.length !== nextToken.raw.length) {
-      return false;
-    }
-    if (prevToken.type !== nextToken.type) {
-      return false;
-    }
-    return prevToken.raw === nextToken.raw;
-  }
-);
-function noop() {
-}
-function ToolInvocationPart({
-  chatId,
-  messageId,
-  part
-}) {
-  const client = useClient();
-  const ai = client[kInternal].ai;
-  const tool = useSignal(ai.signals.getToolDefinition\u03A3(chatId, part.toolName));
-  const respond = useCallback(
-    (result) => {
-      ai.setToolResult(
-        chatId,
-        messageId,
-        part.toolCallId,
-        result
-      );
-    },
-    [ai, chatId, messageId, part.toolCallId]
-  );
-  if (tool === void 0 || tool.render === void 0)
-    return null;
-  const { type: _, ...rest } = part;
-  return /* @__PURE__ */ jsx("div", {
-    className: "lb-ai-chat-message-tool",
-    children: /* @__PURE__ */ jsx(tool.render, {
-      ...rest,
-      respond: part.status === "executing" ? respond : noop
-    })
+function TextPart({ part }) {
+  return /* @__PURE__ */ jsx(Prose, {
+    content: part.text,
+    className: "lb-ai-chat-message-text"
   });
 }
 function ReasoningPart({
-  text,
-  isPending,
-  components
+  part,
+  isStreaming
 }) {
   const [isOpen, setIsOpen] = useState(false);
-  return /* @__PURE__ */ jsxs(Root, {
-    className: "lb-ai-chat-message-collapsible lb-ai-chat-message-reasoning",
+  return /* @__PURE__ */ jsxs(CollapsibleRoot, {
+    className: "lb-collapsible lb-ai-chat-message-reasoning",
     open: isOpen,
     onOpenChange: setIsOpen,
     children: [
-      /* @__PURE__ */ jsxs(Trigger, {
+      /* @__PURE__ */ jsxs(CollapsibleTrigger, {
         className: classNames(
-          "lb-ai-chat-message-collapsible-trigger",
-          isPending && "lb-ai-chat-pending"
+          "lb-collapsible-trigger",
+          isStreaming && "lb-ai-chat-pending"
         ),
         children: [
           "Reasoning",
           /* @__PURE__ */ jsx("span", {
-            className: "lb-ai-chat-message-collapsible-chevron lb-icon-container",
+            className: "lb-collapsible-chevron lb-icon-container",
             children: /* @__PURE__ */ jsx(ChevronRightIcon, {})
           })
         ]
       }),
-      /* @__PURE__ */ jsx(Content, {
-        className: "lb-ai-chat-message-collapsible-content",
-        children: /* @__PURE__ */ jsx(TextPart, {
-          text,
-          components
+      /* @__PURE__ */ jsx(CollapsibleContent, {
+        className: "lb-collapsible-content",
+        children: /* @__PURE__ */ jsx(Prose, {
+          content: part.text
         })
       })
     ]
   });
 }
+function ToolInvocationPart({ children }) {
+  return /* @__PURE__ */ jsx("div", {
+    className: "lb-ai-chat-message-tool-invocation",
+    children
+  });
+}
 
 export { AiChatAssistantMessage };
 //# sourceMappingURL=AiChatAssistantMessage.js.map

package/dist/components/internal/AiChatAssistantMessage.js.map

@@ -1 +1 @@
-{"version":3,"file":"AiChatAssistantMessage.js","sources":["../../../src/components/internal/AiChatAssistantMessage.tsx"],"sourcesContent":["import type {\n  AiAssistantContentPart,\n  AiToolInvocationPart,\n  Json,\n  MessageId,\n  UiAssistantMessage,\n} from \"@liveblocks/core\";\nimport { kInternal } from \"@liveblocks/core\";\nimport { useClient } from \"@liveblocks/react\";\nimport { useSignal } from \"@liveblocks/react/_private\";\nimport { Lexer } from \"marked\";\nimport {\n  type ComponentProps,\n  forwardRef,\n  memo,\n  type ReactNode,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\n\nimport { Button } from \"../../_private\";\nimport { type GlobalComponents, useComponents } from \"../../components\";\nimport { CheckIcon } from \"../../icons/Check\";\nimport { ChevronRightIcon } from \"../../icons/ChevronRight\";\nimport { CopyIcon } from \"../../icons/Copy\";\nimport { WarningIcon } from \"../../icons/Warning\";\nimport {\n  type AiChatMessageOverrides,\n  type GlobalOverrides,\n  useOverrides,\n} from \"../../overrides\";\nimport * as CollapsiblePrimitive from \"../../primitives/internal/Collapsible\";\nimport {\n  type BlockToken,\n  BlockTokenComp as BlockTokenCompPrimitive,\n  type MarkdownComponents,\n} from \"../../primitives/internal/Markdown\";\nimport { classNames } from \"../../utils/class-names\";\n\n/* -------------------------------------------------------------------------------------------------\n * AiChatAssistantMessage\n * -----------------------------------------------------------------------------------------------*/\nexport interface AiChatAssistantMessageProps extends ComponentProps<\"div\"> {\n  /**\n   * The message to display.\n   */\n  message: UiAssistantMessage;\n\n  /**\n   * Override the component's strings.\n   */\n  overrides?: Partial<GlobalOverrides & AiChatMessageOverrides>;\n\n  /**\n   * Override the component's components.\n   */\n  components?: Partial<GlobalComponents>;\n}\n\nexport const AiChatAssistantMessage = memo(\n  forwardRef<HTMLDivElement, AiChatAssistantMessageProps>(\n    ({ message, className, overrides, components, ...props }, forwardedRef) => {\n      const $ = useOverrides(overrides);\n\n      let children: ReactNode = null;\n\n      if (message.deletedAt !== undefined) {\n        children = (\n          <div className=\"lb-ai-chat-message-deleted\">\n            {$.AI_CHAT_MESSAGE_DELETED}\n          </div>\n        );\n      } else if (\n        message.status === \"generating\" ||\n        message.status === \"awaiting-tool\"\n      ) {\n        if (message.contentSoFar.length === 0) {\n          children = (\n            <div className=\"lb-ai-chat-message-thinking lb-ai-chat-pending\">\n              {$.AI_CHAT_MESSAGE_THINKING}\n            </div>\n          );\n        } else {\n          children = (\n            <AssistantMessageContent\n              content={message.contentSoFar}\n              chatId={message.chatId}\n              messageId={message.id}\n              components={components}\n            />\n          );\n        }\n      } else if (message.status === \"completed\") {\n        children = (\n          <AssistantMessageContent\n            content={message.content}\n            chatId={message.chatId}\n            messageId={message.id}\n            components={components}\n          />\n        );\n      } else if (message.status === \"failed\") {\n        // Do not include the error message if the user aborted the request.\n        if (message.errorReason === \"Aborted by user\") {\n          children = (\n            <AssistantMessageContent\n              content={message.contentSoFar}\n              chatId={message.chatId}\n              messageId={message.id}\n              components={components}\n            />\n          );\n        } else {\n          children = (\n            <>\n              <AssistantMessageContent\n                content={message.contentSoFar}\n                chatId={message.chatId}\n                messageId={message.id}\n                components={components}\n              />\n\n              <div className=\"lb-ai-chat-message-error\">\n                <span className=\"lb-icon-container\">\n                  <WarningIcon />\n                </span>\n                {message.errorReason}\n              </div>\n            </>\n          );\n        }\n      }\n\n      return (\n        <div\n          className={classNames(\n            \"lb-ai-chat-message lb-ai-chat-assistant-message\",\n            className\n          )}\n          {...props}\n          ref={forwardedRef}\n        >\n          {children}\n        </div>\n      );\n    }\n  )\n);\n\nfunction AssistantMessageContent({\n  content,\n  chatId,\n  messageId,\n  components,\n}: {\n  content: AiAssistantContentPart[];\n  chatId: string;\n  messageId: MessageId;\n  components: Partial<GlobalComponents> | undefined;\n}) {\n  // A message is considered to be in \"reasoning\" state if it only contains reasoning parts and no other parts.\n  const isReasoning =\n    content.some((part) => part.type === \"reasoning\") &&\n    content.every((part) => part.type === \"reasoning\");\n\n  return (\n    <div className=\"lb-ai-chat-message-content\">\n      {content.map((part, index) => {\n        switch (part.type) {\n          case \"text\": {\n            return (\n              <TextPart\n                key={index}\n                text={part.text}\n                components={components}\n                className=\"lb-ai-chat-message-text\"\n              />\n            );\n          }\n          case \"tool-invocation\": {\n            return (\n              <ToolInvocationPart\n                key={index}\n                chatId={chatId}\n                messageId={messageId}\n                part={part}\n              />\n            );\n          }\n          case \"reasoning\": {\n            return (\n              <ReasoningPart\n                key={index}\n                text={part.text}\n                isPending={isReasoning}\n                components={components}\n              />\n            );\n          }\n          default: {\n            return null;\n          }\n        }\n      })}\n    </div>\n  );\n}\n\n/* -------------------------------------------------------------------------------------------------\n * TextPart\n * -----------------------------------------------------------------------------------------------*/\ninterface TextPartProps extends ComponentProps<\"div\"> {\n  text: string;\n  components: Partial<GlobalComponents> | undefined;\n}\n\nconst TextPart = forwardRef<HTMLDivElement, TextPartProps>(\n  ({ text, components, ...props }, forwardedRef) => {\n    const tokens = useMemo(() => {\n      return new Lexer().lex(text);\n    }, [text]);\n\n    return (\n      <div ref={forwardedRef} {...props}>\n        {tokens.map((token, index) => {\n          return (\n            <MemoizedBlockTokenComp\n              token={token as BlockToken}\n              key={index}\n              components={components}\n            />\n          );\n        })}\n      </div>\n    );\n  }\n);\n\n// TODO: Improve (better copy handling, tooltips, etc)\nfunction CodeBlock({\n  language,\n  code,\n}: ComponentProps<MarkdownComponents[\"CodeBlock\"]>) {\n  const [isCopied, setCopied] = useState(false);\n  const timeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n  useEffect(() => {\n    if (isCopied) {\n      timeoutRef.current = setTimeout(() => {\n        setCopied(false);\n      }, 1000);\n    }\n\n    return () => {\n      if (timeoutRef.current) {\n        clearTimeout(timeoutRef.current);\n      }\n    };\n  }, [isCopied]);\n\n  return (\n    <div className=\"lb-code-block\">\n      <div className=\"lb-code-block-header\">\n        <span className=\"lb-code-block-title\">{language ?? \"Plain text\"}</span>\n        <div className=\"lb-code-block-header-actions\">\n          <Button\n            className=\"lb-code-block-header-action\"\n            icon={isCopied ? <CheckIcon /> : <CopyIcon />}\n            onClick={() => {\n              setCopied(true);\n              navigator.clipboard.writeText(code);\n            }}\n          />\n        </div>\n      </div>\n      <pre className=\"lb-code-block-content\">\n        <code>{code}</code>\n      </pre>\n    </div>\n  );\n}\n\nconst MemoizedBlockTokenComp = memo(\n  function BlockTokenComp({\n    token,\n    components,\n  }: {\n    token: BlockToken;\n    components?: Partial<GlobalComponents>;\n  }) {\n    const { Anchor } = useComponents(components);\n\n    return (\n      <BlockTokenCompPrimitive\n        token={token}\n        components={{ CodeBlock, Anchor }}\n      />\n    );\n  },\n  (prevProps, nextProps) => {\n    const prevToken = prevProps.token;\n    const nextToken = nextProps.token;\n    if (prevToken.raw.length !== nextToken.raw.length) {\n      return false;\n    }\n    if (prevToken.type !== nextToken.type) {\n      return false;\n    }\n    return prevToken.raw === nextToken.raw;\n  }\n);\n\nfunction noop() {\n  // Do nothing\n}\n\n/* -------------------------------------------------------------------------------------------------\n * ToolInvocationPart\n * -----------------------------------------------------------------------------------------------*/\nfunction ToolInvocationPart({\n  chatId,\n  messageId,\n  part,\n}: {\n  chatId: string;\n  messageId: MessageId;\n  part: AiToolInvocationPart;\n}) {\n  const client = useClient();\n  const ai = client[kInternal].ai;\n  const tool = useSignal(ai.signals.getToolDefinitionΣ(chatId, part.toolName));\n  const respond = useCallback(\n    (result: Json) => {\n      ai.setToolResult(\n        chatId,\n        messageId,\n        part.toolCallId,\n        result\n        // TODO Pass in AiGenerationOptions here?\n      );\n    },\n    [ai, chatId, messageId, part.toolCallId]\n  );\n\n  if (tool === undefined || tool.render === undefined) return null;\n\n  const { type: _, ...rest } = part;\n  return (\n    <div className=\"lb-ai-chat-message-tool\">\n      <tool.render\n        {...rest}\n        respond={\n          // It only makes sense and is safe to call `respond()` in \"executing\" state.\n          part.status === \"executing\" ? respond : noop\n        }\n      />\n    </div>\n  );\n}\n\n/* -------------------------------------------------------------------------------------------------\n * ReasoningPart\n * -----------------------------------------------------------------------------------------------*/\nfunction ReasoningPart({\n  text,\n  isPending,\n  components,\n}: {\n  text: string;\n  isPending: boolean;\n  components: Partial<GlobalComponents> | undefined;\n}) {\n  const [isOpen, setIsOpen] = useState(false);\n  return (\n    <CollapsiblePrimitive.Root\n      className=\"lb-ai-chat-message-collapsible lb-ai-chat-message-reasoning\"\n      open={isOpen}\n      onOpenChange={setIsOpen}\n    >\n      <CollapsiblePrimitive.Trigger\n        className={classNames(\n          \"lb-ai-chat-message-collapsible-trigger\",\n          isPending && \"lb-ai-chat-pending\"\n        )}\n      >\n        {/* TODO: If `isPending` is true, show \"Reasoning…\"/\"Thinking…\", otherwise show \"Reasoned/thought for x seconds\"? */}\n        Reasoning\n        <span className=\"lb-ai-chat-message-collapsible-chevron lb-icon-container\">\n          <ChevronRightIcon />\n        </span>\n      </CollapsiblePrimitive.Trigger>\n\n      <CollapsiblePrimitive.Content className=\"lb-ai-chat-message-collapsible-content\">\n        <TextPart text={text} components={components} />\n      </CollapsiblePrimitive.Content>\n    </CollapsiblePrimitive.Root>\n  );\n}\n"],"names":["BlockTokenComp","BlockTokenCompPrimitive","CollapsiblePrimitive.Root","CollapsiblePrimitive.Trigger","CollapsiblePrimitive.Content"],"mappings":"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"}
+{"version":3,"file":"AiChatAssistantMessage.js","sources":["../../../src/components/internal/AiChatAssistantMessage.tsx"],"sourcesContent":["import type { UiAssistantMessage } from \"@liveblocks/core\";\nimport {\n  type ComponentProps,\n  forwardRef,\n  memo,\n  type PropsWithChildren,\n  type ReactNode,\n  useState,\n} from \"react\";\n\nimport { ComponentsProvider, type GlobalComponents } from \"../../components\";\nimport { ChevronRightIcon } from \"../../icons/ChevronRight\";\nimport { WarningIcon } from \"../../icons/Warning\";\nimport {\n  type AiChatMessageOverrides,\n  type GlobalOverrides,\n  useOverrides,\n} from \"../../overrides\";\nimport * as AiMessage from \"../../primitives/AiMessage\";\nimport type {\n  AiMessageContentReasoningPartProps,\n  AiMessageContentTextPartProps,\n} from \"../../primitives/AiMessage/types\";\nimport * as Collapsible from \"../../primitives/Collapsible\";\nimport { classNames } from \"../../utils/class-names\";\nimport { Prose } from \"./Prose\";\n\n/* -------------------------------------------------------------------------------------------------\n * AiChatAssistantMessage\n * -----------------------------------------------------------------------------------------------*/\nexport interface AiChatAssistantMessageProps extends ComponentProps<\"div\"> {\n  /**\n   * The message to display.\n   */\n  message: UiAssistantMessage;\n\n  /**\n   * Override the component's strings.\n   */\n  overrides?: Partial<GlobalOverrides & AiChatMessageOverrides>;\n\n  /**\n   * Override the component's components.\n   */\n  components?: Partial<GlobalComponents>;\n}\n\nexport const AiChatAssistantMessage = memo(\n  forwardRef<HTMLDivElement, AiChatAssistantMessageProps>(\n    ({ message, className, overrides, components, ...props }, forwardedRef) => {\n      const $ = useOverrides(overrides);\n\n      let children: ReactNode = null;\n\n      if (message.deletedAt !== undefined) {\n        children = (\n          <div className=\"lb-ai-chat-message-deleted\">\n            {$.AI_CHAT_MESSAGE_DELETED}\n          </div>\n        );\n      } else if (\n        message.status === \"generating\" ||\n        message.status === \"awaiting-tool\"\n      ) {\n        if (message.contentSoFar.length === 0) {\n          children = (\n            <div className=\"lb-ai-chat-message-thinking lb-ai-chat-pending\">\n              {$.AI_CHAT_MESSAGE_THINKING}\n            </div>\n          );\n        } else {\n          children = <AssistantMessageContent message={message} />;\n        }\n      } else if (message.status === \"completed\") {\n        children = <AssistantMessageContent message={message} />;\n      } else if (message.status === \"failed\") {\n        // Do not include the error message if the user aborted the request.\n        if (message.errorReason === \"Aborted by user\") {\n          children = <AssistantMessageContent message={message} />;\n        } else {\n          children = (\n            <>\n              <AssistantMessageContent message={message} />\n\n              <div className=\"lb-ai-chat-message-error\">\n                <span className=\"lb-icon-container\">\n                  <WarningIcon />\n                </span>\n                {message.errorReason}\n              </div>\n            </>\n          );\n        }\n      }\n\n      return (\n        <div\n          className={classNames(\n            \"lb-ai-chat-message lb-ai-chat-assistant-message\",\n            className\n          )}\n          {...props}\n          ref={forwardedRef}\n        >\n          <ComponentsProvider components={components}>\n            {children}\n          </ComponentsProvider>\n        </div>\n      );\n    }\n  )\n);\n\nfunction AssistantMessageContent({ message }: { message: UiAssistantMessage }) {\n  return (\n    <AiMessage.Content\n      message={message}\n      components={{\n        TextPart,\n        ReasoningPart,\n        ToolInvocationPart,\n      }}\n      className=\"lb-ai-chat-message-content\"\n    />\n  );\n}\n\n/* -------------------------------------------------------------------------------------------------\n * TextPart\n * -----------------------------------------------------------------------------------------------*/\nfunction TextPart({ part }: AiMessageContentTextPartProps) {\n  return <Prose content={part.text} className=\"lb-ai-chat-message-text\" />;\n}\n\n/* -------------------------------------------------------------------------------------------------\n * ReasoningPart\n * -----------------------------------------------------------------------------------------------*/\nfunction ReasoningPart({\n  part,\n  isStreaming,\n}: AiMessageContentReasoningPartProps) {\n  const [isOpen, setIsOpen] = useState(false);\n  return (\n    <Collapsible.Root\n      className=\"lb-collapsible lb-ai-chat-message-reasoning\"\n      open={isOpen}\n      onOpenChange={setIsOpen}\n    >\n      <Collapsible.Trigger\n        className={classNames(\n          \"lb-collapsible-trigger\",\n          isStreaming && \"lb-ai-chat-pending\"\n        )}\n      >\n        {/* TODO: If `isStreaming` is true, show \"Reasoning…\"/\"Thinking…\", otherwise show \"Reasoned/thought for x seconds\"? */}\n        Reasoning\n        <span className=\"lb-collapsible-chevron lb-icon-container\">\n          <ChevronRightIcon />\n        </span>\n      </Collapsible.Trigger>\n\n      <Collapsible.Content className=\"lb-collapsible-content\">\n        <Prose content={part.text} />\n      </Collapsible.Content>\n    </Collapsible.Root>\n  );\n}\n\n/* -------------------------------------------------------------------------------------------------\n * ToolInvocationPart\n * -----------------------------------------------------------------------------------------------*/\nfunction ToolInvocationPart({ children }: PropsWithChildren) {\n  return <div className=\"lb-ai-chat-message-tool-invocation\">{children}</div>;\n}\n"],"names":["AiMessage.Content","Collapsible.Root","Collapsible.Trigger","Collapsible.Content"],"mappings":"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"}

package/dist/components/internal/AiChatComposer.cjs

@@ -94,7 +94,7 @@ const AiChatComposer = react.forwardRef(
     return /* @__PURE__ */ jsxRuntime.jsx(TooltipPrimitive.TooltipProvider, {
       children: /* @__PURE__ */ jsxRuntime.jsx(index.AiChatComposerForm, {
         className: classNames.classNames(
-          "lb-ai-chat-composer lb-ai-chat-composer-form",
+          "lb-root lb-ai-chat-composer lb-ai-chat-composer-form",
           className
         ),
         dir: $.dir,

package/dist/components/internal/AiChatComposer.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"AiChatComposer.cjs","sources":["../../../src/components/internal/AiChatComposer.tsx"],"sourcesContent":["import type { CopilotId, MessageId, UiChatMessage } from \"@liveblocks/core\";\nimport { kInternal } from \"@liveblocks/core\";\nimport { useClient } from \"@liveblocks/react\";\nimport { useSignal } from \"@liveblocks/react/_private\";\nimport {\n  type ComponentProps,\n  type FormEvent,\n  forwardRef,\n  useCallback,\n} from \"react\";\n\nimport { SendIcon } from \"../../icons/Send\";\nimport { StopIcon } from \"../../icons/Stop\";\nimport {\n  type AiChatComposerOverrides,\n  type GlobalOverrides,\n  useOverrides,\n} from \"../../overrides\";\nimport * as ComposerPrimitive from \"../../primitives/AiChatComposer\";\nimport { classNames } from \"../../utils/class-names\";\nimport { Button } from \"./Button\";\nimport { ShortcutTooltip, TooltipProvider } from \"./Tooltip\";\n\n/* -------------------------------------------------------------------------------------------------\n * AiChatComposer\n * -----------------------------------------------------------------------------------------------*/\nexport interface AiChatComposerProps extends ComponentProps<\"form\"> {\n  /**\n   * The composer's initial value.\n   */\n  defaultValue?: string;\n  /**\n   * The event handler called when a chat message is submitted.\n   */\n  onComposerSubmit?: (\n    message: {\n      /**\n       * The submitted message text.\n       */\n      text: string;\n    },\n    event: FormEvent<HTMLFormElement>\n  ) => void;\n\n  /**\n   * @internal\n   * The event handler called when a user chat message is created optimistically.\n   */\n  onUserMessageCreate?: (message: {\n    /**\n     * The created user message id.\n     */\n    id: MessageId;\n  }) => void;\n  /**\n   * Whether the composer is disabled.\n   */\n  disabled?: boolean;\n  /**\n   * Whether to focus the editor on mount.\n   */\n  autoFocus?: boolean;\n  /**\n   * Override the component's strings.\n   */\n  overrides?: Partial<GlobalOverrides & AiChatComposerOverrides>;\n  /**\n   * The id of the chat the composer belongs to.\n   */\n  chatId: string;\n  /**\n   * The id of the copilot to use to send the message.\n   */\n  copilotId?: CopilotId;\n  /**\n   * @internal\n   */\n  branchId?: MessageId;\n  /**\n   * @internal\n   */\n  stream?: boolean;\n}\n\nexport const AiChatComposer = forwardRef<HTMLFormElement, AiChatComposerProps>(\n  (\n    {\n      defaultValue,\n      onComposerSubmit,\n      disabled,\n      autoFocus,\n      overrides,\n      className,\n      chatId,\n      branchId,\n      copilotId,\n      stream = true,\n      onUserMessageCreate,\n      ...props\n    },\n    forwardedRef\n  ) => {\n    const $ = useOverrides(overrides);\n    const client = useClient();\n\n    const getLastMessageId = useCallback((messages: UiChatMessage[]) => {\n      const lastMessage = messages[messages.length - 1];\n      if (lastMessage === undefined) return null;\n      return lastMessage.id;\n    }, []);\n\n    const getAbortableMessageId = useCallback((messages: UiChatMessage[]) => {\n      return messages.find(\n        (m) =>\n          m.role === \"assistant\" &&\n          (m.status === \"generating\" || m.status === \"awaiting-tool\")\n      )?.id;\n    }, []);\n\n    const messagesΣ = client[kInternal].ai.signals.getChatMessagesForBranchΣ(\n      chatId,\n      branchId\n    );\n\n    const abortableMessageId = useSignal(messagesΣ, getAbortableMessageId);\n    const lastMessageId = useSignal(messagesΣ, getLastMessageId);\n\n    const handleComposerSubmit = useCallback(\n      (message: { text: string }, event: FormEvent<HTMLFormElement>) => {\n        if (abortableMessageId !== undefined) {\n          event.preventDefault();\n          return;\n        }\n\n        onComposerSubmit?.(message, event);\n        if (event.isDefaultPrevented()) return;\n\n        const content = [{ type: \"text\" as const, text: message.text }];\n        const newMessageId = client[kInternal].ai[\n          kInternal\n        ].context.messagesStore.createOptimistically(\n          chatId,\n          \"user\",\n          lastMessageId,\n          content\n        );\n        onUserMessageCreate?.({ id: newMessageId });\n\n        const targetMessageId = client[kInternal].ai[\n          kInternal\n        ].context.messagesStore.createOptimistically(\n          chatId,\n          \"assistant\",\n          newMessageId\n        );\n\n        client[kInternal].ai.askUserMessageInChat(\n          chatId,\n          { id: newMessageId, parentMessageId: lastMessageId, content },\n          targetMessageId,\n          {\n            stream,\n            copilotId,\n          }\n        );\n      },\n      [\n        onComposerSubmit,\n        onUserMessageCreate,\n        client,\n        chatId,\n        lastMessageId,\n        abortableMessageId,\n        stream,\n        copilotId,\n      ]\n    );\n\n    return (\n      <TooltipProvider>\n        <ComposerPrimitive.Form\n          className={classNames(\n            \"lb-ai-chat-composer lb-ai-chat-composer-form\",\n            className\n          )}\n          dir={$.dir}\n          {...props}\n          disabled={disabled}\n          ref={forwardedRef}\n          onComposerSubmit={handleComposerSubmit}\n        >\n          <div className=\"lb-ai-chat-composer-editor-container\">\n            <ComposerPrimitive.Editor\n              autoFocus={autoFocus}\n              className=\"lb-ai-chat-composer-editor\"\n              placeholder={$.AI_CHAT_COMPOSER_PLACEHOLDER}\n              defaultValue={defaultValue}\n            />\n\n            <div className=\"lb-ai-chat-composer-footer\">\n              <div className=\"lb-ai-chat-composer-editor-actions\">\n                {/* No actions for now but it makes sense to keep the DOM structure */}\n              </div>\n\n              <div className=\"lb-ai-chat-composer-actions\">\n                {abortableMessageId === undefined ? (\n                  <ShortcutTooltip\n                    content={$.AI_CHAT_COMPOSER_SEND}\n                    shortcut=\"Enter\"\n                  >\n                    <ComposerPrimitive.Submit asChild>\n                      <Button\n                        onPointerDown={(event) => event.preventDefault()}\n                        onClick={(event) => event.stopPropagation()}\n                        className=\"lb-ai-chat-composer-action\"\n                        variant=\"primary\"\n                        aria-label={$.AI_CHAT_COMPOSER_SEND}\n                        icon={<SendIcon />}\n                      />\n                    </ComposerPrimitive.Submit>\n                  </ShortcutTooltip>\n                ) : (\n                  <ShortcutTooltip content={$.AI_CHAT_COMPOSER_ABORT}>\n                    <Button\n                      onPointerDown={(event) => event.preventDefault()}\n                      onClick={(event) => {\n                        event.stopPropagation();\n                        client[kInternal].ai.abort(abortableMessageId);\n                      }}\n                      className=\"lb-ai-chat-composer-action\"\n                      variant=\"secondary\"\n                      aria-label={$.AI_CHAT_COMPOSER_ABORT}\n                      icon={<StopIcon />}\n                    />\n                  </ShortcutTooltip>\n                )}\n              </div>\n            </div>\n          </div>\n        </ComposerPrimitive.Form>\n      </TooltipProvider>\n    );\n  }\n);\n"],"names":["forwardRef","overrides","useOverrides","useClient","useCallback","kInternal","useSignal","jsx","TooltipProvider","ComposerPrimitive.Form","classNames","jsxs","ComposerPrimitive.Editor","ShortcutTooltip","ComposerPrimitive.Submit","Button","SendIcon","StopIcon"],"mappings":"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"}
+{"version":3,"file":"AiChatComposer.cjs","sources":["../../../src/components/internal/AiChatComposer.tsx"],"sourcesContent":["import type { CopilotId, MessageId, UiChatMessage } from \"@liveblocks/core\";\nimport { kInternal } from \"@liveblocks/core\";\nimport { useClient } from \"@liveblocks/react\";\nimport { useSignal } from \"@liveblocks/react/_private\";\nimport {\n  type ComponentProps,\n  type FormEvent,\n  forwardRef,\n  useCallback,\n} from \"react\";\n\nimport { SendIcon } from \"../../icons/Send\";\nimport { StopIcon } from \"../../icons/Stop\";\nimport {\n  type AiChatComposerOverrides,\n  type GlobalOverrides,\n  useOverrides,\n} from \"../../overrides\";\nimport * as ComposerPrimitive from \"../../primitives/AiChatComposer\";\nimport { classNames } from \"../../utils/class-names\";\nimport { Button } from \"./Button\";\nimport { ShortcutTooltip, TooltipProvider } from \"./Tooltip\";\n\n/* -------------------------------------------------------------------------------------------------\n * AiChatComposer\n * -----------------------------------------------------------------------------------------------*/\nexport interface AiChatComposerProps extends ComponentProps<\"form\"> {\n  /**\n   * The composer's initial value.\n   */\n  defaultValue?: string;\n  /**\n   * The event handler called when a chat message is submitted.\n   */\n  onComposerSubmit?: (\n    message: {\n      /**\n       * The submitted message text.\n       */\n      text: string;\n    },\n    event: FormEvent<HTMLFormElement>\n  ) => void;\n\n  /**\n   * @internal\n   * The event handler called when a user chat message is created optimistically.\n   */\n  onUserMessageCreate?: (message: {\n    /**\n     * The created user message id.\n     */\n    id: MessageId;\n  }) => void;\n  /**\n   * Whether the composer is disabled.\n   */\n  disabled?: boolean;\n  /**\n   * Whether to focus the editor on mount.\n   */\n  autoFocus?: boolean;\n  /**\n   * Override the component's strings.\n   */\n  overrides?: Partial<GlobalOverrides & AiChatComposerOverrides>;\n  /**\n   * The id of the chat the composer belongs to.\n   */\n  chatId: string;\n  /**\n   * The id of the copilot to use to send the message.\n   */\n  copilotId?: CopilotId;\n  /**\n   * @internal\n   */\n  branchId?: MessageId;\n  /**\n   * @internal\n   */\n  stream?: boolean;\n}\n\nexport const AiChatComposer = forwardRef<HTMLFormElement, AiChatComposerProps>(\n  (\n    {\n      defaultValue,\n      onComposerSubmit,\n      disabled,\n      autoFocus,\n      overrides,\n      className,\n      chatId,\n      branchId,\n      copilotId,\n      stream = true,\n      onUserMessageCreate,\n      ...props\n    },\n    forwardedRef\n  ) => {\n    const $ = useOverrides(overrides);\n    const client = useClient();\n\n    const getLastMessageId = useCallback((messages: UiChatMessage[]) => {\n      const lastMessage = messages[messages.length - 1];\n      if (lastMessage === undefined) return null;\n      return lastMessage.id;\n    }, []);\n\n    const getAbortableMessageId = useCallback((messages: UiChatMessage[]) => {\n      return messages.find(\n        (m) =>\n          m.role === \"assistant\" &&\n          (m.status === \"generating\" || m.status === \"awaiting-tool\")\n      )?.id;\n    }, []);\n\n    const messagesΣ = client[kInternal].ai.signals.getChatMessagesForBranchΣ(\n      chatId,\n      branchId\n    );\n\n    const abortableMessageId = useSignal(messagesΣ, getAbortableMessageId);\n    const lastMessageId = useSignal(messagesΣ, getLastMessageId);\n\n    const handleComposerSubmit = useCallback(\n      (message: { text: string }, event: FormEvent<HTMLFormElement>) => {\n        if (abortableMessageId !== undefined) {\n          event.preventDefault();\n          return;\n        }\n\n        onComposerSubmit?.(message, event);\n        if (event.isDefaultPrevented()) return;\n\n        const content = [{ type: \"text\" as const, text: message.text }];\n        const newMessageId = client[kInternal].ai[\n          kInternal\n        ].context.messagesStore.createOptimistically(\n          chatId,\n          \"user\",\n          lastMessageId,\n          content\n        );\n        onUserMessageCreate?.({ id: newMessageId });\n\n        const targetMessageId = client[kInternal].ai[\n          kInternal\n        ].context.messagesStore.createOptimistically(\n          chatId,\n          \"assistant\",\n          newMessageId\n        );\n\n        client[kInternal].ai.askUserMessageInChat(\n          chatId,\n          { id: newMessageId, parentMessageId: lastMessageId, content },\n          targetMessageId,\n          {\n            stream,\n            copilotId,\n          }\n        );\n      },\n      [\n        onComposerSubmit,\n        onUserMessageCreate,\n        client,\n        chatId,\n        lastMessageId,\n        abortableMessageId,\n        stream,\n        copilotId,\n      ]\n    );\n\n    return (\n      <TooltipProvider>\n        <ComposerPrimitive.Form\n          className={classNames(\n            \"lb-root lb-ai-chat-composer lb-ai-chat-composer-form\",\n            className\n          )}\n          dir={$.dir}\n          {...props}\n          disabled={disabled}\n          ref={forwardedRef}\n          onComposerSubmit={handleComposerSubmit}\n        >\n          <div className=\"lb-ai-chat-composer-editor-container\">\n            <ComposerPrimitive.Editor\n              autoFocus={autoFocus}\n              className=\"lb-ai-chat-composer-editor\"\n              placeholder={$.AI_CHAT_COMPOSER_PLACEHOLDER}\n              defaultValue={defaultValue}\n            />\n\n            <div className=\"lb-ai-chat-composer-footer\">\n              <div className=\"lb-ai-chat-composer-editor-actions\">\n                {/* No actions for now but it makes sense to keep the DOM structure */}\n              </div>\n\n              <div className=\"lb-ai-chat-composer-actions\">\n                {abortableMessageId === undefined ? (\n                  <ShortcutTooltip\n                    content={$.AI_CHAT_COMPOSER_SEND}\n                    shortcut=\"Enter\"\n                  >\n                    <ComposerPrimitive.Submit asChild>\n                      <Button\n                        onPointerDown={(event) => event.preventDefault()}\n                        onClick={(event) => event.stopPropagation()}\n                        className=\"lb-ai-chat-composer-action\"\n                        variant=\"primary\"\n                        aria-label={$.AI_CHAT_COMPOSER_SEND}\n                        icon={<SendIcon />}\n                      />\n                    </ComposerPrimitive.Submit>\n                  </ShortcutTooltip>\n                ) : (\n                  <ShortcutTooltip content={$.AI_CHAT_COMPOSER_ABORT}>\n                    <Button\n                      onPointerDown={(event) => event.preventDefault()}\n                      onClick={(event) => {\n                        event.stopPropagation();\n                        client[kInternal].ai.abort(abortableMessageId);\n                      }}\n                      className=\"lb-ai-chat-composer-action\"\n                      variant=\"secondary\"\n                      aria-label={$.AI_CHAT_COMPOSER_ABORT}\n                      icon={<StopIcon />}\n                    />\n                  </ShortcutTooltip>\n                )}\n              </div>\n            </div>\n          </div>\n        </ComposerPrimitive.Form>\n      </TooltipProvider>\n    );\n  }\n);\n"],"names":["forwardRef","overrides","useOverrides","useClient","useCallback","kInternal","useSignal","jsx","TooltipProvider","ComposerPrimitive.Form","classNames","jsxs","ComposerPrimitive.Editor","ShortcutTooltip","ComposerPrimitive.Submit","Button","SendIcon","StopIcon"],"mappings":"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"}

package/dist/components/internal/AiChatComposer.js

@@ -92,7 +92,7 @@ const AiChatComposer = forwardRef(
     return /* @__PURE__ */ jsx(TooltipProvider, {
       children: /* @__PURE__ */ jsx(AiChatComposerForm, {
         className: classNames(
-          "lb-ai-chat-composer lb-ai-chat-composer-form",
+          "lb-root lb-ai-chat-composer lb-ai-chat-composer-form",
           className
         ),
         dir: $.dir,

package/dist/components/internal/AiChatComposer.js.map

@@ -1 +1 @@
-{"version":3,"file":"AiChatComposer.js","sources":["../../../src/components/internal/AiChatComposer.tsx"],"sourcesContent":["import type { CopilotId, MessageId, UiChatMessage } from \"@liveblocks/core\";\nimport { kInternal } from \"@liveblocks/core\";\nimport { useClient } from \"@liveblocks/react\";\nimport { useSignal } from \"@liveblocks/react/_private\";\nimport {\n  type ComponentProps,\n  type FormEvent,\n  forwardRef,\n  useCallback,\n} from \"react\";\n\nimport { SendIcon } from \"../../icons/Send\";\nimport { StopIcon } from \"../../icons/Stop\";\nimport {\n  type AiChatComposerOverrides,\n  type GlobalOverrides,\n  useOverrides,\n} from \"../../overrides\";\nimport * as ComposerPrimitive from \"../../primitives/AiChatComposer\";\nimport { classNames } from \"../../utils/class-names\";\nimport { Button } from \"./Button\";\nimport { ShortcutTooltip, TooltipProvider } from \"./Tooltip\";\n\n/* -------------------------------------------------------------------------------------------------\n * AiChatComposer\n * -----------------------------------------------------------------------------------------------*/\nexport interface AiChatComposerProps extends ComponentProps<\"form\"> {\n  /**\n   * The composer's initial value.\n   */\n  defaultValue?: string;\n  /**\n   * The event handler called when a chat message is submitted.\n   */\n  onComposerSubmit?: (\n    message: {\n      /**\n       * The submitted message text.\n       */\n      text: string;\n    },\n    event: FormEvent<HTMLFormElement>\n  ) => void;\n\n  /**\n   * @internal\n   * The event handler called when a user chat message is created optimistically.\n   */\n  onUserMessageCreate?: (message: {\n    /**\n     * The created user message id.\n     */\n    id: MessageId;\n  }) => void;\n  /**\n   * Whether the composer is disabled.\n   */\n  disabled?: boolean;\n  /**\n   * Whether to focus the editor on mount.\n   */\n  autoFocus?: boolean;\n  /**\n   * Override the component's strings.\n   */\n  overrides?: Partial<GlobalOverrides & AiChatComposerOverrides>;\n  /**\n   * The id of the chat the composer belongs to.\n   */\n  chatId: string;\n  /**\n   * The id of the copilot to use to send the message.\n   */\n  copilotId?: CopilotId;\n  /**\n   * @internal\n   */\n  branchId?: MessageId;\n  /**\n   * @internal\n   */\n  stream?: boolean;\n}\n\nexport const AiChatComposer = forwardRef<HTMLFormElement, AiChatComposerProps>(\n  (\n    {\n      defaultValue,\n      onComposerSubmit,\n      disabled,\n      autoFocus,\n      overrides,\n      className,\n      chatId,\n      branchId,\n      copilotId,\n      stream = true,\n      onUserMessageCreate,\n      ...props\n    },\n    forwardedRef\n  ) => {\n    const $ = useOverrides(overrides);\n    const client = useClient();\n\n    const getLastMessageId = useCallback((messages: UiChatMessage[]) => {\n      const lastMessage = messages[messages.length - 1];\n      if (lastMessage === undefined) return null;\n      return lastMessage.id;\n    }, []);\n\n    const getAbortableMessageId = useCallback((messages: UiChatMessage[]) => {\n      return messages.find(\n        (m) =>\n          m.role === \"assistant\" &&\n          (m.status === \"generating\" || m.status === \"awaiting-tool\")\n      )?.id;\n    }, []);\n\n    const messagesΣ = client[kInternal].ai.signals.getChatMessagesForBranchΣ(\n      chatId,\n      branchId\n    );\n\n    const abortableMessageId = useSignal(messagesΣ, getAbortableMessageId);\n    const lastMessageId = useSignal(messagesΣ, getLastMessageId);\n\n    const handleComposerSubmit = useCallback(\n      (message: { text: string }, event: FormEvent<HTMLFormElement>) => {\n        if (abortableMessageId !== undefined) {\n          event.preventDefault();\n          return;\n        }\n\n        onComposerSubmit?.(message, event);\n        if (event.isDefaultPrevented()) return;\n\n        const content = [{ type: \"text\" as const, text: message.text }];\n        const newMessageId = client[kInternal].ai[\n          kInternal\n        ].context.messagesStore.createOptimistically(\n          chatId,\n          \"user\",\n          lastMessageId,\n          content\n        );\n        onUserMessageCreate?.({ id: newMessageId });\n\n        const targetMessageId = client[kInternal].ai[\n          kInternal\n        ].context.messagesStore.createOptimistically(\n          chatId,\n          \"assistant\",\n          newMessageId\n        );\n\n        client[kInternal].ai.askUserMessageInChat(\n          chatId,\n          { id: newMessageId, parentMessageId: lastMessageId, content },\n          targetMessageId,\n          {\n            stream,\n            copilotId,\n          }\n        );\n      },\n      [\n        onComposerSubmit,\n        onUserMessageCreate,\n        client,\n        chatId,\n        lastMessageId,\n        abortableMessageId,\n        stream,\n        copilotId,\n      ]\n    );\n\n    return (\n      <TooltipProvider>\n        <ComposerPrimitive.Form\n          className={classNames(\n            \"lb-ai-chat-composer lb-ai-chat-composer-form\",\n            className\n          )}\n          dir={$.dir}\n          {...props}\n          disabled={disabled}\n          ref={forwardedRef}\n          onComposerSubmit={handleComposerSubmit}\n        >\n          <div className=\"lb-ai-chat-composer-editor-container\">\n            <ComposerPrimitive.Editor\n              autoFocus={autoFocus}\n              className=\"lb-ai-chat-composer-editor\"\n              placeholder={$.AI_CHAT_COMPOSER_PLACEHOLDER}\n              defaultValue={defaultValue}\n            />\n\n            <div className=\"lb-ai-chat-composer-footer\">\n              <div className=\"lb-ai-chat-composer-editor-actions\">\n                {/* No actions for now but it makes sense to keep the DOM structure */}\n              </div>\n\n              <div className=\"lb-ai-chat-composer-actions\">\n                {abortableMessageId === undefined ? (\n                  <ShortcutTooltip\n                    content={$.AI_CHAT_COMPOSER_SEND}\n                    shortcut=\"Enter\"\n                  >\n                    <ComposerPrimitive.Submit asChild>\n                      <Button\n                        onPointerDown={(event) => event.preventDefault()}\n                        onClick={(event) => event.stopPropagation()}\n                        className=\"lb-ai-chat-composer-action\"\n                        variant=\"primary\"\n                        aria-label={$.AI_CHAT_COMPOSER_SEND}\n                        icon={<SendIcon />}\n                      />\n                    </ComposerPrimitive.Submit>\n                  </ShortcutTooltip>\n                ) : (\n                  <ShortcutTooltip content={$.AI_CHAT_COMPOSER_ABORT}>\n                    <Button\n                      onPointerDown={(event) => event.preventDefault()}\n                      onClick={(event) => {\n                        event.stopPropagation();\n                        client[kInternal].ai.abort(abortableMessageId);\n                      }}\n                      className=\"lb-ai-chat-composer-action\"\n                      variant=\"secondary\"\n                      aria-label={$.AI_CHAT_COMPOSER_ABORT}\n                      icon={<StopIcon />}\n                    />\n                  </ShortcutTooltip>\n                )}\n              </div>\n            </div>\n          </div>\n        </ComposerPrimitive.Form>\n      </TooltipProvider>\n    );\n  }\n);\n"],"names":["ComposerPrimitive.Form","ComposerPrimitive.Editor","ComposerPrimitive.Submit"],"mappings":"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"}
+{"version":3,"file":"AiChatComposer.js","sources":["../../../src/components/internal/AiChatComposer.tsx"],"sourcesContent":["import type { CopilotId, MessageId, UiChatMessage } from \"@liveblocks/core\";\nimport { kInternal } from \"@liveblocks/core\";\nimport { useClient } from \"@liveblocks/react\";\nimport { useSignal } from \"@liveblocks/react/_private\";\nimport {\n  type ComponentProps,\n  type FormEvent,\n  forwardRef,\n  useCallback,\n} from \"react\";\n\nimport { SendIcon } from \"../../icons/Send\";\nimport { StopIcon } from \"../../icons/Stop\";\nimport {\n  type AiChatComposerOverrides,\n  type GlobalOverrides,\n  useOverrides,\n} from \"../../overrides\";\nimport * as ComposerPrimitive from \"../../primitives/AiChatComposer\";\nimport { classNames } from \"../../utils/class-names\";\nimport { Button } from \"./Button\";\nimport { ShortcutTooltip, TooltipProvider } from \"./Tooltip\";\n\n/* -------------------------------------------------------------------------------------------------\n * AiChatComposer\n * -----------------------------------------------------------------------------------------------*/\nexport interface AiChatComposerProps extends ComponentProps<\"form\"> {\n  /**\n   * The composer's initial value.\n   */\n  defaultValue?: string;\n  /**\n   * The event handler called when a chat message is submitted.\n   */\n  onComposerSubmit?: (\n    message: {\n      /**\n       * The submitted message text.\n       */\n      text: string;\n    },\n    event: FormEvent<HTMLFormElement>\n  ) => void;\n\n  /**\n   * @internal\n   * The event handler called when a user chat message is created optimistically.\n   */\n  onUserMessageCreate?: (message: {\n    /**\n     * The created user message id.\n     */\n    id: MessageId;\n  }) => void;\n  /**\n   * Whether the composer is disabled.\n   */\n  disabled?: boolean;\n  /**\n   * Whether to focus the editor on mount.\n   */\n  autoFocus?: boolean;\n  /**\n   * Override the component's strings.\n   */\n  overrides?: Partial<GlobalOverrides & AiChatComposerOverrides>;\n  /**\n   * The id of the chat the composer belongs to.\n   */\n  chatId: string;\n  /**\n   * The id of the copilot to use to send the message.\n   */\n  copilotId?: CopilotId;\n  /**\n   * @internal\n   */\n  branchId?: MessageId;\n  /**\n   * @internal\n   */\n  stream?: boolean;\n}\n\nexport const AiChatComposer = forwardRef<HTMLFormElement, AiChatComposerProps>(\n  (\n    {\n      defaultValue,\n      onComposerSubmit,\n      disabled,\n      autoFocus,\n      overrides,\n      className,\n      chatId,\n      branchId,\n      copilotId,\n      stream = true,\n      onUserMessageCreate,\n      ...props\n    },\n    forwardedRef\n  ) => {\n    const $ = useOverrides(overrides);\n    const client = useClient();\n\n    const getLastMessageId = useCallback((messages: UiChatMessage[]) => {\n      const lastMessage = messages[messages.length - 1];\n      if (lastMessage === undefined) return null;\n      return lastMessage.id;\n    }, []);\n\n    const getAbortableMessageId = useCallback((messages: UiChatMessage[]) => {\n      return messages.find(\n        (m) =>\n          m.role === \"assistant\" &&\n          (m.status === \"generating\" || m.status === \"awaiting-tool\")\n      )?.id;\n    }, []);\n\n    const messagesΣ = client[kInternal].ai.signals.getChatMessagesForBranchΣ(\n      chatId,\n      branchId\n    );\n\n    const abortableMessageId = useSignal(messagesΣ, getAbortableMessageId);\n    const lastMessageId = useSignal(messagesΣ, getLastMessageId);\n\n    const handleComposerSubmit = useCallback(\n      (message: { text: string }, event: FormEvent<HTMLFormElement>) => {\n        if (abortableMessageId !== undefined) {\n          event.preventDefault();\n          return;\n        }\n\n        onComposerSubmit?.(message, event);\n        if (event.isDefaultPrevented()) return;\n\n        const content = [{ type: \"text\" as const, text: message.text }];\n        const newMessageId = client[kInternal].ai[\n          kInternal\n        ].context.messagesStore.createOptimistically(\n          chatId,\n          \"user\",\n          lastMessageId,\n          content\n        );\n        onUserMessageCreate?.({ id: newMessageId });\n\n        const targetMessageId = client[kInternal].ai[\n          kInternal\n        ].context.messagesStore.createOptimistically(\n          chatId,\n          \"assistant\",\n          newMessageId\n        );\n\n        client[kInternal].ai.askUserMessageInChat(\n          chatId,\n          { id: newMessageId, parentMessageId: lastMessageId, content },\n          targetMessageId,\n          {\n            stream,\n            copilotId,\n          }\n        );\n      },\n      [\n        onComposerSubmit,\n        onUserMessageCreate,\n        client,\n        chatId,\n        lastMessageId,\n        abortableMessageId,\n        stream,\n        copilotId,\n      ]\n    );\n\n    return (\n      <TooltipProvider>\n        <ComposerPrimitive.Form\n          className={classNames(\n            \"lb-root lb-ai-chat-composer lb-ai-chat-composer-form\",\n            className\n          )}\n          dir={$.dir}\n          {...props}\n          disabled={disabled}\n          ref={forwardedRef}\n          onComposerSubmit={handleComposerSubmit}\n        >\n          <div className=\"lb-ai-chat-composer-editor-container\">\n            <ComposerPrimitive.Editor\n              autoFocus={autoFocus}\n              className=\"lb-ai-chat-composer-editor\"\n              placeholder={$.AI_CHAT_COMPOSER_PLACEHOLDER}\n              defaultValue={defaultValue}\n            />\n\n            <div className=\"lb-ai-chat-composer-footer\">\n              <div className=\"lb-ai-chat-composer-editor-actions\">\n                {/* No actions for now but it makes sense to keep the DOM structure */}\n              </div>\n\n              <div className=\"lb-ai-chat-composer-actions\">\n                {abortableMessageId === undefined ? (\n                  <ShortcutTooltip\n                    content={$.AI_CHAT_COMPOSER_SEND}\n                    shortcut=\"Enter\"\n                  >\n                    <ComposerPrimitive.Submit asChild>\n                      <Button\n                        onPointerDown={(event) => event.preventDefault()}\n                        onClick={(event) => event.stopPropagation()}\n                        className=\"lb-ai-chat-composer-action\"\n                        variant=\"primary\"\n                        aria-label={$.AI_CHAT_COMPOSER_SEND}\n                        icon={<SendIcon />}\n                      />\n                    </ComposerPrimitive.Submit>\n                  </ShortcutTooltip>\n                ) : (\n                  <ShortcutTooltip content={$.AI_CHAT_COMPOSER_ABORT}>\n                    <Button\n                      onPointerDown={(event) => event.preventDefault()}\n                      onClick={(event) => {\n                        event.stopPropagation();\n                        client[kInternal].ai.abort(abortableMessageId);\n                      }}\n                      className=\"lb-ai-chat-composer-action\"\n                      variant=\"secondary\"\n                      aria-label={$.AI_CHAT_COMPOSER_ABORT}\n                      icon={<StopIcon />}\n                    />\n                  </ShortcutTooltip>\n                )}\n              </div>\n            </div>\n          </div>\n        </ComposerPrimitive.Form>\n      </TooltipProvider>\n    );\n  }\n);\n"],"names":["ComposerPrimitive.Form","ComposerPrimitive.Editor","ComposerPrimitive.Submit"],"mappings":"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"}

package/dist/components/internal/AiChatUserMessage.cjs

@@ -2,30 +2,37 @@
 
 var jsxRuntime = require('react/jsx-runtime');
 var react = require('react');
+require('../../_private/index.cjs');
 var overrides = require('../../overrides.cjs');
 var classNames = require('../../utils/class-names.cjs');
+var index = require('../../primitives/AiMessage/index.cjs');
 
+function PlainTextPart({ part }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("p", {
+    children: part.text
+  });
+}
 const AiChatUserMessage = react.memo(
   react.forwardRef(
     ({ message, className, overrides: overrides$1 }, forwardedRef) => {
       const $ = overrides.useOverrides(overrides$1);
-      const paragraphs = message.content.filter((c) => c.type === "text").map((c) => c.text);
       return /* @__PURE__ */ jsxRuntime.jsx("div", {
         ref: forwardedRef,
         className: classNames.classNames(
           "lb-ai-chat-message lb-ai-chat-user-message",
           className
         ),
-        children: /* @__PURE__ */ jsxRuntime.jsx("div", {
+        children: message.deletedAt !== void 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", {
+          className: "lb-ai-chat-message-deleted",
+          children: $.AI_CHAT_MESSAGE_DELETED
+        }) : /* @__PURE__ */ jsxRuntime.jsx("div", {
           className: "lb-ai-chat-message-content",
-          children: message.deletedAt !== void 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", {
-            className: "lb-ai-chat-message-deleted",
-            children: $.AI_CHAT_MESSAGE_DELETED
-          }) : /* @__PURE__ */ jsxRuntime.jsx("div", {
-            className: "lb-ai-chat-message-text",
-            children: paragraphs.map((text, index) => /* @__PURE__ */ jsxRuntime.jsx("p", {
-              children: text
-            }, index))
+          children: /* @__PURE__ */ jsxRuntime.jsx(index.Content, {
+            message,
+            components: {
+              TextPart: PlainTextPart
+            },
+            className: "lb-prose lb-ai-chat-message-text"
           })
         })
       });

package/dist/components/internal/AiChatUserMessage.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"AiChatUserMessage.cjs","sources":["../../../src/components/internal/AiChatUserMessage.tsx"],"sourcesContent":["import type { UiUserMessage } from \"@liveblocks/core\";\nimport type { ComponentProps } from \"react\";\nimport { forwardRef, memo } from \"react\";\n\nimport { type GlobalOverrides, useOverrides } from \"../../overrides\";\nimport { classNames } from \"../../utils/class-names\";\n\n/* -------------------------------------------------------------------------------------------------\n * AiChatUserMessage\n * -----------------------------------------------------------------------------------------------*/\nexport interface AiChatUserMessageProps extends ComponentProps<\"div\"> {\n  /**\n   * The message to display.\n   */\n  message: UiUserMessage;\n  /**\n   * Override the component's strings.\n   */\n  overrides?: Partial<GlobalOverrides>;\n}\n\nexport const AiChatUserMessage = memo(\n  forwardRef<HTMLDivElement, AiChatUserMessageProps>(\n    ({ message, className, overrides }, forwardedRef) => {\n      const $ = useOverrides(overrides);\n      const paragraphs = message.content\n        .filter((c) => c.type === \"text\")\n        .map((c) => c.text);\n\n      return (\n        <div\n          ref={forwardedRef}\n          className={classNames(\n            \"lb-ai-chat-message lb-ai-chat-user-message\",\n            className\n          )}\n        >\n          <div className=\"lb-ai-chat-message-content\">\n            {message.deletedAt !== undefined ? (\n              <div className=\"lb-ai-chat-message-deleted\">\n                {$.AI_CHAT_MESSAGE_DELETED}\n              </div>\n            ) : (\n              <div className=\"lb-ai-chat-message-text\">\n                {/* Mimic the structure of assistant messages even though there's no rich text here yet. */}\n                {paragraphs.map((text, index) => (\n                  <p key={index}>{text}</p>\n                ))}\n              </div>\n            )}\n          </div>\n          {/* <div className=\"lb-ai-chat-message-actions\" /> */}\n        </div>\n      );\n    }\n  )\n);\n"],"names":["memo","forwardRef","overrides","useOverrides","jsx","classNames"],"mappings":";;;;;;;AAqBO,MAAM,iBAAoB,GAAAA,UAAA;AAAA,EAC/BC,gBAAA;AAAA,IACE,CAAC,EAAE,OAAA,EAAS,SAAW,aAAAC,WAAA,IAAa,YAAiB,KAAA;AACnD,MAAM,MAAA,CAAA,GAAIC,uBAAaD,WAAS,CAAA,CAAA;AAChC,MAAA,MAAM,UAAa,GAAA,OAAA,CAAQ,OACxB,CAAA,MAAA,CAAO,CAAC,CAAM,KAAA,CAAA,CAAE,IAAS,KAAA,MAAM,CAC/B,CAAA,GAAA,CAAI,CAAC,CAAA,KAAM,EAAE,IAAI,CAAA,CAAA;AAEpB,MAAA,uBACGE,cAAA,CAAA,KAAA,EAAA;AAAA,QACC,GAAK,EAAA,YAAA;AAAA,QACL,SAAW,EAAAC,qBAAA;AAAA,UACT,4CAAA;AAAA,UACA,SAAA;AAAA,SACF;AAAA,QAEA,QAAC,kBAAAD,cAAA,CAAA,KAAA,EAAA;AAAA,UAAI,SAAU,EAAA,4BAAA;AAAA,UACZ,QAAA,EAAA,OAAA,CAAQ,SAAc,KAAA,KAAA,CAAA,mBACpBA,cAAA,CAAA,KAAA,EAAA;AAAA,YAAI,SAAU,EAAA,4BAAA;AAAA,YACZ,QAAE,EAAA,CAAA,CAAA,uBAAA;AAAA,WACL,oBAECA,cAAA,CAAA,KAAA,EAAA;AAAA,YAAI,SAAU,EAAA,yBAAA;AAAA,YAEZ,QAAW,EAAA,UAAA,CAAA,GAAA,CAAI,CAAC,IAAA,EAAM,0BACpBA,cAAA,CAAA,GAAA,EAAA;AAAA,cAAe,QAAA,EAAA,IAAA;AAAA,aAAA,EAAR,KAAa,CACtB,CAAA;AAAA,WACH,CAAA;AAAA,SAEJ,CAAA;AAAA,OAEF,CAAA,CAAA;AAAA,KAEJ;AAAA,GACF;AACF;;;;"}
+{"version":3,"file":"AiChatUserMessage.cjs","sources":["../../../src/components/internal/AiChatUserMessage.tsx"],"sourcesContent":["import type { AiTextPart, UiUserMessage } from \"@liveblocks/core\";\nimport type { ComponentProps } from \"react\";\nimport { forwardRef, memo } from \"react\";\n\nimport { AiMessage } from \"../../_private\";\nimport { type GlobalOverrides, useOverrides } from \"../../overrides\";\nimport { classNames } from \"../../utils/class-names\";\n\n/* -------------------------------------------------------------------------------------------------\n * AiChatUserMessage\n * -----------------------------------------------------------------------------------------------*/\nexport interface AiChatUserMessageProps extends ComponentProps<\"div\"> {\n  /**\n   * The message to display.\n   */\n  message: UiUserMessage;\n  /**\n   * Override the component's strings.\n   */\n  overrides?: Partial<GlobalOverrides>;\n}\n\ntype PlainTextPartProps = {\n  part: AiTextPart;\n};\n\nfunction PlainTextPart({ part }: PlainTextPartProps) {\n  return <p>{part.text}</p>;\n}\n\nexport const AiChatUserMessage = memo(\n  forwardRef<HTMLDivElement, AiChatUserMessageProps>(\n    ({ message, className, overrides }, forwardedRef) => {\n      const $ = useOverrides(overrides);\n      return (\n        <div\n          ref={forwardedRef}\n          className={classNames(\n            \"lb-ai-chat-message lb-ai-chat-user-message\",\n            className\n          )}\n        >\n          {message.deletedAt !== undefined ? (\n            <div className=\"lb-ai-chat-message-deleted\">\n              {$.AI_CHAT_MESSAGE_DELETED}\n            </div>\n          ) : (\n            <div className=\"lb-ai-chat-message-content\">\n              <AiMessage.Content\n                message={message}\n                components={{\n                  TextPart: PlainTextPart,\n                }}\n                className=\"lb-prose lb-ai-chat-message-text\"\n              />\n            </div>\n          )}\n        </div>\n      );\n    }\n  )\n);\n"],"names":["jsx","memo","forwardRef","overrides","useOverrides","classNames","AiMessage.Content"],"mappings":";;;;;;;;;AA0BA,SAAS,aAAA,CAAc,EAAE,IAAA,EAA4B,EAAA;AACnD,EAAA,uBAAQA,cAAA,CAAA,GAAA,EAAA;AAAA,IAAG,QAAK,EAAA,IAAA,CAAA,IAAA;AAAA,GAAK,CAAA,CAAA;AACvB,CAAA;AAEO,MAAM,iBAAoB,GAAAC,UAAA;AAAA,EAC/BC,gBAAA;AAAA,IACE,CAAC,EAAE,OAAA,EAAS,SAAW,aAAAC,WAAA,IAAa,YAAiB,KAAA;AACnD,MAAM,MAAA,CAAA,GAAIC,uBAAaD,WAAS,CAAA,CAAA;AAChC,MAAA,uBACGH,cAAA,CAAA,KAAA,EAAA;AAAA,QACC,GAAK,EAAA,YAAA;AAAA,QACL,SAAW,EAAAK,qBAAA;AAAA,UACT,4CAAA;AAAA,UACA,SAAA;AAAA,SACF;AAAA,QAEC,QAAA,EAAA,OAAA,CAAQ,SAAc,KAAA,KAAA,CAAA,mBACpBL,cAAA,CAAA,KAAA,EAAA;AAAA,UAAI,SAAU,EAAA,4BAAA;AAAA,UACZ,QAAE,EAAA,CAAA,CAAA,uBAAA;AAAA,SACL,oBAECA,cAAA,CAAA,KAAA,EAAA;AAAA,UAAI,SAAU,EAAA,4BAAA;AAAA,UACb,QAAA,kBAAAA,cAAA,CAACM,aAAA,EAAA;AAAA,YACC,OAAA;AAAA,YACA,UAAY,EAAA;AAAA,cACV,QAAU,EAAA,aAAA;AAAA,aACZ;AAAA,YACA,SAAU,EAAA,kCAAA;AAAA,WACZ,CAAA;AAAA,SACF,CAAA;AAAA,OAEJ,CAAA,CAAA;AAAA,KAEJ;AAAA,GACF;AACF;;;;"}

package/dist/components/internal/AiChatUserMessage.js

@@ -1,29 +1,36 @@
 import { jsx } from 'react/jsx-runtime';
 import { memo, forwardRef } from 'react';
+import '../../_private/index.js';
 import { useOverrides } from '../../overrides.js';
 import { classNames } from '../../utils/class-names.js';
+import { Content as AiMessageContent } from '../../primitives/AiMessage/index.js';
 
+function PlainTextPart({ part }) {
+  return /* @__PURE__ */ jsx("p", {
+    children: part.text
+  });
+}
 const AiChatUserMessage = memo(
   forwardRef(
     ({ message, className, overrides }, forwardedRef) => {
       const $ = useOverrides(overrides);
-      const paragraphs = message.content.filter((c) => c.type === "text").map((c) => c.text);
       return /* @__PURE__ */ jsx("div", {
         ref: forwardedRef,
         className: classNames(
           "lb-ai-chat-message lb-ai-chat-user-message",
           className
         ),
-        children: /* @__PURE__ */ jsx("div", {
+        children: message.deletedAt !== void 0 ? /* @__PURE__ */ jsx("div", {
+          className: "lb-ai-chat-message-deleted",
+          children: $.AI_CHAT_MESSAGE_DELETED
+        }) : /* @__PURE__ */ jsx("div", {
           className: "lb-ai-chat-message-content",
-          children: message.deletedAt !== void 0 ? /* @__PURE__ */ jsx("div", {
-            className: "lb-ai-chat-message-deleted",
-            children: $.AI_CHAT_MESSAGE_DELETED
-          }) : /* @__PURE__ */ jsx("div", {
-            className: "lb-ai-chat-message-text",
-            children: paragraphs.map((text, index) => /* @__PURE__ */ jsx("p", {
-              children: text
-            }, index))
+          children: /* @__PURE__ */ jsx(AiMessageContent, {
+            message,
+            components: {
+              TextPart: PlainTextPart
+            },
+            className: "lb-prose lb-ai-chat-message-text"
           })
         })
       });