@azure/communication-react 1.18.0-alpha-202407151837 → 1.18.0-alpha-202407152347
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/dist-cjs/communication-react/{ChatMessageComponentAsRichTextEditBox-BC5-i-d1.js → ChatMessageComponentAsRichTextEditBox-xobTVN7n.js} +2 -2
- package/dist/dist-cjs/communication-react/{ChatMessageComponentAsRichTextEditBox-BC5-i-d1.js.map → ChatMessageComponentAsRichTextEditBox-xobTVN7n.js.map} +1 -1
- package/dist/dist-cjs/communication-react/{RichTextSendBoxWrapper-BRJ1IiiP.js → RichTextSendBoxWrapper-CyplcSgs.js} +2 -2
- package/dist/dist-cjs/communication-react/{RichTextSendBoxWrapper-BRJ1IiiP.js.map → RichTextSendBoxWrapper-CyplcSgs.js.map} +1 -1
- package/dist/dist-cjs/communication-react/{index-DrEOxdQw.js → index-B5m8DRMa.js} +83 -30
- package/dist/dist-cjs/communication-react/index-B5m8DRMa.js.map +1 -0
- package/dist/dist-cjs/communication-react/index.js +1 -1
- package/dist/dist-esm/acs-ui-common/src/common.js +10 -2
- package/dist/dist-esm/acs-ui-common/src/common.js.map +1 -1
- package/dist/dist-esm/acs-ui-common/src/telemetryVersion.js +1 -1
- package/dist/dist-esm/acs-ui-common/src/telemetryVersion.js.map +1 -1
- package/dist/dist-esm/chat-component-bindings/src/messageThreadSelector.js +10 -0
- package/dist/dist-esm/chat-component-bindings/src/messageThreadSelector.js.map +1 -1
- package/dist/dist-esm/react-components/src/components/ResponsiveHorizontalGallery.js +5 -1
- package/dist/dist-esm/react-components/src/components/ResponsiveHorizontalGallery.js.map +1 -1
- package/dist/dist-esm/react-components/src/components/ResponsiveVerticalGallery.js +5 -1
- package/dist/dist-esm/react-components/src/components/ResponsiveVerticalGallery.js.map +1 -1
- package/dist/dist-esm/react-components/src/components/RichTextEditor/RichTextEditor.js +21 -1
- package/dist/dist-esm/react-components/src/components/RichTextEditor/RichTextEditor.js.map +1 -1
- package/dist/dist-esm/react-components/src/components/styles/MessageThread.styles.js +6 -2
- package/dist/dist-esm/react-components/src/components/styles/MessageThread.styles.js.map +1 -1
- package/dist/dist-esm/react-components/src/components/styles/RichTextEditor.styles.d.ts +1 -1
- package/dist/dist-esm/react-components/src/components/styles/RichTextEditor.styles.js +9 -15
- package/dist/dist-esm/react-components/src/components/styles/RichTextEditor.styles.js.map +1 -1
- package/dist/dist-esm/react-components/src/components/utils/responsive.js +12 -2
- package/dist/dist-esm/react-components/src/components/utils/responsive.js.map +1 -1
- package/package.json +2 -2
- package/dist/dist-cjs/communication-react/index-DrEOxdQw.js.map +0 -1
@@ -4,7 +4,7 @@ var react = require('@fluentui/react');
|
|
4
4
|
var reactChat = require('@fluentui-contrib/react-chat');
|
5
5
|
var reactComponents = require('@fluentui/react-components');
|
6
6
|
require('@azure/communication-common');
|
7
|
-
var index = require('./index-
|
7
|
+
var index = require('./index-B5m8DRMa.js');
|
8
8
|
var React = require('react');
|
9
9
|
require('react-dom/client');
|
10
10
|
require('@azure/communication-chat');
|
@@ -197,4 +197,4 @@ const ChatMessageComponentAsRichTextEditBox = (props) => {
|
|
197
197
|
|
198
198
|
exports.ChatMessageComponentAsRichTextEditBox = ChatMessageComponentAsRichTextEditBox;
|
199
199
|
exports.default = ChatMessageComponentAsRichTextEditBox;
|
200
|
-
//# sourceMappingURL=ChatMessageComponentAsRichTextEditBox-
|
200
|
+
//# sourceMappingURL=ChatMessageComponentAsRichTextEditBox-xobTVN7n.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"ChatMessageComponentAsRichTextEditBox-BC5-i-d1.js","sources":["../../../../react-components/src/components/ChatMessage/MyMessageComponents/ChatMessageComponentAsRichTextEditBox.tsx"],"sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { 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';\n/* @conditional-compile-remove(rich-text-editor-image-upload) */\nimport { AttachmentMetadataInProgress } from '@internal/acs-ui-common';\nimport { useTheme } from '../../../theming';\nimport React, { useCallback, useEffect, useMemo, useState } from 'react';\n/* @conditional-compile-remove(file-sharing-acs) */\nimport { useReducer } from 'react';\nimport { editBoxWidthStyles, richTextEditBoxActionButtonIcon } from '../../styles/EditBox.styles';\nimport { InputBoxButton } from '../../InputBoxButton';\nimport { MessageThreadStrings } from '../../MessageThread';\nimport { useChatMyMessageStyles } from '../../styles/MessageThread.styles';\nimport { ChatMessage } from '../../../types';\nimport { _AttachmentUploadCards } from '../../Attachment/AttachmentUploadCards';\n/* @conditional-compile-remove(file-sharing-acs) */\nimport { AttachmentMetadata } from '@internal/acs-ui-common';\nimport { useChatMessageRichTextEditContainerStyles } from '../../styles/ChatMessageComponent.styles';\nimport { MAXIMUM_LENGTH_OF_MESSAGE } from '../../utils/SendBoxUtils';\n/* @conditional-compile-remove(rich-text-editor-image-upload) */\nimport {\n cancelInlineImageUpload,\n hasIncompleteAttachmentUploads,\n insertImagesToContentString,\n isAttachmentUploadCompleted\n} from '../../utils/SendBoxUtils';\nimport {\n getMessageState,\n onRenderCancelIcon,\n onRenderSubmitIcon\n} from '../../utils/ChatMessageComponentAsEditBoxUtils';\n/* @conditional-compile-remove(file-sharing-acs) */\nimport {\n attachmentMetadataReducer,\n getMessageWithAttachmentMetadata,\n doesMessageContainMultipleAttachments\n} from '../../utils/ChatMessageComponentAsEditBoxUtils';\nimport { RichTextEditorComponentRef } from '../../RichTextEditor/RichTextEditor';\nimport { RichTextInputBoxComponent } from '../../RichTextEditor/RichTextInputBoxComponent';\nimport { editBoxRichTextEditorStyle, richTextActionButtonsStyle } from '../../styles/RichTextEditor.styles';\nimport { RichTextSendBoxErrors } from '../../RichTextEditor/RichTextSendBoxErrors';\nimport { useLocale } from '../../../localization';\n/* @conditional-compile-remove(file-sharing-acs) */\nimport { FluentV9ThemeProvider } from '../../../theming/FluentV9ThemeProvider';\n/* @conditional-compile-remove(file-sharing-acs) */\nimport { attachmentUploadCardsStyles } from '../../styles/SendBox.styles';\n/* @conditional-compile-remove(rich-text-editor-image-upload) */\nimport { SendBoxErrorBarError } from '../../SendBoxErrorBar';\n\n/** @private */\nexport type ChatMessageComponentAsRichTextEditBoxProps = {\n onCancel?: (messageId: string) => void;\n onSubmit: (\n text: string,\n /* @conditional-compile-remove(file-sharing-acs) */\n attachmentMetadata?: AttachmentMetadata[]\n ) => void;\n message: ChatMessage;\n strings: MessageThreadStrings;\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n onPaste?: (event: { content: DocumentFragment }) => void;\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n onCancelInlineImageUpload?: (imageId: string) => void;\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n onUploadInlineImage?: (imageUrl: string, imageFileName: string) => void;\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n imageUploadsInProgress?: AttachmentMetadataInProgress[];\n};\n\n/**\n * @private\n */\nexport const ChatMessageComponentAsRichTextEditBox = (\n props: ChatMessageComponentAsRichTextEditBoxProps\n): JSX.Element => {\n const {\n onCancel,\n onSubmit,\n strings,\n message,\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n onPaste,\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n onUploadInlineImage,\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n imageUploadsInProgress,\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n onCancelInlineImageUpload\n } = props;\n\n const [textValue, setTextValue] = useState<string>(message.content || '');\n /* @conditional-compile-remove(file-sharing-acs) */\n const [attachmentMetadata, handleAttachmentAction] = useReducer(\n attachmentMetadataReducer,\n getMessageWithAttachmentMetadata(message) ?? []\n );\n\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n const [attachmentUploadsPendingError, setAttachmentUploadsPendingError] = useState<SendBoxErrorBarError | undefined>(\n undefined\n );\n const editTextFieldRef = React.useRef<RichTextEditorComponentRef>(null);\n const theme = useTheme();\n const messageState = useMemo(() => {\n return getMessageState(textValue, /* @conditional-compile-remove(file-sharing-acs) */ attachmentMetadata ?? []);\n }, [/* @conditional-compile-remove(file-sharing-acs) */ attachmentMetadata, textValue]);\n\n const submitEnabled = messageState === 'OK';\n\n const editContainerStyles = useChatMessageRichTextEditContainerStyles();\n const chatMyMessageStyles = useChatMyMessageStyles();\n const locale = useLocale().strings;\n\n const setText = useCallback((newValue?: string): void => {\n setTextValue(newValue ?? '');\n }, []);\n\n useEffect(() => {\n editTextFieldRef.current?.focus();\n }, []);\n\n const textTooLongMessage = useMemo(() => {\n return messageState === 'too long'\n ? _formatString(strings.editBoxTextLimit, { limitNumber: `${MAXIMUM_LENGTH_OF_MESSAGE}` })\n : undefined;\n }, [messageState, strings.editBoxTextLimit]);\n\n const iconClassName = useCallback(\n (isHover: boolean) => {\n const color = isHover ? theme.palette.accent : theme.palette.neutralSecondary;\n return mergeStyles(richTextEditBoxActionButtonIcon, { color });\n },\n [theme.palette.accent, theme.palette.neutralSecondary]\n );\n\n const onRenderThemedCancelIcon = useCallback(\n (isHover: boolean) => {\n return onRenderCancelIcon(iconClassName(isHover));\n },\n [iconClassName]\n );\n\n const onRenderThemedSubmitIcon = useCallback(\n (isHover: boolean) => {\n return onRenderSubmitIcon(iconClassName(isHover));\n },\n [iconClassName]\n );\n\n /* @conditional-compile-remove(file-sharing-acs) */\n const hasMultipleAttachments = useMemo(() => {\n return doesMessageContainMultipleAttachments(message);\n }, [message]);\n\n const onSubmitHandler = useCallback((): void => {\n if (!submitEnabled) {\n return;\n }\n // Don't send message until all attachments have been uploaded successfully\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n setAttachmentUploadsPendingError(undefined);\n\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n if (hasIncompleteAttachmentUploads(imageUploadsInProgress)) {\n setAttachmentUploadsPendingError({ message: strings.attachmentUploadsPendingError, timestamp: Date.now() });\n return;\n }\n\n let content = textValue;\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n if (isAttachmentUploadCompleted(imageUploadsInProgress)) {\n content = insertImagesToContentString(textValue, imageUploadsInProgress);\n }\n // it's very important to pass an empty attachment here\n // so when user removes 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 onSubmit(content, /* @conditional-compile-remove(file-sharing-acs) */ attachmentMetadata || []);\n }, [\n submitEnabled,\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n imageUploadsInProgress,\n textValue,\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n strings.attachmentUploadsPendingError,\n onSubmit,\n /* @conditional-compile-remove(file-sharing-acs) */\n attachmentMetadata\n ]);\n\n const actionButtons = useMemo(() => {\n return (\n <Stack horizontal>\n <InputBoxButton\n className={richTextActionButtonsStyle}\n ariaLabel={strings.editBoxCancelButton}\n tooltipContent={strings.editBoxCancelButton}\n onRenderIcon={onRenderThemedCancelIcon}\n onClick={() => {\n onCancel && onCancel(message.messageId);\n }}\n id={'dismissIconWrapper'}\n data-testId={strings.editBoxCancelButton}\n />\n <InputBoxButton\n className={richTextActionButtonsStyle}\n ariaLabel={strings.editBoxSubmitButton}\n tooltipContent={strings.editBoxSubmitButton}\n onRenderIcon={onRenderThemedSubmitIcon}\n onClick={(e) => {\n onSubmitHandler();\n e.stopPropagation();\n }}\n id={'submitIconWrapper'}\n data-testId={strings.editBoxSubmitButton}\n />\n </Stack>\n );\n }, [\n message.messageId,\n onCancel,\n onRenderThemedCancelIcon,\n onRenderThemedSubmitIcon,\n strings.editBoxCancelButton,\n strings.editBoxSubmitButton,\n onSubmitHandler\n ]);\n const richTextLocaleStrings = useMemo(() => {\n /* @conditional-compile-remove(rich-text-editor) */\n return { ...locale.richTextSendBox, ...strings };\n return locale.sendBox;\n }, [\n /* @conditional-compile-remove(rich-text-editor) */ locale.richTextSendBox,\n /* @conditional-compile-remove(rich-text-editor) */ strings,\n locale.sendBox\n ]);\n\n /* @conditional-compile-remove(file-sharing-acs) */\n const onCancelAttachmentUpload = useCallback((attachmentId: string) => {\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({ type: 'remove', id: attachmentId });\n }, []);\n\n /* @conditional-compile-remove(file-sharing-acs) */\n const onRenderAttachmentUploads = useCallback(() => {\n return (\n <Stack className={attachmentUploadCardsStyles}>\n <FluentV9ThemeProvider v8Theme={theme}>\n <_AttachmentUploadCards\n attachments={attachmentMetadata}\n onCancelAttachmentUpload={onCancelAttachmentUpload}\n />\n </FluentV9ThemeProvider>\n </Stack>\n );\n }, [attachmentMetadata, onCancelAttachmentUpload, theme]);\n\n const onChangeHandler = useCallback(\n (\n content: string | undefined,\n /* @conditional-compile-remove(rich-text-editor-image-upload) */ imageSrcArray?: Array<string>\n ) => {\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n cancelInlineImageUpload(imageSrcArray, imageUploadsInProgress, onCancelInlineImageUpload);\n setText(content);\n },\n [\n setText,\n /* @conditional-compile-remove(rich-text-editor-image-upload) */ imageUploadsInProgress,\n /* @conditional-compile-remove(rich-text-editor-image-upload) */ onCancelInlineImageUpload\n ]\n );\n\n const getContent = (): JSX.Element => {\n return (\n <Stack className={mergeStyles(editBoxWidthStyles)}>\n <RichTextSendBoxErrors\n textTooLongMessage={textTooLongMessage}\n systemMessage={message.failureReason}\n /* @conditional-compile-remove(rich-text-editor-image-upload) */ attachmentUploadsPendingError={\n attachmentUploadsPendingError\n }\n />\n <RichTextInputBoxComponent\n placeholderText={strings.editBoxPlaceholderText}\n onChange={onChangeHandler}\n editorComponentRef={editTextFieldRef}\n initialContent={message.content}\n strings={richTextLocaleStrings}\n disabled={false}\n actionComponents={actionButtons}\n richTextEditorStyleProps={editBoxRichTextEditorStyle}\n isHorizontalLayoutDisabled={true}\n /* @conditional-compile-remove(file-sharing-acs) */\n onRenderAttachmentUploads={onRenderAttachmentUploads}\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n onPaste={onPaste}\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n onUploadInlineImage={onUploadInlineImage}\n />\n </Stack>\n );\n };\n\n const attached = message.attached === true ? 'center' : message.attached === 'bottom' ? 'bottom' : 'top';\n return (\n <ChatMyMessage\n attached={attached}\n root={{\n className: mergeClasses(\n chatMyMessageStyles.root,\n /* @conditional-compile-remove(file-sharing-acs) */\n hasMultipleAttachments ? chatMyMessageStyles.multipleAttachmentsInEditing : undefined\n )\n }}\n body={{\n className: mergeClasses(\n editContainerStyles.body,\n attached !== 'top' ? editContainerStyles.bodyAttached : undefined\n )\n }}\n >\n {getContent()}\n </ChatMyMessage>\n );\n};\n\nexport default ChatMessageComponentAsRichTextEditBox;\n"],"names":["useState","useReducer","attachmentMetadataReducer","getMessageWithAttachmentMetadata","useTheme","useMemo","getMessageState","useChatMessageRichTextEditContainerStyles","useChatMyMessageStyles","useLocale","useCallback","useEffect","_formatString","MAXIMUM_LENGTH_OF_MESSAGE","mergeStyles","richTextEditBoxActionButtonIcon","onRenderCancelIcon","onRenderSubmitIcon","doesMessageContainMultipleAttachments","hasIncompleteAttachmentUploads","isAttachmentUploadCompleted","insertImagesToContentString","Stack","InputBoxButton","richTextActionButtonsStyle","attachmentUploadCardsStyles","FluentV9ThemeProvider","_AttachmentUploadCards","cancelInlineImageUpload","editBoxWidthStyles","RichTextSendBoxErrors","RichTextInputBoxComponent","editBoxRichTextEditorStyle","ChatMyMessage","mergeClasses"],"mappings":"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"}
|
1
|
+
{"version":3,"file":"ChatMessageComponentAsRichTextEditBox-xobTVN7n.js","sources":["../../../../react-components/src/components/ChatMessage/MyMessageComponents/ChatMessageComponentAsRichTextEditBox.tsx"],"sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { 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';\n/* @conditional-compile-remove(rich-text-editor-image-upload) */\nimport { AttachmentMetadataInProgress } from '@internal/acs-ui-common';\nimport { useTheme } from '../../../theming';\nimport React, { useCallback, useEffect, useMemo, useState } from 'react';\n/* @conditional-compile-remove(file-sharing-acs) */\nimport { useReducer } from 'react';\nimport { editBoxWidthStyles, richTextEditBoxActionButtonIcon } from '../../styles/EditBox.styles';\nimport { InputBoxButton } from '../../InputBoxButton';\nimport { MessageThreadStrings } from '../../MessageThread';\nimport { useChatMyMessageStyles } from '../../styles/MessageThread.styles';\nimport { ChatMessage } from '../../../types';\nimport { _AttachmentUploadCards } from '../../Attachment/AttachmentUploadCards';\n/* @conditional-compile-remove(file-sharing-acs) */\nimport { AttachmentMetadata } from '@internal/acs-ui-common';\nimport { useChatMessageRichTextEditContainerStyles } from '../../styles/ChatMessageComponent.styles';\nimport { MAXIMUM_LENGTH_OF_MESSAGE } from '../../utils/SendBoxUtils';\n/* @conditional-compile-remove(rich-text-editor-image-upload) */\nimport {\n cancelInlineImageUpload,\n hasIncompleteAttachmentUploads,\n insertImagesToContentString,\n isAttachmentUploadCompleted\n} from '../../utils/SendBoxUtils';\nimport {\n getMessageState,\n onRenderCancelIcon,\n onRenderSubmitIcon\n} from '../../utils/ChatMessageComponentAsEditBoxUtils';\n/* @conditional-compile-remove(file-sharing-acs) */\nimport {\n attachmentMetadataReducer,\n getMessageWithAttachmentMetadata,\n doesMessageContainMultipleAttachments\n} from '../../utils/ChatMessageComponentAsEditBoxUtils';\nimport { RichTextEditorComponentRef } from '../../RichTextEditor/RichTextEditor';\nimport { RichTextInputBoxComponent } from '../../RichTextEditor/RichTextInputBoxComponent';\nimport { editBoxRichTextEditorStyle, richTextActionButtonsStyle } from '../../styles/RichTextEditor.styles';\nimport { RichTextSendBoxErrors } from '../../RichTextEditor/RichTextSendBoxErrors';\nimport { useLocale } from '../../../localization';\n/* @conditional-compile-remove(file-sharing-acs) */\nimport { FluentV9ThemeProvider } from '../../../theming/FluentV9ThemeProvider';\n/* @conditional-compile-remove(file-sharing-acs) */\nimport { attachmentUploadCardsStyles } from '../../styles/SendBox.styles';\n/* @conditional-compile-remove(rich-text-editor-image-upload) */\nimport { SendBoxErrorBarError } from '../../SendBoxErrorBar';\n\n/** @private */\nexport type ChatMessageComponentAsRichTextEditBoxProps = {\n onCancel?: (messageId: string) => void;\n onSubmit: (\n text: string,\n /* @conditional-compile-remove(file-sharing-acs) */\n attachmentMetadata?: AttachmentMetadata[]\n ) => void;\n message: ChatMessage;\n strings: MessageThreadStrings;\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n onPaste?: (event: { content: DocumentFragment }) => void;\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n onCancelInlineImageUpload?: (imageId: string) => void;\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n onUploadInlineImage?: (imageUrl: string, imageFileName: string) => void;\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n imageUploadsInProgress?: AttachmentMetadataInProgress[];\n};\n\n/**\n * @private\n */\nexport const ChatMessageComponentAsRichTextEditBox = (\n props: ChatMessageComponentAsRichTextEditBoxProps\n): JSX.Element => {\n const {\n onCancel,\n onSubmit,\n strings,\n message,\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n onPaste,\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n onUploadInlineImage,\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n imageUploadsInProgress,\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n onCancelInlineImageUpload\n } = props;\n\n const [textValue, setTextValue] = useState<string>(message.content || '');\n /* @conditional-compile-remove(file-sharing-acs) */\n const [attachmentMetadata, handleAttachmentAction] = useReducer(\n attachmentMetadataReducer,\n getMessageWithAttachmentMetadata(message) ?? []\n );\n\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n const [attachmentUploadsPendingError, setAttachmentUploadsPendingError] = useState<SendBoxErrorBarError | undefined>(\n undefined\n );\n const editTextFieldRef = React.useRef<RichTextEditorComponentRef>(null);\n const theme = useTheme();\n const messageState = useMemo(() => {\n return getMessageState(textValue, /* @conditional-compile-remove(file-sharing-acs) */ attachmentMetadata ?? []);\n }, [/* @conditional-compile-remove(file-sharing-acs) */ attachmentMetadata, textValue]);\n\n const submitEnabled = messageState === 'OK';\n\n const editContainerStyles = useChatMessageRichTextEditContainerStyles();\n const chatMyMessageStyles = useChatMyMessageStyles();\n const locale = useLocale().strings;\n\n const setText = useCallback((newValue?: string): void => {\n setTextValue(newValue ?? '');\n }, []);\n\n useEffect(() => {\n editTextFieldRef.current?.focus();\n }, []);\n\n const textTooLongMessage = useMemo(() => {\n return messageState === 'too long'\n ? _formatString(strings.editBoxTextLimit, { limitNumber: `${MAXIMUM_LENGTH_OF_MESSAGE}` })\n : undefined;\n }, [messageState, strings.editBoxTextLimit]);\n\n const iconClassName = useCallback(\n (isHover: boolean) => {\n const color = isHover ? theme.palette.accent : theme.palette.neutralSecondary;\n return mergeStyles(richTextEditBoxActionButtonIcon, { color });\n },\n [theme.palette.accent, theme.palette.neutralSecondary]\n );\n\n const onRenderThemedCancelIcon = useCallback(\n (isHover: boolean) => {\n return onRenderCancelIcon(iconClassName(isHover));\n },\n [iconClassName]\n );\n\n const onRenderThemedSubmitIcon = useCallback(\n (isHover: boolean) => {\n return onRenderSubmitIcon(iconClassName(isHover));\n },\n [iconClassName]\n );\n\n /* @conditional-compile-remove(file-sharing-acs) */\n const hasMultipleAttachments = useMemo(() => {\n return doesMessageContainMultipleAttachments(message);\n }, [message]);\n\n const onSubmitHandler = useCallback((): void => {\n if (!submitEnabled) {\n return;\n }\n // Don't send message until all attachments have been uploaded successfully\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n setAttachmentUploadsPendingError(undefined);\n\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n if (hasIncompleteAttachmentUploads(imageUploadsInProgress)) {\n setAttachmentUploadsPendingError({ message: strings.attachmentUploadsPendingError, timestamp: Date.now() });\n return;\n }\n\n let content = textValue;\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n if (isAttachmentUploadCompleted(imageUploadsInProgress)) {\n content = insertImagesToContentString(textValue, imageUploadsInProgress);\n }\n // it's very important to pass an empty attachment here\n // so when user removes 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 onSubmit(content, /* @conditional-compile-remove(file-sharing-acs) */ attachmentMetadata || []);\n }, [\n submitEnabled,\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n imageUploadsInProgress,\n textValue,\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n strings.attachmentUploadsPendingError,\n onSubmit,\n /* @conditional-compile-remove(file-sharing-acs) */\n attachmentMetadata\n ]);\n\n const actionButtons = useMemo(() => {\n return (\n <Stack horizontal>\n <InputBoxButton\n className={richTextActionButtonsStyle}\n ariaLabel={strings.editBoxCancelButton}\n tooltipContent={strings.editBoxCancelButton}\n onRenderIcon={onRenderThemedCancelIcon}\n onClick={() => {\n onCancel && onCancel(message.messageId);\n }}\n id={'dismissIconWrapper'}\n data-testId={strings.editBoxCancelButton}\n />\n <InputBoxButton\n className={richTextActionButtonsStyle}\n ariaLabel={strings.editBoxSubmitButton}\n tooltipContent={strings.editBoxSubmitButton}\n onRenderIcon={onRenderThemedSubmitIcon}\n onClick={(e) => {\n onSubmitHandler();\n e.stopPropagation();\n }}\n id={'submitIconWrapper'}\n data-testId={strings.editBoxSubmitButton}\n />\n </Stack>\n );\n }, [\n message.messageId,\n onCancel,\n onRenderThemedCancelIcon,\n onRenderThemedSubmitIcon,\n strings.editBoxCancelButton,\n strings.editBoxSubmitButton,\n onSubmitHandler\n ]);\n const richTextLocaleStrings = useMemo(() => {\n /* @conditional-compile-remove(rich-text-editor) */\n return { ...locale.richTextSendBox, ...strings };\n return locale.sendBox;\n }, [\n /* @conditional-compile-remove(rich-text-editor) */ locale.richTextSendBox,\n /* @conditional-compile-remove(rich-text-editor) */ strings,\n locale.sendBox\n ]);\n\n /* @conditional-compile-remove(file-sharing-acs) */\n const onCancelAttachmentUpload = useCallback((attachmentId: string) => {\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({ type: 'remove', id: attachmentId });\n }, []);\n\n /* @conditional-compile-remove(file-sharing-acs) */\n const onRenderAttachmentUploads = useCallback(() => {\n return (\n <Stack className={attachmentUploadCardsStyles}>\n <FluentV9ThemeProvider v8Theme={theme}>\n <_AttachmentUploadCards\n attachments={attachmentMetadata}\n onCancelAttachmentUpload={onCancelAttachmentUpload}\n />\n </FluentV9ThemeProvider>\n </Stack>\n );\n }, [attachmentMetadata, onCancelAttachmentUpload, theme]);\n\n const onChangeHandler = useCallback(\n (\n content: string | undefined,\n /* @conditional-compile-remove(rich-text-editor-image-upload) */ imageSrcArray?: Array<string>\n ) => {\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n cancelInlineImageUpload(imageSrcArray, imageUploadsInProgress, onCancelInlineImageUpload);\n setText(content);\n },\n [\n setText,\n /* @conditional-compile-remove(rich-text-editor-image-upload) */ imageUploadsInProgress,\n /* @conditional-compile-remove(rich-text-editor-image-upload) */ onCancelInlineImageUpload\n ]\n );\n\n const getContent = (): JSX.Element => {\n return (\n <Stack className={mergeStyles(editBoxWidthStyles)}>\n <RichTextSendBoxErrors\n textTooLongMessage={textTooLongMessage}\n systemMessage={message.failureReason}\n /* @conditional-compile-remove(rich-text-editor-image-upload) */ attachmentUploadsPendingError={\n attachmentUploadsPendingError\n }\n />\n <RichTextInputBoxComponent\n placeholderText={strings.editBoxPlaceholderText}\n onChange={onChangeHandler}\n editorComponentRef={editTextFieldRef}\n initialContent={message.content}\n strings={richTextLocaleStrings}\n disabled={false}\n actionComponents={actionButtons}\n richTextEditorStyleProps={editBoxRichTextEditorStyle}\n isHorizontalLayoutDisabled={true}\n /* @conditional-compile-remove(file-sharing-acs) */\n onRenderAttachmentUploads={onRenderAttachmentUploads}\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n onPaste={onPaste}\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n onUploadInlineImage={onUploadInlineImage}\n />\n </Stack>\n );\n };\n\n const attached = message.attached === true ? 'center' : message.attached === 'bottom' ? 'bottom' : 'top';\n return (\n <ChatMyMessage\n attached={attached}\n root={{\n className: mergeClasses(\n chatMyMessageStyles.root,\n /* @conditional-compile-remove(file-sharing-acs) */\n hasMultipleAttachments ? chatMyMessageStyles.multipleAttachmentsInEditing : undefined\n )\n }}\n body={{\n className: mergeClasses(\n editContainerStyles.body,\n attached !== 'top' ? editContainerStyles.bodyAttached : undefined\n )\n }}\n >\n {getContent()}\n </ChatMyMessage>\n );\n};\n\nexport default ChatMessageComponentAsRichTextEditBox;\n"],"names":["useState","useReducer","attachmentMetadataReducer","getMessageWithAttachmentMetadata","useTheme","useMemo","getMessageState","useChatMessageRichTextEditContainerStyles","useChatMyMessageStyles","useLocale","useCallback","useEffect","_formatString","MAXIMUM_LENGTH_OF_MESSAGE","mergeStyles","richTextEditBoxActionButtonIcon","onRenderCancelIcon","onRenderSubmitIcon","doesMessageContainMultipleAttachments","hasIncompleteAttachmentUploads","isAttachmentUploadCompleted","insertImagesToContentString","Stack","InputBoxButton","richTextActionButtonsStyle","attachmentUploadCardsStyles","FluentV9ThemeProvider","_AttachmentUploadCards","cancelInlineImageUpload","editBoxWidthStyles","RichTextSendBoxErrors","RichTextInputBoxComponent","editBoxRichTextEditorStyle","ChatMyMessage","mergeClasses"],"mappings":"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"}
|
@@ -1,7 +1,7 @@
|
|
1
1
|
'use strict';
|
2
2
|
|
3
3
|
var React = require('react');
|
4
|
-
var index = require('./index-
|
4
|
+
var index = require('./index-B5m8DRMa.js');
|
5
5
|
require('@fluentui/react');
|
6
6
|
require('@fluentui/react-components');
|
7
7
|
require('@fluentui-contrib/react-chat');
|
@@ -51,4 +51,4 @@ const RichTextSendBoxWrapper = (props) => {
|
|
51
51
|
};
|
52
52
|
|
53
53
|
exports.RichTextSendBoxWrapper = RichTextSendBoxWrapper;
|
54
|
-
//# sourceMappingURL=RichTextSendBoxWrapper-
|
54
|
+
//# sourceMappingURL=RichTextSendBoxWrapper-CyplcSgs.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"RichTextSendBoxWrapper-
|
1
|
+
{"version":3,"file":"RichTextSendBoxWrapper-CyplcSgs.js","sources":["../../../../react-composites/src/composites/common/RichTextSendBoxWrapper.tsx"],"sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\n/* @conditional-compile-remove(rich-text-editor-composite-support) */\nimport React from 'react';\n/* @conditional-compile-remove(rich-text-editor-composite-support) */\nimport { usePropsFor } from '../ChatComposite/hooks/usePropsFor';\n/* @conditional-compile-remove(rich-text-editor-composite-support) */\nimport { RichTextSendBox, RichTextSendBoxProps } from '@internal/react-components';\n\n/* @conditional-compile-remove(rich-text-editor-composite-support) */\n/**\n * @private\n *\n * Wrapper for RichTextSendBox component to allow us to use usePropsFor with richTextSendBox\n * before lazyLoading is done\n */\nexport const RichTextSendBoxWrapper = (props: RichTextSendBoxProps): JSX.Element => {\n const richTextSendBoxProps = usePropsFor(RichTextSendBox);\n\n return <RichTextSendBox {...richTextSendBoxProps} {...props} />;\n};\n"],"names":["usePropsFor","RichTextSendBox"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AACA;AAEA;AAOA;AACA;;;;;AAKG;AACU,MAAA,sBAAsB,GAAG,CAAC,KAA2B,KAAiB;AACjF,IAAA,MAAM,oBAAoB,GAAGA,iBAAW,CAACC,qBAAe,CAAC,CAAC;AAE1D,IAAA,OAAO,oBAACA,qBAAe,EAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,oBAAoB,EAAM,KAAK,EAAI,CAAC;AAClE;;;;"}
|
@@ -176,7 +176,7 @@ function getDefaultExportFromCjs (x) {
|
|
176
176
|
// Copyright (c) Microsoft Corporation.
|
177
177
|
// Licensed under the MIT License.
|
178
178
|
// GENERATED FILE. DO NOT EDIT MANUALLY.
|
179
|
-
var telemetryVersion = '1.18.0-alpha-
|
179
|
+
var telemetryVersion = '1.18.0-alpha-202407152347';
|
180
180
|
|
181
181
|
|
182
182
|
var telemetryVersion$1 = /*@__PURE__*/getDefaultExportFromCjs(telemetryVersion);
|
@@ -311,7 +311,7 @@ const createSafeReplacer = () => {
|
|
311
311
|
* @returns units of pixels
|
312
312
|
*/
|
313
313
|
const _convertRemToPx = (rem) => {
|
314
|
-
return rem *
|
314
|
+
return rem * getBrowserFontSizeInPx();
|
315
315
|
};
|
316
316
|
/**
|
317
317
|
* @internal
|
@@ -320,7 +320,15 @@ const _convertRemToPx = (rem) => {
|
|
320
320
|
* @returns units of rem
|
321
321
|
*/
|
322
322
|
const _convertPxToRem = (px) => {
|
323
|
-
return px /
|
323
|
+
return px / getBrowserFontSizeInPx();
|
324
|
+
};
|
325
|
+
const getBrowserFontSizeInPx = () => {
|
326
|
+
let fontSizeInPx = parseFloat(getComputedStyle(document.documentElement).fontSize);
|
327
|
+
// If browser font size is not a number, default to 16 px
|
328
|
+
if (Number.isNaN(fontSizeInPx)) {
|
329
|
+
fontSizeInPx = 16;
|
330
|
+
}
|
331
|
+
return fontSizeInPx;
|
324
332
|
};
|
325
333
|
/**
|
326
334
|
* @internal
|
@@ -6392,20 +6400,14 @@ const richTextEditorStyle = (props) => {
|
|
6392
6400
|
minHeight: props.minHeight,
|
6393
6401
|
maxHeight: props.maxHeight,
|
6394
6402
|
maxWidth: '100%',
|
6395
|
-
|
6396
|
-
// it gets both horizontal margins because of the user agent stylesheet
|
6397
|
-
// remove this code when RoosterJS content model packages are used as they use different approach for indentation
|
6398
|
-
'& blockquote': {
|
6399
|
-
marginInlineEnd: '0'
|
6400
|
-
}
|
6403
|
+
paddingTop: '0.5rem'
|
6401
6404
|
});
|
6402
6405
|
};
|
6403
6406
|
/**
|
6404
6407
|
* @private
|
6405
6408
|
*/
|
6406
|
-
const richTextEditorWrapperStyle = (theme
|
6409
|
+
const richTextEditorWrapperStyle = (theme) => {
|
6407
6410
|
return react.mergeStyles({
|
6408
|
-
paddingTop: `${addTopOffset ? '0.5rem' : '0'}`,
|
6409
6411
|
paddingInlineStart: `0.75rem`,
|
6410
6412
|
paddingInlineEnd: `0.75rem`,
|
6411
6413
|
maxWidth: '100%',
|
@@ -6484,7 +6486,7 @@ const ribbonOverflowButtonRootStyles = (theme) => {
|
|
6484
6486
|
},
|
6485
6487
|
'.ribbon-table-button-regular-icon': {
|
6486
6488
|
display: 'inline-block',
|
6487
|
-
margin: '
|
6489
|
+
margin: '0 0.25rem 0 0.25rem',
|
6488
6490
|
width: '1.25rem',
|
6489
6491
|
height: '1.25rem'
|
6490
6492
|
},
|
@@ -6523,8 +6525,8 @@ const ribbonButtonRootStyles = (iconColor, hoverIconColor) => {
|
|
6523
6525
|
*/
|
6524
6526
|
const toolbarButtonStyle = (theme) => {
|
6525
6527
|
return {
|
6526
|
-
icon: { color: theme.palette.neutralPrimary, height: 'auto' },
|
6527
|
-
menuIcon: { color: theme.palette.neutralPrimary, height: 'auto' },
|
6528
|
+
icon: { color: theme.palette.neutralPrimary, height: 'auto', paddingTop: '0.25rem' },
|
6529
|
+
menuIcon: { color: theme.palette.neutralPrimary, height: 'auto', paddingTop: '0.25rem' },
|
6528
6530
|
root: { minWidth: 'auto', backgroundColor: 'transparent' },
|
6529
6531
|
rootChecked: ribbonButtonRootStyles(theme.palette.themePrimary, theme.palette.themePrimary),
|
6530
6532
|
// there is a bug for Android where the press action is considered hover sometimes
|
@@ -6564,14 +6566,14 @@ const ribbonTableButtonRootStyles = (theme, isSelected) => {
|
|
6564
6566
|
'.ribbon-table-button-regular-icon': {
|
6565
6567
|
width: '1.25rem',
|
6566
6568
|
height: '1.25rem',
|
6567
|
-
margin: '
|
6569
|
+
margin: '0 0.25rem 0 0.25rem',
|
6568
6570
|
color: theme.palette.neutralPrimary,
|
6569
6571
|
display: isSelected ? 'none' : 'inline-block'
|
6570
6572
|
},
|
6571
6573
|
'.ribbon-table-button-filled-icon': {
|
6572
6574
|
width: '1.25rem',
|
6573
6575
|
height: '1.25rem',
|
6574
|
-
margin: '
|
6576
|
+
margin: '0 0.25rem 0 0.25rem',
|
6575
6577
|
color: theme.palette.themePrimary,
|
6576
6578
|
display: isSelected ? 'inline-block' : 'none'
|
6577
6579
|
}
|
@@ -6585,7 +6587,7 @@ const ribbonDividerStyle = (theme) => {
|
|
6585
6587
|
return react.mergeStyles({
|
6586
6588
|
color: theme.palette.neutralQuaternaryAlt,
|
6587
6589
|
margin: '0 -0.5rem',
|
6588
|
-
paddingTop: '0.
|
6590
|
+
paddingTop: '0.25rem'
|
6589
6591
|
});
|
6590
6592
|
};
|
6591
6593
|
/**
|
@@ -6593,7 +6595,7 @@ const ribbonDividerStyle = (theme) => {
|
|
6593
6595
|
*/
|
6594
6596
|
const richTextToolbarStyle = {
|
6595
6597
|
// Override for the default white color of the Ribbon component
|
6596
|
-
root: { backgroundColor: 'transparent', padding: '
|
6598
|
+
root: { backgroundColor: 'transparent', padding: '0.25rem 0 0 0', height: '2rem' }
|
6597
6599
|
};
|
6598
6600
|
/**
|
6599
6601
|
* @private
|
@@ -7597,6 +7599,7 @@ const RichTextEditor = React.forwardRef((props, ref) => {
|
|
7597
7599
|
const editorDiv = React.useRef(null);
|
7598
7600
|
const theme = useTheme();
|
7599
7601
|
const [contextMenuProps, setContextMenuProps] = React.useState(null);
|
7602
|
+
const previousThemeDirection = React.useRef(themeDirection(theme));
|
7600
7603
|
React.useImperativeHandle(ref, () => {
|
7601
7604
|
return {
|
7602
7605
|
focus() {
|
@@ -7778,9 +7781,24 @@ const RichTextEditor = React.forwardRef((props, ref) => {
|
|
7778
7781
|
// don't update the editor on deps update as everything is handled in separate hooks or plugins
|
7779
7782
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
7780
7783
|
}, [theme, plugins]);
|
7784
|
+
React.useEffect(() => {
|
7785
|
+
const themeDirectionValue = themeDirection(theme);
|
7786
|
+
// check that editor exists and theme was actually changed
|
7787
|
+
// as format.direction will be undefined if setDirection is not called
|
7788
|
+
if (editor.current && previousThemeDirection.current !== themeDirectionValue) {
|
7789
|
+
const format = roosterjsContentModelApi.getFormatState(editor.current);
|
7790
|
+
if (format.direction !== themeDirectionValue) {
|
7791
|
+
// should be set after the hook where editor is created as the editor might be null
|
7792
|
+
// setDirection will cause the focus change back to the editor and this might not be what we want to do (autoFocus prop)
|
7793
|
+
// that's why it's not part of the create editor hook
|
7794
|
+
roosterjsContentModelApi.setDirection(editor.current, theme.rtl ? 'rtl' : 'ltr');
|
7795
|
+
}
|
7796
|
+
previousThemeDirection.current = themeDirectionValue;
|
7797
|
+
}
|
7798
|
+
}, [theme]);
|
7781
7799
|
return (React.createElement("div", { "data-testid": 'rich-text-editor-wrapper' },
|
7782
7800
|
showRichTextEditorFormatting && toolbar,
|
7783
|
-
React.createElement("div", { className: richTextEditorWrapperStyle(theme
|
7801
|
+
React.createElement("div", { className: richTextEditorWrapperStyle(theme) },
|
7784
7802
|
React.createElement("div", { id: "richTextSendBox", ref: editorDiv, tabIndex: 0, role: "textbox", "aria-multiline": "true", "data-testid": 'rooster-rich-text-editor', className: richTextEditorStyle(props.styles), "aria-label": placeholderText })),
|
7785
7803
|
contextMenuProps && React.createElement(react.ContextualMenu, Object.assign({}, contextMenuProps, { calloutProps: { isBeakVisible: false } }))));
|
7786
7804
|
});
|
@@ -7811,6 +7829,9 @@ const setSelectionAfterLastSegment = (model, block) => {
|
|
7811
7829
|
block.segments.push(marker);
|
7812
7830
|
roosterjsContentModelDom.setSelection(model, marker);
|
7813
7831
|
};
|
7832
|
+
const themeDirection = (theme) => {
|
7833
|
+
return theme.rtl ? 'rtl' : 'ltr';
|
7834
|
+
};
|
7814
7835
|
|
7815
7836
|
// Copyright (c) Microsoft Corporation.
|
7816
7837
|
// Licensed under the MIT License.
|
@@ -8536,9 +8557,13 @@ const useChatMessageCommonStyles = reactComponents.makeStyles({
|
|
8536
8557
|
},
|
8537
8558
|
bodyWithPlaceholderImage: {
|
8538
8559
|
'& img[src=""]': {
|
8539
|
-
|
8560
|
+
backgroundColor: reactComponents.tokens.colorNeutralBackground1Selected,
|
8561
|
+
// this ensures safari won't have default rendering when image source
|
8562
|
+
// becomes invalid such as empty string in this case
|
8563
|
+
fontSize: '0',
|
8540
8564
|
position: 'relative',
|
8541
|
-
|
8565
|
+
clipPath: 'inset(0.3px)',
|
8566
|
+
display: 'flex'
|
8542
8567
|
},
|
8543
8568
|
'& img[src=""]:after': {
|
8544
8569
|
backgroundColor: reactComponents.tokens.colorNeutralBackground1Selected,
|
@@ -8997,7 +9022,12 @@ const _useContainerWidth = (containerRef) => {
|
|
8997
9022
|
const [width, setWidth] = React.useState(undefined);
|
8998
9023
|
const observer = React.useRef(new ResizeObserver((entries) => {
|
8999
9024
|
const { width } = entries[0].contentRect;
|
9000
|
-
|
9025
|
+
if (Number.isNaN(width)) {
|
9026
|
+
setWidth(0);
|
9027
|
+
}
|
9028
|
+
else {
|
9029
|
+
setWidth(width);
|
9030
|
+
}
|
9001
9031
|
}));
|
9002
9032
|
React.useEffect(() => {
|
9003
9033
|
if (containerRef.current) {
|
@@ -9020,7 +9050,12 @@ const _useContainerHeight = (containerRef) => {
|
|
9020
9050
|
const [height, setHeight] = React.useState(undefined);
|
9021
9051
|
const observer = React.useRef(new ResizeObserver((entries) => {
|
9022
9052
|
const { height } = entries[0].contentRect;
|
9023
|
-
|
9053
|
+
if (Number.isNaN(height)) {
|
9054
|
+
setHeight(0);
|
9055
|
+
}
|
9056
|
+
else {
|
9057
|
+
setHeight(height);
|
9058
|
+
}
|
9024
9059
|
}));
|
9025
9060
|
React.useEffect(() => {
|
9026
9061
|
if (containerRef.current) {
|
@@ -10212,7 +10247,7 @@ class _ErrorBoundary extends React.Component {
|
|
10212
10247
|
// Copyright (c) Microsoft Corporation.
|
10213
10248
|
// Licensed under the MIT License.
|
10214
10249
|
/* @conditional-compile-remove(rich-text-editor) */
|
10215
|
-
const ChatMessageComponentAsRichTextEditBox = React.lazy(() => Promise.resolve().then(function () { return require('./ChatMessageComponentAsRichTextEditBox-
|
10250
|
+
const ChatMessageComponentAsRichTextEditBox = React.lazy(() => Promise.resolve().then(function () { return require('./ChatMessageComponentAsRichTextEditBox-xobTVN7n.js'); }));
|
10216
10251
|
/**
|
10217
10252
|
* @private
|
10218
10253
|
* Use this function to load RoosterJS dependencies early in the lifecycle.
|
@@ -10220,7 +10255,7 @@ const ChatMessageComponentAsRichTextEditBox = React.lazy(() => Promise.resolve()
|
|
10220
10255
|
*
|
10221
10256
|
* @conditional-compile-remove(rich-text-editor)
|
10222
10257
|
*/
|
10223
|
-
const loadChatMessageComponentAsRichTextEditBox = () => Promise.resolve().then(function () { return require('./ChatMessageComponentAsRichTextEditBox-
|
10258
|
+
const loadChatMessageComponentAsRichTextEditBox = () => Promise.resolve().then(function () { return require('./ChatMessageComponentAsRichTextEditBox-xobTVN7n.js'); });
|
10224
10259
|
/**
|
10225
10260
|
* @private
|
10226
10261
|
*/
|
@@ -14705,9 +14740,13 @@ const ResponsiveHorizontalGallery = (props) => {
|
|
14705
14740
|
const containerWidth = _useContainerWidth(containerRef);
|
14706
14741
|
const leftPadding = containerRef.current ? parseFloat(getComputedStyle(containerRef.current).paddingLeft) : 0;
|
14707
14742
|
const rightPadding = containerRef.current ? parseFloat(getComputedStyle(containerRef.current).paddingRight) : 0;
|
14743
|
+
let containerWidthWithoutPadding = Math.max((containerWidth !== null && containerWidth !== void 0 ? containerWidth : 0) - leftPadding - rightPadding, 0);
|
14744
|
+
if (Number.isNaN(containerWidthWithoutPadding)) {
|
14745
|
+
containerWidthWithoutPadding = 0;
|
14746
|
+
}
|
14708
14747
|
const childrenPerPage = calculateHorizontalChildrenPerPage({
|
14709
14748
|
numberOfChildren: React.Children.count(props.children),
|
14710
|
-
containerWidth:
|
14749
|
+
containerWidth: containerWidthWithoutPadding,
|
14711
14750
|
gapWidthRem,
|
14712
14751
|
buttonWidthRem
|
14713
14752
|
});
|
@@ -14896,9 +14935,13 @@ const ResponsiveVerticalGallery = (props) => {
|
|
14896
14935
|
const containerHeight = _useContainerHeight(containerRef);
|
14897
14936
|
const topPadding = containerRef.current ? parseFloat(getComputedStyle(containerRef.current).paddingTop) : 0;
|
14898
14937
|
const bottomPadding = containerRef.current ? parseFloat(getComputedStyle(containerRef.current).paddingBottom) : 0;
|
14938
|
+
let containerHeightWithoutPadding = Math.max((containerHeight !== null && containerHeight !== void 0 ? containerHeight : 0) - topPadding - bottomPadding, 0);
|
14939
|
+
if (Number.isNaN(containerHeightWithoutPadding)) {
|
14940
|
+
containerHeightWithoutPadding = 0;
|
14941
|
+
}
|
14899
14942
|
const childrenPerPage = calculateVerticalChildrenPerPage({
|
14900
14943
|
numberOfChildren: (_a = React.Children.count(children)) !== null && _a !== void 0 ? _a : 0,
|
14901
|
-
containerHeight:
|
14944
|
+
containerHeight: containerHeightWithoutPadding,
|
14902
14945
|
gapHeightRem,
|
14903
14946
|
controlBarHeight: controlBarHeightRem !== null && controlBarHeightRem !== void 0 ? controlBarHeightRem : 2,
|
14904
14947
|
isShort: isShort !== null && isShort !== void 0 ? isShort : false
|
@@ -20377,6 +20420,7 @@ const processChatMessageContent = (message) => {
|
|
20377
20420
|
// else in loading or success state
|
20378
20421
|
img.setAttribute('src', src);
|
20379
20422
|
}
|
20423
|
+
setImageWidthAndHeight(img);
|
20380
20424
|
}
|
20381
20425
|
});
|
20382
20426
|
content = document.body.innerHTML;
|
@@ -20436,6 +20480,15 @@ const extractAttachmentContentTypeFromName = (name) => {
|
|
20436
20480
|
const contentType = name.substring(indexOfLastDot + 1);
|
20437
20481
|
return contentType;
|
20438
20482
|
};
|
20483
|
+
const setImageWidthAndHeight = (img) => {
|
20484
|
+
if (img) {
|
20485
|
+
// define aspect ratio explicitly to prevent image not being displayed correctly
|
20486
|
+
// in safari, this includes image placeholder for loading state
|
20487
|
+
const width = img.width;
|
20488
|
+
const height = img.height;
|
20489
|
+
img.style.aspectRatio = `${width}/${height}`;
|
20490
|
+
}
|
20491
|
+
};
|
20439
20492
|
/* @conditional-compile-remove(file-sharing-teams-interop) @conditional-compile-remove(file-sharing-acs) */
|
20440
20493
|
const extractAttachmentsMetadata = (message) => {
|
20441
20494
|
var _a, _b;
|
@@ -22353,7 +22406,7 @@ const AttachmentDownloadErrorBar = (props) => {
|
|
22353
22406
|
/**
|
22354
22407
|
* Wrapper for RichTextSendBox component to allow us to use usePropsFor with richTextSendBox with lazy loading
|
22355
22408
|
*/
|
22356
|
-
const RichTextSendBoxWrapper = React.lazy(() => Promise.resolve().then(function () { return require('./RichTextSendBoxWrapper-
|
22409
|
+
const RichTextSendBoxWrapper = React.lazy(() => Promise.resolve().then(function () { return require('./RichTextSendBoxWrapper-CyplcSgs.js'); }).then((module) => ({ default: module.RichTextSendBoxWrapper })));
|
22357
22410
|
/**
|
22358
22411
|
* @private
|
22359
22412
|
* Use this function to load RoosterJS dependencies early in the lifecycle.
|
@@ -22361,7 +22414,7 @@ const RichTextSendBoxWrapper = React.lazy(() => Promise.resolve().then(function
|
|
22361
22414
|
*
|
22362
22415
|
/* @conditional-compile-remove(rich-text-editor-composite-support)
|
22363
22416
|
*/
|
22364
|
-
const loadRichTextSendBox = () => Promise.resolve().then(function () { return require('./RichTextSendBoxWrapper-
|
22417
|
+
const loadRichTextSendBox = () => Promise.resolve().then(function () { return require('./RichTextSendBoxWrapper-CyplcSgs.js'); }).then((module) => ({ default: module.RichTextSendBoxWrapper }));
|
22365
22418
|
/**
|
22366
22419
|
* @private
|
22367
22420
|
*/
|
@@ -42394,4 +42447,4 @@ exports.useTeamsCall = useTeamsCall;
|
|
42394
42447
|
exports.useTeamsCallAdapter = useTeamsCallAdapter;
|
42395
42448
|
exports.useTeamsCallAgent = useTeamsCallAgent;
|
42396
42449
|
exports.useTheme = useTheme;
|
42397
|
-
//# sourceMappingURL=index-
|
42450
|
+
//# sourceMappingURL=index-B5m8DRMa.js.map
|