npm - @azure/communication-react - Versions diffs - 1.14.0-alpha-202403160012 → 1.14.0-alpha-202403200012 - Mend

@azure/communication-react 1.14.0-alpha-202403160012 → 1.14.0-alpha-202403200012

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

package/dist/dist-esm/react-components/src/components/ChatMessage/{FluentChatMessageComponentWrapper.js → MyMessageComponents/FluentChatMyMessageComponent.js} RENAMED Viewed

@@ -1,12 +1,13 @@
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT License.
 import React, { useCallback, useMemo } from 'react';
-import { gutterWithAvatar, gutterWithHiddenAvatar, noMessageStatusStyle, useChatMessageRenderStyles } from '../styles/MessageThread.styles';
-import { PersonaSize, mergeStyles, Persona } from '@fluentui/react';
+import { noMessageStatusStyle, useChatMessageRenderStyles } from '../../styles/MessageThread.styles';
+import { mergeStyles } from '@fluentui/react';
 import { mergeClasses } from '@fluentui/react-components';
-import { createStyleFromV8Style } from '../styles/v8StyleShim';
-import { ChatMessageComponent } from './ChatMessageComponent';
-import { ChatMessage as FluentChatMessage, ChatMyMessage as FluentChatMyMessage } from '@fluentui-contrib/react-chat';
+import { createStyleFromV8Style } from '../../styles/v8StyleShim';
+import { ChatMyMessageComponent } from './ChatMyMessageComponent';
+import { ChatMyMessage as FluentChatMyMessage } from '@fluentui-contrib/react-chat';
+import { getFluentUIAttachedValue } from '../../utils/ChatMessageComponentUtils';
 /**
  * The component for rendering a chat message using Fluent UI components
  * and handling default and custom renderers.
@@ -15,7 +16,7 @@ import { ChatMessage as FluentChatMessage, ChatMyMessage as FluentChatMyMessage
  *
  * @private
  */
-export const FluentChatMessageComponentWrapper = (props) => {
+export const FluentChatMyMessageComponent = (props) => {
     const { message, styles, shouldOverlapAvatarAndMessage, onRenderMessage, onRenderAvatar, showMessageStatus, onRenderMessageStatus, participantCount, readCount, onActionButtonClick,
     /* @conditional-compile-remove(date-time-customization) */
     onDisplayDateTimeString,
@@ -38,7 +39,7 @@ export const FluentChatMessageComponentWrapper = (props) => {
     const defaultChatMessageRenderer = useCallback((messageProps) => {
         if (messageProps.message.messageType === 'chat' ||
             /* @conditional-compile-remove(data-loss-prevention) */ messageProps.message.messageType === 'blocked') {
-            return (React.createElement(ChatMessageComponent, Object.assign({}, messageProps, {
+            return (React.createElement(ChatMyMessageComponent, Object.assign({}, messageProps, {
                 /* @conditional-compile-remove(file-sharing) */
                 onRenderFileDownloads: onRenderFileDownloadsMemo,
                 /* @conditional-compile-remove(file-sharing) */
@@ -80,12 +81,9 @@ export const FluentChatMessageComponentWrapper = (props) => {
     const messageStatusRenderer = useCallback((onRenderMessageStatus, defaultStatusRenderer, showMessageStatus, participantCount, readCount) => {
         return showMessageStatus && statusToRender ? (onRenderMessageStatus ? (onRenderMessageStatus({ status: message.status })) : (defaultStatusRenderer(message, participantCount !== null && participantCount !== void 0 ? participantCount : 0, readCount !== null && readCount !== void 0 ? readCount : 0, message.status))) : (React.createElement("div", { className: mergeStyles(noMessageStatusStyle) }));
     }, [message, statusToRender]);
-    const shouldShowAvatar = useMemo(() => {
-        return message.attached === 'top' || message.attached === false;
-    }, [message.attached]);
     const attached = useMemo(() => {
-        return shouldShowAvatar ? 'top' : 'center';
-    }, [shouldShowAvatar]);
+        return getFluentUIAttachedValue(message.attached);
+    }, [message.attached]);
     const myMessageRootProps = useMemo(() => {
         return {
             // myChatItemMessageContainer used in className and style prop as style prop can't handle CSS selectors
@@ -121,50 +119,10 @@ export const FluentChatMessageComponentWrapper = (props) => {
         showMessageStatus,
         styles
     ]);
-    const messageRootProps = useMemo(() => {
-        return { className: mergeClasses(chatMessageRenderStyles.rootMessage, chatMessageRenderStyles.rootCommon) };
-    }, [chatMessageRenderStyles.rootCommon, chatMessageRenderStyles.rootMessage]);
-    const messageBodyProps = useMemo(() => {
-        return {
-            // chatItemMessageContainer used in className and style prop as style prop can't handle CSS selectors
-            className: mergeClasses(chatMessageRenderStyles.bodyCommon, !shouldShowAvatar ? chatMessageRenderStyles.bodyWithoutAvatar : chatMessageRenderStyles.bodyWithAvatar, shouldOverlapAvatarAndMessage ? chatMessageRenderStyles.avatarOverlap : chatMessageRenderStyles.avatarNoOverlap, mergeStyles(styles === null || styles === void 0 ? void 0 : styles.chatItemMessageContainer)),
-            style: (styles === null || styles === void 0 ? void 0 : styles.chatItemMessageContainer) !== undefined ? createStyleFromV8Style(styles === null || styles === void 0 ? void 0 : styles.chatItemMessageContainer) : {},
-            // make body not focusable to remove repetitions from narrators.
-            // inner components are already focusable
-            tabIndex: -1,
-            role: 'none'
-        };
-    }, [
-        chatMessageRenderStyles.avatarNoOverlap,
-        chatMessageRenderStyles.avatarOverlap,
-        chatMessageRenderStyles.bodyCommon,
-        chatMessageRenderStyles.bodyWithAvatar,
-        chatMessageRenderStyles.bodyWithoutAvatar,
-        shouldOverlapAvatarAndMessage,
-        shouldShowAvatar,
-        styles === null || styles === void 0 ? void 0 : styles.chatItemMessageContainer
-    ]);
-    const avatar = useMemo(() => {
-        const chatAvatarStyle = shouldShowAvatar ? gutterWithAvatar : gutterWithHiddenAvatar;
-        const personaOptions = {
-            hidePersonaDetails: true,
-            size: PersonaSize.size32,
-            text: message.senderDisplayName,
-            showOverflowTooltip: false
-        };
-        return (React.createElement("div", { className: mergeStyles(chatAvatarStyle) }, onRenderAvatar ? onRenderAvatar === null || onRenderAvatar === void 0 ? void 0 : onRenderAvatar(message.senderId, personaOptions) : React.createElement(Persona, Object.assign({}, personaOptions))));
-    }, [message.senderDisplayName, message.senderId, onRenderAvatar, shouldShowAvatar]);
     // Fluent UI message components are used here as for default message renderer,
     // timestamp and author name should be shown but they aren't shown for custom renderer.
     // More investigations are needed to check if this can be simplified with states.
     // Status and avatar should be shown for both custom and default renderers.
-    if (message.mine === true) {
-        return (React.createElement("div", null,
-            React.createElement(FluentChatMyMessage, { attached: attached, root: myMessageRootProps, body: myMessageBodyProps, statusIcon: myMessageStatusIcon }, messageRenderer(Object.assign({}, props)))));
-    }
-    else {
-        return (React.createElement("div", null,
-            React.createElement(FluentChatMessage, { attached: attached, root: messageRootProps, body: messageBodyProps, avatar: avatar }, messageRenderer(Object.assign({}, props)))));
-    }
+    return (React.createElement(FluentChatMyMessage, { attached: attached, root: myMessageRootProps, body: myMessageBodyProps, statusIcon: myMessageStatusIcon }, messageRenderer(Object.assign({}, props))));
 };
-//# sourceMappingURL=FluentChatMessageComponentWrapper.js.map
+//# sourceMappingURL=FluentChatMyMessageComponent.js.map

package/dist/dist-esm/react-components/src/components/ChatMessage/MyMessageComponents/FluentChatMyMessageComponent.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"FluentChatMyMessageComponent.js","sourceRoot":"","sources":["../../../../../../../../react-components/src/components/ChatMessage/MyMessageComponents/FluentChatMyMessageComponent.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { MessageStatus, _formatString } from '@internal/acs-ui-common';\nimport React, { useCallback, useMemo } from 'react';\nimport { MessageProps, _ChatMessageProps } from '../../MessageThread';\nimport { ChatMessage } from '../../../types';\n/* @conditional-compile-remove(data-loss-prevention) */\nimport { BlockedMessage } from '../../../types';\nimport { noMessageStatusStyle, useChatMessageRenderStyles } from '../../styles/MessageThread.styles';\nimport { mergeStyles } from '@fluentui/react';\nimport { mergeClasses } from '@fluentui/react-components';\nimport { createStyleFromV8Style } from '../../styles/v8StyleShim';\nimport { MessageStatusIndicatorProps } from '../../MessageStatusIndicator';\nimport { ChatMyMessageComponent } from './ChatMyMessageComponent';\nimport { ChatMyMessage as FluentChatMyMessage } from '@fluentui-contrib/react-chat';\nimport { getFluentUIAttachedValue } from '../../utils/ChatMessageComponentUtils';\nimport type { FluentChatMessageComponentWrapperProps } from '../MessageComponents/FluentChatMessageComponent';\n\n/**\n * The component for rendering a chat message using Fluent UI components\n * and handling default and custom renderers.\n * This component handles rendering for chat message body, avatar and message status.\n * The chat message body, avatar and message status should be shown for both default and custom renderers.\n *\n * @private\n */\nexport const FluentChatMyMessageComponent = (props: FluentChatMessageComponentWrapperProps): JSX.Element => {\n const {\n message,\n styles,\n shouldOverlapAvatarAndMessage,\n onRenderMessage,\n onRenderAvatar,\n showMessageStatus,\n onRenderMessageStatus,\n participantCount,\n readCount,\n onActionButtonClick,\n /* @conditional-compile-remove(date-time-customization) */\n onDisplayDateTimeString,\n /* @conditional-compile-remove(image-overlay) */\n inlineImageOptions,\n /* @conditional-compile-remove(mention) */\n mentionOptions,\n /* @conditional-compile-remove(file-sharing) */\n fileDownloadHandler,\n userId,\n /* @conditional-compile-remove(file-sharing) */\n onRenderFileDownloads,\n defaultStatusRenderer,\n statusToRender\n } = props;\n const chatMessageRenderStyles = useChatMessageRenderStyles();\n\n const onRenderFileDownloadsMemo = useMemo(() => {\n /* @conditional-compile-remove(file-sharing) */\n return onRenderFileDownloads;\n return undefined;\n }, [/* @conditional-compile-remove(file-sharing) */ onRenderFileDownloads]);\n\n // To rerender the defaultChatMessageRenderer if app running across days(every new day chat time stamp\n // needs to be regenerated), the dependency on \"new Date().toDateString()\"\" is added.\n const defaultChatMessageRenderer = useCallback(\n (messageProps: MessageProps) => {\n if (\n messageProps.message.messageType === 'chat' ||\n /* @conditional-compile-remove(data-loss-prevention) */ messageProps.message.messageType === 'blocked'\n ) {\n return (\n <ChatMyMessageComponent\n {...messageProps}\n /* @conditional-compile-remove(file-sharing) */\n onRenderFileDownloads={onRenderFileDownloadsMemo}\n /* @conditional-compile-remove(file-sharing) */\n strings={messageProps.strings}\n message={messageProps.message}\n userId={userId}\n remoteParticipantsCount={participantCount ? participantCount - 1 : 0}\n shouldOverlapAvatarAndMessage={shouldOverlapAvatarAndMessage}\n onRenderAvatar={onRenderAvatar}\n showMessageStatus={showMessageStatus}\n messageStatus={messageProps.message.status}\n onActionButtonClick={onActionButtonClick}\n /* @conditional-compile-remove(date-time-customization) */\n onDisplayDateTimeString={onDisplayDateTimeString}\n /* @conditional-compile-remove(image-overlay) */\n inlineImageOptions={inlineImageOptions}\n /* @conditional-compile-remove(mention) */\n mentionOptions={mentionOptions}\n /* @conditional-compile-remove(file-sharing) */\n fileDownloadHandler={fileDownloadHandler}\n />\n );\n }\n return <></>;\n },\n [\n onActionButtonClick,\n onRenderAvatar,\n onRenderFileDownloadsMemo,\n participantCount,\n shouldOverlapAvatarAndMessage,\n showMessageStatus,\n userId,\n /* @conditional-compile-remove(date-time-customization) */\n onDisplayDateTimeString,\n /* @conditional-compile-remove(image-overlay) */\n inlineImageOptions,\n /* @conditional-compile-remove(mention) */\n mentionOptions,\n /* @conditional-compile-remove(file-sharing) */\n fileDownloadHandler,\n // eslint-disable-next-line react-hooks/exhaustive-deps\n new Date().toDateString()\n ]\n );\n\n const messageRenderer = useCallback(\n (messageProps: MessageProps) => {\n return onRenderMessage === undefined\n ? defaultChatMessageRenderer({ ...messageProps })\n : onRenderMessage(messageProps, defaultChatMessageRenderer);\n },\n [defaultChatMessageRenderer, onRenderMessage]\n );\n\n const messageStatusRenderer = useCallback(\n (\n onRenderMessageStatus:\n | ((messageStatusIndicatorProps: MessageStatusIndicatorProps) => JSX.Element | null)\n | undefined,\n defaultStatusRenderer: (\n message: ChatMessage | /* @conditional-compile-remove(data-loss-prevention) */ BlockedMessage,\n participantCount: number,\n readCount: number,\n status?: MessageStatus\n ) => JSX.Element,\n showMessageStatus?: boolean,\n participantCount?: number,\n readCount?: number\n ) => {\n return showMessageStatus && statusToRender ? (\n onRenderMessageStatus ? (\n onRenderMessageStatus({ status: message.status })\n ) : (\n defaultStatusRenderer(message, participantCount ?? 0, readCount ?? 0, message.status)\n )\n ) : (\n <div className={mergeStyles(noMessageStatusStyle)} />\n );\n },\n [message, statusToRender]\n );\n\n const attached = useMemo(() => {\n return getFluentUIAttachedValue(message.attached);\n }, [message.attached]);\n\n const myMessageRootProps = useMemo(() => {\n return {\n // myChatItemMessageContainer used in className and style prop as style prop can't handle CSS selectors\n className: mergeClasses(\n chatMessageRenderStyles.rootMyMessage,\n chatMessageRenderStyles.rootCommon,\n mergeStyles(styles?.myChatItemMessageContainer)\n ),\n style:\n styles?.myChatItemMessageContainer !== undefined\n ? createStyleFromV8Style(styles?.myChatItemMessageContainer)\n : {},\n role: 'none'\n };\n }, [chatMessageRenderStyles.rootCommon, chatMessageRenderStyles.rootMyMessage, styles?.myChatItemMessageContainer]);\n\n const myMessageBodyProps = useMemo(() => {\n return {\n className: mergeClasses(chatMessageRenderStyles.bodyCommon, chatMessageRenderStyles.bodyMyMessage),\n // make body not focusable to remove repetitions from narrators.\n // inner components are already focusable\n tabIndex: -1,\n role: 'none'\n };\n }, [chatMessageRenderStyles.bodyCommon, chatMessageRenderStyles.bodyMyMessage]);\n\n const myMessageStatusIcon = useMemo(() => {\n return (\n <div\n className={mergeStyles(\n { paddingLeft: '0.25rem' },\n styles?.messageStatusContainer ? styles.messageStatusContainer(message.mine ?? false) : ''\n )}\n >\n {message.status\n ? messageStatusRenderer(\n onRenderMessageStatus,\n defaultStatusRenderer,\n showMessageStatus,\n participantCount,\n readCount\n )\n : undefined}\n </div>\n );\n }, [\n defaultStatusRenderer,\n message.mine,\n message.status,\n messageStatusRenderer,\n onRenderMessageStatus,\n participantCount,\n readCount,\n showMessageStatus,\n styles\n ]);\n\n // Fluent UI message components are used here as for default message renderer,\n // timestamp and author name should be shown but they aren't shown for custom renderer.\n // More investigations are needed to check if this can be simplified with states.\n // Status and avatar should be shown for both custom and default renderers.\n return (\n <FluentChatMyMessage\n attached={attached}\n root={myMessageRootProps}\n body={myMessageBodyProps}\n statusIcon={myMessageStatusIcon}\n >\n {messageRenderer({ ...props })}\n </FluentChatMyMessage>\n );\n};\n"]}

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

@@ -51,10 +51,7 @@ export const ParticipantItem = (props) => {
     const menuButton = useMemo(() => (React.createElement(Stack, { horizontal: true, horizontalAlign: "end", className: mergeStyles(menuButtonContainerStyle), title: strings.menuTitle, "data-ui-id": ids.participantItemMenuButton },
         React.createElement(Icon, { iconName: itemHovered || itemFocused || !menuHidden ? 'ParticipantItemOptionsHovered' : 'ParticipantItemOptions', className: iconStyles }))), [strings.menuTitle, ids.participantItemMenuButton, itemHovered, itemFocused, menuHidden]);
     const participantStateString = participantStateStringTrampoline(props, strings);
-    return (React.createElement("div", { ref: containerRef, role: 'menuitem', "data-is-focusable": true, "data-ui-id": "participant-item", className: mergeStyles(participantItemContainerStyle({
-            localparticipant: me,
-            clickable: !!menuItems && menuItems.length > 0
-        }), styles === null || styles === void 0 ? void 0 : styles.root), onMouseEnter: () => setItemHovered(true), onMouseLeave: () => setItemHovered(false), onFocus: () => setItemFocused(true), onBlur: () => setItemFocused(false), onClick: () => {
+    return (React.createElement("div", { ref: containerRef, role: 'menuitem', "data-is-focusable": true, "data-ui-id": "participant-item", className: mergeStyles(participantItemContainerStyle({ clickable: !!menuItems && menuItems.length > 0 }), styles === null || styles === void 0 ? void 0 : styles.root), onMouseEnter: () => setItemHovered(true), onMouseLeave: () => setItemHovered(false), onFocus: () => setItemFocused(true), onBlur: () => setItemFocused(false), onClick: () => {
             if (!participantStateString) {
                 setItemHovered(true);
                 setItemFocused(false);

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ParticipantItem.js","sourceRoot":"","sources":["../../../../../../react-components/src/components/ParticipantItem.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport {\n ContextualMenu,\n DirectionalHint,\n Icon,\n IContextualMenuItem,\n IStyle,\n mergeStyles,\n Persona,\n PersonaPresence,\n PersonaSize,\n Stack,\n Text\n} from '@fluentui/react';\nimport React, { useMemo, useRef, useState } from 'react';\nimport { useIdentifiers } from '../identifiers';\nimport { useLocale } from '../localization';\nimport { useTheme } from '../theming';\nimport { BaseCustomStyles, OnRenderAvatarCallback } from '../types';\nimport {\n iconContainerStyle,\n iconStyles,\n meContainerStyle,\n menuButtonContainerStyle,\n participantItemContainerStyle,\n participantStateMaxWidth,\n participantStateStringStyles\n} from './styles/ParticipantItem.styles';\nimport { _preventDismissOnEvent as preventDismissOnEvent } from '@internal/acs-ui-common';\n/* @conditional-compile-remove(one-to-n-calling) /\n/ @conditional-compile-remove(PSTN-calls) /\nimport { ParticipantState } from '../types';\nimport { useId } from '@fluentui/react-hooks';\n\n/\n Fluent styles for {@link ParticipantItem}.\n \n @public\n /\nexport interface ParticipantItemStyles extends BaseCustomStyles {\n /* Styles for the avatar. /\n avatar?: IStyle;\n /* Styles for the (You) string. /\n me?: IStyle;\n /* Styles for the container of the icon. /\n iconContainer?: IStyle;\n /* Styles for the menu. /\n menu?: IStyle;\n}\n\n/\n Strings of {@link ParticipantItem} that can be overridden.\n \n @public\n /\nexport interface ParticipantItemStrings {\n /* String shown when participant is me /\n isMeText: string;\n /* String shown when hovering over menu button /\n menuTitle: string;\n /* Label for the remove button in participant menu /\n removeButtonLabel: string;\n /* Label for the sharing icon in participant state stack /\n sharingIconLabel: string;\n /* Label for the muted icon in participant state stack /\n mutedIconLabel: string;\n /* placeholder text for participants who does not have a display name/\n displayNamePlaceholder?: string;\n / @conditional-compile-remove(one-to-n-calling) /\n / @conditional-compile-remove(PSTN-calls) /\n /* String shown when `participantState` is `Ringing` /\n participantStateRinging?: string;\n / @conditional-compile-remove(one-to-n-calling) /\n / @conditional-compile-remove(PSTN-calls) /\n /* String shown when `participantState` is `Hold` /\n participantStateHold?: string;\n / @conditional-compile-remove(hide-attendee-name) /\n /* String for the attendee role /\n attendeeRole: string;\n}\n\n/\n Props for {@link ParticipantItem}.\n \n @public\n /\nexport interface ParticipantItemProps {\n /* Unique User ID of the participant. This `userId` is available in the `onRenderAvatar` callback function /\n userId?: string;\n /* Name of participant. /\n displayName?: string;\n /* Optional indicator to show participant is the user. /\n me?: boolean;\n /* Optional callback returning a JSX element to override avatar. /\n onRenderAvatar?: OnRenderAvatarCallback;\n /* Optional array of IContextualMenuItem for contextual menu. /\n menuItems?: IContextualMenuItem[];\n /* Optional callback returning a JSX element rendered on the right portion of the ParticipantItem. Intended for adding icons. /\n onRenderIcon?: (props?: ParticipantItemProps) => JSX.Element \| null;\n /* Optional PersonaPresence to show participant presence. This will not have an effect if property avatar is assigned. /\n presence?: PersonaPresence;\n /\n Allows users to pass in an object contains custom CSS styles.\n * @Example\n * ```\n * <ParticipantItem styles={{ root: { background: 'blue' } }} />\n * ```\n /\n styles?: ParticipantItemStyles;\n /\n Optional strings to override in component\n /\n strings?: Partial<ParticipantItemStrings>;\n /\n Optional callback when component is clicked\n /\n onClick?: (props?: ParticipantItemProps) => void;\n /* Optional value to determine if the tooltip should be shown for participants or not /\n showParticipantOverflowTooltip?: boolean;\n / @conditional-compile-remove(one-to-n-calling) /\n / @conditional-compile-remove(PSTN-calls) /\n /\n Optional value to determine and display a participants connection status.\n * For example, `Connecting`, `Ringing` etc.\n * The actual text that is displayed is determined by the localized string\n * corresponding to the provided participant state.\n * For example, `strings.participantStateConnecting` will be used if `participantState` is `Connecting`.\n /\n participantState?: ParticipantState;\n /\n Optional aria property that prefixes the ParticipantItems aria content\n * Takes in a unique id value of the element you would like to be read before the ParticipantItem.\n /\n ariaLabelledBy?: string;\n}\n\n/\n Component to render a calling or chat participant.\n \n Displays the participant's avatar, displayName and status as well as optional icons and context menu.\n \n @public\n /\nexport const ParticipantItem = (props: ParticipantItemProps): JSX.Element => {\n const {\n userId,\n displayName,\n onRenderAvatar,\n menuItems,\n onRenderIcon,\n presence,\n styles,\n me,\n onClick,\n showParticipantOverflowTooltip\n } = props;\n const [itemHovered, setItemHovered] = useState<boolean>(false);\n const [itemFocused, setItemFocused] = useState<boolean>(false);\n const [menuHidden, setMenuHidden] = useState<boolean>(true);\n const containerRef = useRef<HTMLDivElement>(null);\n const theme = useTheme();\n const localeStrings = useLocale().strings.participantItem;\n const ids = useIdentifiers();\n const uniqueId = useId();\n\n const strings = { ...localeStrings, ...props.strings };\n\n // For 'me' show empty name so avatar will get 'Person' icon, when there is no name\n const meAvatarText = displayName?.trim() \|\| '';\n\n const avatarOptions = {\n text: me ? meAvatarText : displayName?.trim() \|\| strings.displayNamePlaceholder,\n size: PersonaSize.size32,\n presence: presence,\n initialsTextColor: 'white',\n showOverflowTooltip: showParticipantOverflowTooltip,\n showUnknownPersonaCoin: !me && (!displayName?.trim() \|\| displayName === strings.displayNamePlaceholder)\n };\n\n const avatar = onRenderAvatar ? (\n onRenderAvatar(userId ?? '', avatarOptions)\n ) : (\n <Persona\n className={mergeStyles(\n {\n // Prevents persona text from being vertically truncated if a global line height is less than 1.15.\n lineHeight: '1.15rem'\n },\n styles?.avatar\n )}\n {...avatarOptions}\n />\n );\n\n const meTextStyle = useMemo(\n () => mergeStyles(meContainerStyle, { color: theme.palette.neutralSecondary }, styles?.me),\n [theme.palette.neutralSecondary, styles?.me]\n );\n const contextualMenuStyle = useMemo(\n () => mergeStyles({ background: theme.palette.neutralLighterAlt }, styles?.menu),\n [theme.palette.neutralLighterAlt, styles?.menu]\n );\n const infoContainerStyle = useMemo(\n () =>\n mergeStyles(\n iconContainerStyle,\n { color: theme.palette.neutralTertiary, marginLeft: 'auto' },\n styles?.iconContainer\n ),\n [theme.palette.neutralTertiary, styles?.iconContainer]\n );\n\n const onDismissMenu = (): void => {\n setItemHovered(false);\n setItemFocused(false);\n setMenuHidden(true);\n };\n\n const menuButton = useMemo(\n () => (\n <Stack\n horizontal={true}\n horizontalAlign=\"end\"\n className={mergeStyles(menuButtonContainerStyle)}\n title={strings.menuTitle}\n data-ui-id={ids.participantItemMenuButton}\n >\n <Icon\n iconName={\n itemHovered \|\| itemFocused \|\| !menuHidden ? 'ParticipantItemOptionsHovered' : 'ParticipantItemOptions'\n }\n className={iconStyles}\n />\n </Stack>\n ),\n [strings.menuTitle, ids.participantItemMenuButton, itemHovered, itemFocused, menuHidden]\n );\n\n const participantStateString = participantStateStringTrampoline(props, strings);\n return (\n <div\n ref={containerRef}\n role={'menuitem'}\n data-is-focusable={true}\n data-ui-id=\"participant-item\"\n className={mergeStyles(\n participantItemContainerStyle({\n localparticipant: me,\n clickable: !!menuItems && menuItems.length > 0\n }),\n styles?.root\n )}\n onMouseEnter={() => setItemHovered(true)}\n onMouseLeave={() => setItemHovered(false)}\n onFocus={() => setItemFocused(true)}\n onBlur={() => setItemFocused(false)}\n onClick={() => {\n if (!participantStateString) {\n setItemHovered(true);\n setItemFocused(false);\n setMenuHidden(false);\n onClick?.(props);\n }\n if (!menuHidden) {\n onDismissMenu();\n }\n }}\n tabIndex={0}\n >\n <Stack\n horizontal\n className={mergeStyles({\n width: `calc(100% - ${\n !me && participantStateString ? participantStateMaxWidth : menuButtonContainerStyle.width\n })`,\n alignItems: 'center'\n })}\n id={uniqueId}\n aria-labelledby={`${props.ariaLabelledBy} ${uniqueId}`}\n >\n {avatar}\n {me && <Text className={meTextStyle}>{strings.isMeText}</Text>}\n <Stack horizontal className={mergeStyles(infoContainerStyle)}>\n {onRenderIcon && onRenderIcon(props)}\n </Stack>\n </Stack>\n {/ When the participantStateString has a value, we don't show the menu /}\n {!me && participantStateString ? (\n <Text data-ui-id=\"participant-item-state-string\" className={mergeStyles(participantStateStringStyles)}>\n {participantStateString}\n </Text>\n ) : (\n <div>\n {menuItems && menuItems.length > 0 && (\n <>\n {menuButton}\n <ContextualMenu\n items={menuItems}\n hidden={menuHidden}\n target={containerRef}\n onItemClick={onDismissMenu}\n onDismiss={onDismissMenu}\n directionalHint={DirectionalHint.bottomRightEdge}\n className={contextualMenuStyle}\n calloutProps={{\n preventDismissOnEvent\n }}\n />\n </>\n )}\n </div>\n )}\n </div>\n );\n};\n\nconst participantStateStringTrampoline = (\n props: ParticipantItemProps,\n strings: ParticipantItemStrings\n): string \| undefined => {\n / @conditional-compile-remove(one-to-n-calling) /\n / @conditional-compile-remove(PSTN-calls) */\n return props.participantState === 'EarlyMedia' \|\| props.participantState === 'Ringing'\n ? strings?.participantStateRinging\n : props.participantState === 'Hold'\n ? strings?.participantStateHold\n : undefined;\n\n return undefined;\n};\n"]}
1	+ {"version":3,"file":"ParticipantItem.js","sourceRoot":"","sources":["../../../../../../react-components/src/components/ParticipantItem.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport {\n ContextualMenu,\n DirectionalHint,\n Icon,\n IContextualMenuItem,\n IStyle,\n mergeStyles,\n Persona,\n PersonaPresence,\n PersonaSize,\n Stack,\n Text\n} from '@fluentui/react';\nimport React, { useMemo, useRef, useState } from 'react';\nimport { useIdentifiers } from '../identifiers';\nimport { useLocale } from '../localization';\nimport { useTheme } from '../theming';\nimport { BaseCustomStyles, OnRenderAvatarCallback } from '../types';\nimport {\n iconContainerStyle,\n iconStyles,\n meContainerStyle,\n menuButtonContainerStyle,\n participantItemContainerStyle,\n participantStateMaxWidth,\n participantStateStringStyles\n} from './styles/ParticipantItem.styles';\nimport { _preventDismissOnEvent as preventDismissOnEvent } from '@internal/acs-ui-common';\n/* @conditional-compile-remove(one-to-n-calling) /\n/ @conditional-compile-remove(PSTN-calls) /\nimport { ParticipantState } from '../types';\nimport { useId } from '@fluentui/react-hooks';\n\n/\n Fluent styles for {@link ParticipantItem}.\n \n @public\n /\nexport interface ParticipantItemStyles extends BaseCustomStyles {\n /* Styles for the avatar. /\n avatar?: IStyle;\n /* Styles for the (You) string. /\n me?: IStyle;\n /* Styles for the container of the icon. /\n iconContainer?: IStyle;\n /* Styles for the menu. /\n menu?: IStyle;\n}\n\n/\n Strings of {@link ParticipantItem} that can be overridden.\n \n @public\n /\nexport interface ParticipantItemStrings {\n /* String shown when participant is me /\n isMeText: string;\n /* String shown when hovering over menu button /\n menuTitle: string;\n /* Label for the remove button in participant menu /\n removeButtonLabel: string;\n /* Label for the sharing icon in participant state stack /\n sharingIconLabel: string;\n /* Label for the muted icon in participant state stack /\n mutedIconLabel: string;\n /* placeholder text for participants who does not have a display name/\n displayNamePlaceholder?: string;\n / @conditional-compile-remove(one-to-n-calling) /\n / @conditional-compile-remove(PSTN-calls) /\n /* String shown when `participantState` is `Ringing` /\n participantStateRinging?: string;\n / @conditional-compile-remove(one-to-n-calling) /\n / @conditional-compile-remove(PSTN-calls) /\n /* String shown when `participantState` is `Hold` /\n participantStateHold?: string;\n / @conditional-compile-remove(hide-attendee-name) /\n /* String for the attendee role /\n attendeeRole: string;\n}\n\n/\n Props for {@link ParticipantItem}.\n \n @public\n /\nexport interface ParticipantItemProps {\n /* Unique User ID of the participant. This `userId` is available in the `onRenderAvatar` callback function /\n userId?: string;\n /* Name of participant. /\n displayName?: string;\n /* Optional indicator to show participant is the user. /\n me?: boolean;\n /* Optional callback returning a JSX element to override avatar. /\n onRenderAvatar?: OnRenderAvatarCallback;\n /* Optional array of IContextualMenuItem for contextual menu. /\n menuItems?: IContextualMenuItem[];\n /* Optional callback returning a JSX element rendered on the right portion of the ParticipantItem. Intended for adding icons. /\n onRenderIcon?: (props?: ParticipantItemProps) => JSX.Element \| null;\n /* Optional PersonaPresence to show participant presence. This will not have an effect if property avatar is assigned. /\n presence?: PersonaPresence;\n /\n Allows users to pass in an object contains custom CSS styles.\n * @Example\n * ```\n * <ParticipantItem styles={{ root: { background: 'blue' } }} />\n * ```\n /\n styles?: ParticipantItemStyles;\n /\n Optional strings to override in component\n /\n strings?: Partial<ParticipantItemStrings>;\n /\n Optional callback when component is clicked\n /\n onClick?: (props?: ParticipantItemProps) => void;\n /* Optional value to determine if the tooltip should be shown for participants or not /\n showParticipantOverflowTooltip?: boolean;\n / @conditional-compile-remove(one-to-n-calling) /\n / @conditional-compile-remove(PSTN-calls) /\n /\n Optional value to determine and display a participants connection status.\n * For example, `Connecting`, `Ringing` etc.\n * The actual text that is displayed is determined by the localized string\n * corresponding to the provided participant state.\n * For example, `strings.participantStateConnecting` will be used if `participantState` is `Connecting`.\n /\n participantState?: ParticipantState;\n /\n Optional aria property that prefixes the ParticipantItems aria content\n * Takes in a unique id value of the element you would like to be read before the ParticipantItem.\n /\n ariaLabelledBy?: string;\n}\n\n/\n Component to render a calling or chat participant.\n \n Displays the participant's avatar, displayName and status as well as optional icons and context menu.\n \n @public\n /\nexport const ParticipantItem = (props: ParticipantItemProps): JSX.Element => {\n const {\n userId,\n displayName,\n onRenderAvatar,\n menuItems,\n onRenderIcon,\n presence,\n styles,\n me,\n onClick,\n showParticipantOverflowTooltip\n } = props;\n const [itemHovered, setItemHovered] = useState<boolean>(false);\n const [itemFocused, setItemFocused] = useState<boolean>(false);\n const [menuHidden, setMenuHidden] = useState<boolean>(true);\n const containerRef = useRef<HTMLDivElement>(null);\n const theme = useTheme();\n const localeStrings = useLocale().strings.participantItem;\n const ids = useIdentifiers();\n const uniqueId = useId();\n\n const strings = { ...localeStrings, ...props.strings };\n\n // For 'me' show empty name so avatar will get 'Person' icon, when there is no name\n const meAvatarText = displayName?.trim() \|\| '';\n\n const avatarOptions = {\n text: me ? meAvatarText : displayName?.trim() \|\| strings.displayNamePlaceholder,\n size: PersonaSize.size32,\n presence: presence,\n initialsTextColor: 'white',\n showOverflowTooltip: showParticipantOverflowTooltip,\n showUnknownPersonaCoin: !me && (!displayName?.trim() \|\| displayName === strings.displayNamePlaceholder)\n };\n\n const avatar = onRenderAvatar ? (\n onRenderAvatar(userId ?? '', avatarOptions)\n ) : (\n <Persona\n className={mergeStyles(\n {\n // Prevents persona text from being vertically truncated if a global line height is less than 1.15.\n lineHeight: '1.15rem'\n },\n styles?.avatar\n )}\n {...avatarOptions}\n />\n );\n\n const meTextStyle = useMemo(\n () => mergeStyles(meContainerStyle, { color: theme.palette.neutralSecondary }, styles?.me),\n [theme.palette.neutralSecondary, styles?.me]\n );\n const contextualMenuStyle = useMemo(\n () => mergeStyles({ background: theme.palette.neutralLighterAlt }, styles?.menu),\n [theme.palette.neutralLighterAlt, styles?.menu]\n );\n const infoContainerStyle = useMemo(\n () =>\n mergeStyles(\n iconContainerStyle,\n { color: theme.palette.neutralTertiary, marginLeft: 'auto' },\n styles?.iconContainer\n ),\n [theme.palette.neutralTertiary, styles?.iconContainer]\n );\n\n const onDismissMenu = (): void => {\n setItemHovered(false);\n setItemFocused(false);\n setMenuHidden(true);\n };\n\n const menuButton = useMemo(\n () => (\n <Stack\n horizontal={true}\n horizontalAlign=\"end\"\n className={mergeStyles(menuButtonContainerStyle)}\n title={strings.menuTitle}\n data-ui-id={ids.participantItemMenuButton}\n >\n <Icon\n iconName={\n itemHovered \|\| itemFocused \|\| !menuHidden ? 'ParticipantItemOptionsHovered' : 'ParticipantItemOptions'\n }\n className={iconStyles}\n />\n </Stack>\n ),\n [strings.menuTitle, ids.participantItemMenuButton, itemHovered, itemFocused, menuHidden]\n );\n\n const participantStateString = participantStateStringTrampoline(props, strings);\n return (\n <div\n ref={containerRef}\n role={'menuitem'}\n data-is-focusable={true}\n data-ui-id=\"participant-item\"\n className={mergeStyles(\n participantItemContainerStyle({ clickable: !!menuItems && menuItems.length > 0 }),\n styles?.root\n )}\n onMouseEnter={() => setItemHovered(true)}\n onMouseLeave={() => setItemHovered(false)}\n onFocus={() => setItemFocused(true)}\n onBlur={() => setItemFocused(false)}\n onClick={() => {\n if (!participantStateString) {\n setItemHovered(true);\n setItemFocused(false);\n setMenuHidden(false);\n onClick?.(props);\n }\n if (!menuHidden) {\n onDismissMenu();\n }\n }}\n tabIndex={0}\n >\n <Stack\n horizontal\n className={mergeStyles({\n width: `calc(100% - ${\n !me && participantStateString ? participantStateMaxWidth : menuButtonContainerStyle.width\n })`,\n alignItems: 'center'\n })}\n id={uniqueId}\n aria-labelledby={`${props.ariaLabelledBy} ${uniqueId}`}\n >\n {avatar}\n {me && <Text className={meTextStyle}>{strings.isMeText}</Text>}\n <Stack horizontal className={mergeStyles(infoContainerStyle)}>\n {onRenderIcon && onRenderIcon(props)}\n </Stack>\n </Stack>\n {/ When the participantStateString has a value, we don't show the menu /}\n {!me && participantStateString ? (\n <Text data-ui-id=\"participant-item-state-string\" className={mergeStyles(participantStateStringStyles)}>\n {participantStateString}\n </Text>\n ) : (\n <div>\n {menuItems && menuItems.length > 0 && (\n <>\n {menuButton}\n <ContextualMenu\n items={menuItems}\n hidden={menuHidden}\n target={containerRef}\n onItemClick={onDismissMenu}\n onDismiss={onDismissMenu}\n directionalHint={DirectionalHint.bottomRightEdge}\n className={contextualMenuStyle}\n calloutProps={{\n preventDismissOnEvent\n }}\n />\n </>\n )}\n </div>\n )}\n </div>\n );\n};\n\nconst participantStateStringTrampoline = (\n props: ParticipantItemProps,\n strings: ParticipantItemStrings\n): string \| undefined => {\n / @conditional-compile-remove(one-to-n-calling) /\n / @conditional-compile-remove(PSTN-calls) */\n return props.participantState === 'EarlyMedia' \|\| props.participantState === 'Ringing'\n ? strings?.participantStateRinging\n : props.participantState === 'Hold'\n ? strings?.participantStateHold\n : undefined;\n\n return undefined;\n};\n"]}

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

@@ -373,8 +373,8 @@ export const TextFieldWithMention = (props) => {
             });
         }
     }, [updateSelectionIndexesWithMentionIfNeeded, setSelectionStartValue, setSelectionEndValue]);
-    const handleOnChange = useCallback(({ currentSelectionEnd, currentSelectionStart, currentTriggerStartIndex, event, htmlTextValue, inputTextValue, previousSelectionEnd, previousSelectionStart, tagsValue, updatedValue }) => __awaiter(void 0, void 0, void 0, function* () {
-        var _b;
+    const handleOnChange = useCallback((_b) => __awaiter(void 0, [_b], void 0, function* ({ currentSelectionEnd, currentSelectionStart, currentTriggerStartIndex, event, htmlTextValue, inputTextValue, previousSelectionEnd, previousSelectionStart, tagsValue, updatedValue }) {
+        var _c;
         debouncedQueryUpdate.cancel();
         if (event.currentTarget === null) {
             return;
@@ -383,7 +383,7 @@ export const TextFieldWithMention = (props) => {
         // onSelect is not called for backspace as selection is not changed and local caret index is outdated
         setCaretIndex(undefined);
         const newValue = updatedValue !== null && updatedValue !== void 0 ? updatedValue : '';
-        const triggerText = (_b = mentionLookupOptions === null || mentionLookupOptions === void 0 ? void 0 : mentionLookupOptions.trigger) !== null && _b !== void 0 ? _b : DEFAULT_MENTION_TRIGGER;
+        const triggerText = (_c = mentionLookupOptions === null || mentionLookupOptions === void 0 ? void 0 : mentionLookupOptions.trigger) !== null && _c !== void 0 ? _c : DEFAULT_MENTION_TRIGGER;
         const newTextLength = newValue.length;
         // updating indexes to set between 0 and text length, otherwise selectionRange won't be set correctly
         const currentSelectionEndValue = getValidatedIndexInRange({

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

	@@ -1 +1 @@
1	- {"version":3,"file":"TextFieldWithMention.js","sourceRoot":"","sources":["../../../../../../../react-components/src/components/TextFieldWithMention/TextFieldWithMention.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React, { useState, FormEvent, useCallback, useRef } from 'react';\nimport { useEffect, useMemo } from 'react';\nimport { useLocale } from '../../localization';\nimport { Announcer } from '../Announcer';\nimport { TextField, ITextField, ITextFieldProps } from '@fluentui/react';\n\nimport { isEnterKeyEventFromCompositionSession, nullToUndefined } from '../utils';\nimport {\n TagData,\n findMentionTagForSelection,\n findNewSelectionIndexForMention,\n findStringsDiffIndexes,\n getDisplayNameForMentionSuggestion,\n getValidatedIndexInRange,\n htmlStringForMentionSuggestion,\n textToTagParser,\n updateHTML\n} from './mentionTagUtils';\n\nimport { Caret } from 'textarea-caret-ts';\n\nimport { MentionLookupOptions, _MentionPopover, Mention } from '../MentionPopover';\n\nimport { useDebouncedCallback } from 'use-debounce';\n\nconst DEFAULT_MENTION_TRIGGER = '@';\n\n/*\n Props for the TextFieldWithMention component.\n \n @private\n /\nexport interface TextFieldWithMentionProps {\n textFieldProps: ITextFieldProps;\n dataUiId?: string;\n textValue: string; // This could be plain text or HTML.\n onChange: (event?: FormEvent<HTMLInputElement \| HTMLTextAreaElement>, newValue?: string) => void;\n onKeyDown?: (ev: React.KeyboardEvent<HTMLInputElement \| HTMLTextAreaElement>) => void;\n onEnterKeyDown?: () => void;\n textFieldRef?: React.RefObject<ITextField>;\n supportNewline?: boolean;\n mentionLookupOptions?: MentionLookupOptions;\n}\n\n/\n @private\n */\nexport const TextFieldWithMention = (props: TextFieldWithMentionProps): JSX.Element => {\n const {\n textFieldProps,\n dataUiId,\n textValue,\n onChange,\n textFieldRef,\n onKeyDown,\n onEnterKeyDown,\n supportNewline,\n mentionLookupOptions\n } = props;\n const inputBoxRef = useRef<HTMLDivElement>(null);\n\n // Current suggestion list, provided by the callback\n const [mentionSuggestions, setMentionSuggestions] = useState<Mention[]>([]);\n\n // Current suggestion list, provided by the callback\n const [activeSuggestionIndex, setActiveSuggestionIndex] = useState<number \| undefined>(undefined);\n\n // Index of the current trigger character in the text field\n const [currentTriggerStartIndex, setCurrentTriggerStartIndex] = useState<number>(-1);\n\n const [inputTextValue, setInputTextValue] = useState<string>('');\n\n // Internal value for text value prop\n const [internalTextValue, setInternalTextValue] = useState<string>('');\n\n const [tagsValue, setTagsValue] = useState<TagData[]>([]);\n\n // Index of the previous selection start in the text field\n const [selectionStartValue, setSelectionStartValue] = useState<number \| undefined>();\n\n // Index of the previous selection end in the text field\n const [selectionEndValue, setSelectionEndValue] = useState<number \| undefined>();\n\n // Boolean value to check if onMouseDown event should be handled during select as selection range\n // for onMouseDown event is not updated yet and the selection range for mouse click/taps will be\n // updated in onSelect event if needed.\n const [shouldHandleOnMouseDownDuringSelect, setShouldHandleOnMouseDownDuringSelect] = useState<boolean>(true);\n\n // Boolean flag to check if mouse/touch move event should be handled\n const [shouldHandleMoveEvent, setShouldHandleMoveEvent] = useState<boolean>(false);\n\n // Indexes of start of touch/mouse selection\n const [interactionStartSelection, setInteractionStartSelection] = useState<\n { start: number \| undefined; end: number \| undefined } \| undefined\n >();\n\n // Caret position in the text field\n const [caretPosition, setCaretPosition] = useState<Caret.Position \| undefined>(undefined);\n\n // Index of where the caret is in the text field\n const [caretIndex, setCaretIndex] = useState<number \| undefined>(undefined);\n\n const localeStrings = useLocale().strings;\n\n // Set mention suggestions\n const updateMentionSuggestions = useCallback(\n (suggestions: Mention[]) => {\n setMentionSuggestions(suggestions);\n },\n [setMentionSuggestions]\n );\n\n useEffect(() => {\n setInternalTextValue(textValue);\n // update mention suggestions before the next render cycle\n updateMentionSuggestions([]);\n }, [textValue, updateMentionSuggestions]);\n\n // Parse the text and get the plain text version to display in the input box\n useEffect(() => {\n const trigger = mentionLookupOptions?.trigger \|\| DEFAULT_MENTION_TRIGGER;\n const parsedHTMLData = textToTagParser(internalTextValue, trigger);\n setInputTextValue(parsedHTMLData.plainText);\n setTagsValue(parsedHTMLData.tags);\n updateMentionSuggestions([]);\n }, [internalTextValue, mentionLookupOptions?.trigger, updateMentionSuggestions]);\n\n useEffect(() => {\n // effect for caret index update\n if (caretIndex === undefined \|\| textFieldRef === undefined \|\| textFieldRef?.current === undefined) {\n return;\n }\n // get validated caret index between 0 and inputTextValue.length otherwise caret will be set to incorrect index\n const updatedCaretIndex = getValidatedIndexInRange({\n min: 0,\n max: inputTextValue.length,\n currentValue: caretIndex\n });\n textFieldRef?.current?.setSelectionRange(updatedCaretIndex, updatedCaretIndex);\n setSelectionStartValue(updatedCaretIndex);\n setSelectionEndValue(updatedCaretIndex);\n }, [caretIndex, inputTextValue, textFieldRef, setSelectionStartValue, setSelectionEndValue]);\n\n const onSuggestionSelected = useCallback(\n (suggestion: Mention) => {\n let selectionEnd = textFieldRef?.current?.selectionEnd \|\| -1;\n if (selectionEnd < 0) {\n selectionEnd = 0;\n } else if (selectionEnd > inputTextValue.length) {\n selectionEnd = inputTextValue.length;\n }\n const oldPlainText = inputTextValue;\n const mention = htmlStringForMentionSuggestion(suggestion, localeStrings);\n\n // update plain text with the mention html text\n const triggerText = mentionLookupOptions?.trigger ?? DEFAULT_MENTION_TRIGGER;\n // update html text with updated plain text\n const updatedContent = updateHTML({\n htmlText: internalTextValue,\n oldPlainText,\n tags: tagsValue,\n startIndex: currentTriggerStartIndex,\n oldPlainTextEndIndex: selectionEnd,\n change: mention,\n mentionTrigger: triggerText\n });\n\n setInternalTextValue(updatedContent.updatedHTML);\n const displayName = getDisplayNameForMentionSuggestion(suggestion, localeStrings);\n const newCaretIndex = currentTriggerStartIndex + displayName.length + triggerText.length;\n // move the caret in the text field to the end of the mention plain text\n setCaretIndex(newCaretIndex);\n setSelectionEndValue(newCaretIndex);\n setSelectionStartValue(newCaretIndex);\n setCurrentTriggerStartIndex(-1);\n updateMentionSuggestions([]);\n // set focus back to text field\n textFieldRef?.current?.focus();\n setActiveSuggestionIndex(undefined);\n onChange && onChange(undefined, updatedContent.updatedHTML);\n },\n [\n textFieldRef,\n inputTextValue,\n currentTriggerStartIndex,\n mentionLookupOptions?.trigger,\n onChange,\n internalTextValue,\n tagsValue,\n updateMentionSuggestions,\n localeStrings\n ]\n );\n\n const onTextFieldKeyDown = useCallback(\n (ev: React.KeyboardEvent<HTMLInputElement \| HTMLTextAreaElement>) => {\n // caretIndex should be set to undefined when the user is typing\n setCaretIndex(undefined);\n // shouldHandleOnMouseDownDuringSelect should be set to false after the last mouse down event.\n // it shouldn't be updated in onMouseUp\n // as onMouseUp can be triggered before or after onSelect event\n // because its order depends on mouse events not selection.\n setShouldHandleOnMouseDownDuringSelect(false);\n\n if (isEnterKeyEventFromCompositionSession(ev)) {\n return;\n }\n let isActiveSuggestionIndexUpdated = false;\n if (mentionSuggestions.length > 0) {\n if (ev.key === 'ArrowUp') {\n ev.preventDefault();\n const newActiveIndex =\n activeSuggestionIndex === undefined\n ? mentionSuggestions.length - 1\n : Math.max(activeSuggestionIndex - 1, 0);\n setActiveSuggestionIndex(newActiveIndex);\n isActiveSuggestionIndexUpdated = true;\n } else if (ev.key === 'ArrowDown') {\n ev.preventDefault();\n const newActiveIndex =\n activeSuggestionIndex === undefined\n ? 0\n : Math.min(activeSuggestionIndex + 1, mentionSuggestions.length - 1);\n setActiveSuggestionIndex(newActiveIndex);\n isActiveSuggestionIndexUpdated = true;\n } else if (ev.key === 'Escape') {\n updateMentionSuggestions([]);\n // reset active suggestion index when suggestions are closed\n setActiveSuggestionIndex(undefined);\n isActiveSuggestionIndexUpdated = true;\n }\n }\n if (ev.key === 'Enter' && (ev.shiftKey === false \|\| !supportNewline)) {\n ev.preventDefault();\n\n // If we are looking up a mention, select the focused suggestion\n if (mentionSuggestions.length > 0 && activeSuggestionIndex !== undefined) {\n const selectedMention = mentionSuggestions[activeSuggestionIndex];\n if (selectedMention) {\n onSuggestionSelected(selectedMention);\n return;\n }\n }\n\n onEnterKeyDown && onEnterKeyDown();\n } else if (!isActiveSuggestionIndexUpdated) {\n // Update the active suggestion index if the user is typing,\n // otherwise the focus will be lost\n setActiveSuggestionIndex(undefined);\n }\n onKeyDown && onKeyDown(ev);\n },\n [\n onEnterKeyDown,\n onKeyDown,\n supportNewline,\n mentionSuggestions,\n activeSuggestionIndex,\n onSuggestionSelected,\n updateMentionSuggestions\n ]\n );\n\n const debouncedQueryUpdate = useDebouncedCallback(async (query: string) => {\n let suggestions = (await mentionLookupOptions?.onQueryUpdated(query)) ?? [];\n suggestions = suggestions.filter((suggestion) => suggestion.displayText.trim() !== '');\n if (suggestions.length === 0) {\n setActiveSuggestionIndex(undefined);\n } else if (activeSuggestionIndex === undefined) {\n // Set the active to the first, if it's not already set\n setActiveSuggestionIndex(0);\n }\n updateMentionSuggestions(suggestions);\n }, 500);\n\n // Update selections index in mention to navigate by words\n const updateSelectionIndexesWithMentionIfNeeded = useCallback(\n ({\n event,\n inputTextValue,\n selectionEndValue,\n selectionStartValue,\n tagsValue\n }: {\n event: FormEvent<HTMLInputElement \| HTMLTextAreaElement>;\n inputTextValue: string;\n selectionEndValue?: number;\n selectionStartValue?: number;\n tagsValue: TagData[];\n }): void => {\n let updatedStartIndex = event.currentTarget.selectionStart;\n let updatedEndIndex = event.currentTarget.selectionEnd;\n if (\n event.currentTarget.selectionStart === event.currentTarget.selectionEnd &&\n event.currentTarget.selectionStart !== null &&\n event.currentTarget.selectionStart !== -1\n ) {\n // just a caret movement/usual typing or deleting\n const mentionTag = findMentionTagForSelection(tagsValue, event.currentTarget.selectionStart);\n // don't include boundary cases to show correct selection, otherwise it will show selection at mention boundaries\n if (\n mentionTag !== undefined &&\n mentionTag.plainTextBeginIndex !== undefined &&\n event.currentTarget.selectionStart > mentionTag.plainTextBeginIndex &&\n event.currentTarget.selectionStart < (mentionTag.plainTextEndIndex ?? mentionTag.plainTextBeginIndex)\n ) {\n // get updated selection index\n const newSelectionIndex = findNewSelectionIndexForMention({\n tag: mentionTag,\n textValue: inputTextValue,\n currentSelectionIndex: event.currentTarget.selectionStart,\n previousSelectionIndex: selectionStartValue ?? inputTextValue.length\n });\n updatedStartIndex = newSelectionIndex;\n updatedEndIndex = newSelectionIndex;\n }\n } else if (event.currentTarget.selectionStart !== event.currentTarget.selectionEnd) {\n // Both e.currentTarget.selectionStart !== selectionStartValue and e.currentTarget.selectionEnd !== selectionEndValue can be true when a user selects a text by double click\n if (event.currentTarget.selectionStart !== null && event.currentTarget.selectionStart !== selectionStartValue) {\n // the selection start is changed\n const mentionTag = findMentionTagForSelection(tagsValue, event.currentTarget.selectionStart);\n // don't include boundary cases to show correct selection, otherwise it will show selection at mention boundaries\n if (\n mentionTag !== undefined &&\n mentionTag.plainTextBeginIndex !== undefined &&\n event.currentTarget.selectionStart > mentionTag.plainTextBeginIndex &&\n event.currentTarget.selectionStart < (mentionTag.plainTextEndIndex ?? mentionTag.plainTextBeginIndex)\n ) {\n updatedStartIndex = findNewSelectionIndexForMention({\n tag: mentionTag,\n textValue: inputTextValue,\n currentSelectionIndex: event.currentTarget.selectionStart,\n previousSelectionIndex: selectionStartValue ?? inputTextValue.length\n });\n }\n }\n if (event.currentTarget.selectionEnd !== null && event.currentTarget.selectionEnd !== selectionEndValue) {\n // the selection end is changed\n const mentionTag = findMentionTagForSelection(tagsValue, event.currentTarget.selectionEnd);\n // don't include boundary cases to show correct selection, otherwise it will show selection at mention boundaries\n if (\n mentionTag !== undefined &&\n mentionTag.plainTextBeginIndex !== undefined &&\n event.currentTarget.selectionEnd > mentionTag.plainTextBeginIndex &&\n event.currentTarget.selectionEnd < (mentionTag.plainTextEndIndex ?? mentionTag.plainTextBeginIndex)\n ) {\n updatedEndIndex = findNewSelectionIndexForMention({\n tag: mentionTag,\n textValue: inputTextValue,\n currentSelectionIndex: event.currentTarget.selectionEnd,\n previousSelectionIndex: selectionEndValue ?? inputTextValue.length\n });\n }\n }\n }\n // e.currentTarget.selectionDirection should be set to handle shift + arrow keys\n if (event.currentTarget.selectionDirection === null) {\n event.currentTarget.setSelectionRange(updatedStartIndex, updatedEndIndex);\n } else {\n event.currentTarget.setSelectionRange(\n updatedStartIndex,\n updatedEndIndex,\n event.currentTarget.selectionDirection\n );\n }\n setSelectionStartValue(nullToUndefined(updatedStartIndex));\n setSelectionEndValue(nullToUndefined(updatedEndIndex));\n },\n [setSelectionStartValue, setSelectionEndValue]\n );\n\n const handleOnSelect = useCallback(\n ({\n event,\n inputTextValue,\n tags,\n shouldHandleOnMouseDownDuringSelect,\n selectionStartValue,\n selectionEndValue,\n interactionStartSelection\n }: {\n event: React.FormEvent<HTMLInputElement \| HTMLTextAreaElement>;\n inputTextValue: string;\n tags: TagData[];\n shouldHandleOnMouseDownDuringSelect: boolean;\n selectionStartValue?: number;\n selectionEndValue?: number;\n interactionStartSelection?: { start: number \| undefined; end: number \| undefined };\n }): void => {\n if (event.currentTarget.selectionStart === 0 && event.currentTarget.selectionEnd === inputTextValue.length) {\n // entire text is selected, no need to change anything\n setSelectionStartValue(event.currentTarget.selectionStart);\n setSelectionEndValue(event.currentTarget.selectionEnd);\n setInteractionStartSelection(undefined);\n setShouldHandleOnMouseDownDuringSelect(false);\n } else if (shouldHandleOnMouseDownDuringSelect) {\n if (\n interactionStartSelection !== undefined &&\n (interactionStartSelection.start !== event.currentTarget.selectionStart \|\|\n interactionStartSelection.end !== event.currentTarget.selectionEnd)\n ) {\n // selection was changed by mouse\n // for mouse selection only, it's possible to start selection in the middle of a word in a mention\n // because of this when event.currentTarget.selectionStart === mouseMoveStartPoint.start\n // selectionStartValue for updateSelectionIndexesWithMentionIfNeeded should be set\n // to the end of the input to mimic selection from right to left for the left selection index\n const updatedSelectionStartValue =\n event.currentTarget.selectionStart === interactionStartSelection.start\n ? inputTextValue.length\n : interactionStartSelection.start;\n // selectionStart is always less than selectionEnd so sometimes selectionEnd is user's start of the selection\n // so when event.currentTarget.selectionEnd === mouseMoveStartPoint.end\n // selectionEndValue for updateSelectionIndexesWithMentionIfNeeded should be set\n // to the beginning of the input to mimic selection from left to right for the right selection index\n const updatedSelectionEndValue =\n event.currentTarget.selectionEnd === interactionStartSelection.end ? 0 : interactionStartSelection.end;\n updateSelectionIndexesWithMentionIfNeeded({\n event,\n inputTextValue,\n selectionStartValue: updatedSelectionStartValue,\n selectionEndValue: updatedSelectionEndValue,\n tagsValue: tags\n });\n setInteractionStartSelection(undefined);\n setShouldHandleOnMouseDownDuringSelect(false);\n } else if (event.currentTarget.selectionStart !== null && event.currentTarget.selectionEnd !== null) {\n // on select was triggered by mouse down/up with no movement\n const mentionTag = findMentionTagForSelection(tags, event.currentTarget.selectionStart);\n if (mentionTag !== undefined && mentionTag.plainTextBeginIndex !== undefined) {\n // handle mention click by selecting the whole mention\n // if the selection is not on the bounds of the mention\n // disable selection for clicks on mention bounds\n const mentionEndIndex = mentionTag.plainTextEndIndex ?? mentionTag.plainTextBeginIndex;\n\n if (\n event.currentTarget.selectionStart !== event.currentTarget.selectionEnd &&\n event.currentTarget.selectionEnd > mentionEndIndex\n ) {\n // handle triple click when the text starts from mention\n if (event.currentTarget.selectionDirection === null) {\n event.currentTarget.setSelectionRange(mentionTag.plainTextBeginIndex, event.currentTarget.selectionEnd);\n } else {\n event.currentTarget.setSelectionRange(\n mentionTag.plainTextBeginIndex,\n event.currentTarget.selectionEnd,\n event.currentTarget.selectionDirection\n );\n }\n setSelectionStartValue(mentionTag.plainTextBeginIndex);\n setSelectionEndValue(event.currentTarget.selectionEnd);\n } else if (\n event.currentTarget.selectionStart !== event.currentTarget.selectionEnd \|\|\n (event.currentTarget.selectionStart !== mentionTag.plainTextBeginIndex &&\n event.currentTarget.selectionStart !== mentionEndIndex)\n ) {\n if (event.currentTarget.selectionDirection === null) {\n event.currentTarget.setSelectionRange(mentionTag.plainTextBeginIndex, mentionEndIndex);\n } else {\n event.currentTarget.setSelectionRange(\n mentionTag.plainTextBeginIndex,\n mentionEndIndex,\n event.currentTarget.selectionDirection\n );\n }\n setSelectionStartValue(mentionTag.plainTextBeginIndex);\n setSelectionEndValue(mentionEndIndex);\n } else {\n // bounds of the mention were selected\n setSelectionStartValue(event.currentTarget.selectionStart);\n setSelectionEndValue(event.currentTarget.selectionEnd);\n }\n } else {\n // not a mention tag\n setSelectionStartValue(event.currentTarget.selectionStart);\n setSelectionEndValue(nullToUndefined(event.currentTarget.selectionEnd));\n }\n setInteractionStartSelection(undefined);\n }\n } else {\n // selection was changed by keyboard\n updateSelectionIndexesWithMentionIfNeeded({\n event,\n inputTextValue,\n selectionStartValue,\n selectionEndValue,\n tagsValue: tags\n });\n }\n },\n [updateSelectionIndexesWithMentionIfNeeded, setSelectionStartValue, setSelectionEndValue]\n );\n\n type HandleOnChangeProps = {\n currentSelectionEnd?: number;\n currentSelectionStart?: number;\n currentTriggerStartIndex: number;\n event: React.FormEvent<HTMLInputElement \| HTMLTextAreaElement>;\n htmlTextValue: string;\n inputTextValue: string;\n previousSelectionEnd?: number;\n previousSelectionStart?: number;\n tagsValue: TagData[];\n updatedValue?: string;\n };\n\n const handleOnChange = useCallback(\n async ({\n currentSelectionEnd,\n currentSelectionStart,\n currentTriggerStartIndex,\n event,\n htmlTextValue,\n inputTextValue,\n previousSelectionEnd,\n previousSelectionStart,\n tagsValue,\n updatedValue\n }: HandleOnChangeProps): Promise<void> => {\n debouncedQueryUpdate.cancel();\n if (event.currentTarget === null) {\n return;\n }\n // handle backspace change\n // onSelect is not called for backspace as selection is not changed and local caret index is outdated\n setCaretIndex(undefined);\n const newValue = updatedValue ?? '';\n const triggerText = mentionLookupOptions?.trigger ?? DEFAULT_MENTION_TRIGGER;\n\n const newTextLength = newValue.length;\n // updating indexes to set between 0 and text length, otherwise selectionRange won't be set correctly\n const currentSelectionEndValue = getValidatedIndexInRange({\n min: 0,\n max: newTextLength,\n currentValue: currentSelectionEnd\n });\n const currentSelectionStartValue = getValidatedIndexInRange({\n min: 0,\n max: newTextLength,\n currentValue: currentSelectionStart\n });\n const previousSelectionStartValue = getValidatedIndexInRange({\n min: 0,\n max: inputTextValue.length,\n currentValue: previousSelectionStart\n });\n const previousSelectionEndValue = getValidatedIndexInRange({\n min: 0,\n max: inputTextValue.length,\n currentValue: previousSelectionEnd\n });\n\n // If we are enabled for lookups,\n if (mentionLookupOptions !== undefined) {\n // Look at the range of the change for a trigger character\n const triggerPriorIndex = newValue.lastIndexOf(triggerText, currentSelectionEndValue - 1);\n // Update the caret position, used for positioning the suggestions popover\n const textField = event.currentTarget;\n const relativePosition = Caret.getRelativePosition(textField);\n if (textField.scrollHeight > textField.clientHeight) {\n relativePosition.top -= textField.scrollTop;\n }\n setCaretPosition(relativePosition);\n if (triggerPriorIndex !== undefined) {\n // trigger is found\n const symbolBeforeTrigger = newValue.substring(triggerPriorIndex - 1, triggerPriorIndex);\n const isSpaceBeforeTrigger = symbolBeforeTrigger === ' ';\n // check if \\r (Carriage Return), \\n (Line Feed) or \\r\\n (End Of Line) is before the trigger\n const isNewLineBeforeTrigger = /\\r\|\\n/.exec(symbolBeforeTrigger);\n const wordAtSelection = newValue.substring(triggerPriorIndex, currentSelectionEndValue);\n let tagIndex = currentTriggerStartIndex;\n if (!isSpaceBeforeTrigger && triggerPriorIndex !== 0 && isNewLineBeforeTrigger === null) {\n // no space before the trigger, it's not a beginning of the line and no new line before <- continuation of the previous word\n tagIndex = -1;\n setCurrentTriggerStartIndex(tagIndex);\n } else if (wordAtSelection === triggerText) {\n // start of the mention\n tagIndex = currentSelectionEndValue - triggerText.length;\n if (tagIndex < 0) {\n tagIndex = 0;\n }\n setCurrentTriggerStartIndex(tagIndex);\n }\n if (tagIndex === -1) {\n updateMentionSuggestions([]);\n } else {\n // In the middle of a @mention lookup\n if (tagIndex > -1) {\n const query = wordAtSelection.substring(triggerText.length, wordAtSelection.length);\n if (query !== undefined) {\n await debouncedQueryUpdate(query);\n }\n }\n }\n }\n }\n\n const { changeStart, oldChangeEnd, newChangeEnd } = findStringsDiffIndexes({\n oldText: inputTextValue,\n newText: newValue,\n previousSelectionStart: previousSelectionStartValue,\n previousSelectionEnd: previousSelectionEndValue,\n currentSelectionStart: currentSelectionStartValue,\n currentSelectionEnd: currentSelectionEndValue\n });\n\n const change = newValue.substring(changeStart, newChangeEnd);\n const updatedContent = updateHTML({\n htmlText: htmlTextValue,\n oldPlainText: inputTextValue,\n tags: tagsValue,\n startIndex: changeStart,\n oldPlainTextEndIndex: oldChangeEnd,\n change,\n mentionTrigger: triggerText\n });\n setInternalTextValue(updatedContent.updatedHTML);\n\n // update caret index if needed\n if (updatedContent.updatedSelectionIndex !== undefined) {\n setCaretIndex(updatedContent.updatedSelectionIndex);\n setSelectionEndValue(updatedContent.updatedSelectionIndex);\n setSelectionStartValue(updatedContent.updatedSelectionIndex);\n }\n\n onChange && onChange(event, updatedContent.updatedHTML);\n },\n [debouncedQueryUpdate, mentionLookupOptions, onChange, updateMentionSuggestions]\n );\n\n // Adjust the selection range based on a mouse / touch interaction\n const handleOnMove = useCallback(\n ({\n event,\n selectionStartValue,\n selectionEndValue,\n interactionStartSelection,\n shouldHandleMoveEvent\n }: {\n event: React.UIEvent<HTMLInputElement \| HTMLTextAreaElement>;\n selectionStartValue: number \| undefined;\n selectionEndValue: number \| undefined;\n interactionStartSelection: { start: number \| undefined; end: number \| undefined } \| undefined;\n shouldHandleMoveEvent: boolean;\n }) => {\n if (\n shouldHandleMoveEvent &&\n interactionStartSelection === undefined &&\n (event.currentTarget.selectionStart !== selectionStartValue \|\|\n event.currentTarget.selectionEnd !== selectionEndValue)\n ) {\n setInteractionStartSelection({\n start: nullToUndefined(event.currentTarget.selectionStart),\n end: nullToUndefined(event.currentTarget.selectionEnd)\n });\n }\n },\n []\n );\n\n // Adjust the selection range based on a mouse / touch interaction\n const handleOnInteractionStarted = useCallback(() => {\n // reset caret index as a new selection is started or cursor position will be changed\n setCaretIndex(undefined);\n setInteractionStartSelection(undefined);\n setShouldHandleMoveEvent(true);\n setShouldHandleOnMouseDownDuringSelect(true);\n }, []);\n\n // Adjust the selection range based on a mouse / touch interaction\n const handleOnInteractionCompleted = useCallback(() => {\n setShouldHandleMoveEvent(false);\n }, []);\n\n const announcerText = useMemo(() => {\n if (activeSuggestionIndex === undefined) {\n return undefined;\n }\n const currentMention = mentionSuggestions[activeSuggestionIndex ?? 0];\n return currentMention?.displayText.length > 0\n ? currentMention?.displayText\n : localeStrings.participantItem.displayNamePlaceholder;\n }, [activeSuggestionIndex, mentionSuggestions, localeStrings.participantItem.displayNamePlaceholder]);\n\n return (\n <>\n {mentionSuggestions.length > 0 && (\n <_MentionPopover\n suggestions={mentionSuggestions}\n activeSuggestionIndex={activeSuggestionIndex}\n target={inputBoxRef}\n targetPositionOffset={caretPosition}\n onRenderSuggestionItem={mentionLookupOptions?.onRenderSuggestionItem}\n onSuggestionSelected={onSuggestionSelected}\n onDismiss={() => {\n updateMentionSuggestions([]);\n }}\n />\n )}\n {announcerText !== undefined && <Announcer announcementString={announcerText} ariaLive={'polite'} />}\n <TextField\n {...textFieldProps}\n data-ui-id={dataUiId}\n value={inputTextValue}\n onChange={(e, newValue) => {\n // Remove when switching to react 17+, currently needed because of https://legacy.reactjs.org/docs/legacy-event-pooling.html\n // Prevents React from resetting event's properties\n e.persist();\n setInputTextValue(newValue ?? '');\n handleOnChange({\n event: e,\n tagsValue,\n htmlTextValue: internalTextValue,\n inputTextValue,\n currentTriggerStartIndex,\n previousSelectionStart: nullToUndefined(selectionStartValue),\n previousSelectionEnd: nullToUndefined(selectionEndValue),\n currentSelectionStart: nullToUndefined(e.currentTarget.selectionStart),\n currentSelectionEnd: nullToUndefined(e.currentTarget.selectionEnd),\n updatedValue: newValue\n });\n }}\n onSelect={(e) => {\n // update selection if needed\n if (caretIndex !== undefined) {\n // sometimes setting selectionRage in effect for updating caretIndex doesn't work as expected and\n // onSelect still returns outdated value for cursor position\n // e.g. when user select some text and a first name in a mention then delete or type something else\n if (caretIndex !== e.currentTarget.selectionStart \|\| caretIndex !== e.currentTarget.selectionEnd) {\n e.currentTarget.setSelectionRange(caretIndex, caretIndex);\n }\n // caret index should not be set to undefined here\n // as it will cause issues when suggestion is selected by mouse\n // caret index will be set to undefined during keyboard/mouse or touch interactions\n return;\n }\n handleOnSelect({\n event: e,\n inputTextValue,\n shouldHandleOnMouseDownDuringSelect,\n selectionEndValue,\n selectionStartValue,\n tags: tagsValue,\n interactionStartSelection\n });\n }}\n onMouseDown={() => {\n // as events order is onMouseDown -> onMouseMove -> onMouseUp -> onSelect -> onClick\n // onClick and onMouseDown can't handle clicking on mention event because\n // onMouseDown doesn't have correct selectionRange yet and\n // onClick already has wrong range as it's called after onSelect that updates the selection range\n // so we need to handle onMouseDown to prevent onSelect default behavior\n handleOnInteractionStarted();\n }}\n onMouseMove={(event) => {\n handleOnMove({\n event,\n selectionStartValue,\n selectionEndValue,\n interactionStartSelection,\n shouldHandleMoveEvent\n });\n }}\n onMouseUp={() => {\n handleOnInteractionCompleted();\n }}\n onTouchStart={() => {\n handleOnInteractionStarted();\n }}\n onTouchMove={(event) => {\n handleOnMove({\n event,\n selectionStartValue,\n selectionEndValue,\n interactionStartSelection,\n shouldHandleMoveEvent\n });\n }}\n onTouchEnd={() => {\n handleOnInteractionCompleted;\n }}\n onBlur={() => {\n // setup shouldHandleOnMouseDownDuringSelect to false when text field loses focus\n // as the click should be handled by text field anymore\n setShouldHandleOnMouseDownDuringSelect(false);\n }}\n onKeyDown={onTextFieldKeyDown}\n elementRef={inputBoxRef}\n />\n </>\n );\n};\n"]}
1	+ {"version":3,"file":"TextFieldWithMention.js","sourceRoot":"","sources":["../../../../../../../react-components/src/components/TextFieldWithMention/TextFieldWithMention.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React, { useState, FormEvent, useCallback, useRef } from 'react';\nimport { useEffect, useMemo } from 'react';\nimport { useLocale } from '../../localization';\nimport { Announcer } from '../Announcer';\nimport { TextField, ITextField, ITextFieldProps } from '@fluentui/react';\n\nimport { isEnterKeyEventFromCompositionSession, nullToUndefined } from '../utils';\nimport {\n TagData,\n findMentionTagForSelection,\n findNewSelectionIndexForMention,\n findStringsDiffIndexes,\n getDisplayNameForMentionSuggestion,\n getValidatedIndexInRange,\n htmlStringForMentionSuggestion,\n textToTagParser,\n updateHTML\n} from './mentionTagUtils';\n\nimport { Caret } from 'textarea-caret-ts';\n\nimport { MentionLookupOptions, _MentionPopover, Mention } from '../MentionPopover';\n\nimport { useDebouncedCallback } from 'use-debounce';\n\nconst DEFAULT_MENTION_TRIGGER = '@';\n\n/*\n Props for the TextFieldWithMention component.\n \n @private\n /\nexport interface TextFieldWithMentionProps {\n textFieldProps: ITextFieldProps;\n dataUiId?: string;\n textValue: string; // This could be plain text or HTML.\n onChange: (event?: FormEvent<HTMLInputElement \| HTMLTextAreaElement>, newValue?: string) => void;\n onKeyDown?: (ev: React.KeyboardEvent<HTMLInputElement \| HTMLTextAreaElement>) => void;\n onEnterKeyDown?: () => void;\n textFieldRef?: React.RefObject<ITextField>;\n supportNewline?: boolean;\n mentionLookupOptions?: MentionLookupOptions;\n}\n\n/\n @private\n */\nexport const TextFieldWithMention = (props: TextFieldWithMentionProps): JSX.Element => {\n const {\n textFieldProps,\n dataUiId,\n textValue,\n onChange,\n textFieldRef,\n onKeyDown,\n onEnterKeyDown,\n supportNewline,\n mentionLookupOptions\n } = props;\n const inputBoxRef = useRef<HTMLDivElement>(null);\n\n // Current suggestion list, provided by the callback\n const [mentionSuggestions, setMentionSuggestions] = useState<Mention[]>([]);\n\n // Current suggestion list, provided by the callback\n const [activeSuggestionIndex, setActiveSuggestionIndex] = useState<number \| undefined>(undefined);\n\n // Index of the current trigger character in the text field\n const [currentTriggerStartIndex, setCurrentTriggerStartIndex] = useState<number>(-1);\n\n const [inputTextValue, setInputTextValue] = useState<string>('');\n\n // Internal value for text value prop\n const [internalTextValue, setInternalTextValue] = useState<string>('');\n\n const [tagsValue, setTagsValue] = useState<TagData[]>([]);\n\n // Index of the previous selection start in the text field\n const [selectionStartValue, setSelectionStartValue] = useState<number \| undefined>();\n\n // Index of the previous selection end in the text field\n const [selectionEndValue, setSelectionEndValue] = useState<number \| undefined>();\n\n // Boolean value to check if onMouseDown event should be handled during select as selection range\n // for onMouseDown event is not updated yet and the selection range for mouse click/taps will be\n // updated in onSelect event if needed.\n const [shouldHandleOnMouseDownDuringSelect, setShouldHandleOnMouseDownDuringSelect] = useState<boolean>(true);\n\n // Boolean flag to check if mouse/touch move event should be handled\n const [shouldHandleMoveEvent, setShouldHandleMoveEvent] = useState<boolean>(false);\n\n // Indexes of start of touch/mouse selection\n const [interactionStartSelection, setInteractionStartSelection] = useState<\n { start: number \| undefined; end: number \| undefined } \| undefined\n >();\n\n // Caret position in the text field\n const [caretPosition, setCaretPosition] = useState<Caret.Position \| undefined>(undefined);\n\n // Index of where the caret is in the text field\n const [caretIndex, setCaretIndex] = useState<number \| undefined>(undefined);\n\n const localeStrings = useLocale().strings;\n\n // Set mention suggestions\n const updateMentionSuggestions = useCallback(\n (suggestions: Mention[]) => {\n setMentionSuggestions(suggestions);\n },\n [setMentionSuggestions]\n );\n\n useEffect(() => {\n setInternalTextValue(textValue);\n // update mention suggestions before the next render cycle\n updateMentionSuggestions([]);\n }, [textValue, updateMentionSuggestions]);\n\n // Parse the text and get the plain text version to display in the input box\n useEffect(() => {\n const trigger = mentionLookupOptions?.trigger \|\| DEFAULT_MENTION_TRIGGER;\n const parsedHTMLData = textToTagParser(internalTextValue, trigger);\n setInputTextValue(parsedHTMLData.plainText);\n setTagsValue(parsedHTMLData.tags);\n updateMentionSuggestions([]);\n }, [internalTextValue, mentionLookupOptions?.trigger, updateMentionSuggestions]);\n\n useEffect(() => {\n // effect for caret index update\n if (caretIndex === undefined \|\| textFieldRef === undefined \|\| textFieldRef?.current === undefined) {\n return;\n }\n // get validated caret index between 0 and inputTextValue.length otherwise caret will be set to incorrect index\n const updatedCaretIndex = getValidatedIndexInRange({\n min: 0,\n max: inputTextValue.length,\n currentValue: caretIndex\n });\n textFieldRef?.current?.setSelectionRange(updatedCaretIndex, updatedCaretIndex);\n setSelectionStartValue(updatedCaretIndex);\n setSelectionEndValue(updatedCaretIndex);\n }, [caretIndex, inputTextValue, textFieldRef, setSelectionStartValue, setSelectionEndValue]);\n\n const onSuggestionSelected = useCallback(\n (suggestion: Mention) => {\n let selectionEnd = textFieldRef?.current?.selectionEnd \|\| -1;\n if (selectionEnd < 0) {\n selectionEnd = 0;\n } else if (selectionEnd > inputTextValue.length) {\n selectionEnd = inputTextValue.length;\n }\n const oldPlainText = inputTextValue;\n const mention = htmlStringForMentionSuggestion(suggestion, localeStrings);\n\n // update plain text with the mention html text\n const triggerText = mentionLookupOptions?.trigger ?? DEFAULT_MENTION_TRIGGER;\n // update html text with updated plain text\n const updatedContent = updateHTML({\n htmlText: internalTextValue,\n oldPlainText,\n tags: tagsValue,\n startIndex: currentTriggerStartIndex,\n oldPlainTextEndIndex: selectionEnd,\n change: mention,\n mentionTrigger: triggerText\n });\n\n setInternalTextValue(updatedContent.updatedHTML);\n const displayName = getDisplayNameForMentionSuggestion(suggestion, localeStrings);\n const newCaretIndex = currentTriggerStartIndex + displayName.length + triggerText.length;\n // move the caret in the text field to the end of the mention plain text\n setCaretIndex(newCaretIndex);\n setSelectionEndValue(newCaretIndex);\n setSelectionStartValue(newCaretIndex);\n setCurrentTriggerStartIndex(-1);\n updateMentionSuggestions([]);\n // set focus back to text field\n textFieldRef?.current?.focus();\n setActiveSuggestionIndex(undefined);\n onChange && onChange(undefined, updatedContent.updatedHTML);\n },\n [\n textFieldRef,\n inputTextValue,\n currentTriggerStartIndex,\n mentionLookupOptions?.trigger,\n onChange,\n internalTextValue,\n tagsValue,\n updateMentionSuggestions,\n localeStrings\n ]\n );\n\n const onTextFieldKeyDown = useCallback(\n (ev: React.KeyboardEvent<HTMLInputElement \| HTMLTextAreaElement>) => {\n // caretIndex should be set to undefined when the user is typing\n setCaretIndex(undefined);\n // shouldHandleOnMouseDownDuringSelect should be set to false after the last mouse down event.\n // it shouldn't be updated in onMouseUp\n // as onMouseUp can be triggered before or after onSelect event\n // because its order depends on mouse events not selection.\n setShouldHandleOnMouseDownDuringSelect(false);\n\n if (isEnterKeyEventFromCompositionSession(ev)) {\n return;\n }\n let isActiveSuggestionIndexUpdated = false;\n if (mentionSuggestions.length > 0) {\n if (ev.key === 'ArrowUp') {\n ev.preventDefault();\n const newActiveIndex =\n activeSuggestionIndex === undefined\n ? mentionSuggestions.length - 1\n : Math.max(activeSuggestionIndex - 1, 0);\n setActiveSuggestionIndex(newActiveIndex);\n isActiveSuggestionIndexUpdated = true;\n } else if (ev.key === 'ArrowDown') {\n ev.preventDefault();\n const newActiveIndex =\n activeSuggestionIndex === undefined\n ? 0\n : Math.min(activeSuggestionIndex + 1, mentionSuggestions.length - 1);\n setActiveSuggestionIndex(newActiveIndex);\n isActiveSuggestionIndexUpdated = true;\n } else if (ev.key === 'Escape') {\n updateMentionSuggestions([]);\n // reset active suggestion index when suggestions are closed\n setActiveSuggestionIndex(undefined);\n isActiveSuggestionIndexUpdated = true;\n }\n }\n if (ev.key === 'Enter' && (ev.shiftKey === false \|\| !supportNewline)) {\n ev.preventDefault();\n\n // If we are looking up a mention, select the focused suggestion\n if (mentionSuggestions.length > 0 && activeSuggestionIndex !== undefined) {\n const selectedMention = mentionSuggestions[activeSuggestionIndex];\n if (selectedMention) {\n onSuggestionSelected(selectedMention);\n return;\n }\n }\n\n onEnterKeyDown && onEnterKeyDown();\n } else if (!isActiveSuggestionIndexUpdated) {\n // Update the active suggestion index if the user is typing,\n // otherwise the focus will be lost\n setActiveSuggestionIndex(undefined);\n }\n onKeyDown && onKeyDown(ev);\n },\n [\n onEnterKeyDown,\n onKeyDown,\n supportNewline,\n mentionSuggestions,\n activeSuggestionIndex,\n onSuggestionSelected,\n updateMentionSuggestions\n ]\n );\n\n const debouncedQueryUpdate = useDebouncedCallback(async (query: string) => {\n let suggestions = (await mentionLookupOptions?.onQueryUpdated(query)) ?? [];\n suggestions = suggestions.filter((suggestion) => suggestion.displayText.trim() !== '');\n if (suggestions.length === 0) {\n setActiveSuggestionIndex(undefined);\n } else if (activeSuggestionIndex === undefined) {\n // Set the active to the first, if it's not already set\n setActiveSuggestionIndex(0);\n }\n updateMentionSuggestions(suggestions);\n }, 500);\n\n // Update selections index in mention to navigate by words\n const updateSelectionIndexesWithMentionIfNeeded = useCallback(\n ({\n event,\n inputTextValue,\n selectionEndValue,\n selectionStartValue,\n tagsValue\n }: {\n event: FormEvent<HTMLInputElement \| HTMLTextAreaElement>;\n inputTextValue: string;\n selectionEndValue?: number;\n selectionStartValue?: number;\n tagsValue: TagData[];\n }): void => {\n let updatedStartIndex = event.currentTarget.selectionStart;\n let updatedEndIndex = event.currentTarget.selectionEnd;\n if (\n event.currentTarget.selectionStart === event.currentTarget.selectionEnd &&\n event.currentTarget.selectionStart !== null &&\n event.currentTarget.selectionStart !== -1\n ) {\n // just a caret movement/usual typing or deleting\n const mentionTag = findMentionTagForSelection(tagsValue, event.currentTarget.selectionStart);\n // don't include boundary cases to show correct selection, otherwise it will show selection at mention boundaries\n if (\n mentionTag !== undefined &&\n mentionTag.plainTextBeginIndex !== undefined &&\n event.currentTarget.selectionStart > mentionTag.plainTextBeginIndex &&\n event.currentTarget.selectionStart < (mentionTag.plainTextEndIndex ?? mentionTag.plainTextBeginIndex)\n ) {\n // get updated selection index\n const newSelectionIndex = findNewSelectionIndexForMention({\n tag: mentionTag,\n textValue: inputTextValue,\n currentSelectionIndex: event.currentTarget.selectionStart,\n previousSelectionIndex: selectionStartValue ?? inputTextValue.length\n });\n updatedStartIndex = newSelectionIndex;\n updatedEndIndex = newSelectionIndex;\n }\n } else if (event.currentTarget.selectionStart !== event.currentTarget.selectionEnd) {\n // Both e.currentTarget.selectionStart !== selectionStartValue and e.currentTarget.selectionEnd !== selectionEndValue can be true when a user selects a text by double click\n if (event.currentTarget.selectionStart !== null && event.currentTarget.selectionStart !== selectionStartValue) {\n // the selection start is changed\n const mentionTag = findMentionTagForSelection(tagsValue, event.currentTarget.selectionStart);\n // don't include boundary cases to show correct selection, otherwise it will show selection at mention boundaries\n if (\n mentionTag !== undefined &&\n mentionTag.plainTextBeginIndex !== undefined &&\n event.currentTarget.selectionStart > mentionTag.plainTextBeginIndex &&\n event.currentTarget.selectionStart < (mentionTag.plainTextEndIndex ?? mentionTag.plainTextBeginIndex)\n ) {\n updatedStartIndex = findNewSelectionIndexForMention({\n tag: mentionTag,\n textValue: inputTextValue,\n currentSelectionIndex: event.currentTarget.selectionStart,\n previousSelectionIndex: selectionStartValue ?? inputTextValue.length\n });\n }\n }\n if (event.currentTarget.selectionEnd !== null && event.currentTarget.selectionEnd !== selectionEndValue) {\n // the selection end is changed\n const mentionTag = findMentionTagForSelection(tagsValue, event.currentTarget.selectionEnd);\n // don't include boundary cases to show correct selection, otherwise it will show selection at mention boundaries\n if (\n mentionTag !== undefined &&\n mentionTag.plainTextBeginIndex !== undefined &&\n event.currentTarget.selectionEnd > mentionTag.plainTextBeginIndex &&\n event.currentTarget.selectionEnd < (mentionTag.plainTextEndIndex ?? mentionTag.plainTextBeginIndex)\n ) {\n updatedEndIndex = findNewSelectionIndexForMention({\n tag: mentionTag,\n textValue: inputTextValue,\n currentSelectionIndex: event.currentTarget.selectionEnd,\n previousSelectionIndex: selectionEndValue ?? inputTextValue.length\n });\n }\n }\n }\n // e.currentTarget.selectionDirection should be set to handle shift + arrow keys\n if (event.currentTarget.selectionDirection === null) {\n event.currentTarget.setSelectionRange(updatedStartIndex, updatedEndIndex);\n } else {\n event.currentTarget.setSelectionRange(\n updatedStartIndex,\n updatedEndIndex,\n event.currentTarget.selectionDirection\n );\n }\n setSelectionStartValue(nullToUndefined(updatedStartIndex));\n setSelectionEndValue(nullToUndefined(updatedEndIndex));\n },\n [setSelectionStartValue, setSelectionEndValue]\n );\n\n const handleOnSelect = useCallback(\n ({\n event,\n inputTextValue,\n tags,\n shouldHandleOnMouseDownDuringSelect,\n selectionStartValue,\n selectionEndValue,\n interactionStartSelection\n }: {\n event: React.FormEvent<HTMLInputElement \| HTMLTextAreaElement>;\n inputTextValue: string;\n tags: TagData[];\n shouldHandleOnMouseDownDuringSelect: boolean;\n selectionStartValue?: number;\n selectionEndValue?: number;\n interactionStartSelection?: { start: number \| undefined; end: number \| undefined };\n }): void => {\n if (event.currentTarget.selectionStart === 0 && event.currentTarget.selectionEnd === inputTextValue.length) {\n // entire text is selected, no need to change anything\n setSelectionStartValue(event.currentTarget.selectionStart);\n setSelectionEndValue(event.currentTarget.selectionEnd);\n setInteractionStartSelection(undefined);\n setShouldHandleOnMouseDownDuringSelect(false);\n } else if (shouldHandleOnMouseDownDuringSelect) {\n if (\n interactionStartSelection !== undefined &&\n (interactionStartSelection.start !== event.currentTarget.selectionStart \|\|\n interactionStartSelection.end !== event.currentTarget.selectionEnd)\n ) {\n // selection was changed by mouse\n // for mouse selection only, it's possible to start selection in the middle of a word in a mention\n // because of this when event.currentTarget.selectionStart === mouseMoveStartPoint.start\n // selectionStartValue for updateSelectionIndexesWithMentionIfNeeded should be set\n // to the end of the input to mimic selection from right to left for the left selection index\n const updatedSelectionStartValue =\n event.currentTarget.selectionStart === interactionStartSelection.start\n ? inputTextValue.length\n : interactionStartSelection.start;\n // selectionStart is always less than selectionEnd so sometimes selectionEnd is user's start of the selection\n // so when event.currentTarget.selectionEnd === mouseMoveStartPoint.end\n // selectionEndValue for updateSelectionIndexesWithMentionIfNeeded should be set\n // to the beginning of the input to mimic selection from left to right for the right selection index\n const updatedSelectionEndValue =\n event.currentTarget.selectionEnd === interactionStartSelection.end ? 0 : interactionStartSelection.end;\n updateSelectionIndexesWithMentionIfNeeded({\n event,\n inputTextValue,\n selectionStartValue: updatedSelectionStartValue,\n selectionEndValue: updatedSelectionEndValue,\n tagsValue: tags\n });\n setInteractionStartSelection(undefined);\n setShouldHandleOnMouseDownDuringSelect(false);\n } else if (event.currentTarget.selectionStart !== null && event.currentTarget.selectionEnd !== null) {\n // on select was triggered by mouse down/up with no movement\n const mentionTag = findMentionTagForSelection(tags, event.currentTarget.selectionStart);\n if (mentionTag !== undefined && mentionTag.plainTextBeginIndex !== undefined) {\n // handle mention click by selecting the whole mention\n // if the selection is not on the bounds of the mention\n // disable selection for clicks on mention bounds\n const mentionEndIndex = mentionTag.plainTextEndIndex ?? mentionTag.plainTextBeginIndex;\n\n if (\n event.currentTarget.selectionStart !== event.currentTarget.selectionEnd &&\n event.currentTarget.selectionEnd > mentionEndIndex\n ) {\n // handle triple click when the text starts from mention\n if (event.currentTarget.selectionDirection === null) {\n event.currentTarget.setSelectionRange(mentionTag.plainTextBeginIndex, event.currentTarget.selectionEnd);\n } else {\n event.currentTarget.setSelectionRange(\n mentionTag.plainTextBeginIndex,\n event.currentTarget.selectionEnd,\n event.currentTarget.selectionDirection\n );\n }\n setSelectionStartValue(mentionTag.plainTextBeginIndex);\n setSelectionEndValue(event.currentTarget.selectionEnd);\n } else if (\n event.currentTarget.selectionStart !== event.currentTarget.selectionEnd \|\|\n (event.currentTarget.selectionStart !== mentionTag.plainTextBeginIndex &&\n event.currentTarget.selectionStart !== mentionEndIndex)\n ) {\n if (event.currentTarget.selectionDirection === null) {\n event.currentTarget.setSelectionRange(mentionTag.plainTextBeginIndex, mentionEndIndex);\n } else {\n event.currentTarget.setSelectionRange(\n mentionTag.plainTextBeginIndex,\n mentionEndIndex,\n event.currentTarget.selectionDirection\n );\n }\n setSelectionStartValue(mentionTag.plainTextBeginIndex);\n setSelectionEndValue(mentionEndIndex);\n } else {\n // bounds of the mention were selected\n setSelectionStartValue(event.currentTarget.selectionStart);\n setSelectionEndValue(event.currentTarget.selectionEnd);\n }\n } else {\n // not a mention tag\n setSelectionStartValue(event.currentTarget.selectionStart);\n setSelectionEndValue(nullToUndefined(event.currentTarget.selectionEnd));\n }\n setInteractionStartSelection(undefined);\n }\n } else {\n // selection was changed by keyboard\n updateSelectionIndexesWithMentionIfNeeded({\n event,\n inputTextValue,\n selectionStartValue,\n selectionEndValue,\n tagsValue: tags\n });\n }\n },\n [updateSelectionIndexesWithMentionIfNeeded, setSelectionStartValue, setSelectionEndValue]\n );\n\n type HandleOnChangeProps = {\n currentSelectionEnd?: number;\n currentSelectionStart?: number;\n currentTriggerStartIndex: number;\n event: React.FormEvent<HTMLInputElement \| HTMLTextAreaElement>;\n htmlTextValue: string;\n inputTextValue: string;\n previousSelectionEnd?: number;\n previousSelectionStart?: number;\n tagsValue: TagData[];\n updatedValue?: string;\n };\n\n const handleOnChange = useCallback(\n async ({\n currentSelectionEnd,\n currentSelectionStart,\n currentTriggerStartIndex,\n event,\n htmlTextValue,\n inputTextValue,\n previousSelectionEnd,\n previousSelectionStart,\n tagsValue,\n updatedValue\n }: HandleOnChangeProps): Promise<void> => {\n debouncedQueryUpdate.cancel();\n if (event.currentTarget === null) {\n return;\n }\n // handle backspace change\n // onSelect is not called for backspace as selection is not changed and local caret index is outdated\n setCaretIndex(undefined);\n const newValue = updatedValue ?? '';\n const triggerText = mentionLookupOptions?.trigger ?? DEFAULT_MENTION_TRIGGER;\n\n const newTextLength = newValue.length;\n // updating indexes to set between 0 and text length, otherwise selectionRange won't be set correctly\n const currentSelectionEndValue = getValidatedIndexInRange({\n min: 0,\n max: newTextLength,\n currentValue: currentSelectionEnd\n });\n const currentSelectionStartValue = getValidatedIndexInRange({\n min: 0,\n max: newTextLength,\n currentValue: currentSelectionStart\n });\n const previousSelectionStartValue = getValidatedIndexInRange({\n min: 0,\n max: inputTextValue.length,\n currentValue: previousSelectionStart\n });\n const previousSelectionEndValue = getValidatedIndexInRange({\n min: 0,\n max: inputTextValue.length,\n currentValue: previousSelectionEnd\n });\n\n // If we are enabled for lookups,\n if (mentionLookupOptions !== undefined) {\n // Look at the range of the change for a trigger character\n const triggerPriorIndex = newValue.lastIndexOf(triggerText, currentSelectionEndValue - 1);\n // Update the caret position, used for positioning the suggestions popover\n const textField = event.currentTarget;\n const relativePosition = Caret.getRelativePosition(textField);\n if (textField.scrollHeight > textField.clientHeight) {\n relativePosition.top -= textField.scrollTop;\n }\n setCaretPosition(relativePosition);\n if (triggerPriorIndex !== undefined) {\n // trigger is found\n const symbolBeforeTrigger = newValue.substring(triggerPriorIndex - 1, triggerPriorIndex);\n const isSpaceBeforeTrigger = symbolBeforeTrigger === ' ';\n // check if \\r (Carriage Return), \\n (Line Feed) or \\r\\n (End Of Line) is before the trigger\n const isNewLineBeforeTrigger = /\\r\|\\n/.exec(symbolBeforeTrigger);\n const wordAtSelection = newValue.substring(triggerPriorIndex, currentSelectionEndValue);\n let tagIndex = currentTriggerStartIndex;\n if (!isSpaceBeforeTrigger && triggerPriorIndex !== 0 && isNewLineBeforeTrigger === null) {\n // no space before the trigger, it's not a beginning of the line and no new line before <- continuation of the previous word\n tagIndex = -1;\n setCurrentTriggerStartIndex(tagIndex);\n } else if (wordAtSelection === triggerText) {\n // start of the mention\n tagIndex = currentSelectionEndValue - triggerText.length;\n if (tagIndex < 0) {\n tagIndex = 0;\n }\n setCurrentTriggerStartIndex(tagIndex);\n }\n if (tagIndex === -1) {\n updateMentionSuggestions([]);\n } else {\n // In the middle of a @mention lookup\n if (tagIndex > -1) {\n const query = wordAtSelection.substring(triggerText.length, wordAtSelection.length);\n if (query !== undefined) {\n await debouncedQueryUpdate(query);\n }\n }\n }\n }\n }\n\n const { changeStart, oldChangeEnd, newChangeEnd } = findStringsDiffIndexes({\n oldText: inputTextValue,\n newText: newValue,\n previousSelectionStart: previousSelectionStartValue,\n previousSelectionEnd: previousSelectionEndValue,\n currentSelectionStart: currentSelectionStartValue,\n currentSelectionEnd: currentSelectionEndValue\n });\n\n const change = newValue.substring(changeStart, newChangeEnd);\n const updatedContent = updateHTML({\n htmlText: htmlTextValue,\n oldPlainText: inputTextValue,\n tags: tagsValue,\n startIndex: changeStart,\n oldPlainTextEndIndex: oldChangeEnd,\n change,\n mentionTrigger: triggerText\n });\n setInternalTextValue(updatedContent.updatedHTML);\n\n // update caret index if needed\n if (updatedContent.updatedSelectionIndex !== undefined) {\n setCaretIndex(updatedContent.updatedSelectionIndex);\n setSelectionEndValue(updatedContent.updatedSelectionIndex);\n setSelectionStartValue(updatedContent.updatedSelectionIndex);\n }\n\n onChange && onChange(event, updatedContent.updatedHTML);\n },\n [debouncedQueryUpdate, mentionLookupOptions, onChange, updateMentionSuggestions]\n );\n\n // Adjust the selection range based on a mouse / touch interaction\n const handleOnMove = useCallback(\n ({\n event,\n selectionStartValue,\n selectionEndValue,\n interactionStartSelection,\n shouldHandleMoveEvent\n }: {\n event: React.UIEvent<HTMLInputElement \| HTMLTextAreaElement>;\n selectionStartValue: number \| undefined;\n selectionEndValue: number \| undefined;\n interactionStartSelection: { start: number \| undefined; end: number \| undefined } \| undefined;\n shouldHandleMoveEvent: boolean;\n }) => {\n if (\n shouldHandleMoveEvent &&\n interactionStartSelection === undefined &&\n (event.currentTarget.selectionStart !== selectionStartValue \|\|\n event.currentTarget.selectionEnd !== selectionEndValue)\n ) {\n setInteractionStartSelection({\n start: nullToUndefined(event.currentTarget.selectionStart),\n end: nullToUndefined(event.currentTarget.selectionEnd)\n });\n }\n },\n []\n );\n\n // Adjust the selection range based on a mouse / touch interaction\n const handleOnInteractionStarted = useCallback(() => {\n // reset caret index as a new selection is started or cursor position will be changed\n setCaretIndex(undefined);\n setInteractionStartSelection(undefined);\n setShouldHandleMoveEvent(true);\n setShouldHandleOnMouseDownDuringSelect(true);\n }, []);\n\n // Adjust the selection range based on a mouse / touch interaction\n const handleOnInteractionCompleted = useCallback(() => {\n setShouldHandleMoveEvent(false);\n }, []);\n\n const announcerText = useMemo(() => {\n if (activeSuggestionIndex === undefined) {\n return undefined;\n }\n const currentMention = mentionSuggestions[activeSuggestionIndex ?? 0];\n return currentMention?.displayText.length > 0\n ? currentMention?.displayText\n : localeStrings.participantItem.displayNamePlaceholder;\n }, [activeSuggestionIndex, mentionSuggestions, localeStrings.participantItem.displayNamePlaceholder]);\n\n return (\n <>\n {mentionSuggestions.length > 0 && (\n <_MentionPopover\n suggestions={mentionSuggestions}\n activeSuggestionIndex={activeSuggestionIndex}\n target={inputBoxRef}\n targetPositionOffset={caretPosition}\n onRenderSuggestionItem={mentionLookupOptions?.onRenderSuggestionItem}\n onSuggestionSelected={onSuggestionSelected}\n onDismiss={() => {\n updateMentionSuggestions([]);\n }}\n />\n )}\n {announcerText !== undefined && <Announcer announcementString={announcerText} ariaLive={'polite'} />}\n <TextField\n {...textFieldProps}\n data-ui-id={dataUiId}\n value={inputTextValue}\n onChange={(e, newValue) => {\n // Remove when switching to react 17+, currently needed because of https://legacy.reactjs.org/docs/legacy-event-pooling.html\n // Prevents React from resetting event's properties\n e.persist();\n setInputTextValue(newValue ?? '');\n handleOnChange({\n event: e,\n tagsValue,\n htmlTextValue: internalTextValue,\n inputTextValue,\n currentTriggerStartIndex,\n previousSelectionStart: nullToUndefined(selectionStartValue),\n previousSelectionEnd: nullToUndefined(selectionEndValue),\n currentSelectionStart: nullToUndefined(e.currentTarget.selectionStart),\n currentSelectionEnd: nullToUndefined(e.currentTarget.selectionEnd),\n updatedValue: newValue\n });\n }}\n onSelect={(e) => {\n // update selection if needed\n if (caretIndex !== undefined) {\n // sometimes setting selectionRage in effect for updating caretIndex doesn't work as expected and\n // onSelect still returns outdated value for cursor position\n // e.g. when user select some text and a first name in a mention then delete or type something else\n if (caretIndex !== e.currentTarget.selectionStart \|\| caretIndex !== e.currentTarget.selectionEnd) {\n e.currentTarget.setSelectionRange(caretIndex, caretIndex);\n }\n // caret index should not be set to undefined here\n // as it will cause issues when suggestion is selected by mouse\n // caret index will be set to undefined during keyboard/mouse or touch interactions\n return;\n }\n handleOnSelect({\n event: e,\n inputTextValue,\n shouldHandleOnMouseDownDuringSelect,\n selectionEndValue,\n selectionStartValue,\n tags: tagsValue,\n interactionStartSelection\n });\n }}\n onMouseDown={() => {\n // as events order is onMouseDown -> onMouseMove -> onMouseUp -> onSelect -> onClick\n // onClick and onMouseDown can't handle clicking on mention event because\n // onMouseDown doesn't have correct selectionRange yet and\n // onClick already has wrong range as it's called after onSelect that updates the selection range\n // so we need to handle onMouseDown to prevent onSelect default behavior\n handleOnInteractionStarted();\n }}\n onMouseMove={(event) => {\n handleOnMove({\n event,\n selectionStartValue,\n selectionEndValue,\n interactionStartSelection,\n shouldHandleMoveEvent\n });\n }}\n onMouseUp={() => {\n handleOnInteractionCompleted();\n }}\n onTouchStart={() => {\n handleOnInteractionStarted();\n }}\n onTouchMove={(event) => {\n handleOnMove({\n event,\n selectionStartValue,\n selectionEndValue,\n interactionStartSelection,\n shouldHandleMoveEvent\n });\n }}\n onTouchEnd={() => {\n handleOnInteractionCompleted;\n }}\n onBlur={() => {\n // setup shouldHandleOnMouseDownDuringSelect to false when text field loses focus\n // as the click should be handled by text field anymore\n setShouldHandleOnMouseDownDuringSelect(false);\n }}\n onKeyDown={onTextFieldKeyDown}\n elementRef={inputBoxRef}\n />\n </>\n );\n};\n"]}

package/dist/dist-esm/react-components/src/components/VideoGallery/FloatingLocalVideoLayout.js CHANGED Viewed

@@ -24,8 +24,7 @@ import { OverflowGallery } from './OverflowGallery';
  */
 export const FloatingLocalVideoLayout = (props) => {
     const { remoteParticipants = [], dominantSpeakers, localVideoComponent, screenShareComponent, onRenderRemoteParticipant, styles, maxRemoteVideoStreams, showCameraSwitcherInLocalPreview, parentWidth, parentHeight,
-    /* @conditional-compile-remove(vertical-gallery) */ overflowGalleryPosition = 'horizontalBottom', pinnedParticipantUserIds = [],
-    /* @conditional-compile-remove(click-to-call) */ localVideoTileSize,
+    /* @conditional-compile-remove(vertical-gallery) */ overflowGalleryPosition = 'horizontalBottom', pinnedParticipantUserIds = [], localVideoTileSize,
     /* @conditional-compile-remove(spotlight) */ spotlightedParticipantUserIds } = props;
     const theme = useTheme();
     const isNarrow = parentWidth ? isNarrowWidth(parentWidth) : false;
@@ -76,7 +75,7 @@ export const FloatingLocalVideoLayout = (props) => {
     });
     const layerHostId = useId('layerhost');
     const localVideoSizeRem = useMemo(() => {
-        if (isNarrow || /*@conditional-compile-remove(click-to-call) */ localVideoTileSize === '9:16') {
+        if (isNarrow || localVideoTileSize === '9:16') {
             return SMALL_FLOATING_MODAL_SIZE_REM;
         }
         /* @conditional-compile-remove(vertical-gallery) */
@@ -87,7 +86,6 @@ export const FloatingLocalVideoLayout = (props) => {
                     ? SHORT_VERTICAL_GALLERY_FLOATING_MODAL_SIZE_REM
                     : VERTICAL_GALLERY_FLOATING_MODAL_SIZE_REM;
         }
-        /*@conditional-compile-remove(click-to-call) */
         if ((overflowGalleryTiles.length > 0 || screenShareComponent) && overflowGalleryPosition === 'horizontalBottom') {
             return localVideoTileSize === '16:9' || !isNarrow ? LARGE_FLOATING_MODAL_SIZE_REM : SMALL_FLOATING_MODAL_SIZE_REM;
         }
@@ -98,7 +96,7 @@ export const FloatingLocalVideoLayout = (props) => {
         screenShareComponent,
         /* @conditional-compile-remove(vertical-gallery) */ isShort,
         /* @conditional-compile-remove(vertical-gallery) */ overflowGalleryPosition,
-        /* @conditional-compile-remove(click-to-call) */ localVideoTileSize
+        localVideoTileSize
     ]);
     const wrappedLocalVideoComponent = (localVideoComponent && shouldFloatLocalVideo) || (screenShareComponent && localVideoComponent) ? (
     // When we use showCameraSwitcherInLocalPreview it disables dragging to allow keyboard navigation.