@azure/communication-react 1.3.3-alpha-202210260016.0 → 1.3.3-alpha-202210270017.0

package/dist/communication-react.d.ts

@@ -6028,6 +6028,8 @@ export declare interface MessageThreadStyles extends BaseCustomStyles {
     chatItemMessageContainer?: ComponentSlotStyle;
     /** Styles for my chat message container. */
     myChatMessageContainer?: ComponentSlotStyle;
+    /** Styles for my chat message container in case of failure. */
+    failedMyChatMessageContainer?: ComponentSlotStyle;
     /** Styles for chat message container. */
     chatMessageContainer?: ComponentSlotStyle;
     /** Styles for system message container. */

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

@@ -202,7 +202,7 @@ const _toCommunicationIdentifier = (id) => {
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
 // GENERATED FILE. DO NOT EDIT MANUALLY.
-var telemetryVersion = '1.3.3-alpha-202210260016.0';
+var telemetryVersion = '1.3.3-alpha-202210270017.0';
 
 // Copyright (c) Microsoft Corporation.
 /**
@@ -3926,7 +3926,7 @@ const DefaultSystemMessage = (props) => {
     return React__default['default'].createElement(React__default['default'].Fragment, null);
 };
 const memoizeAllMessages = memoizeFnAll((_messageKey, message, showMessageDate, showMessageStatus, onRenderAvatar, shouldOverlapAvatarAndMessage, styles, onRenderMessageStatus, defaultStatusRenderer, defaultChatMessageRenderer, strings, _attached, statusToRender, participantCount, readCount, onRenderMessage, onUpdateMessage, onDeleteMessage, onSendMessage) => {
-    var _a, _b, _c;
+    var _a, _b, _c, _d, _e, _f, _g;
     const messageProps = {
         message,
         strings,
@@ -3937,10 +3937,10 @@ const memoizeAllMessages = memoizeFnAll((_messageKey, message, showMessageDate,
     };
     switch (message.messageType) {
         case 'chat': {
-            const myChatMessageStyle = (styles === null || styles === void 0 ? void 0 : styles.myChatMessageContainer) || message.status === 'failed'
-                ? FailedMyChatMessageContainer
-                : defaultMyChatMessageContainer;
-            const chatMessageStyle = (styles === null || styles === void 0 ? void 0 : styles.chatMessageContainer) || defaultChatMessageContainer;
+            const myChatMessageStyle = message.status === 'failed'
+                ? (_b = (_a = styles === null || styles === void 0 ? void 0 : styles.failedMyChatMessageContainer) !== null && _a !== void 0 ? _a : styles === null || styles === void 0 ? void 0 : styles.myChatMessageContainer) !== null && _b !== void 0 ? _b : FailedMyChatMessageContainer
+                : (_c = styles === null || styles === void 0 ? void 0 : styles.myChatMessageContainer) !== null && _c !== void 0 ? _c : defaultMyChatMessageContainer;
+            const chatMessageStyle = (_d = styles === null || styles === void 0 ? void 0 : styles.chatMessageContainer) !== null && _d !== void 0 ? _d : defaultChatMessageContainer;
             messageProps.messageContainerStyle = message.mine ? myChatMessageStyle : chatMessageStyle;
             const chatMessageComponent = onRenderMessage === undefined
                 ? defaultChatMessageRenderer(messageProps)
@@ -3957,14 +3957,14 @@ const memoizeAllMessages = memoizeFnAll((_messageKey, message, showMessageDate,
             return {
                 gutter: {
                     styles: chatGutterStyles,
-                    content: message.mine ? ('') : onRenderAvatar ? (onRenderAvatar((_a = message.senderId) !== null && _a !== void 0 ? _a : '', personaOptions)) : (React__default['default'].createElement(react.Persona, Object.assign({}, personaOptions)))
+                    content: message.mine ? ('') : onRenderAvatar ? (onRenderAvatar((_e = message.senderId) !== null && _e !== void 0 ? _e : '', personaOptions)) : (React__default['default'].createElement(react.Persona, Object.assign({}, personaOptions)))
                 },
                 contentPosition: message.mine ? 'end' : 'start',
                 message: {
                     styles: chatItemMessageStyle,
                     content: (React__default['default'].createElement(reactNorthstar.Flex, { hAlign: message.mine ? 'end' : undefined, vAlign: "end" },
                         chatMessageComponent,
-                        React__default['default'].createElement("div", { className: react.mergeStyles(messageStatusContainerStyle((_b = message.mine) !== null && _b !== void 0 ? _b : false), (styles === null || styles === void 0 ? void 0 : styles.messageStatusContainer) ? styles.messageStatusContainer((_c = message.mine) !== null && _c !== void 0 ? _c : false) : '') }, showMessageStatus && statusToRender ? (onRenderMessageStatus ? (onRenderMessageStatus({ status: statusToRender })) : (defaultStatusRenderer(message, statusToRender, participantCount !== null && participantCount !== void 0 ? participantCount : 0, readCount !== null && readCount !== void 0 ? readCount : 0))) : (React__default['default'].createElement("div", { className: react.mergeStyles(noMessageStatusStyle) })))))
+                        React__default['default'].createElement("div", { className: react.mergeStyles(messageStatusContainerStyle((_f = message.mine) !== null && _f !== void 0 ? _f : false), (styles === null || styles === void 0 ? void 0 : styles.messageStatusContainer) ? styles.messageStatusContainer((_g = message.mine) !== null && _g !== void 0 ? _g : false) : '') }, showMessageStatus && statusToRender ? (onRenderMessageStatus ? (onRenderMessageStatus({ status: statusToRender })) : (defaultStatusRenderer(message, statusToRender, participantCount !== null && participantCount !== void 0 ? participantCount : 0, readCount !== null && readCount !== void 0 ? readCount : 0))) : (React__default['default'].createElement("div", { className: react.mergeStyles(noMessageStatusStyle) })))))
                 },
                 attached: message.attached,
                 key: _messageKey
@@ -4993,14 +4993,15 @@ const displayNameStyle = {
 /**
  * @private
  */
-const iconContainerStyle = (theme) => ({
+const iconContainerStyle = {
     margin: 'auto',
     alignItems: 'center',
     '& svg': {
         display: 'block',
-        color: theme.palette.neutralPrimary
+        // Similar to text color, icon color will be inherited from parent container
+        color: 'inherit'
     }
-});
+};
 /**
  * @private
  */
@@ -5097,7 +5098,7 @@ const VideoTile = (props) => {
                 React__default['default'].createElement(react.Stack, { horizontal: true, className: tileInfoStyle },
                     canShowLabel && (React__default['default'].createElement(react.Text, { className: react.mergeStyles(displayNameStyle), title: displayName, style: { color: participantStateString ? theme.palette.neutralSecondary : 'inherit' } }, displayName)),
                     participantStateString && (React__default['default'].createElement(react.Text, { className: react.mergeStyles(participantStateStringStyles(theme)) }, bracketedParticipantString(participantStateString, !!canShowLabel))),
-                    showMuteIndicator && isMuted && (React__default['default'].createElement(react.Stack, { className: react.mergeStyles(iconContainerStyle(theme)) },
+                    showMuteIndicator && isMuted && (React__default['default'].createElement(react.Stack, { className: react.mergeStyles(iconContainerStyle) },
                         React__default['default'].createElement(react.Icon, { iconName: "VideoTileMicOff" })))))),
             children && (React__default['default'].createElement(react.Stack, { className: react.mergeStyles(overlayContainerStyles, styles === null || styles === void 0 ? void 0 : styles.overlayContainer) }, children)))));
 };
@@ -15588,7 +15589,6 @@ const themedDialpadStyle$1 = (isMobile, theme) => ({
             backgroundColor: theme.palette.white,
             fontSize: theme.fonts.large.fontSize,
             padding: '0 0.5rem ',
-            direction: 'rtl',
             textAlign: 'center',
             ':active': {
                 padding: '0 0.5rem'
@@ -15653,7 +15653,12 @@ const SendDtmfDialpad = (props) => {
     };
     const [textFieldValue, setTextFieldValue] = React.useState();
     const onChange = (input) => {
-        setTextFieldValue(input);
+        if (input.length > 25) {
+            setTextFieldValue(input.slice(1));
+        }
+        else {
+            setTextFieldValue(input);
+        }
     };
     const dialpadModalStyle = React.useMemo(() => themeddialpadModalStyle$1(theme), [theme]);
     const dialpadStyle = React.useMemo(() => themedDialpadStyle$1(isMobile, theme), [theme, isMobile]);
@@ -16566,7 +16571,7 @@ const PeoplePaneContent = (props) => {
     const setDrawerMenuItemsForParticipant = React.useMemo(() => {
         return (participant) => {
             if (participant) {
-                let contextualMenuItems = createDefaultContextualMenuItems(participant, strings, removeButtonAllowed ? participantListDefaultProps.onRemoveParticipant : undefined, participantListDefaultProps.myUserId);
+                let contextualMenuItems = createDefaultContextualMenuItems(participant, strings, removeButtonAllowed && participant.isRemovable ? participantListDefaultProps.onRemoveParticipant : undefined, participantListDefaultProps.myUserId);
                 if (onFetchParticipantMenuItems) {
                     contextualMenuItems = onFetchParticipantMenuItems(participant.userId, participantListDefaultProps.myUserId, contextualMenuItems);
                 }
@@ -17933,7 +17938,7 @@ const LobbyTile = (props) => {
     const handlers = useHandlers();
     return (React__default['default'].createElement(ExpandedLocalVideoTile, Object.assign({ localParticipantVideoStream: props.localParticipantVideoStream, overlayContent: props.overlayProps ? (React__default['default'].createElement(react.Stack, { verticalFill: true, horizontalAlign: "center", verticalAlign: "center", className: react.mergeStyles(overlayContainerStyle), "aria-atomic": true },
             React__default['default'].createElement(react.Stack.Item, { className: react.mergeStyles(titleStyle(palette, isVideoReady)) }, props.overlayProps.overlayIcon),
-            React__default['default'].createElement(react.Text, { className: react.mergeStyles(titleStyle(palette, isVideoReady)), "aria-live": "assertive" }, props.overlayProps.title),
+            React__default['default'].createElement(react.Text, { className: react.mergeStyles(titleStyle(palette, isVideoReady)), "aria-live": "assertive", "data-ui-id": "lobbyScreenTitle" }, props.overlayProps.title),
             props.overlayProps.moreDetails && (React__default['default'].createElement(react.Text, { className: react.mergeStyles(moreDetailsStyle(palette, isVideoReady)), "aria-live": "assertive" }, props.overlayProps.moreDetails)))) : undefined }, handlers)));
 };