@servicetitan/titan-chat-ui-anvil2 3.2.0 → 4.0.0

package/src/components/message-content/message-content-text.module.less

@@ -0,0 +1,8 @@
+@import '@servicetitan/tokens/dist/tokens.less';
+
+.content {
+    p {
+        margin: @spacing-0;
+        padding: @spacing-0;
+    }
+}

package/src/components/message-content/message-content-text.module.less.d.ts

@@ -0,0 +1,3 @@
+export const __esModule: true;
+export const content: string;
+

package/src/components/message-content/message-content-text.tsx

@@ -1,11 +1,13 @@
 import { Link, Text } from '@servicetitan/anvil2';
 import { ChatMessageModelText, ChatMessageModelWelcome } from '@servicetitan/titan-chat-ui-common';
+import classNames from 'classnames';
 import DOMpurify from 'dompurify';
 import { observer } from 'mobx-react';
 import { FC, ReactNode, useMemo } from 'react';
 import Markdown, { Components } from 'react-markdown';
 import rehypeRaw from 'rehype-raw';
 import remarkGfm from 'remark-gfm';
+import * as Styles from './message-content-text.module.less';
 
 interface IMessageContentTextProps {
     className?: string;
@@ -94,7 +96,7 @@ export const MessageContentText: FC<IMessageContentTextProps> = observer(
         );
 
         return (
-            <Text variant="body" className={className} data-cy={dataCy}>
+            <Text variant="body" className={classNames(Styles.content, className)} data-cy={dataCy}>
                 <Markdown
                     components={markdownComponents}
                     rehypePlugins={[rehypeRaw]}

package/src/components/messages/message-avatar.module.less

@@ -18,6 +18,10 @@
         background-image: url('../../assets/floating-chat-avatar.svg');
     }
 
+    &.atlas {
+        background-image: url('../../assets/atlas-avatar.svg');
+    }
+
     &.system {
         min-height: @spacing-0;
         height: @spacing-0;

package/src/components/messages/message-avatar.module.less.d.ts

@@ -1,4 +1,5 @@
 export const __esModule: true;
+export const atlas: string;
 export const bot: string;
 export const system: string;
 export const userIcon: string;

package/src/components/messages/message-avatar.tsx

@@ -14,6 +14,7 @@ export const MessageAvatar: FC<IMessageAvatarProps> = ({ className, icon, name }
     const isEmpty = icon === ChatParticipantIcon.Empty;
     const isInitials = icon === ChatParticipantIcon.Initials;
     const isBot = icon === ChatParticipantIcon.Bot;
+    const isAtlas = icon === ChatParticipantIcon.Atlas;
     const nameInitials = useMemo(() => getNameInitials(name), [name]);
 
     return (
@@ -23,6 +24,7 @@ export const MessageAvatar: FC<IMessageAvatarProps> = ({ className, icon, name }
                 Styles.userIcon,
                 {
                     [Styles.bot]: isBot,
+                    [Styles.atlas]: isAtlas,
                     [Styles.system]: isEmpty,
                 },
                 className