npm - @azure/communication-react - Versions diffs - 1.23.0 → 1.24.0-alpha-202501250016 - Mend

@azure/communication-react 1.23.0 → 1.24.0-alpha-202501250016

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

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

@@ -29,7 +29,7 @@ import { getTeamsMeetingCoordinates, getIsTeamsMeeting } from '../../CallComposi
  * @private
  */
 export const DesktopMoreButton = (props) => {
-    var _a, _b, _c, _d, _e;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
     const localeStrings = useLocale();
     const holdButtonProps = usePropsFor(HoldButton);
     const startCaptionsButtonProps = usePropsFor(StartCaptionsButton);
@@ -38,6 +38,8 @@ export const DesktopMoreButton = (props) => {
             spokenLanguage: startCaptionsButtonProps.currentSpokenLanguage
         });
     }), [startCaptionsButtonProps]);
+    /* @conditional-compile-remove(overflow-top-composite) */
+    const [galleryPositionTop, setGalleryPositionTop] = useState(false);
     const [focusedContentOn, setFocusedContentOn] = useState(false);
     const [previousLayout, setPreviousLayout] = useState((_a = props.userSetGalleryLayout) !== null && _a !== void 0 ? _a : 'floatingLocalVideo');
     const callees = useSelector(getTargetCallees);
@@ -64,14 +66,7 @@ export const DesktopMoreButton = (props) => {
             onClick: () => {
                 holdButtonProps.onToggleHold();
             },
-            iconProps: {
-                iconName: 'HoldCallContextualMenuItem',
-                styles: {
-                    root: {
-                        lineHeight: 0
-                    }
-                }
-            },
+            iconProps: { iconName: 'HoldCallContextualMenuItem', styles: { root: { lineHeight: 0 } } },
             itemProps: {
                 styles: buttonFlyoutIncreasedSizeStyles
             },
@@ -85,14 +80,7 @@ export const DesktopMoreButton = (props) => {
             key: 'liveCaptionsKey',
             id: 'common-call-composite-captions-button',
             text: localeStrings.strings.call.liveCaptionsLabel,
-            iconProps: {
-                iconName: 'CaptionsIcon',
-                styles: {
-                    root: {
-                        lineHeight: 0
-                    }
-                }
-            },
+            iconProps: { iconName: 'CaptionsIcon', styles: { root: { lineHeight: 0 } } },
             itemProps: {
                 styles: buttonFlyoutIncreasedSizeStyles
             },
@@ -112,17 +100,19 @@ export const DesktopMoreButton = (props) => {
         captionsContextualMenuItems.push({
             key: 'ToggleCaptionsKey',
             id: 'common-call-composite-captions-toggle-button',
-            text: startCaptionsButtonProps.checked ? localeStrings.strings.call.startCaptionsButtonTooltipOnContent : localeStrings.strings.call.startCaptionsButtonTooltipOffContent,
+            text: startCaptionsButtonProps.checked
+                ? localeStrings.strings.call.startCaptionsButtonTooltipOnContent
+                : localeStrings.strings.call.startCaptionsButtonTooltipOffContent,
             onClick: () => {
-                startCaptionsButtonProps.checked ? startCaptionsButtonProps.onStopCaptions() : startCaptionsButtonProps.currentSpokenLanguage !== '' ? startCaptions() : props.onCaptionsSettingsClick && props.onCaptionsSettingsClick();
+                startCaptionsButtonProps.checked
+                    ? startCaptionsButtonProps.onStopCaptions()
+                    : startCaptionsButtonProps.currentSpokenLanguage !== ''
+                        ? startCaptions()
+                        : props.onCaptionsSettingsClick && props.onCaptionsSettingsClick();
             },
             iconProps: {
                 iconName: startCaptionsButtonProps.checked ? 'CaptionsOffIcon' : 'CaptionsIcon',
-                styles: {
-                    root: {
-                        lineHeight: 0
-                    }
-                }
+                styles: { root: { lineHeight: 0 } }
             },
             itemProps: {
                 styles: buttonFlyoutIncreasedSizeStyles
@@ -137,11 +127,7 @@ export const DesktopMoreButton = (props) => {
                 onClick: props.onCaptionsSettingsClick,
                 iconProps: {
                     iconName: 'CaptionsSettingsIcon',
-                    styles: {
-                        root: {
-                            lineHeight: 0
-                        }
-                    }
+                    styles: { root: { lineHeight: 0 } }
                 },
                 itemProps: {
                     styles: buttonFlyoutIncreasedSizeStyles
@@ -155,18 +141,16 @@ export const DesktopMoreButton = (props) => {
         itemProps: {
             styles: buttonFlyoutIncreasedSizeStyles
         },
-        text: !dtmfDialerChecked ? localeStrings.strings.call.dtmfDialerMoreButtonLabelOn : localeStrings.strings.call.dtmfDialerMoreButtonLabelOff,
+        text: !dtmfDialerChecked
+            ? localeStrings.strings.call.dtmfDialerMoreButtonLabelOn
+            : localeStrings.strings.call.dtmfDialerMoreButtonLabelOff,
         onClick: () => {
             props.onSetDialpadPage && props.onSetDialpadPage();
             setDtmfDialerChecked(!dtmfDialerChecked);
         },
         iconProps: {
             iconName: 'DtmfDialpadButton',
-            styles: {
-                root: {
-                    lineHeight: 0
-                }
-            }
+            styles: { root: { lineHeight: 0 } }
         }
     };
     /**
@@ -188,11 +172,7 @@ export const DesktopMoreButton = (props) => {
         },
         iconProps: {
             iconName: 'PhoneNumberButton',
-            styles: {
-                root: {
-                    lineHeight: 0
-                }
-            }
+            styles: { root: { lineHeight: 0 } }
         }
     };
     /**
@@ -206,11 +186,7 @@ export const DesktopMoreButton = (props) => {
             key: 'overflowGalleryPositionKey',
             iconProps: {
                 iconName: 'GalleryOptions',
-                styles: {
-                    root: {
-                        lineHeight: 0
-                    }
-                }
+                styles: { root: { lineHeight: 0 } }
             },
             itemProps: {
                 styles: buttonFlyoutIncreasedSizeStyles
@@ -221,7 +197,8 @@ export const DesktopMoreButton = (props) => {
             text: localeStrings.strings.call.moreButtonGalleryControlLabel,
             disabled: props.disableButtonsForHoldScreen,
             subMenuProps: {
-                items: [{
+                items: [
+                    {
                         key: 'dynamicSelectionKey',
                         text: localeStrings.strings.call.moreButtonGalleryFloatingLocalLayoutLabel,
                         canCheck: true,
@@ -235,13 +212,10 @@ export const DesktopMoreButton = (props) => {
                         },
                         iconProps: {
                             iconName: 'FloatingLocalVideoGalleryLayout',
-                            styles: {
-                                root: {
-                                    lineHeight: 0
-                                }
-                            }
+                            styles: { root: { lineHeight: 0 } }
                         }
-                    }, {
+                    },
+                    {
                         key: 'speakerSelectionKey',
                         text: localeStrings.strings.call.moreButtonGallerySpeakerLayoutLabel,
                         canCheck: true,
@@ -255,13 +229,10 @@ export const DesktopMoreButton = (props) => {
                         },
                         iconProps: {
                             iconName: 'SpeakerGalleryLayout',
-                            styles: {
-                                root: {
-                                    lineHeight: 0
-                                }
-                            }
+                            styles: { root: { lineHeight: 0 } }
                         }
-                    }, {
+                    },
+                    {
                         key: 'focusedContentSelectionKey',
                         text: localeStrings.strings.call.moreButtonGalleryFocusedContentLayoutLabel,
                         canCheck: true,
@@ -283,46 +254,110 @@ export const DesktopMoreButton = (props) => {
                         },
                         iconProps: {
                             iconName: 'FocusedContentGalleryLayout',
-                            styles: {
-                                root: {
-                                    lineHeight: 0
-                                }
-                            }
+                            styles: { root: { lineHeight: 0 } }
                         }
-                    }],
+                    }
+                ],
                 calloutProps: {
                     preventDismissOnEvent: _preventDismissOnEvent
                 }
             }
         };
-        if (props.callControls === true || ((_e = props.callControls) === null || _e === void 0 ? void 0 : _e.galleryControlsButton) !== false) {
+        /* @conditional-compile-remove(gallery-layout-composite) */
+        const galleryOption = {
+            key: 'defaultSelectionKey',
+            text: localeStrings.strings.call.moreButtonGalleryDefaultLayoutLabel,
+            canCheck: true,
+            itemProps: {
+                styles: buttonFlyoutIncreasedSizeStyles
+            },
+            isChecked: props.userSetGalleryLayout === 'default',
+            onClick: () => {
+                props.onUserSetGalleryLayout && props.onUserSetGalleryLayout('default');
+                setFocusedContentOn(false);
+            },
+            iconProps: {
+                iconName: 'DefaultGalleryLayout',
+                styles: { root: { lineHeight: 0 } }
+            }
+        };
+        /* @conditional-compile-remove(large-gallery) */
+        const largeGalleryOption = {
+            key: 'largeGallerySelectionKey',
+            text: localeStrings.strings.call.moreButtonLargeGalleryDefaultLayoutLabel,
+            canCheck: true,
+            itemProps: {
+                styles: buttonFlyoutIncreasedSizeStyles
+            },
+            isChecked: props.userSetGalleryLayout === 'largeGallery',
+            onClick: () => {
+                props.onUserSetGalleryLayout && props.onUserSetGalleryLayout('largeGallery');
+                setFocusedContentOn(false);
+            },
+            iconProps: {
+                iconName: 'LargeGalleryLayout',
+                styles: { root: { lineHeight: 0 } }
+            }
+        };
+        /* @conditional-compile-remove(overflow-top-composite) */
+        const overflowGalleryOption = {
+            key: 'topKey',
+            text: localeStrings.strings.call.moreButtonGalleryPositionToggleLabel,
+            canCheck: true,
+            topDivider: true,
+            itemProps: {
+                styles: buttonFlyoutIncreasedSizeStyles
+            },
+            iconProps: {
+                iconName: 'OverflowGalleryTop',
+                styles: { root: { lineHeight: 0 } }
+            },
+            isChecked: galleryPositionTop,
+            onClick: () => {
+                if (galleryPositionTop === false) {
+                    props.onUserSetOverflowGalleryPositionChange && props.onUserSetOverflowGalleryPositionChange('horizontalTop');
+                    setGalleryPositionTop(true);
+                }
+                else {
+                    props.onUserSetOverflowGalleryPositionChange && props.onUserSetOverflowGalleryPositionChange('Responsive');
+                    setGalleryPositionTop(false);
+                }
+            }
+        };
+        /* @conditional-compile-remove(large-gallery) */
+        (_f = (_e = galleryOptions.subMenuProps) === null || _e === void 0 ? void 0 : _e.items) === null || _f === void 0 ? void 0 : _f.push(largeGalleryOption);
+        /* @conditional-compile-remove(gallery-layout-composite) */
+        (_h = (_g = galleryOptions.subMenuProps) === null || _g === void 0 ? void 0 : _g.items) === null || _h === void 0 ? void 0 : _h.push(galleryOption);
+        /* @conditional-compile-remove(overflow-top-composite) */
+        (_k = (_j = galleryOptions.subMenuProps) === null || _j === void 0 ? void 0 : _j.items) === null || _k === void 0 ? void 0 : _k.push(overflowGalleryOption);
+        if (props.callControls === true || ((_l = props.callControls) === null || _l === void 0 ? void 0 : _l.galleryControlsButton) !== false) {
             moreButtonContextualMenuItems.push(galleryOptions);
         }
     }
     const customDrawerButtons = useMemo(() => generateCustomCallDesktopOverflowButtons(onFetchCustomButtonPropsTrampoline(typeof props.callControls === 'object' ? props.callControls : undefined), typeof props.callControls === 'object' ? props.callControls.displayType : undefined), [props.callControls]);
-    customDrawerButtons['primary'].slice(CUSTOM_BUTTON_OPTIONS.MAX_PRIMARY_DESKTOP_CUSTOM_BUTTONS).forEach(element => {
+    customDrawerButtons['primary'].slice(CUSTOM_BUTTON_OPTIONS.MAX_PRIMARY_DESKTOP_CUSTOM_BUTTONS).forEach((element) => {
         moreButtonContextualMenuItems.push(Object.assign({ itemProps: {
                 styles: buttonFlyoutIncreasedSizeStyles
             } }, element));
     });
-    customDrawerButtons['secondary'].slice(CUSTOM_BUTTON_OPTIONS.MAX_SECONDARY_DESKTOP_CUSTOM_BUTTONS).forEach(element => {
+    customDrawerButtons['secondary']
+        .slice(CUSTOM_BUTTON_OPTIONS.MAX_SECONDARY_DESKTOP_CUSTOM_BUTTONS)
+        .forEach((element) => {
         moreButtonContextualMenuItems.push(Object.assign({ itemProps: {
                 styles: buttonFlyoutIncreasedSizeStyles
             } }, element));
     });
-    customDrawerButtons['overflow'].forEach(element => {
+    customDrawerButtons['overflow'].forEach((element) => {
         moreButtonContextualMenuItems.push(Object.assign({ itemProps: {
                 styles: buttonFlyoutIncreasedSizeStyles
             } }, element));
     });
-    return React.createElement(MoreButton, Object.assign({}, props, { "data-ui-id": "common-call-composite-more-button", strings: moreButtonStrings, menuIconProps: {
-            hidden: true
-        }, menuProps: {
+    return (React.createElement(MoreButton, Object.assign({}, props, { "data-ui-id": "common-call-composite-more-button", strings: moreButtonStrings, menuIconProps: { hidden: true }, menuProps: {
             shouldFocusOnContainer: false,
             items: moreButtonContextualMenuItems,
             calloutProps: {
                 preventDismissOnEvent: _preventDismissOnEvent
             }
-        } }));
+        } })));
 };
 //# sourceMappingURL=DesktopMoreButton.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"DesktopMoreButton.js","sourceRoot":"","sources":["../../../../../../../preprocess-dist/react-composites/src/composites/common/ControlBar/DesktopMoreButton.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { IContextualMenuItem } from '@fluentui/react';\nimport { ControlBarButtonProps } from '@internal/react-components';\nimport { VideoGalleryLayout } from '@internal/react-components';\nimport { HoldButton } from '@internal/react-components';\nimport { StartCaptionsButton } from '@internal/react-components';\nimport React from 'react';\nimport { useState } from 'react';\nimport { useMemo, useCallback } from 'react';\nimport { usePropsFor } from '../../CallComposite/hooks/usePropsFor';\nimport { buttonFlyoutIncreasedSizeStyles } from '../../CallComposite/styles/Buttons.styles';\nimport { MoreButton } from '../MoreButton';\nimport { useLocale } from '../../localization';\nimport { CommonCallControlOptions } from '../types/CommonCallControlOptions';\nimport { CUSTOM_BUTTON_OPTIONS, generateCustomCallDesktopOverflowButtons, onFetchCustomButtonPropsTrampoline } from './CustomButton';\nimport { _preventDismissOnEvent } from '@internal/acs-ui-common';\nimport { showDtmfDialer } from '../../CallComposite/utils/MediaGalleryUtils';\nimport { useSelector } from '../../CallComposite/hooks/useSelector';\nimport { getTargetCallees } from '../../CallComposite/selectors/baseSelectors';\nimport { getTeamsMeetingCoordinates, getIsTeamsMeeting } from '../../CallComposite/selectors/baseSelectors';\nimport { CallControlOptions } from '../../CallComposite';\n\n/** @private /\nexport interface DesktopMoreButtonProps extends ControlBarButtonProps {\n disableButtonsForHoldScreen?: boolean;\n onClickShowDialpad?: () => void;\n isCaptionsSupported?: boolean;\n callControls?: boolean \| CommonCallControlOptions;\n onCaptionsSettingsClick?: () => void;\n onUserSetOverflowGalleryPositionChange?: (position: 'Responsive' \| 'horizontalTop') => void;\n onUserSetGalleryLayout?: (layout: VideoGalleryLayout) => void;\n userSetGalleryLayout?: VideoGalleryLayout;\n onSetDialpadPage?: () => void;\n dtmfDialerPresent?: boolean;\n teamsMeetingPhoneCallEnable?: boolean;\n onMeetingPhoneInfoClick?: () => void;\n}\n\n/\n \n * @private\n /\nexport const DesktopMoreButton = (props: DesktopMoreButtonProps): JSX.Element => {\n const localeStrings = useLocale();\n const holdButtonProps = usePropsFor(HoldButton);\n const startCaptionsButtonProps = usePropsFor(StartCaptionsButton);\n const startCaptions = useCallback(async () => {\n await startCaptionsButtonProps.onStartCaptions({\n spokenLanguage: startCaptionsButtonProps.currentSpokenLanguage\n });\n }, [startCaptionsButtonProps]);\n const [focusedContentOn, setFocusedContentOn] = useState<boolean>(false);\n const [previousLayout, setPreviousLayout] = useState<VideoGalleryLayout>(props.userSetGalleryLayout ?? 'floatingLocalVideo');\n const callees = useSelector(getTargetCallees);\n const allowDtmfDialer = showDtmfDialer(callees);\n const isTeamsMeeting = useSelector(getIsTeamsMeeting);\n const teamsMeetingCoordinates = useSelector(getTeamsMeetingCoordinates);\n const [dtmfDialerChecked, setDtmfDialerChecked] = useState<boolean>(props.dtmfDialerPresent ?? false);\n const moreButtonStrings = useMemo(() => ({\n label: localeStrings.strings.call.moreButtonCallingLabel,\n tooltipOffContent: localeStrings.strings.callWithChat.moreDrawerButtonTooltip\n }), [localeStrings]);\n const moreButtonContextualMenuItems: IContextualMenuItem[] = [];\n const menuSubIconStyleSet = {\n root: {\n height: 'unset',\n lineHeight: '100%',\n width: '1.25rem'\n }\n };\n if (props.callControls === true \|\| (props.callControls as CallControlOptions)?.holdButton !== false) {\n moreButtonContextualMenuItems.push({\n key: 'holdButtonKey',\n text: localeStrings.component.strings.holdButton.tooltipOffContent,\n onClick: () => {\n holdButtonProps.onToggleHold();\n },\n iconProps: {\n iconName: 'HoldCallContextualMenuItem',\n styles: {\n root: {\n lineHeight: 0\n }\n }\n },\n itemProps: {\n styles: buttonFlyoutIncreasedSizeStyles\n },\n disabled: props.disableButtonsForHoldScreen\n });\n }\n\n // is captions feature is active\n if (props.isCaptionsSupported) {\n const captionsContextualMenuItems: IContextualMenuItem[] = [];\n moreButtonContextualMenuItems.push({\n key: 'liveCaptionsKey',\n id: 'common-call-composite-captions-button',\n text: localeStrings.strings.call.liveCaptionsLabel,\n iconProps: {\n iconName: 'CaptionsIcon',\n styles: {\n root: {\n lineHeight: 0\n }\n }\n },\n itemProps: {\n styles: buttonFlyoutIncreasedSizeStyles\n },\n disabled: props.disableButtonsForHoldScreen,\n subMenuProps: {\n id: 'captions-contextual-menu',\n items: captionsContextualMenuItems,\n calloutProps: {\n preventDismissOnEvent: _preventDismissOnEvent\n }\n },\n submenuIconProps: {\n iconName: 'HorizontalGalleryRightButton',\n styles: menuSubIconStyleSet\n }\n });\n captionsContextualMenuItems.push({\n key: 'ToggleCaptionsKey',\n id: 'common-call-composite-captions-toggle-button',\n text: startCaptionsButtonProps.checked ? localeStrings.strings.call.startCaptionsButtonTooltipOnContent : localeStrings.strings.call.startCaptionsButtonTooltipOffContent,\n onClick: () => {\n startCaptionsButtonProps.checked ? startCaptionsButtonProps.onStopCaptions() : startCaptionsButtonProps.currentSpokenLanguage !== '' ? startCaptions() : props.onCaptionsSettingsClick && props.onCaptionsSettingsClick();\n },\n iconProps: {\n iconName: startCaptionsButtonProps.checked ? 'CaptionsOffIcon' : 'CaptionsIcon',\n styles: {\n root: {\n lineHeight: 0\n }\n }\n },\n itemProps: {\n styles: buttonFlyoutIncreasedSizeStyles\n },\n disabled: props.disableButtonsForHoldScreen\n });\n if (props.onCaptionsSettingsClick) {\n captionsContextualMenuItems.push({\n key: 'openCaptionsSettingsKey',\n id: 'common-call-composite-captions-settings-button',\n text: localeStrings.strings.call.captionsSettingsLabel,\n onClick: props.onCaptionsSettingsClick,\n iconProps: {\n iconName: 'CaptionsSettingsIcon',\n styles: {\n root: {\n lineHeight: 0\n }\n }\n },\n itemProps: {\n styles: buttonFlyoutIncreasedSizeStyles\n },\n disabled: props.disableButtonsForHoldScreen \|\| !startCaptionsButtonProps.checked\n });\n }\n }\n const dtmfDialerScreenOption = {\n key: 'dtmfDialerScreenKey',\n itemProps: {\n styles: buttonFlyoutIncreasedSizeStyles\n },\n text: !dtmfDialerChecked ? localeStrings.strings.call.dtmfDialerMoreButtonLabelOn : localeStrings.strings.call.dtmfDialerMoreButtonLabelOff,\n onClick: () => {\n props.onSetDialpadPage && props.onSetDialpadPage();\n setDtmfDialerChecked(!dtmfDialerChecked);\n },\n iconProps: {\n iconName: 'DtmfDialpadButton',\n styles: {\n root: {\n lineHeight: 0\n }\n }\n }\n };\n /\n Only render the dtmf dialer if the dialpad for PSTN calls is not present\n /\n if (props.onSetDialpadPage && allowDtmfDialer) {\n if (props.callControls === true \|\| (props.callControls as CallControlOptions)?.dtmfDialerButton !== false) {\n moreButtonContextualMenuItems.push(dtmfDialerScreenOption);\n }\n }\n const joinByPhoneOption = {\n key: 'phoneCallKey',\n itemProps: {\n styles: buttonFlyoutIncreasedSizeStyles\n },\n text: localeStrings.strings.call.phoneCallMoreButtonLabel,\n onClick: () => {\n props.onMeetingPhoneInfoClick && props.onMeetingPhoneInfoClick();\n },\n iconProps: {\n iconName: 'PhoneNumberButton',\n styles: {\n root: {\n lineHeight: 0\n }\n }\n }\n };\n /\n Only render the phone call button if meeting conordinates are present\n */\n if (props.teamsMeetingPhoneCallEnable && isTeamsMeeting && teamsMeetingCoordinates) {\n moreButtonContextualMenuItems.push(joinByPhoneOption);\n }\n if (props.onUserSetOverflowGalleryPositionChange) {\n const galleryOptions = {\n key: 'overflowGalleryPositionKey',\n iconProps: {\n iconName: 'GalleryOptions',\n styles: {\n root: {\n lineHeight: 0\n }\n }\n },\n itemProps: {\n styles: buttonFlyoutIncreasedSizeStyles\n },\n submenuIconProps: {\n styles: menuSubIconStyleSet\n },\n text: localeStrings.strings.call.moreButtonGalleryControlLabel,\n disabled: props.disableButtonsForHoldScreen,\n subMenuProps: {\n items: [{\n key: 'dynamicSelectionKey',\n text: localeStrings.strings.call.moreButtonGalleryFloatingLocalLayoutLabel,\n canCheck: true,\n itemProps: {\n styles: buttonFlyoutIncreasedSizeStyles\n },\n isChecked: props.userSetGalleryLayout === 'floatingLocalVideo',\n onClick: () => {\n props.onUserSetGalleryLayout && props.onUserSetGalleryLayout('floatingLocalVideo');\n setFocusedContentOn(false);\n },\n iconProps: {\n iconName: 'FloatingLocalVideoGalleryLayout',\n styles: {\n root: {\n lineHeight: 0\n }\n }\n }\n }, {\n key: 'speakerSelectionKey',\n text: localeStrings.strings.call.moreButtonGallerySpeakerLayoutLabel,\n canCheck: true,\n itemProps: {\n styles: buttonFlyoutIncreasedSizeStyles\n },\n isChecked: props.userSetGalleryLayout === 'speaker',\n onClick: () => {\n props.onUserSetGalleryLayout && props.onUserSetGalleryLayout('speaker');\n setFocusedContentOn(false);\n },\n iconProps: {\n iconName: 'SpeakerGalleryLayout',\n styles: {\n root: {\n lineHeight: 0\n }\n }\n }\n }, {\n key: 'focusedContentSelectionKey',\n text: localeStrings.strings.call.moreButtonGalleryFocusedContentLayoutLabel,\n canCheck: true,\n itemProps: {\n styles: buttonFlyoutIncreasedSizeStyles\n },\n isChecked: focusedContentOn,\n onClick: () => {\n if (focusedContentOn === false) {\n setPreviousLayout(props.userSetGalleryLayout ?? 'floatingLocalVideo');\n props.onUserSetGalleryLayout && props.onUserSetGalleryLayout('focusedContent');\n setFocusedContentOn(true);\n } else {\n props.onUserSetGalleryLayout && props.onUserSetGalleryLayout(previousLayout);\n setFocusedContentOn(false);\n }\n },\n iconProps: {\n iconName: 'FocusedContentGalleryLayout',\n styles: {\n root: {\n lineHeight: 0\n }\n }\n }\n }],\n calloutProps: {\n preventDismissOnEvent: _preventDismissOnEvent\n }\n }\n };\n if (props.callControls === true \|\| (props.callControls as CallControlOptions)?.galleryControlsButton !== false) {\n moreButtonContextualMenuItems.push(galleryOptions);\n }\n }\n const customDrawerButtons = useMemo(() => generateCustomCallDesktopOverflowButtons(onFetchCustomButtonPropsTrampoline(typeof props.callControls === 'object' ? props.callControls : undefined), typeof props.callControls === 'object' ? props.callControls.displayType : undefined), [props.callControls]);\n customDrawerButtons['primary'].slice(CUSTOM_BUTTON_OPTIONS.MAX_PRIMARY_DESKTOP_CUSTOM_BUTTONS).forEach(element => {\n moreButtonContextualMenuItems.push({\n itemProps: {\n styles: buttonFlyoutIncreasedSizeStyles\n },\n ...element\n });\n });\n customDrawerButtons['secondary'].slice(CUSTOM_BUTTON_OPTIONS.MAX_SECONDARY_DESKTOP_CUSTOM_BUTTONS).forEach(element => {\n moreButtonContextualMenuItems.push({\n itemProps: {\n styles: buttonFlyoutIncreasedSizeStyles\n },\n ...element\n });\n });\n customDrawerButtons['overflow'].forEach(element => {\n moreButtonContextualMenuItems.push({\n itemProps: {\n styles: buttonFlyoutIncreasedSizeStyles\n },\n ...element\n });\n });\n return <MoreButton {...props} data-ui-id=\"common-call-composite-more-button\" strings={moreButtonStrings} menuIconProps={{\n hidden: true\n }} menuProps={{\n shouldFocusOnContainer: false,\n items: moreButtonContextualMenuItems,\n calloutProps: {\n preventDismissOnEvent: _preventDismissOnEvent\n }\n }} />;\n};"]}
1	+ {"version":3,"file":"DesktopMoreButton.js","sourceRoot":"","sources":["../../../../../../../../react-composites/src/composites/common/ControlBar/DesktopMoreButton.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { IContextualMenuItem } from '@fluentui/react';\nimport { ControlBarButtonProps } from '@internal/react-components';\nimport { VideoGalleryLayout } from '@internal/react-components';\nimport { HoldButton } from '@internal/react-components';\nimport { StartCaptionsButton } from '@internal/react-components';\nimport React from 'react';\nimport { useState } from 'react';\nimport { useMemo, useCallback } from 'react';\nimport { usePropsFor } from '../../CallComposite/hooks/usePropsFor';\nimport { buttonFlyoutIncreasedSizeStyles } from '../../CallComposite/styles/Buttons.styles';\nimport { MoreButton } from '../MoreButton';\nimport { useLocale } from '../../localization';\nimport { CommonCallControlOptions } from '../types/CommonCallControlOptions';\nimport {\n CUSTOM_BUTTON_OPTIONS,\n generateCustomCallDesktopOverflowButtons,\n onFetchCustomButtonPropsTrampoline\n} from './CustomButton';\nimport { _preventDismissOnEvent } from '@internal/acs-ui-common';\nimport { showDtmfDialer } from '../../CallComposite/utils/MediaGalleryUtils';\nimport { useSelector } from '../../CallComposite/hooks/useSelector';\nimport { getTargetCallees } from '../../CallComposite/selectors/baseSelectors';\nimport { getTeamsMeetingCoordinates, getIsTeamsMeeting } from '../../CallComposite/selectors/baseSelectors';\nimport { CallControlOptions } from '../../CallComposite';\n\n/** @private /\nexport interface DesktopMoreButtonProps extends ControlBarButtonProps {\n disableButtonsForHoldScreen?: boolean;\n onClickShowDialpad?: () => void;\n isCaptionsSupported?: boolean;\n callControls?: boolean \| CommonCallControlOptions;\n onCaptionsSettingsClick?: () => void;\n onUserSetOverflowGalleryPositionChange?: (position: 'Responsive' \| 'horizontalTop') => void;\n onUserSetGalleryLayout?: (layout: VideoGalleryLayout) => void;\n userSetGalleryLayout?: VideoGalleryLayout;\n onSetDialpadPage?: () => void;\n dtmfDialerPresent?: boolean;\n teamsMeetingPhoneCallEnable?: boolean;\n onMeetingPhoneInfoClick?: () => void;\n}\n\n/\n \n * @private\n /\nexport const DesktopMoreButton = (props: DesktopMoreButtonProps): JSX.Element => {\n const localeStrings = useLocale();\n const holdButtonProps = usePropsFor(HoldButton);\n const startCaptionsButtonProps = usePropsFor(StartCaptionsButton);\n const startCaptions = useCallback(async () => {\n await startCaptionsButtonProps.onStartCaptions({\n spokenLanguage: startCaptionsButtonProps.currentSpokenLanguage\n });\n }, [startCaptionsButtonProps]);\n\n / @conditional-compile-remove(overflow-top-composite) /\n const [galleryPositionTop, setGalleryPositionTop] = useState<boolean>(false);\n const [focusedContentOn, setFocusedContentOn] = useState<boolean>(false);\n const [previousLayout, setPreviousLayout] = useState<VideoGalleryLayout>(\n props.userSetGalleryLayout ?? 'floatingLocalVideo'\n );\n\n const callees = useSelector(getTargetCallees);\n const allowDtmfDialer = showDtmfDialer(callees);\n\n const isTeamsMeeting = useSelector(getIsTeamsMeeting);\n const teamsMeetingCoordinates = useSelector(getTeamsMeetingCoordinates);\n\n const [dtmfDialerChecked, setDtmfDialerChecked] = useState<boolean>(props.dtmfDialerPresent ?? false);\n\n const moreButtonStrings = useMemo(\n () => ({\n label: localeStrings.strings.call.moreButtonCallingLabel,\n tooltipOffContent: localeStrings.strings.callWithChat.moreDrawerButtonTooltip\n }),\n [localeStrings]\n );\n\n const moreButtonContextualMenuItems: IContextualMenuItem[] = [];\n\n const menuSubIconStyleSet = {\n root: {\n height: 'unset',\n lineHeight: '100%',\n width: '1.25rem'\n }\n };\n\n if (props.callControls === true \|\| (props.callControls as CallControlOptions)?.holdButton !== false) {\n moreButtonContextualMenuItems.push({\n key: 'holdButtonKey',\n text: localeStrings.component.strings.holdButton.tooltipOffContent,\n onClick: () => {\n holdButtonProps.onToggleHold();\n },\n iconProps: { iconName: 'HoldCallContextualMenuItem', styles: { root: { lineHeight: 0 } } },\n itemProps: {\n styles: buttonFlyoutIncreasedSizeStyles\n },\n disabled: props.disableButtonsForHoldScreen\n });\n }\n\n // is captions feature is active\n if (props.isCaptionsSupported) {\n const captionsContextualMenuItems: IContextualMenuItem[] = [];\n\n moreButtonContextualMenuItems.push({\n key: 'liveCaptionsKey',\n id: 'common-call-composite-captions-button',\n text: localeStrings.strings.call.liveCaptionsLabel,\n iconProps: { iconName: 'CaptionsIcon', styles: { root: { lineHeight: 0 } } },\n itemProps: {\n styles: buttonFlyoutIncreasedSizeStyles\n },\n disabled: props.disableButtonsForHoldScreen,\n subMenuProps: {\n id: 'captions-contextual-menu',\n items: captionsContextualMenuItems,\n calloutProps: {\n preventDismissOnEvent: _preventDismissOnEvent\n }\n },\n submenuIconProps: {\n iconName: 'HorizontalGalleryRightButton',\n styles: menuSubIconStyleSet\n }\n });\n\n captionsContextualMenuItems.push({\n key: 'ToggleCaptionsKey',\n id: 'common-call-composite-captions-toggle-button',\n text: startCaptionsButtonProps.checked\n ? localeStrings.strings.call.startCaptionsButtonTooltipOnContent\n : localeStrings.strings.call.startCaptionsButtonTooltipOffContent,\n onClick: () => {\n startCaptionsButtonProps.checked\n ? startCaptionsButtonProps.onStopCaptions()\n : startCaptionsButtonProps.currentSpokenLanguage !== ''\n ? startCaptions()\n : props.onCaptionsSettingsClick && props.onCaptionsSettingsClick();\n },\n iconProps: {\n iconName: startCaptionsButtonProps.checked ? 'CaptionsOffIcon' : 'CaptionsIcon',\n styles: { root: { lineHeight: 0 } }\n },\n itemProps: {\n styles: buttonFlyoutIncreasedSizeStyles\n },\n disabled: props.disableButtonsForHoldScreen\n });\n\n if (props.onCaptionsSettingsClick) {\n captionsContextualMenuItems.push({\n key: 'openCaptionsSettingsKey',\n id: 'common-call-composite-captions-settings-button',\n text: localeStrings.strings.call.captionsSettingsLabel,\n onClick: props.onCaptionsSettingsClick,\n iconProps: {\n iconName: 'CaptionsSettingsIcon',\n styles: { root: { lineHeight: 0 } }\n },\n itemProps: {\n styles: buttonFlyoutIncreasedSizeStyles\n },\n disabled: props.disableButtonsForHoldScreen \|\| !startCaptionsButtonProps.checked\n });\n }\n }\n\n const dtmfDialerScreenOption = {\n key: 'dtmfDialerScreenKey',\n itemProps: {\n styles: buttonFlyoutIncreasedSizeStyles\n },\n text: !dtmfDialerChecked\n ? localeStrings.strings.call.dtmfDialerMoreButtonLabelOn\n : localeStrings.strings.call.dtmfDialerMoreButtonLabelOff,\n onClick: () => {\n props.onSetDialpadPage && props.onSetDialpadPage();\n setDtmfDialerChecked(!dtmfDialerChecked);\n },\n iconProps: {\n iconName: 'DtmfDialpadButton',\n styles: { root: { lineHeight: 0 } }\n }\n };\n /\n Only render the dtmf dialer if the dialpad for PSTN calls is not present\n /\n if (props.onSetDialpadPage && allowDtmfDialer) {\n if (props.callControls === true \|\| (props.callControls as CallControlOptions)?.dtmfDialerButton !== false) {\n moreButtonContextualMenuItems.push(dtmfDialerScreenOption);\n }\n }\n\n const joinByPhoneOption = {\n key: 'phoneCallKey',\n itemProps: {\n styles: buttonFlyoutIncreasedSizeStyles\n },\n text: localeStrings.strings.call.phoneCallMoreButtonLabel,\n onClick: () => {\n props.onMeetingPhoneInfoClick && props.onMeetingPhoneInfoClick();\n },\n iconProps: {\n iconName: 'PhoneNumberButton',\n styles: { root: { lineHeight: 0 } }\n }\n };\n /\n Only render the phone call button if meeting conordinates are present\n /\n if (props.teamsMeetingPhoneCallEnable && isTeamsMeeting && teamsMeetingCoordinates) {\n moreButtonContextualMenuItems.push(joinByPhoneOption);\n }\n\n if (props.onUserSetOverflowGalleryPositionChange) {\n const galleryOptions = {\n key: 'overflowGalleryPositionKey',\n iconProps: {\n iconName: 'GalleryOptions',\n styles: { root: { lineHeight: 0 } }\n },\n itemProps: {\n styles: buttonFlyoutIncreasedSizeStyles\n },\n submenuIconProps: {\n styles: menuSubIconStyleSet\n },\n text: localeStrings.strings.call.moreButtonGalleryControlLabel,\n disabled: props.disableButtonsForHoldScreen,\n subMenuProps: {\n items: [\n {\n key: 'dynamicSelectionKey',\n text: localeStrings.strings.call.moreButtonGalleryFloatingLocalLayoutLabel,\n canCheck: true,\n itemProps: {\n styles: buttonFlyoutIncreasedSizeStyles\n },\n isChecked: props.userSetGalleryLayout === 'floatingLocalVideo',\n onClick: () => {\n props.onUserSetGalleryLayout && props.onUserSetGalleryLayout('floatingLocalVideo');\n setFocusedContentOn(false);\n },\n iconProps: {\n iconName: 'FloatingLocalVideoGalleryLayout',\n styles: { root: { lineHeight: 0 } }\n }\n },\n {\n key: 'speakerSelectionKey',\n text: localeStrings.strings.call.moreButtonGallerySpeakerLayoutLabel,\n canCheck: true,\n itemProps: {\n styles: buttonFlyoutIncreasedSizeStyles\n },\n isChecked: props.userSetGalleryLayout === 'speaker',\n onClick: () => {\n props.onUserSetGalleryLayout && props.onUserSetGalleryLayout('speaker');\n setFocusedContentOn(false);\n },\n iconProps: {\n iconName: 'SpeakerGalleryLayout',\n styles: { root: { lineHeight: 0 } }\n }\n },\n {\n key: 'focusedContentSelectionKey',\n text: localeStrings.strings.call.moreButtonGalleryFocusedContentLayoutLabel,\n canCheck: true,\n itemProps: {\n styles: buttonFlyoutIncreasedSizeStyles\n },\n isChecked: focusedContentOn,\n onClick: () => {\n if (focusedContentOn === false) {\n setPreviousLayout(props.userSetGalleryLayout ?? 'floatingLocalVideo');\n props.onUserSetGalleryLayout && props.onUserSetGalleryLayout('focusedContent');\n setFocusedContentOn(true);\n } else {\n props.onUserSetGalleryLayout && props.onUserSetGalleryLayout(previousLayout);\n setFocusedContentOn(false);\n }\n },\n iconProps: {\n iconName: 'FocusedContentGalleryLayout',\n styles: { root: { lineHeight: 0 } }\n }\n }\n ],\n calloutProps: {\n preventDismissOnEvent: _preventDismissOnEvent\n }\n }\n };\n\n / @conditional-compile-remove(gallery-layout-composite) /\n const galleryOption = {\n key: 'defaultSelectionKey',\n text: localeStrings.strings.call.moreButtonGalleryDefaultLayoutLabel,\n canCheck: true,\n itemProps: {\n styles: buttonFlyoutIncreasedSizeStyles\n },\n isChecked: props.userSetGalleryLayout === 'default',\n onClick: () => {\n props.onUserSetGalleryLayout && props.onUserSetGalleryLayout('default');\n setFocusedContentOn(false);\n },\n iconProps: {\n iconName: 'DefaultGalleryLayout',\n styles: { root: { lineHeight: 0 } }\n }\n };\n / @conditional-compile-remove(large-gallery) /\n const largeGalleryOption = {\n key: 'largeGallerySelectionKey',\n text: localeStrings.strings.call.moreButtonLargeGalleryDefaultLayoutLabel,\n canCheck: true,\n itemProps: {\n styles: buttonFlyoutIncreasedSizeStyles\n },\n isChecked: props.userSetGalleryLayout === 'largeGallery',\n onClick: () => {\n props.onUserSetGalleryLayout && props.onUserSetGalleryLayout('largeGallery');\n setFocusedContentOn(false);\n },\n iconProps: {\n iconName: 'LargeGalleryLayout',\n styles: { root: { lineHeight: 0 } }\n }\n };\n\n / @conditional-compile-remove(overflow-top-composite) /\n const overflowGalleryOption = {\n key: 'topKey',\n text: localeStrings.strings.call.moreButtonGalleryPositionToggleLabel,\n canCheck: true,\n topDivider: true,\n itemProps: {\n styles: buttonFlyoutIncreasedSizeStyles\n },\n iconProps: {\n iconName: 'OverflowGalleryTop',\n styles: { root: { lineHeight: 0 } }\n },\n isChecked: galleryPositionTop,\n onClick: () => {\n if (galleryPositionTop === false) {\n props.onUserSetOverflowGalleryPositionChange && props.onUserSetOverflowGalleryPositionChange('horizontalTop');\n setGalleryPositionTop(true);\n } else {\n props.onUserSetOverflowGalleryPositionChange && props.onUserSetOverflowGalleryPositionChange('Responsive');\n setGalleryPositionTop(false);\n }\n }\n };\n / @conditional-compile-remove(large-gallery) /\n galleryOptions.subMenuProps?.items?.push(largeGalleryOption);\n / @conditional-compile-remove(gallery-layout-composite) /\n galleryOptions.subMenuProps?.items?.push(galleryOption);\n / @conditional-compile-remove(overflow-top-composite) */\n galleryOptions.subMenuProps?.items?.push(overflowGalleryOption);\n if (props.callControls === true \|\| (props.callControls as CallControlOptions)?.galleryControlsButton !== false) {\n moreButtonContextualMenuItems.push(galleryOptions);\n }\n }\n\n const customDrawerButtons = useMemo(\n () =>\n generateCustomCallDesktopOverflowButtons(\n onFetchCustomButtonPropsTrampoline(typeof props.callControls === 'object' ? props.callControls : undefined),\n typeof props.callControls === 'object' ? props.callControls.displayType : undefined\n ),\n [props.callControls]\n );\n\n customDrawerButtons['primary'].slice(CUSTOM_BUTTON_OPTIONS.MAX_PRIMARY_DESKTOP_CUSTOM_BUTTONS).forEach((element) => {\n moreButtonContextualMenuItems.push({\n itemProps: {\n styles: buttonFlyoutIncreasedSizeStyles\n },\n ...element\n });\n });\n\n customDrawerButtons['secondary']\n .slice(CUSTOM_BUTTON_OPTIONS.MAX_SECONDARY_DESKTOP_CUSTOM_BUTTONS)\n .forEach((element) => {\n moreButtonContextualMenuItems.push({\n itemProps: {\n styles: buttonFlyoutIncreasedSizeStyles\n },\n ...element\n });\n });\n\n customDrawerButtons['overflow'].forEach((element) => {\n moreButtonContextualMenuItems.push({\n itemProps: {\n styles: buttonFlyoutIncreasedSizeStyles\n },\n ...element\n });\n });\n\n return (\n <MoreButton\n {...props}\n data-ui-id=\"common-call-composite-more-button\"\n strings={moreButtonStrings}\n menuIconProps={{ hidden: true }}\n menuProps={{\n shouldFocusOnContainer: false,\n items: moreButtonContextualMenuItems,\n calloutProps: {\n preventDismissOnEvent: _preventDismissOnEvent\n }\n }}\n />\n );\n};\n"]}

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

@@ -29,6 +29,6 @@ export const DtmfDialpadButton = (props) => {
             }
         }, (_a = props.styles) !== null && _a !== void 0 ? _a : {});
     }, [props.styles, theme.palette.neutralLight]);
-    return React.createElement(ControlBarButton, Object.assign({}, props, { strings: strings ? strings : dialpadButtonStrings, showLabel: displayType !== 'compact', labelKey: 'dtmfDialpadButtonLabelKey', onRenderOnIcon: onRenderOnIcon !== null && onRenderOnIcon !== void 0 ? onRenderOnIcon : icon, onRenderOffIcon: onRenderOffIcon !== null && onRenderOffIcon !== void 0 ? onRenderOffIcon : icon, onClick: onClick, styles: styles }));
+    return (React.createElement(ControlBarButton, Object.assign({}, props, { strings: strings ? strings : dialpadButtonStrings, showLabel: displayType !== 'compact', labelKey: 'dtmfDialpadButtonLabelKey', onRenderOnIcon: onRenderOnIcon !== null && onRenderOnIcon !== void 0 ? onRenderOnIcon : icon, onRenderOffIcon: onRenderOffIcon !== null && onRenderOffIcon !== void 0 ? onRenderOffIcon : icon, onClick: onClick, styles: styles })));
 };
 //# sourceMappingURL=DtmfDialerButton.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"DtmfDialerButton.js","sourceRoot":"","sources":["~~../../../../../../../preprocess-dist/~~react-composites/src/composites/common/ControlBar/DtmfDialerButton.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAClC,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAC7C,OAAO,EAAE,gBAAgB,EAA2B,4CAAmC;AAEvF,OAAO,EAAE,eAAe,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAE5D,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;~~AAC~~/C,MAAM,IAAI,GAAG,GAAgB,EAAE,CAAC,oBAAC,iBAAiB,IAAC,QAAQ,EAAE,mBAAmB,GAAI,CAAC;AASrF;;;;;GAKG;AACH,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAC,KAA4B,EAAe,EAAE;IAC7E,MAAM,~~EACJ~~,OAAO,~~EACP~~,cAAc,~~EACd~~,eAAe,~~EACf~~,OAAO,~~EACP~~,WAAW,~~EACZ~~,GAAG,KAAK,CAAC;~~IACV~~,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IACzB,MAAM,MAAM,GAAG,SAAS,EAAE,CAAC;IAC3B,MAAM,oBAAoB,GAA4B;QACpD,KAAK,EAAE,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,qBAAqB;QAChD,gBAAgB,EAAE,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,yBAAyB;QAC/D,iBAAiB,EAAE,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,0BAA0B;KAClE,CAAC;IACF,MAAM,MAAM,GAA2B,OAAO,~~CAAC~~,GAAG,EAAE;;~~QAAC~~,OAAA,eAAe,~~CAAC~~;~~YACnE~~,WAAW,EAAE;gBACX,UAAU,EAAE,KAAK,CAAC,OAAO,CAAC,YAAY;aACvC;SACF,~~EAAE~~,MAAA,KAAK,CAAC,MAAM,mCAAI,EAAE,~~CAAC~~,CAAA;KAAA,~~EAAE~~,CAAC,KAAK,CAAC,MAAM,EAAE,KAAK,CAAC,OAAO,CAAC,YAAY,CAAC,~~CAAC~~,CAAC;~~IACpE~~,OAAO,oBAAC,gBAAgB,~~oBAAK~~,KAAK,~~IAAE~~,OAAO,EAAE,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,oBAAoB,~~EAAE~~,SAAS,EAAE,WAAW,KAAK,SAAS,~~EAAE~~,QAAQ,EAAE,2BAA2B,~~EAAE~~,cAAc,EAAE,cAAc,aAAd,cAAc,cAAd,cAAc,GAAI,IAAI,~~EAAE~~,eAAe,EAAE,eAAe,aAAf,eAAe,cAAf,eAAe,GAAI,IAAI,~~EAAE~~,OAAO,EAAE,OAAO,~~EAAE~~,MAAM,EAAE,MAAM,~~IAAI~~,CAAC;~~AAC7R~~,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\nimport React, { useMemo } from 'react';\nimport { CallCompositeIcon } from '../icons';\nimport { ControlBarButton, ControlBarButtonStrings } from '@internal/react-components';\nimport { ControlBarButtonProps, ControlBarButtonStyles } from '@internal/react-components';\nimport { concatStyleSets, useTheme } from '@fluentui/react';\nimport { CallControlDisplayType } from '../types/CommonCallControlOptions';\nimport { useLocale } from '../../localization';\nconst icon = (): JSX.Element => <CallCompositeIcon iconName={'DtmfDialpadButton'} />;\n\n/*\n @private\n /\nexport interface DtmfDialerButtonProps extends ControlBarButtonProps {\n displayType?: CallControlDisplayType;\n styles?: ControlBarButtonStyles;\n}\n/\n Button for showing and hiding the dtmf dialer in the Call composite.\n * To be used only if the more button control is disabled. This button will replace\n * it in the control bar unless it is also disabled.\n * @private\n */\nexport const DtmfDialpadButton = (props: DtmfDialerButtonProps): JSX.Element => {\n const {\n strings~~,\n~~ onRenderOnIcon~~,\n~~ onRenderOffIcon~~,\n~~ onClick~~,\n~~ displayType\n } = props;\n const theme = useTheme();\n const locale = useLocale();\n const dialpadButtonStrings: ControlBarButtonStrings = {\n label: locale.strings.call.dtmfDialerButtonLabel,\n tooltipOnContent: locale.strings.call.dtmfDialerButtonTooltipOn,\n tooltipOffContent: locale.strings.call.dtmfDialerButtonTooltipOff\n };\n const styles: ControlBarButtonStyles = useMemo(() => concatStyleSets({\n rootChecked: {\n background: theme.palette.neutralLight\n }\n }, props.styles ?? {}), [props.styles, theme.palette.neutralLight]);\n return <ControlBarButton {...props} strings={strings ? strings : dialpadButtonStrings} showLabel={displayType !== 'compact'} labelKey={'dtmfDialpadButtonLabelKey'} onRenderOnIcon={onRenderOnIcon ?? icon} onRenderOffIcon={onRenderOffIcon ?? icon} onClick={onClick} styles={styles} ~~/>;\~~n};"]}
1	+ {"version":3,"file":"DtmfDialerButton.js","sourceRoot":"","sources":["../../../../../../../../react-composites/src/composites/common/ControlBar/DtmfDialerButton.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAClC,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAC7C,OAAO,EAAE,gBAAgB,EAA2B,4CAAmC;AAEvF,OAAO,EAAE,eAAe,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAE5D,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAE/C,MAAM,IAAI,GAAG,GAAgB,EAAE,CAAC,oBAAC,iBAAiB,IAAC,QAAQ,EAAE,mBAAmB,GAAI,CAAC;AASrF;;;;;GAKG;AACH,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAC,KAA4B,EAAe,EAAE;IAC7E,MAAM,EAAE,OAAO,EAAE,cAAc,EAAE,eAAe,EAAE,OAAO,EAAE,WAAW,EAAE,GAAG,KAAK,CAAC;IACjF,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IACzB,MAAM,MAAM,GAAG,SAAS,EAAE,CAAC;IAC3B,MAAM,oBAAoB,GAA4B;QACpD,KAAK,EAAE,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,qBAAqB;QAChD,gBAAgB,EAAE,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,yBAAyB;QAC/D,iBAAiB,EAAE,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,0BAA0B;KAClE,CAAC;IACF,MAAM,MAAM,GAA2B,OAAO,CAC5C,GAAG,EAAE;;QACH,OAAA,eAAe,CACb;YACE,WAAW,EAAE;gBACX,UAAU,EAAE,KAAK,CAAC,OAAO,CAAC,YAAY;aACvC;SACF,EACD,MAAA,KAAK,CAAC,MAAM,mCAAI,EAAE,CACnB,CAAA;KAAA,EACH,CAAC,KAAK,CAAC,MAAM,EAAE,KAAK,CAAC,OAAO,CAAC,YAAY,CAAC,CAC3C,CAAC;IACF,OAAO,CACL,oBAAC,gBAAgB,oBACX,KAAK,IACT,OAAO,EAAE,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,oBAAoB,EACjD,SAAS,EAAE,WAAW,KAAK,SAAS,EACpC,QAAQ,EAAE,2BAA2B,EACrC,cAAc,EAAE,cAAc,aAAd,cAAc,cAAd,cAAc,GAAI,IAAI,EACtC,eAAe,EAAE,eAAe,aAAf,eAAe,cAAf,eAAe,GAAI,IAAI,EACxC,OAAO,EAAE,OAAO,EAChB,MAAM,EAAE,MAAM,IACd,CACH,CAAC;AACJ,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\nimport React, { useMemo } from 'react';\nimport { CallCompositeIcon } from '../icons';\nimport { ControlBarButton, ControlBarButtonStrings } from '@internal/react-components';\nimport { ControlBarButtonProps, ControlBarButtonStyles } from '@internal/react-components';\nimport { concatStyleSets, useTheme } from '@fluentui/react';\nimport { CallControlDisplayType } from '../types/CommonCallControlOptions';\nimport { useLocale } from '../../localization';\n\nconst icon = (): JSX.Element => <CallCompositeIcon iconName={'DtmfDialpadButton'} />;\n\n/*\n @private\n /\nexport interface DtmfDialerButtonProps extends ControlBarButtonProps {\n displayType?: CallControlDisplayType;\n styles?: ControlBarButtonStyles;\n}\n/\n Button for showing and hiding the dtmf dialer in the Call composite.\n * To be used only if the more button control is disabled. This button will replace\n * it in the control bar unless it is also disabled.\n * @private\n */\nexport const DtmfDialpadButton = (props: DtmfDialerButtonProps): JSX.Element => {\n const { strings, onRenderOnIcon, onRenderOffIcon, onClick, displayType } = props;\n const theme = useTheme();\n const locale = useLocale();\n const dialpadButtonStrings: ControlBarButtonStrings = {\n label: locale.strings.call.dtmfDialerButtonLabel,\n tooltipOnContent: locale.strings.call.dtmfDialerButtonTooltipOn,\n tooltipOffContent: locale.strings.call.dtmfDialerButtonTooltipOff\n };\n const styles: ControlBarButtonStyles = useMemo(\n () =>\n concatStyleSets(\n {\n rootChecked: {\n background: theme.palette.neutralLight\n }\n },\n props.styles ?? {}\n ),\n [props.styles, theme.palette.neutralLight]\n );\n return (\n <ControlBarButton\n {...props}\n strings={strings ? strings : dialpadButtonStrings}\n showLabel={displayType !== 'compact'}\n labelKey={'dtmfDialpadButtonLabelKey'}\n onRenderOnIcon={onRenderOnIcon ?? icon}\n onRenderOffIcon={onRenderOffIcon ?? icon}\n onClick={onClick}\n styles={styles}\n />\n );\n};\n"]}

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

@@ -34,6 +34,6 @@ export const PeopleButton = (props) => {
             event.preventDefault();
         }
     }, [chatButtonPresent, onClick, peoplePaneDismissButtonRef]);
-    return React.createElement(ControlBarButton, Object.assign({}, props, { strings: strings, labelKey: 'peopleButtonLabelKey', onRenderOnIcon: onRenderOnIcon !== null && onRenderOnIcon !== void 0 ? onRenderOnIcon : icon, onRenderOffIcon: onRenderOffIcon !== null && onRenderOffIcon !== void 0 ? onRenderOffIcon : icon, onClick: handleClick, onKeyDown: handleTab, styles: styles }));
+    return (React.createElement(ControlBarButton, Object.assign({}, props, { strings: strings, labelKey: 'peopleButtonLabelKey', onRenderOnIcon: onRenderOnIcon !== null && onRenderOnIcon !== void 0 ? onRenderOnIcon : icon, onRenderOffIcon: onRenderOffIcon !== null && onRenderOffIcon !== void 0 ? onRenderOffIcon : icon, onClick: handleClick, onKeyDown: handleTab, styles: styles })));
 };
 //# sourceMappingURL=PeopleButton.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"PeopleButton.js","sourceRoot":"","sources":["~~../../../../../../../preprocess-dist/~~react-composites/src/composites/common/ControlBar/PeopleButton.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,OAAO,EAAa,MAAM,OAAO,CAAC;AAC/D,OAAO,EAAE,gBAAgB,EAAiD,QAAQ,EAAE,4CAAmC;AACvH,OAAO,EAAE,eAAe,EAAW,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;~~AAC7C~~,MAAM,IAAI,GAAG,GAAgB,EAAE,CAAC,oBAAC,iBAAiB,IAAC,QAAQ,EAAE,wBAAwB,GAAI,CAAC;AAW1F;;GAEG;AACH,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,KAAwB,EAAe,EAAE;IACpE,MAAM,~~EACJ~~,OAAO,~~EACP~~,cAAc,~~EACd~~,eAAe,~~EACf~~,OAAO,~~EACP~~,0BAA0B,~~EAC1B~~,iBAAiB,~~EAClB~~,GAAG,KAAK,CAAC;~~IACV~~,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IACzB,MAAM,MAAM,GAA2B,OAAO,~~CAAC~~,GAAG,EAAE;;~~QAAC~~,OAAA,eAAe,~~CAAC~~;~~YACnE~~,WAAW,EAAE;gBACX,UAAU,EAAE,KAAK,CAAC,OAAO,CAAC,YAAY;aACvC;SACF,~~EAAE~~,MAAA,KAAK,CAAC,MAAM,mCAAI,EAAE,~~CAAC~~,CAAA;KAAA,~~EAAE~~,CAAC,KAAK,CAAC,MAAM,EAAE,KAAK,CAAC,OAAO,CAAC,YAAY,CAAC,~~CAAC~~,CAAC;~~IACpE~~,MAAM,SAAS,GAAG,WAAW,~~CAAC~~,CAAC,KAAuC,EAAE,EAAE;~~QACxE~~,IAAI,KAAK,CAAC,GAAG,KAAK,KAAK,IAAI,CAAC,KAAK,CAAC,QAAQ,KAAI,0BAA0B,aAA1B,0BAA0B,uBAA1B,0BAA0B,CAAE,OAAO,CAAA,IAAI,CAAC,iBAAiB,EAAE,CAAC;YACxG,0BAA0B,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;YAC3C,KAAK,CAAC,cAAc,EAAE,CAAC;QACzB,CAAC;IACH,CAAC,~~EAAE~~,CAAC,0BAA0B,EAAE,iBAAiB,CAAC,~~CAAC~~,CAAC;~~IACpD~~,MAAM,WAAW,GAAG,WAAW,~~CAAC~~,CAAC,KAAoC,EAAE,EAAE;;~~QACvE~~,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAG,KAAK,CAAC,CAAC;QACjB,IAAI,iBAAiB,EAAE,CAAC;YACtB,OAAO,CAAC,GAAG,CAAC,0BAA0B,CAAC,CAAC;YACxC,MAAA,0BAA0B,aAA1B,0BAA0B,uBAA1B,0BAA0B,CAAE,OAAO,0CAAE,KAAK,EAAE,CAAC;YAC7C,KAAK,CAAC,cAAc,EAAE,CAAC;QACzB,CAAC;IACH,CAAC,~~EAAE~~,CAAC,iBAAiB,EAAE,OAAO,EAAE,0BAA0B,CAAC,~~CAAC~~,CAAC;~~IAC7D~~,OAAO,oBAAC,gBAAgB,~~oBAAK~~,KAAK,~~IAAE~~,OAAO,EAAE,OAAO,~~EAAE~~,QAAQ,EAAE,sBAAsB,~~EAAE~~,cAAc,EAAE,cAAc,aAAd,cAAc,cAAd,cAAc,GAAI,IAAI,~~EAAE~~,eAAe,EAAE,eAAe,aAAf,eAAe,cAAf,eAAe,GAAI,IAAI,~~EAAE~~,OAAO,EAAE,WAAW,~~EAAE~~,SAAS,EAAE,SAAS,~~EAAE~~,MAAM,EAAE,MAAM,~~IAAI~~,CAAC;~~AAC3O~~,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React, { useCallback, useMemo, RefObject } from 'react';\nimport { ControlBarButton, ControlBarButtonProps, ControlBarButtonStyles, useTheme } from '@internal/react-components';\nimport { concatStyleSets, IButton } from '@fluentui/react';\nimport { CallCompositeIcon } from '../icons';\nconst icon = (): JSX.Element => <CallCompositeIcon iconName={'ControlBarPeopleButton'} />;\n\n/*\n @private\n * props for the PeopleButton component\n /\nexport interface PeopleButtonProps extends ControlBarButtonProps {\n peoplePaneDismissButtonRef?: RefObject<IButton>;\n chatButtonPresent?: boolean;\n}\n\n/\n @private\n */\nexport const PeopleButton = (props: PeopleButtonProps): JSX.Element => {\n const {\n strings~~,\n~~ onRenderOnIcon~~,\n~~ onRenderOffIcon~~,\n~~ onClick~~,\n~~ peoplePaneDismissButtonRef~~,\n~~ chatButtonPresent\n } = props;\n const theme = useTheme();\n const styles: ControlBarButtonStyles = useMemo(() => concatStyleSets({\n rootChecked: {\n background: theme.palette.neutralLight\n }\n }, props.styles ?? {}), [props.styles, theme.palette.neutralLight]);\n const handleTab = useCallback((event: React.KeyboardEvent<HTMLElement>) => {\n if (event.key === 'Tab' && !event.shiftKey && peoplePaneDismissButtonRef?.current && !chatButtonPresent) {\n peoplePaneDismissButtonRef.current.focus();\n event.preventDefault();\n }\n }, [peoplePaneDismissButtonRef, chatButtonPresent]);\n const handleClick = useCallback((event: React.MouseEvent<HTMLElement>) => {\n onClick?.(event);\n if (chatButtonPresent) {\n console.log(peoplePaneDismissButtonRef);\n peoplePaneDismissButtonRef?.current?.focus();\n event.preventDefault();\n }\n }, [chatButtonPresent, onClick, peoplePaneDismissButtonRef]);\n return <ControlBarButton {...props} strings={strings} labelKey={'peopleButtonLabelKey'} onRenderOnIcon={onRenderOnIcon ?? icon} onRenderOffIcon={onRenderOffIcon ?? icon} onClick={handleClick} onKeyDown={handleTab} styles={styles} ~~/>;\~~n};"]}
1	+ {"version":3,"file":"PeopleButton.js","sourceRoot":"","sources":["../../../../../../../../react-composites/src/composites/common/ControlBar/PeopleButton.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,OAAO,EAAa,MAAM,OAAO,CAAC;AAC/D,OAAO,EAAE,gBAAgB,EAAiD,QAAQ,EAAE,4CAAmC;AACvH,OAAO,EAAE,eAAe,EAAW,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAE7C,MAAM,IAAI,GAAG,GAAgB,EAAE,CAAC,oBAAC,iBAAiB,IAAC,QAAQ,EAAE,wBAAwB,GAAI,CAAC;AAW1F;;GAEG;AACH,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,KAAwB,EAAe,EAAE;IACpE,MAAM,EAAE,OAAO,EAAE,cAAc,EAAE,eAAe,EAAE,OAAO,EAAE,0BAA0B,EAAE,iBAAiB,EAAE,GAAG,KAAK,CAAC;IACnH,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IACzB,MAAM,MAAM,GAA2B,OAAO,CAC5C,GAAG,EAAE;;QACH,OAAA,eAAe,CACb;YACE,WAAW,EAAE;gBACX,UAAU,EAAE,KAAK,CAAC,OAAO,CAAC,YAAY;aACvC;SACF,EACD,MAAA,KAAK,CAAC,MAAM,mCAAI,EAAE,CACnB,CAAA;KAAA,EACH,CAAC,KAAK,CAAC,MAAM,EAAE,KAAK,CAAC,OAAO,CAAC,YAAY,CAAC,CAC3C,CAAC;IAEF,MAAM,SAAS,GAAG,WAAW,CAC3B,CAAC,KAAuC,EAAE,EAAE;QAC1C,IAAI,KAAK,CAAC,GAAG,KAAK,KAAK,IAAI,CAAC,KAAK,CAAC,QAAQ,KAAI,0BAA0B,aAA1B,0BAA0B,uBAA1B,0BAA0B,CAAE,OAAO,CAAA,IAAI,CAAC,iBAAiB,EAAE,CAAC;YACxG,0BAA0B,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;YAC3C,KAAK,CAAC,cAAc,EAAE,CAAC;QACzB,CAAC;IACH,CAAC,EACD,CAAC,0BAA0B,EAAE,iBAAiB,CAAC,CAChD,CAAC;IAEF,MAAM,WAAW,GAAG,WAAW,CAC7B,CAAC,KAAoC,EAAE,EAAE;;QACvC,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAG,KAAK,CAAC,CAAC;QACjB,IAAI,iBAAiB,EAAE,CAAC;YACtB,OAAO,CAAC,GAAG,CAAC,0BAA0B,CAAC,CAAC;YACxC,MAAA,0BAA0B,aAA1B,0BAA0B,uBAA1B,0BAA0B,CAAE,OAAO,0CAAE,KAAK,EAAE,CAAC;YAC7C,KAAK,CAAC,cAAc,EAAE,CAAC;QACzB,CAAC;IACH,CAAC,EACD,CAAC,iBAAiB,EAAE,OAAO,EAAE,0BAA0B,CAAC,CACzD,CAAC;IAEF,OAAO,CACL,oBAAC,gBAAgB,oBACX,KAAK,IACT,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,sBAAsB,EAChC,cAAc,EAAE,cAAc,aAAd,cAAc,cAAd,cAAc,GAAI,IAAI,EACtC,eAAe,EAAE,eAAe,aAAf,eAAe,cAAf,eAAe,GAAI,IAAI,EACxC,OAAO,EAAE,WAAW,EACpB,SAAS,EAAE,SAAS,EACpB,MAAM,EAAE,MAAM,IACd,CACH,CAAC;AACJ,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React, { useCallback, useMemo, RefObject } from 'react';\nimport { ControlBarButton, ControlBarButtonProps, ControlBarButtonStyles, useTheme } from '@internal/react-components';\nimport { concatStyleSets, IButton } from '@fluentui/react';\nimport { CallCompositeIcon } from '../icons';\n\nconst icon = (): JSX.Element => <CallCompositeIcon iconName={'ControlBarPeopleButton'} />;\n\n/*\n @private\n * props for the PeopleButton component\n /\nexport interface PeopleButtonProps extends ControlBarButtonProps {\n peoplePaneDismissButtonRef?: RefObject<IButton>;\n chatButtonPresent?: boolean;\n}\n\n/\n @private\n */\nexport const PeopleButton = (props: PeopleButtonProps): JSX.Element => {\n const { strings, onRenderOnIcon, onRenderOffIcon, onClick, peoplePaneDismissButtonRef, chatButtonPresent } = props;\n const theme = useTheme();\n const styles: ControlBarButtonStyles = useMemo(\n () =>\n concatStyleSets(\n {\n rootChecked: {\n background: theme.palette.neutralLight\n }\n },\n props.styles ?? {}\n ),\n [props.styles, theme.palette.neutralLight]\n );\n\n const handleTab = useCallback(\n (event: React.KeyboardEvent<HTMLElement>) => {\n if (event.key === 'Tab' && !event.shiftKey && peoplePaneDismissButtonRef?.current && !chatButtonPresent) {\n peoplePaneDismissButtonRef.current.focus();\n event.preventDefault();\n }\n },\n [peoplePaneDismissButtonRef, chatButtonPresent]\n );\n\n const handleClick = useCallback(\n (event: React.MouseEvent<HTMLElement>) => {\n onClick?.(event);\n if (chatButtonPresent) {\n console.log(peoplePaneDismissButtonRef);\n peoplePaneDismissButtonRef?.current?.focus();\n event.preventDefault();\n }\n },\n [chatButtonPresent, onClick, peoplePaneDismissButtonRef]\n );\n\n return (\n <ControlBarButton\n {...props}\n strings={strings}\n labelKey={'peopleButtonLabelKey'}\n onRenderOnIcon={onRenderOnIcon ?? icon}\n onRenderOffIcon={onRenderOffIcon ?? icon}\n onClick={handleClick}\n onKeyDown={handleTab}\n styles={styles}\n />\n );\n};\n"]}

package/dist/dist-esm/react-composites/src/composites/common/ControlBar/Timer.d.ts ADDED Viewed

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+/**
+ * @private
+ */
+export interface TimerProps {
+    timeStampInfo: string;
+}
+/**
+ * @private
+ */
+export declare const Timer: (props: TimerProps) => JSX.Element;
+//# sourceMappingURL=Timer.d.ts.map

package/dist/dist-esm/react-composites/src/composites/common/ControlBar/Timer.js ADDED Viewed

@@ -0,0 +1,50 @@
+// Copyright (c) Microsoft Corporation.
+// Licensed under the MIT License.
+// eslint-disable-next-line no-restricted-imports
+import { FontIcon, Stack, Text, mergeStyles, useTheme } from '@fluentui/react';
+import { _pxToRem } from "../../../../../acs-ui-common/src";
+import React, { useState } from 'react';
+import { getReadableTime } from '../../CallComposite/utils/timerUtils';
+/**
+ * @private
+ */
+export const Timer = (props) => {
+    const { timeStampInfo } = props;
+    const endTimeMs = new Date(timeStampInfo).getTime();
+    const theme = useTheme();
+    const [time, setTime] = useState(0);
+    const timeRemaining = getReadableTime(time);
+    React.useEffect(() => {
+        const interval = setInterval(() => {
+            setTime(Math.max(endTimeMs - Date.now(), 0));
+        }, 10);
+        return () => {
+            clearInterval(interval);
+        };
+    }, [endTimeMs]);
+    return (React.createElement(Stack, { horizontal: true, className: timerContainerClass(theme), tokens: { childrenGap: '0.5rem' } },
+        React.createElement(FontIcon, { iconName: 'Clock', className: iconClass }),
+        React.createElement(Text, { styles: timerTextStyle }, timeRemaining)));
+};
+const timerContainerClass = (theme) => mergeStyles({
+    backgroundColor: theme.palette.neutralLight,
+    display: 'flex',
+    alignItems: 'center',
+    borderColor: theme.palette.neutralQuaternaryAlt,
+    borderWidth: '0.0625rem',
+    borderRadius: '0.25rem',
+    padding: '0.5rem'
+});
+const iconClass = mergeStyles({
+    fontSize: 18
+});
+const timerTextStyle = {
+    root: {
+        color: 'inherit',
+        fontWeight: 400,
+        fontSize: _pxToRem(14),
+        lineHeight: _pxToRem(20),
+        margin: 'auto'
+    }
+};
+//# sourceMappingURL=Timer.js.map

package/dist/dist-esm/react-composites/src/composites/common/ControlBar/Timer.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"Timer.js","sourceRoot":"","sources":["../../../../../../../../react-composites/src/composites/common/ControlBar/Timer.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,iDAAiD;AACjD,OAAO,EAAE,QAAQ,EAAe,KAAK,EAAE,IAAI,EAAS,WAAW,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AACnG,OAAO,EAAE,QAAQ,EAAE,yCAAgC;AACnD,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACxC,OAAO,EAAE,eAAe,EAAE,MAAM,sCAAsC,CAAC;AASvE;;GAEG;AACH,MAAM,CAAC,MAAM,KAAK,GAAG,CAAC,KAAiB,EAAe,EAAE;IACtD,MAAM,EAAE,aAAa,EAAE,GAAG,KAAK,CAAC;IAEhC,MAAM,SAAS,GAAG,IAAI,IAAI,CAAC,aAAa,CAAC,CAAC,OAAO,EAAE,CAAC;IAEpD,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IAEzB,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAS,CAAC,CAAC,CAAC;IAE5C,MAAM,aAAa,GAAG,eAAe,CAAC,IAAI,CAAC,CAAC;IAE5C,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,MAAM,QAAQ,GAAG,WAAW,CAAC,GAAG,EAAE;YAChC,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC,SAAS,GAAG,IAAI,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC;QAC/C,CAAC,EAAE,EAAE,CAAC,CAAC;QACP,OAAO,GAAG,EAAE;YACV,aAAa,CAAC,QAAQ,CAAC,CAAC;QAC1B,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;IAEhB,OAAO,CACL,oBAAC,KAAK,IAAC,UAAU,QAAC,SAAS,EAAE,mBAAmB,CAAC,KAAK,CAAC,EAAE,MAAM,EAAE,EAAE,WAAW,EAAE,QAAQ,EAAE;QACxF,oBAAC,QAAQ,IAAC,QAAQ,EAAE,OAAO,EAAE,SAAS,EAAE,SAAS,GAAI;QACrD,oBAAC,IAAI,IAAC,MAAM,EAAE,cAAc,IAAG,aAAa,CAAQ,CAC9C,CACT,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,mBAAmB,GAAG,CAAC,KAAY,EAAU,EAAE,CACnD,WAAW,CAAC;IACV,eAAe,EAAE,KAAK,CAAC,OAAO,CAAC,YAAY;IAC3C,OAAO,EAAE,MAAM;IACf,UAAU,EAAE,QAAQ;IACpB,WAAW,EAAE,KAAK,CAAC,OAAO,CAAC,oBAAoB;IAC/C,WAAW,EAAE,WAAW;IACxB,YAAY,EAAE,SAAS;IACvB,OAAO,EAAE,QAAQ;CAClB,CAAC,CAAC;AAEL,MAAM,SAAS,GAAG,WAAW,CAAC;IAC5B,QAAQ,EAAE,EAAE;CACb,CAAC,CAAC;AAEH,MAAM,cAAc,GAAgB;IAClC,IAAI,EAAE;QACJ,KAAK,EAAE,SAAS;QAChB,UAAU,EAAE,GAAG;QACf,QAAQ,EAAE,QAAQ,CAAC,EAAE,CAAC;QACtB,UAAU,EAAE,QAAQ,CAAC,EAAE,CAAC;QACxB,MAAM,EAAE,MAAM;KACf;CACF,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\n// eslint-disable-next-line no-restricted-imports\nimport { FontIcon, ITextStyles, Stack, Text, Theme, mergeStyles, useTheme } from '@fluentui/react';\nimport { _pxToRem } from '@internal/acs-ui-common';\nimport React, { useState } from 'react';\nimport { getReadableTime } from '../../CallComposite/utils/timerUtils';\n\n/**\n * @private\n */\nexport interface TimerProps {\n timeStampInfo: string;\n}\n\n/**\n * @private\n */\nexport const Timer = (props: TimerProps): JSX.Element => {\n const { timeStampInfo } = props;\n\n const endTimeMs = new Date(timeStampInfo).getTime();\n\n const theme = useTheme();\n\n const [time, setTime] = useState<number>(0);\n\n const timeRemaining = getReadableTime(time);\n\n React.useEffect(() => {\n const interval = setInterval(() => {\n setTime(Math.max(endTimeMs - Date.now(), 0));\n }, 10);\n return () => {\n clearInterval(interval);\n };\n }, [endTimeMs]);\n\n return (\n <Stack horizontal className={timerContainerClass(theme)} tokens={{ childrenGap: '0.5rem' }}>\n <FontIcon iconName={'Clock'} className={iconClass} />\n <Text styles={timerTextStyle}>{timeRemaining}</Text>\n </Stack>\n );\n};\n\nconst timerContainerClass = (theme: Theme): string =>\n mergeStyles({\n backgroundColor: theme.palette.neutralLight,\n display: 'flex',\n alignItems: 'center',\n borderColor: theme.palette.neutralQuaternaryAlt,\n borderWidth: '0.0625rem',\n borderRadius: '0.25rem',\n padding: '0.5rem'\n });\n\nconst iconClass = mergeStyles({\n fontSize: 18\n});\n\nconst timerTextStyle: ITextStyles = {\n root: {\n color: 'inherit',\n fontWeight: 400,\n fontSize: _pxToRem(14),\n lineHeight: _pxToRem(20),\n margin: 'auto'\n }\n};\n"]}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ConvertContextualMenuItemToDrawerMenuItem.js","sourceRoot":"","sources":["~~../../../../../../preprocess-dist/~~react-composites/src/composites/common/ConvertContextualMenuItemToDrawerMenuItem.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAKlC;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,yCAAyC,GAAG,~~CAAC~~,cAAmC,~~EAAE~~,qBAAiC,~~EAAwB~~,EAAE;~~IACxJ~~,OAAO;QACL,OAAO,EAAE,cAAc,CAAC,GAAG;QAC3B,WAAW,EAAE,GAAG,EAAE;;YAChB,MAAA,cAAc,CAAC,OAAO,8DAAI,CAAC;YAC3B,qBAAqB,EAAE,CAAC;QAC1B,CAAC;QACD,SAAS,EAAE,cAAc,CAAC,SAAS;QACnC,IAAI,EAAE,cAAc,CAAC,IAAI;QACzB,QAAQ,EAAE,cAAc,CAAC,QAAQ;KAClC,CAAC;AACJ,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { IContextualMenuItem } from '@fluentui/react';\nimport { _DrawerMenuItemProps } from '@internal/react-components';\n\n/*\n Convert IContextualMenuItem to _DrawerMenuItemProps\n * @param contextualMenu - IContextualMenuItem to convert\n * @param onDrawerMenuItemClick - callback to call when converted DrawerMenuItem is clicked\n * @returns DrawerMenuItem\n * @private\n */\nexport const convertContextualMenuItemToDrawerMenuItem = (contextualMenu: IContextualMenuItem, onDrawerMenuItemClick: () => void): _DrawerMenuItemProps => {\n return {\n itemKey: contextualMenu.key,\n onItemClick: () => {\n contextualMenu.onClick?.();\n onDrawerMenuItemClick();\n },\n iconProps: contextualMenu.iconProps,\n text: contextualMenu.text,\n disabled: contextualMenu.disabled\n };\n};"]}
1	+ {"version":3,"file":"ConvertContextualMenuItemToDrawerMenuItem.js","sourceRoot":"","sources":["../../../../../../../react-composites/src/composites/common/ConvertContextualMenuItemToDrawerMenuItem.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAKlC;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,yCAAyC,GAAG,CACvD,cAAmC,EACnC,qBAAiC,EACX,EAAE;IACxB,OAAO;QACL,OAAO,EAAE,cAAc,CAAC,GAAG;QAC3B,WAAW,EAAE,GAAG,EAAE;;YAChB,MAAA,cAAc,CAAC,OAAO,8DAAI,CAAC;YAC3B,qBAAqB,EAAE,CAAC;QAC1B,CAAC;QACD,SAAS,EAAE,cAAc,CAAC,SAAS;QACnC,IAAI,EAAE,cAAc,CAAC,IAAI;QACzB,QAAQ,EAAE,cAAc,CAAC,QAAQ;KAClC,CAAC;AACJ,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { IContextualMenuItem } from '@fluentui/react';\nimport { _DrawerMenuItemProps } from '@internal/react-components';\n\n/*\n Convert IContextualMenuItem to _DrawerMenuItemProps\n * @param contextualMenu - IContextualMenuItem to convert\n * @param onDrawerMenuItemClick - callback to call when converted DrawerMenuItem is clicked\n * @returns DrawerMenuItem\n * @private\n */\nexport const convertContextualMenuItemToDrawerMenuItem = (\n contextualMenu: IContextualMenuItem,\n onDrawerMenuItemClick: () => void\n): _DrawerMenuItemProps => {\n return {\n itemKey: contextualMenu.key,\n onItemClick: () => {\n contextualMenu.onClick?.();\n onDrawerMenuItemClick();\n },\n iconProps: contextualMenu.iconProps,\n text: contextualMenu.text,\n disabled: contextualMenu.disabled\n };\n};\n"]}

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

@@ -15,22 +15,20 @@ export const CaptionLanguageSettingsDrawer = (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=CaptionLanguageSettingsDrawer.js.map