@azure/communication-react 1.28.0-beta.1 → 1.28.0-beta.2

package/dist/communication-react.d.ts

@@ -5460,6 +5460,10 @@ export declare type CaptionsInformation = {
      * If you are using both captions and real time text, please ensure that the createdTimeStamp is populated
      */
     createdTimeStamp?: Date;
+    /**
+     * If caption is finalized
+     */
+    isFinalized?: boolean;
 };
 
 /**

package/dist/dist-cjs/communication-react/{ChatMessageComponentAsRichTextEditBox-DRUaZRvX.js → ChatMessageComponentAsRichTextEditBox-DQsJ0ty3.js}

@@ -4,7 +4,7 @@ var react = require('@fluentui/react');
 var reactChat = require('@fluentui-contrib/react-chat');
 var reactComponents = require('@fluentui/react-components');
 require('@azure/communication-common');
-var index = require('./index-DYS7KDhY.js');
+var index = require('./index-C-rok69c.js');
 var React = require('react');
 require('reselect');
 require('@azure/communication-calling');
@@ -212,4 +212,4 @@ const ChatMessageComponentAsRichTextEditBox = (props) => {
 
 exports.ChatMessageComponentAsRichTextEditBox = ChatMessageComponentAsRichTextEditBox;
 exports.default = ChatMessageComponentAsRichTextEditBox;
-//# sourceMappingURL=ChatMessageComponentAsRichTextEditBox-DRUaZRvX.js.map
+//# sourceMappingURL=ChatMessageComponentAsRichTextEditBox-DQsJ0ty3.js.map

package/dist/dist-cjs/communication-react/{ChatMessageComponentAsRichTextEditBox-DRUaZRvX.js.map → ChatMessageComponentAsRichTextEditBox-DQsJ0ty3.js.map}

@@ -1 +1 @@
-{"version":3,"file":"ChatMessageComponentAsRichTextEditBox-DRUaZRvX.js","sources":["../../../preprocess-dist/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';\nimport { AttachmentMetadataInProgress } from '@internal/acs-ui-common';\nimport { useTheme } from '../../../theming';\nimport React, { useCallback, useEffect, useMemo, useState } from 'react';\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';\nimport { AttachmentMetadata } from '@internal/acs-ui-common';\nimport { useChatMessageRichTextEditContainerStyles } from '../../styles/ChatMessageComponent.styles';\nimport { MAXIMUM_LENGTH_OF_MESSAGE, modifyInlineImagesInContentString } from '../../utils/SendBoxUtils';\nimport { hasIncompleteAttachmentUploads, removeBrokenImageContentAndClearImageSizeStyles, getContentWithUpdatedInlineImagesInfo, isMessageTooLong, inlineImageIds } from '../../utils/SendBoxUtils';\nimport { getMessageState, MessageState, onRenderCancelIcon, onRenderSubmitIcon } from '../../utils/ChatMessageComponentAsEditBoxUtils';\nimport { attachmentMetadataReducer, getMessageWithAttachmentMetadata, doesMessageContainMultipleAttachments } 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';\nimport { FluentV9ThemeProvider } from '../../../theming/FluentV9ThemeProvider';\nimport { attachmentUploadCardsStyles } from '../../styles/SendBox.styles';\nimport { SendBoxErrorBarError, SendBoxErrorBarType } from '../../SendBoxErrorBar';\nimport { BROKEN_IMAGE_SVG_DATA } from '../../styles/Common.style';\nimport { getPreviousInlineImages } from '../../utils/RichTextEditorUtils';\n\n/** @private */\nexport type ChatMessageComponentAsRichTextEditBoxProps = {\n  onCancel?: (messageId: string) => void;\n  onSubmit: (text: string, attachmentMetadata?: AttachmentMetadata[]) => void;\n  message: ChatMessage;\n  strings: MessageThreadStrings;\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 ChatMessageComponentAsRichTextEditBox = (props: ChatMessageComponentAsRichTextEditBoxProps): JSX.Element => {\n  const {\n    onCancel,\n    onSubmit,\n    strings,\n    message,\n    onPaste,\n    onInsertInlineImage,\n    inlineImagesWithProgress,\n    onRemoveInlineImage\n  } = props;\n  const [initialInlineImages, setInitialInlineImages] = useState<Record<string, string>[]>([]);\n  const initialContent = useMemo(() => {\n    const content = message.content;\n    setInitialInlineImages(getPreviousInlineImages(content));\n    const document = new DOMParser().parseFromString(content ?? '', 'text/html');\n    // The broken image element is a div element with all the attributes of the original image element.\n    // We need to convert it to a img element so the Rooster knows how to render it.\n    // And we need to copy over all the attributes such as id, width, etc.\n    // which is needed for sending the message with the images correctly.\n    document.querySelectorAll('.broken-image-wrapper').forEach(brokenImage => {\n      const imageElement = document.createElement('img');\n      const attributes = brokenImage.attributes;\n      for (const attribute of attributes) {\n        imageElement.setAttribute(attribute.name, attribute.value);\n      }\n      imageElement.src = BROKEN_IMAGE_SVG_DATA;\n      imageElement.style.width = '3rem';\n      imageElement.style.height = '3rem';\n      brokenImage.parentElement?.replaceChild(imageElement, brokenImage);\n    });\n    return document.body.innerHTML;\n    return message.content;\n  }, [message]);\n  const [contentValue, setContentValue] = useState<string>(initialContent || '');\n  const [contentValueWithInlineImagesOverflow, setContentValueWithInlineImagesOverflow] = useState(false);\n  const [attachmentMetadata, handleAttachmentAction] = useReducer(attachmentMetadataReducer, getMessageWithAttachmentMetadata(message) ?? []);\n  const [attachmentUploadsPendingError, setAttachmentUploadsPendingError] = useState<SendBoxErrorBarError | undefined>(undefined);\n  const editTextFieldRef = React.useRef<RichTextEditorComponentRef>(null);\n  const theme = useTheme();\n  const messageState: MessageState = useMemo(() => {\n    // get plain text content from the editor to check if the message is empty\n    // as the content may contain tags even when the content is empty\n    const plainTextContent = editTextFieldRef.current?.getPlainContent() ?? contentValue;\n    let messageLengthState = getMessageState(plainTextContent, attachmentMetadata ?? []);\n    const imageIds = inlineImageIds(contentValue);\n    if (messageLengthState !== 'OK' && imageIds.length > 0) {\n      // Check if too long\n      if (isMessageTooLong(contentValue.length)) {\n        messageLengthState = 'too long';\n      } else {\n        messageLengthState = 'OK';\n      }\n    }\n    return messageLengthState;\n  }, [attachmentMetadata, contentValue]);\n  const imageUploadErrorMessage = useMemo(() => {\n    return inlineImagesWithProgress?.filter(image => image.error).pop()?.error?.message;\n  }, [inlineImagesWithProgress]);\n  const editContainerStyles = useChatMessageRichTextEditContainerStyles();\n  const chatMyMessageStyles = useChatMyMessageStyles();\n  const locale = useLocale().strings;\n  const setContent = useCallback((newValue?: string): void => {\n    setContentValue(newValue ?? '');\n  }, []);\n  useEffect(() => {\n    editTextFieldRef.current?.focus();\n  }, []);\n  const textTooLongMessage = useMemo(() => {\n    return messageState === 'too long' || contentValueWithInlineImagesOverflow ? _formatString(strings.editBoxTextLimit, {\n      limitNumber: `${MAXIMUM_LENGTH_OF_MESSAGE}`\n    }) : undefined;\n  }, [messageState, strings.editBoxTextLimit, contentValueWithInlineImagesOverflow]);\n  const iconClassName = useCallback((isHover: boolean) => {\n    const color = isHover ? theme.palette.accent : theme.palette.neutralSecondary;\n    return mergeStyles(richTextEditBoxActionButtonIcon, {\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 onSubmitHandler = useCallback((): void => {\n    if (messageState !== 'OK') {\n      return;\n    }\n    if (inlineImagesWithProgress && inlineImagesWithProgress.length > 0) {\n      const contentWithUpdatedInlineImagesInfo = getContentWithUpdatedInlineImagesInfo(contentValue, inlineImagesWithProgress);\n      const messageTooLong = isMessageTooLong(contentWithUpdatedInlineImagesInfo.length);\n      // Set contentValueWithInlineImagesOverflow state to display the error bar\n      setContentValueWithInlineImagesOverflow(messageTooLong);\n      // The change from the setContentValueOverflow in the previous line will not kick in yet.\n      // We need to rely on the local value of messageTooLong to return early if the message is too long.\n      if (messageTooLong) {\n        return;\n      }\n    }\n\n    // Don't send message until all attachments have been uploaded successfully\n    setAttachmentUploadsPendingError(undefined);\n    if (hasIncompleteAttachmentUploads(inlineImagesWithProgress)) {\n      setAttachmentUploadsPendingError({\n        message: strings.imageUploadsPendingError,\n        timestamp: Date.now(),\n        errorBarType: SendBoxErrorBarType.info\n      });\n      return;\n    }\n    let content = contentValue;\n    content = removeBrokenImageContentAndClearImageSizeStyles(content);\n    let initInlineImages: Record<string, string>[] = [];\n    initInlineImages = initialInlineImages ?? [];\n    modifyInlineImagesInContentString(content, initInlineImages, (content: string) => {\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, attachmentMetadata || []);\n    });\n  }, [messageState, inlineImagesWithProgress, initialInlineImages, contentValue, strings.imageUploadsPendingError, onSubmit, attachmentMetadata]);\n  const actionButtons = useMemo(() => {\n    return <Stack horizontal>\n        <InputBoxButton className={richTextActionButtonsStyle} ariaLabel={strings.editBoxCancelButton} tooltipContent={strings.editBoxCancelButton} onRenderIcon={onRenderThemedCancelIcon} onClick={() => {\n        onCancel && onCancel(message.messageId);\n      }} id={'dismissIconWrapper'} data-testId={'chat-message-rich-text-edit-box-cancel-button'} />\n        <InputBoxButton className={richTextActionButtonsStyle} ariaLabel={strings.editBoxSubmitButton} tooltipContent={strings.editBoxSubmitButton} onRenderIcon={onRenderThemedSubmitIcon} onClick={e => {\n        onSubmitHandler();\n        e.stopPropagation();\n      }} id={'submitIconWrapper'} data-testId={'chat-message-rich-text-edit-box-submit-button'} />\n      </Stack>;\n  }, [message.messageId, onCancel, onRenderThemedCancelIcon, onRenderThemedSubmitIcon, strings.editBoxCancelButton, strings.editBoxSubmitButton, onSubmitHandler]);\n  const richTextLocaleStrings = useMemo(() => {\n    return {\n      ...locale.richTextSendBox,\n      ...strings\n    };\n    return locale.sendBox;\n  }, [locale.richTextSendBox, strings, locale.sendBox]);\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({\n      type: 'remove',\n      id: attachmentId\n    });\n  }, []);\n  const onRenderAttachmentUploads = useCallback(() => {\n    return <Stack className={attachmentUploadCardsStyles}>\n        <FluentV9ThemeProvider v8Theme={theme}>\n          <_AttachmentUploadCards attachments={attachmentMetadata} onCancelAttachmentUpload={onCancelAttachmentUpload} />\n        </FluentV9ThemeProvider>\n      </Stack>;\n  }, [attachmentMetadata, onCancelAttachmentUpload, theme]);\n  const onChangeHandler = useCallback((content: string | undefined, removedInlineImages?: Record<string, string>[]) => {\n    removedInlineImages?.forEach((removedInlineImage: Record<string, string>) => {\n      onRemoveInlineImage && onRemoveInlineImage(removedInlineImage, message.messageId);\n    });\n    setContent(content);\n  }, [setContent, onRemoveInlineImage, message.messageId]);\n  const getContent = (): JSX.Element => {\n    return <Stack className={mergeStyles(editBoxWidthStyles)}>\n        <RichTextSendBoxErrors textTooLongMessage={textTooLongMessage} systemMessage={message.failureReason} attachmentUploadsPendingError={attachmentUploadsPendingError} attachmentProgressError={imageUploadErrorMessage ? {\n        message: imageUploadErrorMessage,\n        timestamp: Date.now(),\n        errorBarType: SendBoxErrorBarType.error\n      } : undefined} />\n        <RichTextInputBoxComponent placeholderText={strings.editBoxPlaceholderText} onChange={onChangeHandler} onEnterKeyDown={onSubmitHandler} editorComponentRef={editTextFieldRef} initialContent={initialContent} strings={richTextLocaleStrings} disabled={false} actionComponents={actionButtons} richTextEditorStyleProps={editBoxRichTextEditorStyle} isHorizontalLayoutDisabled={true} onRenderAttachmentUploads={onRenderAttachmentUploads} onPaste={onPaste} onInsertInlineImage={onInsertInlineImage ? (imageAttributes: Record<string, string>) => {\n        onInsertInlineImage(imageAttributes, message.messageId);\n      } : undefined} />\n      </Stack>;\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, attached !== 'top' ? editContainerStyles.bodyAttached : undefined)\n  }}>\n      {getContent()}\n    </ChatMyMessage>;\n};\nexport default ChatMessageComponentAsRichTextEditBox;"],"names":["useState","useMemo","getPreviousInlineImages","BROKEN_IMAGE_SVG_DATA","useReducer","attachmentMetadataReducer","getMessageWithAttachmentMetadata","useTheme","getMessageState","inlineImageIds","isMessageTooLong","useChatMessageRichTextEditContainerStyles","useChatMyMessageStyles","useLocale","useCallback","useEffect","_formatString","MAXIMUM_LENGTH_OF_MESSAGE","mergeStyles","richTextEditBoxActionButtonIcon","onRenderCancelIcon","onRenderSubmitIcon","doesMessageContainMultipleAttachments","getContentWithUpdatedInlineImagesInfo","hasIncompleteAttachmentUploads","SendBoxErrorBarType","removeBrokenImageContentAndClearImageSizeStyles","modifyInlineImagesInContentString","Stack","InputBoxButton","richTextActionButtonsStyle","attachmentUploadCardsStyles","FluentV9ThemeProvider","_AttachmentUploadCards","editBoxWidthStyles","RichTextSendBoxErrors","RichTextInputBoxComponent","editBoxRichTextEditorStyle","ChatMyMessage","mergeClasses"],"mappings":"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"}
+{"version":3,"file":"ChatMessageComponentAsRichTextEditBox-DQsJ0ty3.js","sources":["../../../preprocess-dist/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';\nimport { AttachmentMetadataInProgress } from '@internal/acs-ui-common';\nimport { useTheme } from '../../../theming';\nimport React, { useCallback, useEffect, useMemo, useState } from 'react';\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';\nimport { AttachmentMetadata } from '@internal/acs-ui-common';\nimport { useChatMessageRichTextEditContainerStyles } from '../../styles/ChatMessageComponent.styles';\nimport { MAXIMUM_LENGTH_OF_MESSAGE, modifyInlineImagesInContentString } from '../../utils/SendBoxUtils';\nimport { hasIncompleteAttachmentUploads, removeBrokenImageContentAndClearImageSizeStyles, getContentWithUpdatedInlineImagesInfo, isMessageTooLong, inlineImageIds } from '../../utils/SendBoxUtils';\nimport { getMessageState, MessageState, onRenderCancelIcon, onRenderSubmitIcon } from '../../utils/ChatMessageComponentAsEditBoxUtils';\nimport { attachmentMetadataReducer, getMessageWithAttachmentMetadata, doesMessageContainMultipleAttachments } 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';\nimport { FluentV9ThemeProvider } from '../../../theming/FluentV9ThemeProvider';\nimport { attachmentUploadCardsStyles } from '../../styles/SendBox.styles';\nimport { SendBoxErrorBarError, SendBoxErrorBarType } from '../../SendBoxErrorBar';\nimport { BROKEN_IMAGE_SVG_DATA } from '../../styles/Common.style';\nimport { getPreviousInlineImages } from '../../utils/RichTextEditorUtils';\n\n/** @private */\nexport type ChatMessageComponentAsRichTextEditBoxProps = {\n  onCancel?: (messageId: string) => void;\n  onSubmit: (text: string, attachmentMetadata?: AttachmentMetadata[]) => void;\n  message: ChatMessage;\n  strings: MessageThreadStrings;\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 ChatMessageComponentAsRichTextEditBox = (props: ChatMessageComponentAsRichTextEditBoxProps): JSX.Element => {\n  const {\n    onCancel,\n    onSubmit,\n    strings,\n    message,\n    onPaste,\n    onInsertInlineImage,\n    inlineImagesWithProgress,\n    onRemoveInlineImage\n  } = props;\n  const [initialInlineImages, setInitialInlineImages] = useState<Record<string, string>[]>([]);\n  const initialContent = useMemo(() => {\n    const content = message.content;\n    setInitialInlineImages(getPreviousInlineImages(content));\n    const document = new DOMParser().parseFromString(content ?? '', 'text/html');\n    // The broken image element is a div element with all the attributes of the original image element.\n    // We need to convert it to a img element so the Rooster knows how to render it.\n    // And we need to copy over all the attributes such as id, width, etc.\n    // which is needed for sending the message with the images correctly.\n    document.querySelectorAll('.broken-image-wrapper').forEach(brokenImage => {\n      const imageElement = document.createElement('img');\n      const attributes = brokenImage.attributes;\n      for (const attribute of attributes) {\n        imageElement.setAttribute(attribute.name, attribute.value);\n      }\n      imageElement.src = BROKEN_IMAGE_SVG_DATA;\n      imageElement.style.width = '3rem';\n      imageElement.style.height = '3rem';\n      brokenImage.parentElement?.replaceChild(imageElement, brokenImage);\n    });\n    return document.body.innerHTML;\n    return message.content;\n  }, [message]);\n  const [contentValue, setContentValue] = useState<string>(initialContent || '');\n  const [contentValueWithInlineImagesOverflow, setContentValueWithInlineImagesOverflow] = useState(false);\n  const [attachmentMetadata, handleAttachmentAction] = useReducer(attachmentMetadataReducer, getMessageWithAttachmentMetadata(message) ?? []);\n  const [attachmentUploadsPendingError, setAttachmentUploadsPendingError] = useState<SendBoxErrorBarError | undefined>(undefined);\n  const editTextFieldRef = React.useRef<RichTextEditorComponentRef>(null);\n  const theme = useTheme();\n  const messageState: MessageState = useMemo(() => {\n    // get plain text content from the editor to check if the message is empty\n    // as the content may contain tags even when the content is empty\n    const plainTextContent = editTextFieldRef.current?.getPlainContent() ?? contentValue;\n    let messageLengthState = getMessageState(plainTextContent, attachmentMetadata ?? []);\n    const imageIds = inlineImageIds(contentValue);\n    if (messageLengthState !== 'OK' && imageIds.length > 0) {\n      // Check if too long\n      if (isMessageTooLong(contentValue.length)) {\n        messageLengthState = 'too long';\n      } else {\n        messageLengthState = 'OK';\n      }\n    }\n    return messageLengthState;\n  }, [attachmentMetadata, contentValue]);\n  const imageUploadErrorMessage = useMemo(() => {\n    return inlineImagesWithProgress?.filter(image => image.error).pop()?.error?.message;\n  }, [inlineImagesWithProgress]);\n  const editContainerStyles = useChatMessageRichTextEditContainerStyles();\n  const chatMyMessageStyles = useChatMyMessageStyles();\n  const locale = useLocale().strings;\n  const setContent = useCallback((newValue?: string): void => {\n    setContentValue(newValue ?? '');\n  }, []);\n  useEffect(() => {\n    editTextFieldRef.current?.focus();\n  }, []);\n  const textTooLongMessage = useMemo(() => {\n    return messageState === 'too long' || contentValueWithInlineImagesOverflow ? _formatString(strings.editBoxTextLimit, {\n      limitNumber: `${MAXIMUM_LENGTH_OF_MESSAGE}`\n    }) : undefined;\n  }, [messageState, strings.editBoxTextLimit, contentValueWithInlineImagesOverflow]);\n  const iconClassName = useCallback((isHover: boolean) => {\n    const color = isHover ? theme.palette.accent : theme.palette.neutralSecondary;\n    return mergeStyles(richTextEditBoxActionButtonIcon, {\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 onSubmitHandler = useCallback((): void => {\n    if (messageState !== 'OK') {\n      return;\n    }\n    if (inlineImagesWithProgress && inlineImagesWithProgress.length > 0) {\n      const contentWithUpdatedInlineImagesInfo = getContentWithUpdatedInlineImagesInfo(contentValue, inlineImagesWithProgress);\n      const messageTooLong = isMessageTooLong(contentWithUpdatedInlineImagesInfo.length);\n      // Set contentValueWithInlineImagesOverflow state to display the error bar\n      setContentValueWithInlineImagesOverflow(messageTooLong);\n      // The change from the setContentValueOverflow in the previous line will not kick in yet.\n      // We need to rely on the local value of messageTooLong to return early if the message is too long.\n      if (messageTooLong) {\n        return;\n      }\n    }\n\n    // Don't send message until all attachments have been uploaded successfully\n    setAttachmentUploadsPendingError(undefined);\n    if (hasIncompleteAttachmentUploads(inlineImagesWithProgress)) {\n      setAttachmentUploadsPendingError({\n        message: strings.imageUploadsPendingError,\n        timestamp: Date.now(),\n        errorBarType: SendBoxErrorBarType.info\n      });\n      return;\n    }\n    let content = contentValue;\n    content = removeBrokenImageContentAndClearImageSizeStyles(content);\n    let initInlineImages: Record<string, string>[] = [];\n    initInlineImages = initialInlineImages ?? [];\n    modifyInlineImagesInContentString(content, initInlineImages, (content: string) => {\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, attachmentMetadata || []);\n    });\n  }, [messageState, inlineImagesWithProgress, initialInlineImages, contentValue, strings.imageUploadsPendingError, onSubmit, attachmentMetadata]);\n  const actionButtons = useMemo(() => {\n    return <Stack horizontal>\n        <InputBoxButton className={richTextActionButtonsStyle} ariaLabel={strings.editBoxCancelButton} tooltipContent={strings.editBoxCancelButton} onRenderIcon={onRenderThemedCancelIcon} onClick={() => {\n        onCancel && onCancel(message.messageId);\n      }} id={'dismissIconWrapper'} data-testId={'chat-message-rich-text-edit-box-cancel-button'} />\n        <InputBoxButton className={richTextActionButtonsStyle} ariaLabel={strings.editBoxSubmitButton} tooltipContent={strings.editBoxSubmitButton} onRenderIcon={onRenderThemedSubmitIcon} onClick={e => {\n        onSubmitHandler();\n        e.stopPropagation();\n      }} id={'submitIconWrapper'} data-testId={'chat-message-rich-text-edit-box-submit-button'} />\n      </Stack>;\n  }, [message.messageId, onCancel, onRenderThemedCancelIcon, onRenderThemedSubmitIcon, strings.editBoxCancelButton, strings.editBoxSubmitButton, onSubmitHandler]);\n  const richTextLocaleStrings = useMemo(() => {\n    return {\n      ...locale.richTextSendBox,\n      ...strings\n    };\n    return locale.sendBox;\n  }, [locale.richTextSendBox, strings, locale.sendBox]);\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({\n      type: 'remove',\n      id: attachmentId\n    });\n  }, []);\n  const onRenderAttachmentUploads = useCallback(() => {\n    return <Stack className={attachmentUploadCardsStyles}>\n        <FluentV9ThemeProvider v8Theme={theme}>\n          <_AttachmentUploadCards attachments={attachmentMetadata} onCancelAttachmentUpload={onCancelAttachmentUpload} />\n        </FluentV9ThemeProvider>\n      </Stack>;\n  }, [attachmentMetadata, onCancelAttachmentUpload, theme]);\n  const onChangeHandler = useCallback((content: string | undefined, removedInlineImages?: Record<string, string>[]) => {\n    removedInlineImages?.forEach((removedInlineImage: Record<string, string>) => {\n      onRemoveInlineImage && onRemoveInlineImage(removedInlineImage, message.messageId);\n    });\n    setContent(content);\n  }, [setContent, onRemoveInlineImage, message.messageId]);\n  const getContent = (): JSX.Element => {\n    return <Stack className={mergeStyles(editBoxWidthStyles)}>\n        <RichTextSendBoxErrors textTooLongMessage={textTooLongMessage} systemMessage={message.failureReason} attachmentUploadsPendingError={attachmentUploadsPendingError} attachmentProgressError={imageUploadErrorMessage ? {\n        message: imageUploadErrorMessage,\n        timestamp: Date.now(),\n        errorBarType: SendBoxErrorBarType.error\n      } : undefined} />\n        <RichTextInputBoxComponent placeholderText={strings.editBoxPlaceholderText} onChange={onChangeHandler} onEnterKeyDown={onSubmitHandler} editorComponentRef={editTextFieldRef} initialContent={initialContent} strings={richTextLocaleStrings} disabled={false} actionComponents={actionButtons} richTextEditorStyleProps={editBoxRichTextEditorStyle} isHorizontalLayoutDisabled={true} onRenderAttachmentUploads={onRenderAttachmentUploads} onPaste={onPaste} onInsertInlineImage={onInsertInlineImage ? (imageAttributes: Record<string, string>) => {\n        onInsertInlineImage(imageAttributes, message.messageId);\n      } : undefined} />\n      </Stack>;\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, attached !== 'top' ? editContainerStyles.bodyAttached : undefined)\n  }}>\n      {getContent()}\n    </ChatMyMessage>;\n};\nexport default ChatMessageComponentAsRichTextEditBox;"],"names":["useState","useMemo","getPreviousInlineImages","BROKEN_IMAGE_SVG_DATA","useReducer","attachmentMetadataReducer","getMessageWithAttachmentMetadata","useTheme","getMessageState","inlineImageIds","isMessageTooLong","useChatMessageRichTextEditContainerStyles","useChatMyMessageStyles","useLocale","useCallback","useEffect","_formatString","MAXIMUM_LENGTH_OF_MESSAGE","mergeStyles","richTextEditBoxActionButtonIcon","onRenderCancelIcon","onRenderSubmitIcon","doesMessageContainMultipleAttachments","getContentWithUpdatedInlineImagesInfo","hasIncompleteAttachmentUploads","SendBoxErrorBarType","removeBrokenImageContentAndClearImageSizeStyles","modifyInlineImagesInContentString","Stack","InputBoxButton","richTextActionButtonsStyle","attachmentUploadCardsStyles","FluentV9ThemeProvider","_AttachmentUploadCards","editBoxWidthStyles","RichTextSendBoxErrors","RichTextInputBoxComponent","editBoxRichTextEditorStyle","ChatMyMessage","mergeClasses"],"mappings":"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"}

package/dist/dist-cjs/communication-react/{RichTextSendBoxWrapper-G0IPk_nq.js → RichTextSendBoxWrapper-K8NQvjwe.js}

@@ -1,7 +1,7 @@
 'use strict';
 
 var React = require('react');
-var index = require('./index-DYS7KDhY.js');
+var index = require('./index-C-rok69c.js');
 require('@fluentui/react');
 require('@azure/communication-common');
 require('@fluentui/react-components');
@@ -46,4 +46,4 @@ const RichTextSendBoxWrapper = (props) => {
 };
 
 exports.RichTextSendBoxWrapper = RichTextSendBoxWrapper;
-//# sourceMappingURL=RichTextSendBoxWrapper-G0IPk_nq.js.map
+//# sourceMappingURL=RichTextSendBoxWrapper-K8NQvjwe.js.map

package/dist/dist-cjs/communication-react/{RichTextSendBoxWrapper-G0IPk_nq.js.map → RichTextSendBoxWrapper-K8NQvjwe.js.map}

@@ -1 +1 @@
-{"version":3,"file":"RichTextSendBoxWrapper-G0IPk_nq.js","sources":["../../../preprocess-dist/react-composites/src/composites/common/RichTextSendBoxWrapper.tsx"],"sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\nimport React from 'react';\nimport { usePropsFor } from '../ChatComposite/hooks/usePropsFor';\nimport { RichTextSendBox, RichTextSendBoxProps } from '@internal/react-components';\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  return <RichTextSendBox {...richTextSendBoxProps} {...props} />;\n};"],"names":["usePropsFor","RichTextSendBox"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AACA;AAIA;;;;;AAKG;AACU,MAAA,sBAAsB,GAAG,CAAC,KAA2B,KAAiB;AACjF,IAAA,MAAM,oBAAoB,GAAGA,iBAAW,CAACC,qBAAe,CAAC;AACzD,IAAA,OAAO,oBAACA,qBAAe,EAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,oBAAoB,EAAM,KAAK,EAAI;AACjE;;;;"}
+{"version":3,"file":"RichTextSendBoxWrapper-K8NQvjwe.js","sources":["../../../preprocess-dist/react-composites/src/composites/common/RichTextSendBoxWrapper.tsx"],"sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\nimport React from 'react';\nimport { usePropsFor } from '../ChatComposite/hooks/usePropsFor';\nimport { RichTextSendBox, RichTextSendBoxProps } from '@internal/react-components';\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  return <RichTextSendBox {...richTextSendBoxProps} {...props} />;\n};"],"names":["usePropsFor","RichTextSendBox"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AACA;AAIA;;;;;AAKG;AACU,MAAA,sBAAsB,GAAG,CAAC,KAA2B,KAAiB;AACjF,IAAA,MAAM,oBAAoB,GAAGA,iBAAW,CAACC,qBAAe,CAAC;AACzD,IAAA,OAAO,oBAACA,qBAAe,EAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,oBAAoB,EAAM,KAAK,EAAI;AACjE;;;;"}

package/dist/dist-cjs/communication-react/{index-DYS7KDhY.js → index-C-rok69c.js}

@@ -184,7 +184,7 @@ function getDefaultExportFromCjs (x) {
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT License.
 // GENERATED FILE. DO NOT EDIT MANUALLY.
-var telemetryVersion = '1.28.0-beta.1';
+var telemetryVersion = '1.28.0-beta.2';
 
 
 var telemetryVersion$1 = /*@__PURE__*/getDefaultExportFromCjs(telemetryVersion);
@@ -1994,7 +1994,8 @@ const captionsBannerSelector = reselect__namespace.createSelector([getCaptions,
             displayName: finalDisplayName !== null && finalDisplayName !== void 0 ? finalDisplayName : 'Unnamed Participant',
             captionText: c.captionText,
             userId,
-            createdTimeStamp: c.timestamp
+            createdTimeStamp: c.timestamp,
+            isFinalized: c.resultType === 'Final'
         };
     });
     const completedRealTimeTexts = (_a = realTimeTexts === null || realTimeTexts === void 0 ? void 0 : realTimeTexts.completedMessages) === null || _a === void 0 ? void 0 : _a.filter(rtt => rtt.message !== '').map(rtt => {
@@ -2201,8 +2202,11 @@ class ProxyDeviceManager {
                         }), navigator.permissions.query({
                             name: 'microphone'
                         })]);
-                    hasCameraPermission = cameraPermissions.state === 'granted';
-                    hasMicPermission = micPermissions.state === 'granted';
+                    // Use logical OR to combine the SDK state with the Permissions API state.
+                    // This way we can get a more accurate picture of the device permission state.
+                    // If the SDK state is 'granted', we don't need to check the Permissions API state.
+                    hasCameraPermission || (hasCameraPermission = cameraPermissions.state === 'granted');
+                    hasMicPermission || (hasMicPermission = micPermissions.state === 'granted');
                 }
                 catch (e) {
                     console.info('Permissions API is not supported by browser', e);
@@ -15965,8 +15969,8 @@ class _ErrorBoundary extends React.Component {
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT License.
-const ChatMessageComponentAsRichTextEditBox = React.lazy(() => Promise.resolve().then(function () { return require('./ChatMessageComponentAsRichTextEditBox-DRUaZRvX.js'); }));
-const loadChatMessageComponentAsRichTextEditBox = () => Promise.resolve().then(function () { return require('./ChatMessageComponentAsRichTextEditBox-DRUaZRvX.js'); });
+const ChatMessageComponentAsRichTextEditBox = React.lazy(() => Promise.resolve().then(function () { return require('./ChatMessageComponentAsRichTextEditBox-DQsJ0ty3.js'); }));
+const loadChatMessageComponentAsRichTextEditBox = () => Promise.resolve().then(function () { return require('./ChatMessageComponentAsRichTextEditBox-DQsJ0ty3.js'); });
 /**
  * @private
  */
@@ -24951,6 +24955,19 @@ const captionsContainerClassName = react.mergeStyles({
     padding: 0,
     overflowX: 'hidden'
 });
+/**
+ * @private
+ */
+const hiddenAnnouncementClassName = react.mergeStyles({
+    position: 'absolute',
+    width: '1px',
+    height: '1px',
+    padding: 0,
+    overflow: 'hidden',
+    clip: 'rect(0, 0, 0, 0)',
+    whiteSpace: 'nowrap',
+    border: 0
+});
 /**
  * @private
  */
@@ -25395,6 +25412,10 @@ const CaptionsBanner = (props) => {
     const [isAtBottomOfScroll, setIsAtBottomOfScroll] = React.useState(true);
     const theme = react.useTheme();
     const [expandBannerHeight, setExpandBannerHeight] = React.useState(false);
+    const [announcedRTT, setAnnouncedRTT] = React.useState([]);
+    const [announcedCaption, setAnnouncedCaption] = React.useState([]);
+    const [captionAnnouncementText, setCaptionAnnouncementText] = React.useState([]);
+    const [rttAnnouncementText, setRTTAnnouncementText] = React.useState([]);
     const getTitle = () => {
         var _a, _b, _c;
         if (isCaptionsOn && isRealTimeTextOn) {
@@ -25450,6 +25471,24 @@ const CaptionsBanner = (props) => {
             setTextFieldValue('');
         }
     }, [latestLocalRealTimeText]);
+    React.useEffect(() => {
+        if (realTimeTexts === null || realTimeTexts === void 0 ? void 0 : realTimeTexts.completedMessages) {
+            //filter out the messages that have already been announced
+            const rTTMessagesToAnnounce = realTimeTexts.completedMessages.filter(message => !announcedRTT.includes(message.id));
+            if (rTTMessagesToAnnounce.length > 0) {
+                setRTTAnnouncementText(rTTMessagesToAnnounce);
+                setAnnouncedRTT(prev => [...prev, ...rTTMessagesToAnnounce.map(message => message.id)]);
+            }
+        }
+        if (captions.length > 0) {
+            // filter out the captions that have already been announced
+            const captionsToAnnounce = captions.filter(caption => !announcedCaption.includes(caption.id) && caption.isFinalized);
+            if (captionsToAnnounce.length > 0) {
+                setCaptionAnnouncementText(captionsToAnnounce);
+                setAnnouncedCaption(prev => [...prev, ...captionsToAnnounce.map(caption => caption.id)]);
+            }
+        }
+    }, [captions, realTimeTexts === null || realTimeTexts === void 0 ? void 0 : realTimeTexts.completedMessages, announcedRTT, announcedCaption]);
     const handleKeyDown = (event) => {
         if (event.key === 'Enter') {
             event.preventDefault();
@@ -25475,6 +25514,19 @@ const CaptionsBanner = (props) => {
         }));
     };
     return React.createElement(React.Fragment, null, (startCaptionsInProgress || isCaptionsOn || isRealTimeTextOn) && React.createElement(react.FocusZone, { shouldFocusOnMount: true, className: captionsContainerClassName, "data-ui-id": "captions-banner" },
+        (rttAnnouncementText.length > 0 || (captionAnnouncementText === null || captionAnnouncementText === void 0 ? void 0 : captionAnnouncementText.length) > 0) && React.createElement("div", { "aria-live": "assertive", role: "alert", "aria-atomic": "true", className: hiddenAnnouncementClassName },
+            React.createElement("span", null, rttAnnouncementText.map(text => React.createElement("span", null,
+                strings.realTimeTextBannerTitle,
+                " ",
+                text.displayName,
+                ": ",
+                text.message))),
+            React.createElement("span", null, captionAnnouncementText.map(text => React.createElement("span", null,
+                strings.captionsOnlyContainerTitle,
+                " ",
+                text.displayName,
+                ": ",
+                text.captionText)))),
         (isCaptionsOn || isRealTimeTextOn) && formFactor === 'compact' && React.createElement(react.Stack, { horizontal: true, horizontalAlign: "space-between", verticalAlign: "center", className: bannerTitleContainerClassName },
             React.createElement(react.Text, { className: titleClassName$2 }, getTitle()),
             React.createElement(react.IconButton, { "data-ui-id": "captions-banner-expand-icon", iconProps: {
@@ -31175,10 +31227,10 @@ const AttachmentDownloadErrorBar = (props) => {
 /**
  * Wrapper for RichTextSendBox component to allow us to use usePropsFor with richTextSendBox with lazy loading
  */
-const RichTextSendBoxWrapper = React.lazy(() => Promise.resolve().then(function () { return require('./RichTextSendBoxWrapper-G0IPk_nq.js'); }).then(module => ({
+const RichTextSendBoxWrapper = React.lazy(() => Promise.resolve().then(function () { return require('./RichTextSendBoxWrapper-K8NQvjwe.js'); }).then(module => ({
     default: module.RichTextSendBoxWrapper
 })));
-const loadRichTextSendBox = () => Promise.resolve().then(function () { return require('./RichTextSendBoxWrapper-G0IPk_nq.js'); }).then(module => ({
+const loadRichTextSendBox = () => Promise.resolve().then(function () { return require('./RichTextSendBoxWrapper-K8NQvjwe.js'); }).then(module => ({
     default: module.RichTextSendBoxWrapper
 }));
 /**
@@ -32427,31 +32479,46 @@ const isDisabled$4 = (option) => {
     }
     return option.disabled;
 };
+const isAndroidWebView = (environmentInfo) => {
+    var _a, _b;
+    const ua = navigator.userAgent || '';
+    return ((_b = (_a = environmentInfo === null || environmentInfo === void 0 ? void 0 : environmentInfo.environment) === null || _a === void 0 ? void 0 : _a.browser) === null || _b === void 0 ? void 0 : _b.toLowerCase()) === 'chrome webview' || /Android/.test(ua) && /Version\/[\d.]+/.test(ua) && /wv/.test(ua);
+};
 /**
  * @returns Permissions state for the camera.
  */
-const queryCameraPermissionFromPermissionsAPI = () => __awaiter$r(void 0, void 0, void 0, function* () {
+const queryCameraPermissionFromPermissionsAPI = (environmentInfo) => __awaiter$r(void 0, void 0, void 0, function* () {
+    // Android WebView does not support permissions API, nor does it throw an error when trying to access it,
+    // in actuality the API always returns 'prompt' which is not correct.
+    if (isAndroidWebView(environmentInfo)) {
+        return 'unsupported';
+    }
     try {
         return (yield navigator.permissions.query({
             name: 'camera'
         })).state;
+        // eslint-disable-next-line @typescript-eslint/no-unused-vars
     }
     catch (e) {
-        console.info('permissions API is not supported by browser', e);
         return 'unsupported';
     }
 });
 /**
  * @returns Permissions state for the microphone.
  */
-const queryMicrophonePermissionFromPermissionsAPI = () => __awaiter$r(void 0, void 0, void 0, function* () {
+const queryMicrophonePermissionFromPermissionsAPI = (environmentInfo) => __awaiter$r(void 0, void 0, void 0, function* () {
+    // Android WebView does not support permissions API, nor does it throw an error when trying to access it,
+    // in actuality the API always returns 'prompt' which is not correct.
+    if (isAndroidWebView(environmentInfo)) {
+        return 'unsupported';
+    }
     try {
         return (yield navigator.permissions.query({
             name: 'microphone'
         })).state;
+        // eslint-disable-next-line @typescript-eslint/no-unused-vars
     }
     catch (e) {
-        console.info('permissions API is not supported by browser', e);
         return 'unsupported';
     }
 });
@@ -32462,10 +32529,14 @@ const queryMicrophonePermissionFromPermissionsAPI = () => __awaiter$r(void 0, vo
  * If permission API is not supported on this browser, permission state is set to unsupported.
  * @private
  */
-const getDevicePermissionState = (setVideoState, setAudioState) => __awaiter$r(void 0, void 0, void 0, function* () {
-    const [cameraResult, microphoneResult] = yield Promise.all([queryCameraPermissionFromPermissionsAPI(), queryMicrophonePermissionFromPermissionsAPI()]);
-    setVideoState(cameraResult);
-    setAudioState(microphoneResult);
+const getDevicePermissionState = (environmentInfo, setVideoState, setAudioState, previousVideoState, previousAudioState) => __awaiter$r(void 0, void 0, void 0, function* () {
+    const [cameraResult, microphoneResult] = yield Promise.all([queryCameraPermissionFromPermissionsAPI(environmentInfo), queryMicrophonePermissionFromPermissionsAPI(environmentInfo)]);
+    if (cameraResult !== previousVideoState) {
+        setVideoState(cameraResult);
+    }
+    if (microphoneResult !== previousAudioState) {
+        setAudioState(microphoneResult);
+    }
 });
 /**
  * Check if we are using safari browser
@@ -40160,10 +40231,11 @@ const ConfigurationPage = (props) => {
     const theme = useTheme();
     const options = useAdaptedSelector(getSelector$1(DevicesButton));
     const localDeviceSettingsHandlers = useHandlers();
-    const { video: cameraPermissionGranted, audio: microphonePermissionGranted } = useSelector$1(devicePermissionSelector); // use permission API to get video and audio permission state
+    const { video: cameraPermissionGranted, audio: microphonePermissionGranted } = useSelector$1(devicePermissionSelector);
+    const environmentInfo = useSelector$1(getEnvironmentInfo); // use permission API to get video and audio permission state
     const [videoState, setVideoState] = React.useState(undefined);
     const [audioState, setAudioState] = React.useState(undefined);
-    getDevicePermissionState(setVideoState, setAudioState);
+    getDevicePermissionState(environmentInfo, setVideoState, setAudioState, videoState, audioState);
     const configContainerRef = React.useRef(null);
     const configWidth = _useContainerWidth(configContainerRef);
     /**
@@ -40173,7 +40245,6 @@ const ConfigurationPage = (props) => {
     const stackConfig = !!configWidth && configWidth < 450;
     const errorBarProps = usePropsFor$1(ErrorBar);
     const microphones = useSelector$1(getMicrophones);
-    const environmentInfo = useSelector$1(getEnvironmentInfo);
     let disableStartCallButton = (!microphonePermissionGranted || (microphones === null || microphones === void 0 ? void 0 : microphones.length) === 0) && joinCallOptions.microphoneCheck === 'requireMicrophoneAvailable';
     const role = useSelector$1(getRole);
     const isCameraOn = useSelector$1(localVideoSelector).isAvailable;
@@ -40226,19 +40297,21 @@ const ConfigurationPage = (props) => {
         React.createElement(SvgWithWordWrapping, { width: mobileView ? 325 : 445, lineHeightPx: 16 * 1.5, bufferHeightPx: 16, text: locale.strings.call.configurationPageTitle, role: "heading" })) : React.createElement(React.Fragment, null);
     const callDescription = locale.strings.call.configurationPageCallDetails && React.createElement(react.Stack.Item, { className: mobileView ? callDetailsStyleMobile(theme) : callDetailsStyleDesktop(theme) }, locale.strings.call.configurationPageCallDetails);
     const mobileWithPreview = mobileView && role !== 'Consumer';
-    const permissionsState = {
+    const permissionsState = React.useMemo(() => ({
         // fall back to using cameraPermissionGranted and microphonePermissionGranted if permission API is not supported
         camera: videoState && videoState !== 'unsupported' ? cameraPermissionGranted !== false ? videoState : 'denied' : cameraPermissionGranted !== false ? cameraPermissionGranted ? 'granted' : 'prompt' : 'denied',
         microphone: audioState && audioState !== 'unsupported' ? microphonePermissionGranted !== false ? audioState : 'denied' : microphonePermissionGranted !== false ? microphonePermissionGranted ? 'granted' : 'prompt' : 'denied'
-    };
+    }), [videoState, audioState, cameraPermissionGranted, microphonePermissionGranted]);
     const networkErrors = errorBarProps.activeErrorMessages.filter(message => message.type === 'callNetworkQualityLow');
     const [isPermissionsModalDismissed, setIsPermissionsModalDismissed] = React.useState(true);
     // When permission API is not available, we want to show screen saying checking for access (disappears on its own)
     // then based on permission setting, we show permission denied or nothing
     const [minimumFallbackTimerElapsed, setMinimumFallbackTimerElapsed] = React.useState(false);
-    setTimeout(() => {
-        setMinimumFallbackTimerElapsed(true);
-    }, 2000);
+    React.useEffect(() => {
+        setTimeout(() => {
+            setMinimumFallbackTimerElapsed(true);
+        }, 2000);
+    }, []);
     const forceShowingCheckPermissions = !minimumFallbackTimerElapsed;
     const { toggleVideoEffectsPane, closeVideoEffectsPane, isVideoEffectsPaneOpen } = useVideoEffectsPane(props.updateSidePaneRenderer, mobileView, props.latestErrors, props.onDismissError);
     const startCall = React.useCallback(() => __awaiter$c(void 0, void 0, void 0, function* () {
@@ -46024,4 +46097,4 @@ exports.useTeamsCall = useTeamsCall;
 exports.useTeamsCallAdapter = useTeamsCallAdapter;
 exports.useTeamsCallAgent = useTeamsCallAgent;
 exports.useTheme = useTheme;
-//# sourceMappingURL=index-DYS7KDhY.js.map
+//# sourceMappingURL=index-C-rok69c.js.map