npm - @azure/communication-react - Versions diffs - 1.18.0-beta.1 → 1.18.1 - Mend

@azure/communication-react 1.18.0-beta.1 → 1.18.1

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 (643) hide show

package/dist/dist-esm/react-components/src/components/VideoTile.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"VideoTile.js","sourceRoot":"","sources":["../../../../../preprocess-dist/react-components/src/components/VideoTile.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { DirectionalHint, Icon, IconButton, IContextualMenuProps, IStyle, mergeStyles, Persona, Stack, Text } from '@fluentui/react';\nimport React, { useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react';\nimport { useIdentifiers } from '../identifiers';\nimport { ComponentLocale, useLocale } from '../localization';\nimport { useTheme } from '../theming';\nimport { BaseCustomStyles, CustomAvatarOptions, OnRenderAvatarCallback } from '../types';\nimport { CallingTheme } from '../theming';\nimport { RaisedHand } from '../types';\nimport { RaisedHandIcon } from './assets/RaisedHandIcon';\n/* @conditional-compile-remove(one-to-n-calling) /\n/ @conditional-compile-remove(PSTN-calls) /\nimport { ParticipantState } from '../types';\nimport { disabledVideoHint, displayNameStyle, iconContainerStyle, overlayContainerStyles, rootStyles, videoContainerStyles, tileInfoContainerStyle, participantStateStringStyles } from './styles/VideoTile.styles';\nimport { pinIconStyle } from './styles/VideoTile.styles';\nimport useLongPress from './utils/useLongPress';\nimport { moreButtonStyles } from './styles/VideoTile.styles';\nimport { raiseHandContainerStyles } from './styles/VideoTile.styles';\nimport { ReactionResources } from '../types/ReactionTypes';\n\n/\n Strings of {@link VideoTile} that can be overridden.\n * @public\n /\nexport interface VideoTileStrings {\n /* Aria label for announcing the remote video tile drawer menu /\n moreOptionsButtonAriaLabel: string;\n / @conditional-compile-remove(one-to-n-calling) /\n / @conditional-compile-remove(PSTN-calls) /\n participantStateRinging: string;\n / @conditional-compile-remove(one-to-n-calling) /\n / @conditional-compile-remove(PSTN-calls) /\n participantStateHold: string;\n}\n\n/\n Fluent styles for {@link VideoTile}.\n \n @public\n /\nexport interface VideoTileStylesProps extends BaseCustomStyles {\n /* Styles for video container. /\n videoContainer?: IStyle;\n /* Styles for container overlayed on the video container. /\n overlayContainer?: IStyle;\n /* Styles for displayName on the video container. /\n displayNameContainer?: IStyle;\n}\n\n/\n Props for {@link VideoTile}.\n \n @public\n /\nexport interface VideoTileProps {\n /* React Child components. Child Components will show as overlay component in the VideoTile. /\n children?: React.ReactNode;\n /\n Allows users to pass in an object contains custom CSS styles.\n * @Example\n * ```\n * <VideoTile styles={{ root: { background: 'blue' } }} />\n * ```\n /\n styles?: VideoTileStylesProps;\n /* user id for the VideoTile placeholder. /\n userId?: string;\n /* Component with the video stream. /\n renderElement?: JSX.Element \| null;\n /\n Overlay component responsible for rendering reaction\n /\n overlay?: JSX.Element \| null;\n /* Determines if the video is mirrored or not. /\n isMirrored?: boolean;\n /* Custom render Component function for no video is available. Render a Persona Icon if undefined. /\n onRenderPlaceholder?: OnRenderAvatarCallback;\n /\n Show label on the VideoTile\n * @defaultValue true\n /\n showLabel?: boolean;\n /\n Show label background on the VideoTile\n * @defaultValue false\n /\n alwaysShowLabelBackground?: boolean;\n /\n Whether to display a mute icon beside the user's display name.\n * @defaultValue true\n /\n showMuteIndicator?: boolean;\n /\n Whether the video is muted or not.\n /\n isMuted?: boolean;\n /\n If true, the video tile will show the pin icon.\n /\n isPinned?: boolean;\n /\n Display Name of the Participant to be shown in the label.\n * @remarks `displayName` is used to generate avatar initials if `initialsName` is not provided.\n /\n displayName?: string;\n /\n Name of the participant used to generate initials. For example, a name `John Doe` will display `JD` as initials.\n * @remarks `displayName` is used if this property is not specified.\n /\n initialsName?: string;\n /\n Minimum size of the persona avatar in px.\n * The persona avatar is the default placeholder shown when no video stream is available.\n * For more information see https://developer.microsoft.com/en-us/fluentui#/controls/web/persona\n * @defaultValue 32px\n /\n personaMinSize?: number;\n /\n Maximum size of the personal avatar in px.\n * The persona avatar is the default placeholder shown when no video stream is available.\n * For more information see https://developer.microsoft.com/en-us/fluentui#/controls/web/persona\n * @defaultValue 100px\n /\n personaMaxSize?: number;\n /* Optional property to set the aria label of the video tile if there is no available stream. /\n noVideoAvailableAriaLabel?: string;\n /* Whether the participant in the videoTile is speaking. Shows a speaking indicator (border). /\n isSpeaking?: boolean;\n\n /* Whether the participant is raised hand. Show a indicator (border) and icon with order /\n raisedHand?: RaisedHand;\n\n / @conditional-compile-remove(one-to-n-calling) /\n / @conditional-compile-remove(PSTN-calls) /\n /\n The call connection state of the participant.\n * For example, `Hold` means the participant is on hold.\n /\n participantState?: ParticipantState;\n /\n Strings to override in the component.\n /\n strings?: VideoTileStrings;\n /\n Display custom menu items in the VideoTile's contextual menu.\n * Uses Fluent UI ContextualMenu.\n * An ellipses icon will be displayed to open the contextual menu if this prop is defined.\n /\n contextualMenu?: IContextualMenuProps;\n /\n Callback triggered by video tile on touch and hold.\n /\n onLongTouch?: () => void;\n /\n If true, the video tile will show the spotlighted icon.\n /\n isSpotlighted?: boolean;\n /\n Reactions resources' url and metadata.\n /\n reactionResources?: ReactionResources;\n}\n\n// Coin max size is set to PersonaSize.size100\nconst DEFAULT_PERSONA_MAX_SIZE_PX = 100;\n// Coin min size is set PersonaSize.size32\nconst DEFAULT_PERSONA_MIN_SIZE_PX = 32;\nconst DefaultPlaceholder = (props: CustomAvatarOptions): JSX.Element => {\n const {\n text,\n noVideoAvailableAriaLabel,\n coinSize,\n hidePersonaDetails\n } = props;\n return <Stack className={mergeStyles({\n position: 'absolute',\n height: '100%',\n width: '100%'\n })}>\n <Stack styles={defaultPersonaStyles}>\n {coinSize && <Persona coinSize={coinSize} hidePersonaDetails={hidePersonaDetails} text={text ?? ''} initialsTextColor=\"white\" aria-label={noVideoAvailableAriaLabel ?? ''} showOverflowTooltip={false} />}\n </Stack>\n </Stack>;\n};\nconst defaultPersonaStyles = {\n root: {\n margin: 'auto',\n maxHeight: '100%'\n }\n};\nconst videoTileMoreMenuIconProps = {\n iconName: undefined,\n style: {\n display: 'none'\n }\n};\nconst videoTileMoreMenuProps = {\n directionalHint: DirectionalHint.topLeftEdge,\n isBeakVisible: false,\n styles: {\n container: {\n maxWidth: '8rem'\n }\n }\n};\nconst VideoTileMoreOptionsButton = (props: {\n contextualMenu?: IContextualMenuProps;\n canShowContextMenuButton: boolean;\n}): JSX.Element => {\n const locale = useLocale();\n const strings = {\n ...locale.strings.videoTile\n };\n const {\n contextualMenu,\n canShowContextMenuButton\n } = props;\n if (!contextualMenu) {\n return <></>;\n }\n const optionsIcon = canShowContextMenuButton ? 'VideoTileMoreOptions' : undefined;\n return <IconButton data-ui-id=\"video-tile-more-options-button\" ariaLabel={strings?.moreOptionsButtonAriaLabel} styles={moreButtonStyles} menuIconProps={videoTileMoreMenuIconProps} menuProps={{\n ...videoTileMoreMenuProps,\n ...contextualMenu\n }} iconProps={{\n iconName: optionsIcon\n }} />;\n};\n\n/\n A component to render the video stream for a single call participant.\n \n Use with {@link GridLayout} in a {@link VideoGallery}.\n \n @public\n /\nexport const VideoTile = (props: VideoTileProps): JSX.Element => {\n const {\n children,\n displayName,\n initialsName,\n isMirrored,\n isMuted,\n isSpotlighted,\n isPinned,\n onRenderPlaceholder,\n renderElement,\n overlay: reactionOverlay,\n showLabel = true,\n showMuteIndicator = true,\n styles,\n userId,\n noVideoAvailableAriaLabel,\n isSpeaking,\n raisedHand,\n personaMinSize = DEFAULT_PERSONA_MIN_SIZE_PX,\n personaMaxSize = DEFAULT_PERSONA_MAX_SIZE_PX,\n contextualMenu\n } = props;\n const [isHovered, setIsHovered] = useState<boolean>(false);\n const [isFocused, setIsFocused] = useState<boolean>(false);\n // need to set a default otherwise the resizeObserver will get stuck in an infinite loop.\n const [personaSize, setPersonaSize] = useState<number>(1);\n const videoTileRef = useRef<HTMLDivElement>(null);\n const locale = useLocale();\n const theme = useTheme();\n const callingPalette = ((theme as unknown) as CallingTheme).callingPalette;\n const isVideoRendered = !!renderElement;\n const observer = useRef(new ResizeObserver((entries): void => {\n const {\n width,\n height\n } = entries[0].contentRect;\n const personaCalcSize = Math.min(width, height) / 3;\n // we only want to set the persona size if it has changed\n if (personaCalcSize !== personaSize) {\n setPersonaSize(Math.max(Math.min(personaCalcSize, personaMaxSize), personaMinSize));\n }\n }));\n useLayoutEffect(() => {\n if (videoTileRef.current) {\n observer.current.observe(videoTileRef.current);\n }\n const currentObserver = observer.current;\n return () => currentObserver.disconnect();\n }, [videoTileRef]);\n\n // TODO: Remove after calling sdk fix the keybaord focus\n useEffect(() => {\n // PPTLive display name is undefined, return as it is not screen share\n if (displayName !== undefined) {\n return;\n }\n let observer: MutationObserver \| undefined;\n if (videoTileRef.current) {\n observer = new MutationObserver(mutationsList => {\n for (const mutation of mutationsList) {\n if (mutation.type === 'childList') {\n const iframe = document.querySelector('iframe');\n if (iframe) {\n if (!iframe.getAttribute('tabIndex')) {\n iframe.setAttribute('tabIndex', '-1');\n }\n }\n }\n }\n });\n observer.observe(videoTileRef.current, {\n childList: true,\n subtree: true\n });\n }\n return () => {\n observer?.disconnect();\n };\n }, [displayName, renderElement]);\n const useLongPressProps = useMemo(() => {\n return {\n onLongPress: () => {\n props.onLongTouch?.();\n },\n touchEventsOnly: true\n };\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [props.onLongTouch]);\n const longPressHandlers = useLongPress(useLongPressProps);\n const hoverHandlers = useMemo(() => {\n return {\n onMouseEnter: () => setIsHovered(true),\n onMouseLeave: () => setIsHovered(false),\n onFocus: () => setIsFocused(true),\n onBlur: () => setIsFocused(false)\n };\n }, []);\n const placeholderOptions = {\n userId,\n text: initialsName ?? displayName,\n noVideoAvailableAriaLabel,\n coinSize: personaSize,\n styles: defaultPersonaStyles,\n hidePersonaDetails: true\n };\n const videoHintWithBorderRadius = mergeStyles(disabledVideoHint, {\n borderRadius: theme.effects.roundedCorner4,\n backgroundColor: callingPalette.videoTileLabelBackgroundLight\n });\n const tileInfoStyle = useMemo(() => mergeStyles(isVideoRendered \|\| props.alwaysShowLabelBackground ? videoHintWithBorderRadius : disabledVideoHint, styles?.displayNameContainer), [isVideoRendered, videoHintWithBorderRadius, styles?.displayNameContainer, props.alwaysShowLabelBackground]);\n const ids = useIdentifiers();\n const canShowLabel = showLabel && (displayName \|\| showMuteIndicator && isMuted);\n const participantStateString = participantStateStringTrampoline(props, locale);\n const canShowContextMenuButton = isHovered \|\| isFocused;\n let raisedHandBackgroundColor = '';\n raisedHandBackgroundColor = callingPalette.raiseHandGold;\n return <Stack data-ui-id={ids.videoTile} className={mergeStyles(rootStyles, {\n background: theme.palette.neutralLighter,\n borderRadius: theme.effects.roundedCorner4\n }, (isSpeaking \|\| raisedHand) && {\n '&::after': {\n content: `''`,\n position: 'absolute',\n border: `0.25rem solid ${isSpeaking ? theme.palette.themePrimary : raisedHandBackgroundColor}`,\n borderRadius: theme.effects.roundedCorner4,\n width: '100%',\n height: '100%',\n pointerEvents: 'none'\n }\n }, styles?.root)} {...longPressHandlers}>\n <div ref={videoTileRef} style={{\n width: '100%',\n height: '100%'\n }} {...hoverHandlers} data-is-focusable={true}>\n {isVideoRendered ? <Stack className={mergeStyles(videoContainerStyles, isMirrored && {\n transform: 'scaleX(-1)'\n }, styles?.videoContainer)}>\n {renderElement}\n </Stack> : <Stack className={mergeStyles(videoContainerStyles, {\n opacity: participantStateString \|\| / @conditional-compile-remove(PSTN-calls) /props.participantState === 'Idle' ? 0.4 : 1\n })}>\n {onRenderPlaceholder ? onRenderPlaceholder(userId ?? '', placeholderOptions, DefaultPlaceholder) : <DefaultPlaceholder {...placeholderOptions} />}\n </Stack>}\n {reactionOverlay}\n {(canShowLabel \|\| participantStateString) && <Stack horizontal className={tileInfoContainerStyle} tokens={tileInfoContainerTokens}>\n <Stack horizontal className={tileInfoStyle}>\n {canShowLabel && <Text className={mergeStyles(displayNameStyle)} title={displayName} style={{\n color: participantStateString ? theme.palette.neutralSecondary : 'inherit'\n }} data-ui-id=\"video-tile-display-name\">\n {displayName}\n </Text>}\n {participantStateString && <Text className={mergeStyles(participantStateStringStyles(theme))}>\n {bracketedParticipantString(participantStateString, !!canShowLabel)}\n </Text>}\n {showMuteIndicator && isMuted && <Stack className={mergeStyles(iconContainerStyle)}>\n <Icon iconName=\"VideoTileMicOff\" />\n </Stack>}\n {isSpotlighted && <Stack className={mergeStyles(iconContainerStyle)}>\n <Icon iconName=\"VideoTileSpotlighted\" />\n </Stack>}\n {isPinned && <Stack className={mergeStyles(iconContainerStyle)}>\n <Icon iconName=\"VideoTilePinned\" className={mergeStyles(pinIconStyle)} />\n </Stack>}\n <VideoTileMoreOptionsButton contextualMenu={contextualMenu} canShowContextMenuButton={canShowContextMenuButton} />\n </Stack>\n </Stack>}\n\n {children && <Stack className={mergeStyles(overlayContainerStyles, styles?.overlayContainer)}>{children}</Stack>}\n {raisedHand && <Stack horizontal={true} tokens={{\n childrenGap: '0.2rem'\n }} className={raiseHandContainerStyles(theme, !canShowLabel)}>\n <Stack.Item>\n <Text>{raisedHand.raisedHandOrderPosition}</Text>\n </Stack.Item>\n <Stack.Item>\n <RaisedHandIcon />\n </Stack.Item>\n </Stack>}\n </div>\n </Stack>;\n};\nconst participantStateStringTrampoline = (props: VideoTileProps, locale: ComponentLocale): string \| undefined => {\n / @conditional-compile-remove(one-to-n-calling) /\n / @conditional-compile-remove(PSTN-calls) /\n const strings = {\n ...locale.strings.videoTile,\n ...props.strings\n };\n / @conditional-compile-remove(one-to-n-calling) /\n / @conditional-compile-remove(PSTN-calls) */\n return props.participantState === 'EarlyMedia' \|\| props.participantState === 'Ringing' ? strings?.participantStateRinging : props.participantState === 'Hold' ? strings?.participantStateHold : undefined;\n return undefined;\n};\nconst tileInfoContainerTokens = {\n // A horizontal Stack sets the left margin to 0 for all it's children.\n // We need to allow the children to set their own margins\n childrenGap: 'none'\n};\nconst bracketedParticipantString = (participantString: string, withBrackets: boolean): string => {\n return withBrackets ? `(${participantString})` : participantString;\n};"]}
1	+ {"version":3,"file":"VideoTile.js","sourceRoot":"","sources":["../../../../../preprocess-dist/react-components/src/components/VideoTile.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { DirectionalHint, Icon, IconButton, IContextualMenuProps, IStyle, mergeStyles, Persona, Stack, Text } from '@fluentui/react';\nimport React, { useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react';\nimport { useIdentifiers } from '../identifiers';\nimport { ComponentLocale, useLocale } from '../localization';\nimport { useTheme } from '../theming';\nimport { BaseCustomStyles, CustomAvatarOptions, OnRenderAvatarCallback } from '../types';\nimport { CallingTheme } from '../theming';\nimport { RaisedHand } from '../types';\nimport { RaisedHandIcon } from './assets/RaisedHandIcon';\nimport { disabledVideoHint, displayNameStyle, iconContainerStyle, overlayContainerStyles, rootStyles, videoContainerStyles, tileInfoContainerStyle, participantStateStringStyles } from './styles/VideoTile.styles';\nimport { pinIconStyle } from './styles/VideoTile.styles';\nimport useLongPress from './utils/useLongPress';\nimport { moreButtonStyles } from './styles/VideoTile.styles';\nimport { raiseHandContainerStyles } from './styles/VideoTile.styles';\nimport { ReactionResources } from '../types/ReactionTypes';\n\n/*\n Strings of {@link VideoTile} that can be overridden.\n * @public\n /\nexport interface VideoTileStrings {\n /* Aria label for announcing the remote video tile drawer menu /\n moreOptionsButtonAriaLabel: string;\n}\n\n/\n Fluent styles for {@link VideoTile}.\n \n @public\n /\nexport interface VideoTileStylesProps extends BaseCustomStyles {\n /* Styles for video container. /\n videoContainer?: IStyle;\n /* Styles for container overlayed on the video container. /\n overlayContainer?: IStyle;\n /* Styles for displayName on the video container. /\n displayNameContainer?: IStyle;\n}\n\n/\n Props for {@link VideoTile}.\n \n @public\n /\nexport interface VideoTileProps {\n /* React Child components. Child Components will show as overlay component in the VideoTile. /\n children?: React.ReactNode;\n /\n Allows users to pass in an object contains custom CSS styles.\n * @Example\n * ```\n * <VideoTile styles={{ root: { background: 'blue' } }} />\n * ```\n /\n styles?: VideoTileStylesProps;\n /* user id for the VideoTile placeholder. /\n userId?: string;\n /* Component with the video stream. /\n renderElement?: JSX.Element \| null;\n /\n Overlay component responsible for rendering reaction\n /\n overlay?: JSX.Element \| null;\n /* Determines if the video is mirrored or not. /\n isMirrored?: boolean;\n /* Custom render Component function for no video is available. Render a Persona Icon if undefined. /\n onRenderPlaceholder?: OnRenderAvatarCallback;\n /\n Show label on the VideoTile\n * @defaultValue true\n /\n showLabel?: boolean;\n /\n Show label background on the VideoTile\n * @defaultValue false\n /\n alwaysShowLabelBackground?: boolean;\n /\n Whether to display a mute icon beside the user's display name.\n * @defaultValue true\n /\n showMuteIndicator?: boolean;\n /\n Whether the video is muted or not.\n /\n isMuted?: boolean;\n /\n If true, the video tile will show the pin icon.\n /\n isPinned?: boolean;\n /\n Display Name of the Participant to be shown in the label.\n * @remarks `displayName` is used to generate avatar initials if `initialsName` is not provided.\n /\n displayName?: string;\n /\n Name of the participant used to generate initials. For example, a name `John Doe` will display `JD` as initials.\n * @remarks `displayName` is used if this property is not specified.\n /\n initialsName?: string;\n /\n Minimum size of the persona avatar in px.\n * The persona avatar is the default placeholder shown when no video stream is available.\n * For more information see https://developer.microsoft.com/en-us/fluentui#/controls/web/persona\n * @defaultValue 32px\n /\n personaMinSize?: number;\n /\n Maximum size of the personal avatar in px.\n * The persona avatar is the default placeholder shown when no video stream is available.\n * For more information see https://developer.microsoft.com/en-us/fluentui#/controls/web/persona\n * @defaultValue 100px\n /\n personaMaxSize?: number;\n /* Optional property to set the aria label of the video tile if there is no available stream. /\n noVideoAvailableAriaLabel?: string;\n /* Whether the participant in the videoTile is speaking. Shows a speaking indicator (border). /\n isSpeaking?: boolean;\n\n /* Whether the participant is raised hand. Show a indicator (border) and icon with order /\n raisedHand?: RaisedHand;\n /\n Strings to override in the component.\n /\n strings?: VideoTileStrings;\n /\n Display custom menu items in the VideoTile's contextual menu.\n * Uses Fluent UI ContextualMenu.\n * An ellipses icon will be displayed to open the contextual menu if this prop is defined.\n /\n contextualMenu?: IContextualMenuProps;\n /\n Callback triggered by video tile on touch and hold.\n /\n onLongTouch?: () => void;\n /\n If true, the video tile will show the spotlighted icon.\n /\n isSpotlighted?: boolean;\n /\n Reactions resources' url and metadata.\n /\n reactionResources?: ReactionResources;\n}\n\n// Coin max size is set to PersonaSize.size100\nconst DEFAULT_PERSONA_MAX_SIZE_PX = 100;\n// Coin min size is set PersonaSize.size32\nconst DEFAULT_PERSONA_MIN_SIZE_PX = 32;\nconst DefaultPlaceholder = (props: CustomAvatarOptions): JSX.Element => {\n const {\n text,\n noVideoAvailableAriaLabel,\n coinSize,\n hidePersonaDetails\n } = props;\n return <Stack className={mergeStyles({\n position: 'absolute',\n height: '100%',\n width: '100%'\n })}>\n <Stack styles={defaultPersonaStyles}>\n {coinSize && <Persona coinSize={coinSize} hidePersonaDetails={hidePersonaDetails} text={text ?? ''} initialsTextColor=\"white\" aria-label={noVideoAvailableAriaLabel ?? ''} showOverflowTooltip={false} />}\n </Stack>\n </Stack>;\n};\nconst defaultPersonaStyles = {\n root: {\n margin: 'auto',\n maxHeight: '100%'\n }\n};\nconst videoTileMoreMenuIconProps = {\n iconName: undefined,\n style: {\n display: 'none'\n }\n};\nconst videoTileMoreMenuProps = {\n directionalHint: DirectionalHint.topLeftEdge,\n isBeakVisible: false,\n styles: {\n container: {\n maxWidth: '8rem'\n }\n }\n};\nconst VideoTileMoreOptionsButton = (props: {\n contextualMenu?: IContextualMenuProps;\n canShowContextMenuButton: boolean;\n}): JSX.Element => {\n const locale = useLocale();\n const strings = {\n ...locale.strings.videoTile\n };\n const {\n contextualMenu,\n canShowContextMenuButton\n } = props;\n if (!contextualMenu) {\n return <></>;\n }\n const optionsIcon = canShowContextMenuButton ? 'VideoTileMoreOptions' : undefined;\n return <IconButton data-ui-id=\"video-tile-more-options-button\" ariaLabel={strings?.moreOptionsButtonAriaLabel} styles={moreButtonStyles} menuIconProps={videoTileMoreMenuIconProps} menuProps={{\n ...videoTileMoreMenuProps,\n ...contextualMenu\n }} iconProps={{\n iconName: optionsIcon\n }} />;\n};\n\n/\n A component to render the video stream for a single call participant.\n \n Use with {@link GridLayout} in a {@link VideoGallery}.\n \n @public\n */\nexport const VideoTile = (props: VideoTileProps): JSX.Element => {\n const {\n children,\n displayName,\n initialsName,\n isMirrored,\n isMuted,\n isSpotlighted,\n isPinned,\n onRenderPlaceholder,\n renderElement,\n overlay: reactionOverlay,\n showLabel = true,\n showMuteIndicator = true,\n styles,\n userId,\n noVideoAvailableAriaLabel,\n isSpeaking,\n raisedHand,\n personaMinSize = DEFAULT_PERSONA_MIN_SIZE_PX,\n personaMaxSize = DEFAULT_PERSONA_MAX_SIZE_PX,\n contextualMenu\n } = props;\n const [isHovered, setIsHovered] = useState<boolean>(false);\n const [isFocused, setIsFocused] = useState<boolean>(false);\n // need to set a default otherwise the resizeObserver will get stuck in an infinite loop.\n const [personaSize, setPersonaSize] = useState<number>(1);\n const videoTileRef = useRef<HTMLDivElement>(null);\n const locale = useLocale();\n const theme = useTheme();\n const callingPalette = ((theme as unknown) as CallingTheme).callingPalette;\n const isVideoRendered = !!renderElement;\n const observer = useRef(new ResizeObserver((entries): void => {\n const {\n width,\n height\n } = entries[0].contentRect;\n const personaCalcSize = Math.min(width, height) / 3;\n // we only want to set the persona size if it has changed\n if (personaCalcSize !== personaSize) {\n setPersonaSize(Math.max(Math.min(personaCalcSize, personaMaxSize), personaMinSize));\n }\n }));\n useLayoutEffect(() => {\n if (videoTileRef.current) {\n observer.current.observe(videoTileRef.current);\n }\n const currentObserver = observer.current;\n return () => currentObserver.disconnect();\n }, [videoTileRef]);\n\n // TODO: Remove after calling sdk fix the keybaord focus\n useEffect(() => {\n // PPTLive display name is undefined, return as it is not screen share\n if (displayName !== undefined) {\n return;\n }\n let observer: MutationObserver \| undefined;\n if (videoTileRef.current) {\n observer = new MutationObserver(mutationsList => {\n for (const mutation of mutationsList) {\n if (mutation.type === 'childList') {\n const iframe = document.querySelector('iframe');\n if (iframe) {\n if (!iframe.getAttribute('tabIndex')) {\n iframe.setAttribute('tabIndex', '-1');\n }\n }\n }\n }\n });\n observer.observe(videoTileRef.current, {\n childList: true,\n subtree: true\n });\n }\n return () => {\n observer?.disconnect();\n };\n }, [displayName, renderElement]);\n const useLongPressProps = useMemo(() => {\n return {\n onLongPress: () => {\n props.onLongTouch?.();\n },\n touchEventsOnly: true\n };\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [props.onLongTouch]);\n const longPressHandlers = useLongPress(useLongPressProps);\n const hoverHandlers = useMemo(() => {\n return {\n onMouseEnter: () => setIsHovered(true),\n onMouseLeave: () => setIsHovered(false),\n onFocus: () => setIsFocused(true),\n onBlur: () => setIsFocused(false)\n };\n }, []);\n const placeholderOptions = {\n userId,\n text: initialsName ?? displayName,\n noVideoAvailableAriaLabel,\n coinSize: personaSize,\n styles: defaultPersonaStyles,\n hidePersonaDetails: true\n };\n const videoHintWithBorderRadius = mergeStyles(disabledVideoHint, {\n borderRadius: theme.effects.roundedCorner4,\n backgroundColor: callingPalette.videoTileLabelBackgroundLight\n });\n const tileInfoStyle = useMemo(() => mergeStyles(isVideoRendered \|\| props.alwaysShowLabelBackground ? videoHintWithBorderRadius : disabledVideoHint, styles?.displayNameContainer), [isVideoRendered, videoHintWithBorderRadius, styles?.displayNameContainer, props.alwaysShowLabelBackground]);\n const ids = useIdentifiers();\n const canShowLabel = showLabel && (displayName \|\| showMuteIndicator && isMuted);\n const participantStateString = participantStateStringTrampoline(props, locale);\n const canShowContextMenuButton = isHovered \|\| isFocused;\n let raisedHandBackgroundColor = '';\n raisedHandBackgroundColor = callingPalette.raiseHandGold;\n return <Stack data-ui-id={ids.videoTile} className={mergeStyles(rootStyles, {\n background: theme.palette.neutralLighter,\n borderRadius: theme.effects.roundedCorner4\n }, (isSpeaking \|\| raisedHand) && {\n '&::after': {\n content: `''`,\n position: 'absolute',\n border: `0.25rem solid ${isSpeaking ? theme.palette.themePrimary : raisedHandBackgroundColor}`,\n borderRadius: theme.effects.roundedCorner4,\n width: '100%',\n height: '100%',\n pointerEvents: 'none'\n }\n }, styles?.root)} {...longPressHandlers}>\n <div ref={videoTileRef} style={{\n width: '100%',\n height: '100%'\n }} {...hoverHandlers} data-is-focusable={true}>\n {isVideoRendered ? <Stack className={mergeStyles(videoContainerStyles, isMirrored && {\n transform: 'scaleX(-1)'\n }, styles?.videoContainer)}>\n {renderElement}\n </Stack> : <Stack className={mergeStyles(videoContainerStyles, {\n opacity: participantStateString ? 0.4 : 1\n })}>\n {onRenderPlaceholder ? onRenderPlaceholder(userId ?? '', placeholderOptions, DefaultPlaceholder) : <DefaultPlaceholder {...placeholderOptions} />}\n </Stack>}\n {reactionOverlay}\n {(canShowLabel \|\| participantStateString) && <Stack horizontal className={tileInfoContainerStyle} tokens={tileInfoContainerTokens}>\n <Stack horizontal className={tileInfoStyle}>\n {canShowLabel && <Text className={mergeStyles(displayNameStyle)} title={displayName} style={{\n color: participantStateString ? theme.palette.neutralSecondary : 'inherit'\n }} data-ui-id=\"video-tile-display-name\">\n {displayName}\n </Text>}\n {participantStateString && <Text className={mergeStyles(participantStateStringStyles(theme))}>\n {bracketedParticipantString(participantStateString, !!canShowLabel)}\n </Text>}\n {showMuteIndicator && isMuted && <Stack className={mergeStyles(iconContainerStyle)}>\n <Icon iconName=\"VideoTileMicOff\" />\n </Stack>}\n {isSpotlighted && <Stack className={mergeStyles(iconContainerStyle)}>\n <Icon iconName=\"VideoTileSpotlighted\" />\n </Stack>}\n {isPinned && <Stack className={mergeStyles(iconContainerStyle)}>\n <Icon iconName=\"VideoTilePinned\" className={mergeStyles(pinIconStyle)} />\n </Stack>}\n <VideoTileMoreOptionsButton contextualMenu={contextualMenu} canShowContextMenuButton={canShowContextMenuButton} />\n </Stack>\n </Stack>}\n\n {children && <Stack className={mergeStyles(overlayContainerStyles, styles?.overlayContainer)}>{children}</Stack>}\n {raisedHand && <Stack horizontal={true} tokens={{\n childrenGap: '0.2rem'\n }} className={raiseHandContainerStyles(theme, !canShowLabel)}>\n <Stack.Item>\n <Text>{raisedHand.raisedHandOrderPosition}</Text>\n </Stack.Item>\n <Stack.Item>\n <RaisedHandIcon />\n </Stack.Item>\n </Stack>}\n </div>\n </Stack>;\n};\nconst participantStateStringTrampoline = (props: VideoTileProps, locale: ComponentLocale): string \| undefined => {\n return undefined;\n};\nconst tileInfoContainerTokens = {\n // A horizontal Stack sets the left margin to 0 for all it's children.\n // We need to allow the children to set their own margins\n childrenGap: 'none'\n};\nconst bracketedParticipantString = (participantString: string, withBrackets: boolean): string => {\n return withBrackets ? `(${participantString})` : participantString;\n};"]}

package/dist/dist-esm/react-components/src/components/index.d.ts CHANGED Viewed

@@ -5,22 +5,15 @@ export type { ActiveErrorMessage, ErrorBarProps, ErrorBarStrings, ErrorType } fr
 export { GridLayout } from './GridLayout';
 export type { GridLayoutProps, GridLayoutStyles } from './GridLayout';
 export { SendBox } from './SendBox';
-export { _MentionPopover } from './MentionPopover';
 export { ImageOverlay } from './ImageOverlay';
 export type { ImageOverlayStrings } from './ImageOverlay';
 export type { SendBoxProps, SendBoxStrings, SendBoxStylesProps } from './SendBox';
-export { RichTextSendBox } from './RichTextEditor/RichTextSendBox';
-export { ChatMessageComponentAsRichTextEditBox } from './ChatMessage/MyMessageComponents/ChatMessageComponentAsRichTextEditBox';
-export type { ChatMessageComponentAsRichTextEditBoxProps } from './ChatMessage/MyMessageComponents/ChatMessageComponentAsRichTextEditBox';
-export type { RichTextSendBoxProps, RichTextSendBoxStrings, RichTextStrings } from './RichTextEditor/RichTextSendBox';
-export type { _MentionPopoverProps, MentionLookupOptions, MentionDisplayOptions, MentionOptions, Mention, MentionPopoverStrings } from './MentionPopover';
 export type { ImageOverlayProps } from './ImageOverlay';
 export type { InlineImageOptions, InlineImage } from './ChatMessage/ChatMessageContent';
 export { MessageStatusIndicator } from './MessageStatusIndicator';
 export type { MessageStatusIndicatorProps, MessageStatusIndicatorStrings } from './MessageStatusIndicator';
 export { MessageThread } from './MessageThread';
 export type { MessageProps, MessageThreadProps, MessageThreadStrings, MessageThreadStyles, JumpToNewMessageButtonProps, MessageRenderer, UpdateMessageCallback, CancelEditCallback } from './MessageThread';
-export type { RichTextEditorOptions } from './MessageThread';
 export { StreamMedia } from './StreamMedia';
 export type { StreamMediaProps } from './StreamMedia';
 export type { LoadingState } from './StreamMedia';
@@ -28,7 +21,6 @@ export { ParticipantItem } from './ParticipantItem';
 export type { ParticipantItemProps, ParticipantItemStrings, ParticipantItemStyles } from './ParticipantItem';
 export { ParticipantList } from './ParticipantList';
 export type { ParticipantListItemStyles, ParticipantListProps, ParticipantListStyles, ParticipantMenuItemsCallback } from './ParticipantList';
-export type { ParticipantListStrings } from './ParticipantList';
 export { Announcer } from './Announcer';
 export type { AnnouncerProps } from './Announcer';
 export { VideoGallery } from './VideoGallery';
@@ -50,13 +42,6 @@ export { MicrophoneButton } from './MicrophoneButton';
 export type { MicrophoneButtonStyles, MicrophoneButtonContextualMenuStyles, MicrophoneButtonProps, MicrophoneButtonStrings } from './MicrophoneButton';
 export { DevicesButton, generateDefaultDeviceMenuProps as _generateDefaultDeviceMenuProps } from './DevicesButton';
 export type { OptionsDevice, DevicesButtonProps, DevicesButtonStrings, DevicesButtonStyles, DevicesButtonContextualMenuStyles, DeviceMenuProps as _DeviceMenuProps, DeviceMenuStrings as _DeviceMenuStrings, DeviceMenuStyles as _DeviceMenuStyles } from './DevicesButton';
-export { CameraAndMicrophoneSitePermissions, MicrophoneSitePermissions, CameraSitePermissions } from './DevicePermissions/SitePermissions';
-export type { SitePermissionsStrings, SitePermissionsStyles } from './DevicePermissions/SitePermissionsScaffolding';
-export type { CameraAndMicrophoneSitePermissionsStrings, CameraAndMicrophoneSitePermissionsProps, CameraSitePermissionsStrings, CameraSitePermissionsProps, CommonSitePermissionsProps, MicrophoneSitePermissionsStrings, MicrophoneSitePermissionsProps } from './DevicePermissions/SitePermissions';
-export { BrowserPermissionDenied } from './DevicePermissions/BrowserPermissionDenied';
-export type { BrowserPermissionDeniedStrings, BrowserPermissionDeniedStyles, BrowserPermissionDeniedProps } from './DevicePermissions/BrowserPermissionDenied';
-export { BrowserPermissionDeniedIOS } from './DevicePermissions/BrowserPermissionDeniedIOS';
-export type { BrowserPermissionDeniedIOSStrings, BrowserPermissionDeniedIOSProps } from './DevicePermissions/BrowserPermissionDeniedIOS';
 export { ParticipantsButton } from './ParticipantsButton';
 export type { ParticipantsButtonContextualMenuStyles, ParticipantsButtonProps, ParticipantsButtonStrings, ParticipantsButtonStyles } from './ParticipantsButton';
 export { ScreenShareButton } from './ScreenShareButton';
@@ -71,14 +56,11 @@ export { _PictureInPictureInPicture } from './PictureInPictureInPicture/PictureI
 export type { _PictureInPictureInPictureProps, _PictureInPictureInPictureStrings } from './PictureInPictureInPicture/PictureInPictureInPicture';
 export type { _PictureInPictureInPictureTileProps, _TileOrientation } from './PictureInPictureInPicture/PictureInPictureInPictureTile';
 export * from './Drawer';
-export type { SendBoxErrorBarError } from './SendBoxErrorBar';
 export * from './Attachment/AttachmentCard';
 export * from './Attachment/AttachmentCardGroup';
 export * from './ModalClone/ModalClone';
 export * from './Attachment/AttachmentDownloadCards';
 export type { _AttachmentUploadCardsStrings } from './Attachment/AttachmentUploadCards';
-export type { AttachmentOptions, AttachmentUploadOptions, AttachmentActionHandler, AttachmentSelectionHandler, AttachmentMetadataWrapper, AttachmentRemovalHandler, AttachmentUploadTask } from '../types/Attachment';
-export type { AttachmentMenuAction, AttachmentDownloadOptions } from '../types/Attachment';
 export { _useContainerHeight, _useContainerWidth } from './utils/responsive';
 export { _ComplianceBanner } from './ComplianceBanner';
 export type { _ComplianceBannerProps, _ComplianceBannerStrings } from './ComplianceBanner';
@@ -90,8 +72,6 @@ export type { _StarSurveyProps, _StarSurveyStrings } from './Survey/StarSurvey/S
 export * from './Survey/SurveyTypes';
 export { _TagsSurvey } from './Survey/TagsSurvey/TagsSurvey';
 export type { _TagsSurveyProps, _TagsSurveyStrings, _IssueCategory, _SurveyTag } from './Survey/TagsSurvey/TagsSurvey';
-export { HoldButton } from './HoldButton';
-export type { HoldButtonProps, HoldButtonStrings } from './HoldButton';
 export { _LocalVideoTile } from './LocalVideoTile';
 export { _RemoteVideoTile } from './RemoteVideoTile';
 export { _HighContrastAwareIcon } from './HighContrastAwareIcon';
@@ -116,5 +96,9 @@ export * from './CaptionsBanner';
 export * from './Caption';
 export * from './StartCaptionsButton';
 export * from './CaptionsSettingsModal';
+export * from './MeetingConferencePhoneInfo';
+export { _formatPhoneNumber } from './utils/formatPhoneNumber';
 export { _ErrorBoundary } from './ErrorBoundary';
+export * from './Notification';
+export * from './NotificationStack';
 //# sourceMappingURL=index.d.ts.map

package/dist/dist-esm/react-components/src/components/index.js CHANGED Viewed

@@ -4,14 +4,7 @@ export { TypingIndicator } from './TypingIndicator';
 export { ErrorBar } from './ErrorBar';
 export { GridLayout } from './GridLayout';
 export { SendBox } from './SendBox';
-/* @conditional-compile-remove(mention) */
-export { _MentionPopover } from './MentionPopover';
 export { ImageOverlay } from './ImageOverlay';
-/* @conditional-compile-remove(rich-text-editor) */
-export { RichTextSendBox } from './RichTextEditor/RichTextSendBox';
-// TODO: This component is exported only for testing purposes. Remove this when this component is added to composites
-/* @conditional-compile-remove(rich-text-editor) */
-export { ChatMessageComponentAsRichTextEditBox } from './ChatMessage/MyMessageComponents/ChatMessageComponentAsRichTextEditBox';
 export { MessageStatusIndicator } from './MessageStatusIndicator';
 export { MessageThread } from './MessageThread';
 export { StreamMedia } from './StreamMedia';
@@ -26,12 +19,6 @@ export { ControlBarButton } from './ControlBarButton';
 export { EndCallButton } from './EndCallButton';
 export { MicrophoneButton } from './MicrophoneButton';
 export { DevicesButton, generateDefaultDeviceMenuProps as _generateDefaultDeviceMenuProps } from './DevicesButton';
-/* @conditional-compile-remove(call-readiness) */
-export { CameraAndMicrophoneSitePermissions, MicrophoneSitePermissions, CameraSitePermissions } from './DevicePermissions/SitePermissions';
-/* @conditional-compile-remove(call-readiness) */
-export { BrowserPermissionDenied } from './DevicePermissions/BrowserPermissionDenied';
-/* @conditional-compile-remove(call-readiness) */
-export { BrowserPermissionDeniedIOS } from './DevicePermissions/BrowserPermissionDeniedIOS';
 export { ParticipantsButton } from './ParticipantsButton';
 export { ScreenShareButton } from './ScreenShareButton';
 export { RaiseHandButton } from './RaiseHandButton';
@@ -49,8 +36,6 @@ export { Dialpad } from './Dialpad/Dialpad';
 export { _StarSurvey } from './Survey/StarSurvey/StarSurvey';
 export * from './Survey/SurveyTypes';
 export { _TagsSurvey } from './Survey/TagsSurvey/TagsSurvey';
-/* @conditional-compile-remove(PSTN-calls) */
-export { HoldButton } from './HoldButton';
 export { _LocalVideoTile } from './LocalVideoTile';
 export { _RemoteVideoTile } from './RemoteVideoTile';
 export { _HighContrastAwareIcon } from './HighContrastAwareIcon';
@@ -66,5 +51,13 @@ export * from './CaptionsBanner';
 export * from './Caption';
 export * from './StartCaptionsButton';
 export * from './CaptionsSettingsModal';
+/* @conditional-compile-remove(teams-meeting-conference) */
+export * from './MeetingConferencePhoneInfo';
+/* @conditional-compile-remove(teams-meeting-conference) */
+export { _formatPhoneNumber } from './utils/formatPhoneNumber';
 export { _ErrorBoundary } from './ErrorBoundary';
+/* @conditional-compile-remove(notifications) */
+export * from './Notification';
+/* @conditional-compile-remove(notifications) */
+export * from './NotificationStack';
 //# sourceMappingURL=index.js.map

package/dist/dist-esm/react-components/src/components/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../preprocess-dist/react-components/src/components/index.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nexport { TypingIndicator } from './TypingIndicator';\nexport type { TypingIndicatorProps, TypingIndicatorStrings, TypingIndicatorStylesProps } from './TypingIndicator';\nexport { ErrorBar } from './ErrorBar';\nexport type { ActiveErrorMessage, ErrorBarProps, ErrorBarStrings, ErrorType } from './ErrorBar';\nexport { GridLayout } from './GridLayout';\nexport type { GridLayoutProps, GridLayoutStyles } from './GridLayout';\nexport { SendBox } from './SendBox';\n/* @conditional-compile-remove(mention) /\nexport { _MentionPopover } from './MentionPopover';\nexport { ImageOverlay } from './ImageOverlay';\nexport type { ImageOverlayStrings } from './ImageOverlay';\nexport type { SendBoxProps, SendBoxStrings, SendBoxStylesProps } from './SendBox';\n\n/ @conditional-compile-remove(rich-text-editor) /\nexport { RichTextSendBox } from './RichTextEditor/RichTextSendBox';\n// TODO: This component is exported only for testing purposes. Remove this when this component is added to composites\n/ @conditional-compile-remove(rich-text-editor) /\nexport { ChatMessageComponentAsRichTextEditBox } from './ChatMessage/MyMessageComponents/ChatMessageComponentAsRichTextEditBox';\n// TODO: This component is exported only for testing purposes. Remove this when this component is added to composites\n/ @conditional-compile-remove(rich-text-editor) /\nexport type { ChatMessageComponentAsRichTextEditBoxProps } from './ChatMessage/MyMessageComponents/ChatMessageComponentAsRichTextEditBox';\n/ @conditional-compile-remove(rich-text-editor) /\nexport type { RichTextSendBoxProps, RichTextSendBoxStrings, RichTextStrings } from './RichTextEditor/RichTextSendBox';\n\n/ @conditional-compile-remove(mention) /\nexport type { _MentionPopoverProps, MentionLookupOptions, MentionDisplayOptions, MentionOptions, Mention, MentionPopoverStrings } from './MentionPopover';\nexport type { ImageOverlayProps } from './ImageOverlay';\nexport type { InlineImageOptions, InlineImage } from './ChatMessage/ChatMessageContent';\nexport { MessageStatusIndicator } from './MessageStatusIndicator';\nexport type { MessageStatusIndicatorProps, MessageStatusIndicatorStrings } from './MessageStatusIndicator';\nexport { MessageThread } from './MessageThread';\nexport type { MessageProps, MessageThreadProps, MessageThreadStrings, MessageThreadStyles, JumpToNewMessageButtonProps, MessageRenderer, UpdateMessageCallback, CancelEditCallback } from './MessageThread';\n\n/ @conditional-compile-remove(rich-text-editor) /\nexport type { RichTextEditorOptions } from './MessageThread';\nexport { StreamMedia } from './StreamMedia';\nexport type { StreamMediaProps } from './StreamMedia';\nexport type { LoadingState } from './StreamMedia';\nexport { ParticipantItem } from './ParticipantItem';\nexport type { ParticipantItemProps, ParticipantItemStrings, ParticipantItemStyles } from './ParticipantItem';\nexport { ParticipantList } from './ParticipantList';\nexport type { ParticipantListItemStyles, ParticipantListProps, ParticipantListStyles, ParticipantMenuItemsCallback } from './ParticipantList';\n\n/ @conditional-compile-remove(total-participant-count) /\nexport type { ParticipantListStrings } from './ParticipantList';\nexport { Announcer } from './Announcer';\nexport type { AnnouncerProps } from './Announcer';\nexport { VideoGallery } from './VideoGallery';\nexport type { VideoGalleryProps, VideoGalleryStrings, VideoGalleryStyles, VideoGalleryLayout, VideoTileContextualMenuProps, VideoTileDrawerMenuProps, VideoTilesOptions } from './VideoGallery';\nexport type { OverflowGalleryPosition } from './VideoGallery';\nexport type { LocalVideoTileSize } from './VideoGallery';\nexport type { HorizontalGalleryStyles } from './HorizontalGallery';\nexport { LocalVideoCameraCycleButton } from './LocalVideoCameraButton';\nexport type { LocalVideoCameraCycleButtonProps } from './LocalVideoCameraButton';\nexport { CameraButton } from './CameraButton';\nexport type { CameraButtonContextualMenuStyles, CameraButtonProps, CameraButtonStrings, CameraButtonStyles } from './CameraButton';\nexport { ControlBar } from './ControlBar';\nexport type { ControlBarProps, ControlBarLayout } from './ControlBar';\nexport { ControlBarButton } from './ControlBarButton';\nexport type { ControlBarButtonProps, ControlBarButtonStrings, ControlBarButtonStyles } from './ControlBarButton';\nexport { EndCallButton } from './EndCallButton';\nexport type { EndCallButtonProps, EndCallButtonStrings } from './EndCallButton';\nexport { MicrophoneButton } from './MicrophoneButton';\nexport type { MicrophoneButtonStyles, MicrophoneButtonContextualMenuStyles, MicrophoneButtonProps, MicrophoneButtonStrings } from './MicrophoneButton';\nexport { DevicesButton, generateDefaultDeviceMenuProps as _generateDefaultDeviceMenuProps } from './DevicesButton';\nexport type { OptionsDevice, DevicesButtonProps, DevicesButtonStrings, DevicesButtonStyles, DevicesButtonContextualMenuStyles, DeviceMenuProps as _DeviceMenuProps, DeviceMenuStrings as _DeviceMenuStrings, DeviceMenuStyles as _DeviceMenuStyles } from './DevicesButton';\n\n/ @conditional-compile-remove(call-readiness) /\nexport { CameraAndMicrophoneSitePermissions, MicrophoneSitePermissions, CameraSitePermissions } from './DevicePermissions/SitePermissions';\n/ @conditional-compile-remove(call-readiness) /\nexport type { SitePermissionsStrings, SitePermissionsStyles } from './DevicePermissions/SitePermissionsScaffolding';\n/ @conditional-compile-remove(call-readiness) /\nexport type { CameraAndMicrophoneSitePermissionsStrings, CameraAndMicrophoneSitePermissionsProps, CameraSitePermissionsStrings, CameraSitePermissionsProps, CommonSitePermissionsProps, MicrophoneSitePermissionsStrings, MicrophoneSitePermissionsProps } from './DevicePermissions/SitePermissions';\n/ @conditional-compile-remove(call-readiness) /\nexport { BrowserPermissionDenied } from './DevicePermissions/BrowserPermissionDenied';\n/ @conditional-compile-remove(call-readiness) /\nexport type { BrowserPermissionDeniedStrings, BrowserPermissionDeniedStyles, BrowserPermissionDeniedProps } from './DevicePermissions/BrowserPermissionDenied';\n/ @conditional-compile-remove(call-readiness) /\nexport { BrowserPermissionDeniedIOS } from './DevicePermissions/BrowserPermissionDeniedIOS';\n/ @conditional-compile-remove(call-readiness) /\nexport type { BrowserPermissionDeniedIOSStrings, BrowserPermissionDeniedIOSProps } from './DevicePermissions/BrowserPermissionDeniedIOS';\nexport { ParticipantsButton } from './ParticipantsButton';\nexport type { ParticipantsButtonContextualMenuStyles, ParticipantsButtonProps, ParticipantsButtonStrings, ParticipantsButtonStyles } from './ParticipantsButton';\nexport { ScreenShareButton } from './ScreenShareButton';\nexport type { ScreenShareButtonProps, ScreenShareButtonStrings } from './ScreenShareButton';\nexport { RaiseHandButton } from './RaiseHandButton';\nexport type { RaiseHandButtonProps, RaiseHandButtonStrings } from './RaiseHandButton';\nexport { ReactionButton } from './ReactionButton';\nexport type { ReactionButtonProps, ReactionButtonStrings } from './ReactionButton';\nexport { VideoTile } from './VideoTile';\nexport type { VideoTileProps, VideoTileStylesProps, VideoTileStrings } from './VideoTile';\nexport { _PictureInPictureInPicture } from './PictureInPictureInPicture/PictureInPictureInPicture';\nexport type { _PictureInPictureInPictureProps, _PictureInPictureInPictureStrings } from './PictureInPictureInPicture/PictureInPictureInPicture';\nexport type { _PictureInPictureInPictureTileProps, _TileOrientation } from './PictureInPictureInPicture/PictureInPictureInPictureTile';\nexport from './Drawer';\n/* @conditional-compile-remove(file-sharing-acs) /\nexport type { SendBoxErrorBarError } from './SendBoxErrorBar';\nexport from './Attachment/AttachmentCard';\nexport * from './Attachment/AttachmentCardGroup';\nexport * from './ModalClone/ModalClone';\nexport * from './Attachment/AttachmentDownloadCards';\nexport type { _AttachmentUploadCardsStrings } from './Attachment/AttachmentUploadCards';\n\n/* @conditional-compile-remove(file-sharing-acs) /\nexport type { AttachmentOptions, AttachmentUploadOptions, AttachmentActionHandler, AttachmentSelectionHandler, AttachmentMetadataWrapper, AttachmentRemovalHandler, AttachmentUploadTask } from '../types/Attachment';\n\n/ @conditional-compile-remove(file-sharing-acs) /\nexport type { AttachmentMenuAction, AttachmentDownloadOptions } from '../types/Attachment';\nexport { _useContainerHeight, _useContainerWidth } from './utils/responsive';\nexport { _ComplianceBanner } from './ComplianceBanner';\nexport type { _ComplianceBannerProps, _ComplianceBannerStrings } from './ComplianceBanner';\nexport { Dialpad } from './Dialpad/Dialpad';\nexport type { DialpadProps, DialpadStrings, DialpadStyles, DtmfTone } from './Dialpad/Dialpad';\nexport type { DialpadMode, LongPressTrigger } from './Dialpad/Dialpad';\nexport { _StarSurvey } from './Survey/StarSurvey/StarSurvey';\nexport type { _StarSurveyProps, _StarSurveyStrings } from './Survey/StarSurvey/StarSurvey';\nexport from './Survey/SurveyTypes';\nexport { _TagsSurvey } from './Survey/TagsSurvey/TagsSurvey';\nexport type { _TagsSurveyProps, _TagsSurveyStrings, _IssueCategory, _SurveyTag } from './Survey/TagsSurvey/TagsSurvey';\n/* @conditional-compile-remove(PSTN-calls) /\nexport { HoldButton } from './HoldButton';\n/ @conditional-compile-remove(PSTN-calls) /\nexport type { HoldButtonProps, HoldButtonStrings } from './HoldButton';\nexport { _LocalVideoTile } from './LocalVideoTile';\nexport { _RemoteVideoTile } from './RemoteVideoTile';\nexport { _HighContrastAwareIcon } from './HighContrastAwareIcon';\nexport type { _HighContrastAwareIconProps } from './HighContrastAwareIcon';\nexport { UnsupportedBrowser } from './UnsupportedBrowser';\nexport type { UnsupportedBrowserStrings, UnsupportedBrowserProps } from './UnsupportedBrowser';\nexport { UnsupportedBrowserVersion } from './UnsupportedBrowserVersion';\nexport type { UnsupportedBrowserVersionStrings, UnsupportedBrowserVersionProps } from './UnsupportedBrowserVersion';\nexport { UnsupportedOperatingSystem } from './UnsupportedOperatingSystem';\nexport type { UnsupportedOperatingSystemStrings, UnsupportedOperatingSystemProps } from './UnsupportedOperatingSystem';\nexport { _TroubleshootingGuideErrorBar } from './TroubleshootingGuideErrorBar';\nexport type { _TroubleshootingGuideErrorBarStrings, _TroubleshootingGuideErrorBarProps } from './TroubleshootingGuideErrorBar';\nexport { _DevicePermissionDropdown } from './DevicePermissions/DevicePermissionDropdown';\nexport type { _DevicePermissionDropdownStrings, _DevicePermissionDropdownProps, _PermissionConstraints } from './DevicePermissions/DevicePermissionDropdown';\nexport { _VideoEffectsItem } from './VideoEffects/VideoEffectsItem';\nexport type { _VideoEffectsItemProps, _VideoEffectsItemStyles } from './VideoEffects/VideoEffectsItem';\nexport { _VideoEffectsItemNoBackground, _VideoEffectsItemBlur, _VideoEffectsItemAddImage } from './VideoEffects/PresetVideoEffectsItems';\nexport { _VideoBackgroundEffectsPicker } from './VideoEffects/VideoBackgroundEffectsPicker';\nexport type { _VideoBackgroundEffectsPickerProps, _VideoBackgroundEffectChoiceOption, _VideoBackgroundEffectsPickerStyles } from './VideoEffects/VideoBackgroundEffectsPicker';\nexport type { VerticalGalleryStyles, VerticalGalleryStrings, VerticalGalleryControlBarStyles } from './VerticalGallery';\nexport from './CaptionsBanner';\nexport * from './Caption';\nexport * from './StartCaptionsButton';\nexport * from './CaptionsSettingsModal';\nexport { _ErrorBoundary } from './ErrorBoundary';"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../preprocess-dist/react-components/src/components/index.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nexport { TypingIndicator } from './TypingIndicator';\nexport type { TypingIndicatorProps, TypingIndicatorStrings, TypingIndicatorStylesProps } from './TypingIndicator';\nexport { ErrorBar } from './ErrorBar';\nexport type { ActiveErrorMessage, ErrorBarProps, ErrorBarStrings, ErrorType } from './ErrorBar';\nexport { GridLayout } from './GridLayout';\nexport type { GridLayoutProps, GridLayoutStyles } from './GridLayout';\nexport { SendBox } from './SendBox';\nexport { ImageOverlay } from './ImageOverlay';\nexport type { ImageOverlayStrings } from './ImageOverlay';\nexport type { SendBoxProps, SendBoxStrings, SendBoxStylesProps } from './SendBox'; // TODO: This component is exported only for testing purposes. Remove this when this component is added to composites\n// TODO: This component is exported only for testing purposes. Remove this when this component is added to composites\nexport type { ImageOverlayProps } from './ImageOverlay';\nexport type { InlineImageOptions, InlineImage } from './ChatMessage/ChatMessageContent';\nexport { MessageStatusIndicator } from './MessageStatusIndicator';\nexport type { MessageStatusIndicatorProps, MessageStatusIndicatorStrings } from './MessageStatusIndicator';\nexport { MessageThread } from './MessageThread';\nexport type { MessageProps, MessageThreadProps, MessageThreadStrings, MessageThreadStyles, JumpToNewMessageButtonProps, MessageRenderer, UpdateMessageCallback, CancelEditCallback } from './MessageThread';\nexport { StreamMedia } from './StreamMedia';\nexport type { StreamMediaProps } from './StreamMedia';\nexport type { LoadingState } from './StreamMedia';\nexport { ParticipantItem } from './ParticipantItem';\nexport type { ParticipantItemProps, ParticipantItemStrings, ParticipantItemStyles } from './ParticipantItem';\nexport { ParticipantList } from './ParticipantList';\nexport type { ParticipantListItemStyles, ParticipantListProps, ParticipantListStyles, ParticipantMenuItemsCallback } from './ParticipantList';\nexport { Announcer } from './Announcer';\nexport type { AnnouncerProps } from './Announcer';\nexport { VideoGallery } from './VideoGallery';\nexport type { VideoGalleryProps, VideoGalleryStrings, VideoGalleryStyles, VideoGalleryLayout, VideoTileContextualMenuProps, VideoTileDrawerMenuProps, VideoTilesOptions } from './VideoGallery';\nexport type { OverflowGalleryPosition } from './VideoGallery';\nexport type { LocalVideoTileSize } from './VideoGallery';\nexport type { HorizontalGalleryStyles } from './HorizontalGallery';\nexport { LocalVideoCameraCycleButton } from './LocalVideoCameraButton';\nexport type { LocalVideoCameraCycleButtonProps } from './LocalVideoCameraButton';\nexport { CameraButton } from './CameraButton';\nexport type { CameraButtonContextualMenuStyles, CameraButtonProps, CameraButtonStrings, CameraButtonStyles } from './CameraButton';\nexport { ControlBar } from './ControlBar';\nexport type { ControlBarProps, ControlBarLayout } from './ControlBar';\nexport { ControlBarButton } from './ControlBarButton';\nexport type { ControlBarButtonProps, ControlBarButtonStrings, ControlBarButtonStyles } from './ControlBarButton';\nexport { EndCallButton } from './EndCallButton';\nexport type { EndCallButtonProps, EndCallButtonStrings } from './EndCallButton';\nexport { MicrophoneButton } from './MicrophoneButton';\nexport type { MicrophoneButtonStyles, MicrophoneButtonContextualMenuStyles, MicrophoneButtonProps, MicrophoneButtonStrings } from './MicrophoneButton';\nexport { DevicesButton, generateDefaultDeviceMenuProps as _generateDefaultDeviceMenuProps } from './DevicesButton';\nexport type { OptionsDevice, DevicesButtonProps, DevicesButtonStrings, DevicesButtonStyles, DevicesButtonContextualMenuStyles, DeviceMenuProps as _DeviceMenuProps, DeviceMenuStrings as _DeviceMenuStrings, DeviceMenuStyles as _DeviceMenuStyles } from './DevicesButton';\nexport { ParticipantsButton } from './ParticipantsButton';\nexport type { ParticipantsButtonContextualMenuStyles, ParticipantsButtonProps, ParticipantsButtonStrings, ParticipantsButtonStyles } from './ParticipantsButton';\nexport { ScreenShareButton } from './ScreenShareButton';\nexport type { ScreenShareButtonProps, ScreenShareButtonStrings } from './ScreenShareButton';\nexport { RaiseHandButton } from './RaiseHandButton';\nexport type { RaiseHandButtonProps, RaiseHandButtonStrings } from './RaiseHandButton';\nexport { ReactionButton } from './ReactionButton';\nexport type { ReactionButtonProps, ReactionButtonStrings } from './ReactionButton';\nexport { VideoTile } from './VideoTile';\nexport type { VideoTileProps, VideoTileStylesProps, VideoTileStrings } from './VideoTile';\nexport { _PictureInPictureInPicture } from './PictureInPictureInPicture/PictureInPictureInPicture';\nexport type { _PictureInPictureInPictureProps, _PictureInPictureInPictureStrings } from './PictureInPictureInPicture/PictureInPictureInPicture';\nexport type { _PictureInPictureInPictureTileProps, _TileOrientation } from './PictureInPictureInPicture/PictureInPictureInPictureTile';\nexport * from './Drawer';\nexport * from './Attachment/AttachmentCard';\nexport * from './Attachment/AttachmentCardGroup';\nexport * from './ModalClone/ModalClone';\nexport * from './Attachment/AttachmentDownloadCards';\nexport type { _AttachmentUploadCardsStrings } from './Attachment/AttachmentUploadCards';\nexport { _useContainerHeight, _useContainerWidth } from './utils/responsive';\nexport { _ComplianceBanner } from './ComplianceBanner';\nexport type { _ComplianceBannerProps, _ComplianceBannerStrings } from './ComplianceBanner';\nexport { Dialpad } from './Dialpad/Dialpad';\nexport type { DialpadProps, DialpadStrings, DialpadStyles, DtmfTone } from './Dialpad/Dialpad';\nexport type { DialpadMode, LongPressTrigger } from './Dialpad/Dialpad';\nexport { _StarSurvey } from './Survey/StarSurvey/StarSurvey';\nexport type { _StarSurveyProps, _StarSurveyStrings } from './Survey/StarSurvey/StarSurvey';\nexport * from './Survey/SurveyTypes';\nexport { _TagsSurvey } from './Survey/TagsSurvey/TagsSurvey';\nexport type { _TagsSurveyProps, _TagsSurveyStrings, _IssueCategory, _SurveyTag } from './Survey/TagsSurvey/TagsSurvey';\nexport { _LocalVideoTile } from './LocalVideoTile';\nexport { _RemoteVideoTile } from './RemoteVideoTile';\nexport { _HighContrastAwareIcon } from './HighContrastAwareIcon';\nexport type { _HighContrastAwareIconProps } from './HighContrastAwareIcon';\nexport { UnsupportedBrowser } from './UnsupportedBrowser';\nexport type { UnsupportedBrowserStrings, UnsupportedBrowserProps } from './UnsupportedBrowser';\nexport { UnsupportedBrowserVersion } from './UnsupportedBrowserVersion';\nexport type { UnsupportedBrowserVersionStrings, UnsupportedBrowserVersionProps } from './UnsupportedBrowserVersion';\nexport { UnsupportedOperatingSystem } from './UnsupportedOperatingSystem';\nexport type { UnsupportedOperatingSystemStrings, UnsupportedOperatingSystemProps } from './UnsupportedOperatingSystem';\nexport { _TroubleshootingGuideErrorBar } from './TroubleshootingGuideErrorBar';\nexport type { _TroubleshootingGuideErrorBarStrings, _TroubleshootingGuideErrorBarProps } from './TroubleshootingGuideErrorBar';\nexport { _DevicePermissionDropdown } from './DevicePermissions/DevicePermissionDropdown';\nexport type { _DevicePermissionDropdownStrings, _DevicePermissionDropdownProps, _PermissionConstraints } from './DevicePermissions/DevicePermissionDropdown';\nexport { _VideoEffectsItem } from './VideoEffects/VideoEffectsItem';\nexport type { _VideoEffectsItemProps, _VideoEffectsItemStyles } from './VideoEffects/VideoEffectsItem';\nexport { _VideoEffectsItemNoBackground, _VideoEffectsItemBlur, _VideoEffectsItemAddImage } from './VideoEffects/PresetVideoEffectsItems';\nexport { _VideoBackgroundEffectsPicker } from './VideoEffects/VideoBackgroundEffectsPicker';\nexport type { _VideoBackgroundEffectsPickerProps, _VideoBackgroundEffectChoiceOption, _VideoBackgroundEffectsPickerStyles } from './VideoEffects/VideoBackgroundEffectsPicker';\nexport type { VerticalGalleryStyles, VerticalGalleryStrings, VerticalGalleryControlBarStyles } from './VerticalGallery';\nexport * from './CaptionsBanner';\nexport * from './Caption';\nexport * from './StartCaptionsButton';\nexport * from './CaptionsSettingsModal';\n\n/* @conditional-compile-remove(teams-meeting-conference) /\nexport from './MeetingConferencePhoneInfo';\n/* @conditional-compile-remove(teams-meeting-conference) /\nexport { _formatPhoneNumber } from './utils/formatPhoneNumber';\nexport { _ErrorBoundary } from './ErrorBoundary';\n/ @conditional-compile-remove(notifications) /\nexport from './Notification';\n/* @conditional-compile-remove(notifications) /\nexport from './NotificationStack';"]}

package/dist/dist-esm/react-components/src/components/styles/AttachmentCard.styles.d.ts CHANGED Viewed

@@ -9,7 +9,7 @@ export declare const _ATTACHMENT_CARD_MARGIN_IN_PX = 2;
 /**
  * @private
  */
-export declare const useAttachmentCardStyles: () => Record<"content" | "root" | "title" | "dynamicWidth" | "staticWidth" | "fileIcon", string>;
+export declare const useAttachmentCardStyles: () => Record<"content" | "title" | "root" | "dynamicWidth" | "staticWidth" | "fileIcon" | "focusState" | "fileNameLabel", string>;
 /**
  * @private
  */

package/dist/dist-esm/react-components/src/components/styles/AttachmentCard.styles.js CHANGED Viewed

@@ -36,6 +36,16 @@ export const useAttachmentCardStyles = makeStyles({
     },
     title: {
         width: '100%'
+    },
+    focusState: {
+        '& > * button:focus': {
+            border: `black solid ${_pxToRem(1)}`
+        }
+    },
+    fileNameLabel: {
+        textOverflow: 'ellipsis',
+        whiteSpace: 'nowrap',
+        overflowX: 'clip'
     }
 });
 /**

package/dist/dist-esm/react-components/src/components/styles/AttachmentCard.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AttachmentCard.styles.js","sourceRoot":"","sources":["../../../../../../preprocess-dist/react-components/src/components/styles/AttachmentCard.styles.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAC;AACpE,OAAO,EAAE,QAAQ,EAAE,sCAAgC;AAEnD;;GAEG;AACH,MAAM,CAAC,MAAM,6BAA6B,GAAG,EAAE,CAAC;AAChD;;GAEG;AACH,MAAM,CAAC,MAAM,6BAA6B,GAAG,CAAC,CAAC;AAE/C;;GAEG;AACH,MAAM,CAAC,MAAM,uBAAuB,GAAG,UAAU,CAAC;IAChD,IAAI,EAAE;QACJ,qBAAqB,oBAChB,UAAU,CAAC,OAAO,CAAC,CAAC,CAAC,CACzB;KACF;IACD,YAAY,EAAE;QACZ,QAAQ,EAAE,GAAG,6BAA6B,KAAK;KAChD;IACD,WAAW,EAAE;QACX,KAAK,EAAE,GAAG,6BAA6B,KAAK;KAC7C;IACD,QAAQ,EAAE;QACR,UAAU,EAAE,QAAQ,CAAC,CAAC,CAAC;KACxB;IACD,OAAO,EAAE;QACP,OAAO,EAAE;YACP,KAAK,EAAE,MAAM;YACb,QAAQ,EAAE,QAAQ;YAClB,YAAY,EAAE,UAAU;SACzB;KACF;IACD,KAAK,EAAE;QACL,KAAK,EAAE,MAAM;KACd;CACF,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,gCAAgC,GAAG,WAAW,CAAC;IAC1D,SAAS,EAAE,QAAQ,CAAC,CAAC,CAAC;IACtB,QAAQ,EAAE,QAAQ;IAClB,YAAY,EAAE,UAAU;IACxB,IAAI,EAAE;QACJ,UAAU,EAAE,QAAQ;KACrB;CACF,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,4BAA4B,GAAG,IAAI,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { mergeStyles } from '@fluentui/react';\nimport { makeStyles, shorthands } from '@fluentui/react-components';\nimport { _pxToRem } from '@internal/acs-ui-common';\n\n/*\n @private\n /\nexport const _ATTACHMENT_CARD_WIDTH_IN_REM = 12;\n/\n @private\n /\nexport const _ATTACHMENT_CARD_MARGIN_IN_PX = 2;\n\n/\n @private\n /\nexport const useAttachmentCardStyles = makeStyles({\n root: {\n '& div[role=toolbar]': {\n ...shorthands.padding(0)\n }\n },\n dynamicWidth: {\n minWidth: `${_ATTACHMENT_CARD_WIDTH_IN_REM}rem`\n },\n staticWidth: {\n width: `${_ATTACHMENT_CARD_WIDTH_IN_REM}rem`\n },\n fileIcon: {\n marginLeft: _pxToRem(4)\n },\n content: {\n '> div': {\n width: '100%',\n overflow: 'hidden',\n textOverflow: 'ellipsis'\n }\n },\n title: {\n width: '100%'\n }\n});\n\n/\n @private\n /\nexport const attachmentNameContainerClassName = mergeStyles({\n marginTop: _pxToRem(5),\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n span: {\n whiteSpace: 'nowrap'\n }\n});\n\n/\n @private\n */\nexport const ATTACHMENT_CARD_MIN_PROGRESS = 0.05;"]}
1	+ {"version":3,"file":"AttachmentCard.styles.js","sourceRoot":"","sources":["../../../../../../preprocess-dist/react-components/src/components/styles/AttachmentCard.styles.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAC;AACpE,OAAO,EAAE,QAAQ,EAAE,sCAAgC;AAEnD;;GAEG;AACH,MAAM,CAAC,MAAM,6BAA6B,GAAG,EAAE,CAAC;AAChD;;GAEG;AACH,MAAM,CAAC,MAAM,6BAA6B,GAAG,CAAC,CAAC;AAE/C;;GAEG;AACH,MAAM,CAAC,MAAM,uBAAuB,GAAG,UAAU,CAAC;IAChD,IAAI,EAAE;QACJ,qBAAqB,oBAChB,UAAU,CAAC,OAAO,CAAC,CAAC,CAAC,CACzB;KACF;IACD,YAAY,EAAE;QACZ,QAAQ,EAAE,GAAG,6BAA6B,KAAK;KAChD;IACD,WAAW,EAAE;QACX,KAAK,EAAE,GAAG,6BAA6B,KAAK;KAC7C;IACD,QAAQ,EAAE;QACR,UAAU,EAAE,QAAQ,CAAC,CAAC,CAAC;KACxB;IACD,OAAO,EAAE;QACP,OAAO,EAAE;YACP,KAAK,EAAE,MAAM;YACb,QAAQ,EAAE,QAAQ;YAClB,YAAY,EAAE,UAAU;SACzB;KACF;IACD,KAAK,EAAE;QACL,KAAK,EAAE,MAAM;KACd;IACD,UAAU,EAAE;QACV,oBAAoB,EAAE;YACpB,MAAM,EAAE,eAAe,QAAQ,CAAC,CAAC,CAAC,EAAE;SACrC;KACF;IACD,aAAa,EAAE;QACb,YAAY,EAAE,UAAU;QACxB,UAAU,EAAE,QAAQ;QACpB,SAAS,EAAE,MAAM;KAClB;CACF,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,gCAAgC,GAAG,WAAW,CAAC;IAC1D,SAAS,EAAE,QAAQ,CAAC,CAAC,CAAC;IACtB,QAAQ,EAAE,QAAQ;IAClB,YAAY,EAAE,UAAU;IACxB,IAAI,EAAE;QACJ,UAAU,EAAE,QAAQ;KACrB;CACF,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,4BAA4B,GAAG,IAAI,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { mergeStyles } from '@fluentui/react';\nimport { makeStyles, shorthands } from '@fluentui/react-components';\nimport { _pxToRem } from '@internal/acs-ui-common';\n\n/*\n @private\n /\nexport const _ATTACHMENT_CARD_WIDTH_IN_REM = 12;\n/\n @private\n /\nexport const _ATTACHMENT_CARD_MARGIN_IN_PX = 2;\n\n/\n @private\n /\nexport const useAttachmentCardStyles = makeStyles({\n root: {\n '& div[role=toolbar]': {\n ...shorthands.padding(0)\n }\n },\n dynamicWidth: {\n minWidth: `${_ATTACHMENT_CARD_WIDTH_IN_REM}rem`\n },\n staticWidth: {\n width: `${_ATTACHMENT_CARD_WIDTH_IN_REM}rem`\n },\n fileIcon: {\n marginLeft: _pxToRem(4)\n },\n content: {\n '> div': {\n width: '100%',\n overflow: 'hidden',\n textOverflow: 'ellipsis'\n }\n },\n title: {\n width: '100%'\n },\n focusState: {\n '& > button:focus': {\n border: `black solid ${_pxToRem(1)}`\n }\n },\n fileNameLabel: {\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n overflowX: 'clip'\n }\n});\n\n/*\n @private\n /\nexport const attachmentNameContainerClassName = mergeStyles({\n marginTop: _pxToRem(5),\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n span: {\n whiteSpace: 'nowrap'\n }\n});\n\n/\n @private\n */\nexport const ATTACHMENT_CARD_MIN_PROGRESS = 0.05;"]}

package/dist/dist-esm/react-components/src/components/styles/AttachmentCardGroup.styles.d.ts CHANGED Viewed

@@ -1,7 +1,7 @@
 /**
  * @private
  */
-export declare const useAttachmentCardGroupStyles: () => Record<"root" | "singleAttachment" | "multipleAttachments", string>;
+export declare const useAttachmentCardGroupStyles: () => Record<"root" | "multipleAttachments" | "singleAttachment", string>;
 /**
  * @private
  */
@@ -14,4 +14,8 @@ export declare const attachmentCardGirdLayout: string;
  * @private
  */
 export declare const attachmentCardFlexLayout: string;
+/**
+ * @private
+ */
+export declare const attachmentGroupDisabled: string;
 //# sourceMappingURL=AttachmentCardGroup.styles.d.ts.map

package/dist/dist-esm/react-components/src/components/styles/AttachmentCardGroup.styles.js CHANGED Viewed

@@ -46,4 +46,12 @@ export const attachmentCardFlexLayout = mergeStyles({
     display: 'flex',
     flexWrap: 'wrap'
 });
+/**
+ * @private
+ */
+export const attachmentGroupDisabled = mergeStyles({
+    opacity: '0.5',
+    userSelect: 'none',
+    pointerEvents: 'none'
+});
 //# sourceMappingURL=AttachmentCardGroup.styles.js.map

package/dist/dist-esm/react-components/src/components/styles/AttachmentCardGroup.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AttachmentCardGroup.styles.js","sourceRoot":"","sources":["../../../../../../preprocess-dist/react-components/src/components/styles/AttachmentCardGroup.styles.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAC;AACxD,OAAO,EAAE,6BAA6B,EAAE,6BAA6B,EAAE,MAAM,yBAAyB,CAAC;AACvG,OAAO,EAAE,QAAQ,EAAE,sCAAgC;AACnD,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAE9C;;GAEG;AACH,MAAM,CAAC,MAAM,4BAA4B,GAAG,UAAU,CAAC;IACrD,IAAI,EAAE;QACJ,SAAS,EAAE,SAAS;KACrB;IACD,gBAAgB,EAAE;QAChB,KAAK,EAAE,GAAG,6BAA6B,KAAK;KAC7C;IACD,mBAAmB,EAAE;QACnB,KAAK,EAAE,MAAM;KACd;CACF,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,wBAAwB,GAAG,WAAW,CAAC;IAClD,OAAO,EAAE;QACP,MAAM,EAAE,GAAG,QAAQ,CAAC,6BAA6B,CAAC,EAAE;KACrD;IACD;;OAEG;IACH,yBAAyB,EAAE;QACzB,UAAU,EAAE,GAAG,QAAQ,CAAC,6BAA6B,CAAC,EAAE;KACzD;CACF,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,wBAAwB,GAAG,WAAW,CAAC;IAClD,OAAO,EAAE,MAAM;IACf,mBAAmB,EAAE,2BAA2B,6BAA6B,YAAY;CAC1F,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,wBAAwB,GAAG,WAAW,CAAC;IAClD,OAAO,EAAE,MAAM;IACf,QAAQ,EAAE,MAAM;CACjB,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { makeStyles } from '@fluentui/react-components';\nimport { _ATTACHMENT_CARD_MARGIN_IN_PX, _ATTACHMENT_CARD_WIDTH_IN_REM } from './AttachmentCard.styles';\nimport { _pxToRem } from '@internal/acs-ui-common';\nimport { mergeStyles } from '@fluentui/react';\n\n/*\n @private\n /\nexport const useAttachmentCardGroupStyles = makeStyles({\n root: {\n marginTop: '0.25rem'\n },\n singleAttachment: {\n width: `${_ATTACHMENT_CARD_WIDTH_IN_REM}rem`\n },\n multipleAttachments: {\n width: '100%'\n }\n});\n\n/\n @private\n /\nexport const attachmentCardBaseStyles = mergeStyles({\n '& > ': {\n margin: `${_pxToRem(_ATTACHMENT_CARD_MARGIN_IN_PX)}`\n },\n /*\n margin for children is overriden by parent stack, so adding left margin for each child\n /\n '& > :not(:first-child)': {\n marginLeft: `${_pxToRem(_ATTACHMENT_CARD_MARGIN_IN_PX)}`\n }\n});\n\n/*\n @private\n /\nexport const attachmentCardGirdLayout = mergeStyles({\n display: 'grid',\n gridTemplateColumns: `repeat(auto-fit, minmax(${_ATTACHMENT_CARD_WIDTH_IN_REM}rem, 1fr))`\n});\n\n/\n @private\n */\nexport const attachmentCardFlexLayout = mergeStyles({\n display: 'flex',\n flexWrap: 'wrap'\n});"]}
1	+ {"version":3,"file":"AttachmentCardGroup.styles.js","sourceRoot":"","sources":["../../../../../../preprocess-dist/react-components/src/components/styles/AttachmentCardGroup.styles.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAC;AACxD,OAAO,EAAE,6BAA6B,EAAE,6BAA6B,EAAE,MAAM,yBAAyB,CAAC;AACvG,OAAO,EAAE,QAAQ,EAAE,sCAAgC;AACnD,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAE9C;;GAEG;AACH,MAAM,CAAC,MAAM,4BAA4B,GAAG,UAAU,CAAC;IACrD,IAAI,EAAE;QACJ,SAAS,EAAE,SAAS;KACrB;IACD,gBAAgB,EAAE;QAChB,KAAK,EAAE,GAAG,6BAA6B,KAAK;KAC7C;IACD,mBAAmB,EAAE;QACnB,KAAK,EAAE,MAAM;KACd;CACF,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,wBAAwB,GAAG,WAAW,CAAC;IAClD,OAAO,EAAE;QACP,MAAM,EAAE,GAAG,QAAQ,CAAC,6BAA6B,CAAC,EAAE;KACrD;IACD;;OAEG;IACH,yBAAyB,EAAE;QACzB,UAAU,EAAE,GAAG,QAAQ,CAAC,6BAA6B,CAAC,EAAE;KACzD;CACF,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,wBAAwB,GAAG,WAAW,CAAC;IAClD,OAAO,EAAE,MAAM;IACf,mBAAmB,EAAE,2BAA2B,6BAA6B,YAAY;CAC1F,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,wBAAwB,GAAG,WAAW,CAAC;IAClD,OAAO,EAAE,MAAM;IACf,QAAQ,EAAE,MAAM;CACjB,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,uBAAuB,GAAG,WAAW,CAAC;IACjD,OAAO,EAAE,KAAK;IACd,UAAU,EAAE,MAAM;IAClB,aAAa,EAAE,MAAM;CACtB,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { makeStyles } from '@fluentui/react-components';\nimport { _ATTACHMENT_CARD_MARGIN_IN_PX, _ATTACHMENT_CARD_WIDTH_IN_REM } from './AttachmentCard.styles';\nimport { _pxToRem } from '@internal/acs-ui-common';\nimport { mergeStyles } from '@fluentui/react';\n\n/*\n @private\n /\nexport const useAttachmentCardGroupStyles = makeStyles({\n root: {\n marginTop: '0.25rem'\n },\n singleAttachment: {\n width: `${_ATTACHMENT_CARD_WIDTH_IN_REM}rem`\n },\n multipleAttachments: {\n width: '100%'\n }\n});\n\n/\n @private\n /\nexport const attachmentCardBaseStyles = mergeStyles({\n '& > ': {\n margin: `${_pxToRem(_ATTACHMENT_CARD_MARGIN_IN_PX)}`\n },\n /*\n margin for children is overriden by parent stack, so adding left margin for each child\n /\n '& > :not(:first-child)': {\n marginLeft: `${_pxToRem(_ATTACHMENT_CARD_MARGIN_IN_PX)}`\n }\n});\n\n/*\n @private\n /\nexport const attachmentCardGirdLayout = mergeStyles({\n display: 'grid',\n gridTemplateColumns: `repeat(auto-fit, minmax(${_ATTACHMENT_CARD_WIDTH_IN_REM}rem, 1fr))`\n});\n\n/\n @private\n /\nexport const attachmentCardFlexLayout = mergeStyles({\n display: 'flex',\n flexWrap: 'wrap'\n});\n\n/\n @private\n */\nexport const attachmentGroupDisabled = mergeStyles({\n opacity: '0.5',\n userSelect: 'none',\n pointerEvents: 'none'\n});"]}

package/dist/dist-esm/react-components/src/components/styles/Common.style.d.ts CHANGED Viewed

@@ -11,4 +11,8 @@ export declare const scrollbarStyles: {
         background: string;
     };
 };
+/**
+ * @private
+ */
+export declare const ERROR_IMAGE_SVG_PATH = "M2.85 2.15a.5.5 0 1 0-.7.7l1.4 1.41A2.99 2.99 0 0 0 3 6v8a3 3 0 0 0 3 3h8c.65 0 1.25-.2 1.74-.55l1.4 1.4a.5.5 0 0 0 .71-.7l-15-15Zm6.56 7.97a1.5 1.5 0 0 0-.46.31l-4.67 4.59A2 2 0 0 1 4 14V6a2 2 0 0 1 .28-1.02l5.13 5.14ZM6 16a2 2 0 0 1-1.01-.27l4.66-4.58c.2-.2.5-.2.7 0l4.66 4.58A2 2 0 0 1 14 16H6ZM16 6v7.88l.9.9A3 3 0 0 0 17 14V6a3 3 0 0 0-3-3H6a3 3 0 0 0-.78.1l.9.9H14a2 2 0 0 1 2 2Zm-2 1.5a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0Zm-1 0a.5.5 0 1 1-1 0 .5.5 0 0 1 1 0Z";
 //# sourceMappingURL=Common.style.d.ts.map

package/dist/dist-esm/react-components/src/components/styles/Common.style.js CHANGED Viewed

@@ -13,4 +13,8 @@ export const scrollbarStyles = {
         background: 'rgba(150, 150, 150)'
     }
 };
+/**
+ * @private
+ */
+export const ERROR_IMAGE_SVG_PATH = 'M2.85 2.15a.5.5 0 1 0-.7.7l1.4 1.41A2.99 2.99 0 0 0 3 6v8a3 3 0 0 0 3 3h8c.65 0 1.25-.2 1.74-.55l1.4 1.4a.5.5 0 0 0 .71-.7l-15-15Zm6.56 7.97a1.5 1.5 0 0 0-.46.31l-4.67 4.59A2 2 0 0 1 4 14V6a2 2 0 0 1 .28-1.02l5.13 5.14ZM6 16a2 2 0 0 1-1.01-.27l4.66-4.58c.2-.2.5-.2.7 0l4.66 4.58A2 2 0 0 1 14 16H6ZM16 6v7.88l.9.9A3 3 0 0 0 17 14V6a3 3 0 0 0-3-3H6a3 3 0 0 0-.78.1l.9.9H14a2 2 0 0 1 2 2Zm-2 1.5a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0Zm-1 0a.5.5 0 1 1-1 0 .5.5 0 0 1 1 0Z';
 //# sourceMappingURL=Common.style.js.map

package/dist/dist-esm/react-components/src/components/styles/Common.style.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Common.style.js","sourceRoot":"","sources":["../../../../../../preprocess-dist/react-components/src/components/styles/Common.style.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC;;GAEG;AACH,MAAM,CAAC,MAAM,eAAe,GAAG;IAC7B,2CAA2C,EAAE;QAC3C,KAAK,EAAE,QAAQ;QACf,MAAM,EAAE,QAAQ;KACjB;IACD,uDAAuD,EAAE;QACvD,YAAY,EAAE,MAAM;QACpB,UAAU,EAAE,qBAAqB;KAClC;CACF,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\n/*\n @private\n /\nexport const scrollbarStyles = {\n '::-webkit-scrollbar, ::-webkit-scrollbar': {\n width: '0.3rem',\n height: '0.3rem'\n },\n '::-webkit-scrollbar-thumb, *::-webkit-scrollbar-thumb': {\n borderRadius: '10px',\n background: 'rgba(150, 150, 150)'\n }\n};"]}
1	+ {"version":3,"file":"Common.style.js","sourceRoot":"","sources":["../../../../../../preprocess-dist/react-components/src/components/styles/Common.style.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC;;GAEG;AACH,MAAM,CAAC,MAAM,eAAe,GAAG;IAC7B,2CAA2C,EAAE;QAC3C,KAAK,EAAE,QAAQ;QACf,MAAM,EAAE,QAAQ;KACjB;IACD,uDAAuD,EAAE;QACvD,YAAY,EAAE,MAAM;QACpB,UAAU,EAAE,qBAAqB;KAClC;CACF,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,oBAAoB,GAAG,mdAAmd,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\n/*\n @private\n /\nexport const scrollbarStyles = {\n '::-webkit-scrollbar, ::-webkit-scrollbar': {\n width: '0.3rem',\n height: '0.3rem'\n },\n '::-webkit-scrollbar-thumb, ::-webkit-scrollbar-thumb': {\n borderRadius: '10px',\n background: 'rgba(150, 150, 150)'\n }\n};\n\n/\n @private\n */\nexport const ERROR_IMAGE_SVG_PATH = 'M2.85 2.15a.5.5 0 1 0-.7.7l1.4 1.41A2.99 2.99 0 0 0 3 6v8a3 3 0 0 0 3 3h8c.65 0 1.25-.2 1.74-.55l1.4 1.4a.5.5 0 0 0 .71-.7l-15-15Zm6.56 7.97a1.5 1.5 0 0 0-.46.31l-4.67 4.59A2 2 0 0 1 4 14V6a2 2 0 0 1 .28-1.02l5.13 5.14ZM6 16a2 2 0 0 1-1.01-.27l4.66-4.58c.2-.2.5-.2.7 0l4.66 4.58A2 2 0 0 1 14 16H6ZM16 6v7.88l.9.9A3 3 0 0 0 17 14V6a3 3 0 0 0-3-3H6a3 3 0 0 0-.78.1l.9.9H14a2 2 0 0 1 2 2Zm-2 1.5a1.5 1.5 0 1 0-3 0 1.5 1.5 0 0 0 3 0Zm-1 0a.5.5 0 1 1-1 0 .5.5 0 0 1 1 0Z';"]}

package/dist/dist-esm/react-components/src/components/styles/MessageThread.styles.d.ts CHANGED Viewed

@@ -24,7 +24,7 @@ export declare const useChatMessageRenderStyles: () => Record<"rootCommon" | "ro
 /**
  * @private
  */
-export declare const useChatMyMessageStyles: () => Record<"root" | "body" | "menu" | "menuHidden" | "multipleAttachments" | "bodyAttached" | "menuAttached" | "menuVisible", string>;
+export declare const useChatMyMessageStyles: () => Record<"body" | "menu" | "root" | "bodyAttached" | "menuAttached" | "menuHidden" | "menuVisible" | "multipleAttachmentsInViewing" | "multipleAttachmentsInEditing", string>;
 /**
  * @private
  */
@@ -36,11 +36,11 @@ export declare const chatMessageDateStyle: CSSProperties;
 /**
  * @private
  */
-export declare const useChatMessageStyles: () => Record<"root" | "body" | "multipleAttachments" | "bodyWithoutAvatar" | "bodyWithAvatar" | "avatarNoOverlap" | "avatarOverlap" | "bodyWithPlaceholderImage", string>;
+export declare const useChatMessageStyles: () => Record<"body" | "root" | "bodyWithoutAvatar" | "bodyWithAvatar" | "avatarNoOverlap" | "avatarOverlap" | "multipleAttachments", string>;
 /**
  * @private
  */
-export declare const useChatMessageCommonStyles: () => Record<"failed" | "blocked" | "body", string>;
+export declare const useChatMessageCommonStyles: () => Record<"failed" | "body" | "bodyWithPlaceholderImage" | "blocked", string>;
 /**
  * @private
  */
@@ -65,4 +65,6 @@ export declare const loadPreviousMessageButtonStyle: string;
  * @private
  */
 export declare const DownIconStyle: string;
+/** @private */
+export declare const dataLossIconStyle: string;
 //# sourceMappingURL=MessageThread.styles.d.ts.map

package/dist/dist-esm/react-components/src/components/styles/MessageThread.styles.js CHANGED Viewed

@@ -4,6 +4,7 @@ import { mergeStyles } from '@fluentui/react';
 import { makeStyles, shorthands, tokens } from '@fluentui/react-components';
 import { MESSAGE_STATUS_INDICATOR_SIZE_REM } from './MessageStatusIndicator.styles';
 import { _ATTACHMENT_CARD_MARGIN_IN_PX, _ATTACHMENT_CARD_WIDTH_IN_REM } from './AttachmentCard.styles';
+import { ERROR_IMAGE_SVG_PATH } from './Common.style';
 // Minimum chat bubble width. This matches the minimum chat bubble width from FluentUI
 // that can contain a message and a timestamp.
 const CHAT_MESSAGE_CONTAINER_MIN_WIDTH_REM = 6.25;
@@ -142,9 +143,15 @@ export const useChatMyMessageStyles = makeStyles({
     menuVisible: {
         visibility: 'visible'
     },
-    multipleAttachments: {
+    multipleAttachmentsInViewing: {
         width: '100%',
         maxWidth: `${(_ATTACHMENT_CARD_WIDTH_IN_REM + _ATTACHMENT_CARD_MARGIN_IN_PX) * 2}rem`
+    },
+    multipleAttachmentsInEditing: {
+        // when in editing state, the chat message width should not be
+        // limited by content length but occupying the full width instead
+        width: '100%',
+        float: 'right'
     }
 });
 /**
@@ -187,24 +194,6 @@ export const useChatMessageStyles = makeStyles({
         }, '&:focus-visible': {
             outlineStyle: 'auto'
         } }),
-    bodyWithPlaceholderImage: {
-        '& img[src=""]': {
-            display: 'block',
-            position: 'relative',
-            marginBottom: '5px'
-        },
-        '& img[src=""]:after': {
-            backgroundColor: tokens.colorNeutralBackground1Selected,
-            content: `url("data:image/gif;base64,R0lGODlhAQABAAAAACw=")`,
-            backgroundSize: 'center',
-            position: 'absolute',
-            width: '100%',
-            height: '100%',
-            top: '0',
-            left: '0',
-            display: 'block'
-        }
-    },
     bodyWithoutAvatar: {
         marginTop: '0.125rem'
     },
@@ -231,7 +220,33 @@ export const useChatMessageCommonStyles = makeStyles({
             borderCollapse: 'collapse',
             tableLayout: 'auto',
             width: '100%',
-            '& tr': Object.assign(Object.assign({}, shorthands.border('1px', 'solid', `${tokens.colorNeutralStroke2}`)), { '& td': Object.assign(Object.assign({}, shorthands.border('1px', 'solid', `${tokens.colorNeutralStroke2}`)), { wordBreak: 'normal', paddingTop: '0px', paddingRight: '5px' }) })
+            '& tr': Object.assign(Object.assign({}, shorthands.border('1px', 'solid', `${tokens.colorNeutralStrokeAccessible}`)), { '& td': Object.assign(Object.assign({}, shorthands.border('1px', 'solid', `${tokens.colorNeutralStrokeAccessible}`)), { wordBreak: 'normal', paddingTop: '0px', paddingRight: '5px' }) })
+        }
+    },
+    bodyWithPlaceholderImage: {
+        '& img[src=""]': {
+            display: 'block',
+            position: 'relative',
+            marginBottom: '5px'
+        },
+        '& img[src=""]:after': {
+            backgroundColor: tokens.colorNeutralBackground1Selected,
+            content: `url("data:image/gif;base64,R0lGODlhAQABAAAAACw=")`,
+            backgroundSize: 'center',
+            position: 'absolute',
+            width: '100%',
+            height: '100%',
+            top: '0',
+            left: '0',
+            display: 'block'
+        },
+        '& .broken-image-wrapper': Object.assign(Object.assign({ width: '12rem', height: '12rem', marginTop: '0.75rem', display: 'flex', justifyContent: 'center', alignItems: 'center' }, shorthands.outline('1px', 'solid', tokens.colorNeutralForegroundDisabled)), { backgroundColor: tokens.colorNeutralBackground2 }),
+        '& .broken-image-wrapper:after': {
+            content: `''`,
+            maskImage: `url("data:image/svg+xml,%3Csvg width='3rem' height='3rem' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' fill='currentColor'%3E%3Cpath d='${ERROR_IMAGE_SVG_PATH}' fill='currentColor' /%3E%3C/svg%3E");`,
+            width: '3rem',
+            height: '3rem',
+            backgroundColor: `${tokens.colorNeutralForeground2}`
         }
     },
     failed: {
@@ -295,4 +310,9 @@ export const loadPreviousMessageButtonStyle = mergeStyles({
 export const DownIconStyle = mergeStyles({
     marginRight: '0.5em'
 });
+/** @private */
+export const dataLossIconStyle = mergeStyles({
+    width: '1.25rem',
+    height: '1.25rem'
+});
 //# sourceMappingURL=MessageThread.styles.js.map