npm - @azure/communication-react - Versions diffs - 1.18.0-alpha-202407180014 → 1.18.0-alpha-202407200014 - Mend

@azure/communication-react 1.18.0-alpha-202407180014 → 1.18.0-alpha-202407200014

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

package/dist/dist-esm/communication-react/src/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/index.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC;;;;;;;;;;;;;;;GAeG;AAEH,OAAO,EAAE,+BAA+B,EAAE,6BAA6B,EAAE,MAAM,yBAAyB,CAAC;AAUzG,uDAAuD;AACvD,OAAO,EAAE,yBAAyB,EAAE,iBAAiB,EAAE,MAAM,qCAAqC,CAAC;AAgCnG,OAAO,EACL,kBAAkB,EAClB,iBAAiB,EACjB,YAAY,EACZ,aAAa,EACb,YAAY,EACZ,OAAO,EACP,gBAAgB,EAChB,kBAAkB,EAClB,4BAA4B,EAC7B,MAAM,sCAAsC,CAAC;AAE9C,yDAAyD;AACzD,OAAO,EACL,iBAAiB,EACjB,YAAY,EACZ,iCAAiC,EAClC,MAAM,sCAAsC,CAAC;AAwB9C,OAAO,EACL,kBAAkB,EAClB,wBAAwB,EACxB,aAAa,EACb,mBAAmB,EACnB,eAAe,EACf,yBAAyB,EAC1B,MAAM,mCAAmC,CAAC;AAU3C,OAAO,EACL,mBAAmB,EACnB,YAAY,EACZ,UAAU,EACV,gBAAgB,EAChB,aAAa,EACb,aAAa,EACb,QAAQ,EACR,UAAU,EACV,oBAAoB,EACpB,sBAAsB,EACtB,aAAa,EACb,gBAAgB,EAChB,eAAe,EACf,eAAe,EACf,kBAAkB,EAClB,iBAAiB,EACjB,OAAO,EACP,WAAW,EACX,eAAe,EACf,YAAY,EACZ,SAAS,EACT,sBAAsB,EACtB,sBAAsB,EACtB,sBAAsB,EACtB,sBAAsB,EACtB,sBAAsB,EACtB,sBAAsB,EACtB,sBAAsB,EACtB,sBAAsB,EACtB,sBAAsB,EACtB,sBAAsB,EACtB,sBAAsB,EACtB,sBAAsB,EACtB,sBAAsB,EACtB,sBAAsB,EACtB,sBAAsB,EACtB,sBAAsB,EACtB,sBAAsB,EACtB,sBAAsB,EACtB,sBAAsB,EACtB,sBAAsB,EACvB,MAAM,4BAA4B,CAAC;AACpC,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,6CAA6C;AAC7C,OAAO,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAC;AAExD,OAAO,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAE7D,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AAErD,mDAAmD;AACnD,OAAO,EAAE,wBAAwB,EAAE,MAAM,4BAA4B,CAAC;AAQtE,iDAAiD;AACjD,OAAO,EACL,kCAAkC,EAClC,yBAAyB,EACzB,qBAAqB,EACtB,MAAM,4BAA4B,CAAC;AA0IpC,mDAAmD;AACnD,OAAO,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAoC7D,mDAAmD;AACnD,OAAO,EAAE,2BAA2B,EAAE,MAAM,4BAA4B,CAAC;AAkBzE,cAAc,iDAAiD,CAAC;AAChE,cAAc,oCAAoC,CAAC;AACnD,cAAc,gDAAgD,CAAC;AAG/D,OAAO,EAAE,wBAAwB,EAAE,MAAM,gCAAgC,CAAC;AAiB1E,cAAc,yCAAyC,CAAC;AACxD,cAAc,eAAe,CAAC;AAE9B,sDAAsD;AACtD,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAGhE,sDAAsD;AACtD,OAAO,EAAE,yBAAyB,EAAE,MAAM,4BAA4B,CAAC;AAGvE,sDAAsD;AACtD,OAAO,EAAE,0BAA0B,EAAE,MAAM,4BAA4B,CAAC;AAgBxE,gDAAgD;AAChD,OAAO,EAAE,iBAAiB,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\n/*\n `@azure/communication-react` is an npm package that exports the functionality of the Azure Communication Services - UI Library.\n \n This package makes it easy for you to build modern communications user experiences using Azure Communication Services. It gives you a library of production-ready UI components that you can drop into your applications:\n * - Composites: These components are turn-key solutions that implement common communication scenarios. You can quickly add video calling or chat experiences to your applications. Composites are open-source higher order components built using UI components.\n * - UI Components - These components are open-source building blocks that let you build custom communications experience. Components are offered for both calling and chat capabilities that can be combined to build experiences.\n \n These UI client libraries all use Microsoft's Fluent design language and assets. Fluent UI provides a foundational layer for the UI Library and is actively used across Microsoft products.\n \n In conjunction with the UI components, the UI Library exposes a stateful client library for calling and chat. This client is agnostic to any specific state management framework and can be integrated with common state managers like Redux or React Context.\n * This stateful client library can be used with the UI Components to pass props and methods for the UI Components to render data. For more information, see Stateful Client Overview.\n \n For more information visit: https://aka.ms/acsstorybook\n \n @packageDocumentation\n /\n\nexport { fromFlatCommunicationIdentifier, toFlatCommunicationIdentifier } from '../../acs-ui-common/src';\nexport type {\n AreEqual,\n CommonProperties,\n MessageStatus,\n Common,\n AreTypeEqual,\n AreParamEqual\n} from '../../acs-ui-common/src';\n\n/ @conditional-compile-remove(composite-js-helpers) /\nexport { loadOutboundCallComposite, loadCallComposite } from '../../acs-ui-javascript-loaders/src';\n/ @conditional-compile-remove(composite-js-helpers) /\nexport type { OutboundCallCompositeLoaderProps, CallCompositeLoaderProps } from '../../acs-ui-javascript-loaders/src';\n\n// Not to export chat/calling specific hook from binding package\nexport type {\n CallClientProviderProps,\n CallAgentProviderProps,\n CallProviderProps,\n GetCallingSelector,\n CallingHandlers,\n CallingBaseSelectorProps,\n CommonCallingHandlers\n} from '../../calling-component-bindings/src';\n\nexport type { VideoBackgroundEffectsDependency, CallingHandlersOptions } from '../../calling-component-bindings/src';\n\nexport type { CaptionsOptions } from '../../calling-component-bindings/src';\n\nexport type {\n ChatClientProviderProps,\n ChatThreadClientProviderProps,\n GetChatSelector,\n ChatHandlers,\n ChatBaseSelectorProps\n} from '../../chat-component-bindings/src';\n\n/ @conditional-compile-remove(file-sharing-acs) /\nexport type { MessageOptions, ChatMessageType } from '../../acs-ui-common/src';\n/ @conditional-compile-remove(rich-text-editor-image-upload) /\nexport type { UploadChatImageResult } from '../../acs-ui-common/src';\n\nexport {\n CallClientProvider,\n CallAgentProvider,\n CallProvider,\n useCallClient,\n useCallAgent,\n useCall,\n useDeviceManager,\n getCallingSelector,\n createDefaultCallingHandlers\n} from '../../calling-component-bindings/src';\n\n/ @conditional-compile-remove(teams-identity-support) /\nexport {\n useTeamsCallAgent,\n useTeamsCall,\n createDefaultTeamsCallingHandlers\n} from '../../calling-component-bindings/src';\n\n/ @conditional-compile-remove(teams-identity-support) /\nexport type { TeamsCallingHandlers } from '../../calling-component-bindings/src';\n\nexport type {\n ScreenShareButtonSelector,\n CameraButtonSelector,\n VideoGallerySelector,\n DevicesButtonSelector,\n EmptySelector,\n ErrorBarSelector as CallErrorBarSelector,\n ParticipantListSelector,\n MicrophoneButtonSelector,\n ParticipantsButtonSelector,\n CreateDefaultCallingHandlers\n} from '../../calling-component-bindings/src';\n/ @conditional-compile-remove(PSTN-calls) /\nexport type { HoldButtonSelector } from '../../calling-component-bindings/src';\n\nexport type { RaiseHandButtonSelector } from '../../calling-component-bindings/src';\n/ @conditional-compile-remove(notifications) /\nexport type { NotificationStackSelector } from '../../calling-component-bindings/src';\n\nexport {\n ChatClientProvider,\n ChatThreadClientProvider,\n useChatClient,\n useChatThreadClient,\n getChatSelector,\n createDefaultChatHandlers\n} from '../../chat-component-bindings/src';\n\nexport type {\n MessageThreadSelector,\n TypingIndicatorSelector,\n ChatParticipantListSelector,\n SendBoxSelector,\n ErrorBarSelector as ChatErrorBarSelector\n} from '../../chat-component-bindings/src';\n\nexport {\n _IdentifierProvider,\n CameraButton,\n ControlBar,\n ControlBarButton,\n DevicesButton,\n EndCallButton,\n ErrorBar,\n GridLayout,\n LocalizationProvider,\n MessageStatusIndicator,\n MessageThread,\n MicrophoneButton,\n ParticipantItem,\n ParticipantList,\n ParticipantsButton,\n ScreenShareButton,\n SendBox,\n StreamMedia,\n TypingIndicator,\n VideoGallery,\n VideoTile,\n COMPONENT_LOCALE_EN_GB,\n COMPONENT_LOCALE_AR_SA,\n COMPONENT_LOCALE_CS_CZ,\n COMPONENT_LOCALE_DE_DE,\n COMPONENT_LOCALE_ES_ES,\n COMPONENT_LOCALE_FI_FI,\n COMPONENT_LOCALE_FR_FR,\n COMPONENT_LOCALE_HE_IL,\n COMPONENT_LOCALE_IT_IT,\n COMPONENT_LOCALE_JA_JP,\n COMPONENT_LOCALE_KO_KR,\n COMPONENT_LOCALE_NB_NO,\n COMPONENT_LOCALE_NL_NL,\n COMPONENT_LOCALE_PL_PL,\n COMPONENT_LOCALE_PT_BR,\n COMPONENT_LOCALE_RU_RU,\n COMPONENT_LOCALE_SV_SE,\n COMPONENT_LOCALE_TR_TR,\n COMPONENT_LOCALE_ZH_CN,\n COMPONENT_LOCALE_ZH_TW\n} from '../../react-components/src';\nexport { ImageOverlay } from '../../react-components/src';\n/ @conditional-compile-remove(PSTN-calls) /\nexport { HoldButton } from '../../react-components/src';\n\nexport { RaiseHandButton } from '../../react-components/src';\n\nexport { Dialpad } from '../../react-components/src';\n\n/ @conditional-compile-remove(one-to-n-calling) /\nexport { IncomingCallNotification } from '../../react-components/src';\n/ @conditional-compile-remove(one-to-n-calling) /\nexport type {\n IncomingCallNotificationProps,\n IncomingCallNotificationStrings,\n IncomingCallNotificationStyles\n} from '../../react-components/src';\n\n/ @conditional-compile-remove(call-readiness) /\nexport {\n CameraAndMicrophoneSitePermissions,\n MicrophoneSitePermissions,\n CameraSitePermissions\n} from '../../react-components/src';\n/ @conditional-compile-remove(call-readiness) /\nexport type {\n CameraAndMicrophoneSitePermissionsStrings,\n CameraAndMicrophoneSitePermissionsProps,\n CameraSitePermissionsStrings,\n CameraSitePermissionsProps,\n CommonSitePermissionsProps,\n SitePermissionsStrings,\n SitePermissionsStyles,\n MicrophoneSitePermissionsStrings,\n MicrophoneSitePermissionsProps\n} from '../../react-components/src';\n\n/ @conditional-compile-remove(total-participant-count) /\nexport type { ParticipantListStrings } from '../../react-components/src';\n\n/ @conditional-compile-remove(mention) /\nexport type {\n MentionOptions,\n MentionDisplayOptions,\n MentionLookupOptions,\n Mention,\n MentionPopoverStrings\n} from '../../react-components/src';\n\nexport type {\n _IdentifierProviderProps,\n _Identifiers,\n ActiveErrorMessage,\n BaseCustomStyles,\n CallParticipantListParticipant,\n CameraButtonContextualMenuStyles,\n CameraButtonProps,\n CameraButtonStrings,\n CameraButtonStyles,\n ChatMessage,\n CommunicationParticipant,\n ComponentLocale,\n ComponentSlotStyle,\n ComponentStrings,\n ContentSystemMessage,\n ControlBarButtonProps,\n ControlBarButtonStrings,\n ControlBarButtonStyles,\n ControlBarLayout,\n ControlBarProps,\n CreateVideoStreamViewResult,\n CustomAvatarOptions,\n CustomMessage,\n DevicesButtonContextualMenuStyles,\n DevicesButtonProps,\n DevicesButtonStrings,\n DevicesButtonStyles,\n EndCallButtonProps,\n EndCallButtonStrings,\n ErrorBarProps,\n ErrorBarStrings,\n ErrorType,\n GridLayoutProps,\n GridLayoutStyles,\n HorizontalGalleryStyles,\n JumpToNewMessageButtonProps,\n LocalizationProviderProps,\n LocalVideoCameraCycleButtonProps,\n LoadingState,\n Message,\n MessageAttachedStatus,\n MessageCommon,\n MessageContentType,\n MessageProps,\n MessageRenderer,\n MessageStatusIndicatorProps,\n MessageStatusIndicatorStrings,\n MessageThreadProps,\n MessageThreadStrings,\n MessageThreadStyles,\n MicrophoneButtonContextualMenuStyles,\n MicrophoneButtonProps,\n MicrophoneButtonStrings,\n MicrophoneButtonStyles,\n OnRenderAvatarCallback,\n OptionsDevice,\n ParticipantAddedSystemMessage,\n ParticipantItemProps,\n ParticipantItemStrings,\n ParticipantItemStyles,\n ParticipantListItemStyles,\n ParticipantListParticipant,\n ParticipantListProps,\n ParticipantListStyles,\n ParticipantMenuItemsCallback,\n ParticipantRemovedSystemMessage,\n ParticipantState,\n ParticipantsButtonContextualMenuStyles,\n ParticipantsButtonProps,\n ParticipantsButtonStrings,\n ParticipantsButtonStyles,\n ReadReceiptsBySenderId,\n ScreenShareButtonProps,\n ScreenShareButtonStrings,\n SendBoxProps,\n SendBoxStrings,\n SendBoxStylesProps,\n StreamMediaProps,\n SystemMessage,\n SystemMessageCommon,\n TopicUpdatedSystemMessage,\n TypingIndicatorProps,\n TypingIndicatorStrings,\n TypingIndicatorStylesProps,\n UpdateMessageCallback,\n CancelEditCallback,\n VideoGalleryLayout,\n VideoGalleryLocalParticipant,\n VideoGalleryParticipant,\n VideoGalleryProps,\n VideoGalleryRemoteParticipant,\n VideoGalleryStream,\n VideoGalleryStrings,\n VideoGalleryStyles,\n VideoStreamOptions,\n VideoTileProps,\n VideoTileStylesProps,\n ViewScalingMode,\n VideoTileContextualMenuProps,\n VideoTileDrawerMenuProps,\n VideoTilesOptions\n} from '../../react-components/src';\n\nexport type { RaiseHandButtonProps, RaiseHandButtonStrings, RaisedHand } from '../../react-components/src';\nexport type {\n ReactionButtonStrings,\n Reaction,\n ReactionButtonProps,\n ReactionResources,\n ReactionSprite\n} from '../../react-components/src';\n/ @conditional-compile-remove(rich-text-editor) /\nexport { RichTextSendBox } from '../../react-components/src';\n/ @conditional-compile-remove(rich-text-editor) /\nexport type { RichTextSendBoxProps, RichTextSendBoxStrings, RichTextStrings } from '../../react-components/src';\nexport type { Spotlight } from '../../react-components/src';\nexport type { ImageOverlayProps, ImageOverlayStrings } from '../../react-components/src';\n/ @conditional-compile-remove(data-loss-prevention) /\nexport type { BlockedMessage } from '../../react-components/src';\nexport type {\n DialpadMode,\n DialpadProps,\n DialpadStrings,\n DialpadStyles,\n DtmfTone,\n LongPressTrigger\n} from '../../react-components/src';\n/ @conditional-compile-remove(file-sharing-acs) /\nexport type { AttachmentOptions } from '../../react-components/src';\n/ @conditional-compile-remove(file-sharing-acs) /\nexport type { SendBoxErrorBarError } from '../../react-components/src';\n/ @conditional-compile-remove(file-sharing-acs) /\nexport type { AttachmentActionHandler } from '../../react-components/src';\n/ @conditional-compile-remove(file-sharing-acs) /\nexport type {\n AttachmentSelectionHandler,\n AttachmentRemovalHandler,\n AttachmentUploadOptions,\n AttachmentUploadTask\n} from '../../react-components/src';\n/ @conditional-compile-remove(file-sharing-teams-interop) @conditional-compile-remove(file-sharing-acs) /\nexport type { AttachmentMetadata } from '../../acs-ui-common/src';\n\n/ @conditional-compile-remove(file-sharing-acs) /\nexport type { AttachmentMetadataInProgress, AttachmentProgressError } from '../../acs-ui-common/src';\n\n/ @conditional-compile-remove(file-sharing-acs) /\nexport type { AttachmentMenuAction, AttachmentDownloadOptions } from '../../react-components/src';\n/ @conditional-compile-remove(file-sharing-acs) /\nexport { defaultAttachmentMenuAction } from '../../react-components/src';\nexport type { ChatAttachmentType } from '../../react-components/src';\nexport type { InlineImageOptions, InlineImage } from '../../react-components/src';\n/ @conditional-compile-remove(rich-text-editor) /\nexport type { RichTextEditorOptions } from '../../react-components/src';\n/ @conditional-compile-remove(PSTN-calls) /\nexport type { HoldButtonProps, HoldButtonStrings } from '../../react-components/src';\nexport type { VideoTileStrings } from '../../react-components/src';\n/ @conditional-compile-remove(call-readiness) /\nexport type { BrowserPermissionDeniedStrings, BrowserPermissionDeniedProps } from '../../react-components/src';\n/ @conditional-compile-remove(call-readiness) /\nexport type {\n BrowserPermissionDeniedIOSStrings,\n BrowserPermissionDeniedStyles,\n BrowserPermissionDeniedIOSProps\n} from '../../react-components/src';\nexport type { OverflowGalleryPosition } from '../../react-components/src';\nexport type { LocalVideoTileSize } from '../../react-components/src';\nexport from '../../react-components/src/localization/locales';\nexport * from '../../react-components/src/theming';\nexport * from '../../calling-stateful-client/src/index-public';\n/* @conditional-compile-remove(one-to-n-calling) /\nexport type { DeclarativeCallAgent } from '../../calling-stateful-client/src';\nexport { createStatefulChatClient } from '../../chat-stateful-client/src';\nexport type {\n StatefulChatClient,\n StatefulChatClientArgs,\n StatefulChatClientOptions,\n ChatMessageWithStatus,\n ChatClientState,\n ChatError,\n ChatErrors,\n ChatThreadClientState,\n ChatThreadProperties,\n ChatErrorTarget\n} from '../../chat-stateful-client/src';\n/ @conditional-compile-remove(rich-text-editor-image-upload) /\nexport type { MessagingPolicy } from '../../chat-stateful-client/src';\n\nexport type { ResourceFetchResult } from '../../chat-stateful-client/src';\nexport from '../../react-composites/src/index-public';\nexport * from './mergedHooks';\n\n/* @conditional-compile-remove(unsupported-browser) /\nexport { UnsupportedBrowser } from '../../react-components/src';\n/ @conditional-compile-remove(unsupported-browser) /\nexport type { UnsupportedBrowserStrings, UnsupportedBrowserProps } from '../../react-components/src';\n/ @conditional-compile-remove(unsupported-browser) /\nexport { UnsupportedBrowserVersion } from '../../react-components/src';\n/ @conditional-compile-remove(unsupported-browser) /\nexport type { UnsupportedBrowserVersionStrings, UnsupportedBrowserVersionProps } from '../../react-components/src';\n/ @conditional-compile-remove(unsupported-browser) /\nexport { UnsupportedOperatingSystem } from '../../react-components/src';\n/ @conditional-compile-remove(unsupported-browser) /\nexport type { UnsupportedOperatingSystemStrings, UnsupportedOperatingSystemProps } from '../../react-components/src';\nexport type {\n VerticalGalleryStyles,\n VerticalGalleryStrings,\n VerticalGalleryControlBarStyles\n} from '../../react-components/src';\n\nexport type { SpokenLanguageStrings, CaptionLanguageStrings } from '../../react-components/src';\n\nexport type { SurveyIssues } from '../../react-components/src';\n\nexport type { SurveyIssuesHeadingStrings } from '../../react-components/src';\n\nexport type { CallSurveyImprovementSuggestions } from '../../react-components/src';\n/ @conditional-compile-remove(notifications) /\nexport { NotificationStack, Notification } from '../../react-components/src';\n/ @conditional-compile-remove(notifications) /\nexport type {\n NotificationStackProps,\n NotificationProps,\n NotificationStrings,\n NotificationStackStrings,\n NotificationType,\n ActiveNotification\n} from '../../react-components/src';\n/ @conditional-compile-remove(teams-meeting-conference) */\nexport type { MeetingConferencePhoneInfoModalStrings } from '../../react-components/src';\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/index.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC;;;;;;;;;;;;;;;GAeG;AAEH,OAAO,EAAE,+BAA+B,EAAE,6BAA6B,EAAE,MAAM,yBAAyB,CAAC;AAUzG,uDAAuD;AACvD,OAAO,EAAE,yBAAyB,EAAE,iBAAiB,EAAE,MAAM,qCAAqC,CAAC;AAgCnG,OAAO,EACL,kBAAkB,EAClB,iBAAiB,EACjB,YAAY,EACZ,aAAa,EACb,YAAY,EACZ,OAAO,EACP,gBAAgB,EAChB,kBAAkB,EAClB,4BAA4B,EAC7B,MAAM,sCAAsC,CAAC;AAE9C,yDAAyD;AACzD,OAAO,EACL,iBAAiB,EACjB,YAAY,EACZ,iCAAiC,EAClC,MAAM,sCAAsC,CAAC;AAwB9C,OAAO,EACL,kBAAkB,EAClB,wBAAwB,EACxB,aAAa,EACb,mBAAmB,EACnB,eAAe,EACf,yBAAyB,EAC1B,MAAM,mCAAmC,CAAC;AAU3C,OAAO,EACL,mBAAmB,EACnB,YAAY,EACZ,UAAU,EACV,gBAAgB,EAChB,aAAa,EACb,aAAa,EACb,QAAQ,EACR,UAAU,EACV,oBAAoB,EACpB,sBAAsB,EACtB,aAAa,EACb,gBAAgB,EAChB,eAAe,EACf,eAAe,EACf,kBAAkB,EAClB,iBAAiB,EACjB,OAAO,EACP,WAAW,EACX,eAAe,EACf,YAAY,EACZ,SAAS,EACT,sBAAsB,EACtB,sBAAsB,EACtB,sBAAsB,EACtB,sBAAsB,EACtB,sBAAsB,EACtB,sBAAsB,EACtB,sBAAsB,EACtB,sBAAsB,EACtB,sBAAsB,EACtB,sBAAsB,EACtB,sBAAsB,EACtB,sBAAsB,EACtB,sBAAsB,EACtB,sBAAsB,EACtB,sBAAsB,EACtB,sBAAsB,EACtB,sBAAsB,EACtB,sBAAsB,EACtB,sBAAsB,EACtB,sBAAsB,EACvB,MAAM,4BAA4B,CAAC;AACpC,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,6CAA6C;AAC7C,OAAO,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAC;AAExD,OAAO,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAE7D,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AAErD,mDAAmD;AACnD,OAAO,EAAE,wBAAwB,EAAE,MAAM,4BAA4B,CAAC;AAQtE,iDAAiD;AACjD,OAAO,EACL,kCAAkC,EAClC,yBAAyB,EACzB,qBAAqB,EACtB,MAAM,4BAA4B,CAAC;AA0IpC,mDAAmD;AACnD,OAAO,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAoC7D,mDAAmD;AACnD,OAAO,EAAE,2BAA2B,EAAE,MAAM,4BAA4B,CAAC;AAkBzE,cAAc,iDAAiD,CAAC;AAChE,cAAc,oCAAoC,CAAC;AACnD,cAAc,gDAAgD,CAAC;AAG/D,OAAO,EAAE,wBAAwB,EAAE,MAAM,gCAAgC,CAAC;AAiB1E,cAAc,yCAAyC,CAAC;AACxD,cAAc,eAAe,CAAC;AAE9B,sDAAsD;AACtD,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAGhE,sDAAsD;AACtD,OAAO,EAAE,yBAAyB,EAAE,MAAM,4BAA4B,CAAC;AAGvE,sDAAsD;AACtD,OAAO,EAAE,0BAA0B,EAAE,MAAM,4BAA4B,CAAC;AAgBxE,gDAAgD;AAChD,OAAO,EAAE,iBAAiB,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\n/*\n `@azure/communication-react` is an npm package that exports the functionality of the Azure Communication Services - UI Library.\n \n This package makes it easy for you to build modern communications user experiences using Azure Communication Services. It gives you a library of production-ready UI components that you can drop into your applications:\n * - Composites: These components are turn-key solutions that implement common communication scenarios. You can quickly add video calling or chat experiences to your applications. Composites are open-source higher order components built using UI components.\n * - UI Components - These components are open-source building blocks that let you build custom communications experience. Components are offered for both calling and chat capabilities that can be combined to build experiences.\n \n These UI client libraries all use Microsoft's Fluent design language and assets. Fluent UI provides a foundational layer for the UI Library and is actively used across Microsoft products.\n \n In conjunction with the UI components, the UI Library exposes a stateful client library for calling and chat. This client is agnostic to any specific state management framework and can be integrated with common state managers like Redux or React Context.\n * This stateful client library can be used with the UI Components to pass props and methods for the UI Components to render data. For more information, see Stateful Client Overview.\n \n For more information visit: https://aka.ms/acsstorybook\n \n @packageDocumentation\n /\n\nexport { fromFlatCommunicationIdentifier, toFlatCommunicationIdentifier } from '../../acs-ui-common/src';\nexport type {\n AreEqual,\n CommonProperties,\n MessageStatus,\n Common,\n AreTypeEqual,\n AreParamEqual\n} from '../../acs-ui-common/src';\n\n/ @conditional-compile-remove(composite-js-helpers) /\nexport { loadOutboundCallComposite, loadCallComposite } from '../../acs-ui-javascript-loaders/src';\n/ @conditional-compile-remove(composite-js-helpers) /\nexport type { OutboundCallCompositeLoaderProps, CallCompositeLoaderProps } from '../../acs-ui-javascript-loaders/src';\n\n// Not to export chat/calling specific hook from binding package\nexport type {\n CallClientProviderProps,\n CallAgentProviderProps,\n CallProviderProps,\n GetCallingSelector,\n CallingHandlers,\n CallingBaseSelectorProps,\n CommonCallingHandlers\n} from '../../calling-component-bindings/src';\n\nexport type { VideoBackgroundEffectsDependency, CallingHandlersOptions } from '../../calling-component-bindings/src';\n\nexport type { CaptionsOptions } from '../../calling-component-bindings/src';\n\nexport type {\n ChatClientProviderProps,\n ChatThreadClientProviderProps,\n GetChatSelector,\n ChatHandlers,\n ChatBaseSelectorProps\n} from '../../chat-component-bindings/src';\n\n/ @conditional-compile-remove(file-sharing-acs) /\nexport type { MessageOptions, ChatMessageType } from '../../acs-ui-common/src';\n/ @conditional-compile-remove(rich-text-editor-image-upload) /\nexport type { UploadChatImageResult } from '../../acs-ui-common/src';\n\nexport {\n CallClientProvider,\n CallAgentProvider,\n CallProvider,\n useCallClient,\n useCallAgent,\n useCall,\n useDeviceManager,\n getCallingSelector,\n createDefaultCallingHandlers\n} from '../../calling-component-bindings/src';\n\n/ @conditional-compile-remove(teams-identity-support) /\nexport {\n useTeamsCallAgent,\n useTeamsCall,\n createDefaultTeamsCallingHandlers\n} from '../../calling-component-bindings/src';\n\n/ @conditional-compile-remove(teams-identity-support) /\nexport type { TeamsCallingHandlers } from '../../calling-component-bindings/src';\n\nexport type {\n ScreenShareButtonSelector,\n CameraButtonSelector,\n VideoGallerySelector,\n DevicesButtonSelector,\n EmptySelector,\n ErrorBarSelector as CallErrorBarSelector,\n ParticipantListSelector,\n MicrophoneButtonSelector,\n ParticipantsButtonSelector,\n CreateDefaultCallingHandlers\n} from '../../calling-component-bindings/src';\n/ @conditional-compile-remove(PSTN-calls) /\nexport type { HoldButtonSelector } from '../../calling-component-bindings/src';\n\nexport type { RaiseHandButtonSelector } from '../../calling-component-bindings/src';\n/ @conditional-compile-remove(notifications) /\nexport type { NotificationStackSelector } from '../../calling-component-bindings/src';\n\nexport {\n ChatClientProvider,\n ChatThreadClientProvider,\n useChatClient,\n useChatThreadClient,\n getChatSelector,\n createDefaultChatHandlers\n} from '../../chat-component-bindings/src';\n\nexport type {\n MessageThreadSelector,\n TypingIndicatorSelector,\n ChatParticipantListSelector,\n SendBoxSelector,\n ErrorBarSelector as ChatErrorBarSelector\n} from '../../chat-component-bindings/src';\n\nexport {\n _IdentifierProvider,\n CameraButton,\n ControlBar,\n ControlBarButton,\n DevicesButton,\n EndCallButton,\n ErrorBar,\n GridLayout,\n LocalizationProvider,\n MessageStatusIndicator,\n MessageThread,\n MicrophoneButton,\n ParticipantItem,\n ParticipantList,\n ParticipantsButton,\n ScreenShareButton,\n SendBox,\n StreamMedia,\n TypingIndicator,\n VideoGallery,\n VideoTile,\n COMPONENT_LOCALE_EN_GB,\n COMPONENT_LOCALE_AR_SA,\n COMPONENT_LOCALE_CS_CZ,\n COMPONENT_LOCALE_DE_DE,\n COMPONENT_LOCALE_ES_ES,\n COMPONENT_LOCALE_FI_FI,\n COMPONENT_LOCALE_FR_FR,\n COMPONENT_LOCALE_HE_IL,\n COMPONENT_LOCALE_IT_IT,\n COMPONENT_LOCALE_JA_JP,\n COMPONENT_LOCALE_KO_KR,\n COMPONENT_LOCALE_NB_NO,\n COMPONENT_LOCALE_NL_NL,\n COMPONENT_LOCALE_PL_PL,\n COMPONENT_LOCALE_PT_BR,\n COMPONENT_LOCALE_RU_RU,\n COMPONENT_LOCALE_SV_SE,\n COMPONENT_LOCALE_TR_TR,\n COMPONENT_LOCALE_ZH_CN,\n COMPONENT_LOCALE_ZH_TW\n} from '../../react-components/src';\nexport { ImageOverlay } from '../../react-components/src';\n/ @conditional-compile-remove(PSTN-calls) /\nexport { HoldButton } from '../../react-components/src';\n\nexport { RaiseHandButton } from '../../react-components/src';\n\nexport { Dialpad } from '../../react-components/src';\n\n/ @conditional-compile-remove(one-to-n-calling) /\nexport { IncomingCallNotification } from '../../react-components/src';\n/ @conditional-compile-remove(one-to-n-calling) /\nexport type {\n IncomingCallNotificationProps,\n IncomingCallNotificationStrings,\n IncomingCallNotificationStyles\n} from '../../react-components/src';\n\n/ @conditional-compile-remove(call-readiness) /\nexport {\n CameraAndMicrophoneSitePermissions,\n MicrophoneSitePermissions,\n CameraSitePermissions\n} from '../../react-components/src';\n/ @conditional-compile-remove(call-readiness) /\nexport type {\n CameraAndMicrophoneSitePermissionsStrings,\n CameraAndMicrophoneSitePermissionsProps,\n CameraSitePermissionsStrings,\n CameraSitePermissionsProps,\n CommonSitePermissionsProps,\n SitePermissionsStrings,\n SitePermissionsStyles,\n MicrophoneSitePermissionsStrings,\n MicrophoneSitePermissionsProps\n} from '../../react-components/src';\n\n/ @conditional-compile-remove(total-participant-count) /\nexport type { ParticipantListStrings } from '../../react-components/src';\n\n/ @conditional-compile-remove(mention) /\nexport type {\n MentionOptions,\n MentionDisplayOptions,\n MentionLookupOptions,\n Mention,\n MentionPopoverStrings\n} from '../../react-components/src';\n\nexport type {\n _IdentifierProviderProps,\n _Identifiers,\n ActiveErrorMessage,\n BaseCustomStyles,\n CallParticipantListParticipant,\n CameraButtonContextualMenuStyles,\n CameraButtonProps,\n CameraButtonStrings,\n CameraButtonStyles,\n ChatMessage,\n CommunicationParticipant,\n ComponentLocale,\n ComponentSlotStyle,\n ComponentStrings,\n ContentSystemMessage,\n ControlBarButtonProps,\n ControlBarButtonStrings,\n ControlBarButtonStyles,\n ControlBarLayout,\n ControlBarProps,\n CreateVideoStreamViewResult,\n CustomAvatarOptions,\n CustomMessage,\n DevicesButtonContextualMenuStyles,\n DevicesButtonProps,\n DevicesButtonStrings,\n DevicesButtonStyles,\n EndCallButtonProps,\n EndCallButtonStrings,\n ErrorBarProps,\n ErrorBarStrings,\n ErrorType,\n GridLayoutProps,\n GridLayoutStyles,\n HorizontalGalleryStyles,\n JumpToNewMessageButtonProps,\n LocalizationProviderProps,\n LocalVideoCameraCycleButtonProps,\n LoadingState,\n Message,\n MessageAttachedStatus,\n MessageCommon,\n MessageContentType,\n MessageProps,\n MessageRenderer,\n MessageStatusIndicatorProps,\n MessageStatusIndicatorStrings,\n MessageThreadProps,\n MessageThreadStrings,\n MessageThreadStyles,\n MicrophoneButtonContextualMenuStyles,\n MicrophoneButtonProps,\n MicrophoneButtonStrings,\n MicrophoneButtonStyles,\n OnRenderAvatarCallback,\n OptionsDevice,\n ParticipantAddedSystemMessage,\n ParticipantItemProps,\n ParticipantItemStrings,\n ParticipantItemStyles,\n ParticipantListItemStyles,\n ParticipantListParticipant,\n ParticipantListProps,\n ParticipantListStyles,\n ParticipantMenuItemsCallback,\n ParticipantRemovedSystemMessage,\n ParticipantState,\n ParticipantsButtonContextualMenuStyles,\n ParticipantsButtonProps,\n ParticipantsButtonStrings,\n ParticipantsButtonStyles,\n ReadReceiptsBySenderId,\n ScreenShareButtonProps,\n ScreenShareButtonStrings,\n SendBoxProps,\n SendBoxStrings,\n SendBoxStylesProps,\n StreamMediaProps,\n SystemMessage,\n SystemMessageCommon,\n TopicUpdatedSystemMessage,\n TypingIndicatorProps,\n TypingIndicatorStrings,\n TypingIndicatorStylesProps,\n UpdateMessageCallback,\n CancelEditCallback,\n VideoGalleryLayout,\n VideoGalleryLocalParticipant,\n VideoGalleryParticipant,\n VideoGalleryProps,\n VideoGalleryRemoteParticipant,\n VideoGalleryStream,\n VideoGalleryStrings,\n VideoGalleryStyles,\n VideoStreamOptions,\n VideoTileProps,\n VideoTileStylesProps,\n ViewScalingMode,\n VideoTileContextualMenuProps,\n VideoTileDrawerMenuProps,\n VideoTilesOptions\n} from '../../react-components/src';\n\nexport type { RaiseHandButtonProps, RaiseHandButtonStrings, RaisedHand } from '../../react-components/src';\nexport type {\n ReactionButtonStrings,\n Reaction,\n ReactionButtonProps,\n ReactionResources,\n ReactionSprite\n} from '../../react-components/src';\n/ @conditional-compile-remove(rich-text-editor) /\nexport { RichTextSendBox } from '../../react-components/src';\n/ @conditional-compile-remove(rich-text-editor) /\nexport type { RichTextSendBoxProps, RichTextSendBoxStrings, RichTextStrings } from '../../react-components/src';\nexport type { Spotlight } from '../../react-components/src';\nexport type { ImageOverlayProps, ImageOverlayStrings } from '../../react-components/src';\n/ @conditional-compile-remove(data-loss-prevention) /\nexport type { BlockedMessage } from '../../react-components/src';\nexport type {\n DialpadMode,\n DialpadProps,\n DialpadStrings,\n DialpadStyles,\n DtmfTone,\n LongPressTrigger\n} from '../../react-components/src';\n/ @conditional-compile-remove(file-sharing-acs) /\nexport type { AttachmentOptions } from '../../react-components/src';\n/ @conditional-compile-remove(file-sharing-acs) /\nexport type { SendBoxErrorBarError } from '../../react-components/src';\n/ @conditional-compile-remove(file-sharing-acs) /\nexport type { AttachmentActionHandler } from '../../react-components/src';\n/ @conditional-compile-remove(file-sharing-acs) /\nexport type {\n AttachmentSelectionHandler,\n AttachmentRemovalHandler,\n AttachmentUploadOptions,\n AttachmentUploadTask\n} from '../../react-components/src';\n/ @conditional-compile-remove(file-sharing-teams-interop) @conditional-compile-remove(file-sharing-acs) /\nexport type { AttachmentMetadata } from '../../acs-ui-common/src';\n\n/ @conditional-compile-remove(file-sharing-acs) /\nexport type { AttachmentMetadataInProgress, AttachmentProgressError } from '../../acs-ui-common/src';\n\n/ @conditional-compile-remove(file-sharing-acs) /\nexport type { AttachmentMenuAction, AttachmentDownloadOptions } from '../../react-components/src';\n/ @conditional-compile-remove(file-sharing-acs) /\nexport { defaultAttachmentMenuAction } from '../../react-components/src';\nexport type { ChatAttachmentType } from '../../react-components/src';\nexport type { InlineImageOptions, InlineImage } from '../../react-components/src';\n/ @conditional-compile-remove(rich-text-editor) /\nexport type { RichTextEditorOptions, RichTextEditBoxOptions, RichTextSendBoxOptions } from '../../react-components/src';\n/ @conditional-compile-remove(PSTN-calls) /\nexport type { HoldButtonProps, HoldButtonStrings } from '../../react-components/src';\nexport type { VideoTileStrings } from '../../react-components/src';\n/ @conditional-compile-remove(call-readiness) /\nexport type { BrowserPermissionDeniedStrings, BrowserPermissionDeniedProps } from '../../react-components/src';\n/ @conditional-compile-remove(call-readiness) /\nexport type {\n BrowserPermissionDeniedIOSStrings,\n BrowserPermissionDeniedStyles,\n BrowserPermissionDeniedIOSProps\n} from '../../react-components/src';\nexport type { OverflowGalleryPosition } from '../../react-components/src';\nexport type { LocalVideoTileSize } from '../../react-components/src';\nexport from '../../react-components/src/localization/locales';\nexport * from '../../react-components/src/theming';\nexport * from '../../calling-stateful-client/src/index-public';\n/* @conditional-compile-remove(one-to-n-calling) /\nexport type { DeclarativeCallAgent } from '../../calling-stateful-client/src';\nexport { createStatefulChatClient } from '../../chat-stateful-client/src';\nexport type {\n StatefulChatClient,\n StatefulChatClientArgs,\n StatefulChatClientOptions,\n ChatMessageWithStatus,\n ChatClientState,\n ChatError,\n ChatErrors,\n ChatThreadClientState,\n ChatThreadProperties,\n ChatErrorTarget\n} from '../../chat-stateful-client/src';\n/ @conditional-compile-remove(rich-text-editor-image-upload) /\nexport type { MessagingPolicy } from '../../chat-stateful-client/src';\n\nexport type { ResourceFetchResult } from '../../chat-stateful-client/src';\nexport from '../../react-composites/src/index-public';\nexport * from './mergedHooks';\n\n/* @conditional-compile-remove(unsupported-browser) /\nexport { UnsupportedBrowser } from '../../react-components/src';\n/ @conditional-compile-remove(unsupported-browser) /\nexport type { UnsupportedBrowserStrings, UnsupportedBrowserProps } from '../../react-components/src';\n/ @conditional-compile-remove(unsupported-browser) /\nexport { UnsupportedBrowserVersion } from '../../react-components/src';\n/ @conditional-compile-remove(unsupported-browser) /\nexport type { UnsupportedBrowserVersionStrings, UnsupportedBrowserVersionProps } from '../../react-components/src';\n/ @conditional-compile-remove(unsupported-browser) /\nexport { UnsupportedOperatingSystem } from '../../react-components/src';\n/ @conditional-compile-remove(unsupported-browser) /\nexport type { UnsupportedOperatingSystemStrings, UnsupportedOperatingSystemProps } from '../../react-components/src';\nexport type {\n VerticalGalleryStyles,\n VerticalGalleryStrings,\n VerticalGalleryControlBarStyles\n} from '../../react-components/src';\n\nexport type { SpokenLanguageStrings, CaptionLanguageStrings } from '../../react-components/src';\n\nexport type { SurveyIssues } from '../../react-components/src';\n\nexport type { SurveyIssuesHeadingStrings } from '../../react-components/src';\n\nexport type { CallSurveyImprovementSuggestions } from '../../react-components/src';\n/ @conditional-compile-remove(notifications) /\nexport { NotificationStack, Notification } from '../../react-components/src';\n/ @conditional-compile-remove(notifications) /\nexport type {\n NotificationStackProps,\n NotificationProps,\n NotificationStrings,\n NotificationStackStrings,\n NotificationType,\n ActiveNotification\n} from '../../react-components/src';\n/ @conditional-compile-remove(teams-meeting-conference) */\nexport type { MeetingConferencePhoneInfoModalStrings } from '../../react-components/src';\n"]}

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

@@ -16,7 +16,7 @@ import React from 'react';
 import { Announcer } from '../Announcer';
 import { useEffect, useState, useMemo } from 'react';
 import { useLocaleAttachmentCardStringsTrampoline } from '../utils/common';
-import { useAttachmentCardStyles, attachmentNameContainerClassName, ATTACHMENT_CARD_MIN_PROGRESS } from '../styles/AttachmentCard.styles';
+import { useAttachmentCardStyles, ATTACHMENT_CARD_MIN_PROGRESS, titleTooltipContainerStyle } from '../styles/AttachmentCard.styles';
 /**
  * @internal
  * A component for displaying an attachment card with attachment icon and progress bar.
@@ -56,18 +56,24 @@ export const _AttachmentCard = (props) => {
     return (React.createElement("div", { "data-is-focusable": true },
         React.createElement(Announcer, { announcementString: announcerString, ariaLive: 'polite' }),
         React.createElement(Card, { className: mergeClasses(attachmentCardStyles.root, selfResizing ? attachmentCardStyles.dynamicWidth : attachmentCardStyles.staticWidth), size: "small", role: "listitem", appearance: "filled-alternative", "aria-label": attachment.name, "data-testid": 'attachment-card' },
-            React.createElement(CardHeader, { className: attachmentCardStyles.content, image: React.createElement("div", { className: attachmentCardStyles.fileIcon },
-                    React.createElement(Icon, { "data-ui-id": 'attachmenttype-icon', iconName: getFileTypeIconProps({
+            React.createElement(CardHeader, { className: attachmentCardStyles.content, image: {
+                    className: attachmentCardStyles.fileIcon,
+                    children: (React.createElement(Icon, { "data-ui-id": 'attachmenttype-icon', iconName: getFileTypeIconProps({
                             extension: extension,
                             size: 24,
                             imageFileType: 'svg'
-                        }).iconName })), header: React.createElement("div", { className: attachmentNameContainerClassName, id: 'attachment-' + attachment.id },
-                    React.createElement(TooltipHost, { content: attachment.name, calloutProps: {
+                        }).iconName }))
+                }, header: {
+                    id: 'attachment-' + attachment.id,
+                    children: (React.createElement(TooltipHost, { content: attachment.name, calloutProps: {
                             gapSpace: 0,
                             target: '#attachment-' + attachment.id
-                        } },
-                        React.createElement("div", { className: attachmentCardStyles.fileNameLabel },
-                            React.createElement(Text, { className: attachmentCardStyles.title, "aria-label": attachment.name }, attachment.name)))), action: React.createElement("div", { className: attachmentCardStyles.focusState }, MappedMenuItems(menuActions, Object.assign(Object.assign({}, attachment), { url: (_e = attachment.url) !== null && _e !== void 0 ? _e : '' }), onActionHandlerFailed)) })),
+                        }, hostClassName: titleTooltipContainerStyle },
+                        React.createElement(Text, { className: attachmentCardStyles.title, "aria-label": attachment.name }, attachment.name)))
+                }, action: {
+                    className: attachmentCardStyles.actions,
+                    children: MappedMenuItems(menuActions, Object.assign(Object.assign({}, attachment), { url: (_e = attachment.url) !== null && _e !== void 0 ? _e : '' }), onActionHandlerFailed)
+                } })),
         isUploadInProgress ? (React.createElement(CardFooter, null,
             React.createElement(ProgressBar, { thickness: "medium", value: Math.max(progress !== null && progress !== void 0 ? progress : 0, ATTACHMENT_CARD_MIN_PROGRESS), shape: "rounded" }))) : (React.createElement(React.Fragment, null, " "))));
 };

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

	@@ -1 +1 @@
1	- {"version":3,"file":"AttachmentCard.js","sourceRoot":"","sources":["../../../../../../../react-components/src/components/Attachment/AttachmentCard.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { Icon, TooltipHost } from '@fluentui/react';\nimport {\n Card,\n CardHeader,\n Text,\n Menu,\n MenuTrigger,\n ToolbarButton,\n MenuPopover,\n MenuItem,\n MenuList,\n Toolbar,\n CardFooter,\n ProgressBar,\n mergeClasses\n} from '@fluentui/react-components';\nimport { getFileTypeIconProps } from '@fluentui/react-file-type-icons';\nimport React from 'react';\nimport { _pxToRem } from '@internal/acs-ui-common';\nimport { Announcer } from '../Announcer';\nimport { useEffect, useState, useMemo } from 'react';\nimport { _AttachmentUploadCardsStrings } from './AttachmentUploadCards';\nimport { useLocaleAttachmentCardStringsTrampoline } from '../utils/common';\nimport { AttachmentMenuAction } from '../../types/Attachment';\nimport { AttachmentMetadata, AttachmentMetadataInProgress } from '@internal/acs-ui-common';\nimport {\n useAttachmentCardStyles,\n attachmentNameContainerClassName,\n ATTACHMENT_CARD_MIN_PROGRESS\n} from '../styles/AttachmentCard.styles';\n\n/*\n @internal\n * AttachmentCard Component Props.\n /\nexport interface _AttachmentCardProps {\n /\n Attachment details including name, extension, url, etc.\n /\n attachment: AttachmentMetadata \| AttachmentMetadataInProgress;\n /\n An array of menu actions to be displayed in the attachment card.\n /\n menuActions: AttachmentMenuAction[];\n /\n Optional aria label strings for attachment upload cards\n /\n strings?: _AttachmentUploadCardsStrings;\n /\n Optional callback that runs if menu bar action onclick throws.\n /\n onActionHandlerFailed?: (errMsg: string) => void;\n /\n Optional flag to enable self resizing of the attachment card.\n /\n selfResizing?: boolean;\n}\n\n/\n @internal\n * A component for displaying an attachment card with attachment icon and progress bar.\n \n `_AttachmentCard` internally uses the `Card` component from `@fluentui/react-components`. You can checkout the details about these components [here](https://react.fluentui.dev/?path=/docs/components-card).\n */\nexport const _AttachmentCard = (props: _AttachmentCardProps): JSX.Element => {\n const { attachment, menuActions, onActionHandlerFailed, selfResizing } = props;\n const attachmentCardStyles = useAttachmentCardStyles();\n\n const progress = useMemo(() => {\n return 'progress' in attachment ? attachment.progress : undefined;\n }, [attachment]);\n\n const isUploadInProgress = useMemo(() => {\n return progress !== undefined && progress >= 0 && progress < 1;\n }, [progress]);\n\n const [announcerString, setAnnouncerString] = useState<string \| undefined>(undefined);\n const localeStrings = useLocaleAttachmentCardStringsTrampoline();\n const uploadStartedString = props.strings?.uploading ?? localeStrings.uploading;\n const uploadCompletedString = props.strings?.uploadCompleted ?? localeStrings.uploadCompleted;\n\n useEffect(() => {\n if (isUploadInProgress) {\n setAnnouncerString(`${uploadStartedString} ${attachment.name}`);\n } else if (progress === 1) {\n setAnnouncerString(`${attachment.name} ${uploadCompletedString}`);\n } else {\n setAnnouncerString(undefined);\n }\n }, [progress, isUploadInProgress, attachment.name, uploadStartedString, uploadCompletedString]);\n\n const extension = useMemo((): string => {\n const re = /(?:\\.([^.]+))?$/;\n const match = re.exec(attachment.name);\n return match && match[1] ? match[1] : '';\n }, [attachment]);\n return (\n <div data-is-focusable={true}>\n <Announcer announcementString={announcerString} ariaLive={'polite'} />\n <Card\n className={mergeClasses(\n attachmentCardStyles.root,\n selfResizing ? attachmentCardStyles.dynamicWidth : attachmentCardStyles.staticWidth\n )}\n size=\"small\"\n role=\"listitem\"\n appearance=\"filled-alternative\"\n aria-label={attachment.name}\n data-testid={'attachment-card'}\n >\n <CardHeader\n className={attachmentCardStyles.content}\n image={\n <div className={attachmentCardStyles.fileIcon}>\n <Icon\n data-ui-id={'attachmenttype-icon'}\n iconName={\n getFileTypeIconProps({\n extension: extension,\n size: 24,\n imageFileType: 'svg'\n }).iconName\n }\n />\n </div>\n }\n header={\n <div className={attachmentNameContainerClassName} id={'attachment-' + attachment.id}>\n <TooltipHost\n content={attachment.name}\n calloutProps={{\n gapSpace: 0,\n target: '#attachment-' + attachment.id\n }}\n >\n <div className={attachmentCardStyles.fileNameLabel}>\n <Text className={attachmentCardStyles.title} aria-label={attachment.name}>\n {attachment.name}\n </Text>\n </div>\n </TooltipHost>\n </div>\n }\n action={\n <div className={attachmentCardStyles.focusState}>\n {MappedMenuItems(\n menuActions,\n {\n ...attachment,\n url: attachment.url ?? ''\n },\n onActionHandlerFailed\n )}\n </div>\n }\n />\n </Card>\n {isUploadInProgress ? (\n <CardFooter>\n <ProgressBar\n thickness=\"medium\"\n value={Math.max(progress ?? 0, ATTACHMENT_CARD_MIN_PROGRESS)}\n shape=\"rounded\"\n />\n </CardFooter>\n ) : (\n <> </>\n )}\n </div>\n );\n};\n\nconst MappedMenuItems = (\n menuActions: AttachmentMenuAction[],\n attachment: AttachmentMetadata,\n handleOnClickError?: (errMsg: string) => void\n): JSX.Element => {\n const localeStrings = useLocaleAttachmentCardStringsTrampoline();\n\n if (menuActions.length === 0) {\n return <></>;\n }\n return menuActions.length === 1 ? (\n <TooltipHost content={menuActions[0].name}>\n <ToolbarButton\n aria-label={menuActions[0].name}\n role=\"button\"\n icon={menuActions[0].icon}\n onClick={() => {\n try {\n menuActions[0].onClick(attachment);\n } catch (e) {\n handleOnClickError?.((e as Error).message);\n }\n }}\n />\n </TooltipHost>\n ) : (\n <Toolbar>\n <Menu>\n <TooltipHost content={localeStrings.attachmentMoreMenu}>\n <MenuTrigger>\n <ToolbarButton\n aria-label={localeStrings.attachmentMoreMenu}\n role=\"button\"\n icon={<Icon iconName=\"AttachmentMoreMenu\" />}\n />\n </MenuTrigger>\n </TooltipHost>\n <MenuPopover>\n <MenuList>\n {menuActions.map((menuItem, index) => (\n <MenuItem\n aria-label={menuItem.name}\n key={index}\n icon={menuItem.icon}\n onClick={async () => {\n try {\n await menuItem.onClick(attachment);\n } catch (e) {\n handleOnClickError?.((e as Error).message);\n }\n }}\n >\n {menuItem.name}\n </MenuItem>\n ))}\n </MenuList>\n </MenuPopover>\n </Menu>\n </Toolbar>\n );\n};\n"]}
1	+ {"version":3,"file":"AttachmentCard.js","sourceRoot":"","sources":["../../../../../../../react-components/src/components/Attachment/AttachmentCard.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { Icon, TooltipHost } from '@fluentui/react';\nimport {\n Card,\n CardHeader,\n Text,\n Menu,\n MenuTrigger,\n ToolbarButton,\n MenuPopover,\n MenuItem,\n MenuList,\n Toolbar,\n CardFooter,\n ProgressBar,\n mergeClasses\n} from '@fluentui/react-components';\nimport { getFileTypeIconProps } from '@fluentui/react-file-type-icons';\nimport React from 'react';\nimport { _pxToRem } from '@internal/acs-ui-common';\nimport { Announcer } from '../Announcer';\nimport { useEffect, useState, useMemo } from 'react';\nimport { _AttachmentUploadCardsStrings } from './AttachmentUploadCards';\nimport { useLocaleAttachmentCardStringsTrampoline } from '../utils/common';\nimport { AttachmentMenuAction } from '../../types/Attachment';\nimport { AttachmentMetadata, AttachmentMetadataInProgress } from '@internal/acs-ui-common';\nimport {\n useAttachmentCardStyles,\n ATTACHMENT_CARD_MIN_PROGRESS,\n titleTooltipContainerStyle\n} from '../styles/AttachmentCard.styles';\n\n/*\n @internal\n * AttachmentCard Component Props.\n /\nexport interface _AttachmentCardProps {\n /\n Attachment details including name, extension, url, etc.\n /\n attachment: AttachmentMetadata \| AttachmentMetadataInProgress;\n /\n An array of menu actions to be displayed in the attachment card.\n /\n menuActions: AttachmentMenuAction[];\n /\n Optional aria label strings for attachment upload cards\n /\n strings?: _AttachmentUploadCardsStrings;\n /\n Optional callback that runs if menu bar action onclick throws.\n /\n onActionHandlerFailed?: (errMsg: string) => void;\n /\n Optional flag to enable self resizing of the attachment card.\n /\n selfResizing?: boolean;\n}\n\n/\n @internal\n * A component for displaying an attachment card with attachment icon and progress bar.\n \n `_AttachmentCard` internally uses the `Card` component from `@fluentui/react-components`. You can checkout the details about these components [here](https://react.fluentui.dev/?path=/docs/components-card).\n */\nexport const _AttachmentCard = (props: _AttachmentCardProps): JSX.Element => {\n const { attachment, menuActions, onActionHandlerFailed, selfResizing } = props;\n const attachmentCardStyles = useAttachmentCardStyles();\n\n const progress = useMemo(() => {\n return 'progress' in attachment ? attachment.progress : undefined;\n }, [attachment]);\n\n const isUploadInProgress = useMemo(() => {\n return progress !== undefined && progress >= 0 && progress < 1;\n }, [progress]);\n\n const [announcerString, setAnnouncerString] = useState<string \| undefined>(undefined);\n const localeStrings = useLocaleAttachmentCardStringsTrampoline();\n const uploadStartedString = props.strings?.uploading ?? localeStrings.uploading;\n const uploadCompletedString = props.strings?.uploadCompleted ?? localeStrings.uploadCompleted;\n\n useEffect(() => {\n if (isUploadInProgress) {\n setAnnouncerString(`${uploadStartedString} ${attachment.name}`);\n } else if (progress === 1) {\n setAnnouncerString(`${attachment.name} ${uploadCompletedString}`);\n } else {\n setAnnouncerString(undefined);\n }\n }, [progress, isUploadInProgress, attachment.name, uploadStartedString, uploadCompletedString]);\n\n const extension = useMemo((): string => {\n const re = /(?:\\.([^.]+))?$/;\n const match = re.exec(attachment.name);\n return match && match[1] ? match[1] : '';\n }, [attachment]);\n return (\n <div data-is-focusable={true}>\n <Announcer announcementString={announcerString} ariaLive={'polite'} />\n <Card\n className={mergeClasses(\n attachmentCardStyles.root,\n selfResizing ? attachmentCardStyles.dynamicWidth : attachmentCardStyles.staticWidth\n )}\n size=\"small\"\n role=\"listitem\"\n appearance=\"filled-alternative\"\n aria-label={attachment.name}\n data-testid={'attachment-card'}\n >\n <CardHeader\n className={attachmentCardStyles.content}\n image={{\n className: attachmentCardStyles.fileIcon,\n children: (\n <Icon\n data-ui-id={'attachmenttype-icon'}\n iconName={\n getFileTypeIconProps({\n extension: extension,\n size: 24,\n imageFileType: 'svg'\n }).iconName\n }\n />\n )\n }}\n header={{\n id: 'attachment-' + attachment.id,\n children: (\n <TooltipHost\n content={attachment.name}\n calloutProps={{\n gapSpace: 0,\n target: '#attachment-' + attachment.id\n }}\n hostClassName={titleTooltipContainerStyle}\n >\n <Text className={attachmentCardStyles.title} aria-label={attachment.name}>\n {attachment.name}\n </Text>\n </TooltipHost>\n )\n }}\n action={{\n className: attachmentCardStyles.actions,\n children: MappedMenuItems(\n menuActions,\n {\n ...attachment,\n url: attachment.url ?? ''\n },\n onActionHandlerFailed\n )\n }}\n />\n </Card>\n {isUploadInProgress ? (\n <CardFooter>\n <ProgressBar\n thickness=\"medium\"\n value={Math.max(progress ?? 0, ATTACHMENT_CARD_MIN_PROGRESS)}\n shape=\"rounded\"\n />\n </CardFooter>\n ) : (\n <> </>\n )}\n </div>\n );\n};\n\nconst MappedMenuItems = (\n menuActions: AttachmentMenuAction[],\n attachment: AttachmentMetadata,\n handleOnClickError?: (errMsg: string) => void\n): JSX.Element => {\n const localeStrings = useLocaleAttachmentCardStringsTrampoline();\n\n if (menuActions.length === 0) {\n return <></>;\n }\n return menuActions.length === 1 ? (\n <TooltipHost content={menuActions[0].name}>\n <ToolbarButton\n aria-label={menuActions[0].name}\n role=\"button\"\n icon={menuActions[0].icon}\n onClick={() => {\n try {\n menuActions[0].onClick(attachment);\n } catch (e) {\n handleOnClickError?.((e as Error).message);\n }\n }}\n />\n </TooltipHost>\n ) : (\n <Toolbar>\n <Menu>\n <TooltipHost content={localeStrings.attachmentMoreMenu}>\n <MenuTrigger>\n <ToolbarButton\n aria-label={localeStrings.attachmentMoreMenu}\n role=\"button\"\n icon={<Icon iconName=\"AttachmentMoreMenu\" />}\n />\n </MenuTrigger>\n </TooltipHost>\n <MenuPopover>\n <MenuList>\n {menuActions.map((menuItem, index) => (\n <MenuItem\n aria-label={menuItem.name}\n key={index}\n icon={menuItem.icon}\n onClick={async () => {\n try {\n await menuItem.onClick(attachment);\n } catch (e) {\n handleOnClickError?.((e as Error).message);\n }\n }}\n >\n {menuItem.name}\n </MenuItem>\n ))}\n </MenuList>\n </MenuPopover>\n </Menu>\n </Toolbar>\n );\n};\n"]}

package/dist/dist-esm/react-components/src/components/ChatMessage/ChatMessageComponentWrapper.d.ts CHANGED Viewed

@@ -1,11 +1,11 @@
 /// <reference types="react" />
 import { MessageStatus } from "../../../../acs-ui-common/src";
 import { MessageProps, MessageRenderer, MessageThreadStyles, _ChatMessageProps } from '../MessageThread';
-import { RichTextEditorOptions } from '../MessageThread';
 import { ChatMessage, OnRenderAvatarCallback } from '../../types';
 import { BlockedMessage } from '../../types';
 import { AttachmentMenuAction } from '../../types/Attachment';
 import { AttachmentMetadata } from "../../../../acs-ui-common/src";
+import { AttachmentMetadataInProgress } from "../../../../acs-ui-common/src";
 import { MentionOptions } from '../MentionPopover';
 import { MessageStatusIndicatorProps } from '../MessageStatusIndicator';
 import { InlineImageOptions } from './ChatMessageContent';
@@ -40,7 +40,13 @@ export type ChatMessageComponentWrapperProps = _ChatMessageProps & {
      * Optional callback to define custom actions for attachments.
      */
     actionsForAttachment?: (attachment: AttachmentMetadata, message?: ChatMessage) => AttachmentMenuAction[];
-    richTextEditorOptions?: RichTextEditorOptions;
+    isRichTextEditorEnabled?: boolean;
+    onPaste?: (event: {
+        content: DocumentFragment;
+    }) => void;
+    onCancelInlineImageUpload?: (imageId: string, messageId: string) => void;
+    onUploadInlineImage?: (imageUrl: string, imageFileName: string, messageId: string) => void;
+    imageUploadsInProgress?: AttachmentMetadataInProgress[];
 };
 /**
  * The wrapper component to display different types of chat message.

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ChatMessageComponentWrapper.js","sourceRoot":"","sources":["../../../../../../../react-components/src/components/ChatMessage/ChatMessageComponentWrapper.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAGlC,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAevC,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAE9D,OAAO,EAAE,4BAA4B,EAAE,MAAM,oDAAoD,CAAC;AAClG,OAAO,EAAE,0BAA0B,EAAE,MAAM,gDAAgD,CAAC;~~AAmD5F~~;;;;GAIG;AACH,MAAM,CAAC,MAAM,2BAA2B,GAAG,CAAC,KAAuC,EAAe,EAAE;;IAClG,MAAM,EAAE,OAAO,EAAE,MAAM,EAAE,eAAe,EAAE,GAAG,EAAE,UAAU,EAAE,GAAG,KAAK,CAAC;IAEpE,MAAM,kBAAkB,GAAG,OAAO,CAAC,GAAG,EAAE;QACtC,OAAO;YACL,UAAU,EAAE,QAAQ;SACrB,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,kBAAkB,GAAG,OAAO,CAAC,GAAG,EAAE;QACtC,OAAO,EAAE,UAAU,EAAE,MAAM,EAAE,aAAa,EAAE,SAAS,EAAE,CAAC;IAC1D,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,uDAAuD;IACvD,kIAAkI;IAClI,IAAI,OAAO,CAAC,WAAW,KAAK,SAAS,EAAE,CAAC;QACtC,MAAM,kBAAkB,GACtB,OAAO,CAAC,MAAM,KAAK,QAAQ;YACzB,CAAC,CAAC,MAAA,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,4BAA4B,mCAAI,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,sBAAsB;YACxE,CAAC,CAAC,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,sBAAsB,CAAC;QACrC,MAAM,mBAAmB,GAAG,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,uBAAuB,CAAC;QAC5D,MAAM,qBAAqB,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,mBAAmB,CAAC;QACtF,OAAO,mBAAmB,iCAAM,KAAK,KAAE,OAAO,EAAE,OAAO,EAAE,qBAAqB,EAAE,qBAAqB,IAAG,CAAC;IAC3G,CAAC;IAED,QAAQ,OAAO,CAAC,WAAW,EAAE,CAAC;QAC5B,KAAK,MAAM,CAAC,CAAC,CAAC;YACZ,MAAM,kBAAkB,GACtB,OAAO,CAAC,MAAM,KAAK,QAAQ;gBACzB,CAAC,CAAC,MAAA,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,4BAA4B,mCAAI,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,sBAAsB;gBACxE,CAAC,CAAC,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,sBAAsB,CAAC;YACrC,MAAM,gBAAgB,GAAG,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,oBAAoB,CAAC;YACtD,MAAM,qBAAqB,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,gBAAgB,CAAC;YACnF,OAAO,mBAAmB,iCAAM,KAAK,KAAE,OAAO,EAAE,OAAO,EAAE,qBAAqB,EAAE,qBAAqB,IAAG,CAAC;QAC3G,CAAC;QAED,KAAK,QAAQ,CAAC,CAAC,CAAC;YACd,MAAM,qBAAqB,GAAG,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,sBAAsB,CAAC;YAC7D,MAAM,sBAAsB,GAC1B,eAAe,KAAK,SAAS,CAAC,CAAC,CAAC,CAC9B,oBAAC,oBAAoB,oBAAK,KAAK,EAAI,CACpC,CAAC,CAAC,CAAC,CACF,eAAe,iCAAM,KAAK,KAAE,qBAAqB,KAAI,CAAC,KAAK,EAAE,EAAE,CAAC,oBAAC,oBAAoB,oBAAK,KAAK,EAAI,CAAC,CACrG,CAAC;YACJ,OAAO,CACL,6BAAK,GAAG,EAAE,UAAU,EAAE,KAAK,EAAE,kBAAkB,IAC5C,sBAAsB,CACnB,CACP,CAAC;QACJ,CAAC;QAED,OAAO,CAAC,CAAC,CAAC;YACR,mHAAmH;YACnH,MAAM,sBAAsB,GAAG,eAAe,KAAK,SAAS,CAAC,CAAC,CAAC,yCAAK,CAAC,CAAC,CAAC,eAAe,mBAAM,KAAK,EAAG,CAAC;YACrG,OAAO,CACL,6BAAK,GAAG,EAAE,UAAU,EAAE,KAAK,EAAE,kBAAkB,IAC5C,sBAAsB,CACnB,CACP,CAAC;QACJ,CAAC;IACH,CAAC;AACH,CAAC,CAAC;AAEF,MAAM,mBAAmB,GAAG,CAAC,KAA6C,EAAe,EAAE;IACzF,IAAI,KAAK,CAAC,OAAO,CAAC,IAAI,KAAK,IAAI,EAAE,CAAC;QAChC,OAAO,oBAAC,4BAA4B,oBAAK,KAAK,EAAI,CAAC;IACrD,CAAC;SAAM,CAAC;QACN,OAAO,oBAAC,0BAA0B,oBAAK,KAAK,EAAI,CAAC;IACnD,CAAC;AACH,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { MessageStatus } from '@internal/acs-ui-common';\nimport React, { useMemo } from 'react';\nimport { MessageProps, MessageRenderer, MessageThreadStyles, _ChatMessageProps } from '../MessageThread';\~~n/* @conditional-compile-remove(rich-text-editor) /\~~nimport { ~~RichTextEditorOptions } from '../MessageThread';\nimport {~~ ChatMessage, OnRenderAvatarCallback } from '../../types';\n/ @conditional-compile-remove(data-loss-prevention) /\nimport { BlockedMessage } from '../../types';\n/ @conditional-compile-remove(file-sharing-teams-interop) @conditional-compile-remove(file-sharing-acs) /\nimport { AttachmentMenuAction } from '../../types/Attachment';\n/ @conditional-compile-remove(file-sharing-teams-interop) @conditional-compile-remove(file-sharing-acs) /\nimport { AttachmentMetadata } from '@internal/acs-ui-common';\n/ @conditional-compile-remove(mention) /\nimport { MentionOptions } from '../MentionPopover';\nimport { MessageStatusIndicatorProps } from '../MessageStatusIndicator';\nimport { FluentChatMessageComponentWrapperProps } from './MessageComponents/FluentChatMessageComponent';\nimport { DefaultSystemMessage } from './DefaultSystemMessage';\nimport { InlineImageOptions } from './ChatMessageContent';\nimport { FluentChatMyMessageComponent } from './MyMessageComponents/FluentChatMyMessageComponent';\nimport { FluentChatMessageComponent } from './MessageComponents/FluentChatMessageComponent';\n\n/\n Props for {@link ChatMessageComponentWrapper}\n \n @private\n /\nexport type ChatMessageComponentWrapperProps = _ChatMessageProps & {\n /\n UserId of the current user.\n /\n userId: string;\n styles: MessageThreadStyles \| undefined;\n shouldOverlapAvatarAndMessage: boolean;\n onRenderMessageStatus: ((messageStatusIndicatorProps: MessageStatusIndicatorProps) => JSX.Element \| null) \| 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 onRenderMessage?: (messageProps: MessageProps, messageRenderer?: MessageRenderer) => JSX.Element;\n onRenderAvatar?: OnRenderAvatarCallback;\n showMessageStatus?: boolean;\n participantCount?: number;\n readCount?: number;\n onActionButtonClick: (\n message: ChatMessage,\n setMessageReadBy: (\n readBy: {\n id: string;\n displayName: string;\n }[]\n ) => void\n ) => void;\n / @conditional-compile-remove(date-time-customization) /\n onDisplayDateTimeString?: (messageDate: Date) => string;\n inlineImageOptions?: InlineImageOptions;\n / @conditional-compile-remove(mention) /\n mentionOptions?: MentionOptions;\n / @conditional-compile-remove(file-sharing-teams-interop) @conditional-compile-remove(file-sharing-acs) /\n onRenderAttachmentDownloads?: (message: ChatMessage) => JSX.Element;\n / @conditional-compile-remove(file-sharing-teams-interop) @conditional-compile-remove(file-sharing-acs) /\n /\n Optional callback to define custom actions for attachments.\n /\n actionsForAttachment?: (attachment: AttachmentMetadata, message?: ChatMessage) => AttachmentMenuAction[];\n / @conditional-compile-remove(rich-text-editor) /\n ~~richTextEditorOptions~~?: ~~RichTextEditorOptions~~;\n};\n\n/\n The wrapper component to display different types of chat message.\n \n @private\n /\nexport const ChatMessageComponentWrapper = (props: ChatMessageComponentWrapperProps): JSX.Element => {\n const { message, styles, onRenderMessage, key: messageKey } = props;\n\n const systemMessageStyle = useMemo(() => {\n return {\n paddingTop: '0.5rem'\n };\n }, []);\n\n const customMessageStyle = useMemo(() => {\n return { paddingTop: '1rem', paddingBottom: '0.25rem' };\n }, []);\n\n / @conditional-compile-remove(data-loss-prevention) */\n // Similar logic as switch statement case 'chat', if statement for conditional compile (merge logic to switch case when stabilize)\n if (message.messageType === 'blocked') {\n const myChatMessageStyle =\n message.status === 'failed'\n ? styles?.failedMyChatMessageContainer ?? styles?.myChatMessageContainer\n : styles?.myChatMessageContainer;\n const blockedMessageStyle = styles?.blockedMessageContainer;\n const messageContainerStyle = message.mine ? myChatMessageStyle : blockedMessageStyle;\n return fluentChatComponent({ ...props, message: message, messageContainerStyle: messageContainerStyle });\n }\n\n switch (message.messageType) {\n case 'chat': {\n const myChatMessageStyle =\n message.status === 'failed'\n ? styles?.failedMyChatMessageContainer ?? styles?.myChatMessageContainer\n : styles?.myChatMessageContainer;\n const chatMessageStyle = styles?.chatMessageContainer;\n const messageContainerStyle = message.mine ? myChatMessageStyle : chatMessageStyle;\n return fluentChatComponent({ ...props, message: message, messageContainerStyle: messageContainerStyle });\n }\n\n case 'system': {\n const messageContainerStyle = styles?.systemMessageContainer;\n const systemMessageComponent =\n onRenderMessage === undefined ? (\n <DefaultSystemMessage {...props} />\n ) : (\n onRenderMessage({ ...props, messageContainerStyle }, (props) => <DefaultSystemMessage {...props} />)\n );\n return (\n <div key={messageKey} style={systemMessageStyle}>\n {systemMessageComponent}\n </div>\n );\n }\n\n default: {\n // We do not handle custom type message by default, users can handle custom type by using onRenderMessage function.\n const customMessageComponent = onRenderMessage === undefined ? <></> : onRenderMessage({ ...props });\n return (\n <div key={messageKey} style={customMessageStyle}>\n {customMessageComponent}\n </div>\n );\n }\n }\n};\n\nconst fluentChatComponent = (props: FluentChatMessageComponentWrapperProps): JSX.Element => {\n if (props.message.mine === true) {\n return <FluentChatMyMessageComponent {...props} />;\n } else {\n return <FluentChatMessageComponent {...props} />;\n }\n};\n"]}
1	+ {"version":3,"file":"ChatMessageComponentWrapper.js","sourceRoot":"","sources":["../../../../../../../react-components/src/components/ChatMessage/ChatMessageComponentWrapper.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { MessageStatus } from '@internal/acs-ui-common';\nimport React, { useMemo } from 'react';\nimport { MessageProps, MessageRenderer, MessageThreadStyles, _ChatMessageProps } from '../MessageThread';\nimport { ChatMessage, OnRenderAvatarCallback } from '../../types';\n/* @conditional-compile-remove(data-loss-prevention) /\nimport { BlockedMessage } from '../../types';\n/ @conditional-compile-remove(file-sharing-teams-interop) @conditional-compile-remove(file-sharing-acs) /\nimport { AttachmentMenuAction } from '../../types/Attachment';\n/ @conditional-compile-remove(file-sharing-teams-interop) @conditional-compile-remove(file-sharing-acs) /\nimport { AttachmentMetadata } from '@internal/acs-ui-common';\n/ @conditional-compile-remove(rich-text-editor-image-upload) /\nimport { AttachmentMetadataInProgress } from '@internal/acs-ui-common';\n/ @conditional-compile-remove(mention) /\nimport { MentionOptions } from '../MentionPopover';\nimport { MessageStatusIndicatorProps } from '../MessageStatusIndicator';\nimport { FluentChatMessageComponentWrapperProps } from './MessageComponents/FluentChatMessageComponent';\nimport { DefaultSystemMessage } from './DefaultSystemMessage';\nimport { InlineImageOptions } from './ChatMessageContent';\nimport { FluentChatMyMessageComponent } from './MyMessageComponents/FluentChatMyMessageComponent';\nimport { FluentChatMessageComponent } from './MessageComponents/FluentChatMessageComponent';\n\n/\n Props for {@link ChatMessageComponentWrapper}\n \n @private\n /\nexport type ChatMessageComponentWrapperProps = _ChatMessageProps & {\n /\n UserId of the current user.\n /\n userId: string;\n styles: MessageThreadStyles \| undefined;\n shouldOverlapAvatarAndMessage: boolean;\n onRenderMessageStatus: ((messageStatusIndicatorProps: MessageStatusIndicatorProps) => JSX.Element \| null) \| 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 onRenderMessage?: (messageProps: MessageProps, messageRenderer?: MessageRenderer) => JSX.Element;\n onRenderAvatar?: OnRenderAvatarCallback;\n showMessageStatus?: boolean;\n participantCount?: number;\n readCount?: number;\n onActionButtonClick: (\n message: ChatMessage,\n setMessageReadBy: (\n readBy: {\n id: string;\n displayName: string;\n }[]\n ) => void\n ) => void;\n / @conditional-compile-remove(date-time-customization) /\n onDisplayDateTimeString?: (messageDate: Date) => string;\n inlineImageOptions?: InlineImageOptions;\n / @conditional-compile-remove(mention) /\n mentionOptions?: MentionOptions;\n / @conditional-compile-remove(file-sharing-teams-interop) @conditional-compile-remove(file-sharing-acs) /\n onRenderAttachmentDownloads?: (message: ChatMessage) => JSX.Element;\n / @conditional-compile-remove(file-sharing-teams-interop) @conditional-compile-remove(file-sharing-acs) /\n /\n Optional callback to define custom actions for attachments.\n /\n actionsForAttachment?: (attachment: AttachmentMetadata, message?: ChatMessage) => AttachmentMenuAction[];\n / @conditional-compile-remove(rich-text-editor) /\n isRichTextEditorEnabled?: boolean;\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n onPaste?: (event: { content: DocumentFragment }) => void;\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n onCancelInlineImageUpload?: (imageId: string, messageId: string) => void;\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n onUploadInlineImage?: (imageUrl: string, imageFileName: string, messageId: string) => void;\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n imageUploadsInProgress?: AttachmentMetadataInProgress[];\n};\n\n/\n The wrapper component to display different types of chat message.\n \n @private\n /\nexport const ChatMessageComponentWrapper = (props: ChatMessageComponentWrapperProps): JSX.Element => {\n const { message, styles, onRenderMessage, key: messageKey } = props;\n\n const systemMessageStyle = useMemo(() => {\n return {\n paddingTop: '0.5rem'\n };\n }, []);\n\n const customMessageStyle = useMemo(() => {\n return { paddingTop: '1rem', paddingBottom: '0.25rem' };\n }, []);\n\n / @conditional-compile-remove(data-loss-prevention) */\n // Similar logic as switch statement case 'chat', if statement for conditional compile (merge logic to switch case when stabilize)\n if (message.messageType === 'blocked') {\n const myChatMessageStyle =\n message.status === 'failed'\n ? styles?.failedMyChatMessageContainer ?? styles?.myChatMessageContainer\n : styles?.myChatMessageContainer;\n const blockedMessageStyle = styles?.blockedMessageContainer;\n const messageContainerStyle = message.mine ? myChatMessageStyle : blockedMessageStyle;\n return fluentChatComponent({ ...props, message: message, messageContainerStyle: messageContainerStyle });\n }\n\n switch (message.messageType) {\n case 'chat': {\n const myChatMessageStyle =\n message.status === 'failed'\n ? styles?.failedMyChatMessageContainer ?? styles?.myChatMessageContainer\n : styles?.myChatMessageContainer;\n const chatMessageStyle = styles?.chatMessageContainer;\n const messageContainerStyle = message.mine ? myChatMessageStyle : chatMessageStyle;\n return fluentChatComponent({ ...props, message: message, messageContainerStyle: messageContainerStyle });\n }\n\n case 'system': {\n const messageContainerStyle = styles?.systemMessageContainer;\n const systemMessageComponent =\n onRenderMessage === undefined ? (\n <DefaultSystemMessage {...props} />\n ) : (\n onRenderMessage({ ...props, messageContainerStyle }, (props) => <DefaultSystemMessage {...props} />)\n );\n return (\n <div key={messageKey} style={systemMessageStyle}>\n {systemMessageComponent}\n </div>\n );\n }\n\n default: {\n // We do not handle custom type message by default, users can handle custom type by using onRenderMessage function.\n const customMessageComponent = onRenderMessage === undefined ? <></> : onRenderMessage({ ...props });\n return (\n <div key={messageKey} style={customMessageStyle}>\n {customMessageComponent}\n </div>\n );\n }\n }\n};\n\nconst fluentChatComponent = (props: FluentChatMessageComponentWrapperProps): JSX.Element => {\n if (props.message.mine === true) {\n return <FluentChatMyMessageComponent {...props} />;\n } else {\n return <FluentChatMessageComponent {...props} />;\n }\n};\n"]}

package/dist/dist-esm/react-components/src/components/ChatMessage/MyMessageComponents/ChatMessageComponentAsEditBoxPicker.d.ts CHANGED Viewed

@@ -3,7 +3,6 @@ import { ChatMessage } from '../../../types';
 import { AttachmentMetadata } from "../../../../../acs-ui-common/src";
 import { AttachmentMetadataInProgress } from "../../../../../acs-ui-common/src";
 import { MessageThreadStrings } from '../../MessageThread';
-import { RichTextEditorOptions } from '../../MessageThread';
 import { MentionLookupOptions } from '../../MentionPopover';
 import type { ChatMessageComponentAsRichTextEditBoxProps } from './ChatMessageComponentAsRichTextEditBox';
 /**
@@ -25,9 +24,12 @@ export type ChatMessageComponentAsEditBoxPickerProps = {
     message: ChatMessage;
     strings: MessageThreadStrings;
     mentionLookupOptions?: MentionLookupOptions;
-    richTextEditorOptions?: RichTextEditorOptions;
-    onCancelInlineImageUpload?: (imageId: string) => void;
-    onUploadInlineImage?: (imageUrl: string, imageFileName: string) => void;
+    isRichTextEditorEnabled?: boolean;
+    onPaste?: (event: {
+        content: DocumentFragment;
+    }) => void;
+    onCancelInlineImageUpload?: (imageId: string, messageId: string) => void;
+    onUploadInlineImage?: (imageUrl: string, imageFileName: string, messageId: string) => void;
     imageUploadsInProgress?: AttachmentMetadataInProgress[];
 };
 /**

package/dist/dist-esm/react-components/src/components/ChatMessage/MyMessageComponents/ChatMessageComponentAsEditBoxPicker.js CHANGED Viewed

@@ -20,24 +20,14 @@ export const loadChatMessageComponentAsRichTextEditBox = () => import('./ChatMes
  * @private
  */
 export const ChatMessageComponentAsEditBoxPicker = (props) => {
-    /* @conditional-compile-remove(rich-text-editor) */
-    const { richTextEditorOptions } = props;
     const simpleEditBox = useMemo(() => {
         return React.createElement(ChatMessageComponentAsEditBox, Object.assign({}, props));
     }, [props]);
     /* @conditional-compile-remove(rich-text-editor) */
-    if (richTextEditorOptions) {
+    if (props.isRichTextEditorEnabled) {
         return (React.createElement(_ErrorBoundary, { fallback: simpleEditBox },
             React.createElement(Suspense, { fallback: simpleEditBox },
-                React.createElement(ChatMessageComponentAsRichTextEditBox, Object.assign({}, props, {
-                    /* @conditional-compile-remove(rich-text-editor-image-upload) */
-                    onPaste: richTextEditorOptions === null || richTextEditorOptions === void 0 ? void 0 : richTextEditorOptions.onPaste,
-                    /* @conditional-compile-remove(rich-text-editor-image-upload) */
-                    onUploadInlineImage: richTextEditorOptions === null || richTextEditorOptions === void 0 ? void 0 : richTextEditorOptions.onUploadInlineImage,
-                    /* @conditional-compile-remove(rich-text-editor-image-upload) */
-                    imageUploadsInProgress: richTextEditorOptions === null || richTextEditorOptions === void 0 ? void 0 : richTextEditorOptions.imageUploadsInProgress,
-                    /* @conditional-compile-remove(rich-text-editor-image-upload) */
-                    onCancelInlineImageUpload: richTextEditorOptions === null || richTextEditorOptions === void 0 ? void 0 : richTextEditorOptions.onCancelInlineImageUpload })))));
+                React.createElement(ChatMessageComponentAsRichTextEditBox, Object.assign({}, props)))));
     }
     return simpleEditBox;
 };

package/dist/dist-esm/react-components/src/components/ChatMessage/MyMessageComponents/ChatMessageComponentAsEditBoxPicker.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ChatMessageComponentAsEditBoxPicker.js","sourceRoot":"","sources":["../../../../../../../../react-components/src/components/ChatMessage/MyMessageComponents/ChatMessageComponentAsEditBoxPicker.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AACvC,mDAAmD;AACnD,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;~~AASjC~~,OAAO,EAAE,6BAA6B,EAAE,MAAM,iCAAiC,CAAC;AAKhF,mDAAmD;AACnD,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AAErD,mDAAmD;AACnD,MAAM,qCAAqC,GAAG,KAAK,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,MAAM,CAAC,yCAAyC,CAAC,CAAC,CAAC;AAElH;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,yCAAyC,GAAG,GAEtD,EAAE,CAAC,MAAM,CAAC,yCAAyC,CAAC,CAAC;~~AA0BxD~~;;GAEG;AACH,MAAM,CAAC,MAAM,mCAAmC,GAAG,CAAC,KAA+C,EAAe,EAAE;IAClH,~~mDAAmD;IACnD,~~MAAM,~~EAAE,qBAAqB,EAAE,GAAG,KAAK,CAAC;IAExC,MAAM,~~aAAa,GAAG,OAAO,CAAC,GAAG,EAAE;QACjC,OAAO,oBAAC,6BAA6B,oBAAK,KAAK,EAAI,CAAC;IACtD,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEZ,mDAAmD;IACnD,IAAI,~~qBAAqB~~,EAAE,CAAC;~~QAC1B~~,OAAO,CACL,oBAAC,cAAc,IAAC,QAAQ,EAAE,aAAa;YACrC,oBAAC,QAAQ,IAAC,QAAQ,EAAE,aAAa;gBAC/B,oBAAC,qCAAqC,~~oBAChC~~,KAAK~~;oBACT~~,~~gEAAgE;oBAChE~~,~~OAAO~~,EAAE,qBAAqB,aAArB,qBAAqB,uBAArB,qBAAqB,CAAE,OAAO;oBACvC,gEAAgE;oBAChE,mBAAmB,EAAE,qBAAqB,aAArB,qBAAqB,uBAArB,qBAAqB,CAAE,mBAAmB;oBAC/D,gEAAgE;oBAChE,sBAAsB,EAAE,qBAAqB,aAArB,qBAAqB,uBAArB,qBAAqB,CAAE,sBAAsB;oBACrE,gEAAgE;oBAChE,yBAAyB,EAAE,qBAAqB,aAArB,qBAAqB,uBAArB,qBAAqB,CAAE,yBAAyB,IAC3E,CACO,CACI,CAClB,CAAC;IACJ,CAAC;IAED,OAAO,aAAa,CAAC;AACvB,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React, { useMemo } from 'react';\n/* @conditional-compile-remove(rich-text-editor) /\nimport { Suspense } from 'react';\nimport { ChatMessage } from '../../../types';\n/ @conditional-compile-remove(file-sharing-teams-interop) @conditional-compile-remove(file-sharing-acs) /\nimport { AttachmentMetadata } from '@internal/acs-ui-common';\n/ @conditional-compile-remove(rich-text-editor-image-upload) /\nimport { AttachmentMetadataInProgress } from '@internal/acs-ui-common';\nimport { MessageThreadStrings } from '../../MessageThread';\~~n/ @conditional-compile-remove(rich-text-editor) /\~~nimport { ~~RichTextEditorOptions } from '../../MessageThread';\nimport {~~ ChatMessageComponentAsEditBox } from './ChatMessageComponentAsEditBox';\n/ @conditional-compile-remove(mention) /\nimport { MentionLookupOptions } from '../../MentionPopover';\n/ @conditional-compile-remove(rich-text-editor) /\nimport type { ChatMessageComponentAsRichTextEditBoxProps } from './ChatMessageComponentAsRichTextEditBox';\n/ @conditional-compile-remove(rich-text-editor) /\nimport { _ErrorBoundary } from '../../ErrorBoundary';\n\n/ @conditional-compile-remove(rich-text-editor) /\nconst ChatMessageComponentAsRichTextEditBox = React.lazy(() => import('./ChatMessageComponentAsRichTextEditBox'));\n\n/\n @private\n * Use this function to load RoosterJS dependencies early in the lifecycle.\n * It should be the same import as used for lazy loading.\n \n @conditional-compile-remove(rich-text-editor)\n /\nexport const loadChatMessageComponentAsRichTextEditBox = (): Promise<{\n default: React.ComponentType<ChatMessageComponentAsRichTextEditBoxProps>;\n}> => import('./ChatMessageComponentAsRichTextEditBox');\n\n/\n @private\n /\nexport type ChatMessageComponentAsEditBoxPickerProps = {\n onCancel?: (messageId: string) => void;\n onSubmit: (\n text: string,\n / @conditional-compile-remove(file-sharing-teams-interop) @conditional-compile-remove(file-sharing-acs) /\n attachmentMetadata?: AttachmentMetadata[]\n ) => void;\n message: ChatMessage;\n strings: MessageThreadStrings;\n / @conditional-compile-remove(mention) /\n mentionLookupOptions?: MentionLookupOptions;\n / @conditional-compile-remove(rich-text-editor) /\n ~~richTextEditorOptions~~?: ~~RichTextEditorOptions~~;\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n onCancelInlineImageUpload?: (imageId: string) => void;\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n onUploadInlineImage?: (imageUrl: string, imageFileName: string) => void;\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n imageUploadsInProgress?: AttachmentMetadataInProgress[];\n};\n\n/\n @private\n /\nexport const ChatMessageComponentAsEditBoxPicker = (props: ChatMessageComponentAsEditBoxPickerProps): JSX.Element => {\n ~~/ @conditional-compile-remove(rich-text-editor) /\n~~ const ~~{ richTextEditorOptions } = props;\n\n const~~ simpleEditBox = useMemo(() => {\n return <ChatMessageComponentAsEditBox {...props} />;\n }, [props]);\n\n / @conditional-compile-remove(rich-text-editor) /\n if (~~richTextEditorOptions~~) {\n return (\n <_ErrorBoundary fallback={simpleEditBox}>\n <Suspense fallback={simpleEditBox}>\n <ChatMessageComponentAsRichTextEditBox\n {...props}\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n onPaste={richTextEditorOptions?.onPaste}\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n onUploadInlineImage={richTextEditorOptions?.onUploadInlineImage}\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n imageUploadsInProgress={richTextEditorOptions?.imageUploadsInProgress}\n / @conditional-compile-remove(rich-text-editor-image-upload) */\n onCancelInlineImageUpload={richTextEditorOptions?.onCancelInlineImageUpload}\n />\n </Suspense>\n </_ErrorBoundary>\n );\n }\n\n return simpleEditBox;\n};\n"]}
1	+ {"version":3,"file":"ChatMessageComponentAsEditBoxPicker.js","sourceRoot":"","sources":["../../../../../../../../react-components/src/components/ChatMessage/MyMessageComponents/ChatMessageComponentAsEditBoxPicker.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AACvC,mDAAmD;AACnD,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAOjC,OAAO,EAAE,6BAA6B,EAAE,MAAM,iCAAiC,CAAC;AAKhF,mDAAmD;AACnD,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AAErD,mDAAmD;AACnD,MAAM,qCAAqC,GAAG,KAAK,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,MAAM,CAAC,yCAAyC,CAAC,CAAC,CAAC;AAElH;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,yCAAyC,GAAG,GAEtD,EAAE,CAAC,MAAM,CAAC,yCAAyC,CAAC,CAAC;AA4BxD;;GAEG;AACH,MAAM,CAAC,MAAM,mCAAmC,GAAG,CAAC,KAA+C,EAAe,EAAE;IAClH,MAAM,aAAa,GAAG,OAAO,CAAC,GAAG,EAAE;QACjC,OAAO,oBAAC,6BAA6B,oBAAK,KAAK,EAAI,CAAC;IACtD,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEZ,mDAAmD;IACnD,IAAI,KAAK,CAAC,uBAAuB,EAAE,CAAC;QAClC,OAAO,CACL,oBAAC,cAAc,IAAC,QAAQ,EAAE,aAAa;YACrC,oBAAC,QAAQ,IAAC,QAAQ,EAAE,aAAa;gBAC/B,oBAAC,qCAAqC,oBAAK,KAAK,EAAI,CAC3C,CACI,CAClB,CAAC;IACJ,CAAC;IAED,OAAO,aAAa,CAAC;AACvB,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React, { useMemo } from 'react';\n/* @conditional-compile-remove(rich-text-editor) /\nimport { Suspense } from 'react';\nimport { ChatMessage } from '../../../types';\n/ @conditional-compile-remove(file-sharing-teams-interop) @conditional-compile-remove(file-sharing-acs) /\nimport { AttachmentMetadata } from '@internal/acs-ui-common';\n/ @conditional-compile-remove(rich-text-editor-image-upload) /\nimport { AttachmentMetadataInProgress } from '@internal/acs-ui-common';\nimport { MessageThreadStrings } from '../../MessageThread';\nimport { ChatMessageComponentAsEditBox } from './ChatMessageComponentAsEditBox';\n/ @conditional-compile-remove(mention) /\nimport { MentionLookupOptions } from '../../MentionPopover';\n/ @conditional-compile-remove(rich-text-editor) /\nimport type { ChatMessageComponentAsRichTextEditBoxProps } from './ChatMessageComponentAsRichTextEditBox';\n/ @conditional-compile-remove(rich-text-editor) /\nimport { _ErrorBoundary } from '../../ErrorBoundary';\n\n/ @conditional-compile-remove(rich-text-editor) /\nconst ChatMessageComponentAsRichTextEditBox = React.lazy(() => import('./ChatMessageComponentAsRichTextEditBox'));\n\n/\n @private\n * Use this function to load RoosterJS dependencies early in the lifecycle.\n * It should be the same import as used for lazy loading.\n \n @conditional-compile-remove(rich-text-editor)\n /\nexport const loadChatMessageComponentAsRichTextEditBox = (): Promise<{\n default: React.ComponentType<ChatMessageComponentAsRichTextEditBoxProps>;\n}> => import('./ChatMessageComponentAsRichTextEditBox');\n\n/\n @private\n /\nexport type ChatMessageComponentAsEditBoxPickerProps = {\n onCancel?: (messageId: string) => void;\n onSubmit: (\n text: string,\n / @conditional-compile-remove(file-sharing-teams-interop) @conditional-compile-remove(file-sharing-acs) /\n attachmentMetadata?: AttachmentMetadata[]\n ) => void;\n message: ChatMessage;\n strings: MessageThreadStrings;\n / @conditional-compile-remove(mention) /\n mentionLookupOptions?: MentionLookupOptions;\n / @conditional-compile-remove(rich-text-editor) /\n isRichTextEditorEnabled?: boolean;\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n onPaste?: (event: { content: DocumentFragment }) => void;\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n onCancelInlineImageUpload?: (imageId: string, messageId: string) => void;\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n onUploadInlineImage?: (imageUrl: string, imageFileName: string, messageId: string) => void;\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n imageUploadsInProgress?: AttachmentMetadataInProgress[];\n};\n\n/\n @private\n /\nexport const ChatMessageComponentAsEditBoxPicker = (props: ChatMessageComponentAsEditBoxPickerProps): JSX.Element => {\n const simpleEditBox = useMemo(() => {\n return <ChatMessageComponentAsEditBox {...props} />;\n }, [props]);\n\n / @conditional-compile-remove(rich-text-editor) */\n if (props.isRichTextEditorEnabled) {\n return (\n <_ErrorBoundary fallback={simpleEditBox}>\n <Suspense fallback={simpleEditBox}>\n <ChatMessageComponentAsRichTextEditBox {...props} />\n </Suspense>\n </_ErrorBoundary>\n );\n }\n\n return simpleEditBox;\n};\n"]}

package/dist/dist-esm/react-components/src/components/ChatMessage/MyMessageComponents/ChatMessageComponentAsRichTextEditBox.d.ts CHANGED Viewed

@@ -12,8 +12,8 @@ export type ChatMessageComponentAsRichTextEditBoxProps = {
     onPaste?: (event: {
         content: DocumentFragment;
     }) => void;
-    onCancelInlineImageUpload?: (imageId: string) => void;
-    onUploadInlineImage?: (imageUrl: string, imageFileName: string) => void;
+    onCancelInlineImageUpload?: (imageId: string, messageId: string) => void;
+    onUploadInlineImage?: (imageUrl: string, imageFileName: string, messageId: string) => void;
     imageUploadsInProgress?: AttachmentMetadataInProgress[];
 };
 /**

package/dist/dist-esm/react-components/src/components/ChatMessage/MyMessageComponents/ChatMessageComponentAsRichTextEditBox.js CHANGED Viewed

@@ -77,6 +77,11 @@ export const ChatMessageComponentAsRichTextEditBox = (props) => {
     const messageState = useMemo(() => {
         return getMessageState(textValue, /* @conditional-compile-remove(file-sharing-acs) */ attachmentMetadata !== null && attachmentMetadata !== void 0 ? attachmentMetadata : []);
     }, [/* @conditional-compile-remove(file-sharing-acs) */ attachmentMetadata, textValue]);
+    /* @conditional-compile-remove(rich-text-editor-image-upload) */
+    const imageUploadErrorMessage = useMemo(() => {
+        var _a, _b;
+        return (_b = (_a = imageUploadsInProgress === null || imageUploadsInProgress === void 0 ? void 0 : imageUploadsInProgress.filter((image) => image.error).pop()) === null || _a === void 0 ? void 0 : _a.error) === null || _b === void 0 ? void 0 : _b.message;
+    }, [imageUploadsInProgress]);
     const submitEnabled = messageState === 'OK';
     const editContainerStyles = useChatMessageRichTextEditContainerStyles();
     const chatMyMessageStyles = useChatMyMessageStyles();
@@ -188,24 +193,40 @@ export const ChatMessageComponentAsRichTextEditBox = (props) => {
     const onChangeHandler = useCallback((content,
     /* @conditional-compile-remove(rich-text-editor-image-upload) */ imageSrcArray) => {
         /* @conditional-compile-remove(rich-text-editor-image-upload) */
-        cancelInlineImageUpload(imageSrcArray, imageUploadsInProgress, onCancelInlineImageUpload);
+        cancelInlineImageUpload({
+            imageSrcArray,
+            imageUploadsInProgress,
+            messageId: message.messageId,
+            editBoxOnCancelInlineImageUpload: onCancelInlineImageUpload,
+            sendBoxOnCancelInlineImageUpload: undefined
+        });
         setText(content);
     }, [
         setText,
         /* @conditional-compile-remove(rich-text-editor-image-upload) */ imageUploadsInProgress,
-        /* @conditional-compile-remove(rich-text-editor-image-upload) */ onCancelInlineImageUpload
+        /* @conditional-compile-remove(rich-text-editor-image-upload) */ onCancelInlineImageUpload,
+        /* @conditional-compile-remove(rich-text-editor-image-upload) */ message.messageId
     ]);
     const getContent = () => {
         return (React.createElement(Stack, { className: mergeStyles(editBoxWidthStyles) },
             React.createElement(RichTextSendBoxErrors, { textTooLongMessage: textTooLongMessage, systemMessage: message.failureReason,
-                /* @conditional-compile-remove(rich-text-editor-image-upload) */ attachmentUploadsPendingError: attachmentUploadsPendingError }),
+                /* @conditional-compile-remove(rich-text-editor-image-upload) */ attachmentUploadsPendingError: attachmentUploadsPendingError,
+                /* @conditional-compile-remove(rich-text-editor-image-upload) */
+                attachmentProgressError: imageUploadErrorMessage
+                    ? {
+                        message: imageUploadErrorMessage,
+                        timestamp: Date.now()
+                    }
+                    : undefined }),
             React.createElement(RichTextInputBoxComponent, { placeholderText: strings.editBoxPlaceholderText, onChange: onChangeHandler, editorComponentRef: editTextFieldRef, initialContent: initialContent, strings: richTextLocaleStrings, disabled: false, actionComponents: actionButtons, richTextEditorStyleProps: editBoxRichTextEditorStyle, isHorizontalLayoutDisabled: true,
                 /* @conditional-compile-remove(file-sharing-acs) */
                 onRenderAttachmentUploads: onRenderAttachmentUploads,
                 /* @conditional-compile-remove(rich-text-editor-image-upload) */
                 onPaste: onPaste,
                 /* @conditional-compile-remove(rich-text-editor-image-upload) */
-                onUploadInlineImage: onUploadInlineImage })));
+                onUploadInlineImage: (imageUrl, imageFileName) => {
+                    onUploadInlineImage && onUploadInlineImage(imageUrl, imageFileName, message.messageId);
+                } })));
     };
     const attached = message.attached === true ? 'center' : message.attached === 'bottom' ? 'bottom' : 'top';
     return (React.createElement(ChatMyMessage, { attached: attached, root: {

package/dist/dist-esm/react-components/src/components/ChatMessage/MyMessageComponents/ChatMessageComponentAsRichTextEditBox.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ChatMessageComponentAsRichTextEditBox.js","sourceRoot":"","sources":["../../../../../../../../react-components/src/components/ChatMessage/MyMessageComponents/ChatMessageComponentAsRichTextEditBox.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { mergeStyles, Stack } from '@fluentui/react';\nimport { ChatMyMessage } from '@fluentui-contrib/react-chat';\nimport { mergeClasses } from '@fluentui/react-components';\nimport { _formatString } from '@internal/acs-ui-common';\n/* @conditional-compile-remove(rich-text-editor-image-upload) /\nimport { AttachmentMetadataInProgress } from '@internal/acs-ui-common';\nimport { useTheme } from '../../../theming';\nimport React, { useCallback, useEffect, useMemo, useState } from 'react';\n/ @conditional-compile-remove(file-sharing-acs) /\nimport { useReducer } from 'react';\nimport { editBoxWidthStyles, richTextEditBoxActionButtonIcon } from '../../styles/EditBox.styles';\nimport { InputBoxButton } from '../../InputBoxButton';\nimport { MessageThreadStrings } from '../../MessageThread';\nimport { useChatMyMessageStyles } from '../../styles/MessageThread.styles';\nimport { ChatMessage } from '../../../types';\nimport { _AttachmentUploadCards } from '../../Attachment/AttachmentUploadCards';\n/ @conditional-compile-remove(file-sharing-acs) /\nimport { AttachmentMetadata } from '@internal/acs-ui-common';\nimport { useChatMessageRichTextEditContainerStyles } from '../../styles/ChatMessageComponent.styles';\nimport { MAXIMUM_LENGTH_OF_MESSAGE } from '../../utils/SendBoxUtils';\n/ @conditional-compile-remove(rich-text-editor-image-upload) /\nimport {\n cancelInlineImageUpload,\n hasIncompleteAttachmentUploads,\n insertImagesToContentString,\n isAttachmentUploadCompleted,\n removeBrokenImageContent\n} from '../../utils/SendBoxUtils';\nimport {\n getMessageState,\n onRenderCancelIcon,\n onRenderSubmitIcon\n} from '../../utils/ChatMessageComponentAsEditBoxUtils';\n/ @conditional-compile-remove(file-sharing-acs) /\nimport {\n attachmentMetadataReducer,\n getMessageWithAttachmentMetadata,\n doesMessageContainMultipleAttachments\n} from '../../utils/ChatMessageComponentAsEditBoxUtils';\nimport { RichTextEditorComponentRef } from '../../RichTextEditor/RichTextEditor';\nimport { RichTextInputBoxComponent } from '../../RichTextEditor/RichTextInputBoxComponent';\nimport { editBoxRichTextEditorStyle, richTextActionButtonsStyle } from '../../styles/RichTextEditor.styles';\nimport { RichTextSendBoxErrors } from '../../RichTextEditor/RichTextSendBoxErrors';\nimport { useLocale } from '../../../localization';\n/ @conditional-compile-remove(file-sharing-acs) /\nimport { FluentV9ThemeProvider } from '../../../theming/FluentV9ThemeProvider';\n/ @conditional-compile-remove(file-sharing-acs) /\nimport { attachmentUploadCardsStyles } from '../../styles/SendBox.styles';\n/ @conditional-compile-remove(rich-text-editor-image-upload) /\nimport { SendBoxErrorBarError } from '../../SendBoxErrorBar';\n/ @conditional-compile-remove(rich-text-editor-image-upload) /\nimport { BROKEN_IMAGE_SVG_DATA } from '../../styles/Common.style';\n\n/* @private /\nexport type ChatMessageComponentAsRichTextEditBoxProps = {\n onCancel?: (messageId: string) => void;\n onSubmit: (\n text: string,\n / @conditional-compile-remove(file-sharing-acs) /\n attachmentMetadata?: AttachmentMetadata[]\n ) => void;\n message: ChatMessage;\n strings: MessageThreadStrings;\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n onPaste?: (event: { content: DocumentFragment }) => void;\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n onCancelInlineImageUpload?: (imageId: string) => void;\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n onUploadInlineImage?: (imageUrl: string, imageFileName: string) => void;\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n imageUploadsInProgress?: AttachmentMetadataInProgress[];\n};\n\n/\n @private\n /\nexport const ChatMessageComponentAsRichTextEditBox = (\n props: ChatMessageComponentAsRichTextEditBoxProps\n): JSX.Element => {\n const {\n onCancel,\n onSubmit,\n strings,\n message,\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n onPaste,\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n onUploadInlineImage,\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n imageUploadsInProgress,\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n onCancelInlineImageUpload\n } = props;\n\n const initialContent = useMemo(() => {\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n const content = message.content;\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n const document = new DOMParser().parseFromString(content ?? '', 'text/html');\n // The broken image element is a div element with all the attributes of the original image element.\n // We need to convert it to a img element so the Rooster knows how to render it.\n // And we need to copy over all the attributes such as id, width, etc.\n // which is needed for sending the message with the images correctly.\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n document.querySelectorAll('.broken-image-wrapper').forEach((brokenImage) => {\n const imageElement = document.createElement('img');\n const attributes = brokenImage.attributes;\n for (const attribute of attributes) {\n imageElement.setAttribute(attribute.name, attribute.value);\n }\n\n imageElement.src = BROKEN_IMAGE_SVG_DATA;\n brokenImage.parentElement?.replaceChild(imageElement, brokenImage);\n });\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n return document.body.innerHTML;\n return message.content;\n }, [message]);\n\n const [textValue, setTextValue] = useState<string>(initialContent \|\| '');\n\n / @conditional-compile-remove(file-sharing-acs) /\n const [attachmentMetadata, handleAttachmentAction] = useReducer(\n attachmentMetadataReducer,\n getMessageWithAttachmentMetadata(message) ?? []\n );\n\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n const [attachmentUploadsPendingError, setAttachmentUploadsPendingError] = useState<SendBoxErrorBarError \| undefined>(\n undefined\n );\n const editTextFieldRef = React.useRef<RichTextEditorComponentRef>(null);\n const theme = useTheme();\n const messageState = useMemo(() => {\n return getMessageState(textValue, / @conditional-compile-remove(file-sharing-acs) / attachmentMetadata ?? []);\n }, [/ @conditional-compile-remove(file-sharing-acs) / attachmentMetadata, textValue]);\n\n const submitEnabled = messageState === 'OK';\n\n const editContainerStyles = useChatMessageRichTextEditContainerStyles();\n const chatMyMessageStyles = useChatMyMessageStyles();\n const locale = useLocale().strings;\n\n const setText = useCallback((newValue?: string): void => {\n setTextValue(newValue ?? '');\n }, []);\n\n useEffect(() => {\n editTextFieldRef.current?.focus();\n }, []);\n\n const textTooLongMessage = useMemo(() => {\n return messageState === 'too long'\n ? _formatString(strings.editBoxTextLimit, { limitNumber: `${MAXIMUM_LENGTH_OF_MESSAGE}` })\n : undefined;\n }, [messageState, strings.editBoxTextLimit]);\n\n const iconClassName = useCallback(\n (isHover: boolean) => {\n const color = isHover ? theme.palette.accent : theme.palette.neutralSecondary;\n return mergeStyles(richTextEditBoxActionButtonIcon, { color });\n },\n [theme.palette.accent, theme.palette.neutralSecondary]\n );\n\n const onRenderThemedCancelIcon = useCallback(\n (isHover: boolean) => {\n return onRenderCancelIcon(iconClassName(isHover));\n },\n [iconClassName]\n );\n\n const onRenderThemedSubmitIcon = useCallback(\n (isHover: boolean) => {\n return onRenderSubmitIcon(iconClassName(isHover));\n },\n [iconClassName]\n );\n\n / @conditional-compile-remove(file-sharing-acs) /\n const hasMultipleAttachments = useMemo(() => {\n return doesMessageContainMultipleAttachments(message);\n }, [message]);\n\n const onSubmitHandler = useCallback((): void => {\n if (!submitEnabled) {\n return;\n }\n // Don't send message until all attachments have been uploaded successfully\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n setAttachmentUploadsPendingError(undefined);\n\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n if (hasIncompleteAttachmentUploads(imageUploadsInProgress)) {\n setAttachmentUploadsPendingError({ message: strings.attachmentUploadsPendingError, timestamp: Date.now() });\n return;\n }\n\n let content = textValue;\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n content = removeBrokenImageContent(content);\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n if (isAttachmentUploadCompleted(imageUploadsInProgress)) {\n insertImagesToContentString(textValue, imageUploadsInProgress, (content) => {\n onSubmit(content, / @conditional-compile-remove(file-sharing-acs) / attachmentMetadata \|\| []);\n });\n return;\n }\n // it's very important to pass an empty attachment here\n // so when user removes all attachments, UI can reflect it instantly\n // if you set it to undefined, the attachments pre-edited would still be there\n // until edit message event is received\n onSubmit(content, / @conditional-compile-remove(file-sharing-acs) / attachmentMetadata \|\| []);\n }, [\n submitEnabled,\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n imageUploadsInProgress,\n textValue,\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n strings.attachmentUploadsPendingError,\n onSubmit,\n / @conditional-compile-remove(file-sharing-acs) /\n attachmentMetadata\n ]);\n\n const actionButtons = useMemo(() => {\n return (\n <Stack horizontal>\n <InputBoxButton\n className={richTextActionButtonsStyle}\n ariaLabel={strings.editBoxCancelButton}\n tooltipContent={strings.editBoxCancelButton}\n onRenderIcon={onRenderThemedCancelIcon}\n onClick={() => {\n onCancel && onCancel(message.messageId);\n }}\n id={'dismissIconWrapper'}\n data-testId={strings.editBoxCancelButton}\n />\n <InputBoxButton\n className={richTextActionButtonsStyle}\n ariaLabel={strings.editBoxSubmitButton}\n tooltipContent={strings.editBoxSubmitButton}\n onRenderIcon={onRenderThemedSubmitIcon}\n onClick={(e) => {\n onSubmitHandler();\n e.stopPropagation();\n }}\n id={'submitIconWrapper'}\n data-testId={strings.editBoxSubmitButton}\n />\n </Stack>\n );\n }, [\n message.messageId,\n onCancel,\n onRenderThemedCancelIcon,\n onRenderThemedSubmitIcon,\n strings.editBoxCancelButton,\n strings.editBoxSubmitButton,\n onSubmitHandler\n ]);\n const richTextLocaleStrings = useMemo(() => {\n / @conditional-compile-remove(rich-text-editor) /\n return { ...locale.richTextSendBox, ...strings };\n return locale.sendBox;\n }, [\n / @conditional-compile-remove(rich-text-editor) / locale.richTextSendBox,\n / @conditional-compile-remove(rich-text-editor) / strings,\n locale.sendBox\n ]);\n\n / @conditional-compile-remove(file-sharing-acs) /\n const onCancelAttachmentUpload = useCallback((attachmentId: string) => {\n // edit box only capable of removing attachments\n // we need to expand attachment actions\n // if we want to support more actions e.g. add\n handleAttachmentAction({ type: 'remove', id: attachmentId });\n }, []);\n\n / @conditional-compile-remove(file-sharing-acs) /\n const onRenderAttachmentUploads = useCallback(() => {\n return (\n <Stack className={attachmentUploadCardsStyles}>\n <FluentV9ThemeProvider v8Theme={theme}>\n <_AttachmentUploadCards\n attachments={attachmentMetadata}\n onCancelAttachmentUpload={onCancelAttachmentUpload}\n />\n </FluentV9ThemeProvider>\n </Stack>\n );\n }, [attachmentMetadata, onCancelAttachmentUpload, theme]);\n\n const onChangeHandler = useCallback(\n (\n content: string \| undefined,\n / @conditional-compile-remove(rich-text-editor-image-upload) / imageSrcArray?: Array<string>\n ) => {\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n cancelInlineImageUpload(imageSrcArray, imageUploadsInProgress, onCancelInlineImageUpload);\n setText(content);\n },\n [\n setText,\n / @conditional-compile-remove(rich-text-editor-image-upload) / imageUploadsInProgress,\n / @conditional-compile-remove(rich-text-editor-image-upload) / onCancelInlineImageUpload\n ]\n );\n\n const getContent = (): JSX.Element => {\n return (\n <Stack className={mergeStyles(editBoxWidthStyles)}>\n <RichTextSendBoxErrors\n textTooLongMessage={textTooLongMessage}\n systemMessage={message.failureReason}\n / @conditional-compile-remove(rich-text-editor-image-upload) / attachmentUploadsPendingError={\n attachmentUploadsPendingError\n }\n />\n <RichTextInputBoxComponent\n placeholderText={strings.editBoxPlaceholderText}\n onChange={onChangeHandler}\n editorComponentRef={editTextFieldRef}\n initialContent={initialContent}\n strings={richTextLocaleStrings}\n disabled={false}\n actionComponents={actionButtons}\n richTextEditorStyleProps={editBoxRichTextEditorStyle}\n isHorizontalLayoutDisabled={true}\n / @conditional-compile-remove(file-sharing-acs) /\n onRenderAttachmentUploads={onRenderAttachmentUploads}\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n onPaste={onPaste}\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n onUploadInlineImage={onUploadInlineImage}\n />\n </Stack>\n );\n };\n\n const attached = message.attached === true ? 'center' : message.attached === 'bottom' ? 'bottom' : 'top';\n return (\n <ChatMyMessage\n attached={attached}\n root={{\n className: mergeClasses(\n chatMyMessageStyles.root,\n / @conditional-compile-remove(file-sharing-acs) */\n hasMultipleAttachments ? chatMyMessageStyles.multipleAttachmentsInEditing : undefined\n )\n }}\n body={{\n className: mergeClasses(\n editContainerStyles.body,\n attached !== 'top' ? editContainerStyles.bodyAttached : undefined\n )\n }}\n >\n {getContent()}\n </ChatMyMessage>\n );\n};\n\nexport default ChatMessageComponentAsRichTextEditBox;\n"]}
1	+ {"version":3,"file":"ChatMessageComponentAsRichTextEditBox.js","sourceRoot":"","sources":["../../../../../../../../react-components/src/components/ChatMessage/MyMessageComponents/ChatMessageComponentAsRichTextEditBox.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAAE,WAAW,EAAE,KAAK,EAAE,MAAM,iBAAiB,CAAC;AACrD,OAAO,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAC;AAC7D,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,EAAE,aAAa,EAAE,yCAAgC;AAGxD,OAAO,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAC5C,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACzE,mDAAmD;AACnD,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AACnC,OAAO,EAAE,kBAAkB,EAAE,+BAA+B,EAAE,MAAM,6BAA6B,CAAC;AAClG,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAEtD,OAAO,EAAE,sBAAsB,EAAE,MAAM,mCAAmC,CAAC;AAE3E,OAAO,EAAE,sBAAsB,EAAE,MAAM,wCAAwC,CAAC;AAGhF,OAAO,EAAE,yCAAyC,EAAE,MAAM,0CAA0C,CAAC;AACrG,OAAO,EAAE,yBAAyB,EAAE,MAAM,0BAA0B,CAAC;AACrE,gEAAgE;AAChE,OAAO,EACL,uBAAuB,EACvB,8BAA8B,EAC9B,2BAA2B,EAC3B,2BAA2B,EAC3B,wBAAwB,EACzB,MAAM,0BAA0B,CAAC;AAClC,OAAO,EACL,eAAe,EACf,kBAAkB,EAClB,kBAAkB,EACnB,MAAM,gDAAgD,CAAC;AACxD,mDAAmD;AACnD,OAAO,EACL,yBAAyB,EACzB,gCAAgC,EAChC,qCAAqC,EACtC,MAAM,gDAAgD,CAAC;AAExD,OAAO,EAAE,yBAAyB,EAAE,MAAM,gDAAgD,CAAC;AAC3F,OAAO,EAAE,0BAA0B,EAAE,0BAA0B,EAAE,MAAM,oCAAoC,CAAC;AAC5G,OAAO,EAAE,qBAAqB,EAAE,MAAM,4CAA4C,CAAC;AACnF,OAAO,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;AAClD,mDAAmD;AACnD,OAAO,EAAE,qBAAqB,EAAE,MAAM,wCAAwC,CAAC;AAC/E,mDAAmD;AACnD,OAAO,EAAE,2BAA2B,EAAE,MAAM,6BAA6B,CAAC;AAG1E,gEAAgE;AAChE,OAAO,EAAE,qBAAqB,EAAE,MAAM,2BAA2B,CAAC;AAsBlE;;GAEG;AACH,MAAM,CAAC,MAAM,qCAAqC,GAAG,CACnD,KAAiD,EACpC,EAAE;;IACf,MAAM,EACJ,QAAQ,EACR,QAAQ,EACR,OAAO,EACP,OAAO;IACP,gEAAgE;IAChE,OAAO;IACP,gEAAgE;IAChE,mBAAmB;IACnB,gEAAgE;IAChE,sBAAsB;IACtB,gEAAgE;IAChE,yBAAyB,EAC1B,GAAG,KAAK,CAAC;IAEV,MAAM,cAAc,GAAG,OAAO,CAAC,GAAG,EAAE;QAClC,gEAAgE;QAChE,MAAM,OAAO,GAAG,OAAO,CAAC,OAAO,CAAC;QAChC,gEAAgE;QAChE,MAAM,QAAQ,GAAG,IAAI,SAAS,EAAE,CAAC,eAAe,CAAC,OAAO,aAAP,OAAO,cAAP,OAAO,GAAI,EAAE,EAAE,WAAW,CAAC,CAAC;QAC7E,mGAAmG;QACnG,gFAAgF;QAChF,sEAAsE;QACtE,qEAAqE;QACrE,gEAAgE;QAChE,QAAQ,CAAC,gBAAgB,CAAC,uBAAuB,CAAC,CAAC,OAAO,CAAC,CAAC,WAAW,EAAE,EAAE;;YACzE,MAAM,YAAY,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;YACnD,MAAM,UAAU,GAAG,WAAW,CAAC,UAAU,CAAC;YAC1C,KAAK,MAAM,SAAS,IAAI,UAAU,EAAE,CAAC;gBACnC,YAAY,CAAC,YAAY,CAAC,SAAS,CAAC,IAAI,EAAE,SAAS,CAAC,KAAK,CAAC,CAAC;YAC7D,CAAC;YAED,YAAY,CAAC,GAAG,GAAG,qBAAqB,CAAC;YACzC,MAAA,WAAW,CAAC,aAAa,0CAAE,YAAY,CAAC,YAAY,EAAE,WAAW,CAAC,CAAC;QACrE,CAAC,CAAC,CAAC;QACH,gEAAgE;QAChE,OAAO,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC;QAC/B,OAAO,OAAO,CAAC,OAAO,CAAC;IACzB,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;IAEd,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAS,cAAc,IAAI,EAAE,CAAC,CAAC;IAEzE,mDAAmD;IACnD,MAAM,CAAC,kBAAkB,EAAE,sBAAsB,CAAC,GAAG,UAAU,CAC7D,yBAAyB,EACzB,MAAA,gCAAgC,CAAC,OAAO,CAAC,mCAAI,EAAE,CAChD,CAAC;IAEF,gEAAgE;IAChE,MAAM,CAAC,6BAA6B,EAAE,gCAAgC,CAAC,GAAG,QAAQ,CAChF,SAAS,CACV,CAAC;IACF,MAAM,gBAAgB,GAAG,KAAK,CAAC,MAAM,CAA6B,IAAI,CAAC,CAAC;IACxE,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IACzB,MAAM,YAAY,GAAG,OAAO,CAAC,GAAG,EAAE;QAChC,OAAO,eAAe,CAAC,SAAS,EAAE,mDAAmD,CAAC,kBAAkB,aAAlB,kBAAkB,cAAlB,kBAAkB,GAAI,EAAE,CAAC,CAAC;IAClH,CAAC,EAAE,CAAC,mDAAmD,CAAC,kBAAkB,EAAE,SAAS,CAAC,CAAC,CAAC;IAExF,gEAAgE;IAChE,MAAM,uBAAuB,GAAG,OAAO,CAAC,GAAG,EAAE;;QAC3C,OAAO,MAAA,MAAA,sBAAsB,aAAtB,sBAAsB,uBAAtB,sBAAsB,CAAE,MAAM,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,KAAK,EAAE,GAAG,EAAE,0CAAE,KAAK,0CAAE,OAAO,CAAC;IACtF,CAAC,EAAE,CAAC,sBAAsB,CAAC,CAAC,CAAC;IAE7B,MAAM,aAAa,GAAG,YAAY,KAAK,IAAI,CAAC;IAE5C,MAAM,mBAAmB,GAAG,yCAAyC,EAAE,CAAC;IACxE,MAAM,mBAAmB,GAAG,sBAAsB,EAAE,CAAC;IACrD,MAAM,MAAM,GAAG,SAAS,EAAE,CAAC,OAAO,CAAC;IAEnC,MAAM,OAAO,GAAG,WAAW,CAAC,CAAC,QAAiB,EAAQ,EAAE;QACtD,YAAY,CAAC,QAAQ,aAAR,QAAQ,cAAR,QAAQ,GAAI,EAAE,CAAC,CAAC;IAC/B,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,SAAS,CAAC,GAAG,EAAE;;QACb,MAAA,gBAAgB,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAC;IACpC,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,kBAAkB,GAAG,OAAO,CAAC,GAAG,EAAE;QACtC,OAAO,YAAY,KAAK,UAAU;YAChC,CAAC,CAAC,aAAa,CAAC,OAAO,CAAC,gBAAgB,EAAE,EAAE,WAAW,EAAE,GAAG,yBAAyB,EAAE,EAAE,CAAC;YAC1F,CAAC,CAAC,SAAS,CAAC;IAChB,CAAC,EAAE,CAAC,YAAY,EAAE,OAAO,CAAC,gBAAgB,CAAC,CAAC,CAAC;IAE7C,MAAM,aAAa,GAAG,WAAW,CAC/B,CAAC,OAAgB,EAAE,EAAE;QACnB,MAAM,KAAK,GAAG,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,gBAAgB,CAAC;QAC9E,OAAO,WAAW,CAAC,+BAA+B,EAAE,EAAE,KAAK,EAAE,CAAC,CAAC;IACjE,CAAC,EACD,CAAC,KAAK,CAAC,OAAO,CAAC,MAAM,EAAE,KAAK,CAAC,OAAO,CAAC,gBAAgB,CAAC,CACvD,CAAC;IAEF,MAAM,wBAAwB,GAAG,WAAW,CAC1C,CAAC,OAAgB,EAAE,EAAE;QACnB,OAAO,kBAAkB,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC,CAAC;IACpD,CAAC,EACD,CAAC,aAAa,CAAC,CAChB,CAAC;IAEF,MAAM,wBAAwB,GAAG,WAAW,CAC1C,CAAC,OAAgB,EAAE,EAAE;QACnB,OAAO,kBAAkB,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC,CAAC;IACpD,CAAC,EACD,CAAC,aAAa,CAAC,CAChB,CAAC;IAEF,mDAAmD;IACnD,MAAM,sBAAsB,GAAG,OAAO,CAAC,GAAG,EAAE;QAC1C,OAAO,qCAAqC,CAAC,OAAO,CAAC,CAAC;IACxD,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;IAEd,MAAM,eAAe,GAAG,WAAW,CAAC,GAAS,EAAE;QAC7C,IAAI,CAAC,aAAa,EAAE,CAAC;YACnB,OAAO;QACT,CAAC;QACD,2EAA2E;QAC3E,gEAAgE;QAChE,gCAAgC,CAAC,SAAS,CAAC,CAAC;QAE5C,gEAAgE;QAChE,IAAI,8BAA8B,CAAC,sBAAsB,CAAC,EAAE,CAAC;YAC3D,gCAAgC,CAAC,EAAE,OAAO,EAAE,OAAO,CAAC,6BAA6B,EAAE,SAAS,EAAE,IAAI,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC;YAC5G,OAAO;QACT,CAAC;QAED,IAAI,OAAO,GAAG,SAAS,CAAC;QACxB,gEAAgE;QAChE,OAAO,GAAG,wBAAwB,CAAC,OAAO,CAAC,CAAC;QAC5C,gEAAgE;QAChE,IAAI,2BAA2B,CAAC,sBAAsB,CAAC,EAAE,CAAC;YACxD,2BAA2B,CAAC,SAAS,EAAE,sBAAsB,EAAE,CAAC,OAAO,EAAE,EAAE;gBACzE,QAAQ,CAAC,OAAO,EAAE,mDAAmD,CAAC,kBAAkB,IAAI,EAAE,CAAC,CAAC;YAClG,CAAC,CAAC,CAAC;YACH,OAAO;QACT,CAAC;QACD,uDAAuD;QACvD,oEAAoE;QACpE,8EAA8E;QAC9E,uCAAuC;QACvC,QAAQ,CAAC,OAAO,EAAE,mDAAmD,CAAC,kBAAkB,IAAI,EAAE,CAAC,CAAC;IAClG,CAAC,EAAE;QACD,aAAa;QACb,gEAAgE;QAChE,sBAAsB;QACtB,SAAS;QACT,gEAAgE;QAChE,OAAO,CAAC,6BAA6B;QACrC,QAAQ;QACR,mDAAmD;QACnD,kBAAkB;KACnB,CAAC,CAAC;IAEH,MAAM,aAAa,GAAG,OAAO,CAAC,GAAG,EAAE;QACjC,OAAO,CACL,oBAAC,KAAK,IAAC,UAAU;YACf,oBAAC,cAAc,IACb,SAAS,EAAE,0BAA0B,EACrC,SAAS,EAAE,OAAO,CAAC,mBAAmB,EACtC,cAAc,EAAE,OAAO,CAAC,mBAAmB,EAC3C,YAAY,EAAE,wBAAwB,EACtC,OAAO,EAAE,GAAG,EAAE;oBACZ,QAAQ,IAAI,QAAQ,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC;gBAC1C,CAAC,EACD,EAAE,EAAE,oBAAoB,iBACX,OAAO,CAAC,mBAAmB,GACxC;YACF,oBAAC,cAAc,IACb,SAAS,EAAE,0BAA0B,EACrC,SAAS,EAAE,OAAO,CAAC,mBAAmB,EACtC,cAAc,EAAE,OAAO,CAAC,mBAAmB,EAC3C,YAAY,EAAE,wBAAwB,EACtC,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;oBACb,eAAe,EAAE,CAAC;oBAClB,CAAC,CAAC,eAAe,EAAE,CAAC;gBACtB,CAAC,EACD,EAAE,EAAE,mBAAmB,iBACV,OAAO,CAAC,mBAAmB,GACxC,CACI,CACT,CAAC;IACJ,CAAC,EAAE;QACD,OAAO,CAAC,SAAS;QACjB,QAAQ;QACR,wBAAwB;QACxB,wBAAwB;QACxB,OAAO,CAAC,mBAAmB;QAC3B,OAAO,CAAC,mBAAmB;QAC3B,eAAe;KAChB,CAAC,CAAC;IACH,MAAM,qBAAqB,GAAG,OAAO,CAAC,GAAG,EAAE;QACzC,mDAAmD;QACnD,uCAAY,MAAM,CAAC,eAAe,GAAK,OAAO,EAAG;QACjD,OAAO,MAAM,CAAC,OAAO,CAAC;IACxB,CAAC,EAAE;QACD,mDAAmD,CAAC,MAAM,CAAC,eAAe;QAC1E,mDAAmD,CAAC,OAAO;QAC3D,MAAM,CAAC,OAAO;KACf,CAAC,CAAC;IAEH,mDAAmD;IACnD,MAAM,wBAAwB,GAAG,WAAW,CAAC,CAAC,YAAoB,EAAE,EAAE;QACpE,gDAAgD;QAChD,uCAAuC;QACvC,8CAA8C;QAC9C,sBAAsB,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE,EAAE,YAAY,EAAE,CAAC,CAAC;IAC/D,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,mDAAmD;IACnD,MAAM,yBAAyB,GAAG,WAAW,CAAC,GAAG,EAAE;QACjD,OAAO,CACL,oBAAC,KAAK,IAAC,SAAS,EAAE,2BAA2B;YAC3C,oBAAC,qBAAqB,IAAC,OAAO,EAAE,KAAK;gBACnC,oBAAC,sBAAsB,IACrB,WAAW,EAAE,kBAAkB,EAC/B,wBAAwB,EAAE,wBAAwB,GAClD,CACoB,CAClB,CACT,CAAC;IACJ,CAAC,EAAE,CAAC,kBAAkB,EAAE,wBAAwB,EAAE,KAAK,CAAC,CAAC,CAAC;IAE1D,MAAM,eAAe,GAAG,WAAW,CACjC,CACE,OAA2B;IAC3B,gEAAgE,CAAC,aAA6B,EAC9F,EAAE;QACF,gEAAgE;QAChE,uBAAuB,CAAC;YACtB,aAAa;YACb,sBAAsB;YACtB,SAAS,EAAE,OAAO,CAAC,SAAS;YAC5B,gCAAgC,EAAE,yBAAyB;YAC3D,gCAAgC,EAAE,SAAS;SAC5C,CAAC,CAAC;QACH,OAAO,CAAC,OAAO,CAAC,CAAC;IACnB,CAAC,EACD;QACE,OAAO;QACP,gEAAgE,CAAC,sBAAsB;QACvF,gEAAgE,CAAC,yBAAyB;QAC1F,gEAAgE,CAAC,OAAO,CAAC,SAAS;KACnF,CACF,CAAC;IAEF,MAAM,UAAU,GAAG,GAAgB,EAAE;QACnC,OAAO,CACL,oBAAC,KAAK,IAAC,SAAS,EAAE,WAAW,CAAC,kBAAkB,CAAC;YAC/C,oBAAC,qBAAqB,IACpB,kBAAkB,EAAE,kBAAkB,EACtC,aAAa,EAAE,OAAO,CAAC,aAAa;gBACpC,gEAAgE,CAAC,6BAA6B,EAC5F,6BAA6B;gBAE/B,gEAAgE;gBAChE,uBAAuB,EACrB,uBAAuB;oBACrB,CAAC,CAAC;wBACE,OAAO,EAAE,uBAAuB;wBAChC,SAAS,EAAE,IAAI,CAAC,GAAG,EAAE;qBACtB;oBACH,CAAC,CAAC,SAAS,GAEf;YACF,oBAAC,yBAAyB,IACxB,eAAe,EAAE,OAAO,CAAC,sBAAsB,EAC/C,QAAQ,EAAE,eAAe,EACzB,kBAAkB,EAAE,gBAAgB,EACpC,cAAc,EAAE,cAAc,EAC9B,OAAO,EAAE,qBAAqB,EAC9B,QAAQ,EAAE,KAAK,EACf,gBAAgB,EAAE,aAAa,EAC/B,wBAAwB,EAAE,0BAA0B,EACpD,0BAA0B,EAAE,IAAI;gBAChC,mDAAmD;gBACnD,yBAAyB,EAAE,yBAAyB;gBACpD,gEAAgE;gBAChE,OAAO,EAAE,OAAO;gBAChB,gEAAgE;gBAChE,mBAAmB,EAAE,CAAC,QAAgB,EAAE,aAAqB,EAAE,EAAE;oBAC/D,mBAAmB,IAAI,mBAAmB,CAAC,QAAQ,EAAE,aAAa,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;gBACzF,CAAC,GACD,CACI,CACT,CAAC;IACJ,CAAC,CAAC;IAEF,MAAM,QAAQ,GAAG,OAAO,CAAC,QAAQ,KAAK,IAAI,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC,QAAQ,KAAK,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC;IACzG,OAAO,CACL,oBAAC,aAAa,IACZ,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE;YACJ,SAAS,EAAE,YAAY,CACrB,mBAAmB,CAAC,IAAI;YACxB,mDAAmD;YACnD,sBAAsB,CAAC,CAAC,CAAC,mBAAmB,CAAC,4BAA4B,CAAC,CAAC,CAAC,SAAS,CACtF;SACF,EACD,IAAI,EAAE;YACJ,SAAS,EAAE,YAAY,CACrB,mBAAmB,CAAC,IAAI,EACxB,QAAQ,KAAK,KAAK,CAAC,CAAC,CAAC,mBAAmB,CAAC,YAAY,CAAC,CAAC,CAAC,SAAS,CAClE;SACF,IAEA,UAAU,EAAE,CACC,CACjB,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,qCAAqC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { mergeStyles, Stack } from '@fluentui/react';\nimport { ChatMyMessage } from '@fluentui-contrib/react-chat';\nimport { mergeClasses } from '@fluentui/react-components';\nimport { _formatString } from '@internal/acs-ui-common';\n/* @conditional-compile-remove(rich-text-editor-image-upload) /\nimport { AttachmentMetadataInProgress } from '@internal/acs-ui-common';\nimport { useTheme } from '../../../theming';\nimport React, { useCallback, useEffect, useMemo, useState } from 'react';\n/ @conditional-compile-remove(file-sharing-acs) /\nimport { useReducer } from 'react';\nimport { editBoxWidthStyles, richTextEditBoxActionButtonIcon } from '../../styles/EditBox.styles';\nimport { InputBoxButton } from '../../InputBoxButton';\nimport { MessageThreadStrings } from '../../MessageThread';\nimport { useChatMyMessageStyles } from '../../styles/MessageThread.styles';\nimport { ChatMessage } from '../../../types';\nimport { _AttachmentUploadCards } from '../../Attachment/AttachmentUploadCards';\n/ @conditional-compile-remove(file-sharing-acs) /\nimport { AttachmentMetadata } from '@internal/acs-ui-common';\nimport { useChatMessageRichTextEditContainerStyles } from '../../styles/ChatMessageComponent.styles';\nimport { MAXIMUM_LENGTH_OF_MESSAGE } from '../../utils/SendBoxUtils';\n/ @conditional-compile-remove(rich-text-editor-image-upload) /\nimport {\n cancelInlineImageUpload,\n hasIncompleteAttachmentUploads,\n insertImagesToContentString,\n isAttachmentUploadCompleted,\n removeBrokenImageContent\n} from '../../utils/SendBoxUtils';\nimport {\n getMessageState,\n onRenderCancelIcon,\n onRenderSubmitIcon\n} from '../../utils/ChatMessageComponentAsEditBoxUtils';\n/ @conditional-compile-remove(file-sharing-acs) /\nimport {\n attachmentMetadataReducer,\n getMessageWithAttachmentMetadata,\n doesMessageContainMultipleAttachments\n} from '../../utils/ChatMessageComponentAsEditBoxUtils';\nimport { RichTextEditorComponentRef } from '../../RichTextEditor/RichTextEditor';\nimport { RichTextInputBoxComponent } from '../../RichTextEditor/RichTextInputBoxComponent';\nimport { editBoxRichTextEditorStyle, richTextActionButtonsStyle } from '../../styles/RichTextEditor.styles';\nimport { RichTextSendBoxErrors } from '../../RichTextEditor/RichTextSendBoxErrors';\nimport { useLocale } from '../../../localization';\n/ @conditional-compile-remove(file-sharing-acs) /\nimport { FluentV9ThemeProvider } from '../../../theming/FluentV9ThemeProvider';\n/ @conditional-compile-remove(file-sharing-acs) /\nimport { attachmentUploadCardsStyles } from '../../styles/SendBox.styles';\n/ @conditional-compile-remove(rich-text-editor-image-upload) /\nimport { SendBoxErrorBarError } from '../../SendBoxErrorBar';\n/ @conditional-compile-remove(rich-text-editor-image-upload) /\nimport { BROKEN_IMAGE_SVG_DATA } from '../../styles/Common.style';\n\n/* @private /\nexport type ChatMessageComponentAsRichTextEditBoxProps = {\n onCancel?: (messageId: string) => void;\n onSubmit: (\n text: string,\n / @conditional-compile-remove(file-sharing-acs) /\n attachmentMetadata?: AttachmentMetadata[]\n ) => void;\n message: ChatMessage;\n strings: MessageThreadStrings;\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n onPaste?: (event: { content: DocumentFragment }) => void;\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n onCancelInlineImageUpload?: (imageId: string, messageId: string) => void;\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n onUploadInlineImage?: (imageUrl: string, imageFileName: string, messageId: string) => void;\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n imageUploadsInProgress?: AttachmentMetadataInProgress[];\n};\n\n/\n @private\n /\nexport const ChatMessageComponentAsRichTextEditBox = (\n props: ChatMessageComponentAsRichTextEditBoxProps\n): JSX.Element => {\n const {\n onCancel,\n onSubmit,\n strings,\n message,\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n onPaste,\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n onUploadInlineImage,\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n imageUploadsInProgress,\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n onCancelInlineImageUpload\n } = props;\n\n const initialContent = useMemo(() => {\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n const content = message.content;\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n const document = new DOMParser().parseFromString(content ?? '', 'text/html');\n // The broken image element is a div element with all the attributes of the original image element.\n // We need to convert it to a img element so the Rooster knows how to render it.\n // And we need to copy over all the attributes such as id, width, etc.\n // which is needed for sending the message with the images correctly.\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n document.querySelectorAll('.broken-image-wrapper').forEach((brokenImage) => {\n const imageElement = document.createElement('img');\n const attributes = brokenImage.attributes;\n for (const attribute of attributes) {\n imageElement.setAttribute(attribute.name, attribute.value);\n }\n\n imageElement.src = BROKEN_IMAGE_SVG_DATA;\n brokenImage.parentElement?.replaceChild(imageElement, brokenImage);\n });\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n return document.body.innerHTML;\n return message.content;\n }, [message]);\n\n const [textValue, setTextValue] = useState<string>(initialContent \|\| '');\n\n / @conditional-compile-remove(file-sharing-acs) /\n const [attachmentMetadata, handleAttachmentAction] = useReducer(\n attachmentMetadataReducer,\n getMessageWithAttachmentMetadata(message) ?? []\n );\n\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n const [attachmentUploadsPendingError, setAttachmentUploadsPendingError] = useState<SendBoxErrorBarError \| undefined>(\n undefined\n );\n const editTextFieldRef = React.useRef<RichTextEditorComponentRef>(null);\n const theme = useTheme();\n const messageState = useMemo(() => {\n return getMessageState(textValue, / @conditional-compile-remove(file-sharing-acs) / attachmentMetadata ?? []);\n }, [/ @conditional-compile-remove(file-sharing-acs) / attachmentMetadata, textValue]);\n\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n const imageUploadErrorMessage = useMemo(() => {\n return imageUploadsInProgress?.filter((image) => image.error).pop()?.error?.message;\n }, [imageUploadsInProgress]);\n\n const submitEnabled = messageState === 'OK';\n\n const editContainerStyles = useChatMessageRichTextEditContainerStyles();\n const chatMyMessageStyles = useChatMyMessageStyles();\n const locale = useLocale().strings;\n\n const setText = useCallback((newValue?: string): void => {\n setTextValue(newValue ?? '');\n }, []);\n\n useEffect(() => {\n editTextFieldRef.current?.focus();\n }, []);\n\n const textTooLongMessage = useMemo(() => {\n return messageState === 'too long'\n ? _formatString(strings.editBoxTextLimit, { limitNumber: `${MAXIMUM_LENGTH_OF_MESSAGE}` })\n : undefined;\n }, [messageState, strings.editBoxTextLimit]);\n\n const iconClassName = useCallback(\n (isHover: boolean) => {\n const color = isHover ? theme.palette.accent : theme.palette.neutralSecondary;\n return mergeStyles(richTextEditBoxActionButtonIcon, { color });\n },\n [theme.palette.accent, theme.palette.neutralSecondary]\n );\n\n const onRenderThemedCancelIcon = useCallback(\n (isHover: boolean) => {\n return onRenderCancelIcon(iconClassName(isHover));\n },\n [iconClassName]\n );\n\n const onRenderThemedSubmitIcon = useCallback(\n (isHover: boolean) => {\n return onRenderSubmitIcon(iconClassName(isHover));\n },\n [iconClassName]\n );\n\n / @conditional-compile-remove(file-sharing-acs) /\n const hasMultipleAttachments = useMemo(() => {\n return doesMessageContainMultipleAttachments(message);\n }, [message]);\n\n const onSubmitHandler = useCallback((): void => {\n if (!submitEnabled) {\n return;\n }\n // Don't send message until all attachments have been uploaded successfully\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n setAttachmentUploadsPendingError(undefined);\n\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n if (hasIncompleteAttachmentUploads(imageUploadsInProgress)) {\n setAttachmentUploadsPendingError({ message: strings.attachmentUploadsPendingError, timestamp: Date.now() });\n return;\n }\n\n let content = textValue;\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n content = removeBrokenImageContent(content);\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n if (isAttachmentUploadCompleted(imageUploadsInProgress)) {\n insertImagesToContentString(textValue, imageUploadsInProgress, (content) => {\n onSubmit(content, / @conditional-compile-remove(file-sharing-acs) / attachmentMetadata \|\| []);\n });\n return;\n }\n // it's very important to pass an empty attachment here\n // so when user removes all attachments, UI can reflect it instantly\n // if you set it to undefined, the attachments pre-edited would still be there\n // until edit message event is received\n onSubmit(content, / @conditional-compile-remove(file-sharing-acs) / attachmentMetadata \|\| []);\n }, [\n submitEnabled,\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n imageUploadsInProgress,\n textValue,\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n strings.attachmentUploadsPendingError,\n onSubmit,\n / @conditional-compile-remove(file-sharing-acs) /\n attachmentMetadata\n ]);\n\n const actionButtons = useMemo(() => {\n return (\n <Stack horizontal>\n <InputBoxButton\n className={richTextActionButtonsStyle}\n ariaLabel={strings.editBoxCancelButton}\n tooltipContent={strings.editBoxCancelButton}\n onRenderIcon={onRenderThemedCancelIcon}\n onClick={() => {\n onCancel && onCancel(message.messageId);\n }}\n id={'dismissIconWrapper'}\n data-testId={strings.editBoxCancelButton}\n />\n <InputBoxButton\n className={richTextActionButtonsStyle}\n ariaLabel={strings.editBoxSubmitButton}\n tooltipContent={strings.editBoxSubmitButton}\n onRenderIcon={onRenderThemedSubmitIcon}\n onClick={(e) => {\n onSubmitHandler();\n e.stopPropagation();\n }}\n id={'submitIconWrapper'}\n data-testId={strings.editBoxSubmitButton}\n />\n </Stack>\n );\n }, [\n message.messageId,\n onCancel,\n onRenderThemedCancelIcon,\n onRenderThemedSubmitIcon,\n strings.editBoxCancelButton,\n strings.editBoxSubmitButton,\n onSubmitHandler\n ]);\n const richTextLocaleStrings = useMemo(() => {\n / @conditional-compile-remove(rich-text-editor) /\n return { ...locale.richTextSendBox, ...strings };\n return locale.sendBox;\n }, [\n / @conditional-compile-remove(rich-text-editor) / locale.richTextSendBox,\n / @conditional-compile-remove(rich-text-editor) / strings,\n locale.sendBox\n ]);\n\n / @conditional-compile-remove(file-sharing-acs) /\n const onCancelAttachmentUpload = useCallback((attachmentId: string) => {\n // edit box only capable of removing attachments\n // we need to expand attachment actions\n // if we want to support more actions e.g. add\n handleAttachmentAction({ type: 'remove', id: attachmentId });\n }, []);\n\n / @conditional-compile-remove(file-sharing-acs) /\n const onRenderAttachmentUploads = useCallback(() => {\n return (\n <Stack className={attachmentUploadCardsStyles}>\n <FluentV9ThemeProvider v8Theme={theme}>\n <_AttachmentUploadCards\n attachments={attachmentMetadata}\n onCancelAttachmentUpload={onCancelAttachmentUpload}\n />\n </FluentV9ThemeProvider>\n </Stack>\n );\n }, [attachmentMetadata, onCancelAttachmentUpload, theme]);\n\n const onChangeHandler = useCallback(\n (\n content: string \| undefined,\n / @conditional-compile-remove(rich-text-editor-image-upload) / imageSrcArray?: Array<string>\n ) => {\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n cancelInlineImageUpload({\n imageSrcArray,\n imageUploadsInProgress,\n messageId: message.messageId,\n editBoxOnCancelInlineImageUpload: onCancelInlineImageUpload,\n sendBoxOnCancelInlineImageUpload: undefined\n });\n setText(content);\n },\n [\n setText,\n / @conditional-compile-remove(rich-text-editor-image-upload) / imageUploadsInProgress,\n / @conditional-compile-remove(rich-text-editor-image-upload) / onCancelInlineImageUpload,\n / @conditional-compile-remove(rich-text-editor-image-upload) / message.messageId\n ]\n );\n\n const getContent = (): JSX.Element => {\n return (\n <Stack className={mergeStyles(editBoxWidthStyles)}>\n <RichTextSendBoxErrors\n textTooLongMessage={textTooLongMessage}\n systemMessage={message.failureReason}\n / @conditional-compile-remove(rich-text-editor-image-upload) / attachmentUploadsPendingError={\n attachmentUploadsPendingError\n }\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n attachmentProgressError={\n imageUploadErrorMessage\n ? {\n message: imageUploadErrorMessage,\n timestamp: Date.now()\n }\n : undefined\n }\n />\n <RichTextInputBoxComponent\n placeholderText={strings.editBoxPlaceholderText}\n onChange={onChangeHandler}\n editorComponentRef={editTextFieldRef}\n initialContent={initialContent}\n strings={richTextLocaleStrings}\n disabled={false}\n actionComponents={actionButtons}\n richTextEditorStyleProps={editBoxRichTextEditorStyle}\n isHorizontalLayoutDisabled={true}\n / @conditional-compile-remove(file-sharing-acs) /\n onRenderAttachmentUploads={onRenderAttachmentUploads}\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n onPaste={onPaste}\n / @conditional-compile-remove(rich-text-editor-image-upload) /\n onUploadInlineImage={(imageUrl: string, imageFileName: string) => {\n onUploadInlineImage && onUploadInlineImage(imageUrl, imageFileName, message.messageId);\n }}\n />\n </Stack>\n );\n };\n\n const attached = message.attached === true ? 'center' : message.attached === 'bottom' ? 'bottom' : 'top';\n return (\n <ChatMyMessage\n attached={attached}\n root={{\n className: mergeClasses(\n chatMyMessageStyles.root,\n / @conditional-compile-remove(file-sharing-acs) */\n hasMultipleAttachments ? chatMyMessageStyles.multipleAttachmentsInEditing : undefined\n )\n }}\n body={{\n className: mergeClasses(\n editContainerStyles.body,\n attached !== 'top' ? editContainerStyles.bodyAttached : undefined\n )\n }}\n >\n {getContent()}\n </ChatMyMessage>\n );\n};\n\nexport default ChatMessageComponentAsRichTextEditBox;\n"]}

package/dist/dist-esm/react-components/src/components/ChatMessage/MyMessageComponents/ChatMyMessageComponent.d.ts CHANGED Viewed

@@ -1,11 +1,11 @@
 /// <reference types="react" />
 import { MessageThreadStrings, UpdateMessageCallback } from '../../MessageThread';
-import { RichTextEditorOptions } from '../../MessageThread';
 import { ChatMessage, ComponentSlotStyle, OnRenderAvatarCallback } from '../../../types';
 import { BlockedMessage } from '../../../types';
 import { AttachmentMenuAction } from '../../../types/Attachment';
 import { AttachmentMetadata } from "../../../../../acs-ui-common/src";
 import { MessageOptions } from "../../../../../acs-ui-common/src";
+import { AttachmentMetadataInProgress } from "../../../../../acs-ui-common/src";
 import { MentionOptions } from '../../MentionPopover';
 import { InlineImageOptions } from '../ChatMessageContent';
 type ChatMyMessageComponentProps = {
@@ -76,11 +76,13 @@ type ChatMyMessageComponentProps = {
      * @beta
      */
     actionsForAttachment?: (attachment: AttachmentMetadata, message?: ChatMessage) => AttachmentMenuAction[];
-    /**
-     * Optional flag to enable rich text editor.
-     * @beta
-     */
-    richTextEditorOptions?: RichTextEditorOptions;
+    isRichTextEditorEnabled?: boolean;
+    onPaste?: (event: {
+        content: DocumentFragment;
+    }) => void;
+    onCancelInlineImageUpload?: (imageId: string, messageId: string) => void;
+    onUploadInlineImage?: (imageUrl: string, imageFileName: string, messageId: string) => void;
+    imageUploadsInProgress?: AttachmentMetadataInProgress[];
 };
 /**
  * @private