@azure/communication-react 1.20.0-alpha-202410040016 → 1.20.0-beta.1

package/dist/dist-esm/react-composites/src/composites/CallComposite/components/buttons/Devices.js

@@ -14,24 +14,21 @@ export const Devices = (props) => {
     const adapter = useAdapter();
     const role = (_b = (_a = adapter.getState().call) === null || _a === void 0 ? void 0 : _a.role) !== null && _b !== void 0 ? _b : 'Unknown';
     const augmentedDeviceButtonProps = useMemo(() => (Object.assign(Object.assign({}, devicesButtonProps), { microphones: role === 'Consumer' ? [] : devicesButtonProps.microphones, cameras: role === 'Consumer' ? [] : devicesButtonProps.cameras })), [devicesButtonProps, role]);
-    const styles = useMemo(() => {
-        var _a;
-        return concatButtonBaseStyles(props.increaseFlyoutItemSize ? devicesButtonWithIncreasedTouchTargets : {}, (_a = props.styles) !== null && _a !== void 0 ? _a : {});
-    }, [props.increaseFlyoutItemSize, props.styles]);
+    const styles = useMemo(() => { var _a; return concatButtonBaseStyles(props.increaseFlyoutItemSize ? devicesButtonWithIncreasedTouchTargets : {}, (_a = props.styles) !== null && _a !== void 0 ? _a : {}); }, [props.increaseFlyoutItemSize, props.styles]);
     const locale = useLocale();
     const onlyManageSpeakers = role === 'Consumer';
     const onRenderDevicesIcon = () => {
         return React.createElement(_HighContrastAwareIcon, { disabled: props.disabled, iconName: "OptionsSpeaker" });
     };
-    return (React.createElement(DevicesButton
-    /* By setting `persistMenu?` to true, we prevent options menu from getting hidden every time a participant joins or leaves. */
-    , Object.assign({ 
-        /* By setting `persistMenu?` to true, we prevent options menu from getting hidden every time a participant joins or leaves. */
-        persistMenu: true }, augmentedDeviceButtonProps, { showLabel: props.displayType !== 'compact', styles: styles, "data-ui-id": "calling-composite-devices-button", disabled: props.disabled, strings: getLabelFromRole(role, locale), onRenderIcon: onlyManageSpeakers ? onRenderDevicesIcon : undefined })));
+    return React.createElement(DevicesButton
+    /* By setting `persistMenu?` to true, we prevent options menu from getting hidden every time a participant joins or leaves. */ , Object.assign({ 
+        /* By setting `persistMenu?` to true, we prevent options menu from getting hidden every time a participant joins or leaves. */ persistMenu: true }, augmentedDeviceButtonProps, { showLabel: props.displayType !== 'compact', styles: styles, "data-ui-id": "calling-composite-devices-button", disabled: props.disabled, strings: getLabelFromRole(role, locale), onRenderIcon: onlyManageSpeakers ? onRenderDevicesIcon : undefined }));
 };
 const getLabelFromRole = (role, locale) => {
     if (role === 'Consumer') {
-        return { label: locale.component.strings.microphoneButton.speakerMenuTitle };
+        return {
+            label: locale.component.strings.microphoneButton.speakerMenuTitle
+        };
     }
     return undefined;
 };

package/dist/dist-esm/react-composites/src/composites/CallComposite/components/buttons/Devices.js.map

@@ -1 +1 @@
-{"version":3,"file":"Devices.js","sourceRoot":"","sources":["../../../../../../../../../react-composites/src/composites/CallComposite/components/buttons/Devices.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAA0B,aAAa,EAAE,+CAAmC;AAEnF,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AACtD,OAAO,EAAE,sBAAsB,EAAE,sCAAsC,EAAE,MAAM,6BAA6B,CAAC;AAC7G,OAAO,EAAmB,SAAS,EAAE,MAAM,uBAAuB,CAAC;AACnE,OAAO,EAAE,sBAAsB,EAAE,+CAAmC;AAEpE,OAAO,EAAE,UAAU,EAAE,MAAM,mCAAmC,CAAC;AAG/D,eAAe;AACf,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,KAKvB,EAAe,EAAE;;IAChB,MAAM,kBAAkB,GAAG,WAAW,CAAC,aAAa,CAAC,CAAC;IACtD,MAAM,OAAO,GAAG,UAAU,EAAE,CAAC;IAC7B,MAAM,IAAI,GAAoB,MAAA,MAAA,OAAO,CAAC,QAAQ,EAAE,CAAC,IAAI,0CAAE,IAAI,mCAAI,SAAS,CAAC;IAEzE,MAAM,0BAA0B,GAAG,OAAO,CACxC,GAAG,EAAE,CAAC,iCACD,kBAAkB,KACrB,WAAW,EAAE,IAAI,KAAK,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,kBAAkB,CAAC,WAAW,EACtE,OAAO,EAAE,IAAI,KAAK,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,kBAAkB,CAAC,OAAO,IAC9D,EACF,CAAC,kBAAkB,EAAE,IAAI,CAAC,CAC3B,CAAC;IACF,MAAM,MAAM,GAAG,OAAO,CACpB,GAAG,EAAE;;QACH,OAAA,sBAAsB,CACpB,KAAK,CAAC,sBAAsB,CAAC,CAAC,CAAC,sCAAsC,CAAC,CAAC,CAAC,EAAE,EAC1E,MAAA,KAAK,CAAC,MAAM,mCAAI,EAAE,CACnB,CAAA;KAAA,EACH,CAAC,KAAK,CAAC,sBAAsB,EAAE,KAAK,CAAC,MAAM,CAAC,CAC7C,CAAC;IACF,MAAM,MAAM,GAAG,SAAS,EAAE,CAAC;IAC3B,MAAM,kBAAkB,GAAG,IAAI,KAAK,UAAU,CAAC;IAE/C,MAAM,mBAAmB,GAAG,GAAgB,EAAE;QAC5C,OAAO,oBAAC,sBAAsB,IAAC,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,QAAQ,EAAC,gBAAgB,GAAG,CAAC;IACxF,CAAC,CAAC;IAEF,OAAO,CACL,oBAAC,aAAa;IACZ,8HAA8H;;QAA9H,8HAA8H;QAC9H,WAAW,EAAE,IAAI,IACb,0BAA0B,IAC9B,SAAS,EAAE,KAAK,CAAC,WAAW,KAAK,SAAS,EAC1C,MAAM,EAAE,MAAM,gBACH,kCAAkC,EAC7C,QAAQ,EAAE,KAAK,CAAC,QAAQ,EACxB,OAAO,EAAE,gBAAgB,CAAC,IAAuB,EAAE,MAAM,CAAC,EAC1D,YAAY,EAAE,kBAAkB,CAAC,CAAC,CAAC,mBAAmB,CAAC,CAAC,CAAC,SAAS,IAClE,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,gBAAgB,GAAG,CACvB,IAAqB,EACrB,MAAuB,EACoB,EAAE;IAC7C,IAAI,IAAI,KAAK,UAAU,EAAE,CAAC;QACxB,OAAO,EAAE,KAAK,EAAE,MAAM,CAAC,SAAS,CAAC,OAAO,CAAC,gBAAgB,CAAC,gBAAgB,EAAE,CAAC;IAC/E,CAAC;IACD,OAAO,SAAS,CAAC;AACnB,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { ControlBarButtonStyles, DevicesButton } from '@internal/react-components';\nimport { DevicesButtonStrings } from '@internal/react-components';\nimport React, { useMemo } from 'react';\nimport { usePropsFor } from '../../hooks/usePropsFor';\nimport { concatButtonBaseStyles, devicesButtonWithIncreasedTouchTargets } from '../../styles/Buttons.styles';\nimport { CompositeLocale, useLocale } from '../../../localization';\nimport { _HighContrastAwareIcon } from '@internal/react-components';\nimport { CallControlDisplayType } from '../../../common/types/CommonCallControlOptions';\nimport { useAdapter } from '../../adapter/CallAdapterProvider';\nimport { ParticipantRole } from '@azure/communication-calling';\n\n/** @private */\nexport const Devices = (props: {\n  displayType?: CallControlDisplayType;\n  increaseFlyoutItemSize?: boolean;\n  styles?: ControlBarButtonStyles;\n  disabled?: boolean;\n}): JSX.Element => {\n  const devicesButtonProps = usePropsFor(DevicesButton);\n  const adapter = useAdapter();\n  const role: ParticipantRole = adapter.getState().call?.role ?? 'Unknown';\n\n  const augmentedDeviceButtonProps = useMemo(\n    () => ({\n      ...devicesButtonProps,\n      microphones: role === 'Consumer' ? [] : devicesButtonProps.microphones,\n      cameras: role === 'Consumer' ? [] : devicesButtonProps.cameras\n    }),\n    [devicesButtonProps, role]\n  );\n  const styles = useMemo(\n    () =>\n      concatButtonBaseStyles(\n        props.increaseFlyoutItemSize ? devicesButtonWithIncreasedTouchTargets : {},\n        props.styles ?? {}\n      ),\n    [props.increaseFlyoutItemSize, props.styles]\n  );\n  const locale = useLocale();\n  const onlyManageSpeakers = role === 'Consumer';\n\n  const onRenderDevicesIcon = (): JSX.Element => {\n    return <_HighContrastAwareIcon disabled={props.disabled} iconName=\"OptionsSpeaker\" />;\n  };\n\n  return (\n    <DevicesButton\n      /* By setting `persistMenu?` to true, we prevent options menu from getting hidden every time a participant joins or leaves. */\n      persistMenu={true}\n      {...augmentedDeviceButtonProps}\n      showLabel={props.displayType !== 'compact'}\n      styles={styles}\n      data-ui-id=\"calling-composite-devices-button\"\n      disabled={props.disabled}\n      strings={getLabelFromRole(role as ParticipantRole, locale)}\n      onRenderIcon={onlyManageSpeakers ? onRenderDevicesIcon : undefined}\n    />\n  );\n};\n\nconst getLabelFromRole = (\n  role: ParticipantRole,\n  locale: CompositeLocale\n): Partial<DevicesButtonStrings> | undefined => {\n  if (role === 'Consumer') {\n    return { label: locale.component.strings.microphoneButton.speakerMenuTitle };\n  }\n  return undefined;\n};\n"]}
+{"version":3,"file":"Devices.js","sourceRoot":"","sources":["../../../../../../../../preprocess-dist/react-composites/src/composites/CallComposite/components/buttons/Devices.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAA0B,aAAa,EAAE,+CAAmC;AAEnF,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AACtD,OAAO,EAAE,sBAAsB,EAAE,sCAAsC,EAAE,MAAM,6BAA6B,CAAC;AAC7G,OAAO,EAAmB,SAAS,EAAE,MAAM,uBAAuB,CAAC;AACnE,OAAO,EAAE,sBAAsB,EAAE,+CAAmC;AAEpE,OAAO,EAAE,UAAU,EAAE,MAAM,mCAAmC,CAAC;AAG/D,eAAe;AACf,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,KAKvB,EAAe,EAAE;;IAChB,MAAM,kBAAkB,GAAG,WAAW,CAAC,aAAa,CAAC,CAAC;IACtD,MAAM,OAAO,GAAG,UAAU,EAAE,CAAC;IAC7B,MAAM,IAAI,GAAoB,MAAA,MAAA,OAAO,CAAC,QAAQ,EAAE,CAAC,IAAI,0CAAE,IAAI,mCAAI,SAAS,CAAC;IACzE,MAAM,0BAA0B,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,iCAC5C,kBAAkB,KACrB,WAAW,EAAE,IAAI,KAAK,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,kBAAkB,CAAC,WAAW,EACtE,OAAO,EAAE,IAAI,KAAK,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,kBAAkB,CAAC,OAAO,IAC9D,EAAE,CAAC,kBAAkB,EAAE,IAAI,CAAC,CAAC,CAAC;IAChC,MAAM,MAAM,GAAG,OAAO,CAAC,GAAG,EAAE,WAAC,OAAA,sBAAsB,CAAC,KAAK,CAAC,sBAAsB,CAAC,CAAC,CAAC,sCAAsC,CAAC,CAAC,CAAC,EAAE,EAAE,MAAA,KAAK,CAAC,MAAM,mCAAI,EAAE,CAAC,CAAA,EAAA,EAAE,CAAC,KAAK,CAAC,sBAAsB,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC;IACnM,MAAM,MAAM,GAAG,SAAS,EAAE,CAAC;IAC3B,MAAM,kBAAkB,GAAG,IAAI,KAAK,UAAU,CAAC;IAC/C,MAAM,mBAAmB,GAAG,GAAgB,EAAE;QAC5C,OAAO,oBAAC,sBAAsB,IAAC,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,QAAQ,EAAC,gBAAgB,GAAG,CAAC;IACxF,CAAC,CAAC;IACF,OAAO,oBAAC,aAAa;IACrB,8HAA8H;QAA9H,8HAA8H,CAAC,WAAW,EAAE,IAAI,IAAM,0BAA0B,IAAE,SAAS,EAAE,KAAK,CAAC,WAAW,KAAK,SAAS,EAAE,MAAM,EAAE,MAAM,gBAAa,kCAAkC,EAAC,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,OAAO,EAAE,gBAAgB,CAAC,IAAuB,EAAE,MAAM,CAAC,EAAE,YAAY,EAAE,kBAAkB,CAAC,CAAC,CAAC,mBAAmB,CAAC,CAAC,CAAC,SAAS,IAAI,CAAC;AAC3b,CAAC,CAAC;AACF,MAAM,gBAAgB,GAAG,CAAC,IAAqB,EAAE,MAAuB,EAA6C,EAAE;IACrH,IAAI,IAAI,KAAK,UAAU,EAAE,CAAC;QACxB,OAAO;YACL,KAAK,EAAE,MAAM,CAAC,SAAS,CAAC,OAAO,CAAC,gBAAgB,CAAC,gBAAgB;SAClE,CAAC;IACJ,CAAC;IACD,OAAO,SAAS,CAAC;AACnB,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { ControlBarButtonStyles, DevicesButton } from '@internal/react-components';\nimport { DevicesButtonStrings } from '@internal/react-components';\nimport React, { useMemo } from 'react';\nimport { usePropsFor } from '../../hooks/usePropsFor';\nimport { concatButtonBaseStyles, devicesButtonWithIncreasedTouchTargets } from '../../styles/Buttons.styles';\nimport { CompositeLocale, useLocale } from '../../../localization';\nimport { _HighContrastAwareIcon } from '@internal/react-components';\nimport { CallControlDisplayType } from '../../../common/types/CommonCallControlOptions';\nimport { useAdapter } from '../../adapter/CallAdapterProvider';\nimport { ParticipantRole } from '@azure/communication-calling';\n\n/** @private */\nexport const Devices = (props: {\n  displayType?: CallControlDisplayType;\n  increaseFlyoutItemSize?: boolean;\n  styles?: ControlBarButtonStyles;\n  disabled?: boolean;\n}): JSX.Element => {\n  const devicesButtonProps = usePropsFor(DevicesButton);\n  const adapter = useAdapter();\n  const role: ParticipantRole = adapter.getState().call?.role ?? 'Unknown';\n  const augmentedDeviceButtonProps = useMemo(() => ({\n    ...devicesButtonProps,\n    microphones: role === 'Consumer' ? [] : devicesButtonProps.microphones,\n    cameras: role === 'Consumer' ? [] : devicesButtonProps.cameras\n  }), [devicesButtonProps, role]);\n  const styles = useMemo(() => concatButtonBaseStyles(props.increaseFlyoutItemSize ? devicesButtonWithIncreasedTouchTargets : {}, props.styles ?? {}), [props.increaseFlyoutItemSize, props.styles]);\n  const locale = useLocale();\n  const onlyManageSpeakers = role === 'Consumer';\n  const onRenderDevicesIcon = (): JSX.Element => {\n    return <_HighContrastAwareIcon disabled={props.disabled} iconName=\"OptionsSpeaker\" />;\n  };\n  return <DevicesButton\n  /* By setting `persistMenu?` to true, we prevent options menu from getting hidden every time a participant joins or leaves. */ persistMenu={true} {...augmentedDeviceButtonProps} showLabel={props.displayType !== 'compact'} styles={styles} data-ui-id=\"calling-composite-devices-button\" disabled={props.disabled} strings={getLabelFromRole(role as ParticipantRole, locale)} onRenderIcon={onlyManageSpeakers ? onRenderDevicesIcon : undefined} />;\n};\nconst getLabelFromRole = (role: ParticipantRole, locale: CompositeLocale): Partial<DevicesButtonStrings> | undefined => {\n  if (role === 'Consumer') {\n    return {\n      label: locale.component.strings.microphoneButton.speakerMenuTitle\n    };\n  }\n  return undefined;\n};"]}

package/dist/dist-esm/react-composites/src/composites/CallComposite/components/buttons/EndCall.js

@@ -12,76 +12,49 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
 import { concatStyleSets, Stack } from '@fluentui/react';
 import { EndCallButton } from "../../../../../../react-components/src";
 import React, { useMemo } from 'react';
-/* @conditional-compile-remove(end-call-options) */
 import { useState, useCallback } from 'react';
 import { usePropsFor } from '../../hooks/usePropsFor';
 import { groupCallLeaveButtonCompressedStyle, groupCallLeaveButtonStyle } from '../../styles/Buttons.styles';
-/* @conditional-compile-remove(end-call-options) */
 import { Prompt } from '../Prompt';
-/* @conditional-compile-remove(end-call-options) */
 import { useLocale } from '../../../localization';
 /** @private */
 export const EndCall = (props) => {
     var _a;
     const compactMode = props.displayType === 'compact';
     const hangUpButtonProps = usePropsFor(EndCallButton);
-    /* @conditional-compile-remove(end-call-options) */
     const localeStrings = useLocale().strings;
-    /* @conditional-compile-remove(end-call-options) */
     const endCallDiaglogLabels = useMemo(() => ({
         confirmButtonLabel: localeStrings.call.endCallConfirmButtonLabel,
         heading: localeStrings.call.endCallConfirmDialogTitle,
         text: localeStrings.call.leaveConfirmDialogContent
-    }), [
-        localeStrings.call.endCallConfirmButtonLabel,
-        localeStrings.call.endCallConfirmDialogTitle,
-        localeStrings.call.leaveConfirmDialogContent
-    ]);
-    /* @conditional-compile-remove(end-call-options) */
+    }), [localeStrings.call.endCallConfirmButtonLabel, localeStrings.call.endCallConfirmDialogTitle, localeStrings.call.leaveConfirmDialogContent]);
     const leaveDiaglogLabels = useMemo(() => ({
         confirmButtonLabel: localeStrings.call.leaveConfirmButtonLabel,
         heading: localeStrings.call.leaveConfirmDialogTitle,
         text: localeStrings.call.leaveConfirmDialogContent
-    }), [
-        localeStrings.call.leaveConfirmButtonLabel,
-        localeStrings.call.leaveConfirmDialogContent,
-        localeStrings.call.leaveConfirmDialogTitle
-    ]);
-    /* @conditional-compile-remove(end-call-options) */
+    }), [localeStrings.call.leaveConfirmButtonLabel, localeStrings.call.leaveConfirmDialogContent, localeStrings.call.leaveConfirmDialogTitle]);
     const [dialogLabels, setDialogLabels] = useState(leaveDiaglogLabels);
-    /* @conditional-compile-remove(end-call-options) */
     const { onHangUp } = hangUpButtonProps;
-    /* @conditional-compile-remove(end-call-options) */
     const [showHangUpConfirm, setShowHangUpConfirm] = React.useState(false);
-    /* @conditional-compile-remove(end-call-options) */
     const toggleConfirm = useCallback(() => {
         setShowHangUpConfirm(!showHangUpConfirm);
     }, [showHangUpConfirm]);
-    /* @conditional-compile-remove(end-call-options) */
     const onHangUpConfirm = useCallback((hangUpForEveryone) => {
         onHangUp && onHangUp(hangUpForEveryone);
         toggleConfirm();
     }, [onHangUp, toggleConfirm]);
-    /* @conditional-compile-remove(end-call-options) */
     const hangUpOverride = useCallback((forEveryone) => __awaiter(void 0, void 0, void 0, function* () {
-        if (props.mobileView ||
-            forEveryone === false /* value being false(not undefined) because it comes from endCall option */) {
+        if (props.mobileView || forEveryone === false /* value being false(not undefined) because it comes from endCall option */) {
             onHangUp();
             return;
         }
         setDialogLabels(forEveryone ? endCallDiaglogLabels : leaveDiaglogLabels);
         toggleConfirm();
     }), [endCallDiaglogLabels, leaveDiaglogLabels, onHangUp, props.mobileView, toggleConfirm]);
-    const styles = useMemo(() => {
-        var _a;
-        return concatStyleSets(compactMode ? groupCallLeaveButtonCompressedStyle : groupCallLeaveButtonStyle, (_a = props.styles) !== null && _a !== void 0 ? _a : {});
-    }, [compactMode, props.styles]);
-    /* @conditional-compile-remove(breakout-rooms) */
+    const styles = useMemo(() => { var _a; return concatStyleSets(compactMode ? groupCallLeaveButtonCompressedStyle : groupCallLeaveButtonStyle, (_a = props.styles) !== null && _a !== void 0 ? _a : {}); }, [compactMode, props.styles]);
     const enableBreakoutRoomMenu = !!props.returnFromBreakoutRoom;
-    /* @conditional-compile-remove(breakout-rooms) */
     const breakoutRoomMenuProps = {
-        items: [
-            {
+        items: [{
                 key: 'returnToMainMeeting',
                 text: localeStrings.call.returnFromBreakoutRoomButtonLabel,
                 title: localeStrings.call.returnFromBreakoutRoomButtonLabel,
@@ -89,25 +62,21 @@ export const EndCall = (props) => {
                     var _a;
                     (_a = props.returnFromBreakoutRoom) === null || _a === void 0 ? void 0 : _a.call(props);
                 }
-            },
-            {
+            }, {
                 key: 'leaveRoomAndMainMeeting',
                 text: localeStrings.call.leaveBreakoutRoomAndMeetingButtonLabel,
                 title: localeStrings.call.leaveBreakoutRoomAndMeetingButtonLabel,
                 onClick: () => onHangUp()
-            }
-        ],
+            }],
         styles: props.styles
     };
-    return (React.createElement(Stack, null,
-        React.createElement(EndCallButton, Object.assign({ "data-ui-id": "call-composite-hangup-button" }, hangUpButtonProps, { 
-            /* @conditional-compile-remove(end-call-options) */
-            onHangUp: props.disableEndCallModal ? onHangUp : hangUpOverride, styles: styles, showLabel: !compactMode, 
-            /* @conditional-compile-remove(end-call-options) */
-            enableEndCallMenu: (_a = props.enableEndCallMenu) !== null && _a !== void 0 ? _a : false, 
-            /* @conditional-compile-remove(breakout-rooms) */
-            menuProps: enableBreakoutRoomMenu ? breakoutRoomMenuProps : undefined })),
-        /* @conditional-compile-remove(end-call-options) */
-        React.createElement(Prompt, Object.assign({}, dialogLabels, { styles: { main: { minWidth: '22.5rem', padding: '1.5rem' } }, cancelButtonLabel: localeStrings.call.hangUpCancelButtonLabel, onConfirm: () => onHangUpConfirm(props.enableEndCallMenu), isOpen: showHangUpConfirm, onCancel: toggleConfirm }))));
+    return React.createElement(Stack, null,
+        React.createElement(EndCallButton, Object.assign({ "data-ui-id": "call-composite-hangup-button" }, hangUpButtonProps, { onHangUp: props.disableEndCallModal ? onHangUp : hangUpOverride, styles: styles, showLabel: !compactMode, enableEndCallMenu: (_a = props.enableEndCallMenu) !== null && _a !== void 0 ? _a : false, menuProps: enableBreakoutRoomMenu ? breakoutRoomMenuProps : undefined })),
+        React.createElement(Prompt, Object.assign({}, dialogLabels, { styles: {
+                main: {
+                    minWidth: '22.5rem',
+                    padding: '1.5rem'
+                }
+            }, cancelButtonLabel: localeStrings.call.hangUpCancelButtonLabel, onConfirm: () => onHangUpConfirm(props.enableEndCallMenu), isOpen: showHangUpConfirm, onCancel: toggleConfirm })));
 };
 //# sourceMappingURL=EndCall.js.map

package/dist/dist-esm/react-composites/src/composites/CallComposite/components/buttons/EndCall.js.map

@@ -1 +1 @@
-{"version":3,"file":"EndCall.js","sourceRoot":"","sources":["../../../../../../../../../react-composites/src/composites/CallComposite/components/buttons/EndCall.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;;;;;;;;;;AAElC,OAAO,EAAE,eAAe,EAAE,KAAK,EAAE,MAAM,iBAAiB,CAAC;AAGzD,OAAO,EAA0B,aAAa,EAAE,+CAAmC;AACnF,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AACvC,mDAAmD;AACnD,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAE9C,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AACtD,OAAO,EAAE,mCAAmC,EAAE,yBAAyB,EAAE,MAAM,6BAA6B,CAAC;AAC7G,mDAAmD;AACnD,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAC;AACnC,mDAAmD;AACnD,OAAO,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;AAElD,eAAe;AACf,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,KASvB,EAAe,EAAE;;IAChB,MAAM,WAAW,GAAG,KAAK,CAAC,WAAW,KAAK,SAAS,CAAC;IACpD,MAAM,iBAAiB,GAAG,WAAW,CAAC,aAAa,CAAC,CAAC;IACrD,mDAAmD;IACnD,MAAM,aAAa,GAAG,SAAS,EAAE,CAAC,OAAO,CAAC;IAE1C,mDAAmD;IACnD,MAAM,oBAAoB,GAAG,OAAO,CAClC,GAAG,EAAE,CAAC,CAAC;QACL,kBAAkB,EAAE,aAAa,CAAC,IAAI,CAAC,yBAAyB;QAChE,OAAO,EAAE,aAAa,CAAC,IAAI,CAAC,yBAAyB;QACrD,IAAI,EAAE,aAAa,CAAC,IAAI,CAAC,yBAAyB;KACnD,CAAC,EACF;QACE,aAAa,CAAC,IAAI,CAAC,yBAAyB;QAC5C,aAAa,CAAC,IAAI,CAAC,yBAAyB;QAC5C,aAAa,CAAC,IAAI,CAAC,yBAAyB;KAC7C,CACF,CAAC;IAEF,mDAAmD;IACnD,MAAM,kBAAkB,GAAG,OAAO,CAChC,GAAG,EAAE,CAAC,CAAC;QACL,kBAAkB,EAAE,aAAa,CAAC,IAAI,CAAC,uBAAuB;QAC9D,OAAO,EAAE,aAAa,CAAC,IAAI,CAAC,uBAAuB;QACnD,IAAI,EAAE,aAAa,CAAC,IAAI,CAAC,yBAAyB;KACnD,CAAC,EACF;QACE,aAAa,CAAC,IAAI,CAAC,uBAAuB;QAC1C,aAAa,CAAC,IAAI,CAAC,yBAAyB;QAC5C,aAAa,CAAC,IAAI,CAAC,uBAAuB;KAC3C,CACF,CAAC;IAEF,mDAAmD;IACnD,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAC,kBAAkB,CAAC,CAAC;IAErE,mDAAmD;IACnD,MAAM,EAAE,QAAQ,EAAE,GAAG,iBAAiB,CAAC;IAEvC,mDAAmD;IACnD,MAAM,CAAC,iBAAiB,EAAE,oBAAoB,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IAExE,mDAAmD;IACnD,MAAM,aAAa,GAAG,WAAW,CAAC,GAAG,EAAE;QACrC,oBAAoB,CAAC,CAAC,iBAAiB,CAAC,CAAC;IAC3C,CAAC,EAAE,CAAC,iBAAiB,CAAC,CAAC,CAAC;IAExB,mDAAmD;IACnD,MAAM,eAAe,GAAG,WAAW,CACjC,CAAC,iBAA2B,EAAE,EAAE;QAC9B,QAAQ,IAAI,QAAQ,CAAC,iBAAiB,CAAC,CAAC;QACxC,aAAa,EAAE,CAAC;IAClB,CAAC,EACD,CAAC,QAAQ,EAAE,aAAa,CAAC,CAC1B,CAAC;IAEF,mDAAmD;IACnD,MAAM,cAAc,GAAG,WAAW,CAChC,CAAO,WAAqB,EAAE,EAAE;QAC9B,IACE,KAAK,CAAC,UAAU;YAChB,WAAW,KAAK,KAAK,CAAC,2EAA2E,EACjG,CAAC;YACD,QAAQ,EAAE,CAAC;YACX,OAAO;QACT,CAAC;QACD,eAAe,CAAC,WAAW,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC;QACzE,aAAa,EAAE,CAAC;IAClB,CAAC,CAAA,EACD,CAAC,oBAAoB,EAAE,kBAAkB,EAAE,QAAQ,EAAE,KAAK,CAAC,UAAU,EAAE,aAAa,CAAC,CACtF,CAAC;IAEF,MAAM,MAAM,GAAG,OAAO,CACpB,GAAG,EAAE;;QACH,OAAA,eAAe,CACb,WAAW,CAAC,CAAC,CAAC,mCAAmC,CAAC,CAAC,CAAC,yBAAyB,EAC7E,MAAA,KAAK,CAAC,MAAM,mCAAI,EAAE,CACnB,CAAA;KAAA,EACH,CAAC,WAAW,EAAE,KAAK,CAAC,MAAM,CAAC,CAC5B,CAAC;IAEF,iDAAiD;IACjD,MAAM,sBAAsB,GAAG,CAAC,CAAC,KAAK,CAAC,sBAAsB,CAAC;IAC9D,iDAAiD;IACjD,MAAM,qBAAqB,GAAyB;QAClD,KAAK,EAAE;YACL;gBACE,GAAG,EAAE,qBAAqB;gBAC1B,IAAI,EAAE,aAAa,CAAC,IAAI,CAAC,iCAAiC;gBAC1D,KAAK,EAAE,aAAa,CAAC,IAAI,CAAC,iCAAiC;gBAC3D,OAAO,EAAE,GAAG,EAAE;;oBACZ,MAAA,KAAK,CAAC,sBAAsB,qDAAI,CAAC;gBACnC,CAAC;aACF;YACD;gBACE,GAAG,EAAE,yBAAyB;gBAC9B,IAAI,EAAE,aAAa,CAAC,IAAI,CAAC,sCAAsC;gBAC/D,KAAK,EAAE,aAAa,CAAC,IAAI,CAAC,sCAAsC;gBAChE,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,EAAE;aAC1B;SACF;QACD,MAAM,EAAE,KAAK,CAAC,MAAM;KACrB,CAAC;IAEF,OAAO,CACL,oBAAC,KAAK;QACJ,oBAAC,aAAa,gCACD,8BAA8B,IACrC,iBAAiB;YACrB,mDAAmD;YACnD,QAAQ,EAAE,KAAK,CAAC,mBAAmB,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,cAAc,EAC/D,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,CAAC,WAAW;YACvB,mDAAmD;YACnD,iBAAiB,EAAE,MAAA,KAAK,CAAC,iBAAiB,mCAAI,KAAK;YACnD,iDAAiD;YACjD,SAAS,EAAE,sBAAsB,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,SAAS,IACrE;QAEA,mDAAmD;QACnD,oBAAC,MAAM,oBACD,YAAY,IAChB,MAAM,EAAE,EAAE,IAAI,EAAE,EAAE,QAAQ,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAE,EAAE,EAC5D,iBAAiB,EAAE,aAAa,CAAC,IAAI,CAAC,uBAAuB,EAC7D,SAAS,EAAE,GAAG,EAAE,CAAC,eAAe,CAAC,KAAK,CAAC,iBAAiB,CAAC,EACzD,MAAM,EAAE,iBAAiB,EACzB,QAAQ,EAAE,aAAa,IACvB,CAEE,CACT,CAAC;AACJ,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { concatStyleSets, Stack } from '@fluentui/react';\n/* @conditional-compile-remove(breakout-rooms) */\nimport { IContextualMenuProps } from '@fluentui/react';\nimport { ControlBarButtonStyles, EndCallButton } from '@internal/react-components';\nimport React, { useMemo } from 'react';\n/* @conditional-compile-remove(end-call-options) */\nimport { useState, useCallback } from 'react';\nimport { CallControlDisplayType } from '../../../common/types/CommonCallControlOptions';\nimport { usePropsFor } from '../../hooks/usePropsFor';\nimport { groupCallLeaveButtonCompressedStyle, groupCallLeaveButtonStyle } from '../../styles/Buttons.styles';\n/* @conditional-compile-remove(end-call-options) */\nimport { Prompt } from '../Prompt';\n/* @conditional-compile-remove(end-call-options) */\nimport { useLocale } from '../../../localization';\n\n/** @private */\nexport const EndCall = (props: {\n  displayType?: CallControlDisplayType;\n  styles?: ControlBarButtonStyles;\n  mobileView?: boolean;\n  /* @conditional-compile-remove(end-call-options) */\n  enableEndCallMenu?: boolean;\n  disableEndCallModal?: boolean;\n  /* @conditional-compile-remove(breakout-rooms) */\n  returnFromBreakoutRoom?: () => Promise<void>;\n}): JSX.Element => {\n  const compactMode = props.displayType === 'compact';\n  const hangUpButtonProps = usePropsFor(EndCallButton);\n  /* @conditional-compile-remove(end-call-options) */\n  const localeStrings = useLocale().strings;\n\n  /* @conditional-compile-remove(end-call-options) */\n  const endCallDiaglogLabels = useMemo(\n    () => ({\n      confirmButtonLabel: localeStrings.call.endCallConfirmButtonLabel,\n      heading: localeStrings.call.endCallConfirmDialogTitle,\n      text: localeStrings.call.leaveConfirmDialogContent\n    }),\n    [\n      localeStrings.call.endCallConfirmButtonLabel,\n      localeStrings.call.endCallConfirmDialogTitle,\n      localeStrings.call.leaveConfirmDialogContent\n    ]\n  );\n\n  /* @conditional-compile-remove(end-call-options) */\n  const leaveDiaglogLabels = useMemo(\n    () => ({\n      confirmButtonLabel: localeStrings.call.leaveConfirmButtonLabel,\n      heading: localeStrings.call.leaveConfirmDialogTitle,\n      text: localeStrings.call.leaveConfirmDialogContent\n    }),\n    [\n      localeStrings.call.leaveConfirmButtonLabel,\n      localeStrings.call.leaveConfirmDialogContent,\n      localeStrings.call.leaveConfirmDialogTitle\n    ]\n  );\n\n  /* @conditional-compile-remove(end-call-options) */\n  const [dialogLabels, setDialogLabels] = useState(leaveDiaglogLabels);\n\n  /* @conditional-compile-remove(end-call-options) */\n  const { onHangUp } = hangUpButtonProps;\n\n  /* @conditional-compile-remove(end-call-options) */\n  const [showHangUpConfirm, setShowHangUpConfirm] = React.useState(false);\n\n  /* @conditional-compile-remove(end-call-options) */\n  const toggleConfirm = useCallback(() => {\n    setShowHangUpConfirm(!showHangUpConfirm);\n  }, [showHangUpConfirm]);\n\n  /* @conditional-compile-remove(end-call-options) */\n  const onHangUpConfirm = useCallback(\n    (hangUpForEveryone?: boolean) => {\n      onHangUp && onHangUp(hangUpForEveryone);\n      toggleConfirm();\n    },\n    [onHangUp, toggleConfirm]\n  );\n\n  /* @conditional-compile-remove(end-call-options) */\n  const hangUpOverride = useCallback(\n    async (forEveryone?: boolean) => {\n      if (\n        props.mobileView ||\n        forEveryone === false /* value being false(not undefined) because it comes from endCall option */\n      ) {\n        onHangUp();\n        return;\n      }\n      setDialogLabels(forEveryone ? endCallDiaglogLabels : leaveDiaglogLabels);\n      toggleConfirm();\n    },\n    [endCallDiaglogLabels, leaveDiaglogLabels, onHangUp, props.mobileView, toggleConfirm]\n  );\n\n  const styles = useMemo(\n    () =>\n      concatStyleSets(\n        compactMode ? groupCallLeaveButtonCompressedStyle : groupCallLeaveButtonStyle,\n        props.styles ?? {}\n      ),\n    [compactMode, props.styles]\n  );\n\n  /* @conditional-compile-remove(breakout-rooms) */\n  const enableBreakoutRoomMenu = !!props.returnFromBreakoutRoom;\n  /* @conditional-compile-remove(breakout-rooms) */\n  const breakoutRoomMenuProps: IContextualMenuProps = {\n    items: [\n      {\n        key: 'returnToMainMeeting',\n        text: localeStrings.call.returnFromBreakoutRoomButtonLabel,\n        title: localeStrings.call.returnFromBreakoutRoomButtonLabel,\n        onClick: () => {\n          props.returnFromBreakoutRoom?.();\n        }\n      },\n      {\n        key: 'leaveRoomAndMainMeeting',\n        text: localeStrings.call.leaveBreakoutRoomAndMeetingButtonLabel,\n        title: localeStrings.call.leaveBreakoutRoomAndMeetingButtonLabel,\n        onClick: () => onHangUp()\n      }\n    ],\n    styles: props.styles\n  };\n\n  return (\n    <Stack>\n      <EndCallButton\n        data-ui-id=\"call-composite-hangup-button\"\n        {...hangUpButtonProps}\n        /* @conditional-compile-remove(end-call-options) */\n        onHangUp={props.disableEndCallModal ? onHangUp : hangUpOverride}\n        styles={styles}\n        showLabel={!compactMode}\n        /* @conditional-compile-remove(end-call-options) */\n        enableEndCallMenu={props.enableEndCallMenu ?? false}\n        /* @conditional-compile-remove(breakout-rooms) */\n        menuProps={enableBreakoutRoomMenu ? breakoutRoomMenuProps : undefined}\n      />\n      {\n        /* @conditional-compile-remove(end-call-options) */\n        <Prompt\n          {...dialogLabels}\n          styles={{ main: { minWidth: '22.5rem', padding: '1.5rem' } }}\n          cancelButtonLabel={localeStrings.call.hangUpCancelButtonLabel}\n          onConfirm={() => onHangUpConfirm(props.enableEndCallMenu)} // if enableEndCallMenu is true, that means the dialog is triggered by hangUpForEveryone button\n          isOpen={showHangUpConfirm}\n          onCancel={toggleConfirm}\n        />\n      }\n    </Stack>\n  );\n};\n"]}
+{"version":3,"file":"EndCall.js","sourceRoot":"","sources":["../../../../../../../../preprocess-dist/react-composites/src/composites/CallComposite/components/buttons/EndCall.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { concatStyleSets, Stack } from '@fluentui/react';\nimport { IContextualMenuProps } from '@fluentui/react';\nimport { ControlBarButtonStyles, EndCallButton } from '@internal/react-components';\nimport React, { useMemo } from 'react';\nimport { useState, useCallback } from 'react';\nimport { CallControlDisplayType } from '../../../common/types/CommonCallControlOptions';\nimport { usePropsFor } from '../../hooks/usePropsFor';\nimport { groupCallLeaveButtonCompressedStyle, groupCallLeaveButtonStyle } from '../../styles/Buttons.styles';\nimport { Prompt } from '../Prompt';\nimport { useLocale } from '../../../localization';\n\n/** @private */\nexport const EndCall = (props: {\n  displayType?: CallControlDisplayType;\n  styles?: ControlBarButtonStyles;\n  mobileView?: boolean;\n  enableEndCallMenu?: boolean;\n  disableEndCallModal?: boolean;\n  returnFromBreakoutRoom?: () => Promise<void>;\n}): JSX.Element => {\n  const compactMode = props.displayType === 'compact';\n  const hangUpButtonProps = usePropsFor(EndCallButton);\n  const localeStrings = useLocale().strings;\n  const endCallDiaglogLabels = useMemo(() => ({\n    confirmButtonLabel: localeStrings.call.endCallConfirmButtonLabel,\n    heading: localeStrings.call.endCallConfirmDialogTitle,\n    text: localeStrings.call.leaveConfirmDialogContent\n  }), [localeStrings.call.endCallConfirmButtonLabel, localeStrings.call.endCallConfirmDialogTitle, localeStrings.call.leaveConfirmDialogContent]);\n  const leaveDiaglogLabels = useMemo(() => ({\n    confirmButtonLabel: localeStrings.call.leaveConfirmButtonLabel,\n    heading: localeStrings.call.leaveConfirmDialogTitle,\n    text: localeStrings.call.leaveConfirmDialogContent\n  }), [localeStrings.call.leaveConfirmButtonLabel, localeStrings.call.leaveConfirmDialogContent, localeStrings.call.leaveConfirmDialogTitle]);\n  const [dialogLabels, setDialogLabels] = useState(leaveDiaglogLabels);\n  const {\n    onHangUp\n  } = hangUpButtonProps;\n  const [showHangUpConfirm, setShowHangUpConfirm] = React.useState(false);\n  const toggleConfirm = useCallback(() => {\n    setShowHangUpConfirm(!showHangUpConfirm);\n  }, [showHangUpConfirm]);\n  const onHangUpConfirm = useCallback((hangUpForEveryone?: boolean) => {\n    onHangUp && onHangUp(hangUpForEveryone);\n    toggleConfirm();\n  }, [onHangUp, toggleConfirm]);\n  const hangUpOverride = useCallback(async (forEveryone?: boolean) => {\n    if (props.mobileView || forEveryone === false /* value being false(not undefined) because it comes from endCall option */) {\n      onHangUp();\n      return;\n    }\n    setDialogLabels(forEveryone ? endCallDiaglogLabels : leaveDiaglogLabels);\n    toggleConfirm();\n  }, [endCallDiaglogLabels, leaveDiaglogLabels, onHangUp, props.mobileView, toggleConfirm]);\n  const styles = useMemo(() => concatStyleSets(compactMode ? groupCallLeaveButtonCompressedStyle : groupCallLeaveButtonStyle, props.styles ?? {}), [compactMode, props.styles]);\n  const enableBreakoutRoomMenu = !!props.returnFromBreakoutRoom;\n  const breakoutRoomMenuProps: IContextualMenuProps = {\n    items: [{\n      key: 'returnToMainMeeting',\n      text: localeStrings.call.returnFromBreakoutRoomButtonLabel,\n      title: localeStrings.call.returnFromBreakoutRoomButtonLabel,\n      onClick: () => {\n        props.returnFromBreakoutRoom?.();\n      }\n    }, {\n      key: 'leaveRoomAndMainMeeting',\n      text: localeStrings.call.leaveBreakoutRoomAndMeetingButtonLabel,\n      title: localeStrings.call.leaveBreakoutRoomAndMeetingButtonLabel,\n      onClick: () => onHangUp()\n    }],\n    styles: props.styles\n  };\n  return <Stack>\n      <EndCallButton data-ui-id=\"call-composite-hangup-button\" {...hangUpButtonProps} onHangUp={props.disableEndCallModal ? onHangUp : hangUpOverride} styles={styles} showLabel={!compactMode} enableEndCallMenu={props.enableEndCallMenu ?? false} menuProps={enableBreakoutRoomMenu ? breakoutRoomMenuProps : undefined} />\n      {<Prompt {...dialogLabels} styles={{\n      main: {\n        minWidth: '22.5rem',\n        padding: '1.5rem'\n      }\n    }} cancelButtonLabel={localeStrings.call.hangUpCancelButtonLabel} onConfirm={() => onHangUpConfirm(props.enableEndCallMenu)} // if enableEndCallMenu is true, that means the dialog is triggered by hangUpForEveryone button\n    isOpen={showHangUpConfirm} onCancel={toggleConfirm} />}\n    </Stack>;\n};"]}

package/dist/dist-esm/react-composites/src/composites/CallComposite/components/buttons/Microphone.d.ts

@@ -10,8 +10,5 @@ export declare const Microphone: (props: {
     splitButtonsForDeviceSelection?: boolean;
     disabled?: boolean;
     disableTooltip?: boolean;
-    isDeepNoiseSuppressionOn?: boolean;
-    onClickNoiseSuppression?: () => void;
-    showNoiseSuppressionButton?: boolean;
 }) => JSX.Element;
 //# sourceMappingURL=Microphone.d.ts.map

package/dist/dist-esm/react-composites/src/composites/CallComposite/components/buttons/Microphone.js

@@ -30,14 +30,6 @@ export const Microphone = (props) => {
     }
     const styles = useMemo(() => { var _a; return concatButtonBaseStyles((_a = props.styles) !== null && _a !== void 0 ? _a : {}); }, [props.styles]);
     // tab focus on MicrophoneButton on page load
-    return (React.createElement(MicrophoneButton, Object.assign({ "data-ui-id": "call-composite-microphone-button" }, microphoneButtonProps, { 
-        /* @conditional-compile-remove(DNS) */
-        isDeepNoiseSuppressionOn: props.isDeepNoiseSuppressionOn, 
-        /* @conditional-compile-remove(DNS) */
-        onClickNoiseSuppression: props.onClickNoiseSuppression, 
-        /* @conditional-compile-remove(DNS) */
-        showNoiseSuppressionButton: props.showNoiseSuppressionButton, showLabel: props.displayType !== 'compact', disableTooltip: props.disableTooltip, styles: styles, enableDeviceSelectionMenu: props.splitButtonsForDeviceSelection, disabled: microphoneButtonProps.disabled || props.disabled || (isRoomsCall && ((_c = adapter.getState().call) === null || _c === void 0 ? void 0 : _c.role) === 'Unknown'), onRenderOffIcon: unmuteMicCapability && !unmuteMicCapability.isPresent
-            ? () => React.createElement(_HighContrastAwareIcon, { disabled: true, iconName: 'ControlButtonMicProhibited' })
-            : undefined })));
+    return React.createElement(MicrophoneButton, Object.assign({ "data-ui-id": "call-composite-microphone-button" }, microphoneButtonProps, { showLabel: props.displayType !== 'compact', disableTooltip: props.disableTooltip, styles: styles, enableDeviceSelectionMenu: props.splitButtonsForDeviceSelection, disabled: microphoneButtonProps.disabled || props.disabled || isRoomsCall && ((_c = adapter.getState().call) === null || _c === void 0 ? void 0 : _c.role) === 'Unknown', onRenderOffIcon: unmuteMicCapability && !unmuteMicCapability.isPresent ? () => React.createElement(_HighContrastAwareIcon, { disabled: true, iconName: 'ControlButtonMicProhibited' }) : undefined }));
 };
 //# sourceMappingURL=Microphone.js.map

package/dist/dist-esm/react-composites/src/composites/CallComposite/components/buttons/Microphone.js.map

@@ -1 +1 @@
-{"version":3,"file":"Microphone.js","sourceRoot":"","sources":["../../../../../../../../../react-composites/src/composites/CallComposite/components/buttons/Microphone.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAGlC,OAAO,EAA0B,gBAAgB,EAAE,+CAAmC;AAEtF,OAAO,EAAE,sBAAsB,EAAE,+CAAmC;AACpE,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AACtD,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AACtD,OAAO,EAAE,aAAa,EAAE,yBAAyB,EAAE,MAAM,+BAA+B,CAAC;AACzF,OAAO,EAAE,sBAAsB,EAAE,MAAM,6BAA6B,CAAC;AACrE,OAAO,EAAE,UAAU,EAAE,MAAM,mCAAmC,CAAC;AAE/D;;GAEG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,KAY1B,EAAe,EAAE;;IAChB,MAAM,qBAAqB,GAAG,WAAW,CAAC,gBAAgB,CAAC,CAAC;IAC5D,MAAM,UAAU,GAAG,WAAW,CAAC,aAAa,CAAC,CAAC;IAC9C,MAAM,wBAAwB,GAAG,WAAW,CAAC,yBAAyB,CAAC,CAAC;IACxE,MAAM,OAAO,GAAG,UAAU,EAAE,CAAC;IAC7B,MAAM,WAAW,GAAG,OAAO,CAAC,QAAQ,EAAE,CAAC,WAAW,CAAC;IAEnD,MAAM,mBAAmB,GAAG,MAAA,MAAA,OAAO,CAAC,QAAQ,EAAE,CAAC,IAAI,0CAAE,mBAAmB,0CAAE,YAAY,CAAC,SAAS,CAAC;IAEjG;;;OAGG;IACH,IAAI,UAAU,KAAK,YAAY,EAAE,CAAC;QAChC,+FAA+F;QAC/F,mDAAmD;QACnD,qBAAqB,CAAC,OAAO,GAAG,wBAAwB,CAAC;IAC3D,CAAC;IACD,MAAM,MAAM,GAAG,OAAO,CAAC,GAAG,EAAE,WAAC,OAAA,sBAAsB,CAAC,MAAA,KAAK,CAAC,MAAM,mCAAI,EAAE,CAAC,CAAA,EAAA,EAAE,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC;IACzF,6CAA6C;IAC7C,OAAO,CACL,oBAAC,gBAAgB,gCACJ,kCAAkC,IACzC,qBAAqB;QACzB,sCAAsC;QACtC,wBAAwB,EAAE,KAAK,CAAC,wBAAwB;QACxD,sCAAsC;QACtC,uBAAuB,EAAE,KAAK,CAAC,uBAAuB;QACtD,sCAAsC;QACtC,0BAA0B,EAAE,KAAK,CAAC,0BAA0B,EAC5D,SAAS,EAAE,KAAK,CAAC,WAAW,KAAK,SAAS,EAC1C,cAAc,EAAE,KAAK,CAAC,cAAc,EACpC,MAAM,EAAE,MAAM,EACd,yBAAyB,EAAE,KAAK,CAAC,8BAA8B,EAC/D,QAAQ,EACN,qBAAqB,CAAC,QAAQ,IAAI,KAAK,CAAC,QAAQ,IAAI,CAAC,WAAW,IAAI,CAAA,MAAA,OAAO,CAAC,QAAQ,EAAE,CAAC,IAAI,0CAAE,IAAI,MAAK,SAAS,CAAC,EAElH,eAAe,EACb,mBAAmB,IAAI,CAAC,mBAAmB,CAAC,SAAS;YACnD,CAAC,CAAC,GAAG,EAAE,CAAC,oBAAC,sBAAsB,IAAC,QAAQ,EAAE,IAAI,EAAE,QAAQ,EAAE,4BAA4B,GAAI;YAC1F,CAAC,CAAC,SAAS,IAEf,CACH,CAAC;AACJ,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { _isInLobbyOrConnecting } from '@internal/calling-component-bindings';\nimport { ControlBarButtonStyles, MicrophoneButton } from '@internal/react-components';\n\nimport { _HighContrastAwareIcon } from '@internal/react-components';\nimport React, { useMemo } from 'react';\nimport { CallControlDisplayType } from '../../../common/types/CommonCallControlOptions';\nimport { usePropsFor } from '../../hooks/usePropsFor';\nimport { useSelector } from '../../hooks/useSelector';\nimport { getCallStatus, getLocalMicrophoneEnabled } from '../../selectors/baseSelectors';\nimport { concatButtonBaseStyles } from '../../styles/Buttons.styles';\nimport { useAdapter } from '../../adapter/CallAdapterProvider';\n\n/**\n * @private\n */\nexport const Microphone = (props: {\n  displayType?: CallControlDisplayType;\n  styles?: ControlBarButtonStyles;\n  splitButtonsForDeviceSelection?: boolean;\n  disabled?: boolean;\n  disableTooltip?: boolean;\n  /* @conditional-compile-remove(DNS) */\n  isDeepNoiseSuppressionOn?: boolean;\n  /* @conditional-compile-remove(DNS) */\n  onClickNoiseSuppression?: () => void;\n  /* @conditional-compile-remove(DNS) */\n  showNoiseSuppressionButton?: boolean;\n}): JSX.Element => {\n  const microphoneButtonProps = usePropsFor(MicrophoneButton);\n  const callStatus = useSelector(getCallStatus);\n  const isLocalMicrophoneEnabled = useSelector(getLocalMicrophoneEnabled);\n  const adapter = useAdapter();\n  const isRoomsCall = adapter.getState().isRoomsCall;\n\n  const unmuteMicCapability = adapter.getState().call?.capabilitiesFeature?.capabilities.unmuteMic;\n\n  /**\n   * When call is in connecting state, microphone button should be disabled.\n   * This is due to to headless limitation where a call can not be muted/unmuted in lobby.\n   */\n  if (callStatus === 'Connecting') {\n    // Lobby page should show the microphone status that was set on the local preview/configuration\n    // page until the user successfully joins the call.\n    microphoneButtonProps.checked = isLocalMicrophoneEnabled;\n  }\n  const styles = useMemo(() => concatButtonBaseStyles(props.styles ?? {}), [props.styles]);\n  // tab focus on MicrophoneButton on page load\n  return (\n    <MicrophoneButton\n      data-ui-id=\"call-composite-microphone-button\"\n      {...microphoneButtonProps}\n      /* @conditional-compile-remove(DNS) */\n      isDeepNoiseSuppressionOn={props.isDeepNoiseSuppressionOn}\n      /* @conditional-compile-remove(DNS) */\n      onClickNoiseSuppression={props.onClickNoiseSuppression}\n      /* @conditional-compile-remove(DNS) */\n      showNoiseSuppressionButton={props.showNoiseSuppressionButton}\n      showLabel={props.displayType !== 'compact'}\n      disableTooltip={props.disableTooltip}\n      styles={styles}\n      enableDeviceSelectionMenu={props.splitButtonsForDeviceSelection}\n      disabled={\n        microphoneButtonProps.disabled || props.disabled || (isRoomsCall && adapter.getState().call?.role === 'Unknown')\n      }\n      onRenderOffIcon={\n        unmuteMicCapability && !unmuteMicCapability.isPresent\n          ? () => <_HighContrastAwareIcon disabled={true} iconName={'ControlButtonMicProhibited'} />\n          : undefined\n      }\n    />\n  );\n};\n"]}
+{"version":3,"file":"Microphone.js","sourceRoot":"","sources":["../../../../../../../../preprocess-dist/react-composites/src/composites/CallComposite/components/buttons/Microphone.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAGlC,OAAO,EAA0B,gBAAgB,EAAE,+CAAmC;AACtF,OAAO,EAAE,sBAAsB,EAAE,+CAAmC;AACpE,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AACtD,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AACtD,OAAO,EAAE,aAAa,EAAE,yBAAyB,EAAE,MAAM,+BAA+B,CAAC;AACzF,OAAO,EAAE,sBAAsB,EAAE,MAAM,6BAA6B,CAAC;AACrE,OAAO,EAAE,UAAU,EAAE,MAAM,mCAAmC,CAAC;AAE/D;;GAEG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,KAM1B,EAAe,EAAE;;IAChB,MAAM,qBAAqB,GAAG,WAAW,CAAC,gBAAgB,CAAC,CAAC;IAC5D,MAAM,UAAU,GAAG,WAAW,CAAC,aAAa,CAAC,CAAC;IAC9C,MAAM,wBAAwB,GAAG,WAAW,CAAC,yBAAyB,CAAC,CAAC;IACxE,MAAM,OAAO,GAAG,UAAU,EAAE,CAAC;IAC7B,MAAM,WAAW,GAAG,OAAO,CAAC,QAAQ,EAAE,CAAC,WAAW,CAAC;IACnD,MAAM,mBAAmB,GAAG,MAAA,MAAA,OAAO,CAAC,QAAQ,EAAE,CAAC,IAAI,0CAAE,mBAAmB,0CAAE,YAAY,CAAC,SAAS,CAAC;IAEjG;;;OAGG;IACH,IAAI,UAAU,KAAK,YAAY,EAAE,CAAC;QAChC,+FAA+F;QAC/F,mDAAmD;QACnD,qBAAqB,CAAC,OAAO,GAAG,wBAAwB,CAAC;IAC3D,CAAC;IACD,MAAM,MAAM,GAAG,OAAO,CAAC,GAAG,EAAE,WAAC,OAAA,sBAAsB,CAAC,MAAA,KAAK,CAAC,MAAM,mCAAI,EAAE,CAAC,CAAA,EAAA,EAAE,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC;IACzF,6CAA6C;IAC7C,OAAO,oBAAC,gBAAgB,gCAAY,kCAAkC,IAAK,qBAAqB,IAAE,SAAS,EAAE,KAAK,CAAC,WAAW,KAAK,SAAS,EAAE,cAAc,EAAE,KAAK,CAAC,cAAc,EAAE,MAAM,EAAE,MAAM,EAAE,yBAAyB,EAAE,KAAK,CAAC,8BAA8B,EAAE,QAAQ,EAAE,qBAAqB,CAAC,QAAQ,IAAI,KAAK,CAAC,QAAQ,IAAI,WAAW,IAAI,CAAA,MAAA,OAAO,CAAC,QAAQ,EAAE,CAAC,IAAI,0CAAE,IAAI,MAAK,SAAS,EAAE,eAAe,EAAE,mBAAmB,IAAI,CAAC,mBAAmB,CAAC,SAAS,CAAC,CAAC,CAAC,GAAG,EAAE,CAAC,oBAAC,sBAAsB,IAAC,QAAQ,EAAE,IAAI,EAAE,QAAQ,EAAE,4BAA4B,GAAI,CAAC,CAAC,CAAC,SAAS,IAAI,CAAC;AACnjB,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { _isInLobbyOrConnecting } from '@internal/calling-component-bindings';\nimport { ControlBarButtonStyles, MicrophoneButton } from '@internal/react-components';\nimport { _HighContrastAwareIcon } from '@internal/react-components';\nimport React, { useMemo } from 'react';\nimport { CallControlDisplayType } from '../../../common/types/CommonCallControlOptions';\nimport { usePropsFor } from '../../hooks/usePropsFor';\nimport { useSelector } from '../../hooks/useSelector';\nimport { getCallStatus, getLocalMicrophoneEnabled } from '../../selectors/baseSelectors';\nimport { concatButtonBaseStyles } from '../../styles/Buttons.styles';\nimport { useAdapter } from '../../adapter/CallAdapterProvider';\n\n/**\n * @private\n */\nexport const Microphone = (props: {\n  displayType?: CallControlDisplayType;\n  styles?: ControlBarButtonStyles;\n  splitButtonsForDeviceSelection?: boolean;\n  disabled?: boolean;\n  disableTooltip?: boolean;\n}): JSX.Element => {\n  const microphoneButtonProps = usePropsFor(MicrophoneButton);\n  const callStatus = useSelector(getCallStatus);\n  const isLocalMicrophoneEnabled = useSelector(getLocalMicrophoneEnabled);\n  const adapter = useAdapter();\n  const isRoomsCall = adapter.getState().isRoomsCall;\n  const unmuteMicCapability = adapter.getState().call?.capabilitiesFeature?.capabilities.unmuteMic;\n\n  /**\n   * When call is in connecting state, microphone button should be disabled.\n   * This is due to to headless limitation where a call can not be muted/unmuted in lobby.\n   */\n  if (callStatus === 'Connecting') {\n    // Lobby page should show the microphone status that was set on the local preview/configuration\n    // page until the user successfully joins the call.\n    microphoneButtonProps.checked = isLocalMicrophoneEnabled;\n  }\n  const styles = useMemo(() => concatButtonBaseStyles(props.styles ?? {}), [props.styles]);\n  // tab focus on MicrophoneButton on page load\n  return <MicrophoneButton data-ui-id=\"call-composite-microphone-button\" {...microphoneButtonProps} showLabel={props.displayType !== 'compact'} disableTooltip={props.disableTooltip} styles={styles} enableDeviceSelectionMenu={props.splitButtonsForDeviceSelection} disabled={microphoneButtonProps.disabled || props.disabled || isRoomsCall && adapter.getState().call?.role === 'Unknown'} onRenderOffIcon={unmuteMicCapability && !unmuteMicCapability.isPresent ? () => <_HighContrastAwareIcon disabled={true} iconName={'ControlButtonMicProhibited'} /> : undefined} />;\n};"]}

package/dist/dist-esm/react-composites/src/composites/CallComposite/components/buttons/Participants.js

@@ -7,11 +7,8 @@ import { concatButtonBaseStyles, participantButtonWithIncreasedTouchTargets } fr
 /** @private */
 export const Participants = (props) => {
     const participantsButtonProps = usePropsFor(ParticipantsButton);
-    const participantsButtonStyles = useMemo(() => {
-        var _a;
-        return concatButtonBaseStyles(props.increaseFlyoutItemSize ? participantButtonWithIncreasedTouchTargets : {}, (_a = props.styles) !== null && _a !== void 0 ? _a : {});
-    }, [props.increaseFlyoutItemSize, props.styles]);
-    return (React.createElement(ParticipantsButton, Object.assign({ "data-ui-id": "call-composite-participants-button" }, participantsButtonProps, { showLabel: props.displayType !== 'compact', callInvitationURL: props.callInvitationURL, onFetchParticipantMenuItems: props.onFetchParticipantMenuItems, disabled: isDisabled(props.option) || props.disabled, styles: participantsButtonStyles, showParticipantOverflowTooltip: !props.isMobile })));
+    const participantsButtonStyles = useMemo(() => { var _a; return concatButtonBaseStyles(props.increaseFlyoutItemSize ? participantButtonWithIncreasedTouchTargets : {}, (_a = props.styles) !== null && _a !== void 0 ? _a : {}); }, [props.increaseFlyoutItemSize, props.styles]);
+    return React.createElement(ParticipantsButton, Object.assign({ "data-ui-id": "call-composite-participants-button" }, participantsButtonProps, { showLabel: props.displayType !== 'compact', callInvitationURL: props.callInvitationURL, onFetchParticipantMenuItems: props.onFetchParticipantMenuItems, disabled: isDisabled(props.option) || props.disabled, styles: participantsButtonStyles, showParticipantOverflowTooltip: !props.isMobile }));
 };
 const isDisabled = (option) => {
     if (option === undefined || option === true || option === false) {

package/dist/dist-esm/react-composites/src/composites/CallComposite/components/buttons/Participants.js.map

@@ -1 +1 @@
-{"version":3,"file":"Participants.js","sourceRoot":"","sources":["../../../../../../../../../react-composites/src/composites/CallComposite/components/buttons/Participants.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAAwD,kBAAkB,EAAE,+CAAmC;AACtH,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AACtD,OAAO,EAAE,sBAAsB,EAAE,0CAA0C,EAAE,MAAM,6BAA6B,CAAC;AAEjH,eAAe;AACf,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,KAU5B,EAAe,EAAE;IAChB,MAAM,uBAAuB,GAAG,WAAW,CAAC,kBAAkB,CAAC,CAAC;IAChE,MAAM,wBAAwB,GAAG,OAAO,CACtC,GAAG,EAAE;;QACH,OAAA,sBAAsB,CACpB,KAAK,CAAC,sBAAsB,CAAC,CAAC,CAAC,0CAA0C,CAAC,CAAC,CAAC,EAAE,EAC9E,MAAA,KAAK,CAAC,MAAM,mCAAI,EAAE,CACnB,CAAA;KAAA,EACH,CAAC,KAAK,CAAC,sBAAsB,EAAE,KAAK,CAAC,MAAM,CAAC,CAC7C,CAAC;IACF,OAAO,CACL,oBAAC,kBAAkB,gCACN,oCAAoC,IAC3C,uBAAuB,IAC3B,SAAS,EAAE,KAAK,CAAC,WAAW,KAAK,SAAS,EAC1C,iBAAiB,EAAE,KAAK,CAAC,iBAAiB,EAC1C,2BAA2B,EAAE,KAAK,CAAC,2BAA2B,EAC9D,QAAQ,EAAE,UAAU,CAAC,KAAK,CAAC,MAAM,CAAC,IAAI,KAAK,CAAC,QAAQ,EACpD,MAAM,EAAE,wBAAwB,EAChC,8BAA8B,EAAE,CAAC,KAAK,CAAC,QAAQ,IAC/C,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,UAAU,GAAG,CAAC,MAAwC,EAAW,EAAE;IACvE,IAAI,MAAM,KAAK,SAAS,IAAI,MAAM,KAAK,IAAI,IAAI,MAAM,KAAK,KAAK,EAAE,CAAC;QAChE,OAAO,KAAK,CAAC;IACf,CAAC;IACD,OAAO,MAAM,CAAC,QAAQ,CAAC;AACzB,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { ControlBarButtonStyles, ParticipantMenuItemsCallback, ParticipantsButton } from '@internal/react-components';\nimport React, { useMemo } from 'react';\nimport { CallControlDisplayType } from '../../../common/types/CommonCallControlOptions';\nimport { usePropsFor } from '../../hooks/usePropsFor';\nimport { concatButtonBaseStyles, participantButtonWithIncreasedTouchTargets } from '../../styles/Buttons.styles';\n\n/** @private */\nexport const Participants = (props: {\n  // The value of `CallControlOptions.participantsButton`.\n  option?: boolean | { disabled: boolean };\n  callInvitationURL?: string;\n  onFetchParticipantMenuItems?: ParticipantMenuItemsCallback;\n  displayType?: CallControlDisplayType;\n  increaseFlyoutItemSize?: boolean;\n  styles?: ControlBarButtonStyles;\n  isMobile?: boolean;\n  disabled?: boolean;\n}): JSX.Element => {\n  const participantsButtonProps = usePropsFor(ParticipantsButton);\n  const participantsButtonStyles = useMemo(\n    () =>\n      concatButtonBaseStyles(\n        props.increaseFlyoutItemSize ? participantButtonWithIncreasedTouchTargets : {},\n        props.styles ?? {}\n      ),\n    [props.increaseFlyoutItemSize, props.styles]\n  );\n  return (\n    <ParticipantsButton\n      data-ui-id=\"call-composite-participants-button\"\n      {...participantsButtonProps}\n      showLabel={props.displayType !== 'compact'}\n      callInvitationURL={props.callInvitationURL}\n      onFetchParticipantMenuItems={props.onFetchParticipantMenuItems}\n      disabled={isDisabled(props.option) || props.disabled}\n      styles={participantsButtonStyles}\n      showParticipantOverflowTooltip={!props.isMobile}\n    />\n  );\n};\n\nconst isDisabled = (option?: boolean | { disabled: boolean }): boolean => {\n  if (option === undefined || option === true || option === false) {\n    return false;\n  }\n  return option.disabled;\n};\n"]}
+{"version":3,"file":"Participants.js","sourceRoot":"","sources":["../../../../../../../../preprocess-dist/react-composites/src/composites/CallComposite/components/buttons/Participants.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAAwD,kBAAkB,EAAE,+CAAmC;AACtH,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AACtD,OAAO,EAAE,sBAAsB,EAAE,0CAA0C,EAAE,MAAM,6BAA6B,CAAC;AAEjH,eAAe;AACf,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,KAY5B,EAAe,EAAE;IAChB,MAAM,uBAAuB,GAAG,WAAW,CAAC,kBAAkB,CAAC,CAAC;IAChE,MAAM,wBAAwB,GAAG,OAAO,CAAC,GAAG,EAAE,WAAC,OAAA,sBAAsB,CAAC,KAAK,CAAC,sBAAsB,CAAC,CAAC,CAAC,0CAA0C,CAAC,CAAC,CAAC,EAAE,EAAE,MAAA,KAAK,CAAC,MAAM,mCAAI,EAAE,CAAC,CAAA,EAAA,EAAE,CAAC,KAAK,CAAC,sBAAsB,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC;IACzN,OAAO,oBAAC,kBAAkB,gCAAY,oCAAoC,IAAK,uBAAuB,IAAE,SAAS,EAAE,KAAK,CAAC,WAAW,KAAK,SAAS,EAAE,iBAAiB,EAAE,KAAK,CAAC,iBAAiB,EAAE,2BAA2B,EAAE,KAAK,CAAC,2BAA2B,EAAE,QAAQ,EAAE,UAAU,CAAC,KAAK,CAAC,MAAM,CAAC,IAAI,KAAK,CAAC,QAAQ,EAAE,MAAM,EAAE,wBAAwB,EAAE,8BAA8B,EAAE,CAAC,KAAK,CAAC,QAAQ,IAAI,CAAC;AAC9Y,CAAC,CAAC;AACF,MAAM,UAAU,GAAG,CAAC,MAEnB,EAAW,EAAE;IACZ,IAAI,MAAM,KAAK,SAAS,IAAI,MAAM,KAAK,IAAI,IAAI,MAAM,KAAK,KAAK,EAAE,CAAC;QAChE,OAAO,KAAK,CAAC;IACf,CAAC;IACD,OAAO,MAAM,CAAC,QAAQ,CAAC;AACzB,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { ControlBarButtonStyles, ParticipantMenuItemsCallback, ParticipantsButton } from '@internal/react-components';\nimport React, { useMemo } from 'react';\nimport { CallControlDisplayType } from '../../../common/types/CommonCallControlOptions';\nimport { usePropsFor } from '../../hooks/usePropsFor';\nimport { concatButtonBaseStyles, participantButtonWithIncreasedTouchTargets } from '../../styles/Buttons.styles';\n\n/** @private */\nexport const Participants = (props: {\n  // The value of `CallControlOptions.participantsButton`.\n  option?: boolean | {\n    disabled: boolean;\n  };\n  callInvitationURL?: string;\n  onFetchParticipantMenuItems?: ParticipantMenuItemsCallback;\n  displayType?: CallControlDisplayType;\n  increaseFlyoutItemSize?: boolean;\n  styles?: ControlBarButtonStyles;\n  isMobile?: boolean;\n  disabled?: boolean;\n}): JSX.Element => {\n  const participantsButtonProps = usePropsFor(ParticipantsButton);\n  const participantsButtonStyles = useMemo(() => concatButtonBaseStyles(props.increaseFlyoutItemSize ? participantButtonWithIncreasedTouchTargets : {}, props.styles ?? {}), [props.increaseFlyoutItemSize, props.styles]);\n  return <ParticipantsButton data-ui-id=\"call-composite-participants-button\" {...participantsButtonProps} showLabel={props.displayType !== 'compact'} callInvitationURL={props.callInvitationURL} onFetchParticipantMenuItems={props.onFetchParticipantMenuItems} disabled={isDisabled(props.option) || props.disabled} styles={participantsButtonStyles} showParticipantOverflowTooltip={!props.isMobile} />;\n};\nconst isDisabled = (option?: boolean | {\n  disabled: boolean;\n}): boolean => {\n  if (option === undefined || option === true || option === false) {\n    return false;\n  }\n  return option.disabled;\n};"]}

package/dist/dist-esm/react-composites/src/composites/CallComposite/components/buttons/People.js

@@ -21,6 +21,6 @@ export const People = (props) => {
             }
         }, (_a = props.styles) !== null && _a !== void 0 ? _a : {}, controlButtonBaseStyle);
     }, [props.styles, theme.palette.neutralLight]);
-    return (React.createElement(ControlBarButton, Object.assign({}, props, { "data-ui-id": "call-composite-participants-button", strings: strings, labelKey: 'peopleButtonLabelKey', 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, { "data-ui-id": "call-composite-participants-button", strings: strings, labelKey: 'peopleButtonLabelKey', onRenderOnIcon: onRenderOnIcon !== null && onRenderOnIcon !== void 0 ? onRenderOnIcon : icon, onRenderOffIcon: onRenderOffIcon !== null && onRenderOffIcon !== void 0 ? onRenderOffIcon : icon, onClick: onClick, styles: styles }));
 };
 //# sourceMappingURL=People.js.map

package/dist/dist-esm/react-composites/src/composites/CallComposite/components/buttons/People.js.map

@@ -1 +1 @@
-{"version":3,"file":"People.js","sourceRoot":"","sources":["../../../../../../../../../react-composites/src/composites/CallComposite/components/buttons/People.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAAE,gBAAgB,EAAiD,QAAQ,EAAE,+CAAmC;AACvH,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAClD,OAAO,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAC1D,OAAO,EAAE,sBAAsB,EAAE,MAAM,6BAA6B,CAAC;AAErE,MAAM,IAAI,GAAG,GAAgB,EAAE,CAAC,oBAAC,iBAAiB,IAAC,QAAQ,EAAE,2BAA2B,GAAI,CAAC;AAE7F;;GAEG;AACH,YAAY;AACZ,MAAM,CAAC,MAAM,MAAM,GAAG,CAAC,KAA4B,EAAe,EAAE;IAClE,MAAM,EAAE,OAAO,EAAE,cAAc,EAAE,eAAe,EAAE,OAAO,EAAE,GAAG,KAAK,CAAC;IAEpE,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IAEzB,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,EAClB,sBAAsB,CACvB,CAAA;KAAA,EACH,CAAC,KAAK,CAAC,MAAM,EAAE,KAAK,CAAC,OAAO,CAAC,YAAY,CAAC,CAC3C,CAAC;IAEF,OAAO,CACL,oBAAC,gBAAgB,oBACX,KAAK,kBACE,oCAAoC,EAC/C,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,OAAO,EAChB,MAAM,EAAE,MAAM,IACd,CACH,CAAC;AACJ,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React, { useMemo } from 'react';\nimport { ControlBarButton, ControlBarButtonProps, ControlBarButtonStyles, useTheme } from '@internal/react-components';\nimport { concatStyleSets } from '@fluentui/react';\nimport { CallCompositeIcon } from '../../../common/icons';\nimport { controlButtonBaseStyle } from '../../styles/Buttons.styles';\n\nconst icon = (): JSX.Element => <CallCompositeIcon iconName={'ControlButtonParticipants'} />;\n\n/**\n * @private\n */\n/** @beta */\nexport const People = (props: ControlBarButtonProps): JSX.Element => {\n  const { strings, onRenderOnIcon, onRenderOffIcon, onClick } = props;\n\n  const theme = useTheme();\n\n  const styles: ControlBarButtonStyles = useMemo(\n    () =>\n      concatStyleSets(\n        {\n          rootChecked: {\n            background: theme.palette.neutralLight\n          }\n        },\n        props.styles ?? {},\n        controlButtonBaseStyle\n      ),\n    [props.styles, theme.palette.neutralLight]\n  );\n\n  return (\n    <ControlBarButton\n      {...props}\n      data-ui-id=\"call-composite-participants-button\"\n      strings={strings}\n      labelKey={'peopleButtonLabelKey'}\n      onRenderOnIcon={onRenderOnIcon ?? icon}\n      onRenderOffIcon={onRenderOffIcon ?? icon}\n      onClick={onClick}\n      styles={styles}\n    />\n  );\n};\n"]}
+{"version":3,"file":"People.js","sourceRoot":"","sources":["../../../../../../../../preprocess-dist/react-composites/src/composites/CallComposite/components/buttons/People.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAAE,gBAAgB,EAAiD,QAAQ,EAAE,+CAAmC;AACvH,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAClD,OAAO,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAC1D,OAAO,EAAE,sBAAsB,EAAE,MAAM,6BAA6B,CAAC;AACrE,MAAM,IAAI,GAAG,GAAgB,EAAE,CAAC,oBAAC,iBAAiB,IAAC,QAAQ,EAAE,2BAA2B,GAAI,CAAC;AAE7F;;GAEG;AACH,YAAY;AACZ,MAAM,CAAC,MAAM,MAAM,GAAG,CAAC,KAA4B,EAAe,EAAE;IAClE,MAAM,EACJ,OAAO,EACP,cAAc,EACd,eAAe,EACf,OAAO,EACR,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,EAAE,sBAAsB,CAAC,CAAA;KAAA,EAAE,CAAC,KAAK,CAAC,MAAM,EAAE,KAAK,CAAC,OAAO,CAAC,YAAY,CAAC,CAAC,CAAC;IAC5F,OAAO,oBAAC,gBAAgB,oBAAK,KAAK,kBAAa,oCAAoC,EAAC,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,OAAO,EAAE,MAAM,EAAE,MAAM,IAAI,CAAC;AACjQ,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React, { useMemo } from 'react';\nimport { ControlBarButton, ControlBarButtonProps, ControlBarButtonStyles, useTheme } from '@internal/react-components';\nimport { concatStyleSets } from '@fluentui/react';\nimport { CallCompositeIcon } from '../../../common/icons';\nimport { controlButtonBaseStyle } from '../../styles/Buttons.styles';\nconst icon = (): JSX.Element => <CallCompositeIcon iconName={'ControlButtonParticipants'} />;\n\n/**\n * @private\n */\n/** @beta */\nexport const People = (props: ControlBarButtonProps): JSX.Element => {\n  const {\n    strings,\n    onRenderOnIcon,\n    onRenderOffIcon,\n    onClick\n  } = props;\n  const theme = useTheme();\n  const styles: ControlBarButtonStyles = useMemo(() => concatStyleSets({\n    rootChecked: {\n      background: theme.palette.neutralLight\n    }\n  }, props.styles ?? {}, controlButtonBaseStyle), [props.styles, theme.palette.neutralLight]);\n  return <ControlBarButton {...props} data-ui-id=\"call-composite-participants-button\" strings={strings} labelKey={'peopleButtonLabelKey'} onRenderOnIcon={onRenderOnIcon ?? icon} onRenderOffIcon={onRenderOffIcon ?? icon} onClick={onClick} styles={styles} />;\n};"]}

package/dist/dist-esm/react-composites/src/composites/CallComposite/components/buttons/RaiseHand.js

@@ -16,7 +16,7 @@ export const RaiseHand = (props) => {
     if (_isInLobbyOrConnecting(callStatus)) {
         raiseHandButtonDisabled = true;
     }
-    return (React.createElement(RaiseHandButton, Object.assign({ "data-ui-id": "call-composite-raisehand-button" }, raiseHandButtonProps, { showLabel: props.displayType !== 'compact', disabled: raiseHandButtonDisabled || props.disabled, styles: styles })));
+    return React.createElement(RaiseHandButton, Object.assign({ "data-ui-id": "call-composite-raisehand-button" }, raiseHandButtonProps, { showLabel: props.displayType !== 'compact', disabled: raiseHandButtonDisabled || props.disabled, styles: styles }));
 };
 const isDisabled = (option) => {
     if (option === undefined || option === true || option === false) {

package/dist/dist-esm/react-composites/src/composites/CallComposite/components/buttons/RaiseHand.js.map

@@ -1 +1 @@
-{"version":3,"file":"RaiseHand.js","sourceRoot":"","sources":["../../../../../../../../../react-composites/src/composites/CallComposite/components/buttons/RaiseHand.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAA0B,eAAe,EAAwB,+CAAmC;AAC3G,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AACtD,OAAO,EAAE,sBAAsB,EAAE,MAAM,6BAA6B,CAAC;AACrE,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AACtD,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAC9D,OAAO,EAAE,sBAAsB,EAAE,yDAA6C;AAE9E,eAAe;AACf,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,KAMzB,EAAe,EAAE;IAChB,MAAM,oBAAoB,GAAG,WAAW,CAAC,eAAe,CAAyB,CAAC;IAClF,MAAM,UAAU,GAAG,WAAW,CAAC,aAAa,CAAC,CAAC;IAC9C,MAAM,MAAM,GAAG,OAAO,CAAC,GAAG,EAAE,WAAC,OAAA,sBAAsB,CAAC,MAAA,KAAK,CAAC,MAAM,mCAAI,EAAE,CAAC,CAAA,EAAA,EAAE,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC;IAEzF,IAAI,uBAAuB,GAAG,UAAU,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;IAEvD,IAAI,sBAAsB,CAAC,UAAU,CAAC,EAAE,CAAC;QACvC,uBAAuB,GAAG,IAAI,CAAC;IACjC,CAAC;IAED,OAAO,CACL,oBAAC,eAAe,gCACH,iCAAiC,IACxC,oBAAoB,IACxB,SAAS,EAAE,KAAK,CAAC,WAAW,KAAK,SAAS,EAC1C,QAAQ,EAAE,uBAAuB,IAAI,KAAK,CAAC,QAAQ,EACnD,MAAM,EAAE,MAAM,IACd,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,UAAU,GAAG,CAAC,MAAwC,EAAW,EAAE;IACvE,IAAI,MAAM,KAAK,SAAS,IAAI,MAAM,KAAK,IAAI,IAAI,MAAM,KAAK,KAAK,EAAE,CAAC;QAChE,OAAO,KAAK,CAAC;IACf,CAAC;IACD,OAAO,MAAM,CAAC,QAAQ,CAAC;AACzB,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { ControlBarButtonStyles, RaiseHandButton, RaiseHandButtonProps } from '@internal/react-components';\nimport React, { useMemo } from 'react';\nimport { CallControlDisplayType } from '../../../common/types/CommonCallControlOptions';\nimport { usePropsFor } from '../../hooks/usePropsFor';\nimport { concatButtonBaseStyles } from '../../styles/Buttons.styles';\nimport { useSelector } from '../../hooks/useSelector';\nimport { getCallStatus } from '../../selectors/baseSelectors';\nimport { _isInLobbyOrConnecting } from '@internal/calling-component-bindings';\n\n/** @private */\nexport const RaiseHand = (props: {\n  // The value of `CallControlOptions.raiseHandButton`.\n  option?: boolean | { disabled: boolean };\n  displayType?: CallControlDisplayType;\n  styles?: ControlBarButtonStyles;\n  disabled?: boolean;\n}): JSX.Element => {\n  const raiseHandButtonProps = usePropsFor(RaiseHandButton) as RaiseHandButtonProps;\n  const callStatus = useSelector(getCallStatus);\n  const styles = useMemo(() => concatButtonBaseStyles(props.styles ?? {}), [props.styles]);\n\n  let raiseHandButtonDisabled = isDisabled(props.option);\n\n  if (_isInLobbyOrConnecting(callStatus)) {\n    raiseHandButtonDisabled = true;\n  }\n\n  return (\n    <RaiseHandButton\n      data-ui-id=\"call-composite-raisehand-button\"\n      {...raiseHandButtonProps}\n      showLabel={props.displayType !== 'compact'}\n      disabled={raiseHandButtonDisabled || props.disabled}\n      styles={styles}\n    />\n  );\n};\n\nconst isDisabled = (option?: boolean | { disabled: boolean }): boolean => {\n  if (option === undefined || option === true || option === false) {\n    return false;\n  }\n  return option.disabled;\n};\n"]}
+{"version":3,"file":"RaiseHand.js","sourceRoot":"","sources":["../../../../../../../../preprocess-dist/react-composites/src/composites/CallComposite/components/buttons/RaiseHand.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAA0B,eAAe,EAAwB,+CAAmC;AAC3G,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AACtD,OAAO,EAAE,sBAAsB,EAAE,MAAM,6BAA6B,CAAC;AACrE,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AACtD,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAC9D,OAAO,EAAE,sBAAsB,EAAE,yDAA6C;AAE9E,eAAe;AACf,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,KAQzB,EAAe,EAAE;IAChB,MAAM,oBAAoB,GAAG,WAAW,CAAC,eAAe,CAAyB,CAAC;IAClF,MAAM,UAAU,GAAG,WAAW,CAAC,aAAa,CAAC,CAAC;IAC9C,MAAM,MAAM,GAAG,OAAO,CAAC,GAAG,EAAE,WAAC,OAAA,sBAAsB,CAAC,MAAA,KAAK,CAAC,MAAM,mCAAI,EAAE,CAAC,CAAA,EAAA,EAAE,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC;IACzF,IAAI,uBAAuB,GAAG,UAAU,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;IACvD,IAAI,sBAAsB,CAAC,UAAU,CAAC,EAAE,CAAC;QACvC,uBAAuB,GAAG,IAAI,CAAC;IACjC,CAAC;IACD,OAAO,oBAAC,eAAe,gCAAY,iCAAiC,IAAK,oBAAoB,IAAE,SAAS,EAAE,KAAK,CAAC,WAAW,KAAK,SAAS,EAAE,QAAQ,EAAE,uBAAuB,IAAI,KAAK,CAAC,QAAQ,EAAE,MAAM,EAAE,MAAM,IAAI,CAAC;AACrN,CAAC,CAAC;AACF,MAAM,UAAU,GAAG,CAAC,MAEnB,EAAW,EAAE;IACZ,IAAI,MAAM,KAAK,SAAS,IAAI,MAAM,KAAK,IAAI,IAAI,MAAM,KAAK,KAAK,EAAE,CAAC;QAChE,OAAO,KAAK,CAAC;IACf,CAAC;IACD,OAAO,MAAM,CAAC,QAAQ,CAAC;AACzB,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { ControlBarButtonStyles, RaiseHandButton, RaiseHandButtonProps } from '@internal/react-components';\nimport React, { useMemo } from 'react';\nimport { CallControlDisplayType } from '../../../common/types/CommonCallControlOptions';\nimport { usePropsFor } from '../../hooks/usePropsFor';\nimport { concatButtonBaseStyles } from '../../styles/Buttons.styles';\nimport { useSelector } from '../../hooks/useSelector';\nimport { getCallStatus } from '../../selectors/baseSelectors';\nimport { _isInLobbyOrConnecting } from '@internal/calling-component-bindings';\n\n/** @private */\nexport const RaiseHand = (props: {\n  // The value of `CallControlOptions.raiseHandButton`.\n  option?: boolean | {\n    disabled: boolean;\n  };\n  displayType?: CallControlDisplayType;\n  styles?: ControlBarButtonStyles;\n  disabled?: boolean;\n}): JSX.Element => {\n  const raiseHandButtonProps = usePropsFor(RaiseHandButton) as RaiseHandButtonProps;\n  const callStatus = useSelector(getCallStatus);\n  const styles = useMemo(() => concatButtonBaseStyles(props.styles ?? {}), [props.styles]);\n  let raiseHandButtonDisabled = isDisabled(props.option);\n  if (_isInLobbyOrConnecting(callStatus)) {\n    raiseHandButtonDisabled = true;\n  }\n  return <RaiseHandButton data-ui-id=\"call-composite-raisehand-button\" {...raiseHandButtonProps} showLabel={props.displayType !== 'compact'} disabled={raiseHandButtonDisabled || props.disabled} styles={styles} />;\n};\nconst isDisabled = (option?: boolean | {\n  disabled: boolean;\n}): boolean => {\n  if (option === undefined || option === true || option === false) {\n    return false;\n  }\n  return option.disabled;\n};"]}

package/dist/dist-esm/react-composites/src/composites/CallComposite/components/buttons/Reaction.js

@@ -9,7 +9,7 @@ export const Reaction = (props) => {
     const reactionButtonProps = usePropsFor(ReactionButton);
     const styles = useMemo(() => { var _a; return concatButtonBaseStyles((_a = props.styles) !== null && _a !== void 0 ? _a : {}); }, [props.styles]);
     const reactionButtonDisabled = isDisabled(props.option) || reactionButtonProps.disabled;
-    return (React.createElement(ReactionButton, Object.assign({ "data-ui-id": "call-composite-reaction-button" }, reactionButtonProps, { showLabel: props.displayType !== 'compact', disabled: reactionButtonDisabled || props.disabled, styles: styles, disableTooltip: props.disableTooltip, persistMenu: true, reactionResources: props.reactionResource })));
+    return React.createElement(ReactionButton, Object.assign({ "data-ui-id": "call-composite-reaction-button" }, reactionButtonProps, { showLabel: props.displayType !== 'compact', disabled: reactionButtonDisabled || props.disabled, styles: styles, disableTooltip: props.disableTooltip, persistMenu: true, reactionResources: props.reactionResource }));
 };
 const isDisabled = (option) => {
     if (option === undefined || option === true || option === false) {

package/dist/dist-esm/react-composites/src/composites/CallComposite/components/buttons/Reaction.js.map

@@ -1 +1 @@
-{"version":3,"file":"Reaction.js","sourceRoot":"","sources":["../../../../../../../../../react-composites/src/composites/CallComposite/components/buttons/Reaction.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAGlC,OAAO,EAA0B,cAAc,EAAuB,+CAAmC;AACzG,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AACtD,OAAO,EAAE,sBAAsB,EAAE,MAAM,6BAA6B,CAAC;AAErE,eAAe;AACf,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,KAQxB,EAAe,EAAE;IAChB,MAAM,mBAAmB,GAAG,WAAW,CAAC,cAAc,CAAmC,CAAC;IAC1F,MAAM,MAAM,GAAG,OAAO,CAAC,GAAG,EAAE,WAAC,OAAA,sBAAsB,CAAC,MAAA,KAAK,CAAC,MAAM,mCAAI,EAAE,CAAC,CAAA,EAAA,EAAE,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC;IAEzF,MAAM,sBAAsB,GAAG,UAAU,CAAC,KAAK,CAAC,MAAM,CAAC,IAAI,mBAAmB,CAAC,QAAQ,CAAC;IAExF,OAAO,CACL,oBAAC,cAAc,gCACF,gCAAgC,IACvC,mBAAmB,IACvB,SAAS,EAAE,KAAK,CAAC,WAAW,KAAK,SAAS,EAC1C,QAAQ,EAAE,sBAAsB,IAAI,KAAK,CAAC,QAAQ,EAClD,MAAM,EAAE,MAAM,EACd,cAAc,EAAE,KAAK,CAAC,cAAc,EACpC,WAAW,EAAE,IAAI,EACjB,iBAAiB,EAAE,KAAK,CAAC,gBAAgB,IACzC,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,UAAU,GAAG,CAAC,MAAwC,EAAW,EAAE;IACvE,IAAI,MAAM,KAAK,SAAS,IAAI,MAAM,KAAK,IAAI,IAAI,MAAM,KAAK,KAAK,EAAE,CAAC;QAChE,OAAO,KAAK,CAAC;IACf,CAAC;IACD,OAAO,MAAM,CAAC,QAAQ,CAAC;AACzB,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { ReactionResources } from '@internal/react-components';\nimport { ControlBarButtonStyles, ReactionButton, ReactionButtonProps } from '@internal/react-components';\nimport React, { useMemo } from 'react';\nimport { CallControlDisplayType } from '../../../common/types/CommonCallControlOptions';\nimport { usePropsFor } from '../../hooks/usePropsFor';\nimport { concatButtonBaseStyles } from '../../styles/Buttons.styles';\n\n/** @private */\nexport const Reaction = (props: {\n  // The value of `CallControlOptions.reactionButton`.\n  reactionResource: ReactionResources;\n  option?: boolean | { disabled: boolean };\n  displayType?: CallControlDisplayType;\n  styles?: ControlBarButtonStyles;\n  disabled?: boolean;\n  disableTooltip?: boolean;\n}): JSX.Element => {\n  const reactionButtonProps = usePropsFor(ReactionButton) as unknown as ReactionButtonProps;\n  const styles = useMemo(() => concatButtonBaseStyles(props.styles ?? {}), [props.styles]);\n\n  const reactionButtonDisabled = isDisabled(props.option) || reactionButtonProps.disabled;\n\n  return (\n    <ReactionButton\n      data-ui-id=\"call-composite-reaction-button\"\n      {...reactionButtonProps}\n      showLabel={props.displayType !== 'compact'}\n      disabled={reactionButtonDisabled || props.disabled}\n      styles={styles}\n      disableTooltip={props.disableTooltip}\n      persistMenu={true}\n      reactionResources={props.reactionResource}\n    />\n  );\n};\n\nconst isDisabled = (option?: boolean | { disabled: boolean }): boolean => {\n  if (option === undefined || option === true || option === false) {\n    return false;\n  }\n  return option.disabled;\n};\n"]}
+{"version":3,"file":"Reaction.js","sourceRoot":"","sources":["../../../../../../../../preprocess-dist/react-composites/src/composites/CallComposite/components/buttons/Reaction.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAGlC,OAAO,EAA0B,cAAc,EAAuB,+CAAmC;AACzG,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AACtD,OAAO,EAAE,sBAAsB,EAAE,MAAM,6BAA6B,CAAC;AAErE,eAAe;AACf,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,KAUxB,EAAe,EAAE;IAChB,MAAM,mBAAmB,GAAG,WAAW,CAAC,cAAc,CAAmC,CAAC;IAC1F,MAAM,MAAM,GAAG,OAAO,CAAC,GAAG,EAAE,WAAC,OAAA,sBAAsB,CAAC,MAAA,KAAK,CAAC,MAAM,mCAAI,EAAE,CAAC,CAAA,EAAA,EAAE,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC;IACzF,MAAM,sBAAsB,GAAG,UAAU,CAAC,KAAK,CAAC,MAAM,CAAC,IAAI,mBAAmB,CAAC,QAAQ,CAAC;IACxF,OAAO,oBAAC,cAAc,gCAAY,gCAAgC,IAAK,mBAAmB,IAAE,SAAS,EAAE,KAAK,CAAC,WAAW,KAAK,SAAS,EAAE,QAAQ,EAAE,sBAAsB,IAAI,KAAK,CAAC,QAAQ,EAAE,MAAM,EAAE,MAAM,EAAE,cAAc,EAAE,KAAK,CAAC,cAAc,EAAE,WAAW,EAAE,IAAI,EAAE,iBAAiB,EAAE,KAAK,CAAC,gBAAgB,IAAI,CAAC;AACrT,CAAC,CAAC;AACF,MAAM,UAAU,GAAG,CAAC,MAEnB,EAAW,EAAE;IACZ,IAAI,MAAM,KAAK,SAAS,IAAI,MAAM,KAAK,IAAI,IAAI,MAAM,KAAK,KAAK,EAAE,CAAC;QAChE,OAAO,KAAK,CAAC;IACf,CAAC;IACD,OAAO,MAAM,CAAC,QAAQ,CAAC;AACzB,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { ReactionResources } from '@internal/react-components';\nimport { ControlBarButtonStyles, ReactionButton, ReactionButtonProps } from '@internal/react-components';\nimport React, { useMemo } from 'react';\nimport { CallControlDisplayType } from '../../../common/types/CommonCallControlOptions';\nimport { usePropsFor } from '../../hooks/usePropsFor';\nimport { concatButtonBaseStyles } from '../../styles/Buttons.styles';\n\n/** @private */\nexport const Reaction = (props: {\n  // The value of `CallControlOptions.reactionButton`.\n  reactionResource: ReactionResources;\n  option?: boolean | {\n    disabled: boolean;\n  };\n  displayType?: CallControlDisplayType;\n  styles?: ControlBarButtonStyles;\n  disabled?: boolean;\n  disableTooltip?: boolean;\n}): JSX.Element => {\n  const reactionButtonProps = usePropsFor(ReactionButton) as unknown as ReactionButtonProps;\n  const styles = useMemo(() => concatButtonBaseStyles(props.styles ?? {}), [props.styles]);\n  const reactionButtonDisabled = isDisabled(props.option) || reactionButtonProps.disabled;\n  return <ReactionButton data-ui-id=\"call-composite-reaction-button\" {...reactionButtonProps} showLabel={props.displayType !== 'compact'} disabled={reactionButtonDisabled || props.disabled} styles={styles} disableTooltip={props.disableTooltip} persistMenu={true} reactionResources={props.reactionResource} />;\n};\nconst isDisabled = (option?: boolean | {\n  disabled: boolean;\n}): boolean => {\n  if (option === undefined || option === true || option === false) {\n    return false;\n  }\n  return option.disabled;\n};"]}

package/dist/dist-esm/react-composites/src/composites/CallComposite/components/buttons/ScreenShare.js

@@ -17,7 +17,7 @@ export const ScreenShare = (props) => {
         return (_a = screenShareButtonProps === null || screenShareButtonProps === void 0 ? void 0 : screenShareButtonProps.disabled) !== null && _a !== void 0 ? _a : isDisabled(props.option);
         return isDisabled(props.option);
     };
-    return (React.createElement(ScreenShareButton, Object.assign({ "data-ui-id": "call-composite-screenshare-button" }, screenShareButtonProps, { showLabel: props.displayType !== 'compact', disabled: screenShareButtonDisabled() || props.disabled || (isRoomsCall && ((_a = adapter.getState().call) === null || _a === void 0 ? void 0 : _a.role) === 'Unknown'), styles: styles })));
+    return React.createElement(ScreenShareButton, Object.assign({ "data-ui-id": "call-composite-screenshare-button" }, screenShareButtonProps, { showLabel: props.displayType !== 'compact', disabled: screenShareButtonDisabled() || props.disabled || isRoomsCall && ((_a = adapter.getState().call) === null || _a === void 0 ? void 0 : _a.role) === 'Unknown', styles: styles }));
 };
 const isDisabled = (option) => {
     if (option === undefined || option === true || option === false) {

package/dist/dist-esm/react-composites/src/composites/CallComposite/components/buttons/ScreenShare.js.map

@@ -1 +1 @@
-{"version":3,"file":"ScreenShare.js","sourceRoot":"","sources":["../../../../../../../../../react-composites/src/composites/CallComposite/components/buttons/ScreenShare.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAA0B,iBAAiB,EAAE,+CAAmC;AACvF,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AACtD,OAAO,EAAE,sBAAsB,EAAE,MAAM,6BAA6B,CAAC;AACrE,OAAO,EAAE,UAAU,EAAE,MAAM,mCAAmC,CAAC;AAE/D,eAAe;AACf,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,KAM3B,EAAe,EAAE;;IAChB,MAAM,sBAAsB,GAAG,WAAW,CAAC,iBAAiB,CAAC,CAAC;IAC9D,MAAM,MAAM,GAAG,OAAO,CAAC,GAAG,EAAE,WAAC,OAAA,sBAAsB,CAAC,MAAA,KAAK,CAAC,MAAM,mCAAI,EAAE,CAAC,CAAA,EAAA,EAAE,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC;IACzF,MAAM,OAAO,GAAG,UAAU,EAAE,CAAC;IAC7B,MAAM,WAAW,GAAG,OAAO,CAAC,QAAQ,EAAE,CAAC,WAAW,CAAC;IAEnD,MAAM,yBAAyB,GAAG,GAAY,EAAE;;QAC9C,OAAO,MAAA,sBAAsB,aAAtB,sBAAsB,uBAAtB,sBAAsB,CAAE,QAAQ,mCAAI,UAAU,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;QACpE,OAAO,UAAU,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;IAClC,CAAC,CAAC;IAEF,OAAO,CACL,oBAAC,iBAAiB,gCACL,mCAAmC,IAC1C,sBAAsB,IAC1B,SAAS,EAAE,KAAK,CAAC,WAAW,KAAK,SAAS,EAC1C,QAAQ,EACN,yBAAyB,EAAE,IAAI,KAAK,CAAC,QAAQ,IAAI,CAAC,WAAW,IAAI,CAAA,MAAA,OAAO,CAAC,QAAQ,EAAE,CAAC,IAAI,0CAAE,IAAI,MAAK,SAAS,CAAC,EAE/G,MAAM,EAAE,MAAM,IACd,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,UAAU,GAAG,CAAC,MAAwC,EAAW,EAAE;IACvE,IAAI,MAAM,KAAK,SAAS,IAAI,MAAM,KAAK,IAAI,IAAI,MAAM,KAAK,KAAK,EAAE,CAAC;QAChE,OAAO,KAAK,CAAC;IACf,CAAC;IACD,OAAO,MAAM,CAAC,QAAQ,CAAC;AACzB,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { ControlBarButtonStyles, ScreenShareButton } from '@internal/react-components';\nimport React, { useMemo } from 'react';\nimport { CallControlDisplayType } from '../../../common/types/CommonCallControlOptions';\nimport { usePropsFor } from '../../hooks/usePropsFor';\nimport { concatButtonBaseStyles } from '../../styles/Buttons.styles';\nimport { useAdapter } from '../../adapter/CallAdapterProvider';\n\n/** @private */\nexport const ScreenShare = (props: {\n  // The value of `CallControlOptions.screenShareButton`.\n  option?: boolean | { disabled: boolean };\n  displayType?: CallControlDisplayType;\n  styles?: ControlBarButtonStyles;\n  disabled?: boolean;\n}): JSX.Element => {\n  const screenShareButtonProps = usePropsFor(ScreenShareButton);\n  const styles = useMemo(() => concatButtonBaseStyles(props.styles ?? {}), [props.styles]);\n  const adapter = useAdapter();\n  const isRoomsCall = adapter.getState().isRoomsCall;\n\n  const screenShareButtonDisabled = (): boolean => {\n    return screenShareButtonProps?.disabled ?? isDisabled(props.option);\n    return isDisabled(props.option);\n  };\n\n  return (\n    <ScreenShareButton\n      data-ui-id=\"call-composite-screenshare-button\"\n      {...screenShareButtonProps}\n      showLabel={props.displayType !== 'compact'}\n      disabled={\n        screenShareButtonDisabled() || props.disabled || (isRoomsCall && adapter.getState().call?.role === 'Unknown')\n      }\n      styles={styles}\n    />\n  );\n};\n\nconst isDisabled = (option?: boolean | { disabled: boolean }): boolean => {\n  if (option === undefined || option === true || option === false) {\n    return false;\n  }\n  return option.disabled;\n};\n"]}
+{"version":3,"file":"ScreenShare.js","sourceRoot":"","sources":["../../../../../../../../preprocess-dist/react-composites/src/composites/CallComposite/components/buttons/ScreenShare.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAA0B,iBAAiB,EAAE,+CAAmC;AACvF,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AACtD,OAAO,EAAE,sBAAsB,EAAE,MAAM,6BAA6B,CAAC;AACrE,OAAO,EAAE,UAAU,EAAE,MAAM,mCAAmC,CAAC;AAE/D,eAAe;AACf,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,KAQ3B,EAAe,EAAE;;IAChB,MAAM,sBAAsB,GAAG,WAAW,CAAC,iBAAiB,CAAC,CAAC;IAC9D,MAAM,MAAM,GAAG,OAAO,CAAC,GAAG,EAAE,WAAC,OAAA,sBAAsB,CAAC,MAAA,KAAK,CAAC,MAAM,mCAAI,EAAE,CAAC,CAAA,EAAA,EAAE,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC;IACzF,MAAM,OAAO,GAAG,UAAU,EAAE,CAAC;IAC7B,MAAM,WAAW,GAAG,OAAO,CAAC,QAAQ,EAAE,CAAC,WAAW,CAAC;IACnD,MAAM,yBAAyB,GAAG,GAAY,EAAE;;QAC9C,OAAO,MAAA,sBAAsB,aAAtB,sBAAsB,uBAAtB,sBAAsB,CAAE,QAAQ,mCAAI,UAAU,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;QACpE,OAAO,UAAU,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;IAClC,CAAC,CAAC;IACF,OAAO,oBAAC,iBAAiB,gCAAY,mCAAmC,IAAK,sBAAsB,IAAE,SAAS,EAAE,KAAK,CAAC,WAAW,KAAK,SAAS,EAAE,QAAQ,EAAE,yBAAyB,EAAE,IAAI,KAAK,CAAC,QAAQ,IAAI,WAAW,IAAI,CAAA,MAAA,OAAO,CAAC,QAAQ,EAAE,CAAC,IAAI,0CAAE,IAAI,MAAK,SAAS,EAAE,MAAM,EAAE,MAAM,IAAI,CAAC;AAC7R,CAAC,CAAC;AACF,MAAM,UAAU,GAAG,CAAC,MAEnB,EAAW,EAAE;IACZ,IAAI,MAAM,KAAK,SAAS,IAAI,MAAM,KAAK,IAAI,IAAI,MAAM,KAAK,KAAK,EAAE,CAAC;QAChE,OAAO,KAAK,CAAC;IACf,CAAC;IACD,OAAO,MAAM,CAAC,QAAQ,CAAC;AACzB,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { ControlBarButtonStyles, ScreenShareButton } from '@internal/react-components';\nimport React, { useMemo } from 'react';\nimport { CallControlDisplayType } from '../../../common/types/CommonCallControlOptions';\nimport { usePropsFor } from '../../hooks/usePropsFor';\nimport { concatButtonBaseStyles } from '../../styles/Buttons.styles';\nimport { useAdapter } from '../../adapter/CallAdapterProvider';\n\n/** @private */\nexport const ScreenShare = (props: {\n  // The value of `CallControlOptions.screenShareButton`.\n  option?: boolean | {\n    disabled: boolean;\n  };\n  displayType?: CallControlDisplayType;\n  styles?: ControlBarButtonStyles;\n  disabled?: boolean;\n}): JSX.Element => {\n  const screenShareButtonProps = usePropsFor(ScreenShareButton);\n  const styles = useMemo(() => concatButtonBaseStyles(props.styles ?? {}), [props.styles]);\n  const adapter = useAdapter();\n  const isRoomsCall = adapter.getState().isRoomsCall;\n  const screenShareButtonDisabled = (): boolean => {\n    return screenShareButtonProps?.disabled ?? isDisabled(props.option);\n    return isDisabled(props.option);\n  };\n  return <ScreenShareButton data-ui-id=\"call-composite-screenshare-button\" {...screenShareButtonProps} showLabel={props.displayType !== 'compact'} disabled={screenShareButtonDisabled() || props.disabled || isRoomsCall && adapter.getState().call?.role === 'Unknown'} styles={styles} />;\n};\nconst isDisabled = (option?: boolean | {\n  disabled: boolean;\n}): boolean => {\n  if (option === undefined || option === true || option === false) {\n    return false;\n  }\n  return option.disabled;\n};"]}

package/dist/dist-esm/react-composites/src/composites/CallComposite/hooks/useAdaptedSelector.js

@@ -55,16 +55,18 @@ const memoizeState = memoizeOne((userId, deviceManager, calls, latestErrors, lat
     incomingCallsEnded: {},
     callsEnded: {},
     deviceManager,
-    callAgent: { displayName },
+    callAgent: {
+        displayName
+    },
     calls,
     latestErrors,
-    /* @conditional-compile-remove(breakout-rooms) */
     latestNotifications: latestNotifications !== null && latestNotifications !== void 0 ? latestNotifications : {},
     alternateCallerId,
-    /* @conditional-compile-remove(unsupported-browser) */
     environmentInfo
 }));
-const memoizeCalls = memoizeOne((call) => (call ? { [call.id]: call } : {}));
+const memoizeCalls = memoizeOne((call) => call ? {
+    [call.id]: call
+} : {});
 const adaptCompositeState = (compositeState) => {
     return memoizeState(compositeState.userId, compositeState.devices, memoizeCalls(compositeState.call), 
     // This is an unsafe type expansion.
@@ -80,9 +82,6 @@ const adaptCompositeState = (compositeState) => {
     // that are unknown to the UI component and data binding libraries. Generic handling of the errors (e.g.,
     // just displaying them in some UI surface) will continue to work for these operations. Handling of
     // specific operations (e.g., acting on errors related to permission issues) will ignore these operations.
-    compositeState.latestErrors, undefined ||
-        /* @conditional-compile-remove(breakout-rooms) */ compositeState.latestNotifications, compositeState.displayName, compositeState.alternateCallerId, 
-    /* @conditional-compile-remove(unsupported-browser) */
-    compositeState.environmentInfo);
+    compositeState.latestErrors, undefined || compositeState.latestNotifications, compositeState.displayName, compositeState.alternateCallerId, compositeState.environmentInfo);
 };
 //# sourceMappingURL=useAdaptedSelector.js.map

package/dist/dist-esm/react-composites/src/composites/CallComposite/hooks/useAdaptedSelector.js.map

@@ -1 +1 @@
-{"version":3,"file":"useAdaptedSelector.js","sourceRoot":"","sources":["../../../../../../../../react-composites/src/composites/CallComposite/hooks/useAdaptedSelector.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\n/* eslint-disable @typescript-eslint/no-explicit-any */\n\nimport { useState, useEffect, useRef, useMemo } from 'react';\n\nimport memoizeOne from 'memoize-one';\nimport { useAdapter } from '../adapter/CallAdapterProvider';\nimport { CallAdapterState } from '../adapter/CallAdapter';\nimport { CallErrors, CallState, CallClientState, DeviceManagerState } from '@internal/calling-stateful-client';\nimport { CommunicationIdentifierKind } from '@azure/communication-common';\n/* @conditional-compile-remove(unsupported-browser) */\nimport { EnvironmentInfo } from '@azure/communication-calling';\n/* @conditional-compile-remove(breakout-rooms) */\nimport { CallNotifications } from '@internal/calling-stateful-client';\n/**\n * @private\n */\nexport const useAdaptedSelector = <SelectorT extends (state: CallClientState, props: any) => any>(\n  selector: SelectorT,\n  selectorProps?: Parameters<SelectorT>[1]\n): ReturnType<SelectorT> => {\n  return useSelectorWithAdaptation(selector, adaptCompositeState, selectorProps);\n};\n\n/**\n * @private\n */\nexport const useSelectorWithAdaptation = <\n  SelectorT extends (state: ReturnType<AdaptFuncT>, props: any) => any,\n  AdaptFuncT extends (state: CallAdapterState) => any\n>(\n  selector: SelectorT,\n  adaptState: AdaptFuncT,\n  selectorProps?: Parameters<SelectorT>[1]\n): ReturnType<SelectorT> => {\n  const adapter = useAdapter();\n\n  // Keeps track of whether the current component is mounted or not. If it has unmounted, make sure we do not modify the\n  // state or it will cause React warnings in the console. https://skype.visualstudio.com/SPOOL/_workitems/edit/2453212\n  const mounted = useRef(false);\n\n  useEffect(() => {\n    mounted.current = true;\n    return () => {\n      mounted.current = false;\n    };\n  });\n\n  const callId = adapter.getState().call?.id;\n  const callConfigProps = useMemo(\n    () => ({\n      callId\n    }),\n    [callId]\n  );\n\n  const [props, setProps] = useState(selector(adaptState(adapter.getState()), selectorProps ?? callConfigProps));\n  const propRef = useRef(props);\n  propRef.current = props;\n\n  useEffect(() => {\n    const onStateChange = (state: CallAdapterState): void => {\n      if (!mounted.current) {\n        return;\n      }\n      const newProps = selector(adaptState(state), selectorProps ?? callConfigProps);\n      if (propRef.current !== newProps) {\n        setProps(newProps);\n      }\n    };\n    adapter.onStateChange(onStateChange);\n    return () => {\n      adapter.offStateChange(onStateChange);\n    };\n  }, [adaptState, adapter, selector, selectorProps, callConfigProps]);\n  return props;\n};\n\nconst memoizeState = memoizeOne(\n  (\n    userId: CommunicationIdentifierKind,\n    deviceManager: DeviceManagerState,\n    calls: { [key: string]: CallState },\n    latestErrors: CallErrors,\n    latestNotifications?: undefined | /* @conditional-compile-remove(breakout-rooms) */ CallNotifications,\n    displayName?: string,\n    alternateCallerId?: string,\n    environmentInfo?: undefined | /* @conditional-compile-remove(unsupported-browser) */ EnvironmentInfo\n  ): CallClientState => ({\n    userId,\n    incomingCalls: {},\n    incomingCallsEnded: {},\n    callsEnded: {},\n    deviceManager,\n    callAgent: { displayName },\n    calls,\n    latestErrors,\n    /* @conditional-compile-remove(breakout-rooms) */\n    latestNotifications: latestNotifications ?? ({} as CallNotifications),\n    alternateCallerId,\n    /* @conditional-compile-remove(unsupported-browser) */\n    environmentInfo\n  })\n);\n\nconst memoizeCalls = memoizeOne((call?: CallState): { [key: string]: CallState } => (call ? { [call.id]: call } : {}));\n\nconst adaptCompositeState = (compositeState: CallAdapterState): CallClientState => {\n  return memoizeState(\n    compositeState.userId,\n    compositeState.devices,\n    memoizeCalls(compositeState.call),\n    // This is an unsafe type expansion.\n    // compositeState.latestErrors can contain properties that are not valid in CallErrors.\n    //\n    // But there is no way to check for valid property names at runtime:\n    // - The set of valid property names is built from types in the @azure/communication-calling.\n    //   Thus we don't have a literal array of allowed strings at runtime.\n    // - Due to minification / uglification, the property names from the objects at runtime can't be used\n    //   to compare against permissible values inferred from the types.\n    //\n    // This is not a huge problem -- it simply means that our adapted selector will include some extra operations\n    // that are unknown to the UI component and data binding libraries. Generic handling of the errors (e.g.,\n    // just displaying them in some UI surface) will continue to work for these operations. Handling of\n    // specific operations (e.g., acting on errors related to permission issues) will ignore these operations.\n    compositeState.latestErrors as CallErrors,\n    undefined ||\n      /* @conditional-compile-remove(breakout-rooms) */ (compositeState.latestNotifications as CallNotifications),\n    compositeState.displayName,\n    compositeState.alternateCallerId,\n    /* @conditional-compile-remove(unsupported-browser) */\n    compositeState.environmentInfo\n  );\n};\n"]}
+{"version":3,"file":"useAdaptedSelector.js","sourceRoot":"","sources":["../../../../../../../preprocess-dist/react-composites/src/composites/CallComposite/hooks/useAdaptedSelector.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\n/* eslint-disable @typescript-eslint/no-explicit-any */\n\nimport { useState, useEffect, useRef, useMemo } from 'react';\nimport memoizeOne from 'memoize-one';\nimport { useAdapter } from '../adapter/CallAdapterProvider';\nimport { CallAdapterState } from '../adapter/CallAdapter';\nimport { CallErrors, CallState, CallClientState, DeviceManagerState } from '@internal/calling-stateful-client';\nimport { CommunicationIdentifierKind } from '@azure/communication-common';\nimport { EnvironmentInfo } from '@azure/communication-calling';\nimport { CallNotifications } from '@internal/calling-stateful-client';\n/**\n * @private\n */\nexport const useAdaptedSelector = <SelectorT extends (state: CallClientState, props: any) => any,>(selector: SelectorT, selectorProps?: Parameters<SelectorT>[1]): ReturnType<SelectorT> => {\n  return useSelectorWithAdaptation(selector, adaptCompositeState, selectorProps);\n};\n\n/**\n * @private\n */\nexport const useSelectorWithAdaptation = <SelectorT extends (state: ReturnType<AdaptFuncT>, props: any) => any, AdaptFuncT extends (state: CallAdapterState) => any>(selector: SelectorT, adaptState: AdaptFuncT, selectorProps?: Parameters<SelectorT>[1]): ReturnType<SelectorT> => {\n  const adapter = useAdapter();\n\n  // Keeps track of whether the current component is mounted or not. If it has unmounted, make sure we do not modify the\n  // state or it will cause React warnings in the console. https://skype.visualstudio.com/SPOOL/_workitems/edit/2453212\n  const mounted = useRef(false);\n  useEffect(() => {\n    mounted.current = true;\n    return () => {\n      mounted.current = false;\n    };\n  });\n  const callId = adapter.getState().call?.id;\n  const callConfigProps = useMemo(() => ({\n    callId\n  }), [callId]);\n  const [props, setProps] = useState(selector(adaptState(adapter.getState()), selectorProps ?? callConfigProps));\n  const propRef = useRef(props);\n  propRef.current = props;\n  useEffect(() => {\n    const onStateChange = (state: CallAdapterState): void => {\n      if (!mounted.current) {\n        return;\n      }\n      const newProps = selector(adaptState(state), selectorProps ?? callConfigProps);\n      if (propRef.current !== newProps) {\n        setProps(newProps);\n      }\n    };\n    adapter.onStateChange(onStateChange);\n    return () => {\n      adapter.offStateChange(onStateChange);\n    };\n  }, [adaptState, adapter, selector, selectorProps, callConfigProps]);\n  return props;\n};\nconst memoizeState = memoizeOne((userId: CommunicationIdentifierKind, deviceManager: DeviceManagerState, calls: {\n  [key: string]: CallState;\n}, latestErrors: CallErrors, latestNotifications?: undefined | CallNotifications, displayName?: string, alternateCallerId?: string, environmentInfo?: undefined | EnvironmentInfo): CallClientState => ({\n  userId,\n  incomingCalls: {},\n  incomingCallsEnded: {},\n  callsEnded: {},\n  deviceManager,\n  callAgent: {\n    displayName\n  },\n  calls,\n  latestErrors,\n  latestNotifications: latestNotifications ?? {} as CallNotifications,\n  alternateCallerId,\n  environmentInfo\n}));\nconst memoizeCalls = memoizeOne((call?: CallState): {\n  [key: string]: CallState;\n} => call ? {\n  [call.id]: call\n} : {});\nconst adaptCompositeState = (compositeState: CallAdapterState): CallClientState => {\n  return memoizeState(compositeState.userId, compositeState.devices, memoizeCalls(compositeState.call),\n  // This is an unsafe type expansion.\n  // compositeState.latestErrors can contain properties that are not valid in CallErrors.\n  //\n  // But there is no way to check for valid property names at runtime:\n  // - The set of valid property names is built from types in the @azure/communication-calling.\n  //   Thus we don't have a literal array of allowed strings at runtime.\n  // - Due to minification / uglification, the property names from the objects at runtime can't be used\n  //   to compare against permissible values inferred from the types.\n  //\n  // This is not a huge problem -- it simply means that our adapted selector will include some extra operations\n  // that are unknown to the UI component and data binding libraries. Generic handling of the errors (e.g.,\n  // just displaying them in some UI surface) will continue to work for these operations. Handling of\n  // specific operations (e.g., acting on errors related to permission issues) will ignore these operations.\n  compositeState.latestErrors as CallErrors, undefined || (compositeState.latestNotifications as CallNotifications), compositeState.displayName, compositeState.alternateCallerId, compositeState.environmentInfo);\n};"]}

package/dist/dist-esm/react-composites/src/composites/CallComposite/hooks/useCompositeStringsForNotificationStack.js

@@ -1,19 +1,12 @@
-// Copyright (c) Microsoft Corporation.
-// Licensed under the MIT License.
-/* @conditional-compile-remove(breakout-rooms) */
 import { useSelector } from './useSelector';
-/* @conditional-compile-remove(breakout-rooms) */
 import { getBreakoutRoomDisplayName } from '../selectors/baseSelectors';
-/* @conditional-compile-remove(breakout-rooms) */
 /**
  * @private
  */
 export const useCompositeStringsForNotificationStackStrings = (locale) => {
     const breakoutRoomDisplayName = useSelector(getBreakoutRoomDisplayName);
     const notificationStackStrings = locale.component.strings.notificationStack;
-    if (notificationStackStrings.breakoutRoomJoined &&
-        locale.strings.call.breakoutRoomJoinedNotificationTitle &&
-        breakoutRoomDisplayName) {
+    if (notificationStackStrings.breakoutRoomJoined && locale.strings.call.breakoutRoomJoinedNotificationTitle && breakoutRoomDisplayName) {
         notificationStackStrings.breakoutRoomJoined.title = locale.strings.call.breakoutRoomJoinedNotificationTitle.replace('{roomName}', breakoutRoomDisplayName);
     }
     return notificationStackStrings;

package/dist/dist-esm/react-composites/src/composites/CallComposite/hooks/useCompositeStringsForNotificationStack.js.map

@@ -1 +1 @@
-{"version":3,"file":"useCompositeStringsForNotificationStack.js","sourceRoot":"","sources":["../../../../../../../../react-composites/src/composites/CallComposite/hooks/useCompositeStringsForNotificationStack.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAIlC,iDAAiD;AACjD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAG5C,iDAAiD;AACjD,OAAO,EAAE,0BAA0B,EAAE,MAAM,4BAA4B,CAAC;AAExE,iDAAiD;AACjD;;GAEG;AACH,MAAM,CAAC,MAAM,8CAA8C,GAAG,CAAC,MAAuB,EAA4B,EAAE;IAClH,MAAM,uBAAuB,GAAG,WAAW,CAAC,0BAA0B,CAAC,CAAC;IAExE,MAAM,wBAAwB,GAAG,MAAM,CAAC,SAAS,CAAC,OAAO,CAAC,iBAAiB,CAAC;IAE5E,IACE,wBAAwB,CAAC,kBAAkB;QAC3C,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,mCAAmC;QACvD,uBAAuB,EACvB,CAAC;QACD,wBAAwB,CAAC,kBAAkB,CAAC,KAAK,GAAG,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,mCAAmC,CAAC,OAAO,CACjH,YAAY,EACZ,uBAAuB,CACxB,CAAC;IACJ,CAAC;IAED,OAAO,wBAAwB,CAAC;AAClC,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\n/* @conditional-compile-remove(breakout-rooms) */\nimport { NotificationStackStrings } from '@internal/react-components';\n/* @conditional-compile-remove(breakout-rooms) */\nimport { useSelector } from './useSelector';\n/* @conditional-compile-remove(breakout-rooms) */\nimport { CompositeLocale } from '../../localization';\n/* @conditional-compile-remove(breakout-rooms) */\nimport { getBreakoutRoomDisplayName } from '../selectors/baseSelectors';\n\n/* @conditional-compile-remove(breakout-rooms) */\n/**\n * @private\n */\nexport const useCompositeStringsForNotificationStackStrings = (locale: CompositeLocale): NotificationStackStrings => {\n  const breakoutRoomDisplayName = useSelector(getBreakoutRoomDisplayName);\n\n  const notificationStackStrings = locale.component.strings.notificationStack;\n\n  if (\n    notificationStackStrings.breakoutRoomJoined &&\n    locale.strings.call.breakoutRoomJoinedNotificationTitle &&\n    breakoutRoomDisplayName\n  ) {\n    notificationStackStrings.breakoutRoomJoined.title = locale.strings.call.breakoutRoomJoinedNotificationTitle.replace(\n      '{roomName}',\n      breakoutRoomDisplayName\n    );\n  }\n\n  return notificationStackStrings;\n};\n"]}
+{"version":3,"file":"useCompositeStringsForNotificationStack.js","sourceRoot":"","sources":["../../../../../../../preprocess-dist/react-composites/src/composites/CallComposite/hooks/useCompositeStringsForNotificationStack.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAE5C,OAAO,EAAE,0BAA0B,EAAE,MAAM,4BAA4B,CAAC;AACxE;;GAEG;AACH,MAAM,CAAC,MAAM,8CAA8C,GAAG,CAAC,MAAuB,EAA4B,EAAE;IAClH,MAAM,uBAAuB,GAAG,WAAW,CAAC,0BAA0B,CAAC,CAAC;IACxE,MAAM,wBAAwB,GAAG,MAAM,CAAC,SAAS,CAAC,OAAO,CAAC,iBAAiB,CAAC;IAC5E,IAAI,wBAAwB,CAAC,kBAAkB,IAAI,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,mCAAmC,IAAI,uBAAuB,EAAE,CAAC;QACtI,wBAAwB,CAAC,kBAAkB,CAAC,KAAK,GAAG,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,mCAAmC,CAAC,OAAO,CAAC,YAAY,EAAE,uBAAuB,CAAC,CAAC;IAC7J,CAAC;IACD,OAAO,wBAAwB,CAAC;AAClC,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\nimport { NotificationStackStrings } from '@internal/react-components';\nimport { useSelector } from './useSelector';\nimport { CompositeLocale } from '../../localization';\nimport { getBreakoutRoomDisplayName } from '../selectors/baseSelectors';\n/**\n * @private\n */\nexport const useCompositeStringsForNotificationStackStrings = (locale: CompositeLocale): NotificationStackStrings => {\n  const breakoutRoomDisplayName = useSelector(getBreakoutRoomDisplayName);\n  const notificationStackStrings = locale.component.strings.notificationStack;\n  if (notificationStackStrings.breakoutRoomJoined && locale.strings.call.breakoutRoomJoinedNotificationTitle && breakoutRoomDisplayName) {\n    notificationStackStrings.breakoutRoomJoined.title = locale.strings.call.breakoutRoomJoinedNotificationTitle.replace('{roomName}', breakoutRoomDisplayName);\n  }\n  return notificationStackStrings;\n};"]}