@azure/communication-react 1.23.0-alpha-202501210016 → 1.23.0-alpha-202501240016

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.
Files changed (55) hide show
  1. package/dist/communication-react.d.ts +12 -0
  2. package/dist/dist-cjs/communication-react/{ChatMessageComponentAsRichTextEditBox-CMUxW96S.js → ChatMessageComponentAsRichTextEditBox-BhrjFUxc.js} +2 -2
  3. package/dist/dist-cjs/communication-react/{ChatMessageComponentAsRichTextEditBox-CMUxW96S.js.map → ChatMessageComponentAsRichTextEditBox-BhrjFUxc.js.map} +1 -1
  4. package/dist/dist-cjs/communication-react/{RichTextSendBoxWrapper-BfQiiIZI.js → RichTextSendBoxWrapper-BDKhvEqz.js} +2 -2
  5. package/dist/dist-cjs/communication-react/{RichTextSendBoxWrapper-BfQiiIZI.js.map → RichTextSendBoxWrapper-BDKhvEqz.js.map} +1 -1
  6. package/dist/dist-cjs/communication-react/{index-OeCMQYx2.js → index-CkJB-dVG.js} +153 -84
  7. package/dist/dist-cjs/communication-react/index-CkJB-dVG.js.map +1 -0
  8. package/dist/dist-cjs/communication-react/index.js +1 -1
  9. package/dist/dist-esm/acs-ui-common/src/telemetryVersion.js +1 -1
  10. package/dist/dist-esm/acs-ui-common/src/telemetryVersion.js.map +1 -1
  11. package/dist/dist-esm/calling-component-bindings/src/baseSelectors.d.ts +5 -0
  12. package/dist/dist-esm/calling-component-bindings/src/baseSelectors.js +5 -0
  13. package/dist/dist-esm/calling-component-bindings/src/baseSelectors.js.map +1 -1
  14. package/dist/dist-esm/calling-component-bindings/src/handlers/createCommonHandlers.js +2 -2
  15. package/dist/dist-esm/calling-component-bindings/src/handlers/createCommonHandlers.js.map +1 -1
  16. package/dist/dist-esm/calling-component-bindings/src/handlers/createTeamsCallHandlers.js +2 -4
  17. package/dist/dist-esm/calling-component-bindings/src/handlers/createTeamsCallHandlers.js.map +1 -1
  18. package/dist/dist-esm/calling-component-bindings/src/notificationStackSelector.js.map +1 -1
  19. package/dist/dist-esm/calling-component-bindings/src/utils/videoGalleryUtils.d.ts +10 -0
  20. package/dist/dist-esm/calling-component-bindings/src/utils/videoGalleryUtils.js +13 -0
  21. package/dist/dist-esm/calling-component-bindings/src/utils/videoGalleryUtils.js.map +1 -1
  22. package/dist/dist-esm/calling-component-bindings/src/videoGallerySelector.d.ts +5 -0
  23. package/dist/dist-esm/calling-component-bindings/src/videoGallerySelector.js +19 -4
  24. package/dist/dist-esm/calling-component-bindings/src/videoGallerySelector.js.map +1 -1
  25. package/dist/dist-esm/calling-stateful-client/src/CallContext.js +1 -1
  26. package/dist/dist-esm/calling-stateful-client/src/CallContext.js.map +1 -1
  27. package/dist/dist-esm/calling-stateful-client/src/TogetherModeSubscriber.js +20 -20
  28. package/dist/dist-esm/calling-stateful-client/src/TogetherModeSubscriber.js.map +1 -1
  29. package/dist/dist-esm/react-components/src/components/CaptionsBanner.d.ts +4 -0
  30. package/dist/dist-esm/react-components/src/components/CaptionsBanner.js +1 -1
  31. package/dist/dist-esm/react-components/src/components/CaptionsBanner.js.map +1 -1
  32. package/dist/dist-esm/react-components/src/components/ChatMessage/MessageComponents/FluentChatMessageComponent.js +6 -1
  33. package/dist/dist-esm/react-components/src/components/ChatMessage/MessageComponents/FluentChatMessageComponent.js.map +1 -1
  34. package/dist/dist-esm/react-components/src/components/ChatMessage/MyMessageComponents/ChatMyMessageComponent.d.ts +0 -1
  35. package/dist/dist-esm/react-components/src/components/ChatMessage/MyMessageComponents/ChatMyMessageComponent.js +11 -7
  36. package/dist/dist-esm/react-components/src/components/ChatMessage/MyMessageComponents/ChatMyMessageComponent.js.map +1 -1
  37. package/dist/dist-esm/react-components/src/components/ChatMessage/MyMessageComponents/ChatMyMessageComponentAsMessageBubble.d.ts +1 -0
  38. package/dist/dist-esm/react-components/src/components/ChatMessage/MyMessageComponents/ChatMyMessageComponentAsMessageBubble.js +39 -18
  39. package/dist/dist-esm/react-components/src/components/ChatMessage/MyMessageComponents/ChatMyMessageComponentAsMessageBubble.js.map +1 -1
  40. package/dist/dist-esm/react-components/src/components/ChatMessage/MyMessageComponents/FluentChatMyMessageComponent.js +9 -12
  41. package/dist/dist-esm/react-components/src/components/ChatMessage/MyMessageComponents/FluentChatMyMessageComponent.js.map +1 -1
  42. package/dist/dist-esm/react-components/src/components/styles/MessageThread.styles.d.ts +5 -1
  43. package/dist/dist-esm/react-components/src/components/styles/MessageThread.styles.js +9 -12
  44. package/dist/dist-esm/react-components/src/components/styles/MessageThread.styles.js.map +1 -1
  45. package/dist/dist-esm/react-components/src/components/utils/ChatMessageComponentUtils.d.ts +9 -0
  46. package/dist/dist-esm/react-components/src/components/utils/ChatMessageComponentUtils.js +15 -0
  47. package/dist/dist-esm/react-components/src/components/utils/ChatMessageComponentUtils.js.map +1 -1
  48. package/dist/dist-esm/react-components/src/localization/locales/en-US/strings.json +1 -0
  49. package/dist/dist-esm/react-composites/src/composites/CallComposite/Strings.d.ts +4 -0
  50. package/dist/dist-esm/react-composites/src/composites/CallComposite/Strings.js.map +1 -1
  51. package/dist/dist-esm/react-composites/src/composites/common/CallingCaptionsBanner.js +2 -0
  52. package/dist/dist-esm/react-composites/src/composites/common/CallingCaptionsBanner.js.map +1 -1
  53. package/dist/dist-esm/react-composites/src/composites/localization/locales/en-US/strings.json +1 -0
  54. package/package.json +1 -1
  55. package/dist/dist-cjs/communication-react/index-OeCMQYx2.js.map +0 -1
@@ -1 +1 @@
1
- {"version":3,"file":"FluentChatMyMessageComponent.js","sourceRoot":"","sources":["../../../../../../../../react-components/src/components/ChatMessage/MyMessageComponents/FluentChatMyMessageComponent.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { MessageStatus, _formatString } from '@internal/acs-ui-common';\nimport React, { useCallback, useMemo, useRef } from 'react';\nimport { MessageProps, _ChatMessageProps } from '../../MessageThread';\nimport { ChatMessage } from '../../../types';\n/* @conditional-compile-remove(data-loss-prevention) */\nimport { BlockedMessage } from '../../../types';\nimport { noMessageStatusStyle, useChatMessageRenderStyles } from '../../styles/MessageThread.styles';\nimport { mergeStyles } from '@fluentui/react';\nimport { mergeClasses } from '@fluentui/react-components';\nimport { createStyleFromV8Style } from '../../styles/v8StyleShim';\nimport { MessageStatusIndicatorProps } from '../../MessageStatusIndicator';\nimport { ChatMyMessageComponent } from './ChatMyMessageComponent';\nimport { ChatMyMessage as FluentChatMyMessage } from '@fluentui-contrib/react-chat';\nimport { getFluentUIAttachedValue } from '../../utils/ChatMessageComponentUtils';\nimport type { FluentChatMessageComponentWrapperProps } from '../MessageComponents/FluentChatMessageComponent';\n\n/**\n * The component for rendering a chat message using Fluent UI components\n * and handling default and custom renderers.\n * This component handles rendering for chat message body, avatar and message status.\n * The chat message body, avatar and message status should be shown for both default and custom renderers.\n *\n * @private\n */\nexport const FluentChatMyMessageComponent = (props: FluentChatMessageComponentWrapperProps): JSX.Element => {\n const {\n message,\n styles,\n shouldOverlapAvatarAndMessage,\n onRenderMessage,\n onRenderAvatar,\n showMessageStatus,\n onRenderMessageStatus,\n participantCount,\n readCount,\n onActionButtonClick,\n /* @conditional-compile-remove(date-time-customization) */\n onDisplayDateTimeString,\n inlineImageOptions,\n /* @conditional-compile-remove(mention) */\n mentionOptions,\n userId,\n defaultStatusRenderer,\n statusToRender,\n actionsForAttachment,\n onRenderAttachmentDownloads,\n /* @conditional-compile-remove(rich-text-editor) */\n isRichTextEditorEnabled,\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n onPaste,\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n inlineImagesWithProgress,\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n onRemoveInlineImage,\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n onInsertInlineImage\n } = props;\n const chatMessageRenderStyles = useChatMessageRenderStyles();\n const fluentMessageBodyRef = useRef<HTMLDivElement>(null);\n\n const onEditComplete = useCallback(() => {\n fluentMessageBodyRef.current?.focus();\n }, []);\n\n // To rerender the defaultChatMessageRenderer if app running across days(every new day chat time stamp\n // needs to be regenerated), the dependency on \"new Date().toDateString()\"\" is added.\n const defaultChatMessageRenderer = useCallback(\n (messageProps: MessageProps) => {\n if (\n messageProps.message.messageType === 'chat' ||\n /* @conditional-compile-remove(data-loss-prevention) */ messageProps.message.messageType === 'blocked'\n ) {\n return (\n <ChatMyMessageComponent\n {...messageProps}\n onEditComplete={onEditComplete}\n onRenderAttachmentDownloads={onRenderAttachmentDownloads}\n strings={messageProps.strings}\n message={messageProps.message}\n userId={userId}\n remoteParticipantsCount={participantCount ? participantCount - 1 : 0}\n shouldOverlapAvatarAndMessage={shouldOverlapAvatarAndMessage}\n onRenderAvatar={onRenderAvatar}\n showMessageStatus={showMessageStatus}\n messageStatus={messageProps.message.status}\n onActionButtonClick={onActionButtonClick}\n /* @conditional-compile-remove(date-time-customization) */\n onDisplayDateTimeString={onDisplayDateTimeString}\n inlineImageOptions={inlineImageOptions}\n /* @conditional-compile-remove(mention) */\n mentionOptions={mentionOptions}\n actionsForAttachment={actionsForAttachment}\n /* @conditional-compile-remove(rich-text-editor) */\n isRichTextEditorEnabled={isRichTextEditorEnabled}\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n onPaste={onPaste}\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n onRemoveInlineImage={onRemoveInlineImage}\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n onInsertInlineImage={onInsertInlineImage}\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n inlineImagesWithProgress={inlineImagesWithProgress}\n />\n );\n }\n return <></>;\n },\n [\n onActionButtonClick,\n onRenderAvatar,\n participantCount,\n shouldOverlapAvatarAndMessage,\n showMessageStatus,\n userId,\n /* @conditional-compile-remove(date-time-customization) */\n onDisplayDateTimeString,\n inlineImageOptions,\n /* @conditional-compile-remove(mention) */\n mentionOptions,\n onRenderAttachmentDownloads,\n actionsForAttachment,\n // eslint-disable-next-line react-hooks/exhaustive-deps\n new Date().toDateString(),\n /* @conditional-compile-remove(rich-text-editor) */\n isRichTextEditorEnabled,\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n onPaste,\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n onRemoveInlineImage,\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n onInsertInlineImage,\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n inlineImagesWithProgress,\n onEditComplete\n ]\n );\n\n const messageRenderer = useCallback(\n (messageProps: MessageProps) => {\n return onRenderMessage === undefined\n ? defaultChatMessageRenderer({ ...messageProps })\n : onRenderMessage(messageProps, defaultChatMessageRenderer);\n },\n [defaultChatMessageRenderer, onRenderMessage]\n );\n\n const messageStatusRenderer = useCallback(\n (\n onRenderMessageStatus:\n | ((messageStatusIndicatorProps: MessageStatusIndicatorProps) => JSX.Element | null)\n | undefined,\n defaultStatusRenderer: (\n message: ChatMessage | /* @conditional-compile-remove(data-loss-prevention) */ BlockedMessage,\n participantCount: number,\n readCount: number,\n status?: MessageStatus\n ) => JSX.Element,\n showMessageStatus?: boolean,\n participantCount?: number,\n readCount?: number\n ) => {\n return showMessageStatus && statusToRender ? (\n onRenderMessageStatus ? (\n onRenderMessageStatus({ status: message.status })\n ) : (\n defaultStatusRenderer(message, participantCount ?? 0, readCount ?? 0, message.status)\n )\n ) : (\n <div className={mergeStyles(noMessageStatusStyle)} />\n );\n },\n [message, statusToRender]\n );\n\n const attached = useMemo(() => {\n return getFluentUIAttachedValue(message.attached);\n }, [message.attached]);\n\n const myMessageRootProps = useMemo(() => {\n return {\n // myChatItemMessageContainer used in className and style prop as style prop can't handle CSS selectors\n className: mergeClasses(\n chatMessageRenderStyles.rootMyMessage,\n chatMessageRenderStyles.rootCommon,\n mergeStyles(styles?.myChatItemMessageContainer)\n ),\n style:\n styles?.myChatItemMessageContainer !== undefined\n ? createStyleFromV8Style(styles?.myChatItemMessageContainer)\n : {},\n role: 'none'\n };\n }, [chatMessageRenderStyles.rootCommon, chatMessageRenderStyles.rootMyMessage, styles?.myChatItemMessageContainer]);\n\n const myMessageBodyProps = useMemo(() => {\n return {\n className: mergeClasses(chatMessageRenderStyles.bodyCommon, chatMessageRenderStyles.bodyMyMessage),\n ref: fluentMessageBodyRef\n };\n }, [chatMessageRenderStyles.bodyCommon, chatMessageRenderStyles.bodyMyMessage]);\n\n const myMessageStatusIcon = useMemo(() => {\n return (\n <div\n className={mergeStyles(\n { paddingLeft: '0.25rem' },\n styles?.messageStatusContainer ? styles.messageStatusContainer(message.mine ?? false) : ''\n )}\n >\n {message.status\n ? messageStatusRenderer(\n onRenderMessageStatus,\n defaultStatusRenderer,\n showMessageStatus,\n participantCount,\n readCount\n )\n : undefined}\n </div>\n );\n }, [\n defaultStatusRenderer,\n message.mine,\n message.status,\n messageStatusRenderer,\n onRenderMessageStatus,\n participantCount,\n readCount,\n showMessageStatus,\n styles\n ]);\n\n // Fluent UI message components are used here as for default message renderer,\n // timestamp and author name should be shown but they aren't shown for custom renderer.\n // More investigations are needed to check if this can be simplified with states.\n // Status and avatar should be shown for both custom and default renderers.\n return (\n <FluentChatMyMessage\n attached={attached}\n root={myMessageRootProps}\n body={myMessageBodyProps}\n statusIcon={myMessageStatusIcon}\n >\n {messageRenderer({ ...props })}\n </FluentChatMyMessage>\n );\n};\n"]}
1
+ {"version":3,"file":"FluentChatMyMessageComponent.js","sourceRoot":"","sources":["../../../../../../../../react-components/src/components/ChatMessage/MyMessageComponents/FluentChatMyMessageComponent.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { MessageStatus, _formatString } from '@internal/acs-ui-common';\nimport React, { useCallback, useMemo } from 'react';\nimport { MessageProps, _ChatMessageProps } from '../../MessageThread';\nimport { ChatMessage } from '../../../types';\n/* @conditional-compile-remove(data-loss-prevention) */\nimport { BlockedMessage } from '../../../types';\nimport { noMessageStatusStyle, useChatMessageRenderStyles } from '../../styles/MessageThread.styles';\nimport { mergeStyles } from '@fluentui/react';\nimport { mergeClasses } from '@fluentui/react-components';\nimport { createStyleFromV8Style } from '../../styles/v8StyleShim';\nimport { MessageStatusIndicatorProps } from '../../MessageStatusIndicator';\nimport { ChatMyMessageComponent } from './ChatMyMessageComponent';\nimport { ChatMyMessage as FluentChatMyMessage } from '@fluentui-contrib/react-chat';\nimport {\n getFluentUIAttachedValue,\n removeFluentUIKeyboardNavigationStyles\n} from '../../utils/ChatMessageComponentUtils';\nimport type { FluentChatMessageComponentWrapperProps } from '../MessageComponents/FluentChatMessageComponent';\n\n/**\n * The component for rendering a chat message using Fluent UI components\n * and handling default and custom renderers.\n * This component handles rendering for chat message body, avatar and message status.\n * The chat message body, avatar and message status should be shown for both default and custom renderers.\n *\n * @private\n */\nexport const FluentChatMyMessageComponent = (props: FluentChatMessageComponentWrapperProps): JSX.Element => {\n const {\n message,\n styles,\n shouldOverlapAvatarAndMessage,\n onRenderMessage,\n onRenderAvatar,\n showMessageStatus,\n onRenderMessageStatus,\n participantCount,\n readCount,\n onActionButtonClick,\n /* @conditional-compile-remove(date-time-customization) */\n onDisplayDateTimeString,\n inlineImageOptions,\n /* @conditional-compile-remove(mention) */\n mentionOptions,\n userId,\n defaultStatusRenderer,\n statusToRender,\n actionsForAttachment,\n onRenderAttachmentDownloads,\n /* @conditional-compile-remove(rich-text-editor) */\n isRichTextEditorEnabled,\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n onPaste,\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n inlineImagesWithProgress,\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n onRemoveInlineImage,\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n onInsertInlineImage\n } = props;\n const chatMessageRenderStyles = useChatMessageRenderStyles();\n\n // To rerender the defaultChatMessageRenderer if app running across days(every new day chat time stamp\n // needs to be regenerated), the dependency on \"new Date().toDateString()\"\" is added.\n const defaultChatMessageRenderer = useCallback(\n (messageProps: MessageProps) => {\n if (\n messageProps.message.messageType === 'chat' ||\n /* @conditional-compile-remove(data-loss-prevention) */ messageProps.message.messageType === 'blocked'\n ) {\n return (\n <ChatMyMessageComponent\n {...messageProps}\n onRenderAttachmentDownloads={onRenderAttachmentDownloads}\n strings={messageProps.strings}\n message={messageProps.message}\n userId={userId}\n remoteParticipantsCount={participantCount ? participantCount - 1 : 0}\n shouldOverlapAvatarAndMessage={shouldOverlapAvatarAndMessage}\n onRenderAvatar={onRenderAvatar}\n showMessageStatus={showMessageStatus}\n messageStatus={messageProps.message.status}\n onActionButtonClick={onActionButtonClick}\n /* @conditional-compile-remove(date-time-customization) */\n onDisplayDateTimeString={onDisplayDateTimeString}\n inlineImageOptions={inlineImageOptions}\n /* @conditional-compile-remove(mention) */\n mentionOptions={mentionOptions}\n actionsForAttachment={actionsForAttachment}\n /* @conditional-compile-remove(rich-text-editor) */\n isRichTextEditorEnabled={isRichTextEditorEnabled}\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n onPaste={onPaste}\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n onRemoveInlineImage={onRemoveInlineImage}\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n onInsertInlineImage={onInsertInlineImage}\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n inlineImagesWithProgress={inlineImagesWithProgress}\n />\n );\n }\n return <></>;\n },\n [\n onActionButtonClick,\n onRenderAvatar,\n participantCount,\n shouldOverlapAvatarAndMessage,\n showMessageStatus,\n userId,\n /* @conditional-compile-remove(date-time-customization) */\n onDisplayDateTimeString,\n inlineImageOptions,\n /* @conditional-compile-remove(mention) */\n mentionOptions,\n onRenderAttachmentDownloads,\n actionsForAttachment,\n // eslint-disable-next-line react-hooks/exhaustive-deps\n new Date().toDateString(),\n /* @conditional-compile-remove(rich-text-editor) */\n isRichTextEditorEnabled,\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n onPaste,\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n onRemoveInlineImage,\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n onInsertInlineImage,\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n inlineImagesWithProgress\n ]\n );\n\n const messageRenderer = useCallback(\n (messageProps: MessageProps) => {\n return onRenderMessage === undefined\n ? defaultChatMessageRenderer({ ...messageProps })\n : onRenderMessage(messageProps, defaultChatMessageRenderer);\n },\n [defaultChatMessageRenderer, onRenderMessage]\n );\n\n const messageStatusRenderer = useCallback(\n (\n onRenderMessageStatus:\n | ((messageStatusIndicatorProps: MessageStatusIndicatorProps) => JSX.Element | null)\n | undefined,\n defaultStatusRenderer: (\n message: ChatMessage | /* @conditional-compile-remove(data-loss-prevention) */ BlockedMessage,\n participantCount: number,\n readCount: number,\n status?: MessageStatus\n ) => JSX.Element,\n showMessageStatus?: boolean,\n participantCount?: number,\n readCount?: number\n ) => {\n return showMessageStatus && statusToRender ? (\n onRenderMessageStatus ? (\n onRenderMessageStatus({ status: message.status })\n ) : (\n defaultStatusRenderer(message, participantCount ?? 0, readCount ?? 0, message.status)\n )\n ) : (\n <div className={mergeStyles(noMessageStatusStyle)} />\n );\n },\n [message, statusToRender]\n );\n\n const attached = useMemo(() => {\n return getFluentUIAttachedValue(message.attached);\n }, [message.attached]);\n\n const myMessageRootProps = useMemo(() => {\n return {\n // myChatItemMessageContainer used in className and style prop as style prop can't handle CSS selectors\n className: mergeClasses(\n chatMessageRenderStyles.rootMyMessage,\n chatMessageRenderStyles.rootCommon,\n mergeStyles(styles?.myChatItemMessageContainer)\n ),\n style:\n styles?.myChatItemMessageContainer !== undefined\n ? createStyleFromV8Style(styles?.myChatItemMessageContainer)\n : {},\n role: 'none'\n };\n }, [chatMessageRenderStyles.rootCommon, chatMessageRenderStyles.rootMyMessage, styles?.myChatItemMessageContainer]);\n\n const setMessageContainerRef = useCallback((node: HTMLDivElement | null) => {\n removeFluentUIKeyboardNavigationStyles(node);\n }, []);\n\n const myMessageBodyProps = useMemo(() => {\n return {\n className: mergeClasses(chatMessageRenderStyles.bodyCommon, chatMessageRenderStyles.bodyMyMessage),\n ref: setMessageContainerRef\n };\n }, [chatMessageRenderStyles.bodyCommon, chatMessageRenderStyles.bodyMyMessage, setMessageContainerRef]);\n\n const myMessageStatusIcon = useMemo(() => {\n return (\n <div\n className={mergeStyles(\n { paddingLeft: '0.25rem' },\n styles?.messageStatusContainer ? styles.messageStatusContainer(message.mine ?? false) : ''\n )}\n >\n {message.status\n ? messageStatusRenderer(\n onRenderMessageStatus,\n defaultStatusRenderer,\n showMessageStatus,\n participantCount,\n readCount\n )\n : undefined}\n </div>\n );\n }, [\n defaultStatusRenderer,\n message.mine,\n message.status,\n messageStatusRenderer,\n onRenderMessageStatus,\n participantCount,\n readCount,\n showMessageStatus,\n styles\n ]);\n\n // Fluent UI message components are used here as for default message renderer,\n // timestamp and author name should be shown but they aren't shown for custom renderer.\n // More investigations are needed to check if this can be simplified with states.\n // Status and avatar should be shown for both custom and default renderers.\n return (\n <FluentChatMyMessage\n attached={attached}\n root={myMessageRootProps}\n body={myMessageBodyProps}\n statusIcon={myMessageStatusIcon}\n >\n {messageRenderer({ ...props })}\n </FluentChatMyMessage>\n );\n};\n"]}
@@ -1,6 +1,10 @@
1
1
  import { IButtonStyles } from '@fluentui/react';
2
2
  import { CSSProperties } from 'react';
3
3
  import { ComponentSlotStyle } from '../../types';
4
+ /**
5
+ * @private
6
+ */
7
+ export declare const chatMyMessageActionMenuClassName = "ChatMyMessage__actions";
4
8
  /**
5
9
  * @private
6
10
  */
@@ -24,7 +28,7 @@ export declare const useChatMessageRenderStyles: () => Record<"rootCommon" | "ro
24
28
  /**
25
29
  * @private
26
30
  */
27
- export declare const useChatMyMessageStyles: () => Record<"body" | "menu" | "root" | "menuHidden" | "bodyWithPlaceholderImage" | "bodyAttached" | "menuAttached" | "menuVisible" | "multipleAttachmentsInViewing" | "multipleAttachmentsInEditing", string>;
31
+ export declare const useChatMyMessageStyles: () => Record<"body" | "menu" | "root" | "menuHidden" | "bodyWithPlaceholderImage" | "bodyAttached" | "menuVisible" | "multipleAttachmentsInViewing" | "multipleAttachmentsInEditing", string>;
28
32
  /**
29
33
  * @private
30
34
  */
@@ -21,6 +21,10 @@ const CHAT_MESSAGE_ZINDEX = 1;
21
21
  const AVATAR_ZINDEX = 2;
22
22
  // new message button should be on top of chat message
23
23
  const NEW_MESSAGE_BUTTON_ZINDEX = 2;
24
+ /**
25
+ * @private
26
+ */
27
+ export const chatMyMessageActionMenuClassName = 'ChatMyMessage__actions';
24
28
  /**
25
29
  * @private
26
30
  */
@@ -105,21 +109,17 @@ export const useChatMessageRenderStyles = makeStyles({
105
109
  */
106
110
  export const useChatMyMessageStyles = makeStyles({
107
111
  root: {
108
- // The first column's width should be set to 1fr
109
- // because otherwise rich text editor's width will grow indefinitely
110
- gridTemplateColumns: '1fr auto',
112
+ gridTemplateColumns: 'auto',
111
113
  gridTemplateAreas: `
112
- ". actions"
113
- "body body"
114
+ "body"
114
115
  `,
115
116
  gridGap: '0',
116
- columnGap: '0',
117
117
  paddingTop: '0',
118
118
  marginLeft: '0'
119
119
  },
120
- body: Object.assign(Object.assign({ paddingBottom: '10px', marginTop: '1rem', maxWidth: '100%', minWidth: `${CHAT_MESSAGE_CONTAINER_MIN_WIDTH_REM}rem`, marginLeft: '0rem' }, shorthands.border('1px', 'solid', 'transparent')), { '&:hover ~ .fui-ChatMyMessage__actions': {
120
+ body: Object.assign(Object.assign({ paddingBottom: '10px', marginTop: '1rem', maxWidth: '100%', minWidth: `${CHAT_MESSAGE_CONTAINER_MIN_WIDTH_REM}rem`, marginLeft: '0rem' }, shorthands.border('1px', 'solid', 'transparent')), { '&:hover .ChatMyMessage__actions': {
121
121
  visibility: 'visible'
122
- }, '&:focus ~ .fui-ChatMyMessage__actions': {
122
+ }, '&:focus .ChatMyMessage__actions': {
123
123
  visibility: 'visible'
124
124
  }, '& msft-mention': {
125
125
  color: tokens.colorStatusWarningBackground3,
@@ -142,13 +142,10 @@ export const useChatMyMessageStyles = makeStyles({
142
142
  bodyAttached: {
143
143
  marginTop: '0.125rem'
144
144
  },
145
- menu: Object.assign(Object.assign({ boxShadow: tokens.shadow4, backgroundColor: tokens.colorNeutralBackground1, marginRight: '1px', position: 'absolute', top: '-2px', right: '0' }, shorthands.borderRadius(tokens.borderRadiusMedium)), { zIndex: 1, lineHeight: tokens.lineHeightBase100, visibility: 'hidden', '&:hover, &:focus': {
145
+ menu: Object.assign(Object.assign({ boxShadow: tokens.shadow4, backgroundColor: tokens.colorNeutralBackground1, position: 'absolute', top: '-19px', right: '0' }, shorthands.borderRadius(tokens.borderRadiusMedium)), { zIndex: 1, lineHeight: tokens.lineHeightBase100, visibility: 'hidden', '&:hover, &:focus': {
146
146
  cursor: 'pointer',
147
147
  visibility: 'visible'
148
148
  } }),
149
- menuAttached: {
150
- top: '-18px'
151
- },
152
149
  menuHidden: {
153
150
  visibility: 'hidden'
154
151
  },
@@ -1 +1 @@
1
- {"version":3,"file":"MessageThread.styles.js","sourceRoot":"","sources":["../../../../../../../react-components/src/components/styles/MessageThread.styles.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { IButtonStyles, mergeStyles } from '@fluentui/react';\nimport { makeStyles, shorthands, tokens } from '@fluentui/react-components';\nimport { CSSProperties } from 'react';\nimport { MESSAGE_STATUS_INDICATOR_SIZE_REM } from './MessageStatusIndicator.styles';\nimport { ComponentSlotStyle } from '../../types';\nimport { _ATTACHMENT_CARD_MARGIN_IN_PX, _ATTACHMENT_CARD_WIDTH_IN_REM } from './AttachmentCard.styles';\nimport { BROKEN_IMAGE_SVG_DATA } from './Common.style';\n\n// Minimum chat bubble width. This matches the minimum chat bubble width from FluentUI\n// that can contain a message and a timestamp.\nconst CHAT_MESSAGE_CONTAINER_MIN_WIDTH_REM = 6.25;\n\n// Chat messages should span just short of the width of the container.\n// When calculating the width of a message we also must take into account\n// the width of the avatar/gutter and the gap between the message and avatar/gutter.\nconst AVATAR_WIDTH_REM = 2;\nconst AVATAR_MARGIN_LEFT = 2.5;\nconst AVATAR_MESSAGE_GAP_REM = 0.125;\nconst MESSAGE_AMOUNT_OUT_FROM_EDGE_REM = 2;\n\n// Avatars should display on top of chat messages when the chat thread is narrow\nconst MESSAGE_AVATAR_OVERLAP_REM = 0.925;\nconst CHAT_MESSAGE_ZINDEX = 1;\nconst AVATAR_ZINDEX = 2;\n// new message button should be on top of chat message\nconst NEW_MESSAGE_BUTTON_ZINDEX = 2;\n\n/**\n * @private\n */\nexport const messageThreadContainerStyle = mergeStyles({\n height: '100%',\n width: '100%',\n maxHeight: '100%',\n overflow: 'auto',\n position: 'relative',\n alignSelf: 'center'\n});\n\n/**\n * @private\n */\nexport const messageThreadWrapperContainerStyle = mergeStyles({\n height: '100%',\n width: '100%',\n position: 'relative'\n});\n\n/**\n * @private\n */\nexport const noMessageStatusStyle = mergeStyles({\n // This should match the size of the message status indicator icon to ensure\n // multiple messages sent by the user are aligned correctly.\n width: `${MESSAGE_STATUS_INDICATOR_SIZE_REM}rem`\n});\n\n/**\n * @private\n */\nexport const useChatStyles = makeStyles({\n root: {\n // chat components sets max width value to 1056px, override it to 100%\n maxWidth: '100%',\n paddingTop: '0.8rem',\n paddingBottom: '0.5rem',\n paddingRight: '0.6rem',\n paddingLeft: '0.6rem',\n ...shorthands.border('none'),\n ...shorthands.overflow('auto'),\n // `height: 100%` ensures that the Chat component covers 100% of it's parents height\n // to prevent intermittent scrollbars when GIFs are present in the chat.\n height: '100%',\n\n '& a:link': {\n color: tokens.colorBrandForegroundLink\n },\n '& a:visited': {\n color: tokens.colorBrandForegroundLinkHover\n },\n '& a:hover': {\n color: tokens.colorBrandForegroundLinkHover\n }\n }\n});\n\n/**\n * @private\n */\nexport const useChatMessageRenderStyles = makeStyles({\n rootCommon: {},\n rootMessage: {\n ...shorthands.padding('0'),\n ...shorthands.margin('0'),\n maxWidth: '100%',\n minWidth: `${CHAT_MESSAGE_CONTAINER_MIN_WIDTH_REM}rem`\n },\n rootMyMessage: {\n gridTemplateColumns: 'auto fit-content(0)',\n gridTemplateAreas: `\n \"body status\"\n `,\n columnGap: '0',\n gridGap: '0',\n ...shorthands.padding('0'),\n marginTop: '0',\n marginRight: '0',\n marginBottom: '0',\n marginLeft: '50px',\n width: `calc(100% - 50px)`\n },\n bodyCommon: {\n ...shorthands.padding('0'),\n marginRight: '0',\n marginBottom: '0',\n backgroundColor: 'transparent',\n maxWidth: '100%',\n minWidth: `${CHAT_MESSAGE_CONTAINER_MIN_WIDTH_REM}rem`,\n '&:focus-visible': {\n outlineStyle: 'auto'\n }\n },\n bodyMyMessage: {\n width: '100%',\n marginTop: '0'\n },\n bodyWithoutAvatar: {\n marginLeft: `${AVATAR_MARGIN_LEFT}rem`,\n marginTop: '0'\n },\n bodyHiddenAvatar: {\n marginLeft: 0,\n marginTop: 0\n },\n bodyWithAvatar: {\n marginLeft: `0`,\n marginTop: '0.75rem'\n },\n avatarNoOverlap: {\n width: `calc(100% - ${AVATAR_WIDTH_REM + MESSAGE_AMOUNT_OUT_FROM_EDGE_REM + AVATAR_MESSAGE_GAP_REM}rem)`\n },\n avatarOverlap: {\n width: `calc(100% - ${AVATAR_WIDTH_REM + MESSAGE_AMOUNT_OUT_FROM_EDGE_REM - MESSAGE_AVATAR_OVERLAP_REM}rem)`\n }\n});\n\n/**\n * @private\n */\nexport const useChatMyMessageStyles = makeStyles({\n root: {\n // The first column's width should be set to 1fr\n // because otherwise rich text editor's width will grow indefinitely\n gridTemplateColumns: '1fr auto',\n gridTemplateAreas: `\n \". actions\"\n \"body body\"\n `,\n gridGap: '0',\n columnGap: '0',\n paddingTop: '0',\n marginLeft: '0'\n },\n body: {\n paddingBottom: '10px',\n marginTop: '1rem',\n maxWidth: '100%',\n minWidth: `${CHAT_MESSAGE_CONTAINER_MIN_WIDTH_REM}rem`,\n marginLeft: '0rem',\n // This makes message bubble show border in high contrast mode making each message distinguishable\n ...shorthands.border('1px', 'solid', 'transparent'),\n\n '&:hover ~ .fui-ChatMyMessage__actions': {\n visibility: 'visible'\n },\n '&:focus ~ .fui-ChatMyMessage__actions': {\n visibility: 'visible'\n },\n '& msft-mention': {\n color: tokens.colorStatusWarningBackground3,\n fontWeight: 600\n },\n '&:focus-visible': {\n outlineStyle: 'auto'\n },\n '& img': {\n maxWidth: '100%',\n height: 'auto'\n }\n },\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n bodyWithPlaceholderImage: {\n // Adding width and height to the placeholder image only for myMessages\n // because inline images sent from ACS doesn't have width and height in the image tag\n '& img[src=\"\"]': {\n width: '12rem',\n height: '12rem'\n }\n },\n bodyAttached: {\n marginTop: '0.125rem'\n },\n menu: {\n boxShadow: tokens.shadow4,\n backgroundColor: tokens.colorNeutralBackground1,\n marginRight: '1px',\n position: 'absolute',\n top: '-2px',\n right: '0',\n ...shorthands.borderRadius(tokens.borderRadiusMedium),\n zIndex: 1,\n lineHeight: tokens.lineHeightBase100,\n visibility: 'hidden',\n\n '&:hover, &:focus': {\n cursor: 'pointer',\n visibility: 'visible'\n }\n },\n menuAttached: {\n top: '-18px'\n },\n menuHidden: {\n visibility: 'hidden'\n },\n menuVisible: {\n visibility: 'visible'\n },\n multipleAttachmentsInViewing: {\n width: '100%',\n maxWidth: `${(_ATTACHMENT_CARD_WIDTH_IN_REM + _ATTACHMENT_CARD_MARGIN_IN_PX) * 2}rem`\n },\n multipleAttachmentsInEditing: {\n // when in editing state, the chat message width should not be\n // limited by content length but occupying the full width instead\n width: '100%',\n float: 'right'\n }\n});\n\n/**\n * @private\n */\nexport const newMessageButtonContainerStyle = mergeStyles({\n position: 'absolute',\n zIndex: NEW_MESSAGE_BUTTON_ZINDEX,\n bottom: 0,\n right: '1.5rem'\n});\n\n/**\n * @private\n */\nexport const chatMessageDateStyle: CSSProperties = {\n fontWeight: 600\n};\n\n/**\n * @private\n */\nexport const useChatMessageStyles = makeStyles({\n root: {\n paddingTop: '0'\n },\n body: {\n maxWidth: '100%',\n minWidth: `${CHAT_MESSAGE_CONTAINER_MIN_WIDTH_REM}rem`,\n marginRight: '0rem',\n paddingBottom: '10px',\n zIndex: CHAT_MESSAGE_ZINDEX,\n // This makes message bubble show border in high contrast mode making each message distinguishable\n ...shorthands.border('1px', 'solid', 'transparent'),\n '& > div:first-of-type': {\n flexWrap: 'wrap'\n },\n '& msft-mention': {\n color: tokens.colorStatusWarningBackground3,\n fontWeight: tokens.fontWeightSemibold\n },\n '& img': {\n maxWidth: '100% !important', // Add !important to make sure it won't be overridden by style defined in element\n height: 'auto !important'\n },\n '& video': {\n maxWidth: '100% !important', // Add !important to make sure it won't be overridden by style defined in element\n height: 'auto !important'\n },\n '& p': {\n // Deal with awkward padding seen in messages from Teams.\n // For more info see https://github.com/Azure/communication-ui-library/pull/1507\n ...shorthands.marginBlock('0.125rem')\n },\n '& blockquote': {\n backgroundColor: tokens.colorBrandBackgroundInverted,\n clear: 'left',\n minHeight: '2.25rem',\n width: 'fit-content',\n marginTop: '7px',\n marginRight: '0px',\n marginLeft: '0px',\n marginBottom: '7px',\n paddingTop: '7px',\n paddingRight: '15px',\n paddingLeft: '15px',\n paddingBottom: '7px',\n ...shorthands.border('solid'),\n ...shorthands.borderRadius('4px'),\n ...shorthands.borderWidth('1px'),\n ...shorthands.borderColor(tokens.colorNeutralStroke1Selected),\n borderLeftWidth: '4px'\n },\n '& code': {\n whiteSpace: 'pre-wrap'\n },\n '&:focus-visible': {\n outlineStyle: 'auto'\n }\n },\n bodyWithoutAvatar: {\n marginTop: '0.125rem'\n },\n bodyWithAvatar: {\n marginTop: `0.375rem`\n },\n avatarNoOverlap: {\n marginLeft: `${-AVATAR_MARGIN_LEFT + AVATAR_MESSAGE_GAP_REM}rem`\n },\n avatarOverlap: {\n marginLeft: `${-AVATAR_MARGIN_LEFT - MESSAGE_AVATAR_OVERLAP_REM}rem`\n },\n multipleAttachments: {\n width: `${(_ATTACHMENT_CARD_WIDTH_IN_REM + _ATTACHMENT_CARD_MARGIN_IN_PX) * 2}rem`\n }\n});\n\n/**\n * @private\n */\nexport const useChatMessageCommonStyles = makeStyles({\n body: {\n '& table': {\n backgroundColor: tokens.colorBrandBackgroundInverted,\n borderCollapse: 'collapse',\n tableLayout: 'auto',\n width: '100%',\n\n '& tr': {\n ...shorthands.border('1px', 'solid', `${tokens.colorNeutralStrokeAccessible}`),\n\n '& td': {\n ...shorthands.border('1px', 'solid', `${tokens.colorNeutralStrokeAccessible}`),\n wordBreak: 'normal',\n paddingTop: '0px',\n paddingRight: '5px'\n }\n }\n }\n },\n bodyWithPlaceholderImage: {\n '& img[src=\"\"]': {\n backgroundColor: tokens.colorNeutralBackground1Selected,\n // this ensures safari won't have default rendering when image source\n // becomes invalid such as empty string in this case\n fontSize: '0',\n position: 'relative',\n clipPath: 'inset(0.3px)',\n display: 'flex'\n },\n '& img[src=\"\"]:after': {\n backgroundColor: tokens.colorNeutralBackground1Selected,\n content: `url(\"data:image/gif;base64,R0lGODlhAQABAAAAACw=\")`,\n backgroundSize: 'center',\n position: 'absolute',\n width: '100%',\n height: '100%',\n top: '0',\n left: '0',\n display: 'block'\n },\n '& .broken-image-wrapper': {\n width: '12rem',\n height: '12rem',\n marginTop: '0.75rem',\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n ...shorthands.outline('1px', 'solid', tokens.colorNeutralForegroundDisabled),\n backgroundColor: tokens.colorNeutralBackground2\n },\n '& .broken-image-wrapper:after': {\n content: `''`,\n maskImage: `url(\"${BROKEN_IMAGE_SVG_DATA}\");`,\n width: '3rem',\n height: '3rem',\n backgroundColor: `${tokens.colorNeutralForeground2}`\n }\n },\n failed: {\n //TODO: can we reuse a theme color here?\n backgroundColor: 'rgba(168, 0, 0, 0.2)'\n },\n blocked: {\n maxWidth: '100%',\n minWidth: `${CHAT_MESSAGE_CONTAINER_MIN_WIDTH_REM}rem`,\n marginRight: '0rem',\n color: tokens.colorNeutralForeground2,\n\n // This makes message bubble show border in high contrast mode making each message distinguishable\n ...shorthands.border('1px', 'solid', 'transparent'),\n '& i': {\n paddingTop: '0.25rem'\n },\n\n '& p': {\n // Deal with awkward padding seen in messages from Teams.\n // For more info see https://github.com/Azure/communication-ui-library/pull/1507\n ...shorthands.marginBlock('0.125rem'),\n paddingRight: '0.75rem',\n fontStyle: 'italic'\n },\n\n '& a': {\n ...shorthands.marginBlock('0.125rem'),\n fontStyle: 'normal',\n color: tokens.colorBrandForegroundLink,\n ...shorthands.textDecoration('none')\n }\n }\n});\n\n/**\n * @private\n */\nexport const gutterWithAvatar: ComponentSlotStyle = {\n paddingTop: '1.65rem',\n width: `${AVATAR_WIDTH_REM}rem`,\n position: 'relative',\n float: 'left',\n display: 'block',\n visibility: 'visible',\n zIndex: AVATAR_ZINDEX\n};\n\n/**\n * @private\n */\nexport const gutterWithHiddenAvatar: ComponentSlotStyle = {\n ...gutterWithAvatar,\n visibility: 'hidden',\n // we use this hidden avatar just as a width placeholder\n // the placeholder is needed for responsive bubble width\n height: 0\n};\n\n/**\n * @private\n */\nexport const newMessageButtonStyle = mergeStyles({\n float: 'right',\n width: 'fit-content'\n});\n\n/**\n * @private\n */\nexport const buttonWithIconStyles: IButtonStyles = {\n textContainer: {\n display: 'contents'\n }\n};\n\n/**\n * @private\n */\nexport const loadPreviousMessageButtonStyle = mergeStyles({\n border: 'none',\n minHeight: '1.5rem',\n '&:hover': { background: 'none' },\n '&:active': { background: 'none' }\n});\n\n/**\n * @private\n */\nexport const DownIconStyle = mergeStyles({\n marginRight: '0.5em'\n});\n\n/** @private */\nexport const dataLossIconStyle = mergeStyles({\n width: '1.25rem',\n height: '1.25rem'\n});\n\n/** @private */\nexport const messageTextContentStyles = mergeStyles({\n whiteSpace: 'pre-wrap'\n});\n"]}
1
+ {"version":3,"file":"MessageThread.styles.js","sourceRoot":"","sources":["../../../../../../../react-components/src/components/styles/MessageThread.styles.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { IButtonStyles, mergeStyles } from '@fluentui/react';\nimport { makeStyles, shorthands, tokens } from '@fluentui/react-components';\nimport { CSSProperties } from 'react';\nimport { MESSAGE_STATUS_INDICATOR_SIZE_REM } from './MessageStatusIndicator.styles';\nimport { ComponentSlotStyle } from '../../types';\nimport { _ATTACHMENT_CARD_MARGIN_IN_PX, _ATTACHMENT_CARD_WIDTH_IN_REM } from './AttachmentCard.styles';\nimport { BROKEN_IMAGE_SVG_DATA } from './Common.style';\n\n// Minimum chat bubble width. This matches the minimum chat bubble width from FluentUI\n// that can contain a message and a timestamp.\nconst CHAT_MESSAGE_CONTAINER_MIN_WIDTH_REM = 6.25;\n\n// Chat messages should span just short of the width of the container.\n// When calculating the width of a message we also must take into account\n// the width of the avatar/gutter and the gap between the message and avatar/gutter.\nconst AVATAR_WIDTH_REM = 2;\nconst AVATAR_MARGIN_LEFT = 2.5;\nconst AVATAR_MESSAGE_GAP_REM = 0.125;\nconst MESSAGE_AMOUNT_OUT_FROM_EDGE_REM = 2;\n\n// Avatars should display on top of chat messages when the chat thread is narrow\nconst MESSAGE_AVATAR_OVERLAP_REM = 0.925;\nconst CHAT_MESSAGE_ZINDEX = 1;\nconst AVATAR_ZINDEX = 2;\n// new message button should be on top of chat message\nconst NEW_MESSAGE_BUTTON_ZINDEX = 2;\n\n/**\n * @private\n */\nexport const chatMyMessageActionMenuClassName = 'ChatMyMessage__actions';\n\n/**\n * @private\n */\nexport const messageThreadContainerStyle = mergeStyles({\n height: '100%',\n width: '100%',\n maxHeight: '100%',\n overflow: 'auto',\n position: 'relative',\n alignSelf: 'center'\n});\n\n/**\n * @private\n */\nexport const messageThreadWrapperContainerStyle = mergeStyles({\n height: '100%',\n width: '100%',\n position: 'relative'\n});\n\n/**\n * @private\n */\nexport const noMessageStatusStyle = mergeStyles({\n // This should match the size of the message status indicator icon to ensure\n // multiple messages sent by the user are aligned correctly.\n width: `${MESSAGE_STATUS_INDICATOR_SIZE_REM}rem`\n});\n\n/**\n * @private\n */\nexport const useChatStyles = makeStyles({\n root: {\n // chat components sets max width value to 1056px, override it to 100%\n maxWidth: '100%',\n paddingTop: '0.8rem',\n paddingBottom: '0.5rem',\n paddingRight: '0.6rem',\n paddingLeft: '0.6rem',\n ...shorthands.border('none'),\n ...shorthands.overflow('auto'),\n // `height: 100%` ensures that the Chat component covers 100% of it's parents height\n // to prevent intermittent scrollbars when GIFs are present in the chat.\n height: '100%',\n\n '& a:link': {\n color: tokens.colorBrandForegroundLink\n },\n '& a:visited': {\n color: tokens.colorBrandForegroundLinkHover\n },\n '& a:hover': {\n color: tokens.colorBrandForegroundLinkHover\n }\n }\n});\n\n/**\n * @private\n */\nexport const useChatMessageRenderStyles = makeStyles({\n rootCommon: {},\n rootMessage: {\n ...shorthands.padding('0'),\n ...shorthands.margin('0'),\n maxWidth: '100%',\n minWidth: `${CHAT_MESSAGE_CONTAINER_MIN_WIDTH_REM}rem`\n },\n rootMyMessage: {\n gridTemplateColumns: 'auto fit-content(0)',\n gridTemplateAreas: `\n \"body status\"\n `,\n columnGap: '0',\n gridGap: '0',\n ...shorthands.padding('0'),\n marginTop: '0',\n marginRight: '0',\n marginBottom: '0',\n marginLeft: '50px',\n width: `calc(100% - 50px)`\n },\n bodyCommon: {\n ...shorthands.padding('0'),\n marginRight: '0',\n marginBottom: '0',\n backgroundColor: 'transparent',\n maxWidth: '100%',\n minWidth: `${CHAT_MESSAGE_CONTAINER_MIN_WIDTH_REM}rem`,\n '&:focus-visible': {\n outlineStyle: 'auto'\n }\n },\n bodyMyMessage: {\n width: '100%',\n marginTop: '0'\n },\n bodyWithoutAvatar: {\n marginLeft: `${AVATAR_MARGIN_LEFT}rem`,\n marginTop: '0'\n },\n bodyHiddenAvatar: {\n marginLeft: 0,\n marginTop: 0\n },\n bodyWithAvatar: {\n marginLeft: `0`,\n marginTop: '0.75rem'\n },\n avatarNoOverlap: {\n width: `calc(100% - ${AVATAR_WIDTH_REM + MESSAGE_AMOUNT_OUT_FROM_EDGE_REM + AVATAR_MESSAGE_GAP_REM}rem)`\n },\n avatarOverlap: {\n width: `calc(100% - ${AVATAR_WIDTH_REM + MESSAGE_AMOUNT_OUT_FROM_EDGE_REM - MESSAGE_AVATAR_OVERLAP_REM}rem)`\n }\n});\n\n/**\n * @private\n */\nexport const useChatMyMessageStyles = makeStyles({\n root: {\n gridTemplateColumns: 'auto',\n gridTemplateAreas: `\n \"body\"\n `,\n gridGap: '0',\n paddingTop: '0',\n marginLeft: '0'\n },\n body: {\n paddingBottom: '10px',\n marginTop: '1rem',\n maxWidth: '100%',\n minWidth: `${CHAT_MESSAGE_CONTAINER_MIN_WIDTH_REM}rem`,\n marginLeft: '0rem',\n // This makes message bubble show border in high contrast mode making each message distinguishable\n ...shorthands.border('1px', 'solid', 'transparent'),\n\n '&:hover .ChatMyMessage__actions': {\n visibility: 'visible'\n },\n '&:focus .ChatMyMessage__actions': {\n visibility: 'visible'\n },\n '& msft-mention': {\n color: tokens.colorStatusWarningBackground3,\n fontWeight: 600\n },\n '&:focus-visible': {\n outlineStyle: 'auto'\n },\n '& img': {\n maxWidth: '100%',\n height: 'auto'\n }\n },\n /* @conditional-compile-remove(rich-text-editor-image-upload) */\n bodyWithPlaceholderImage: {\n // Adding width and height to the placeholder image only for myMessages\n // because inline images sent from ACS doesn't have width and height in the image tag\n '& img[src=\"\"]': {\n width: '12rem',\n height: '12rem'\n }\n },\n bodyAttached: {\n marginTop: '0.125rem'\n },\n menu: {\n boxShadow: tokens.shadow4,\n backgroundColor: tokens.colorNeutralBackground1,\n position: 'absolute',\n top: '-19px',\n right: '0',\n ...shorthands.borderRadius(tokens.borderRadiusMedium),\n zIndex: 1,\n lineHeight: tokens.lineHeightBase100,\n visibility: 'hidden',\n\n '&:hover, &:focus': {\n cursor: 'pointer',\n visibility: 'visible'\n }\n },\n menuHidden: {\n visibility: 'hidden'\n },\n menuVisible: {\n visibility: 'visible'\n },\n multipleAttachmentsInViewing: {\n width: '100%',\n maxWidth: `${(_ATTACHMENT_CARD_WIDTH_IN_REM + _ATTACHMENT_CARD_MARGIN_IN_PX) * 2}rem`\n },\n multipleAttachmentsInEditing: {\n // when in editing state, the chat message width should not be\n // limited by content length but occupying the full width instead\n width: '100%',\n float: 'right'\n }\n});\n\n/**\n * @private\n */\nexport const newMessageButtonContainerStyle = mergeStyles({\n position: 'absolute',\n zIndex: NEW_MESSAGE_BUTTON_ZINDEX,\n bottom: 0,\n right: '1.5rem'\n});\n\n/**\n * @private\n */\nexport const chatMessageDateStyle: CSSProperties = {\n fontWeight: 600\n};\n\n/**\n * @private\n */\nexport const useChatMessageStyles = makeStyles({\n root: {\n paddingTop: '0'\n },\n body: {\n maxWidth: '100%',\n minWidth: `${CHAT_MESSAGE_CONTAINER_MIN_WIDTH_REM}rem`,\n marginRight: '0rem',\n paddingBottom: '10px',\n zIndex: CHAT_MESSAGE_ZINDEX,\n // This makes message bubble show border in high contrast mode making each message distinguishable\n ...shorthands.border('1px', 'solid', 'transparent'),\n '& > div:first-of-type': {\n flexWrap: 'wrap'\n },\n '& msft-mention': {\n color: tokens.colorStatusWarningBackground3,\n fontWeight: tokens.fontWeightSemibold\n },\n '& img': {\n maxWidth: '100% !important', // Add !important to make sure it won't be overridden by style defined in element\n height: 'auto !important'\n },\n '& video': {\n maxWidth: '100% !important', // Add !important to make sure it won't be overridden by style defined in element\n height: 'auto !important'\n },\n '& p': {\n // Deal with awkward padding seen in messages from Teams.\n // For more info see https://github.com/Azure/communication-ui-library/pull/1507\n ...shorthands.marginBlock('0.125rem')\n },\n '& blockquote': {\n backgroundColor: tokens.colorBrandBackgroundInverted,\n clear: 'left',\n minHeight: '2.25rem',\n width: 'fit-content',\n marginTop: '7px',\n marginRight: '0px',\n marginLeft: '0px',\n marginBottom: '7px',\n paddingTop: '7px',\n paddingRight: '15px',\n paddingLeft: '15px',\n paddingBottom: '7px',\n ...shorthands.border('solid'),\n ...shorthands.borderRadius('4px'),\n ...shorthands.borderWidth('1px'),\n ...shorthands.borderColor(tokens.colorNeutralStroke1Selected),\n borderLeftWidth: '4px'\n },\n '& code': {\n whiteSpace: 'pre-wrap'\n },\n '&:focus-visible': {\n outlineStyle: 'auto'\n }\n },\n bodyWithoutAvatar: {\n marginTop: '0.125rem'\n },\n bodyWithAvatar: {\n marginTop: `0.375rem`\n },\n avatarNoOverlap: {\n marginLeft: `${-AVATAR_MARGIN_LEFT + AVATAR_MESSAGE_GAP_REM}rem`\n },\n avatarOverlap: {\n marginLeft: `${-AVATAR_MARGIN_LEFT - MESSAGE_AVATAR_OVERLAP_REM}rem`\n },\n multipleAttachments: {\n width: `${(_ATTACHMENT_CARD_WIDTH_IN_REM + _ATTACHMENT_CARD_MARGIN_IN_PX) * 2}rem`\n }\n});\n\n/**\n * @private\n */\nexport const useChatMessageCommonStyles = makeStyles({\n body: {\n '& table': {\n backgroundColor: tokens.colorBrandBackgroundInverted,\n borderCollapse: 'collapse',\n tableLayout: 'auto',\n width: '100%',\n\n '& tr': {\n ...shorthands.border('1px', 'solid', `${tokens.colorNeutralStrokeAccessible}`),\n\n '& td': {\n ...shorthands.border('1px', 'solid', `${tokens.colorNeutralStrokeAccessible}`),\n wordBreak: 'normal',\n paddingTop: '0px',\n paddingRight: '5px'\n }\n }\n }\n },\n bodyWithPlaceholderImage: {\n '& img[src=\"\"]': {\n backgroundColor: tokens.colorNeutralBackground1Selected,\n // this ensures safari won't have default rendering when image source\n // becomes invalid such as empty string in this case\n fontSize: '0',\n position: 'relative',\n clipPath: 'inset(0.3px)',\n display: 'flex'\n },\n '& img[src=\"\"]:after': {\n backgroundColor: tokens.colorNeutralBackground1Selected,\n content: `url(\"data:image/gif;base64,R0lGODlhAQABAAAAACw=\")`,\n backgroundSize: 'center',\n position: 'absolute',\n width: '100%',\n height: '100%',\n top: '0',\n left: '0',\n display: 'block'\n },\n '& .broken-image-wrapper': {\n width: '12rem',\n height: '12rem',\n marginTop: '0.75rem',\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n ...shorthands.outline('1px', 'solid', tokens.colorNeutralForegroundDisabled),\n backgroundColor: tokens.colorNeutralBackground2\n },\n '& .broken-image-wrapper:after': {\n content: `''`,\n maskImage: `url(\"${BROKEN_IMAGE_SVG_DATA}\");`,\n width: '3rem',\n height: '3rem',\n backgroundColor: `${tokens.colorNeutralForeground2}`\n }\n },\n failed: {\n //TODO: can we reuse a theme color here?\n backgroundColor: 'rgba(168, 0, 0, 0.2)'\n },\n blocked: {\n maxWidth: '100%',\n minWidth: `${CHAT_MESSAGE_CONTAINER_MIN_WIDTH_REM}rem`,\n marginRight: '0rem',\n color: tokens.colorNeutralForeground2,\n\n // This makes message bubble show border in high contrast mode making each message distinguishable\n ...shorthands.border('1px', 'solid', 'transparent'),\n '& i': {\n paddingTop: '0.25rem'\n },\n\n '& p': {\n // Deal with awkward padding seen in messages from Teams.\n // For more info see https://github.com/Azure/communication-ui-library/pull/1507\n ...shorthands.marginBlock('0.125rem'),\n paddingRight: '0.75rem',\n fontStyle: 'italic'\n },\n\n '& a': {\n ...shorthands.marginBlock('0.125rem'),\n fontStyle: 'normal',\n color: tokens.colorBrandForegroundLink,\n ...shorthands.textDecoration('none')\n }\n }\n});\n\n/**\n * @private\n */\nexport const gutterWithAvatar: ComponentSlotStyle = {\n paddingTop: '1.65rem',\n width: `${AVATAR_WIDTH_REM}rem`,\n position: 'relative',\n float: 'left',\n display: 'block',\n visibility: 'visible',\n zIndex: AVATAR_ZINDEX\n};\n\n/**\n * @private\n */\nexport const gutterWithHiddenAvatar: ComponentSlotStyle = {\n ...gutterWithAvatar,\n visibility: 'hidden',\n // we use this hidden avatar just as a width placeholder\n // the placeholder is needed for responsive bubble width\n height: 0\n};\n\n/**\n * @private\n */\nexport const newMessageButtonStyle = mergeStyles({\n float: 'right',\n width: 'fit-content'\n});\n\n/**\n * @private\n */\nexport const buttonWithIconStyles: IButtonStyles = {\n textContainer: {\n display: 'contents'\n }\n};\n\n/**\n * @private\n */\nexport const loadPreviousMessageButtonStyle = mergeStyles({\n border: 'none',\n minHeight: '1.5rem',\n '&:hover': { background: 'none' },\n '&:active': { background: 'none' }\n});\n\n/**\n * @private\n */\nexport const DownIconStyle = mergeStyles({\n marginRight: '0.5em'\n});\n\n/** @private */\nexport const dataLossIconStyle = mergeStyles({\n width: '1.25rem',\n height: '1.25rem'\n});\n\n/** @private */\nexport const messageTextContentStyles = mergeStyles({\n whiteSpace: 'pre-wrap'\n});\n"]}
@@ -35,4 +35,13 @@ export declare const generateCustomizedTimestamp: (createdOn: Date, locale: Comp
35
35
  * Get the edited tag for the message if it is edited.
36
36
  */
37
37
  export declare const getMessageEditedDetails: (message: ChatMessage | /* @conditional-compile-remove(data-loss-prevention) */ BlockedMessage, theme: Theme, editedTag: string) => JSX.Element | undefined;
38
+ /**
39
+ * Removes Fluent UI keyboard navigation styles from the given HTMLDivElement.
40
+ *
41
+ * This function removes the 'tabindex' and 'data-tabster' attributes from the provided
42
+ * HTMLDivElement, making it non-focusable and removing any associated keyboard navigation styles.
43
+ *
44
+ * @param node - The HTMLDivElement from which to remove the keyboard navigation styles. If null, the function does nothing.
45
+ */
46
+ export declare const removeFluentUIKeyboardNavigationStyles: (node: HTMLDivElement | null) => void;
38
47
  //# sourceMappingURL=ChatMessageComponentUtils.d.ts.map
@@ -84,4 +84,19 @@ export const getMessageEditedDetails = (message, theme, editedTag) => {
84
84
  }
85
85
  return undefined;
86
86
  };
87
+ /**
88
+ * Removes Fluent UI keyboard navigation styles from the given HTMLDivElement.
89
+ *
90
+ * This function removes the 'tabindex' and 'data-tabster' attributes from the provided
91
+ * HTMLDivElement, making it non-focusable and removing any associated keyboard navigation styles.
92
+ *
93
+ * @param node - The HTMLDivElement from which to remove the keyboard navigation styles. If null, the function does nothing.
94
+ */
95
+ export const removeFluentUIKeyboardNavigationStyles = (node) => {
96
+ if (node) {
97
+ // Remove tabindex to make the div element non-focusable
98
+ node.removeAttribute('tabindex');
99
+ node.removeAttribute('data-tabster');
100
+ }
101
+ };
87
102
  //# sourceMappingURL=ChatMessageComponentUtils.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"ChatMessageComponentUtils.js","sourceRoot":"","sources":["../../../../../../../react-components/src/components/utils/ChatMessageComponentUtils.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React from 'react';\nimport { ChatMessage, MessageAttachedStatus } from '../../types/ChatMessage';\nimport { ChatMessageContent } from '../ChatMessage/ChatMessageContent';\n/* @conditional-compile-remove(data-loss-prevention) */\nimport { BlockedMessage } from '../../types/ChatMessage';\n/* @conditional-compile-remove(data-loss-prevention) */\nimport { BlockedMessageContent } from '../ChatMessage/ChatMessageContent';\nimport { InlineImageOptions } from '../ChatMessage/ChatMessageContent';\nimport { MessageThreadStrings } from '../MessageThread';\n/* @conditional-compile-remove(mention) */\nimport { MentionDisplayOptions } from '../MentionPopover';\nimport { _AttachmentDownloadCards } from '../Attachment/AttachmentDownloadCards';\nimport { AttachmentMenuAction } from '../../types/Attachment';\nimport { AttachmentMetadata } from '@internal/acs-ui-common';\nimport { formatTimeForChatMessage, formatTimestampForChatMessage } from './Datetime';\nimport { ComponentLocale } from '../../localization/LocalizationProvider';\nimport { chatMessageEditedTagStyle } from '../styles/ChatMessageComponent.styles';\nimport { Theme } from '@fluentui/react';\n\n/** @private\n * Return the string value for the FluentUI message attached prop based on the message's attached status.\n * @param attached - The message's attached status.\n */\nexport const getFluentUIAttachedValue = (\n messageAttachedStatus?: MessageAttachedStatus\n): 'bottom' | 'top' | 'center' | undefined => {\n return messageAttachedStatus === 'top' || messageAttachedStatus === false ? 'top' : 'center';\n};\n\n/**\n * @private\n * Get the message bubble content for the message.\n */\nexport function getMessageBubbleContent(\n message: ChatMessage | /* @conditional-compile-remove(data-loss-prevention) */ BlockedMessage,\n strings: MessageThreadStrings,\n userId: string,\n inlineImageOptions: InlineImageOptions | undefined,\n /* @conditional-compile-remove(mention) */\n mentionDisplayOptions?: MentionDisplayOptions,\n /**\n * Optional callback to render message attachments in the message component.\n */\n onRenderAttachmentDownloads?: (message: ChatMessage) => JSX.Element,\n /**\n * Optional callback to define custom actions for attachments.\n */\n actionsForAttachment?: (attachment: AttachmentMetadata, message?: ChatMessage) => AttachmentMenuAction[]\n): JSX.Element {\n /* @conditional-compile-remove(data-loss-prevention) */\n if (message.messageType === 'blocked') {\n return (\n <div tabIndex={0}>\n <BlockedMessageContent message={message} strings={strings} />\n </div>\n );\n }\n return (\n <div className=\"ui-chat__message__content\">\n <ChatMessageContent\n message={message}\n strings={strings}\n /* @conditional-compile-remove(mention) */\n mentionDisplayOptions={mentionDisplayOptions}\n inlineImageOptions={inlineImageOptions}\n />\n {onRenderAttachmentDownloads\n ? onRenderAttachmentDownloads(message)\n : defaultOnRenderAttachmentDownloads(\n message,\n strings,\n\n actionsForAttachment\n )}\n </div>\n );\n}\n\n/**\n * Default component for rendering attachment downloads.\n */\nconst defaultOnRenderAttachmentDownloads = (\n message: ChatMessage | /* @conditional-compile-remove(data-loss-prevention) */ BlockedMessage,\n strings: MessageThreadStrings,\n actionsForAttachment?: (attachment: AttachmentMetadata, message?: ChatMessage) => AttachmentMenuAction[]\n): JSX.Element | undefined => {\n const attachments = 'attachments' in message ? message.attachments : undefined;\n return (attachments?.length ?? 0) > 0 ? (\n <_AttachmentDownloadCards\n message={message as ChatMessage}\n attachments={attachments}\n actionsForAttachment={actionsForAttachment}\n strings={{\n /* @conditional-compile-remove(file-sharing-acs) */\n downloadAttachment: strings.downloadAttachment,\n openAttachment: strings.openAttachment,\n attachmentCardGroupMessage: strings.attachmentCardGroupMessage\n }}\n />\n ) : (\n <></>\n );\n};\n\n/** @private */\nexport const generateDefaultTimestamp = (\n createdOn: Date,\n showDate: boolean | undefined,\n strings: MessageThreadStrings\n): string => {\n const formattedTimestamp = showDate\n ? formatTimestampForChatMessage(createdOn, new Date(), strings)\n : formatTimeForChatMessage(createdOn);\n\n return formattedTimestamp;\n};\n\n// onDisplayDateTimeString from props overwrite onDisplayDateTimeString from locale\n/** @private */\nexport const generateCustomizedTimestamp = (\n createdOn: Date,\n locale: ComponentLocale,\n onDisplayDateTimeString?: (messageDate: Date) => string\n): string => {\n /* @conditional-compile-remove(date-time-customization) */\n return onDisplayDateTimeString\n ? onDisplayDateTimeString(createdOn)\n : locale.onDisplayDateTimeString\n ? locale.onDisplayDateTimeString(createdOn)\n : '';\n\n return '';\n};\n\n/**\n * @private\n * Get the edited tag for the message if it is edited.\n */\nexport const getMessageEditedDetails = (\n message: ChatMessage | /* @conditional-compile-remove(data-loss-prevention) */ BlockedMessage,\n theme: Theme,\n editedTag: string\n): JSX.Element | undefined => {\n const editedOn = 'editedOn' in message ? message.editedOn : undefined;\n if (message.messageType === 'chat' && editedOn) {\n return <div className={chatMessageEditedTagStyle(theme)}>{editedTag}</div>;\n }\n return undefined;\n};\n"]}
1
+ {"version":3,"file":"ChatMessageComponentUtils.js","sourceRoot":"","sources":["../../../../../../../react-components/src/components/utils/ChatMessageComponentUtils.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React from 'react';\nimport { ChatMessage, MessageAttachedStatus } from '../../types/ChatMessage';\nimport { ChatMessageContent } from '../ChatMessage/ChatMessageContent';\n/* @conditional-compile-remove(data-loss-prevention) */\nimport { BlockedMessage } from '../../types/ChatMessage';\n/* @conditional-compile-remove(data-loss-prevention) */\nimport { BlockedMessageContent } from '../ChatMessage/ChatMessageContent';\nimport { InlineImageOptions } from '../ChatMessage/ChatMessageContent';\nimport { MessageThreadStrings } from '../MessageThread';\n/* @conditional-compile-remove(mention) */\nimport { MentionDisplayOptions } from '../MentionPopover';\nimport { _AttachmentDownloadCards } from '../Attachment/AttachmentDownloadCards';\nimport { AttachmentMenuAction } from '../../types/Attachment';\nimport { AttachmentMetadata } from '@internal/acs-ui-common';\nimport { formatTimeForChatMessage, formatTimestampForChatMessage } from './Datetime';\nimport { ComponentLocale } from '../../localization/LocalizationProvider';\nimport { chatMessageEditedTagStyle } from '../styles/ChatMessageComponent.styles';\nimport { Theme } from '@fluentui/react';\n\n/** @private\n * Return the string value for the FluentUI message attached prop based on the message's attached status.\n * @param attached - The message's attached status.\n */\nexport const getFluentUIAttachedValue = (\n messageAttachedStatus?: MessageAttachedStatus\n): 'bottom' | 'top' | 'center' | undefined => {\n return messageAttachedStatus === 'top' || messageAttachedStatus === false ? 'top' : 'center';\n};\n\n/**\n * @private\n * Get the message bubble content for the message.\n */\nexport function getMessageBubbleContent(\n message: ChatMessage | /* @conditional-compile-remove(data-loss-prevention) */ BlockedMessage,\n strings: MessageThreadStrings,\n userId: string,\n inlineImageOptions: InlineImageOptions | undefined,\n /* @conditional-compile-remove(mention) */\n mentionDisplayOptions?: MentionDisplayOptions,\n /**\n * Optional callback to render message attachments in the message component.\n */\n onRenderAttachmentDownloads?: (message: ChatMessage) => JSX.Element,\n /**\n * Optional callback to define custom actions for attachments.\n */\n actionsForAttachment?: (attachment: AttachmentMetadata, message?: ChatMessage) => AttachmentMenuAction[]\n): JSX.Element {\n /* @conditional-compile-remove(data-loss-prevention) */\n if (message.messageType === 'blocked') {\n return (\n <div tabIndex={0}>\n <BlockedMessageContent message={message} strings={strings} />\n </div>\n );\n }\n return (\n <div className=\"ui-chat__message__content\">\n <ChatMessageContent\n message={message}\n strings={strings}\n /* @conditional-compile-remove(mention) */\n mentionDisplayOptions={mentionDisplayOptions}\n inlineImageOptions={inlineImageOptions}\n />\n {onRenderAttachmentDownloads\n ? onRenderAttachmentDownloads(message)\n : defaultOnRenderAttachmentDownloads(\n message,\n strings,\n\n actionsForAttachment\n )}\n </div>\n );\n}\n\n/**\n * Default component for rendering attachment downloads.\n */\nconst defaultOnRenderAttachmentDownloads = (\n message: ChatMessage | /* @conditional-compile-remove(data-loss-prevention) */ BlockedMessage,\n strings: MessageThreadStrings,\n actionsForAttachment?: (attachment: AttachmentMetadata, message?: ChatMessage) => AttachmentMenuAction[]\n): JSX.Element | undefined => {\n const attachments = 'attachments' in message ? message.attachments : undefined;\n return (attachments?.length ?? 0) > 0 ? (\n <_AttachmentDownloadCards\n message={message as ChatMessage}\n attachments={attachments}\n actionsForAttachment={actionsForAttachment}\n strings={{\n /* @conditional-compile-remove(file-sharing-acs) */\n downloadAttachment: strings.downloadAttachment,\n openAttachment: strings.openAttachment,\n attachmentCardGroupMessage: strings.attachmentCardGroupMessage\n }}\n />\n ) : (\n <></>\n );\n};\n\n/** @private */\nexport const generateDefaultTimestamp = (\n createdOn: Date,\n showDate: boolean | undefined,\n strings: MessageThreadStrings\n): string => {\n const formattedTimestamp = showDate\n ? formatTimestampForChatMessage(createdOn, new Date(), strings)\n : formatTimeForChatMessage(createdOn);\n\n return formattedTimestamp;\n};\n\n// onDisplayDateTimeString from props overwrite onDisplayDateTimeString from locale\n/** @private */\nexport const generateCustomizedTimestamp = (\n createdOn: Date,\n locale: ComponentLocale,\n onDisplayDateTimeString?: (messageDate: Date) => string\n): string => {\n /* @conditional-compile-remove(date-time-customization) */\n return onDisplayDateTimeString\n ? onDisplayDateTimeString(createdOn)\n : locale.onDisplayDateTimeString\n ? locale.onDisplayDateTimeString(createdOn)\n : '';\n\n return '';\n};\n\n/**\n * @private\n * Get the edited tag for the message if it is edited.\n */\nexport const getMessageEditedDetails = (\n message: ChatMessage | /* @conditional-compile-remove(data-loss-prevention) */ BlockedMessage,\n theme: Theme,\n editedTag: string\n): JSX.Element | undefined => {\n const editedOn = 'editedOn' in message ? message.editedOn : undefined;\n if (message.messageType === 'chat' && editedOn) {\n return <div className={chatMessageEditedTagStyle(theme)}>{editedTag}</div>;\n }\n return undefined;\n};\n\n/**\n * Removes Fluent UI keyboard navigation styles from the given HTMLDivElement.\n *\n * This function removes the 'tabindex' and 'data-tabster' attributes from the provided\n * HTMLDivElement, making it non-focusable and removing any associated keyboard navigation styles.\n *\n * @param node - The HTMLDivElement from which to remove the keyboard navigation styles. If null, the function does nothing.\n */\nexport const removeFluentUIKeyboardNavigationStyles = (node: HTMLDivElement | null): void => {\n if (node) {\n // Remove tabindex to make the div element non-focusable\n node.removeAttribute('tabindex');\n node.removeAttribute('data-tabster');\n }\n};\n"]}
@@ -82,6 +82,7 @@
82
82
  "captionsBanner": {
83
83
  "captionsBannerSpinnerText": "Starting captions...",
84
84
  "realTimeTextInputBoxDefaultText": "Type message in real time",
85
+ "realTimeTextInputErrorMessage": "Message can not exceed 2000 characters",
85
86
  "realTimeTextBannerTitle": "RTT",
86
87
  "realTimeTextBannerContent": "RTT (real-time text) is enabled for all participants for the entire duration of the meeting.",
87
88
  "realTimeTextBannerLinkLabel": "Learn more"
@@ -546,6 +546,10 @@ export interface CallCompositeStrings {
546
546
  * Default text for RTT input text box
547
547
  */
548
548
  realTimeTextInputBoxDefaultText?: string;
549
+ /**
550
+ * Error message for RTT input text box when the size exceeds the limit 2000
551
+ */
552
+ realTimeTextInputErrorMessage?: string;
549
553
  /**
550
554
  * Text to show in the real time text disclosure banner
551
555
  */
@@ -1 +1 @@
1
- {"version":3,"file":"Strings.js","sourceRoot":"","sources":["../../../../../../../react-composites/src/composites/CallComposite/Strings.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { SpokenLanguageStrings, CaptionLanguageStrings } from '@internal/react-components';\nimport { SurveyIssues, SurveyIssuesHeadingStrings } from '@internal/react-components';\nimport { CapabilityChangedNotificationStrings } from './components/CapabilitiesChangedNotificationBar';\nimport { SpotlightPromptStrings } from './components/Prompt';\n\n/**\n * Strings used by the {@link CallComposite} directly.\n *\n * This strings are in addition to those used by the components from the component library.\n *\n * @public\n */\nexport interface CallCompositeStrings {\n /**\n * Title of configuration page.\n */\n configurationPageTitle: string;\n /**\n * Optional 1-2 lines on the call details used on the configuration page.\n */\n configurationPageCallDetails?: string;\n /**\n * Text in button to start call in configuration page.\n */\n startCallButtonLabel: string;\n /**\n * Text in button to rejoin an ended call.\n */\n rejoinCallButtonLabel: string;\n /**\n * Placeholder text for local device settings dropdowns.\n */\n defaultPlaceHolder: string;\n /**\n * Label for camera dropdown.\n */\n cameraLabel: string;\n /**\n * Label for when there are no cameras present on configuration screen.\n */\n noCamerasLabel: string;\n /**\n * Label for sound dropdown.\n */\n soundLabel: string;\n /**\n * Label for when no microphones were found on the configuration screen\n */\n noMicrophonesLabel: string;\n /**\n * Label for when no speakers were found on the configuration screen.\n */\n noSpeakersLabel: string;\n /**\n * Error shown when camera access is blocked by the browser.\n */\n cameraPermissionDenied: string;\n /**\n * Error shown when the camera is turned off.\n */\n cameraTurnedOff: string;\n /**\n * Error shown when microphone access is blocked by the browser.\n */\n microphonePermissionDenied: string;\n /**\n * Title text of the page shown to the user when joining a Teams meeting fails because meeting owner denied access.\n */\n failedToJoinTeamsMeetingReasonAccessDeniedTitle: string;\n /**\n * More details text of the page shown to the user when joining a Teams meeting fails because meeting owner denied access.\n */\n failedToJoinTeamsMeetingReasonAccessDeniedMoreDetails?: string;\n /**\n * Title text of the page shown to the user when joining a call fails due to a network problem.\n */\n failedToJoinCallDueToNoNetworkTitle: string;\n /**\n * More details text of the page shown to the user when joining a call fails due to a network problem.\n */\n failedToJoinCallDueToNoNetworkMoreDetails?: string;\n /**\n * Text to display on a leaving page.\n */\n leavingCallTitle?: string;\n /**\n * Title text of the page shown to the user when they leave a call in the call composite.\n */\n leftCallTitle: string;\n /**\n * More details text of the page shown to the user when they leave a call in the call composite.\n */\n leftCallMoreDetails?: string;\n /**\n * Title text of the page shown to the user when they are removed from a call in the call composite.\n */\n removedFromCallTitle: string;\n /**\n * More details text of the page shown to the user when they are removed from a call in the call composite.\n */\n removedFromCallMoreDetails?: string;\n /**\n * Text shown to the user on the lobby screen when connecting to a call.\n */\n lobbyScreenConnectingToCallTitle: string;\n /**\n * Optional addition details shown to the user on the lobby screen when connection to a call.\n */\n lobbyScreenConnectingToCallMoreDetails?: string;\n /**\n * Text shown to the user on the lobby screen when waiting to be admitted to a call.\n */\n lobbyScreenWaitingToBeAdmittedTitle: string;\n /**\n * Optional additional details shown to the user on the lobby screen when waiting to be admitted to a call.\n */\n lobbyScreenWaitingToBeAdmittedMoreDetails?: string;\n /**\n * Message shown to the user when they are speaking while muted.\n */\n mutedMessage: string;\n /**\n * Text for link to MS privacy policy in Compliance Banner.\n */\n privacyPolicy: string;\n /**\n * Text for link to learn more about a specific subject.\n */\n learnMore: string;\n /**\n * Message to let user know the meeting is only being recorded (no transcription) in ComplianceBanner.\n */\n complianceBannerNowOnlyRecording: string;\n /**\n * Message to let user know the meeting is only being transcripted (no recording) in ComplianceBanner.\n */\n complianceBannerNowOnlyTranscription: string;\n /**\n * Message to let user know recording and transcription of the meeting are saved in ComplianceBanner.\n */\n complianceBannerRecordingAndTranscriptionSaved: string;\n /**\n * Message to let user know recording and transcription of the meeting have started in ComplianceBanner.\n */\n complianceBannerRecordingAndTranscriptionStarted: string;\n /**\n * Message to let user know recording and transcription of the meeting have stopped in ComplianceBanner.\n */\n complianceBannerRecordingAndTranscriptionStopped: string;\n /**\n * Message to let user know recording of the meeting is being saved in ComplianceBanner.\n */\n complianceBannerRecordingSaving: string;\n /**\n * Message to let user know recording of the meeting has started in ComplianceBanner.\n */\n complianceBannerRecordingStarted: string;\n /**\n * Message to let user know recording of the meeting has stopped in ComplianceBanner.\n */\n complianceBannerRecordingStopped: string;\n /**\n * Message to let user know they are giving consent to meeting being transcripted in ComplianceBanner.\n */\n complianceBannerTranscriptionConsent: string;\n /**\n * Message to let user know transcription of the meeting is being saved in ComplianceBanner.\n */\n complianceBannerTranscriptionSaving: string;\n /**\n * Message to let user know transcription of the meeting has started in ComplianceBanner.\n */\n complianceBannerTranscriptionStarted: string;\n /**\n * Message to let user know the transcription of the meeting has stopped in ComplianceBanner.\n */\n complianceBannerTranscriptionStopped: string;\n /**\n * Text for close button.\n */\n close: string;\n /**\n * Title text of the page shown to the user when there is intermittent network failure during a call.\n */\n networkReconnectTitle: string;\n /**\n * More details text of the page shown to the user when there is intermittent network failure during a call.\n */\n networkReconnectMoreDetails: string;\n /**\n * Tooltip text used to inform a user that toggling microphone in lobby is not supported.\n */\n microphoneToggleInLobbyNotAllowed: string;\n /**\n * Side pane People section Title.\n */\n peoplePaneTitle: string;\n /**\n * Aria label of more button in people pane\n */\n peoplePaneMoreButtonAriaLabel: string;\n /**\n * Aria label string for return to call back button\n */\n returnToCallButtonAriaLabel?: string;\n /**\n * Aria Description string for return to call button\n */\n returnToCallButtonAriaDescription?: string;\n /**\n * control bar People button label\n */\n peopleButtonLabel: string;\n /**\n * control bar People button label when checked\n */\n selectedPeopleButtonLabel: string;\n /**\n * control bar Chat button label.\n */\n chatButtonLabel: string;\n /**\n * Label for SidePaneHeader dismiss button\n */\n dismissSidePaneButtonLabel?: string;\n /**\n * Side pane People section subheader.\n */\n peoplePaneSubTitle?: string;\n /**\n * Label for button to copy invite link\n */\n copyInviteLinkButtonLabel?: string;\n /**\n * Label for button to copy invite link when it has been actioned\n */\n copyInviteLinkButtonActionedLabel?: string;\n /**\n * Label for button to open dialpad\n */\n openDialpadButtonLabel?: string;\n /**\n * Label for menu item to remove participant\n */\n removeMenuLabel?: string;\n /**\n * Label for menu item to start spotlight on participant\n */\n startSpotlightMenuLabel: string;\n /**\n * Label for menu item to add spotlight on participant\n */\n addSpotlightMenuLabel: string;\n /**\n * Label for menu item to stop spotlight on participant\n */\n stopSpotlightMenuLabel: string;\n /**\n * Label for menu item to stop spotlight on local user\n */\n stopSpotlightOnSelfMenuLabel: string;\n /**\n * Label for menu item to stop spotlight on local user\n */\n spotlightLimitReachedMenuTitle: string;\n /**\n * Label for menu item to stop all spotlight\n */\n stopAllSpotlightMenuLabel: string;\n /**\n * Label for add people dropdown\n */\n peoplePaneAddPeopleButtonLabel?: string;\n /**\n * Label for button to start a call\n */\n dialpadStartCallButtonLabel?: string;\n /**\n * Title for dialpad Modal\n */\n dialpadModalTitle?: string;\n /**\n * Aria Label for dialpad Modal\n */\n dialpadModalAriaLabel?: string;\n /**\n * Aria Label for dialpad Modal close button\n */\n dialpadCloseModalButtonAriaLabel?: string;\n /**\n * label for more button in the Calling composite\n */\n moreButtonCallingLabel: string;\n /**\n * Label for the resume call button on the hold pane\n */\n resumeCallButtonLabel?: string;\n /**\n * Label for the resume call button on the hold pane when call is resuming\n */\n resumingCallButtonLabel?: string;\n /**\n * Aria label for the resume call button on the hold pane\n */\n resumeCallButtonAriaLabel?: string;\n /**\n * Aria label for the resume call button on the hold pane when call is resuming\n */\n resumingCallButtonAriaLabel?: string;\n /**\n * Label for the hold pane\n */\n holdScreenLabel?: string;\n /**\n * Placeholder text for dtmf dialpad\n */\n dtmfDialpadPlaceholderText?: string;\n /**\n * Label for the button to open dtmf dialpad\n */\n openDtmfDialpadLabel?: string;\n /**\n * aria label for when the invite link has been actioned\n */\n copyInviteLinkActionedAriaLabel: string;\n /**\n * Title text of the page shown to the user when the user attempts to join a room that cannot be found.\n */\n roomNotFoundTitle: string;\n /**\n * More details text of the page shown to the user when the user attempts to join a room that cannot be found.\n */\n roomNotFoundDetails?: string;\n /**\n * Title text of the page shown to the user when the user attempts to join a room that is not valid.\n */\n roomNotValidTitle: string;\n /**\n * More details text of the page shown to the user when the user attempts to join a room that is not valid.\n */\n roomNotValidDetails?: string;\n /**\n * Title text of the page shown to the user when the user's permission to join the room is removed.\n */\n inviteToRoomRemovedTitle: string;\n /**\n * More details text of the page shown to the user when the user's permission to join the room is removed.\n */\n inviteToRoomRemovedDetails?: string;\n\n /**\n * Video Effects pane title.\n */\n videoEffectsPaneTitle: string;\n\n /**\n * Video Effects pane sub section title for choosing background.\n */\n videoEffectsPaneBackgroundSelectionTitle: string;\n\n /**\n * Aria label for video effects pane\n */\n videoEffectsPaneAriaLabel: string;\n\n /**\n * Label for the button to open effects\n */\n configurationPageCameraIsLoadingLabel?: string;\n\n /**\n * Label for the button to open effects\n */\n configurationPageVideoEffectsButtonLabel?: string;\n\n /**\n * Error message for video effect failure\n */\n unableToStartVideoEffect?: string;\n\n /**\n * Label for the blur video background effect item\n */\n blurBackgroundEffectButtonLabel?: string;\n\n /**\n * Tooltip text for the blur video background effect item\n */\n blurBackgroundTooltip?: string;\n\n /**\n * Label for the remove video background effect item\n */\n removeBackgroundEffectButtonLabel?: string;\n\n /**\n * Tooltip text for the blur video background effect item\n */\n removeBackgroundTooltip?: string;\n\n /**\n * Text to show when warning the user the camera is off and inform the user to turn the camera on to see the selected video background effect.\n */\n cameraOffBackgroundEffectWarningText?: string;\n /**\n * Title text of the page shown to the user when the user attempts to join a room they are not invited to.\n */\n notInvitedToRoomTitle: string;\n /**\n * More details text of the page shown to the user when the user attempts to join a room they are not invited to.\n */\n notInvitedToRoomDetails?: string;\n /**\n * Control bar People button ToolTipContent\n */\n peopleButtonTooltipOpen: string;\n /**\n * Control bar People button ToolTipContent\n */\n peopleButtonTooltipClose: string;\n /**\n * Label disaplayed on the lobby screen during a 1:1 outbound call.\n */\n outboundCallingNoticeString?: string;\n /**\n * Notice to be announced by narrator when a participant joins a call\n */\n participantJoinedNoticeString: string;\n /**\n * Notice to be announced by narrator when a participant joins a call\n */\n twoParticipantJoinedNoticeString: string;\n /**\n * Notice to be announced by narrator when a participant joins a call\n */\n threeParticipantJoinedNoticeString: string;\n /**\n * Notice to be announced by narrator when a participant leaves a call\n */\n participantLeftNoticeString: string;\n /**\n * Notice to be announced by narrator when 2 participants leave a call\n */\n twoParticipantLeftNoticeString: string;\n /**\n * Notice to be announced by narrator when 3 participants leave a call\n */\n threeParticipantLeftNoticeString: string;\n /**\n * string to be used to announce a change in participant if they have no displayName\n */\n unnamedParticipantString: string;\n /**\n * string to be used to announce when more than 3 participants have joined at the same time.\n */\n manyParticipantsJoined: string;\n /**\n * string to be used to announce when more than 3 participants have left at the same time.\n */\n manyParticipantsLeft: string;\n /**\n * string to be used to announce when multiple unnamed participants have joined at the same time.\n */\n manyUnnamedParticipantsJoined: string;\n /**\n * string to be used to announce when multiple unnamed participants have left at the same time.\n */\n manyUnnamedParticipantsLeft: string;\n /**\n * string to be used to open live captions contextual menu\n */\n liveCaptionsLabel?: string;\n /**\n * label for opening captions setting modal\n */\n captionsSettingsLabel?: string;\n /**\n * string to be used to start captions\n */\n startCaptionsButtonOnLabel?: string;\n /* @conditional-compile-remove(rtt) */\n /**\n * string to be used to open real time text contextual menu\n */\n realTimeTextLabel?: string;\n /* @conditional-compile-remove(rtt) */\n /**\n * string to be used to start real time text\n */\n startRealTimeTextLabel?: string;\n /**\n * string to be used to stop captions\n */\n startCaptionsButtonOffLabel?: string;\n /**\n * tooltip string to be used to show captions is on\n */\n startCaptionsButtonTooltipOnContent?: string;\n /**\n *tooltip string to be used to show captions is off\n */\n startCaptionsButtonTooltipOffContent?: string;\n /**\n * captions setting modal title\n */\n captionsSettingsModalTitle?: string;\n /**\n * label for spoken language dropdown inside captions setting modal\n */\n captionsSettingsSpokenLanguageDropdownLabel?: string;\n /**\n * label for captions language inside captions setting modal\n */\n captionsSettingsCaptionLanguageDropdownLabel?: string;\n /**\n * text under captions setting dropdown indicating what the dropdown is for\n */\n captionsSettingsSpokenLanguageDropdownInfoText?: string;\n /**\n * text under captions setting dropdown indicating what the dropdown is for\n */\n captionsSettingsCaptionLanguageDropdownInfoText?: string;\n /**\n * confirm button label in captions setting modal\n */\n captionsSettingsConfirmButtonLabel?: string;\n /**\n * cancel button label in captions setting modal\n */\n captionsSettingsCancelButtonLabel?: string;\n /**\n * arial label for captions setting modal\n */\n captionsSettingsModalAriaLabel?: string;\n /**\n * arial label for captions setting modal close button\n */\n captionsSettingsCloseModalButtonAriaLabel?: string;\n /**\n * label for more button inside captions banner\n */\n captionsBannerMoreButtonCallingLabel?: string;\n /**\n * arial label for more button inside captions banner\n */\n captionsBannerMoreButtonTooltip?: string;\n /**\n * list of key value pairs that pairs spoken language code to language names\n */\n spokenLanguageStrings?: SpokenLanguageStrings;\n /**\n * list of key value pairs that pairs caption language code to language names\n */\n captionLanguageStrings?: CaptionLanguageStrings;\n /**\n * captions banner loading spinner label\n */\n captionsBannerSpinnerText?: string;\n /* @conditional-compile-remove(rtt) */\n /**\n * Default text for RTT input text box\n */\n realTimeTextInputBoxDefaultText?: string;\n /* @conditional-compile-remove(rtt) */\n /**\n * Text to show in the real time text disclosure banner\n */\n realTimeTextBannerContent?: string;\n /* @conditional-compile-remove(rtt) */\n /**\n * Title text of the real time text disclosure banner\n */\n realTimeTextBannerTitle?: string;\n /* @conditional-compile-remove(rtt) */\n /**\n * Label for the link in the real time text disclosure banner\n */\n realTimeTextBannerLinkLabel?: string;\n /**\n * transfer page text when showing the transferor who initiated the transfer\n */\n transferPageTransferorText: string;\n /**\n * transfer page text when showing the transfer target\n */\n transferPageTransferTargetText: string;\n /**\n * transfer page display name for unknown participant\n */\n transferPageUnknownTransferorDisplayName: string;\n /**\n * transfer page display name for unknown participant\n */\n transferPageUnknownTransferTargetDisplayName: string;\n /**\n * notice to be announced by narrator the transfer page is showing\n */\n transferPageNoticeString: string;\n\n /**\n * Title text of the page shown to the user when target participant could not be reached\n */\n participantCouldNotBeReachedTitle?: string;\n\n /**\n * More details text of the page shown to the user when target participant could not be reached\n */\n participantCouldNotBeReachedMoreDetails?: string;\n\n /**\n * Title text of the page shown to the user when permission to reach participant is not allowed\n */\n permissionToReachTargetParticipantNotAllowedTitle?: string;\n\n /**\n * More details text of the page shown to the user when permission to reach participant is not allowed\n */\n permissionToReachTargetParticipantNotAllowedMoreDetails?: string;\n\n /**\n * Title text of the page shown to the user when tenant id for the target participant could not be resolved\n */\n unableToResolveTenantTitle?: string;\n\n /**\n * More details text of the page shown to the user when tenant id for the target participant could not be resolved\n */\n unableToResolveTenantMoreDetails?: string;\n\n /**\n * Title text of the page shown to the user when target participant id is malformed\n */\n participantIdIsMalformedTitle?: string;\n\n /**\n * More details text of the page shown to the user when target participant id is malformed\n */\n participantIdIsMalformedMoreDetails?: string;\n /**\n * Controls label to move the overflow gallery around\n */\n moreButtonGalleryControlLabel?: string;\n /**\n * Label for the toggle to move the overflow gallery to the top\n */\n moreButtonGalleryPositionToggleLabel?: string;\n /**\n * Label for the selection of the speaker layout\n */\n moreButtonGallerySpeakerLayoutLabel?: string;\n /**\n * Label for the selection of the default (Gallery) layout\n */\n moreButtonGalleryDefaultLayoutLabel?: string;\n /**\n * Label for the selection of the default (Gallery) layout\n */\n moreButtonLargeGalleryDefaultLayoutLabel?: string;\n /* conditional-compile-remove(together-mode) */\n /**\n * Label for the selection of the Together Mode (Gallery) layout\n */\n moreButtonTogetherModeLayoutLabel?: string;\n /**\n * Label for the selection of the floatingLocalVideo (Dynamic) layout\n */\n moreButtonGalleryFloatingLocalLayoutLabel?: string;\n /**\n * Label for the selection of the focusedContentLayout (Focused content) layout\n */\n moreButtonGalleryFocusedContentLayoutLabel?: string;\n\n /**\n * All strings for capability changed notification\n */\n capabilityChangedNotification?: CapabilityChangedNotificationStrings;\n /**\n * Title for the survey\n */\n surveyTitle: string;\n /**\n * Helper text to explain what the survey is for\n */\n starSurveyHelperText: string;\n /**\n * Helper text displayed below survey question after user select one star\n */\n starSurveyOneStarText: string;\n /**\n * Helper text displayed below survey question after user select two star\n */\n starSurveyTwoStarText: string;\n /**\n * Helper text displayed below survey question after user select three star\n */\n starSurveyThreeStarText: string;\n /**\n * Helper text displayed below survey question after user select four star\n */\n starSurveyFourStarText: string;\n /**\n * Helper text displayed below survey question after user select five star\n */\n starSurveyFiveStarText: string;\n /**\n * Aria Label for each individual star rating\n */\n starRatingAriaLabel: string;\n /**\n * Tags Survey Question\n */\n tagsSurveyQuestion: string;\n /**\n * Default text for free form text field inside tags survey\n */\n tagsSurveyTextFieldDefaultText: string;\n /**\n * Tags Survey helper text\n */\n tagsSurveyHelperText: string;\n /**\n * Confirm button label for survey\n */\n surveyConfirmButtonLabel: string;\n /**\n * Cancel button label for survey\n */\n surveySkipButtonLabel: string;\n /**\n * Thank you text appeared on screen after survey is submitted\n */\n endOfSurveyText: string;\n /**\n * Corresponding texts to each call issue\n */\n surveyIssues: SurveyIssues;\n /**\n * Corresponding texts to each call category\n */\n surveyIssuesHeadingStrings: SurveyIssuesHeadingStrings;\n /**\n * String for the dismiss control on the local and remote PIP on mobile\n */\n dismissModalAriaLabel?: string;\n /**\n * String for title when the call is rejected by the callee\n */\n callRejectedTitle?: string;\n /**\n * String for more details when the call is rejected by the callee\n */\n callRejectedMoreDetails?: string;\n /**\n * String for title when the call times out because the remote user does not answer\n */\n callTimeoutTitle?: string;\n /**\n * String for title when the call times out when calling a bot.\n */\n callTimeoutBotTitle?: string;\n /**\n * String for more details when the call times out because the remote user does not answer\n */\n callTimeoutDetails?: string;\n /**\n * String for more details when the call times out when calling a bot\n */\n callTimeoutBotDetails?: string;\n /**\n * Label for the control bar button to show the dtmf dialer when the more button is disabled\n */\n dtmfDialerButtonLabel?: string;\n /**\n * Tooltip for the control bar button to show the dtmf dialer when the more button is disabled\n */\n dtmfDialerButtonTooltipOn?: string;\n /**\n * Tooltip for the control bar button to hide the dtmf dialer when the more button is disabled\n */\n dtmfDialerButtonTooltipOff?: string;\n /**\n * Label to show the dtmf dialer in the more button menu\n */\n dtmfDialerMoreButtonLabelOn?: string;\n /**\n * Label to hide the dtmf dialer in the more button menu\n */\n dtmfDialerMoreButtonLabelOff?: string;\n /**\n * Strings for spotlight prompt\n */\n spotlightPrompt: SpotlightPromptStrings;\n /**\n * Label for button to exit spotlight\n */\n exitSpotlightButtonLabel: string;\n /**\n * Tooltip for button to exit spotlight\n */\n exitSpotlightButtonTooltip: string;\n /**\n * Label for confirm button of hang up for everyone dialog\n */\n leaveConfirmButtonLabel?: string;\n /**\n * Label for confirm button of leave confim dialog\n */\n endCallConfirmButtonLabel?: string;\n /**\n * Label for cancel button in hang up confirm dialog\n */\n hangUpCancelButtonLabel?: string;\n /**\n * Title of confirm dialog when leaving\n */\n leaveConfirmDialogTitle?: string;\n /**\n * Content of confirm dialog when leaving\n */\n leaveConfirmDialogContent?: string;\n /**\n * Title of confirm dialog when leaving\n */\n endCallConfirmDialogTitle?: string;\n /**\n * Content of confirm dialog when leaving\n */\n endCallConfirmDialogContent?: string;\n /**\n * Error message when the meeting identifier or passcode is invalid\n */\n invalidMeetingIdentifier: string;\n /**\n * Menu text shown in Participant Item contextual menu for pinning a remote participant's video tile\n *\n */\n pinParticipantMenuLabel: string;\n /**\n * Menu text shown in Participant Item contextual menu when pinning limit is reached\n *\n */\n pinParticipantLimitReachedMenuLabel: string;\n /**\n * Menu text shown in Participant Item contextual menu for unpinning a remote participant's video tile\n *\n */\n unpinParticipantMenuLabel: string;\n /**\n * Aria label for unpin participant menu item of remote participant\n */\n unpinParticipantMenuItemAriaLabel: string;\n /**\n * Aria label to announce when remote participant is pinned\n */\n pinParticipantMenuItemAriaLabel: string;\n /**\n * Error message when the meeting identifier or passcode is invalid\n */\n phoneCallMoreButtonLabel: string;\n /**\n * Label for mute all remote participants menu item in People Pane\n */\n muteAllMenuLabel: string;\n /**\n * Label for mute all prompt title\n */\n muteAllDialogTitle: string;\n /**\n * Label for mute all prompt content\n */\n muteAllDialogContent: string;\n /**\n * Label for mute all confirm button\n */\n muteAllConfirmButtonLabel: string;\n /**\n * Label for mute all cancel button\n */\n muteAllCancelButtonLabel: string;\n /* @conditional-compile-remove(breakout-rooms) */\n /**\n * Label for join breakout room button\n */\n joinBreakoutRoomButtonLabel: string;\n /* @conditional-compile-remove(breakout-rooms) */\n /**\n * Label for button to return from breakout room\n */\n returnFromBreakoutRoomButtonLabel: string;\n /* @conditional-compile-remove(breakout-rooms) */\n /**\n * Label for button to leave breakout room and meeting\n */\n leaveBreakoutRoomAndMeetingButtonLabel: string;\n /* @conditional-compile-remove(breakout-rooms) */\n /**\n * Notification title for when a user joins a breakout room\n */\n breakoutRoomJoinedNotificationTitle: string;\n /* @conditional-compile-remove(breakout-rooms) */\n /**\n * Title for banner to join the assigned breakout room. The banner is shown in mobile view instead of the\n * notification.\n */\n joinBreakoutRoomBannerTitle: string;\n /* @conditional-compile-remove(breakout-rooms) */\n /**\n * Label for button in banner to join breakout room. The banner is shown in mobile view instead of the notification.\n */\n joinBreakoutRoomBannerButtonLabel: string;\n /* @conditional-compile-remove(breakout-rooms) */\n /**\n * Title for banner to return from breakout room. The banner is shown in mobile view instead of the notification.\n */\n returnFromBreakoutRoomBannerTitle: string;\n /* @conditional-compile-remove(breakout-rooms) */\n /**\n * Label for button in banner to return from breakout room. The banner is shown in mobile view instead of the\n * notification.\n */\n returnFromBreakoutRoomBannerButtonLabel: string;\n /* @conditional-compile-remove(media-access) */\n /**\n * Label for menu item to forbid audio media access\n */\n forbidAudioMenuLabel: string;\n /* @conditional-compile-remove(media-access) */\n /**\n * Label for menu item to permit audio media access\n */\n permitAudioMenuLabel: string;\n /* @conditional-compile-remove(media-access) */\n /**\n * Dialog title to confirm forbid Teams meeting audio media access\n */\n forbidOthersAudioDialogTitle: string;\n /* @conditional-compile-remove(media-access) */\n /**\n * Dialog content to confirm forbid Teams meeting audio media access\n */\n forbidOthersAudioDialogContent: string;\n /* @conditional-compile-remove(media-access) */\n /**\n * Dialog button to confirm forbid Teams meeting audio media access\n */\n forbidOthersAudioConfirmButtonLabel: string;\n /* @conditional-compile-remove(media-access) */\n /**\n * Dialog cancel button for forbid Teams meeting audio media access\n */\n forbidOthersAudioCancelButtonLabel: string;\n /* @conditional-compile-remove(media-access) */\n /**\n * Dialog title to confirm permit Teams meeting audio media access\n */\n permitOthersAudioDialogTitle: string;\n /* @conditional-compile-remove(media-access) */\n /**\n * Dialog content to confirm permit Teams meeting audio media access\n */\n permitOthersAudioDialogContent: string;\n /* @conditional-compile-remove(media-access) */\n /**\n * Dialog button to confirm permit Teams meeting audio media access\n */\n permitOthersAudioConfirmButtonLabel: string;\n /* @conditional-compile-remove(media-access) */\n /**\n * Dialog cancel button for permit Teams meeting audio media access\n */\n permitOthersAudioCancelButtonLabel: string;\n /* @conditional-compile-remove(media-access) */\n /**\n * Label for menu item to forbid video media access\n */\n forbidOthersAudioMenuLabel: string;\n /* @conditional-compile-remove(media-access) */\n /** Label for menu item to permit video media access */\n permitOthersAudioMenuLabel: string;\n\n /* @conditional-compile-remove(media-access) */\n /** Label for menu item to forbid video media access */\n forbidVideoMenuLabel: string;\n /* @conditional-compile-remove(media-access) */\n /** Label for menu item to permit video media access */\n permitVideoMenuLabel: string;\n /* @conditional-compile-remove(media-access) */\n /** Dialog title to confirm forbid Teams meeting video media access */\n forbidOthersVideoDialogTitle: string;\n /* @conditional-compile-remove(media-access) */\n /** Dialog content to confirm forbid Teams meeting video media access */\n forbidOthersVideoDialogContent: string;\n /* @conditional-compile-remove(media-access) */\n /** Dialog button to confirm forbid Teams meeting video media access */\n forbidOthersVideoConfirmButtonLabel: string;\n /* @conditional-compile-remove(media-access) */\n /** Dialog cancel button for forbid Teams meeting video media access */\n forbidOthersVideoCancelButtonLabel: string;\n /* @conditional-compile-remove(media-access) */\n /** Dialog title to confirm permit Teams meeting video media access */\n permitOthersVideoDialogTitle: string;\n /* @conditional-compile-remove(media-access) */\n /** Dialog content to confirm permit Teams meeting video media access */\n permitOthersVideoDialogContent: string;\n /* @conditional-compile-remove(media-access) */\n /** Dialog button to confirm permit Teams meeting video media access */\n permitOthersVideoConfirmButtonLabel: string;\n /* @conditional-compile-remove(media-access) */\n /** Dialog cancel button for permit Teams meeting video media access */\n permitOthersVideoCancelButtonLabel: string;\n /* @conditional-compile-remove(media-access) */\n /** Label for menu item to forbid audio media access */\n forbidOthersVideoMenuLabel: string;\n /* @conditional-compile-remove(media-access) */\n /** Label for menu item to permit audio media access */\n permitOthersVideoMenuLabel: string;\n /* @conditional-compile-remove(rtt) */\n /** The title of the RealTimeText modal */\n realTimeTextModalTitle: string;\n /* @conditional-compile-remove(rtt) */\n /** The text of the RealTimeText modal */\n realTimeTextModalText: string;\n /* @conditional-compile-remove(rtt) */\n /** The label for the confirm button */\n realTimeTextConfirmButtonLabel: string;\n /* @conditional-compile-remove(rtt) */\n /** The label for the cancel button */\n realTimeTextCancelButtonLabel: string;\n /* @conditional-compile-remove(rtt) */\n /** The aria label for the modal */\n realTimeTextModalAriaLabel: string;\n /* @conditional-compile-remove(rtt) */\n /** The aria label for the close button */\n realTimeTextCloseModalButtonAriaLabel: string;\n}\n"]}
1
+ {"version":3,"file":"Strings.js","sourceRoot":"","sources":["../../../../../../../react-composites/src/composites/CallComposite/Strings.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { SpokenLanguageStrings, CaptionLanguageStrings } from '@internal/react-components';\nimport { SurveyIssues, SurveyIssuesHeadingStrings } from '@internal/react-components';\nimport { CapabilityChangedNotificationStrings } from './components/CapabilitiesChangedNotificationBar';\nimport { SpotlightPromptStrings } from './components/Prompt';\n\n/**\n * Strings used by the {@link CallComposite} directly.\n *\n * This strings are in addition to those used by the components from the component library.\n *\n * @public\n */\nexport interface CallCompositeStrings {\n /**\n * Title of configuration page.\n */\n configurationPageTitle: string;\n /**\n * Optional 1-2 lines on the call details used on the configuration page.\n */\n configurationPageCallDetails?: string;\n /**\n * Text in button to start call in configuration page.\n */\n startCallButtonLabel: string;\n /**\n * Text in button to rejoin an ended call.\n */\n rejoinCallButtonLabel: string;\n /**\n * Placeholder text for local device settings dropdowns.\n */\n defaultPlaceHolder: string;\n /**\n * Label for camera dropdown.\n */\n cameraLabel: string;\n /**\n * Label for when there are no cameras present on configuration screen.\n */\n noCamerasLabel: string;\n /**\n * Label for sound dropdown.\n */\n soundLabel: string;\n /**\n * Label for when no microphones were found on the configuration screen\n */\n noMicrophonesLabel: string;\n /**\n * Label for when no speakers were found on the configuration screen.\n */\n noSpeakersLabel: string;\n /**\n * Error shown when camera access is blocked by the browser.\n */\n cameraPermissionDenied: string;\n /**\n * Error shown when the camera is turned off.\n */\n cameraTurnedOff: string;\n /**\n * Error shown when microphone access is blocked by the browser.\n */\n microphonePermissionDenied: string;\n /**\n * Title text of the page shown to the user when joining a Teams meeting fails because meeting owner denied access.\n */\n failedToJoinTeamsMeetingReasonAccessDeniedTitle: string;\n /**\n * More details text of the page shown to the user when joining a Teams meeting fails because meeting owner denied access.\n */\n failedToJoinTeamsMeetingReasonAccessDeniedMoreDetails?: string;\n /**\n * Title text of the page shown to the user when joining a call fails due to a network problem.\n */\n failedToJoinCallDueToNoNetworkTitle: string;\n /**\n * More details text of the page shown to the user when joining a call fails due to a network problem.\n */\n failedToJoinCallDueToNoNetworkMoreDetails?: string;\n /**\n * Text to display on a leaving page.\n */\n leavingCallTitle?: string;\n /**\n * Title text of the page shown to the user when they leave a call in the call composite.\n */\n leftCallTitle: string;\n /**\n * More details text of the page shown to the user when they leave a call in the call composite.\n */\n leftCallMoreDetails?: string;\n /**\n * Title text of the page shown to the user when they are removed from a call in the call composite.\n */\n removedFromCallTitle: string;\n /**\n * More details text of the page shown to the user when they are removed from a call in the call composite.\n */\n removedFromCallMoreDetails?: string;\n /**\n * Text shown to the user on the lobby screen when connecting to a call.\n */\n lobbyScreenConnectingToCallTitle: string;\n /**\n * Optional addition details shown to the user on the lobby screen when connection to a call.\n */\n lobbyScreenConnectingToCallMoreDetails?: string;\n /**\n * Text shown to the user on the lobby screen when waiting to be admitted to a call.\n */\n lobbyScreenWaitingToBeAdmittedTitle: string;\n /**\n * Optional additional details shown to the user on the lobby screen when waiting to be admitted to a call.\n */\n lobbyScreenWaitingToBeAdmittedMoreDetails?: string;\n /**\n * Message shown to the user when they are speaking while muted.\n */\n mutedMessage: string;\n /**\n * Text for link to MS privacy policy in Compliance Banner.\n */\n privacyPolicy: string;\n /**\n * Text for link to learn more about a specific subject.\n */\n learnMore: string;\n /**\n * Message to let user know the meeting is only being recorded (no transcription) in ComplianceBanner.\n */\n complianceBannerNowOnlyRecording: string;\n /**\n * Message to let user know the meeting is only being transcripted (no recording) in ComplianceBanner.\n */\n complianceBannerNowOnlyTranscription: string;\n /**\n * Message to let user know recording and transcription of the meeting are saved in ComplianceBanner.\n */\n complianceBannerRecordingAndTranscriptionSaved: string;\n /**\n * Message to let user know recording and transcription of the meeting have started in ComplianceBanner.\n */\n complianceBannerRecordingAndTranscriptionStarted: string;\n /**\n * Message to let user know recording and transcription of the meeting have stopped in ComplianceBanner.\n */\n complianceBannerRecordingAndTranscriptionStopped: string;\n /**\n * Message to let user know recording of the meeting is being saved in ComplianceBanner.\n */\n complianceBannerRecordingSaving: string;\n /**\n * Message to let user know recording of the meeting has started in ComplianceBanner.\n */\n complianceBannerRecordingStarted: string;\n /**\n * Message to let user know recording of the meeting has stopped in ComplianceBanner.\n */\n complianceBannerRecordingStopped: string;\n /**\n * Message to let user know they are giving consent to meeting being transcripted in ComplianceBanner.\n */\n complianceBannerTranscriptionConsent: string;\n /**\n * Message to let user know transcription of the meeting is being saved in ComplianceBanner.\n */\n complianceBannerTranscriptionSaving: string;\n /**\n * Message to let user know transcription of the meeting has started in ComplianceBanner.\n */\n complianceBannerTranscriptionStarted: string;\n /**\n * Message to let user know the transcription of the meeting has stopped in ComplianceBanner.\n */\n complianceBannerTranscriptionStopped: string;\n /**\n * Text for close button.\n */\n close: string;\n /**\n * Title text of the page shown to the user when there is intermittent network failure during a call.\n */\n networkReconnectTitle: string;\n /**\n * More details text of the page shown to the user when there is intermittent network failure during a call.\n */\n networkReconnectMoreDetails: string;\n /**\n * Tooltip text used to inform a user that toggling microphone in lobby is not supported.\n */\n microphoneToggleInLobbyNotAllowed: string;\n /**\n * Side pane People section Title.\n */\n peoplePaneTitle: string;\n /**\n * Aria label of more button in people pane\n */\n peoplePaneMoreButtonAriaLabel: string;\n /**\n * Aria label string for return to call back button\n */\n returnToCallButtonAriaLabel?: string;\n /**\n * Aria Description string for return to call button\n */\n returnToCallButtonAriaDescription?: string;\n /**\n * control bar People button label\n */\n peopleButtonLabel: string;\n /**\n * control bar People button label when checked\n */\n selectedPeopleButtonLabel: string;\n /**\n * control bar Chat button label.\n */\n chatButtonLabel: string;\n /**\n * Label for SidePaneHeader dismiss button\n */\n dismissSidePaneButtonLabel?: string;\n /**\n * Side pane People section subheader.\n */\n peoplePaneSubTitle?: string;\n /**\n * Label for button to copy invite link\n */\n copyInviteLinkButtonLabel?: string;\n /**\n * Label for button to copy invite link when it has been actioned\n */\n copyInviteLinkButtonActionedLabel?: string;\n /**\n * Label for button to open dialpad\n */\n openDialpadButtonLabel?: string;\n /**\n * Label for menu item to remove participant\n */\n removeMenuLabel?: string;\n /**\n * Label for menu item to start spotlight on participant\n */\n startSpotlightMenuLabel: string;\n /**\n * Label for menu item to add spotlight on participant\n */\n addSpotlightMenuLabel: string;\n /**\n * Label for menu item to stop spotlight on participant\n */\n stopSpotlightMenuLabel: string;\n /**\n * Label for menu item to stop spotlight on local user\n */\n stopSpotlightOnSelfMenuLabel: string;\n /**\n * Label for menu item to stop spotlight on local user\n */\n spotlightLimitReachedMenuTitle: string;\n /**\n * Label for menu item to stop all spotlight\n */\n stopAllSpotlightMenuLabel: string;\n /**\n * Label for add people dropdown\n */\n peoplePaneAddPeopleButtonLabel?: string;\n /**\n * Label for button to start a call\n */\n dialpadStartCallButtonLabel?: string;\n /**\n * Title for dialpad Modal\n */\n dialpadModalTitle?: string;\n /**\n * Aria Label for dialpad Modal\n */\n dialpadModalAriaLabel?: string;\n /**\n * Aria Label for dialpad Modal close button\n */\n dialpadCloseModalButtonAriaLabel?: string;\n /**\n * label for more button in the Calling composite\n */\n moreButtonCallingLabel: string;\n /**\n * Label for the resume call button on the hold pane\n */\n resumeCallButtonLabel?: string;\n /**\n * Label for the resume call button on the hold pane when call is resuming\n */\n resumingCallButtonLabel?: string;\n /**\n * Aria label for the resume call button on the hold pane\n */\n resumeCallButtonAriaLabel?: string;\n /**\n * Aria label for the resume call button on the hold pane when call is resuming\n */\n resumingCallButtonAriaLabel?: string;\n /**\n * Label for the hold pane\n */\n holdScreenLabel?: string;\n /**\n * Placeholder text for dtmf dialpad\n */\n dtmfDialpadPlaceholderText?: string;\n /**\n * Label for the button to open dtmf dialpad\n */\n openDtmfDialpadLabel?: string;\n /**\n * aria label for when the invite link has been actioned\n */\n copyInviteLinkActionedAriaLabel: string;\n /**\n * Title text of the page shown to the user when the user attempts to join a room that cannot be found.\n */\n roomNotFoundTitle: string;\n /**\n * More details text of the page shown to the user when the user attempts to join a room that cannot be found.\n */\n roomNotFoundDetails?: string;\n /**\n * Title text of the page shown to the user when the user attempts to join a room that is not valid.\n */\n roomNotValidTitle: string;\n /**\n * More details text of the page shown to the user when the user attempts to join a room that is not valid.\n */\n roomNotValidDetails?: string;\n /**\n * Title text of the page shown to the user when the user's permission to join the room is removed.\n */\n inviteToRoomRemovedTitle: string;\n /**\n * More details text of the page shown to the user when the user's permission to join the room is removed.\n */\n inviteToRoomRemovedDetails?: string;\n\n /**\n * Video Effects pane title.\n */\n videoEffectsPaneTitle: string;\n\n /**\n * Video Effects pane sub section title for choosing background.\n */\n videoEffectsPaneBackgroundSelectionTitle: string;\n\n /**\n * Aria label for video effects pane\n */\n videoEffectsPaneAriaLabel: string;\n\n /**\n * Label for the button to open effects\n */\n configurationPageCameraIsLoadingLabel?: string;\n\n /**\n * Label for the button to open effects\n */\n configurationPageVideoEffectsButtonLabel?: string;\n\n /**\n * Error message for video effect failure\n */\n unableToStartVideoEffect?: string;\n\n /**\n * Label for the blur video background effect item\n */\n blurBackgroundEffectButtonLabel?: string;\n\n /**\n * Tooltip text for the blur video background effect item\n */\n blurBackgroundTooltip?: string;\n\n /**\n * Label for the remove video background effect item\n */\n removeBackgroundEffectButtonLabel?: string;\n\n /**\n * Tooltip text for the blur video background effect item\n */\n removeBackgroundTooltip?: string;\n\n /**\n * Text to show when warning the user the camera is off and inform the user to turn the camera on to see the selected video background effect.\n */\n cameraOffBackgroundEffectWarningText?: string;\n /**\n * Title text of the page shown to the user when the user attempts to join a room they are not invited to.\n */\n notInvitedToRoomTitle: string;\n /**\n * More details text of the page shown to the user when the user attempts to join a room they are not invited to.\n */\n notInvitedToRoomDetails?: string;\n /**\n * Control bar People button ToolTipContent\n */\n peopleButtonTooltipOpen: string;\n /**\n * Control bar People button ToolTipContent\n */\n peopleButtonTooltipClose: string;\n /**\n * Label disaplayed on the lobby screen during a 1:1 outbound call.\n */\n outboundCallingNoticeString?: string;\n /**\n * Notice to be announced by narrator when a participant joins a call\n */\n participantJoinedNoticeString: string;\n /**\n * Notice to be announced by narrator when a participant joins a call\n */\n twoParticipantJoinedNoticeString: string;\n /**\n * Notice to be announced by narrator when a participant joins a call\n */\n threeParticipantJoinedNoticeString: string;\n /**\n * Notice to be announced by narrator when a participant leaves a call\n */\n participantLeftNoticeString: string;\n /**\n * Notice to be announced by narrator when 2 participants leave a call\n */\n twoParticipantLeftNoticeString: string;\n /**\n * Notice to be announced by narrator when 3 participants leave a call\n */\n threeParticipantLeftNoticeString: string;\n /**\n * string to be used to announce a change in participant if they have no displayName\n */\n unnamedParticipantString: string;\n /**\n * string to be used to announce when more than 3 participants have joined at the same time.\n */\n manyParticipantsJoined: string;\n /**\n * string to be used to announce when more than 3 participants have left at the same time.\n */\n manyParticipantsLeft: string;\n /**\n * string to be used to announce when multiple unnamed participants have joined at the same time.\n */\n manyUnnamedParticipantsJoined: string;\n /**\n * string to be used to announce when multiple unnamed participants have left at the same time.\n */\n manyUnnamedParticipantsLeft: string;\n /**\n * string to be used to open live captions contextual menu\n */\n liveCaptionsLabel?: string;\n /**\n * label for opening captions setting modal\n */\n captionsSettingsLabel?: string;\n /**\n * string to be used to start captions\n */\n startCaptionsButtonOnLabel?: string;\n /* @conditional-compile-remove(rtt) */\n /**\n * string to be used to open real time text contextual menu\n */\n realTimeTextLabel?: string;\n /* @conditional-compile-remove(rtt) */\n /**\n * string to be used to start real time text\n */\n startRealTimeTextLabel?: string;\n /**\n * string to be used to stop captions\n */\n startCaptionsButtonOffLabel?: string;\n /**\n * tooltip string to be used to show captions is on\n */\n startCaptionsButtonTooltipOnContent?: string;\n /**\n *tooltip string to be used to show captions is off\n */\n startCaptionsButtonTooltipOffContent?: string;\n /**\n * captions setting modal title\n */\n captionsSettingsModalTitle?: string;\n /**\n * label for spoken language dropdown inside captions setting modal\n */\n captionsSettingsSpokenLanguageDropdownLabel?: string;\n /**\n * label for captions language inside captions setting modal\n */\n captionsSettingsCaptionLanguageDropdownLabel?: string;\n /**\n * text under captions setting dropdown indicating what the dropdown is for\n */\n captionsSettingsSpokenLanguageDropdownInfoText?: string;\n /**\n * text under captions setting dropdown indicating what the dropdown is for\n */\n captionsSettingsCaptionLanguageDropdownInfoText?: string;\n /**\n * confirm button label in captions setting modal\n */\n captionsSettingsConfirmButtonLabel?: string;\n /**\n * cancel button label in captions setting modal\n */\n captionsSettingsCancelButtonLabel?: string;\n /**\n * arial label for captions setting modal\n */\n captionsSettingsModalAriaLabel?: string;\n /**\n * arial label for captions setting modal close button\n */\n captionsSettingsCloseModalButtonAriaLabel?: string;\n /**\n * label for more button inside captions banner\n */\n captionsBannerMoreButtonCallingLabel?: string;\n /**\n * arial label for more button inside captions banner\n */\n captionsBannerMoreButtonTooltip?: string;\n /**\n * list of key value pairs that pairs spoken language code to language names\n */\n spokenLanguageStrings?: SpokenLanguageStrings;\n /**\n * list of key value pairs that pairs caption language code to language names\n */\n captionLanguageStrings?: CaptionLanguageStrings;\n /**\n * captions banner loading spinner label\n */\n captionsBannerSpinnerText?: string;\n /* @conditional-compile-remove(rtt) */\n /**\n * Default text for RTT input text box\n */\n realTimeTextInputBoxDefaultText?: string;\n /* @conditional-compile-remove(rtt) */\n /**\n * Error message for RTT input text box when the size exceeds the limit 2000\n */\n realTimeTextInputErrorMessage?: string;\n /* @conditional-compile-remove(rtt) */\n /**\n * Text to show in the real time text disclosure banner\n */\n realTimeTextBannerContent?: string;\n /* @conditional-compile-remove(rtt) */\n /**\n * Title text of the real time text disclosure banner\n */\n realTimeTextBannerTitle?: string;\n /* @conditional-compile-remove(rtt) */\n /**\n * Label for the link in the real time text disclosure banner\n */\n realTimeTextBannerLinkLabel?: string;\n /**\n * transfer page text when showing the transferor who initiated the transfer\n */\n transferPageTransferorText: string;\n /**\n * transfer page text when showing the transfer target\n */\n transferPageTransferTargetText: string;\n /**\n * transfer page display name for unknown participant\n */\n transferPageUnknownTransferorDisplayName: string;\n /**\n * transfer page display name for unknown participant\n */\n transferPageUnknownTransferTargetDisplayName: string;\n /**\n * notice to be announced by narrator the transfer page is showing\n */\n transferPageNoticeString: string;\n\n /**\n * Title text of the page shown to the user when target participant could not be reached\n */\n participantCouldNotBeReachedTitle?: string;\n\n /**\n * More details text of the page shown to the user when target participant could not be reached\n */\n participantCouldNotBeReachedMoreDetails?: string;\n\n /**\n * Title text of the page shown to the user when permission to reach participant is not allowed\n */\n permissionToReachTargetParticipantNotAllowedTitle?: string;\n\n /**\n * More details text of the page shown to the user when permission to reach participant is not allowed\n */\n permissionToReachTargetParticipantNotAllowedMoreDetails?: string;\n\n /**\n * Title text of the page shown to the user when tenant id for the target participant could not be resolved\n */\n unableToResolveTenantTitle?: string;\n\n /**\n * More details text of the page shown to the user when tenant id for the target participant could not be resolved\n */\n unableToResolveTenantMoreDetails?: string;\n\n /**\n * Title text of the page shown to the user when target participant id is malformed\n */\n participantIdIsMalformedTitle?: string;\n\n /**\n * More details text of the page shown to the user when target participant id is malformed\n */\n participantIdIsMalformedMoreDetails?: string;\n /**\n * Controls label to move the overflow gallery around\n */\n moreButtonGalleryControlLabel?: string;\n /**\n * Label for the toggle to move the overflow gallery to the top\n */\n moreButtonGalleryPositionToggleLabel?: string;\n /**\n * Label for the selection of the speaker layout\n */\n moreButtonGallerySpeakerLayoutLabel?: string;\n /**\n * Label for the selection of the default (Gallery) layout\n */\n moreButtonGalleryDefaultLayoutLabel?: string;\n /**\n * Label for the selection of the default (Gallery) layout\n */\n moreButtonLargeGalleryDefaultLayoutLabel?: string;\n /* conditional-compile-remove(together-mode) */\n /**\n * Label for the selection of the Together Mode (Gallery) layout\n */\n moreButtonTogetherModeLayoutLabel?: string;\n /**\n * Label for the selection of the floatingLocalVideo (Dynamic) layout\n */\n moreButtonGalleryFloatingLocalLayoutLabel?: string;\n /**\n * Label for the selection of the focusedContentLayout (Focused content) layout\n */\n moreButtonGalleryFocusedContentLayoutLabel?: string;\n\n /**\n * All strings for capability changed notification\n */\n capabilityChangedNotification?: CapabilityChangedNotificationStrings;\n /**\n * Title for the survey\n */\n surveyTitle: string;\n /**\n * Helper text to explain what the survey is for\n */\n starSurveyHelperText: string;\n /**\n * Helper text displayed below survey question after user select one star\n */\n starSurveyOneStarText: string;\n /**\n * Helper text displayed below survey question after user select two star\n */\n starSurveyTwoStarText: string;\n /**\n * Helper text displayed below survey question after user select three star\n */\n starSurveyThreeStarText: string;\n /**\n * Helper text displayed below survey question after user select four star\n */\n starSurveyFourStarText: string;\n /**\n * Helper text displayed below survey question after user select five star\n */\n starSurveyFiveStarText: string;\n /**\n * Aria Label for each individual star rating\n */\n starRatingAriaLabel: string;\n /**\n * Tags Survey Question\n */\n tagsSurveyQuestion: string;\n /**\n * Default text for free form text field inside tags survey\n */\n tagsSurveyTextFieldDefaultText: string;\n /**\n * Tags Survey helper text\n */\n tagsSurveyHelperText: string;\n /**\n * Confirm button label for survey\n */\n surveyConfirmButtonLabel: string;\n /**\n * Cancel button label for survey\n */\n surveySkipButtonLabel: string;\n /**\n * Thank you text appeared on screen after survey is submitted\n */\n endOfSurveyText: string;\n /**\n * Corresponding texts to each call issue\n */\n surveyIssues: SurveyIssues;\n /**\n * Corresponding texts to each call category\n */\n surveyIssuesHeadingStrings: SurveyIssuesHeadingStrings;\n /**\n * String for the dismiss control on the local and remote PIP on mobile\n */\n dismissModalAriaLabel?: string;\n /**\n * String for title when the call is rejected by the callee\n */\n callRejectedTitle?: string;\n /**\n * String for more details when the call is rejected by the callee\n */\n callRejectedMoreDetails?: string;\n /**\n * String for title when the call times out because the remote user does not answer\n */\n callTimeoutTitle?: string;\n /**\n * String for title when the call times out when calling a bot.\n */\n callTimeoutBotTitle?: string;\n /**\n * String for more details when the call times out because the remote user does not answer\n */\n callTimeoutDetails?: string;\n /**\n * String for more details when the call times out when calling a bot\n */\n callTimeoutBotDetails?: string;\n /**\n * Label for the control bar button to show the dtmf dialer when the more button is disabled\n */\n dtmfDialerButtonLabel?: string;\n /**\n * Tooltip for the control bar button to show the dtmf dialer when the more button is disabled\n */\n dtmfDialerButtonTooltipOn?: string;\n /**\n * Tooltip for the control bar button to hide the dtmf dialer when the more button is disabled\n */\n dtmfDialerButtonTooltipOff?: string;\n /**\n * Label to show the dtmf dialer in the more button menu\n */\n dtmfDialerMoreButtonLabelOn?: string;\n /**\n * Label to hide the dtmf dialer in the more button menu\n */\n dtmfDialerMoreButtonLabelOff?: string;\n /**\n * Strings for spotlight prompt\n */\n spotlightPrompt: SpotlightPromptStrings;\n /**\n * Label for button to exit spotlight\n */\n exitSpotlightButtonLabel: string;\n /**\n * Tooltip for button to exit spotlight\n */\n exitSpotlightButtonTooltip: string;\n /**\n * Label for confirm button of hang up for everyone dialog\n */\n leaveConfirmButtonLabel?: string;\n /**\n * Label for confirm button of leave confim dialog\n */\n endCallConfirmButtonLabel?: string;\n /**\n * Label for cancel button in hang up confirm dialog\n */\n hangUpCancelButtonLabel?: string;\n /**\n * Title of confirm dialog when leaving\n */\n leaveConfirmDialogTitle?: string;\n /**\n * Content of confirm dialog when leaving\n */\n leaveConfirmDialogContent?: string;\n /**\n * Title of confirm dialog when leaving\n */\n endCallConfirmDialogTitle?: string;\n /**\n * Content of confirm dialog when leaving\n */\n endCallConfirmDialogContent?: string;\n /**\n * Error message when the meeting identifier or passcode is invalid\n */\n invalidMeetingIdentifier: string;\n /**\n * Menu text shown in Participant Item contextual menu for pinning a remote participant's video tile\n *\n */\n pinParticipantMenuLabel: string;\n /**\n * Menu text shown in Participant Item contextual menu when pinning limit is reached\n *\n */\n pinParticipantLimitReachedMenuLabel: string;\n /**\n * Menu text shown in Participant Item contextual menu for unpinning a remote participant's video tile\n *\n */\n unpinParticipantMenuLabel: string;\n /**\n * Aria label for unpin participant menu item of remote participant\n */\n unpinParticipantMenuItemAriaLabel: string;\n /**\n * Aria label to announce when remote participant is pinned\n */\n pinParticipantMenuItemAriaLabel: string;\n /**\n * Error message when the meeting identifier or passcode is invalid\n */\n phoneCallMoreButtonLabel: string;\n /**\n * Label for mute all remote participants menu item in People Pane\n */\n muteAllMenuLabel: string;\n /**\n * Label for mute all prompt title\n */\n muteAllDialogTitle: string;\n /**\n * Label for mute all prompt content\n */\n muteAllDialogContent: string;\n /**\n * Label for mute all confirm button\n */\n muteAllConfirmButtonLabel: string;\n /**\n * Label for mute all cancel button\n */\n muteAllCancelButtonLabel: string;\n /* @conditional-compile-remove(breakout-rooms) */\n /**\n * Label for join breakout room button\n */\n joinBreakoutRoomButtonLabel: string;\n /* @conditional-compile-remove(breakout-rooms) */\n /**\n * Label for button to return from breakout room\n */\n returnFromBreakoutRoomButtonLabel: string;\n /* @conditional-compile-remove(breakout-rooms) */\n /**\n * Label for button to leave breakout room and meeting\n */\n leaveBreakoutRoomAndMeetingButtonLabel: string;\n /* @conditional-compile-remove(breakout-rooms) */\n /**\n * Notification title for when a user joins a breakout room\n */\n breakoutRoomJoinedNotificationTitle: string;\n /* @conditional-compile-remove(breakout-rooms) */\n /**\n * Title for banner to join the assigned breakout room. The banner is shown in mobile view instead of the\n * notification.\n */\n joinBreakoutRoomBannerTitle: string;\n /* @conditional-compile-remove(breakout-rooms) */\n /**\n * Label for button in banner to join breakout room. The banner is shown in mobile view instead of the notification.\n */\n joinBreakoutRoomBannerButtonLabel: string;\n /* @conditional-compile-remove(breakout-rooms) */\n /**\n * Title for banner to return from breakout room. The banner is shown in mobile view instead of the notification.\n */\n returnFromBreakoutRoomBannerTitle: string;\n /* @conditional-compile-remove(breakout-rooms) */\n /**\n * Label for button in banner to return from breakout room. The banner is shown in mobile view instead of the\n * notification.\n */\n returnFromBreakoutRoomBannerButtonLabel: string;\n /* @conditional-compile-remove(media-access) */\n /**\n * Label for menu item to forbid audio media access\n */\n forbidAudioMenuLabel: string;\n /* @conditional-compile-remove(media-access) */\n /**\n * Label for menu item to permit audio media access\n */\n permitAudioMenuLabel: string;\n /* @conditional-compile-remove(media-access) */\n /**\n * Dialog title to confirm forbid Teams meeting audio media access\n */\n forbidOthersAudioDialogTitle: string;\n /* @conditional-compile-remove(media-access) */\n /**\n * Dialog content to confirm forbid Teams meeting audio media access\n */\n forbidOthersAudioDialogContent: string;\n /* @conditional-compile-remove(media-access) */\n /**\n * Dialog button to confirm forbid Teams meeting audio media access\n */\n forbidOthersAudioConfirmButtonLabel: string;\n /* @conditional-compile-remove(media-access) */\n /**\n * Dialog cancel button for forbid Teams meeting audio media access\n */\n forbidOthersAudioCancelButtonLabel: string;\n /* @conditional-compile-remove(media-access) */\n /**\n * Dialog title to confirm permit Teams meeting audio media access\n */\n permitOthersAudioDialogTitle: string;\n /* @conditional-compile-remove(media-access) */\n /**\n * Dialog content to confirm permit Teams meeting audio media access\n */\n permitOthersAudioDialogContent: string;\n /* @conditional-compile-remove(media-access) */\n /**\n * Dialog button to confirm permit Teams meeting audio media access\n */\n permitOthersAudioConfirmButtonLabel: string;\n /* @conditional-compile-remove(media-access) */\n /**\n * Dialog cancel button for permit Teams meeting audio media access\n */\n permitOthersAudioCancelButtonLabel: string;\n /* @conditional-compile-remove(media-access) */\n /**\n * Label for menu item to forbid video media access\n */\n forbidOthersAudioMenuLabel: string;\n /* @conditional-compile-remove(media-access) */\n /** Label for menu item to permit video media access */\n permitOthersAudioMenuLabel: string;\n\n /* @conditional-compile-remove(media-access) */\n /** Label for menu item to forbid video media access */\n forbidVideoMenuLabel: string;\n /* @conditional-compile-remove(media-access) */\n /** Label for menu item to permit video media access */\n permitVideoMenuLabel: string;\n /* @conditional-compile-remove(media-access) */\n /** Dialog title to confirm forbid Teams meeting video media access */\n forbidOthersVideoDialogTitle: string;\n /* @conditional-compile-remove(media-access) */\n /** Dialog content to confirm forbid Teams meeting video media access */\n forbidOthersVideoDialogContent: string;\n /* @conditional-compile-remove(media-access) */\n /** Dialog button to confirm forbid Teams meeting video media access */\n forbidOthersVideoConfirmButtonLabel: string;\n /* @conditional-compile-remove(media-access) */\n /** Dialog cancel button for forbid Teams meeting video media access */\n forbidOthersVideoCancelButtonLabel: string;\n /* @conditional-compile-remove(media-access) */\n /** Dialog title to confirm permit Teams meeting video media access */\n permitOthersVideoDialogTitle: string;\n /* @conditional-compile-remove(media-access) */\n /** Dialog content to confirm permit Teams meeting video media access */\n permitOthersVideoDialogContent: string;\n /* @conditional-compile-remove(media-access) */\n /** Dialog button to confirm permit Teams meeting video media access */\n permitOthersVideoConfirmButtonLabel: string;\n /* @conditional-compile-remove(media-access) */\n /** Dialog cancel button for permit Teams meeting video media access */\n permitOthersVideoCancelButtonLabel: string;\n /* @conditional-compile-remove(media-access) */\n /** Label for menu item to forbid audio media access */\n forbidOthersVideoMenuLabel: string;\n /* @conditional-compile-remove(media-access) */\n /** Label for menu item to permit audio media access */\n permitOthersVideoMenuLabel: string;\n /* @conditional-compile-remove(rtt) */\n /** The title of the RealTimeText modal */\n realTimeTextModalTitle: string;\n /* @conditional-compile-remove(rtt) */\n /** The text of the RealTimeText modal */\n realTimeTextModalText: string;\n /* @conditional-compile-remove(rtt) */\n /** The label for the confirm button */\n realTimeTextConfirmButtonLabel: string;\n /* @conditional-compile-remove(rtt) */\n /** The label for the cancel button */\n realTimeTextCancelButtonLabel: string;\n /* @conditional-compile-remove(rtt) */\n /** The aria label for the modal */\n realTimeTextModalAriaLabel: string;\n /* @conditional-compile-remove(rtt) */\n /** The aria label for the close button */\n realTimeTextCloseModalButtonAriaLabel: string;\n}\n"]}
@@ -39,6 +39,8 @@ export const CallingCaptionsBanner = (props) => {
39
39
  /* @conditional-compile-remove(rtt) */
40
40
  realTimeTextInputBoxDefaultText: strings.realTimeTextInputBoxDefaultText,
41
41
  /* @conditional-compile-remove(rtt) */
42
+ realTimeTextInputErrorMessage: strings.realTimeTextInputErrorMessage,
43
+ /* @conditional-compile-remove(rtt) */
42
44
  realTimeTextBannerContent: strings.realTimeTextBannerContent,
43
45
  /* @conditional-compile-remove(rtt) */
44
46
  realTimeTextBannerTitle: strings.realTimeTextBannerTitle,
@@ -1 +1 @@
1
- {"version":3,"file":"CallingCaptionsBanner.js","sourceRoot":"","sources":["../../../../../../../react-composites/src/composites/common/CallingCaptionsBanner.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React from 'react';\nimport { useState, useEffect, useCallback } from 'react';\nimport { CaptionsBanner, CaptionsBannerStrings, CustomAvatarOptions } from '@internal/react-components';\nimport { _DrawerMenu, _DrawerMenuItemProps, _DrawerSurface } from '@internal/react-components';\nimport { mergeStyles, Stack } from '@fluentui/react';\nimport { CallingCaptionsSettingsModal } from './CallingCaptionsSettingsModal';\nimport { CaptionsBannerMoreButton } from './CaptionsBannerMoreButton';\nimport { useLocale } from '../localization';\nimport { AvatarPersona, AvatarPersonaDataCallback } from './AvatarPersona';\nimport { FocusableElement } from './types/FocusableElement';\nimport { usePropsFor } from '../CallComposite/hooks/usePropsFor';\n\nconst mobileViewBannerWidth = '90%';\n\n/** @private */\nexport const CallingCaptionsBanner = (props: {\n isMobile: boolean;\n useTeamsCaptions?: boolean;\n onFetchAvatarPersonaData?: AvatarPersonaDataCallback;\n captionsOptions?: {\n height: 'full' | 'default';\n };\n /** Element to return focus to when the Captions Banner is closed */\n returnFocusRef?: React.RefObject<FocusableElement>;\n}): JSX.Element => {\n const captionsBannerProps = usePropsFor(CaptionsBanner);\n const [isCaptionsSettingsOpen, setIsCaptionsSettingsOpen] = useState<boolean>(false);\n\n const onClickCaptionsSettings = (): void => {\n setIsCaptionsSettingsOpen(true);\n };\n\n const onDismissCaptionsSettings = (): void => {\n setIsCaptionsSettingsOpen(false);\n };\n\n const containerClassName = mergeStyles(\n props.captionsOptions?.height === 'full'\n ? mergeStyles({\n position: 'absolute',\n height: '100%',\n width: '100%'\n })\n : { position: 'relative' }\n );\n\n const floatingChildClassName = mergeStyles({\n position: 'absolute',\n right: 0,\n top: 0\n });\n\n const strings = useLocale().strings.call;\n\n const captionsBannerStrings: CaptionsBannerStrings = {\n captionsBannerSpinnerText: strings.captionsBannerSpinnerText,\n /* @conditional-compile-remove(rtt) */\n realTimeTextInputBoxDefaultText: strings.realTimeTextInputBoxDefaultText,\n /* @conditional-compile-remove(rtt) */\n realTimeTextBannerContent: strings.realTimeTextBannerContent,\n /* @conditional-compile-remove(rtt) */\n realTimeTextBannerTitle: strings.realTimeTextBannerTitle,\n /* @conditional-compile-remove(rtt) */\n realTimeTextBannerLinkLabel: strings.realTimeTextBannerLinkLabel\n };\n\n const onRenderAvatar = useCallback(\n (userId?: string, options?: CustomAvatarOptions) => {\n return <AvatarPersona userId={userId} {...options} dataProvider={props.onFetchAvatarPersonaData} />;\n },\n [props.onFetchAvatarPersonaData]\n );\n\n const { innerWidth: width } = window;\n\n const [windowWidth, setWindowWidth] = useState(width);\n\n useEffect(() => {\n function handleResize(): void {\n setWindowWidth(window.innerWidth);\n }\n\n window.addEventListener('resize', handleResize);\n return () => window.removeEventListener('resize', handleResize);\n }, []);\n\n const desktopViewBannerWidth = windowWidth > 620 ? '35rem' : '80%';\n\n return (\n <>\n {isCaptionsSettingsOpen && (\n <CallingCaptionsSettingsModal\n showCaptionsSettingsModal={isCaptionsSettingsOpen}\n onDismissCaptionsSettings={onDismissCaptionsSettings}\n changeCaptionLanguage={props.useTeamsCaptions}\n />\n )}\n {\n <div className={containerClassName} role=\"region\" aria-label={strings.liveCaptionsLabel}>\n <Stack horizontalAlign=\"center\">\n <Stack.Item style={{ width: props.isMobile ? mobileViewBannerWidth : desktopViewBannerWidth }}>\n <CaptionsBanner\n captionsOptions={props.captionsOptions}\n onRenderAvatar={onRenderAvatar}\n formFactor={props.isMobile ? 'compact' : 'default'}\n strings={captionsBannerStrings}\n {...captionsBannerProps}\n />\n </Stack.Item>\n </Stack>\n {!props.isMobile && captionsBannerProps.isCaptionsOn && (\n <div className={floatingChildClassName}>\n <CaptionsBannerMoreButton\n onCaptionsSettingsClick={onClickCaptionsSettings}\n returnFocusRef={props.returnFocusRef}\n />\n </div>\n )}\n </div>\n }\n </>\n );\n};\n"]}
1
+ {"version":3,"file":"CallingCaptionsBanner.js","sourceRoot":"","sources":["../../../../../../../react-composites/src/composites/common/CallingCaptionsBanner.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React from 'react';\nimport { useState, useEffect, useCallback } from 'react';\nimport { CaptionsBanner, CaptionsBannerStrings, CustomAvatarOptions } from '@internal/react-components';\nimport { _DrawerMenu, _DrawerMenuItemProps, _DrawerSurface } from '@internal/react-components';\nimport { mergeStyles, Stack } from '@fluentui/react';\nimport { CallingCaptionsSettingsModal } from './CallingCaptionsSettingsModal';\nimport { CaptionsBannerMoreButton } from './CaptionsBannerMoreButton';\nimport { useLocale } from '../localization';\nimport { AvatarPersona, AvatarPersonaDataCallback } from './AvatarPersona';\nimport { FocusableElement } from './types/FocusableElement';\nimport { usePropsFor } from '../CallComposite/hooks/usePropsFor';\n\nconst mobileViewBannerWidth = '90%';\n\n/** @private */\nexport const CallingCaptionsBanner = (props: {\n isMobile: boolean;\n useTeamsCaptions?: boolean;\n onFetchAvatarPersonaData?: AvatarPersonaDataCallback;\n captionsOptions?: {\n height: 'full' | 'default';\n };\n /** Element to return focus to when the Captions Banner is closed */\n returnFocusRef?: React.RefObject<FocusableElement>;\n}): JSX.Element => {\n const captionsBannerProps = usePropsFor(CaptionsBanner);\n const [isCaptionsSettingsOpen, setIsCaptionsSettingsOpen] = useState<boolean>(false);\n\n const onClickCaptionsSettings = (): void => {\n setIsCaptionsSettingsOpen(true);\n };\n\n const onDismissCaptionsSettings = (): void => {\n setIsCaptionsSettingsOpen(false);\n };\n\n const containerClassName = mergeStyles(\n props.captionsOptions?.height === 'full'\n ? mergeStyles({\n position: 'absolute',\n height: '100%',\n width: '100%'\n })\n : { position: 'relative' }\n );\n\n const floatingChildClassName = mergeStyles({\n position: 'absolute',\n right: 0,\n top: 0\n });\n\n const strings = useLocale().strings.call;\n\n const captionsBannerStrings: CaptionsBannerStrings = {\n captionsBannerSpinnerText: strings.captionsBannerSpinnerText,\n /* @conditional-compile-remove(rtt) */\n realTimeTextInputBoxDefaultText: strings.realTimeTextInputBoxDefaultText,\n /* @conditional-compile-remove(rtt) */\n realTimeTextInputErrorMessage: strings.realTimeTextInputErrorMessage,\n /* @conditional-compile-remove(rtt) */\n realTimeTextBannerContent: strings.realTimeTextBannerContent,\n /* @conditional-compile-remove(rtt) */\n realTimeTextBannerTitle: strings.realTimeTextBannerTitle,\n /* @conditional-compile-remove(rtt) */\n realTimeTextBannerLinkLabel: strings.realTimeTextBannerLinkLabel\n };\n\n const onRenderAvatar = useCallback(\n (userId?: string, options?: CustomAvatarOptions) => {\n return <AvatarPersona userId={userId} {...options} dataProvider={props.onFetchAvatarPersonaData} />;\n },\n [props.onFetchAvatarPersonaData]\n );\n\n const { innerWidth: width } = window;\n\n const [windowWidth, setWindowWidth] = useState(width);\n\n useEffect(() => {\n function handleResize(): void {\n setWindowWidth(window.innerWidth);\n }\n\n window.addEventListener('resize', handleResize);\n return () => window.removeEventListener('resize', handleResize);\n }, []);\n\n const desktopViewBannerWidth = windowWidth > 620 ? '35rem' : '80%';\n\n return (\n <>\n {isCaptionsSettingsOpen && (\n <CallingCaptionsSettingsModal\n showCaptionsSettingsModal={isCaptionsSettingsOpen}\n onDismissCaptionsSettings={onDismissCaptionsSettings}\n changeCaptionLanguage={props.useTeamsCaptions}\n />\n )}\n {\n <div className={containerClassName} role=\"region\" aria-label={strings.liveCaptionsLabel}>\n <Stack horizontalAlign=\"center\">\n <Stack.Item style={{ width: props.isMobile ? mobileViewBannerWidth : desktopViewBannerWidth }}>\n <CaptionsBanner\n captionsOptions={props.captionsOptions}\n onRenderAvatar={onRenderAvatar}\n formFactor={props.isMobile ? 'compact' : 'default'}\n strings={captionsBannerStrings}\n {...captionsBannerProps}\n />\n </Stack.Item>\n </Stack>\n {!props.isMobile && captionsBannerProps.isCaptionsOn && (\n <div className={floatingChildClassName}>\n <CaptionsBannerMoreButton\n onCaptionsSettingsClick={onClickCaptionsSettings}\n returnFocusRef={props.returnFocusRef}\n />\n </div>\n )}\n </div>\n }\n </>\n );\n};\n"]}