@sendbird/uikit-react 3.14.11-rc-0 → 3.14.11-rc-2

package/App.js

@@ -1,7 +1,7 @@
 import React__default, { useState, useEffect } from 'react';
 import { SendbirdProvider } from './SendbirdProvider.js';
-import { u as useMediaQueryContext } from './chunks/bundle-5suIscWh.js';
-import { _ as __assign } from './chunks/bundle-DIOwxpcG.js';
+import { u as useMediaQueryContext } from './chunks/bundle-DtSWTWtr.js';
+import { _ as __assign } from './chunks/bundle-Dgdz3Mxr.js';
 import { GroupChannel } from './GroupChannel.js';
 import { GroupChannelList } from './GroupChannelList.js';
 import Channel from './Channel.js';
@@ -9,84 +9,84 @@ import ChannelList from './ChannelList.js';
 import ChannelSettings from './ChannelSettings.js';
 import MessageSearchPannel from './MessageSearch.js';
 import Thread from './Thread.js';
-import { c as classnames } from './chunks/bundle-CdRIsiQ1.js';
+import { c as classnames } from './chunks/bundle-B2IeaApY.js';
 import { GroupChannelHandler } from '@sendbird/chat/groupChannel';
 import { useSendbirdStateContext } from './useSendbirdStateContext.js';
-import { u as uuidv4 } from './chunks/bundle-CjreAsCZ.js';
-import { u as useVoicePlayerContext, a as ALL } from './chunks/bundle-DDA3KytI.js';
-import { g as getCaseResolvedReplyType } from './chunks/bundle-YLpFZFtY.js';
+import { u as uuidv4 } from './chunks/bundle-BX5GrO8n.js';
+import { u as useVoicePlayerContext, a as ALL } from './chunks/bundle-B2lJExh9.js';
+import { g as getCaseResolvedReplyType } from './chunks/bundle-ClqJi4Ro.js';
 import '@sendbird/uikit-tools';
 import './withSendbird.js';
-import './chunks/bundle-se1hgaQ-.js';
-import './chunks/bundle-Bq0-bOfM.js';
+import './chunks/bundle-DHNIsRQa.js';
+import './chunks/bundle-Brw9OjrQ.js';
 import './utils/message/getOutgoingMessageState.js';
-import './chunks/bundle-CT6oIowo.js';
-import './chunks/bundle-DKbR0B7W.js';
+import './chunks/bundle-BqqXeGNg.js';
+import './chunks/bundle-BHnrX2WV.js';
 import 'react-dom';
-import './chunks/bundle-DYYQHn6P.js';
-import './chunks/bundle-CNHyfb7V.js';
-import './chunks/bundle-D7eYnlgm.js';
+import './chunks/bundle-DTl239vR.js';
+import './chunks/bundle-DmSj6Hjk.js';
+import './chunks/bundle-CVGWOdIA.js';
 import './ui/IconButton.js';
 import './ui/Button.js';
-import './chunks/bundle-BlCc7_eN.js';
+import './chunks/bundle-C98BXfOn.js';
 import './ui/Icon.js';
 import 'css-vars-ponyfill';
 import '@sendbird/chat';
 import '@sendbird/chat/openChannel';
-import './chunks/bundle-DjH4PXg3.js';
+import './chunks/bundle-Dh5S9b2r.js';
 import './ui/ContextMenu.js';
 import './ui/SortByRow.js';
-import './chunks/bundle-DBC1lykB.js';
-import './chunks/bundle-DgahgsvJ.js';
-import './chunks/bundle-CSldjYVo.js';
+import './chunks/bundle-R0xAx7N0.js';
+import './chunks/bundle-B-kdGnYe.js';
+import './chunks/bundle-j_Fel9TJ.js';
 import './GroupChannel/context.js';
 import '@sendbird/chat/message';
-import './chunks/bundle-DwvKuCVj.js';
-import './chunks/bundle-WXF4CSL3.js';
-import './chunks/bundle-Bimk6g75.js';
-import './chunks/bundle-DmIUQle9.js';
-import './chunks/bundle-JEz3lgaG.js';
+import './chunks/bundle-BZq6BDQQ.js';
+import './chunks/bundle-C17oAYZm.js';
+import './chunks/bundle-B82rqiCp.js';
+import './chunks/bundle-v-ltAw6i.js';
+import './chunks/bundle-BJw6rZiJ.js';
 import './GroupChannel/components/GroupChannelUI.js';
-import './chunks/bundle-l7d8-RbZ.js';
+import './chunks/bundle-BqWFktq8.js';
 import './GroupChannel/components/TypingIndicator.js';
 import './ui/ConnectionStatus.js';
 import './ui/PlaceHolder.js';
 import './ui/Loader.js';
 import './GroupChannel/components/GroupChannelHeader.js';
-import './chunks/bundle-DlZQhmnG.js';
+import './chunks/bundle-DS-Fuk_y.js';
 import './ui/ChannelAvatar.js';
-import './chunks/bundle-D_CNS70y.js';
+import './chunks/bundle-Cx5T0ayu.js';
 import './ui/ImageRenderer.js';
-import './chunks/bundle-LJTd2kwV.js';
-import './chunks/bundle-PaTjZoup.js';
-import './chunks/bundle-BhXBD0er.js';
+import './chunks/bundle-f-Hyehn7.js';
+import './chunks/bundle-Ga9pQptx.js';
+import './chunks/bundle-BbosIn8q.js';
 import './ui/Header.js';
 import './ui/TextButton.js';
-import './chunks/bundle-DmtJDvJO.js';
+import './chunks/bundle-BOKON27I.js';
 import './GroupChannel/components/MessageList.js';
 import './GroupChannel/components/Message.js';
-import './chunks/bundle-DzwfznTL.js';
-import './chunks/bundle-BH16nLFs.js';
-import './chunks/bundle-CUld9h31.js';
+import './chunks/bundle-CMzCSR6K.js';
+import './chunks/bundle-vger_13c.js';
+import './chunks/bundle-CpiShPj6.js';
 import './Message/hooks/useDirtyGetMentions.js';
 import './ui/DateSeparator.js';
 import './ui/MessageInput.js';
-import './chunks/bundle-BXf_Uoav.js';
-import './chunks/bundle-Cu9lMiME.js';
+import './chunks/bundle-BcHhvEn0.js';
+import './chunks/bundle-BornHxeb.js';
 import 'dompurify';
-import './chunks/bundle-CUa9CREe.js';
-import './chunks/bundle-S6HEUDHq.js';
-import './chunks/bundle-cyqCJOXP.js';
-import './chunks/bundle-_eyrDcfG.js';
+import './chunks/bundle-Bz4F4yj5.js';
+import './chunks/bundle-Cf_UF7dt.js';
+import './chunks/bundle-CoxBTc8h.js';
+import './chunks/bundle-Ct9KQqNU.js';
 import './ui/MessageContent.js';
-import './chunks/bundle-HjRXtQVk.js';
-import './chunks/bundle-e2HPSZbM.js';
-import './chunks/bundle-B9dVXusF.js';
-import './chunks/bundle-DelNZG3a.js';
-import './chunks/bundle-DVk-GxJm.js';
+import './chunks/bundle-D6uHBR67.js';
+import './chunks/bundle-DP3t7Yug.js';
+import './chunks/bundle-v9eowTXW.js';
+import './chunks/bundle-DEphwDei.js';
+import './chunks/bundle-DT35k-yE.js';
 import './ui/MessageItemReactionMenu.js';
 import './ui/ReactionButton.js';
-import './chunks/bundle-BqDr8EF4.js';
+import './chunks/bundle-wzOMG1vL.js';
 import './ui/EmojiReactions.js';
 import './ui/ReactionBadge.js';
 import './ui/BottomSheet.js';
@@ -100,18 +100,18 @@ import './ui/TooltipWrapper.js';
 import './Message/context.js';
 import './ui/AdminMessage.js';
 import './ui/QuoteMessage.js';
-import './chunks/bundle-w4CjbNCf.js';
-import './chunks/bundle-bkcMncK1.js';
+import './chunks/bundle-DZ5fi7Gt.js';
+import './ui/MobileMenu.js';
 import './ui/ThreadReplies.js';
 import './ui/OGMessageItemBody.js';
-import './chunks/bundle-BSk0V4c7.js';
+import './chunks/bundle-DKZ0gYlw.js';
 import './ui/MentionLabel.js';
 import './ui/LinkLabel.js';
 import './ui/TextMessageItemBody.js';
 import './ui/FileMessageItemBody.js';
-import './chunks/bundle-CK_XaTIr.js';
+import './chunks/bundle-BXyg7NKO.js';
 import './ui/FileViewer.js';
-import './chunks/bundle-CeB984LL.js';
+import './chunks/bundle-Xa7FH-g3.js';
 import './ui/VoiceMessageItemBody.js';
 import './ui/ProgressBar.js';
 import './VoicePlayer/useVoicePlayer.js';
@@ -119,7 +119,7 @@ import './ui/PlaybackTime.js';
 import './ui/ThumbnailMessageItemBody.js';
 import './ui/UnknownMessageItemBody.js';
 import './ui/TemplateMessageItemBody.js';
-import './chunks/bundle-BZ0pRqJA.js';
+import './chunks/bundle-CNmZfJhu.js';
 import './ui/FallbackTemplateMessageItemBody.tsx.js';
 import './ui/LoadingTemplateMessageItemBody.tsx.js';
 import './ui/FeedbackIconButton.js';
@@ -128,61 +128,61 @@ import './ui/MessageFeedbackModal.js';
 import './ui/Input.js';
 import './ui/MessageFeedbackFailedModal.js';
 import './GroupChannel/components/SuggestedReplies.js';
-import './chunks/bundle-CsH_9kWB.js';
+import './chunks/bundle-Nz8rpQM2.js';
 import './GroupChannel/components/FileViewer.js';
-import './chunks/bundle-D2r4zv_u.js';
+import './chunks/bundle-DRNeXmBS.js';
 import './GroupChannel/components/RemoveMessageModal.js';
-import './chunks/bundle-BuZc1iHN.js';
-import './chunks/bundle-8B42nAj_.js';
+import './chunks/bundle-BHMe8umn.js';
+import './chunks/bundle-CA9USPM_.js';
 import './GroupChannel/components/UnreadCount.js';
 import './GroupChannel/components/FrozenNotification.js';
 import './ui/TypingIndicatorBubble.js';
 import './Channel/utils/getMessagePartsInfo.js';
 import './Channel/utils/compareMessagesForGrouping.js';
-import './chunks/bundle-CENilyRu.js';
+import './chunks/bundle-G7Lk2-9m.js';
 import './GroupChannel/components/MessageInputWrapper.js';
-import './chunks/bundle-DTdZiBrv.js';
+import './chunks/bundle-Dz7MkxJB.js';
 import './GroupChannel/components/SuggestedMentionList.js';
 import './ui/QuoteMessageInput.js';
 import './VoiceRecorder/useVoiceRecorder.js';
-import './chunks/bundle-Cu1sEVqy.js';
-import './chunks/bundle-QVgZ7Hdj.js';
+import './chunks/bundle-CtYlAFrP.js';
+import './chunks/bundle-Dc1neSVE.js';
 import './GroupChannelList/context.js';
 import './GroupChannelList/components/GroupChannelListUI.js';
-import './chunks/bundle-A2r1XSkU.js';
+import './chunks/bundle-DhWQfsHt.js';
 import './GroupChannelList/components/GroupChannelListHeader.js';
 import './EditUserProfile.js';
 import './EditUserProfile/context.js';
 import './EditUserProfile/components/EditUserProfileUI.js';
-import './chunks/bundle-CmPOY9Ut.js';
-import './chunks/bundle-Co8Cn-Xy.js';
+import './chunks/bundle-BjEJHQzi.js';
+import './chunks/bundle-sb_17v3b.js';
 import './GroupChannelList/components/GroupChannelPreviewAction.js';
 import './GroupChannelList/components/GroupChannelListItem.js';
-import './chunks/bundle-ifQmTDw0.js';
+import './chunks/bundle-Czs-z8ho.js';
 import './ui/Badge.js';
 import './ui/MentionUserLabel.js';
 import './GroupChannelList/components/AddGroupChannel.js';
-import './chunks/bundle-D3FJrZKH.js';
+import './chunks/bundle-BMoAyGqq.js';
 import './CreateChannel.js';
 import './CreateChannel/components/CreateChannelUI.js';
-import './chunks/bundle-C20oLMaA.js';
+import './chunks/bundle-Al7xMPq8.js';
 import './CreateChannel/components/InviteUsers.js';
 import './CreateChannel/components/SelectChannelType.js';
 import './Channel/context.js';
-import './chunks/bundle-CB91svgK.js';
-import './chunks/bundle-CExXoiRc.js';
-import './chunks/bundle-BTrGLGPQ.js';
-import './chunks/bundle-DHgDkkn9.js';
-import './chunks/bundle-CpnV1F7K.js';
+import './chunks/bundle-Cy8hkQJ5.js';
+import './chunks/bundle-BIXlgmcB.js';
+import './chunks/bundle-1h5TdUpX.js';
+import './chunks/bundle-CHRKF0iS.js';
+import './chunks/bundle-BWVDn9Vl.js';
 import './Channel/components/ChannelUI.js';
 import './Channel/components/ChannelHeader.js';
 import './Channel/components/MessageList.js';
 import './Channel/components/Message.js';
 import './Channel/components/FileViewer.js';
 import './Channel/components/RemoveMessageModal.js';
-import './chunks/bundle-DuX-Qk0N.js';
+import './chunks/bundle-Cbn_NoOU.js';
 import './Channel/components/MessageInput.js';
-import './chunks/bundle-DM_G8NqJ.js';
+import './chunks/bundle-DqCjgk8N.js';
 import './ChannelList/components/ChannelListUI.js';
 import './ChannelList/components/ChannelPreview.js';
 import './ChannelList/components/AddChannel.js';
@@ -196,7 +196,7 @@ import './ui/Accordion.js';
 import './ui/AccordionGroup.js';
 import './ui/Toggle.js';
 import './ChannelSettings/components/UserListItem.js';
-import './chunks/bundle-DzOZbhBa.js';
+import './chunks/bundle-D0WXpmty.js';
 import './ChannelSettings/components/LeaveChannel.js';
 import './ChannelSettings/components/UserPanel.js';
 import './MessageSearch/components/MessageSearchUI.js';
@@ -207,11 +207,11 @@ import './Thread/context.js';
 import './Thread/context/types.js';
 import './Thread/components/ThreadUI.js';
 import './Thread/components/ParentMessageInfo.js';
-import './chunks/bundle-DFHJryqD.js';
+import './chunks/bundle-Cb8rFTVf.js';
 import './Thread/components/ParentMessageInfoItem.js';
-import './chunks/bundle-DNCQ4u5R.js';
+import './chunks/bundle-LMN5X4s4.js';
 import './ui/MessageItemMenu.js';
-import './chunks/bundle-Bx3HwK0O.js';
+import './chunks/bundle-DqMfhMoL.js';
 import './Thread/components/ThreadHeader.js';
 import './Thread/components/ThreadList.js';
 import './Thread/components/ThreadListItem.js';

package/CHANGELOG.md

@@ -43,16 +43,92 @@
     On Dark -04 -> Ondark-text-disabled
     ```
 
-### Fixes
-- Fixed an issue where the `newMessages` array was not being reset even after the message list scroll reached the bottom, causing the message notification bar to not disappear properly. Manually called `resetNewMessages()` under certain conditions.
-- Updated the logic to align with other platforms for consistency. Relocated the logic to the same section where other `disabled` conditions are checked.
-
-### Chores
 - Message Menu Component Refactor
   - Created `MessageMenuProvider`, `useMessageMenuContext`, and `MessageMenu` component.
   - Replaced `MessageItemMenu` with `MessageMenu` in **GroupChannel**. Future PR will apply it to Thread.
   - Migrated `MobileContextMenu` and `MobileBottomSheet` using `MessageMenuProvider`.
+  - Exported the `MobileMenu`
+    ```tsx
+    import { MobileMenu, MobileContextMenu, MobileBottomSheet } from '@sendbird/uikit-react/ui/MobileMenu';
+    ```
+  - How to use?
+
+    Desktop menu
+    ```tsx
+    import GroupChannel from '@sendbird/uikit-react/GroupChannel';
+    import MessageContent from '@sendbird/uikit-react/ui/MessageContent';
+    import { MessageMenu } from '@sendbird/uikit-react/ui/MessageMenu';
+
+    const GroupChannelPage = () => (
+      <GroupChannel
+        renderMessageContent={(props) => (
+          <MessageContent
+            {...props}
+            renderMessageMenu={(props) => (
+              <MessageMenu
+                {...props}
+                renderMenuItems={(props) => {
+                  const {
+                    CopyMenuItem,
+                    ReplyMenuItem,
+                    // ...
+                    DeleteMenuItem,
+                  } = props.items;
+                  // organize the menu items using the items
+                  return (
+                    <>
+                      <CopyMenuItem />
+                      <DeleteMenuItem />
+                    </>
+                  );
+                }}
+              />
+            )}
+          />
+        )}
+      />
+    );
+    ```
+    Mobile menu
+    ```tsx
+    import GroupChannel from '@sendbird/uikit-react/GroupChannel';
+    import MessageContent from '@sendbird/uikit-react/ui/MessageContent';
+    import { MobileMenu } from '@sendbird/uikit-react/ui/MessageMenu';
 
+    const GroupChannelPage = () => (
+      <GroupChannel
+        renderMessageContent={(props) => (
+          <MessageContent
+            {...props}
+            renderMobileMenuOnLongPress={(props) => (
+              <MobileMenu
+                {...props}
+                renderMenuItems={(props) => {
+                  const {
+                    CopyMenuItem,
+                    ReplyMenuItem,
+                    // ...
+                    DeleteMenuItem,
+                  } = props.items;
+                  // organize the menu items using the items
+                  return (
+                    <>
+                      <CopyMenuItem />
+                      <DeleteMenuItem />
+                    </>
+                  );
+                }}
+              />
+            )}
+          />
+        )}
+      />
+    );
+    ```
+
+### Fixes
+- Fixed an issue where the `newMessages` array was not being reset even after the message list scroll reached the bottom, causing the message notification bar to not disappear properly. Manually called `resetNewMessages()` under certain conditions.
+- Updated the logic to align with other platforms for consistency. Relocated the logic to the same section where other `disabled` conditions are checked.
 
 ## [v3.14.10] (June 13, 2024)
 ### Fixes

package/Channel/components/ChannelHeader.js

@@ -1,47 +1,47 @@
-import { _ as __assign } from '../../chunks/bundle-DIOwxpcG.js';
+import { _ as __assign } from '../../chunks/bundle-Dgdz3Mxr.js';
 import React__default from 'react';
-import { G as GroupChannelHeaderView } from '../../chunks/bundle-DlZQhmnG.js';
+import { G as GroupChannelHeaderView } from '../../chunks/bundle-DS-Fuk_y.js';
 import { useChannelContext } from '../context.js';
 import '../../ui/Icon.js';
-import '../../chunks/bundle-CdRIsiQ1.js';
+import '../../chunks/bundle-B2IeaApY.js';
 import '../../ui/ChannelAvatar.js';
-import '../../chunks/bundle-D_CNS70y.js';
+import '../../chunks/bundle-Cx5T0ayu.js';
 import '../../ui/ImageRenderer.js';
-import '../../chunks/bundle-LJTd2kwV.js';
-import '../../chunks/bundle-PaTjZoup.js';
-import '../../chunks/bundle-BhXBD0er.js';
-import '../../chunks/bundle-BlCc7_eN.js';
-import '../../chunks/bundle-CNHyfb7V.js';
-import '../../chunks/bundle-5suIscWh.js';
+import '../../chunks/bundle-f-Hyehn7.js';
+import '../../chunks/bundle-Ga9pQptx.js';
+import '../../chunks/bundle-BbosIn8q.js';
+import '../../chunks/bundle-C98BXfOn.js';
+import '../../chunks/bundle-DmSj6Hjk.js';
+import '../../chunks/bundle-DtSWTWtr.js';
 import '../../useSendbirdStateContext.js';
 import '../../withSendbird.js';
-import '../../chunks/bundle-DYYQHn6P.js';
-import '../../chunks/bundle-D7eYnlgm.js';
+import '../../chunks/bundle-DTl239vR.js';
+import '../../chunks/bundle-CVGWOdIA.js';
 import '../../ui/Header.js';
 import '../../ui/TextButton.js';
-import '../../chunks/bundle-DmtJDvJO.js';
+import '../../chunks/bundle-BOKON27I.js';
 import '../../ui/IconButton.js';
-import '../../chunks/bundle-DwvKuCVj.js';
-import '../../chunks/bundle-CUld9h31.js';
-import '../../chunks/bundle-CENilyRu.js';
+import '../../chunks/bundle-BZq6BDQQ.js';
+import '../../chunks/bundle-CpiShPj6.js';
+import '../../chunks/bundle-G7Lk2-9m.js';
 import '@sendbird/chat/message';
-import '../../chunks/bundle-JEz3lgaG.js';
-import '../../chunks/bundle-BH16nLFs.js';
-import '../../chunks/bundle-DKbR0B7W.js';
-import '../../chunks/bundle-Bq0-bOfM.js';
+import '../../chunks/bundle-BJw6rZiJ.js';
+import '../../chunks/bundle-vger_13c.js';
+import '../../chunks/bundle-BHnrX2WV.js';
+import '../../chunks/bundle-Brw9OjrQ.js';
 import '@sendbird/chat/groupChannel';
 import '../../utils/message/getOutgoingMessageState.js';
-import '../../chunks/bundle-CT6oIowo.js';
-import '../../chunks/bundle-CB91svgK.js';
-import '../../chunks/bundle-CExXoiRc.js';
-import '../../chunks/bundle-BTrGLGPQ.js';
-import '../../chunks/bundle-DjH4PXg3.js';
-import '../../chunks/bundle-CjreAsCZ.js';
-import '../../chunks/bundle-DHgDkkn9.js';
-import '../../chunks/bundle-DmIUQle9.js';
-import '../../chunks/bundle-WXF4CSL3.js';
-import '../../chunks/bundle-YLpFZFtY.js';
-import '../../chunks/bundle-CpnV1F7K.js';
+import '../../chunks/bundle-BqqXeGNg.js';
+import '../../chunks/bundle-Cy8hkQJ5.js';
+import '../../chunks/bundle-BIXlgmcB.js';
+import '../../chunks/bundle-1h5TdUpX.js';
+import '../../chunks/bundle-Dh5S9b2r.js';
+import '../../chunks/bundle-BX5GrO8n.js';
+import '../../chunks/bundle-CHRKF0iS.js';
+import '../../chunks/bundle-v-ltAw6i.js';
+import '../../chunks/bundle-C17oAYZm.js';
+import '../../chunks/bundle-ClqJi4Ro.js';
+import '../../chunks/bundle-BWVDn9Vl.js';
 
 var ChannelHeader = function (_a) {
     var className = _a.className;