@azure/communication-react 1.14.1-alpha-202403290012 → 1.15.0-alpha-202404030013

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 (192) hide show
  1. package/dist/communication-react.d.ts +125 -218
  2. package/dist/dist-cjs/communication-react/{RichTextSendBoxWrapper-CH6WvEGZ.js → RichTextSendBoxWrapper-B8qxZi1I.js} +2 -2
  3. package/dist/dist-cjs/communication-react/{RichTextSendBoxWrapper-CH6WvEGZ.js.map → RichTextSendBoxWrapper-B8qxZi1I.js.map} +1 -1
  4. package/dist/dist-cjs/communication-react/{index-qxnuqL7s.js → index-aOBAWcNI.js} +1018 -874
  5. package/dist/dist-cjs/communication-react/index-aOBAWcNI.js.map +1 -0
  6. package/dist/dist-cjs/communication-react/index.js +2 -1
  7. package/dist/dist-cjs/communication-react/index.js.map +1 -1
  8. package/dist/dist-esm/acs-ui-common/src/telemetryVersion.js +1 -1
  9. package/dist/dist-esm/acs-ui-common/src/telemetryVersion.js.map +1 -1
  10. package/dist/dist-esm/calling-stateful-client/src/CallClientState.d.ts +4 -4
  11. package/dist/dist-esm/calling-stateful-client/src/CallClientState.js.map +1 -1
  12. package/dist/dist-esm/calling-stateful-client/src/CallContext.d.ts +4 -0
  13. package/dist/dist-esm/calling-stateful-client/src/CallContext.js +6 -1
  14. package/dist/dist-esm/calling-stateful-client/src/CallContext.js.map +1 -1
  15. package/dist/dist-esm/calling-stateful-client/src/ReactionSubscriber.d.ts +1 -1
  16. package/dist/dist-esm/calling-stateful-client/src/ReactionSubscriber.js +2 -2
  17. package/dist/dist-esm/calling-stateful-client/src/ReactionSubscriber.js.map +1 -1
  18. package/dist/dist-esm/chat-component-bindings/src/messageThreadSelector.js +20 -20
  19. package/dist/dist-esm/chat-component-bindings/src/messageThreadSelector.js.map +1 -1
  20. package/dist/dist-esm/communication-react/src/index.d.ts +2 -2
  21. package/dist/dist-esm/communication-react/src/index.js +2 -0
  22. package/dist/dist-esm/communication-react/src/index.js.map +1 -1
  23. package/dist/dist-esm/react-components/src/components/AttachmentCard.d.ts +0 -4
  24. package/dist/dist-esm/react-components/src/components/AttachmentCard.js +4 -1
  25. package/dist/dist-esm/react-components/src/components/AttachmentCard.js.map +1 -1
  26. package/dist/dist-esm/react-components/src/components/AttachmentUploadCards.d.ts +5 -36
  27. package/dist/dist-esm/react-components/src/components/AttachmentUploadCards.js +17 -26
  28. package/dist/dist-esm/react-components/src/components/AttachmentUploadCards.js.map +1 -1
  29. package/dist/dist-esm/react-components/src/components/ChatMessage/ChatMessageComponentAsEditBox.js +6 -10
  30. package/dist/dist-esm/react-components/src/components/ChatMessage/ChatMessageComponentAsEditBox.js.map +1 -1
  31. package/dist/dist-esm/react-components/src/components/ChatMessage/ChatMessageComponentAsRichTextEditBox.js +2 -2
  32. package/dist/dist-esm/react-components/src/components/ChatMessage/ChatMessageComponentAsRichTextEditBox.js.map +1 -1
  33. package/dist/dist-esm/react-components/src/components/EndCallButton.d.ts +10 -1
  34. package/dist/dist-esm/react-components/src/components/EndCallButton.js +93 -51
  35. package/dist/dist-esm/react-components/src/components/EndCallButton.js.map +1 -1
  36. package/dist/dist-esm/react-components/src/components/ReactionButton.d.ts +2 -2
  37. package/dist/dist-esm/react-components/src/components/ReactionButton.js +12 -15
  38. package/dist/dist-esm/react-components/src/components/ReactionButton.js.map +1 -1
  39. package/dist/dist-esm/react-components/src/components/RichTextEditor/RichTextInputBoxComponent.d.ts +2 -2
  40. package/dist/dist-esm/react-components/src/components/RichTextEditor/RichTextInputBoxComponent.js +6 -6
  41. package/dist/dist-esm/react-components/src/components/RichTextEditor/RichTextInputBoxComponent.js.map +1 -1
  42. package/dist/dist-esm/react-components/src/components/RichTextEditor/RichTextSendBox.d.ts +6 -6
  43. package/dist/dist-esm/react-components/src/components/RichTextEditor/RichTextSendBox.js +25 -25
  44. package/dist/dist-esm/react-components/src/components/RichTextEditor/RichTextSendBox.js.map +1 -1
  45. package/dist/dist-esm/react-components/src/components/SendBox.d.ts +6 -6
  46. package/dist/dist-esm/react-components/src/components/SendBox.js +18 -18
  47. package/dist/dist-esm/react-components/src/components/SendBox.js.map +1 -1
  48. package/dist/dist-esm/react-components/src/components/VideoEffects/VideoBackgroundEffectsPicker.d.ts +8 -0
  49. package/dist/dist-esm/react-components/src/components/VideoEffects/VideoBackgroundEffectsPicker.js +1 -1
  50. package/dist/dist-esm/react-components/src/components/VideoEffects/VideoBackgroundEffectsPicker.js.map +1 -1
  51. package/dist/dist-esm/react-components/src/components/VideoGallery/ParticipantVideoTileOverlay.js +8 -4
  52. package/dist/dist-esm/react-components/src/components/VideoGallery/ParticipantVideoTileOverlay.js.map +1 -1
  53. package/dist/dist-esm/react-components/src/components/VideoGallery/RemoteContentShareReactionOverlay.js +4 -4
  54. package/dist/dist-esm/react-components/src/components/VideoGallery/RemoteContentShareReactionOverlay.js.map +1 -1
  55. package/dist/dist-esm/react-components/src/components/VideoGallery/utils/videoGalleryLayoutUtils.d.ts +4 -0
  56. package/dist/dist-esm/react-components/src/components/VideoGallery/utils/videoGalleryLayoutUtils.js +22 -1
  57. package/dist/dist-esm/react-components/src/components/VideoGallery/utils/videoGalleryLayoutUtils.js.map +1 -1
  58. package/dist/dist-esm/react-components/src/components/index.d.ts +1 -2
  59. package/dist/dist-esm/react-components/src/components/index.js.map +1 -1
  60. package/dist/dist-esm/react-components/src/components/styles/ReactionButton.styles.d.ts +3 -3
  61. package/dist/dist-esm/react-components/src/components/styles/ReactionButton.styles.js +16 -9
  62. package/dist/dist-esm/react-components/src/components/styles/ReactionButton.styles.js.map +1 -1
  63. package/dist/dist-esm/react-components/src/components/styles/ReactionOverlay.style.d.ts +2 -1
  64. package/dist/dist-esm/react-components/src/components/styles/ReactionOverlay.style.js +10 -12
  65. package/dist/dist-esm/react-components/src/components/styles/ReactionOverlay.style.js.map +1 -1
  66. package/dist/dist-esm/react-components/src/components/styles/SendBox.styles.d.ts +1 -1
  67. package/dist/dist-esm/react-components/src/components/styles/SendBox.styles.js +2 -2
  68. package/dist/dist-esm/react-components/src/components/styles/SendBox.styles.js.map +1 -1
  69. package/dist/dist-esm/react-components/src/components/styles/VideoTile.styles.d.ts +1 -0
  70. package/dist/dist-esm/react-components/src/components/styles/VideoTile.styles.js +3 -1
  71. package/dist/dist-esm/react-components/src/components/styles/VideoTile.styles.js.map +1 -1
  72. package/dist/dist-esm/react-components/src/components/utils/ChatMessageComponentAsEditBoxUtils.d.ts +1 -1
  73. package/dist/dist-esm/react-components/src/components/utils/ChatMessageComponentAsEditBoxUtils.js +2 -2
  74. package/dist/dist-esm/react-components/src/components/utils/ChatMessageComponentAsEditBoxUtils.js.map +1 -1
  75. package/dist/dist-esm/react-components/src/components/utils/ChatMessageComponentUtils.js +4 -3
  76. package/dist/dist-esm/react-components/src/components/utils/ChatMessageComponentUtils.js.map +1 -1
  77. package/dist/dist-esm/react-components/src/components/utils/SendBoxUtils.d.ts +3 -3
  78. package/dist/dist-esm/react-components/src/components/utils/SendBoxUtils.js +7 -7
  79. package/dist/dist-esm/react-components/src/components/utils/SendBoxUtils.js.map +1 -1
  80. package/dist/dist-esm/react-components/src/components/utils/common.d.ts +1 -1
  81. package/dist/dist-esm/react-components/src/components/utils/common.js +1 -1
  82. package/dist/dist-esm/react-components/src/components/utils/common.js.map +1 -1
  83. package/dist/dist-esm/react-components/src/localization/LocalizationProvider.js.map +1 -1
  84. package/dist/dist-esm/react-components/src/localization/locales/en-US/strings.json +3 -1
  85. package/dist/dist-esm/react-components/src/types/Attachment.d.ts +22 -95
  86. package/dist/dist-esm/react-components/src/types/Attachment.js.map +1 -1
  87. package/dist/dist-esm/react-components/src/types/ChatMessage.d.ts +2 -2
  88. package/dist/dist-esm/react-components/src/types/ChatMessage.js.map +1 -1
  89. package/dist/dist-esm/react-composites/src/composites/CallComposite/Strings.d.ts +24 -0
  90. package/dist/dist-esm/react-composites/src/composites/CallComposite/Strings.js.map +1 -1
  91. package/dist/dist-esm/react-composites/src/composites/CallComposite/components/CallArrangement.js +3 -4
  92. package/dist/dist-esm/react-composites/src/composites/CallComposite/components/CallArrangement.js.map +1 -1
  93. package/dist/dist-esm/react-composites/src/composites/CallComposite/components/Prompt.js +0 -7
  94. package/dist/dist-esm/react-composites/src/composites/CallComposite/components/Prompt.js.map +1 -1
  95. package/dist/dist-esm/react-composites/src/composites/CallComposite/components/buttons/EndCall.d.ts +2 -0
  96. package/dist/dist-esm/react-composites/src/composites/CallComposite/components/buttons/EndCall.js +66 -1
  97. package/dist/dist-esm/react-composites/src/composites/CallComposite/components/buttons/EndCall.js.map +1 -1
  98. package/dist/dist-esm/react-composites/src/composites/CallComposite/pages/CallPage.js +1 -3
  99. package/dist/dist-esm/react-composites/src/composites/CallComposite/pages/CallPage.js.map +1 -1
  100. package/dist/dist-esm/react-composites/src/composites/CallWithChatComposite/CallWithChatComposite.d.ts +2 -2
  101. package/dist/dist-esm/react-composites/src/composites/CallWithChatComposite/CallWithChatComposite.js +3 -3
  102. package/dist/dist-esm/react-composites/src/composites/CallWithChatComposite/CallWithChatComposite.js.map +1 -1
  103. package/dist/dist-esm/react-composites/src/composites/CallWithChatComposite/adapter/AzureCommunicationCallWithChatAdapter.d.ts +8 -8
  104. package/dist/dist-esm/react-composites/src/composites/CallWithChatComposite/adapter/AzureCommunicationCallWithChatAdapter.js +21 -21
  105. package/dist/dist-esm/react-composites/src/composites/CallWithChatComposite/adapter/AzureCommunicationCallWithChatAdapter.js.map +1 -1
  106. package/dist/dist-esm/react-composites/src/composites/CallWithChatComposite/adapter/CallWithChatAdapter.d.ts +8 -8
  107. package/dist/dist-esm/react-composites/src/composites/CallWithChatComposite/adapter/CallWithChatAdapter.js.map +1 -1
  108. package/dist/dist-esm/react-composites/src/composites/CallWithChatComposite/adapter/CallWithChatBackedChatAdapter.d.ts +8 -8
  109. package/dist/dist-esm/react-composites/src/composites/CallWithChatComposite/adapter/CallWithChatBackedChatAdapter.js +15 -15
  110. package/dist/dist-esm/react-composites/src/composites/CallWithChatComposite/adapter/CallWithChatBackedChatAdapter.js.map +1 -1
  111. package/dist/dist-esm/react-composites/src/composites/CallWithChatComposite/state/CallWithChatAdapterState.d.ts +3 -3
  112. package/dist/dist-esm/react-composites/src/composites/CallWithChatComposite/state/CallWithChatAdapterState.js +2 -2
  113. package/dist/dist-esm/react-composites/src/composites/CallWithChatComposite/state/CallWithChatAdapterState.js.map +1 -1
  114. package/dist/dist-esm/react-composites/src/composites/ChatComposite/ChatComposite.d.ts +2 -2
  115. package/dist/dist-esm/react-composites/src/composites/ChatComposite/ChatComposite.js +1 -1
  116. package/dist/dist-esm/react-composites/src/composites/ChatComposite/ChatComposite.js.map +1 -1
  117. package/dist/dist-esm/react-composites/src/composites/ChatComposite/ChatScreen.d.ts +2 -33
  118. package/dist/dist-esm/react-composites/src/composites/ChatComposite/ChatScreen.js +26 -18
  119. package/dist/dist-esm/react-composites/src/composites/ChatComposite/ChatScreen.js.map +1 -1
  120. package/dist/dist-esm/react-composites/src/composites/ChatComposite/Strings.d.ts +2 -2
  121. package/dist/dist-esm/react-composites/src/composites/ChatComposite/Strings.js.map +1 -1
  122. package/dist/dist-esm/react-composites/src/composites/ChatComposite/adapter/AzureCommunicationAttachmentUploadAdapter.d.ts +47 -0
  123. package/dist/dist-esm/react-composites/src/composites/ChatComposite/adapter/AzureCommunicationAttachmentUploadAdapter.js +179 -0
  124. package/dist/dist-esm/react-composites/src/composites/ChatComposite/adapter/AzureCommunicationAttachmentUploadAdapter.js.map +1 -0
  125. package/dist/dist-esm/react-composites/src/composites/ChatComposite/adapter/AzureCommunicationChatAdapter.d.ts +9 -9
  126. package/dist/dist-esm/react-composites/src/composites/ChatComposite/adapter/AzureCommunicationChatAdapter.js +30 -30
  127. package/dist/dist-esm/react-composites/src/composites/ChatComposite/adapter/AzureCommunicationChatAdapter.js.map +1 -1
  128. package/dist/dist-esm/react-composites/src/composites/ChatComposite/adapter/ChatAdapter.d.ts +5 -5
  129. package/dist/dist-esm/react-composites/src/composites/ChatComposite/adapter/ChatAdapter.js.map +1 -1
  130. package/dist/dist-esm/react-composites/src/composites/ChatComposite/adapter/ChatAdapterProvider.d.ts +2 -2
  131. package/dist/dist-esm/react-composites/src/composites/ChatComposite/adapter/ChatAdapterProvider.js +8 -8
  132. package/dist/dist-esm/react-composites/src/composites/ChatComposite/adapter/ChatAdapterProvider.js.map +1 -1
  133. package/dist/dist-esm/react-composites/src/composites/ChatComposite/file-sharing/{FileUpload.d.ts → AttachmentUpload.d.ts} +11 -11
  134. package/dist/dist-esm/react-composites/src/composites/ChatComposite/file-sharing/{FileUpload.js → AttachmentUpload.js} +13 -13
  135. package/dist/dist-esm/react-composites/src/composites/ChatComposite/file-sharing/AttachmentUpload.js.map +1 -0
  136. package/dist/dist-esm/react-composites/src/composites/ChatComposite/file-sharing/AttachmentUploadButton.d.ts +38 -0
  137. package/dist/dist-esm/react-composites/src/composites/ChatComposite/file-sharing/{FileUploadButton.js → AttachmentUploadButton.js} +14 -12
  138. package/dist/dist-esm/react-composites/src/composites/ChatComposite/file-sharing/AttachmentUploadButton.js.map +1 -0
  139. package/dist/dist-esm/react-composites/src/composites/ChatComposite/file-sharing/index.d.ts +4 -4
  140. package/dist/dist-esm/react-composites/src/composites/ChatComposite/file-sharing/index.js +2 -2
  141. package/dist/dist-esm/react-composites/src/composites/ChatComposite/file-sharing/index.js.map +1 -1
  142. package/dist/dist-esm/react-composites/src/composites/ChatComposite/index.d.ts +2 -3
  143. package/dist/dist-esm/react-composites/src/composites/ChatComposite/index.js.map +1 -1
  144. package/dist/dist-esm/react-composites/src/composites/ChatComposite/selectors/attachmentUploadsSelector.d.ts +29 -0
  145. package/dist/dist-esm/react-composites/src/composites/ChatComposite/selectors/attachmentUploadsSelector.js +12 -0
  146. package/dist/dist-esm/react-composites/src/composites/ChatComposite/selectors/attachmentUploadsSelector.js.map +1 -0
  147. package/dist/dist-esm/react-composites/src/composites/ChatComposite/selectors/baseSelectors.d.ts +2 -2
  148. package/dist/dist-esm/react-composites/src/composites/ChatComposite/selectors/baseSelectors.js +2 -2
  149. package/dist/dist-esm/react-composites/src/composites/ChatComposite/selectors/baseSelectors.js.map +1 -1
  150. package/dist/dist-esm/react-composites/src/composites/common/ControlBar/CommonCallControlBar.js +26 -9
  151. package/dist/dist-esm/react-composites/src/composites/common/ControlBar/CommonCallControlBar.js.map +1 -1
  152. package/dist/dist-esm/react-composites/src/composites/common/Drawer/MoreDrawer.js +6 -2
  153. package/dist/dist-esm/react-composites/src/composites/common/Drawer/MoreDrawer.js.map +1 -1
  154. package/dist/dist-esm/react-composites/src/composites/common/SendBox.js +5 -5
  155. package/dist/dist-esm/react-composites/src/composites/common/SendBox.js.map +1 -1
  156. package/dist/dist-esm/react-composites/src/composites/common/types/CommonCallControlOptions.d.ts +8 -2
  157. package/dist/dist-esm/react-composites/src/composites/common/types/CommonCallControlOptions.js.map +1 -1
  158. package/dist/dist-esm/react-composites/src/composites/common/utils.d.ts +4 -0
  159. package/dist/dist-esm/react-composites/src/composites/common/utils.js +6 -0
  160. package/dist/dist-esm/react-composites/src/composites/common/utils.js.map +1 -1
  161. package/dist/dist-esm/react-composites/src/composites/localization/locales/ar-SA/strings.json +1 -1
  162. package/dist/dist-esm/react-composites/src/composites/localization/locales/cs-CZ/strings.json +1 -1
  163. package/dist/dist-esm/react-composites/src/composites/localization/locales/de-DE/strings.json +1 -1
  164. package/dist/dist-esm/react-composites/src/composites/localization/locales/en-GB/strings.json +1 -1
  165. package/dist/dist-esm/react-composites/src/composites/localization/locales/en-US/strings.json +7 -1
  166. package/dist/dist-esm/react-composites/src/composites/localization/locales/es-ES/strings.json +1 -1
  167. package/dist/dist-esm/react-composites/src/composites/localization/locales/fi-FI/strings.json +1 -1
  168. package/dist/dist-esm/react-composites/src/composites/localization/locales/fr-FR/strings.json +1 -1
  169. package/dist/dist-esm/react-composites/src/composites/localization/locales/he-IL/strings.json +1 -1
  170. package/dist/dist-esm/react-composites/src/composites/localization/locales/it-IT/strings.json +1 -1
  171. package/dist/dist-esm/react-composites/src/composites/localization/locales/ja-JP/strings.json +1 -1
  172. package/dist/dist-esm/react-composites/src/composites/localization/locales/ko-KR/strings.json +1 -1
  173. package/dist/dist-esm/react-composites/src/composites/localization/locales/nb-NO/strings.json +1 -1
  174. package/dist/dist-esm/react-composites/src/composites/localization/locales/nl-NL/strings.json +1 -1
  175. package/dist/dist-esm/react-composites/src/composites/localization/locales/pl-PL/strings.json +1 -1
  176. package/dist/dist-esm/react-composites/src/composites/localization/locales/pt-BR/strings.json +1 -1
  177. package/dist/dist-esm/react-composites/src/composites/localization/locales/ru-RU/strings.json +1 -1
  178. package/dist/dist-esm/react-composites/src/composites/localization/locales/sv-SE/strings.json +1 -1
  179. package/dist/dist-esm/react-composites/src/composites/localization/locales/tr-TR/strings.json +1 -1
  180. package/dist/dist-esm/react-composites/src/composites/localization/locales/zh-CN/strings.json +1 -1
  181. package/dist/dist-esm/react-composites/src/composites/localization/locales/zh-TW/strings.json +1 -1
  182. package/package.json +7 -7
  183. package/dist/dist-cjs/communication-react/index-qxnuqL7s.js.map +0 -1
  184. package/dist/dist-esm/react-composites/src/composites/ChatComposite/adapter/AzureCommunicationFileUploadAdapter.d.ts +0 -48
  185. package/dist/dist-esm/react-composites/src/composites/ChatComposite/adapter/AzureCommunicationFileUploadAdapter.js +0 -160
  186. package/dist/dist-esm/react-composites/src/composites/ChatComposite/adapter/AzureCommunicationFileUploadAdapter.js.map +0 -1
  187. package/dist/dist-esm/react-composites/src/composites/ChatComposite/file-sharing/FileUpload.js.map +0 -1
  188. package/dist/dist-esm/react-composites/src/composites/ChatComposite/file-sharing/FileUploadButton.d.ts +0 -36
  189. package/dist/dist-esm/react-composites/src/composites/ChatComposite/file-sharing/FileUploadButton.js.map +0 -1
  190. package/dist/dist-esm/react-composites/src/composites/ChatComposite/selectors/fileUploadsSelector.d.ts +0 -27
  191. package/dist/dist-esm/react-composites/src/composites/ChatComposite/selectors/fileUploadsSelector.js +0 -12
  192. package/dist/dist-esm/react-composites/src/composites/ChatComposite/selectors/fileUploadsSelector.js.map +0 -1
@@ -1 +1 @@
1
- {"version":3,"file":"ParticipantVideoTileOverlay.js","sourceRoot":"","sources":["../../../../../../../react-components/src/components/VideoGallery/ParticipantVideoTileOverlay.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\n/* @conditional-compile-remove(reaction) */\nimport React, { useCallback, useEffect, useState } from 'react';\n/* @conditional-compile-remove(reaction) */\nimport { Reaction, ReactionResources } from '../../types';\n/* @conditional-compile-remove(reaction) */\nimport { getEmojiResource } from './utils/videoGalleryLayoutUtils';\n/* @conditional-compile-remove(reaction) */\nimport { Stack, mergeStyles } from '@fluentui/react';\n/* @conditional-compile-remove(reaction) */\nimport { reactionRenderingStyle, videoContainerStyles } from '../styles/VideoTile.styles';\n/* @conditional-compile-remove(reaction) */\nimport {\n REACTION_SCREEN_SHARE_ANIMATION_TIME_MS,\n REACTION_START_DISPLAY_SIZE,\n getReceivedUnixTime\n} from './utils/reactionUtils';\n\n/* @conditional-compile-remove(reaction) */\n/**\n * Reaction overlay component for Grid\n *\n * Can be used with {@link MeetingReactionOverlay}.\n *\n * @internal\n */\nexport const ParticipantVideoTileOverlay = React.memo(\n (props: { reaction?: Reaction; reactionResources: ReactionResources; emojiSize?: number }) => {\n const { reaction, reactionResources, emojiSize = REACTION_START_DISPLAY_SIZE } = props;\n const [isValidImageSource, setIsValidImageSource] = useState<boolean>(false);\n\n const backgroundImageUrl =\n reaction !== undefined && reactionResources !== undefined\n ? getEmojiResource(reaction?.reactionType, reactionResources)\n : '';\n\n const currentUnixTimeStamp = Date.now();\n const receivedUnixTimestamp = reaction ? getReceivedUnixTime(reaction.receivedOn) : undefined;\n const canRenderReaction =\n (receivedUnixTimestamp\n ? currentUnixTimeStamp - receivedUnixTimestamp < REACTION_SCREEN_SHARE_ANIMATION_TIME_MS\n : false) && backgroundImageUrl !== undefined;\n\n useEffect(() => {\n if (!backgroundImageUrl || backgroundImageUrl.length === 0) {\n return;\n }\n\n fetch(`${backgroundImageUrl}`)\n .then((res) => {\n setIsValidImageSource(res.ok);\n })\n .catch((warning) => console.warn(`Sprite image for animation rendering failed with warning: ${warning}`));\n\n return () => setIsValidImageSource(false);\n }, [backgroundImageUrl]);\n\n const spriteImageUrl = backgroundImageUrl ?? undefined;\n const reactionContainerStyles = useCallback(\n () =>\n reactionRenderingStyle({\n spriteImageUrl,\n emojiSize: emojiSize\n }),\n [spriteImageUrl, emojiSize]\n );\n\n return (\n <Stack\n className={mergeStyles(videoContainerStyles, {\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n backgroundColor: canRenderReaction ? 'rgba(0, 0, 0, 0.5)' : 'transparent'\n })}\n >\n <div style={{ height: '33.33%' }}></div>\n {canRenderReaction && isValidImageSource && (\n <div style={{ minHeight: '84px', height: '84px', width: '84px' }}>\n <div className={reactionContainerStyles()} />\n </div>\n )}\n </Stack>\n );\n }\n);\n"]}
1
+ {"version":3,"file":"ParticipantVideoTileOverlay.js","sourceRoot":"","sources":["../../../../../../../react-components/src/components/VideoGallery/ParticipantVideoTileOverlay.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\n/* @conditional-compile-remove(reaction) */\nimport React, { useCallback, useEffect, useState } from 'react';\n/* @conditional-compile-remove(reaction) */\nimport { Reaction, ReactionResources } from '../../types';\n/* @conditional-compile-remove(reaction) */\nimport { getEmojiFrameCount, getEmojiResource } from './utils/videoGalleryLayoutUtils';\n/* @conditional-compile-remove(reaction) */\nimport { Stack, mergeStyles } from '@fluentui/react';\n/* @conditional-compile-remove(reaction) */\nimport { reactionRenderingStyle, videoContainerStyles } from '../styles/VideoTile.styles';\n/* @conditional-compile-remove(reaction) */\nimport {\n REACTION_SCREEN_SHARE_ANIMATION_TIME_MS,\n REACTION_START_DISPLAY_SIZE,\n getReceivedUnixTime\n} from './utils/reactionUtils';\n\n/* @conditional-compile-remove(reaction) */\n/**\n * Reaction overlay component for Grid\n *\n * Can be used with {@link MeetingReactionOverlay}.\n *\n * @internal\n */\nexport const ParticipantVideoTileOverlay = React.memo(\n (props: { reaction?: Reaction; reactionResources: ReactionResources; emojiSize?: number }) => {\n const { reaction, reactionResources, emojiSize = REACTION_START_DISPLAY_SIZE } = props;\n const [isValidImageSource, setIsValidImageSource] = useState<boolean>(false);\n\n const backgroundImageUrl =\n reaction !== undefined && reactionResources !== undefined\n ? getEmojiResource(reaction?.reactionType, reactionResources)\n : undefined;\n\n const frameCount =\n reaction !== undefined && reactionResources !== undefined\n ? getEmojiFrameCount(reaction?.reactionType, reactionResources)\n : undefined;\n\n const currentUnixTimeStamp = Date.now();\n const receivedUnixTimestamp = reaction ? getReceivedUnixTime(reaction.receivedOn) : undefined;\n const canRenderReaction =\n (receivedUnixTimestamp\n ? currentUnixTimeStamp - receivedUnixTimestamp < REACTION_SCREEN_SHARE_ANIMATION_TIME_MS\n : false) && backgroundImageUrl !== undefined;\n\n useEffect(() => {\n if (!backgroundImageUrl || backgroundImageUrl.length === 0) {\n return;\n }\n\n fetch(`${backgroundImageUrl}`)\n .then((res) => {\n setIsValidImageSource(res.ok);\n })\n .catch((warning) => console.warn(`Sprite image for animation rendering failed with warning: ${warning}`));\n\n return () => setIsValidImageSource(false);\n }, [backgroundImageUrl]);\n\n const spriteImageUrl = backgroundImageUrl ?? undefined;\n const reactionContainerStyles = useCallback(\n () =>\n reactionRenderingStyle({\n spriteImageUrl,\n emojiSize: emojiSize,\n frameCount\n }),\n [spriteImageUrl, emojiSize, frameCount]\n );\n\n return (\n <Stack\n className={mergeStyles(videoContainerStyles, {\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n backgroundColor: canRenderReaction ? 'rgba(0, 0, 0, 0.5)' : 'transparent'\n })}\n >\n <div style={{ height: '33.33%' }}></div>\n {canRenderReaction && isValidImageSource && (\n <div style={{ minHeight: '84px', height: '84px', width: '84px' }}>\n <div className={reactionContainerStyles()} />\n </div>\n )}\n </Stack>\n );\n }\n);\n"]}
@@ -78,7 +78,7 @@ export const RemoteContentShareReactionOverlay = React.memo((props) => {
78
78
  reaction: reaction,
79
79
  id: combinedKey,
80
80
  reactionMovementIndex: reactionMovementIndex,
81
- styleBucket: getReactionStyleBucket(reactionMovementIndex)
81
+ styleBucket: getReactionStyleBucket()
82
82
  }
83
83
  ]);
84
84
  return;
@@ -119,8 +119,8 @@ export const RemoteContentShareReactionOverlay = React.memo((props) => {
119
119
  };
120
120
  const containerHeight = hostDivHeight !== null && hostDivHeight !== void 0 ? hostDivHeight : 0;
121
121
  const containerWidth = hostDivWidth !== null && hostDivWidth !== void 0 ? hostDivWidth : 0;
122
- const styleBucket = (activeSprites) => getReactionStyleBucket(activeSprites);
123
- const displaySizePx = (activeSprites) => REACTION_START_DISPLAY_SIZE * styleBucket(activeSprites).sizeScale;
122
+ const styleBucket = () => getReactionStyleBucket();
123
+ const displaySizePx = () => REACTION_START_DISPLAY_SIZE * styleBucket().sizeScale;
124
124
  const leftPosition = (position) => generateStartPositionWave(position, containerWidth / 2, true);
125
125
  const reactionMovementStyle = (position) => getReactionMovementStyle(leftPosition(position));
126
126
  return (React.createElement(Stack, { className: mergeStyles(videoContainerStyles, {
@@ -143,7 +143,7 @@ export const RemoteContentShareReactionOverlay = React.memo((props) => {
143
143
  removeVisibleReaction(reaction.reaction.reactionType, reaction.id, reaction.reactionMovementIndex);
144
144
  }, style: opacityAnimationStyles(reaction.styleBucket.opacityMax) },
145
145
  React.createElement("div", { style: reactionMovementStyle(reaction.reactionMovementIndex) },
146
- React.createElement("div", { style: spriteAnimationStyles(REACTION_NUMBER_OF_ANIMATION_FRAMES, displaySizePx(visibleReactions.length), (_a = getEmojiResource(reaction === null || reaction === void 0 ? void 0 : reaction.reaction.reactionType, reactionResources)) !== null && _a !== void 0 ? _a : '') }))))))));
146
+ React.createElement("div", { style: spriteAnimationStyles(REACTION_NUMBER_OF_ANIMATION_FRAMES, displaySizePx(), (_a = getEmojiResource(reaction === null || reaction === void 0 ? void 0 : reaction.reaction.reactionType, reactionResources)) !== null && _a !== void 0 ? _a : '') }))))))));
147
147
  })));
148
148
  });
149
149
  //# sourceMappingURL=RemoteContentShareReactionOverlay.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"RemoteContentShareReactionOverlay.js","sourceRoot":"","sources":["../../../../../../../react-components/src/components/VideoGallery/RemoteContentShareReactionOverlay.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\n/* @conditional-compile-remove(reaction) */\nimport React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';\n/* @conditional-compile-remove(reaction) */\nimport { Reaction, ReactionResources, VideoGalleryLocalParticipant, VideoGalleryRemoteParticipant } from '../../types';\n/* @conditional-compile-remove(reaction) */\nimport { Stack, mergeStyles } from '@fluentui/react';\n/* @conditional-compile-remove(reaction) */\nimport { videoContainerStyles } from '../styles/VideoTile.styles';\n/* @conditional-compile-remove(reaction) */\nimport { getEmojiResource } from './utils/videoGalleryLayoutUtils';\n/* @conditional-compile-remove(reaction) */\nimport {\n IReactionStyleBucket,\n generateStartPositionWave,\n getReactionMovementStyle,\n getReactionStyleBucket,\n moveAnimationStyles,\n opacityAnimationStyles,\n reactionOverlayStyle,\n spriteAnimationStyles\n} from '../styles/ReactionOverlay.style';\n/* @conditional-compile-remove(reaction) */\nimport {\n REACTION_NUMBER_OF_ANIMATION_FRAMES,\n REACTION_SCREEN_SHARE_ANIMATION_TIME_MS,\n REACTION_START_DISPLAY_SIZE,\n getCombinedKey,\n getReceivedUnixTime\n} from './utils/reactionUtils';\n\n/* @conditional-compile-remove(reaction) */\ntype VisibleReaction = {\n reaction: Reaction;\n id: string;\n reactionMovementIndex: number;\n styleBucket: IReactionStyleBucket;\n};\n\n/* @conditional-compile-remove(reaction) */\ntype ReceivedReaction = {\n id: string;\n status: 'animating' | 'completedAnimating' | 'ignored';\n};\n\n/* @conditional-compile-remove(reaction) */\nconst MAX_NUMBER_OF_EMOJIS = 50;\n/* @conditional-compile-remove(reaction) */\nconst NUMBER_OF_EMOJI_TYPES = 5;\n/* @conditional-compile-remove(reaction) */\nconst REACTION_POSITION_ARRAY_SIZE = 55;\n\n/* @conditional-compile-remove(reaction) */\n/**\n * The overlay responsible for rendering multiple reactions all at once in presentation mode\n * @internal\n */\nexport const RemoteContentShareReactionOverlay = React.memo(\n (props: {\n reactionResources: ReactionResources;\n localParticipant?: VideoGalleryLocalParticipant;\n remoteParticipants?: VideoGalleryRemoteParticipant[];\n hostDivHeight?: number;\n hostDivWidth?: number;\n }) => {\n const { reactionResources, localParticipant, remoteParticipants, hostDivHeight, hostDivWidth } = props;\n\n // Reactions that are currently being animated\n const [visibleReactions, setVisibleReactions] = useState<VisibleReaction[]>([]);\n\n // Dictionary of userId to a reaction status. This is used to track the latest received reaction\n // per user to avoid animating the same reaction multiple times and to limit the number of\n // active reactions of a certain type.\n const latestReceivedReaction = useRef<Record<string, ReceivedReaction>>({});\n\n // Track the number of active reactions of each type to limit the number of active reactions\n // of a certain type.\n const activeTypeCount = useRef<Record<string, number>>({\n like: 0,\n heart: 0,\n laugh: 0,\n applause: 0,\n surprised: 0\n });\n\n // Used to track the total number of reactions ever played. This is a helper variable\n // to calculate the reaction movement index (i.e. the .left position of the reaction)\n const visibleReactionPosition = useRef<boolean[]>(new Array<boolean>(REACTION_POSITION_ARRAY_SIZE).fill(false));\n\n const remoteParticipantReactions: Reaction[] = useMemo(\n () =>\n remoteParticipants\n ?.map((remoteParticipant) => remoteParticipant.reaction)\n .filter((reaction): reaction is Reaction => !!reaction) ?? [],\n [remoteParticipants]\n );\n\n const findFirstEmptyPosition = (): number => {\n return visibleReactionPosition.current.findIndex((item) => item === false);\n };\n\n const updateVisibleReactions = useCallback(\n (reaction: Reaction, userId: string): void => {\n const combinedKey = getCombinedKey(userId, reaction.reactionType, reaction.receivedOn);\n\n const alreadyHandled = latestReceivedReaction.current[userId]?.id === combinedKey;\n if (alreadyHandled) {\n return;\n }\n\n const activeCount = activeTypeCount.current[reaction.reactionType];\n\n if (activeCount >= MAX_NUMBER_OF_EMOJIS / NUMBER_OF_EMOJI_TYPES) {\n latestReceivedReaction.current[userId] = {\n id: combinedKey,\n status: 'ignored'\n };\n return;\n }\n\n activeTypeCount.current[reaction.reactionType] += 1;\n latestReceivedReaction.current[userId] = {\n id: combinedKey,\n status: 'animating'\n };\n const reactionMovementIndex = findFirstEmptyPosition();\n visibleReactionPosition.current[reactionMovementIndex] = true;\n setVisibleReactions([\n ...visibleReactions,\n {\n reaction: reaction,\n id: combinedKey,\n reactionMovementIndex: reactionMovementIndex,\n styleBucket: getReactionStyleBucket(reactionMovementIndex)\n }\n ]);\n return;\n },\n [activeTypeCount, visibleReactions]\n );\n\n const removeVisibleReaction = (reactionType: string, id: string, index: number): void => {\n setVisibleReactions(visibleReactions.filter((reaction) => reaction.id !== id));\n visibleReactionPosition.current[index] = false;\n activeTypeCount.current[reactionType] -= 1;\n Object.entries(latestReceivedReaction.current).forEach(([userId, reaction]) => {\n if (reaction.id === id) {\n latestReceivedReaction.current[userId].status = 'completedAnimating';\n }\n });\n };\n\n // Update visible reactions when local participant sends a reaction\n useEffect(() => {\n if (localParticipant?.reaction) {\n updateVisibleReactions(localParticipant.reaction, localParticipant.userId);\n }\n }, [localParticipant, updateVisibleReactions]);\n\n // Update visible reactions when remote participants send a reaction\n useEffect(() => {\n remoteParticipants?.map((participant) => {\n if (participant?.reaction) {\n updateVisibleReactions(participant.reaction, participant.userId);\n }\n });\n }, [remoteParticipantReactions, remoteParticipants, updateVisibleReactions]);\n\n // Note: canRenderReaction shouldn't be needed as we remove the animation on the onAnimationEnd event\n const canRenderReaction = (reaction: Reaction, id: string, movementIndex: number): boolean => {\n // compare current time to reaction.received at and see if more than 4 seconds has elapsed\n const canRender = Date.now() - getReceivedUnixTime(reaction.receivedOn) < REACTION_SCREEN_SHARE_ANIMATION_TIME_MS;\n\n // Clean up the reaction if it's not in the visible reaction list\n if (!canRender) {\n removeVisibleReaction(reaction?.reactionType, id, movementIndex);\n }\n\n return canRender;\n };\n\n const containerHeight = hostDivHeight ?? 0;\n const containerWidth = hostDivWidth ?? 0;\n\n const styleBucket = (activeSprites: number): IReactionStyleBucket => getReactionStyleBucket(activeSprites);\n const displaySizePx = (activeSprites: number): number =>\n REACTION_START_DISPLAY_SIZE * styleBucket(activeSprites).sizeScale;\n\n const leftPosition = (position: number): number => generateStartPositionWave(position, containerWidth / 2, true);\n const reactionMovementStyle = (position: number): React.CSSProperties =>\n getReactionMovementStyle(leftPosition(position));\n\n return (\n <Stack\n className={mergeStyles(videoContainerStyles, {\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n backgroundColor: 'transparent'\n })}\n >\n {visibleReactions.map((reaction) => (\n <div key={reaction.id} style={reactionOverlayStyle}>\n <div className=\"reaction-item\">\n {canRenderReaction(reaction.reaction, reaction.id, reaction.reactionMovementIndex) && (\n // First div - Section that fixes the travel height and applies the movement animation\n // Second div - Keeps track of active sprites and responsible for marking, counting\n // and removing reactions. Responsible for opacity controls as the sprite emoji animates\n // Third div - Responsible for calculating the point of X axis where the reaction will start animation\n // Fourth div - Play Animation as the other animation applies on the base play animation for the sprite\n <div\n style={moveAnimationStyles(\n containerHeight / 2, // dividing by two because reactionOverlayStyle height is set to 50%\n (containerHeight / 2) * (1 - reaction.styleBucket.heightMaxScale)\n )}\n >\n <div\n onAnimationEnd={() => {\n removeVisibleReaction(\n reaction.reaction.reactionType,\n reaction.id,\n reaction.reactionMovementIndex\n );\n }}\n style={opacityAnimationStyles(reaction.styleBucket.opacityMax)}\n >\n <div style={reactionMovementStyle(reaction.reactionMovementIndex)}>\n <div\n style={spriteAnimationStyles(\n REACTION_NUMBER_OF_ANIMATION_FRAMES,\n displaySizePx(visibleReactions.length),\n getEmojiResource(reaction?.reaction.reactionType, reactionResources) ?? ''\n )}\n />\n </div>\n </div>\n </div>\n )}\n </div>\n </div>\n ))}\n </Stack>\n );\n }\n);\n"]}
1
+ {"version":3,"file":"RemoteContentShareReactionOverlay.js","sourceRoot":"","sources":["../../../../../../../react-components/src/components/VideoGallery/RemoteContentShareReactionOverlay.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\n/* @conditional-compile-remove(reaction) */\nimport React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';\n/* @conditional-compile-remove(reaction) */\nimport { Reaction, ReactionResources, VideoGalleryLocalParticipant, VideoGalleryRemoteParticipant } from '../../types';\n/* @conditional-compile-remove(reaction) */\nimport { Stack, mergeStyles } from '@fluentui/react';\n/* @conditional-compile-remove(reaction) */\nimport { videoContainerStyles } from '../styles/VideoTile.styles';\n/* @conditional-compile-remove(reaction) */\nimport { getEmojiResource } from './utils/videoGalleryLayoutUtils';\n/* @conditional-compile-remove(reaction) */\nimport {\n IReactionStyleBucket,\n generateStartPositionWave,\n getReactionMovementStyle,\n getReactionStyleBucket,\n moveAnimationStyles,\n opacityAnimationStyles,\n reactionOverlayStyle,\n spriteAnimationStyles\n} from '../styles/ReactionOverlay.style';\n/* @conditional-compile-remove(reaction) */\nimport {\n REACTION_NUMBER_OF_ANIMATION_FRAMES,\n REACTION_SCREEN_SHARE_ANIMATION_TIME_MS,\n REACTION_START_DISPLAY_SIZE,\n getCombinedKey,\n getReceivedUnixTime\n} from './utils/reactionUtils';\n\n/* @conditional-compile-remove(reaction) */\ntype VisibleReaction = {\n reaction: Reaction;\n id: string;\n reactionMovementIndex: number;\n styleBucket: IReactionStyleBucket;\n};\n\n/* @conditional-compile-remove(reaction) */\ntype ReceivedReaction = {\n id: string;\n status: 'animating' | 'completedAnimating' | 'ignored';\n};\n\n/* @conditional-compile-remove(reaction) */\nconst MAX_NUMBER_OF_EMOJIS = 50;\n/* @conditional-compile-remove(reaction) */\nconst NUMBER_OF_EMOJI_TYPES = 5;\n/* @conditional-compile-remove(reaction) */\nconst REACTION_POSITION_ARRAY_SIZE = 55;\n\n/* @conditional-compile-remove(reaction) */\n/**\n * The overlay responsible for rendering multiple reactions all at once in presentation mode\n * @internal\n */\nexport const RemoteContentShareReactionOverlay = React.memo(\n (props: {\n reactionResources: ReactionResources;\n localParticipant?: VideoGalleryLocalParticipant;\n remoteParticipants?: VideoGalleryRemoteParticipant[];\n hostDivHeight?: number;\n hostDivWidth?: number;\n }) => {\n const { reactionResources, localParticipant, remoteParticipants, hostDivHeight, hostDivWidth } = props;\n\n // Reactions that are currently being animated\n const [visibleReactions, setVisibleReactions] = useState<VisibleReaction[]>([]);\n\n // Dictionary of userId to a reaction status. This is used to track the latest received reaction\n // per user to avoid animating the same reaction multiple times and to limit the number of\n // active reactions of a certain type.\n const latestReceivedReaction = useRef<Record<string, ReceivedReaction>>({});\n\n // Track the number of active reactions of each type to limit the number of active reactions\n // of a certain type.\n const activeTypeCount = useRef<Record<string, number>>({\n like: 0,\n heart: 0,\n laugh: 0,\n applause: 0,\n surprised: 0\n });\n\n // Used to track the total number of reactions ever played. This is a helper variable\n // to calculate the reaction movement index (i.e. the .left position of the reaction)\n const visibleReactionPosition = useRef<boolean[]>(new Array<boolean>(REACTION_POSITION_ARRAY_SIZE).fill(false));\n\n const remoteParticipantReactions: Reaction[] = useMemo(\n () =>\n remoteParticipants\n ?.map((remoteParticipant) => remoteParticipant.reaction)\n .filter((reaction): reaction is Reaction => !!reaction) ?? [],\n [remoteParticipants]\n );\n\n const findFirstEmptyPosition = (): number => {\n return visibleReactionPosition.current.findIndex((item) => item === false);\n };\n\n const updateVisibleReactions = useCallback(\n (reaction: Reaction, userId: string): void => {\n const combinedKey = getCombinedKey(userId, reaction.reactionType, reaction.receivedOn);\n\n const alreadyHandled = latestReceivedReaction.current[userId]?.id === combinedKey;\n if (alreadyHandled) {\n return;\n }\n\n const activeCount = activeTypeCount.current[reaction.reactionType];\n\n if (activeCount >= MAX_NUMBER_OF_EMOJIS / NUMBER_OF_EMOJI_TYPES) {\n latestReceivedReaction.current[userId] = {\n id: combinedKey,\n status: 'ignored'\n };\n return;\n }\n\n activeTypeCount.current[reaction.reactionType] += 1;\n latestReceivedReaction.current[userId] = {\n id: combinedKey,\n status: 'animating'\n };\n const reactionMovementIndex = findFirstEmptyPosition();\n visibleReactionPosition.current[reactionMovementIndex] = true;\n setVisibleReactions([\n ...visibleReactions,\n {\n reaction: reaction,\n id: combinedKey,\n reactionMovementIndex: reactionMovementIndex,\n styleBucket: getReactionStyleBucket()\n }\n ]);\n return;\n },\n [activeTypeCount, visibleReactions]\n );\n\n const removeVisibleReaction = (reactionType: string, id: string, index: number): void => {\n setVisibleReactions(visibleReactions.filter((reaction) => reaction.id !== id));\n visibleReactionPosition.current[index] = false;\n activeTypeCount.current[reactionType] -= 1;\n Object.entries(latestReceivedReaction.current).forEach(([userId, reaction]) => {\n if (reaction.id === id) {\n latestReceivedReaction.current[userId].status = 'completedAnimating';\n }\n });\n };\n\n // Update visible reactions when local participant sends a reaction\n useEffect(() => {\n if (localParticipant?.reaction) {\n updateVisibleReactions(localParticipant.reaction, localParticipant.userId);\n }\n }, [localParticipant, updateVisibleReactions]);\n\n // Update visible reactions when remote participants send a reaction\n useEffect(() => {\n remoteParticipants?.map((participant) => {\n if (participant?.reaction) {\n updateVisibleReactions(participant.reaction, participant.userId);\n }\n });\n }, [remoteParticipantReactions, remoteParticipants, updateVisibleReactions]);\n\n // Note: canRenderReaction shouldn't be needed as we remove the animation on the onAnimationEnd event\n const canRenderReaction = (reaction: Reaction, id: string, movementIndex: number): boolean => {\n // compare current time to reaction.received at and see if more than 4 seconds has elapsed\n const canRender = Date.now() - getReceivedUnixTime(reaction.receivedOn) < REACTION_SCREEN_SHARE_ANIMATION_TIME_MS;\n\n // Clean up the reaction if it's not in the visible reaction list\n if (!canRender) {\n removeVisibleReaction(reaction?.reactionType, id, movementIndex);\n }\n\n return canRender;\n };\n\n const containerHeight = hostDivHeight ?? 0;\n const containerWidth = hostDivWidth ?? 0;\n\n const styleBucket = (): IReactionStyleBucket => getReactionStyleBucket();\n const displaySizePx = (): number => REACTION_START_DISPLAY_SIZE * styleBucket().sizeScale;\n\n const leftPosition = (position: number): number => generateStartPositionWave(position, containerWidth / 2, true);\n const reactionMovementStyle = (position: number): React.CSSProperties =>\n getReactionMovementStyle(leftPosition(position));\n\n return (\n <Stack\n className={mergeStyles(videoContainerStyles, {\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n backgroundColor: 'transparent'\n })}\n >\n {visibleReactions.map((reaction) => (\n <div key={reaction.id} style={reactionOverlayStyle}>\n <div className=\"reaction-item\">\n {canRenderReaction(reaction.reaction, reaction.id, reaction.reactionMovementIndex) && (\n // First div - Section that fixes the travel height and applies the movement animation\n // Second div - Keeps track of active sprites and responsible for marking, counting\n // and removing reactions. Responsible for opacity controls as the sprite emoji animates\n // Third div - Responsible for calculating the point of X axis where the reaction will start animation\n // Fourth div - Play Animation as the other animation applies on the base play animation for the sprite\n <div\n style={moveAnimationStyles(\n containerHeight / 2, // dividing by two because reactionOverlayStyle height is set to 50%\n (containerHeight / 2) * (1 - reaction.styleBucket.heightMaxScale)\n )}\n >\n <div\n onAnimationEnd={() => {\n removeVisibleReaction(\n reaction.reaction.reactionType,\n reaction.id,\n reaction.reactionMovementIndex\n );\n }}\n style={opacityAnimationStyles(reaction.styleBucket.opacityMax)}\n >\n <div style={reactionMovementStyle(reaction.reactionMovementIndex)}>\n <div\n style={spriteAnimationStyles(\n REACTION_NUMBER_OF_ANIMATION_FRAMES,\n displaySizePx(),\n getEmojiResource(reaction?.reaction.reactionType, reactionResources) ?? ''\n )}\n />\n </div>\n </div>\n </div>\n )}\n </div>\n </div>\n ))}\n </Stack>\n );\n }\n);\n"]}
@@ -35,4 +35,8 @@ export declare const useOrganizedParticipants: (props: OrganizedParticipantsArgs
35
35
  * @private
36
36
  */
37
37
  export declare const getEmojiResource: (reactionName: string, reactionResources: ReactionResources) => string | undefined;
38
+ /**
39
+ * @private
40
+ */
41
+ export declare const getEmojiFrameCount: (reactionName: string, reactionResources: ReactionResources) => number;
38
42
  //# sourceMappingURL=videoGalleryLayoutUtils.d.ts.map
@@ -164,6 +164,27 @@ export const getEmojiResource = (reactionName, reactionResources) => {
164
164
  case 'surprised':
165
165
  return (_e = reactionResources.surprisedReaction) === null || _e === void 0 ? void 0 : _e.url;
166
166
  }
167
- return '';
167
+ return undefined;
168
+ };
169
+ /* @conditional-compile-remove(reaction) */
170
+ /**
171
+ * @private
172
+ */
173
+ export const getEmojiFrameCount = (reactionName, reactionResources) => {
174
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
175
+ switch (reactionName) {
176
+ case 'like':
177
+ return (_b = (_a = reactionResources.likeReaction) === null || _a === void 0 ? void 0 : _a.frameCount) !== null && _b !== void 0 ? _b : 0;
178
+ case 'heart':
179
+ return (_d = (_c = reactionResources.heartReaction) === null || _c === void 0 ? void 0 : _c.frameCount) !== null && _d !== void 0 ? _d : 0;
180
+ case 'laugh':
181
+ return (_f = (_e = reactionResources.laughReaction) === null || _e === void 0 ? void 0 : _e.frameCount) !== null && _f !== void 0 ? _f : 0;
182
+ case 'applause':
183
+ return (_h = (_g = reactionResources.applauseReaction) === null || _g === void 0 ? void 0 : _g.frameCount) !== null && _h !== void 0 ? _h : 0;
184
+ case 'surprised':
185
+ return (_k = (_j = reactionResources.surprisedReaction) === null || _j === void 0 ? void 0 : _j.frameCount) !== null && _k !== void 0 ? _k : 0;
186
+ default:
187
+ return 0;
188
+ }
168
189
  };
169
190
  //# sourceMappingURL=videoGalleryLayoutUtils.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"videoGalleryLayoutUtils.js","sourceRoot":"","sources":["../../../../../../../../react-components/src/components/VideoGallery/utils/videoGalleryLayoutUtils.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { useRef } from 'react';\nimport { smartDominantSpeakerParticipants } from '../../../gallery';\nimport { VideoGalleryParticipant, VideoGalleryRemoteParticipant } from '../../../types';\n/* @conditional-compile-remove(reaction) */\nimport { ReactionResources } from '../../..';\nimport { VideoGalleryLayout } from '../../VideoGallery';\n\n/**\n * Arguments used to determine a {@link OrganizedParticipantsResult}\n * @private\n */\nexport interface OrganizedParticipantsArgs {\n remoteParticipants: VideoGalleryRemoteParticipant[];\n localParticipant?: VideoGalleryParticipant;\n dominantSpeakers?: string[];\n maxRemoteVideoStreams?: number;\n maxOverflowGalleryDominantSpeakers?: number;\n isScreenShareActive?: boolean;\n pinnedParticipantUserIds?: string[];\n layout?: VideoGalleryLayout;\n spotlightedParticipantUserIds?: string[];\n previousGridParticipants?: VideoGalleryRemoteParticipant[];\n previousOverflowParticipants?: VideoGalleryRemoteParticipant[];\n}\n\n/**\n * A result that defines grid participants and overflow gallery participants in the VideoGallery\n * @private\n */\nexport interface OrganizedParticipantsResult {\n gridParticipants: VideoGalleryParticipant[];\n overflowGalleryParticipants: VideoGalleryParticipant[];\n}\n\nconst DEFAULT_MAX_OVERFLOW_GALLERY_DOMINANT_SPEAKERS = 6;\nconst DEFAULT_MAX_VIDEO_SREAMS = 4;\nconst MAX_GRID_PARTICIPANTS_NOT_LARGE_GALLERY = 9;\n\nconst getOrganizedParticipants = (props: OrganizedParticipantsArgs): OrganizedParticipantsResult => {\n const {\n remoteParticipants = [],\n dominantSpeakers = [],\n maxRemoteVideoStreams = DEFAULT_MAX_VIDEO_SREAMS,\n maxOverflowGalleryDominantSpeakers = DEFAULT_MAX_OVERFLOW_GALLERY_DOMINANT_SPEAKERS,\n isScreenShareActive = false,\n layout,\n previousGridParticipants = [],\n previousOverflowParticipants = []\n } = props;\n\n const maxRemoteVideoStreamsToUse =\n maxRemoteVideoStreams > MAX_GRID_PARTICIPANTS_NOT_LARGE_GALLERY\n ? MAX_GRID_PARTICIPANTS_NOT_LARGE_GALLERY\n : maxRemoteVideoStreams;\n\n const remoteParticipantsOrdered = putVideoParticipantsFirst(remoteParticipants);\n const videoParticipants = remoteParticipants.filter((p) => p.videoStream?.isAvailable);\n const participants =\n layout === 'floatingLocalVideo' && videoParticipants.length > 0 ? videoParticipants : remoteParticipantsOrdered;\n\n let newGridParticipants = smartDominantSpeakerParticipants({\n participants: participants,\n dominantSpeakers,\n currentParticipants: previousGridParticipants,\n maxDominantSpeakers: maxRemoteVideoStreamsToUse\n }).slice(0, maxRemoteVideoStreamsToUse);\n\n const dominantSpeakerToGrid =\n layout === 'speaker'\n ? dominantSpeakers && dominantSpeakers[0]\n ? newGridParticipants.filter((p) => p.userId === dominantSpeakers[0])\n : [newGridParticipants[0]]\n : [];\n\n if (dominantSpeakerToGrid[0]) {\n newGridParticipants = dominantSpeakerToGrid;\n }\n\n const gridParticipantSet = new Set(newGridParticipants.map((p) => p.userId));\n\n /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */\n const callingParticipants = remoteParticipantsOrdered.filter((p) => p.state === ('Connecting' || 'Ringing'));\n /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */\n const callingParticipantsSet = new Set(callingParticipants.map((p) => p.userId));\n\n const newOverflowGalleryParticipants = smartDominantSpeakerParticipants({\n participants: remoteParticipantsOrdered.filter(\n (p) =>\n !gridParticipantSet.has(p.userId) &&\n /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */ !callingParticipantsSet.has(\n p.userId\n )\n ),\n dominantSpeakers: dominantSpeakers,\n currentParticipants: previousOverflowParticipants,\n maxDominantSpeakers: maxOverflowGalleryDominantSpeakers\n });\n\n const gridParticipants = getGridParticipants({\n isScreenShareActive,\n gridParticipants: newGridParticipants,\n overflowGalleryParticipants: newOverflowGalleryParticipants,\n maxRemoteVideoStreams: maxRemoteVideoStreamsToUse,\n /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */ callingParticipants\n });\n\n const overflowGalleryParticipants = getOverflowGalleryRemoteParticipants({\n isScreenShareActive,\n gridParticipants: newGridParticipants,\n overflowGalleryParticipants: newOverflowGalleryParticipants,\n maxRemoteVideoStreams: maxRemoteVideoStreamsToUse,\n /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */ callingParticipants\n });\n\n return { gridParticipants, overflowGalleryParticipants };\n};\n\ninterface SortedRemoteParticipants {\n [key: string]: VideoGalleryRemoteParticipant;\n}\n\n/**\n * Hook to determine which participants should be in grid and overflow gallery and their order respectively\n * @private\n */\nexport const useOrganizedParticipants = (props: OrganizedParticipantsArgs): OrganizedParticipantsResult => {\n // map remote participants by userId\n const remoteParticipantMap = props.remoteParticipants.reduce((map, remoteParticipant) => {\n map[remoteParticipant.userId] = remoteParticipant;\n return map;\n }, {} as SortedRemoteParticipants);\n\n const spotlightedParticipantUserIds = props.spotlightedParticipantUserIds ?? [];\n const pinnedParticipantUserIds = props.pinnedParticipantUserIds ?? [];\n // declare set of focused participant user ids as spotlighted participants user ids followed by\n // pinned participants user ids which is deduplicated while maintaining order\n const focusedParticipantUserIdSet = new Set(\n spotlightedParticipantUserIds.concat(pinnedParticipantUserIds).filter((p) => remoteParticipantMap[p])\n );\n // get focused participants from map of remote participants in the order of the user ids\n const focusedParticipants: VideoGalleryRemoteParticipant[] = [...focusedParticipantUserIdSet].map(\n (p) => remoteParticipantMap[p]\n );\n\n const currentGridParticipants = useRef<VideoGalleryRemoteParticipant[]>([]);\n const currentOverflowGalleryParticipants = useRef<VideoGalleryRemoteParticipant[]>([]);\n\n const unfocusedParticipants = props.remoteParticipants.filter((p) => !focusedParticipantUserIdSet.has(p.userId));\n\n const useOrganizedParticipantsProps: OrganizedParticipantsArgs = {\n ...props,\n // if there are focused participants then leave no room in the grid by setting maxGridParticipants to 0\n maxRemoteVideoStreams:\n focusedParticipants.length > 0 || props.isScreenShareActive ? 0 : props.maxRemoteVideoStreams,\n remoteParticipants: unfocusedParticipants,\n previousGridParticipants: currentGridParticipants.current,\n previousOverflowParticipants: currentOverflowGalleryParticipants.current\n };\n\n const useOrganizedParticipantsResult = getOrganizedParticipants(useOrganizedParticipantsProps);\n\n currentGridParticipants.current = useOrganizedParticipantsResult.gridParticipants;\n currentOverflowGalleryParticipants.current = useOrganizedParticipantsResult.overflowGalleryParticipants;\n\n return focusedParticipants.length > 0\n ? {\n gridParticipants: props.isScreenShareActive ? [] : focusedParticipants,\n overflowGalleryParticipants: props.isScreenShareActive\n ? focusedParticipants.concat(useOrganizedParticipantsResult.overflowGalleryParticipants)\n : useOrganizedParticipantsResult.overflowGalleryParticipants\n }\n : useOrganizedParticipantsResult;\n};\n\nconst getGridParticipants = (args: {\n isScreenShareActive: boolean;\n gridParticipants: VideoGalleryParticipant[];\n overflowGalleryParticipants: VideoGalleryParticipant[];\n maxRemoteVideoStreams: number;\n /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */ callingParticipants: VideoGalleryParticipant[];\n}): VideoGalleryRemoteParticipant[] => {\n if (args.isScreenShareActive) {\n return [];\n }\n // if we have no grid participants we need to cap the max number of overflowGallery participants in the grid\n // we will use the max streams provided to the function to find the max participants that can go in the grid\n // if there are less participants than max streams then we will use all participants including joining in the grid\n /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */\n return args.gridParticipants.length > 0\n ? args.gridParticipants\n : args.overflowGalleryParticipants.length > args.maxRemoteVideoStreams\n ? args.overflowGalleryParticipants.slice(0, args.maxRemoteVideoStreams)\n : args.overflowGalleryParticipants.slice(0, args.maxRemoteVideoStreams).concat(args.callingParticipants);\n return args.gridParticipants.length > 0\n ? args.gridParticipants\n : args.overflowGalleryParticipants.slice(0, args.maxRemoteVideoStreams);\n};\n\nconst getOverflowGalleryRemoteParticipants = (args: {\n isScreenShareActive: boolean;\n gridParticipants: VideoGalleryParticipant[];\n overflowGalleryParticipants: VideoGalleryParticipant[];\n maxRemoteVideoStreams: number;\n /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */ callingParticipants: VideoGalleryParticipant[];\n}): VideoGalleryRemoteParticipant[] => {\n if (args.isScreenShareActive) {\n // If screen sharing is active, assign video and audio participants as overflow gallery participants\n /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */\n return args.gridParticipants.concat(args.overflowGalleryParticipants.concat(args.callingParticipants));\n return args.gridParticipants.concat(args.overflowGalleryParticipants);\n } else {\n // If screen sharing is not active, then assign all video tiles as grid tiles.\n // If there are no video tiles, then assign audio tiles as grid tiles.\n // if there are more overflow tiles than max streams then find the tiles that don't fit in the grid and put them in overflow\n // overflow should be empty if total participants including calling participants is less than max streams\n /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */\n return args.gridParticipants.length > 0\n ? args.overflowGalleryParticipants.concat(args.callingParticipants)\n : args.overflowGalleryParticipants.length > args.maxRemoteVideoStreams\n ? args.overflowGalleryParticipants.slice(args.maxRemoteVideoStreams).concat(args.callingParticipants)\n : [];\n return args.gridParticipants.length > 0\n ? args.overflowGalleryParticipants\n : args.overflowGalleryParticipants.slice(args.maxRemoteVideoStreams);\n }\n};\n\nconst putVideoParticipantsFirst = (\n remoteParticipants: VideoGalleryRemoteParticipant[]\n): VideoGalleryRemoteParticipant[] => {\n const videoParticipants: VideoGalleryRemoteParticipant[] = [];\n const audioParticipants: VideoGalleryRemoteParticipant[] = [];\n remoteParticipants.forEach((p) => {\n if (p.videoStream?.isAvailable) {\n videoParticipants.push(p);\n } else {\n audioParticipants.push(p);\n }\n });\n const remoteParticipantSortedByVideo = videoParticipants.concat(audioParticipants);\n return remoteParticipantSortedByVideo;\n};\n\n/* @conditional-compile-remove(reaction) */\n/**\n * @private\n */\nexport const getEmojiResource = (reactionName: string, reactionResources: ReactionResources): string | undefined => {\n switch (reactionName) {\n case 'like':\n return reactionResources.likeReaction?.url;\n case 'heart':\n return reactionResources.heartReaction?.url;\n case 'laugh':\n return reactionResources.laughReaction?.url;\n case 'applause':\n return reactionResources.applauseReaction?.url;\n case 'surprised':\n return reactionResources.surprisedReaction?.url;\n }\n return '';\n};\n"]}
1
+ {"version":3,"file":"videoGalleryLayoutUtils.js","sourceRoot":"","sources":["../../../../../../../../react-components/src/components/VideoGallery/utils/videoGalleryLayoutUtils.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport { useRef } from 'react';\nimport { smartDominantSpeakerParticipants } from '../../../gallery';\nimport { VideoGalleryParticipant, VideoGalleryRemoteParticipant } from '../../../types';\n/* @conditional-compile-remove(reaction) */\nimport { ReactionResources } from '../../..';\nimport { VideoGalleryLayout } from '../../VideoGallery';\n\n/**\n * Arguments used to determine a {@link OrganizedParticipantsResult}\n * @private\n */\nexport interface OrganizedParticipantsArgs {\n remoteParticipants: VideoGalleryRemoteParticipant[];\n localParticipant?: VideoGalleryParticipant;\n dominantSpeakers?: string[];\n maxRemoteVideoStreams?: number;\n maxOverflowGalleryDominantSpeakers?: number;\n isScreenShareActive?: boolean;\n pinnedParticipantUserIds?: string[];\n layout?: VideoGalleryLayout;\n spotlightedParticipantUserIds?: string[];\n previousGridParticipants?: VideoGalleryRemoteParticipant[];\n previousOverflowParticipants?: VideoGalleryRemoteParticipant[];\n}\n\n/**\n * A result that defines grid participants and overflow gallery participants in the VideoGallery\n * @private\n */\nexport interface OrganizedParticipantsResult {\n gridParticipants: VideoGalleryParticipant[];\n overflowGalleryParticipants: VideoGalleryParticipant[];\n}\n\nconst DEFAULT_MAX_OVERFLOW_GALLERY_DOMINANT_SPEAKERS = 6;\nconst DEFAULT_MAX_VIDEO_SREAMS = 4;\nconst MAX_GRID_PARTICIPANTS_NOT_LARGE_GALLERY = 9;\n\nconst getOrganizedParticipants = (props: OrganizedParticipantsArgs): OrganizedParticipantsResult => {\n const {\n remoteParticipants = [],\n dominantSpeakers = [],\n maxRemoteVideoStreams = DEFAULT_MAX_VIDEO_SREAMS,\n maxOverflowGalleryDominantSpeakers = DEFAULT_MAX_OVERFLOW_GALLERY_DOMINANT_SPEAKERS,\n isScreenShareActive = false,\n layout,\n previousGridParticipants = [],\n previousOverflowParticipants = []\n } = props;\n\n const maxRemoteVideoStreamsToUse =\n maxRemoteVideoStreams > MAX_GRID_PARTICIPANTS_NOT_LARGE_GALLERY\n ? MAX_GRID_PARTICIPANTS_NOT_LARGE_GALLERY\n : maxRemoteVideoStreams;\n\n const remoteParticipantsOrdered = putVideoParticipantsFirst(remoteParticipants);\n const videoParticipants = remoteParticipants.filter((p) => p.videoStream?.isAvailable);\n const participants =\n layout === 'floatingLocalVideo' && videoParticipants.length > 0 ? videoParticipants : remoteParticipantsOrdered;\n\n let newGridParticipants = smartDominantSpeakerParticipants({\n participants: participants,\n dominantSpeakers,\n currentParticipants: previousGridParticipants,\n maxDominantSpeakers: maxRemoteVideoStreamsToUse\n }).slice(0, maxRemoteVideoStreamsToUse);\n\n const dominantSpeakerToGrid =\n layout === 'speaker'\n ? dominantSpeakers && dominantSpeakers[0]\n ? newGridParticipants.filter((p) => p.userId === dominantSpeakers[0])\n : [newGridParticipants[0]]\n : [];\n\n if (dominantSpeakerToGrid[0]) {\n newGridParticipants = dominantSpeakerToGrid;\n }\n\n const gridParticipantSet = new Set(newGridParticipants.map((p) => p.userId));\n\n /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */\n const callingParticipants = remoteParticipantsOrdered.filter((p) => p.state === ('Connecting' || 'Ringing'));\n /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */\n const callingParticipantsSet = new Set(callingParticipants.map((p) => p.userId));\n\n const newOverflowGalleryParticipants = smartDominantSpeakerParticipants({\n participants: remoteParticipantsOrdered.filter(\n (p) =>\n !gridParticipantSet.has(p.userId) &&\n /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */ !callingParticipantsSet.has(\n p.userId\n )\n ),\n dominantSpeakers: dominantSpeakers,\n currentParticipants: previousOverflowParticipants,\n maxDominantSpeakers: maxOverflowGalleryDominantSpeakers\n });\n\n const gridParticipants = getGridParticipants({\n isScreenShareActive,\n gridParticipants: newGridParticipants,\n overflowGalleryParticipants: newOverflowGalleryParticipants,\n maxRemoteVideoStreams: maxRemoteVideoStreamsToUse,\n /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */ callingParticipants\n });\n\n const overflowGalleryParticipants = getOverflowGalleryRemoteParticipants({\n isScreenShareActive,\n gridParticipants: newGridParticipants,\n overflowGalleryParticipants: newOverflowGalleryParticipants,\n maxRemoteVideoStreams: maxRemoteVideoStreamsToUse,\n /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */ callingParticipants\n });\n\n return { gridParticipants, overflowGalleryParticipants };\n};\n\ninterface SortedRemoteParticipants {\n [key: string]: VideoGalleryRemoteParticipant;\n}\n\n/**\n * Hook to determine which participants should be in grid and overflow gallery and their order respectively\n * @private\n */\nexport const useOrganizedParticipants = (props: OrganizedParticipantsArgs): OrganizedParticipantsResult => {\n // map remote participants by userId\n const remoteParticipantMap = props.remoteParticipants.reduce((map, remoteParticipant) => {\n map[remoteParticipant.userId] = remoteParticipant;\n return map;\n }, {} as SortedRemoteParticipants);\n\n const spotlightedParticipantUserIds = props.spotlightedParticipantUserIds ?? [];\n const pinnedParticipantUserIds = props.pinnedParticipantUserIds ?? [];\n // declare set of focused participant user ids as spotlighted participants user ids followed by\n // pinned participants user ids which is deduplicated while maintaining order\n const focusedParticipantUserIdSet = new Set(\n spotlightedParticipantUserIds.concat(pinnedParticipantUserIds).filter((p) => remoteParticipantMap[p])\n );\n // get focused participants from map of remote participants in the order of the user ids\n const focusedParticipants: VideoGalleryRemoteParticipant[] = [...focusedParticipantUserIdSet].map(\n (p) => remoteParticipantMap[p]\n );\n\n const currentGridParticipants = useRef<VideoGalleryRemoteParticipant[]>([]);\n const currentOverflowGalleryParticipants = useRef<VideoGalleryRemoteParticipant[]>([]);\n\n const unfocusedParticipants = props.remoteParticipants.filter((p) => !focusedParticipantUserIdSet.has(p.userId));\n\n const useOrganizedParticipantsProps: OrganizedParticipantsArgs = {\n ...props,\n // if there are focused participants then leave no room in the grid by setting maxGridParticipants to 0\n maxRemoteVideoStreams:\n focusedParticipants.length > 0 || props.isScreenShareActive ? 0 : props.maxRemoteVideoStreams,\n remoteParticipants: unfocusedParticipants,\n previousGridParticipants: currentGridParticipants.current,\n previousOverflowParticipants: currentOverflowGalleryParticipants.current\n };\n\n const useOrganizedParticipantsResult = getOrganizedParticipants(useOrganizedParticipantsProps);\n\n currentGridParticipants.current = useOrganizedParticipantsResult.gridParticipants;\n currentOverflowGalleryParticipants.current = useOrganizedParticipantsResult.overflowGalleryParticipants;\n\n return focusedParticipants.length > 0\n ? {\n gridParticipants: props.isScreenShareActive ? [] : focusedParticipants,\n overflowGalleryParticipants: props.isScreenShareActive\n ? focusedParticipants.concat(useOrganizedParticipantsResult.overflowGalleryParticipants)\n : useOrganizedParticipantsResult.overflowGalleryParticipants\n }\n : useOrganizedParticipantsResult;\n};\n\nconst getGridParticipants = (args: {\n isScreenShareActive: boolean;\n gridParticipants: VideoGalleryParticipant[];\n overflowGalleryParticipants: VideoGalleryParticipant[];\n maxRemoteVideoStreams: number;\n /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */ callingParticipants: VideoGalleryParticipant[];\n}): VideoGalleryRemoteParticipant[] => {\n if (args.isScreenShareActive) {\n return [];\n }\n // if we have no grid participants we need to cap the max number of overflowGallery participants in the grid\n // we will use the max streams provided to the function to find the max participants that can go in the grid\n // if there are less participants than max streams then we will use all participants including joining in the grid\n /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */\n return args.gridParticipants.length > 0\n ? args.gridParticipants\n : args.overflowGalleryParticipants.length > args.maxRemoteVideoStreams\n ? args.overflowGalleryParticipants.slice(0, args.maxRemoteVideoStreams)\n : args.overflowGalleryParticipants.slice(0, args.maxRemoteVideoStreams).concat(args.callingParticipants);\n return args.gridParticipants.length > 0\n ? args.gridParticipants\n : args.overflowGalleryParticipants.slice(0, args.maxRemoteVideoStreams);\n};\n\nconst getOverflowGalleryRemoteParticipants = (args: {\n isScreenShareActive: boolean;\n gridParticipants: VideoGalleryParticipant[];\n overflowGalleryParticipants: VideoGalleryParticipant[];\n maxRemoteVideoStreams: number;\n /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */ callingParticipants: VideoGalleryParticipant[];\n}): VideoGalleryRemoteParticipant[] => {\n if (args.isScreenShareActive) {\n // If screen sharing is active, assign video and audio participants as overflow gallery participants\n /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */\n return args.gridParticipants.concat(args.overflowGalleryParticipants.concat(args.callingParticipants));\n return args.gridParticipants.concat(args.overflowGalleryParticipants);\n } else {\n // If screen sharing is not active, then assign all video tiles as grid tiles.\n // If there are no video tiles, then assign audio tiles as grid tiles.\n // if there are more overflow tiles than max streams then find the tiles that don't fit in the grid and put them in overflow\n // overflow should be empty if total participants including calling participants is less than max streams\n /* @conditional-compile-remove(PSTN-calls) */ /* @conditional-compile-remove(one-to-n-calling) */\n return args.gridParticipants.length > 0\n ? args.overflowGalleryParticipants.concat(args.callingParticipants)\n : args.overflowGalleryParticipants.length > args.maxRemoteVideoStreams\n ? args.overflowGalleryParticipants.slice(args.maxRemoteVideoStreams).concat(args.callingParticipants)\n : [];\n return args.gridParticipants.length > 0\n ? args.overflowGalleryParticipants\n : args.overflowGalleryParticipants.slice(args.maxRemoteVideoStreams);\n }\n};\n\nconst putVideoParticipantsFirst = (\n remoteParticipants: VideoGalleryRemoteParticipant[]\n): VideoGalleryRemoteParticipant[] => {\n const videoParticipants: VideoGalleryRemoteParticipant[] = [];\n const audioParticipants: VideoGalleryRemoteParticipant[] = [];\n remoteParticipants.forEach((p) => {\n if (p.videoStream?.isAvailable) {\n videoParticipants.push(p);\n } else {\n audioParticipants.push(p);\n }\n });\n const remoteParticipantSortedByVideo = videoParticipants.concat(audioParticipants);\n return remoteParticipantSortedByVideo;\n};\n\n/* @conditional-compile-remove(reaction) */\n/**\n * @private\n */\nexport const getEmojiResource = (reactionName: string, reactionResources: ReactionResources): string | undefined => {\n switch (reactionName) {\n case 'like':\n return reactionResources.likeReaction?.url;\n case 'heart':\n return reactionResources.heartReaction?.url;\n case 'laugh':\n return reactionResources.laughReaction?.url;\n case 'applause':\n return reactionResources.applauseReaction?.url;\n case 'surprised':\n return reactionResources.surprisedReaction?.url;\n }\n return undefined;\n};\n\n/* @conditional-compile-remove(reaction) */\n/**\n * @private\n */\nexport const getEmojiFrameCount = (reactionName: string, reactionResources: ReactionResources): number => {\n switch (reactionName) {\n case 'like':\n return reactionResources.likeReaction?.frameCount ?? 0;\n case 'heart':\n return reactionResources.heartReaction?.frameCount ?? 0;\n case 'laugh':\n return reactionResources.laughReaction?.frameCount ?? 0;\n case 'applause':\n return reactionResources.applauseReaction?.frameCount ?? 0;\n case 'surprised':\n return reactionResources.surprisedReaction?.frameCount ?? 0;\n default:\n return 0;\n }\n};\n"]}
@@ -16,7 +16,6 @@ export type { RichTextSendBoxProps, RichTextSendBoxStrings } from './RichTextEdi
16
16
  export type { _MentionPopoverProps, MentionLookupOptions, MentionDisplayOptions, MentionOptions, Mention, MentionPopoverStrings } from './MentionPopover';
17
17
  export type { ImageOverlayProps } from './ImageOverlay';
18
18
  export type { InlineImageOptions, InlineImage } from './ChatMessage/ChatMessageContent';
19
- export type { ActiveFileUpload } from './AttachmentUploadCards';
20
19
  export { MessageStatusIndicator } from './MessageStatusIndicator';
21
20
  export type { MessageStatusIndicatorProps, MessageStatusIndicatorStrings } from './MessageStatusIndicator';
22
21
  export { MessageThread } from './MessageThread';
@@ -78,7 +77,7 @@ export * from './AttachmentCardGroup';
78
77
  export * from './ModalClone/ModalClone';
79
78
  export * from './AttachmentDownloadCards';
80
79
  export type { _AttachmentUploadCardsStrings } from './AttachmentUploadCards';
81
- export type { AttachmentOptions, AttachmentUploadOptions, AttachmentUploadHandler, AttachmentMetadata, AttachmentUploadStatus, AttachmentUploadManager, FileUploadHandler, FileUploadManager, FileUploadState, FileUploadError } from '../types/Attachment';
80
+ export type { AttachmentOptions, AttachmentUploadOptions, AttachmentMetadata, AttachmentUploadStatus, AttachmentUploadHandler, AttachmentUploadManager } from '../types/Attachment';
82
81
  export type { AttachmentMenuAction, AttachmentDownloadOptions } from '../types/Attachment';
83
82
  export { _useContainerHeight, _useContainerWidth } from './utils/responsive';
84
83
  export { _ComplianceBanner } from './ComplianceBanner';
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../react-components/src/components/index.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nexport { TypingIndicator } from './TypingIndicator';\nexport type { TypingIndicatorProps, TypingIndicatorStrings, TypingIndicatorStylesProps } from './TypingIndicator';\n\nexport { ErrorBar } from './ErrorBar';\nexport type { ActiveErrorMessage, ErrorBarProps, ErrorBarStrings, ErrorType } from './ErrorBar';\n\nexport { GridLayout } from './GridLayout';\nexport type { GridLayoutProps, GridLayoutStyles } from './GridLayout';\n\nexport { SendBox } from './SendBox';\n/* @conditional-compile-remove(mention) */\nexport { _MentionPopover } from './MentionPopover';\n\nexport { ImageOverlay } from './ImageOverlay';\nexport type { ImageOverlayStrings } from './ImageOverlay';\nexport type { SendBoxProps, SendBoxStrings, SendBoxStylesProps } from './SendBox';\n\n/* @conditional-compile-remove(rich-text-editor) */\nexport { RichTextSendBox } from './RichTextEditor/RichTextSendBox';\n// TODO: This component is exported only for testing purposes. Remove this when this component is added to composites\n/* @conditional-compile-remove(rich-text-editor) */\nexport { ChatMessageComponentAsRichTextEditBox } from './ChatMessage/ChatMessageComponentAsRichTextEditBox';\n// TODO: This component is exported only for testing purposes. Remove this when this component is added to composites\n/* @conditional-compile-remove(rich-text-editor) */\nexport type { ChatMessageComponentAsRichTextEditBoxProps } from './ChatMessage/ChatMessageComponentAsRichTextEditBox';\n/* @conditional-compile-remove(rich-text-editor) */\nexport type { RichTextSendBoxProps, RichTextSendBoxStrings } from './RichTextEditor/RichTextSendBox';\n\n/* @conditional-compile-remove(mention) */\nexport type {\n _MentionPopoverProps,\n MentionLookupOptions,\n MentionDisplayOptions,\n MentionOptions,\n Mention,\n MentionPopoverStrings\n} from './MentionPopover';\n\nexport type { ImageOverlayProps } from './ImageOverlay';\n\nexport type { InlineImageOptions, InlineImage } from './ChatMessage/ChatMessageContent';\n\n/* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */\nexport type { ActiveFileUpload } from './AttachmentUploadCards';\n\nexport { MessageStatusIndicator } from './MessageStatusIndicator';\nexport type { MessageStatusIndicatorProps, MessageStatusIndicatorStrings } from './MessageStatusIndicator';\n\nexport { MessageThread } from './MessageThread';\nexport type {\n MessageProps,\n MessageThreadProps,\n MessageThreadStrings,\n MessageThreadStyles,\n JumpToNewMessageButtonProps,\n MessageRenderer,\n UpdateMessageCallback,\n CancelEditCallback\n} from './MessageThread';\n\nexport { StreamMedia } from './StreamMedia';\nexport type { StreamMediaProps } from './StreamMedia';\nexport type { LoadingState } from './StreamMedia';\n\nexport { ParticipantItem } from './ParticipantItem';\nexport type { ParticipantItemProps, ParticipantItemStrings, ParticipantItemStyles } from './ParticipantItem';\n\nexport { ParticipantList } from './ParticipantList';\nexport type {\n ParticipantListItemStyles,\n ParticipantListProps,\n ParticipantListStyles,\n ParticipantMenuItemsCallback\n} from './ParticipantList';\n\n/* @conditional-compile-remove(total-participant-count) */\nexport type { ParticipantListStrings } from './ParticipantList';\n\nexport { Announcer } from './Announcer';\nexport type { AnnouncerProps } from './Announcer';\n\nexport { VideoGallery } from './VideoGallery';\nexport type {\n VideoGalleryProps,\n VideoGalleryStrings,\n VideoGalleryStyles,\n VideoGalleryLayout,\n VideoTileContextualMenuProps,\n VideoTileDrawerMenuProps\n} from './VideoGallery';\nexport type { OverflowGalleryPosition } from './VideoGallery';\nexport type { LocalVideoTileSize } from './VideoGallery';\nexport type { HorizontalGalleryStyles } from './HorizontalGallery';\n\nexport { LocalVideoCameraCycleButton } from './LocalVideoCameraButton';\nexport type { LocalVideoCameraCycleButtonProps } from './LocalVideoCameraButton';\n\nexport { CameraButton } from './CameraButton';\nexport type {\n CameraButtonContextualMenuStyles,\n CameraButtonProps,\n CameraButtonStrings,\n CameraButtonStyles\n} from './CameraButton';\n\nexport { ControlBar } from './ControlBar';\nexport type { ControlBarProps, ControlBarLayout } from './ControlBar';\n\nexport { ControlBarButton } from './ControlBarButton';\nexport type { ControlBarButtonProps, ControlBarButtonStrings, ControlBarButtonStyles } from './ControlBarButton';\n\nexport { EndCallButton } from './EndCallButton';\nexport type { EndCallButtonProps, EndCallButtonStrings } from './EndCallButton';\n\nexport { MicrophoneButton } from './MicrophoneButton';\nexport type {\n MicrophoneButtonStyles,\n MicrophoneButtonContextualMenuStyles,\n MicrophoneButtonProps,\n MicrophoneButtonStrings\n} from './MicrophoneButton';\n\nexport { DevicesButton, generateDefaultDeviceMenuProps as _generateDefaultDeviceMenuProps } from './DevicesButton';\nexport type {\n OptionsDevice,\n DevicesButtonProps,\n DevicesButtonStrings,\n DevicesButtonStyles,\n DevicesButtonContextualMenuStyles,\n DeviceMenuProps as _DeviceMenuProps,\n DeviceMenuStrings as _DeviceMenuStrings,\n DeviceMenuStyles as _DeviceMenuStyles\n} from './DevicesButton';\n\n/* @conditional-compile-remove(call-readiness) */\nexport {\n CameraAndMicrophoneSitePermissions,\n MicrophoneSitePermissions,\n CameraSitePermissions\n} from './DevicePermissions/SitePermissions';\n/* @conditional-compile-remove(call-readiness) */\nexport type { SitePermissionsStrings, SitePermissionsStyles } from './DevicePermissions/SitePermissionsScaffolding';\n/* @conditional-compile-remove(call-readiness) */\nexport type {\n CameraAndMicrophoneSitePermissionsStrings,\n CameraAndMicrophoneSitePermissionsProps,\n CameraSitePermissionsStrings,\n CameraSitePermissionsProps,\n CommonSitePermissionsProps,\n MicrophoneSitePermissionsStrings,\n MicrophoneSitePermissionsProps\n} from './DevicePermissions/SitePermissions';\n/* @conditional-compile-remove(call-readiness) */\nexport { BrowserPermissionDenied } from './DevicePermissions/BrowserPermissionDenied';\n/* @conditional-compile-remove(call-readiness) */\nexport type {\n BrowserPermissionDeniedStrings,\n BrowserPermissionDeniedStyles,\n BrowserPermissionDeniedProps\n} from './DevicePermissions/BrowserPermissionDenied';\n/* @conditional-compile-remove(call-readiness) */\nexport { BrowserPermissionDeniedIOS } from './DevicePermissions/BrowserPermissionDeniedIOS';\n/* @conditional-compile-remove(call-readiness) */\nexport type {\n BrowserPermissionDeniedIOSStrings,\n BrowserPermissionDeniedIOSProps\n} from './DevicePermissions/BrowserPermissionDeniedIOS';\n\nexport { ParticipantsButton } from './ParticipantsButton';\nexport type {\n ParticipantsButtonContextualMenuStyles,\n ParticipantsButtonProps,\n ParticipantsButtonStrings,\n ParticipantsButtonStyles\n} from './ParticipantsButton';\n\nexport { ScreenShareButton } from './ScreenShareButton';\nexport type { ScreenShareButtonProps, ScreenShareButtonStrings } from './ScreenShareButton';\n\nexport { RaiseHandButton } from './RaiseHandButton';\n\nexport type { RaiseHandButtonProps, RaiseHandButtonStrings } from './RaiseHandButton';\n/* @conditional-compile-remove(reaction) */\nexport { ReactionButton } from './ReactionButton';\n/* @conditional-compile-remove(reaction) */\nexport type { ReactionButtonProps, ReactionButtonStrings } from './ReactionButton';\nexport { VideoTile } from './VideoTile';\nexport type { VideoTileProps, VideoTileStylesProps } from './VideoTile';\n/* @conditional-compile-remove(PSTN-calls) */\nexport type { VideoTileStrings } from './VideoTile';\n\nexport { _PictureInPictureInPicture } from './PictureInPictureInPicture/PictureInPictureInPicture';\nexport type {\n _PictureInPictureInPictureProps,\n _PictureInPictureInPictureStrings\n} from './PictureInPictureInPicture/PictureInPictureInPicture';\nexport type {\n _PictureInPictureInPictureTileProps,\n _TileOrientation\n} from './PictureInPictureInPicture/PictureInPictureInPictureTile';\n\nexport * from './Drawer';\n/* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */\nexport type { SendBoxErrorBarError } from './SendBoxErrorBar';\nexport * from './AttachmentCard';\nexport * from './AttachmentCardGroup';\nexport * from './ModalClone/ModalClone';\nexport * from './AttachmentDownloadCards';\nexport type { _AttachmentUploadCardsStrings } from './AttachmentUploadCards';\n\nexport type {\n AttachmentOptions,\n AttachmentUploadOptions,\n AttachmentUploadHandler,\n AttachmentMetadata,\n AttachmentUploadStatus,\n AttachmentUploadManager,\n FileUploadHandler,\n FileUploadManager,\n FileUploadState,\n FileUploadError\n} from '../types/Attachment';\n\n/* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */\nexport type { AttachmentMenuAction, AttachmentDownloadOptions } from '../types/Attachment';\n\nexport { _useContainerHeight, _useContainerWidth } from './utils/responsive';\n\nexport { _ComplianceBanner } from './ComplianceBanner';\nexport type { _ComplianceBannerProps, _ComplianceBannerStrings } from './ComplianceBanner';\nexport { Dialpad } from './Dialpad/Dialpad';\nexport type { DialpadProps, DialpadStrings, DialpadStyles, DtmfTone } from './Dialpad/Dialpad';\nexport type { DialpadMode, LongPressTrigger } from './Dialpad/Dialpad';\n/* @conditional-compile-remove(end-of-call-survey) */\nexport { _StarSurvey } from './Survey/StarSurvey/StarSurvey';\n/* @conditional-compile-remove(end-of-call-survey) */\nexport type { _StarSurveyProps, _StarSurveyStrings } from './Survey/StarSurvey/StarSurvey';\n/* @conditional-compile-remove(end-of-call-survey) */\nexport * from './Survey/SurveyTypes';\n/* @conditional-compile-remove(end-of-call-survey) */\nexport { _TagsSurvey } from './Survey/TagsSurvey/TagsSurvey';\n/* @conditional-compile-remove(end-of-call-survey) */\nexport type { _TagsSurveyProps, _TagsSurveyStrings, _IssueCategory, _SurveyTag } from './Survey/TagsSurvey/TagsSurvey';\n/* @conditional-compile-remove(PSTN-calls) */\nexport { HoldButton } from './HoldButton';\n/* @conditional-compile-remove(PSTN-calls) */\nexport type { HoldButtonProps, HoldButtonStrings } from './HoldButton';\n\nexport { _LocalVideoTile } from './LocalVideoTile';\nexport { _RemoteVideoTile } from './RemoteVideoTile';\nexport { _HighContrastAwareIcon } from './HighContrastAwareIcon';\nexport type { _HighContrastAwareIconProps } from './HighContrastAwareIcon';\n\nexport { UnsupportedBrowser } from './UnsupportedBrowser';\nexport type { UnsupportedBrowserStrings, UnsupportedBrowserProps } from './UnsupportedBrowser';\nexport { UnsupportedBrowserVersion } from './UnsupportedBrowserVersion';\nexport type { UnsupportedBrowserVersionStrings, UnsupportedBrowserVersionProps } from './UnsupportedBrowserVersion';\nexport { UnsupportedOperatingSystem } from './UnsupportedOperatingSystem';\nexport type { UnsupportedOperatingSystemStrings, UnsupportedOperatingSystemProps } from './UnsupportedOperatingSystem';\n\nexport { _TroubleshootingGuideErrorBar } from './TroubleshootingGuideErrorBar';\nexport type {\n _TroubleshootingGuideErrorBarStrings,\n _TroubleshootingGuideErrorBarProps\n} from './TroubleshootingGuideErrorBar';\n\nexport { _DevicePermissionDropdown } from './DevicePermissions/DevicePermissionDropdown';\nexport type {\n _DevicePermissionDropdownStrings,\n _DevicePermissionDropdownProps,\n _PermissionConstraints\n} from './DevicePermissions/DevicePermissionDropdown';\n\nexport { _VideoEffectsItem } from './VideoEffects/VideoEffectsItem';\nexport type { _VideoEffectsItemProps, _VideoEffectsItemStyles } from './VideoEffects/VideoEffectsItem';\nexport {\n _VideoEffectsItemNoBackground,\n _VideoEffectsItemBlur,\n _VideoEffectsItemAddImage\n} from './VideoEffects/PresetVideoEffectsItems';\n\nexport { _VideoBackgroundEffectsPicker } from './VideoEffects/VideoBackgroundEffectsPicker';\nexport type {\n _VideoBackgroundEffectsPickerProps,\n _VideoBackgroundEffectChoiceOption,\n _VideoBackgroundEffectsPickerStyles\n} from './VideoEffects/VideoBackgroundEffectsPicker';\n\nexport type { VerticalGalleryStyles, VerticalGalleryStrings, VerticalGalleryControlBarStyles } from './VerticalGallery';\n/* @conditional-compile-remove(close-captions) */\nexport * from './CaptionsBanner';\n/* @conditional-compile-remove(close-captions) */\nexport * from './Caption';\n/* @conditional-compile-remove(close-captions) */\nexport * from './StartCaptionsButton';\n/* @conditional-compile-remove(close-captions) */\nexport * from './CaptionsSettingsModal';\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../react-components/src/components/index.ts"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAGpD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAGtC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAG1C,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,0CAA0C;AAC1C,OAAO,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAC;AAEnD,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAI9C,mDAAmD;AACnD,OAAO,EAAE,eAAe,EAAE,MAAM,kCAAkC,CAAC;AACnE,qHAAqH;AACrH,mDAAmD;AACnD,OAAO,EAAE,qCAAqC,EAAE,MAAM,qDAAqD,CAAC;AAqB5G,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AAGlE,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAYhD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAI5C,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAGpD,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAWpD,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAGxC,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAa9C,OAAO,EAAE,2BAA2B,EAAE,MAAM,0BAA0B,CAAC;AAGvE,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAQ9C,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAG1C,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAGtD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAGhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAQtD,OAAO,EAAE,aAAa,EAAE,8BAA8B,IAAI,+BAA+B,EAAE,MAAM,iBAAiB,CAAC;AAYnH,iDAAiD;AACjD,OAAO,EACL,kCAAkC,EAClC,yBAAyB,EACzB,qBAAqB,EACtB,MAAM,qCAAqC,CAAC;AAa7C,iDAAiD;AACjD,OAAO,EAAE,uBAAuB,EAAE,MAAM,6CAA6C,CAAC;AAOtF,iDAAiD;AACjD,OAAO,EAAE,0BAA0B,EAAE,MAAM,gDAAgD,CAAC;AAO5F,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAQ1D,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAGxD,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAGpD,2CAA2C;AAC3C,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAGlD,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAKxC,OAAO,EAAE,0BAA0B,EAAE,MAAM,uDAAuD,CAAC;AAUnG,cAAc,UAAU,CAAC;AAGzB,cAAc,kBAAkB,CAAC;AACjC,cAAc,uBAAuB,CAAC;AACtC,cAAc,yBAAyB,CAAC;AACxC,cAAc,2BAA2B,CAAC;AAe1C,OAAO,EAAE,mBAAmB,EAAE,kBAAkB,EAAE,MAAM,oBAAoB,CAAC;AAE7E,OAAO,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAC;AAEvD,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAC;AAG5C,qDAAqD;AACrD,OAAO,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAG7D,qDAAqD;AACrD,cAAc,sBAAsB,CAAC;AACrC,qDAAqD;AACrD,OAAO,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAG7D,6CAA6C;AAC7C,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAI1C,OAAO,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAC;AACnD,OAAO,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AACrD,OAAO,EAAE,sBAAsB,EAAE,MAAM,yBAAyB,CAAC;AAGjE,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAE1D,OAAO,EAAE,yBAAyB,EAAE,MAAM,6BAA6B,CAAC;AAExE,OAAO,EAAE,0BAA0B,EAAE,MAAM,8BAA8B,CAAC;AAG1E,OAAO,EAAE,6BAA6B,EAAE,MAAM,gCAAgC,CAAC;AAM/E,OAAO,EAAE,yBAAyB,EAAE,MAAM,8CAA8C,CAAC;AAOzF,OAAO,EAAE,iBAAiB,EAAE,MAAM,iCAAiC,CAAC;AAEpE,OAAO,EACL,6BAA6B,EAC7B,qBAAqB,EACrB,yBAAyB,EAC1B,MAAM,wCAAwC,CAAC;AAEhD,OAAO,EAAE,6BAA6B,EAAE,MAAM,6CAA6C,CAAC;AAQ5F,iDAAiD;AACjD,cAAc,kBAAkB,CAAC;AACjC,iDAAiD;AACjD,cAAc,WAAW,CAAC;AAC1B,iDAAiD;AACjD,cAAc,uBAAuB,CAAC;AACtC,iDAAiD;AACjD,cAAc,yBAAyB,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nexport { TypingIndicator } from './TypingIndicator';\nexport type { TypingIndicatorProps, TypingIndicatorStrings, TypingIndicatorStylesProps } from './TypingIndicator';\n\nexport { ErrorBar } from './ErrorBar';\nexport type { ActiveErrorMessage, ErrorBarProps, ErrorBarStrings, ErrorType } from './ErrorBar';\n\nexport { GridLayout } from './GridLayout';\nexport type { GridLayoutProps, GridLayoutStyles } from './GridLayout';\n\nexport { SendBox } from './SendBox';\n/* @conditional-compile-remove(mention) */\nexport { _MentionPopover } from './MentionPopover';\n\nexport { ImageOverlay } from './ImageOverlay';\nexport type { ImageOverlayStrings } from './ImageOverlay';\nexport type { SendBoxProps, SendBoxStrings, SendBoxStylesProps } from './SendBox';\n\n/* @conditional-compile-remove(rich-text-editor) */\nexport { RichTextSendBox } from './RichTextEditor/RichTextSendBox';\n// TODO: This component is exported only for testing purposes. Remove this when this component is added to composites\n/* @conditional-compile-remove(rich-text-editor) */\nexport { ChatMessageComponentAsRichTextEditBox } from './ChatMessage/ChatMessageComponentAsRichTextEditBox';\n// TODO: This component is exported only for testing purposes. Remove this when this component is added to composites\n/* @conditional-compile-remove(rich-text-editor) */\nexport type { ChatMessageComponentAsRichTextEditBoxProps } from './ChatMessage/ChatMessageComponentAsRichTextEditBox';\n/* @conditional-compile-remove(rich-text-editor) */\nexport type { RichTextSendBoxProps, RichTextSendBoxStrings } from './RichTextEditor/RichTextSendBox';\n\n/* @conditional-compile-remove(mention) */\nexport type {\n _MentionPopoverProps,\n MentionLookupOptions,\n MentionDisplayOptions,\n MentionOptions,\n Mention,\n MentionPopoverStrings\n} from './MentionPopover';\n\nexport type { ImageOverlayProps } from './ImageOverlay';\n\nexport type { InlineImageOptions, InlineImage } from './ChatMessage/ChatMessageContent';\n\nexport { MessageStatusIndicator } from './MessageStatusIndicator';\nexport type { MessageStatusIndicatorProps, MessageStatusIndicatorStrings } from './MessageStatusIndicator';\n\nexport { MessageThread } from './MessageThread';\nexport type {\n MessageProps,\n MessageThreadProps,\n MessageThreadStrings,\n MessageThreadStyles,\n JumpToNewMessageButtonProps,\n MessageRenderer,\n UpdateMessageCallback,\n CancelEditCallback\n} from './MessageThread';\n\nexport { StreamMedia } from './StreamMedia';\nexport type { StreamMediaProps } from './StreamMedia';\nexport type { LoadingState } from './StreamMedia';\n\nexport { ParticipantItem } from './ParticipantItem';\nexport type { ParticipantItemProps, ParticipantItemStrings, ParticipantItemStyles } from './ParticipantItem';\n\nexport { ParticipantList } from './ParticipantList';\nexport type {\n ParticipantListItemStyles,\n ParticipantListProps,\n ParticipantListStyles,\n ParticipantMenuItemsCallback\n} from './ParticipantList';\n\n/* @conditional-compile-remove(total-participant-count) */\nexport type { ParticipantListStrings } from './ParticipantList';\n\nexport { Announcer } from './Announcer';\nexport type { AnnouncerProps } from './Announcer';\n\nexport { VideoGallery } from './VideoGallery';\nexport type {\n VideoGalleryProps,\n VideoGalleryStrings,\n VideoGalleryStyles,\n VideoGalleryLayout,\n VideoTileContextualMenuProps,\n VideoTileDrawerMenuProps\n} from './VideoGallery';\nexport type { OverflowGalleryPosition } from './VideoGallery';\nexport type { LocalVideoTileSize } from './VideoGallery';\nexport type { HorizontalGalleryStyles } from './HorizontalGallery';\n\nexport { LocalVideoCameraCycleButton } from './LocalVideoCameraButton';\nexport type { LocalVideoCameraCycleButtonProps } from './LocalVideoCameraButton';\n\nexport { CameraButton } from './CameraButton';\nexport type {\n CameraButtonContextualMenuStyles,\n CameraButtonProps,\n CameraButtonStrings,\n CameraButtonStyles\n} from './CameraButton';\n\nexport { ControlBar } from './ControlBar';\nexport type { ControlBarProps, ControlBarLayout } from './ControlBar';\n\nexport { ControlBarButton } from './ControlBarButton';\nexport type { ControlBarButtonProps, ControlBarButtonStrings, ControlBarButtonStyles } from './ControlBarButton';\n\nexport { EndCallButton } from './EndCallButton';\nexport type { EndCallButtonProps, EndCallButtonStrings } from './EndCallButton';\n\nexport { MicrophoneButton } from './MicrophoneButton';\nexport type {\n MicrophoneButtonStyles,\n MicrophoneButtonContextualMenuStyles,\n MicrophoneButtonProps,\n MicrophoneButtonStrings\n} from './MicrophoneButton';\n\nexport { DevicesButton, generateDefaultDeviceMenuProps as _generateDefaultDeviceMenuProps } from './DevicesButton';\nexport type {\n OptionsDevice,\n DevicesButtonProps,\n DevicesButtonStrings,\n DevicesButtonStyles,\n DevicesButtonContextualMenuStyles,\n DeviceMenuProps as _DeviceMenuProps,\n DeviceMenuStrings as _DeviceMenuStrings,\n DeviceMenuStyles as _DeviceMenuStyles\n} from './DevicesButton';\n\n/* @conditional-compile-remove(call-readiness) */\nexport {\n CameraAndMicrophoneSitePermissions,\n MicrophoneSitePermissions,\n CameraSitePermissions\n} from './DevicePermissions/SitePermissions';\n/* @conditional-compile-remove(call-readiness) */\nexport type { SitePermissionsStrings, SitePermissionsStyles } from './DevicePermissions/SitePermissionsScaffolding';\n/* @conditional-compile-remove(call-readiness) */\nexport type {\n CameraAndMicrophoneSitePermissionsStrings,\n CameraAndMicrophoneSitePermissionsProps,\n CameraSitePermissionsStrings,\n CameraSitePermissionsProps,\n CommonSitePermissionsProps,\n MicrophoneSitePermissionsStrings,\n MicrophoneSitePermissionsProps\n} from './DevicePermissions/SitePermissions';\n/* @conditional-compile-remove(call-readiness) */\nexport { BrowserPermissionDenied } from './DevicePermissions/BrowserPermissionDenied';\n/* @conditional-compile-remove(call-readiness) */\nexport type {\n BrowserPermissionDeniedStrings,\n BrowserPermissionDeniedStyles,\n BrowserPermissionDeniedProps\n} from './DevicePermissions/BrowserPermissionDenied';\n/* @conditional-compile-remove(call-readiness) */\nexport { BrowserPermissionDeniedIOS } from './DevicePermissions/BrowserPermissionDeniedIOS';\n/* @conditional-compile-remove(call-readiness) */\nexport type {\n BrowserPermissionDeniedIOSStrings,\n BrowserPermissionDeniedIOSProps\n} from './DevicePermissions/BrowserPermissionDeniedIOS';\n\nexport { ParticipantsButton } from './ParticipantsButton';\nexport type {\n ParticipantsButtonContextualMenuStyles,\n ParticipantsButtonProps,\n ParticipantsButtonStrings,\n ParticipantsButtonStyles\n} from './ParticipantsButton';\n\nexport { ScreenShareButton } from './ScreenShareButton';\nexport type { ScreenShareButtonProps, ScreenShareButtonStrings } from './ScreenShareButton';\n\nexport { RaiseHandButton } from './RaiseHandButton';\n\nexport type { RaiseHandButtonProps, RaiseHandButtonStrings } from './RaiseHandButton';\n/* @conditional-compile-remove(reaction) */\nexport { ReactionButton } from './ReactionButton';\n/* @conditional-compile-remove(reaction) */\nexport type { ReactionButtonProps, ReactionButtonStrings } from './ReactionButton';\nexport { VideoTile } from './VideoTile';\nexport type { VideoTileProps, VideoTileStylesProps } from './VideoTile';\n/* @conditional-compile-remove(PSTN-calls) */\nexport type { VideoTileStrings } from './VideoTile';\n\nexport { _PictureInPictureInPicture } from './PictureInPictureInPicture/PictureInPictureInPicture';\nexport type {\n _PictureInPictureInPictureProps,\n _PictureInPictureInPictureStrings\n} from './PictureInPictureInPicture/PictureInPictureInPicture';\nexport type {\n _PictureInPictureInPictureTileProps,\n _TileOrientation\n} from './PictureInPictureInPicture/PictureInPictureInPictureTile';\n\nexport * from './Drawer';\n/* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */\nexport type { SendBoxErrorBarError } from './SendBoxErrorBar';\nexport * from './AttachmentCard';\nexport * from './AttachmentCardGroup';\nexport * from './ModalClone/ModalClone';\nexport * from './AttachmentDownloadCards';\nexport type { _AttachmentUploadCardsStrings } from './AttachmentUploadCards';\n\nexport type {\n AttachmentOptions,\n AttachmentUploadOptions,\n AttachmentMetadata,\n AttachmentUploadStatus,\n AttachmentUploadHandler,\n AttachmentUploadManager\n} from '../types/Attachment';\n\n/* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */\nexport type { AttachmentMenuAction, AttachmentDownloadOptions } from '../types/Attachment';\n\nexport { _useContainerHeight, _useContainerWidth } from './utils/responsive';\n\nexport { _ComplianceBanner } from './ComplianceBanner';\nexport type { _ComplianceBannerProps, _ComplianceBannerStrings } from './ComplianceBanner';\nexport { Dialpad } from './Dialpad/Dialpad';\nexport type { DialpadProps, DialpadStrings, DialpadStyles, DtmfTone } from './Dialpad/Dialpad';\nexport type { DialpadMode, LongPressTrigger } from './Dialpad/Dialpad';\n/* @conditional-compile-remove(end-of-call-survey) */\nexport { _StarSurvey } from './Survey/StarSurvey/StarSurvey';\n/* @conditional-compile-remove(end-of-call-survey) */\nexport type { _StarSurveyProps, _StarSurveyStrings } from './Survey/StarSurvey/StarSurvey';\n/* @conditional-compile-remove(end-of-call-survey) */\nexport * from './Survey/SurveyTypes';\n/* @conditional-compile-remove(end-of-call-survey) */\nexport { _TagsSurvey } from './Survey/TagsSurvey/TagsSurvey';\n/* @conditional-compile-remove(end-of-call-survey) */\nexport type { _TagsSurveyProps, _TagsSurveyStrings, _IssueCategory, _SurveyTag } from './Survey/TagsSurvey/TagsSurvey';\n/* @conditional-compile-remove(PSTN-calls) */\nexport { HoldButton } from './HoldButton';\n/* @conditional-compile-remove(PSTN-calls) */\nexport type { HoldButtonProps, HoldButtonStrings } from './HoldButton';\n\nexport { _LocalVideoTile } from './LocalVideoTile';\nexport { _RemoteVideoTile } from './RemoteVideoTile';\nexport { _HighContrastAwareIcon } from './HighContrastAwareIcon';\nexport type { _HighContrastAwareIconProps } from './HighContrastAwareIcon';\n\nexport { UnsupportedBrowser } from './UnsupportedBrowser';\nexport type { UnsupportedBrowserStrings, UnsupportedBrowserProps } from './UnsupportedBrowser';\nexport { UnsupportedBrowserVersion } from './UnsupportedBrowserVersion';\nexport type { UnsupportedBrowserVersionStrings, UnsupportedBrowserVersionProps } from './UnsupportedBrowserVersion';\nexport { UnsupportedOperatingSystem } from './UnsupportedOperatingSystem';\nexport type { UnsupportedOperatingSystemStrings, UnsupportedOperatingSystemProps } from './UnsupportedOperatingSystem';\n\nexport { _TroubleshootingGuideErrorBar } from './TroubleshootingGuideErrorBar';\nexport type {\n _TroubleshootingGuideErrorBarStrings,\n _TroubleshootingGuideErrorBarProps\n} from './TroubleshootingGuideErrorBar';\n\nexport { _DevicePermissionDropdown } from './DevicePermissions/DevicePermissionDropdown';\nexport type {\n _DevicePermissionDropdownStrings,\n _DevicePermissionDropdownProps,\n _PermissionConstraints\n} from './DevicePermissions/DevicePermissionDropdown';\n\nexport { _VideoEffectsItem } from './VideoEffects/VideoEffectsItem';\nexport type { _VideoEffectsItemProps, _VideoEffectsItemStyles } from './VideoEffects/VideoEffectsItem';\nexport {\n _VideoEffectsItemNoBackground,\n _VideoEffectsItemBlur,\n _VideoEffectsItemAddImage\n} from './VideoEffects/PresetVideoEffectsItems';\n\nexport { _VideoBackgroundEffectsPicker } from './VideoEffects/VideoBackgroundEffectsPicker';\nexport type {\n _VideoBackgroundEffectsPickerProps,\n _VideoBackgroundEffectChoiceOption,\n _VideoBackgroundEffectsPickerStyles\n} from './VideoEffects/VideoBackgroundEffectsPicker';\n\nexport type { VerticalGalleryStyles, VerticalGalleryStrings, VerticalGalleryControlBarStyles } from './VerticalGallery';\n/* @conditional-compile-remove(close-captions) */\nexport * from './CaptionsBanner';\n/* @conditional-compile-remove(close-captions) */\nexport * from './Caption';\n/* @conditional-compile-remove(close-captions) */\nexport * from './StartCaptionsButton';\n/* @conditional-compile-remove(close-captions) */\nexport * from './CaptionsSettingsModal';\n"]}
@@ -1,4 +1,4 @@
1
- import { ITooltipHostStyles } from '@fluentui/react';
1
+ import { ITooltipHostStyles, IStyle } from '@fluentui/react';
2
2
  import React from 'react';
3
3
  /**
4
4
  * @private
@@ -10,12 +10,12 @@ export declare const playFrames: () => string;
10
10
  *
11
11
  * @private
12
12
  */
13
- export declare const emojiStyles: (backgroundImage: string, animationPlayState: string) => React.CSSProperties;
13
+ export declare const emojiStyles: (backgroundImage: string, frameCount: number) => IStyle;
14
14
  /**
15
15
  *
16
16
  * @private
17
17
  */
18
- export declare const reactionEmojiMenuStyles: () => React.CSSProperties;
18
+ export declare const reactionEmojiMenuStyles: () => IStyle;
19
19
  /**
20
20
  *
21
21
  * @private
@@ -21,26 +21,29 @@ export const playFrames = memoizeFunction(() => keyframes({
21
21
  *
22
22
  * @private
23
23
  */
24
- export const emojiStyles = (backgroundImage, animationPlayState) => {
24
+ export const emojiStyles = (backgroundImage, frameCount) => {
25
25
  const imageResourceUrl = `url(${backgroundImage})`;
26
+ const steps = frameCount !== null && frameCount !== void 0 ? frameCount : 51;
26
27
  return {
27
28
  display: 'flex',
28
29
  flexDirection: 'column',
29
30
  height: '100%',
30
31
  width: '100%',
31
32
  backgroundImage: imageResourceUrl,
32
- animationName: playFrames(),
33
- animationDuration: '8.12s',
34
- animationTimingFunction: `steps(102)`,
35
- animationPlayState: animationPlayState,
36
- animationIterationCount: 'infinite',
37
33
  justifyContent: 'center',
38
34
  alignItems: 'center',
39
- backgroundPosition: 'center',
40
35
  backgroundSize: `2.75rem 133.875rem`,
41
36
  transition: 'opacity 2s',
42
37
  backgroundColor: 'transparent',
43
- transform: `${animationPlayState === 'running' ? 'scale(0.8)' : 'scale(0.6)'}`
38
+ transform: 'scale(0.6)',
39
+ ':hover': {
40
+ transform: 'scale(0.8)',
41
+ animationName: playFrames(),
42
+ animationDuration: '8.12s',
43
+ animationTimingFunction: `steps(${steps})`,
44
+ animationIterationCount: 'infinite',
45
+ backgroundColor: 'unset'
46
+ }
44
47
  };
45
48
  };
46
49
  /* @conditional-compile-remove(reaction) */
@@ -55,7 +58,11 @@ export const reactionEmojiMenuStyles = () => {
55
58
  alignItems: 'center',
56
59
  flexDirection: 'row',
57
60
  width: '13.75rem',
58
- height: '2.625rem'
61
+ height: '2.625rem',
62
+ // Ensure that when one emoji is hovered, the other emojis are partially faded out
63
+ ':hover > :not(:hover)': {
64
+ opacity: '0.5'
65
+ }
59
66
  };
60
67
  };
61
68
  /* @conditional-compile-remove(reaction) */
@@ -1 +1 @@
1
- {"version":3,"file":"ReactionButton.styles.js","sourceRoot":"","sources":["../../../../../../../react-components/src/components/styles/ReactionButton.styles.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\n/* @conditional-compile-remove(reaction) */\nimport { ITooltipHostStyles, keyframes, memoizeFunction } from '@fluentui/react';\n/* @conditional-compile-remove(reaction) */\nimport React from 'react';\n\n/* @conditional-compile-remove(reaction) */\n/**\n * @private\n */\nexport const playFrames = memoizeFunction(() =>\n keyframes({\n from: {\n backgroundPosition: '0px 8568px'\n },\n to: {\n backgroundPosition: '0px 0px'\n }\n })\n);\n\n/* @conditional-compile-remove(reaction) */\n/**\n * @param backgroundImage - the uri for the reaction emoji resource\n * @param animationPlayState - the value is either 'running' or 'paused' based on the mouse hover event\n *\n * @private\n */\nexport const emojiStyles = (backgroundImage: string, animationPlayState: string): React.CSSProperties => {\n const imageResourceUrl = `url(${backgroundImage})`;\n return {\n display: 'flex',\n flexDirection: 'column',\n height: '100%',\n width: '100%',\n backgroundImage: imageResourceUrl,\n animationName: playFrames(),\n animationDuration: '8.12s',\n animationTimingFunction: `steps(102)`,\n animationPlayState: animationPlayState,\n animationIterationCount: 'infinite',\n justifyContent: 'center',\n alignItems: 'center',\n backgroundPosition: 'center',\n backgroundSize: `2.75rem 133.875rem`,\n transition: 'opacity 2s',\n backgroundColor: 'transparent',\n transform: `${animationPlayState === 'running' ? 'scale(0.8)' : 'scale(0.6)'}`\n };\n};\n\n/* @conditional-compile-remove(reaction) */\n/**\n *\n * @private\n */\nexport const reactionEmojiMenuStyles = (): React.CSSProperties => {\n return {\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n flexDirection: 'row',\n width: '13.75rem',\n height: '2.625rem'\n };\n};\n\n/* @conditional-compile-remove(reaction) */\n/**\n *\n * @private\n */\nexport const reactionToolTipHostStyle = (): ITooltipHostStyles => {\n return {\n root: {\n display: 'flex',\n flexDirection: 'column',\n height: '100%',\n width: '100%'\n }\n };\n};\n\n/* @conditional-compile-remove(reaction) */\n/**\n *\n * @private\n */\nexport const mobileViewMenuItemStyle = (): React.CSSProperties => {\n return {\n display: 'flex',\n justifyContent: 'space-between',\n alignItems: 'center',\n flexDirection: 'row',\n width: '100%',\n height: '2.625rem'\n };\n};\n\n/* @conditional-compile-remove(reaction) */\n/**\n * @param backgroundImage - the uri for the reaction emoji resource\n * @param animationPlayState - the value is either 'running' or 'paused' based on the mouse hover event\n *\n * @private\n */\nexport const mobileViewEmojiStyles = (backgroundImage: string, animationPlayState: string): React.CSSProperties => {\n const imageResourceUrl = `url(${backgroundImage})`;\n return {\n display: 'flex',\n flexDirection: 'column',\n height: '100%',\n width: '2.75rem',\n backgroundImage: imageResourceUrl,\n animationName: playFrames(),\n animationDuration: '8.12s',\n animationTimingFunction: `steps(102)`,\n animationPlayState: animationPlayState,\n animationIterationCount: 'infinite',\n justifyContent: 'center',\n alignItems: 'center',\n backgroundPosition: 'center',\n backgroundSize: `2.75rem 133.875rem`,\n transition: 'opacity 2s',\n backgroundColor: 'transparent',\n transform: `${animationPlayState === 'running' ? 'scale(0.8)' : 'scale(0.6)'}`\n };\n};\n"]}
1
+ {"version":3,"file":"ReactionButton.styles.js","sourceRoot":"","sources":["../../../../../../../react-components/src/components/styles/ReactionButton.styles.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\n/* @conditional-compile-remove(reaction) */\nimport { ITooltipHostStyles, keyframes, memoizeFunction, IStyle } from '@fluentui/react';\n/* @conditional-compile-remove(reaction) */\nimport React from 'react';\n\n/* @conditional-compile-remove(reaction) */\n/**\n * @private\n */\nexport const playFrames = memoizeFunction(() =>\n keyframes({\n from: {\n backgroundPosition: '0px 8568px'\n },\n to: {\n backgroundPosition: '0px 0px'\n }\n })\n);\n\n/* @conditional-compile-remove(reaction) */\n/**\n * @param backgroundImage - the uri for the reaction emoji resource\n * @param animationPlayState - the value is either 'running' or 'paused' based on the mouse hover event\n *\n * @private\n */\nexport const emojiStyles = (backgroundImage: string, frameCount: number): IStyle => {\n const imageResourceUrl = `url(${backgroundImage})`;\n const steps = frameCount ?? 51;\n return {\n display: 'flex',\n flexDirection: 'column',\n height: '100%',\n width: '100%',\n backgroundImage: imageResourceUrl,\n justifyContent: 'center',\n alignItems: 'center',\n backgroundSize: `2.75rem 133.875rem`,\n transition: 'opacity 2s',\n backgroundColor: 'transparent',\n transform: 'scale(0.6)',\n ':hover': {\n transform: 'scale(0.8)',\n animationName: playFrames(),\n animationDuration: '8.12s',\n animationTimingFunction: `steps(${steps})`,\n animationIterationCount: 'infinite',\n backgroundColor: 'unset'\n }\n };\n};\n\n/* @conditional-compile-remove(reaction) */\n/**\n *\n * @private\n */\nexport const reactionEmojiMenuStyles = (): IStyle => {\n return {\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n flexDirection: 'row',\n width: '13.75rem',\n height: '2.625rem',\n\n // Ensure that when one emoji is hovered, the other emojis are partially faded out\n ':hover > :not(:hover)': {\n opacity: '0.5'\n }\n };\n};\n\n/* @conditional-compile-remove(reaction) */\n/**\n *\n * @private\n */\nexport const reactionToolTipHostStyle = (): ITooltipHostStyles => {\n return {\n root: {\n display: 'flex',\n flexDirection: 'column',\n height: '100%',\n width: '100%'\n }\n };\n};\n\n/* @conditional-compile-remove(reaction) */\n/**\n *\n * @private\n */\nexport const mobileViewMenuItemStyle = (): React.CSSProperties => {\n return {\n display: 'flex',\n justifyContent: 'space-between',\n alignItems: 'center',\n flexDirection: 'row',\n width: '100%',\n height: '2.625rem'\n };\n};\n\n/* @conditional-compile-remove(reaction) */\n/**\n * @param backgroundImage - the uri for the reaction emoji resource\n * @param animationPlayState - the value is either 'running' or 'paused' based on the mouse hover event\n *\n * @private\n */\nexport const mobileViewEmojiStyles = (backgroundImage: string, animationPlayState: string): React.CSSProperties => {\n const imageResourceUrl = `url(${backgroundImage})`;\n return {\n display: 'flex',\n flexDirection: 'column',\n height: '100%',\n width: '2.75rem',\n backgroundImage: imageResourceUrl,\n animationName: playFrames(),\n animationDuration: '8.12s',\n animationTimingFunction: `steps(102)`,\n animationPlayState: animationPlayState,\n animationIterationCount: 'infinite',\n justifyContent: 'center',\n alignItems: 'center',\n backgroundPosition: 'center',\n backgroundSize: `2.75rem 133.875rem`,\n transition: 'opacity 2s',\n backgroundColor: 'transparent',\n transform: `${animationPlayState === 'running' ? 'scale(0.8)' : 'scale(0.6)'}`\n };\n};\n"]}
@@ -37,9 +37,10 @@ export interface IReactionStyleBucket {
37
37
  * height, width, and opacity.
38
38
  * @private
39
39
  */
40
- export declare function getReactionStyleBucket(activeSpritesCount: number): IReactionStyleBucket;
40
+ export declare function getReactionStyleBucket(): IReactionStyleBucket;
41
41
  /**
42
42
  * Return a style bucket for burst scenario
43
+ * We can utilize this style when we allow more than 50 reactions at a time. Can be configured through ECS.
43
44
  * @private
44
45
  */
45
46
  export declare function getReactionBurstStyleBucket(): IReactionStyleBucket;
@@ -107,23 +107,18 @@ function scaleStartPos(index) {
107
107
  }
108
108
  /* @conditional-compile-remove(reaction) */
109
109
  /**
110
+ * We have only one bucket item for presentation style of the reaction animation.
111
+ * We are choosing to keep the array so that, in future, with styles needed to get updated, one
112
+ * can add new styles and apply from here, rather than updating over the same style. Later we can remove
113
+ * the old ones.
114
+ * It is for the ease of testing and implementation.
110
115
  * @private
111
116
  */
112
117
  const ReactionStyleBuckets = [
113
- {
114
- sizeScale: 1,
115
- heightMaxScale: 1 * 0.95,
116
- opacityMax: 1
117
- },
118
118
  {
119
119
  sizeScale: 0.9,
120
120
  heightMaxScale: 0.7 * 0.95,
121
121
  opacityMax: 0.9
122
- },
123
- {
124
- sizeScale: 0.8,
125
- heightMaxScale: 0.4 * 0.95,
126
- opacityMax: 0.8
127
122
  }
128
123
  ];
129
124
  /* @conditional-compile-remove(reaction) */
@@ -157,13 +152,16 @@ const ReactionBurstStyleBuckets = [
157
152
  * height, width, and opacity.
158
153
  * @private
159
154
  */
160
- export function getReactionStyleBucket(activeSpritesCount) {
161
- const index = activeSpritesCount < 3 ? 0 : activeSpritesCount < 5 ? getRandomInt(0, 1) : getRandomInt(0, 2);
155
+ export function getReactionStyleBucket() {
156
+ // Having dynamic emoji size on rendering animation impacts performance of the animation itself.
157
+ // So we are choosing to use a fixed size for all cases.
158
+ const index = 0;
162
159
  return ReactionStyleBuckets[index];
163
160
  }
164
161
  /* @conditional-compile-remove(reaction) */
165
162
  /**
166
163
  * Return a style bucket for burst scenario
164
+ * We can utilize this style when we allow more than 50 reactions at a time. Can be configured through ECS.
167
165
  * @private
168
166
  */
169
167
  export function getReactionBurstStyleBucket() {