npm - @azure/communication-react - Versions diffs - 1.23.0-alpha-202501090016 → 1.23.0-alpha-202501100017 - Mend

@azure/communication-react 1.23.0-alpha-202501090016 → 1.23.0-alpha-202501100017

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

package/dist/dist-cjs/communication-react/index.js CHANGED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-var index = require('./index-EuovDlek.js');
+var index = require('./index-CjMI0Yzv.js');
 require('react');
 require('@fluentui/react');
 require('@fluentui/react-components');

package/dist/dist-esm/acs-ui-common/src/telemetryVersion.js CHANGED Viewed

@@ -2,5 +2,5 @@
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT License.
 // GENERATED FILE. DO NOT EDIT MANUALLY.
-module.exports = '1.23.0-alpha-202501090016';
+module.exports = '1.23.0-alpha-202501100017';
 //# sourceMappingURL=telemetryVersion.js.map

package/dist/dist-esm/acs-ui-common/src/telemetryVersion.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"telemetryVersion.js","sourceRoot":"","sources":["../../../../../acs-ui-common/src/telemetryVersion.js"],"names":[],"mappings":";AAAA,uCAAuC;AACvC,kCAAkC;AAElC,wCAAwC;AAExC,MAAM,CAAC,OAAO,GAAG,2BAA2B,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\n// GENERATED FILE. DO NOT EDIT MANUALLY.\n\nmodule.exports = '1.23.0-alpha-~~202501090016~~';\n"]}
1	+ {"version":3,"file":"telemetryVersion.js","sourceRoot":"","sources":["../../../../../acs-ui-common/src/telemetryVersion.js"],"names":[],"mappings":";AAAA,uCAAuC;AACvC,kCAAkC;AAElC,wCAAwC;AAExC,MAAM,CAAC,OAAO,GAAG,2BAA2B,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\n// GENERATED FILE. DO NOT EDIT MANUALLY.\n\nmodule.exports = '1.23.0-alpha-202501100017';\n"]}

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

@@ -47,6 +47,10 @@ export interface ParticipantItemStrings {
     participantItemWithMoreOptionsAriaLabel?: string;
     /** String for the attendee role */
     attendeeRole: string;
+    /** Label for the disabled microphone icon in participant state stack  */
+    micDisabledIconLabel: string;
+    /** Label for the disabled camera icon in participant state stack  */
+    cameraDisabledIconLabel: string;
 }
 /**
  * Props for {@link ParticipantItem}.

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ParticipantItem.js","sourceRoot":"","sources":["../../../../../../react-components/src/components/ParticipantItem.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport {\n ContextualMenu,\n DirectionalHint,\n Icon,\n IContextualMenuItem,\n IStyle,\n mergeStyles,\n Persona,\n PersonaPresence,\n PersonaSize,\n Stack,\n Text\n} from '@fluentui/react';\nimport React, { useMemo, useRef, useState } from 'react';\nimport { useIdentifiers } from '../identifiers';\nimport { useLocale } from '../localization';\nimport { useTheme } from '../theming';\nimport { BaseCustomStyles, OnRenderAvatarCallback } from '../types';\nimport {\n displayNoneStyle,\n iconContainerStyle,\n iconStyles,\n meContainerStyle,\n menuButtonContainerStyle,\n participantItemContainerStyle,\n participantStateStringStyles\n} from './styles/ParticipantItem.styles';\nimport { _formatString, _preventDismissOnEvent as preventDismissOnEvent } from '@internal/acs-ui-common';\nimport { ParticipantState } from '../types';\nimport { useId } from '@fluentui/react-hooks';\n\n/*\n Fluent styles for {@link ParticipantItem}.\n \n @public\n /\nexport interface ParticipantItemStyles extends BaseCustomStyles {\n /* Styles for the avatar. /\n avatar?: IStyle;\n /* Styles for the (You) string. /\n me?: IStyle;\n /* Styles for the container of the icon. /\n iconContainer?: IStyle;\n /* Styles for the menu. /\n menu?: IStyle;\n}\n\n/\n Strings of {@link ParticipantItem} that can be overridden.\n \n @public\n /\nexport interface ParticipantItemStrings {\n /* String shown when participant is me /\n isMeText: string;\n /* String shown when hovering over menu button /\n menuTitle: string;\n /* Label for the remove button in participant menu /\n removeButtonLabel: string;\n /* Label for the sharing icon in participant state stack /\n sharingIconLabel: string;\n /* Label for the muted icon in participant state stack /\n mutedIconLabel: string;\n /* Label for the raised hand icon in participant state stack /\n handRaisedIconLabel?: string;\n /* placeholder text for participants who does not have a display name/\n displayNamePlaceholder?: string;\n /* String shown when `participantState` is `Ringing` /\n participantStateRinging?: string;\n /* String shown when `participantState` is `Hold` /\n participantStateHold?: string;\n /* Aria Label applied to the base element of the `participantItem` /\n participantItemAriaLabel?: string;\n /* Aria Label applied to the base element of the `participantItem` when there are more options present /\n participantItemWithMoreOptionsAriaLabel?: string;\n /* String for the attendee role /\n attendeeRole: string;\n}\n\n/\n Props for {@link ParticipantItem}.\n \n @public\n /\nexport interface ParticipantItemProps {\n /* Unique User ID of the participant. This `userId` is available in the `onRenderAvatar` callback function /\n userId?: string;\n /* Name of participant. /\n displayName?: string;\n /* Optional indicator to show participant is the user. /\n me?: boolean;\n /* Optional callback returning a JSX element to override avatar. /\n onRenderAvatar?: OnRenderAvatarCallback;\n /* Optional array of IContextualMenuItem for contextual menu. /\n menuItems?: IContextualMenuItem[];\n /* Optional callback returning a JSX element rendered on the right portion of the ParticipantItem. Intended for adding icons. /\n onRenderIcon?: (props?: ParticipantItemProps) => JSX.Element \| null;\n /* Optional PersonaPresence to show participant presence. This will not have an effect if property avatar is assigned. /\n presence?: PersonaPresence;\n /\n Allows users to pass in an object contains custom CSS styles.\n * @Example\n * ```\n * <ParticipantItem styles={{ root: { background: 'blue' } }} />\n * ```\n /\n styles?: ParticipantItemStyles;\n /\n Optional strings to override in component\n /\n strings?: Partial<ParticipantItemStrings>;\n /\n Optional callback when component is clicked\n /\n onClick?: (props?: ParticipantItemProps) => void;\n /* Optional value to determine if the tooltip should be shown for participants or not /\n showParticipantOverflowTooltip?: boolean;\n /\n Optional value to determine and display a participants connection status.\n * For example, `Connecting`, `Ringing` etc.\n * The actual text that is displayed is determined by the localized string\n * corresponding to the provided participant state.\n * For example, `strings.participantStateConnecting` will be used if `participantState` is `Connecting`.\n /\n participantState?: ParticipantState;\n /\n Optional aria property that prefixes the ParticipantItems aria content\n * Takes in a unique id value of the element you would like to be read before the ParticipantItem.\n /\n ariaLabelledBy?: string;\n}\n\n/\n Component to render a calling or chat participant.\n \n Displays the participant's avatar, displayName and status as well as optional icons and context menu.\n \n @public\n /\nexport const ParticipantItem = (props: ParticipantItemProps): JSX.Element => {\n const {\n userId,\n displayName,\n onRenderAvatar,\n menuItems,\n onRenderIcon,\n presence,\n styles,\n me,\n onClick,\n showParticipantOverflowTooltip\n } = props;\n const [itemHovered, setItemHovered] = useState<boolean>(false);\n const [menuHidden, setMenuHidden] = useState<boolean>(true);\n const containerRef = useRef<HTMLDivElement>(null);\n const theme = useTheme();\n const localeStrings = useLocale().strings.participantItem;\n const ids = useIdentifiers();\n const participantItemId = useId();\n const participantItemFlyoutId = useId();\n const hasFlyout = !!(menuItems && menuItems?.length > 0);\n const flyoutShowing = hasFlyout && menuHidden;\n\n const strings = { ...localeStrings, ...props.strings };\n const participantStateString = formatParticipantStateString(props, strings);\n\n const showMenuIcon = !participantStateString && (itemHovered \|\| !menuHidden) && hasFlyout;\n\n // For 'me' show empty name so avatar will get 'Person' icon, when there is no name\n const meAvatarText = displayName?.trim() \|\| '';\n\n const avatarOptions = {\n text: me ? meAvatarText : displayName?.trim() \|\| strings.displayNamePlaceholder,\n size: PersonaSize.size32,\n presence: presence,\n initialsTextColor: 'white',\n showOverflowTooltip: showParticipantOverflowTooltip,\n showUnknownPersonaCoin: !me && (!displayName?.trim() \|\| displayName === strings.displayNamePlaceholder)\n };\n\n const avatar = onRenderAvatar ? (\n onRenderAvatar(userId ?? '', avatarOptions)\n ) : (\n <Persona\n className={mergeStyles(\n {\n // Prevents persona text from being vertically truncated if a global line height is less than 1.15.\n lineHeight: '1.15rem'\n },\n styles?.avatar\n )}\n {...avatarOptions}\n />\n );\n\n const meTextStyle = useMemo(\n () => mergeStyles(meContainerStyle, { color: theme.palette.neutralSecondary }, styles?.me),\n [theme.palette.neutralSecondary, styles?.me]\n );\n const contextualMenuStyle = useMemo(\n () => mergeStyles({ background: theme.palette.neutralLighterAlt }, styles?.menu),\n [theme.palette.neutralLighterAlt, styles?.menu]\n );\n const infoContainerStyle = useMemo(\n () =>\n mergeStyles(\n iconContainerStyle,\n { color: theme.palette.neutralSecondary, marginLeft: 'auto' },\n styles?.iconContainer\n ),\n [theme.palette.neutralSecondary, styles?.iconContainer]\n );\n\n const onDismissMenu = (): void => {\n setItemHovered(false);\n setMenuHidden(true);\n };\n\n const menuButton = useMemo(\n () => (\n <Stack\n horizontal={true}\n horizontalAlign=\"end\"\n className={mergeStyles(menuButtonContainerStyle, { color: theme.palette.neutralPrimary })}\n title={strings.menuTitle}\n data-ui-id={ids.participantItemMenuButton}\n >\n <Icon\n iconName=\"ParticipantItemOptionsHovered\"\n className={mergeStyles(iconStyles, !showMenuIcon ? displayNoneStyle : {})}\n />\n </Stack>\n ),\n [theme.palette.neutralPrimary, strings.menuTitle, ids.participantItemMenuButton, showMenuIcon]\n );\n\n return (\n <div\n ref={containerRef}\n role={'menuitem'}\n id={participantItemId}\n aria-label={\n (hasFlyout ? props.strings?.participantItemWithMoreOptionsAriaLabel : undefined) ??\n props.strings?.participantItemAriaLabel\n }\n aria-labelledby={`${props.ariaLabelledBy} ${participantItemId}`}\n aria-expanded={flyoutShowing}\n aria-disabled={hasFlyout \|\| props.onClick ? false : true}\n aria-haspopup={hasFlyout ? true : undefined}\n aria-controls={participantItemFlyoutId}\n data-is-focusable={hasFlyout}\n data-ui-id=\"participant-item\"\n className={mergeStyles(participantItemContainerStyle({ clickable: hasFlyout }, theme), styles?.root)}\n onMouseEnter={() => setItemHovered(true)}\n onMouseLeave={() => setItemHovered(false)}\n onClick={() => {\n if (!participantStateString) {\n setItemHovered(true);\n setMenuHidden(false);\n onClick?.(props);\n }\n if (!menuHidden) {\n onDismissMenu();\n }\n }}\n tabIndex={hasFlyout ? 0 : undefined}\n >\n <Stack\n horizontal\n className={mergeStyles({\n flexGrow: 1,\n maxWidth: '100%',\n alignItems: 'center'\n })}\n >\n {avatar}\n {me && <Text className={meTextStyle}>{strings.isMeText}</Text>}\n <Stack horizontal className={mergeStyles(infoContainerStyle)}>\n {!showMenuIcon && onRenderIcon && onRenderIcon(props)}\n {/ When the participantStateString has a value, we don't show the menu /}\n {!me && participantStateString ? (\n <Text data-ui-id=\"participant-item-state-string\" className={mergeStyles(participantStateStringStyles)}>\n {participantStateString}\n </Text>\n ) : (\n <>\n {hasFlyout && (\n <>\n {menuButton}\n <ContextualMenu\n id={participantItemFlyoutId}\n items={menuItems}\n hidden={menuHidden}\n target={containerRef}\n onItemClick={onDismissMenu}\n onDismiss={onDismissMenu}\n directionalHint={DirectionalHint.bottomRightEdge}\n className={contextualMenuStyle}\n calloutProps={{\n preventDismissOnEvent\n }}\n />\n </>\n )}\n </>\n )}\n </Stack>\n </Stack>\n </div>\n );\n};\n\n/* @private */\nexport const formatParticipantStateString = (\n props: ParticipantItemProps,\n strings: ParticipantItemStrings\n): string \| undefined => {\n return props.participantState === 'EarlyMedia' \|\| props.participantState === 'Ringing'\n ? strings?.participantStateRinging\n : props.participantState === 'Hold'\n ? strings?.participantStateHold\n : undefined;\n};\n"]}
1	+ {"version":3,"file":"ParticipantItem.js","sourceRoot":"","sources":["../../../../../../react-components/src/components/ParticipantItem.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport {\n ContextualMenu,\n DirectionalHint,\n Icon,\n IContextualMenuItem,\n IStyle,\n mergeStyles,\n Persona,\n PersonaPresence,\n PersonaSize,\n Stack,\n Text\n} from '@fluentui/react';\nimport React, { useMemo, useRef, useState } from 'react';\nimport { useIdentifiers } from '../identifiers';\nimport { useLocale } from '../localization';\nimport { useTheme } from '../theming';\nimport { BaseCustomStyles, OnRenderAvatarCallback } from '../types';\nimport {\n displayNoneStyle,\n iconContainerStyle,\n iconStyles,\n meContainerStyle,\n menuButtonContainerStyle,\n participantItemContainerStyle,\n participantStateStringStyles\n} from './styles/ParticipantItem.styles';\nimport { _formatString, _preventDismissOnEvent as preventDismissOnEvent } from '@internal/acs-ui-common';\nimport { ParticipantState } from '../types';\nimport { useId } from '@fluentui/react-hooks';\n\n/*\n Fluent styles for {@link ParticipantItem}.\n \n @public\n /\nexport interface ParticipantItemStyles extends BaseCustomStyles {\n /* Styles for the avatar. /\n avatar?: IStyle;\n /* Styles for the (You) string. /\n me?: IStyle;\n /* Styles for the container of the icon. /\n iconContainer?: IStyle;\n /* Styles for the menu. /\n menu?: IStyle;\n}\n\n/\n Strings of {@link ParticipantItem} that can be overridden.\n \n @public\n /\nexport interface ParticipantItemStrings {\n /* String shown when participant is me /\n isMeText: string;\n /* String shown when hovering over menu button /\n menuTitle: string;\n /* Label for the remove button in participant menu /\n removeButtonLabel: string;\n /* Label for the sharing icon in participant state stack /\n sharingIconLabel: string;\n /* Label for the muted icon in participant state stack /\n mutedIconLabel: string;\n /* Label for the raised hand icon in participant state stack /\n handRaisedIconLabel?: string;\n /* placeholder text for participants who does not have a display name/\n displayNamePlaceholder?: string;\n /* String shown when `participantState` is `Ringing` /\n participantStateRinging?: string;\n /* String shown when `participantState` is `Hold` /\n participantStateHold?: string;\n /* Aria Label applied to the base element of the `participantItem` /\n participantItemAriaLabel?: string;\n /* Aria Label applied to the base element of the `participantItem` when there are more options present /\n participantItemWithMoreOptionsAriaLabel?: string;\n /* String for the attendee role /\n attendeeRole: string;\n /* Label for the disabled microphone icon in participant state stack /\n micDisabledIconLabel: string;\n /* Label for the disabled camera icon in participant state stack /\n cameraDisabledIconLabel: string;\n}\n\n/\n Props for {@link ParticipantItem}.\n \n @public\n /\nexport interface ParticipantItemProps {\n /* Unique User ID of the participant. This `userId` is available in the `onRenderAvatar` callback function /\n userId?: string;\n /* Name of participant. /\n displayName?: string;\n /* Optional indicator to show participant is the user. /\n me?: boolean;\n /* Optional callback returning a JSX element to override avatar. /\n onRenderAvatar?: OnRenderAvatarCallback;\n /* Optional array of IContextualMenuItem for contextual menu. /\n menuItems?: IContextualMenuItem[];\n /* Optional callback returning a JSX element rendered on the right portion of the ParticipantItem. Intended for adding icons. /\n onRenderIcon?: (props?: ParticipantItemProps) => JSX.Element \| null;\n /* Optional PersonaPresence to show participant presence. This will not have an effect if property avatar is assigned. /\n presence?: PersonaPresence;\n /\n Allows users to pass in an object contains custom CSS styles.\n * @Example\n * ```\n * <ParticipantItem styles={{ root: { background: 'blue' } }} />\n * ```\n /\n styles?: ParticipantItemStyles;\n /\n Optional strings to override in component\n /\n strings?: Partial<ParticipantItemStrings>;\n /\n Optional callback when component is clicked\n /\n onClick?: (props?: ParticipantItemProps) => void;\n /* Optional value to determine if the tooltip should be shown for participants or not /\n showParticipantOverflowTooltip?: boolean;\n /\n Optional value to determine and display a participants connection status.\n * For example, `Connecting`, `Ringing` etc.\n * The actual text that is displayed is determined by the localized string\n * corresponding to the provided participant state.\n * For example, `strings.participantStateConnecting` will be used if `participantState` is `Connecting`.\n /\n participantState?: ParticipantState;\n /\n Optional aria property that prefixes the ParticipantItems aria content\n * Takes in a unique id value of the element you would like to be read before the ParticipantItem.\n /\n ariaLabelledBy?: string;\n}\n\n/\n Component to render a calling or chat participant.\n \n Displays the participant's avatar, displayName and status as well as optional icons and context menu.\n \n @public\n /\nexport const ParticipantItem = (props: ParticipantItemProps): JSX.Element => {\n const {\n userId,\n displayName,\n onRenderAvatar,\n menuItems,\n onRenderIcon,\n presence,\n styles,\n me,\n onClick,\n showParticipantOverflowTooltip\n } = props;\n const [itemHovered, setItemHovered] = useState<boolean>(false);\n const [menuHidden, setMenuHidden] = useState<boolean>(true);\n const containerRef = useRef<HTMLDivElement>(null);\n const theme = useTheme();\n const localeStrings = useLocale().strings.participantItem;\n const ids = useIdentifiers();\n const participantItemId = useId();\n const participantItemFlyoutId = useId();\n const hasFlyout = !!(menuItems && menuItems?.length > 0);\n const flyoutShowing = hasFlyout && menuHidden;\n\n const strings = { ...localeStrings, ...props.strings };\n const participantStateString = formatParticipantStateString(props, strings);\n\n const showMenuIcon = !participantStateString && (itemHovered \|\| !menuHidden) && hasFlyout;\n\n // For 'me' show empty name so avatar will get 'Person' icon, when there is no name\n const meAvatarText = displayName?.trim() \|\| '';\n\n const avatarOptions = {\n text: me ? meAvatarText : displayName?.trim() \|\| strings.displayNamePlaceholder,\n size: PersonaSize.size32,\n presence: presence,\n initialsTextColor: 'white',\n showOverflowTooltip: showParticipantOverflowTooltip,\n showUnknownPersonaCoin: !me && (!displayName?.trim() \|\| displayName === strings.displayNamePlaceholder)\n };\n\n const avatar = onRenderAvatar ? (\n onRenderAvatar(userId ?? '', avatarOptions)\n ) : (\n <Persona\n className={mergeStyles(\n {\n // Prevents persona text from being vertically truncated if a global line height is less than 1.15.\n lineHeight: '1.15rem'\n },\n styles?.avatar\n )}\n {...avatarOptions}\n />\n );\n\n const meTextStyle = useMemo(\n () => mergeStyles(meContainerStyle, { color: theme.palette.neutralSecondary }, styles?.me),\n [theme.palette.neutralSecondary, styles?.me]\n );\n const contextualMenuStyle = useMemo(\n () => mergeStyles({ background: theme.palette.neutralLighterAlt }, styles?.menu),\n [theme.palette.neutralLighterAlt, styles?.menu]\n );\n const infoContainerStyle = useMemo(\n () =>\n mergeStyles(\n iconContainerStyle,\n { color: theme.palette.neutralSecondary, marginLeft: 'auto' },\n styles?.iconContainer\n ),\n [theme.palette.neutralSecondary, styles?.iconContainer]\n );\n\n const onDismissMenu = (): void => {\n setItemHovered(false);\n setMenuHidden(true);\n };\n\n const menuButton = useMemo(\n () => (\n <Stack\n horizontal={true}\n horizontalAlign=\"end\"\n className={mergeStyles(menuButtonContainerStyle, { color: theme.palette.neutralPrimary })}\n title={strings.menuTitle}\n data-ui-id={ids.participantItemMenuButton}\n >\n <Icon\n iconName=\"ParticipantItemOptionsHovered\"\n className={mergeStyles(iconStyles, !showMenuIcon ? displayNoneStyle : {})}\n />\n </Stack>\n ),\n [theme.palette.neutralPrimary, strings.menuTitle, ids.participantItemMenuButton, showMenuIcon]\n );\n\n return (\n <div\n ref={containerRef}\n role={'menuitem'}\n id={participantItemId}\n aria-label={\n (hasFlyout ? props.strings?.participantItemWithMoreOptionsAriaLabel : undefined) ??\n props.strings?.participantItemAriaLabel\n }\n aria-labelledby={`${props.ariaLabelledBy} ${participantItemId}`}\n aria-expanded={flyoutShowing}\n aria-disabled={hasFlyout \|\| props.onClick ? false : true}\n aria-haspopup={hasFlyout ? true : undefined}\n aria-controls={participantItemFlyoutId}\n data-is-focusable={hasFlyout}\n data-ui-id=\"participant-item\"\n className={mergeStyles(participantItemContainerStyle({ clickable: hasFlyout }, theme), styles?.root)}\n onMouseEnter={() => setItemHovered(true)}\n onMouseLeave={() => setItemHovered(false)}\n onClick={() => {\n if (!participantStateString) {\n setItemHovered(true);\n setMenuHidden(false);\n onClick?.(props);\n }\n if (!menuHidden) {\n onDismissMenu();\n }\n }}\n tabIndex={hasFlyout ? 0 : undefined}\n >\n <Stack\n horizontal\n className={mergeStyles({\n flexGrow: 1,\n maxWidth: '100%',\n alignItems: 'center'\n })}\n >\n {avatar}\n {me && <Text className={meTextStyle}>{strings.isMeText}</Text>}\n <Stack horizontal className={mergeStyles(infoContainerStyle)}>\n {!showMenuIcon && onRenderIcon && onRenderIcon(props)}\n {/ When the participantStateString has a value, we don't show the menu /}\n {!me && participantStateString ? (\n <Text data-ui-id=\"participant-item-state-string\" className={mergeStyles(participantStateStringStyles)}>\n {participantStateString}\n </Text>\n ) : (\n <>\n {hasFlyout && (\n <>\n {menuButton}\n <ContextualMenu\n id={participantItemFlyoutId}\n items={menuItems}\n hidden={menuHidden}\n target={containerRef}\n onItemClick={onDismissMenu}\n onDismiss={onDismissMenu}\n directionalHint={DirectionalHint.bottomRightEdge}\n className={contextualMenuStyle}\n calloutProps={{\n preventDismissOnEvent\n }}\n />\n </>\n )}\n </>\n )}\n </Stack>\n </Stack>\n </div>\n );\n};\n\n/* @private */\nexport const formatParticipantStateString = (\n props: ParticipantItemProps,\n strings: ParticipantItemStrings\n): string \| undefined => {\n return props.participantState === 'EarlyMedia' \|\| props.participantState === 'Ringing'\n ? strings?.participantStateRinging\n : props.participantState === 'Hold'\n ? strings?.participantStateHold\n : undefined;\n};\n"]}

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

@@ -11,7 +11,7 @@ import { formatParticipantStateString, ParticipantItem } from './ParticipantItem
 import { iconStyles, participantListItemStyle, participantListStyle } from './styles/ParticipantList.styles';
 import { _formatString } from "../../../acs-ui-common/src";
 const onRenderParticipantDefault = (participant, strings, myUserId, onRenderAvatar, createParticipantMenuItems, styles, onParticipantClick, showParticipantOverflowTooltip, participantAriaLabelledBy, theme, pinnedParticipants) => {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
     const callingParticipant = participant;
     let presence = undefined;
     if (callingParticipant) {
@@ -74,12 +74,14 @@ const onRenderParticipantDefault = (participant, strings, myUserId, onRenderAvat
         displayName: displayName !== null && displayName !== void 0 ? displayName : '',
         connectionState: (_b = formatParticipantStateString(callingParticipant, strings)) !== null && _b !== void 0 ? _b : '',
         mutedState: (_c = (callingParticipant.isMuted ? strings === null || strings === void 0 ? void 0 : strings.mutedIconLabel : undefined)) !== null && _c !== void 0 ? _c : '',
-        sharingState: (_d = (callingParticipant.isScreenSharing ? strings === null || strings === void 0 ? void 0 : strings.sharingIconLabel : undefined)) !== null && _d !== void 0 ? _d : '',
-        handRaisedState: (_k = (((_e = callingParticipant.raisedHand) === null || _e === void 0 ? void 0 : _e.raisedHandOrderPosition)
-            ? _formatString((_f = strings === null || strings === void 0 ? void 0 : strings.handRaisedIconLabel) !== null && _f !== void 0 ? _f : '', {
-                position: (_j = (_h = (_g = callingParticipant.raisedHand) === null || _g === void 0 ? void 0 : _g.raisedHandOrderPosition) === null || _h === void 0 ? void 0 : _h.toString()) !== null && _j !== void 0 ? _j : ''
+        micDisabledState: (_e = (((_d = callingParticipant.mediaAccess) === null || _d === void 0 ? void 0 : _d.isAudioPermitted) === false ? strings === null || strings === void 0 ? void 0 : strings.micDisabledIconLabel : undefined)) !== null && _e !== void 0 ? _e : '',
+        cameraDisabledState: (_g = (((_f = callingParticipant.mediaAccess) === null || _f === void 0 ? void 0 : _f.isVideoPermitted) === false ? strings === null || strings === void 0 ? void 0 : strings.cameraDisabledIconLabel : undefined)) !== null && _g !== void 0 ? _g : '',
+        sharingState: (_h = (callingParticipant.isScreenSharing ? strings === null || strings === void 0 ? void 0 : strings.sharingIconLabel : undefined)) !== null && _h !== void 0 ? _h : '',
+        handRaisedState: (_p = (((_j = callingParticipant.raisedHand) === null || _j === void 0 ? void 0 : _j.raisedHandOrderPosition)
+            ? _formatString((_k = strings === null || strings === void 0 ? void 0 : strings.handRaisedIconLabel) !== null && _k !== void 0 ? _k : '', {
+                position: (_o = (_m = (_l = callingParticipant.raisedHand) === null || _l === void 0 ? void 0 : _l.raisedHandOrderPosition) === null || _m === void 0 ? void 0 : _m.toString()) !== null && _o !== void 0 ? _o : ''
             })
-            : undefined)) !== null && _k !== void 0 ? _k : ''
+            : undefined)) !== null && _p !== void 0 ? _p : ''
     });
     return (React.createElement(ParticipantItem, { styles: styles, key: participant.userId, userId: participant.userId, displayName: displayName, me: myUserId ? participant.userId === myUserId : false, menuItems: menuItems, presence: presence, onRenderIcon: onRenderIcon, onRenderAvatar: onRenderAvatarWithRaiseHand, onClick: onParticipantClick ? () => onParticipantClick === null || onParticipantClick === void 0 ? void 0 : onParticipantClick(participant) : undefined, showParticipantOverflowTooltip: showParticipantOverflowTooltip, participantState: callingParticipant.state, ariaLabelledBy: participantAriaLabelledBy, strings: {
             participantItemAriaLabel: ariaLabel

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ParticipantList.js","sourceRoot":"","sources":["../../../../../../react-components/src/components/ParticipantList.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport {\n Icon,\n IContextualMenuItem,\n IContextualMenuItemStyles,\n merge,\n mergeStyles,\n PersonaPresence,\n Stack,\n Theme\n} from '@fluentui/react';\nimport { Text } from '@fluentui/react';\nimport { useTheme, CallingTheme } from '../theming';\nimport { RaisedHandIcon } from './assets/RaisedHandIcon';\nimport React, { useCallback, useMemo } from 'react';\nimport { useIdentifiers } from '../identifiers';\nimport { useLocale } from '../localization';\nimport {\n BaseCustomStyles,\n CallParticipantListParticipant,\n OnRenderAvatarCallback,\n ParticipantListParticipant\n} from '../types';\nimport { CustomAvatarOptions } from '../types';\nimport {\n formatParticipantStateString,\n ParticipantItem,\n ParticipantItemStrings,\n ParticipantItemStyles\n} from './ParticipantItem';\nimport { iconStyles, participantListItemStyle, participantListStyle } from './styles/ParticipantList.styles';\nimport { _formatString } from '@internal/acs-ui-common';\n\n/*\n Styles for the {@link ParticipantList} {@link ParticipantItem}.\n \n @public\n /\nexport interface ParticipantListItemStyles extends ParticipantItemStyles {\n /* Styles applied to the sub-menu of the {@link ParticipantList} {@link ParticipantItem}. /\n participantSubMenuItemsStyles?: IContextualMenuItemStyles;\n}\n\n/\n Styles for the {@link ParticipantList}.\n \n @public\n /\nexport interface ParticipantListStyles extends BaseCustomStyles {\n /* Styles for the {@link ParticipantList} {@link ParticipantItem}. /\n participantItemStyles?: ParticipantListItemStyles;\n}\n\n/ @conditional-compile-remove(total-participant-count) /\n/\n Strings for the {@link ParticipantList}.\n \n @beta\n /\nexport interface ParticipantListStrings {\n /\n String for rendering the count of participants not contained in the displayed participant list\n /\n overflowParticipantCount?: string;\n}\n\n/\n A callback for providing custom menu items for each participant in {@link ParticipantList}.\n \n @public\n /\nexport type ParticipantMenuItemsCallback = (\n participantUserId: string,\n userId?: string,\n defaultMenuItems?: IContextualMenuItem[]\n) => IContextualMenuItem[];\n\n/\n Props for {@link ParticipantList}.\n \n @public\n /\nexport type ParticipantListProps = {\n /* Participants in user call or chat /\n participants: ParticipantListParticipant[];\n /* User ID of user /\n myUserId?: string;\n /\n If set to `true`, excludes the local participant from the participant list with use of `myUserId` props (required in this case).\n \n @defaultValue `false`\n /\n excludeMe?: boolean;\n /* Optional callback to render each participant. If no callback is provided, each participant will be rendered with `ParticipantItem` /\n onRenderParticipant?: (participant: ParticipantListParticipant) => JSX.Element \| null;\n /* Optional callback to render the avatar for each participant. This property will have no effect if `onRenderParticipant` is assigned. /\n onRenderAvatar?: OnRenderAvatarCallback;\n /* Optional callback to render the context menu for each participant /\n onRemoveParticipant?: (userId: string) => void;\n /* Optional callback to render custom menu items for each participant. /\n onFetchParticipantMenuItems?: ParticipantMenuItemsCallback;\n /* Optional callback when rendered ParticipantItem is clicked /\n onParticipantClick?: (participant?: ParticipantListParticipant) => void;\n /* Optional callback to render a context menu to mute a participant /\n onMuteParticipant?: (userId: string) => Promise<void>;\n styles?: ParticipantListStyles;\n /* Optional value to determine if the tooltip should be shown for participants or not /\n showParticipantOverflowTooltip?: boolean;\n / @conditional-compile-remove(total-participant-count) /\n /* Total number of people in the call. This number can be larger than the remote participant count. /\n totalParticipantCount?: number;\n / @conditional-compile-remove(total-participant-count) /\n /* Strings for the participant list /\n strings?: ParticipantListStrings;\n /* Optional aria-labelledby prop that prefixes each ParticipantItem aria-label /\n participantAriaLabelledBy?: string;\n /* List of pinned participants /\n pinnedParticipants?: string[];\n};\n\nconst onRenderParticipantDefault = (\n participant: ParticipantListParticipant,\n strings: ParticipantItemStrings,\n myUserId?: string,\n onRenderAvatar?: OnRenderAvatarCallback,\n createParticipantMenuItems?: (participant: ParticipantListParticipant) => IContextualMenuItem[],\n styles?: ParticipantListItemStyles,\n onParticipantClick?: (participant?: ParticipantListParticipant) => void,\n showParticipantOverflowTooltip?: boolean,\n participantAriaLabelledBy?: string,\n theme?: Theme,\n pinnedParticipants?: string[]\n): JSX.Element \| null => {\n const callingParticipant = participant as CallParticipantListParticipant;\n\n let presence: PersonaPresence \| undefined = undefined;\n if (callingParticipant) {\n presence = PersonaPresence.none;\n }\n\n const menuItems = createParticipantMenuItems && createParticipantMenuItems(participant);\n\n const formatDisplayName = (displayName?: string): string \| undefined => {\n if (displayName && strings.attendeeRole) {\n return _formatString(displayName, { AttendeeRole: strings.attendeeRole });\n }\n return displayName;\n };\n const displayName = formatDisplayName(participant.displayName);\n\n const callingPalette = (theme as unknown as CallingTheme).callingPalette;\n\n const isPinned = pinnedParticipants && pinnedParticipants?.includes(participant.userId);\n\n const showRenderIconTrampoline = (): boolean => {\n / @conditional-compile-remove(media-access) /\n return !!(\n callingParticipant?.isScreenSharing \|\|\n callingParticipant?.isMuted \|\|\n callingParticipant?.raisedHand \|\|\n isPinned \|\|\n !(callingParticipant?.mediaAccess ? callingParticipant.mediaAccess.isAudioPermitted : true) \|\|\n !(callingParticipant?.mediaAccess ? callingParticipant.mediaAccess.isVideoPermitted : true)\n );\n\n return !!(\n callingParticipant?.isScreenSharing \|\|\n callingParticipant?.isMuted \|\|\n callingParticipant?.raisedHand \|\|\n isPinned\n );\n };\n\n const onRenderIcon = showRenderIconTrampoline()\n ? () => (\n <Stack horizontal={true} tokens={{ childrenGap: '0.5rem' }}>\n {callingParticipant.raisedHand && (\n <Stack\n horizontal={true}\n tokens={{ childrenGap: '0.2rem' }}\n style={{\n alignItems: 'center',\n padding: '0.1rem 0.2rem',\n backgroundColor: theme?.palette.neutralLighter,\n borderRadius: '0.3rem'\n }}\n >\n {callingParticipant.raisedHand.raisedHandOrderPosition && (\n <Stack.Item>\n <Text>{callingParticipant.raisedHand?.raisedHandOrderPosition}</Text>\n </Stack.Item>\n )}\n <Stack.Item>\n <RaisedHandIcon />\n </Stack.Item>\n </Stack>\n )}\n {callingParticipant.isScreenSharing && (\n <Icon\n iconName=\"ParticipantItemScreenShareStart\"\n className={iconStyles}\n ariaLabel={strings.sharingIconLabel}\n />\n )}\n {callingParticipant.spotlight && <Icon iconName=\"ParticipantItemSpotlighted\" className={iconStyles} />}\n {isPinned && <Icon iconName=\"ParticipantItemPinned\" className={iconStyles} />}\n {\n / @conditional-compile-remove(media-access) / callingParticipant.mediaAccess &&\n !callingParticipant.mediaAccess.isVideoPermitted ? (\n <Icon\n iconName=\"ControlButtonCameraProhibited\"\n className={iconStyles}\n ariaLabel={strings.mutedIconLabel}\n />\n ) : undefined\n }\n {\n / @conditional-compile-remove(media-access) / callingParticipant.mediaAccess &&\n !callingParticipant.mediaAccess?.isAudioPermitted ? (\n <Icon iconName=\"ControlButtonMicProhibited\" className={iconStyles} ariaLabel={strings.mutedIconLabel} />\n ) : undefined\n }\n {\n / @conditional-compile-remove(media-access) / (callingParticipant.mediaAccess\n ? callingParticipant.mediaAccess.isAudioPermitted\n : true) && callingParticipant.isMuted ? (\n <Icon iconName=\"ParticipantItemMicOff\" className={iconStyles} ariaLabel={strings.mutedIconLabel} />\n ) : undefined\n }\n </Stack>\n )\n : () => null;\n\n const onRenderAvatarWithRaiseHand =\n callingParticipant?.raisedHand && onRenderAvatar\n ? (\n userId?: string,\n options?: CustomAvatarOptions,\n defaultOnRender?: (props: CustomAvatarOptions) => JSX.Element\n ) =>\n onRenderAvatar(\n userId,\n { ...options, styles: { root: { border: callingPalette.raiseHandGold } } },\n defaultOnRender\n )\n : onRenderAvatar;\n\n const ariaLabelTemplate =\n (menuItems && menuItems.length > 0 ? strings?.participantItemWithMoreOptionsAriaLabel : undefined) ??\n strings?.participantItemAriaLabel;\n const ariaLabel = _formatString(ariaLabelTemplate ?? '', {\n displayName: displayName ?? '',\n connectionState: formatParticipantStateString(callingParticipant, strings) ?? '',\n mutedState: (callingParticipant.isMuted ? strings?.mutedIconLabel : undefined) ?? '',\n sharingState: (callingParticipant.isScreenSharing ? strings?.sharingIconLabel : undefined) ?? '',\n handRaisedState:\n (callingParticipant.raisedHand?.raisedHandOrderPosition\n ? _formatString(strings?.handRaisedIconLabel ?? '', {\n position: callingParticipant.raisedHand?.raisedHandOrderPosition?.toString() ?? ''\n })\n : undefined) ?? ''\n });\n\n return (\n <ParticipantItem\n styles={styles}\n key={participant.userId}\n userId={participant.userId}\n displayName={displayName}\n me={myUserId ? participant.userId === myUserId : false}\n menuItems={menuItems}\n presence={presence}\n onRenderIcon={onRenderIcon}\n onRenderAvatar={onRenderAvatarWithRaiseHand}\n onClick={onParticipantClick ? () => onParticipantClick?.(participant) : undefined}\n showParticipantOverflowTooltip={showParticipantOverflowTooltip}\n participantState={callingParticipant.state}\n ariaLabelledBy={participantAriaLabelledBy}\n strings={{\n participantItemAriaLabel: ariaLabel\n }}\n />\n );\n};\n\n/\n Sort participants by raised hand order position\n /\nconst sortParticipants = (participants: ParticipantListParticipant[]): ParticipantListParticipant[] => {\n const isParticipantListCallParticipant = function (participant: ParticipantListParticipant): boolean {\n return 'raisedHand' in participant;\n };\n\n participants.sort((a, b) => {\n if (!isParticipantListCallParticipant(a) \|\| !isParticipantListCallParticipant(b)) {\n return 0;\n }\n const callA = a as CallParticipantListParticipant;\n const callB = b as CallParticipantListParticipant;\n if (callA.raisedHand && callB.raisedHand) {\n return callA.raisedHand.raisedHandOrderPosition - callB.raisedHand.raisedHandOrderPosition;\n } else if (callA.raisedHand) {\n return -1;\n } else if (callB.raisedHand) {\n return 1;\n }\n return 0;\n });\n return participants;\n};\n\nconst getParticipantsForDefaultRender = (\n participants: ParticipantListParticipant[],\n excludeMe: boolean,\n myUserId: string \| undefined\n): ParticipantListParticipant[] => {\n if (!excludeMe \|\| !myUserId) {\n return [...participants];\n }\n\n const userIndex = participants.map((p) => p.userId).indexOf(myUserId);\n\n if (userIndex === -1) {\n return [...participants];\n }\n\n const remoteParticipants = [...participants];\n remoteParticipants.splice(userIndex, 1);\n\n return remoteParticipants;\n};\n\n/\n Component to render all calling or chat participants.\n \n By default, each participant is rendered with {@link ParticipantItem}. See {@link ParticipantListProps.onRenderParticipant} to override.\n \n @public\n /\nexport const ParticipantList = (props: ParticipantListProps): JSX.Element => {\n const {\n excludeMe = false,\n myUserId,\n participants,\n onRemoveParticipant,\n onRenderAvatar,\n onRenderParticipant,\n onFetchParticipantMenuItems,\n showParticipantOverflowTooltip,\n / @conditional-compile-remove(total-participant-count) /\n totalParticipantCount,\n / @conditional-compile-remove(total-participant-count) /\n strings,\n participantAriaLabelledBy,\n pinnedParticipants\n } = props;\n\n const theme = useTheme();\n const ids = useIdentifiers();\n const participantItemStrings = useLocale().strings.participantItem;\n / @conditional-compile-remove(total-participant-count) /\n const participantListStrings = useLocale().strings.ParticipantList;\n\n const displayedParticipants: ParticipantListParticipant[] = useMemo(() => {\n return onRenderParticipant ? participants : getParticipantsForDefaultRender(participants, excludeMe, myUserId);\n }, [participants, excludeMe, myUserId, onRenderParticipant]);\n\n sortParticipants(displayedParticipants);\n\n const createParticipantMenuItems = useCallback(\n (participant: ParticipantListParticipant): IContextualMenuItem[] => {\n let menuItems: IContextualMenuItem[] = [];\n\n const participantIsRemovable = participant.isRemovable;\n if (participant.userId !== myUserId && onRemoveParticipant && participantIsRemovable) {\n menuItems.push({\n key: 'remove',\n text: participantItemStrings.removeButtonLabel,\n onClick: () => onRemoveParticipant(participant.userId),\n itemProps: {\n styles: props.styles?.participantItemStyles?.participantSubMenuItemsStyles\n },\n iconProps: {\n iconName: 'ContextMenuRemoveParticipant',\n styles: { root: { lineHeight: 0 } }\n },\n 'data-ui-id': ids.participantListRemoveParticipantButton\n });\n }\n\n if (onFetchParticipantMenuItems) {\n menuItems = onFetchParticipantMenuItems(participant.userId, myUserId, menuItems);\n }\n\n return menuItems;\n },\n [\n ids.participantListRemoveParticipantButton,\n myUserId,\n onFetchParticipantMenuItems,\n onRemoveParticipant,\n props.styles?.participantItemStyles?.participantSubMenuItemsStyles,\n participantItemStrings.removeButtonLabel\n ]\n );\n\n const participantItemStyles = useMemo(\n () => merge(participantListItemStyle, props.styles?.participantItemStyles),\n [props.styles?.participantItemStyles]\n );\n\n / @conditional-compile-remove(total-participant-count) /\n const overflowParticipantCountString =\n strings?.overflowParticipantCount ?? participantListStrings?.overflowParticipantCount;\n\n return (\n <Stack\n data-ui-id={ids.participantList}\n className={mergeStyles(participantListStyle, props.styles?.root)}\n role={'menu'}\n >\n {displayedParticipants.map((participant: ParticipantListParticipant) =>\n onRenderParticipant\n ? onRenderParticipant(participant)\n : onRenderParticipantDefault(\n participant,\n participantItemStrings,\n myUserId,\n onRenderAvatar,\n createParticipantMenuItems,\n participantItemStyles,\n props.onParticipantClick,\n showParticipantOverflowTooltip,\n participantAriaLabelledBy,\n theme,\n pinnedParticipants\n )\n )}\n {\n / @conditional-compile-remove(total-participant-count) */ overflowParticipantCountString &&\n totalParticipantCount &&\n totalParticipantCount > displayedParticipants.length && (\n <Text style={{ fontWeight: 400, margin: '0.5rem' }}>\n {_formatString(overflowParticipantCountString, {\n overflowCount: `${totalParticipantCount - displayedParticipants.length}`\n })}\n </Text>\n )\n }\n </Stack>\n );\n};\n"]}
1	+ {"version":3,"file":"ParticipantList.js","sourceRoot":"","sources":["../../../../../../react-components/src/components/ParticipantList.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EACL,IAAI,EAGJ,KAAK,EACL,WAAW,EACX,eAAe,EACf,KAAK,EAEN,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;AACvC,OAAO,EAAE,QAAQ,EAAgB,MAAM,YAAY,CAAC;AACpD,OAAO,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AACzD,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AACpD,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAChD,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAQ5C,OAAO,EACL,4BAA4B,EAC5B,eAAe,EAGhB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,UAAU,EAAE,wBAAwB,EAAE,oBAAoB,EAAE,MAAM,iCAAiC,CAAC;AAC7G,OAAO,EAAE,aAAa,EAAE,mCAAgC;AAyFxD,MAAM,0BAA0B,GAAG,CACjC,WAAuC,EACvC,OAA+B,EAC/B,QAAiB,EACjB,cAAuC,EACvC,0BAA+F,EAC/F,MAAkC,EAClC,kBAAuE,EACvE,8BAAwC,EACxC,yBAAkC,EAClC,KAAa,EACb,kBAA6B,EACT,EAAE;;IACtB,MAAM,kBAAkB,GAAG,WAA6C,CAAC;IAEzE,IAAI,QAAQ,GAAgC,SAAS,CAAC;IACtD,IAAI,kBAAkB,EAAE,CAAC;QACvB,QAAQ,GAAG,eAAe,CAAC,IAAI,CAAC;IAClC,CAAC;IAED,MAAM,SAAS,GAAG,0BAA0B,IAAI,0BAA0B,CAAC,WAAW,CAAC,CAAC;IAExF,MAAM,iBAAiB,GAAG,CAAC,WAAoB,EAAsB,EAAE;QACrE,IAAI,WAAW,IAAI,OAAO,CAAC,YAAY,EAAE,CAAC;YACxC,OAAO,aAAa,CAAC,WAAW,EAAE,EAAE,YAAY,EAAE,OAAO,CAAC,YAAY,EAAE,CAAC,CAAC;QAC5E,CAAC;QACD,OAAO,WAAW,CAAC;IACrB,CAAC,CAAC;IACF,MAAM,WAAW,GAAG,iBAAiB,CAAC,WAAW,CAAC,WAAW,CAAC,CAAC;IAE/D,MAAM,cAAc,GAAI,KAAiC,CAAC,cAAc,CAAC;IAEzE,MAAM,QAAQ,GAAG,kBAAkB,KAAI,kBAAkB,aAAlB,kBAAkB,uBAAlB,kBAAkB,CAAE,QAAQ,CAAC,WAAW,CAAC,MAAM,CAAC,CAAA,CAAC;IAExF,MAAM,wBAAwB,GAAG,GAAY,EAAE;QAC7C,+CAA+C;QAC/C,OAAO,CAAC,CAAC,CACP,CAAA,kBAAkB,aAAlB,kBAAkB,uBAAlB,kBAAkB,CAAE,eAAe;aACnC,kBAAkB,aAAlB,kBAAkB,uBAAlB,kBAAkB,CAAE,OAAO,CAAA;aAC3B,kBAAkB,aAAlB,kBAAkB,uBAAlB,kBAAkB,CAAE,UAAU,CAAA;YAC9B,QAAQ;YACR,CAAC,CAAC,CAAA,kBAAkB,aAAlB,kBAAkB,uBAAlB,kBAAkB,CAAE,WAAW,EAAC,CAAC,CAAC,kBAAkB,CAAC,WAAW,CAAC,gBAAgB,CAAC,CAAC,CAAC,IAAI,CAAC;YAC3F,CAAC,CAAC,CAAA,kBAAkB,aAAlB,kBAAkB,uBAAlB,kBAAkB,CAAE,WAAW,EAAC,CAAC,CAAC,kBAAkB,CAAC,WAAW,CAAC,gBAAgB,CAAC,CAAC,CAAC,IAAI,CAAC,CAC5F,CAAC;QAEF,OAAO,CAAC,CAAC,CACP,CAAA,kBAAkB,aAAlB,kBAAkB,uBAAlB,kBAAkB,CAAE,eAAe;aACnC,kBAAkB,aAAlB,kBAAkB,uBAAlB,kBAAkB,CAAE,OAAO,CAAA;aAC3B,kBAAkB,aAAlB,kBAAkB,uBAAlB,kBAAkB,CAAE,UAAU,CAAA;YAC9B,QAAQ,CACT,CAAC;IACJ,CAAC,CAAC;IAEF,MAAM,YAAY,GAAG,wBAAwB,EAAE;QAC7C,CAAC,CAAC,GAAG,EAAE;;YAAC,OAAA,CACJ,oBAAC,KAAK,IAAC,UAAU,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE,WAAW,EAAE,QAAQ,EAAE;gBACvD,kBAAkB,CAAC,UAAU,IAAI,CAChC,oBAAC,KAAK,IACJ,UAAU,EAAE,IAAI,EAChB,MAAM,EAAE,EAAE,WAAW,EAAE,QAAQ,EAAE,EACjC,KAAK,EAAE;wBACL,UAAU,EAAE,QAAQ;wBACpB,OAAO,EAAE,eAAe;wBACxB,eAAe,EAAE,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,OAAO,CAAC,cAAc;wBAC9C,YAAY,EAAE,QAAQ;qBACvB;oBAEA,kBAAkB,CAAC,UAAU,CAAC,uBAAuB,IAAI,CACxD,oBAAC,KAAK,CAAC,IAAI;wBACT,oBAAC,IAAI,QAAE,MAAA,kBAAkB,CAAC,UAAU,0CAAE,uBAAuB,CAAQ,CAC1D,CACd;oBACD,oBAAC,KAAK,CAAC,IAAI;wBACT,oBAAC,cAAc,OAAG,CACP,CACP,CACT;gBACA,kBAAkB,CAAC,eAAe,IAAI,CACrC,oBAAC,IAAI,IACH,QAAQ,EAAC,iCAAiC,EAC1C,SAAS,EAAE,UAAU,EACrB,SAAS,EAAE,OAAO,CAAC,gBAAgB,GACnC,CACH;gBACA,kBAAkB,CAAC,SAAS,IAAI,oBAAC,IAAI,IAAC,QAAQ,EAAC,4BAA4B,EAAC,SAAS,EAAE,UAAU,GAAI;gBACrG,QAAQ,IAAI,oBAAC,IAAI,IAAC,QAAQ,EAAC,uBAAuB,EAAC,SAAS,EAAE,UAAU,GAAI;gBAE3E,+CAA+C,CAAC,kBAAkB,CAAC,WAAW;oBAC9E,CAAC,kBAAkB,CAAC,WAAW,CAAC,gBAAgB,CAAC,CAAC,CAAC,CACjD,oBAAC,IAAI,IACH,QAAQ,EAAC,+BAA+B,EACxC,SAAS,EAAE,UAAU,EACrB,SAAS,EAAE,OAAO,CAAC,cAAc,GACjC,CACH,CAAC,CAAC,CAAC,SAAS;gBAGb,+CAA+C,CAAC,kBAAkB,CAAC,WAAW;oBAC9E,CAAC,CAAA,MAAA,kBAAkB,CAAC,WAAW,0CAAE,gBAAgB,CAAA,CAAC,CAAC,CAAC,CAClD,oBAAC,IAAI,IAAC,QAAQ,EAAC,4BAA4B,EAAC,SAAS,EAAE,UAAU,EAAE,SAAS,EAAE,OAAO,CAAC,cAAc,GAAI,CACzG,CAAC,CAAC,CAAC,SAAS;gBAGb,+CAA+C,CAAC,CAAC,kBAAkB,CAAC,WAAW;oBAC7E,CAAC,CAAC,kBAAkB,CAAC,WAAW,CAAC,gBAAgB;oBACjD,CAAC,CAAC,IAAI,CAAC,IAAI,kBAAkB,CAAC,OAAO,CAAC,CAAC,CAAC,CACxC,oBAAC,IAAI,IAAC,QAAQ,EAAC,uBAAuB,EAAC,SAAS,EAAE,UAAU,EAAE,SAAS,EAAE,OAAO,CAAC,cAAc,GAAI,CACpG,CAAC,CAAC,CAAC,SAAS,CAET,CACT,CAAA;SAAA;QACH,CAAC,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC;IAEf,MAAM,2BAA2B,GAC/B,CAAA,kBAAkB,aAAlB,kBAAkB,uBAAlB,kBAAkB,CAAE,UAAU,KAAI,cAAc;QAC9C,CAAC,CAAC,CACE,MAAe,EACf,OAA6B,EAC7B,eAA6D,EAC7D,EAAE,CACF,cAAc,CACZ,MAAM,kCACD,OAAO,KAAE,MAAM,EAAE,EAAE,IAAI,EAAE,EAAE,MAAM,EAAE,cAAc,CAAC,aAAa,EAAE,EAAE,KACxE,eAAe,CAChB;QACL,CAAC,CAAC,cAAc,CAAC;IAErB,MAAM,iBAAiB,GACrB,MAAA,CAAC,SAAS,IAAI,SAAS,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,uCAAuC,CAAC,CAAC,CAAC,SAAS,CAAC,mCAClG,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,wBAAwB,CAAC;IACpC,MAAM,SAAS,GAAG,aAAa,CAAC,iBAAiB,aAAjB,iBAAiB,cAAjB,iBAAiB,GAAI,EAAE,EAAE;QACvD,WAAW,EAAE,WAAW,aAAX,WAAW,cAAX,WAAW,GAAI,EAAE;QAC9B,eAAe,EAAE,MAAA,4BAA4B,CAAC,kBAAkB,EAAE,OAAO,CAAC,mCAAI,EAAE;QAChF,UAAU,EAAE,MAAA,CAAC,kBAAkB,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,cAAc,CAAC,CAAC,CAAC,SAAS,CAAC,mCAAI,EAAE;QACpF,gBAAgB,EACd,MAAA,CAAC,CAAA,MAAA,kBAAkB,CAAC,WAAW,0CAAE,gBAAgB,MAAK,KAAK,CAAC,CAAC,CAAC,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,oBAAoB,CAAC,CAAC,CAAC,SAAS,CAAC,mCAAI,EAAE;QAChH,mBAAmB,EACjB,MAAA,CAAC,CAAA,MAAA,kBAAkB,CAAC,WAAW,0CAAE,gBAAgB,MAAK,KAAK,CAAC,CAAC,CAAC,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,uBAAuB,CAAC,CAAC,CAAC,SAAS,CAAC,mCAAI,EAAE;QACnH,YAAY,EAAE,MAAA,CAAC,kBAAkB,CAAC,eAAe,CAAC,CAAC,CAAC,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,gBAAgB,CAAC,CAAC,CAAC,SAAS,CAAC,mCAAI,EAAE;QAChG,eAAe,EACb,MAAA,CAAC,CAAA,MAAA,kBAAkB,CAAC,UAAU,0CAAE,uBAAuB;YACrD,CAAC,CAAC,aAAa,CAAC,MAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,mBAAmB,mCAAI,EAAE,EAAE;gBAChD,QAAQ,EAAE,MAAA,MAAA,MAAA,kBAAkB,CAAC,UAAU,0CAAE,uBAAuB,0CAAE,QAAQ,EAAE,mCAAI,EAAE;aACnF,CAAC;YACJ,CAAC,CAAC,SAAS,CAAC,mCAAI,EAAE;KACvB,CAAC,CAAC;IAEH,OAAO,CACL,oBAAC,eAAe,IACd,MAAM,EAAE,MAAM,EACd,GAAG,EAAE,WAAW,CAAC,MAAM,EACvB,MAAM,EAAE,WAAW,CAAC,MAAM,EAC1B,WAAW,EAAE,WAAW,EACxB,EAAE,EAAE,QAAQ,CAAC,CAAC,CAAC,WAAW,CAAC,MAAM,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,EACtD,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,QAAQ,EAClB,YAAY,EAAE,YAAY,EAC1B,cAAc,EAAE,2BAA2B,EAC3C,OAAO,EAAE,kBAAkB,CAAC,CAAC,CAAC,GAAG,EAAE,CAAC,kBAAkB,aAAlB,kBAAkB,uBAAlB,kBAAkB,CAAG,WAAW,CAAC,CAAC,CAAC,CAAC,SAAS,EACjF,8BAA8B,EAAE,8BAA8B,EAC9D,gBAAgB,EAAE,kBAAkB,CAAC,KAAK,EAC1C,cAAc,EAAE,yBAAyB,EACzC,OAAO,EAAE;YACP,wBAAwB,EAAE,SAAS;SACpC,GACD,CACH,CAAC;AACJ,CAAC,CAAC;AAEF;;GAEG;AACH,MAAM,gBAAgB,GAAG,CAAC,YAA0C,EAAgC,EAAE;IACpG,MAAM,gCAAgC,GAAG,UAAU,WAAuC;QACxF,OAAO,YAAY,IAAI,WAAW,CAAC;IACrC,CAAC,CAAC;IAEF,YAAY,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE;QACzB,IAAI,CAAC,gCAAgC,CAAC,CAAC,CAAC,IAAI,CAAC,gCAAgC,CAAC,CAAC,CAAC,EAAE,CAAC;YACjF,OAAO,CAAC,CAAC;QACX,CAAC;QACD,MAAM,KAAK,GAAG,CAAmC,CAAC;QAClD,MAAM,KAAK,GAAG,CAAmC,CAAC;QAClD,IAAI,KAAK,CAAC,UAAU,IAAI,KAAK,CAAC,UAAU,EAAE,CAAC;YACzC,OAAO,KAAK,CAAC,UAAU,CAAC,uBAAuB,GAAG,KAAK,CAAC,UAAU,CAAC,uBAAuB,CAAC;QAC7F,CAAC;aAAM,IAAI,KAAK,CAAC,UAAU,EAAE,CAAC;YAC5B,OAAO,CAAC,CAAC,CAAC;QACZ,CAAC;aAAM,IAAI,KAAK,CAAC,UAAU,EAAE,CAAC;YAC5B,OAAO,CAAC,CAAC;QACX,CAAC;QACD,OAAO,CAAC,CAAC;IACX,CAAC,CAAC,CAAC;IACH,OAAO,YAAY,CAAC;AACtB,CAAC,CAAC;AAEF,MAAM,+BAA+B,GAAG,CACtC,YAA0C,EAC1C,SAAkB,EAClB,QAA4B,EACE,EAAE;IAChC,IAAI,CAAC,SAAS,IAAI,CAAC,QAAQ,EAAE,CAAC;QAC5B,OAAO,CAAC,GAAG,YAAY,CAAC,CAAC;IAC3B,CAAC;IAED,MAAM,SAAS,GAAG,YAAY,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC;IAEtE,IAAI,SAAS,KAAK,CAAC,CAAC,EAAE,CAAC;QACrB,OAAO,CAAC,GAAG,YAAY,CAAC,CAAC;IAC3B,CAAC;IAED,MAAM,kBAAkB,GAAG,CAAC,GAAG,YAAY,CAAC,CAAC;IAC7C,kBAAkB,CAAC,MAAM,CAAC,SAAS,EAAE,CAAC,CAAC,CAAC;IAExC,OAAO,kBAAkB,CAAC;AAC5B,CAAC,CAAC;AAEF;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,KAA2B,EAAe,EAAE;;IAC1E,MAAM,EACJ,SAAS,GAAG,KAAK,EACjB,QAAQ,EACR,YAAY,EACZ,mBAAmB,EACnB,cAAc,EACd,mBAAmB,EACnB,2BAA2B,EAC3B,8BAA8B;IAC9B,0DAA0D;IAC1D,qBAAqB;IACrB,0DAA0D;IAC1D,OAAO,EACP,yBAAyB,EACzB,kBAAkB,EACnB,GAAG,KAAK,CAAC;IAEV,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IACzB,MAAM,GAAG,GAAG,cAAc,EAAE,CAAC;IAC7B,MAAM,sBAAsB,GAAG,SAAS,EAAE,CAAC,OAAO,CAAC,eAAe,CAAC;IACnE,0DAA0D;IAC1D,MAAM,sBAAsB,GAAG,SAAS,EAAE,CAAC,OAAO,CAAC,eAAe,CAAC;IAEnE,MAAM,qBAAqB,GAAiC,OAAO,CAAC,GAAG,EAAE;QACvE,OAAO,mBAAmB,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,+BAA+B,CAAC,YAAY,EAAE,SAAS,EAAE,QAAQ,CAAC,CAAC;IACjH,CAAC,EAAE,CAAC,YAAY,EAAE,SAAS,EAAE,QAAQ,EAAE,mBAAmB,CAAC,CAAC,CAAC;IAE7D,gBAAgB,CAAC,qBAAqB,CAAC,CAAC;IAExC,MAAM,0BAA0B,GAAG,WAAW,CAC5C,CAAC,WAAuC,EAAyB,EAAE;;QACjE,IAAI,SAAS,GAA0B,EAAE,CAAC;QAE1C,MAAM,sBAAsB,GAAG,WAAW,CAAC,WAAW,CAAC;QACvD,IAAI,WAAW,CAAC,MAAM,KAAK,QAAQ,IAAI,mBAAmB,IAAI,sBAAsB,EAAE,CAAC;YACrF,SAAS,CAAC,IAAI,CAAC;gBACb,GAAG,EAAE,QAAQ;gBACb,IAAI,EAAE,sBAAsB,CAAC,iBAAiB;gBAC9C,OAAO,EAAE,GAAG,EAAE,CAAC,mBAAmB,CAAC,WAAW,CAAC,MAAM,CAAC;gBACtD,SAAS,EAAE;oBACT,MAAM,EAAE,MAAA,MAAA,KAAK,CAAC,MAAM,0CAAE,qBAAqB,0CAAE,6BAA6B;iBAC3E;gBACD,SAAS,EAAE;oBACT,QAAQ,EAAE,8BAA8B;oBACxC,MAAM,EAAE,EAAE,IAAI,EAAE,EAAE,UAAU,EAAE,CAAC,EAAE,EAAE;iBACpC;gBACD,YAAY,EAAE,GAAG,CAAC,sCAAsC;aACzD,CAAC,CAAC;QACL,CAAC;QAED,IAAI,2BAA2B,EAAE,CAAC;YAChC,SAAS,GAAG,2BAA2B,CAAC,WAAW,CAAC,MAAM,EAAE,QAAQ,EAAE,SAAS,CAAC,CAAC;QACnF,CAAC;QAED,OAAO,SAAS,CAAC;IACnB,CAAC,EACD;QACE,GAAG,CAAC,sCAAsC;QAC1C,QAAQ;QACR,2BAA2B;QAC3B,mBAAmB;QACnB,MAAA,MAAA,KAAK,CAAC,MAAM,0CAAE,qBAAqB,0CAAE,6BAA6B;QAClE,sBAAsB,CAAC,iBAAiB;KACzC,CACF,CAAC;IAEF,MAAM,qBAAqB,GAAG,OAAO,CACnC,GAAG,EAAE,WAAC,OAAA,KAAK,CAAC,wBAAwB,EAAE,MAAA,KAAK,CAAC,MAAM,0CAAE,qBAAqB,CAAC,CAAA,EAAA,EAC1E,CAAC,MAAA,KAAK,CAAC,MAAM,0CAAE,qBAAqB,CAAC,CACtC,CAAC;IAEF,0DAA0D;IAC1D,MAAM,8BAA8B,GAClC,MAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,wBAAwB,mCAAI,sBAAsB,aAAtB,sBAAsB,uBAAtB,sBAAsB,CAAE,wBAAwB,CAAC;IAExF,OAAO,CACL,oBAAC,KAAK,kBACQ,GAAG,CAAC,eAAe,EAC/B,SAAS,EAAE,WAAW,CAAC,oBAAoB,EAAE,MAAA,KAAK,CAAC,MAAM,0CAAE,IAAI,CAAC,EAChE,IAAI,EAAE,MAAM;QAEX,qBAAqB,CAAC,GAAG,CAAC,CAAC,WAAuC,EAAE,EAAE,CACrE,mBAAmB;YACjB,CAAC,CAAC,mBAAmB,CAAC,WAAW,CAAC;YAClC,CAAC,CAAC,0BAA0B,CACxB,WAAW,EACX,sBAAsB,EACtB,QAAQ,EACR,cAAc,EACd,0BAA0B,EAC1B,qBAAqB,EACrB,KAAK,CAAC,kBAAkB,EACxB,8BAA8B,EAC9B,yBAAyB,EACzB,KAAK,EACL,kBAAkB,CACnB,CACN;QAEC,0DAA0D,CAAC,8BAA8B;YACvF,qBAAqB;YACrB,qBAAqB,GAAG,qBAAqB,CAAC,MAAM,IAAI,CACtD,oBAAC,IAAI,IAAC,KAAK,EAAE,EAAE,UAAU,EAAE,GAAG,EAAE,MAAM,EAAE,QAAQ,EAAE,IAC/C,aAAa,CAAC,8BAA8B,EAAE;YAC7C,aAAa,EAAE,GAAG,qBAAqB,GAAG,qBAAqB,CAAC,MAAM,EAAE;SACzE,CAAC,CACG,CACR,CAEC,CACT,CAAC;AACJ,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport {\n Icon,\n IContextualMenuItem,\n IContextualMenuItemStyles,\n merge,\n mergeStyles,\n PersonaPresence,\n Stack,\n Theme\n} from '@fluentui/react';\nimport { Text } from '@fluentui/react';\nimport { useTheme, CallingTheme } from '../theming';\nimport { RaisedHandIcon } from './assets/RaisedHandIcon';\nimport React, { useCallback, useMemo } from 'react';\nimport { useIdentifiers } from '../identifiers';\nimport { useLocale } from '../localization';\nimport {\n BaseCustomStyles,\n CallParticipantListParticipant,\n OnRenderAvatarCallback,\n ParticipantListParticipant\n} from '../types';\nimport { CustomAvatarOptions } from '../types';\nimport {\n formatParticipantStateString,\n ParticipantItem,\n ParticipantItemStrings,\n ParticipantItemStyles\n} from './ParticipantItem';\nimport { iconStyles, participantListItemStyle, participantListStyle } from './styles/ParticipantList.styles';\nimport { _formatString } from '@internal/acs-ui-common';\n\n/*\n Styles for the {@link ParticipantList} {@link ParticipantItem}.\n \n @public\n /\nexport interface ParticipantListItemStyles extends ParticipantItemStyles {\n /* Styles applied to the sub-menu of the {@link ParticipantList} {@link ParticipantItem}. /\n participantSubMenuItemsStyles?: IContextualMenuItemStyles;\n}\n\n/\n Styles for the {@link ParticipantList}.\n \n @public\n /\nexport interface ParticipantListStyles extends BaseCustomStyles {\n /* Styles for the {@link ParticipantList} {@link ParticipantItem}. /\n participantItemStyles?: ParticipantListItemStyles;\n}\n\n/ @conditional-compile-remove(total-participant-count) /\n/\n Strings for the {@link ParticipantList}.\n \n @beta\n /\nexport interface ParticipantListStrings {\n /\n String for rendering the count of participants not contained in the displayed participant list\n /\n overflowParticipantCount?: string;\n}\n\n/\n A callback for providing custom menu items for each participant in {@link ParticipantList}.\n \n @public\n /\nexport type ParticipantMenuItemsCallback = (\n participantUserId: string,\n userId?: string,\n defaultMenuItems?: IContextualMenuItem[]\n) => IContextualMenuItem[];\n\n/\n Props for {@link ParticipantList}.\n \n @public\n /\nexport type ParticipantListProps = {\n /* Participants in user call or chat /\n participants: ParticipantListParticipant[];\n /* User ID of user /\n myUserId?: string;\n /\n If set to `true`, excludes the local participant from the participant list with use of `myUserId` props (required in this case).\n \n @defaultValue `false`\n /\n excludeMe?: boolean;\n /* Optional callback to render each participant. If no callback is provided, each participant will be rendered with `ParticipantItem` /\n onRenderParticipant?: (participant: ParticipantListParticipant) => JSX.Element \| null;\n /* Optional callback to render the avatar for each participant. This property will have no effect if `onRenderParticipant` is assigned. /\n onRenderAvatar?: OnRenderAvatarCallback;\n /* Optional callback to render the context menu for each participant /\n onRemoveParticipant?: (userId: string) => void;\n /* Optional callback to render custom menu items for each participant. /\n onFetchParticipantMenuItems?: ParticipantMenuItemsCallback;\n /* Optional callback when rendered ParticipantItem is clicked /\n onParticipantClick?: (participant?: ParticipantListParticipant) => void;\n /* Optional callback to render a context menu to mute a participant /\n onMuteParticipant?: (userId: string) => Promise<void>;\n styles?: ParticipantListStyles;\n /* Optional value to determine if the tooltip should be shown for participants or not /\n showParticipantOverflowTooltip?: boolean;\n / @conditional-compile-remove(total-participant-count) /\n /* Total number of people in the call. This number can be larger than the remote participant count. /\n totalParticipantCount?: number;\n / @conditional-compile-remove(total-participant-count) /\n /* Strings for the participant list /\n strings?: ParticipantListStrings;\n /* Optional aria-labelledby prop that prefixes each ParticipantItem aria-label /\n participantAriaLabelledBy?: string;\n /* List of pinned participants /\n pinnedParticipants?: string[];\n};\n\nconst onRenderParticipantDefault = (\n participant: ParticipantListParticipant,\n strings: ParticipantItemStrings,\n myUserId?: string,\n onRenderAvatar?: OnRenderAvatarCallback,\n createParticipantMenuItems?: (participant: ParticipantListParticipant) => IContextualMenuItem[],\n styles?: ParticipantListItemStyles,\n onParticipantClick?: (participant?: ParticipantListParticipant) => void,\n showParticipantOverflowTooltip?: boolean,\n participantAriaLabelledBy?: string,\n theme?: Theme,\n pinnedParticipants?: string[]\n): JSX.Element \| null => {\n const callingParticipant = participant as CallParticipantListParticipant;\n\n let presence: PersonaPresence \| undefined = undefined;\n if (callingParticipant) {\n presence = PersonaPresence.none;\n }\n\n const menuItems = createParticipantMenuItems && createParticipantMenuItems(participant);\n\n const formatDisplayName = (displayName?: string): string \| undefined => {\n if (displayName && strings.attendeeRole) {\n return _formatString(displayName, { AttendeeRole: strings.attendeeRole });\n }\n return displayName;\n };\n const displayName = formatDisplayName(participant.displayName);\n\n const callingPalette = (theme as unknown as CallingTheme).callingPalette;\n\n const isPinned = pinnedParticipants && pinnedParticipants?.includes(participant.userId);\n\n const showRenderIconTrampoline = (): boolean => {\n / @conditional-compile-remove(media-access) /\n return !!(\n callingParticipant?.isScreenSharing \|\|\n callingParticipant?.isMuted \|\|\n callingParticipant?.raisedHand \|\|\n isPinned \|\|\n !(callingParticipant?.mediaAccess ? callingParticipant.mediaAccess.isAudioPermitted : true) \|\|\n !(callingParticipant?.mediaAccess ? callingParticipant.mediaAccess.isVideoPermitted : true)\n );\n\n return !!(\n callingParticipant?.isScreenSharing \|\|\n callingParticipant?.isMuted \|\|\n callingParticipant?.raisedHand \|\|\n isPinned\n );\n };\n\n const onRenderIcon = showRenderIconTrampoline()\n ? () => (\n <Stack horizontal={true} tokens={{ childrenGap: '0.5rem' }}>\n {callingParticipant.raisedHand && (\n <Stack\n horizontal={true}\n tokens={{ childrenGap: '0.2rem' }}\n style={{\n alignItems: 'center',\n padding: '0.1rem 0.2rem',\n backgroundColor: theme?.palette.neutralLighter,\n borderRadius: '0.3rem'\n }}\n >\n {callingParticipant.raisedHand.raisedHandOrderPosition && (\n <Stack.Item>\n <Text>{callingParticipant.raisedHand?.raisedHandOrderPosition}</Text>\n </Stack.Item>\n )}\n <Stack.Item>\n <RaisedHandIcon />\n </Stack.Item>\n </Stack>\n )}\n {callingParticipant.isScreenSharing && (\n <Icon\n iconName=\"ParticipantItemScreenShareStart\"\n className={iconStyles}\n ariaLabel={strings.sharingIconLabel}\n />\n )}\n {callingParticipant.spotlight && <Icon iconName=\"ParticipantItemSpotlighted\" className={iconStyles} />}\n {isPinned && <Icon iconName=\"ParticipantItemPinned\" className={iconStyles} />}\n {\n / @conditional-compile-remove(media-access) / callingParticipant.mediaAccess &&\n !callingParticipant.mediaAccess.isVideoPermitted ? (\n <Icon\n iconName=\"ControlButtonCameraProhibited\"\n className={iconStyles}\n ariaLabel={strings.mutedIconLabel}\n />\n ) : undefined\n }\n {\n / @conditional-compile-remove(media-access) / callingParticipant.mediaAccess &&\n !callingParticipant.mediaAccess?.isAudioPermitted ? (\n <Icon iconName=\"ControlButtonMicProhibited\" className={iconStyles} ariaLabel={strings.mutedIconLabel} />\n ) : undefined\n }\n {\n / @conditional-compile-remove(media-access) / (callingParticipant.mediaAccess\n ? callingParticipant.mediaAccess.isAudioPermitted\n : true) && callingParticipant.isMuted ? (\n <Icon iconName=\"ParticipantItemMicOff\" className={iconStyles} ariaLabel={strings.mutedIconLabel} />\n ) : undefined\n }\n </Stack>\n )\n : () => null;\n\n const onRenderAvatarWithRaiseHand =\n callingParticipant?.raisedHand && onRenderAvatar\n ? (\n userId?: string,\n options?: CustomAvatarOptions,\n defaultOnRender?: (props: CustomAvatarOptions) => JSX.Element\n ) =>\n onRenderAvatar(\n userId,\n { ...options, styles: { root: { border: callingPalette.raiseHandGold } } },\n defaultOnRender\n )\n : onRenderAvatar;\n\n const ariaLabelTemplate =\n (menuItems && menuItems.length > 0 ? strings?.participantItemWithMoreOptionsAriaLabel : undefined) ??\n strings?.participantItemAriaLabel;\n const ariaLabel = _formatString(ariaLabelTemplate ?? '', {\n displayName: displayName ?? '',\n connectionState: formatParticipantStateString(callingParticipant, strings) ?? '',\n mutedState: (callingParticipant.isMuted ? strings?.mutedIconLabel : undefined) ?? '',\n micDisabledState:\n (callingParticipant.mediaAccess?.isAudioPermitted === false ? strings?.micDisabledIconLabel : undefined) ?? '',\n cameraDisabledState:\n (callingParticipant.mediaAccess?.isVideoPermitted === false ? strings?.cameraDisabledIconLabel : undefined) ?? '',\n sharingState: (callingParticipant.isScreenSharing ? strings?.sharingIconLabel : undefined) ?? '',\n handRaisedState:\n (callingParticipant.raisedHand?.raisedHandOrderPosition\n ? _formatString(strings?.handRaisedIconLabel ?? '', {\n position: callingParticipant.raisedHand?.raisedHandOrderPosition?.toString() ?? ''\n })\n : undefined) ?? ''\n });\n\n return (\n <ParticipantItem\n styles={styles}\n key={participant.userId}\n userId={participant.userId}\n displayName={displayName}\n me={myUserId ? participant.userId === myUserId : false}\n menuItems={menuItems}\n presence={presence}\n onRenderIcon={onRenderIcon}\n onRenderAvatar={onRenderAvatarWithRaiseHand}\n onClick={onParticipantClick ? () => onParticipantClick?.(participant) : undefined}\n showParticipantOverflowTooltip={showParticipantOverflowTooltip}\n participantState={callingParticipant.state}\n ariaLabelledBy={participantAriaLabelledBy}\n strings={{\n participantItemAriaLabel: ariaLabel\n }}\n />\n );\n};\n\n/\n Sort participants by raised hand order position\n /\nconst sortParticipants = (participants: ParticipantListParticipant[]): ParticipantListParticipant[] => {\n const isParticipantListCallParticipant = function (participant: ParticipantListParticipant): boolean {\n return 'raisedHand' in participant;\n };\n\n participants.sort((a, b) => {\n if (!isParticipantListCallParticipant(a) \|\| !isParticipantListCallParticipant(b)) {\n return 0;\n }\n const callA = a as CallParticipantListParticipant;\n const callB = b as CallParticipantListParticipant;\n if (callA.raisedHand && callB.raisedHand) {\n return callA.raisedHand.raisedHandOrderPosition - callB.raisedHand.raisedHandOrderPosition;\n } else if (callA.raisedHand) {\n return -1;\n } else if (callB.raisedHand) {\n return 1;\n }\n return 0;\n });\n return participants;\n};\n\nconst getParticipantsForDefaultRender = (\n participants: ParticipantListParticipant[],\n excludeMe: boolean,\n myUserId: string \| undefined\n): ParticipantListParticipant[] => {\n if (!excludeMe \|\| !myUserId) {\n return [...participants];\n }\n\n const userIndex = participants.map((p) => p.userId).indexOf(myUserId);\n\n if (userIndex === -1) {\n return [...participants];\n }\n\n const remoteParticipants = [...participants];\n remoteParticipants.splice(userIndex, 1);\n\n return remoteParticipants;\n};\n\n/\n Component to render all calling or chat participants.\n \n By default, each participant is rendered with {@link ParticipantItem}. See {@link ParticipantListProps.onRenderParticipant} to override.\n \n @public\n /\nexport const ParticipantList = (props: ParticipantListProps): JSX.Element => {\n const {\n excludeMe = false,\n myUserId,\n participants,\n onRemoveParticipant,\n onRenderAvatar,\n onRenderParticipant,\n onFetchParticipantMenuItems,\n showParticipantOverflowTooltip,\n / @conditional-compile-remove(total-participant-count) /\n totalParticipantCount,\n / @conditional-compile-remove(total-participant-count) /\n strings,\n participantAriaLabelledBy,\n pinnedParticipants\n } = props;\n\n const theme = useTheme();\n const ids = useIdentifiers();\n const participantItemStrings = useLocale().strings.participantItem;\n / @conditional-compile-remove(total-participant-count) /\n const participantListStrings = useLocale().strings.ParticipantList;\n\n const displayedParticipants: ParticipantListParticipant[] = useMemo(() => {\n return onRenderParticipant ? participants : getParticipantsForDefaultRender(participants, excludeMe, myUserId);\n }, [participants, excludeMe, myUserId, onRenderParticipant]);\n\n sortParticipants(displayedParticipants);\n\n const createParticipantMenuItems = useCallback(\n (participant: ParticipantListParticipant): IContextualMenuItem[] => {\n let menuItems: IContextualMenuItem[] = [];\n\n const participantIsRemovable = participant.isRemovable;\n if (participant.userId !== myUserId && onRemoveParticipant && participantIsRemovable) {\n menuItems.push({\n key: 'remove',\n text: participantItemStrings.removeButtonLabel,\n onClick: () => onRemoveParticipant(participant.userId),\n itemProps: {\n styles: props.styles?.participantItemStyles?.participantSubMenuItemsStyles\n },\n iconProps: {\n iconName: 'ContextMenuRemoveParticipant',\n styles: { root: { lineHeight: 0 } }\n },\n 'data-ui-id': ids.participantListRemoveParticipantButton\n });\n }\n\n if (onFetchParticipantMenuItems) {\n menuItems = onFetchParticipantMenuItems(participant.userId, myUserId, menuItems);\n }\n\n return menuItems;\n },\n [\n ids.participantListRemoveParticipantButton,\n myUserId,\n onFetchParticipantMenuItems,\n onRemoveParticipant,\n props.styles?.participantItemStyles?.participantSubMenuItemsStyles,\n participantItemStrings.removeButtonLabel\n ]\n );\n\n const participantItemStyles = useMemo(\n () => merge(participantListItemStyle, props.styles?.participantItemStyles),\n [props.styles?.participantItemStyles]\n );\n\n / @conditional-compile-remove(total-participant-count) /\n const overflowParticipantCountString =\n strings?.overflowParticipantCount ?? participantListStrings?.overflowParticipantCount;\n\n return (\n <Stack\n data-ui-id={ids.participantList}\n className={mergeStyles(participantListStyle, props.styles?.root)}\n role={'menu'}\n >\n {displayedParticipants.map((participant: ParticipantListParticipant) =>\n onRenderParticipant\n ? onRenderParticipant(participant)\n : onRenderParticipantDefault(\n participant,\n participantItemStrings,\n myUserId,\n onRenderAvatar,\n createParticipantMenuItems,\n participantItemStyles,\n props.onParticipantClick,\n showParticipantOverflowTooltip,\n participantAriaLabelledBy,\n theme,\n pinnedParticipants\n )\n )}\n {\n / @conditional-compile-remove(total-participant-count) */ overflowParticipantCountString &&\n totalParticipantCount &&\n totalParticipantCount > displayedParticipants.length && (\n <Text style={{ fontWeight: 400, margin: '0.5rem' }}>\n {_formatString(overflowParticipantCountString, {\n overflowCount: `${totalParticipantCount - displayedParticipants.length}`\n })}\n </Text>\n )\n }\n </Stack>\n );\n};\n"]}

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

@@ -51,7 +51,7 @@ export const useVideoTileContextualMenuProps = (props) => {
                     styles: { root: { lineHeight: 0 } }
                 },
                 onClick: () => onPermitAudio([participant.userId]),
-                'data-ui-id': 'audio-tile-permit-audio',
+                'data-ui-id': 'video-tile-permit-audio',
                 ariaLabel: strings === null || strings === void 0 ? void 0 : strings.permitAudioTileMenuLabel
             });
         }
@@ -65,7 +65,7 @@ export const useVideoTileContextualMenuProps = (props) => {
                     styles: { root: { lineHeight: 0 } }
                 },
                 onClick: () => onForbidAudio([participant.userId]),
-                'data-ui-id': 'audio-tile-forbid-audio',
+                'data-ui-id': 'video-tile-forbid-audio',
                 ariaLabel: strings === null || strings === void 0 ? void 0 : strings.forbidAudioTileMenuLabel
             });
         }

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

	@@ -1 +1 @@
1	- {"version":3,"file":"useVideoTileContextualMenuProps.js","sourceRoot":"","sources":["../../../../../../../react-components/src/components/VideoGallery/useVideoTileContextualMenuProps.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { IContextualMenuItem, IContextualMenuProps } from '@fluentui/react';\nimport { _formatString } from '@internal/acs-ui-common';\nimport { useMemo } from 'react';\nimport { VideoGalleryParticipant, ViewScalingMode } from '../../types';\nimport { _preventDismissOnEvent as preventDismissOnEvent } from '@internal/acs-ui-common';\n\n/*\n @private\n /\nexport const useVideoTileContextualMenuProps = (props: {\n participant: VideoGalleryParticipant;\n strings?: {\n fitRemoteParticipantToFrame?: string;\n fillRemoteParticipantFrame?: string;\n pinParticipantForMe?: string;\n pinParticipantForMeLimitReached?: string;\n unpinParticipantForMe?: string;\n pinParticipantMenuItemAriaLabel?: string;\n unpinParticipantMenuItemAriaLabel?: string;\n pinnedParticipantAnnouncementAriaLabel?: string;\n unpinnedParticipantAnnouncementAriaLabel?: string;\n startSpotlightVideoTileMenuLabel?: string;\n addSpotlightVideoTileMenuLabel?: string;\n stopSpotlightVideoTileMenuLabel?: string;\n stopSpotlightOnSelfVideoTileMenuLabel?: string;\n spotlightLimitReachedMenuTitle?: string;\n muteParticipantMenuItemLabel?: string;\n / @conditional-compile-remove(media-access) /\n forbidAudioTileMenuLabel?: string;\n / @conditional-compile-remove(media-access) /\n permitAudioTileMenuLabel?: string;\n / @conditional-compile-remove(media-access) /\n forbidVideoTileMenuLabel?: string;\n / @conditional-compile-remove(media-access) /\n permitVideoTileMenuLabel?: string;\n };\n view?: { updateScalingMode: (scalingMode: ViewScalingMode) => Promise<void> };\n isPinned?: boolean;\n onPinParticipant?: (userId: string) => void;\n onUnpinParticipant?: (userId: string) => void;\n onUpdateScalingMode?: (userId: string, scalingMode: ViewScalingMode) => void;\n disablePinMenuItem?: boolean;\n toggleAnnouncerString?: (announcerString: string) => void;\n isSpotlighted?: boolean;\n spotlightedParticipantUserIds?: string[];\n onStartSpotlight?: (userIds: string[]) => void;\n onStopSpotlight?: (userIds: string[]) => void;\n maxParticipantsToSpotlight?: number;\n myUserId?: string;\n onMuteParticipant?: (userId: string) => void;\n / @conditional-compile-remove(media-access) /\n onForbidAudio?: (userIds: string[]) => void;\n / @conditional-compile-remove(media-access) /\n onPermitAudio?: (userIds: string[]) => void;\n / @conditional-compile-remove(media-access) /\n onForbidVideo?: (userIds: string[]) => void;\n / @conditional-compile-remove(media-access) /\n onPermitVideo?: (userIds: string[]) => void;\n}): IContextualMenuProps \| undefined => {\n const {\n participant,\n view,\n strings,\n isPinned,\n onPinParticipant,\n onUnpinParticipant,\n onUpdateScalingMode,\n disablePinMenuItem,\n toggleAnnouncerString,\n spotlightedParticipantUserIds = [],\n isSpotlighted,\n onStartSpotlight,\n onStopSpotlight,\n maxParticipantsToSpotlight,\n myUserId,\n onMuteParticipant,\n / @conditional-compile-remove(media-access) /\n onForbidAudio,\n / @conditional-compile-remove(media-access) /\n onPermitAudio,\n / @conditional-compile-remove(media-access) /\n onForbidVideo,\n / @conditional-compile-remove(media-access) /\n onPermitVideo\n } = props;\n const scalingMode = useMemo(() => {\n return props.participant.videoStream?.scalingMode;\n }, [props.participant.videoStream?.scalingMode]);\n\n const contextualMenuProps: IContextualMenuProps \| undefined = useMemo(() => {\n const items: IContextualMenuItem[] = [];\n if (onMuteParticipant && strings?.muteParticipantMenuItemLabel) {\n items.push({\n key: 'mute',\n text: strings?.muteParticipantMenuItemLabel,\n iconProps: {\n iconName: 'ContextualMenuMicMutedIcon',\n styles: { root: { lineHeight: 0 } }\n },\n onClick: () => onMuteParticipant(participant.userId),\n 'data-ui-id': 'video-tile-mute-participant',\n ariaLabel: strings?.muteParticipantMenuItemLabel,\n disabled: participant.isMuted\n });\n }\n\n / @conditional-compile-remove(media-access) /\n if (\n participant.canAudioBeForbidden &&\n participant.mediaAccess &&\n !participant.mediaAccess.isAudioPermitted &&\n onPermitAudio\n ) {\n items.push({\n key: 'permitAudio',\n text: strings?.permitAudioTileMenuLabel,\n iconProps: {\n iconName: 'ControlButtonMicOn',\n styles: { root: { lineHeight: 0 } }\n },\n onClick: () => onPermitAudio([participant.userId]),\n 'data-ui-id': 'audio-tile-permit-audio',\n ariaLabel: strings?.permitAudioTileMenuLabel\n });\n }\n / @conditional-compile-remove(media-access) /\n if (participant.canAudioBeForbidden && participant.mediaAccess?.isAudioPermitted && onForbidAudio) {\n items.push({\n key: 'forbidAudio',\n text: strings?.forbidAudioTileMenuLabel,\n iconProps: {\n iconName: 'ControlButtonMicProhibited',\n styles: { root: { lineHeight: 0 } }\n },\n onClick: () => onForbidAudio([participant.userId]),\n 'data-ui-id': 'audio-tile-forbid-audio',\n ariaLabel: strings?.forbidAudioTileMenuLabel\n });\n }\n\n / @conditional-compile-remove(media-access) /\n if (\n participant.canVideoBeForbidden &&\n participant.mediaAccess &&\n !participant.mediaAccess.isVideoPermitted &&\n onPermitVideo\n ) {\n items.push({\n key: 'permitVideo',\n text: strings?.permitVideoTileMenuLabel,\n iconProps: {\n iconName: 'ControlButtonCameraOn',\n styles: { root: { lineHeight: 0 } }\n },\n onClick: () => onPermitVideo([participant.userId]),\n 'data-ui-id': 'video-tile-permit-video',\n ariaLabel: strings?.permitVideoTileMenuLabel\n });\n }\n / @conditional-compile-remove(media-access) /\n if (participant.canVideoBeForbidden && participant.mediaAccess?.isVideoPermitted && onForbidVideo) {\n items.push({\n key: 'forbidVideo',\n text: strings?.forbidVideoTileMenuLabel,\n iconProps: {\n iconName: 'ControlButtonCameraProhibited',\n styles: { root: { lineHeight: 0 } }\n },\n onClick: () => onForbidVideo([participant.userId]),\n 'data-ui-id': 'video-tile-forbid-video',\n ariaLabel: strings?.forbidVideoTileMenuLabel\n });\n }\n\n if (isPinned !== undefined) {\n if (isPinned && onUnpinParticipant && strings?.unpinParticipantForMe) {\n let unpinActionString: string \| undefined = undefined;\n if (toggleAnnouncerString && strings.unpinParticipantMenuItemAriaLabel && participant.displayName) {\n unpinActionString = _formatString(strings?.unpinParticipantMenuItemAriaLabel, {\n participantName: participant.displayName\n });\n }\n items.push({\n key: 'unpin',\n text: strings.unpinParticipantForMe,\n iconProps: {\n iconName: 'UnpinParticipant',\n styles: { root: { lineHeight: '1rem', textAlign: 'center' } }\n },\n onClick: () => {\n onUnpinParticipant(participant.userId);\n unpinActionString && toggleAnnouncerString?.(unpinActionString);\n },\n 'data-ui-id': 'video-tile-unpin-participant-button',\n ariaLabel: unpinActionString\n });\n }\n if (!isPinned && onPinParticipant && strings?.pinParticipantForMe) {\n let pinActionString: string \| undefined = undefined;\n if (toggleAnnouncerString && strings.pinnedParticipantAnnouncementAriaLabel && participant.displayName) {\n pinActionString = _formatString(strings?.pinnedParticipantAnnouncementAriaLabel, {\n participantName: participant.displayName\n });\n }\n items.push({\n key: 'pin',\n text: disablePinMenuItem ? strings.pinParticipantForMeLimitReached : strings.pinParticipantForMe,\n iconProps: {\n iconName: 'PinParticipant',\n styles: { root: { lineHeight: '1rem', textAlign: 'center' } }\n },\n onClick: () => {\n onPinParticipant(participant.userId);\n pinActionString && toggleAnnouncerString?.(pinActionString);\n },\n 'data-ui-id': 'video-tile-pin-participant-button',\n disabled: disablePinMenuItem \|\| isSpotlighted,\n ariaLabel: strings.pinParticipantForMe\n });\n }\n }\n\n if (isSpotlighted) {\n const stopSpotlightMenuLabel =\n myUserId === participant.userId\n ? strings?.stopSpotlightOnSelfVideoTileMenuLabel\n : strings?.stopSpotlightVideoTileMenuLabel;\n if (onStopSpotlight && participant.userId && strings?.stopSpotlightVideoTileMenuLabel) {\n items.push({\n key: 'stopSpotlight',\n text: stopSpotlightMenuLabel,\n iconProps: {\n iconName: 'StopSpotlightContextualMenuItem',\n styles: { root: { lineHeight: 0 } }\n },\n onClick: () => onStopSpotlight([participant.userId]),\n ariaLabel: strings.stopSpotlightVideoTileMenuLabel\n });\n }\n } else {\n const startSpotlightMenuLabel =\n spotlightedParticipantUserIds && spotlightedParticipantUserIds.length > 0\n ? strings?.addSpotlightVideoTileMenuLabel\n : strings?.startSpotlightVideoTileMenuLabel;\n const maxSpotlightedParticipantsReached = maxParticipantsToSpotlight\n ? spotlightedParticipantUserIds.length >= maxParticipantsToSpotlight\n : false;\n if (onStartSpotlight && participant.userId && startSpotlightMenuLabel) {\n items.push({\n key: 'startSpotlight',\n text: startSpotlightMenuLabel,\n iconProps: {\n iconName: 'StartSpotlightContextualMenuItem',\n styles: { root: { lineHeight: 0 } }\n },\n onClick: () => onStartSpotlight([participant.userId]),\n ariaLabel: startSpotlightMenuLabel,\n disabled: maxSpotlightedParticipantsReached,\n title: maxSpotlightedParticipantsReached ? strings?.spotlightLimitReachedMenuTitle : undefined\n });\n }\n }\n if (scalingMode) {\n if (scalingMode === 'Crop' && strings?.fitRemoteParticipantToFrame) {\n items.push({\n key: 'fitRemoteParticipantToFrame',\n text: strings.fitRemoteParticipantToFrame,\n iconProps: {\n iconName: 'VideoTileScaleFit',\n styles: { root: { lineHeight: '1rem', textAlign: 'center' } }\n },\n onClick: () => {\n onUpdateScalingMode?.(participant.userId, 'Fit');\n view?.updateScalingMode('Fit');\n },\n 'data-ui-id': 'video-tile-fit-to-frame',\n ariaLabel: strings.fitRemoteParticipantToFrame\n });\n } else if (scalingMode === 'Fit' && strings?.fillRemoteParticipantFrame) {\n items.push({\n key: 'fillRemoteParticipantFrame',\n text: strings.fillRemoteParticipantFrame,\n iconProps: {\n iconName: 'VideoTileScaleFill',\n styles: { root: { lineHeight: '1rem', textAlign: 'center' } }\n },\n onClick: () => {\n onUpdateScalingMode?.(participant.userId, 'Crop');\n view?.updateScalingMode('Crop');\n },\n 'data-ui-id': 'video-tile-fill-frame',\n ariaLabel: strings.fillRemoteParticipantFrame\n });\n }\n }\n if (items.length === 0) {\n return undefined;\n }\n\n return { items, styles: {}, calloutProps: { preventDismissOnEvent }, shouldFocusOnContainer: false };\n }, [\n onMuteParticipant,\n strings,\n participant.isMuted,\n participant.userId,\n participant.displayName,\n isPinned,\n isSpotlighted,\n scalingMode,\n onUnpinParticipant,\n onPinParticipant,\n toggleAnnouncerString,\n disablePinMenuItem,\n myUserId,\n onStopSpotlight,\n spotlightedParticipantUserIds,\n maxParticipantsToSpotlight,\n onStartSpotlight,\n onUpdateScalingMode,\n view,\n / @conditional-compile-remove(media-access) /\n participant.canAudioBeForbidden,\n / @conditional-compile-remove(media-access) /\n participant.canVideoBeForbidden,\n / @conditional-compile-remove(media-access) /\n participant.mediaAccess,\n / @conditional-compile-remove(media-access) /\n onPermitAudio,\n / @conditional-compile-remove(media-access) /\n onForbidAudio,\n / @conditional-compile-remove(media-access) /\n onPermitVideo,\n / @conditional-compile-remove(media-access) */\n onForbidVideo\n ]);\n\n return contextualMenuProps;\n};\n"]}
1	+ {"version":3,"file":"useVideoTileContextualMenuProps.js","sourceRoot":"","sources":["../../../../../../../react-components/src/components/VideoGallery/useVideoTileContextualMenuProps.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { IContextualMenuItem, IContextualMenuProps } from '@fluentui/react';\nimport { _formatString } from '@internal/acs-ui-common';\nimport { useMemo } from 'react';\nimport { VideoGalleryParticipant, ViewScalingMode } from '../../types';\nimport { _preventDismissOnEvent as preventDismissOnEvent } from '@internal/acs-ui-common';\n\n/*\n @private\n /\nexport const useVideoTileContextualMenuProps = (props: {\n participant: VideoGalleryParticipant;\n strings?: {\n fitRemoteParticipantToFrame?: string;\n fillRemoteParticipantFrame?: string;\n pinParticipantForMe?: string;\n pinParticipantForMeLimitReached?: string;\n unpinParticipantForMe?: string;\n pinParticipantMenuItemAriaLabel?: string;\n unpinParticipantMenuItemAriaLabel?: string;\n pinnedParticipantAnnouncementAriaLabel?: string;\n unpinnedParticipantAnnouncementAriaLabel?: string;\n startSpotlightVideoTileMenuLabel?: string;\n addSpotlightVideoTileMenuLabel?: string;\n stopSpotlightVideoTileMenuLabel?: string;\n stopSpotlightOnSelfVideoTileMenuLabel?: string;\n spotlightLimitReachedMenuTitle?: string;\n muteParticipantMenuItemLabel?: string;\n / @conditional-compile-remove(media-access) /\n forbidAudioTileMenuLabel?: string;\n / @conditional-compile-remove(media-access) /\n permitAudioTileMenuLabel?: string;\n / @conditional-compile-remove(media-access) /\n forbidVideoTileMenuLabel?: string;\n / @conditional-compile-remove(media-access) /\n permitVideoTileMenuLabel?: string;\n };\n view?: { updateScalingMode: (scalingMode: ViewScalingMode) => Promise<void> };\n isPinned?: boolean;\n onPinParticipant?: (userId: string) => void;\n onUnpinParticipant?: (userId: string) => void;\n onUpdateScalingMode?: (userId: string, scalingMode: ViewScalingMode) => void;\n disablePinMenuItem?: boolean;\n toggleAnnouncerString?: (announcerString: string) => void;\n isSpotlighted?: boolean;\n spotlightedParticipantUserIds?: string[];\n onStartSpotlight?: (userIds: string[]) => void;\n onStopSpotlight?: (userIds: string[]) => void;\n maxParticipantsToSpotlight?: number;\n myUserId?: string;\n onMuteParticipant?: (userId: string) => void;\n / @conditional-compile-remove(media-access) /\n onForbidAudio?: (userIds: string[]) => void;\n / @conditional-compile-remove(media-access) /\n onPermitAudio?: (userIds: string[]) => void;\n / @conditional-compile-remove(media-access) /\n onForbidVideo?: (userIds: string[]) => void;\n / @conditional-compile-remove(media-access) /\n onPermitVideo?: (userIds: string[]) => void;\n}): IContextualMenuProps \| undefined => {\n const {\n participant,\n view,\n strings,\n isPinned,\n onPinParticipant,\n onUnpinParticipant,\n onUpdateScalingMode,\n disablePinMenuItem,\n toggleAnnouncerString,\n spotlightedParticipantUserIds = [],\n isSpotlighted,\n onStartSpotlight,\n onStopSpotlight,\n maxParticipantsToSpotlight,\n myUserId,\n onMuteParticipant,\n / @conditional-compile-remove(media-access) /\n onForbidAudio,\n / @conditional-compile-remove(media-access) /\n onPermitAudio,\n / @conditional-compile-remove(media-access) /\n onForbidVideo,\n / @conditional-compile-remove(media-access) /\n onPermitVideo\n } = props;\n const scalingMode = useMemo(() => {\n return props.participant.videoStream?.scalingMode;\n }, [props.participant.videoStream?.scalingMode]);\n\n const contextualMenuProps: IContextualMenuProps \| undefined = useMemo(() => {\n const items: IContextualMenuItem[] = [];\n if (onMuteParticipant && strings?.muteParticipantMenuItemLabel) {\n items.push({\n key: 'mute',\n text: strings?.muteParticipantMenuItemLabel,\n iconProps: {\n iconName: 'ContextualMenuMicMutedIcon',\n styles: { root: { lineHeight: 0 } }\n },\n onClick: () => onMuteParticipant(participant.userId),\n 'data-ui-id': 'video-tile-mute-participant',\n ariaLabel: strings?.muteParticipantMenuItemLabel,\n disabled: participant.isMuted\n });\n }\n\n / @conditional-compile-remove(media-access) /\n if (\n participant.canAudioBeForbidden &&\n participant.mediaAccess &&\n !participant.mediaAccess.isAudioPermitted &&\n onPermitAudio\n ) {\n items.push({\n key: 'permitAudio',\n text: strings?.permitAudioTileMenuLabel,\n iconProps: {\n iconName: 'ControlButtonMicOn',\n styles: { root: { lineHeight: 0 } }\n },\n onClick: () => onPermitAudio([participant.userId]),\n 'data-ui-id': 'video-tile-permit-audio',\n ariaLabel: strings?.permitAudioTileMenuLabel\n });\n }\n / @conditional-compile-remove(media-access) /\n if (participant.canAudioBeForbidden && participant.mediaAccess?.isAudioPermitted && onForbidAudio) {\n items.push({\n key: 'forbidAudio',\n text: strings?.forbidAudioTileMenuLabel,\n iconProps: {\n iconName: 'ControlButtonMicProhibited',\n styles: { root: { lineHeight: 0 } }\n },\n onClick: () => onForbidAudio([participant.userId]),\n 'data-ui-id': 'video-tile-forbid-audio',\n ariaLabel: strings?.forbidAudioTileMenuLabel\n });\n }\n\n / @conditional-compile-remove(media-access) /\n if (\n participant.canVideoBeForbidden &&\n participant.mediaAccess &&\n !participant.mediaAccess.isVideoPermitted &&\n onPermitVideo\n ) {\n items.push({\n key: 'permitVideo',\n text: strings?.permitVideoTileMenuLabel,\n iconProps: {\n iconName: 'ControlButtonCameraOn',\n styles: { root: { lineHeight: 0 } }\n },\n onClick: () => onPermitVideo([participant.userId]),\n 'data-ui-id': 'video-tile-permit-video',\n ariaLabel: strings?.permitVideoTileMenuLabel\n });\n }\n / @conditional-compile-remove(media-access) /\n if (participant.canVideoBeForbidden && participant.mediaAccess?.isVideoPermitted && onForbidVideo) {\n items.push({\n key: 'forbidVideo',\n text: strings?.forbidVideoTileMenuLabel,\n iconProps: {\n iconName: 'ControlButtonCameraProhibited',\n styles: { root: { lineHeight: 0 } }\n },\n onClick: () => onForbidVideo([participant.userId]),\n 'data-ui-id': 'video-tile-forbid-video',\n ariaLabel: strings?.forbidVideoTileMenuLabel\n });\n }\n\n if (isPinned !== undefined) {\n if (isPinned && onUnpinParticipant && strings?.unpinParticipantForMe) {\n let unpinActionString: string \| undefined = undefined;\n if (toggleAnnouncerString && strings.unpinParticipantMenuItemAriaLabel && participant.displayName) {\n unpinActionString = _formatString(strings?.unpinParticipantMenuItemAriaLabel, {\n participantName: participant.displayName\n });\n }\n items.push({\n key: 'unpin',\n text: strings.unpinParticipantForMe,\n iconProps: {\n iconName: 'UnpinParticipant',\n styles: { root: { lineHeight: '1rem', textAlign: 'center' } }\n },\n onClick: () => {\n onUnpinParticipant(participant.userId);\n unpinActionString && toggleAnnouncerString?.(unpinActionString);\n },\n 'data-ui-id': 'video-tile-unpin-participant-button',\n ariaLabel: unpinActionString\n });\n }\n if (!isPinned && onPinParticipant && strings?.pinParticipantForMe) {\n let pinActionString: string \| undefined = undefined;\n if (toggleAnnouncerString && strings.pinnedParticipantAnnouncementAriaLabel && participant.displayName) {\n pinActionString = _formatString(strings?.pinnedParticipantAnnouncementAriaLabel, {\n participantName: participant.displayName\n });\n }\n items.push({\n key: 'pin',\n text: disablePinMenuItem ? strings.pinParticipantForMeLimitReached : strings.pinParticipantForMe,\n iconProps: {\n iconName: 'PinParticipant',\n styles: { root: { lineHeight: '1rem', textAlign: 'center' } }\n },\n onClick: () => {\n onPinParticipant(participant.userId);\n pinActionString && toggleAnnouncerString?.(pinActionString);\n },\n 'data-ui-id': 'video-tile-pin-participant-button',\n disabled: disablePinMenuItem \|\| isSpotlighted,\n ariaLabel: strings.pinParticipantForMe\n });\n }\n }\n\n if (isSpotlighted) {\n const stopSpotlightMenuLabel =\n myUserId === participant.userId\n ? strings?.stopSpotlightOnSelfVideoTileMenuLabel\n : strings?.stopSpotlightVideoTileMenuLabel;\n if (onStopSpotlight && participant.userId && strings?.stopSpotlightVideoTileMenuLabel) {\n items.push({\n key: 'stopSpotlight',\n text: stopSpotlightMenuLabel,\n iconProps: {\n iconName: 'StopSpotlightContextualMenuItem',\n styles: { root: { lineHeight: 0 } }\n },\n onClick: () => onStopSpotlight([participant.userId]),\n ariaLabel: strings.stopSpotlightVideoTileMenuLabel\n });\n }\n } else {\n const startSpotlightMenuLabel =\n spotlightedParticipantUserIds && spotlightedParticipantUserIds.length > 0\n ? strings?.addSpotlightVideoTileMenuLabel\n : strings?.startSpotlightVideoTileMenuLabel;\n const maxSpotlightedParticipantsReached = maxParticipantsToSpotlight\n ? spotlightedParticipantUserIds.length >= maxParticipantsToSpotlight\n : false;\n if (onStartSpotlight && participant.userId && startSpotlightMenuLabel) {\n items.push({\n key: 'startSpotlight',\n text: startSpotlightMenuLabel,\n iconProps: {\n iconName: 'StartSpotlightContextualMenuItem',\n styles: { root: { lineHeight: 0 } }\n },\n onClick: () => onStartSpotlight([participant.userId]),\n ariaLabel: startSpotlightMenuLabel,\n disabled: maxSpotlightedParticipantsReached,\n title: maxSpotlightedParticipantsReached ? strings?.spotlightLimitReachedMenuTitle : undefined\n });\n }\n }\n if (scalingMode) {\n if (scalingMode === 'Crop' && strings?.fitRemoteParticipantToFrame) {\n items.push({\n key: 'fitRemoteParticipantToFrame',\n text: strings.fitRemoteParticipantToFrame,\n iconProps: {\n iconName: 'VideoTileScaleFit',\n styles: { root: { lineHeight: '1rem', textAlign: 'center' } }\n },\n onClick: () => {\n onUpdateScalingMode?.(participant.userId, 'Fit');\n view?.updateScalingMode('Fit');\n },\n 'data-ui-id': 'video-tile-fit-to-frame',\n ariaLabel: strings.fitRemoteParticipantToFrame\n });\n } else if (scalingMode === 'Fit' && strings?.fillRemoteParticipantFrame) {\n items.push({\n key: 'fillRemoteParticipantFrame',\n text: strings.fillRemoteParticipantFrame,\n iconProps: {\n iconName: 'VideoTileScaleFill',\n styles: { root: { lineHeight: '1rem', textAlign: 'center' } }\n },\n onClick: () => {\n onUpdateScalingMode?.(participant.userId, 'Crop');\n view?.updateScalingMode('Crop');\n },\n 'data-ui-id': 'video-tile-fill-frame',\n ariaLabel: strings.fillRemoteParticipantFrame\n });\n }\n }\n if (items.length === 0) {\n return undefined;\n }\n\n return { items, styles: {}, calloutProps: { preventDismissOnEvent }, shouldFocusOnContainer: false };\n }, [\n onMuteParticipant,\n strings,\n participant.isMuted,\n participant.userId,\n participant.displayName,\n isPinned,\n isSpotlighted,\n scalingMode,\n onUnpinParticipant,\n onPinParticipant,\n toggleAnnouncerString,\n disablePinMenuItem,\n myUserId,\n onStopSpotlight,\n spotlightedParticipantUserIds,\n maxParticipantsToSpotlight,\n onStartSpotlight,\n onUpdateScalingMode,\n view,\n / @conditional-compile-remove(media-access) /\n participant.canAudioBeForbidden,\n / @conditional-compile-remove(media-access) /\n participant.canVideoBeForbidden,\n / @conditional-compile-remove(media-access) /\n participant.mediaAccess,\n / @conditional-compile-remove(media-access) /\n onPermitAudio,\n / @conditional-compile-remove(media-access) /\n onForbidAudio,\n / @conditional-compile-remove(media-access) /\n onPermitVideo,\n / @conditional-compile-remove(media-access) */\n onForbidVideo\n ]);\n\n return contextualMenuProps;\n};\n"]}

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

@@ -26,6 +26,10 @@ export interface VideoTileStrings {
     moreOptionsParticipantHandRaisedAriaLabel: string;
     /** String for the announcement of whether the participant is speaking or not */
     moreOptionsParticipantIsSpeakingAriaLabel: string;
+    /** String for the announcement of whether the participant microphone disabled */
+    moreOptionsParticipantMicDisabledAriaLabel: string;
+    /** String for the announcement of whether the participant camera disabled */
+    moreOptionsParticipantCameraDisabledAriaLabel: string;
 }
 /**
  * Fluent styles for {@link VideoTile}.

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

@@ -31,17 +31,19 @@ const videoTileMoreMenuProps = {
 const VideoTileMoreOptionsButton = (props) => {
     const locale = useLocale().strings.videoTile;
     const theme = useTheme();
-    const { contextualMenu, canShowContextMenuButton, participantDisplayName, participantHandRaised, participantIsSpeaking, participantState, participantIsMuted } = props;
+    const { contextualMenu, canShowContextMenuButton, participantDisplayName, participantHandRaised, participantIsSpeaking, participantState, participantIsMuted, isMicDisabled, isCameraDisabled } = props;
     const [moreButtonAiraDescription, setMoreButtonAriaDescription] = useState('');
     useEffect(() => {
-        setMoreButtonAriaDescription(formatMoreButtonAriaDescription(participantDisplayName, participantIsMuted, participantHandRaised, participantState, participantIsSpeaking, locale));
+        setMoreButtonAriaDescription(formatMoreButtonAriaDescription(participantDisplayName, participantIsMuted, participantHandRaised, participantState, participantIsSpeaking, isMicDisabled, isCameraDisabled, locale));
     }, [
         participantDisplayName,
         participantHandRaised,
         participantIsMuted,
         participantIsSpeaking,
         participantState,
-        locale
+        locale,
+        isMicDisabled,
+        isCameraDisabled
     ]);
     if (!contextualMenu) {
         return React.createElement(React.Fragment, null);
@@ -152,11 +154,11 @@ export const VideoTile = (props) => {
     const canShowContextMenuButton = isHovered || isFocused;
     let raisedHandBackgroundColor = '';
     raisedHandBackgroundColor = callingPalette.raiseHandGold;
-    const participantMediaAccessIcons = canShowLabel || participantStateString
+    const participantMediaAccessIcons = useMemo(() => canShowLabel || participantStateString
         ? getMediaAccessIconsTrampoline(showMuteIndicator, isMuted,
         /* @conditional-compile-remove(media-access) */
         mediaAccess)
-        : undefined;
+        : undefined, [canShowLabel, isMuted, mediaAccess, participantStateString, showMuteIndicator]);
     const canShowParticipantIcons = participantMediaAccessIcons || isSpotlighted || isPinned;
     return (React.createElement(Stack, Object.assign({ "data-ui-id": ids.videoTile, className: mergeStyles(rootStyles, {
             background: theme.palette.neutralLighter,
@@ -189,7 +191,7 @@ export const VideoTile = (props) => {
                             React.createElement(Icon, { iconName: "VideoTileSpotlighted" }))),
                         isPinned && (React.createElement(Stack, { className: mergeStyles(iconContainerStyle) },
                             React.createElement(Icon, { iconName: "VideoTilePinned", className: mergeStyles(pinIconStyle) }))))),
-                    React.createElement(VideoTileMoreOptionsButton, { contextualMenu: contextualMenu, participantDisplayName: displayName, participantHandRaised: !!raisedHand, participantIsMuted: isMuted, participantState: participantStateString, participantIsSpeaking: isSpeaking, canShowContextMenuButton: canShowContextMenuButton })))),
+                    React.createElement(VideoTileMoreOptionsButton, { contextualMenu: contextualMenu, participantDisplayName: displayName, participantHandRaised: !!raisedHand, participantIsMuted: isMuted, participantState: participantStateString, participantIsSpeaking: isSpeaking, canShowContextMenuButton: canShowContextMenuButton, isMicDisabled: (mediaAccess === null || mediaAccess === void 0 ? void 0 : mediaAccess.isAudioPermitted) === false, isCameraDisabled: (mediaAccess === null || mediaAccess === void 0 ? void 0 : mediaAccess.isVideoPermitted) === false })))),
             children && (React.createElement(Stack, { className: mergeStyles(overlayContainerStyles, styles === null || styles === void 0 ? void 0 : styles.overlayContainer) }, children)),
             raisedHand && (React.createElement(Stack, { horizontal: true, tokens: { childrenGap: '0.2rem' }, className: raiseHandContainerStyles(theme, !canShowLabel) },
                 React.createElement(Stack.Item, null,