npm - @azure/communication-react - Versions diffs - 1.22.0-alpha-202412180017 → 1.22.0 - Mend

@azure/communication-react 1.22.0-alpha-202412180017 → 1.22.0

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

package/dist/dist-esm/react-composites/src/composites/common/Drawer/PreparedMoreDrawer.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PreparedMoreDrawer.js","sourceRoot":"","sources":["~~../../../../../../../../~~react-composites/src/composites/common/Drawer/PreparedMoreDrawer.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAAE,+BAA+B,EAAE,MAAM,mEAAmE,CAAC;AACpH,OAAO,EAAE,UAAU,EAAqB,MAAM,cAAc,CAAC;AAC7D,OAAO,EAAE,kBAAkB,EAAE,MAAM,0DAA0D,CAAC;AAC9F,OAAO,EAAE,WAAW,EAAE,MAAM,uCAAuC,CAAC;AACpE,OAAO,EAAE,WAAW,EAAE,MAAM,uCAAuC,CAAC;AAyBpE,eAAe;AACf,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAAC,KAA8B,EAAe,EAAE;IAChF,MAAM,OAAO,GAAG,+BAA+B,EAAE,CAAC;IAClD,MAAM,iBAAiB,GAAsB,OAAO,~~CAClD~~,GAAG,EAAE,CAAC,CAAC;~~QACL~~,iBAAiB,EAAE,OAAO,CAAC,iBAAiB;QAC5C,oBAAoB,EAAE,OAAO,CAAC,8BAA8B;QAC5D,mBAAmB,EAAE,OAAO,CAAC,6BAA6B;QAC1D,gBAAgB,EAAE,OAAO,CAAC,0BAA0B;QACpD,iBAAiB,EAAE,OAAO,CAAC,2BAA2B;QACtD,uBAAuB,EAAE,OAAO,CAAC,iCAAiC;QAClE,wBAAwB,EAAE,OAAO,CAAC,kCAAkC;QACpE,uBAAuB,EAAE,OAAO,CAAC,iCAAiC;KACnE,CAAC,~~EACF~~,CAAC,OAAO,CAAC,~~CACV~~,CAAC;~~IACF~~,MAAM,WAAW,GAAG,WAAW,CAAC,kBAAkB,CAAC,CAAC;IACpD,MAAM,YAAY,GAAG,WAAW,CAAC,UAAU,CAAC,CAAC;~~IAE7C~~,OAAO,oBAAC,UAAU,oBAAK,KAAK,EAAM,WAAW,EAAM,YAAY,IAAE,OAAO,EAAE,iBAAiB,IAAI,CAAC;AAClG,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React, { useMemo } from 'react';\nimport { useCallWithChatCompositeStrings } from '../../CallWithChatComposite/hooks/useCallWithChatCompositeStrings';\nimport { MoreDrawer, MoreDrawerStrings } from './MoreDrawer';\nimport { moreDrawerSelector } from '../../CallWithChatComposite/selectors/moreDrawerSelector';\nimport { useSelector } from '../../CallComposite/hooks/useSelector';\nimport { useHandlers } from '../../CallComposite/hooks/useHandlers';\nimport { CommonCallControlOptions } from '../types/CommonCallControlOptions';\n/* @condtional-compile-remove(gallery-options) /\nimport { VideoGalleryLayout } from '@internal/react-components';\nimport { ReactionResources } from '@internal/react-components';\nimport { DtmfDialPadOptions } from '../../CallComposite';\n\n/* @private /\nexport interface PreparedMoreDrawerProps {\n onLightDismiss: () => void;\n onPeopleButtonClicked: () => void;\n callControls?: boolean \| CommonCallControlOptions;\n onClickShowDialpad?: () => void;\n isCaptionsSupported?: boolean;\n disableButtonsForHoldScreen?: boolean;\n onUserSetGalleryLayout?: (layout: VideoGalleryLayout) => void;\n userSetGalleryLayout?: VideoGalleryLayout;\n onSetDialpadPage?: () => void;\n dtmfDialerPresent?: boolean;\n dtmfDialerOptions?: boolean \| DtmfDialPadOptions;\n useTeamsCaptions?: boolean;\n reactionResources?: ReactionResources;\n onClickMeetingPhoneInfo?: () => void;\n}\n\n/* @private */\nexport const PreparedMoreDrawer = (props: PreparedMoreDrawerProps): JSX.Element => {\n const strings = useCallWithChatCompositeStrings();\n const moreDrawerStrings: MoreDrawerStrings = useMemo(\n () => ({\n peopleButtonLabel: strings.peopleButtonLabel,\n audioDeviceMenuTitle: strings.moreDrawerAudioDeviceMenuTitle,\n microphoneMenuTitle: strings.moreDrawerMicrophoneMenuTitle,\n speakerMenuTitle: strings.moreDrawerSpeakerMenuTitle,\n captionsMenuTitle: strings.moreDrawerCaptionsMenuTitle,\n spokenLanguageMenuTitle: strings.moreDrawerSpokenLanguageMenuTitle,\n captionLanguageMenuTitle: strings.moreDrawerCaptionLanguageMenuTitle,\n galleryOptionsMenuTitle: strings.moreDrawerGalleryOptionsMenuTitle\n })~~,\n~~ [strings]\n );\n const deviceProps = useSelector(moreDrawerSelector);\n const callHandlers = useHandlers(MoreDrawer);\n\n return <MoreDrawer {...props} {...deviceProps} {...callHandlers} strings={moreDrawerStrings} />;\n}~~;\n~~"]}
1	+ {"version":3,"file":"PreparedMoreDrawer.js","sourceRoot":"","sources":["../../../../../../../preprocess-dist/react-composites/src/composites/common/Drawer/PreparedMoreDrawer.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAAE,+BAA+B,EAAE,MAAM,mEAAmE,CAAC;AACpH,OAAO,EAAE,UAAU,EAAqB,MAAM,cAAc,CAAC;AAC7D,OAAO,EAAE,kBAAkB,EAAE,MAAM,0DAA0D,CAAC;AAC9F,OAAO,EAAE,WAAW,EAAE,MAAM,uCAAuC,CAAC;AACpE,OAAO,EAAE,WAAW,EAAE,MAAM,uCAAuC,CAAC;AAyBpE,eAAe;AACf,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAAC,KAA8B,EAAe,EAAE;IAChF,MAAM,OAAO,GAAG,+BAA+B,EAAE,CAAC;IAClD,MAAM,iBAAiB,GAAsB,OAAO,CAAC,GAAG,EAAE,CAAC,CAAC;QAC1D,iBAAiB,EAAE,OAAO,CAAC,iBAAiB;QAC5C,oBAAoB,EAAE,OAAO,CAAC,8BAA8B;QAC5D,mBAAmB,EAAE,OAAO,CAAC,6BAA6B;QAC1D,gBAAgB,EAAE,OAAO,CAAC,0BAA0B;QACpD,iBAAiB,EAAE,OAAO,CAAC,2BAA2B;QACtD,uBAAuB,EAAE,OAAO,CAAC,iCAAiC;QAClE,wBAAwB,EAAE,OAAO,CAAC,kCAAkC;QACpE,uBAAuB,EAAE,OAAO,CAAC,iCAAiC;KACnE,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;IACf,MAAM,WAAW,GAAG,WAAW,CAAC,kBAAkB,CAAC,CAAC;IACpD,MAAM,YAAY,GAAG,WAAW,CAAC,UAAU,CAAC,CAAC;IAC7C,OAAO,oBAAC,UAAU,oBAAK,KAAK,EAAM,WAAW,EAAM,YAAY,IAAE,OAAO,EAAE,iBAAiB,IAAI,CAAC;AAClG,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React, { useMemo } from 'react';\nimport { useCallWithChatCompositeStrings } from '../../CallWithChatComposite/hooks/useCallWithChatCompositeStrings';\nimport { MoreDrawer, MoreDrawerStrings } from './MoreDrawer';\nimport { moreDrawerSelector } from '../../CallWithChatComposite/selectors/moreDrawerSelector';\nimport { useSelector } from '../../CallComposite/hooks/useSelector';\nimport { useHandlers } from '../../CallComposite/hooks/useHandlers';\nimport { CommonCallControlOptions } from '../types/CommonCallControlOptions';\n/* @condtional-compile-remove(gallery-options) /\nimport { VideoGalleryLayout } from '@internal/react-components';\nimport { ReactionResources } from '@internal/react-components';\nimport { DtmfDialPadOptions } from '../../CallComposite';\n\n/* @private /\nexport interface PreparedMoreDrawerProps {\n onLightDismiss: () => void;\n onPeopleButtonClicked: () => void;\n callControls?: boolean \| CommonCallControlOptions;\n onClickShowDialpad?: () => void;\n isCaptionsSupported?: boolean;\n disableButtonsForHoldScreen?: boolean;\n onUserSetGalleryLayout?: (layout: VideoGalleryLayout) => void;\n userSetGalleryLayout?: VideoGalleryLayout;\n onSetDialpadPage?: () => void;\n dtmfDialerPresent?: boolean;\n dtmfDialerOptions?: boolean \| DtmfDialPadOptions;\n useTeamsCaptions?: boolean;\n reactionResources?: ReactionResources;\n onClickMeetingPhoneInfo?: () => void;\n}\n\n/* @private */\nexport const PreparedMoreDrawer = (props: PreparedMoreDrawerProps): JSX.Element => {\n const strings = useCallWithChatCompositeStrings();\n const moreDrawerStrings: MoreDrawerStrings = useMemo(() => ({\n peopleButtonLabel: strings.peopleButtonLabel,\n audioDeviceMenuTitle: strings.moreDrawerAudioDeviceMenuTitle,\n microphoneMenuTitle: strings.moreDrawerMicrophoneMenuTitle,\n speakerMenuTitle: strings.moreDrawerSpeakerMenuTitle,\n captionsMenuTitle: strings.moreDrawerCaptionsMenuTitle,\n spokenLanguageMenuTitle: strings.moreDrawerSpokenLanguageMenuTitle,\n captionLanguageMenuTitle: strings.moreDrawerCaptionLanguageMenuTitle,\n galleryOptionsMenuTitle: strings.moreDrawerGalleryOptionsMenuTitle\n }), [strings]);\n const deviceProps = useSelector(moreDrawerSelector);\n const callHandlers = useHandlers(MoreDrawer);\n return <MoreDrawer {...props} {...deviceProps} {...callHandlers} strings={moreDrawerStrings} />;\n};"]}

package/dist/dist-esm/react-composites/src/composites/common/Drawer/SpokenLanguageSettingsDrawer.js CHANGED Viewed

@@ -15,20 +15,22 @@ export const SpokenLanguageSettingsDrawer = (props) => {
     }, [props]);
     const drawerItems = useMemo(() => {
         var _a;
-        return _getKeys((_a = props.supportedLanguageStrings) !== null && _a !== void 0 ? _a : []).map((languageCode) => ({
+        return _getKeys((_a = props.supportedLanguageStrings) !== null && _a !== void 0 ? _a : []).map(languageCode => ({
             itemKey: languageCode,
             text: props.supportedLanguageStrings ? props.supportedLanguageStrings[languageCode] : languageCode,
             onItemClick: () => onDrawerItemClick(languageCode),
-            secondaryIconProps: props.currentLanguage === languageCode ? { iconName: 'Accept' } : undefined
+            secondaryIconProps: props.currentLanguage === languageCode ? {
+                iconName: 'Accept'
+            } : undefined
         }));
     }, [props.currentLanguage, props.supportedLanguageStrings, onDrawerItemClick]);
     const sortedDrawerItems = useMemo(() => {
         const copy = [...drawerItems];
-        return copy.sort((a, b) => (a.text && b.text && a.text > b.text ? 1 : -1));
+        return copy.sort((a, b) => a.text && b.text && a.text > b.text ? 1 : -1);
     }, [drawerItems]);
-    return (React.createElement(DrawerMenu, { heading: (_a = props.strings) === null || _a === void 0 ? void 0 : _a.menuTitle, items: sortedDrawerItems !== null && sortedDrawerItems !== void 0 ? sortedDrawerItems : [], onLightDismiss: () => {
+    return React.createElement(DrawerMenu, { heading: (_a = props.strings) === null || _a === void 0 ? void 0 : _a.menuTitle, items: sortedDrawerItems !== null && sortedDrawerItems !== void 0 ? sortedDrawerItems : [], onLightDismiss: () => {
             props.setCurrentLanguage(props.currentLanguage);
             props.onLightDismiss();
-        }, styles: captionSettingsDrawerStyles(theme) }));
+        }, styles: captionSettingsDrawerStyles(theme) });
 };
 //# sourceMappingURL=SpokenLanguageSettingsDrawer.js.map

package/dist/dist-esm/react-composites/src/composites/common/Drawer/SpokenLanguageSettingsDrawer.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SpokenLanguageSettingsDrawer.js","sourceRoot":"","sources":["~~../../../../../../../../~~react-composites/src/composites/common/Drawer/SpokenLanguageSettingsDrawer.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,OAAO,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAC7C,OAAO,EAAyB,QAAQ,EAAE,4CAAmC;AAC7E,OAAO,~~EACL~~,WAAW,IAAI,UAAU,~~EAG1B~~,4CAAmC;~~AACpC~~,OAAO,EAAE,2BAA2B,EAAE,MAAM,gCAAgC,CAAC;AAC7E,OAAO,EAAE,QAAQ,EAAE,yCAAgC;AAYnD,eAAe;AACf,MAAM,CAAC,MAAM,4BAA4B,GAAG,CAAC,KAO5C,EAAe,EAAE;;IAChB,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;~~IAEzB~~,MAAM,iBAAiB,GAAG,WAAW,~~CACnC~~,CAAC,YAAyC,EAAE,EAAE;~~QAC5C~~,KAAK,CAAC,cAAc,CAAC,YAAY,CAAC,CAAC;IACrC,CAAC,~~EACD~~,CAAC,KAAK,CAAC,~~CACR~~,CAAC;~~IAEF~~,MAAM,WAAW,GAA0B,OAAO,CAAC,GAAG,EAAE;;QACtD,OAAO,QAAQ,CAAC,MAAA,KAAK,CAAC,wBAAwB,mCAAI,EAAE,CAAC,CAAC,GAAG,CAAC,~~CAAC,~~YAAY,~~EAAE~~,EAAE,CAAC,CAAC;~~YAC3E~~,OAAO,EAAE,YAAY;YACrB,IAAI,EAAE,KAAK,CAAC,wBAAwB,CAAC,CAAC,CAAC,KAAK,CAAC,wBAAwB,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,YAAY;YAClG,WAAW,EAAE,GAAG,EAAE,CAAC,iBAAiB,CAAC,YAAY,CAAC;YAClD,kBAAkB,EAAE,KAAK,CAAC,eAAe,KAAK,YAAY,CAAC,CAAC,CAAC,~~EAAE,~~QAAQ,EAAE,QAAQ,~~EAAE,~~CAAC,CAAC,CAAC,SAAS;~~SAChG~~,CAAC,CAAC,CAAC;IACN,CAAC,EAAE,CAAC,KAAK,CAAC,eAAe,EAAE,KAAK,CAAC,wBAAwB,EAAE,iBAAiB,CAAC,CAAC,CAAC;~~IAE~~/E,MAAM,iBAAiB,GAA0B,OAAO,CAAC,GAAG,EAAE;QAC5D,MAAM,IAAI,GAAG,CAAC,GAAG,WAAW,CAAC,CAAC;QAC9B,OAAO,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,~~CAAC,~~IAAI,IAAI,CAAC,CAAC,IAAI,IAAI,CAAC,CAAC,IAAI,GAAG,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC~~,CAAC~~;~~IAC7E~~,CAAC,EAAE,CAAC,WAAW,CAAC,CAAC,CAAC;~~IAElB~~,OAAO,~~CACL,~~oBAAC,UAAU,~~IACT~~,OAAO,EAAE,MAAA,KAAK,CAAC,OAAO,0CAAE,SAAS,~~EACjC~~,KAAK,EAAE,iBAAiB,aAAjB,iBAAiB,cAAjB,iBAAiB,GAAI,EAAE,~~EAC9B~~,cAAc,EAAE,GAAG,EAAE;~~YACnB~~,KAAK,CAAC,kBAAkB,CAAC,KAAK,CAAC,eAAe,CAAC,CAAC;YAChD,KAAK,CAAC,cAAc,EAAE,CAAC;QACzB,CAAC,~~EACD~~,MAAM,EAAE,2BAA2B,CAAC,KAAK,CAAC,~~GAC1C~~,~~CACH,~~CAAC;~~AACJ~~,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React from 'react';\nimport { useMemo, useCallback } from 'react';\nimport { SpokenLanguageStrings, useTheme } from '@internal/react-components';\nimport {\n _DrawerMenu as DrawerMenu~~,\n~~ _DrawerMenuItemProps as DrawerMenuItemProps~~,\n~~ _DrawerMenuStyles\n} from '@internal/react-components';\nimport { captionSettingsDrawerStyles } from './captionSettingsDrawer.styles';\nimport { _getKeys } from '@internal/acs-ui-common';\n\n/** @private /\nexport interface CaptionSettingsDrawerStrings {\n /\n Label for spoken language/caption language drawerMenuItem\n \n @remarks Only displayed when in Teams call, disabled until captions is on\n /\n menuTitle: string;\n}\n\n/* @private */\nexport const SpokenLanguageSettingsDrawer = (props: {\n selectLanguage: (language: keyof SpokenLanguageStrings) => void;\n setCurrentLanguage: (language: keyof SpokenLanguageStrings) => void;\n currentLanguage: keyof SpokenLanguageStrings;\n onLightDismiss: () => void;\n strings?: CaptionSettingsDrawerStrings;\n supportedLanguageStrings?: SpokenLanguageStrings;\n}): JSX.Element => {\n const theme = useTheme();\n\n const onDrawerItemClick = useCallback(\n (languageCode: keyof SpokenLanguageStrings) => {\n props.selectLanguage(languageCode);\n }~~,\n~~ [props]\n );\n\n const drawerItems: DrawerMenuItemProps[] = useMemo(() => {\n return _getKeys(props.supportedLanguageStrings ?? []).map((languageCode) => ({\n itemKey: languageCode,\n text: props.supportedLanguageStrings ? props.supportedLanguageStrings[languageCode] : languageCode,\n onItemClick: () => onDrawerItemClick(languageCode),\n secondaryIconProps: props.currentLanguage === languageCode ? { iconName: 'Accept' } : undefined\n }));\n }, [props.currentLanguage, props.supportedLanguageStrings, onDrawerItemClick]);\n\n const sortedDrawerItems: DrawerMenuItemProps[] = useMemo(() => {\n const copy = [...drawerItems];\n return copy.sort((a, b) => (a.text && b.text && a.text > b.text ? 1 : -1));\n }, [drawerItems]);\n\n return ~~(\n~~ <DrawerMenu\n heading={props.strings?.menuTitle}\n items={sortedDrawerItems ?? []}\n onLightDismiss={() => {\n props.setCurrentLanguage(props.currentLanguage);\n props.onLightDismiss();\n }}\n styles={captionSettingsDrawerStyles(theme)}\n ~~/>\n );\n~~}~~;\n~~"]}
1	+ {"version":3,"file":"SpokenLanguageSettingsDrawer.js","sourceRoot":"","sources":["../../../../../../../preprocess-dist/react-composites/src/composites/common/Drawer/SpokenLanguageSettingsDrawer.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,OAAO,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAC7C,OAAO,EAAyB,QAAQ,EAAE,4CAAmC;AAC7E,OAAO,EAAE,WAAW,IAAI,UAAU,EAAkE,4CAAmC;AACvI,OAAO,EAAE,2BAA2B,EAAE,MAAM,gCAAgC,CAAC;AAC7E,OAAO,EAAE,QAAQ,EAAE,yCAAgC;AAYnD,eAAe;AACf,MAAM,CAAC,MAAM,4BAA4B,GAAG,CAAC,KAO5C,EAAe,EAAE;;IAChB,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IACzB,MAAM,iBAAiB,GAAG,WAAW,CAAC,CAAC,YAAyC,EAAE,EAAE;QAClF,KAAK,CAAC,cAAc,CAAC,YAAY,CAAC,CAAC;IACrC,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IACZ,MAAM,WAAW,GAA0B,OAAO,CAAC,GAAG,EAAE;;QACtD,OAAO,QAAQ,CAAC,MAAA,KAAK,CAAC,wBAAwB,mCAAI,EAAE,CAAC,CAAC,GAAG,CAAC,YAAY,CAAC,EAAE,CAAC,CAAC;YACzE,OAAO,EAAE,YAAY;YACrB,IAAI,EAAE,KAAK,CAAC,wBAAwB,CAAC,CAAC,CAAC,KAAK,CAAC,wBAAwB,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,YAAY;YAClG,WAAW,EAAE,GAAG,EAAE,CAAC,iBAAiB,CAAC,YAAY,CAAC;YAClD,kBAAkB,EAAE,KAAK,CAAC,eAAe,KAAK,YAAY,CAAC,CAAC,CAAC;gBAC3D,QAAQ,EAAE,QAAQ;aACnB,CAAC,CAAC,CAAC,SAAS;SACd,CAAC,CAAC,CAAC;IACN,CAAC,EAAE,CAAC,KAAK,CAAC,eAAe,EAAE,KAAK,CAAC,wBAAwB,EAAE,iBAAiB,CAAC,CAAC,CAAC;IAC/E,MAAM,iBAAiB,GAA0B,OAAO,CAAC,GAAG,EAAE;QAC5D,MAAM,IAAI,GAAG,CAAC,GAAG,WAAW,CAAC,CAAC;QAC9B,OAAO,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,IAAI,CAAC,CAAC,IAAI,IAAI,CAAC,CAAC,IAAI,GAAG,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IAC3E,CAAC,EAAE,CAAC,WAAW,CAAC,CAAC,CAAC;IAClB,OAAO,oBAAC,UAAU,IAAC,OAAO,EAAE,MAAA,KAAK,CAAC,OAAO,0CAAE,SAAS,EAAE,KAAK,EAAE,iBAAiB,aAAjB,iBAAiB,cAAjB,iBAAiB,GAAI,EAAE,EAAE,cAAc,EAAE,GAAG,EAAE;YACzG,KAAK,CAAC,kBAAkB,CAAC,KAAK,CAAC,eAAe,CAAC,CAAC;YAChD,KAAK,CAAC,cAAc,EAAE,CAAC;QACzB,CAAC,EAAE,MAAM,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAI,CAAC;AACpD,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React from 'react';\nimport { useMemo, useCallback } from 'react';\nimport { SpokenLanguageStrings, useTheme } from '@internal/react-components';\nimport { _DrawerMenu as DrawerMenu, _DrawerMenuItemProps as DrawerMenuItemProps, _DrawerMenuStyles } from '@internal/react-components';\nimport { captionSettingsDrawerStyles } from './captionSettingsDrawer.styles';\nimport { _getKeys } from '@internal/acs-ui-common';\n\n/** @private /\nexport interface CaptionSettingsDrawerStrings {\n /\n Label for spoken language/caption language drawerMenuItem\n \n @remarks Only displayed when in Teams call, disabled until captions is on\n /\n menuTitle: string;\n}\n\n/* @private */\nexport const SpokenLanguageSettingsDrawer = (props: {\n selectLanguage: (language: keyof SpokenLanguageStrings) => void;\n setCurrentLanguage: (language: keyof SpokenLanguageStrings) => void;\n currentLanguage: keyof SpokenLanguageStrings;\n onLightDismiss: () => void;\n strings?: CaptionSettingsDrawerStrings;\n supportedLanguageStrings?: SpokenLanguageStrings;\n}): JSX.Element => {\n const theme = useTheme();\n const onDrawerItemClick = useCallback((languageCode: keyof SpokenLanguageStrings) => {\n props.selectLanguage(languageCode);\n }, [props]);\n const drawerItems: DrawerMenuItemProps[] = useMemo(() => {\n return _getKeys(props.supportedLanguageStrings ?? []).map(languageCode => ({\n itemKey: languageCode,\n text: props.supportedLanguageStrings ? props.supportedLanguageStrings[languageCode] : languageCode,\n onItemClick: () => onDrawerItemClick(languageCode),\n secondaryIconProps: props.currentLanguage === languageCode ? {\n iconName: 'Accept'\n } : undefined\n }));\n }, [props.currentLanguage, props.supportedLanguageStrings, onDrawerItemClick]);\n const sortedDrawerItems: DrawerMenuItemProps[] = useMemo(() => {\n const copy = [...drawerItems];\n return copy.sort((a, b) => a.text && b.text && a.text > b.text ? 1 : -1);\n }, [drawerItems]);\n return <DrawerMenu heading={props.strings?.menuTitle} items={sortedDrawerItems ?? []} onLightDismiss={() => {\n props.setCurrentLanguage(props.currentLanguage);\n props.onLightDismiss();\n }} styles={captionSettingsDrawerStyles(theme)} />;\n};"]}

package/dist/dist-esm/react-composites/src/composites/common/Drawer/captionSettingsDrawer.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"captionSettingsDrawer.styles.js","sourceRoot":"","sources":["~~../../../../../../../../~~react-composites/src/composites/common/Drawer/captionSettingsDrawer.styles.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAGlC,OAAO,EAAE,QAAQ,EAAE,yCAAgC;AAGnD;;GAEG;AACH,MAAM,CAAC,MAAM,2BAA2B,GAAG,CAAC,KAAY,EAAqB,EAAE,CAAC,CAAC;IAC/E,IAAI,EAAE;QACJ,QAAQ,EAAE,MAAM;KACjB;IACD,mBAAmB,EAAE;QACnB,sBAAsB,EAAE;YACtB,IAAI,EAAE;gBACJ,IAAI,EAAE;oBACJ,UAAU,EAAE,GAAG;oBACf,QAAQ,EAAE,QAAQ,CAAC,EAAE,CAAC;oBACtB,UAAU,EAAE,QAAQ,CAAC,EAAE,CAAC;oBACxB,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,WAAW;iBACjC;aACF;SACF;KACF;CACF,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { Theme } from '@fluentui/react';\nimport { _pxToRem } from '@internal/acs-ui-common';\nimport { _DrawerMenuStyles } from '@internal/react-components';\n\n/*\n @private\n */\nexport const captionSettingsDrawerStyles = (theme: Theme): _DrawerMenuStyles => ({\n root: {\n overflow: 'auto'\n },\n drawerSurfaceStyles: {\n drawerContentContainer: {\n root: {\n span: {\n fontWeight: 400,\n fontSize: _pxToRem(14),\n lineHeight: _pxToRem(22),\n color: theme.palette.neutralDark\n }\n }\n }\n }\n})~~;\n~~"]}
1	+ {"version":3,"file":"captionSettingsDrawer.styles.js","sourceRoot":"","sources":["../../../../../../../preprocess-dist/react-composites/src/composites/common/Drawer/captionSettingsDrawer.styles.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAGlC,OAAO,EAAE,QAAQ,EAAE,yCAAgC;AAGnD;;GAEG;AACH,MAAM,CAAC,MAAM,2BAA2B,GAAG,CAAC,KAAY,EAAqB,EAAE,CAAC,CAAC;IAC/E,IAAI,EAAE;QACJ,QAAQ,EAAE,MAAM;KACjB;IACD,mBAAmB,EAAE;QACnB,sBAAsB,EAAE;YACtB,IAAI,EAAE;gBACJ,IAAI,EAAE;oBACJ,UAAU,EAAE,GAAG;oBACf,QAAQ,EAAE,QAAQ,CAAC,EAAE,CAAC;oBACtB,UAAU,EAAE,QAAQ,CAAC,EAAE,CAAC;oBACxB,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,WAAW;iBACjC;aACF;SACF;KACF;CACF,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { Theme } from '@fluentui/react';\nimport { _pxToRem } from '@internal/acs-ui-common';\nimport { _DrawerMenuStyles } from '@internal/react-components';\n\n/*\n @private\n */\nexport const captionSettingsDrawerStyles = (theme: Theme): _DrawerMenuStyles => ({\n root: {\n overflow: 'auto'\n },\n drawerSurfaceStyles: {\n drawerContentContainer: {\n root: {\n span: {\n fontWeight: 400,\n fontSize: _pxToRem(14),\n lineHeight: _pxToRem(22),\n color: theme.palette.neutralDark\n }\n }\n }\n }\n});"]}

package/dist/dist-esm/react-composites/src/composites/common/ExitSpotlightButton.js CHANGED Viewed

@@ -7,6 +7,6 @@ import { _HighContrastAwareIcon } from "../../../../react-components/src";
  * @private
  */
 export const ExitSpotlightButton = (props) => {
-    return (React.createElement(ControlBarButton, Object.assign({ "data-ui-id": 'call-composite-exit-spotlight-button', labelKey: 'exitSpotlightButtonLabelKey', showLabel: props.displayType !== 'compact', onRenderIcon: () => React.createElement(_HighContrastAwareIcon, { iconName: 'ControlButtonExitSpotlight' }), onClick: props.onClick }, props)));
+    return React.createElement(ControlBarButton, Object.assign({ "data-ui-id": 'call-composite-exit-spotlight-button', labelKey: 'exitSpotlightButtonLabelKey', showLabel: props.displayType !== 'compact', onRenderIcon: () => React.createElement(_HighContrastAwareIcon, { iconName: 'ControlButtonExitSpotlight' }), onClick: props.onClick }, props));
 };
 //# sourceMappingURL=ExitSpotlightButton.js.map

package/dist/dist-esm/react-composites/src/composites/common/ExitSpotlightButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ExitSpotlightButton.js","sourceRoot":"","sources":["~~../../../../../../../~~react-composites/src/composites/common/ExitSpotlightButton.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,gBAAgB,EAAmD,yCAAmC;AAE/G,OAAO,EAAE,sBAAsB,EAAE,yCAAmC;AAEpE;;GAEG;AACH,MAAM,CAAC,MAAM,mBAAmB,GAAG,CAAC,KAMnC,EAAe,EAAE;IAChB,OAAO,~~CACL,~~oBAAC,gBAAgB,~~gCACH~~,sCAAsC,~~EAClD~~,QAAQ,EAAE,6BAA6B,~~EACvC~~,SAAS,EAAE,KAAK,CAAC,WAAW,KAAK,SAAS,~~EAC1C~~,YAAY,EAAE,GAAG,EAAE,CAAC,oBAAC,sBAAsB,IAAC,QAAQ,EAAE,4BAA4B,GAAI,~~EACtF~~,OAAO,EAAE,KAAK,CAAC,OAAO,~~IAClB~~,KAAK,~~EACT~~,~~CACH,~~CAAC;~~AACJ~~,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React from 'react';\nimport { ControlBarButton, ControlBarButtonStrings, ControlBarButtonStyles } from '@internal/react-components';\nimport { CallControlDisplayType } from './types/CommonCallControlOptions';\nimport { _HighContrastAwareIcon } from '@internal/react-components';\n\n/*\n @private\n */\nexport const ExitSpotlightButton = (props: {\n displayType?: CallControlDisplayType;\n styles?: ControlBarButtonStyles;\n disabled?: boolean;\n onClick?: () => void;\n strings?: ControlBarButtonStrings;\n}): JSX.Element => {\n return ~~(\n~~ <ControlBarButton\n data-ui-id={'call-composite-exit-spotlight-button'}\n labelKey={'exitSpotlightButtonLabelKey'}\n showLabel={props.displayType !== 'compact'}\n onRenderIcon={() => <_HighContrastAwareIcon iconName={'ControlButtonExitSpotlight'} />}\n onClick={props.onClick}\n {...props}\n ~~/>\n );\n~~}~~;\n~~"]}
1	+ {"version":3,"file":"ExitSpotlightButton.js","sourceRoot":"","sources":["../../../../../../preprocess-dist/react-composites/src/composites/common/ExitSpotlightButton.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,gBAAgB,EAAmD,yCAAmC;AAE/G,OAAO,EAAE,sBAAsB,EAAE,yCAAmC;AAEpE;;GAEG;AACH,MAAM,CAAC,MAAM,mBAAmB,GAAG,CAAC,KAMnC,EAAe,EAAE;IAChB,OAAO,oBAAC,gBAAgB,gCAAa,sCAAsC,EAAE,QAAQ,EAAE,6BAA6B,EAAE,SAAS,EAAE,KAAK,CAAC,WAAW,KAAK,SAAS,EAAE,YAAY,EAAE,GAAG,EAAE,CAAC,oBAAC,sBAAsB,IAAC,QAAQ,EAAE,4BAA4B,GAAI,EAAE,OAAO,EAAE,KAAK,CAAC,OAAO,IAAM,KAAK,EAAI,CAAC;AAClS,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React from 'react';\nimport { ControlBarButton, ControlBarButtonStrings, ControlBarButtonStyles } from '@internal/react-components';\nimport { CallControlDisplayType } from './types/CommonCallControlOptions';\nimport { _HighContrastAwareIcon } from '@internal/react-components';\n\n/*\n @private\n */\nexport const ExitSpotlightButton = (props: {\n displayType?: CallControlDisplayType;\n styles?: ControlBarButtonStyles;\n disabled?: boolean;\n onClick?: () => void;\n strings?: ControlBarButtonStrings;\n}): JSX.Element => {\n return <ControlBarButton data-ui-id={'call-composite-exit-spotlight-button'} labelKey={'exitSpotlightButtonLabelKey'} showLabel={props.displayType !== 'compact'} onRenderIcon={() => <_HighContrastAwareIcon iconName={'ControlButtonExitSpotlight'} />} onClick={props.onClick} {...props} />;\n};"]}

package/dist/dist-esm/react-composites/src/composites/common/HiddenFocusStartPoint.js CHANGED Viewed

@@ -16,7 +16,7 @@ export const HiddenFocusStartPoint = () => {
     useEffect(() => {
         setIsMounted(true);
     }, []);
-    return (React.createElement(DefaultButton, { autoFocus: true, onBlur: () => setIsUnfocused(true), ariaHidden: isUnfocused, styles: isMounted ? invisibleHiddenFocusStartPoint : hiddenFocusStartPointStyles, tabIndex: -1 }));
+    return React.createElement(DefaultButton, { autoFocus: true, onBlur: () => setIsUnfocused(true), ariaHidden: isUnfocused, styles: isMounted ? invisibleHiddenFocusStartPoint : hiddenFocusStartPointStyles, tabIndex: -1 });
 };
 /** @private */
 const hiddenFocusStartPointStyles = {

package/dist/dist-esm/react-composites/src/composites/common/HiddenFocusStartPoint.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"HiddenFocusStartPoint.js","sourceRoot":"","sources":["~~../../../../../../../~~react-composites/src/composites/common/HiddenFocusStartPoint.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAAE,aAAa,EAAgB,MAAM,iBAAiB,CAAC;AAC9D,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE5C;;;;GAIG;AACH,MAAM,CAAC,MAAM,qBAAqB,GAAG,GAAgB,EAAE;IACrD,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAClD,6DAA6D;IAC7D,qDAAqD;IACrD,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;~~IAEtD~~,SAAS,CAAC,GAAG,EAAE;QACb,YAAY,CAAC,IAAI,CAAC,CAAC;IACrB,CAAC,EAAE,EAAE,CAAC,CAAC;IACP,OAAO,~~CACL,~~oBAAC,aAAa,~~IACZ~~,SAAS,~~QACT~~,MAAM,EAAE,GAAG,EAAE,CAAC,cAAc,CAAC,IAAI,CAAC,~~EAClC~~,UAAU,EAAE,WAAW,~~EACvB~~,MAAM,EAAE,SAAS,CAAC,CAAC,CAAC,8BAA8B,CAAC,CAAC,CAAC,2BAA2B,~~EAChF~~,QAAQ,EAAE,CAAC,CAAC,~~GACZ~~,~~CACH,~~CAAC;~~AACJ~~,CAAC,CAAC;AAEF,eAAe;AACf,MAAM,2BAA2B,GAAiB;IAChD,IAAI,EAAE;QACJ,KAAK,EAAE,GAAG;QACV,MAAM,EAAE,GAAG;QACX,MAAM,EAAE,GAAG;QACX,SAAS,EAAE,GAAG;QACd,QAAQ,EAAE,GAAG;QACb,SAAS,EAAE,GAAG;QACd,QAAQ,EAAE,GAAG;QACb,OAAO,EAAE,GAAG;QACZ,OAAO,EAAE,MAAM;QACf,OAAO,EAAE,GAAG;QACZ,QAAQ,EAAE,UAAU;KACrB;CACF,CAAC;AAEF,eAAe;AACf,MAAM,8BAA8B,GAAiB;IACnD,IAAI,EAAE;QACJ,OAAO,EAAE,MAAM;KAChB;CACF,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { DefaultButton, IStackStyles } from '@fluentui/react';\nimport React from 'react';\nimport { useEffect, useState } from 'react';\n\n/*\n @private\n * hidden button to set first tab keypress focus on a specific grouping.\n * On mount, button is autofocused then immediately hidden\n /\nexport const HiddenFocusStartPoint = (): JSX.Element => {\n const [isMounted, setIsMounted] = useState(false);\n // ariaHidden is used to hide the button from screen readers,\n // we want to only focus it for once then never again\n const [isUnfocused, setIsUnfocused] = useState(false);\n\n useEffect(() => {\n setIsMounted(true);\n }, []);\n return ~~(\n~~ <DefaultButton\n autoFocus\n onBlur={() => setIsUnfocused(true)}\n ariaHidden={isUnfocused}\n styles={isMounted ? invisibleHiddenFocusStartPoint : hiddenFocusStartPointStyles}\n tabIndex={-1}\n ~~/>\n );\n~~};\n\n/* @private /\nconst hiddenFocusStartPointStyles: IStackStyles = {\n root: {\n width: '0',\n height: '0',\n margin: '0',\n minHeight: '0',\n minWidth: '0',\n maxHeight: '0',\n maxWidth: '0',\n opacity: '0',\n outline: 'none',\n padding: '0',\n position: 'absolute'\n }\n};\n\n/* @private */\nconst invisibleHiddenFocusStartPoint: IStackStyles = {\n root: {\n display: 'none'\n }\n}~~;\n~~"]}
1	+ {"version":3,"file":"HiddenFocusStartPoint.js","sourceRoot":"","sources":["../../../../../../preprocess-dist/react-composites/src/composites/common/HiddenFocusStartPoint.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAAE,aAAa,EAAgB,MAAM,iBAAiB,CAAC;AAC9D,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE5C;;;;GAIG;AACH,MAAM,CAAC,MAAM,qBAAqB,GAAG,GAAgB,EAAE;IACrD,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAClD,6DAA6D;IAC7D,qDAAqD;IACrD,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IACtD,SAAS,CAAC,GAAG,EAAE;QACb,YAAY,CAAC,IAAI,CAAC,CAAC;IACrB,CAAC,EAAE,EAAE,CAAC,CAAC;IACP,OAAO,oBAAC,aAAa,IAAC,SAAS,QAAC,MAAM,EAAE,GAAG,EAAE,CAAC,cAAc,CAAC,IAAI,CAAC,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,EAAE,SAAS,CAAC,CAAC,CAAC,8BAA8B,CAAC,CAAC,CAAC,2BAA2B,EAAE,QAAQ,EAAE,CAAC,CAAC,GAAI,CAAC;AAClM,CAAC,CAAC;AAEF,eAAe;AACf,MAAM,2BAA2B,GAAiB;IAChD,IAAI,EAAE;QACJ,KAAK,EAAE,GAAG;QACV,MAAM,EAAE,GAAG;QACX,MAAM,EAAE,GAAG;QACX,SAAS,EAAE,GAAG;QACd,QAAQ,EAAE,GAAG;QACb,SAAS,EAAE,GAAG;QACd,QAAQ,EAAE,GAAG;QACb,OAAO,EAAE,GAAG;QACZ,OAAO,EAAE,MAAM;QACf,OAAO,EAAE,GAAG;QACZ,QAAQ,EAAE,UAAU;KACrB;CACF,CAAC;AAEF,eAAe;AACf,MAAM,8BAA8B,GAAiB;IACnD,IAAI,EAAE;QACJ,OAAO,EAAE,MAAM;KAChB;CACF,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { DefaultButton, IStackStyles } from '@fluentui/react';\nimport React from 'react';\nimport { useEffect, useState } from 'react';\n\n/*\n @private\n * hidden button to set first tab keypress focus on a specific grouping.\n * On mount, button is autofocused then immediately hidden\n /\nexport const HiddenFocusStartPoint = (): JSX.Element => {\n const [isMounted, setIsMounted] = useState(false);\n // ariaHidden is used to hide the button from screen readers,\n // we want to only focus it for once then never again\n const [isUnfocused, setIsUnfocused] = useState(false);\n useEffect(() => {\n setIsMounted(true);\n }, []);\n return <DefaultButton autoFocus onBlur={() => setIsUnfocused(true)} ariaHidden={isUnfocused} styles={isMounted ? invisibleHiddenFocusStartPoint : hiddenFocusStartPointStyles} tabIndex={-1} />;\n};\n\n/* @private /\nconst hiddenFocusStartPointStyles: IStackStyles = {\n root: {\n width: '0',\n height: '0',\n margin: '0',\n minHeight: '0',\n minWidth: '0',\n maxHeight: '0',\n maxWidth: '0',\n opacity: '0',\n outline: 'none',\n padding: '0',\n position: 'absolute'\n }\n};\n\n/* @private */\nconst invisibleHiddenFocusStartPoint: IStackStyles = {\n root: {\n display: 'none'\n }\n};"]}

package/dist/dist-esm/react-composites/src/composites/common/MeetingPhoneInfoPaneContent.js CHANGED Viewed

@@ -14,10 +14,10 @@ export const MeetingPhoneInfoPaneContent = (props) => {
     const theme = useTheme();
     const localeStrings = useLocale().component.strings.meetingConferencePhoneInfo;
     if (props.mobileView) {
-        return (React.createElement(Stack, { verticalFill: true, styles: phoneInfoContainerStyle, tokens: phoneInfoContainerTokens, "data-ui-id": "phone-info-pane-content" },
-            (conferencePhoneInfoList === undefined || conferencePhoneInfoList.length === 0) && (React.createElement(Stack, { horizontal: true },
-                React.createElement(Text, { className: phoneInfoTextStyle }, localeStrings.meetingConferencePhoneInfoModalNoPhoneAvailable))),
-            conferencePhoneInfoList && conferencePhoneInfoList[0] && (React.createElement(Stack, null,
+        return React.createElement(Stack, { verticalFill: true, styles: phoneInfoContainerStyle, tokens: phoneInfoContainerTokens, "data-ui-id": "phone-info-pane-content" },
+            (conferencePhoneInfoList === undefined || conferencePhoneInfoList.length === 0) && React.createElement(Stack, { horizontal: true },
+                React.createElement(Text, { className: phoneInfoTextStyle }, localeStrings.meetingConferencePhoneInfoModalNoPhoneAvailable)),
+            conferencePhoneInfoList && conferencePhoneInfoList[0] && React.createElement(Stack, null,
                 React.createElement(Stack, { horizontal: true, horizontalAlign: "space-between", className: phoneInfoInstructionLine },
                     React.createElement(Stack.Item, null,
                         React.createElement(Stack, { horizontal: true, className: phoneInfoStep },
@@ -26,17 +26,15 @@ export const MeetingPhoneInfoPaneContent = (props) => {
                                     React.createElement(Icon, { iconName: "JoinByPhoneDialStepIcon", className: phoneInfoIconStyle(theme) }))),
                             React.createElement(Stack.Item, null,
                                 React.createElement(Text, { className: phoneInfoLabelStyle }, localeStrings.meetingConferencePhoneInfoModalDialIn)))),
-                    React.createElement(Stack.Item, { className: phoneInfoStep }, conferencePhoneInfoList.map((phoneNumber, index) => (React.createElement(Stack.Item, { key: index },
+                    React.createElement(Stack.Item, { className: phoneInfoStep }, conferencePhoneInfoList.map((phoneNumber, index) => React.createElement(Stack.Item, { key: index },
                         React.createElement(Link, { className: phoneInfoTextStyle, href: formatPhoneNumberLink(phoneNumber) }, _formatPhoneNumber(phoneNumber.phoneNumber, true)),
                         React.createElement(Text, { className: phoneInfoTextStyle },
                             ' ',
-                            phoneNumber.isTollFree
-                                ? localeStrings.meetingConferencePhoneInfoModalTollFree
-                                : localeStrings.meetingConferencePhoneInfoModalToll),
+                            phoneNumber.isTollFree ? localeStrings.meetingConferencePhoneInfoModalTollFree : localeStrings.meetingConferencePhoneInfoModalToll),
                         React.createElement("br", null),
                         React.createElement(Text, { className: phoneInfoTextStyle },
                             " ",
-                            formatPhoneNumberInfo(phoneNumber, localeStrings))))))),
+                            formatPhoneNumberInfo(phoneNumber, localeStrings)))))),
                 React.createElement(Stack, { horizontal: true, horizontalAlign: "space-between", verticalAlign: "center", className: phoneInfoInstructionLine },
                     React.createElement(Stack.Item, null,
                         React.createElement(Stack, { horizontal: true },
@@ -52,8 +50,8 @@ export const MeetingPhoneInfoPaneContent = (props) => {
                         React.createElement(Stack.Item, { className: phoneInfoIcon(theme) },
                             React.createElement(Icon, { iconName: "JoinByPhoneWaitToBeAdmittedIcon", className: phoneInfoIconStyle(theme) })),
                         React.createElement(Stack.Item, null,
-                            React.createElement(Text, { className: phoneInfoLabelStyle }, localeStrings.meetingConferencePhoneInfoModalWait))))))));
+                            React.createElement(Text, { className: phoneInfoLabelStyle }, localeStrings.meetingConferencePhoneInfoModalWait))))));
     }
-    return (React.createElement(Stack, { verticalFill: true, styles: phoneInfoContainerStyle, tokens: phoneInfoContainerTokens, "data-ui-id": "phone-info-pane-content" }));
+    return React.createElement(Stack, { verticalFill: true, styles: phoneInfoContainerStyle, tokens: phoneInfoContainerTokens, "data-ui-id": "phone-info-pane-content" });
 };
 //# sourceMappingURL=MeetingPhoneInfoPaneContent.js.map

package/dist/dist-esm/react-composites/src/composites/common/MeetingPhoneInfoPaneContent.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MeetingPhoneInfoPaneContent.js","sourceRoot":"","sources":["~~../../../../../../../~~react-composites/src/composites/common/MeetingPhoneInfoPaneContent.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,iDAAiD;AACjD,OAAO,EAAE,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;AAEpE,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,~~EAEL~~,qBAAqB,~~EACrB~~,kBAAkB,~~EAClB~~,qBAAqB,~~EACtB~~,yCAAmC;~~AACpC~~,OAAO,~~EACL~~,kBAAkB,~~EAClB~~,aAAa,~~EACb~~,wBAAwB,~~EACxB~~,aAAa,~~EACb~~,kBAAkB,~~EAClB~~,mBAAmB,~~EACnB~~,wBAAwB,~~EACxB~~,uBAAuB,~~EACxB~~,MAAM,2CAA2C,CAAC;~~AACnD~~,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAE5C;;GAEG;AACH,MAAM,CAAC,MAAM,2BAA2B,GAAG,CAAC,KAG3C,EAAe,EAAE;IAChB,MAAM,~~EAAE~~,uBAAuB,~~EAAE~~,GAAG,KAAK,CAAC;~~IAC1C~~,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IACzB,MAAM,aAAa,GAAG,SAAS,EAAE,CAAC,SAAS,CAAC,OAAO,CAAC,0BAA0B,CAAC;~~IAE~~/E,IAAI,KAAK,CAAC,UAAU,EAAE,CAAC;QACrB,OAAO,~~CACL,~~oBAAC,KAAK,~~IACJ~~,YAAY,~~QACZ~~,MAAM,EAAE,uBAAuB,~~EAC/B~~,MAAM,EAAE,wBAAwB,~~gBACrB~~,yBAAyB;~~YAEnC~~,CAAC,uBAAuB,KAAK,SAAS,IAAI,uBAAuB,CAAC,MAAM,KAAK,CAAC,CAAC,IAAI,~~CAClF,~~oBAAC,KAAK,IAAC,UAAU;~~gBACf~~,oBAAC,IAAI,IAAC,SAAS,EAAE,kBAAkB,IAAG,aAAa,CAAC,+CAA+C,CAAQ,CACrG~~,CACT~~;~~YACA~~,uBAAuB,IAAI,uBAAuB,CAAC,CAAC,CAAC,IAAI,~~CACxD,~~oBAAC,KAAK;~~gBACJ~~,oBAAC,KAAK,IAAC,UAAU,QAAC,eAAe,EAAC,eAAe,EAAC,SAAS,EAAE,wBAAwB;oBACnF,oBAAC,KAAK,CAAC,IAAI;wBACT,oBAAC,KAAK,IAAC,UAAU,QAAC,SAAS,EAAE,aAAa;4BACxC,oBAAC,KAAK,CAAC,IAAI,IAAC,SAAS,EAAE,aAAa,CAAC,KAAK,CAAC;gCACzC,oBAAC,KAAK,IAAC,aAAa,EAAC,QAAQ,EAAC,eAAe,EAAC,QAAQ;oCACpD,oBAAC,IAAI,IAAC,QAAQ,EAAC,yBAAyB,EAAC,SAAS,EAAE,kBAAkB,CAAC,KAAK,CAAC,GAAI,CAC3E,CACG;4BACb,oBAAC,KAAK,CAAC,IAAI;gCACT,oBAAC,IAAI,IAAC,SAAS,EAAE,mBAAmB,IAAG,aAAa,CAAC,qCAAqC,CAAQ,CACvF,CACP,CACG;oBACb,oBAAC,KAAK,CAAC,IAAI,IAAC,SAAS,EAAE,aAAa,IACjC,uBAAuB,CAAC,GAAG,CAAC,CAAC,WAAW,EAAE,KAAK,EAAE,EAAE,CAAC,~~CACnD,~~oBAAC,KAAK,CAAC,IAAI,IAAC,GAAG,EAAE,KAAK;~~wBACpB~~,oBAAC,IAAI,IAAC,SAAS,EAAE,kBAAkB,EAAE,IAAI,EAAE,qBAAqB,CAAC,WAAW,CAAC,IAC1E,kBAAkB,CAAC,WAAW,CAAC,WAAW,EAAE,IAAI,CAAC,CAC7C;wBACP,oBAAC,IAAI,IAAC,SAAS,EAAE,kBAAkB;4BAChC,GAAG;4BACH,WAAW,CAAC,UAAU~~;gCACrB~~,CAAC,CAAC,aAAa,CAAC,uCAAuC~~;gCACvD~~,CAAC,CAAC,aAAa,CAAC,mCAAmC,~~CAChD~~;wBACP,+BAAM;wBACN,oBAAC,IAAI,IAAC,SAAS,EAAE,kBAAkB;;4BAAI,qBAAqB,CAAC,WAAW,EAAE,aAAa,CAAC,CAAQ,CACrF,~~CACd,~~CAAC,~~CACS~~,CACP;gBACR,oBAAC,KAAK,~~IACJ~~,UAAU,~~QACV~~,eAAe,EAAC,eAAe,~~EAC/B~~,aAAa,EAAC,QAAQ,~~EACtB~~,SAAS,EAAE,wBAAwB;~~oBAEnC~~,oBAAC,KAAK,CAAC,IAAI;wBACT,oBAAC,KAAK,IAAC,UAAU;4BACf,oBAAC,KAAK,CAAC,IAAI,IAAC,SAAS,EAAE,aAAa,CAAC,KAAK,CAAC;gCACzC,oBAAC,IAAI,IAAC,QAAQ,EAAC,6BAA6B,EAAC,SAAS,EAAE,kBAAkB,CAAC,KAAK,CAAC,GAAI,CAC1E;4BACb,oBAAC,KAAK,CAAC,IAAI;gCACT,oBAAC,IAAI,IAAC,SAAS,EAAE,mBAAmB,IACjC,aAAa,CAAC,wCAAwC,CAClD,CACI,CACP,CACG;oBACb,oBAAC,IAAI,IAAC,SAAS,EAAE,kBAAkB;wBAAG,uBAAuB,CAAC,CAAC,CAAC,CAAC,YAAY;4BAAS,CAChF;gBACR,oBAAC,KAAK,~~IACJ~~,UAAU,~~QACV~~,eAAe,EAAC,eAAe,~~EAC/B~~,aAAa,EAAC,QAAQ,~~EACtB~~,SAAS,EAAE,wBAAwB;~~oBAEnC~~,oBAAC,KAAK,IAAC,UAAU;wBACf,oBAAC,KAAK,CAAC,IAAI,IAAC,SAAS,EAAE,aAAa,CAAC,KAAK,CAAC;4BACzC,oBAAC,IAAI,IAAC,QAAQ,EAAC,iCAAiC,EAAC,SAAS,EAAE,kBAAkB,CAAC,KAAK,CAAC,GAAI,CAC9E;wBACb,oBAAC,KAAK,CAAC,IAAI;4BACT,oBAAC,IAAI,IAAC,SAAS,EAAE,mBAAmB,IAAG,aAAa,CAAC,mCAAmC,CAAQ,CACrF,CACP,CACF,CACF,~~CACT~~,~~CACK,CACT,~~CAAC;~~IACJ~~,CAAC;~~IAED~~,OAAO,~~CACL,~~oBAAC,KAAK,~~IACJ~~,YAAY,~~QACZ~~,MAAM,EAAE,uBAAuB,~~EAC/B~~,MAAM,EAAE,wBAAwB,~~gBACrB~~,yBAAyB,~~GAC7B~~,~~CACV,~~CAAC;~~AACJ~~,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\n// eslint-disable-next-line no-restricted-imports\nimport { Stack, Text, useTheme, Icon, Link } from '@fluentui/react';\nimport { _DrawerMenuItemProps } from '@internal/react-components';\nimport React from 'react';\nimport {\n ConferencePhoneInfo~~,\n~~ formatPhoneNumberInfo~~,\n~~ _formatPhoneNumber~~,\n~~ formatPhoneNumberLink\n} from '@internal/react-components';\nimport {\n phoneInfoTextStyle~~,\n~~ phoneInfoIcon~~,\n~~ phoneInfoInstructionLine~~,\n~~ phoneInfoStep~~,\n~~ phoneInfoIconStyle~~,\n~~ phoneInfoLabelStyle~~,\n~~ phoneInfoContainerTokens~~,\n~~ phoneInfoContainerStyle\n} from './styles/TeamsMeetingConferenceInfo.style';\nimport { useLocale } from '../localization';\n\n/*\n @private\n */\nexport const MeetingPhoneInfoPaneContent = (props: {\n mobileView?: boolean;\n conferencePhoneInfoList?: ConferencePhoneInfo[];\n}): JSX.Element => {\n const { conferencePhoneInfoList } = props;\n const theme = useTheme();\n const localeStrings = useLocale().component.strings.meetingConferencePhoneInfo;\n\n if (props.mobileView) {\n return ~~(\n~~ <Stack\n verticalFill\n styles={phoneInfoContainerStyle}\n tokens={phoneInfoContainerTokens}\n data-ui-id=\"phone-info-pane-content\"\n >\n {(conferencePhoneInfoList === undefined \|\| conferencePhoneInfoList.length === 0) && ~~(\n~~ <Stack horizontal>\n <Text className={phoneInfoTextStyle}>{localeStrings.meetingConferencePhoneInfoModalNoPhoneAvailable}</Text>\n </Stack~~>\n )~~}\n {conferencePhoneInfoList && conferencePhoneInfoList[0] && ~~(\n~~ <Stack>\n <Stack horizontal horizontalAlign=\"space-between\" className={phoneInfoInstructionLine}>\n <Stack.Item>\n <Stack horizontal className={phoneInfoStep}>\n <Stack.Item className={phoneInfoIcon(theme)}>\n <Stack verticalAlign=\"center\" horizontalAlign=\"center\">\n <Icon iconName=\"JoinByPhoneDialStepIcon\" className={phoneInfoIconStyle(theme)} />\n </Stack>\n </Stack.Item>\n <Stack.Item>\n <Text className={phoneInfoLabelStyle}>{localeStrings.meetingConferencePhoneInfoModalDialIn}</Text>\n </Stack.Item>\n </Stack>\n </Stack.Item>\n <Stack.Item className={phoneInfoStep}>\n {conferencePhoneInfoList.map((phoneNumber, index) => ~~(\n~~ <Stack.Item key={index}>\n <Link className={phoneInfoTextStyle} href={formatPhoneNumberLink(phoneNumber)}>\n {_formatPhoneNumber(phoneNumber.phoneNumber, true)}\n </Link>\n <Text className={phoneInfoTextStyle}>\n {' '}\n {phoneNumber.isTollFree\n ? localeStrings.meetingConferencePhoneInfoModalTollFree\n : localeStrings.meetingConferencePhoneInfoModalToll}\n </Text>\n <br />\n <Text className={phoneInfoTextStyle}> {formatPhoneNumberInfo(phoneNumber, localeStrings)}</Text>\n </Stack.Item~~>\n~~ ))}\n </Stack.Item>\n </Stack>\n <Stack\n horizontal\n horizontalAlign=\"space-between\"\n verticalAlign=\"center\"\n className={phoneInfoInstructionLine}\n >\n <Stack.Item>\n <Stack horizontal>\n <Stack.Item className={phoneInfoIcon(theme)}>\n <Icon iconName=\"JoinByPhoneConferenceIdIcon\" className={phoneInfoIconStyle(theme)} />\n </Stack.Item>\n <Stack.Item>\n <Text className={phoneInfoLabelStyle}>\n {localeStrings.meetingConferencePhoneInfoModalMeetingId}\n </Text>\n </Stack.Item>\n </Stack>\n </Stack.Item>\n <Text className={phoneInfoTextStyle}>{conferencePhoneInfoList[0].conferenceId}#</Text>\n </Stack>\n <Stack\n horizontal\n horizontalAlign=\"space-between\"\n verticalAlign=\"center\"\n className={phoneInfoInstructionLine}\n >\n <Stack horizontal>\n <Stack.Item className={phoneInfoIcon(theme)}>\n <Icon iconName=\"JoinByPhoneWaitToBeAdmittedIcon\" className={phoneInfoIconStyle(theme)} />\n </Stack.Item>\n <Stack.Item>\n <Text className={phoneInfoLabelStyle}>{localeStrings.meetingConferencePhoneInfoModalWait}</Text>\n </Stack.Item>\n </Stack>\n </Stack>\n </Stack~~>\n )~~}\n </Stack>\n ~~);\n~~ }\n\n return ~~(\n~~ <Stack\n verticalFill\n styles={phoneInfoContainerStyle}\n tokens={phoneInfoContainerTokens}\n data-ui-id=\"phone-info-pane-content\"\n ></Stack>\n ~~);\n~~}~~;\n~~"]}
1	+ {"version":3,"file":"MeetingPhoneInfoPaneContent.js","sourceRoot":"","sources":["../../../../../../preprocess-dist/react-composites/src/composites/common/MeetingPhoneInfoPaneContent.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,iDAAiD;AACjD,OAAO,EAAE,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;AAEpE,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAuB,qBAAqB,EAAE,kBAAkB,EAAE,qBAAqB,EAAE,yCAAmC;AACnI,OAAO,EAAE,kBAAkB,EAAE,aAAa,EAAE,wBAAwB,EAAE,aAAa,EAAE,kBAAkB,EAAE,mBAAmB,EAAE,wBAAwB,EAAE,uBAAuB,EAAE,MAAM,2CAA2C,CAAC;AACnO,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAE5C;;GAEG;AACH,MAAM,CAAC,MAAM,2BAA2B,GAAG,CAAC,KAG3C,EAAe,EAAE;IAChB,MAAM,EACJ,uBAAuB,EACxB,GAAG,KAAK,CAAC;IACV,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IACzB,MAAM,aAAa,GAAG,SAAS,EAAE,CAAC,SAAS,CAAC,OAAO,CAAC,0BAA0B,CAAC;IAC/E,IAAI,KAAK,CAAC,UAAU,EAAE,CAAC;QACrB,OAAO,oBAAC,KAAK,IAAC,YAAY,QAAC,MAAM,EAAE,uBAAuB,EAAE,MAAM,EAAE,wBAAwB,gBAAa,yBAAyB;YAC7H,CAAC,uBAAuB,KAAK,SAAS,IAAI,uBAAuB,CAAC,MAAM,KAAK,CAAC,CAAC,IAAI,oBAAC,KAAK,IAAC,UAAU;gBACjG,oBAAC,IAAI,IAAC,SAAS,EAAE,kBAAkB,IAAG,aAAa,CAAC,+CAA+C,CAAQ,CACrG;YACT,uBAAuB,IAAI,uBAAuB,CAAC,CAAC,CAAC,IAAI,oBAAC,KAAK;gBAC5D,oBAAC,KAAK,IAAC,UAAU,QAAC,eAAe,EAAC,eAAe,EAAC,SAAS,EAAE,wBAAwB;oBACnF,oBAAC,KAAK,CAAC,IAAI;wBACT,oBAAC,KAAK,IAAC,UAAU,QAAC,SAAS,EAAE,aAAa;4BACxC,oBAAC,KAAK,CAAC,IAAI,IAAC,SAAS,EAAE,aAAa,CAAC,KAAK,CAAC;gCACzC,oBAAC,KAAK,IAAC,aAAa,EAAC,QAAQ,EAAC,eAAe,EAAC,QAAQ;oCACpD,oBAAC,IAAI,IAAC,QAAQ,EAAC,yBAAyB,EAAC,SAAS,EAAE,kBAAkB,CAAC,KAAK,CAAC,GAAI,CAC3E,CACG;4BACb,oBAAC,KAAK,CAAC,IAAI;gCACT,oBAAC,IAAI,IAAC,SAAS,EAAE,mBAAmB,IAAG,aAAa,CAAC,qCAAqC,CAAQ,CACvF,CACP,CACG;oBACb,oBAAC,KAAK,CAAC,IAAI,IAAC,SAAS,EAAE,aAAa,IACjC,uBAAuB,CAAC,GAAG,CAAC,CAAC,WAAW,EAAE,KAAK,EAAE,EAAE,CAAC,oBAAC,KAAK,CAAC,IAAI,IAAC,GAAG,EAAE,KAAK;wBACvE,oBAAC,IAAI,IAAC,SAAS,EAAE,kBAAkB,EAAE,IAAI,EAAE,qBAAqB,CAAC,WAAW,CAAC,IAC1E,kBAAkB,CAAC,WAAW,CAAC,WAAW,EAAE,IAAI,CAAC,CAC7C;wBACP,oBAAC,IAAI,IAAC,SAAS,EAAE,kBAAkB;4BAChC,GAAG;4BACH,WAAW,CAAC,UAAU,CAAC,CAAC,CAAC,aAAa,CAAC,uCAAuC,CAAC,CAAC,CAAC,aAAa,CAAC,mCAAmC,CAC9H;wBACP,+BAAM;wBACN,oBAAC,IAAI,IAAC,SAAS,EAAE,kBAAkB;;4BAAI,qBAAqB,CAAC,WAAW,EAAE,aAAa,CAAC,CAAQ,CACrF,CAAC,CACL,CACP;gBACR,oBAAC,KAAK,IAAC,UAAU,QAAC,eAAe,EAAC,eAAe,EAAC,aAAa,EAAC,QAAQ,EAAC,SAAS,EAAE,wBAAwB;oBAC1G,oBAAC,KAAK,CAAC,IAAI;wBACT,oBAAC,KAAK,IAAC,UAAU;4BACf,oBAAC,KAAK,CAAC,IAAI,IAAC,SAAS,EAAE,aAAa,CAAC,KAAK,CAAC;gCACzC,oBAAC,IAAI,IAAC,QAAQ,EAAC,6BAA6B,EAAC,SAAS,EAAE,kBAAkB,CAAC,KAAK,CAAC,GAAI,CAC1E;4BACb,oBAAC,KAAK,CAAC,IAAI;gCACT,oBAAC,IAAI,IAAC,SAAS,EAAE,mBAAmB,IACjC,aAAa,CAAC,wCAAwC,CAClD,CACI,CACP,CACG;oBACb,oBAAC,IAAI,IAAC,SAAS,EAAE,kBAAkB;wBAAG,uBAAuB,CAAC,CAAC,CAAC,CAAC,YAAY;4BAAS,CAChF;gBACR,oBAAC,KAAK,IAAC,UAAU,QAAC,eAAe,EAAC,eAAe,EAAC,aAAa,EAAC,QAAQ,EAAC,SAAS,EAAE,wBAAwB;oBAC1G,oBAAC,KAAK,IAAC,UAAU;wBACf,oBAAC,KAAK,CAAC,IAAI,IAAC,SAAS,EAAE,aAAa,CAAC,KAAK,CAAC;4BACzC,oBAAC,IAAI,IAAC,QAAQ,EAAC,iCAAiC,EAAC,SAAS,EAAE,kBAAkB,CAAC,KAAK,CAAC,GAAI,CAC9E;wBACb,oBAAC,KAAK,CAAC,IAAI;4BACT,oBAAC,IAAI,IAAC,SAAS,EAAE,mBAAmB,IAAG,aAAa,CAAC,mCAAmC,CAAQ,CACrF,CACP,CACF,CACF,CACJ,CAAC;IACb,CAAC;IACD,OAAO,oBAAC,KAAK,IAAC,YAAY,QAAC,MAAM,EAAE,uBAAuB,EAAE,MAAM,EAAE,wBAAwB,gBAAa,yBAAyB,GAAS,CAAC;AAC9I,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\n// eslint-disable-next-line no-restricted-imports\nimport { Stack, Text, useTheme, Icon, Link } from '@fluentui/react';\nimport { _DrawerMenuItemProps } from '@internal/react-components';\nimport React from 'react';\nimport { ConferencePhoneInfo, formatPhoneNumberInfo, _formatPhoneNumber, formatPhoneNumberLink } from '@internal/react-components';\nimport { phoneInfoTextStyle, phoneInfoIcon, phoneInfoInstructionLine, phoneInfoStep, phoneInfoIconStyle, phoneInfoLabelStyle, phoneInfoContainerTokens, phoneInfoContainerStyle } from './styles/TeamsMeetingConferenceInfo.style';\nimport { useLocale } from '../localization';\n\n/*\n @private\n */\nexport const MeetingPhoneInfoPaneContent = (props: {\n mobileView?: boolean;\n conferencePhoneInfoList?: ConferencePhoneInfo[];\n}): JSX.Element => {\n const {\n conferencePhoneInfoList\n } = props;\n const theme = useTheme();\n const localeStrings = useLocale().component.strings.meetingConferencePhoneInfo;\n if (props.mobileView) {\n return <Stack verticalFill styles={phoneInfoContainerStyle} tokens={phoneInfoContainerTokens} data-ui-id=\"phone-info-pane-content\">\n {(conferencePhoneInfoList === undefined \|\| conferencePhoneInfoList.length === 0) && <Stack horizontal>\n <Text className={phoneInfoTextStyle}>{localeStrings.meetingConferencePhoneInfoModalNoPhoneAvailable}</Text>\n </Stack>}\n {conferencePhoneInfoList && conferencePhoneInfoList[0] && <Stack>\n <Stack horizontal horizontalAlign=\"space-between\" className={phoneInfoInstructionLine}>\n <Stack.Item>\n <Stack horizontal className={phoneInfoStep}>\n <Stack.Item className={phoneInfoIcon(theme)}>\n <Stack verticalAlign=\"center\" horizontalAlign=\"center\">\n <Icon iconName=\"JoinByPhoneDialStepIcon\" className={phoneInfoIconStyle(theme)} />\n </Stack>\n </Stack.Item>\n <Stack.Item>\n <Text className={phoneInfoLabelStyle}>{localeStrings.meetingConferencePhoneInfoModalDialIn}</Text>\n </Stack.Item>\n </Stack>\n </Stack.Item>\n <Stack.Item className={phoneInfoStep}>\n {conferencePhoneInfoList.map((phoneNumber, index) => <Stack.Item key={index}>\n <Link className={phoneInfoTextStyle} href={formatPhoneNumberLink(phoneNumber)}>\n {_formatPhoneNumber(phoneNumber.phoneNumber, true)}\n </Link>\n <Text className={phoneInfoTextStyle}>\n {' '}\n {phoneNumber.isTollFree ? localeStrings.meetingConferencePhoneInfoModalTollFree : localeStrings.meetingConferencePhoneInfoModalToll}\n </Text>\n <br />\n <Text className={phoneInfoTextStyle}> {formatPhoneNumberInfo(phoneNumber, localeStrings)}</Text>\n </Stack.Item>)}\n </Stack.Item>\n </Stack>\n <Stack horizontal horizontalAlign=\"space-between\" verticalAlign=\"center\" className={phoneInfoInstructionLine}>\n <Stack.Item>\n <Stack horizontal>\n <Stack.Item className={phoneInfoIcon(theme)}>\n <Icon iconName=\"JoinByPhoneConferenceIdIcon\" className={phoneInfoIconStyle(theme)} />\n </Stack.Item>\n <Stack.Item>\n <Text className={phoneInfoLabelStyle}>\n {localeStrings.meetingConferencePhoneInfoModalMeetingId}\n </Text>\n </Stack.Item>\n </Stack>\n </Stack.Item>\n <Text className={phoneInfoTextStyle}>{conferencePhoneInfoList[0].conferenceId}#</Text>\n </Stack>\n <Stack horizontal horizontalAlign=\"space-between\" verticalAlign=\"center\" className={phoneInfoInstructionLine}>\n <Stack horizontal>\n <Stack.Item className={phoneInfoIcon(theme)}>\n <Icon iconName=\"JoinByPhoneWaitToBeAdmittedIcon\" className={phoneInfoIconStyle(theme)} />\n </Stack.Item>\n <Stack.Item>\n <Text className={phoneInfoLabelStyle}>{localeStrings.meetingConferencePhoneInfoModalWait}</Text>\n </Stack.Item>\n </Stack>\n </Stack>\n </Stack>}\n </Stack>;\n }\n return <Stack verticalFill styles={phoneInfoContainerStyle} tokens={phoneInfoContainerTokens} data-ui-id=\"phone-info-pane-content\"></Stack>;\n};"]}

package/dist/dist-esm/react-composites/src/composites/common/ModalLocalAndRemotePIP.js CHANGED Viewed

@@ -34,15 +34,10 @@ export const ModalLocalAndRemotePIP = (props) => {
     const [touchStartTouches, setTouchStartTouches] = useState(null);
     const onTouchEnd = useCallback((event) => {
         var _a;
-        if (touchStartTouches &&
-            touchStartTouches[0] &&
-            touchStartTouches.length === 1 &&
-            event.changedTouches[0] &&
-            event.changedTouches.length === 1) {
+        if (touchStartTouches && touchStartTouches[0] && touchStartTouches.length === 1 && event.changedTouches[0] && event.changedTouches.length === 1) {
             const touchStartTouch = touchStartTouches[0];
             const touchEndTouch = event.changedTouches[0];
-            if (Math.abs(touchStartTouch.clientX - touchEndTouch.clientX) < 10 &&
-                Math.abs(touchStartTouch.clientY - touchEndTouch.clientY) < 10) {
+            if (Math.abs(touchStartTouch.clientX - touchEndTouch.clientX) < 10 && Math.abs(touchStartTouch.clientY - touchEndTouch.clientY) < 10) {
                 (_a = props.onDismissSidePane) === null || _a === void 0 ? void 0 : _a.call(props);
             }
         }
@@ -61,29 +56,23 @@ export const ModalLocalAndRemotePIP = (props) => {
     const localAndRemotePIP = useMemo(() => {
         var _a, _b, _c, _d;
         if (role === 'Consumer' && (remoteParticipant === null || remoteParticipant === void 0 ? void 0 : remoteParticipant.userId)) {
-            return (React.createElement(Stack, { tabIndex: 0, "aria-label": (_b = (_a = props.strings) === null || _a === void 0 ? void 0 : _a.dismissModalAriaLabel) !== null && _b !== void 0 ? _b : '', onKeyDown: onKeyDown },
-                React.createElement(_RemoteVideoTile, Object.assign({ strings: locale.component.strings.videoGallery }, remoteParticipant, { remoteParticipant: remoteParticipant }))));
+            return React.createElement(Stack, { tabIndex: 0, "aria-label": (_b = (_a = props.strings) === null || _a === void 0 ? void 0 : _a.dismissModalAriaLabel) !== null && _b !== void 0 ? _b : '', onKeyDown: onKeyDown },
+                React.createElement(_RemoteVideoTile, Object.assign({ strings: locale.component.strings.videoGallery }, remoteParticipant, { remoteParticipant: remoteParticipant })));
         }
-        return (React.createElement(Stack, { tabIndex: 0, "aria-label": (_d = (_c = props.strings) === null || _c === void 0 ? void 0 : _c.dismissModalAriaLabel) !== null && _d !== void 0 ? _d : '', onKeyDown: onKeyDown },
-            React.createElement(LocalAndRemotePIP, Object.assign({}, pictureInPictureProps, pictureInPictureHandlers, { remoteParticipant: remoteParticipant }))));
-    }, [
-        role,
-        onKeyDown,
-        pictureInPictureProps,
-        props,
-        pictureInPictureHandlers,
-        locale.component.strings.videoGallery,
-        remoteParticipant
-    ]);
+        return React.createElement(Stack, { tabIndex: 0, "aria-label": (_d = (_c = props.strings) === null || _c === void 0 ? void 0 : _c.dismissModalAriaLabel) !== null && _d !== void 0 ? _d : '', onKeyDown: onKeyDown },
+            React.createElement(LocalAndRemotePIP, Object.assign({}, pictureInPictureProps, pictureInPictureHandlers, { remoteParticipant: remoteParticipant })));
+    }, [role, onKeyDown, pictureInPictureProps, props, pictureInPictureHandlers, locale.component.strings.videoGallery, remoteParticipant]);
     if (role === 'Consumer' && !remoteParticipant) {
         return null;
     }
     const modalStylesThemed = concatStyleSets(modalStyle, (_a = props.styles) === null || _a === void 0 ? void 0 : _a.modal);
-    return (React.createElement(Stack, { styles: rootStyles },
+    return React.createElement(Stack, { styles: rootStyles },
         React.createElement(Stack, { onTouchStart: onTouchStart, onTouchEnd: onTouchEnd },
-            React.createElement(_ModalClone, { isOpen: true, isModeless: true, dragOptions: DRAG_OPTIONS, styles: modalStylesThemed, layerProps: { hostId: props.modalLayerHostId }, minDragPosition: props.minDragPosition, maxDragPosition: props.maxDragPosition },
+            React.createElement(_ModalClone, { isOpen: true, isModeless: true, dragOptions: DRAG_OPTIONS, styles: modalStylesThemed, layerProps: {
+                    hostId: props.modalLayerHostId
+                }, minDragPosition: props.minDragPosition, maxDragPosition: props.maxDragPosition },
             // Only render LocalAndRemotePIP when this component is NOT hidden because VideoGallery needs to have
             // possession of the dominant remote participant video stream
-            !props.hidden && localAndRemotePIP))));
+            !props.hidden && localAndRemotePIP)));
 };
 //# sourceMappingURL=ModalLocalAndRemotePIP.js.map

package/dist/dist-esm/react-composites/src/composites/common/ModalLocalAndRemotePIP.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ModalLocalAndRemotePIP.js","sourceRoot":"","sources":["~~../../../../../../../~~react-composites/src/composites/common/ModalLocalAndRemotePIP.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAAE,eAAe,EAAE,cAAc,EAAgB,KAAK,EAAE,MAAM,iBAAiB,CAAC;AACvF,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC9D,OAAO,EAAE,iBAAiB,EAAE,MAAM,+CAA+C,CAAC;AAClF,OAAO,EAAE,WAAW,EAAE,MAAM,oCAAoC,CAAC;AACjE,OAAO,EAAE,WAAW,EAAE,MAAM,oCAAoC,CAAC;AACjE,OAAO,EAAE,yBAAyB,EAAE,MAAM,sDAAsD,CAAC;AACjG,OAAO,EAAE,WAAW,EAAiB,yCAAmC;AACxE,OAAO,EAAE,gBAAgB,EAAE,yCAAmC;AAC9D,OAAO,~~EACL~~,WAAW,~~EAEX~~,UAAU,~~EACV~~,iBAAiB,~~EAClB~~,MAAM,wCAAwC,CAAC;~~AAChD~~,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAC5C,OAAO,EAAE,OAAO,EAAE,MAAM,0CAA0C,CAAC;AAEnE;;GAEG;AACH,MAAM,YAAY,GAAiB;IACjC,gBAAgB,EAAE,MAAM;IACxB,iBAAiB,EAAE,OAAO;IAC1B,IAAI,EAAE,cAAc;IACpB,YAAY,EAAE,IAAI;CACnB,CAAC;AAYF;;;;GAIG;AACH,MAAM,CAAC,MAAM,sBAAsB,GAAG,CAAC,KAQtC,EAAsB,EAAE;;IACvB,MAAM,UAAU,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,iBAAiB,CAAC;~~IAElE~~,MAAM,IAAI,GAAG,WAAW,CAAC,OAAO,CAAC,CAAC;~~IAElC~~,MAAM,MAAM,GAAG,SAAS,EAAE,CAAC;~~IAE3B~~,MAAM,qBAAqB,GAAG,WAAW,CAAC,yBAAyB,CAAC,CAAC;~~IAErE~~,MAAM,CAAC,iBAAiB,EAAE,oBAAoB,CAAC,GAAG,QAAQ,CAAyB,IAAI,CAAC,CAAC;~~IAEzF~~,MAAM,UAAU,GAAG,WAAW,~~CAC5B~~,CAAC,KAAuB,EAAE,EAAE;;~~QAC1B~~,~~IACE~~,iBAAiB~~;YACjB~~,iBAAiB,CAAC,CAAC,CAAC~~;YACpB~~,iBAAiB,CAAC,MAAM,KAAK,CAAC~~;YAC9B~~,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC~~;YACvB~~,KAAK,CAAC,cAAc,CAAC,MAAM,KAAK,CAAC,~~EACjC~~,CAAC;~~YACD~~,MAAM,eAAe,GAAG,iBAAiB,CAAC,CAAC,CAAC,CAAC;YAC7C,MAAM,aAAa,GAAG,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC;YAC9C,~~IACE~~,IAAI,CAAC,GAAG,CAAC,eAAe,CAAC,OAAO,GAAG,aAAa,CAAC,OAAO,CAAC,GAAG,EAAE~~;gBAC9D~~,IAAI,CAAC,GAAG,CAAC,eAAe,CAAC,OAAO,GAAG,aAAa,CAAC,OAAO,CAAC,GAAG,EAAE,~~EAC9D~~,CAAC;~~gBACD~~,MAAA,KAAK,CAAC,iBAAiB,qDAAI,CAAC;YAC9B,CAAC;QACH,CAAC;IACH,CAAC,~~EACD~~,CAAC,KAAK,EAAE,iBAAiB,CAAC,~~CAC3B~~,CAAC;~~IAEF~~,MAAM,YAAY,GAAG,WAAW,CAAC,CAAC,KAAuB,EAAE,EAAE;QAC3D,oBAAoB,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;IACtC,CAAC,EAAE,EAAE,CAAC,CAAC;~~IAEP~~,MAAM,SAAS,GAAG,WAAW,~~CAC3B~~,CAAC,KAA0B,EAAE,EAAE;;~~QAC7B~~,IAAI,KAAK,CAAC,GAAG,KAAK,OAAO,IAAI,KAAK,CAAC,GAAG,KAAK,GAAG,EAAE,CAAC;YAC/C,MAAA,KAAK,CAAC,iBAAiB,qDAAI,CAAC;QAC9B,CAAC;IACH,CAAC,~~EACD~~,CAAC,KAAK,CAAC,~~CACR~~,CAAC;~~IAEF~~,MAAM,wBAAwB,GAAG,WAAW,CAAC,iBAAiB,CAAC,CAAC;IAChE,MAAM,iBAAiB,GAAG,qBAAqB,CAAC,iBAAiB,CAAC;~~IAElE~~,MAAM,iBAAiB,GAAG,OAAO,CAAC,GAAG,EAAE;;QACrC,IAAI,IAAI,KAAK,UAAU,KAAI,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,MAAM,CAAA,EAAE,CAAC;YACrD,OAAO,~~CACL,~~oBAAC,KAAK,IAAC,QAAQ,EAAE,CAAC,gBAAc,MAAA,MAAA,KAAK,CAAC,OAAO,0CAAE,qBAAqB,mCAAI,EAAE,EAAE,SAAS,EAAE,SAAS;~~gBAC9F~~,oBAAC,gBAAgB,~~kBACf~~,OAAO,EAAE,MAAM,CAAC,SAAS,CAAC,OAAO,CAAC,YAAY,~~IAC1C~~,iBAAiB,~~IACrB~~,iBAAiB,EAAE,iBAAiB,~~IACpC~~,~~CACI~~,~~CACT,~~CAAC;~~QACJ~~,CAAC;QACD,OAAO,~~CACL,~~oBAAC,KAAK,IAAC,QAAQ,EAAE,CAAC,gBAAc,MAAA,MAAA,KAAK,CAAC,OAAO,0CAAE,qBAAqB,mCAAI,EAAE,EAAE,SAAS,EAAE,SAAS;~~YAC9F~~,oBAAC,iBAAiB,~~oBACZ~~,qBAAqB,~~EACrB~~,wBAAwB,~~IAC5B~~,iBAAiB,EAAE,iBAAiB,~~IACpC~~,~~CACI~~,~~CACT,~~CAAC;~~IACJ~~,CAAC,EAAE~~;QACD~~,IAAI~~;QACJ~~,SAAS~~;QACT~~,qBAAqB~~;QACrB~~,KAAK~~;QACL~~,wBAAwB~~;QACxB~~,MAAM,CAAC,SAAS,CAAC,OAAO,CAAC,YAAY~~;QACrC~~,iBAAiB~~;KAClB~~,CAAC,CAAC;~~IAEH~~,IAAI,IAAI,KAAK,UAAU,IAAI,CAAC,iBAAiB,EAAE,CAAC;QAC9C,OAAO,IAAI,CAAC;IACd,CAAC;~~IAED~~,MAAM,iBAAiB,GAAG,eAAe,CAAC,UAAU,EAAE,MAAA,KAAK,CAAC,MAAM,0CAAE,KAAK,CAAC,CAAC;~~IAE3E~~,OAAO,~~CACL,~~oBAAC,KAAK,IAAC,MAAM,EAAE,UAAU;~~QACvB~~,oBAAC,KAAK,IAAC,YAAY,EAAE,YAAY,EAAE,UAAU,EAAE,UAAU;YACvD,oBAAC,WAAW,~~IACV~~,MAAM,EAAE,IAAI,~~EACZ~~,UAAU,EAAE,IAAI,~~EAChB~~,WAAW,EAAE,YAAY,~~EACzB~~,MAAM,EAAE,iBAAiB,~~EACzB~~,UAAU,EAAE,~~EAAE,~~MAAM,EAAE,KAAK,CAAC,gBAAgB,EAAE,~~EAC9C,~~eAAe,EAAE,KAAK,CAAC,eAAe,~~EACtC~~,eAAe,EAAE,KAAK,CAAC,eAAe;~~YAGpC~~,qGAAqG;YACrG,6DAA6D;YAC7D,CAAC,KAAK,CAAC,MAAM,IAAI,iBAAiB,~~CAExB~~,CACR,CACF,~~CACT,~~CAAC;~~AACJ~~,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { concatStyleSets, ContextualMenu, IDragOptions, Stack } from '@fluentui/react';\nimport React, { useCallback, useMemo, useState } from 'react';\nimport { LocalAndRemotePIP } from '../CallComposite/components/LocalAndRemotePIP';\nimport { useHandlers } from '../CallComposite/hooks/useHandlers';\nimport { useSelector } from '../CallComposite/hooks/useSelector';\nimport { localAndRemotePIPSelector } from '../CallComposite/selectors/localAndRemotePIPSelector';\nimport { _ModalClone, _ICoordinates } from '@internal/react-components';\nimport { _RemoteVideoTile } from '@internal/react-components';\nimport {\n hiddenStyle~~,\n~~ ModalLocalAndRemotePIPStyles~~,\n~~ modalStyle~~,\n~~ PIPContainerStyle\n} from './styles/ModalLocalAndRemotePIP.styles';\nimport { useLocale } from '../localization';\nimport { getRole } from '../CallComposite/selectors/baseSelectors';\n\n/*\n Drag options for Modal in {@link ModalLocalAndRemotePIP} component\n /\nconst DRAG_OPTIONS: IDragOptions = {\n moveMenuItemText: 'Move',\n closeMenuItemText: 'Close',\n menu: ContextualMenu,\n keepInBounds: true\n};\n\n/\n @private\n /\nexport interface ModalLocalAndRemotePIPStrings {\n /\n Aria label for dismiss control when using keyboard\n /\n dismissModalAriaLabel?: string;\n}\n\n/\n A wrapping component with a draggable {@link LocalAndRemotePIP} component that is bound to a LayerHost component with id\n * specified by `modalLayerHostId` prop\n * @private\n */\nexport const ModalLocalAndRemotePIP = (props: {\n hidden: boolean;\n modalLayerHostId: string;\n styles?: ModalLocalAndRemotePIPStyles;\n minDragPosition?: _ICoordinates;\n maxDragPosition?: _ICoordinates;\n onDismissSidePane?: () => void;\n strings?: ModalLocalAndRemotePIPStrings;\n}): JSX.Element \| null => {\n const rootStyles = props.hidden ? hiddenStyle : PIPContainerStyle;\n\n const role = useSelector(getRole);\n\n const locale = useLocale();\n\n const pictureInPictureProps = useSelector(localAndRemotePIPSelector);\n\n const [touchStartTouches, setTouchStartTouches] = useState<React.TouchList \| null>(null);\n\n const onTouchEnd = useCallback(\n (event: React.TouchEvent) => {\n if (\n touchStartTouches ~~&&\n~~ touchStartTouches[0] ~~&&\n~~ touchStartTouches.length === 1 ~~&&\n~~ event.changedTouches[0] ~~&&\n~~ event.changedTouches.length === 1\n ) {\n const touchStartTouch = touchStartTouches[0];\n const touchEndTouch = event.changedTouches[0];\n if (\n Math.abs(touchStartTouch.clientX - touchEndTouch.clientX) < 10 ~~&&\n~~ Math.abs(touchStartTouch.clientY - touchEndTouch.clientY) < 10\n ) {\n props.onDismissSidePane?.();\n }\n }\n }~~,\n~~ [props, touchStartTouches]\n );\n\n const onTouchStart = useCallback((event: React.TouchEvent) => {\n setTouchStartTouches(event.touches);\n }, []);\n\n const onKeyDown = useCallback(\n (event: React.KeyboardEvent) => {\n if (event.key === 'Enter' \|\| event.key === ' ') {\n props.onDismissSidePane?.();\n }\n }~~,\n~~ [props]\n );\n\n const pictureInPictureHandlers = useHandlers(LocalAndRemotePIP);\n const remoteParticipant = pictureInPictureProps.remoteParticipant;\n\n const localAndRemotePIP = useMemo(() => {\n if (role === 'Consumer' && remoteParticipant?.userId) {\n return ~~(\n~~ <Stack tabIndex={0} aria-label={props.strings?.dismissModalAriaLabel ?? ''} onKeyDown={onKeyDown}>\n <_RemoteVideoTile\n strings={locale.component.strings.videoGallery}\n {...remoteParticipant}\n remoteParticipant={remoteParticipant}\n />\n </Stack>\n ~~);\n~~ }\n return ~~(\n~~ <Stack tabIndex={0} aria-label={props.strings?.dismissModalAriaLabel ?? ''} onKeyDown={onKeyDown}>\n <LocalAndRemotePIP\n {...pictureInPictureProps}\n {...pictureInPictureHandlers}\n remoteParticipant={remoteParticipant}\n />\n </Stack>\n ~~);\n~~ }, [\n role~~,\n~~ onKeyDown~~,\n~~ pictureInPictureProps~~,\n~~ props~~,\n~~ pictureInPictureHandlers~~,\n~~ locale.component.strings.videoGallery~~,\n~~ remoteParticipant\n ]);\n\n if (role === 'Consumer' && !remoteParticipant) {\n return null;\n }\n\n const modalStylesThemed = concatStyleSets(modalStyle, props.styles?.modal);\n\n return ~~(\n~~ <Stack styles={rootStyles}>\n <Stack onTouchStart={onTouchStart} onTouchEnd={onTouchEnd}>\n <_ModalClone\n isOpen={true}\n isModeless={true}\n dragOptions={DRAG_OPTIONS}\n styles={modalStylesThemed}\n layerProps={{ hostId: props.modalLayerHostId }}\n minDragPosition={props.minDragPosition}\n maxDragPosition={props.maxDragPosition}\n >\n {\n // Only render LocalAndRemotePIP when this component is NOT hidden because VideoGallery needs to have\n // possession of the dominant remote participant video stream\n !props.hidden && localAndRemotePIP\n }\n </_ModalClone>\n </Stack>\n </Stack>\n ~~);\n~~}~~;\n~~"]}
1	+ {"version":3,"file":"ModalLocalAndRemotePIP.js","sourceRoot":"","sources":["../../../../../../preprocess-dist/react-composites/src/composites/common/ModalLocalAndRemotePIP.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { concatStyleSets, ContextualMenu, IDragOptions, Stack } from '@fluentui/react';\nimport React, { useCallback, useMemo, useState } from 'react';\nimport { LocalAndRemotePIP } from '../CallComposite/components/LocalAndRemotePIP';\nimport { useHandlers } from '../CallComposite/hooks/useHandlers';\nimport { useSelector } from '../CallComposite/hooks/useSelector';\nimport { localAndRemotePIPSelector } from '../CallComposite/selectors/localAndRemotePIPSelector';\nimport { _ModalClone, _ICoordinates } from '@internal/react-components';\nimport { _RemoteVideoTile } from '@internal/react-components';\nimport { hiddenStyle, ModalLocalAndRemotePIPStyles, modalStyle, PIPContainerStyle } from './styles/ModalLocalAndRemotePIP.styles';\nimport { useLocale } from '../localization';\nimport { getRole } from '../CallComposite/selectors/baseSelectors';\n\n/*\n Drag options for Modal in {@link ModalLocalAndRemotePIP} component\n /\nconst DRAG_OPTIONS: IDragOptions = {\n moveMenuItemText: 'Move',\n closeMenuItemText: 'Close',\n menu: ContextualMenu,\n keepInBounds: true\n};\n\n/\n @private\n /\nexport interface ModalLocalAndRemotePIPStrings {\n /\n Aria label for dismiss control when using keyboard\n /\n dismissModalAriaLabel?: string;\n}\n\n/\n A wrapping component with a draggable {@link LocalAndRemotePIP} component that is bound to a LayerHost component with id\n * specified by `modalLayerHostId` prop\n * @private\n */\nexport const ModalLocalAndRemotePIP = (props: {\n hidden: boolean;\n modalLayerHostId: string;\n styles?: ModalLocalAndRemotePIPStyles;\n minDragPosition?: _ICoordinates;\n maxDragPosition?: _ICoordinates;\n onDismissSidePane?: () => void;\n strings?: ModalLocalAndRemotePIPStrings;\n}): JSX.Element \| null => {\n const rootStyles = props.hidden ? hiddenStyle : PIPContainerStyle;\n const role = useSelector(getRole);\n const locale = useLocale();\n const pictureInPictureProps = useSelector(localAndRemotePIPSelector);\n const [touchStartTouches, setTouchStartTouches] = useState<React.TouchList \| null>(null);\n const onTouchEnd = useCallback((event: React.TouchEvent) => {\n if (touchStartTouches && touchStartTouches[0] && touchStartTouches.length === 1 && event.changedTouches[0] && event.changedTouches.length === 1) {\n const touchStartTouch = touchStartTouches[0];\n const touchEndTouch = event.changedTouches[0];\n if (Math.abs(touchStartTouch.clientX - touchEndTouch.clientX) < 10 && Math.abs(touchStartTouch.clientY - touchEndTouch.clientY) < 10) {\n props.onDismissSidePane?.();\n }\n }\n }, [props, touchStartTouches]);\n const onTouchStart = useCallback((event: React.TouchEvent) => {\n setTouchStartTouches(event.touches);\n }, []);\n const onKeyDown = useCallback((event: React.KeyboardEvent) => {\n if (event.key === 'Enter' \|\| event.key === ' ') {\n props.onDismissSidePane?.();\n }\n }, [props]);\n const pictureInPictureHandlers = useHandlers(LocalAndRemotePIP);\n const remoteParticipant = pictureInPictureProps.remoteParticipant;\n const localAndRemotePIP = useMemo(() => {\n if (role === 'Consumer' && remoteParticipant?.userId) {\n return <Stack tabIndex={0} aria-label={props.strings?.dismissModalAriaLabel ?? ''} onKeyDown={onKeyDown}>\n <_RemoteVideoTile strings={locale.component.strings.videoGallery} {...remoteParticipant} remoteParticipant={remoteParticipant} />\n </Stack>;\n }\n return <Stack tabIndex={0} aria-label={props.strings?.dismissModalAriaLabel ?? ''} onKeyDown={onKeyDown}>\n <LocalAndRemotePIP {...pictureInPictureProps} {...pictureInPictureHandlers} remoteParticipant={remoteParticipant} />\n </Stack>;\n }, [role, onKeyDown, pictureInPictureProps, props, pictureInPictureHandlers, locale.component.strings.videoGallery, remoteParticipant]);\n if (role === 'Consumer' && !remoteParticipant) {\n return null;\n }\n const modalStylesThemed = concatStyleSets(modalStyle, props.styles?.modal);\n return <Stack styles={rootStyles}>\n <Stack onTouchStart={onTouchStart} onTouchEnd={onTouchEnd}>\n <_ModalClone isOpen={true} isModeless={true} dragOptions={DRAG_OPTIONS} styles={modalStylesThemed} layerProps={{\n hostId: props.modalLayerHostId\n }} minDragPosition={props.minDragPosition} maxDragPosition={props.maxDragPosition}>\n {\n // Only render LocalAndRemotePIP when this component is NOT hidden because VideoGallery needs to have\n // possession of the dominant remote participant video stream\n !props.hidden && localAndRemotePIP}\n </_ModalClone>\n </Stack>\n </Stack>;\n};"]}

package/dist/dist-esm/react-composites/src/composites/common/MoreButton.js CHANGED Viewed

@@ -8,6 +8,6 @@ const icon = () => React.createElement(MoreHorizontal20Filled, { key: 'chatOnIco
  * @private
  */
 export const MoreButton = (props) => {
-    return (React.createElement(ControlBarButton, Object.assign({}, props, { labelKey: 'optionsButtonLabelKey', showLabel: props.showLabel, onRenderOnIcon: icon, onRenderOffIcon: icon, onClick: props.onClick, "data-ui-id": props['data-ui-id'] })));
+    return React.createElement(ControlBarButton, Object.assign({}, props, { labelKey: 'optionsButtonLabelKey', showLabel: props.showLabel, onRenderOnIcon: icon, onRenderOffIcon: icon, onClick: props.onClick, "data-ui-id": props['data-ui-id'] }));
 };
 //# sourceMappingURL=MoreButton.js.map

package/dist/dist-esm/react-composites/src/composites/common/MoreButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MoreButton.js","sourceRoot":"","sources":["~~../../../../../../../~~react-composites/src/composites/common/MoreButton.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,gBAAgB,EAAyB,yCAAmC;AACrF,OAAO,EAAE,sBAAsB,EAAE,MAAM,uBAAuB,CAAC;~~AAE~~/D,MAAM,IAAI,GAAG,GAAgB,EAAE,CAAC,oBAAC,sBAAsB,IAAC,GAAG,EAAE,eAAe,EAAE,WAAW,EAAC,cAAc,GAAG,CAAC;AAE5G;;GAEG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,KAA4B,EAAe,EAAE;IACtE,OAAO,~~CACL,~~oBAAC,gBAAgB,~~oBACX~~,KAAK,~~IACT~~,QAAQ,EAAE,uBAAuB,~~EACjC~~,SAAS,EAAE,KAAK,CAAC,SAAS,~~EAC1B~~,cAAc,EAAE,IAAI,~~EACpB~~,eAAe,EAAE,IAAI,~~EACrB~~,OAAO,EAAE,KAAK,CAAC,OAAO,~~gBACV~~,KAAK,CAAC,YAA2C,CAAC,~~IAC9D~~,~~CACH,~~CAAC;~~AACJ~~,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React from 'react';\nimport { ControlBarButton, ControlBarButtonProps } from '@internal/react-components';\nimport { MoreHorizontal20Filled } from '@fluentui/react-icons';\n\nconst icon = (): JSX.Element => <MoreHorizontal20Filled key={'chatOnIconKey'} primaryFill=\"currentColor\" />;\n\n/*\n @private\n */\nexport const MoreButton = (props: ControlBarButtonProps): JSX.Element => {\n return ~~(\n~~ <ControlBarButton\n {...props}\n labelKey={'optionsButtonLabelKey'}\n showLabel={props.showLabel}\n onRenderOnIcon={icon}\n onRenderOffIcon={icon}\n onClick={props.onClick}\n data-ui-id={props['data-ui-id' as keyof ControlBarButtonProps]}\n ~~/>\n );\n~~}~~;\n~~"]}
1	+ {"version":3,"file":"MoreButton.js","sourceRoot":"","sources":["../../../../../../preprocess-dist/react-composites/src/composites/common/MoreButton.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,gBAAgB,EAAyB,yCAAmC;AACrF,OAAO,EAAE,sBAAsB,EAAE,MAAM,uBAAuB,CAAC;AAC/D,MAAM,IAAI,GAAG,GAAgB,EAAE,CAAC,oBAAC,sBAAsB,IAAC,GAAG,EAAE,eAAe,EAAE,WAAW,EAAC,cAAc,GAAG,CAAC;AAE5G;;GAEG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,KAA4B,EAAe,EAAE;IACtE,OAAO,oBAAC,gBAAgB,oBAAK,KAAK,IAAE,QAAQ,EAAE,uBAAuB,EAAE,SAAS,EAAE,KAAK,CAAC,SAAS,EAAE,cAAc,EAAE,IAAI,EAAE,eAAe,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,CAAC,OAAO,gBAAc,KAAK,CAAC,YAA2C,CAAC,IAAI,CAAC;AAC7O,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React from 'react';\nimport { ControlBarButton, ControlBarButtonProps } from '@internal/react-components';\nimport { MoreHorizontal20Filled } from '@fluentui/react-icons';\nconst icon = (): JSX.Element => <MoreHorizontal20Filled key={'chatOnIconKey'} primaryFill=\"currentColor\" />;\n\n/*\n @private\n */\nexport const MoreButton = (props: ControlBarButtonProps): JSX.Element => {\n return <ControlBarButton {...props} labelKey={'optionsButtonLabelKey'} showLabel={props.showLabel} onRenderOnIcon={icon} onRenderOffIcon={icon} onClick={props.onClick} data-ui-id={props['data-ui-id' as keyof ControlBarButtonProps]} />;\n};"]}

package/dist/dist-esm/react-composites/src/composites/common/ParticipantContainer.js CHANGED Viewed

@@ -14,8 +14,8 @@ import { _formatString } from "../../../../acs-ui-common/src";
 export const ParticipantContainer = (props) => {
     const theme = useTheme();
     const participantListWrapperClassName = useMemo(() => participantListWrapper(theme), [theme]);
-    return (React.createElement(Stack, { className: participantListWrapperClassName },
-        React.createElement(ParticipantListWithHeading, Object.assign({}, props))));
+    return React.createElement(Stack, { className: participantListWrapperClassName },
+        React.createElement(ParticipantListWithHeading, Object.assign({}, props)));
 };
 /**
  * @private
@@ -24,8 +24,6 @@ export const ParticipantListWithHeading = (props) => {
     const { onFetchAvatarPersonaData, onFetchParticipantMenuItems, title, participantListProps, headingMoreButtonAriaLabel, onClickHeadingMoreButton, headingMoreButtonMenuProps, pinnedParticipants } = props;
     const subheadingUniqueId = useId();
     const theme = useTheme();
-    /* @conditional-compile-remove(total-participant-count) */
-    const totalParticipantCount = participantListProps.totalParticipantCount;
     const tooltipId = getId('text-tooltip');
     const subheadingStyleThemed = useMemo(() => ({
         root: {
@@ -37,25 +35,27 @@ export const ParticipantListWithHeading = (props) => {
             }
         }
     }), [theme.palette.neutralSecondary, theme.fonts.smallPlus.fontSize, props.isMobile]);
-    return (React.createElement(Stack, { className: participantListStack },
+    return React.createElement(Stack, { className: participantListStack },
         React.createElement(Stack, { horizontal: true, horizontalAlign: "space-between", verticalAlign: "center" },
             React.createElement(Stack.Item, { grow: true, styles: subheadingStyleThemed, "aria-label": title, id: subheadingUniqueId },
-                React.createElement("h2", null, paneTitleTrampoline(title !== null && title !== void 0 ? title : '',
-                /* @conditional-compile-remove(total-participant-count) */ totalParticipantCount))),
-            (onClickHeadingMoreButton ||
-                ((headingMoreButtonMenuProps === null || headingMoreButtonMenuProps === void 0 ? void 0 : headingMoreButtonMenuProps.items) && headingMoreButtonMenuProps.items.length > 0)) && (React.createElement(Stack.Item, null,
-                React.createElement(DefaultButton, { autoFocus: true, "data-ui-id": "people-pane-header-more-button", ariaLabel: headingMoreButtonAriaLabel, styles: headingMoreButtonStyles(theme), iconProps: { iconName: 'PeoplePaneMoreButton' }, onClick: onClickHeadingMoreButton ? () => onClickHeadingMoreButton() : undefined, menuProps: props.onClickHeadingMoreButton ? undefined : props.headingMoreButtonMenuProps, onRenderMenuIcon: () => null })))),
+                React.createElement("h2", null, paneTitleTrampoline(title !== null && title !== void 0 ? title : ''))),
+            (onClickHeadingMoreButton || (headingMoreButtonMenuProps === null || headingMoreButtonMenuProps === void 0 ? void 0 : headingMoreButtonMenuProps.items) && headingMoreButtonMenuProps.items.length > 0) && React.createElement(Stack.Item, null,
+                React.createElement(DefaultButton, { autoFocus: true, "data-ui-id": "people-pane-header-more-button", ariaLabel: headingMoreButtonAriaLabel, styles: headingMoreButtonStyles(theme), iconProps: {
+                        iconName: 'PeoplePaneMoreButton'
+                    }, onClick: onClickHeadingMoreButton ? () => onClickHeadingMoreButton() : undefined, menuProps: props.onClickHeadingMoreButton ? undefined : props.headingMoreButtonMenuProps, onRenderMenuIcon: () => null }))),
         React.createElement(FocusZone, { className: participantListContainerStyle, shouldFocusOnMount: true },
-            React.createElement(ParticipantList, Object.assign({}, participantListProps, { pinnedParticipants: pinnedParticipants, styles: props.isMobile ? participantListMobileStyle : participantListStyle, onRenderAvatar: (userId, options) => (React.createElement(React.Fragment, null,
+            React.createElement(ParticipantList, Object.assign({}, participantListProps, { pinnedParticipants: pinnedParticipants, styles: props.isMobile ? participantListMobileStyle : participantListStyle, onRenderAvatar: (userId, options) => React.createElement(React.Fragment, null,
                     React.createElement(AvatarPersona, Object.assign({ "data-ui-id": "chat-composite-participant-custom-avatar", userId: userId }, options, { hidePersonaDetails: !!(options === null || options === void 0 ? void 0 : options.text), dataProvider: onFetchAvatarPersonaData, allowActiveBorder: true })),
-                    (options === null || options === void 0 ? void 0 : options.text) && (React.createElement("div", { style: displayNameStyles },
+                    (options === null || options === void 0 ? void 0 : options.text) && React.createElement("div", { style: displayNameStyles },
                         React.createElement(TooltipHost, { content: options === null || options === void 0 ? void 0 : options.text, id: tooltipId, overflowMode: TooltipOverflowMode.Parent },
-                            React.createElement(Text, { nowrap: false, "aria-labelledby": tooltipId }, options === null || options === void 0 ? void 0 : options.text)))))), onFetchParticipantMenuItems: onFetchParticipantMenuItems, showParticipantOverflowTooltip: !props.isMobile, participantAriaLabelledBy: subheadingUniqueId })))));
+                            React.createElement(Text, { nowrap: false, "aria-labelledby": tooltipId }, options === null || options === void 0 ? void 0 : options.text)))), onFetchParticipantMenuItems: onFetchParticipantMenuItems, showParticipantOverflowTooltip: !props.isMobile, participantAriaLabelledBy: subheadingUniqueId }))));
 };
 const paneTitleTrampoline = (paneTitle, totalParticipantCount) => {
-    const participantCountString = totalParticipantCount
-        ? { numberOfPeople: `(${totalParticipantCount})` }
-        : { numberOfPeople: ' ' };
+    const participantCountString = totalParticipantCount ? {
+        numberOfPeople: `(${totalParticipantCount})`
+    } : {
+        numberOfPeople: ' '
+    };
     return _formatString(paneTitle, participantCountString);
 };
 //# sourceMappingURL=ParticipantContainer.js.map

package/dist/dist-esm/react-composites/src/composites/common/ParticipantContainer.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ParticipantContainer.js","sourceRoot":"","sources":["~~../../../../../../../~~react-composites/src/composites/common/ParticipantContainer.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,~~EACL~~,6BAA6B,~~EAC7B~~,0BAA0B,~~EAC1B~~,oBAAoB,~~EACpB~~,oBAAoB,~~EACpB~~,sBAAsB,~~EACtB~~,iBAAiB,~~EACjB~~,uBAAuB,~~EACxB~~,MAAM,sCAAsC,CAAC;~~AAC9C~~,OAAO,EAAE,eAAe,EAAsD,yCAAmC;AACjH,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,EAAE,WAAW,EAAE,mBAAmB,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAC5G,OAAO,EAAE,aAAa,EAAwB,MAAM,iBAAiB,CAAC;AACtE,OAAO,EAAE,aAAa,EAA6B,MAAM,iBAAiB,CAAC;AAC3E,OAAO,EAAE,KAAK,EAAE,MAAM,uBAAuB,CAAC;AAC9C,OAAO,EAAE,aAAa,EAAE,sCAAgC;~~AAUxD~~;;GAEG;AACH,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAAC,KAAgC,EAAe,EAAE;IACpF,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IACzB,MAAM,+BAA+B,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,sBAAsB,CAAC,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAC9F,OAAO,~~CACL,~~oBAAC,KAAK,IAAC,SAAS,EAAE,+BAA+B;~~QAC/C~~,oBAAC,0BAA0B,oBAAK,KAAK,EAAI,CACnC,~~CACT,~~CAAC;~~AACJ~~,CAAC,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,0BAA0B,GAAG,CAAC,KAU1C,EAAe,EAAE;IAChB,MAAM,EACJ,wBAAwB,EACxB,2BAA2B,EAC3B,KAAK,EACL,oBAAoB,EACpB,0BAA0B,EAC1B,wBAAwB,EACxB,0BAA0B,EAC1B,kBAAkB,EACnB,GAAG,KAAK,CAAC;IACV,MAAM,kBAAkB,GAAG,KAAK,EAAE,CAAC;IACnC,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IACzB,~~0DAA0D;IAC1D,~~MAAM,~~qBAAqB,GAAG,oBAAoB,CAAC,qBAAqB,CAAC;IACzE,MAAM,~~SAAS,GAAW,KAAK,CAAC,cAAc,CAAC,CAAC;IAChD,MAAM,qBAAqB,GAAG,OAAO,~~CACnC~~,GAAG,EAAE,CAAC,CAAC;~~QACL~~,IAAI,EAAE;YACJ,EAAE,EAAE;gBACF,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,gBAAgB;gBACrC,MAAM,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,QAAQ;gBACjD,QAAQ,EAAE,KAAK,CAAC,KAAK,CAAC,SAAS,CAAC,QAAQ;gBACxC,UAAU,EAAE,QAAQ;aACrB;SACF;KACF,CAAC,~~EACF~~,CAAC,KAAK,CAAC,OAAO,CAAC,gBAAgB,EAAE,KAAK,CAAC,KAAK,CAAC,SAAS,CAAC,QAAQ,EAAE,KAAK,CAAC,QAAQ,CAAC,~~CACjF~~,CAAC;~~IAEF~~,OAAO,~~CACL,~~oBAAC,KAAK,IAAC,SAAS,EAAE,oBAAoB;~~QACpC~~,oBAAC,KAAK,IAAC,UAAU,QAAC,eAAe,EAAC,eAAe,EAAC,aAAa,EAAC,QAAQ;YACtE,oBAAC,KAAK,CAAC,IAAI,IAAC,IAAI,QAAC,MAAM,EAAE,qBAAqB,gBAAc,KAAK,EAAE,EAAE,EAAE,kBAAkB;gBACvF,gCACG,mBAAmB,~~CAClB~~,KAAK,aAAL,KAAK,cAAL,KAAK,GAAI,EAAE~~;gBACX~~,~~0DAA0D,~~CAAC,~~qBAAqB~~,~~CACjF,CACE,~~CACM;YACZ,CAAC,wBAAwB~~;gBACxB~~,~~CAAC~~,CAAA,0BAA0B,aAA1B,0BAA0B,uBAA1B,0BAA0B,CAAE,KAAK,KAAI,0BAA0B,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,~~CAAC,~~IAAI,~~CACvF,~~oBAAC,KAAK,CAAC,IAAI;~~gBACT~~,oBAAC,aAAa,~~IACZ~~,SAAS,~~sBACE~~,gCAAgC,~~EAC3C~~,SAAS,EAAE,0BAA0B,~~EACrC~~,MAAM,EAAE,uBAAuB,CAAC,KAAK,CAAC,~~EACtC~~,SAAS,EAAE,~~EAAE,~~QAAQ,EAAE,sBAAsB,EAAE,~~EAC/C,~~OAAO,EAAE,wBAAwB,CAAC,CAAC,CAAC,GAAG,EAAE,CAAC,wBAAwB,EAAE,CAAC,CAAC,CAAC,SAAS,~~EAChF~~,SAAS,EAAE,KAAK,CAAC,wBAAwB,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,0BAA0B,~~EACxF~~,gBAAgB,EAAE,GAAG,EAAE,CAAC,IAAI,~~GAC5B~~,~~CACS~~,~~CACd,CACK~~;QACR,oBAAC,SAAS,IAAC,SAAS,EAAE,6BAA6B,EAAE,kBAAkB,EAAE,IAAI;YAC3E,oBAAC,eAAe,~~oBACV~~,oBAAoB,~~IACxB~~,kBAAkB,EAAE,kBAAkB,~~EACtC~~,MAAM,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,0BAA0B,CAAC,CAAC,CAAC,oBAAoB,~~EAC1E~~,cAAc,EAAE,CAAC,MAAM,EAAE,OAAO,EAAE,EAAE,CAAC~~,CACnC~~;~~oBACE~~,oBAAC,aAAa,~~gCACD~~,0CAA0C,~~EACrD~~,MAAM,EAAE,MAAM,~~IACV~~,OAAO,~~IACL~~,kBAAkB,EAAE,CAAC,CAAC,CAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,IAAI,CAAA,~~EACzC~~,YAAY,EAAE,wBAAwB,~~EACtC~~,iBAAiB,EAAE,IAAI,~~IACvB~~;~~oBACD~~,CAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,IAAI,KAAI,~~CAChB,~~6BAAK,KAAK,EAAE,iBAAiB;~~wBAC3B~~,oBAAC,WAAW,IAAC,OAAO,EAAE,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,IAAI,EAAE,EAAE,EAAE,SAAS,EAAE,YAAY,EAAE,mBAAmB,CAAC,MAAM;4BAC1F,oBAAC,IAAI,IAAC,MAAM,EAAE,KAAK,qBAAmB,SAAS,IAC5C,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,IAAI,CACT,CACK,CACV,CACP,~~CACA~~,~~CACJ,EACD,~~2BAA2B,EAAE,2BAA2B,~~EACxD~~,8BAA8B,EAAE,CAAC,KAAK,CAAC,QAAQ,~~EAC/C~~,yBAAyB,EAAE,kBAAkB,~~IAC7C~~,~~CACQ~~,CACN,~~CACT,~~CAAC;~~AACJ~~,CAAC,CAAC;~~AAEF~~,MAAM,mBAAmB,GAAG,CAAC,SAAiB,EAAE,qBAA8B,EAAU,EAAE;IACxF,MAAM,sBAAsB,GAAG,qBAAqB~~;QAClD~~,CAAC,CAAC,~~EAAE~~,cAAc,EAAE,IAAI,qBAAqB,GAAG~~,EAAE~~;~~QAClD~~,CAAC,CAAC,~~EAAE~~,cAAc,EAAE,GAAG,~~EAAE,~~CAAC;~~IAC5B~~,OAAO,aAAa,CAAC,SAAS,EAAE,sBAAsB,CAAC,CAAC;AAC1D,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React, { useMemo } from 'react';\nimport {\n participantListContainerStyle~~,\n~~ participantListMobileStyle~~,\n~~ participantListStack~~,\n~~ participantListStyle~~,\n~~ participantListWrapper~~,\n~~ displayNameStyles~~,\n~~ headingMoreButtonStyles\n} from './styles/ParticipantContainer.styles';\nimport { ParticipantList, ParticipantListProps, ParticipantMenuItemsCallback } from '@internal/react-components';\nimport { FocusZone, Stack, Text, TooltipHost, TooltipOverflowMode, getId, useTheme } from '@fluentui/react';\nimport { DefaultButton, IContextualMenuProps } from '@fluentui/react';\nimport { AvatarPersona, AvatarPersonaDataCallback } from './AvatarPersona';\nimport { useId } from '@fluentui/react-hooks';\nimport { _formatString } from '@internal/acs-ui-common';\n\ntype ParticipantContainerProps = {\n onFetchParticipantMenuItems?: ParticipantMenuItemsCallback;\n onFetchAvatarPersonaData?: AvatarPersonaDataCallback;\n participantListProps: ParticipantListProps;\n title?: string;\n isMobile?: boolean;\n};\n\n/*\n @private\n /\nexport const ParticipantContainer = (props: ParticipantContainerProps): JSX.Element => {\n const theme = useTheme();\n const participantListWrapperClassName = useMemo(() => participantListWrapper(theme), [theme]);\n return ~~(\n~~ <Stack className={participantListWrapperClassName}>\n <ParticipantListWithHeading {...props} />\n </Stack>\n ~~);\n~~};\n\n/\n @private\n /\nexport const ParticipantListWithHeading = (props: {\n participantListProps: ParticipantListProps;\n title?: string;\n isMobile?: boolean;\n onFetchAvatarPersonaData?: AvatarPersonaDataCallback;\n onFetchParticipantMenuItems?: ParticipantMenuItemsCallback;\n headingMoreButtonAriaLabel?: string;\n onClickHeadingMoreButton?: () => void;\n headingMoreButtonMenuProps?: IContextualMenuProps;\n pinnedParticipants?: string[];\n}): JSX.Element => {\n const {\n onFetchAvatarPersonaData,\n onFetchParticipantMenuItems,\n title,\n participantListProps,\n headingMoreButtonAriaLabel,\n onClickHeadingMoreButton,\n headingMoreButtonMenuProps,\n pinnedParticipants\n } = props;\n const subheadingUniqueId = useId();\n const theme = useTheme();\n ~~/ @conditional-compile-remove(total-participant-count) /\n~~ const ~~totalParticipantCount = participantListProps.totalParticipantCount;\n const~~ tooltipId: string = getId('text-tooltip');\n const subheadingStyleThemed = useMemo(\n () => ({\n root: {\n h2: {\n color: theme.palette.neutralSecondary,\n margin: props.isMobile ? '0.5rem 1rem' : '0.5rem',\n fontSize: theme.fonts.smallPlus.fontSize,\n fontWeight: 'normal'\n }\n }\n })~~,\n~~ [theme.palette.neutralSecondary, theme.fonts.smallPlus.fontSize, props.isMobile]\n );\n\n return ~~(\n~~ <Stack className={participantListStack}>\n <Stack horizontal horizontalAlign=\"space-between\" verticalAlign=\"center\">\n <Stack.Item grow styles={subheadingStyleThemed} aria-label={title} id={subheadingUniqueId}>\n <h2>\n {paneTitleTrampoline(\n title ?? ''~~,\n / @conditional-compile-remove(total-participant-count~~) */ totalParticipantCount\n )}\n </h2>\n </Stack.Item>\n {(onClickHeadingMoreButton ~~\|\|\n (~~headingMoreButtonMenuProps?.items && headingMoreButtonMenuProps.items.length > 0)) && ~~(\n~~ <Stack.Item>\n <DefaultButton\n autoFocus\n data-ui-id=\"people-pane-header-more-button\"\n ariaLabel={headingMoreButtonAriaLabel}\n styles={headingMoreButtonStyles(theme)}\n iconProps={{ iconName: 'PeoplePaneMoreButton' }}\n onClick={onClickHeadingMoreButton ? () => onClickHeadingMoreButton() : undefined}\n menuProps={props.onClickHeadingMoreButton ? undefined : props.headingMoreButtonMenuProps}\n onRenderMenuIcon={() => null}\n />\n </Stack.Item~~>\n )~~}\n </Stack>\n <FocusZone className={participantListContainerStyle} shouldFocusOnMount={true}>\n <ParticipantList\n {...participantListProps}\n pinnedParticipants={pinnedParticipants}\n styles={props.isMobile ? participantListMobileStyle : participantListStyle}\n onRenderAvatar={(userId, options) => ~~(\n~~ <>\n <AvatarPersona\n data-ui-id=\"chat-composite-participant-custom-avatar\"\n userId={userId}\n {...options}\n {...{ hidePersonaDetails: !!options?.text }}\n dataProvider={onFetchAvatarPersonaData}\n allowActiveBorder={true}\n />\n {options?.text && ~~(\n~~ <div style={displayNameStyles}>\n <TooltipHost content={options?.text} id={tooltipId} overflowMode={TooltipOverflowMode.Parent}>\n <Text nowrap={false} aria-labelledby={tooltipId}>\n {options?.text}\n </Text>\n </TooltipHost>\n </div~~>\n )~~}\n ~~</>\n )~~}\n onFetchParticipantMenuItems={onFetchParticipantMenuItems}\n showParticipantOverflowTooltip={!props.isMobile}\n participantAriaLabelledBy={subheadingUniqueId}\n />\n </FocusZone>\n </Stack>\n ~~);\n~~};\n\nconst paneTitleTrampoline = (paneTitle: string, totalParticipantCount?: number): string => {\n const participantCountString = totalParticipantCount\n ~~? {~~ numberOfPeople: `(${totalParticipantCount})` }\n ~~: {~~ numberOfPeople: ' ' };\n return _formatString(paneTitle, participantCountString);\n}~~;\n~~"]}
1	+ {"version":3,"file":"ParticipantContainer.js","sourceRoot":"","sources":["../../../../../../preprocess-dist/react-composites/src/composites/common/ParticipantContainer.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React, { useMemo } from 'react';\nimport { participantListContainerStyle, participantListMobileStyle, participantListStack, participantListStyle, participantListWrapper, displayNameStyles, headingMoreButtonStyles } from './styles/ParticipantContainer.styles';\nimport { ParticipantList, ParticipantListProps, ParticipantMenuItemsCallback } from '@internal/react-components';\nimport { FocusZone, Stack, Text, TooltipHost, TooltipOverflowMode, getId, useTheme } from '@fluentui/react';\nimport { DefaultButton, IContextualMenuProps } from '@fluentui/react';\nimport { AvatarPersona, AvatarPersonaDataCallback } from './AvatarPersona';\nimport { useId } from '@fluentui/react-hooks';\nimport { _formatString } from '@internal/acs-ui-common';\ntype ParticipantContainerProps = {\n onFetchParticipantMenuItems?: ParticipantMenuItemsCallback;\n onFetchAvatarPersonaData?: AvatarPersonaDataCallback;\n participantListProps: ParticipantListProps;\n title?: string;\n isMobile?: boolean;\n};\n\n/*\n @private\n /\nexport const ParticipantContainer = (props: ParticipantContainerProps): JSX.Element => {\n const theme = useTheme();\n const participantListWrapperClassName = useMemo(() => participantListWrapper(theme), [theme]);\n return <Stack className={participantListWrapperClassName}>\n <ParticipantListWithHeading {...props} />\n </Stack>;\n};\n\n/\n @private\n */\nexport const ParticipantListWithHeading = (props: {\n participantListProps: ParticipantListProps;\n title?: string;\n isMobile?: boolean;\n onFetchAvatarPersonaData?: AvatarPersonaDataCallback;\n onFetchParticipantMenuItems?: ParticipantMenuItemsCallback;\n headingMoreButtonAriaLabel?: string;\n onClickHeadingMoreButton?: () => void;\n headingMoreButtonMenuProps?: IContextualMenuProps;\n pinnedParticipants?: string[];\n}): JSX.Element => {\n const {\n onFetchAvatarPersonaData,\n onFetchParticipantMenuItems,\n title,\n participantListProps,\n headingMoreButtonAriaLabel,\n onClickHeadingMoreButton,\n headingMoreButtonMenuProps,\n pinnedParticipants\n } = props;\n const subheadingUniqueId = useId();\n const theme = useTheme();\n const tooltipId: string = getId('text-tooltip');\n const subheadingStyleThemed = useMemo(() => ({\n root: {\n h2: {\n color: theme.palette.neutralSecondary,\n margin: props.isMobile ? '0.5rem 1rem' : '0.5rem',\n fontSize: theme.fonts.smallPlus.fontSize,\n fontWeight: 'normal'\n }\n }\n }), [theme.palette.neutralSecondary, theme.fonts.smallPlus.fontSize, props.isMobile]);\n return <Stack className={participantListStack}>\n <Stack horizontal horizontalAlign=\"space-between\" verticalAlign=\"center\">\n <Stack.Item grow styles={subheadingStyleThemed} aria-label={title} id={subheadingUniqueId}>\n <h2>\n {paneTitleTrampoline(title ?? '')}\n </h2>\n </Stack.Item>\n {(onClickHeadingMoreButton \|\| headingMoreButtonMenuProps?.items && headingMoreButtonMenuProps.items.length > 0) && <Stack.Item>\n <DefaultButton autoFocus data-ui-id=\"people-pane-header-more-button\" ariaLabel={headingMoreButtonAriaLabel} styles={headingMoreButtonStyles(theme)} iconProps={{\n iconName: 'PeoplePaneMoreButton'\n }} onClick={onClickHeadingMoreButton ? () => onClickHeadingMoreButton() : undefined} menuProps={props.onClickHeadingMoreButton ? undefined : props.headingMoreButtonMenuProps} onRenderMenuIcon={() => null} />\n </Stack.Item>}\n </Stack>\n <FocusZone className={participantListContainerStyle} shouldFocusOnMount={true}>\n <ParticipantList {...participantListProps} pinnedParticipants={pinnedParticipants} styles={props.isMobile ? participantListMobileStyle : participantListStyle} onRenderAvatar={(userId, options) => <>\n <AvatarPersona data-ui-id=\"chat-composite-participant-custom-avatar\" userId={userId} {...options} {...{\n hidePersonaDetails: !!options?.text\n }} dataProvider={onFetchAvatarPersonaData} allowActiveBorder={true} />\n {options?.text && <div style={displayNameStyles}>\n <TooltipHost content={options?.text} id={tooltipId} overflowMode={TooltipOverflowMode.Parent}>\n <Text nowrap={false} aria-labelledby={tooltipId}>\n {options?.text}\n </Text>\n </TooltipHost>\n </div>}\n </>} onFetchParticipantMenuItems={onFetchParticipantMenuItems} showParticipantOverflowTooltip={!props.isMobile} participantAriaLabelledBy={subheadingUniqueId} />\n </FocusZone>\n </Stack>;\n};\nconst paneTitleTrampoline = (paneTitle: string, totalParticipantCount?: number): string => {\n const participantCountString = totalParticipantCount ? {\n numberOfPeople: `(${totalParticipantCount})`\n } : {\n numberOfPeople: ' '\n };\n return _formatString(paneTitle, participantCountString);\n};"]}

package/dist/dist-esm/react-composites/src/composites/common/PeoplePaneContent.js CHANGED Viewed

@@ -53,15 +53,7 @@ export const PeoplePaneContent = (props) => {
                 setDrawerMenuItems(drawerMenuItems);
             }
         };
-    }, [
-        strings,
-        participantListDefaultProps.onRemoveParticipant,
-        participantListDefaultProps.myUserId,
-        removeButtonAllowed,
-        onFetchParticipantMenuItems,
-        setDrawerMenuItems,
-        setParticipantActioned
-    ]);
+    }, [strings, participantListDefaultProps.onRemoveParticipant, participantListDefaultProps.myUserId, removeButtonAllowed, onFetchParticipantMenuItems, setDrawerMenuItems, setParticipantActioned]);
     const setDrawerMenuItemsForParticipantListHeadingMoreButton = useMemo(() => {
         const drawerMenuItems = participantListHeadingMoreButtonProps === null || participantListHeadingMoreButtonProps === void 0 ? void 0 : participantListHeadingMoreButtonProps.items.map((contextualMenu) => convertContextualMenuItemToDrawerMenuItem(contextualMenu, () => setDrawerMenuItems([])));
         return drawerMenuItems && drawerMenuItems.length > 0 ? () => setDrawerMenuItems(drawerMenuItems) : undefined;
@@ -74,13 +66,13 @@ export const PeoplePaneContent = (props) => {
             // We want the drawer menu items to appear when participants in ParticipantList are clicked
             onParticipantClick: props.mobileView ? setDrawerMenuItemsForParticipant : undefined });
     }, [participantListDefaultProps, props.mobileView, setDrawerMenuItemsForParticipant, removeParticipantFromCall]);
-    const participantList = (React.createElement(ParticipantListWithHeading, { isMobile: props.mobileView, participantListProps: participantListProps, onFetchAvatarPersonaData: props.onFetchAvatarPersonaData, onFetchParticipantMenuItems: props.mobileView ? undefined : onFetchParticipantMenuItems, title: strings.peoplePaneSubTitle, headingMoreButtonAriaLabel: localeStrings.strings.call.peoplePaneMoreButtonAriaLabel, onClickHeadingMoreButton: props.mobileView ? setDrawerMenuItemsForParticipantListHeadingMoreButton : undefined, headingMoreButtonMenuProps: props.participantListHeadingMoreButtonProps, pinnedParticipants: props.pinnedParticipants }));
+    const participantList = React.createElement(ParticipantListWithHeading, { isMobile: props.mobileView, participantListProps: participantListProps, onFetchAvatarPersonaData: props.onFetchAvatarPersonaData, onFetchParticipantMenuItems: props.mobileView ? undefined : onFetchParticipantMenuItems, title: strings.peoplePaneSubTitle, headingMoreButtonAriaLabel: localeStrings.strings.call.peoplePaneMoreButtonAriaLabel, onClickHeadingMoreButton: props.mobileView ? setDrawerMenuItemsForParticipantListHeadingMoreButton : undefined, headingMoreButtonMenuProps: props.participantListHeadingMoreButtonProps, pinnedParticipants: props.pinnedParticipants });
     if (props.mobileView) {
-        return (React.createElement(Stack, { verticalFill: true, styles: peoplePaneContainerStyle, tokens: peoplePaneContainerTokens, "data-ui-id": "people-pane-content" },
+        return React.createElement(Stack, { verticalFill: true, styles: peoplePaneContainerStyle, tokens: peoplePaneContainerTokens, "data-ui-id": "people-pane-content" },
             React.createElement(Stack.Item, { grow: true, styles: participantListContainerStyles }, participantList),
-            React.createElement(AddPeopleButton, { inviteLink: inviteLink, mobileView: props.mobileView, participantList: participantList, strings: strings, onAddParticipant: addParticipantToCall, alternateCallerId: props.alternateCallerId })));
+            React.createElement(AddPeopleButton, { inviteLink: inviteLink, mobileView: props.mobileView, participantList: participantList, strings: strings, onAddParticipant: addParticipantToCall, alternateCallerId: props.alternateCallerId }));
     }
-    return (React.createElement(AddPeopleButton, { inviteLink: inviteLink, mobileView: props.mobileView, participantList: participantList, strings: strings, onAddParticipant: addParticipantToCall, alternateCallerId: props.alternateCallerId }));
+    return React.createElement(AddPeopleButton, { inviteLink: inviteLink, mobileView: props.mobileView, participantList: participantList, strings: strings, onAddParticipant: addParticipantToCall, alternateCallerId: props.alternateCallerId });
 };
 /**
  * Create default contextual menu items for particant
@@ -103,7 +95,11 @@ const createDefaultContextualMenuItems = (participant, strings, onRemoveParticip
             },
             iconProps: {
                 iconName: 'ContextMenuRemoveParticipant',
-                styles: { root: { lineHeight: 0 } }
+                styles: {
+                    root: {
+                        lineHeight: 0
+                    }
+                }
             },
             'data-ui-id': 'participant-list-remove-participant-button'
         });