npm - @azure/communication-react - Versions diffs - 1.28.0-beta.1 → 1.28.0 - Mend

@azure/communication-react 1.28.0-beta.1 → 1.28.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (425) hide show

package/dist/dist-esm/react-components/src/components/styles/MessageThread.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MessageThread.styles.js","sourceRoot":"","sources":["../../../../../../preprocess-dist/react-components/src/components/styles/MessageThread.styles.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { IButtonStyles, mergeStyles } from '@fluentui/react';\nimport { makeStyles, shorthands, tokens } from '@fluentui/react-components';\nimport { CSSProperties } from 'react';\nimport { MESSAGE_STATUS_INDICATOR_SIZE_REM } from './MessageStatusIndicator.styles';\nimport { ComponentSlotStyle } from '../../types';\nimport { _ATTACHMENT_CARD_MARGIN_IN_PX, _ATTACHMENT_CARD_WIDTH_IN_REM } from './AttachmentCard.styles';\nimport { BROKEN_IMAGE_SVG_DATA } from './Common.style';\n\n// Minimum chat bubble width. This matches the minimum chat bubble width from FluentUI\n// that can contain a message and a timestamp.\nconst CHAT_MESSAGE_CONTAINER_MIN_WIDTH_REM = 6.25;\n\n// Chat messages should span just short of the width of the container.\n// When calculating the width of a message we also must take into account\n// the width of the avatar/gutter and the gap between the message and avatar/gutter.\nconst AVATAR_WIDTH_REM = 2;\nconst AVATAR_MARGIN_LEFT = 2.5;\nconst AVATAR_MESSAGE_GAP_REM = 0.125;\nconst MESSAGE_AMOUNT_OUT_FROM_EDGE_REM = 2;\n\n// Avatars should display on top of chat messages when the chat thread is narrow\nconst MESSAGE_AVATAR_OVERLAP_REM = 0.925;\nconst CHAT_MESSAGE_ZINDEX = 1;\nconst AVATAR_ZINDEX = 2;\n// new message button should be on top of chat message\nconst NEW_MESSAGE_BUTTON_ZINDEX = 2;\n\n/*\n @private\n /\nexport const chatMyMessageActionMenuClassName = 'ChatMyMessage__actions';\n\n/\n @private\n /\nexport const messageThreadContainerStyle = mergeStyles({\n height: '100%',\n width: '100%',\n maxHeight: '100%',\n overflow: 'auto',\n position: 'relative',\n alignSelf: 'center'\n});\n\n/\n @private\n /\nexport const messageThreadWrapperContainerStyle = mergeStyles({\n height: '100%',\n width: '100%',\n position: 'relative'\n});\n\n/\n @private\n /\nexport const noMessageStatusStyle = mergeStyles({\n // This should match the size of the message status indicator icon to ensure\n // multiple messages sent by the user are aligned correctly.\n width: `${MESSAGE_STATUS_INDICATOR_SIZE_REM}rem`\n});\n\n/\n @private\n /\nexport const useChatStyles = makeStyles({\n root: {\n // chat components sets max width value to 1056px, override it to 100%\n maxWidth: '100%',\n paddingTop: '0.8rem',\n paddingBottom: '0.5rem',\n paddingRight: '0.6rem',\n paddingLeft: '0.6rem',\n ...shorthands.border('none'),\n ...shorthands.overflow('auto'),\n // `height: 100%` ensures that the Chat component covers 100% of it's parents height\n // to prevent intermittent scrollbars when GIFs are present in the chat.\n height: '100%',\n '& a:link': {\n color: tokens.colorBrandForegroundLink\n },\n '& a:visited': {\n color: tokens.colorBrandForegroundLinkHover\n },\n '& a:hover': {\n color: tokens.colorBrandForegroundLinkHover\n }\n }\n});\n\n/\n @private\n /\nexport const useChatMessageRenderStyles = makeStyles({\n rootCommon: {},\n rootMessage: {\n ...shorthands.padding('0'),\n ...shorthands.margin('0'),\n maxWidth: '100%',\n minWidth: `${CHAT_MESSAGE_CONTAINER_MIN_WIDTH_REM}rem`\n },\n rootMyMessage: {\n gridTemplateColumns: 'auto fit-content(0)',\n gridTemplateAreas: `\n \"body status\"\n `,\n columnGap: '0',\n gridGap: '0',\n ...shorthands.padding('0'),\n marginTop: '0',\n marginRight: '0',\n marginBottom: '0',\n marginLeft: '50px',\n width: `calc(100% - 50px)`\n },\n bodyCommon: {\n ...shorthands.padding('0'),\n marginRight: '0',\n marginBottom: '0',\n backgroundColor: 'transparent',\n maxWidth: '100%',\n minWidth: `${CHAT_MESSAGE_CONTAINER_MIN_WIDTH_REM}rem`\n },\n bodyMyMessage: {\n width: '100%',\n marginTop: '0'\n },\n bodyWithoutAvatar: {\n marginLeft: `${AVATAR_MARGIN_LEFT}rem`,\n marginTop: '0'\n },\n bodyHiddenAvatar: {\n marginLeft: 0,\n marginTop: 0\n },\n bodyWithAvatar: {\n marginLeft: `0`,\n marginTop: '0.75rem'\n },\n avatarNoOverlap: {\n width: `calc(100% - ${AVATAR_WIDTH_REM + MESSAGE_AMOUNT_OUT_FROM_EDGE_REM + AVATAR_MESSAGE_GAP_REM}rem)`\n },\n avatarOverlap: {\n width: `calc(100% - ${AVATAR_WIDTH_REM + MESSAGE_AMOUNT_OUT_FROM_EDGE_REM - MESSAGE_AVATAR_OVERLAP_REM}rem)`\n }\n});\n\n/\n @private\n /\nexport const useChatMyMessageStyles = makeStyles({\n root: {\n gridTemplateColumns: 'auto',\n gridTemplateAreas: `\n \"body\"\n `,\n gridGap: '0',\n paddingTop: '0',\n marginLeft: '0'\n },\n body: {\n paddingBottom: '10px',\n marginTop: '1rem',\n maxWidth: '100%',\n minWidth: `${CHAT_MESSAGE_CONTAINER_MIN_WIDTH_REM}rem`,\n marginLeft: '0rem',\n // This makes message bubble show border in high contrast mode making each message distinguishable\n ...shorthands.border('1px', 'solid', 'transparent'),\n '@media (hover: hover)': {\n '&:hover .ChatMyMessage__actions': {\n visibility: 'visible'\n }\n },\n '&:focus .ChatMyMessage__actions': {\n visibility: 'visible'\n },\n '& msft-mention': {\n color: tokens.colorStatusWarningBackground3,\n fontWeight: 600\n },\n '& img': {\n maxWidth: '100%',\n height: 'auto'\n }\n },\n bodyWithPlaceholderImage: {\n // Adding width and height to the placeholder image only for myMessages\n // because inline images sent from ACS doesn't have width and height in the image tag\n '& img[src=\"\"]': {\n width: '12rem',\n height: '12rem'\n }\n },\n bodyAttached: {\n marginTop: '0.125rem'\n },\n menu: {\n boxShadow: tokens.shadow4,\n backgroundColor: tokens.colorNeutralBackground1,\n position: 'absolute',\n top: '-19px',\n right: '0',\n ...shorthands.borderRadius(tokens.borderRadiusMedium),\n // Ensure the focus border around the message bubble doesn't overlap on top of more options button\n zIndex: 2,\n lineHeight: tokens.lineHeightBase100,\n visibility: 'hidden',\n '&:hover, &:focus': {\n cursor: 'pointer',\n visibility: 'visible'\n }\n },\n menuHidden: {\n visibility: 'hidden'\n },\n menuVisible: {\n visibility: 'visible'\n },\n multipleAttachmentsInViewing: {\n width: '100%',\n maxWidth: `${(_ATTACHMENT_CARD_WIDTH_IN_REM + _ATTACHMENT_CARD_MARGIN_IN_PX) 2}rem`\n },\n multipleAttachmentsInEditing: {\n // when in editing state, the chat message width should not be\n // limited by content length but occupying the full width instead\n width: '100%',\n float: 'right'\n }\n});\n\n/*\n @private\n /\nexport const newMessageButtonContainerStyle = mergeStyles({\n position: 'absolute',\n zIndex: NEW_MESSAGE_BUTTON_ZINDEX,\n bottom: 0,\n right: '1.5rem'\n});\n\n/\n @private\n /\nexport const chatMessageDateStyle: CSSProperties = {\n fontWeight: 600\n};\n\n/\n @private\n /\nexport const useChatMessageStyles = makeStyles({\n root: {\n paddingTop: '0'\n },\n body: {\n maxWidth: '100%',\n minWidth: `${CHAT_MESSAGE_CONTAINER_MIN_WIDTH_REM}rem`,\n marginRight: '0rem',\n paddingBottom: '10px',\n zIndex: CHAT_MESSAGE_ZINDEX,\n // This makes message bubble show border in high contrast mode making each message distinguishable\n ...shorthands.border('1px', 'solid', 'transparent'),\n '& > div:first-of-type': {\n flexWrap: 'wrap'\n },\n '& msft-mention': {\n color: tokens.colorStatusWarningBackground3,\n fontWeight: tokens.fontWeightSemibold\n },\n '& img': {\n maxWidth: '100% !important',\n // Add !important to make sure it won't be overridden by style defined in element\n height: 'auto !important'\n },\n '& video': {\n maxWidth: '100% !important',\n // Add !important to make sure it won't be overridden by style defined in element\n height: 'auto !important'\n },\n '& p': {\n // Deal with awkward padding seen in messages from Teams.\n // For more info see https://github.com/Azure/communication-ui-library/pull/1507\n ...shorthands.marginBlock('0.125rem')\n },\n '& blockquote': {\n backgroundColor: tokens.colorBrandBackgroundInverted,\n clear: 'left',\n minHeight: '2.25rem',\n width: 'fit-content',\n marginTop: '7px',\n marginRight: '0px',\n marginLeft: '0px',\n marginBottom: '7px',\n paddingTop: '7px',\n paddingRight: '15px',\n paddingLeft: '15px',\n paddingBottom: '7px',\n ...shorthands.border('solid'),\n ...shorthands.borderRadius('4px'),\n ...shorthands.borderWidth('1px'),\n ...shorthands.borderColor(tokens.colorNeutralStroke1Selected),\n borderLeftWidth: '4px'\n },\n '& code': {\n whiteSpace: 'pre-wrap'\n }\n },\n bodyWithoutAvatar: {\n marginTop: '0.125rem'\n },\n bodyWithAvatar: {\n marginTop: `0.375rem`\n },\n avatarNoOverlap: {\n marginLeft: `${-AVATAR_MARGIN_LEFT + AVATAR_MESSAGE_GAP_REM}rem`\n },\n avatarOverlap: {\n marginLeft: `${-AVATAR_MARGIN_LEFT - MESSAGE_AVATAR_OVERLAP_REM}rem`\n },\n multipleAttachments: {\n width: `${(_ATTACHMENT_CARD_WIDTH_IN_REM + _ATTACHMENT_CARD_MARGIN_IN_PX) 2}rem`\n }\n});\n\n/*\n @private\n /\nexport const useChatMessageCommonStyles = makeStyles({\n body: {\n '& table': {\n backgroundColor: tokens.colorBrandBackgroundInverted,\n borderCollapse: 'collapse',\n tableLayout: 'auto',\n width: '100%',\n '& tr': {\n ...shorthands.border('1px', 'solid', `${tokens.colorNeutralStrokeAccessible}`),\n '& td': {\n ...shorthands.border('1px', 'solid', `${tokens.colorNeutralStrokeAccessible}`),\n wordBreak: 'normal',\n paddingTop: '0px',\n paddingRight: '5px'\n }\n }\n }\n },\n bodyWithPlaceholderImage: {\n '& img[src=\"\"]': {\n backgroundColor: tokens.colorNeutralBackground1Selected,\n // this ensures safari won't have default rendering when image source\n // becomes invalid such as empty string in this case\n fontSize: '0',\n position: 'relative',\n clipPath: 'inset(0.3px)',\n display: 'flex'\n },\n '& img[src=\"\"]:after': {\n backgroundColor: tokens.colorNeutralBackground1Selected,\n content: `url(\"data:image/gif;base64,R0lGODlhAQABAAAAACw=\")`,\n backgroundSize: 'center',\n position: 'absolute',\n width: '100%',\n height: '100%',\n top: '0',\n left: '0',\n display: 'block'\n },\n '& .broken-image-wrapper': {\n width: '12rem',\n height: '12rem',\n marginTop: '0.75rem',\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n ...shorthands.outline('1px', 'solid', tokens.colorNeutralForegroundDisabled),\n backgroundColor: tokens.colorNeutralBackground2\n },\n '& .broken-image-wrapper:after': {\n content: `''`,\n maskImage: `url(\"${BROKEN_IMAGE_SVG_DATA}\");`,\n width: '3rem',\n height: '3rem',\n backgroundColor: `${tokens.colorNeutralForeground2}`\n }\n },\n failed: {\n //TODO: can we reuse a theme color here?\n backgroundColor: 'rgba(168, 0, 0, 0.2)'\n },\n blocked: {\n maxWidth: '100%',\n minWidth: `${CHAT_MESSAGE_CONTAINER_MIN_WIDTH_REM}rem`,\n marginRight: '0rem',\n color: tokens.colorNeutralForeground2,\n // This makes message bubble show border in high contrast mode making each message distinguishable\n ...shorthands.border('1px', 'solid', 'transparent'),\n '& i': {\n paddingTop: '0.25rem'\n },\n '& p': {\n // Deal with awkward padding seen in messages from Teams.\n // For more info see https://github.com/Azure/communication-ui-library/pull/1507\n ...shorthands.marginBlock('0.125rem'),\n paddingRight: '0.75rem',\n fontStyle: 'italic'\n },\n '& a': {\n ...shorthands.marginBlock('0.125rem'),\n fontStyle: 'normal',\n color: tokens.colorBrandForegroundLink,\n ...shorthands.textDecoration('none')\n }\n }\n});\n\n/\n @private\n /\nexport const gutterWithAvatar: ComponentSlotStyle = {\n paddingTop: '1.65rem',\n width: `${AVATAR_WIDTH_REM}rem`,\n position: 'relative',\n float: 'left',\n display: 'block',\n visibility: 'visible',\n zIndex: AVATAR_ZINDEX\n};\n\n/\n @private\n /\nexport const gutterWithHiddenAvatar: ComponentSlotStyle = {\n ...gutterWithAvatar,\n visibility: 'hidden',\n // we use this hidden avatar just as a width placeholder\n // the placeholder is needed for responsive bubble width\n height: 0\n};\n\n/\n @private\n /\nexport const newMessageButtonStyle = mergeStyles({\n float: 'right',\n width: 'fit-content'\n});\n\n/\n @private\n /\nexport const buttonWithIconStyles: IButtonStyles = {\n textContainer: {\n display: 'contents'\n }\n};\n\n/\n @private\n /\nexport const loadPreviousMessageButtonStyle = mergeStyles({\n border: 'none',\n minHeight: '1.5rem',\n '&:hover': {\n background: 'none'\n },\n '&:active': {\n background: 'none'\n }\n});\n\n/\n @private\n /\nexport const DownIconStyle = mergeStyles({\n marginRight: '0.5em'\n});\n\n/* @private /\nexport const dataLossIconStyle = mergeStyles({\n width: '1.25rem',\n height: '1.25rem'\n});\n\n/* @private */\nexport const messageTextContentStyles = mergeStyles({\n whiteSpace: 'pre-wrap'\n});"]}
1	+ {"version":3,"file":"MessageThread.styles.js","sourceRoot":"","sources":["../../../../../../preprocess-dist/react-components/src/components/styles/MessageThread.styles.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAAiB,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC7D,OAAO,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,EAAE,MAAM,4BAA4B,CAAC;AAE5E,OAAO,EAAE,iCAAiC,EAAE,MAAM,iCAAiC,CAAC;AAEpF,OAAO,EAAE,6BAA6B,EAAE,6BAA6B,EAAE,MAAM,yBAAyB,CAAC;AACvG,OAAO,EAAE,qBAAqB,EAAE,MAAM,gBAAgB,CAAC;AAEvD,sFAAsF;AACtF,8CAA8C;AAC9C,MAAM,oCAAoC,GAAG,IAAI,CAAC;AAElD,sEAAsE;AACtE,yEAAyE;AACzE,oFAAoF;AACpF,MAAM,gBAAgB,GAAG,CAAC,CAAC;AAC3B,MAAM,kBAAkB,GAAG,GAAG,CAAC;AAC/B,MAAM,sBAAsB,GAAG,KAAK,CAAC;AACrC,MAAM,gCAAgC,GAAG,CAAC,CAAC;AAE3C,gFAAgF;AAChF,MAAM,0BAA0B,GAAG,KAAK,CAAC;AACzC,MAAM,mBAAmB,GAAG,CAAC,CAAC;AAC9B,MAAM,aAAa,GAAG,CAAC,CAAC;AACxB,sDAAsD;AACtD,MAAM,yBAAyB,GAAG,CAAC,CAAC;AAEpC;;GAEG;AACH,MAAM,CAAC,MAAM,gCAAgC,GAAG,wBAAwB,CAAC;AAEzE;;GAEG;AACH,MAAM,CAAC,MAAM,2BAA2B,GAAG,WAAW,CAAC;IACrD,MAAM,EAAE,MAAM;IACd,KAAK,EAAE,MAAM;IACb,SAAS,EAAE,MAAM;IACjB,QAAQ,EAAE,MAAM;IAChB,QAAQ,EAAE,UAAU;IACpB,SAAS,EAAE,QAAQ;CACpB,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,kCAAkC,GAAG,WAAW,CAAC;IAC5D,MAAM,EAAE,MAAM;IACd,KAAK,EAAE,MAAM;IACb,QAAQ,EAAE,UAAU;CACrB,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,oBAAoB,GAAG,WAAW,CAAC;IAC9C,4EAA4E;IAC5E,4DAA4D;IAC5D,KAAK,EAAE,GAAG,iCAAiC,KAAK;CACjD,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,UAAU,CAAC;IACtC,IAAI;QACF,sEAAsE;QACtE,QAAQ,EAAE,MAAM,EAChB,UAAU,EAAE,QAAQ,EACpB,aAAa,EAAE,QAAQ,EACvB,YAAY,EAAE,QAAQ,EACtB,WAAW,EAAE,QAAQ,IAClB,UAAU,CAAC,MAAM,CAAC,MAAM,CAAC,GACzB,UAAU,CAAC,QAAQ,CAAC,MAAM,CAAC;QAC9B,oFAAoF;QACpF,wEAAwE;QACxE,MAAM,EAAE,MAAM,EACd,UAAU,EAAE;YACV,KAAK,EAAE,MAAM,CAAC,wBAAwB;SACvC,EACD,aAAa,EAAE;YACb,KAAK,EAAE,MAAM,CAAC,6BAA6B;SAC5C,EACD,WAAW,EAAE;YACX,KAAK,EAAE,MAAM,CAAC,6BAA6B;SAC5C,GACF;CACF,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,0BAA0B,GAAG,UAAU,CAAC;IACnD,UAAU,EAAE,EAAE;IACd,WAAW,gDACN,UAAU,CAAC,OAAO,CAAC,GAAG,CAAC,GACvB,UAAU,CAAC,MAAM,CAAC,GAAG,CAAC,KACzB,QAAQ,EAAE,MAAM,EAChB,QAAQ,EAAE,GAAG,oCAAoC,KAAK,GACvD;IACD,aAAa,gCACX,mBAAmB,EAAE,qBAAqB,EAC1C,iBAAiB,EAAE;;OAEhB,EACH,SAAS,EAAE,GAAG,EACd,OAAO,EAAE,GAAG,IACT,UAAU,CAAC,OAAO,CAAC,GAAG,CAAC,KAC1B,SAAS,EAAE,GAAG,EACd,WAAW,EAAE,GAAG,EAChB,YAAY,EAAE,GAAG,EACjB,UAAU,EAAE,MAAM,EAClB,KAAK,EAAE,mBAAmB,GAC3B;IACD,UAAU,kCACL,UAAU,CAAC,OAAO,CAAC,GAAG,CAAC,KAC1B,WAAW,EAAE,GAAG,EAChB,YAAY,EAAE,GAAG,EACjB,eAAe,EAAE,aAAa,EAC9B,QAAQ,EAAE,MAAM,EAChB,QAAQ,EAAE,GAAG,oCAAoC,KAAK,GACvD;IACD,aAAa,EAAE;QACb,KAAK,EAAE,MAAM;QACb,SAAS,EAAE,GAAG;KACf;IACD,iBAAiB,EAAE;QACjB,UAAU,EAAE,GAAG,kBAAkB,KAAK;QACtC,SAAS,EAAE,GAAG;KACf;IACD,gBAAgB,EAAE;QAChB,UAAU,EAAE,CAAC;QACb,SAAS,EAAE,CAAC;KACb;IACD,cAAc,EAAE;QACd,UAAU,EAAE,GAAG;QACf,SAAS,EAAE,SAAS;KACrB;IACD,eAAe,EAAE;QACf,KAAK,EAAE,eAAe,gBAAgB,GAAG,gCAAgC,GAAG,sBAAsB,MAAM;KACzG;IACD,aAAa,EAAE;QACb,KAAK,EAAE,eAAe,gBAAgB,GAAG,gCAAgC,GAAG,0BAA0B,MAAM;KAC7G;CACF,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,sBAAsB,GAAG,UAAU,CAAC;IAC/C,IAAI,EAAE;QACJ,mBAAmB,EAAE,MAAM;QAC3B,iBAAiB,EAAE;;OAEhB;QACH,OAAO,EAAE,GAAG;QACZ,UAAU,EAAE,GAAG;QACf,UAAU,EAAE,GAAG;KAChB;IACD,IAAI,gCACF,aAAa,EAAE,MAAM,EACrB,SAAS,EAAE,MAAM,EACjB,QAAQ,EAAE,MAAM,EAChB,QAAQ,EAAE,GAAG,oCAAoC,KAAK,EACtD,UAAU,EAAE,MAAM,IAEf,UAAU,CAAC,MAAM,CAAC,KAAK,EAAE,OAAO,EAAE,aAAa,CAAC,KACnD,uBAAuB,EAAE;YACvB,iCAAiC,EAAE;gBACjC,UAAU,EAAE,SAAS;aACtB;SACF,EACD,iCAAiC,EAAE;YACjC,UAAU,EAAE,SAAS;SACtB,EACD,gBAAgB,EAAE;YAChB,KAAK,EAAE,MAAM,CAAC,6BAA6B;YAC3C,UAAU,EAAE,GAAG;SAChB,EACD,OAAO,EAAE;YACP,QAAQ,EAAE,MAAM;YAChB,MAAM,EAAE,MAAM;SACf,GACF;IACD,YAAY,EAAE;QACZ,SAAS,EAAE,UAAU;KACtB;IACD,IAAI,gCACF,SAAS,EAAE,MAAM,CAAC,OAAO,EACzB,eAAe,EAAE,MAAM,CAAC,uBAAuB,EAC/C,QAAQ,EAAE,UAAU,EACpB,GAAG,EAAE,OAAO,EACZ,KAAK,EAAE,GAAG,IACP,UAAU,CAAC,YAAY,CAAC,MAAM,CAAC,kBAAkB,CAAC;QACrD,kGAAkG;QAClG,MAAM,EAAE,CAAC,EACT,UAAU,EAAE,MAAM,CAAC,iBAAiB,EACpC,UAAU,EAAE,QAAQ,EACpB,kBAAkB,EAAE;YAClB,MAAM,EAAE,SAAS;YACjB,UAAU,EAAE,SAAS;SACtB,GACF;IACD,UAAU,EAAE;QACV,UAAU,EAAE,QAAQ;KACrB;IACD,WAAW,EAAE;QACX,UAAU,EAAE,SAAS;KACtB;IACD,4BAA4B,EAAE;QAC5B,KAAK,EAAE,MAAM;QACb,QAAQ,EAAE,GAAG,CAAC,6BAA6B,GAAG,6BAA6B,CAAC,GAAG,CAAC,KAAK;KACtF;IACD,4BAA4B,EAAE;QAC5B,8DAA8D;QAC9D,iEAAiE;QACjE,KAAK,EAAE,MAAM;QACb,KAAK,EAAE,OAAO;KACf;CACF,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,8BAA8B,GAAG,WAAW,CAAC;IACxD,QAAQ,EAAE,UAAU;IACpB,MAAM,EAAE,yBAAyB;IACjC,MAAM,EAAE,CAAC;IACT,KAAK,EAAE,QAAQ;CAChB,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,oBAAoB,GAAkB;IACjD,UAAU,EAAE,GAAG;CAChB,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,oBAAoB,GAAG,UAAU,CAAC;IAC7C,IAAI,EAAE;QACJ,UAAU,EAAE,GAAG;KAChB;IACD,IAAI,gCACF,QAAQ,EAAE,MAAM,EAChB,QAAQ,EAAE,GAAG,oCAAoC,KAAK,EACtD,WAAW,EAAE,MAAM,EACnB,aAAa,EAAE,MAAM,EACrB,MAAM,EAAE,mBAAmB,IAExB,UAAU,CAAC,MAAM,CAAC,KAAK,EAAE,OAAO,EAAE,aAAa,CAAC,KACnD,uBAAuB,EAAE;YACvB,QAAQ,EAAE,MAAM;SACjB,EACD,gBAAgB,EAAE;YAChB,KAAK,EAAE,MAAM,CAAC,6BAA6B;YAC3C,UAAU,EAAE,MAAM,CAAC,kBAAkB;SACtC,EACD,OAAO,EAAE;YACP,QAAQ,EAAE,iBAAiB;YAC3B,iFAAiF;YACjF,MAAM,EAAE,iBAAiB;SAC1B,EACD,SAAS,EAAE;YACT,QAAQ,EAAE,iBAAiB;YAC3B,iFAAiF;YACjF,MAAM,EAAE,iBAAiB;SAC1B,EACD,KAAK,oBAGA,UAAU,CAAC,WAAW,CAAC,UAAU,CAAC,GAEvC,cAAc,0EACZ,eAAe,EAAE,MAAM,CAAC,4BAA4B,EACpD,KAAK,EAAE,MAAM,EACb,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,aAAa,EACpB,SAAS,EAAE,KAAK,EAChB,WAAW,EAAE,KAAK,EAClB,UAAU,EAAE,KAAK,EACjB,YAAY,EAAE,KAAK,EACnB,UAAU,EAAE,KAAK,EACjB,YAAY,EAAE,MAAM,EACpB,WAAW,EAAE,MAAM,EACnB,aAAa,EAAE,KAAK,IACjB,UAAU,CAAC,MAAM,CAAC,OAAO,CAAC,GAC1B,UAAU,CAAC,YAAY,CAAC,KAAK,CAAC,GAC9B,UAAU,CAAC,WAAW,CAAC,KAAK,CAAC,GAC7B,UAAU,CAAC,WAAW,CAAC,MAAM,CAAC,2BAA2B,CAAC,KAC7D,eAAe,EAAE,KAAK,KAExB,QAAQ,EAAE;YACR,UAAU,EAAE,UAAU;SACvB,GACF;IACD,iBAAiB,EAAE;QACjB,SAAS,EAAE,UAAU;KACtB;IACD,cAAc,EAAE;QACd,SAAS,EAAE,UAAU;KACtB;IACD,eAAe,EAAE;QACf,UAAU,EAAE,GAAG,CAAC,kBAAkB,GAAG,sBAAsB,KAAK;KACjE;IACD,aAAa,EAAE;QACb,UAAU,EAAE,GAAG,CAAC,kBAAkB,GAAG,0BAA0B,KAAK;KACrE;IACD,mBAAmB,EAAE;QACnB,KAAK,EAAE,GAAG,CAAC,6BAA6B,GAAG,6BAA6B,CAAC,GAAG,CAAC,KAAK;KACnF;CACF,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,0BAA0B,GAAG,UAAU,CAAC;IACnD,IAAI,EAAE;QACJ,SAAS,EAAE;YACT,eAAe,EAAE,MAAM,CAAC,4BAA4B;YACpD,cAAc,EAAE,UAAU;YAC1B,WAAW,EAAE,MAAM;YACnB,KAAK,EAAE,MAAM;YACb,MAAM,kCACD,UAAU,CAAC,MAAM,CAAC,KAAK,EAAE,OAAO,EAAE,GAAG,MAAM,CAAC,4BAA4B,EAAE,CAAC,KAC9E,MAAM,kCACD,UAAU,CAAC,MAAM,CAAC,KAAK,EAAE,OAAO,EAAE,GAAG,MAAM,CAAC,4BAA4B,EAAE,CAAC,KAC9E,SAAS,EAAE,QAAQ,EACnB,UAAU,EAAE,KAAK,EACjB,YAAY,EAAE,KAAK,MAEtB;SACF;KACF;IACD,wBAAwB,EAAE;QACxB,eAAe,EAAE;YACf,eAAe,EAAE,MAAM,CAAC,+BAA+B;YACvD,qEAAqE;YACrE,oDAAoD;YACpD,QAAQ,EAAE,GAAG;YACb,QAAQ,EAAE,UAAU;YACpB,QAAQ,EAAE,cAAc;YACxB,OAAO,EAAE,MAAM;SAChB;QACD,qBAAqB,EAAE;YACrB,eAAe,EAAE,MAAM,CAAC,+BAA+B;YACvD,OAAO,EAAE,mDAAmD;YAC5D,cAAc,EAAE,QAAQ;YACxB,QAAQ,EAAE,UAAU;YACpB,KAAK,EAAE,MAAM;YACb,MAAM,EAAE,MAAM;YACd,GAAG,EAAE,GAAG;YACR,IAAI,EAAE,GAAG;YACT,OAAO,EAAE,OAAO;SACjB;QACD,yBAAyB,gCACvB,KAAK,EAAE,OAAO,EACd,MAAM,EAAE,OAAO,EACf,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,MAAM,EACf,cAAc,EAAE,QAAQ,EACxB,UAAU,EAAE,QAAQ,IACjB,UAAU,CAAC,OAAO,CAAC,KAAK,EAAE,OAAO,EAAE,MAAM,CAAC,8BAA8B,CAAC,KAC5E,eAAe,EAAE,MAAM,CAAC,uBAAuB,GAChD;QACD,+BAA+B,EAAE;YAC/B,OAAO,EAAE,IAAI;YACb,SAAS,EAAE,QAAQ,qBAAqB,KAAK;YAC7C,KAAK,EAAE,MAAM;YACb,MAAM,EAAE,MAAM;YACd,eAAe,EAAE,GAAG,MAAM,CAAC,uBAAuB,EAAE;SACrD;KACF;IACD,MAAM,EAAE;QACN,wCAAwC;QACxC,eAAe,EAAE,sBAAsB;KACxC;IACD,OAAO,gCACL,QAAQ,EAAE,MAAM,EAChB,QAAQ,EAAE,GAAG,oCAAoC,KAAK,EACtD,WAAW,EAAE,MAAM,EACnB,KAAK,EAAE,MAAM,CAAC,uBAAuB,IAElC,UAAU,CAAC,MAAM,CAAC,KAAK,EAAE,OAAO,EAAE,aAAa,CAAC,KACnD,KAAK,EAAE;YACL,UAAU,EAAE,SAAS;SACtB,EACD,KAAK,kCAGA,UAAU,CAAC,WAAW,CAAC,UAAU,CAAC,KACrC,YAAY,EAAE,SAAS,EACvB,SAAS,EAAE,QAAQ,KAErB,KAAK,gDACA,UAAU,CAAC,WAAW,CAAC,UAAU,CAAC,KACrC,SAAS,EAAE,QAAQ,EACnB,KAAK,EAAE,MAAM,CAAC,wBAAwB,KACnC,UAAU,CAAC,cAAc,CAAC,MAAM,CAAC,IAEvC;CACF,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAuB;IAClD,UAAU,EAAE,SAAS;IACrB,KAAK,EAAE,GAAG,gBAAgB,KAAK;IAC/B,QAAQ,EAAE,UAAU;IACpB,KAAK,EAAE,MAAM;IACb,OAAO,EAAE,OAAO;IAChB,UAAU,EAAE,SAAS;IACrB,MAAM,EAAE,aAAa;CACtB,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,sBAAsB,mCAC9B,gBAAgB,KACnB,UAAU,EAAE,QAAQ;IACpB,wDAAwD;IACxD,wDAAwD;IACxD,MAAM,EAAE,CAAC,GACV,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,qBAAqB,GAAG,WAAW,CAAC;IAC/C,KAAK,EAAE,OAAO;IACd,KAAK,EAAE,aAAa;CACrB,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,oBAAoB,GAAkB;IACjD,aAAa,EAAE;QACb,OAAO,EAAE,UAAU;KACpB;CACF,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,8BAA8B,GAAG,WAAW,CAAC;IACxD,MAAM,EAAE,MAAM;IACd,SAAS,EAAE,QAAQ;IACnB,SAAS,EAAE;QACT,UAAU,EAAE,MAAM;KACnB;IACD,UAAU,EAAE;QACV,UAAU,EAAE,MAAM;KACnB;CACF,CAAC,CAAC;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,WAAW,CAAC;IACvC,WAAW,EAAE,OAAO;CACrB,CAAC,CAAC;AAEH,eAAe;AACf,MAAM,CAAC,MAAM,iBAAiB,GAAG,WAAW,CAAC;IAC3C,KAAK,EAAE,SAAS;IAChB,MAAM,EAAE,SAAS;CAClB,CAAC,CAAC;AAEH,eAAe;AACf,MAAM,CAAC,MAAM,wBAAwB,GAAG,WAAW,CAAC;IAClD,UAAU,EAAE,UAAU;CACvB,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { IButtonStyles, mergeStyles } from '@fluentui/react';\nimport { makeStyles, shorthands, tokens } from '@fluentui/react-components';\nimport { CSSProperties } from 'react';\nimport { MESSAGE_STATUS_INDICATOR_SIZE_REM } from './MessageStatusIndicator.styles';\nimport { ComponentSlotStyle } from '../../types';\nimport { _ATTACHMENT_CARD_MARGIN_IN_PX, _ATTACHMENT_CARD_WIDTH_IN_REM } from './AttachmentCard.styles';\nimport { BROKEN_IMAGE_SVG_DATA } from './Common.style';\n\n// Minimum chat bubble width. This matches the minimum chat bubble width from FluentUI\n// that can contain a message and a timestamp.\nconst CHAT_MESSAGE_CONTAINER_MIN_WIDTH_REM = 6.25;\n\n// Chat messages should span just short of the width of the container.\n// When calculating the width of a message we also must take into account\n// the width of the avatar/gutter and the gap between the message and avatar/gutter.\nconst AVATAR_WIDTH_REM = 2;\nconst AVATAR_MARGIN_LEFT = 2.5;\nconst AVATAR_MESSAGE_GAP_REM = 0.125;\nconst MESSAGE_AMOUNT_OUT_FROM_EDGE_REM = 2;\n\n// Avatars should display on top of chat messages when the chat thread is narrow\nconst MESSAGE_AVATAR_OVERLAP_REM = 0.925;\nconst CHAT_MESSAGE_ZINDEX = 1;\nconst AVATAR_ZINDEX = 2;\n// new message button should be on top of chat message\nconst NEW_MESSAGE_BUTTON_ZINDEX = 2;\n\n/*\n @private\n /\nexport const chatMyMessageActionMenuClassName = 'ChatMyMessage__actions';\n\n/\n @private\n /\nexport const messageThreadContainerStyle = mergeStyles({\n height: '100%',\n width: '100%',\n maxHeight: '100%',\n overflow: 'auto',\n position: 'relative',\n alignSelf: 'center'\n});\n\n/\n @private\n /\nexport const messageThreadWrapperContainerStyle = mergeStyles({\n height: '100%',\n width: '100%',\n position: 'relative'\n});\n\n/\n @private\n /\nexport const noMessageStatusStyle = mergeStyles({\n // This should match the size of the message status indicator icon to ensure\n // multiple messages sent by the user are aligned correctly.\n width: `${MESSAGE_STATUS_INDICATOR_SIZE_REM}rem`\n});\n\n/\n @private\n /\nexport const useChatStyles = makeStyles({\n root: {\n // chat components sets max width value to 1056px, override it to 100%\n maxWidth: '100%',\n paddingTop: '0.8rem',\n paddingBottom: '0.5rem',\n paddingRight: '0.6rem',\n paddingLeft: '0.6rem',\n ...shorthands.border('none'),\n ...shorthands.overflow('auto'),\n // `height: 100%` ensures that the Chat component covers 100% of it's parents height\n // to prevent intermittent scrollbars when GIFs are present in the chat.\n height: '100%',\n '& a:link': {\n color: tokens.colorBrandForegroundLink\n },\n '& a:visited': {\n color: tokens.colorBrandForegroundLinkHover\n },\n '& a:hover': {\n color: tokens.colorBrandForegroundLinkHover\n }\n }\n});\n\n/\n @private\n /\nexport const useChatMessageRenderStyles = makeStyles({\n rootCommon: {},\n rootMessage: {\n ...shorthands.padding('0'),\n ...shorthands.margin('0'),\n maxWidth: '100%',\n minWidth: `${CHAT_MESSAGE_CONTAINER_MIN_WIDTH_REM}rem`\n },\n rootMyMessage: {\n gridTemplateColumns: 'auto fit-content(0)',\n gridTemplateAreas: `\n \"body status\"\n `,\n columnGap: '0',\n gridGap: '0',\n ...shorthands.padding('0'),\n marginTop: '0',\n marginRight: '0',\n marginBottom: '0',\n marginLeft: '50px',\n width: `calc(100% - 50px)`\n },\n bodyCommon: {\n ...shorthands.padding('0'),\n marginRight: '0',\n marginBottom: '0',\n backgroundColor: 'transparent',\n maxWidth: '100%',\n minWidth: `${CHAT_MESSAGE_CONTAINER_MIN_WIDTH_REM}rem`\n },\n bodyMyMessage: {\n width: '100%',\n marginTop: '0'\n },\n bodyWithoutAvatar: {\n marginLeft: `${AVATAR_MARGIN_LEFT}rem`,\n marginTop: '0'\n },\n bodyHiddenAvatar: {\n marginLeft: 0,\n marginTop: 0\n },\n bodyWithAvatar: {\n marginLeft: `0`,\n marginTop: '0.75rem'\n },\n avatarNoOverlap: {\n width: `calc(100% - ${AVATAR_WIDTH_REM + MESSAGE_AMOUNT_OUT_FROM_EDGE_REM + AVATAR_MESSAGE_GAP_REM}rem)`\n },\n avatarOverlap: {\n width: `calc(100% - ${AVATAR_WIDTH_REM + MESSAGE_AMOUNT_OUT_FROM_EDGE_REM - MESSAGE_AVATAR_OVERLAP_REM}rem)`\n }\n});\n\n/\n @private\n /\nexport const useChatMyMessageStyles = makeStyles({\n root: {\n gridTemplateColumns: 'auto',\n gridTemplateAreas: `\n \"body\"\n `,\n gridGap: '0',\n paddingTop: '0',\n marginLeft: '0'\n },\n body: {\n paddingBottom: '10px',\n marginTop: '1rem',\n maxWidth: '100%',\n minWidth: `${CHAT_MESSAGE_CONTAINER_MIN_WIDTH_REM}rem`,\n marginLeft: '0rem',\n // This makes message bubble show border in high contrast mode making each message distinguishable\n ...shorthands.border('1px', 'solid', 'transparent'),\n '@media (hover: hover)': {\n '&:hover .ChatMyMessage__actions': {\n visibility: 'visible'\n }\n },\n '&:focus .ChatMyMessage__actions': {\n visibility: 'visible'\n },\n '& msft-mention': {\n color: tokens.colorStatusWarningBackground3,\n fontWeight: 600\n },\n '& img': {\n maxWidth: '100%',\n height: 'auto'\n }\n },\n bodyAttached: {\n marginTop: '0.125rem'\n },\n menu: {\n boxShadow: tokens.shadow4,\n backgroundColor: tokens.colorNeutralBackground1,\n position: 'absolute',\n top: '-19px',\n right: '0',\n ...shorthands.borderRadius(tokens.borderRadiusMedium),\n // Ensure the focus border around the message bubble doesn't overlap on top of more options button\n zIndex: 2,\n lineHeight: tokens.lineHeightBase100,\n visibility: 'hidden',\n '&:hover, &:focus': {\n cursor: 'pointer',\n visibility: 'visible'\n }\n },\n menuHidden: {\n visibility: 'hidden'\n },\n menuVisible: {\n visibility: 'visible'\n },\n multipleAttachmentsInViewing: {\n width: '100%',\n maxWidth: `${(_ATTACHMENT_CARD_WIDTH_IN_REM + _ATTACHMENT_CARD_MARGIN_IN_PX) 2}rem`\n },\n multipleAttachmentsInEditing: {\n // when in editing state, the chat message width should not be\n // limited by content length but occupying the full width instead\n width: '100%',\n float: 'right'\n }\n});\n\n/*\n @private\n /\nexport const newMessageButtonContainerStyle = mergeStyles({\n position: 'absolute',\n zIndex: NEW_MESSAGE_BUTTON_ZINDEX,\n bottom: 0,\n right: '1.5rem'\n});\n\n/\n @private\n /\nexport const chatMessageDateStyle: CSSProperties = {\n fontWeight: 600\n};\n\n/\n @private\n /\nexport const useChatMessageStyles = makeStyles({\n root: {\n paddingTop: '0'\n },\n body: {\n maxWidth: '100%',\n minWidth: `${CHAT_MESSAGE_CONTAINER_MIN_WIDTH_REM}rem`,\n marginRight: '0rem',\n paddingBottom: '10px',\n zIndex: CHAT_MESSAGE_ZINDEX,\n // This makes message bubble show border in high contrast mode making each message distinguishable\n ...shorthands.border('1px', 'solid', 'transparent'),\n '& > div:first-of-type': {\n flexWrap: 'wrap'\n },\n '& msft-mention': {\n color: tokens.colorStatusWarningBackground3,\n fontWeight: tokens.fontWeightSemibold\n },\n '& img': {\n maxWidth: '100% !important',\n // Add !important to make sure it won't be overridden by style defined in element\n height: 'auto !important'\n },\n '& video': {\n maxWidth: '100% !important',\n // Add !important to make sure it won't be overridden by style defined in element\n height: 'auto !important'\n },\n '& p': {\n // Deal with awkward padding seen in messages from Teams.\n // For more info see https://github.com/Azure/communication-ui-library/pull/1507\n ...shorthands.marginBlock('0.125rem')\n },\n '& blockquote': {\n backgroundColor: tokens.colorBrandBackgroundInverted,\n clear: 'left',\n minHeight: '2.25rem',\n width: 'fit-content',\n marginTop: '7px',\n marginRight: '0px',\n marginLeft: '0px',\n marginBottom: '7px',\n paddingTop: '7px',\n paddingRight: '15px',\n paddingLeft: '15px',\n paddingBottom: '7px',\n ...shorthands.border('solid'),\n ...shorthands.borderRadius('4px'),\n ...shorthands.borderWidth('1px'),\n ...shorthands.borderColor(tokens.colorNeutralStroke1Selected),\n borderLeftWidth: '4px'\n },\n '& code': {\n whiteSpace: 'pre-wrap'\n }\n },\n bodyWithoutAvatar: {\n marginTop: '0.125rem'\n },\n bodyWithAvatar: {\n marginTop: `0.375rem`\n },\n avatarNoOverlap: {\n marginLeft: `${-AVATAR_MARGIN_LEFT + AVATAR_MESSAGE_GAP_REM}rem`\n },\n avatarOverlap: {\n marginLeft: `${-AVATAR_MARGIN_LEFT - MESSAGE_AVATAR_OVERLAP_REM}rem`\n },\n multipleAttachments: {\n width: `${(_ATTACHMENT_CARD_WIDTH_IN_REM + _ATTACHMENT_CARD_MARGIN_IN_PX) 2}rem`\n }\n});\n\n/*\n @private\n /\nexport const useChatMessageCommonStyles = makeStyles({\n body: {\n '& table': {\n backgroundColor: tokens.colorBrandBackgroundInverted,\n borderCollapse: 'collapse',\n tableLayout: 'auto',\n width: '100%',\n '& tr': {\n ...shorthands.border('1px', 'solid', `${tokens.colorNeutralStrokeAccessible}`),\n '& td': {\n ...shorthands.border('1px', 'solid', `${tokens.colorNeutralStrokeAccessible}`),\n wordBreak: 'normal',\n paddingTop: '0px',\n paddingRight: '5px'\n }\n }\n }\n },\n bodyWithPlaceholderImage: {\n '& img[src=\"\"]': {\n backgroundColor: tokens.colorNeutralBackground1Selected,\n // this ensures safari won't have default rendering when image source\n // becomes invalid such as empty string in this case\n fontSize: '0',\n position: 'relative',\n clipPath: 'inset(0.3px)',\n display: 'flex'\n },\n '& img[src=\"\"]:after': {\n backgroundColor: tokens.colorNeutralBackground1Selected,\n content: `url(\"data:image/gif;base64,R0lGODlhAQABAAAAACw=\")`,\n backgroundSize: 'center',\n position: 'absolute',\n width: '100%',\n height: '100%',\n top: '0',\n left: '0',\n display: 'block'\n },\n '& .broken-image-wrapper': {\n width: '12rem',\n height: '12rem',\n marginTop: '0.75rem',\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n ...shorthands.outline('1px', 'solid', tokens.colorNeutralForegroundDisabled),\n backgroundColor: tokens.colorNeutralBackground2\n },\n '& .broken-image-wrapper:after': {\n content: `''`,\n maskImage: `url(\"${BROKEN_IMAGE_SVG_DATA}\");`,\n width: '3rem',\n height: '3rem',\n backgroundColor: `${tokens.colorNeutralForeground2}`\n }\n },\n failed: {\n //TODO: can we reuse a theme color here?\n backgroundColor: 'rgba(168, 0, 0, 0.2)'\n },\n blocked: {\n maxWidth: '100%',\n minWidth: `${CHAT_MESSAGE_CONTAINER_MIN_WIDTH_REM}rem`,\n marginRight: '0rem',\n color: tokens.colorNeutralForeground2,\n // This makes message bubble show border in high contrast mode making each message distinguishable\n ...shorthands.border('1px', 'solid', 'transparent'),\n '& i': {\n paddingTop: '0.25rem'\n },\n '& p': {\n // Deal with awkward padding seen in messages from Teams.\n // For more info see https://github.com/Azure/communication-ui-library/pull/1507\n ...shorthands.marginBlock('0.125rem'),\n paddingRight: '0.75rem',\n fontStyle: 'italic'\n },\n '& a': {\n ...shorthands.marginBlock('0.125rem'),\n fontStyle: 'normal',\n color: tokens.colorBrandForegroundLink,\n ...shorthands.textDecoration('none')\n }\n }\n});\n\n/\n @private\n /\nexport const gutterWithAvatar: ComponentSlotStyle = {\n paddingTop: '1.65rem',\n width: `${AVATAR_WIDTH_REM}rem`,\n position: 'relative',\n float: 'left',\n display: 'block',\n visibility: 'visible',\n zIndex: AVATAR_ZINDEX\n};\n\n/\n @private\n /\nexport const gutterWithHiddenAvatar: ComponentSlotStyle = {\n ...gutterWithAvatar,\n visibility: 'hidden',\n // we use this hidden avatar just as a width placeholder\n // the placeholder is needed for responsive bubble width\n height: 0\n};\n\n/\n @private\n /\nexport const newMessageButtonStyle = mergeStyles({\n float: 'right',\n width: 'fit-content'\n});\n\n/\n @private\n /\nexport const buttonWithIconStyles: IButtonStyles = {\n textContainer: {\n display: 'contents'\n }\n};\n\n/\n @private\n /\nexport const loadPreviousMessageButtonStyle = mergeStyles({\n border: 'none',\n minHeight: '1.5rem',\n '&:hover': {\n background: 'none'\n },\n '&:active': {\n background: 'none'\n }\n});\n\n/\n @private\n /\nexport const DownIconStyle = mergeStyles({\n marginRight: '0.5em'\n});\n\n/* @private /\nexport const dataLossIconStyle = mergeStyles({\n width: '1.25rem',\n height: '1.25rem'\n});\n\n/* @private */\nexport const messageTextContentStyles = mergeStyles({\n whiteSpace: 'pre-wrap'\n});"]}

package/dist/dist-esm/react-components/src/components/utils/ChatMessageComponentAsEditBoxUtils.d.ts CHANGED Viewed

@@ -1,6 +1,4 @@
 /// <reference types="react" />
-import { AttachmentMetadata } from "../../../../acs-ui-common/src";
-import { ChatMessage } from '../../types';
 /**
  * @private
  */
@@ -16,40 +14,5 @@ export type MessageState = 'OK' | 'too short' | 'too long';
 /**
  * @private
  */
-export declare function getMessageState(messageText: string, attachments: AttachmentMetadata[]): MessageState;
-/**
- * @private
- * @TODO: Remove when file-sharing feature becomes stable.
- */
-export declare function getMessageWithAttachmentMetadata(message: ChatMessage): AttachmentMetadata[] | undefined;
-/**
- * @private
- */
-interface Action {
-    type: string;
-}
-/**
- * Currently `Actions` only have one action which is to remove.
- * But in the future, we may have more actions like `add`, `update`, etc.
- * And this action would be a uinon of all those actions.
- * i.e. `type Actions = RemoveAction | AddAction | UpdateAction;`
- * @private
- */
-type Actions = RemoveAction;
-/**
- * @private
- */
-interface RemoveAction extends Action {
-    type: 'remove';
-    id: string;
-}
-/**
- * @internal
- */
-export declare const attachmentMetadataReducer: (state: AttachmentMetadata[], action: Actions) => AttachmentMetadata[];
-/**
- * @internal
- */
-export declare const doesMessageContainMultipleAttachments: (message: ChatMessage) => boolean;
-export {};
+export declare function getMessageState(messageText: string): MessageState;
 //# sourceMappingURL=ChatMessageComponentAsEditBoxUtils.d.ts.map

package/dist/dist-esm/react-components/src/components/utils/ChatMessageComponentAsEditBoxUtils.js CHANGED Viewed

@@ -15,40 +15,13 @@ export const onRenderCancelIcon = (className) => {
 export const onRenderSubmitIcon = (className) => {
     return React.createElement(Icon, { iconName: 'EditBoxSubmit', className: className });
 };
-function isMessageEmpty(messageText, attachmentMetadata) {
-    return messageText.trim().length === 0 && (attachmentMetadata === null || attachmentMetadata === void 0 ? void 0 : attachmentMetadata.length) === 0;
+function isMessageEmpty(messageText) {
     return messageText.trim().length === 0;
 }
 /**
  * @private
  */
-export function getMessageState(messageText, attachments) {
-    return isMessageEmpty(messageText, attachments) ? 'too short' : isMessageTooLong(messageText.length) ? 'too long' : 'OK';
+export function getMessageState(messageText) {
+    return isMessageEmpty(messageText) ? 'too short' : isMessageTooLong(messageText.length) ? 'too long' : 'OK';
 }
-/**
- * @private
- * @TODO: Remove when file-sharing feature becomes stable.
- */
-export function getMessageWithAttachmentMetadata(message) {
-    return message.attachments;
-}
-/**
- * @internal
- */
-export const attachmentMetadataReducer = (state, action) => {
-    switch (action.type) {
-        case 'remove':
-            return state.filter(v => v.id !== action.id);
-        default:
-            return state;
-    }
-};
-/**
- * @internal
- */
-export const doesMessageContainMultipleAttachments = (message) => {
-    var _a, _b;
-    const length = (_b = (_a = message.attachments) === null || _a === void 0 ? void 0 : _a.length) !== null && _b !== void 0 ? _b : 0;
-    return length > 1;
-};
 //# sourceMappingURL=ChatMessageComponentAsEditBoxUtils.js.map

package/dist/dist-esm/react-components/src/components/utils/ChatMessageComponentAsEditBoxUtils.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ChatMessageComponentAsEditBoxUtils.js","sourceRoot":"","sources":["../../../../../../preprocess-dist/react-components/src/components/utils/ChatMessageComponentAsEditBoxUtils.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;~~AAEvC~~,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;~~AAGlD~~;;GAEG;AACH,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAAC,SAAiB,EAAe,EAAE;IACnE,OAAO,oBAAC,IAAI,IAAC,QAAQ,EAAE,eAAe,EAAE,SAAS,EAAE,SAAS,GAAI,CAAC;AACnE,CAAC,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAAC,SAAiB,EAAe,EAAE;IACnE,OAAO,oBAAC,IAAI,IAAC,QAAQ,EAAE,eAAe,EAAE,SAAS,EAAE,SAAS,GAAI,CAAC;AACnE,CAAC,CAAC;AAMF,SAAS,cAAc,CAAC,WAAmB~~,EAAE,kBAAyC~~;~~IACpF~~,OAAO,WAAW,CAAC,IAAI,EAAE,CAAC,MAAM,KAAK,CAAC,~~IAAI,CAAA,kBAAkB,aAAlB,kBAAkB,uBAAlB,kBAAkB,CAAE,MAAM,MAAK,~~CAAC~~,CAAC~~;~~IAC3E,OAAO,WAAW,CAAC,IAAI,EAAE,CAAC,MAAM,KAAK,CAAC,CAAC;~~AACzC,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,eAAe,CAAC,WAAmB~~,EAAE,WAAiC~~;~~IACpF~~,OAAO,cAAc,CAAC,WAAW,~~EAAE,WAAW,~~CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,gBAAgB,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC;~~AAC3H~~,CAAC;AACD;;;GAGG;AACH,MAAM,UAAU,gCAAgC,CAAC,OAAoB;IACnE,OAAO,OAAO,CAAC,WAAW,CAAC;AAC7B,CAAC;AAsBD;;GAEG;AACH,MAAM,CAAC,MAAM,yBAAyB,GAAG,CAAC,KAA2B,EAAE,MAAe,EAAwB,EAAE;IAC9G,QAAQ,MAAM,CAAC,IAAI,EAAE,CAAC;QACpB,KAAK,QAAQ;YACX,OAAO,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,MAAM,CAAC,EAAE,CAAC,CAAC;QAC/C;YACE,OAAO,KAAK,CAAC;IACjB,CAAC;AACH,CAAC,CAAC;AACF;;GAEG;AACH,MAAM,CAAC,MAAM,qCAAqC,GAAG,CAAC,OAAoB,EAAW,EAAE;;IACrF,MAAM,MAAM,GAAG,MAAA,MAAA,OAAO,CAAC,WAAW,0CAAE,MAAM,mCAAI,CAAC,CAAC;IAChD,OAAO,MAAM,GAAG,CAAC,CAAC;AACpB,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React from 'react';\nimport { Icon } from '@fluentui/react';\nimport { ~~AttachmentMetadata } from '@internal/acs-ui-common';\nimport {~~ isMessageTooLong } from './SendBoxUtils';\~~nimport { ChatMessage } from '../../types';\~~n\n/*\n @private\n /\nexport const onRenderCancelIcon = (className: string): JSX.Element => {\n return <Icon iconName={'EditBoxCancel'} className={className} />;\n};\n\n/\n @private\n /\nexport const onRenderSubmitIcon = (className: string): JSX.Element => {\n return <Icon iconName={'EditBoxSubmit'} className={className} />;\n};\n\n/\n Enumeration for whether a message can be sent\n /\nexport type MessageState = 'OK' \| 'too short' \| 'too long';\nfunction isMessageEmpty(messageText: string~~, attachmentMetadata?: AttachmentMetadata[]~~): boolean {\n return messageText.trim().length === 0 ~~&& attachmentMetadata?.length === 0~~;\n ~~return messageText.trim().length === 0;\n~~}\n\n/\n @private\n /\nexport function getMessageState(messageText: string~~, attachments: AttachmentMetadata[]~~): MessageState {\n return isMessageEmpty(messageText~~, attachments~~) ? 'too short' : isMessageTooLong(messageText.length) ? 'too long' : 'OK';\n}\n/\n @private\n * @TODO: Remove when file-sharing feature becomes stable.\n /\nexport function getMessageWithAttachmentMetadata(message: ChatMessage): AttachmentMetadata[] \| undefined {\n return message.attachments;\n}\n/\n @private\n /\ninterface Action {\n type: string;\n}\n/\n Currently `Actions` only have one action which is to remove.\n * But in the future, we may have more actions like `add`, `update`, etc.\n * And this action would be a uinon of all those actions.\n * i.e. `type Actions = RemoveAction \| AddAction \| UpdateAction;`\n * @private\n /\ntype Actions = RemoveAction;\n/\n @private\n /\ninterface RemoveAction extends Action {\n type: 'remove';\n id: string;\n}\n/\n @internal\n /\nexport const attachmentMetadataReducer = (state: AttachmentMetadata[], action: Actions): AttachmentMetadata[] => {\n switch (action.type) {\n case 'remove':\n return state.filter(v => v.id !== action.id);\n default:\n return state;\n }\n};\n/\n @internal\n */\nexport const doesMessageContainMultipleAttachments = (message: ChatMessage): boolean => {\n const length = message.attachments?.length ?? 0;\n return length > 1;\n};"]}
1	+ {"version":3,"file":"ChatMessageComponentAsEditBoxUtils.js","sourceRoot":"","sources":["../../../../../../preprocess-dist/react-components/src/components/utils/ChatMessageComponentAsEditBoxUtils.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;AACvC,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAClD;;GAEG;AACH,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAAC,SAAiB,EAAe,EAAE;IACnE,OAAO,oBAAC,IAAI,IAAC,QAAQ,EAAE,eAAe,EAAE,SAAS,EAAE,SAAS,GAAI,CAAC;AACnE,CAAC,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAAC,SAAiB,EAAe,EAAE;IACnE,OAAO,oBAAC,IAAI,IAAC,QAAQ,EAAE,eAAe,EAAE,SAAS,EAAE,SAAS,GAAI,CAAC;AACnE,CAAC,CAAC;AAMF,SAAS,cAAc,CAAC,WAAmB;IACzC,OAAO,WAAW,CAAC,IAAI,EAAE,CAAC,MAAM,KAAK,CAAC,CAAC;AACzC,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,eAAe,CAAC,WAAmB;IACjD,OAAO,cAAc,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,gBAAgB,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC;AAC9G,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React from 'react';\nimport { Icon } from '@fluentui/react';\nimport { isMessageTooLong } from './SendBoxUtils';\n/*\n @private\n /\nexport const onRenderCancelIcon = (className: string): JSX.Element => {\n return <Icon iconName={'EditBoxCancel'} className={className} />;\n};\n\n/\n @private\n /\nexport const onRenderSubmitIcon = (className: string): JSX.Element => {\n return <Icon iconName={'EditBoxSubmit'} className={className} />;\n};\n\n/\n Enumeration for whether a message can be sent\n /\nexport type MessageState = 'OK' \| 'too short' \| 'too long';\nfunction isMessageEmpty(messageText: string): boolean {\n return messageText.trim().length === 0;\n}\n\n/\n @private\n */\nexport function getMessageState(messageText: string): MessageState {\n return isMessageEmpty(messageText) ? 'too short' : isMessageTooLong(messageText.length) ? 'too long' : 'OK';\n}"]}

package/dist/dist-esm/react-components/src/components/utils/ChatMessageComponentUtils.d.ts CHANGED Viewed

@@ -1,9 +1,7 @@
 /// <reference types="react" />
 import { ChatMessage, MessageAttachedStatus } from '../../types/ChatMessage';
-import { BlockedMessage } from '../../types/ChatMessage';
 import { InlineImageOptions } from '../ChatMessage/ChatMessageContent';
 import { MessageThreadStrings } from '../MessageThread';
-import { MentionDisplayOptions } from '../MentionPopover';
 import { AttachmentMenuAction } from '../../types/Attachment';
 import { AttachmentMetadata } from "../../../../acs-ui-common/src";
 import { ComponentLocale } from '../../localization/LocalizationProvider';
@@ -17,7 +15,7 @@ export declare const getFluentUIAttachedValue: (messageAttachedStatus?: MessageA
  * @private
  *  Get the message bubble content for the message.
  */
-export declare function getMessageBubbleContent(message: ChatMessage | BlockedMessage, strings: MessageThreadStrings, userId: string, inlineImageOptions: InlineImageOptions | undefined, mentionDisplayOptions?: MentionDisplayOptions,
+export declare function getMessageBubbleContent(message: ChatMessage, strings: MessageThreadStrings, userId: string, inlineImageOptions: InlineImageOptions | undefined,
 /**
  * Optional callback to render message attachments in the message component.
  */
@@ -34,7 +32,7 @@ export declare const generateCustomizedTimestamp: (createdOn: Date, locale: Comp
  * @private
  *  Get the edited tag for the message if it is edited.
  */
-export declare const getMessageEditedDetails: (message: ChatMessage | BlockedMessage, theme: Theme, editedTag: string) => JSX.Element | undefined;
+export declare const getMessageEditedDetails: (message: ChatMessage, theme: Theme, editedTag: string) => JSX.Element | undefined;
 /**
  * Removes Fluent UI keyboard navigation styles from the given HTMLDivElement.
  *

package/dist/dist-esm/react-components/src/components/utils/ChatMessageComponentUtils.js CHANGED Viewed

@@ -2,7 +2,6 @@
 // Licensed under the MIT License.
 import React from 'react';
 import { ChatMessageContent } from '../ChatMessage/ChatMessageContent';
-import { BlockedMessageContent } from '../ChatMessage/ChatMessageContent';
 import { _AttachmentDownloadCards } from '../Attachment/AttachmentDownloadCards';
 import { formatTimeForChatMessage, formatTimestampForChatMessage } from './Datetime';
 import { chatMessageEditedTagStyle } from '../styles/ChatMessageComponent.styles';
@@ -17,7 +16,7 @@ export const getFluentUIAttachedValue = (messageAttachedStatus) => {
  * @private
  *  Get the message bubble content for the message.
  */
-export function getMessageBubbleContent(message, strings, userId, inlineImageOptions, mentionDisplayOptions,
+export function getMessageBubbleContent(message, strings, userId, inlineImageOptions,
 /**
  * Optional callback to render message attachments in the message component.
  */
@@ -26,12 +25,8 @@ onRenderAttachmentDownloads,
  * Optional callback to define custom actions for attachments.
  */
 actionsForAttachment) {
-    if (message.messageType === 'blocked') {
-        return React.createElement("div", { tabIndex: 0 },
-            React.createElement(BlockedMessageContent, { message: message, strings: strings }));
-    }
     return React.createElement("div", { className: "ui-chat__message__content" },
-        React.createElement(ChatMessageContent, { message: message, strings: strings, mentionDisplayOptions: mentionDisplayOptions, inlineImageOptions: inlineImageOptions }),
+        React.createElement(ChatMessageContent, { message: message, strings: strings, inlineImageOptions: inlineImageOptions }),
         onRenderAttachmentDownloads ? onRenderAttachmentDownloads(message) : defaultOnRenderAttachmentDownloads(message, strings, actionsForAttachment));
 }
 /**
@@ -41,7 +36,6 @@ const defaultOnRenderAttachmentDownloads = (message, strings, actionsForAttachme
     var _a;
     const attachments = 'attachments' in message ? message.attachments : undefined;
     return ((_a = attachments === null || attachments === void 0 ? void 0 : attachments.length) !== null && _a !== void 0 ? _a : 0) > 0 ? React.createElement(_AttachmentDownloadCards, { message: message, attachments: attachments, actionsForAttachment: actionsForAttachment, strings: {
-            downloadAttachment: strings.downloadAttachment,
             openAttachment: strings.openAttachment,
             attachmentCardGroupMessage: strings.attachmentCardGroupMessage
         } }) : React.createElement(React.Fragment, null);
@@ -54,7 +48,6 @@ export const generateDefaultTimestamp = (createdOn, showDate, strings) => {
 // onDisplayDateTimeString from props overwrite onDisplayDateTimeString from locale
 /** @private */
 export const generateCustomizedTimestamp = (createdOn, locale, onDisplayDateTimeString) => {
-    return onDisplayDateTimeString ? onDisplayDateTimeString(createdOn) : locale.onDisplayDateTimeString ? locale.onDisplayDateTimeString(createdOn) : '';
     return '';
 };
 /**

package/dist/dist-esm/react-components/src/components/utils/ChatMessageComponentUtils.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ChatMessageComponentUtils.js","sourceRoot":"","sources":["../../../../../../preprocess-dist/react-components/src/components/utils/ChatMessageComponentUtils.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,kBAAkB,EAAE,MAAM,mCAAmC,CAAC;~~AAEvE~~,OAAO,EAAE,~~qBAAqB,EAAE,MAAM,mCAAmC,CAAC;AAI1E,OAAO,EAAE,~~wBAAwB,EAAE,MAAM,uCAAuC,CAAC;AAGjF,OAAO,EAAE,wBAAwB,EAAE,6BAA6B,EAAE,MAAM,YAAY,CAAC;AAErF,OAAO,EAAE,yBAAyB,EAAE,MAAM,uCAAuC,CAAC;AAGlF;;;GAGG;AACH,MAAM,CAAC,MAAM,wBAAwB,GAAG,CAAC,qBAA6C,EAA2C,EAAE;IACjI,OAAO,qBAAqB,KAAK,KAAK,IAAI,qBAAqB,KAAK,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,QAAQ,CAAC;AAC/F,CAAC,CAAC;AAEF;;;GAGG;AACH,MAAM,UAAU,uBAAuB,CAAC,~~OAAqC~~,EAAE,OAA6B,EAAE,MAAc,EAAE,kBAAkD~~,EAAE,qBAA6C~~;AAC/N;;GAEG;AACH,2BAAmE;AACnE;;GAEG;AACH,oBAAwG;IACtG,~~IAAI,~~OAAO,~~CAAC,WAAW,KAAK,SAAS,EAAE,CAAC;QACtC,OAAO,~~6BAAK,~~QAAQ,EAAE,CAAC;YACnB,oBAAC,qBAAqB,IAAC,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,OAAO,GAAI,CACzD,CAAC;IACX,CAAC;IACD,OAAO,6BAAK,~~SAAS,EAAC,2BAA2B;QAC7C,oBAAC,kBAAkB,IAAC,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,~~qBAAqB,EAAE,qBAAqB,EAAE,~~kBAAkB,EAAE,kBAAkB,GAAI;~~QAC/I~~,2BAA2B,CAAC,CAAC,CAAC,2BAA2B,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,kCAAkC,CAAC,OAAO,EAAE,OAAO,EAAE,oBAAoB,CAAC,CAC5I,CAAC;AACX,CAAC;AAED;;GAEG;AACH,MAAM,kCAAkC,GAAG,CAAC,~~OAAqC~~,EAAE,OAA6B,EAAE,oBAAwG,EAA2B,EAAE;;~~IACrP~~,MAAM,WAAW,GAAG,aAAa,IAAI,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC,CAAC,SAAS,CAAC;IAC/E,OAAO,CAAC,MAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,MAAM,mCAAI,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,oBAAC,wBAAwB,IAAC,OAAO,EAAE,OAAsB,EAAE,WAAW,EAAE,WAAW,EAAE,oBAAoB,EAAE,oBAAoB,EAAE,OAAO,EAAE;YAChL,~~kBAAkB,EAAE,OAAO,CAAC,kBAAkB;YAC9C,~~cAAc,EAAE,OAAO,CAAC,cAAc;YACtC,0BAA0B,EAAE,OAAO,CAAC,0BAA0B;SAC/D,GAAI,CAAC,CAAC,CAAC,yCAAK,CAAC;AAChB,CAAC,CAAC;AAEF,eAAe;AACf,MAAM,CAAC,MAAM,wBAAwB,GAAG,CAAC,SAAe,EAAE,QAA6B,EAAE,OAA6B,EAAU,EAAE;IAChI,MAAM,kBAAkB,GAAG,QAAQ,CAAC,CAAC,CAAC,6BAA6B,CAAC,SAAS,EAAE,IAAI,IAAI,EAAE,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC,wBAAwB,CAAC,SAAS,CAAC,CAAC;IAC1I,OAAO,kBAAkB,CAAC;AAC5B,CAAC,CAAC;AAEF,mFAAmF;AACnF,eAAe;AACf,MAAM,CAAC,MAAM,2BAA2B,GAAG,CAAC,SAAe,EAAE,MAAuB,EAAE,uBAAuD,EAAU,EAAE;IACvJ,OAAO,~~uBAAuB,CAAC,CAAC,CAAC,uBAAuB,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,uBAAuB,CAAC,CAAC,CAAC,MAAM,CAAC,uBAAuB,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,~~EAAE,CAAC;~~IACtJ,OAAO,EAAE,CAAC;~~AACZ,CAAC,CAAC;AAEF;;;GAGG;AACH,MAAM,CAAC,MAAM,uBAAuB,GAAG,CAAC,~~OAAqC~~,EAAE,KAAY,EAAE,SAAiB,EAA2B,EAAE;~~IACzI~~,MAAM,QAAQ,GAAG,UAAU,IAAI,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC;IACtE,IAAI,OAAO,CAAC,WAAW,KAAK,MAAM,IAAI,QAAQ,EAAE,CAAC;QAC/C,OAAO,6BAAK,SAAS,EAAE,yBAAyB,CAAC,KAAK,CAAC,IAAG,SAAS,CAAO,CAAC;IAC7E,CAAC;IACD,OAAO,SAAS,CAAC;AACnB,CAAC,CAAC;AAEF;;;;;;;GAOG;AACH,MAAM,CAAC,MAAM,sCAAsC,GAAG,CAAC,IAA2B,EAAQ,EAAE;IAC1F,IAAI,IAAI,EAAE,CAAC;QACT,wDAAwD;QACxD,IAAI,CAAC,eAAe,CAAC,UAAU,CAAC,CAAC;QACjC,IAAI,CAAC,eAAe,CAAC,cAAc,CAAC,CAAC;IACvC,CAAC;AACH,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React from 'react';\nimport { ChatMessage, MessageAttachedStatus } from '../../types/ChatMessage';\nimport { ChatMessageContent } from '../ChatMessage/ChatMessageContent';\nimport { ~~BlockedMessage } from '../../types/ChatMessage';\nimport { BlockedMessageContent } from '../ChatMessage/ChatMessageContent';\nimport {~~ InlineImageOptions } from '../ChatMessage/ChatMessageContent';\nimport { MessageThreadStrings } from '../MessageThread';\nimport { ~~MentionDisplayOptions } from '../MentionPopover';\nimport {~~ _AttachmentDownloadCards } from '../Attachment/AttachmentDownloadCards';\nimport { AttachmentMenuAction } from '../../types/Attachment';\nimport { AttachmentMetadata } from '@internal/acs-ui-common';\nimport { formatTimeForChatMessage, formatTimestampForChatMessage } from './Datetime';\nimport { ComponentLocale } from '../../localization/LocalizationProvider';\nimport { chatMessageEditedTagStyle } from '../styles/ChatMessageComponent.styles';\nimport { Theme } from '@fluentui/react';\n\n/** @private\n * Return the string value for the FluentUI message attached prop based on the message's attached status.\n * @param attached - The message's attached status.\n /\nexport const getFluentUIAttachedValue = (messageAttachedStatus?: MessageAttachedStatus): 'bottom' \| 'top' \| 'center' \| undefined => {\n return messageAttachedStatus === 'top' \|\| messageAttachedStatus === false ? 'top' : 'center';\n};\n\n/\n @private\n * Get the message bubble content for the message.\n /\nexport function getMessageBubbleContent(message: ChatMessage ~~\| BlockedMessage~~, strings: MessageThreadStrings, userId: string, inlineImageOptions: InlineImageOptions \| undefined~~, mentionDisplayOptions?: MentionDisplayOptions~~,\n/\n Optional callback to render message attachments in the message component.\n /\nonRenderAttachmentDownloads?: (message: ChatMessage) => JSX.Element,\n/\n Optional callback to define custom actions for attachments.\n /\nactionsForAttachment?: (attachment: AttachmentMetadata, message?: ChatMessage) => AttachmentMenuAction[]): JSX.Element {\n ~~if (message.messageType === 'blocked') {\n~~ return <div ~~tabIndex={0}>\n <BlockedMessageContent message={message} strings={strings} />\n </div>;\n }\n return <div~~ className=\"ui-chat__message__content\">\n <ChatMessageContent message={message} strings={strings} ~~mentionDisplayOptions={mentionDisplayOptions}~~ inlineImageOptions={inlineImageOptions} />\n {onRenderAttachmentDownloads ? onRenderAttachmentDownloads(message) : defaultOnRenderAttachmentDownloads(message, strings, actionsForAttachment)}\n </div>;\n}\n\n/\n Default component for rendering attachment downloads.\n /\nconst defaultOnRenderAttachmentDownloads = (message: ChatMessage ~~\| BlockedMessage~~, strings: MessageThreadStrings, actionsForAttachment?: (attachment: AttachmentMetadata, message?: ChatMessage) => AttachmentMenuAction[]): JSX.Element \| undefined => {\n const attachments = 'attachments' in message ? message.attachments : undefined;\n return (attachments?.length ?? 0) > 0 ? <_AttachmentDownloadCards message={message as ChatMessage} attachments={attachments} actionsForAttachment={actionsForAttachment} strings={{\n ~~downloadAttachment: strings.downloadAttachment,\n~~ openAttachment: strings.openAttachment,\n attachmentCardGroupMessage: strings.attachmentCardGroupMessage\n }} /> : <></>;\n};\n\n/* @private /\nexport const generateDefaultTimestamp = (createdOn: Date, showDate: boolean \| undefined, strings: MessageThreadStrings): string => {\n const formattedTimestamp = showDate ? formatTimestampForChatMessage(createdOn, new Date(), strings) : formatTimeForChatMessage(createdOn);\n return formattedTimestamp;\n};\n\n// onDisplayDateTimeString from props overwrite onDisplayDateTimeString from locale\n/* @private /\nexport const generateCustomizedTimestamp = (createdOn: Date, locale: ComponentLocale, onDisplayDateTimeString?: (messageDate: Date) => string): string => {\n return ~~onDisplayDateTimeString ? onDisplayDateTimeString(createdOn) : locale.onDisplayDateTimeString ? locale.onDisplayDateTimeString(createdOn) :~~ '';\n ~~return '';\n~~};\n\n/\n @private\n * Get the edited tag for the message if it is edited.\n /\nexport const getMessageEditedDetails = (message: ChatMessage ~~\| BlockedMessage~~, theme: Theme, editedTag: string): JSX.Element \| undefined => {\n const editedOn = 'editedOn' in message ? message.editedOn : undefined;\n if (message.messageType === 'chat' && editedOn) {\n return <div className={chatMessageEditedTagStyle(theme)}>{editedTag}</div>;\n }\n return undefined;\n};\n\n/\n Removes Fluent UI keyboard navigation styles from the given HTMLDivElement.\n \n This function removes the 'tabindex' and 'data-tabster' attributes from the provided\n * HTMLDivElement, making it non-focusable and removing any associated keyboard navigation styles.\n \n @param node - The HTMLDivElement from which to remove the keyboard navigation styles. If null, the function does nothing.\n */\nexport const removeFluentUIKeyboardNavigationStyles = (node: HTMLDivElement \| null): void => {\n if (node) {\n // Remove tabindex to make the div element non-focusable\n node.removeAttribute('tabindex');\n node.removeAttribute('data-tabster');\n }\n};"]}
1	+ {"version":3,"file":"ChatMessageComponentUtils.js","sourceRoot":"","sources":["../../../../../../preprocess-dist/react-components/src/components/utils/ChatMessageComponentUtils.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React from 'react';\nimport { ChatMessage, MessageAttachedStatus } from '../../types/ChatMessage';\nimport { ChatMessageContent } from '../ChatMessage/ChatMessageContent';\nimport { InlineImageOptions } from '../ChatMessage/ChatMessageContent';\nimport { MessageThreadStrings } from '../MessageThread';\nimport { _AttachmentDownloadCards } from '../Attachment/AttachmentDownloadCards';\nimport { AttachmentMenuAction } from '../../types/Attachment';\nimport { AttachmentMetadata } from '@internal/acs-ui-common';\nimport { formatTimeForChatMessage, formatTimestampForChatMessage } from './Datetime';\nimport { ComponentLocale } from '../../localization/LocalizationProvider';\nimport { chatMessageEditedTagStyle } from '../styles/ChatMessageComponent.styles';\nimport { Theme } from '@fluentui/react';\n\n/** @private\n * Return the string value for the FluentUI message attached prop based on the message's attached status.\n * @param attached - The message's attached status.\n /\nexport const getFluentUIAttachedValue = (messageAttachedStatus?: MessageAttachedStatus): 'bottom' \| 'top' \| 'center' \| undefined => {\n return messageAttachedStatus === 'top' \|\| messageAttachedStatus === false ? 'top' : 'center';\n};\n\n/\n @private\n * Get the message bubble content for the message.\n /\nexport function getMessageBubbleContent(message: ChatMessage, strings: MessageThreadStrings, userId: string, inlineImageOptions: InlineImageOptions \| undefined,\n/\n Optional callback to render message attachments in the message component.\n /\nonRenderAttachmentDownloads?: (message: ChatMessage) => JSX.Element,\n/\n Optional callback to define custom actions for attachments.\n /\nactionsForAttachment?: (attachment: AttachmentMetadata, message?: ChatMessage) => AttachmentMenuAction[]): JSX.Element {\n return <div className=\"ui-chat__message__content\">\n <ChatMessageContent message={message} strings={strings} inlineImageOptions={inlineImageOptions} />\n {onRenderAttachmentDownloads ? onRenderAttachmentDownloads(message) : defaultOnRenderAttachmentDownloads(message, strings, actionsForAttachment)}\n </div>;\n}\n\n/\n Default component for rendering attachment downloads.\n /\nconst defaultOnRenderAttachmentDownloads = (message: ChatMessage, strings: MessageThreadStrings, actionsForAttachment?: (attachment: AttachmentMetadata, message?: ChatMessage) => AttachmentMenuAction[]): JSX.Element \| undefined => {\n const attachments = 'attachments' in message ? message.attachments : undefined;\n return (attachments?.length ?? 0) > 0 ? <_AttachmentDownloadCards message={message as ChatMessage} attachments={attachments} actionsForAttachment={actionsForAttachment} strings={{\n openAttachment: strings.openAttachment,\n attachmentCardGroupMessage: strings.attachmentCardGroupMessage\n }} /> : <></>;\n};\n\n/* @private /\nexport const generateDefaultTimestamp = (createdOn: Date, showDate: boolean \| undefined, strings: MessageThreadStrings): string => {\n const formattedTimestamp = showDate ? formatTimestampForChatMessage(createdOn, new Date(), strings) : formatTimeForChatMessage(createdOn);\n return formattedTimestamp;\n};\n\n// onDisplayDateTimeString from props overwrite onDisplayDateTimeString from locale\n/* @private /\nexport const generateCustomizedTimestamp = (createdOn: Date, locale: ComponentLocale, onDisplayDateTimeString?: (messageDate: Date) => string): string => {\n return '';\n};\n\n/\n @private\n * Get the edited tag for the message if it is edited.\n /\nexport const getMessageEditedDetails = (message: ChatMessage, theme: Theme, editedTag: string): JSX.Element \| undefined => {\n const editedOn = 'editedOn' in message ? message.editedOn : undefined;\n if (message.messageType === 'chat' && editedOn) {\n return <div className={chatMessageEditedTagStyle(theme)}>{editedTag}</div>;\n }\n return undefined;\n};\n\n/\n Removes Fluent UI keyboard navigation styles from the given HTMLDivElement.\n \n This function removes the 'tabindex' and 'data-tabster' attributes from the provided\n * HTMLDivElement, making it non-focusable and removing any associated keyboard navigation styles.\n \n @param node - The HTMLDivElement from which to remove the keyboard navigation styles. If null, the function does nothing.\n */\nexport const removeFluentUIKeyboardNavigationStyles = (node: HTMLDivElement \| null): void => {\n if (node) {\n // Remove tabindex to make the div element non-focusable\n node.removeAttribute('tabindex');\n node.removeAttribute('data-tabster');\n }\n};"]}

package/dist/dist-esm/react-components/src/components/utils/SendBoxUtils.d.ts CHANGED Viewed

@@ -1,40 +1,7 @@
-import { AttachmentMetadataInProgress } from "../../../../acs-ui-common/src";
-import { AttachmentMetadata } from "../../../../acs-ui-common/src";
 /**
  * @private
  */
 export declare const MAXIMUM_LENGTH_OF_MESSAGE = 8000;
-/**
- * @private
- */
-export declare const hasIncompleteAttachmentUploads: (attachmentsWithProgress: AttachmentMetadataInProgress[] | undefined) => boolean;
-/**
- * @private
- */
-export declare const isAttachmentUploadCompleted: (attachmentsWithProgress: AttachmentMetadataInProgress[] | undefined) => boolean;
-/**
- * Obtain any image nodes from the content DOM passed in
- * returns a list of image IDs
- * @internal
- */
-export declare const inlineImageIds: (content?: string) => {
-    id: string;
-    url?: string;
-}[];
-/**
- * Check if the content has inline image.
- * @internal
- */
-export declare const hasInlineImageContent: (content: string) => boolean;
-/**
- * @internal
- *
- * @param message - The message content to update.
- * @param initialInlineImages - The initial inline images that comes with the message before editing.
- *
- * @returns The updated message content.
- */
-export declare const updateStylesOfInlineImages: (message: string, initialInlineImages: Record<string, string>[]) => Promise<string>;
 /**
  * @private
  */
@@ -52,26 +19,13 @@ export declare const sanitizeText: (message: string) => string;
  * @param disabled - Indicates whether the send box is disabled.
  * @returns A boolean value indicating whether the send box should be disabled.
  */
-export declare const isSendBoxButtonDisabled: ({ hasContent, hasCompletedAttachmentUploads, hasError, disabled }: {
+export declare const isSendBoxButtonDisabled: ({ hasContent, hasError, disabled }: {
     hasContent: boolean;
-    hasCompletedAttachmentUploads: boolean;
     hasError: boolean;
     disabled: boolean;
 }) => boolean;
-/**
- * @internal
- */
-export declare const toAttachmentMetadata: (attachmentsWithProgress: AttachmentMetadataInProgress[] | undefined) => AttachmentMetadata[] | undefined;
 /**
  * @internal
  */
 export declare const modifyInlineImagesInContentString: (content: string, initialInlineImages: Record<string, string>[], onCompleted?: (content: string) => void) => Promise<void>;
-/**
- * @internal
- */
-export declare const removeBrokenImageContentAndClearImageSizeStyles: (content: string) => string;
-/**
- * @internal
- */
-export declare const getContentWithUpdatedInlineImagesInfo: (content: string, inlineImageWithProgress: AttachmentMetadataInProgress[]) => string;
 //# sourceMappingURL=SendBoxUtils.d.ts.map

package/dist/dist-esm/react-components/src/components/utils/SendBoxUtils.js CHANGED Viewed

@@ -7,98 +7,13 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
 };
+// Copyright (c) Microsoft Corporation.
+// Licensed under the MIT License.
 /**
  * @private
  */
 export const MAXIMUM_LENGTH_OF_MESSAGE = 8000;
 const EMPTY_MESSAGE_REGEX = /^\s*$/;
-/**
- * @private
- */
-export const hasIncompleteAttachmentUploads = (attachmentsWithProgress) => {
-    return !!((attachmentsWithProgress === null || attachmentsWithProgress === void 0 ? void 0 : attachmentsWithProgress.length) && !attachmentsWithProgress.filter(attachmentUpload => !attachmentUpload.error).every(attachmentUpload => attachmentUpload.progress === 1 && attachmentUpload.progress !== undefined));
-};
-/**
- * @private
- */
-export const isAttachmentUploadCompleted = (attachmentsWithProgress) => {
-    return !!(attachmentsWithProgress === null || attachmentsWithProgress === void 0 ? void 0 : attachmentsWithProgress.find(attachment => !attachment.error));
-};
-/**
- * Obtain any image nodes from the content DOM passed in
- * returns a list of image IDs
- * @internal
- */
-export const inlineImageIds = (content) => {
-    if (!content) {
-        return [];
-    }
-    const document = new DOMParser().parseFromString(content, 'text/html');
-    const imageTags = document.querySelectorAll('img');
-    const ids = [];
-    imageTags.forEach(node => {
-        const id = node.id;
-        const url = node.src;
-        if (id) {
-            ids.push({
-                id,
-                url
-            });
-        }
-    });
-    return ids;
-};
-/**
- * Check if the content has inline image.
- * @internal
- */
-export const hasInlineImageContent = (content) => {
-    return inlineImageIds(content).length > 0;
-};
-/**
- * @internal
- *
- * @param message - The message content to update.
- * @param initialInlineImages - The initial inline images that comes with the message before editing.
- *
- * @returns The updated message content.
- */
-export const updateStylesOfInlineImages = (message, initialInlineImages) => __awaiter(void 0, void 0, void 0, function* () {
-    if (message === '') {
-        return message;
-    }
-    const initialInlineImagesIds = initialInlineImages.map(initialInlineImage => initialInlineImage.id);
-    const document = new DOMParser().parseFromString(message !== null && message !== void 0 ? message : '', 'text/html');
-    const imagesPromise = Array.from(document.querySelectorAll('img')).map(img => {
-        return new Promise((resolve, rejects) => {
-            // The message might content images that comes with the message before editing.
-            // This function should only modify the message content for images that are newly added.
-            if (initialInlineImagesIds.includes(img.id)) {
-                resolve();
-                return;
-            }
-            const imageElement = new Image();
-            imageElement.src = img.src;
-            imageElement.onload = () => {
-                // imageElement is a copy of original img element, so changes need to be made to the original img element
-                img.width = imageElement.width;
-                img.height = imageElement.height;
-                img.style.aspectRatio = `${imageElement.width} / ${imageElement.height}`;
-                // Clear maxWidth and maxHeight styles that are set by roosterJS.
-                // This is so that they can be set in messageThread styles without using the important flag.
-                img.style.maxWidth = '';
-                img.style.maxHeight = '';
-                resolve();
-            };
-            imageElement.onerror = () => {
-                rejects(`Error loading image ${img.id}`);
-            };
-        });
-    });
-    yield Promise.all(imagesPromise);
-    const newMessage = document.body.innerHTML;
-    return newMessage;
-});
 /**
  * @private
  */
@@ -125,83 +40,18 @@ export const sanitizeText = (message) => {
  * @param disabled - Indicates whether the send box is disabled.
  * @returns A boolean value indicating whether the send box should be disabled.
  */
-export const isSendBoxButtonDisabled = ({ hasContent, hasCompletedAttachmentUploads, hasError, disabled }) => {
+export const isSendBoxButtonDisabled = ({ hasContent, hasError, disabled }) => {
     return (
     // no content
-    !(hasContent || hasCompletedAttachmentUploads) ||
+    !hasContent ||
         //error message exists
         hasError || disabled);
 };
-/**
- * @internal
- */
-export const toAttachmentMetadata = (attachmentsWithProgress) => {
-    return attachmentsWithProgress === null || attachmentsWithProgress === void 0 ? void 0 : attachmentsWithProgress.filter(attachment => {
-        var _a;
-        return !('error' in attachment) && !((_a = attachment.error) === null || _a === void 0 ? void 0 : _a.message);
-    }).map(attachment => {
-        var _a;
-        return {
-            id: attachment.id,
-            name: attachment.name,
-            url: (_a = attachment.url) !== null && _a !== void 0 ? _a : ''
-        };
-    });
-};
 /**
  * @internal
  */
 export const modifyInlineImagesInContentString = (content, initialInlineImages, onCompleted) => __awaiter(void 0, void 0, void 0, function* () {
     let newContent = content;
-    try {
-        newContent = yield updateStylesOfInlineImages(content, initialInlineImages);
-    }
-    catch (error) {
-        console.error('Error updating inline images: ', error);
-    }
     onCompleted === null || onCompleted === void 0 ? void 0 : onCompleted(newContent);
 });
-/**
- * @internal
- */
-export const removeBrokenImageContentAndClearImageSizeStyles = (content) => {
-    const document = new DOMParser().parseFromString(content, 'text/html');
-    document.querySelectorAll('img').forEach(img => {
-        // Before submitting/resend the message, we need to trim the unnecessary attributes such as src,
-        // which is set to a local svg of a broken image icon at this point.
-        // Once message is submitted/resent, it will be fetched again and might not be a broken image anymore,
-        // That's why we need to remove the class and data-ui-id attribute of 'broken-image-wrapper'
-        if (img.className === 'broken-image-wrapper') {
-            img.removeAttribute('class');
-            img.removeAttribute('src');
-            img.removeAttribute('data-ui-id');
-        }
-        // Clear maxWidth and maxHeight styles that are set by roosterJS.
-        // Clear width and height styles as the width and height is set in attributes
-        // This is so that they can be set in messageThread styles without using the important flag.
-        img.style.width = '';
-        img.style.height = '';
-        img.style.maxWidth = '';
-        img.style.maxHeight = '';
-    });
-    return document.body.innerHTML;
-};
-/**
- * @internal
- */
-export const getContentWithUpdatedInlineImagesInfo = (content, inlineImageWithProgress) => {
-    if (!inlineImageWithProgress || inlineImageWithProgress.length <= 0) {
-        return content;
-    }
-    const document = new DOMParser().parseFromString(content, 'text/html');
-    document.querySelectorAll('img').forEach(img => {
-        const imageId = img.id;
-        const inlineImage = inlineImageWithProgress.find(image => !image.error && image.progress === 1 && image.id === imageId);
-        if (inlineImage) {
-            img.id = inlineImage.id;
-            img.src = inlineImage.url || img.src;
-        }
-    });
-    return document.body.innerHTML;
-};
 //# sourceMappingURL=SendBoxUtils.js.map