@sendbird/uikit-react 3.14.3-rc.1 → 3.14.4

package/ui/TypingIndicatorBubble.js

@@ -1,65 +1,65 @@
 import React__default, { useLayoutEffect } from 'react';
-import { A as Avatar, a as AvatarDefault } from '../chunks/bundle-BeTPrbXl.js';
-import '../chunks/bundle-Dd7yWAzk.js';
+import { A as Avatar, a as AvatarDefault } from '../chunks/bundle-CNJMLyGJ.js';
+import '../chunks/bundle-7oF7KbGv.js';
 import './ImageRenderer.js';
-import '../chunks/bundle-ByTQtdFM.js';
-import '../chunks/bundle-BCL7kk-0.js';
+import '../chunks/bundle-ByvmbZD0.js';
+import '../chunks/bundle-CT8ZXUi2.js';
 import './Icon.js';
 
-var TypingDots = function () {
-    return (React__default.createElement("div", { className: 'typing-dots-container' },
-        React__default.createElement("span", null),
-        React__default.createElement("span", null),
-        React__default.createElement("span", null)));
+var TypingDots = function () {
+    return (React__default.createElement("div", { className: 'typing-dots-container' },
+        React__default.createElement("span", null),
+        React__default.createElement("span", null),
+        React__default.createElement("span", null)));
 };
 
-var AVATAR_BORDER_SIZE = 2;
-var AVATAR_DIAMETER_WITHOUT_BORDER = 28;
-var AVATAR_DIAMETER = AVATAR_DIAMETER_WITHOUT_BORDER + (AVATAR_BORDER_SIZE * 2);
-var LEFT_GAP = 24;
-var MAX_PROFILES_COUNT = 3;
-var LEFT_FOR_BORDER = AVATAR_BORDER_SIZE;
-var AvatarStack = function (props) {
-    var sources = props.sources, max = props.max;
-    return (React__default.createElement(React__default.Fragment, null,
-        " ",
-        sources.slice(0, max).map(function (src, index) { return (React__default.createElement(Avatar, { className: 'sendbird-message-content__left__avatar multiple', src: src || '', key: "avatar_stack_item_".concat(src), 
-            // TODO: Divide getting profileUrl logic to utils
-            width: "".concat(AVATAR_DIAMETER_WITHOUT_BORDER, "px"), height: "".concat(AVATAR_DIAMETER_WITHOUT_BORDER, "px"), zIndex: index, left: "".concat(index * LEFT_GAP - LEFT_FOR_BORDER, "px") })); }),
-        " "));
-};
-var TypingIndicatorBubbleAvatar = function (props) {
-    var typingMembers = props.typingMembers;
-    var membersCount = typingMembers.length;
-    var displayCount = Math.min(membersCount, 4);
-    var hiddenCount = membersCount - MAX_PROFILES_COUNT;
-    var superImposedWidth = ((displayCount - 1) * (AVATAR_DIAMETER - LEFT_GAP));
-    var rightPaddingSize = 12;
-    return (React__default.createElement("div", { className: 'sendbird-message-content__left incoming', style: {
-            minWidth: (displayCount * AVATAR_DIAMETER) - superImposedWidth + rightPaddingSize,
-        } },
-        React__default.createElement(AvatarStack, { sources: typingMembers.map(function (member) { return member.profileUrl; }), max: MAX_PROFILES_COUNT }),
-        hiddenCount > 0
-            ? React__default.createElement(Avatar, { className: 'sendbird-message-content__left__avatar multiple', 
-                // TODO: Divide getting profileUrl logic to utils
-                width: "".concat(AVATAR_DIAMETER_WITHOUT_BORDER, "px"), height: "".concat(AVATAR_DIAMETER_WITHOUT_BORDER, "px"), zIndex: MAX_PROFILES_COUNT, left: "".concat(MAX_PROFILES_COUNT * LEFT_GAP, "px"), customDefaultComponent: function (_a) {
-                    var width = _a.width, height = _a.height;
-                    return (React__default.createElement(AvatarDefault, { width: width, height: height, text: "+".concat(hiddenCount) }));
-                } })
-            : null));
-};
-var TypingIndicatorBubble = function (props) {
-    var typingMembers = props.typingMembers, handleScroll = props.handleScroll;
-    if (typingMembers.length === 0)
-        return null;
-    useLayoutEffect(function () {
-        // Keep the scrollBottom value after fetching new message list
-        handleScroll === null || handleScroll === void 0 ? void 0 : handleScroll(true);
-    }, []);
-    return React__default.createElement("div", { className: 'sendbird-message-content incoming', style: { marginBottom: '2px' } },
-        React__default.createElement(TypingIndicatorBubbleAvatar, { typingMembers: typingMembers }),
-        React__default.createElement("div", { className: 'sendbird-message-content__middle' },
-            React__default.createElement(TypingDots, null)));
+var AVATAR_BORDER_SIZE = 2;
+var AVATAR_DIAMETER_WITHOUT_BORDER = 28;
+var AVATAR_DIAMETER = AVATAR_DIAMETER_WITHOUT_BORDER + (AVATAR_BORDER_SIZE * 2);
+var LEFT_GAP = 24;
+var MAX_PROFILES_COUNT = 3;
+var LEFT_FOR_BORDER = AVATAR_BORDER_SIZE;
+var AvatarStack = function (props) {
+    var sources = props.sources, max = props.max;
+    return (React__default.createElement(React__default.Fragment, null,
+        " ",
+        sources.slice(0, max).map(function (src, index) { return (React__default.createElement(Avatar, { className: 'sendbird-message-content__left__avatar multiple', src: src || '', key: "avatar_stack_item_".concat(src), 
+            // TODO: Divide getting profileUrl logic to utils
+            width: "".concat(AVATAR_DIAMETER_WITHOUT_BORDER, "px"), height: "".concat(AVATAR_DIAMETER_WITHOUT_BORDER, "px"), zIndex: index, left: "".concat(index * LEFT_GAP - LEFT_FOR_BORDER, "px") })); }),
+        " "));
+};
+var TypingIndicatorBubbleAvatar = function (props) {
+    var typingMembers = props.typingMembers;
+    var membersCount = typingMembers.length;
+    var displayCount = Math.min(membersCount, 4);
+    var hiddenCount = membersCount - MAX_PROFILES_COUNT;
+    var superImposedWidth = ((displayCount - 1) * (AVATAR_DIAMETER - LEFT_GAP));
+    var rightPaddingSize = 12;
+    return (React__default.createElement("div", { className: 'sendbird-message-content__left incoming', style: {
+            minWidth: (displayCount * AVATAR_DIAMETER) - superImposedWidth + rightPaddingSize,
+        } },
+        React__default.createElement(AvatarStack, { sources: typingMembers.map(function (member) { return member.profileUrl; }), max: MAX_PROFILES_COUNT }),
+        hiddenCount > 0
+            ? React__default.createElement(Avatar, { className: 'sendbird-message-content__left__avatar multiple', 
+                // TODO: Divide getting profileUrl logic to utils
+                width: "".concat(AVATAR_DIAMETER_WITHOUT_BORDER, "px"), height: "".concat(AVATAR_DIAMETER_WITHOUT_BORDER, "px"), zIndex: MAX_PROFILES_COUNT, left: "".concat(MAX_PROFILES_COUNT * LEFT_GAP, "px"), customDefaultComponent: function (_a) {
+                    var width = _a.width, height = _a.height;
+                    return (React__default.createElement(AvatarDefault, { width: width, height: height, text: "+".concat(hiddenCount) }));
+                } })
+            : null));
+};
+var TypingIndicatorBubble = function (props) {
+    var typingMembers = props.typingMembers, handleScroll = props.handleScroll;
+    if (typingMembers.length === 0)
+        return null;
+    useLayoutEffect(function () {
+        // Keep the scrollBottom value after fetching new message list
+        handleScroll === null || handleScroll === void 0 ? void 0 : handleScroll(true);
+    }, []);
+    return React__default.createElement("div", { className: 'sendbird-message-content incoming', style: { marginBottom: '2px' } },
+        React__default.createElement(TypingIndicatorBubbleAvatar, { typingMembers: typingMembers }),
+        React__default.createElement("div", { className: 'sendbird-message-content__middle' },
+            React__default.createElement(TypingDots, null)));
 };
 
 export { TypingIndicatorBubble as default };

package/ui/UnknownMessageItemBody.js

@@ -1,27 +1,26 @@
 import React__default, { useContext } from 'react';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../chunks/bundle-DjFflxR1.js';
-import { w as getClassName } from '../chunks/bundle-Cgpa9xMh.js';
-import { L as LocalizationContext } from '../chunks/bundle-DW4HEvvh.js';
-import '../chunks/bundle-Dd7yWAzk.js';
-import '../chunks/bundle-CwG4pj5M.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../chunks/bundle-LYAWKk4n.js';
+import { w as getClassName } from '../chunks/bundle-BWCGFXhj.js';
+import { L as LocalizationContext } from '../chunks/bundle-Bx5vhTbU.js';
+import '../chunks/bundle-7oF7KbGv.js';
+import '../chunks/bundle-C8im5l9B.js';
 import '@sendbird/chat/groupChannel';
 import '../utils/message/getOutgoingMessageState.js';
-import '../chunks/bundle-58U1RLA2.js';
-import '../chunks/bundle-DD0CjCiu.js';
+import '../chunks/bundle-C1ds4cil.js';
 
-function UnknownMessageItemBody(_a) {
-    var _b;
-    var className = _a.className, message = _a.message, _c = _a.isByMe, isByMe = _c === void 0 ? false : _c, _d = _a.mouseHover, mouseHover = _d === void 0 ? false : _d, _e = _a.isReactionEnabled, isReactionEnabled = _e === void 0 ? false : _e;
-    var stringSet = useContext(LocalizationContext).stringSet;
-    return (React__default.createElement("div", { className: getClassName([
-            className,
-            'sendbird-unknown-message-item-body',
-            isByMe ? 'outgoing' : 'incoming',
-            mouseHover ? 'mouse-hover' : '',
-            (isReactionEnabled && ((_b = message === null || message === void 0 ? void 0 : message.reactions) === null || _b === void 0 ? void 0 : _b.length) > 0) ? 'reactions' : '',
-        ]) },
-        React__default.createElement(Label, { className: "sendbird-unknown-message-item-body__header", type: LabelTypography.BODY_1, color: isByMe ? LabelColors.ONCONTENT_1 : LabelColors.ONBACKGROUND_1 }, stringSet.UNKNOWN__UNKNOWN_MESSAGE_TYPE),
-        React__default.createElement(Label, { className: "sendbird-unknown-message-item-body__description", type: LabelTypography.BODY_1, color: isByMe ? LabelColors.ONCONTENT_2 : LabelColors.ONBACKGROUND_2 }, stringSet.UNKNOWN__CANNOT_READ_MESSAGE)));
+function UnknownMessageItemBody(_a) {
+    var _b;
+    var className = _a.className, message = _a.message, _c = _a.isByMe, isByMe = _c === void 0 ? false : _c, _d = _a.mouseHover, mouseHover = _d === void 0 ? false : _d, _e = _a.isReactionEnabled, isReactionEnabled = _e === void 0 ? false : _e;
+    var stringSet = useContext(LocalizationContext).stringSet;
+    return (React__default.createElement("div", { className: getClassName([
+            className,
+            'sendbird-unknown-message-item-body',
+            isByMe ? 'outgoing' : 'incoming',
+            mouseHover ? 'mouse-hover' : '',
+            (isReactionEnabled && ((_b = message === null || message === void 0 ? void 0 : message.reactions) === null || _b === void 0 ? void 0 : _b.length) > 0) ? 'reactions' : '',
+        ]) },
+        React__default.createElement(Label, { className: "sendbird-unknown-message-item-body__header", type: LabelTypography.BODY_1, color: isByMe ? LabelColors.ONCONTENT_1 : LabelColors.ONBACKGROUND_1 }, stringSet.UNKNOWN__UNKNOWN_MESSAGE_TYPE),
+        React__default.createElement(Label, { className: "sendbird-unknown-message-item-body__description", type: LabelTypography.BODY_1, color: isByMe ? LabelColors.ONCONTENT_2 : LabelColors.ONBACKGROUND_2 }, stringSet.UNKNOWN__CANNOT_READ_MESSAGE)));
 }
 
 export { UnknownMessageItemBody as default };

package/ui/UnknownMessageItemBody.js.map

@@ -1 +1 @@
-{"version":3,"file":"UnknownMessageItemBody.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"UnknownMessageItemBody.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/ui/UserListItem.js

@@ -1,77 +1,77 @@
-import { c as __spreadArray } from '../chunks/bundle-Dd7yWAzk.js';
+import { c as __spreadArray } from '../chunks/bundle-7oF7KbGv.js';
 import React__default, { useContext } from 'react';
-import { a as UserProfileContext } from '../chunks/bundle-BZt7yK_Y.js';
-import { L as LocalizationContext } from '../chunks/bundle-DW4HEvvh.js';
-import { A as Avatar } from '../chunks/bundle-BeTPrbXl.js';
+import { a as UserProfileContext } from '../chunks/bundle-B7barEsR.js';
+import { L as LocalizationContext } from '../chunks/bundle-Bx5vhTbU.js';
+import { A as Avatar } from '../chunks/bundle-CNJMLyGJ.js';
 import MutedAvatarOverlay from './MutedAvatarOverlay.js';
 import Checkbox from './Checkbox.js';
 import UserProfile from './UserProfile.js';
 import ContextMenu, { MenuItems } from './ContextMenu.js';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../chunks/bundle-DjFflxR1.js';
-import '../chunks/bundle-CwG4pj5M.js';
-import '../chunks/bundle-DD0CjCiu.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../chunks/bundle-LYAWKk4n.js';
+import '../chunks/bundle-C8im5l9B.js';
+import '../chunks/bundle-C1ds4cil.js';
 import './ImageRenderer.js';
-import '../chunks/bundle-ByTQtdFM.js';
-import '../chunks/bundle-BCL7kk-0.js';
+import '../chunks/bundle-ByvmbZD0.js';
+import '../chunks/bundle-CT8ZXUi2.js';
 import './Icon.js';
 import '../sendbirdSelectors.js';
-import '../chunks/bundle-DtHyIHaJ.js';
+import '../chunks/bundle-BWuyd0AD.js';
 import './Button.js';
 import '../useSendbirdStateContext.js';
 import '../withSendbird.js';
+import '../chunks/bundle-BbWD2VuS.js';
 import 'react-dom';
 import '@sendbird/chat';
 import '@sendbird/chat/openChannel';
 import './SortByRow.js';
-import '../chunks/bundle-D7HxTsM2.js';
-import '../chunks/bundle-Cgpa9xMh.js';
+import '../chunks/bundle-BJ46V6XQ.js';
+import '../chunks/bundle-BWCGFXhj.js';
 import '@sendbird/chat/groupChannel';
 import '../utils/message/getOutgoingMessageState.js';
-import '../chunks/bundle-58U1RLA2.js';
 
-function UserListItem(_a) {
-    var user = _a.user, className = _a.className, checked = _a.checked, checkBox = _a.checkBox, isOperator = _a.isOperator, disabled = _a.disabled, disableMessaging = _a.disableMessaging, currentUser = _a.currentUser, action = _a.action, onChange = _a.onChange, _b = _a.avatarSize, avatarSize = _b === void 0 ? '40px' : _b, onClick = _a.onClick, onUserAvatarClick = _a.onUserAvatarClick;
-    var operator = isOperator !== null && isOperator !== void 0 ? isOperator : (user === null || user === void 0 ? void 0 : user.role) === 'operator';
-    var uniqueKey = user.userId;
-    var actionRef = React__default.useRef(null);
-    var parentRef = React__default.useRef(null);
-    var avatarRef = React__default.useRef(null);
-    var _c = useContext(UserProfileContext), disableUserProfile = _c.disableUserProfile, renderUserProfile = _c.renderUserProfile;
-    var stringSet = useContext(LocalizationContext).stringSet;
-    return (React__default.createElement("div", { className: __spreadArray(__spreadArray([], (Array.isArray(className) ? className : [className]), true), [
-            'sendbird-user-list-item',
-        ], false).join(' '), ref: parentRef },
-        (user === null || user === void 0 ? void 0 : user.isMuted) && (React__default.createElement(MutedAvatarOverlay, { height: 40, width: 40 })),
-        React__default.createElement(ContextMenu, { menuTrigger: function (toggleDropdown) { return (React__default.createElement(Avatar, { className: "sendbird-user-list-item__avatar", ref: avatarRef, src: (user === null || user === void 0 ? void 0 : user.profileUrl) || (user === null || user === void 0 ? void 0 : user.plainProfileUrl) || '', width: avatarSize, height: avatarSize, onClick: function () {
-                    var _a;
-                    if (!disableUserProfile) {
-                        toggleDropdown();
-                        (_a = (onUserAvatarClick !== null && onUserAvatarClick !== void 0 ? onUserAvatarClick : onClick)) === null || _a === void 0 ? void 0 : _a();
-                    }
-                } })); }, menuItems: function (closeDropdown) { return (renderUserProfile
-                ? renderUserProfile({
-                    user: user,
-                    currentUserId: currentUser,
-                    close: closeDropdown,
-                    avatarRef: avatarRef,
-                })
-                : (React__default.createElement(MenuItems, { openLeft: true, parentRef: avatarRef, 
-                    // for catching location(x, y) of MenuItems
-                    parentContainRef: avatarRef, 
-                    // for toggling more options(menus & reactions)
-                    closeDropdown: closeDropdown, style: { paddingTop: '0px', paddingBottom: '0px' } },
-                    React__default.createElement(UserProfile, { disableMessaging: disableMessaging, user: user, currentUserId: currentUser, onSuccess: closeDropdown })))); } }),
-        React__default.createElement(Label, { className: "sendbird-user-list-item__title", type: LabelTypography.SUBTITLE_1, color: LabelColors.ONBACKGROUND_1 },
-            user.nickname || stringSet.NO_NAME,
-            (currentUser === user.userId) && (stringSet.CHANNEL_SETTING__MEMBERS__YOU)),
-        !user.nickname && (React__default.createElement(Label, { className: "sendbird-user-list-item__subtitle", type: LabelTypography.CAPTION_3, color: LabelColors.ONBACKGROUND_2 }, user.userId)),
-        checkBox && (React__default.createElement("label", { className: "sendbird-user-list-item__checkbox", htmlFor: uniqueKey },
-            React__default.createElement(Checkbox, { id: uniqueKey, checked: checked, disabled: disabled, onChange: function (event) { return onChange(event); } }))),
-        operator && (React__default.createElement(Label, { className: [
-                'sendbird-user-list-item__operator',
-                checkBox ? 'checkbox' : '',
-            ].join(' '), type: LabelTypography.SUBTITLE_2, color: LabelColors.ONBACKGROUND_2 }, stringSet.LABEL__OPERATOR)),
-        action && (React__default.createElement("div", { className: "sendbird-user-list-item__action", ref: actionRef }, action({ actionRef: actionRef, parentRef: parentRef })))));
+function UserListItem(_a) {
+    var user = _a.user, className = _a.className, checked = _a.checked, checkBox = _a.checkBox, isOperator = _a.isOperator, disabled = _a.disabled, disableMessaging = _a.disableMessaging, currentUser = _a.currentUser, action = _a.action, onChange = _a.onChange, _b = _a.avatarSize, avatarSize = _b === void 0 ? '40px' : _b, onClick = _a.onClick, onUserAvatarClick = _a.onUserAvatarClick;
+    var operator = isOperator !== null && isOperator !== void 0 ? isOperator : (user === null || user === void 0 ? void 0 : user.role) === 'operator';
+    var uniqueKey = user.userId;
+    var actionRef = React__default.useRef(null);
+    var parentRef = React__default.useRef(null);
+    var avatarRef = React__default.useRef(null);
+    var _c = useContext(UserProfileContext), disableUserProfile = _c.disableUserProfile, renderUserProfile = _c.renderUserProfile;
+    var stringSet = useContext(LocalizationContext).stringSet;
+    return (React__default.createElement("div", { className: __spreadArray(__spreadArray([], (Array.isArray(className) ? className : [className]), true), [
+            'sendbird-user-list-item',
+        ], false).join(' '), ref: parentRef },
+        (user === null || user === void 0 ? void 0 : user.isMuted) && (React__default.createElement(MutedAvatarOverlay, { height: 40, width: 40 })),
+        React__default.createElement(ContextMenu, { menuTrigger: function (toggleDropdown) { return (React__default.createElement(Avatar, { className: "sendbird-user-list-item__avatar", ref: avatarRef, src: (user === null || user === void 0 ? void 0 : user.profileUrl) || (user === null || user === void 0 ? void 0 : user.plainProfileUrl) || '', width: avatarSize, height: avatarSize, onClick: function () {
+                    var _a;
+                    if (!disableUserProfile) {
+                        toggleDropdown();
+                        (_a = (onUserAvatarClick !== null && onUserAvatarClick !== void 0 ? onUserAvatarClick : onClick)) === null || _a === void 0 ? void 0 : _a();
+                    }
+                } })); }, menuItems: function (closeDropdown) { return (renderUserProfile
+                ? renderUserProfile({
+                    user: user,
+                    currentUserId: currentUser,
+                    close: closeDropdown,
+                    avatarRef: avatarRef,
+                })
+                : (React__default.createElement(MenuItems, { openLeft: true, parentRef: avatarRef, 
+                    // for catching location(x, y) of MenuItems
+                    parentContainRef: avatarRef, 
+                    // for toggling more options(menus & reactions)
+                    closeDropdown: closeDropdown, style: { paddingTop: '0px', paddingBottom: '0px' } },
+                    React__default.createElement(UserProfile, { disableMessaging: disableMessaging, user: user, currentUserId: currentUser, onSuccess: closeDropdown })))); } }),
+        React__default.createElement(Label, { className: "sendbird-user-list-item__title", type: LabelTypography.SUBTITLE_1, color: LabelColors.ONBACKGROUND_1 },
+            user.nickname || stringSet.NO_NAME,
+            (currentUser === user.userId) && (stringSet.CHANNEL_SETTING__MEMBERS__YOU)), // if there is now nickname, display userId
+        !user.nickname && (React__default.createElement(Label, { className: "sendbird-user-list-item__subtitle", type: LabelTypography.CAPTION_3, color: LabelColors.ONBACKGROUND_2 }, user.userId)),
+        checkBox && (React__default.createElement("label", { className: "sendbird-user-list-item__checkbox", htmlFor: uniqueKey },
+            React__default.createElement(Checkbox, { id: uniqueKey, checked: checked, disabled: disabled, onChange: function (event) { return onChange(event); } }))),
+        operator && (React__default.createElement(Label, { className: [
+                'sendbird-user-list-item__operator',
+                checkBox ? 'checkbox' : '',
+            ].join(' '), type: LabelTypography.SUBTITLE_2, color: LabelColors.ONBACKGROUND_2 }, stringSet.LABEL__OPERATOR)),
+        action && (React__default.createElement("div", { className: "sendbird-user-list-item__action", ref: actionRef }, action({ actionRef: actionRef, parentRef: parentRef })))));
 }
 
 export { UserListItem as default };

package/ui/UserProfile.js

@@ -1,56 +1,56 @@
 import React__default, { useContext } from 'react';
-import { L as LocalizationContext } from '../chunks/bundle-DW4HEvvh.js';
-import { a as UserProfileContext } from '../chunks/bundle-BZt7yK_Y.js';
+import { L as LocalizationContext } from '../chunks/bundle-Bx5vhTbU.js';
+import { a as UserProfileContext } from '../chunks/bundle-B7barEsR.js';
 import { getCreateGroupChannel } from '../sendbirdSelectors.js';
-import { A as Avatar } from '../chunks/bundle-BeTPrbXl.js';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../chunks/bundle-DjFflxR1.js';
+import { A as Avatar } from '../chunks/bundle-CNJMLyGJ.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../chunks/bundle-LYAWKk4n.js';
 import Button, { ButtonTypes } from './Button.js';
 import { useSendbirdStateContext } from '../useSendbirdStateContext.js';
-import '../chunks/bundle-CwG4pj5M.js';
-import '../chunks/bundle-DD0CjCiu.js';
-import '../chunks/bundle-DtHyIHaJ.js';
-import '../chunks/bundle-ByTQtdFM.js';
-import '../chunks/bundle-Dd7yWAzk.js';
+import '../chunks/bundle-C8im5l9B.js';
+import '../chunks/bundle-C1ds4cil.js';
+import '../chunks/bundle-BWuyd0AD.js';
+import '../chunks/bundle-ByvmbZD0.js';
+import '../chunks/bundle-7oF7KbGv.js';
 import './ImageRenderer.js';
-import '../chunks/bundle-BCL7kk-0.js';
+import '../chunks/bundle-CT8ZXUi2.js';
 import './Icon.js';
 import '../withSendbird.js';
 
-function UserProfile(_a) {
-    var _b, _c;
-    var user = _a.user, currentUserId = _a.currentUserId, _d = _a.disableMessaging, disableMessaging = _d === void 0 ? false : _d, onSuccess = _a.onSuccess;
-    var store = useSendbirdStateContext();
-    var createChannel = getCreateGroupChannel(store);
-    var logger = (_b = store === null || store === void 0 ? void 0 : store.config) === null || _b === void 0 ? void 0 : _b.logger;
-    var stringSet = useContext(LocalizationContext).stringSet;
-    var currentUserId_ = currentUserId || ((_c = store === null || store === void 0 ? void 0 : store.config) === null || _c === void 0 ? void 0 : _c.userId);
-    var onUserProfileMessage = useContext(UserProfileContext).onUserProfileMessage;
-    return (React__default.createElement("div", { className: "sendbird__user-profile" },
-        React__default.createElement("section", { className: "sendbird__user-profile-avatar" },
-            React__default.createElement(Avatar, { height: "80px", width: "80px", src: user === null || user === void 0 ? void 0 : user.profileUrl })),
-        React__default.createElement("section", { className: "sendbird__user-profile-name" },
-            React__default.createElement(Label, { type: LabelTypography.H_2, color: LabelColors.ONBACKGROUND_1 }, (user === null || user === void 0 ? void 0 : user.nickname) || stringSet.NO_NAME)),
-        ((user === null || user === void 0 ? void 0 : user.userId) !== currentUserId_) && !disableMessaging && (React__default.createElement("section", { className: "sendbird__user-profile-message" },
-            React__default.createElement(Button, { type: ButtonTypes.SECONDARY, onClick: function () {
-                    // Create 1:1 channel
-                    var params = {
-                        isDistinct: false,
-                        invitedUserIds: [user === null || user === void 0 ? void 0 : user.userId],
-                        operatorUserIds: [currentUserId_],
-                    };
-                    onSuccess();
-                    createChannel(params)
-                        .then(function (groupChannel) {
-                        logger.info('UserProfile, channel create', groupChannel);
-                        if (typeof onUserProfileMessage === 'function') {
-                            onUserProfileMessage === null || onUserProfileMessage === void 0 ? void 0 : onUserProfileMessage(groupChannel);
-                        }
-                    });
-                } }, stringSet.USER_PROFILE__MESSAGE))),
-        React__default.createElement("div", { className: "sendbird__user-profile-separator" }),
-        React__default.createElement("section", { className: "sendbird__user-profile-userId" },
-            React__default.createElement(Label, { className: "sendbird__user-profile-userId--label", type: LabelTypography.CAPTION_2, color: LabelColors.ONBACKGROUND_2 }, stringSet.USER_PROFILE__USER_ID),
-            React__default.createElement(Label, { className: "sendbird__user-profile-userId--value", type: LabelTypography.BODY_1, color: LabelColors.ONBACKGROUND_1 }, user === null || user === void 0 ? void 0 : user.userId))));
+function UserProfile(_a) {
+    var _b, _c;
+    var user = _a.user, currentUserId = _a.currentUserId, _d = _a.disableMessaging, disableMessaging = _d === void 0 ? false : _d, onSuccess = _a.onSuccess;
+    var store = useSendbirdStateContext();
+    var createChannel = getCreateGroupChannel(store);
+    var logger = (_b = store === null || store === void 0 ? void 0 : store.config) === null || _b === void 0 ? void 0 : _b.logger;
+    var stringSet = useContext(LocalizationContext).stringSet;
+    var currentUserId_ = currentUserId || ((_c = store === null || store === void 0 ? void 0 : store.config) === null || _c === void 0 ? void 0 : _c.userId);
+    var onUserProfileMessage = useContext(UserProfileContext).onUserProfileMessage;
+    return (React__default.createElement("div", { className: "sendbird__user-profile" },
+        React__default.createElement("section", { className: "sendbird__user-profile-avatar" },
+            React__default.createElement(Avatar, { height: "80px", width: "80px", src: user === null || user === void 0 ? void 0 : user.profileUrl })),
+        React__default.createElement("section", { className: "sendbird__user-profile-name" },
+            React__default.createElement(Label, { type: LabelTypography.H_2, color: LabelColors.ONBACKGROUND_1 }, (user === null || user === void 0 ? void 0 : user.nickname) || stringSet.NO_NAME)),
+        ((user === null || user === void 0 ? void 0 : user.userId) !== currentUserId_) && !disableMessaging && (React__default.createElement("section", { className: "sendbird__user-profile-message" },
+            React__default.createElement(Button, { type: ButtonTypes.SECONDARY, onClick: function () {
+                    // Create 1:1 channel
+                    var params = {
+                        isDistinct: false,
+                        invitedUserIds: [user === null || user === void 0 ? void 0 : user.userId],
+                        operatorUserIds: [currentUserId_],
+                    };
+                    onSuccess();
+                    createChannel(params)
+                        .then(function (groupChannel) {
+                        logger.info('UserProfile, channel create', groupChannel);
+                        if (typeof onUserProfileMessage === 'function') {
+                            onUserProfileMessage === null || onUserProfileMessage === void 0 ? void 0 : onUserProfileMessage(groupChannel);
+                        }
+                    });
+                } }, stringSet.USER_PROFILE__MESSAGE))),
+        React__default.createElement("div", { className: "sendbird__user-profile-separator" }),
+        React__default.createElement("section", { className: "sendbird__user-profile-userId" },
+            React__default.createElement(Label, { className: "sendbird__user-profile-userId--label", type: LabelTypography.CAPTION_2, color: LabelColors.ONBACKGROUND_2 }, stringSet.USER_PROFILE__USER_ID),
+            React__default.createElement(Label, { className: "sendbird__user-profile-userId--value", type: LabelTypography.BODY_1, color: LabelColors.ONBACKGROUND_1 }, user === null || user === void 0 ? void 0 : user.userId))));
 }
 
 export { UserProfile as default };

package/ui/VoiceMessageInput.js

@@ -3,13 +3,13 @@ import './PlaybackTime.js';
 import './ProgressBar.js';
 import './TextButton.js';
 import './Icon.js';
-import '../chunks/bundle-DjFflxR1.js';
-import '../chunks/bundle-DW4HEvvh.js';
-export { a as VoiceMessageInput } from '../chunks/bundle-DCzxcNn2.js';
-import '../chunks/bundle-B7UQ7Txq.js';
-import '../chunks/bundle-Dd7yWAzk.js';
-import '../chunks/bundle-CwG4pj5M.js';
-import '../chunks/bundle-Vk50O4-7.js';
-import '../chunks/bundle-ByTQtdFM.js';
-import '../chunks/bundle-DD0CjCiu.js';
+import '../chunks/bundle-LYAWKk4n.js';
+import '../chunks/bundle-Bx5vhTbU.js';
+export { a as VoiceMessageInput } from '../chunks/bundle-BZd5IHBF.js';
+import '../chunks/bundle-CD9AzC6s.js';
+import '../chunks/bundle-7oF7KbGv.js';
+import '../chunks/bundle-C8im5l9B.js';
+import '../chunks/bundle-HoQqraNc.js';
+import '../chunks/bundle-ByvmbZD0.js';
+import '../chunks/bundle-C1ds4cil.js';
 //# sourceMappingURL=VoiceMessageInput.js.map

package/ui/VoiceMessageItemBody.js

@@ -4,65 +4,73 @@ import { useVoicePlayer } from '../VoicePlayer/useVoicePlayer.js';
 import { PlaybackTime } from './PlaybackTime.js';
 import Loader from './Loader.js';
 import Icon, { IconTypes, IconColors } from './Icon.js';
-import { a as LabelTypography, b as LabelColors } from '../chunks/bundle-DjFflxR1.js';
-import { V as VOICE_PLAYER_STATUS } from '../chunks/bundle-Bs4dcOTC.js';
-import '../chunks/bundle-B7UQ7Txq.js';
-import '../VoiceRecorder/context.js';
-import '../chunks/bundle-DW4HEvvh.js';
-import '../chunks/bundle-CwG4pj5M.js';
-import '../chunks/bundle-DD0CjCiu.js';
-import '../chunks/bundle-bTVomhqp.js';
-import '../chunks/bundle-Dd7yWAzk.js';
+import { a as LabelTypography, b as LabelColors } from '../chunks/bundle-LYAWKk4n.js';
+import { V as VOICE_PLAYER_STATUS } from '../chunks/bundle-CIwVkd-E.js';
+import '../chunks/bundle-CD9AzC6s.js';
+import '../chunks/bundle-C4Z-NWqF.js';
+import '../chunks/bundle-7oF7KbGv.js';
+import '../chunks/bundle-BWCGFXhj.js';
+import '@sendbird/chat/groupChannel';
+import '../utils/message/getOutgoingMessageState.js';
+import '../chunks/bundle-ByvmbZD0.js';
 import 'react-dom';
-import '../chunks/bundle-ByTQtdFM.js';
-import '../chunks/bundle-BrPQ1xtW.js';
+import '../chunks/bundle-Bx5vhTbU.js';
+import '../chunks/bundle-C8im5l9B.js';
+import '../chunks/bundle-C1ds4cil.js';
+import '../chunks/bundle-Diqj6For.js';
 import './IconButton.js';
 import './Button.js';
-import '../useSendbirdStateContext.js';
+import '@sendbird/uikit-tools';
 import '../withSendbird.js';
+import 'css-vars-ponyfill';
+import '@sendbird/chat';
+import '../chunks/bundle-BJ46V6XQ.js';
+import '@sendbird/chat/openChannel';
+import '../useSendbirdStateContext.js';
+import '../chunks/bundle-BbWD2VuS.js';
 
-var VoiceMessageItemBody = function (_a) {
-    var _b;
-    var className = _a.className, message = _a.message, channelUrl = _a.channelUrl, _c = _a.isByMe, isByMe = _c === void 0 ? false : _c, _d = _a.isReactionEnabled, isReactionEnabled = _d === void 0 ? false : _d;
-    var _e = useState(false), usingReaction = _e[0], setUsingReaction = _e[1];
-    var _f = useVoicePlayer({
-        channelUrl: channelUrl,
-        key: "".concat(message === null || message === void 0 ? void 0 : message.messageId),
-        audioFileUrl: message === null || message === void 0 ? void 0 : message.url,
-    }), play = _f.play, 
-    // do not pause on unmount, because on desktop layout
-    // the component can be paused when it is played from
-    // channel and same message is unmounted from the thread
-    pause = _f.pause, _g = _f.playbackTime, playbackTime = _g === void 0 ? 0 : _g, duration = _f.duration, _h = _f.playingStatus, playingStatus = _h === void 0 ? VOICE_PLAYER_STATUS.IDLE : _h;
-    useEffect(function () {
-        var _a;
-        if (isReactionEnabled && ((_a = message === null || message === void 0 ? void 0 : message.reactions) === null || _a === void 0 ? void 0 : _a.length) > 0) {
-            setUsingReaction(true);
-        }
-        else {
-            setUsingReaction(false);
-        }
-    }, [isReactionEnabled, (_b = message === null || message === void 0 ? void 0 : message.reactions) === null || _b === void 0 ? void 0 : _b.length]);
-    var progresBarMaxSize = useMemo(function () {
-        var _a;
-        if (message === null || message === void 0 ? void 0 : message.metaArrays) {
-            var duration_1 = (_a = message === null || message === void 0 ? void 0 : message.metaArrays.find(function (metaArray) { return metaArray.key === 'KEY_VOICE_MESSAGE_DURATION'; })) === null || _a === void 0 ? void 0 : _a.value[0];
-            return duration_1 && parseInt(duration_1);
-        }
-        return 1;
-    }, [message === null || message === void 0 ? void 0 : message.metaArrays]);
-    return (React__default.createElement("div", { className: "sendbird-voice-message-item-body ".concat(className, " ").concat(usingReaction ? 'is-reactions-contained' : '') },
-        React__default.createElement(ProgressBar, { className: "sendbird-voice-message-item-body__progress-bar", maxSize: duration || progresBarMaxSize, currentSize: playbackTime, colorType: isByMe ? ProgressBarColorTypes.PRIMARY : ProgressBarColorTypes.GRAY }),
-        React__default.createElement("div", { className: "sendbird-voice-message-item-body__status-button" },
-            (playingStatus === VOICE_PLAYER_STATUS.IDLE || playingStatus === VOICE_PLAYER_STATUS.PAUSED) && (React__default.createElement("div", { className: "sendbird-voice-message-item-body__status-button__button", onClick: play },
-                React__default.createElement(Icon, { width: "18px", height: "18px", type: IconTypes.PLAY, fillColor: IconColors.PRIMARY }))),
-            playingStatus === VOICE_PLAYER_STATUS.PREPARING && (React__default.createElement(Loader, { width: "22.2px", height: "22.2px" },
-                React__default.createElement(Icon, { width: "22.2px", height: "22.2px", type: IconTypes.SPINNER, fillColor: IconColors.PRIMARY_2 }))),
-            playingStatus === VOICE_PLAYER_STATUS.PLAYING && (React__default.createElement("div", { className: "sendbird-voice-message-item-body__status-button__button", onClick: function () { pause(); } },
-                React__default.createElement("div", { className: "sendbird-voice-message-item-body__status-button__button__pause" },
-                    React__default.createElement("div", { className: "sendbird-voice-message-item-body__status-button__button__pause__inner" }),
-                    React__default.createElement("div", { className: "sendbird-voice-message-item-body__status-button__button__pause__inner" }))))),
-        React__default.createElement(PlaybackTime, { className: "sendbird-voice-message-item-body__playback-time", time: progresBarMaxSize - playbackTime, labelType: LabelTypography.BODY_1, labelColor: isByMe ? LabelColors.ONCONTENT_1 : LabelColors.ONBACKGROUND_1 })));
+var VoiceMessageItemBody = function (_a) {
+    var _b;
+    var className = _a.className, message = _a.message, channelUrl = _a.channelUrl, _c = _a.isByMe, isByMe = _c === void 0 ? false : _c, _d = _a.isReactionEnabled, isReactionEnabled = _d === void 0 ? false : _d;
+    var _e = useState(false), usingReaction = _e[0], setUsingReaction = _e[1];
+    var _f = useVoicePlayer({
+        channelUrl: channelUrl,
+        key: "".concat(message === null || message === void 0 ? void 0 : message.messageId),
+        audioFileUrl: message === null || message === void 0 ? void 0 : message.url,
+    }), play = _f.play, 
+    // do not pause on unmount, because on desktop layout
+    // the component can be paused when it is played from
+    // channel and same message is unmounted from the thread
+    pause = _f.pause, _g = _f.playbackTime, playbackTime = _g === void 0 ? 0 : _g, duration = _f.duration, _h = _f.playingStatus, playingStatus = _h === void 0 ? VOICE_PLAYER_STATUS.IDLE : _h;
+    useEffect(function () {
+        var _a;
+        if (isReactionEnabled && ((_a = message === null || message === void 0 ? void 0 : message.reactions) === null || _a === void 0 ? void 0 : _a.length) > 0) {
+            setUsingReaction(true);
+        }
+        else {
+            setUsingReaction(false);
+        }
+    }, [isReactionEnabled, (_b = message === null || message === void 0 ? void 0 : message.reactions) === null || _b === void 0 ? void 0 : _b.length]);
+    var progresBarMaxSize = useMemo(function () {
+        var _a;
+        if (message === null || message === void 0 ? void 0 : message.metaArrays) {
+            var duration_1 = (_a = message === null || message === void 0 ? void 0 : message.metaArrays.find(function (metaArray) { return metaArray.key === 'KEY_VOICE_MESSAGE_DURATION'; })) === null || _a === void 0 ? void 0 : _a.value[0];
+            return duration_1 && parseInt(duration_1);
+        }
+        return 1;
+    }, [message === null || message === void 0 ? void 0 : message.metaArrays]);
+    return (React__default.createElement("div", { className: "sendbird-voice-message-item-body ".concat(className, " ").concat(usingReaction ? 'is-reactions-contained' : '') },
+        React__default.createElement(ProgressBar, { className: "sendbird-voice-message-item-body__progress-bar", maxSize: duration || progresBarMaxSize, currentSize: playbackTime, colorType: isByMe ? ProgressBarColorTypes.PRIMARY : ProgressBarColorTypes.GRAY }),
+        React__default.createElement("div", { className: "sendbird-voice-message-item-body__status-button" },
+            (playingStatus === VOICE_PLAYER_STATUS.IDLE || playingStatus === VOICE_PLAYER_STATUS.PAUSED) && (React__default.createElement("div", { className: "sendbird-voice-message-item-body__status-button__button", onClick: play },
+                React__default.createElement(Icon, { width: "18px", height: "18px", type: IconTypes.PLAY, fillColor: IconColors.PRIMARY }))),
+            playingStatus === VOICE_PLAYER_STATUS.PREPARING && (React__default.createElement(Loader, { width: "22.2px", height: "22.2px" },
+                React__default.createElement(Icon, { width: "22.2px", height: "22.2px", type: IconTypes.SPINNER, fillColor: IconColors.PRIMARY_2 }))),
+            playingStatus === VOICE_PLAYER_STATUS.PLAYING && (React__default.createElement("div", { className: "sendbird-voice-message-item-body__status-button__button", onClick: function () { pause(); } },
+                React__default.createElement("div", { className: "sendbird-voice-message-item-body__status-button__button__pause" },
+                    React__default.createElement("div", { className: "sendbird-voice-message-item-body__status-button__button__pause__inner" }),
+                    React__default.createElement("div", { className: "sendbird-voice-message-item-body__status-button__button__pause__inner" }))))),
+        React__default.createElement(PlaybackTime, { className: "sendbird-voice-message-item-body__playback-time", time: progresBarMaxSize - playbackTime, labelType: LabelTypography.BODY_1, labelColor: isByMe ? LabelColors.ONCONTENT_1 : LabelColors.ONBACKGROUND_1 })));
 };
 
 export { VoiceMessageItemBody, VoiceMessageItemBody as default };

package/ui/VoiceMessageItemBody.js.map

@@ -1 +1 @@
-{"version":3,"file":"VoiceMessageItemBody.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"VoiceMessageItemBody.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}