@azure/communication-react 1.19.0-beta.1 → 1.19.0-beta.3

package/dist/dist-esm/react-components/src/components/ChatMessage/MessageComponents/ChatMessageComponentAsMessageBubble.js.map

@@ -1 +1 @@
-{"version":3,"file":"ChatMessageComponentAsMessageBubble.js","sourceRoot":"","sources":["../../../../../../../preprocess-dist/react-components/src/components/ChatMessage/MessageComponents/ChatMessageComponentAsMessageBubble.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAAE,IAAI,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AACpD,OAAO,EAAE,WAAW,IAAI,iBAAiB,EAAE,MAAM,8BAA8B,CAAC;AAEhF,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AACpD,OAAO,EAAE,oBAAoB,EAAE,sBAAsB,EAAE,0BAA0B,EAAE,MAAM,0CAA0C,CAAC;AACpI,OAAO,EAAE,cAAc,EAAE,MAAM,yCAAyC,CAAC;AACzE,OAAO,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAY5C,OAAO,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;AAGlD,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,EAAE,oBAAoB,EAAE,0BAA0B,EAAE,MAAM,mCAAmC,CAAC;AACrG,OAAO,EAAE,2BAA2B,EAAE,wBAAwB,EAAE,uBAAuB,EAAE,uBAAuB,EAAE,MAAM,uCAAuC,CAAC;AAChK,mDAAmD;AACnD,OAAO,EAAE,qCAAqC,EAAE,MAAM,gDAAgD,CAAC;AAuCvG,eAAe;AACf,MAAM,aAAa,GAAG,CAAC,KAA+C,EAAe,EAAE;IACrF,MAAM,GAAG,GAAG,cAAc,EAAE,CAAC;IAC7B,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IACzB,MAAM,MAAM,GAAG,SAAS,EAAE,CAAC;IAC3B,MAAM,EACJ,MAAM,EACN,OAAO,EACP,QAAQ,EACR,qBAAqB,EACrB,OAAO;IACP,2GAA2G;IAC3G,2BAA2B,EAC3B,kBAAkB,EAClB,6BAA6B;IAC7B,2GAA2G;IAC3G,oBAAoB;IACpB,0CAA0C;IAC1C,qBAAqB,EACrB,uBAAuB,EACxB,GAAG,KAAK,CAAC;IACV,MAAM,kBAAkB,GAAG,OAAO,CAAC,GAAG,EAAE;QACtC,MAAM,gBAAgB,GAAG,OAAO,CAAC,SAAS,CAAC,CAAC,CAAC,wBAAwB,CAAC,OAAO,CAAC,SAAS,EAAE,QAAQ,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;QACxH,MAAM,eAAe,GAAG,OAAO,CAAC,SAAS,CAAC,CAAC,CAAC,2BAA2B,CAAC,OAAO,CAAC,SAAS,EAAE,MAAM,EAAE,uBAAuB,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;QACjI,OAAO,eAAe,IAAI,gBAAgB,CAAC;IAC7C,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,CAAC,SAAS,EAAE,uBAAuB,EAAE,QAAQ,EAAE,OAAO,CAAC,CAAC,CAAC;IAC5E,MAAM,iBAAiB,GAAG,WAAW,CAAC,GAAG,EAAE;QACzC,OAAO,uBAAuB,CAAC,OAAO,EAAE,KAAK,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IACpE,CAAC,EAAE,CAAC,OAAO,CAAC,SAAS,EAAE,KAAK,EAAE,OAAO,CAAC,CAAC,CAAC;IACxC,MAAM,UAAU,GAAG,WAAW,CAAC,GAAG,EAAE;QAClC,OAAO,uBAAuB,CAAC,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,kBAAkB,EAAE,0CAA0C,CACvH,qBAAqB,EAAE,2GAA2G,CAClI,2BAA2B,EAAE,2GAA2G,CACxI,oBAAoB,CAAC,CAAC;IACxB,CAAC,EAAE,CAAC,2GAA2G,CAAA,oBAAoB,EAAE,kBAAkB,EAAE,0CAA0C,CAAA,qBAAqB,EAAE,OAAO,EAAE,2GAA2G,CAAA,2BAA2B,EAAE,OAAO,EAAE,MAAM,CAAC,CAAC,CAAC;IAC7X,MAAM,gBAAgB,GAAG,KAAK,IAAI,uDAAuD,CAAA,OAAO,CAAC,WAAW,KAAK,SAAS,CAAC;IAC3H,MAAM,uBAAuB,GAAG,0BAA0B,EAAE,CAAC;IAC7D,mDAAmD;IACnD,MAAM,sBAAsB,GAAG,OAAO,CAAC,GAAG,EAAE;QAC1C,OAAO,qCAAqC,CAAC,OAAsB,CAAC,CAAC;IACvE,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;IACd,MAAM,iBAAiB,GAAG,oBAAoB,EAAE,CAAC;IACjD,MAAM,iCAAiC,GAAG,YAAY,CAAC,uBAAuB,CAAC,IAAI,EAAE,iBAAiB,CAAC,IAAI;IAC3G,8EAA8E;IAC9E,uBAAuB,CAAC,wBAAwB,EAAE,gBAAgB,CAAC,CAAC,CAAC,uBAAuB,CAAC,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,MAAM,KAAK,QAAQ,CAAC,CAAC,CAAC,uBAAuB,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,EAAE,6BAA6B,CAAC,CAAC,CAAC,iBAAiB,CAAC,aAAa,CAAC,CAAC,CAAC,iBAAiB,CAAC,eAAe,EAAE,mDAAmD,CAC/U,sBAAsB,CAAC,CAAC,CAAC,iBAAiB,CAAC,mBAAmB,CAAC,CAAC,CAAC,SAAS,EAAE,OAAO,CAAC,QAAQ,KAAK,KAAK,IAAI,OAAO,CAAC,QAAQ,KAAK,KAAK,CAAC,CAAC,CAAC,iBAAiB,CAAC,cAAc,CAAC,CAAC,CAAC,iBAAiB,CAAC,iBAAiB;IAC7M,kGAAkG;IAClG,WAAW,CAAC,qBAAqB,CAAC,CAAC,CAAC;IACpC,MAAM,QAAQ,GAAG,OAAO,CAAC,QAAQ,KAAK,IAAI,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC,QAAQ,KAAK,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC;IACzG,MAAM,WAAW,GAAG;QAChB,6BAAK,GAAG,EAAE,KAAK,CAAC,OAAO,CAAC,SAAS;YAC/B,oBAAC,iBAAiB,IAAC,QAAQ,EAAE,QAAQ,EAAE,GAAG,EAAE,KAAK,CAAC,OAAO,CAAC,SAAS,EAAE,IAAI,EAAE;oBAC3E,SAAS,EAAE,iBAAiB,CAAC,IAAI;iBAClC,EAAE,MAAM,EAAE,oBAAC,IAAI,IAAC,SAAS,EAAE,sBAAsB,IAAG,OAAO,CAAC,iBAAiB,CAAQ,EAAE,IAAI,EAAE;oBAC5F,SAAS,EAAE,iCAAiC;oBAC5C,KAAK,oBACA,sBAAsB,CAAC,qBAAqB,CAAC,CACjD;iBACF,gBAAa,wBAAwB,EAAC,SAAS,EAAE,oBAAC,IAAI,IAAC,SAAS,EAAE,KAAK,CAAC,OAAO,CAAC,MAAM,KAAK,QAAQ,CAAC,CAAC,CAAC,0BAA0B,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,oBAAoB,CAAC,KAAK,CAAC,gBAAc,GAAG,CAAC,gBAAgB,IAC/L,kBAAkB,CACd,EAAE,OAAO,EAAE,iBAAiB,EAAE,IACtC,UAAU,EAAE,CACK,CAChB,CACL,CAAC;IACN,OAAO,WAAW,CAAC;AACrB,CAAC,CAAC;AAEF,eAAe;AACf,MAAM,CAAC,MAAM,mCAAmC,GAAG,KAAK,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { Text, mergeStyles } from '@fluentui/react';\nimport { ChatMessage as FluentChatMessage } from '@fluentui-contrib/react-chat';\nimport { _formatString } from '@internal/acs-ui-common';\nimport React, { useCallback, useMemo } from 'react';\nimport { chatMessageDateStyle, chatMessageAuthorStyle, chatMessageDateFailedStyle } from '../../styles/ChatMessageComponent.styles';\nimport { useIdentifiers } from '../../../identifiers/IdentifierProvider';\nimport { useTheme } from '../../../theming';\nimport { InlineImageOptions } from '../ChatMessageContent';\nimport { ChatMessage } from '../../../types/ChatMessage';\n/* @conditional-compile-remove(data-loss-prevention) */\nimport { BlockedMessage } from '../../../types/ChatMessage';\nimport { MessageThreadStrings } from '../../MessageThread';\nimport { ComponentSlotStyle } from '../../../types';\n/* @conditional-compile-remove(file-sharing-teams-interop) @conditional-compile-remove(file-sharing-acs) */\nimport { AttachmentMenuAction } from '../../../types';\n/* @conditional-compile-remove(file-sharing-teams-interop) @conditional-compile-remove(file-sharing-acs) */\nimport { AttachmentMetadata } from '@internal/acs-ui-common';\nimport { _AttachmentDownloadCards } from '../../Attachment/AttachmentDownloadCards';\nimport { useLocale } from '../../../localization';\n/* @conditional-compile-remove(mention) */\nimport { MentionDisplayOptions } from '../../MentionPopover';\nimport { createStyleFromV8Style } from '../../styles/v8StyleShim';\nimport { mergeClasses } from '@fluentui/react-components';\nimport { useChatMessageStyles, useChatMessageCommonStyles } from '../../styles/MessageThread.styles';\nimport { generateCustomizedTimestamp, generateDefaultTimestamp, getMessageBubbleContent, getMessageEditedDetails } from '../../utils/ChatMessageComponentUtils';\n/* @conditional-compile-remove(file-sharing-acs) */\nimport { doesMessageContainMultipleAttachments } from '../../utils/ChatMessageComponentAsEditBoxUtils';\ntype ChatMessageComponentAsMessageBubbleProps = {\n  message: ChatMessage | /* @conditional-compile-remove(data-loss-prevention) */BlockedMessage;\n  messageContainerStyle?: ComponentSlotStyle;\n  showDate?: boolean;\n  strings: MessageThreadStrings;\n  userId: string;\n  /**\n   * Whether to overlap avatar and message when the view is width constrained.\n   */\n  shouldOverlapAvatarAndMessage: boolean;\n  /* @conditional-compile-remove(file-sharing-teams-interop) @conditional-compile-remove(file-sharing-acs) */\n  /**\n   * Optional callback to render message attachments in the message component.\n   */\n  onRenderAttachmentDownloads?: (message: ChatMessage) => JSX.Element;\n  /* @conditional-compile-remove(file-sharing-teams-interop) @conditional-compile-remove(file-sharing-acs) */\n  /**\n   * Optional callback to define custom actions for attachments.\n   */\n  actionsForAttachment?: (attachment: AttachmentMetadata, message?: ChatMessage) => AttachmentMenuAction[];\n  /**\n   * Optional function to provide customized date format.\n   * @beta\n   */\n  onDisplayDateTimeString?: (messageDate: Date) => string;\n  /* @conditional-compile-remove(mention) */\n  /**\n   * Optional props needed to display suggestions in the mention scenario.\n   * @internal\n   */\n  mentionDisplayOptions?: MentionDisplayOptions;\n  /**\n   * Optional callback called when an inline image is clicked.\n   * @beta\n   */\n  inlineImageOptions?: InlineImageOptions;\n};\n\n/** @private */\nconst MessageBubble = (props: ChatMessageComponentAsMessageBubbleProps): JSX.Element => {\n  const ids = useIdentifiers();\n  const theme = useTheme();\n  const locale = useLocale();\n  const {\n    userId,\n    message,\n    showDate,\n    messageContainerStyle,\n    strings,\n    /* @conditional-compile-remove(file-sharing-teams-interop) @conditional-compile-remove(file-sharing-acs) */\n    onRenderAttachmentDownloads,\n    inlineImageOptions,\n    shouldOverlapAvatarAndMessage,\n    /* @conditional-compile-remove(file-sharing-teams-interop) @conditional-compile-remove(file-sharing-acs) */\n    actionsForAttachment,\n    /* @conditional-compile-remove(mention) */\n    mentionDisplayOptions,\n    onDisplayDateTimeString\n  } = props;\n  const formattedTimestamp = useMemo(() => {\n    const defaultTimeStamp = message.createdOn ? generateDefaultTimestamp(message.createdOn, showDate, strings) : undefined;\n    const customTimestamp = message.createdOn ? generateCustomizedTimestamp(message.createdOn, locale, onDisplayDateTimeString) : '';\n    return customTimestamp || defaultTimeStamp;\n  }, [locale, message.createdOn, onDisplayDateTimeString, showDate, strings]);\n  const getMessageDetails = useCallback(() => {\n    return getMessageEditedDetails(message, theme, strings.editedTag);\n  }, [strings.editedTag, theme, message]);\n  const getContent = useCallback(() => {\n    return getMessageBubbleContent(message, strings, userId, inlineImageOptions, /* @conditional-compile-remove(mention) */\n    mentionDisplayOptions, /* @conditional-compile-remove(file-sharing-teams-interop) @conditional-compile-remove(file-sharing-acs) */\n    onRenderAttachmentDownloads, /* @conditional-compile-remove(file-sharing-teams-interop) @conditional-compile-remove(file-sharing-acs) */\n    actionsForAttachment);\n  }, [/* @conditional-compile-remove(file-sharing-teams-interop) @conditional-compile-remove(file-sharing-acs) */actionsForAttachment, inlineImageOptions, /* @conditional-compile-remove(mention) */mentionDisplayOptions, message, /* @conditional-compile-remove(file-sharing-teams-interop) @conditional-compile-remove(file-sharing-acs) */onRenderAttachmentDownloads, strings, userId]);\n  const isBlockedMessage = false || /* @conditional-compile-remove(data-loss-prevention) */message.messageType === 'blocked';\n  const chatMessageCommonStyles = useChatMessageCommonStyles();\n  /* @conditional-compile-remove(file-sharing-acs) */\n  const hasMultipleAttachments = useMemo(() => {\n    return doesMessageContainMultipleAttachments(message as ChatMessage);\n  }, [message]);\n  const chatMessageStyles = useChatMessageStyles();\n  const chatItemMessageContainerClassName = mergeClasses(chatMessageCommonStyles.body, chatMessageStyles.body,\n  // disable placeholder functionality for GA releases as it might confuse users\n  chatMessageCommonStyles.bodyWithPlaceholderImage, isBlockedMessage ? chatMessageCommonStyles.blocked : props.message.status === 'failed' ? chatMessageCommonStyles.failed : undefined, shouldOverlapAvatarAndMessage ? chatMessageStyles.avatarOverlap : chatMessageStyles.avatarNoOverlap, /* @conditional-compile-remove(file-sharing-acs) */\n  hasMultipleAttachments ? chatMessageStyles.multipleAttachments : undefined, message.attached === 'top' || message.attached === false ? chatMessageStyles.bodyWithAvatar : chatMessageStyles.bodyWithoutAvatar,\n  // messageContainerStyle used in className and style prop as style prop can't handle CSS selectors\n  mergeStyles(messageContainerStyle));\n  const attached = message.attached === true ? 'center' : message.attached === 'bottom' ? 'bottom' : 'top';\n  const chatMessage = <>\n      <div key={props.message.messageId}>\n        <FluentChatMessage attached={attached} key={props.message.messageId} root={{\n        className: chatMessageStyles.root\n      }} author={<Text className={chatMessageAuthorStyle}>{message.senderDisplayName}</Text>} body={{\n        className: chatItemMessageContainerClassName,\n        style: {\n          ...createStyleFromV8Style(messageContainerStyle)\n        }\n      }} data-ui-id=\"chat-composite-message\" timestamp={<Text className={props.message.status === 'failed' ? chatMessageDateFailedStyle(theme) : chatMessageDateStyle(theme)} data-ui-id={ids.messageTimestamp}>\n              {formattedTimestamp}\n            </Text>} details={getMessageDetails()}>\n          {getContent()}\n        </FluentChatMessage>\n      </div>\n    </>;\n  return chatMessage;\n};\n\n/** @private */\nexport const ChatMessageComponentAsMessageBubble = React.memo(MessageBubble);"]}
+{"version":3,"file":"ChatMessageComponentAsMessageBubble.js","sourceRoot":"","sources":["../../../../../../../preprocess-dist/react-components/src/components/ChatMessage/MessageComponents/ChatMessageComponentAsMessageBubble.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { Text, mergeStyles } from '@fluentui/react';\nimport { ChatMessage as FluentChatMessage } from '@fluentui-contrib/react-chat';\nimport { _formatString } from '@internal/acs-ui-common';\nimport React, { useCallback, useMemo } from 'react';\nimport { chatMessageDateStyle, chatMessageAuthorStyle, chatMessageDateFailedStyle } from '../../styles/ChatMessageComponent.styles';\nimport { useIdentifiers } from '../../../identifiers/IdentifierProvider';\nimport { useTheme } from '../../../theming';\nimport { InlineImageOptions } from '../ChatMessageContent';\nimport { ChatMessage } from '../../../types/ChatMessage';\nimport { BlockedMessage } from '../../../types/ChatMessage';\nimport { MessageThreadStrings } from '../../MessageThread';\nimport { ComponentSlotStyle } from '../../../types';\nimport { AttachmentMenuAction } from '../../../types';\nimport { AttachmentMetadata } from '@internal/acs-ui-common';\nimport { _AttachmentDownloadCards } from '../../Attachment/AttachmentDownloadCards';\nimport { useLocale } from '../../../localization';\nimport { MentionDisplayOptions } from '../../MentionPopover';\nimport { createStyleFromV8Style } from '../../styles/v8StyleShim';\nimport { mergeClasses } from '@fluentui/react-components';\nimport { useChatMessageStyles, useChatMessageCommonStyles } from '../../styles/MessageThread.styles';\nimport { generateCustomizedTimestamp, generateDefaultTimestamp, getMessageBubbleContent, getMessageEditedDetails } from '../../utils/ChatMessageComponentUtils';\nimport { doesMessageContainMultipleAttachments } from '../../utils/ChatMessageComponentAsEditBoxUtils';\ntype ChatMessageComponentAsMessageBubbleProps = {\n  message: ChatMessage | BlockedMessage;\n  messageContainerStyle?: ComponentSlotStyle;\n  showDate?: boolean;\n  strings: MessageThreadStrings;\n  userId: string;\n  /**\n   * Whether to overlap avatar and message when the view is width constrained.\n   */\n  shouldOverlapAvatarAndMessage: boolean;\n  /**\n   * Optional callback to render message attachments in the message component.\n   */\n  onRenderAttachmentDownloads?: (message: ChatMessage) => JSX.Element;\n  /**\n   * Optional callback to define custom actions for attachments.\n   */\n  actionsForAttachment?: (attachment: AttachmentMetadata, message?: ChatMessage) => AttachmentMenuAction[];\n  /**\n   * Optional function to provide customized date format.\n   * @beta\n   */\n  onDisplayDateTimeString?: (messageDate: Date) => string;\n  /**\n   * Optional props needed to display suggestions in the mention scenario.\n   * @internal\n   */\n  mentionDisplayOptions?: MentionDisplayOptions;\n  /**\n   * Optional callback called when an inline image is clicked.\n   * @beta\n   */\n  inlineImageOptions?: InlineImageOptions;\n};\n\n/** @private */\nconst MessageBubble = (props: ChatMessageComponentAsMessageBubbleProps): JSX.Element => {\n  const ids = useIdentifiers();\n  const theme = useTheme();\n  const locale = useLocale();\n  const {\n    userId,\n    message,\n    showDate,\n    messageContainerStyle,\n    strings,\n    onRenderAttachmentDownloads,\n    inlineImageOptions,\n    shouldOverlapAvatarAndMessage,\n    actionsForAttachment,\n    mentionDisplayOptions,\n    onDisplayDateTimeString\n  } = props;\n  const formattedTimestamp = useMemo(() => {\n    const defaultTimeStamp = message.createdOn ? generateDefaultTimestamp(message.createdOn, showDate, strings) : undefined;\n    const customTimestamp = message.createdOn ? generateCustomizedTimestamp(message.createdOn, locale, onDisplayDateTimeString) : '';\n    return customTimestamp || defaultTimeStamp;\n  }, [locale, message.createdOn, onDisplayDateTimeString, showDate, strings]);\n  const getMessageDetails = useCallback(() => {\n    return getMessageEditedDetails(message, theme, strings.editedTag);\n  }, [strings.editedTag, theme, message]);\n  const getContent = useCallback(() => {\n    return getMessageBubbleContent(message, strings, userId, inlineImageOptions, mentionDisplayOptions, onRenderAttachmentDownloads, actionsForAttachment);\n  }, [actionsForAttachment, inlineImageOptions, mentionDisplayOptions, message, onRenderAttachmentDownloads, strings, userId]);\n  const isBlockedMessage = false || message.messageType === 'blocked';\n  const chatMessageCommonStyles = useChatMessageCommonStyles();\n  const hasMultipleAttachments = useMemo(() => {\n    return doesMessageContainMultipleAttachments(message as ChatMessage);\n  }, [message]);\n  const chatMessageStyles = useChatMessageStyles();\n  const chatItemMessageContainerClassName = mergeClasses(chatMessageCommonStyles.body, chatMessageStyles.body,\n  // disable placeholder functionality for GA releases as it might confuse users\n  chatMessageCommonStyles.bodyWithPlaceholderImage, isBlockedMessage ? chatMessageCommonStyles.blocked : props.message.status === 'failed' ? chatMessageCommonStyles.failed : undefined, shouldOverlapAvatarAndMessage ? chatMessageStyles.avatarOverlap : chatMessageStyles.avatarNoOverlap, hasMultipleAttachments ? chatMessageStyles.multipleAttachments : undefined, message.attached === 'top' || message.attached === false ? chatMessageStyles.bodyWithAvatar : chatMessageStyles.bodyWithoutAvatar,\n  // messageContainerStyle used in className and style prop as style prop can't handle CSS selectors\n  mergeStyles(messageContainerStyle));\n  const attached = message.attached === true ? 'center' : message.attached === 'bottom' ? 'bottom' : 'top';\n  const chatMessage = <>\n      <div key={props.message.messageId}>\n        <FluentChatMessage attached={attached} key={props.message.messageId} root={{\n        className: chatMessageStyles.root\n      }} author={<Text className={chatMessageAuthorStyle}>{message.senderDisplayName}</Text>} body={{\n        className: chatItemMessageContainerClassName,\n        style: {\n          ...createStyleFromV8Style(messageContainerStyle)\n        }\n      }} data-ui-id=\"chat-composite-message\" timestamp={<Text className={props.message.status === 'failed' ? chatMessageDateFailedStyle(theme) : chatMessageDateStyle(theme)} data-ui-id={ids.messageTimestamp}>\n              {formattedTimestamp}\n            </Text>} details={getMessageDetails()}>\n          {getContent()}\n        </FluentChatMessage>\n      </div>\n    </>;\n  return chatMessage;\n};\n\n/** @private */\nexport const ChatMessageComponentAsMessageBubble = React.memo(MessageBubble);"]}

package/dist/dist-esm/react-components/src/components/ChatMessage/MessageComponents/FluentChatMessageComponent.d.ts

@@ -8,7 +8,7 @@ import { ChatMessage } from '../../../types/ChatMessage';
  * @private
  */
 export type FluentChatMessageComponentWrapperProps = ChatMessageComponentWrapperProps & {
-    message: ChatMessage | /* @conditional-compile-remove(data-loss-prevention) */ BlockedMessage;
+    message: ChatMessage | BlockedMessage;
 };
 /**
  * The component for rendering a chat message using Fluent UI components

package/dist/dist-esm/react-components/src/components/ChatMessage/MessageComponents/FluentChatMessageComponent.js

@@ -17,17 +17,8 @@ import { ChatMessageComponentAsMessageBubble } from './ChatMessageComponentAsMes
  * @private
  */
 export const FluentChatMessageComponent = (props) => {
-    const { message, styles, shouldOverlapAvatarAndMessage, onRenderMessage, onRenderAvatar, 
-    /* @conditional-compile-remove(date-time-customization) */
-    onDisplayDateTimeString, inlineImageOptions, 
-    /* @conditional-compile-remove(file-sharing-teams-interop) @conditional-compile-remove(file-sharing-acs) */
-    actionsForAttachment, userId, 
-    /* @conditional-compile-remove(file-sharing-teams-interop) @conditional-compile-remove(file-sharing-acs) */
-    onRenderAttachmentDownloads, 
-    /* @conditional-compile-remove(mention) */
-    mentionOptions } = props;
+    const { message, styles, shouldOverlapAvatarAndMessage, onRenderMessage, onRenderAvatar, onDisplayDateTimeString, inlineImageOptions, actionsForAttachment, userId, onRenderAttachmentDownloads, mentionOptions } = props;
     const chatMessageRenderStyles = useChatMessageRenderStyles();
-    /* @conditional-compile-remove(file-sharing-teams-interop) @conditional-compile-remove(file-sharing-acs) */
     const onRenderAttachmentDownloadsMemo = useMemo(() => {
         return onRenderAttachmentDownloads;
         return undefined;
@@ -35,20 +26,11 @@ export const FluentChatMessageComponent = (props) => {
     // To rerender the defaultChatMessageRenderer if app running across days(every new day chat time stamp
     // needs to be regenerated), the dependency on "new Date().toDateString()"" is added.
     const defaultChatMessageRenderer = useCallback((messageProps) => {
-        if (messageProps.message.messageType === 'chat' || /* @conditional-compile-remove(data-loss-prevention) */ messageProps.message.messageType === 'blocked') {
-            return React.createElement(ChatMessageComponentAsMessageBubble, Object.assign({}, messageProps, { 
-                /* @conditional-compile-remove(file-sharing-teams-interop) @conditional-compile-remove(file-sharing-acs) */ onRenderAttachmentDownloads: onRenderAttachmentDownloadsMemo, strings: messageProps.strings, message: messageProps.message, userId: userId, shouldOverlapAvatarAndMessage: shouldOverlapAvatarAndMessage, 
-                /* @conditional-compile-remove(date-time-customization) */ onDisplayDateTimeString: onDisplayDateTimeString, inlineImageOptions: inlineImageOptions, 
-                /* @conditional-compile-remove(file-sharing-teams-interop) @conditional-compile-remove(file-sharing-acs) */ actionsForAttachment: actionsForAttachment, 
-                /* @conditional-compile-remove(mention) */ mentionDisplayOptions: mentionOptions === null || mentionOptions === void 0 ? void 0 : mentionOptions.displayOptions }));
+        if (messageProps.message.messageType === 'chat' || messageProps.message.messageType === 'blocked') {
+            return React.createElement(ChatMessageComponentAsMessageBubble, Object.assign({}, messageProps, { onRenderAttachmentDownloads: onRenderAttachmentDownloadsMemo, strings: messageProps.strings, message: messageProps.message, userId: userId, shouldOverlapAvatarAndMessage: shouldOverlapAvatarAndMessage, onDisplayDateTimeString: onDisplayDateTimeString, inlineImageOptions: inlineImageOptions, actionsForAttachment: actionsForAttachment, mentionDisplayOptions: mentionOptions === null || mentionOptions === void 0 ? void 0 : mentionOptions.displayOptions }));
         }
         return React.createElement(React.Fragment, null);
-    }, [
-        onRenderAttachmentDownloadsMemo, userId, shouldOverlapAvatarAndMessage, /* @conditional-compile-remove(date-time-customization) */
-        onDisplayDateTimeString, inlineImageOptions, /* @conditional-compile-remove(file-sharing-teams-interop) @conditional-compile-remove(file-sharing-acs) */
-        actionsForAttachment, /* @conditional-compile-remove(mention) */
-        mentionOptions === null || mentionOptions === void 0 ? void 0 : mentionOptions.displayOptions
-    ]);
+    }, [onRenderAttachmentDownloadsMemo, userId, shouldOverlapAvatarAndMessage, onDisplayDateTimeString, inlineImageOptions, actionsForAttachment, mentionOptions === null || mentionOptions === void 0 ? void 0 : mentionOptions.displayOptions]);
     const messageRenderer = useCallback((messageProps) => {
         return onRenderMessage === undefined ? defaultChatMessageRenderer(Object.assign({}, messageProps)) : onRenderMessage(messageProps, defaultChatMessageRenderer);
     }, [defaultChatMessageRenderer, onRenderMessage]);

package/dist/dist-esm/react-components/src/components/ChatMessage/MessageComponents/FluentChatMessageComponent.js.map

@@ -1 +1 @@
-{"version":3,"file":"FluentChatMessageComponent.js","sourceRoot":"","sources":["../../../../../../../preprocess-dist/react-components/src/components/ChatMessage/MessageComponents/FluentChatMessageComponent.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { _formatString } from '@internal/acs-ui-common';\nimport React, { useCallback, useMemo } from 'react';\nimport { MessageProps, _ChatMessageProps } from '../../MessageThread';\nimport { gutterWithAvatar, gutterWithHiddenAvatar, useChatMessageRenderStyles } from '../../styles/MessageThread.styles';\nimport { IPersona, PersonaSize, mergeStyles, Persona } from '@fluentui/react';\nimport { mergeClasses } from '@fluentui/react-components';\nimport { createStyleFromV8Style } from '../../styles/v8StyleShim';\nimport { ChatMessage as FluentChatMessage } from '@fluentui-contrib/react-chat';\nimport { getFluentUIAttachedValue } from '../../utils/ChatMessageComponentUtils';\nimport { ChatMessageComponentWrapperProps } from '../ChatMessageComponentWrapper';\n/* @conditional-compile-remove(data-loss-prevention) */\nimport { BlockedMessage } from '../../../types/ChatMessage';\nimport { ChatMessage } from '../../../types/ChatMessage';\nimport { ChatMessageComponentAsMessageBubble } from './ChatMessageComponentAsMessageBubble';\n\n/**\n * Props for {@link FluentChatMessageComponentWrapper}\n *\n * @private\n */\nexport type FluentChatMessageComponentWrapperProps = ChatMessageComponentWrapperProps & {\n  message: ChatMessage | /* @conditional-compile-remove(data-loss-prevention) */BlockedMessage;\n};\n\n/**\n * The component for rendering a chat message using Fluent UI components\n * and handling default and custom renderers.\n * This component handles rendering for chat message body, avatar and message status.\n * The chat message body, avatar and message status should be shown for both default and custom renderers.\n *\n * @private\n */\nexport const FluentChatMessageComponent = (props: FluentChatMessageComponentWrapperProps): JSX.Element => {\n  const {\n    message,\n    styles,\n    shouldOverlapAvatarAndMessage,\n    onRenderMessage,\n    onRenderAvatar,\n    /* @conditional-compile-remove(date-time-customization) */\n    onDisplayDateTimeString,\n    inlineImageOptions,\n    /* @conditional-compile-remove(file-sharing-teams-interop) @conditional-compile-remove(file-sharing-acs) */\n    actionsForAttachment,\n    userId,\n    /* @conditional-compile-remove(file-sharing-teams-interop) @conditional-compile-remove(file-sharing-acs) */\n    onRenderAttachmentDownloads,\n    /* @conditional-compile-remove(mention) */\n    mentionOptions\n  } = props;\n  const chatMessageRenderStyles = useChatMessageRenderStyles();\n\n  /* @conditional-compile-remove(file-sharing-teams-interop) @conditional-compile-remove(file-sharing-acs) */\n  const onRenderAttachmentDownloadsMemo = useMemo(() => {\n    return onRenderAttachmentDownloads;\n    return undefined;\n  }, [onRenderAttachmentDownloads]);\n\n  // To rerender the defaultChatMessageRenderer if app running across days(every new day chat time stamp\n  // needs to be regenerated), the dependency on \"new Date().toDateString()\"\" is added.\n  const defaultChatMessageRenderer = useCallback((messageProps: MessageProps) => {\n    if (messageProps.message.messageType === 'chat' || /* @conditional-compile-remove(data-loss-prevention) */messageProps.message.messageType === 'blocked') {\n      return <ChatMessageComponentAsMessageBubble {...messageProps}\n      /* @conditional-compile-remove(file-sharing-teams-interop) @conditional-compile-remove(file-sharing-acs) */ onRenderAttachmentDownloads={onRenderAttachmentDownloadsMemo} strings={messageProps.strings} message={messageProps.message} userId={userId} shouldOverlapAvatarAndMessage={shouldOverlapAvatarAndMessage}\n      /* @conditional-compile-remove(date-time-customization) */ onDisplayDateTimeString={onDisplayDateTimeString} inlineImageOptions={inlineImageOptions}\n      /* @conditional-compile-remove(file-sharing-teams-interop) @conditional-compile-remove(file-sharing-acs) */ actionsForAttachment={actionsForAttachment}\n      /* @conditional-compile-remove(mention) */ mentionDisplayOptions={mentionOptions?.displayOptions} />;\n    }\n    return <></>;\n  }, [/* @conditional-compile-remove(file-sharing-teams-interop) @conditional-compile-remove(file-sharing-acs) */\n  onRenderAttachmentDownloadsMemo, userId, shouldOverlapAvatarAndMessage, /* @conditional-compile-remove(date-time-customization) */\n  onDisplayDateTimeString, inlineImageOptions, /* @conditional-compile-remove(file-sharing-teams-interop) @conditional-compile-remove(file-sharing-acs) */\n  actionsForAttachment, /* @conditional-compile-remove(mention) */\n  mentionOptions?.displayOptions]);\n  const messageRenderer = useCallback((messageProps: MessageProps) => {\n    return onRenderMessage === undefined ? defaultChatMessageRenderer({\n      ...messageProps\n    }) : onRenderMessage(messageProps, defaultChatMessageRenderer);\n  }, [defaultChatMessageRenderer, onRenderMessage]);\n  const shouldShowAvatar = useMemo(() => {\n    return message.attached === 'top' || message.attached === false;\n  }, [message.attached]);\n  const attached = useMemo(() => {\n    return getFluentUIAttachedValue(message.attached);\n  }, [message.attached]);\n  const messageRootProps = useMemo(() => {\n    return {\n      className: mergeClasses(chatMessageRenderStyles.rootMessage, chatMessageRenderStyles.rootCommon)\n    };\n  }, [chatMessageRenderStyles.rootCommon, chatMessageRenderStyles.rootMessage]);\n  const avatar = useMemo(() => {\n    const chatAvatarStyle = shouldShowAvatar ? gutterWithAvatar : gutterWithHiddenAvatar;\n    const personaOptions: IPersona = {\n      hidePersonaDetails: true,\n      size: PersonaSize.size32,\n      text: message.senderDisplayName,\n      showOverflowTooltip: false\n    };\n    let renderedAvatar;\n    if (onRenderAvatar) {\n      const avatarComponent = onRenderAvatar?.(message.senderId, personaOptions);\n      if (!avatarComponent) {\n        return undefined;\n      } else {\n        renderedAvatar = avatarComponent;\n      }\n    }\n    return <div className={mergeStyles(chatAvatarStyle)}>\n        {renderedAvatar ? renderedAvatar : <Persona {...personaOptions} />}\n      </div>;\n  }, [message.senderDisplayName, message.senderId, onRenderAvatar, shouldShowAvatar]);\n  const messageBodyProps = useMemo(() => {\n    return {\n      // chatItemMessageContainer used in className and style prop as style prop can't handle CSS selectors\n      className: mergeClasses(chatMessageRenderStyles.bodyCommon, !shouldShowAvatar ? avatar ? chatMessageRenderStyles.bodyWithoutAvatar : chatMessageRenderStyles.bodyHiddenAvatar : chatMessageRenderStyles.bodyWithAvatar, shouldOverlapAvatarAndMessage ? chatMessageRenderStyles.avatarOverlap : chatMessageRenderStyles.avatarNoOverlap, mergeStyles(styles?.chatItemMessageContainer)),\n      style: styles?.chatItemMessageContainer !== undefined ? createStyleFromV8Style(styles?.chatItemMessageContainer) : {}\n    };\n  }, [chatMessageRenderStyles.bodyCommon, chatMessageRenderStyles.bodyWithoutAvatar, chatMessageRenderStyles.bodyHiddenAvatar, chatMessageRenderStyles.bodyWithAvatar, chatMessageRenderStyles.avatarOverlap, chatMessageRenderStyles.avatarNoOverlap, shouldShowAvatar, avatar, shouldOverlapAvatarAndMessage, styles?.chatItemMessageContainer]);\n\n  // Fluent UI message components are used here as for default message renderer,\n  // timestamp and author name should be shown but they aren't shown for custom renderer.\n  // More investigations are needed to check if this can be simplified with states.\n  // Avatar should be shown for both custom and default renderers.\n  return <FluentChatMessage attached={attached} root={messageRootProps} body={messageBodyProps} avatar={avatar}>\n      {messageRenderer({\n      ...props\n    })}\n    </FluentChatMessage>;\n};"]}
+{"version":3,"file":"FluentChatMessageComponent.js","sourceRoot":"","sources":["../../../../../../../preprocess-dist/react-components/src/components/ChatMessage/MessageComponents/FluentChatMessageComponent.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { _formatString } from '@internal/acs-ui-common';\nimport React, { useCallback, useMemo } from 'react';\nimport { MessageProps, _ChatMessageProps } from '../../MessageThread';\nimport { gutterWithAvatar, gutterWithHiddenAvatar, useChatMessageRenderStyles } from '../../styles/MessageThread.styles';\nimport { IPersona, PersonaSize, mergeStyles, Persona } from '@fluentui/react';\nimport { mergeClasses } from '@fluentui/react-components';\nimport { createStyleFromV8Style } from '../../styles/v8StyleShim';\nimport { ChatMessage as FluentChatMessage } from '@fluentui-contrib/react-chat';\nimport { getFluentUIAttachedValue } from '../../utils/ChatMessageComponentUtils';\nimport { ChatMessageComponentWrapperProps } from '../ChatMessageComponentWrapper';\nimport { BlockedMessage } from '../../../types/ChatMessage';\nimport { ChatMessage } from '../../../types/ChatMessage';\nimport { ChatMessageComponentAsMessageBubble } from './ChatMessageComponentAsMessageBubble';\n\n/**\n * Props for {@link FluentChatMessageComponentWrapper}\n *\n * @private\n */\nexport type FluentChatMessageComponentWrapperProps = ChatMessageComponentWrapperProps & {\n  message: ChatMessage | BlockedMessage;\n};\n\n/**\n * The component for rendering a chat message using Fluent UI components\n * and handling default and custom renderers.\n * This component handles rendering for chat message body, avatar and message status.\n * The chat message body, avatar and message status should be shown for both default and custom renderers.\n *\n * @private\n */\nexport const FluentChatMessageComponent = (props: FluentChatMessageComponentWrapperProps): JSX.Element => {\n  const {\n    message,\n    styles,\n    shouldOverlapAvatarAndMessage,\n    onRenderMessage,\n    onRenderAvatar,\n    onDisplayDateTimeString,\n    inlineImageOptions,\n    actionsForAttachment,\n    userId,\n    onRenderAttachmentDownloads,\n    mentionOptions\n  } = props;\n  const chatMessageRenderStyles = useChatMessageRenderStyles();\n  const onRenderAttachmentDownloadsMemo = useMemo(() => {\n    return onRenderAttachmentDownloads;\n    return undefined;\n  }, [onRenderAttachmentDownloads]);\n\n  // To rerender the defaultChatMessageRenderer if app running across days(every new day chat time stamp\n  // needs to be regenerated), the dependency on \"new Date().toDateString()\"\" is added.\n  const defaultChatMessageRenderer = useCallback((messageProps: MessageProps) => {\n    if (messageProps.message.messageType === 'chat' || messageProps.message.messageType === 'blocked') {\n      return <ChatMessageComponentAsMessageBubble {...messageProps} onRenderAttachmentDownloads={onRenderAttachmentDownloadsMemo} strings={messageProps.strings} message={messageProps.message} userId={userId} shouldOverlapAvatarAndMessage={shouldOverlapAvatarAndMessage} onDisplayDateTimeString={onDisplayDateTimeString} inlineImageOptions={inlineImageOptions} actionsForAttachment={actionsForAttachment} mentionDisplayOptions={mentionOptions?.displayOptions} />;\n    }\n    return <></>;\n  }, [onRenderAttachmentDownloadsMemo, userId, shouldOverlapAvatarAndMessage, onDisplayDateTimeString, inlineImageOptions, actionsForAttachment, mentionOptions?.displayOptions]);\n  const messageRenderer = useCallback((messageProps: MessageProps) => {\n    return onRenderMessage === undefined ? defaultChatMessageRenderer({\n      ...messageProps\n    }) : onRenderMessage(messageProps, defaultChatMessageRenderer);\n  }, [defaultChatMessageRenderer, onRenderMessage]);\n  const shouldShowAvatar = useMemo(() => {\n    return message.attached === 'top' || message.attached === false;\n  }, [message.attached]);\n  const attached = useMemo(() => {\n    return getFluentUIAttachedValue(message.attached);\n  }, [message.attached]);\n  const messageRootProps = useMemo(() => {\n    return {\n      className: mergeClasses(chatMessageRenderStyles.rootMessage, chatMessageRenderStyles.rootCommon)\n    };\n  }, [chatMessageRenderStyles.rootCommon, chatMessageRenderStyles.rootMessage]);\n  const avatar = useMemo(() => {\n    const chatAvatarStyle = shouldShowAvatar ? gutterWithAvatar : gutterWithHiddenAvatar;\n    const personaOptions: IPersona = {\n      hidePersonaDetails: true,\n      size: PersonaSize.size32,\n      text: message.senderDisplayName,\n      showOverflowTooltip: false\n    };\n    let renderedAvatar;\n    if (onRenderAvatar) {\n      const avatarComponent = onRenderAvatar?.(message.senderId, personaOptions);\n      if (!avatarComponent) {\n        return undefined;\n      } else {\n        renderedAvatar = avatarComponent;\n      }\n    }\n    return <div className={mergeStyles(chatAvatarStyle)}>\n        {renderedAvatar ? renderedAvatar : <Persona {...personaOptions} />}\n      </div>;\n  }, [message.senderDisplayName, message.senderId, onRenderAvatar, shouldShowAvatar]);\n  const messageBodyProps = useMemo(() => {\n    return {\n      // chatItemMessageContainer used in className and style prop as style prop can't handle CSS selectors\n      className: mergeClasses(chatMessageRenderStyles.bodyCommon, !shouldShowAvatar ? avatar ? chatMessageRenderStyles.bodyWithoutAvatar : chatMessageRenderStyles.bodyHiddenAvatar : chatMessageRenderStyles.bodyWithAvatar, shouldOverlapAvatarAndMessage ? chatMessageRenderStyles.avatarOverlap : chatMessageRenderStyles.avatarNoOverlap, mergeStyles(styles?.chatItemMessageContainer)),\n      style: styles?.chatItemMessageContainer !== undefined ? createStyleFromV8Style(styles?.chatItemMessageContainer) : {}\n    };\n  }, [chatMessageRenderStyles.bodyCommon, chatMessageRenderStyles.bodyWithoutAvatar, chatMessageRenderStyles.bodyHiddenAvatar, chatMessageRenderStyles.bodyWithAvatar, chatMessageRenderStyles.avatarOverlap, chatMessageRenderStyles.avatarNoOverlap, shouldShowAvatar, avatar, shouldOverlapAvatarAndMessage, styles?.chatItemMessageContainer]);\n\n  // Fluent UI message components are used here as for default message renderer,\n  // timestamp and author name should be shown but they aren't shown for custom renderer.\n  // More investigations are needed to check if this can be simplified with states.\n  // Avatar should be shown for both custom and default renderers.\n  return <FluentChatMessage attached={attached} root={messageRootProps} body={messageBodyProps} avatar={avatar}>\n      {messageRenderer({\n      ...props\n    })}\n    </FluentChatMessage>;\n};"]}

package/dist/dist-esm/react-components/src/components/ChatMessage/MyMessageComponents/ChatMessageComponentAsEditBox.d.ts

@@ -6,7 +6,7 @@ import { MentionLookupOptions } from '../../MentionPopover';
 /** @private */
 export type ChatMessageComponentAsEditBoxProps = {
     onCancel?: (messageId: string) => void;
-    onSubmit: (text: string, /* @conditional-compile-remove(file-sharing-acs) */ attachmentMetadata?: AttachmentMetadata[]) => void;
+    onSubmit: (text: string, attachmentMetadata?: AttachmentMetadata[]) => void;
     message: ChatMessage;
     strings: MessageThreadStrings;
     mentionLookupOptions?: MentionLookupOptions;

package/dist/dist-esm/react-components/src/components/ChatMessage/MyMessageComponents/ChatMessageComponentAsEditBox.js

@@ -6,20 +6,16 @@ import { mergeClasses } from '@fluentui/react-components';
 import { _formatString } from "../../../../../acs-ui-common/src";
 import { useTheme } from '../../../theming/FluentThemeProvider';
 import React, { useCallback, useEffect, useMemo, useState } from 'react';
-/* @conditional-compile-remove(file-sharing-acs) */
 import { useReducer } from 'react';
 import { editBoxStyle, editingButtonStyle, editBoxStyleSet, inputBoxIcon } from '../../styles/EditBox.styles';
 import { InputBoxComponent } from '../../InputBoxComponent';
 import { InputBoxButton } from '../../InputBoxButton';
 import { useChatMyMessageStyles } from '../../styles/MessageThread.styles';
-/* @conditional-compile-remove(file-sharing-acs) */
 import { _AttachmentUploadCards } from '../../Attachment/AttachmentUploadCards';
 import { chatMessageFailedTagStyle, editChatMessageFailedTagStyle, chatMessageFailedTagStackItemStyle, editChatMessageButtonsStackStyle, useChatMessageEditContainerStyles } from '../../styles/ChatMessageComponent.styles';
 import { MAXIMUM_LENGTH_OF_MESSAGE } from '../../utils/SendBoxUtils';
-/* @conditional-compile-remove(file-sharing-acs) */
 import { attachmentMetadataReducer, doesMessageContainMultipleAttachments } from '../../utils/ChatMessageComponentAsEditBoxUtils';
 import { getMessageState, onRenderCancelIcon, onRenderSubmitIcon } from '../../utils/ChatMessageComponentAsEditBoxUtils';
-/* @conditional-compile-remove(file-sharing-acs) */
 import { getMessageWithAttachmentMetadata } from '../../utils/ChatMessageComponentAsEditBoxUtils';
 /**
  * @private
@@ -27,14 +23,12 @@ import { getMessageWithAttachmentMetadata } from '../../utils/ChatMessageCompone
 export const ChatMessageComponentAsEditBox = (props) => {
     var _a;
     const { onCancel, onSubmit, strings, message } = props;
-    /* @conditional-compile-remove(mention) */
     const { mentionLookupOptions } = props;
     const [textValue, setTextValue] = useState(message.content || '');
-    /* @conditional-compile-remove(file-sharing-acs) */
     const [attachmentMetadata, handleAttachmentAction] = useReducer(attachmentMetadataReducer, (_a = getMessageWithAttachmentMetadata(message)) !== null && _a !== void 0 ? _a : []);
     const editTextFieldRef = React.useRef(null);
     const theme = useTheme();
-    const messageState = getMessageState(textValue, /* @conditional-compile-remove(file-sharing-acs) */ attachmentMetadata !== null && attachmentMetadata !== void 0 ? attachmentMetadata : []);
+    const messageState = getMessageState(textValue, attachmentMetadata !== null && attachmentMetadata !== void 0 ? attachmentMetadata : []);
     const submitEnabled = messageState === 'OK';
     const editContainerStyles = useChatMessageEditContainerStyles();
     const chatMyMessageStyles = useChatMyMessageStyles();
@@ -60,7 +54,6 @@ export const ChatMessageComponentAsEditBox = (props) => {
     const onRenderThemedSubmitIcon = useCallback((isHover) => {
         return onRenderSubmitIcon(iconClassName(isHover));
     }, [iconClassName]);
-    /* @conditional-compile-remove(file-sharing-acs) */
     const hasMultipleAttachments = useMemo(() => {
         return doesMessageContainMultipleAttachments(message);
     }, [message]);
@@ -71,7 +64,6 @@ export const ChatMessageComponentAsEditBox = (props) => {
             }
         });
     }, [theme.palette.themePrimary]);
-    /* @conditional-compile-remove(file-sharing-acs) */
     const onRenderAttachmentUploads = useCallback(() => {
         return !!attachmentMetadata && attachmentMetadata.length > 0 && React.createElement("div", { style: {
                 margin: '0.25rem'
@@ -93,9 +85,8 @@ export const ChatMessageComponentAsEditBox = (props) => {
                         ev.stopPropagation();
                     }
                 }, onEnterKeyDown: () => {
-                    submitEnabled && onSubmit(textValue, /* @conditional-compile-remove(file-sharing-acs) */ attachmentMetadata);
-                }, supportNewline: false, maxLength: MAXIMUM_LENGTH_OF_MESSAGE, errorMessage: textTooLongMessage, styles: editBoxStyles, 
-                /* @conditional-compile-remove(mention) */ mentionLookupOptions: mentionLookupOptions }),
+                    submitEnabled && onSubmit(textValue, attachmentMetadata);
+                }, supportNewline: false, maxLength: MAXIMUM_LENGTH_OF_MESSAGE, errorMessage: textTooLongMessage, styles: editBoxStyles, mentionLookupOptions: mentionLookupOptions }),
             React.createElement(Stack, { horizontal: true, horizontalAlign: "end", className: editChatMessageButtonsStackStyle, tokens: {
                     childrenGap: '0.25rem'
                 } },
@@ -111,14 +102,14 @@ export const ChatMessageComponentAsEditBox = (props) => {
                             // so when user remvoes all attachments, UI can reflect it instantly
                             // if you set it to undefined, the attachments pre-edited would still be there
                             // until edit message event is received
-                            submitEnabled && onSubmit(textValue, /* @conditional-compile-remove(file-sharing-acs) */ attachmentMetadata);
+                            submitEnabled && onSubmit(textValue, attachmentMetadata);
                             e.stopPropagation();
-                        }, id: 'submitIconWrapper' }))), /* @conditional-compile-remove(file-sharing-acs) */
+                        }, id: 'submitIconWrapper' }))),
             onRenderAttachmentUploads());
     };
     const attached = message.attached === true ? 'center' : message.attached === 'bottom' ? 'bottom' : 'top';
     return React.createElement(ChatMyMessage, { attached: attached, root: {
-            className: mergeClasses(chatMyMessageStyles.root, /* @conditional-compile-remove(file-sharing-acs) */ hasMultipleAttachments ? chatMyMessageStyles.multipleAttachmentsInEditing : undefined)
+            className: mergeClasses(chatMyMessageStyles.root, hasMultipleAttachments ? chatMyMessageStyles.multipleAttachmentsInEditing : undefined)
         }, body: {
             className: mergeClasses(editContainerStyles.body, message.failureReason !== undefined ? editContainerStyles.bodyError : editContainerStyles.bodyDefault, attached !== 'top' ? editContainerStyles.bodyAttached : undefined)
         } }, getContent());

package/dist/dist-esm/react-components/src/components/ChatMessage/MyMessageComponents/ChatMessageComponentAsEditBox.js.map

@@ -1 +1 @@
-{"version":3,"file":"ChatMessageComponentAsEditBox.js","sourceRoot":"","sources":["../../../../../../../preprocess-dist/react-components/src/components/ChatMessage/MyMessageComponents/ChatMessageComponentAsEditBox.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { concatStyleSets, ITextField, mergeStyles, Stack } from '@fluentui/react';\nimport { ChatMyMessage } from '@fluentui-contrib/react-chat';\nimport { mergeClasses } from '@fluentui/react-components';\nimport { _formatString } from '@internal/acs-ui-common';\nimport { useTheme } from '../../../theming/FluentThemeProvider';\nimport React, { useCallback, useEffect, useMemo, useState } from 'react';\n/* @conditional-compile-remove(file-sharing-acs) */\nimport { useReducer } from 'react';\nimport { editBoxStyle, editingButtonStyle, editBoxStyleSet, inputBoxIcon } from '../../styles/EditBox.styles';\nimport { InputBoxComponent } from '../../InputBoxComponent';\nimport { InputBoxButton } from '../../InputBoxButton';\nimport { MessageThreadStrings } from '../../MessageThread';\nimport { useChatMyMessageStyles } from '../../styles/MessageThread.styles';\nimport { ChatMessage } from '../../../types';\n/* @conditional-compile-remove(file-sharing-acs) */\nimport { _AttachmentUploadCards } from '../../Attachment/AttachmentUploadCards';\n/* @conditional-compile-remove(file-sharing-acs) */\nimport { AttachmentMetadata } from '@internal/acs-ui-common';\nimport { chatMessageFailedTagStyle, editChatMessageFailedTagStyle, chatMessageFailedTagStackItemStyle, editChatMessageButtonsStackStyle, useChatMessageEditContainerStyles } from '../../styles/ChatMessageComponent.styles';\n/* @conditional-compile-remove(mention) */\nimport { MentionLookupOptions } from '../../MentionPopover';\nimport { MAXIMUM_LENGTH_OF_MESSAGE } from '../../utils/SendBoxUtils';\n/* @conditional-compile-remove(file-sharing-acs) */\nimport { attachmentMetadataReducer, doesMessageContainMultipleAttachments } from '../../utils/ChatMessageComponentAsEditBoxUtils';\nimport { getMessageState, onRenderCancelIcon, onRenderSubmitIcon } from '../../utils/ChatMessageComponentAsEditBoxUtils';\n/* @conditional-compile-remove(file-sharing-acs) */\nimport { getMessageWithAttachmentMetadata } from '../../utils/ChatMessageComponentAsEditBoxUtils';\n\n/** @private */\nexport type ChatMessageComponentAsEditBoxProps = {\n  onCancel?: (messageId: string) => void;\n  onSubmit: (text: string, /* @conditional-compile-remove(file-sharing-acs) */\n  attachmentMetadata?: AttachmentMetadata[]) => void;\n  message: ChatMessage;\n  strings: MessageThreadStrings;\n  /* @conditional-compile-remove(mention) */\n  mentionLookupOptions?: MentionLookupOptions;\n};\n\n/**\n * @private\n */\nexport const ChatMessageComponentAsEditBox = (props: ChatMessageComponentAsEditBoxProps): JSX.Element => {\n  const {\n    onCancel,\n    onSubmit,\n    strings,\n    message\n  } = props;\n  /* @conditional-compile-remove(mention) */\n  const {\n    mentionLookupOptions\n  } = props;\n  const [textValue, setTextValue] = useState<string>(message.content || '');\n  /* @conditional-compile-remove(file-sharing-acs) */\n  const [attachmentMetadata, handleAttachmentAction] = useReducer(attachmentMetadataReducer, getMessageWithAttachmentMetadata(message) ?? []);\n  const editTextFieldRef = React.useRef<ITextField>(null);\n  const theme = useTheme();\n  const messageState = getMessageState(textValue, /* @conditional-compile-remove(file-sharing-acs) */attachmentMetadata ?? []);\n  const submitEnabled = messageState === 'OK';\n  const editContainerStyles = useChatMessageEditContainerStyles();\n  const chatMyMessageStyles = useChatMyMessageStyles();\n  useEffect(() => {\n    editTextFieldRef.current?.focus();\n  }, []);\n  const setText = (event?: React.FormEvent<HTMLInputElement | HTMLTextAreaElement>, newValue?: string): void => {\n    setTextValue(newValue ?? '');\n  };\n  const textTooLongMessage = messageState === 'too long' ? _formatString(strings.editBoxTextLimit, {\n    limitNumber: `${MAXIMUM_LENGTH_OF_MESSAGE}`\n  }) : undefined;\n  const iconClassName = useCallback((isHover: boolean) => {\n    const color = isHover ? theme.palette.accent : theme.palette.neutralSecondary;\n    return mergeStyles(inputBoxIcon, {\n      color\n    });\n  }, [theme.palette.accent, theme.palette.neutralSecondary]);\n  const onRenderThemedCancelIcon = useCallback((isHover: boolean) => {\n    return onRenderCancelIcon(iconClassName(isHover));\n  }, [iconClassName]);\n  const onRenderThemedSubmitIcon = useCallback((isHover: boolean) => {\n    return onRenderSubmitIcon(iconClassName(isHover));\n  }, [iconClassName]);\n\n  /* @conditional-compile-remove(file-sharing-acs) */\n  const hasMultipleAttachments = useMemo(() => {\n    return doesMessageContainMultipleAttachments(message);\n  }, [message]);\n  const editBoxStyles = useMemo(() => {\n    return concatStyleSets(editBoxStyleSet, {\n      textField: {\n        borderColor: theme.palette.themePrimary\n      }\n    });\n  }, [theme.palette.themePrimary]);\n\n  /* @conditional-compile-remove(file-sharing-acs) */\n  const onRenderAttachmentUploads = useCallback(() => {\n    return !!attachmentMetadata && attachmentMetadata.length > 0 && <div style={{\n      margin: '0.25rem'\n    }}>\n          <_AttachmentUploadCards attachments={attachmentMetadata} onCancelAttachmentUpload={id => {\n        // edit box only capable of removing attachments\n        // we need to expand attachment actions\n        // if we want to support more actions e.g. add\n        handleAttachmentAction({\n          type: 'remove',\n          id\n        });\n      }} />\n        </div>;\n  }, [attachmentMetadata]);\n  const getContent = (): JSX.Element => {\n    return <>\n        <InputBoxComponent data-ui-id=\"edit-box\" textFieldRef={editTextFieldRef} inputClassName={editBoxStyle} placeholderText={strings.editBoxPlaceholderText} textValue={textValue} onChange={setText} onKeyDown={ev => {\n        if (ev.key === 'ArrowUp' || ev.key === 'ArrowDown') {\n          ev.stopPropagation();\n        }\n      }} onEnterKeyDown={() => {\n        submitEnabled && onSubmit(textValue, /* @conditional-compile-remove(file-sharing-acs) */\n        attachmentMetadata);\n      }} supportNewline={false} maxLength={MAXIMUM_LENGTH_OF_MESSAGE} errorMessage={textTooLongMessage} styles={editBoxStyles}\n      /* @conditional-compile-remove(mention) */ mentionLookupOptions={mentionLookupOptions}></InputBoxComponent>\n        <Stack horizontal horizontalAlign=\"end\" className={editChatMessageButtonsStackStyle} tokens={{\n        childrenGap: '0.25rem'\n      }}>\n          {message.failureReason && <Stack.Item grow align=\"stretch\" className={chatMessageFailedTagStackItemStyle}>\n              <div className={mergeStyles(chatMessageFailedTagStyle(theme), editChatMessageFailedTagStyle)}>\n                {message.failureReason}\n              </div>\n            </Stack.Item>}\n          <Stack.Item align=\"end\">\n            <InputBoxButton className={editingButtonStyle} ariaLabel={strings.editBoxCancelButton} tooltipContent={strings.editBoxCancelButton} onRenderIcon={onRenderThemedCancelIcon} onClick={() => {\n            onCancel && onCancel(message.messageId);\n          }} id={'dismissIconWrapper'} />\n          </Stack.Item>\n          <Stack.Item align=\"end\">\n            <InputBoxButton className={editingButtonStyle} ariaLabel={strings.editBoxSubmitButton} tooltipContent={strings.editBoxSubmitButton} onRenderIcon={onRenderThemedSubmitIcon} onClick={e => {\n            // it's very important to pass an empty attachment here\n            // so when user remvoes all attachments, UI can reflect it instantly\n            // if you set it to undefined, the attachments pre-edited would still be there\n            // until edit message event is received\n            submitEnabled && onSubmit(textValue, /* @conditional-compile-remove(file-sharing-acs) */attachmentMetadata);\n            e.stopPropagation();\n          }} id={'submitIconWrapper'} />\n          </Stack.Item>\n        </Stack>\n        {/* @conditional-compile-remove(file-sharing-acs) */onRenderAttachmentUploads()}\n      </>;\n  };\n  const attached = message.attached === true ? 'center' : message.attached === 'bottom' ? 'bottom' : 'top';\n  return <ChatMyMessage attached={attached} root={{\n    className: mergeClasses(chatMyMessageStyles.root, /* @conditional-compile-remove(file-sharing-acs) */\n    hasMultipleAttachments ? chatMyMessageStyles.multipleAttachmentsInEditing : undefined)\n  }} body={{\n    className: mergeClasses(editContainerStyles.body, message.failureReason !== undefined ? editContainerStyles.bodyError : editContainerStyles.bodyDefault, attached !== 'top' ? editContainerStyles.bodyAttached : undefined)\n  }}>\n      {getContent()}\n    </ChatMyMessage>;\n};"]}
+{"version":3,"file":"ChatMessageComponentAsEditBox.js","sourceRoot":"","sources":["../../../../../../../preprocess-dist/react-components/src/components/ChatMessage/MyMessageComponents/ChatMessageComponentAsEditBox.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { concatStyleSets, ITextField, mergeStyles, Stack } from '@fluentui/react';\nimport { ChatMyMessage } from '@fluentui-contrib/react-chat';\nimport { mergeClasses } from '@fluentui/react-components';\nimport { _formatString } from '@internal/acs-ui-common';\nimport { useTheme } from '../../../theming/FluentThemeProvider';\nimport React, { useCallback, useEffect, useMemo, useState } from 'react';\nimport { useReducer } from 'react';\nimport { editBoxStyle, editingButtonStyle, editBoxStyleSet, inputBoxIcon } from '../../styles/EditBox.styles';\nimport { InputBoxComponent } from '../../InputBoxComponent';\nimport { InputBoxButton } from '../../InputBoxButton';\nimport { MessageThreadStrings } from '../../MessageThread';\nimport { useChatMyMessageStyles } from '../../styles/MessageThread.styles';\nimport { ChatMessage } from '../../../types';\nimport { _AttachmentUploadCards } from '../../Attachment/AttachmentUploadCards';\nimport { AttachmentMetadata } from '@internal/acs-ui-common';\nimport { chatMessageFailedTagStyle, editChatMessageFailedTagStyle, chatMessageFailedTagStackItemStyle, editChatMessageButtonsStackStyle, useChatMessageEditContainerStyles } from '../../styles/ChatMessageComponent.styles';\nimport { MentionLookupOptions } from '../../MentionPopover';\nimport { MAXIMUM_LENGTH_OF_MESSAGE } from '../../utils/SendBoxUtils';\nimport { attachmentMetadataReducer, doesMessageContainMultipleAttachments } from '../../utils/ChatMessageComponentAsEditBoxUtils';\nimport { getMessageState, onRenderCancelIcon, onRenderSubmitIcon } from '../../utils/ChatMessageComponentAsEditBoxUtils';\nimport { getMessageWithAttachmentMetadata } from '../../utils/ChatMessageComponentAsEditBoxUtils';\n\n/** @private */\nexport type ChatMessageComponentAsEditBoxProps = {\n  onCancel?: (messageId: string) => void;\n  onSubmit: (text: string, attachmentMetadata?: AttachmentMetadata[]) => void;\n  message: ChatMessage;\n  strings: MessageThreadStrings;\n  mentionLookupOptions?: MentionLookupOptions;\n};\n\n/**\n * @private\n */\nexport const ChatMessageComponentAsEditBox = (props: ChatMessageComponentAsEditBoxProps): JSX.Element => {\n  const {\n    onCancel,\n    onSubmit,\n    strings,\n    message\n  } = props;\n  const {\n    mentionLookupOptions\n  } = props;\n  const [textValue, setTextValue] = useState<string>(message.content || '');\n  const [attachmentMetadata, handleAttachmentAction] = useReducer(attachmentMetadataReducer, getMessageWithAttachmentMetadata(message) ?? []);\n  const editTextFieldRef = React.useRef<ITextField>(null);\n  const theme = useTheme();\n  const messageState = getMessageState(textValue, attachmentMetadata ?? []);\n  const submitEnabled = messageState === 'OK';\n  const editContainerStyles = useChatMessageEditContainerStyles();\n  const chatMyMessageStyles = useChatMyMessageStyles();\n  useEffect(() => {\n    editTextFieldRef.current?.focus();\n  }, []);\n  const setText = (event?: React.FormEvent<HTMLInputElement | HTMLTextAreaElement>, newValue?: string): void => {\n    setTextValue(newValue ?? '');\n  };\n  const textTooLongMessage = messageState === 'too long' ? _formatString(strings.editBoxTextLimit, {\n    limitNumber: `${MAXIMUM_LENGTH_OF_MESSAGE}`\n  }) : undefined;\n  const iconClassName = useCallback((isHover: boolean) => {\n    const color = isHover ? theme.palette.accent : theme.palette.neutralSecondary;\n    return mergeStyles(inputBoxIcon, {\n      color\n    });\n  }, [theme.palette.accent, theme.palette.neutralSecondary]);\n  const onRenderThemedCancelIcon = useCallback((isHover: boolean) => {\n    return onRenderCancelIcon(iconClassName(isHover));\n  }, [iconClassName]);\n  const onRenderThemedSubmitIcon = useCallback((isHover: boolean) => {\n    return onRenderSubmitIcon(iconClassName(isHover));\n  }, [iconClassName]);\n  const hasMultipleAttachments = useMemo(() => {\n    return doesMessageContainMultipleAttachments(message);\n  }, [message]);\n  const editBoxStyles = useMemo(() => {\n    return concatStyleSets(editBoxStyleSet, {\n      textField: {\n        borderColor: theme.palette.themePrimary\n      }\n    });\n  }, [theme.palette.themePrimary]);\n  const onRenderAttachmentUploads = useCallback(() => {\n    return !!attachmentMetadata && attachmentMetadata.length > 0 && <div style={{\n      margin: '0.25rem'\n    }}>\n          <_AttachmentUploadCards attachments={attachmentMetadata} onCancelAttachmentUpload={id => {\n        // edit box only capable of removing attachments\n        // we need to expand attachment actions\n        // if we want to support more actions e.g. add\n        handleAttachmentAction({\n          type: 'remove',\n          id\n        });\n      }} />\n        </div>;\n  }, [attachmentMetadata]);\n  const getContent = (): JSX.Element => {\n    return <>\n        <InputBoxComponent data-ui-id=\"edit-box\" textFieldRef={editTextFieldRef} inputClassName={editBoxStyle} placeholderText={strings.editBoxPlaceholderText} textValue={textValue} onChange={setText} onKeyDown={ev => {\n        if (ev.key === 'ArrowUp' || ev.key === 'ArrowDown') {\n          ev.stopPropagation();\n        }\n      }} onEnterKeyDown={() => {\n        submitEnabled && onSubmit(textValue, attachmentMetadata);\n      }} supportNewline={false} maxLength={MAXIMUM_LENGTH_OF_MESSAGE} errorMessage={textTooLongMessage} styles={editBoxStyles} mentionLookupOptions={mentionLookupOptions}></InputBoxComponent>\n        <Stack horizontal horizontalAlign=\"end\" className={editChatMessageButtonsStackStyle} tokens={{\n        childrenGap: '0.25rem'\n      }}>\n          {message.failureReason && <Stack.Item grow align=\"stretch\" className={chatMessageFailedTagStackItemStyle}>\n              <div className={mergeStyles(chatMessageFailedTagStyle(theme), editChatMessageFailedTagStyle)}>\n                {message.failureReason}\n              </div>\n            </Stack.Item>}\n          <Stack.Item align=\"end\">\n            <InputBoxButton className={editingButtonStyle} ariaLabel={strings.editBoxCancelButton} tooltipContent={strings.editBoxCancelButton} onRenderIcon={onRenderThemedCancelIcon} onClick={() => {\n            onCancel && onCancel(message.messageId);\n          }} id={'dismissIconWrapper'} />\n          </Stack.Item>\n          <Stack.Item align=\"end\">\n            <InputBoxButton className={editingButtonStyle} ariaLabel={strings.editBoxSubmitButton} tooltipContent={strings.editBoxSubmitButton} onRenderIcon={onRenderThemedSubmitIcon} onClick={e => {\n            // it's very important to pass an empty attachment here\n            // so when user remvoes all attachments, UI can reflect it instantly\n            // if you set it to undefined, the attachments pre-edited would still be there\n            // until edit message event is received\n            submitEnabled && onSubmit(textValue, attachmentMetadata);\n            e.stopPropagation();\n          }} id={'submitIconWrapper'} />\n          </Stack.Item>\n        </Stack>\n        {onRenderAttachmentUploads()}\n      </>;\n  };\n  const attached = message.attached === true ? 'center' : message.attached === 'bottom' ? 'bottom' : 'top';\n  return <ChatMyMessage attached={attached} root={{\n    className: mergeClasses(chatMyMessageStyles.root, hasMultipleAttachments ? chatMyMessageStyles.multipleAttachmentsInEditing : undefined)\n  }} body={{\n    className: mergeClasses(editContainerStyles.body, message.failureReason !== undefined ? editContainerStyles.bodyError : editContainerStyles.bodyDefault, attached !== 'top' ? editContainerStyles.bodyAttached : undefined)\n  }}>\n      {getContent()}\n    </ChatMyMessage>;\n};"]}

package/dist/dist-esm/react-components/src/components/ChatMessage/MyMessageComponents/ChatMessageComponentAsEditBoxPicker.d.ts

@@ -5,13 +5,6 @@ import { AttachmentMetadataInProgress } from "../../../../../acs-ui-common/src";
 import { MessageThreadStrings } from '../../MessageThread';
 import { MentionLookupOptions } from '../../MentionPopover';
 import type { ChatMessageComponentAsRichTextEditBoxProps } from './ChatMessageComponentAsRichTextEditBox';
-/**
- * @private
- * Use this function to load RoosterJS dependencies early in the lifecycle.
- * It should be the same import as used for lazy loading.
- *
- * @conditional-compile-remove(rich-text-editor)
- */
 export declare const loadChatMessageComponentAsRichTextEditBox: () => Promise<{
     default: React.ComponentType<ChatMessageComponentAsRichTextEditBoxProps>;
 }>;
@@ -20,7 +13,7 @@ export declare const loadChatMessageComponentAsRichTextEditBox: () => Promise<{
  */
 export type ChatMessageComponentAsEditBoxPickerProps = {
     onCancel?: (messageId: string) => void;
-    onSubmit: (text: string, /* @conditional-compile-remove(file-sharing-teams-interop) @conditional-compile-remove(file-sharing-acs) */ attachmentMetadata?: AttachmentMetadata[]) => void;
+    onSubmit: (text: string, attachmentMetadata?: AttachmentMetadata[]) => void;
     message: ChatMessage;
     strings: MessageThreadStrings;
     mentionLookupOptions?: MentionLookupOptions;

package/dist/dist-esm/react-components/src/components/ChatMessage/MyMessageComponents/ChatMessageComponentAsEditBoxPicker.js

@@ -1,20 +1,10 @@
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT License.
 import React, { useMemo } from 'react';
-/* @conditional-compile-remove(rich-text-editor) */
 import { Suspense } from 'react';
 import { ChatMessageComponentAsEditBox } from './ChatMessageComponentAsEditBox';
-/* @conditional-compile-remove(rich-text-editor) */
 import { _ErrorBoundary } from '../../ErrorBoundary';
-/* @conditional-compile-remove(rich-text-editor) */
 const ChatMessageComponentAsRichTextEditBox = React.lazy(() => import('./ChatMessageComponentAsRichTextEditBox'));
-/**
- * @private
- * Use this function to load RoosterJS dependencies early in the lifecycle.
- * It should be the same import as used for lazy loading.
- *
- * @conditional-compile-remove(rich-text-editor)
- */
 export const loadChatMessageComponentAsRichTextEditBox = () => import('./ChatMessageComponentAsRichTextEditBox');
 /**
  * @private
@@ -23,7 +13,6 @@ export const ChatMessageComponentAsEditBoxPicker = (props) => {
     const simpleEditBox = useMemo(() => {
         return React.createElement(ChatMessageComponentAsEditBox, Object.assign({}, props));
     }, [props]);
-    /* @conditional-compile-remove(rich-text-editor) */
     if (props.isRichTextEditorEnabled) {
         return React.createElement(_ErrorBoundary, { fallback: simpleEditBox },
             React.createElement(Suspense, { fallback: simpleEditBox },

package/dist/dist-esm/react-components/src/components/ChatMessage/MyMessageComponents/ChatMessageComponentAsEditBoxPicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"ChatMessageComponentAsEditBoxPicker.js","sourceRoot":"","sources":["../../../../../../../preprocess-dist/react-components/src/components/ChatMessage/MyMessageComponents/ChatMessageComponentAsEditBoxPicker.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AACvC,mDAAmD;AACnD,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAOjC,OAAO,EAAE,6BAA6B,EAAE,MAAM,iCAAiC,CAAC;AAKhF,mDAAmD;AACnD,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AAErD,mDAAmD;AACnD,MAAM,qCAAqC,GAAG,KAAK,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,MAAM,CAAC,yCAAyC,CAAC,CAAC,CAAC;AAElH;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,yCAAyC,GAAG,GAEtD,EAAE,CAAC,MAAM,CAAC,yCAAyC,CAAC,CAAC;AA2BxD;;GAEG;AACH,MAAM,CAAC,MAAM,mCAAmC,GAAG,CAAC,KAA+C,EAAe,EAAE;IAClH,MAAM,aAAa,GAAG,OAAO,CAAC,GAAG,EAAE;QACjC,OAAO,oBAAC,6BAA6B,oBAAK,KAAK,EAAI,CAAC;IACtD,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEZ,mDAAmD;IACnD,IAAI,KAAK,CAAC,uBAAuB,EAAE,CAAC;QAClC,OAAO,oBAAC,cAAc,IAAC,QAAQ,EAAE,aAAa;YAC1C,oBAAC,QAAQ,IAAC,QAAQ,EAAE,aAAa;gBAC/B,oBAAC,qCAAqC,oBAAK,KAAK,EAAI,CAC3C,CACI,CAAC;IACtB,CAAC;IACD,OAAO,aAAa,CAAC;AACvB,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React, { useMemo } from 'react';\n/* @conditional-compile-remove(rich-text-editor) */\nimport { Suspense } from 'react';\nimport { ChatMessage } from '../../../types';\n/* @conditional-compile-remove(file-sharing-teams-interop) @conditional-compile-remove(file-sharing-acs) */\nimport { AttachmentMetadata } from '@internal/acs-ui-common';\n/* @conditional-compile-remove(rich-text-editor-image-upload) */\nimport { AttachmentMetadataInProgress } from '@internal/acs-ui-common';\nimport { MessageThreadStrings } from '../../MessageThread';\nimport { ChatMessageComponentAsEditBox } from './ChatMessageComponentAsEditBox';\n/* @conditional-compile-remove(mention) */\nimport { MentionLookupOptions } from '../../MentionPopover';\n/* @conditional-compile-remove(rich-text-editor) */\nimport type { ChatMessageComponentAsRichTextEditBoxProps } from './ChatMessageComponentAsRichTextEditBox';\n/* @conditional-compile-remove(rich-text-editor) */\nimport { _ErrorBoundary } from '../../ErrorBoundary';\n\n/* @conditional-compile-remove(rich-text-editor) */\nconst ChatMessageComponentAsRichTextEditBox = React.lazy(() => import('./ChatMessageComponentAsRichTextEditBox'));\n\n/**\n * @private\n * Use this function to load RoosterJS dependencies early in the lifecycle.\n * It should be the same import as used for lazy loading.\n *\n * @conditional-compile-remove(rich-text-editor)\n */\nexport const loadChatMessageComponentAsRichTextEditBox = (): Promise<{\n  default: React.ComponentType<ChatMessageComponentAsRichTextEditBoxProps>;\n}> => import('./ChatMessageComponentAsRichTextEditBox');\n\n/**\n * @private\n */\nexport type ChatMessageComponentAsEditBoxPickerProps = {\n  onCancel?: (messageId: string) => void;\n  onSubmit: (text: string, /* @conditional-compile-remove(file-sharing-teams-interop) @conditional-compile-remove(file-sharing-acs) */\n  attachmentMetadata?: AttachmentMetadata[]) => void;\n  message: ChatMessage;\n  strings: MessageThreadStrings;\n  /* @conditional-compile-remove(mention) */\n  mentionLookupOptions?: MentionLookupOptions;\n  /* @conditional-compile-remove(rich-text-editor) */\n  isRichTextEditorEnabled?: boolean;\n  /* @conditional-compile-remove(rich-text-editor-image-upload) */\n  onPaste?: (event: {\n    content: DocumentFragment;\n  }) => void;\n  /* @conditional-compile-remove(rich-text-editor-image-upload) */\n  onRemoveInlineImage?: (imageAttributes: Record<string, string>, messageId: string) => void;\n  /* @conditional-compile-remove(rich-text-editor-image-upload) */\n  onInsertInlineImage?: (imageAttributes: Record<string, string>, messageId: string) => void;\n  /* @conditional-compile-remove(rich-text-editor-image-upload) */\n  inlineImagesWithProgress?: AttachmentMetadataInProgress[];\n};\n\n/**\n * @private\n */\nexport const ChatMessageComponentAsEditBoxPicker = (props: ChatMessageComponentAsEditBoxPickerProps): JSX.Element => {\n  const simpleEditBox = useMemo(() => {\n    return <ChatMessageComponentAsEditBox {...props} />;\n  }, [props]);\n\n  /* @conditional-compile-remove(rich-text-editor) */\n  if (props.isRichTextEditorEnabled) {\n    return <_ErrorBoundary fallback={simpleEditBox}>\n        <Suspense fallback={simpleEditBox}>\n          <ChatMessageComponentAsRichTextEditBox {...props} />\n        </Suspense>\n      </_ErrorBoundary>;\n  }\n  return simpleEditBox;\n};"]}
+{"version":3,"file":"ChatMessageComponentAsEditBoxPicker.js","sourceRoot":"","sources":["../../../../../../../preprocess-dist/react-components/src/components/ChatMessage/MyMessageComponents/ChatMessageComponentAsEditBoxPicker.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAKjC,OAAO,EAAE,6BAA6B,EAAE,MAAM,iCAAiC,CAAC;AAGhF,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AACrD,MAAM,qCAAqC,GAAG,KAAK,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,MAAM,CAAC,yCAAyC,CAAC,CAAC,CAAC;AAClH,MAAM,CAAC,MAAM,yCAAyC,GAAG,GAEtD,EAAE,CAAC,MAAM,CAAC,yCAAyC,CAAC,CAAC;AAoBxD;;GAEG;AACH,MAAM,CAAC,MAAM,mCAAmC,GAAG,CAAC,KAA+C,EAAe,EAAE;IAClH,MAAM,aAAa,GAAG,OAAO,CAAC,GAAG,EAAE;QACjC,OAAO,oBAAC,6BAA6B,oBAAK,KAAK,EAAI,CAAC;IACtD,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IACZ,IAAI,KAAK,CAAC,uBAAuB,EAAE,CAAC;QAClC,OAAO,oBAAC,cAAc,IAAC,QAAQ,EAAE,aAAa;YAC1C,oBAAC,QAAQ,IAAC,QAAQ,EAAE,aAAa;gBAC/B,oBAAC,qCAAqC,oBAAK,KAAK,EAAI,CAC3C,CACI,CAAC;IACtB,CAAC;IACD,OAAO,aAAa,CAAC;AACvB,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React, { useMemo } from 'react';\nimport { Suspense } from 'react';\nimport { ChatMessage } from '../../../types';\nimport { AttachmentMetadata } from '@internal/acs-ui-common';\nimport { AttachmentMetadataInProgress } from '@internal/acs-ui-common';\nimport { MessageThreadStrings } from '../../MessageThread';\nimport { ChatMessageComponentAsEditBox } from './ChatMessageComponentAsEditBox';\nimport { MentionLookupOptions } from '../../MentionPopover';\nimport type { ChatMessageComponentAsRichTextEditBoxProps } from './ChatMessageComponentAsRichTextEditBox';\nimport { _ErrorBoundary } from '../../ErrorBoundary';\nconst ChatMessageComponentAsRichTextEditBox = React.lazy(() => import('./ChatMessageComponentAsRichTextEditBox'));\nexport const loadChatMessageComponentAsRichTextEditBox = (): Promise<{\n  default: React.ComponentType<ChatMessageComponentAsRichTextEditBoxProps>;\n}> => import('./ChatMessageComponentAsRichTextEditBox');\n\n/**\n * @private\n */\nexport type ChatMessageComponentAsEditBoxPickerProps = {\n  onCancel?: (messageId: string) => void;\n  onSubmit: (text: string, attachmentMetadata?: AttachmentMetadata[]) => void;\n  message: ChatMessage;\n  strings: MessageThreadStrings;\n  mentionLookupOptions?: MentionLookupOptions;\n  isRichTextEditorEnabled?: boolean;\n  onPaste?: (event: {\n    content: DocumentFragment;\n  }) => void;\n  onRemoveInlineImage?: (imageAttributes: Record<string, string>, messageId: string) => void;\n  onInsertInlineImage?: (imageAttributes: Record<string, string>, messageId: string) => void;\n  inlineImagesWithProgress?: AttachmentMetadataInProgress[];\n};\n\n/**\n * @private\n */\nexport const ChatMessageComponentAsEditBoxPicker = (props: ChatMessageComponentAsEditBoxPickerProps): JSX.Element => {\n  const simpleEditBox = useMemo(() => {\n    return <ChatMessageComponentAsEditBox {...props} />;\n  }, [props]);\n  if (props.isRichTextEditorEnabled) {\n    return <_ErrorBoundary fallback={simpleEditBox}>\n        <Suspense fallback={simpleEditBox}>\n          <ChatMessageComponentAsRichTextEditBox {...props} />\n        </Suspense>\n      </_ErrorBoundary>;\n  }\n  return simpleEditBox;\n};"]}

package/dist/dist-esm/react-components/src/components/ChatMessage/MyMessageComponents/ChatMessageComponentAsRichTextEditBox.d.ts

@@ -6,7 +6,7 @@ import { AttachmentMetadata } from "../../../../../acs-ui-common/src";
 /** @private */
 export type ChatMessageComponentAsRichTextEditBoxProps = {
     onCancel?: (messageId: string) => void;
-    onSubmit: (text: string, /* @conditional-compile-remove(file-sharing-acs) */ attachmentMetadata?: AttachmentMetadata[]) => void;
+    onSubmit: (text: string, attachmentMetadata?: AttachmentMetadata[]) => void;
     message: ChatMessage;
     strings: MessageThreadStrings;
     onPaste?: (event: {