@azure/communication-react 1.23.0-alpha-202412200016 → 1.23.0-alpha-202412210016

package/dist/dist-cjs/communication-react/{index-O64dqfKP.js → index-C8ch4y0S.js}

@@ -188,7 +188,7 @@ function getDefaultExportFromCjs (x) {
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT License.
 // GENERATED FILE. DO NOT EDIT MANUALLY.
-var telemetryVersion = '1.23.0-alpha-202412200016';
+var telemetryVersion = '1.23.0-alpha-202412210016';
 
 
 var telemetryVersion$1 = /*@__PURE__*/getDefaultExportFromCjs(telemetryVersion);
@@ -528,7 +528,7 @@ const getIdentifier = (state) => toFlatCommunicationIdentifier(state.userId);
  * @private
  */
 const getLatestErrors$1 = (state) => state.latestErrors;
-/* @conditional-compile-remove(breakout-rooms) */
+/* @conditional-compile-remove(breakout-rooms) */ /* @conditional-compile-remove(media-access) */
 /**
  * @private
  */
@@ -1654,7 +1654,7 @@ const createDefaultTeamsCallingHandlers = memoizeOne((callClient, callAgent, dev
  */
 const notificationStackSelector = reselect.createSelector([
     getLatestErrors$1,
-    /* @conditional-compile-remove(breakout-rooms) */ getLatestNotifications,
+    /* @conditional-compile-remove(breakout-rooms) */ /* @conditional-compile-remove(media-access) */ getLatestNotifications,
     getDiagnostics,
     getDeviceManager$1,
     getEnvironmentInfo$1,
@@ -2621,7 +2621,7 @@ let CallContext$2 = class CallContext {
     constructor(userId, maxListeners = 50) {
         this._callIdHistory = new CallIdHistory();
         this._timeOutId = {};
-        /* @conditional-compile-remove(breakout-rooms) */
+        /* @conditional-compile-remove(breakout-rooms) */ /* @conditional-compile-remove(media-access) */
         this._latestCallIdsThatPushedNotifications = {};
         /**
          * Tees direct errors to state.
@@ -2654,7 +2654,7 @@ let CallContext$2 = class CallContext {
             userId: userId,
             environmentInfo: undefined,
             latestErrors: {},
-            /* @conditional-compile-remove(breakout-rooms) */ latestNotifications: {}
+            /* @conditional-compile-remove(breakout-rooms) */ /* @conditional-compile-remove(media-access) */ latestNotifications: {}
         };
         this._emitter = new events.EventEmitter();
         this._emitter.setMaxListeners(maxListeners);
@@ -3719,14 +3719,14 @@ let CallContext$2 = class CallContext {
             draft.latestErrors[target] = error;
         });
     }
-    /* @conditional-compile-remove(breakout-rooms) */
+    /* @conditional-compile-remove(breakout-rooms) */ /* @conditional-compile-remove(media-access) */
     setLatestNotification(callId, notification) {
         this._latestCallIdsThatPushedNotifications[notification.target] = callId;
         this.modifyState((draft) => {
             draft.latestNotifications[notification.target] = notification;
         });
     }
-    /* @conditional-compile-remove(breakout-rooms) */
+    /* @conditional-compile-remove(breakout-rooms) */ /* @conditional-compile-remove(media-access) */
     deleteLatestNotification(callId, notificationTarget) {
         let callIdToPushLatestNotification = this._latestCallIdsThatPushedNotifications[notificationTarget];
         callIdToPushLatestNotification = callIdToPushLatestNotification
@@ -3767,7 +3767,7 @@ let CallContext$2 = class CallContext {
                 return;
             }
             if (meetingMediaAccess) {
-                call.mediaAccess = {
+                call.meetingMediaAccess = {
                     isAudioPermitted: meetingMediaAccess.isAudioPermitted,
                     isVideoPermitted: meetingMediaAccess.isVideoPermitted
                 };
@@ -7851,6 +7851,14 @@ const customNotificationIconName = {
     breakoutRoomJoined: 'NotificationBarBreakoutRoomJoined',
     /* @conditional-compile-remove(breakout-rooms) */
     breakoutRoomClosingSoon: 'NotificationBarBreakoutRoomClosingSoon',
+    /* @conditional-compile-remove(media-access) */
+    capabilityTurnVideoOnPresent: 'ControlButtonCameraOff',
+    /* @conditional-compile-remove(media-access) */
+    capabilityTurnVideoOnAbsent: 'ControlButtonCameraProhibited',
+    /* @conditional-compile-remove(media-access) */
+    capabilityUnmuteMicPresent: 'ControlButtonMicOff',
+    /* @conditional-compile-remove(media-access) */
+    capabilityUnmuteMicAbsent: 'ControlButtonMicProhibited',
     /* @conditional-compile-remove(together-mode) */
     togetherModeStarted: 'NotificationBarTogetherModeIcon',
     /* @conditional-compile-remove(together-mode) */
@@ -8545,6 +8553,14 @@ const DEFAULT_COMPONENT_ICONS = {
     ControlButtonScreenShareStop: React.createElement(reactIcons.ShareScreenStop20Filled, null),
     ControlButtonRaiseHand: React.createElement(ControlButtonRaiseHandIcon, null),
     ControlButtonLowerHand: React.createElement(ControlButtonLowerHandIcon, null),
+    /* @conditional-compile-remove(media-access) */
+    ControlButtonMicProhibited: React.createElement(reactIcons.MicProhibited20Filled, null),
+    /* @conditional-compile-remove(media-access) */
+    ControlButtonMicProhibitedSmall: React.createElement(reactIcons.MicProhibited16Filled, null),
+    /* @conditional-compile-remove(media-access) */
+    ControlButtonCameraProhibited: React.createElement(reactIcons.VideoProhibited20Filled, null),
+    /* @conditional-compile-remove(media-access) */
+    ControlButtonCameraProhibitedSmall: React.createElement(reactIcons.VideoProhibited16Filled, null),
     RaiseHandContextualMenuItem: React.createElement(reactIcons.HandRight20Regular, null),
     LowerHandContextualMenuItem: React.createElement(reactIcons.HandRightOff20Regular, null),
     ReactionButtonIcon: React.createElement(reactIcons.Emoji20Regular, null),
@@ -8608,6 +8624,8 @@ const DEFAULT_COMPONENT_ICONS = {
     SendBoxSend: React.createElement(reactIcons.Send20Regular, null),
     SendBoxSendHovered: React.createElement(reactIcons.Send20Filled, null),
     VideoTileMicOff: React.createElement(reactIcons.MicOff16Filled, null),
+    /* @conditional-compile-remove(media-access) */
+    VideoTileCameraOff: React.createElement(reactIcons.VideoProhibited16Filled, null),
     DialpadBackspace: React.createElement(reactIcons.Backspace20Regular, null),
     /* @conditional-compile-remove(call-readiness) */
     SitePermissionsSparkle: React.createElement(SitePermissionSparkle20Filled, null),
@@ -16119,7 +16137,7 @@ class _ErrorBoundary extends React.Component {
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT License.
 /* @conditional-compile-remove(rich-text-editor) */
-const ChatMessageComponentAsRichTextEditBox = React.lazy(() => Promise.resolve().then(function () { return require('./ChatMessageComponentAsRichTextEditBox-bdhcp77f.js'); }));
+const ChatMessageComponentAsRichTextEditBox = React.lazy(() => Promise.resolve().then(function () { return require('./ChatMessageComponentAsRichTextEditBox-9kQzqcEk.js'); }));
 /**
  * @private
  * Use this function to load RoosterJS dependencies early in the lifecycle.
@@ -16127,7 +16145,7 @@ const ChatMessageComponentAsRichTextEditBox = React.lazy(() => Promise.resolve()
  *
  * @conditional-compile-remove(rich-text-editor)
  */
-const loadChatMessageComponentAsRichTextEditBox = () => Promise.resolve().then(function () { return require('./ChatMessageComponentAsRichTextEditBox-bdhcp77f.js'); });
+const loadChatMessageComponentAsRichTextEditBox = () => Promise.resolve().then(function () { return require('./ChatMessageComponentAsRichTextEditBox-9kQzqcEk.js'); });
 /**
  * @private
  */
@@ -17698,9 +17716,18 @@ const onRenderParticipantDefault = (participant, strings, myUserId, onRenderAvat
     const displayName = formatDisplayName(participant.displayName);
     const callingPalette = theme.callingPalette;
     const isPinned = pinnedParticipants && (pinnedParticipants === null || pinnedParticipants === void 0 ? void 0 : pinnedParticipants.includes(participant.userId));
-    const onRenderIcon = (callingParticipant === null || callingParticipant === void 0 ? void 0 : callingParticipant.isScreenSharing) || (callingParticipant === null || callingParticipant === void 0 ? void 0 : callingParticipant.isMuted) || (callingParticipant === null || callingParticipant === void 0 ? void 0 : callingParticipant.raisedHand) || isPinned
+    const showRenderIconTrampoline = () => {
+        /* @conditional-compile-remove(media-access) */
+        return !!((callingParticipant === null || callingParticipant === void 0 ? void 0 : callingParticipant.isScreenSharing) ||
+            (callingParticipant === null || callingParticipant === void 0 ? void 0 : callingParticipant.isMuted) ||
+            (callingParticipant === null || callingParticipant === void 0 ? void 0 : callingParticipant.raisedHand) ||
+            isPinned ||
+            !((callingParticipant === null || callingParticipant === void 0 ? void 0 : callingParticipant.mediaAccess) ? callingParticipant.mediaAccess.isAudioPermitted : true) ||
+            !((callingParticipant === null || callingParticipant === void 0 ? void 0 : callingParticipant.mediaAccess) ? callingParticipant.mediaAccess.isVideoPermitted : true));
+    };
+    const onRenderIcon = showRenderIconTrampoline()
         ? () => {
-            var _a;
+            var _a, _b;
             return (React.createElement(react.Stack, { horizontal: true, tokens: { childrenGap: '0.5rem' } },
                 callingParticipant.raisedHand && (React.createElement(react.Stack, { horizontal: true, tokens: { childrenGap: '0.2rem' }, style: {
                         alignItems: 'center',
@@ -17713,9 +17740,15 @@ const onRenderParticipantDefault = (participant, strings, myUserId, onRenderAvat
                     React.createElement(react.Stack.Item, null,
                         React.createElement(RaisedHandIcon, null)))),
                 callingParticipant.isScreenSharing && (React.createElement(react.Icon, { iconName: "ParticipantItemScreenShareStart", className: iconStyles$2, ariaLabel: strings.sharingIconLabel })),
-                callingParticipant.isMuted && (React.createElement(react.Icon, { iconName: "ParticipantItemMicOff", className: iconStyles$2, ariaLabel: strings.mutedIconLabel })),
                 callingParticipant.spotlight && React.createElement(react.Icon, { iconName: "ParticipantItemSpotlighted", className: iconStyles$2 }),
-                isPinned && React.createElement(react.Icon, { iconName: "ParticipantItemPinned", className: iconStyles$2 })));
+                isPinned && React.createElement(react.Icon, { iconName: "ParticipantItemPinned", className: iconStyles$2 }),
+                /* @conditional-compile-remove(media-access) */ callingParticipant.mediaAccess &&
+                    !callingParticipant.mediaAccess.isVideoPermitted ? (React.createElement(react.Icon, { iconName: "ControlButtonCameraProhibited", className: iconStyles$2, ariaLabel: strings.mutedIconLabel })) : undefined,
+                /* @conditional-compile-remove(media-access) */ callingParticipant.mediaAccess &&
+                    !((_b = callingParticipant.mediaAccess) === null || _b === void 0 ? void 0 : _b.isAudioPermitted) ? (React.createElement(react.Icon, { iconName: "ControlButtonMicProhibited", className: iconStyles$2, ariaLabel: strings.mutedIconLabel })) : undefined,
+                /* @conditional-compile-remove(media-access) */ (callingParticipant.mediaAccess
+                    ? callingParticipant.mediaAccess.isAudioPermitted
+                    : true) && callingParticipant.isMuted ? (React.createElement(react.Icon, { iconName: "ParticipantItemMicOff", className: iconStyles$2, ariaLabel: strings.mutedIconLabel })) : undefined));
         }
         : () => null;
     const onRenderAvatarWithRaiseHand = (callingParticipant === null || callingParticipant === void 0 ? void 0 : callingParticipant.raisedHand) && onRenderAvatar
@@ -18319,15 +18352,26 @@ const callingComponentLogger = logger.createClientLogger('communication-react:ca
  * @private
  */
 const useVideoStreamLifecycleMaintainer = (props) => {
-    const { isMirrored, isScreenSharingOn, isStreamAvailable, onCreateStreamView, onDisposeStreamView, renderElementExists, scalingMode, streamId } = props;
+    const { isMirrored, isScreenSharingOn, isStreamAvailable, onCreateStreamView, onDisposeStreamView, renderElementExists, scalingMode, streamId, 
+    /* @conditional-compile-remove(media-access) */
+    isVideoPermitted } = props;
     const [videoStreamViewResult, setVideoStreamViewResult] = React.useState();
-    React.useEffect(() => {
+    const createStreamViewTrampoline = React.useCallback((isStreamAvailable, renderElementExists, 
+    /* @conditional-compile-remove(media-access) */ isVideoPermitted) => {
         var _a;
+        /* @conditional-compile-remove(media-access) */
+        if (isVideoPermitted === false) {
+            return;
+        }
         if (isStreamAvailable && !renderElementExists) {
             (_a = onCreateStreamView === null || onCreateStreamView === void 0 ? void 0 : onCreateStreamView({ isMirrored, scalingMode })) === null || _a === void 0 ? void 0 : _a.then((result) => {
                 result && setVideoStreamViewResult(result);
             });
         }
+    }, [isMirrored, onCreateStreamView, scalingMode]);
+    React.useEffect(() => {
+        createStreamViewTrampoline(isStreamAvailable, renderElementExists, 
+        /* @conditional-compile-remove(media-access) */ isVideoPermitted);
         // Always clean up element to make tile up to date and be able to dispose correctly
         return () => {
             if (renderElementExists) {
@@ -18348,12 +18392,10 @@ const useVideoStreamLifecycleMaintainer = (props) => {
         onDisposeStreamView,
         renderElementExists,
         scalingMode,
-        /**
-         * this is here in order to force a re-render when streamId changes
-         *  - this should not happen but to recover for the user we will make sure that we subscribe to the
-         * new stream by forcing a re-render.
-         */
-        streamId
+        streamId,
+        createStreamViewTrampoline,
+        /* @conditional-compile-remove(media-access) */
+        isVideoPermitted
     ]);
     // The execution order for above useEffect is onCreateRemoteStreamView =>(async time gap) RenderElement generated => element disposed => onDisposeRemoteStreamView
     // Element disposed could happen during async time gap, which still cause leaks for unused renderElement.
@@ -18408,12 +18450,21 @@ const useRemoteVideoStreamLifecycleMaintainer = (props) => {
  */
 const useVideoTileContextualMenuProps = (props) => {
     var _a;
-    const { participant, view, strings, isPinned, onPinParticipant, onUnpinParticipant, onUpdateScalingMode, disablePinMenuItem, toggleAnnouncerString, spotlightedParticipantUserIds = [], isSpotlighted, onStartSpotlight, onStopSpotlight, maxParticipantsToSpotlight, myUserId, onMuteParticipant } = props;
+    const { participant, view, strings, isPinned, onPinParticipant, onUnpinParticipant, onUpdateScalingMode, disablePinMenuItem, toggleAnnouncerString, spotlightedParticipantUserIds = [], isSpotlighted, onStartSpotlight, onStopSpotlight, maxParticipantsToSpotlight, myUserId, onMuteParticipant, 
+    /* @conditional-compile-remove(media-access) */
+    onForbidAudio, 
+    /* @conditional-compile-remove(media-access) */
+    onPermitAudio, 
+    /* @conditional-compile-remove(media-access) */
+    onForbidVideo, 
+    /* @conditional-compile-remove(media-access) */
+    onPermitVideo } = props;
     const scalingMode = React.useMemo(() => {
         var _a;
         return (_a = props.participant.videoStream) === null || _a === void 0 ? void 0 : _a.scalingMode;
     }, [(_a = props.participant.videoStream) === null || _a === void 0 ? void 0 : _a.scalingMode]);
     const contextualMenuProps = React.useMemo(() => {
+        var _a, _b;
         const items = [];
         if (onMuteParticipant && (strings === null || strings === void 0 ? void 0 : strings.muteParticipantMenuItemLabel)) {
             items.push({
@@ -18429,6 +18480,68 @@ const useVideoTileContextualMenuProps = (props) => {
                 disabled: participant.isMuted
             });
         }
+        /* @conditional-compile-remove(media-access) */
+        if (participant.canAudioBeForbidden &&
+            participant.mediaAccess &&
+            !participant.mediaAccess.isAudioPermitted &&
+            onPermitAudio) {
+            items.push({
+                key: 'permitAudio',
+                text: strings === null || strings === void 0 ? void 0 : strings.permitAudioTileMenuLabel,
+                iconProps: {
+                    iconName: 'ControlButtonMicOn',
+                    styles: { root: { lineHeight: 0 } }
+                },
+                onClick: () => onPermitAudio([participant.userId]),
+                'data-ui-id': 'audio-tile-permit-audio',
+                ariaLabel: strings === null || strings === void 0 ? void 0 : strings.permitAudioTileMenuLabel
+            });
+        }
+        /* @conditional-compile-remove(media-access) */
+        if (participant.canAudioBeForbidden && ((_a = participant.mediaAccess) === null || _a === void 0 ? void 0 : _a.isAudioPermitted) && onForbidAudio) {
+            items.push({
+                key: 'forbidAudio',
+                text: strings === null || strings === void 0 ? void 0 : strings.forbidAudioTileMenuLabel,
+                iconProps: {
+                    iconName: 'ControlButtonMicProhibited',
+                    styles: { root: { lineHeight: 0 } }
+                },
+                onClick: () => onForbidAudio([participant.userId]),
+                'data-ui-id': 'audio-tile-forbid-audio',
+                ariaLabel: strings === null || strings === void 0 ? void 0 : strings.forbidAudioTileMenuLabel
+            });
+        }
+        /* @conditional-compile-remove(media-access) */
+        if (participant.canVideoBeForbidden &&
+            participant.mediaAccess &&
+            !participant.mediaAccess.isVideoPermitted &&
+            onPermitVideo) {
+            items.push({
+                key: 'permitVideo',
+                text: strings === null || strings === void 0 ? void 0 : strings.permitVideoTileMenuLabel,
+                iconProps: {
+                    iconName: 'ControlButtonCameraOn',
+                    styles: { root: { lineHeight: 0 } }
+                },
+                onClick: () => onPermitVideo([participant.userId]),
+                'data-ui-id': 'video-tile-permit-video',
+                ariaLabel: strings === null || strings === void 0 ? void 0 : strings.permitVideoTileMenuLabel
+            });
+        }
+        /* @conditional-compile-remove(media-access) */
+        if (participant.canVideoBeForbidden && ((_b = participant.mediaAccess) === null || _b === void 0 ? void 0 : _b.isVideoPermitted) && onForbidVideo) {
+            items.push({
+                key: 'forbidVideo',
+                text: strings === null || strings === void 0 ? void 0 : strings.forbidVideoTileMenuLabel,
+                iconProps: {
+                    iconName: 'ControlButtonCameraProhibited',
+                    styles: { root: { lineHeight: 0 } }
+                },
+                onClick: () => onForbidVideo([participant.userId]),
+                'data-ui-id': 'video-tile-forbid-video',
+                ariaLabel: strings === null || strings === void 0 ? void 0 : strings.forbidVideoTileMenuLabel
+            });
+        }
         if (isPinned !== undefined) {
             if (isPinned && onUnpinParticipant && (strings === null || strings === void 0 ? void 0 : strings.unpinParticipantForMe)) {
                 let unpinActionString = undefined;
@@ -18554,25 +18667,39 @@ const useVideoTileContextualMenuProps = (props) => {
         }
         return { items, styles: {}, calloutProps: { preventDismissOnEvent: _preventDismissOnEvent }, shouldFocusOnContainer: false };
     }, [
-        scalingMode,
+        onMuteParticipant,
         strings,
-        view,
-        isPinned,
-        onPinParticipant,
-        onUnpinParticipant,
-        onUpdateScalingMode,
+        participant.isMuted,
         participant.userId,
         participant.displayName,
-        disablePinMenuItem,
-        toggleAnnouncerString,
-        spotlightedParticipantUserIds,
+        isPinned,
         isSpotlighted,
-        onStartSpotlight,
+        scalingMode,
+        onUnpinParticipant,
+        onPinParticipant,
+        toggleAnnouncerString,
+        disablePinMenuItem,
+        myUserId,
         onStopSpotlight,
+        spotlightedParticipantUserIds,
         maxParticipantsToSpotlight,
-        myUserId,
-        onMuteParticipant,
-        participant.isMuted
+        onStartSpotlight,
+        onUpdateScalingMode,
+        view,
+        /* @conditional-compile-remove(media-access) */
+        participant.canAudioBeForbidden,
+        /* @conditional-compile-remove(media-access) */
+        participant.canVideoBeForbidden,
+        /* @conditional-compile-remove(media-access) */
+        participant.mediaAccess,
+        /* @conditional-compile-remove(media-access) */
+        onPermitAudio,
+        /* @conditional-compile-remove(media-access) */
+        onForbidAudio,
+        /* @conditional-compile-remove(media-access) */
+        onPermitVideo,
+        /* @conditional-compile-remove(media-access) */
+        onForbidVideo
     ]);
     return contextualMenuProps;
 };
@@ -18973,7 +19100,9 @@ const VideoTileMoreOptionsButton = (props) => {
  * @public
  */
 const VideoTile = (props) => {
-    const { children, displayName, initialsName, isMirrored, isMuted, isSpotlighted, isPinned, onRenderPlaceholder, renderElement, overlay: reactionOverlay, showLabel = true, showMuteIndicator = true, styles, userId, noVideoAvailableAriaLabel, isSpeaking, raisedHand, personaMinSize = DEFAULT_PERSONA_MIN_SIZE_PX, personaMaxSize = DEFAULT_PERSONA_MAX_SIZE_PX, contextualMenu } = props;
+    const { children, displayName, initialsName, isMirrored, isMuted, isSpotlighted, isPinned, onRenderPlaceholder, renderElement, overlay: reactionOverlay, showLabel = true, showMuteIndicator = true, styles, userId, noVideoAvailableAriaLabel, isSpeaking, raisedHand, personaMinSize = DEFAULT_PERSONA_MIN_SIZE_PX, personaMaxSize = DEFAULT_PERSONA_MAX_SIZE_PX, contextualMenu, 
+    /* @conditional-compile-remove(media-access) */
+    mediaAccess } = props;
     const [isHovered, setIsHovered] = React.useState(false);
     const [isFocused, setIsFocused] = React.useState(false);
     // need to set a default otherwise the resizeObserver will get stuck in an infinite loop.
@@ -19091,8 +19220,9 @@ const VideoTile = (props) => {
                 React.createElement(react.Stack, { horizontal: true, className: tileInfoStyle },
                     canShowLabel && (React.createElement(react.Text, { className: react.mergeStyles(displayNameStyle), title: displayName, style: { color: participantStateString ? theme.palette.neutralSecondary : 'inherit' }, "data-ui-id": "video-tile-display-name" }, displayName)),
                     participantStateString && (React.createElement(react.Text, { className: react.mergeStyles(participantStateStringStyles(theme)) }, bracketedParticipantString(participantStateString, !!canShowLabel))),
-                    showMuteIndicator && isMuted && (React.createElement(react.Stack, { className: react.mergeStyles(iconContainerStyle) },
-                        React.createElement(react.Icon, { iconName: "VideoTileMicOff" }))),
+                    getMediaAccessIconsTrampoline(showMuteIndicator, isMuted, 
+                    /* @conditional-compile-remove(media-access) */
+                    mediaAccess),
                     isSpotlighted && (React.createElement(react.Stack, { className: react.mergeStyles(iconContainerStyle) },
                         React.createElement(react.Icon, { iconName: "VideoTileSpotlighted" }))),
                     isPinned && (React.createElement(react.Stack, { className: react.mergeStyles(iconContainerStyle) },
@@ -19105,6 +19235,16 @@ const VideoTile = (props) => {
                 React.createElement(react.Stack.Item, null,
                     React.createElement(RaisedHandIcon, null)))))));
 };
+const getMediaAccessIconsTrampoline = (showMuteIndicator, isMuted, mediaAccess) => {
+    /* @conditional-compile-remove(media-access) */
+    return (React.createElement(React.Fragment, null,
+        mediaAccess && !(mediaAccess === null || mediaAccess === void 0 ? void 0 : mediaAccess.isVideoPermitted) ? (React.createElement(react.Stack, { className: react.mergeStyles(iconContainerStyle) },
+            React.createElement(react.Icon, { iconName: "ControlButtonCameraProhibitedSmall" }))) : undefined,
+        (mediaAccess ? mediaAccess.isAudioPermitted : true) && showMuteIndicator && isMuted ? (React.createElement(react.Stack, { className: react.mergeStyles(iconContainerStyle) },
+            React.createElement(react.Icon, { iconName: "VideoTileMicOff" }))) : undefined,
+        mediaAccess && !(mediaAccess === null || mediaAccess === void 0 ? void 0 : mediaAccess.isAudioPermitted) && showMuteIndicator ? (React.createElement(react.Stack, { className: react.mergeStyles(iconContainerStyle) },
+            React.createElement(react.Icon, { iconName: "ControlButtonMicProhibitedSmall" }))) : undefined));
+};
 const getParticipantStateString = (props, locale) => {
     const strings = Object.assign(Object.assign({}, locale.strings.videoTile), props.strings);
     return props.participantState === 'EarlyMedia' || props.participantState === 'Ringing'
@@ -19806,7 +19946,15 @@ const MeetingReactionOverlay = (props) => {
 const _RemoteVideoTile = React.memo((props) => {
     var _a, _b;
     const { isAvailable, isReceiving = true, // default to true to prevent any breaking change
-    isScreenSharingOn, onCreateRemoteStreamView, onDisposeRemoteStreamView, remoteVideoViewOptions, renderElement, userId, onRenderAvatar, showMuteIndicator, remoteParticipant, participantState, menuKind, isPinned, onPinParticipant, onUnpinParticipant, spotlightedParticipantUserIds, isSpotlighted, onStartSpotlight, onStopSpotlight, maxParticipantsToSpotlight, onMuteParticipant, onUpdateScalingMode, disablePinMenuItem, toggleAnnouncerString, strings, reactionResources, streamId } = props;
+    isScreenSharingOn, onCreateRemoteStreamView, onDisposeRemoteStreamView, remoteVideoViewOptions, renderElement, userId, onRenderAvatar, showMuteIndicator, remoteParticipant, participantState, menuKind, isPinned, onPinParticipant, onUnpinParticipant, spotlightedParticipantUserIds, isSpotlighted, onStartSpotlight, onStopSpotlight, maxParticipantsToSpotlight, onMuteParticipant, onUpdateScalingMode, disablePinMenuItem, toggleAnnouncerString, strings, reactionResources, streamId, 
+    /* @conditional-compile-remove(media-access) */
+    onForbidAudio, 
+    /* @conditional-compile-remove(media-access) */
+    onPermitAudio, 
+    /* @conditional-compile-remove(media-access) */
+    onForbidVideo, 
+    /* @conditional-compile-remove(media-access) */
+    onPermitVideo } = props;
     const remoteVideoStreamProps = React.useMemo(() => ({
         isMirrored: remoteVideoViewOptions === null || remoteVideoViewOptions === void 0 ? void 0 : remoteVideoViewOptions.isMirrored,
         isScreenSharingOn,
@@ -19817,7 +19965,9 @@ const _RemoteVideoTile = React.memo((props) => {
         remoteParticipantId: userId,
         renderElementExists: !!renderElement,
         scalingMode: remoteVideoViewOptions === null || remoteVideoViewOptions === void 0 ? void 0 : remoteVideoViewOptions.scalingMode,
-        streamId
+        streamId,
+        /* @conditional-compile-remove(media-access) */
+        isVideoPermitted: remoteParticipant.mediaAccess ? remoteParticipant.mediaAccess.isVideoPermitted : true
     }), [
         isAvailable,
         isReceiving,
@@ -19828,7 +19978,9 @@ const _RemoteVideoTile = React.memo((props) => {
         remoteVideoViewOptions === null || remoteVideoViewOptions === void 0 ? void 0 : remoteVideoViewOptions.scalingMode,
         renderElement,
         userId,
-        streamId
+        streamId,
+        /* @conditional-compile-remove(media-access) */
+        remoteParticipant.mediaAccess
     ]);
     // Handle creating, destroying and updating the video stream as necessary
     const createVideoStreamResult = useRemoteVideoStreamLifecycleMaintainer(remoteVideoStreamProps);
@@ -19847,7 +19999,11 @@ const _RemoteVideoTile = React.memo((props) => {
         onStartSpotlight,
         onStopSpotlight,
         maxParticipantsToSpotlight,
-        onMuteParticipant
+        onMuteParticipant,
+        /* @conditional-compile-remove(media-access) */ onForbidAudio,
+        /* @conditional-compile-remove(media-access) */ onPermitAudio,
+        /* @conditional-compile-remove(media-access) */ onForbidVideo,
+        /* @conditional-compile-remove(media-access) */ onPermitVideo
     });
     const videoTileContextualMenuProps = React.useMemo(() => {
         if (menuKind !== 'contextual' || !contextualMenuProps) {
@@ -19892,7 +20048,9 @@ const _RemoteVideoTile = React.memo((props) => {
     return (React.createElement(react.Stack, { tabIndex: menuKind === 'drawer' ? 0 : undefined, onKeyDown: menuKind === 'drawer' ? onKeyDown : undefined, style: remoteVideoTileWrapperStyle },
         React.createElement(VideoTile, Object.assign({ key: userId, userId: userId, initialsName: (_b = formatInitialsName()) !== null && _b !== void 0 ? _b : '', renderElement: renderVideoStreamElement, displayName: displayName, onRenderPlaceholder: onRenderAvatar, isMuted: remoteParticipant.isMuted, raisedHand: remoteParticipant.raisedHand, isSpeaking: remoteParticipant.isSpeaking, showMuteIndicator: showMuteIndicator, personaMinSize: props.personaMinSize, showLabel: props.showLabel, alwaysShowLabelBackground: props.alwaysShowLabelBackground, participantState: participantState }, videoTileContextualMenuProps, { isPinned: props.isPinned, onLongTouch: props.onLongTouch
                 ? props.onLongTouch
-                : () => setDrawerMenuItemProps(convertContextualMenuItemsToDrawerMenuItemProps$1(contextualMenuProps, () => setDrawerMenuItemProps([]))), isSpotlighted: isSpotlighted, overlay: reactionOverlay })),
+                : () => setDrawerMenuItemProps(convertContextualMenuItemsToDrawerMenuItemProps$1(contextualMenuProps, () => setDrawerMenuItemProps([]))), isSpotlighted: isSpotlighted, overlay: reactionOverlay, 
+            /* @conditional-compile-remove(media-access) */
+            mediaAccess: remoteParticipant.mediaAccess })),
         drawerMenuItemProps.length > 0 && (React.createElement(react.Layer, { hostId: props.drawerMenuHostId },
             React.createElement(react.Stack, { styles: drawerMenuWrapperStyles },
                 React.createElement(_DrawerMenu, { onLightDismiss: () => setDrawerMenuItemProps([]), items: drawerMenuItemProps, heading: displayName }))))));
@@ -19997,7 +20155,9 @@ const LocalScreenShare = React.memo((props) => {
         ? locale.strings.videoGallery.displayNamePlaceholder
         : localParticipant === null || localParticipant === void 0 ? void 0 : localParticipant.displayName;
     const loadingMessage = locale.strings.videoGallery.localScreenShareLoadingMessage;
-    return (React.createElement(VideoTile, { displayName: displayName, isMuted: localParticipant === null || localParticipant === void 0 ? void 0 : localParticipant.isMuted, renderElement: renderElement ? (React.createElement(StreamMedia, { videoStreamElement: renderElement, loadingState: isAvailable === false ? 'loading' : 'none' })) : undefined, onRenderPlaceholder: () => React.createElement(LoadingSpinner, { loadingMessage: loadingMessage }) }));
+    return (React.createElement(VideoTile, { displayName: displayName, isMuted: localParticipant === null || localParticipant === void 0 ? void 0 : localParticipant.isMuted, renderElement: renderElement ? (React.createElement(StreamMedia, { videoStreamElement: renderElement, loadingState: isAvailable === false ? 'loading' : 'none' })) : undefined, onRenderPlaceholder: () => React.createElement(LoadingSpinner, { loadingMessage: loadingMessage }), 
+        /* @conditional-compile-remove(media-access) */
+        mediaAccess: localParticipant.mediaAccess }));
 });
 
 // Copyright (c) Microsoft Corporation.
@@ -20102,7 +20262,9 @@ const LocalVideoCameraCycleButton = (props) => {
  * @internal
  */
 const _LocalVideoTile = React.memo((props) => {
-    const { isAvailable, isMuted, onCreateLocalStreamView, onDisposeLocalStreamView, localVideoViewOptions, renderElement, userId, showLabel, alwaysShowLabelBackground, displayName, initialsName, onRenderAvatar, showMuteIndicator, styles, showCameraSwitcherInLocalPreview, localVideoCameraCycleButtonProps, localVideoCameraSwitcherLabel, localVideoSelectedDescription, raisedHand, reaction, isSpotlighted, spotlightedParticipantUserIds, onStartSpotlight, onStopSpotlight, maxParticipantsToSpotlight, menuKind, strings, reactionResources, isScreenSharingOn } = props;
+    const { isAvailable, isMuted, onCreateLocalStreamView, onDisposeLocalStreamView, localVideoViewOptions, renderElement, userId, showLabel, alwaysShowLabelBackground, displayName, initialsName, onRenderAvatar, showMuteIndicator, styles, showCameraSwitcherInLocalPreview, localVideoCameraCycleButtonProps, localVideoCameraSwitcherLabel, localVideoSelectedDescription, raisedHand, reaction, isSpotlighted, spotlightedParticipantUserIds, onStartSpotlight, onStopSpotlight, maxParticipantsToSpotlight, menuKind, strings, reactionResources, isScreenSharingOn, 
+    /* @conditional-compile-remove(media-access) */
+    mediaAccess } = props;
     const theme = useTheme();
     const localVideoStreamProps = React.useMemo(() => ({
         isMirrored: localVideoViewOptions === null || localVideoViewOptions === void 0 ? void 0 : localVideoViewOptions.isMirrored,
@@ -20110,14 +20272,18 @@ const _LocalVideoTile = React.memo((props) => {
         onCreateLocalStreamView,
         onDisposeLocalStreamView,
         renderElementExists: !!renderElement,
-        scalingMode: localVideoViewOptions === null || localVideoViewOptions === void 0 ? void 0 : localVideoViewOptions.scalingMode
+        scalingMode: localVideoViewOptions === null || localVideoViewOptions === void 0 ? void 0 : localVideoViewOptions.scalingMode,
+        /* @conditional-compile-remove(media-access) */
+        isVideoPermitted: mediaAccess ? mediaAccess.isVideoPermitted : true
     }), [
         isAvailable,
         localVideoViewOptions === null || localVideoViewOptions === void 0 ? void 0 : localVideoViewOptions.isMirrored,
         localVideoViewOptions === null || localVideoViewOptions === void 0 ? void 0 : localVideoViewOptions.scalingMode,
         onCreateLocalStreamView,
         onDisposeLocalStreamView,
-        renderElement
+        renderElement,
+        /* @conditional-compile-remove(media-access) */
+        mediaAccess
     ]);
     // Handle creating, destroying and updating the video stream as necessary
     useLocalVideoStreamLifecycleMaintainer(localVideoStreamProps);
@@ -20188,7 +20354,8 @@ const _LocalVideoTile = React.memo((props) => {
             React.createElement(react.Spinner, { label: strings === null || strings === void 0 ? void 0 : strings.waitingScreenText, ariaLive: "assertive", labelPosition: "bottom", role: "alert", styles: loadSpinnerStyles(theme, false) })));
     }, [strings === null || strings === void 0 ? void 0 : strings.waitingScreenText, theme]);
     return (React.createElement(react.Stack, { "data-ui-id": "local-video-tile", className: react.mergeStyles({ width: '100%', height: '100%' }), onKeyDown: menuKind === 'drawer' ? onKeyDown : undefined },
-        React.createElement(VideoTile, Object.assign({ key: userId !== null && userId !== void 0 ? userId : 'local-video-tile', userId: userId, renderElement: renderVideoStreamElement, showLabel: showLabel, alwaysShowLabelBackground: alwaysShowLabelBackground, displayName: displayName, initialsName: initialsName, styles: videoTileStyles, onRenderPlaceholder: props.participantsCount === 1 && !isScreenSharingOn ? onRenderAvatarOneParticipant : onRenderAvatar, isMuted: isMuted, showMuteIndicator: showMuteIndicator, personaMinSize: props.personaMinSize, raisedHand: raisedHand, isSpotlighted: isSpotlighted }, videoTileContextualMenuProps, { onLongTouch: () => setDrawerMenuItemProps(convertContextualMenuItemsToDrawerMenuItemProps(contextualMenuProps, () => setDrawerMenuItemProps([]))), overlay: videoTileOverlay }), drawerMenuItemProps.length > 0 && (React.createElement(react.Layer, { hostId: props.drawerMenuHostId },
+        React.createElement(VideoTile, Object.assign({ key: userId !== null && userId !== void 0 ? userId : 'local-video-tile', userId: userId, renderElement: renderVideoStreamElement, showLabel: showLabel, alwaysShowLabelBackground: alwaysShowLabelBackground, displayName: displayName, initialsName: initialsName, styles: videoTileStyles, onRenderPlaceholder: props.participantsCount === 1 && !isScreenSharingOn ? onRenderAvatarOneParticipant : onRenderAvatar, isMuted: isMuted, showMuteIndicator: showMuteIndicator, personaMinSize: props.personaMinSize, raisedHand: raisedHand, isSpotlighted: isSpotlighted }, videoTileContextualMenuProps, { onLongTouch: () => setDrawerMenuItemProps(convertContextualMenuItemsToDrawerMenuItemProps(contextualMenuProps, () => setDrawerMenuItemProps([]))), overlay: videoTileOverlay, 
+            /* @conditional-compile-remove(media-access) */ mediaAccess: mediaAccess }), drawerMenuItemProps.length > 0 && (React.createElement(react.Layer, { hostId: props.drawerMenuHostId },
             React.createElement(react.Stack, { styles: drawerMenuWrapperStyles },
                 React.createElement(_DrawerMenu, { onLightDismiss: () => setDrawerMenuItemProps([]), items: drawerMenuItemProps })))))));
 });
@@ -22176,7 +22343,15 @@ const MAX_PINNED_REMOTE_VIDEO_TILES$1 = 4;
  */
 const VideoGallery = (props) => {
     var _a, _b, _c, _d;
-    const { localParticipant, remoteParticipants = [], localVideoViewOptions, remoteVideoViewOptions, dominantSpeakers, onRenderLocalVideoTile, onRenderRemoteVideoTile, onCreateLocalStreamView, onDisposeLocalStreamView, onCreateRemoteStreamView, onDisposeRemoteScreenShareStreamView, onDisposeLocalScreenShareStreamView, onDisposeRemoteVideoStreamView, styles, layout, onRenderAvatar, showMuteIndicator, maxRemoteVideoStreams = DEFAULT_MAX_REMOTE_VIDEO_STREAMS, showCameraSwitcherInLocalPreview, localVideoCameraCycleButtonProps, onPinParticipant: onPinParticipantHandler, onUnpinParticipant: onUnpinParticipantHandler, remoteVideoTileMenu = DEFAULT_REMOTE_VIDEO_TILE_MENU_OPTIONS, overflowGalleryPosition = 'horizontalBottom', localVideoTileSize = 'followDeviceOrientation', spotlightedParticipants, onStartLocalSpotlight, onStartRemoteSpotlight, onStopLocalSpotlight, onStopRemoteSpotlight, maxParticipantsToSpotlight, reactionResources, videoTilesOptions, onMuteParticipant } = props;
+    const { localParticipant, remoteParticipants = [], localVideoViewOptions, remoteVideoViewOptions, dominantSpeakers, onRenderLocalVideoTile, onRenderRemoteVideoTile, onCreateLocalStreamView, onDisposeLocalStreamView, onCreateRemoteStreamView, onDisposeRemoteScreenShareStreamView, onDisposeLocalScreenShareStreamView, onDisposeRemoteVideoStreamView, styles, layout, onRenderAvatar, showMuteIndicator, maxRemoteVideoStreams = DEFAULT_MAX_REMOTE_VIDEO_STREAMS, showCameraSwitcherInLocalPreview, localVideoCameraCycleButtonProps, onPinParticipant: onPinParticipantHandler, onUnpinParticipant: onUnpinParticipantHandler, remoteVideoTileMenu = DEFAULT_REMOTE_VIDEO_TILE_MENU_OPTIONS, overflowGalleryPosition = 'horizontalBottom', localVideoTileSize = 'followDeviceOrientation', spotlightedParticipants, onStartLocalSpotlight, onStartRemoteSpotlight, onStopLocalSpotlight, onStopRemoteSpotlight, maxParticipantsToSpotlight, reactionResources, videoTilesOptions, onMuteParticipant, 
+    /* @conditional-compile-remove(media-access) */
+    onForbidAudio, 
+    /* @conditional-compile-remove(media-access) */
+    onPermitAudio, 
+    /* @conditional-compile-remove(media-access) */
+    onForbidVideo, 
+    /* @conditional-compile-remove(media-access) */
+    onPermitVideo } = props;
     const ids = useIdentifiers();
     const theme = useTheme();
     const localeStrings = useLocale$1().strings.videoGallery;
@@ -22234,7 +22409,9 @@ const VideoGallery = (props) => {
             return layout === 'default' ? strings.localVideoLabel : isNarrow ? '' : strings.localVideoLabel;
         };
         return (React.createElement(react.Stack, { styles: localVideoTileContainerStyles, key: "local-video-tile-key" },
-            React.createElement(_LocalVideoTile, { alwaysShowLabelBackground: videoTilesOptions === null || videoTilesOptions === void 0 ? void 0 : videoTilesOptions.alwaysShowLabelBackground, userId: localParticipant.userId, onCreateLocalStreamView: onCreateLocalStreamView, onDisposeLocalStreamView: onDisposeLocalStreamView, isAvailable: (_a = localParticipant === null || localParticipant === void 0 ? void 0 : localParticipant.videoStream) === null || _a === void 0 ? void 0 : _a.isAvailable, isMuted: localParticipant.isMuted, renderElement: (_b = localParticipant === null || localParticipant === void 0 ? void 0 : localParticipant.videoStream) === null || _b === void 0 ? void 0 : _b.renderElement, displayName: showDisplayNameTrampoline(), initialsName: initialsName, localVideoViewOptions: localVideoViewOptions, onRenderAvatar: onRenderAvatar, showLabel: showLocalVideoTileLabel, showMuteIndicator: showMuteIndicator, showCameraSwitcherInLocalPreview: showCameraSwitcherInLocalPreview, localVideoCameraCycleButtonProps: localVideoCameraCycleButtonProps, localVideoCameraSwitcherLabel: strings.localVideoCameraSwitcherLabel, localVideoSelectedDescription: strings.localVideoSelectedDescription, styles: localVideoTileStyles, raisedHand: localParticipant.raisedHand, reaction: localParticipant.reaction, spotlightedParticipantUserIds: spotlightedParticipants, isSpotlighted: isSpotlighted, onStartSpotlight: onStartLocalSpotlight, onStopSpotlight: onStopLocalSpotlight, maxParticipantsToSpotlight: maxParticipantsToSpotlight, menuKind: remoteVideoTileMenu ? (remoteVideoTileMenu.kind === 'drawer' ? 'drawer' : 'contextual') : undefined, drawerMenuHostId: drawerMenuHostId, strings: strings, reactionResources: reactionResources, participantsCount: remoteParticipants.length + 1, isScreenSharingOn: localParticipant.isScreenSharingOn })));
+            React.createElement(_LocalVideoTile, { alwaysShowLabelBackground: videoTilesOptions === null || videoTilesOptions === void 0 ? void 0 : videoTilesOptions.alwaysShowLabelBackground, userId: localParticipant.userId, onCreateLocalStreamView: onCreateLocalStreamView, onDisposeLocalStreamView: onDisposeLocalStreamView, isAvailable: (_a = localParticipant === null || localParticipant === void 0 ? void 0 : localParticipant.videoStream) === null || _a === void 0 ? void 0 : _a.isAvailable, isMuted: localParticipant.isMuted, renderElement: (_b = localParticipant === null || localParticipant === void 0 ? void 0 : localParticipant.videoStream) === null || _b === void 0 ? void 0 : _b.renderElement, displayName: showDisplayNameTrampoline(), initialsName: initialsName, localVideoViewOptions: localVideoViewOptions, onRenderAvatar: onRenderAvatar, showLabel: showLocalVideoTileLabel, showMuteIndicator: showMuteIndicator, showCameraSwitcherInLocalPreview: showCameraSwitcherInLocalPreview, localVideoCameraCycleButtonProps: localVideoCameraCycleButtonProps, localVideoCameraSwitcherLabel: strings.localVideoCameraSwitcherLabel, localVideoSelectedDescription: strings.localVideoSelectedDescription, styles: localVideoTileStyles, raisedHand: localParticipant.raisedHand, reaction: localParticipant.reaction, spotlightedParticipantUserIds: spotlightedParticipants, isSpotlighted: isSpotlighted, onStartSpotlight: onStartLocalSpotlight, onStopSpotlight: onStopLocalSpotlight, maxParticipantsToSpotlight: maxParticipantsToSpotlight, menuKind: remoteVideoTileMenu ? (remoteVideoTileMenu.kind === 'drawer' ? 'drawer' : 'contextual') : undefined, drawerMenuHostId: drawerMenuHostId, strings: strings, reactionResources: reactionResources, participantsCount: remoteParticipants.length + 1, isScreenSharingOn: localParticipant.isScreenSharingOn, 
+                /* @conditional-compile-remove(media-access) */
+                mediaAccess: localParticipant.mediaAccess })));
     }, [
         isNarrow,
         localParticipant,
@@ -22314,30 +22491,46 @@ const VideoGallery = (props) => {
                     ? remoteVideoTileMenu.kind === 'drawer'
                         ? 'drawer'
                         : 'contextual'
-                    : undefined, drawerMenuHostId: drawerMenuHostId, onPinParticipant: onPinParticipant, onUnpinParticipant: onUnpinParticipant, onUpdateScalingMode: onUpdateScalingMode, isPinned: isPinned, disablePinMenuItem: pinnedParticipants.length >= MAX_PINNED_REMOTE_VIDEO_TILES$1, toggleAnnouncerString: toggleAnnouncerString, spotlightedParticipantUserIds: spotlightedParticipants, isSpotlighted: isSpotlighted, onStartSpotlight: onStartRemoteSpotlight, onStopSpotlight: onStopRemoteSpotlight, maxParticipantsToSpotlight: maxParticipantsToSpotlight, reactionResources: reactionResources, onMuteParticipant: onMuteParticipant }));
+                    : undefined, drawerMenuHostId: drawerMenuHostId, onPinParticipant: onPinParticipant, onUnpinParticipant: onUnpinParticipant, onUpdateScalingMode: onUpdateScalingMode, isPinned: isPinned, disablePinMenuItem: pinnedParticipants.length >= MAX_PINNED_REMOTE_VIDEO_TILES$1, toggleAnnouncerString: toggleAnnouncerString, spotlightedParticipantUserIds: spotlightedParticipants, isSpotlighted: isSpotlighted, onStartSpotlight: onStartRemoteSpotlight, onStopSpotlight: onStopRemoteSpotlight, maxParticipantsToSpotlight: maxParticipantsToSpotlight, reactionResources: reactionResources, onMuteParticipant: onMuteParticipant, 
+            /* @conditional-compile-remove(media-access) */
+            onForbidAudio: onForbidAudio, 
+            /* @conditional-compile-remove(media-access) */
+            onPermitAudio: onPermitAudio, 
+            /* @conditional-compile-remove(media-access) */
+            onForbidVideo: onForbidVideo, 
+            /* @conditional-compile-remove(media-access) */
+            onPermitVideo: onPermitVideo }));
     }, [
+        selectedScalingModeState,
+        pinnedParticipants,
+        videoTilesOptions === null || videoTilesOptions === void 0 ? void 0 : videoTilesOptions.alwaysShowLabelBackground,
         onCreateRemoteStreamView,
         onDisposeRemoteVideoStreamView,
-        remoteVideoViewOptions,
-        localParticipant,
         onRenderAvatar,
         showMuteIndicator,
         strings,
-        drawerMenuHostId,
+        localParticipant.userId,
         remoteVideoTileMenu,
-        selectedScalingModeState,
-        pinnedParticipants,
+        drawerMenuHostId,
         onPinParticipant,
         onUnpinParticipant,
-        toggleAnnouncerString,
         onUpdateScalingMode,
+        toggleAnnouncerString,
         spotlightedParticipants,
         onStartRemoteSpotlight,
         onStopRemoteSpotlight,
         maxParticipantsToSpotlight,
-        onMuteParticipant,
         reactionResources,
-        videoTilesOptions
+        onMuteParticipant,
+        /* @conditional-compile-remove(media-access) */
+        onForbidAudio,
+        /* @conditional-compile-remove(media-access) */
+        onPermitAudio,
+        /* @conditional-compile-remove(media-access) */
+        onForbidVideo,
+        /* @conditional-compile-remove(media-access) */
+        onPermitVideo,
+        remoteVideoViewOptions
     ]);
     const screenShareParticipant = remoteParticipants.find((participant) => { var _a; return (_a = participant.screenShareStream) === null || _a === void 0 ? void 0 : _a.isAvailable; });
     const localScreenShareStreamComponent = (React.createElement(LocalScreenShare, { localParticipant: localParticipant, renderElement: (_a = localParticipant.screenShareStream) === null || _a === void 0 ? void 0 : _a.renderElement, isAvailable: (_b = localParticipant.screenShareStream) === null || _b === void 0 ? void 0 : _b.isAvailable, onCreateLocalStreamView: onCreateLocalStreamView, onDisposeLocalScreenShareStreamView: onDisposeLocalScreenShareStreamView }));
@@ -26520,31 +26713,17 @@ const _videoGalleryRemoteParticipantsMemo = (remoteParticipants, isHideAttendeeN
             const displayName = maskDisplayNameWithRole(participant.displayName, localUserRole, participant.role, isHideAttendeeNamesEnabled);
             const remoteParticipantReaction = memoizedConvertToVideoTileReaction(participant.reactionState);
             const spotlight = participant.spotlight;
-            return memoizedFn(toFlatCommunicationIdentifier(participant.identifier), participant.isMuted, checkIsSpeaking(participant), participant.videoStreams, state, displayName, participant.raisedHand, participant.contentSharingStream, remoteParticipantReaction, spotlight, 
+            return memoizedFn(toFlatCommunicationIdentifier(participant.identifier), participant.isMuted, checkIsSpeaking(participant), participant.videoStreams, state, displayName, participant.raisedHand, participant.contentSharingStream, remoteParticipantReaction, spotlight, participant.mediaAccess, participant.role, 
             /* @conditional-compile-remove(remote-ufd) */
-            Math.max(((_c = (_b = (_a = participant.diagnostics) === null || _a === void 0 ? void 0 : _a.networkReceiveQuality) === null || _b === void 0 ? void 0 : _b.value) !== null && _c !== void 0 ? _c : 0), ((_f = (_e = (_d = participant.diagnostics) === null || _d === void 0 ? void 0 : _d.networkSendQuality) === null || _e === void 0 ? void 0 : _e.value) !== null && _f !== void 0 ? _f : 0)), 
-            /* @conditional-compile-remove(media-access) */
-            participant.mediaAccess, 
-            /* @conditional-compile-remove(media-access) */
-            participant.role);
+            Math.max(((_c = (_b = (_a = participant.diagnostics) === null || _a === void 0 ? void 0 : _a.networkReceiveQuality) === null || _b === void 0 ? void 0 : _b.value) !== null && _c !== void 0 ? _c : 0), ((_f = (_e = (_d = participant.diagnostics) === null || _d === void 0 ? void 0 : _d.networkSendQuality) === null || _e === void 0 ? void 0 : _e.value) !== null && _f !== void 0 ? _f : 0)));
         }));
     });
 };
-const memoizedAllConvertRemoteParticipant = memoizeFnAll((userId, isMuted, isSpeaking, videoStreams, state, displayName, raisedHand, contentSharingStream, reaction, spotlight, 
-/* @conditional-compile-remove(remote-ufd) */
-signalStrength, mediaAccess, role) => {
-    return convertRemoteParticipantToVideoGalleryRemoteParticipant(userId, isMuted, isSpeaking, videoStreams, state, displayName, raisedHand, contentSharingStream, reaction, spotlight, 
-    /* @conditional-compile-remove(remote-ufd) */
-    signalStrength, 
-    /* @conditional-compile-remove(media-access) */
-    mediaAccess, 
-    /* @conditional-compile-remove(media-access) */
-    role);
+const memoizedAllConvertRemoteParticipant = memoizeFnAll((userId, isMuted, isSpeaking, videoStreams, state, displayName, raisedHand, contentSharingStream, reaction, spotlight, mediaAccess, role, signalStrength) => {
+    return convertRemoteParticipantToVideoGalleryRemoteParticipant(userId, isMuted, isSpeaking, videoStreams, state, displayName, raisedHand, contentSharingStream, reaction, spotlight, signalStrength, mediaAccess, role);
 });
 /** @private */
-const convertRemoteParticipantToVideoGalleryRemoteParticipant = (userId, isMuted, isSpeaking, videoStreams, state, displayName, raisedHand, contentSharingStream, reaction, spotlight, 
-/* @conditional-compile-remove(remote-ufd) */
-signalStrength, mediaAccess, role) => {
+const convertRemoteParticipantToVideoGalleryRemoteParticipant = (userId, isMuted, isSpeaking, videoStreams, state, displayName, raisedHand, contentSharingStream, reaction, spotlight, signalStrength, mediaAccess, role) => {
     const rawVideoStreamsArray = Object.values(videoStreams);
     let videoStream = undefined;
     let screenShareStream = undefined;
@@ -26580,12 +26759,13 @@ signalStrength, mediaAccess, role) => {
         raisedHand,
         reaction,
         spotlight,
-        /* @conditional-compile-remove(remote-ufd) */
-        signalStrength,
-        /* @conditional-compile-remove(media-access) */
         mediaAccess,
         /* @conditional-compile-remove(media-access) */
-        role
+        canAudioBeForbidden: role === 'Attendee',
+        /* @conditional-compile-remove(media-access) */
+        canVideoBeForbidden: role === 'Attendee',
+        /* @conditional-compile-remove(remote-ufd) */
+        signalStrength
     };
 };
 const convertRemoteVideoStreamToVideoGalleryStream = (stream) => {
@@ -26632,8 +26812,8 @@ const memoizeLocalParticipant = memoizeOne((identifier, displayName, isMuted, is
         capabilities,
         /* @conditional-compile-remove(media-access) */
         mediaAccess: {
-            isAudioPermitted: capabilities === null || capabilities === void 0 ? void 0 : capabilities.unmuteMic.isPresent,
-            isVideoPermitted: capabilities === null || capabilities === void 0 ? void 0 : capabilities.turnVideoOn.isPresent
+            isAudioPermitted: (capabilities === null || capabilities === void 0 ? void 0 : capabilities.unmuteMic) ? capabilities.unmuteMic.isPresent : true,
+            isVideoPermitted: (capabilities === null || capabilities === void 0 ? void 0 : capabilities.turnVideoOn) ? capabilities.turnVideoOn.isPresent : true
         }
     });
 });
@@ -26797,8 +26977,8 @@ capabilities) => {
         spotlight: memoizedSpotlight(spotlightCallFeature === null || spotlightCallFeature === void 0 ? void 0 : spotlightCallFeature.spotlightedParticipants, userId),
         /* @conditional-compile-remove(media-access) */
         mediaAccess: {
-            isAudioPermitted: capabilities ? capabilities.unmuteMic.isPresent : true,
-            isVideoPermitted: capabilities ? capabilities.turnVideoOn.isPresent : true
+            isAudioPermitted: (capabilities === null || capabilities === void 0 ? void 0 : capabilities.unmuteMic) ? capabilities.unmuteMic.isPresent : true,
+            isVideoPermitted: (capabilities === null || capabilities === void 0 ? void 0 : capabilities.turnVideoOn) ? capabilities.turnVideoOn.isPresent : true
         }
     });
     /* @conditional-compile-remove(total-participant-count) */
@@ -30980,7 +31160,7 @@ const AttachmentDownloadErrorBar = (props) => {
 /**
  * Wrapper for RichTextSendBox component to allow us to use usePropsFor with richTextSendBox with lazy loading
  */
-const RichTextSendBoxWrapper = React.lazy(() => Promise.resolve().then(function () { return require('./RichTextSendBoxWrapper-DCfnYa5y.js'); }).then((module) => ({ default: module.RichTextSendBoxWrapper })));
+const RichTextSendBoxWrapper = React.lazy(() => Promise.resolve().then(function () { return require('./RichTextSendBoxWrapper-CPU8bZEb.js'); }).then((module) => ({ default: module.RichTextSendBoxWrapper })));
 /**
  * @private
  * Use this function to load RoosterJS dependencies early in the lifecycle.
@@ -30988,7 +31168,7 @@ const RichTextSendBoxWrapper = React.lazy(() => Promise.resolve().then(function
  *
 /* @conditional-compile-remove(rich-text-editor-composite-support)
  */
-const loadRichTextSendBox = () => Promise.resolve().then(function () { return require('./RichTextSendBoxWrapper-DCfnYa5y.js'); }).then((module) => ({ default: module.RichTextSendBoxWrapper }));
+const loadRichTextSendBox = () => Promise.resolve().then(function () { return require('./RichTextSendBoxWrapper-CPU8bZEb.js'); }).then((module) => ({ default: module.RichTextSendBoxWrapper }));
 /**
  * @private
  */
@@ -31904,7 +32084,7 @@ const memoizeState = memoizeOne((userId, deviceManager, calls, latestErrors, lat
     callAgent: { displayName },
     calls,
     latestErrors,
-    /* @conditional-compile-remove(breakout-rooms) */
+    /* @conditional-compile-remove(breakout-rooms) */ /* @conditional-compile-remove(media-access) */
     latestNotifications: latestNotifications !== null && latestNotifications !== void 0 ? latestNotifications : {},
     alternateCallerId,
     environmentInfo
@@ -32747,6 +32927,9 @@ const getAlternateCallerId = (state) => state.alternateCallerId;
 const getIsRoomsCall = (state) => state.isRoomsCall;
 /** @private */
 const getVideoBackgroundImages = (state) => state.videoBackgroundImages;
+/* @conditional-compile-remove(media-access) */
+/** @private */
+const getMediaAccessSetting = (state) => { var _a; return (_a = state.call) === null || _a === void 0 ? void 0 : _a.meetingMediaAccess; };
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT License.
@@ -32771,6 +32954,7 @@ _component) => {
     return createCompositeHandlers(adapter, capabilities);
 };
 const createCompositeHandlers = memoizeOne((adapter, capabilities) => {
+    var _a, _b, _c, _d, _e, _f, _g, _h;
     return {
         onCreateLocalStreamView: (options) => __awaiter$q(void 0, void 0, void 0, function* () {
             return yield adapter.createStreamView(undefined, options);
@@ -32782,8 +32966,8 @@ const createCompositeHandlers = memoizeOne((adapter, capabilities) => {
             yield adapter.leaveCall(forEveryone);
         }),
         onToggleHold: () => __awaiter$q(void 0, void 0, void 0, function* () {
-            var _a;
-            return ((_a = adapter.getState().call) === null || _a === void 0 ? void 0 : _a.state) === 'LocalHold' ? yield adapter.resumeCall() : yield adapter.holdCall();
+            var _j;
+            return ((_j = adapter.getState().call) === null || _j === void 0 ? void 0 : _j.state) === 'LocalHold' ? yield adapter.resumeCall() : yield adapter.holdCall();
         }),
         onAddParticipant: (participant, options) => __awaiter$q(void 0, void 0, void 0, function* () {
             if ('communicationUserId' in participant) {
@@ -32811,8 +32995,8 @@ const createCompositeHandlers = memoizeOne((adapter, capabilities) => {
             yield adapter.lowerHand();
         }),
         onToggleRaiseHand: () => __awaiter$q(void 0, void 0, void 0, function* () {
-            var _b;
-            ((_b = adapter.getState().call) === null || _b === void 0 ? void 0 : _b.raiseHand.localParticipantRaisedHand)
+            var _k;
+            ((_k = adapter.getState().call) === null || _k === void 0 ? void 0 : _k.raiseHand.localParticipantRaisedHand)
                 ? yield adapter.lowerHand()
                 : yield adapter.raiseHand();
         }),
@@ -32842,12 +33026,12 @@ const createCompositeHandlers = memoizeOne((adapter, capabilities) => {
             isCameraOn(adapter.getState()) ? yield adapter.stopCamera() : yield adapter.startCamera(options);
         }),
         onToggleMicrophone: () => __awaiter$q(void 0, void 0, void 0, function* () {
-            var _c;
-            return ((_c = adapter.getState().call) === null || _c === void 0 ? void 0 : _c.isMuted) ? yield adapter.unmute() : yield adapter.mute();
+            var _l;
+            return ((_l = adapter.getState().call) === null || _l === void 0 ? void 0 : _l.isMuted) ? yield adapter.unmute() : yield adapter.mute();
         }),
         onToggleScreenShare: () => __awaiter$q(void 0, void 0, void 0, function* () {
-            var _d;
-            return ((_d = adapter.getState().call) === null || _d === void 0 ? void 0 : _d.isScreenSharingOn)
+            var _m;
+            return ((_m = adapter.getState().call) === null || _m === void 0 ? void 0 : _m.isScreenSharingOn)
                 ? yield adapter.stopScreenShare()
                 : yield adapter.startScreenShare();
         }),
@@ -32940,6 +33124,54 @@ const createCompositeHandlers = memoizeOne((adapter, capabilities) => {
         onMuteAllRemoteParticipants: () => __awaiter$q(void 0, void 0, void 0, function* () {
             yield adapter.muteAllRemoteParticipants();
         }),
+        /* @conditional-compile-remove(media-access) */
+        onForbidAudio: ((_a = capabilities === null || capabilities === void 0 ? void 0 : capabilities.forbidOthersAudio) === null || _a === void 0 ? void 0 : _a.isPresent)
+            ? (userIds) => __awaiter$q(void 0, void 0, void 0, function* () {
+                yield adapter.forbidAudio(userIds);
+            })
+            : undefined,
+        /* @conditional-compile-remove(media-access) */
+        onPermitAudio: ((_b = capabilities === null || capabilities === void 0 ? void 0 : capabilities.forbidOthersAudio) === null || _b === void 0 ? void 0 : _b.isPresent)
+            ? (userIds) => __awaiter$q(void 0, void 0, void 0, function* () {
+                yield adapter.permitAudio(userIds);
+            })
+            : undefined,
+        /* @conditional-compile-remove(media-access) */
+        onForbidOthersAudio: ((_c = capabilities === null || capabilities === void 0 ? void 0 : capabilities.forbidOthersAudio) === null || _c === void 0 ? void 0 : _c.isPresent)
+            ? () => __awaiter$q(void 0, void 0, void 0, function* () {
+                yield adapter.forbidOthersAudio();
+            })
+            : undefined,
+        /* @conditional-compile-remove(media-access) */
+        onPermitOthersAudio: ((_d = capabilities === null || capabilities === void 0 ? void 0 : capabilities.forbidOthersAudio) === null || _d === void 0 ? void 0 : _d.isPresent)
+            ? () => __awaiter$q(void 0, void 0, void 0, function* () {
+                yield adapter.permitOthersAudio();
+            })
+            : undefined,
+        /* @conditional-compile-remove(media-access) */
+        onForbidVideo: ((_e = capabilities === null || capabilities === void 0 ? void 0 : capabilities.forbidOthersVideo) === null || _e === void 0 ? void 0 : _e.isPresent)
+            ? (userIds) => __awaiter$q(void 0, void 0, void 0, function* () {
+                yield adapter.forbidVideo(userIds);
+            })
+            : undefined,
+        /* @conditional-compile-remove(media-access) */
+        onPermitVideo: ((_f = capabilities === null || capabilities === void 0 ? void 0 : capabilities.forbidOthersVideo) === null || _f === void 0 ? void 0 : _f.isPresent)
+            ? (userIds) => __awaiter$q(void 0, void 0, void 0, function* () {
+                yield adapter.permitVideo(userIds);
+            })
+            : undefined,
+        /* @conditional-compile-remove(media-access) */
+        onForbidOthersVideo: ((_g = capabilities === null || capabilities === void 0 ? void 0 : capabilities.forbidOthersVideo) === null || _g === void 0 ? void 0 : _g.isPresent)
+            ? () => __awaiter$q(void 0, void 0, void 0, function* () {
+                yield adapter.forbidOthersVideo();
+            })
+            : undefined,
+        /* @conditional-compile-remove(media-access) */
+        onPermitOthersVideo: ((_h = capabilities === null || capabilities === void 0 ? void 0 : capabilities.forbidOthersVideo) === null || _h === void 0 ? void 0 : _h.isPresent)
+            ? () => __awaiter$q(void 0, void 0, void 0, function* () {
+                yield adapter.permitOthersVideo();
+            })
+            : undefined,
         /* @conditional-compile-remove(together-mode) */
         onCreateTogetherModeStreamView: (options) => __awaiter$q(void 0, void 0, void 0, function* () {
             return yield adapter.createTogetherModeStreamView(options);
@@ -36536,7 +36768,25 @@ const canRemoveParticipants = (role) => {
 const PEOPLE_SIDE_PANE_ID = 'people';
 /** @private */
 const usePeoplePane = (props) => {
-    const { updateSidePaneRenderer, inviteLink, onFetchAvatarPersonaData, onFetchParticipantMenuItems, setDrawerMenuItems, mobileView, peopleButtonRef, setParticipantActioned, spotlightedParticipantUserIds, onStartLocalSpotlight, onStopLocalSpotlight, onStartRemoteSpotlight, onStopRemoteSpotlight, onStopAllSpotlight, maxParticipantsToSpotlight, onMuteParticipant, pinnedParticipants, onPinParticipant, onUnpinParticipant, disablePinMenuItem, onMuteAllRemoteParticipants } = props;
+    const { updateSidePaneRenderer, inviteLink, onFetchAvatarPersonaData, onFetchParticipantMenuItems, setDrawerMenuItems, mobileView, peopleButtonRef, setParticipantActioned, spotlightedParticipantUserIds, onStartLocalSpotlight, onStopLocalSpotlight, onStartRemoteSpotlight, onStopRemoteSpotlight, onStopAllSpotlight, maxParticipantsToSpotlight, onMuteParticipant, pinnedParticipants, onPinParticipant, onUnpinParticipant, disablePinMenuItem, onMuteAllRemoteParticipants, 
+    /* @conditional-compile-remove(media-access) */
+    onForbidAudio, 
+    /* @conditional-compile-remove(media-access) */
+    onPermitAudio, 
+    /* @conditional-compile-remove(media-access) */
+    onForbidOthersAudio, 
+    /* @conditional-compile-remove(media-access) */
+    onPermitOthersAudio, 
+    /* @conditional-compile-remove(media-access) */
+    onForbidVideo, 
+    /* @conditional-compile-remove(media-access) */
+    onPermitVideo, 
+    /* @conditional-compile-remove(media-access) */
+    onForbidOthersVideo, 
+    /* @conditional-compile-remove(media-access) */
+    onPermitOthersVideo, 
+    /* @conditional-compile-remove(media-access) */
+    meetingMediaAccess } = props;
     const closePane = React.useCallback(() => {
         var _a;
         updateSidePaneRenderer(undefined);
@@ -36560,6 +36810,34 @@ const usePeoplePane = (props) => {
         onMuteAllRemoteParticipants && onMuteAllRemoteParticipants();
         setShowMuteAllPrompt(false);
     }, [onMuteAllRemoteParticipants, setShowMuteAllPrompt]);
+    /* @conditional-compile-remove(media-access) */
+    const [showForbidOthersAudioPrompt, setShowForbidOthersAudioPrompt] = React.useState(false);
+    /* @conditional-compile-remove(media-access) */
+    const [showPermitOthersAudioPrompt, setShowPermitOthersAudioPrompt] = React.useState(false);
+    /* @conditional-compile-remove(media-access) */
+    const [showForbidOthersVideoPrompt, setShowForbidOthersVideoPrompt] = React.useState(false);
+    /* @conditional-compile-remove(media-access) */
+    const [showPermitOthersVideoPrompt, setShowPermitOthersVideoPrompt] = React.useState(false);
+    /* @conditional-compile-remove(media-access) */
+    const onForbidAllAttendeesPromptConfirm = React.useCallback(() => {
+        onForbidOthersAudio && onForbidOthersAudio();
+        setShowForbidOthersAudioPrompt(false);
+    }, [onForbidOthersAudio, setShowForbidOthersAudioPrompt]);
+    /* @conditional-compile-remove(media-access) */
+    const onPermitAllAttendeesPromptConfirm = React.useCallback(() => {
+        onPermitOthersAudio && onPermitOthersAudio();
+        setShowPermitOthersAudioPrompt(false);
+    }, [onPermitOthersAudio, setShowPermitOthersAudioPrompt]);
+    /* @conditional-compile-remove(media-access) */
+    const onForbidOthersVideoPromptConfirm = React.useCallback(() => {
+        onForbidOthersVideo && onForbidOthersVideo();
+        setShowForbidOthersVideoPrompt(false);
+    }, [onForbidOthersVideo, setShowForbidOthersVideoPrompt]);
+    /* @conditional-compile-remove(media-access) */
+    const onPermitOthersVideoPromptConfirm = React.useCallback(() => {
+        onPermitOthersVideo && onPermitOthersVideo();
+        setShowPermitOthersVideoPrompt(false);
+    }, [onPermitOthersVideo, setShowPermitOthersVideoPrompt]);
     const sidePaneHeaderMenuProps = React.useMemo(() => {
         const menuItems = [];
         if (onMuteAllRemoteParticipants && remoteParticipants) {
@@ -36587,6 +36865,97 @@ const usePeoplePane = (props) => {
                 disabled: isAllMuted
             });
         }
+        /* @conditional-compile-remove(media-access) */
+        let hasAttendee = false;
+        /* @conditional-compile-remove(media-access) */
+        if (remoteParticipants) {
+            for (const participant of Object.values(remoteParticipants)) {
+                if (participant.role && participant.role === 'Attendee') {
+                    hasAttendee = true;
+                    break;
+                }
+            }
+        }
+        /* @conditional-compile-remove(media-access) */
+        const isMeetingAudioPermitted = meetingMediaAccess ? meetingMediaAccess.isAudioPermitted : true;
+        /* @conditional-compile-remove(media-access) */
+        const isMeetingVideoPermitted = meetingMediaAccess ? meetingMediaAccess.isVideoPermitted : true;
+        /* @conditional-compile-remove(media-access) */
+        if (onForbidOthersAudio && remoteParticipants) {
+            hasAttendee &&
+                isMeetingAudioPermitted &&
+                menuItems.push({
+                    ['data-ui-id']: 'people-pane-forbid-all-attendees-audio',
+                    key: 'forbidOthersAudio',
+                    text: localeStrings.forbidOthersAudioMenuLabel,
+                    iconProps: {
+                        iconName: 'ControlButtonMicProhibited',
+                        styles: { root: { lineHeight: 0 } }
+                    },
+                    onClick: () => {
+                        setShowForbidOthersAudioPrompt(true);
+                    },
+                    ariaLabel: localeStrings.forbidOthersAudioMenuLabel,
+                    disabled: !hasAttendee
+                });
+        }
+        /* @conditional-compile-remove(media-access) */
+        if (onPermitOthersAudio && remoteParticipants) {
+            hasAttendee &&
+                !isMeetingAudioPermitted &&
+                menuItems.push({
+                    ['data-ui-id']: 'people-pane-permit-all-attendees-audio',
+                    key: 'permitOthersAudio',
+                    text: localeStrings.permitOthersAudioMenuLabel,
+                    iconProps: {
+                        iconName: 'ControlButtonMicOn',
+                        styles: { root: { lineHeight: 0 } }
+                    },
+                    onClick: () => {
+                        setShowPermitOthersAudioPrompt(true);
+                    },
+                    ariaLabel: localeStrings.permitOthersAudioMenuLabel,
+                    disabled: !hasAttendee
+                });
+        }
+        /* @conditional-compile-remove(media-access) */
+        if (onForbidOthersVideo && remoteParticipants) {
+            hasAttendee &&
+                isMeetingVideoPermitted &&
+                menuItems.push({
+                    ['data-ui-id']: 'people-pane-forbid-all-attendees-video',
+                    key: 'forbidOthersVideo',
+                    text: localeStrings.forbidOthersVideoMenuLabel,
+                    iconProps: {
+                        iconName: 'ControlButtonCameraProhibitedSmall',
+                        styles: { root: { lineHeight: 0 } }
+                    },
+                    onClick: () => {
+                        setShowForbidOthersVideoPrompt(true);
+                    },
+                    ariaLabel: localeStrings.forbidOthersVideoMenuLabel,
+                    disabled: !hasAttendee
+                });
+        }
+        /* @conditional-compile-remove(media-access) */
+        if (onPermitOthersVideo && remoteParticipants) {
+            hasAttendee &&
+                !isMeetingVideoPermitted &&
+                menuItems.push({
+                    ['data-ui-id']: 'people-pane-permit-all-attendees-video',
+                    key: 'permitOthersVideo',
+                    text: localeStrings.permitOthersVideoMenuLabel,
+                    iconProps: {
+                        iconName: 'ControlButtonCameraOn',
+                        styles: { root: { lineHeight: 0 } }
+                    },
+                    onClick: () => {
+                        setShowPermitOthersVideoPrompt(true);
+                    },
+                    ariaLabel: localeStrings.permitOthersVideoMenuLabel,
+                    disabled: !hasAttendee
+                });
+        }
         if (onStopAllSpotlight && spotlightedParticipantUserIds && spotlightedParticipantUserIds.length > 0) {
             menuItems.push({
                 key: 'stopAllSpotlightKey',
@@ -36602,16 +36971,30 @@ const usePeoplePane = (props) => {
             items: menuItems
         };
     }, [
+        onMuteAllRemoteParticipants,
+        remoteParticipants,
+        /* @conditional-compile-remove(media-access) */
+        meetingMediaAccess,
+        /* @conditional-compile-remove(media-access) */
+        onForbidOthersAudio,
+        /* @conditional-compile-remove(media-access) */
+        onPermitOthersAudio,
+        /* @conditional-compile-remove(media-access) */
+        onForbidOthersVideo,
+        /* @conditional-compile-remove(media-access) */
+        onPermitOthersVideo,
         onStopAllSpotlight,
         spotlightedParticipantUserIds,
-        localeStrings.stopAllSpotlightMenuLabel,
         localeStrings.muteAllMenuLabel,
-        onMuteAllRemoteParticipants,
-        setShowMuteAllPrompt,
-        remoteParticipants
+        localeStrings.forbidOthersAudioMenuLabel,
+        localeStrings.permitOthersAudioMenuLabel,
+        localeStrings.forbidOthersVideoMenuLabel,
+        localeStrings.permitOthersVideoMenuLabel,
+        localeStrings.stopAllSpotlightMenuLabel
     ]);
     const onRenderHeader = React.useCallback(() => (React.createElement(SidePaneHeader, { onClose: closePane, headingText: localeStrings.peoplePaneTitle, dismissSidePaneButtonAriaLabel: localeStrings.dismissSidePaneButtonLabel, mobileView: mobileView !== null && mobileView !== void 0 ? mobileView : false })), [mobileView, closePane, localeStrings]);
     const onFetchParticipantMenuItemsForCallComposite = React.useCallback((participantId, myUserId, defaultMenuItems) => {
+        var _a, _b;
         let isPinned = pinnedParticipants === null || pinnedParticipants === void 0 ? void 0 : pinnedParticipants.includes(participantId);
         const _defaultMenuItems = [];
         const isSpotlighted = spotlightedParticipantUserIds === null || spotlightedParticipantUserIds === void 0 ? void 0 : spotlightedParticipantUserIds.includes(participantId);
@@ -36635,6 +37018,78 @@ const usePeoplePane = (props) => {
                 disabled: isMuted
             });
         }
+        /* @conditional-compile-remove(media-access) */
+        const remoteParticipant = remoteParticipants === null || remoteParticipants === void 0 ? void 0 : remoteParticipants[participantId];
+        /* @conditional-compile-remove(media-access) */
+        if ((remoteParticipant === null || remoteParticipant === void 0 ? void 0 : remoteParticipant.mediaAccess) &&
+            !remoteParticipant.mediaAccess.isAudioPermitted &&
+            (remoteParticipant === null || remoteParticipant === void 0 ? void 0 : remoteParticipant.role) === 'Attendee' &&
+            onPermitAudio) {
+            _defaultMenuItems.push({
+                key: 'permit-audio',
+                text: localeStrings.permitAudioMenuLabel,
+                iconProps: {
+                    iconName: 'ControlButtonMicOn',
+                    styles: { root: { lineHeight: '1rem', textAlign: 'center' } }
+                },
+                onClick: () => {
+                    onPermitAudio([participantId]);
+                },
+                'data-ui-id': 'participant-item-permit-microphone-button',
+                ariaLabel: localeStrings.permitAudioMenuLabel
+            });
+        }
+        /* @conditional-compile-remove(media-access) */
+        if (((_a = remoteParticipant === null || remoteParticipant === void 0 ? void 0 : remoteParticipant.mediaAccess) === null || _a === void 0 ? void 0 : _a.isAudioPermitted) && (remoteParticipant === null || remoteParticipant === void 0 ? void 0 : remoteParticipant.role) === 'Attendee' && onForbidAudio) {
+            _defaultMenuItems.push({
+                key: 'forbid-audio',
+                text: localeStrings.forbidAudioMenuLabel,
+                iconProps: {
+                    iconName: 'ControlButtonMicProhibited',
+                    styles: { root: { lineHeight: '1rem', textAlign: 'center' } }
+                },
+                onClick: () => {
+                    onForbidAudio([participantId]);
+                },
+                'data-ui-id': 'participant-item-forbid-microphone-button',
+                ariaLabel: localeStrings.forbidAudioMenuLabel
+            });
+        }
+        /* @conditional-compile-remove(media-access) */
+        if ((remoteParticipant === null || remoteParticipant === void 0 ? void 0 : remoteParticipant.mediaAccess) &&
+            !remoteParticipant.mediaAccess.isVideoPermitted &&
+            (remoteParticipant === null || remoteParticipant === void 0 ? void 0 : remoteParticipant.role) === 'Attendee' &&
+            onPermitVideo) {
+            _defaultMenuItems.push({
+                key: 'permit-video',
+                text: localeStrings.permitVideoMenuLabel,
+                iconProps: {
+                    iconName: 'ControlButtonCameraOn',
+                    styles: { root: { lineHeight: '1rem', textAlign: 'center' } }
+                },
+                onClick: () => {
+                    onPermitVideo([participantId]);
+                },
+                'data-ui-id': 'participant-item-permit-camera-button',
+                ariaLabel: localeStrings.permitVideoMenuLabel
+            });
+        }
+        /* @conditional-compile-remove(media-access) */
+        if (((_b = remoteParticipant === null || remoteParticipant === void 0 ? void 0 : remoteParticipant.mediaAccess) === null || _b === void 0 ? void 0 : _b.isVideoPermitted) && (remoteParticipant === null || remoteParticipant === void 0 ? void 0 : remoteParticipant.role) === 'Attendee' && onForbidVideo) {
+            _defaultMenuItems.push({
+                key: 'forbid-video',
+                text: localeStrings.forbidVideoMenuLabel,
+                iconProps: {
+                    iconName: 'ControlButtonCameraProhibitedSmall',
+                    styles: { root: { lineHeight: '1rem', textAlign: 'center' } }
+                },
+                onClick: () => {
+                    onForbidVideo([participantId]);
+                },
+                'data-ui-id': 'participant-item-forbid-camera-button',
+                ariaLabel: localeStrings.forbidVideoMenuLabel
+            });
+        }
         if (isSpotlighted) {
             const stopSpotlightMenuText = isMe
                 ? localeStrings.stopSpotlightOnSelfMenuLabel
@@ -36732,51 +37187,90 @@ const usePeoplePane = (props) => {
             ? onFetchParticipantMenuItems(participantId, myUserId, _defaultMenuItems)
             : _defaultMenuItems;
     }, [
+        pinnedParticipants,
         spotlightedParticipantUserIds,
-        onStartLocalSpotlight,
-        onStopLocalSpotlight,
-        onStartRemoteSpotlight,
-        onStopRemoteSpotlight,
-        onFetchParticipantMenuItems,
         onMuteParticipant,
         remoteParticipants,
-        localeStrings.stopSpotlightMenuLabel,
+        onPermitAudio,
+        onForbidAudio,
+        onPermitVideo,
+        onForbidVideo,
+        onFetchParticipantMenuItems,
+        localeStrings.permitAudioMenuLabel,
+        localeStrings.forbidAudioMenuLabel,
+        localeStrings.permitVideoMenuLabel,
+        localeStrings.forbidVideoMenuLabel,
         localeStrings.stopSpotlightOnSelfMenuLabel,
+        localeStrings.stopSpotlightMenuLabel,
         localeStrings.addSpotlightMenuLabel,
         localeStrings.startSpotlightMenuLabel,
         localeStrings.spotlightLimitReachedMenuTitle,
-        maxParticipantsToSpotlight,
-        pinnedParticipants,
-        onPinParticipant,
-        onUnpinParticipant,
-        disablePinMenuItem,
+        localeStrings === null || localeStrings === void 0 ? void 0 : localeStrings.unpinParticipantMenuLabel,
         localeStrings.pinParticipantMenuLabel,
-        localeStrings.pinParticipantLimitReachedMenuLabel,
-        localeStrings.unpinParticipantMenuLabel,
         localeStrings.unpinParticipantMenuItemAriaLabel,
-        localeStrings.pinParticipantMenuItemAriaLabel
+        localeStrings.pinParticipantLimitReachedMenuLabel,
+        localeStrings.pinParticipantMenuItemAriaLabel,
+        onStopLocalSpotlight,
+        onStopRemoteSpotlight,
+        maxParticipantsToSpotlight,
+        onStartLocalSpotlight,
+        onStartRemoteSpotlight,
+        onUnpinParticipant,
+        onPinParticipant,
+        disablePinMenuItem
     ]);
     const role = useSelector$1(getRole);
     const alternateCallerId = useSelector$1(getAlternateCallerId);
     const onRenderContent = React.useCallback(() => {
         return (React.createElement(React.Fragment, null,
             React.createElement(Prompt, Object.assign({}, muteAllPromptLabels, { styles: { main: { minWidth: '22.5rem', padding: '1.5rem' } }, onConfirm: () => onMuteAllPromptConfirm(), isOpen: showMuteAllPrompt, onCancel: () => setShowMuteAllPrompt(false) })),
+            /* @conditional-compile-remove(media-access) */
+            React.createElement(Prompt, { heading: localeStrings.forbidOthersAudioDialogTitle, text: localeStrings.forbidOthersAudioDialogContent, confirmButtonLabel: localeStrings.forbidOthersAudioConfirmButtonLabel, cancelButtonLabel: localeStrings.forbidOthersAudioCancelButtonLabel, styles: { main: { minWidth: '22.5rem', padding: '1.5rem' } }, onConfirm: () => onForbidAllAttendeesPromptConfirm(), isOpen: showForbidOthersAudioPrompt, onCancel: () => setShowForbidOthersAudioPrompt(false) }),
+            /* @conditional-compile-remove(media-access) */
+            React.createElement(Prompt, { heading: localeStrings.permitOthersAudioDialogTitle, text: localeStrings.permitOthersAudioDialogContent, confirmButtonLabel: localeStrings.permitOthersAudioConfirmButtonLabel, cancelButtonLabel: localeStrings.permitOthersAudioCancelButtonLabel, styles: { main: { minWidth: '22.5rem', padding: '1.5rem' } }, onConfirm: () => onPermitAllAttendeesPromptConfirm(), isOpen: showPermitOthersAudioPrompt, onCancel: () => setShowForbidOthersAudioPrompt(false) }),
+            /* @conditional-compile-remove(media-access) */
+            React.createElement(Prompt, { heading: localeStrings.forbidOthersVideoDialogTitle, text: localeStrings.forbidOthersVideoDialogContent, confirmButtonLabel: localeStrings.forbidOthersVideoConfirmButtonLabel, cancelButtonLabel: localeStrings.forbidOthersVideoCancelButtonLabel, styles: { main: { minWidth: '22.5rem', padding: '1.5rem' } }, onConfirm: () => onForbidOthersVideoPromptConfirm(), isOpen: showForbidOthersVideoPrompt, onCancel: () => setShowForbidOthersVideoPrompt(false) }),
+            /* @conditional-compile-remove(media-access) */
+            React.createElement(Prompt, { heading: localeStrings.permitOthersVideoDialogTitle, text: localeStrings.permitOthersVideoDialogContent, confirmButtonLabel: localeStrings.permitOthersVideoConfirmButtonLabel, cancelButtonLabel: localeStrings.permitOthersVideoCancelButtonLabel, styles: { main: { minWidth: '22.5rem', padding: '1.5rem' } }, onConfirm: () => onPermitOthersVideoPromptConfirm(), isOpen: showPermitOthersVideoPrompt, onCancel: () => setShowForbidOthersVideoPrompt(false) }),
             React.createElement(PeoplePaneContent, { inviteLink: inviteLink, onFetchAvatarPersonaData: onFetchAvatarPersonaData, onFetchParticipantMenuItems: onFetchParticipantMenuItemsForCallComposite, setDrawerMenuItems: setDrawerMenuItems, mobileView: mobileView, setParticipantActioned: setParticipantActioned, participantListHeadingMoreButtonProps: sidePaneHeaderMenuProps, pinnedParticipants: pinnedParticipants, role: role, alternateCallerId: alternateCallerId })));
     }, [
+        muteAllPromptLabels,
+        showMuteAllPrompt,
+        localeStrings.forbidOthersAudioDialogTitle,
+        localeStrings.forbidOthersAudioDialogContent,
+        localeStrings.forbidOthersAudioConfirmButtonLabel,
+        localeStrings.forbidOthersAudioCancelButtonLabel,
+        localeStrings.permitOthersAudioDialogTitle,
+        localeStrings.permitOthersAudioDialogContent,
+        localeStrings.permitOthersAudioConfirmButtonLabel,
+        localeStrings.permitOthersAudioCancelButtonLabel,
+        localeStrings.forbidOthersVideoDialogTitle,
+        localeStrings.forbidOthersVideoDialogContent,
+        localeStrings.forbidOthersVideoConfirmButtonLabel,
+        localeStrings.forbidOthersVideoCancelButtonLabel,
+        localeStrings.permitOthersVideoDialogTitle,
+        localeStrings.permitOthersVideoDialogContent,
+        localeStrings.permitOthersVideoConfirmButtonLabel,
+        localeStrings.permitOthersVideoCancelButtonLabel,
+        showForbidOthersAudioPrompt,
+        showPermitOthersAudioPrompt,
+        showForbidOthersVideoPrompt,
+        showPermitOthersVideoPrompt,
         inviteLink,
-        mobileView,
         onFetchAvatarPersonaData,
         onFetchParticipantMenuItemsForCallComposite,
         setDrawerMenuItems,
+        mobileView,
         setParticipantActioned,
         sidePaneHeaderMenuProps,
         pinnedParticipants,
         role,
         alternateCallerId,
-        showMuteAllPrompt,
-        setShowMuteAllPrompt,
-        muteAllPromptLabels,
-        onMuteAllPromptConfirm
+        onMuteAllPromptConfirm,
+        onForbidAllAttendeesPromptConfirm,
+        onPermitAllAttendeesPromptConfirm,
+        onForbidOthersVideoPromptConfirm,
+        onPermitOthersVideoPromptConfirm
     ]);
     const sidePaneRenderer = React.useMemo(() => ({
         headerRenderer: onRenderHeader,
@@ -37470,22 +37964,14 @@ const CapabilitiesChangedNotificationBar = (props) => {
     })));
 };
 const getCapabilityChangedNotificationString = (notification, strings) => {
-    var _a, _b, _c, _d, _e, _f, _g, _h;
+    var _e, _f, _g, _h;
     switch (notification.capabilityName) {
         case 'turnVideoOn':
-            if (notification.changedReason === 'MeetingOptionOrOrganizerPolicyChanged') {
-                return notification.isPresent
-                    ? (_a = strings === null || strings === void 0 ? void 0 : strings.turnVideoOn) === null || _a === void 0 ? void 0 : _a.grantedDueToMeetingOption
-                    : (_b = strings === null || strings === void 0 ? void 0 : strings.turnVideoOn) === null || _b === void 0 ? void 0 : _b.lostDueToMeetingOption;
-            }
-            break;
+            /* @conditional-compile-remove(media-access) */
+            return undefined;
         case 'unmuteMic':
-            if (notification.changedReason === 'MeetingOptionOrOrganizerPolicyChanged') {
-                return notification.isPresent
-                    ? (_c = strings === null || strings === void 0 ? void 0 : strings.unmuteMic) === null || _c === void 0 ? void 0 : _c.grantedDueToMeetingOption
-                    : (_d = strings === null || strings === void 0 ? void 0 : strings.unmuteMic) === null || _d === void 0 ? void 0 : _d.lostDueToMeetingOption;
-            }
-            break;
+            /* @conditional-compile-remove(media-access) */
+            return undefined;
         case 'shareScreen':
             if (notification.isPresent && notification.changedReason === 'RoleChanged' && notification.role === 'Presenter') {
                 return (_e = strings === null || strings === void 0 ? void 0 : strings.shareScreen) === null || _e === void 0 ? void 0 : _e.grantedDueToRoleChangeToPresenter;
@@ -37814,7 +38300,7 @@ const MAX_PINNED_REMOTE_VIDEO_TILES = 4;
  * @private
  */
 const CallArrangement = (props) => {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
     const containerClassName = React.useMemo(() => {
         return props.mobileView ? containerStyleMobile : containerStyleDesktop;
     }, [props.mobileView]);
@@ -37872,7 +38358,15 @@ const CallArrangement = (props) => {
     const videoGalleryProps = usePropsFor$1(VideoGallery);
     const muteAllHandlers = useHandlers();
     const { setPromptProps, setIsPromptOpen, hideSpotlightButtons } = props;
-    const { onStartLocalSpotlight, onStopLocalSpotlight, onStartRemoteSpotlight, onStopRemoteSpotlight, onMuteParticipant, spotlightedParticipants, maxParticipantsToSpotlight, localParticipant } = videoGalleryProps;
+    const { onStartLocalSpotlight, onStopLocalSpotlight, onStartRemoteSpotlight, onStopRemoteSpotlight, onMuteParticipant, spotlightedParticipants, maxParticipantsToSpotlight, localParticipant, 
+    /* @conditional-compile-remove(media-access) */
+    onForbidAudio, 
+    /* @conditional-compile-remove(media-access) */
+    onPermitAudio, 
+    /* @conditional-compile-remove(media-access) */
+    onForbidVideo, 
+    /* @conditional-compile-remove(media-access) */
+    onPermitVideo } = videoGalleryProps;
     const [showTeamsMeetingConferenceModal, setShowTeamsMeetingConferenceModal] = React.useState(false);
     const toggleTeamsMeetingConferenceModal = React.useCallback(() => {
         setShowTeamsMeetingConferenceModal(!showTeamsMeetingConferenceModal);
@@ -37946,7 +38440,39 @@ const CallArrangement = (props) => {
         stopAllSpotlightWithPrompt,
         spotlightedParticipants
     ]);
-    const { isPeoplePaneOpen, openPeoplePane, closePeoplePane } = usePeoplePane(Object.assign(Object.assign(Object.assign(Object.assign({}, peoplePaneProps), spotlightPeoplePaneProps), onMuteParticipantPeoplePaneProps), pinPeoplePaneProps));
+    /* @conditional-compile-remove(media-access) */
+    const meetingMediaAccess = useSelector$1(getMediaAccessSetting);
+    /* @conditional-compile-remove(media-access) */
+    const canForbidOthersAudio = !!((_b = capabilities === null || capabilities === void 0 ? void 0 : capabilities.forbidOthersAudio) === null || _b === void 0 ? void 0 : _b.isPresent);
+    /* @conditional-compile-remove(media-access) */
+    const canForbidOthersVideo = !!((_c = capabilities === null || capabilities === void 0 ? void 0 : capabilities.forbidOthersVideo) === null || _c === void 0 ? void 0 : _c.isPresent);
+    /* @conditional-compile-remove(media-access) */
+    const onToggleParticipantMicPeoplePaneProps = React.useMemo(() => {
+        return {
+            onForbidAudio: canForbidOthersAudio ? onForbidAudio : undefined,
+            onPermitAudio: canForbidOthersAudio ? onPermitAudio : undefined,
+            onForbidOthersAudio: canForbidOthersAudio ? muteAllHandlers.onForbidOthersAudio : undefined,
+            onPermitOthersAudio: canForbidOthersAudio ? muteAllHandlers.onPermitOthersAudio : undefined,
+            onForbidVideo: canForbidOthersVideo ? onForbidVideo : undefined,
+            onPermitVideo: canForbidOthersVideo ? onPermitVideo : undefined,
+            onForbidOthersVideo: canForbidOthersVideo ? muteAllHandlers.onForbidOthersVideo : undefined,
+            onPermitOthersVideo: canForbidOthersVideo ? muteAllHandlers.onPermitOthersVideo : undefined,
+            meetingMediaAccess
+        };
+    }, [
+        canForbidOthersAudio,
+        onForbidAudio,
+        onPermitAudio,
+        muteAllHandlers.onForbidOthersAudio,
+        muteAllHandlers.onPermitOthersAudio,
+        muteAllHandlers.onForbidOthersVideo,
+        muteAllHandlers.onPermitOthersVideo,
+        canForbidOthersVideo,
+        onForbidVideo,
+        onPermitVideo,
+        meetingMediaAccess
+    ]);
+    const { isPeoplePaneOpen, openPeoplePane, closePeoplePane } = usePeoplePane(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, peoplePaneProps), spotlightPeoplePaneProps), onMuteParticipantPeoplePaneProps), pinPeoplePaneProps), onToggleParticipantMicPeoplePaneProps));
     const togglePeoplePane = React.useCallback(() => {
         if (isPeoplePaneOpen) {
             closePeoplePane();
@@ -38022,7 +38548,7 @@ const CallArrangement = (props) => {
     const galleryContainerStyles = React.useMemo(() => {
         var _a;
         return Object.assign(Object.assign({}, mediaGalleryContainerStyles$1), (((_a = props === null || props === void 0 ? void 0 : props.captionsOptions) === null || _a === void 0 ? void 0 : _a.height) === 'full' ? { root: { postion: 'absolute' } } : {}));
-    }, [(_b = props === null || props === void 0 ? void 0 : props.captionsOptions) === null || _b === void 0 ? void 0 : _b.height]);
+    }, [(_d = props === null || props === void 0 ? void 0 : props.captionsOptions) === null || _d === void 0 ? void 0 : _d.height]);
     if (isTeamsMeeting) {
         filteredLatestErrorNotifications
             .filter((notification) => notification.type === 'teamsMeetingCallNetworkQualityLow')
@@ -38035,8 +38561,8 @@ const CallArrangement = (props) => {
     const verticalControlBar = props.mobileView && containerWidth && containerHeight && containerWidth / containerHeight > 1 ? true : false;
     // Filter out shareScreen capability notifications if on mobile
     const filteredCapabilitesChangedNotifications = props.mobileView
-        ? (_c = props.capabilitiesChangedNotificationBarProps) === null || _c === void 0 ? void 0 : _c.capabilitiesChangedNotifications.filter((notification) => notification.capabilityName !== 'shareScreen')
-        : (_d = props.capabilitiesChangedNotificationBarProps) === null || _d === void 0 ? void 0 : _d.capabilitiesChangedNotifications;
+        ? (_e = props.capabilitiesChangedNotificationBarProps) === null || _e === void 0 ? void 0 : _e.capabilitiesChangedNotifications.filter((notification) => notification.capabilityName !== 'shareScreen')
+        : (_f = props.capabilitiesChangedNotificationBarProps) === null || _f === void 0 ? void 0 : _f.capabilitiesChangedNotifications;
     /* @conditional-compile-remove(breakout-rooms) */
     const notificationStackStrings = useCompositeStringsForNotificationStackStrings(locale);
     let latestNotifications = props.latestNotifications;
@@ -38050,11 +38576,11 @@ const CallArrangement = (props) => {
     return (React.createElement("div", { ref: containerRef, className: react.mergeStyles(containerDivStyles), id: props.id },
         React.createElement(react.Stack, { verticalFill: true, horizontalAlign: "stretch", className: containerClassName, "data-ui-id": props.dataUiId },
             React.createElement(react.Stack, { reversed: true, horizontal: verticalControlBar, grow: true, styles: callArrangementContainerStyles(verticalControlBar) },
-                ((_e = props.callControlProps) === null || _e === void 0 ? void 0 : _e.options) !== false && !isMobileWithActivePane && (React.createElement(react.Stack, { verticalAlign: 'center', className: react.mergeStyles({
+                ((_g = props.callControlProps) === null || _g === void 0 ? void 0 : _g.options) !== false && !isMobileWithActivePane && (React.createElement(react.Stack, { verticalAlign: 'center', className: react.mergeStyles({
                         zIndex: CONTROL_BAR_Z_INDEX,
                         padding: verticalControlBar ? '0.25rem' : 'unset'
-                    }) }, isLegacyCallControlEnabled((_f = props.callControlProps) === null || _f === void 0 ? void 0 : _f.options) ? (React.createElement(CallControls, Object.assign({}, props.callControlProps, { containerWidth: containerWidth, containerHeight: containerHeight, isMobile: props.mobileView, peopleButtonChecked: isPeoplePaneOpen, onPeopleButtonClicked: togglePeoplePane, displayVertical: verticalControlBar }))) : (React.createElement(CommonCallControlBar, Object.assign({}, props.callControlProps, { ref: controlBarRef, callControls: props.callControlProps.options, callAdapter: adapter, mobileView: props.mobileView, disableButtonsForLobbyPage: isInLobby, disableButtonsForHoldScreen: isInLocalHold, peopleButtonChecked: isPeoplePaneOpen, onPeopleButtonClicked: togglePeoplePane, onMoreButtonClicked: onMoreButtonClicked, isCaptionsSupported: (useTeamsCaptions && hasJoinedCall) || hasJoinedCall, useTeamsCaptions: useTeamsCaptions, isCaptionsOn: isCaptionsOn, onClickVideoEffects: onResolveVideoEffectDependency ? openVideoEffectsPane : undefined, displayVertical: verticalControlBar, onUserSetOverflowGalleryPositionChange: props.onUserSetOverflowGalleryPositionChange, onUserSetGalleryLayout: props.onUserSetGalleryLayoutChange, userSetGalleryLayout: props.userSetGalleryLayout, onSetDialpadPage: props.onSetDialpadPage, dtmfDialerPresent: props.dtmfDialerPresent, peopleButtonRef: peopleButtonRef, cameraButtonRef: cameraButtonRef, onStopLocalSpotlight: !hideSpotlightButtons && localParticipant.spotlight ? onStopLocalSpotlightWithPrompt : undefined, onToggleTeamsMeetingConferenceModal: toggleTeamsMeetingConferenceModal, teamsMeetingConferenceModalPresent: showTeamsMeetingConferenceModal }))))),
-                ((_g = props.callControlProps) === null || _g === void 0 ? void 0 : _g.options) !== false && showDrawer && (React.createElement(react.Stack, { styles: drawerContainerStylesValue },
+                    }) }, isLegacyCallControlEnabled((_h = props.callControlProps) === null || _h === void 0 ? void 0 : _h.options) ? (React.createElement(CallControls, Object.assign({}, props.callControlProps, { containerWidth: containerWidth, containerHeight: containerHeight, isMobile: props.mobileView, peopleButtonChecked: isPeoplePaneOpen, onPeopleButtonClicked: togglePeoplePane, displayVertical: verticalControlBar }))) : (React.createElement(CommonCallControlBar, Object.assign({}, props.callControlProps, { ref: controlBarRef, callControls: props.callControlProps.options, callAdapter: adapter, mobileView: props.mobileView, disableButtonsForLobbyPage: isInLobby, disableButtonsForHoldScreen: isInLocalHold, peopleButtonChecked: isPeoplePaneOpen, onPeopleButtonClicked: togglePeoplePane, onMoreButtonClicked: onMoreButtonClicked, isCaptionsSupported: (useTeamsCaptions && hasJoinedCall) || hasJoinedCall, useTeamsCaptions: useTeamsCaptions, isCaptionsOn: isCaptionsOn, onClickVideoEffects: onResolveVideoEffectDependency ? openVideoEffectsPane : undefined, displayVertical: verticalControlBar, onUserSetOverflowGalleryPositionChange: props.onUserSetOverflowGalleryPositionChange, onUserSetGalleryLayout: props.onUserSetGalleryLayoutChange, userSetGalleryLayout: props.userSetGalleryLayout, onSetDialpadPage: props.onSetDialpadPage, dtmfDialerPresent: props.dtmfDialerPresent, peopleButtonRef: peopleButtonRef, cameraButtonRef: cameraButtonRef, onStopLocalSpotlight: !hideSpotlightButtons && localParticipant.spotlight ? onStopLocalSpotlightWithPrompt : undefined, onToggleTeamsMeetingConferenceModal: toggleTeamsMeetingConferenceModal, teamsMeetingConferenceModalPresent: showTeamsMeetingConferenceModal }))))),
+                ((_j = props.callControlProps) === null || _j === void 0 ? void 0 : _j.options) !== false && showDrawer && (React.createElement(react.Stack, { styles: drawerContainerStylesValue },
                     React.createElement(PreparedMoreDrawer, { callControls: props.callControlProps.options, onLightDismiss: closeDrawer, onPeopleButtonClicked: onMoreDrawerPeopleClicked, disableButtonsForHoldScreen: isInLocalHold, isCaptionsSupported: (useTeamsCaptions && hasJoinedCall) || hasJoinedCall, useTeamsCaptions: useTeamsCaptions, onUserSetGalleryLayout: props.onUserSetGalleryLayoutChange, userSetGalleryLayout: props.userSetGalleryLayout, onSetDialpadPage: props.onSetDialpadPage, dtmfDialerPresent: props.dtmfDialerPresent, dtmfDialerOptions: props.dtmfDialerOptions, reactionResources: reactionResources, onClickMeetingPhoneInfo: onMeetingPhoneInfoClicked }))),
                 React.createElement(react.Stack, { horizontal: true, grow: true },
                     React.createElement(react.Stack.Item, { style: callCompositeContainerCSS },
@@ -38077,7 +38603,7 @@ const CallArrangement = (props) => {
                     React.createElement(SidePane, { mobileView: props.mobileView, maxWidth: isVideoPaneOpen ? `${VIDEO_EFFECTS_SIDE_PANE_WIDTH_REM}rem` : undefined, minWidth: isVideoPaneOpen ? `${VIDEO_EFFECTS_SIDE_PANE_WIDTH_REM}rem` : undefined, updateSidePaneRenderer: props.updateSidePaneRenderer, onPeopleButtonClicked: props.mobileView && !shouldShowPeopleTabHeaderButton(props.callControlProps.options)
                             ? undefined
                             : togglePeoplePane, disablePeopleButton: typeof props.callControlProps.options !== 'boolean' &&
-                            isDisabled$4((_h = props.callControlProps.options) === null || _h === void 0 ? void 0 : _h.participantsButton), onChatButtonClicked: (_j = props.mobileChatTabHeader) === null || _j === void 0 ? void 0 : _j.onClick, disableChatButton: (_k = props.mobileChatTabHeader) === null || _k === void 0 ? void 0 : _k.disabled, showAddPeopleButton: !!props.callControlProps.callInvitationURL, ariaLabel: isVideoEffectsPaneOpen ? locale.strings.call.videoEffectsPaneAriaLabel : undefined }),
+                            isDisabled$4((_k = props.callControlProps.options) === null || _k === void 0 ? void 0 : _k.participantsButton), onChatButtonClicked: (_l = props.mobileChatTabHeader) === null || _l === void 0 ? void 0 : _l.onClick, disableChatButton: (_m = props.mobileChatTabHeader) === null || _m === void 0 ? void 0 : _m.disabled, showAddPeopleButton: !!props.callControlProps.callInvitationURL, ariaLabel: isVideoEffectsPaneOpen ? locale.strings.call.videoEffectsPaneAriaLabel : undefined }),
                     props.mobileView && (React.createElement(ModalLocalAndRemotePIP, { modalLayerHostId: props.modalLayerHostId, hidden: !isSidePaneOpen, styles: pipStyles, strings: modalStrings, minDragPosition: minMaxDragPosition.minDragPosition, maxDragPosition: minMaxDragPosition.maxDragPosition, onDismissSidePane: () => {
                             closePeoplePane();
                             if (props.onCloseChatPane) {
@@ -41774,6 +42300,14 @@ class AzureCommunicationCallAdapter {
         this.stopAllSpotlight.bind(this);
         this.muteParticipant.bind(this);
         this.muteAllRemoteParticipants.bind(this);
+        /* @conditional-compile-remove(media-access) */
+        this.forbidOthersAudio.bind(this);
+        /* @conditional-compile-remove(media-access) */
+        this.permitOthersAudio.bind(this);
+        /* @conditional-compile-remove(media-access) */
+        this.forbidOthersAudio.bind(this);
+        /* @conditional-compile-remove(media-access) */
+        this.permitOthersAudio.bind(this);
     }
     dispose() {
         this.resetDiagnosticsForwarder();
@@ -42303,6 +42837,62 @@ class AzureCommunicationCallAdapter {
             this.handlers.onStopAllSpotlight();
         });
     }
+    /* @conditional-compile-remove(media-access) */
+    forbidAudio(userIds) {
+        return __awaiter$7(this, void 0, void 0, function* () {
+            var _a, _b;
+            (_b = (_a = this.handlers).onForbidAudio) === null || _b === void 0 ? void 0 : _b.call(_a, userIds);
+        });
+    }
+    /* @conditional-compile-remove(media-access) */
+    permitAudio(userIds) {
+        return __awaiter$7(this, void 0, void 0, function* () {
+            var _a, _b;
+            (_b = (_a = this.handlers).onPermitAudio) === null || _b === void 0 ? void 0 : _b.call(_a, userIds);
+        });
+    }
+    /* @conditional-compile-remove(media-access) */
+    forbidOthersAudio() {
+        return __awaiter$7(this, void 0, void 0, function* () {
+            var _a, _b;
+            (_b = (_a = this.handlers).onForbidOthersAudio) === null || _b === void 0 ? void 0 : _b.call(_a);
+        });
+    }
+    /* @conditional-compile-remove(media-access) */
+    permitOthersAudio() {
+        return __awaiter$7(this, void 0, void 0, function* () {
+            var _a, _b;
+            (_b = (_a = this.handlers).onPermitOthersAudio) === null || _b === void 0 ? void 0 : _b.call(_a);
+        });
+    }
+    /* @conditional-compile-remove(media-access) */
+    forbidVideo(userIds) {
+        return __awaiter$7(this, void 0, void 0, function* () {
+            var _a, _b;
+            (_b = (_a = this.handlers).onForbidVideo) === null || _b === void 0 ? void 0 : _b.call(_a, userIds);
+        });
+    }
+    /* @conditional-compile-remove(media-access) */
+    permitVideo(userIds) {
+        return __awaiter$7(this, void 0, void 0, function* () {
+            var _a, _b;
+            (_b = (_a = this.handlers).onPermitVideo) === null || _b === void 0 ? void 0 : _b.call(_a, userIds);
+        });
+    }
+    /* @conditional-compile-remove(media-access) */
+    forbidOthersVideo() {
+        return __awaiter$7(this, void 0, void 0, function* () {
+            var _a, _b;
+            (_b = (_a = this.handlers).onForbidOthersVideo) === null || _b === void 0 ? void 0 : _b.call(_a);
+        });
+    }
+    /* @conditional-compile-remove(media-access) */
+    permitOthersVideo() {
+        return __awaiter$7(this, void 0, void 0, function* () {
+            var _a, _b;
+            (_b = (_a = this.handlers).onPermitOthersVideo) === null || _b === void 0 ? void 0 : _b.call(_a);
+        });
+    }
     /* @conditional-compile-remove(breakout-rooms) */
     returnFromBreakoutRoom() {
         return __awaiter$7(this, void 0, void 0, function* () {
@@ -42475,20 +43065,18 @@ class AzureCommunicationCallAdapter {
     transferAccepted(args) {
         this.emitter.emit('transferAccepted', args);
     }
+    capabilitiesChangedunmuteMicTrampoline(data) {
+        /* @conditional-compile-remove(media-access) */
+        return;
+    }
     capabilitiesChanged(data) {
-        var _a, _b, _c, _d, _e;
+        var _a, _b;
         if (((_a = data.newValue.turnVideoOn) === null || _a === void 0 ? void 0 : _a.isPresent) === false) {
-            // Only stop camera when the call state is not on hold. The Calling SDK does not allow us to stop camera when
-            // the call state is on hold.
-            if (((_b = this.call) === null || _b === void 0 ? void 0 : _b.state) !== 'LocalHold' && ((_c = this.call) === null || _c === void 0 ? void 0 : _c.state) !== 'RemoteHold') {
-                this.stopCamera();
-            }
+            // stopCamera is handled by web sdk when video hard muted.
             this.disposeLocalVideoStreamView();
         }
-        if (((_d = data.newValue.unmuteMic) === null || _d === void 0 ? void 0 : _d.isPresent) === false) {
-            this.mute();
-        }
-        if (((_e = data.newValue.shareScreen) === null || _e === void 0 ? void 0 : _e.isPresent) === false) {
+        this.capabilitiesChangedunmuteMicTrampoline(data);
+        if (((_b = data.newValue.shareScreen) === null || _b === void 0 ? void 0 : _b.isPresent) === false) {
             this.stopScreenShare();
         }
         this.emitter.emit('capabilitiesChanged', data);
@@ -43194,6 +43782,54 @@ class CallWithChatBackedCallAdapter {
             return this.callWithChatAdapter.returnFromBreakoutRoom();
         });
     }
+    /* @conditional-compile-remove(media-access) */
+    forbidAudio(userIds) {
+        return __awaiter$6(this, void 0, void 0, function* () {
+            return this.callWithChatAdapter.forbidAudio(userIds);
+        });
+    }
+    /* @conditional-compile-remove(media-access) */
+    permitAudio(userIds) {
+        return __awaiter$6(this, void 0, void 0, function* () {
+            return this.callWithChatAdapter.permitAudio(userIds);
+        });
+    }
+    /* @conditional-compile-remove(media-access) */
+    forbidOthersAudio() {
+        return __awaiter$6(this, void 0, void 0, function* () {
+            return this.callWithChatAdapter.forbidOthersAudio();
+        });
+    }
+    /* @conditional-compile-remove(media-access) */
+    permitOthersAudio() {
+        return __awaiter$6(this, void 0, void 0, function* () {
+            return this.callWithChatAdapter.permitOthersAudio();
+        });
+    }
+    /* @conditional-compile-remove(media-access) */
+    forbidVideo(userIds) {
+        return __awaiter$6(this, void 0, void 0, function* () {
+            return this.callWithChatAdapter.forbidAudio(userIds);
+        });
+    }
+    /* @conditional-compile-remove(media-access) */
+    permitVideo(userIds) {
+        return __awaiter$6(this, void 0, void 0, function* () {
+            return this.callWithChatAdapter.permitAudio(userIds);
+        });
+    }
+    /* @conditional-compile-remove(media-access) */
+    forbidOthersVideo() {
+        return __awaiter$6(this, void 0, void 0, function* () {
+            return this.callWithChatAdapter.forbidOthersAudio();
+        });
+    }
+    /* @conditional-compile-remove(media-access) */
+    permitOthersVideo() {
+        return __awaiter$6(this, void 0, void 0, function* () {
+            return this.callWithChatAdapter.permitOthersAudio();
+        });
+    }
 }
 function callAdapterStateFromCallWithChatAdapterState(callWithChatAdapterState) {
     return {
@@ -44476,6 +45112,54 @@ class AzureCommunicationCallWithChatAdapter {
             }
         });
     }
+    /* @conditional-compile-remove(media-access) */
+    forbidAudio(userIds) {
+        return __awaiter$4(this, void 0, void 0, function* () {
+            return this.callAdapter.forbidAudio(userIds);
+        });
+    }
+    /* @conditional-compile-remove(media-access) */
+    permitAudio(userIds) {
+        return __awaiter$4(this, void 0, void 0, function* () {
+            return this.callAdapter.permitAudio(userIds);
+        });
+    }
+    /* @conditional-compile-remove(media-access) */
+    forbidOthersAudio() {
+        return __awaiter$4(this, void 0, void 0, function* () {
+            return this.callAdapter.forbidOthersAudio();
+        });
+    }
+    /* @conditional-compile-remove(media-access) */
+    permitOthersAudio() {
+        return __awaiter$4(this, void 0, void 0, function* () {
+            return this.callAdapter.permitOthersAudio();
+        });
+    }
+    /* @conditional-compile-remove(media-access) */
+    forbidVideo(userIds) {
+        return __awaiter$4(this, void 0, void 0, function* () {
+            return this.callAdapter.forbidVideo(userIds);
+        });
+    }
+    /* @conditional-compile-remove(media-access) */
+    permitVideo(userIds) {
+        return __awaiter$4(this, void 0, void 0, function* () {
+            return this.callAdapter.permitVideo(userIds);
+        });
+    }
+    /* @conditional-compile-remove(media-access) */
+    forbidOthersVideo() {
+        return __awaiter$4(this, void 0, void 0, function* () {
+            return this.callAdapter.forbidOthersVideo();
+        });
+    }
+    /* @conditional-compile-remove(media-access) */
+    permitOthersVideo() {
+        return __awaiter$4(this, void 0, void 0, function* () {
+            return this.callAdapter.permitOthersVideo();
+        });
+    }
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
     on(event, listener) {
         switch (event) {
@@ -45670,4 +46354,4 @@ exports.useTeamsCall = useTeamsCall;
 exports.useTeamsCallAdapter = useTeamsCallAdapter;
 exports.useTeamsCallAgent = useTeamsCallAgent;
 exports.useTheme = useTheme;
-//# sourceMappingURL=index-O64dqfKP.js.map
+//# sourceMappingURL=index-C8ch4y0S.js.map