@sendbird/uikit-react 3.9.1-rc-2 → 3.9.1

package/dist/cjs/ui/QuoteMessage.js

@@ -1,81 +0,0 @@
-'use strict';
-
-var React = require('react');
-var ui_Icon = require('./Icon.js');
-var ui_Label = require('../chunks/bundle-4RnnhACR.js');
-var ui_ImageRenderer = require('./ImageRenderer.js');
-var LocalizationContext = require('../chunks/bundle--gwwLhzk.js');
-var index = require('../chunks/bundle-5ApFd_AY.js');
-var utils = require('../chunks/bundle-Et2Mrxtk.js');
-require('../chunks/bundle-0pCHXNhB.js');
-require('../chunks/bundle-V1HT7uWN.js');
-require('../chunks/bundle-4c_n4Hqm.js');
-require('../chunks/bundle-oTWBtf3l.js');
-require('../utils/message/getOutgoingMessageState.js');
-require('../chunks/bundle-tWIm10AV.js');
-
-function QuoteMessage(_a) {
-    var _b;
-    var _c, _d, _e, _f, _g, _h;
-    var message = _a.message, _j = _a.userId, userId = _j === void 0 ? '' : _j, _k = _a.isByMe, isByMe = _k === void 0 ? false : _k, _l = _a.className, className = _l === void 0 ? '' : _l, _m = _a.isUnavailable, isUnavailable = _m === void 0 ? false : _m, onClick = _a.onClick;
-    var stringSet = React.useContext(LocalizationContext.LocalizationContext).stringSet;
-    var parentMessage = message.parentMessage;
-    var parentMessageSender = parentMessage === null || parentMessage === void 0 ? void 0 : parentMessage.sender;
-    var parentMessageSenderNickname = (userId === (parentMessageSender === null || parentMessageSender === void 0 ? void 0 : parentMessageSender.userId)) ? stringSet.QUOTED_MESSAGE__CURRENT_USER : parentMessageSender === null || parentMessageSender === void 0 ? void 0 : parentMessageSender.nickname;
-    var parentMessageUrl = utils.getMessageFirstFileUrl(parentMessage);
-    var parentMessageType = utils.getMessageFirstFileType(parentMessage);
-    var currentMessageSenderNickname = (userId === ((_c = message === null || message === void 0 ? void 0 : message.sender) === null || _c === void 0 ? void 0 : _c.userId)) ? stringSet.QUOTED_MESSAGE__CURRENT_USER : (_d = message === null || message === void 0 ? void 0 : message.sender) === null || _d === void 0 ? void 0 : _d.nickname;
-    var _o = React.useState(false), isThumbnailLoaded = _o[0], setThumbnailLoaded = _o[1];
-    var uikitFileTypes = index.getUIKitFileTypes();
-    var splitFileName = (_f = (_e = utils.getMessageFirstFileName(parentMessage)) === null || _e === void 0 ? void 0 : _e.split('/')) !== null && _f !== void 0 ? _f : parentMessageUrl.split('/');
-    return (React.createElement("div", { className: index.getClassName([className, 'sendbird-quote-message', isByMe ? 'outgoing' : 'incoming', isUnavailable ? 'unavailable' : '']), key: parentMessage === null || parentMessage === void 0 ? void 0 : parentMessage.messageId, onClick: function () {
-            if (!isUnavailable && onClick) {
-                onClick();
-            }
-        }, onTouchEnd: function () {
-            if (!isUnavailable && onClick) {
-                onClick();
-            }
-        } },
-        React.createElement("div", { className: "sendbird-quote-message__replied-to" },
-            React.createElement(ui_Icon.default, { className: "sendbird-quote-message__replied-to__icon", type: ui_Icon.IconTypes.REPLY, fillColor: ui_Icon.IconColors.ON_BACKGROUND_3, width: "12px", height: "12px" }),
-            React.createElement(ui_Label.Label, { className: "sendbird-quote-message__replied-to__text", type: ui_Label.LabelTypography.CAPTION_2, color: ui_Label.LabelColors.ONBACKGROUND_3 },
-                React.createElement("span", { className: "sendbird-quote-message__replied-to__text__nickname" }, currentMessageSenderNickname),
-                React.createElement("span", { className: "sendbird-quote-message__replied-to__text__text" }, stringSet.QUOTED_MESSAGE__REPLIED_TO),
-                React.createElement("span", { className: "sendbird-quote-message__replied-to__text__nickname" }, parentMessageSenderNickname))),
-        React.createElement("div", { className: "sendbird-quote-message__replied-message" },
-            isUnavailable && (React.createElement("div", { className: "sendbird-quote-message__replied-message__text-message" },
-                React.createElement(ui_Label.Label, { className: "sendbird-quote-message__replied-message__text-message__word", type: ui_Label.LabelTypography.BODY_2, color: ui_Label.LabelColors.ONBACKGROUND_1 }, stringSet.QUOTED_MESSAGE__UNAVAILABLE))),
-            ((index.isUserMessage(parentMessage) && ((_g = parentMessage === null || parentMessage === void 0 ? void 0 : parentMessage.message) === null || _g === void 0 ? void 0 : _g.length) > 0) && !isUnavailable) && (React.createElement("div", { className: "sendbird-quote-message__replied-message__text-message" },
-                React.createElement(ui_Label.Label, { className: "sendbird-quote-message__replied-message__text-message__word", type: ui_Label.LabelTypography.BODY_2, color: ui_Label.LabelColors.ONBACKGROUND_1 }, parentMessage === null || parentMessage === void 0 ? void 0 : parentMessage.message))),
-            (index.isVoiceMessage(parentMessage) && parentMessageUrl && !isUnavailable) && (React.createElement("div", { className: "sendbird-quote-message__replied-message__text-message" },
-                React.createElement(ui_Label.Label, { className: "sendbird-quote-message__replied-message__text-message__word", type: ui_Label.LabelTypography.BODY_2, color: ui_Label.LabelColors.ONBACKGROUND_1 }, stringSet.VOICE_MESSAGE))),
-            ((index.isThumbnailMessage(parentMessage)
-                || index.isMultipleFilesMessage(parentMessage))
-                && parentMessageUrl
-                && !isUnavailable) && (React.createElement("div", { className: "sendbird-quote-message__replied-message__thumbnail-message" },
-                React.createElement(ui_ImageRenderer.default, { className: "sendbird-quote-message__replied-message__thumbnail-message__image", url: parentMessageUrl, alt: parentMessageType, width: "144px", height: "108px", onLoad: function () { return setThumbnailLoaded(true); }, defaultComponent: (React.createElement("div", { className: "sendbird-quote-message__replied-message__thumbnail-message__placeholder" },
-                        React.createElement("div", { className: "sendbird-quote-message__replied-message__thumbnail-message__placeholder__icon" },
-                            React.createElement(ui_Icon.default, { type: index.isVideo(parentMessageType) ? ui_Icon.IconTypes.PLAY : ui_Icon.IconTypes.PHOTO, fillColor: ui_Icon.IconColors.ON_BACKGROUND_2, width: "22px", height: "22px" })))) }),
-                (index.isVideo(parentMessageType) && !(((_h = parentMessage === null || parentMessage === void 0 ? void 0 : parentMessage.thumbnails) === null || _h === void 0 ? void 0 : _h.length) > 0)) && (React.createElement(React.Fragment, null,
-                    React.createElement("video", { className: "sendbird-quote-message__replied-message__thumbnail-message__video" },
-                        React.createElement("source", { src: parentMessageUrl, type: parentMessageType })),
-                    React.createElement("div", { className: "sendbird-quote-message__replied-message__thumbnail-message__cover" },
-                        React.createElement("div", { className: "sendbird-quote-message__replied-message__thumbnail-message__cover__icon" },
-                            React.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.PLAY, fillColor: ui_Icon.IconColors.ON_BACKGROUND_2, width: "14px", height: "14px" }))))),
-                (isThumbnailLoaded && index.isGif(parentMessageType)) && (React.createElement("div", { className: "sendbird-quote-message__replied-message__thumbnail-message__cover" },
-                    React.createElement("div", { className: "sendbird-quote-message__replied-message__thumbnail-message__cover__icon" },
-                        React.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.GIF, fillColor: ui_Icon.IconColors.THUMBNAIL_ICON, width: "14px", height: "14px" })))))),
-            (index.getUIKitMessageType(parentMessage) === index.UIKitMessageTypes.FILE && parentMessageUrl && !isUnavailable) && (React.createElement("div", { className: "sendbird-quote-message__replied-message__file-message" },
-                React.createElement(ui_Icon.default, { className: "sendbird-quote-message__replied-message__file-message__type-icon", type: (_b = {},
-                        _b[uikitFileTypes.IMAGE] = ui_Icon.IconTypes.PHOTO,
-                        _b[uikitFileTypes.VIDEO] = ui_Icon.IconTypes.PLAY,
-                        _b[uikitFileTypes.AUDIO] = ui_Icon.IconTypes.FILE_AUDIO,
-                        _b[uikitFileTypes.GIF] = ui_Icon.IconTypes.GIF,
-                        _b[uikitFileTypes.OTHERS] = ui_Icon.IconTypes.FILE_DOCUMENT,
-                        _b)[index.getUIKitFileType(parentMessageType)], fillColor: ui_Icon.IconColors.ON_BACKGROUND_3, width: "16px", height: "16px" }),
-                React.createElement(ui_Label.Label, { className: "sendbird-quote-message__replied-message__file-message__file-name", type: ui_Label.LabelTypography.BODY_2, color: ui_Label.LabelColors.ONBACKGROUND_3 }, index.truncateString(splitFileName[splitFileName.length - 1])))))));
-}
-
-module.exports = QuoteMessage;
-//# sourceMappingURL=QuoteMessage.js.map

package/dist/cjs/ui/QuoteMessageInput.js

@@ -1,84 +0,0 @@
-'use strict';
-
-var React = require('react');
-var index = require('../chunks/bundle-5ApFd_AY.js');
-var ui_Icon = require('./Icon.js');
-var ui_Label = require('../chunks/bundle-4RnnhACR.js');
-var LocalizationContext = require('../chunks/bundle--gwwLhzk.js');
-var ui_ImageRenderer = require('./ImageRenderer.js');
-var utils = require('../chunks/bundle-Et2Mrxtk.js');
-require('../chunks/bundle-0pCHXNhB.js');
-require('../utils/message/getOutgoingMessageState.js');
-require('../chunks/bundle-tWIm10AV.js');
-require('../chunks/bundle-V1HT7uWN.js');
-require('../chunks/bundle-4c_n4Hqm.js');
-require('../chunks/bundle-oTWBtf3l.js');
-
-var componentClassname = 'sendbird-quote_message_input__avatar';
-function QuoteMessageThumbnail(_a) {
-    var _b, _c;
-    var message = _a.message;
-    if (!index.isFileMessage(message) && !index.isMultipleFilesMessage(message) || index.isVoiceMessage(message)) {
-        return null;
-    }
-    var thumbnailUrl = utils.getMessageFirstFileThumbnailUrl(message);
-    if (!thumbnailUrl) {
-        if (((_b = message.isFileMessage) === null || _b === void 0 ? void 0 : _b.call(message))
-            && (index.isImageMessage(message)
-                || index.isVideoMessage(message))) {
-            thumbnailUrl = utils.getMessageFirstFileUrl(message);
-        }
-        else if (((_c = message.isMultipleFilesMessage) === null || _c === void 0 ? void 0 : _c.call(message))
-            && (message.fileInfoList.length > 0
-                && index.isImageFileInfo((message).fileInfoList[0]))) {
-            thumbnailUrl = message.fileInfoList[0].url;
-        }
-    }
-    if (index.isVideoMessage(message) && thumbnailUrl) {
-        return (React.createElement("div", { className: componentClassname },
-            React.createElement("video", { style: {
-                    width: '44px',
-                    height: '44px',
-                }, src: thumbnailUrl })));
-    }
-    else if ((index.isThumbnailMessage(message) || index.isMultipleFilesMessage(message)) && thumbnailUrl) {
-        return (React.createElement(ui_ImageRenderer.default, { className: componentClassname, url: thumbnailUrl, alt: utils.getMessageFirstFileType(message), width: "44px", height: "44px", fixedSize: true }));
-    }
-    else if (index.isAudioMessage(message)) {
-        return (React.createElement("div", { className: componentClassname },
-            React.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.FILE_AUDIO, fillColor: ui_Icon.IconColors.ON_BACKGROUND_2, width: "24px", height: "24px" })));
-    }
-    else {
-        return (React.createElement("div", { className: componentClassname },
-            React.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.FILE_DOCUMENT, fillColor: ui_Icon.IconColors.ON_BACKGROUND_2, width: "24px", height: "24px" })));
-    }
-}
-
-function QuoteMessageInput(_a) {
-    var className = _a.className, replyingMessage = _a.replyingMessage, onClose = _a.onClose;
-    var stringSet = React.useContext(LocalizationContext.LocalizationContext).stringSet;
-    var fileMessage = replyingMessage;
-    var sender = replyingMessage === null || replyingMessage === void 0 ? void 0 : replyingMessage.sender;
-    var displayFileIcon = (index.isFileMessage(replyingMessage) || index.isMultipleFilesMessage(replyingMessage))
-        && !index.isVoiceMessage(replyingMessage);
-    return (React.createElement("div", { className: index.getClassName(['sendbird-quote_message_input', className]) },
-        displayFileIcon && (React.createElement(QuoteMessageThumbnail, { message: fileMessage })),
-        React.createElement("div", { className: "sendbird-quote_message_input__body", style: {
-                width: "calc(100% - ".concat(displayFileIcon ? '164px' : '120px', ")"),
-                left: displayFileIcon ? '92px' : '40px',
-            } },
-            React.createElement(ui_Label.Label, { className: "sendbird-quote_message_input__body__sender-name", type: ui_Label.LabelTypography.CAPTION_1, color: ui_Label.LabelColors.ONBACKGROUND_1 }, "".concat(stringSet.QUOTE_MESSAGE_INPUT__REPLY_TO, " ").concat((sender && sender.nickname) ? sender.nickname : stringSet.NO_NAME)),
-            React.createElement(ui_Label.Label, { className: "sendbird-quote_message_input__body__message-content", type: ui_Label.LabelTypography.BODY_2, color: ui_Label.LabelColors.ONBACKGROUND_3 },
-                index.isImageMessage(fileMessage) && !index.isGifMessage(fileMessage) && stringSet.QUOTE_MESSAGE_INPUT__FILE_TYPE_IMAGE,
-                index.isVideoMessage(fileMessage) && stringSet.QUOTE_MESSAGE_INPUT__FILE_TYPE__VIDEO,
-                index.isGifMessage(fileMessage) && stringSet.QUOTE_MESSAGE_INPUT__FILE_TYPE_GIF,
-                index.isUserMessage(replyingMessage) && replyingMessage.message,
-                index.getUIKitMessageType(replyingMessage) === index.UIKitMessageTypes.FILE && utils.getMessageFirstFileName(fileMessage),
-                index.isMultipleFilesMessage(replyingMessage)
-                    && "".concat(fileMessage.fileInfoList.length, " Photos"),
-                index.isVoiceMessage(replyingMessage) && stringSet.VOICE_MESSAGE)),
-        React.createElement(ui_Icon.default, { className: "sendbird-quote_message_input__close-button", type: ui_Icon.IconTypes.CLOSE, fillColor: ui_Icon.IconColors.ON_BACKGROUND_2, width: "24px", height: "24px", onClick: function () { return onClose(replyingMessage); } })));
-}
-
-module.exports = QuoteMessageInput;
-//# sourceMappingURL=QuoteMessageInput.js.map

package/dist/cjs/ui/ReactionBadge.js

@@ -1,28 +0,0 @@
-'use strict';
-
-var _tslib = require('../chunks/bundle-0pCHXNhB.js');
-var React = require('react');
-var ui_Label = require('../chunks/bundle-4RnnhACR.js');
-require('../chunks/bundle-4c_n4Hqm.js');
-
-var ReactionBadge = React.forwardRef(function (props, ref) {
-    var _a = props.className, className = _a === void 0 ? '' : _a, children = props.children, _b = props.count, count = _b === void 0 ? '' : _b, _c = props.isAdd, isAdd = _c === void 0 ? false : _c, _d = props.selected, selected = _d === void 0 ? false : _d, _e = props.onClick, onClick = _e === void 0 ? function () { } : _e;
-    var getClassNameTail = function () {
-        if (selected && !isAdd) {
-            return '--selected';
-        }
-        if (isAdd) {
-            return '--is-add';
-        }
-        return '';
-    };
-    return (React.createElement("div", { className: _tslib.__spreadArray(_tslib.__spreadArray([], (Array.isArray(className) ? className : [className]), true), [
-            "sendbird-reaction-badge".concat(getClassNameTail()),
-        ], false).join(' '), role: "button", ref: ref, onClick: onClick, onKeyDown: onClick, onTouchEnd: onClick, tabIndex: 0 },
-        React.createElement("div", { className: "sendbird-reaction-badge__inner" },
-            React.createElement("div", { className: "sendbird-reaction-badge__inner__icon" }, children),
-            React.createElement(ui_Label.Label, { className: (children && count) && 'sendbird-reaction-badge__inner__count', type: ui_Label.LabelTypography.CAPTION_3, color: ui_Label.LabelColors.ONBACKGROUND_1 }, count))));
-});
-
-module.exports = ReactionBadge;
-//# sourceMappingURL=ReactionBadge.js.map

package/dist/cjs/ui/ReactionButton.js

@@ -1,25 +0,0 @@
-'use strict';
-
-var _tslib = require('../chunks/bundle-0pCHXNhB.js');
-var React = require('react');
-var useLongPress = require('../chunks/bundle-2k4v26zP.js');
-var utils = require('../chunks/bundle-V1HT7uWN.js');
-require('../chunks/bundle-oXJwwgxy.js');
-
-var ReactionButton = React.forwardRef(function (props, ref) {
-    var className = props.className, width = props.width, height = props.height, selected = props.selected, _a = props.dataSbId, dataSbId = _a === void 0 ? '' : _a, onClick = props.onClick, children = props.children;
-    var onClickHandler = useLongPress.useLongPress({
-        onLongPress: utils.noop,
-        onClick: onClick,
-    }, {
-        shouldPreventDefault: true,
-        shouldStopPropagation: true,
-    });
-    return (React.createElement("div", _tslib.__assign({ className: _tslib.__spreadArray(_tslib.__spreadArray([], (Array.isArray(className) ? className : [className]), true), [
-            "sendbird-reaction-button".concat(selected ? '--selected' : ''),
-        ], false).join(' '), ref: ref, role: "button", style: { width: width, height: height } }, onClickHandler, { tabIndex: 0, "data-sb-id": dataSbId }),
-        React.createElement("div", { className: "sendbird-reaction-button__inner" }, children)));
-});
-
-module.exports = ReactionButton;
-//# sourceMappingURL=ReactionButton.js.map

package/dist/cjs/ui/SortByRow.js

@@ -1,31 +0,0 @@
-'use strict';
-
-var _tslib = require('../chunks/bundle-0pCHXNhB.js');
-var React = require('react');
-var uuid = require('../chunks/bundle-f_lSJlZS.js');
-
-var componentClassName = 'sendbird-sort-by-row';
-function SortByRow(_a) {
-    var _b = _a.className, className = _b === void 0 ? '' : _b, maxItemCount = _a.maxItemCount, itemWidth = _a.itemWidth, itemHeight = _a.itemHeight, children = _a.children;
-    if (Array.isArray(children) && children.length > maxItemCount) {
-        var result = [];
-        for (var i = 0; i < children.length; i += maxItemCount) {
-            result.push(React.createElement("div", { className: _tslib.__spreadArray(_tslib.__spreadArray([], (Array.isArray(className) ? className : [className]), true), [
-                    componentClassName,
-                ], false).join(' '), key: uuid.uuidv4(), style: {
-                    width: itemWidth * maxItemCount,
-                    height: itemHeight,
-                } }, children.slice(i, i + maxItemCount)));
-        }
-        return React.createElement(React.Fragment, null, result);
-    }
-    return (React.createElement("div", { className: _tslib.__spreadArray(_tslib.__spreadArray([], (Array.isArray(className) ? className : [className]), true), [
-            componentClassName,
-        ], false).join(' '), style: {
-            width: itemWidth * (Array.isArray(children) ? children.length : 1),
-            height: itemHeight,
-        } }, children));
-}
-
-module.exports = SortByRow;
-//# sourceMappingURL=SortByRow.js.map

package/dist/cjs/ui/TextButton.js

@@ -1,17 +0,0 @@
-'use strict';
-
-var _tslib = require('../chunks/bundle-0pCHXNhB.js');
-var React = require('react');
-var color = require('../chunks/bundle-NE9TILWI.js');
-
-var TextButton = function (_a) {
-    var _b = _a.className, className = _b === void 0 ? '' : _b, _c = _a.color, color$1 = _c === void 0 ? color.Colors.ONBACKGROUND_1 : _c, _d = _a.disabled, disabled = _d === void 0 ? false : _d, _e = _a.disableUnderline, disableUnderline = _e === void 0 ? false : _e, _f = _a.onClick, onClick = _f === void 0 ? function () { } : _f, children = _a.children;
-    return (React.createElement("div", { className: _tslib.__spreadArray(_tslib.__spreadArray([], (Array.isArray(className) ? className : [className]), true), [
-            color.changeColorToClassName(color$1),
-            disableUnderline ? 'sendbird-textbutton--not-underline' : 'sendbird-textbutton',
-            disabled ? 'sendbird-textbutton--disabled' : '',
-        ], false).join(' '), role: "button", tabIndex: 0, onClick: function (e) { return onClick(e); }, onKeyPress: function (e) { return onClick(e); } }, children));
-};
-
-module.exports = TextButton;
-//# sourceMappingURL=TextButton.js.map

package/dist/cjs/ui/TextMessageItemBody.js

@@ -1,66 +0,0 @@
-'use strict';
-
-var React = require('react');
-var ui_Label = require('../chunks/bundle-4RnnhACR.js');
-var index = require('../chunks/bundle-5ApFd_AY.js');
-var LocalizationContext = require('../chunks/bundle--gwwLhzk.js');
-var tokenize = require('../chunks/bundle-c8PEMQg3.js');
-var index$1 = require('../chunks/bundle-eSkHuU0e.js');
-var consts = require('../chunks/bundle-bQ1hwrcE.js');
-require('../chunks/bundle-0pCHXNhB.js');
-require('../chunks/bundle-4c_n4Hqm.js');
-require('../utils/message/getOutgoingMessageState.js');
-require('../chunks/bundle-tWIm10AV.js');
-require('../chunks/bundle-oTWBtf3l.js');
-require('../Message/context.js');
-require('./MentionLabel.js');
-require('./ContextMenu.js');
-require('react-dom');
-require('./SortByRow.js');
-require('../chunks/bundle-f_lSJlZS.js');
-require('./UserProfile.js');
-require('../chunks/bundle-Xwc-PXin.js');
-require('../sendbirdSelectors.js');
-require('../chunks/bundle-ga2lvSm8.js');
-require('../chunks/bundle-V1HT7uWN.js');
-require('../chunks/bundle-9-nr_N-b.js');
-require('./ImageRenderer.js');
-require('../chunks/bundle-NrEnVvdl.js');
-require('./Icon.js');
-require('./Button.js');
-require('../useSendbirdStateContext.js');
-require('../withSendbird.js');
-require('./LinkLabel.js');
-
-function TextMessageItemBody(_a) {
-    var _b, _c, _d;
-    var _e = _a.className, className = _e === void 0 ? '' : _e, message = _a.message, _f = _a.isByMe, isByMe = _f === void 0 ? false : _f, _g = _a.mouseHover, mouseHover = _g === void 0 ? false : _g, _h = _a.isMentionEnabled, isMentionEnabled = _h === void 0 ? false : _h, _j = _a.isReactionEnabled, isReactionEnabled = _j === void 0 ? false : _j;
-    var stringSet = React.useContext(LocalizationContext.LocalizationContext).stringSet;
-    var isMessageMentioned = isMentionEnabled
-        && ((_b = message === null || message === void 0 ? void 0 : message.mentionedMessageTemplate) === null || _b === void 0 ? void 0 : _b.length) > 0
-        && ((_c = message === null || message === void 0 ? void 0 : message.mentionedUsers) === null || _c === void 0 ? void 0 : _c.length) > 0;
-    var tokens = React.useMemo(function () {
-        if (isMessageMentioned) {
-            return tokenize.tokenizeMessage({
-                mentionedUsers: message === null || message === void 0 ? void 0 : message.mentionedUsers,
-                messageText: message === null || message === void 0 ? void 0 : message.mentionedMessageTemplate,
-            });
-        }
-        return tokenize.tokenizeMessage({
-            messageText: message === null || message === void 0 ? void 0 : message.message,
-        });
-    }, [message === null || message === void 0 ? void 0 : message.updatedAt]);
-    return (React.createElement(ui_Label.Label, { type: ui_Label.LabelTypography.BODY_1, color: isByMe ? ui_Label.LabelColors.ONCONTENT_1 : ui_Label.LabelColors.ONBACKGROUND_1 },
-        React.createElement("div", { className: index.getClassName([
-                className,
-                consts.TEXT_MESSAGE_BODY_CLASSNAME,
-                isByMe ? 'outgoing' : 'incoming',
-                mouseHover ? 'mouse-hover' : '',
-                (isReactionEnabled && ((_d = message === null || message === void 0 ? void 0 : message.reactions) === null || _d === void 0 ? void 0 : _d.length) > 0) ? 'reactions' : '',
-            ]) },
-            React.createElement(index$1.TextFragment, { tokens: tokens }),
-            index.isEditedMessage(message) && (React.createElement(ui_Label.Label, { className: "sendbird-text-message-item-body__message edited", type: ui_Label.LabelTypography.BODY_1, color: isByMe ? ui_Label.LabelColors.ONCONTENT_2 : ui_Label.LabelColors.ONBACKGROUND_2 }, " ".concat(stringSet.MESSAGE_EDITED, " "))))));
-}
-
-module.exports = TextMessageItemBody;
-//# sourceMappingURL=TextMessageItemBody.js.map

package/dist/cjs/ui/ThreadReplies.js

@@ -1,44 +0,0 @@
-'use strict';
-
-var React = require('react');
-var ui_Avatar = require('../chunks/bundle-9-nr_N-b.js');
-var ui_Icon = require('./Icon.js');
-var ui_Label = require('../chunks/bundle-4RnnhACR.js');
-var LocalizationContext = require('../chunks/bundle--gwwLhzk.js');
-var uuid = require('../chunks/bundle-f_lSJlZS.js');
-require('../chunks/bundle-0pCHXNhB.js');
-require('./ImageRenderer.js');
-require('../chunks/bundle-NrEnVvdl.js');
-require('../chunks/bundle-V1HT7uWN.js');
-require('../chunks/bundle-4c_n4Hqm.js');
-require('../chunks/bundle-oTWBtf3l.js');
-
-function ThreadReplies(_a) {
-    var _b;
-    var className = _a.className, threadInfo = _a.threadInfo, onClick = _a.onClick;
-    var _c = threadInfo.mostRepliedUsers, mostRepliedUsers = _c === void 0 ? [] : _c, replyCount = threadInfo.replyCount;
-    var stringSet = LocalizationContext.useLocalization().stringSet;
-    return (React.createElement("div", { className: "sendbird-ui-thread-replies ".concat(className), role: "button", onClick: function (e) {
-            onClick(e);
-            e === null || e === void 0 ? void 0 : e.stopPropagation();
-        }, onKeyDown: function (e) {
-            onClick(e);
-            e === null || e === void 0 ? void 0 : e.stopPropagation();
-        } },
-        React.createElement("div", { className: "sendbird-ui-thread-replies__user-profiles" },
-            mostRepliedUsers.slice(0, 4).map(function (user) {
-                return (React.createElement(ui_Avatar.Avatar, { key: uuid.uuidv4(), className: "sendbird-ui-thread-replies__user-profiles__avatar", src: user === null || user === void 0 ? void 0 : user.profileUrl, alt: "user profile", width: "20px", height: "20px" }));
-            }),
-            (mostRepliedUsers === null || mostRepliedUsers === void 0 ? void 0 : mostRepliedUsers.length) >= 5 && (React.createElement("div", { className: "sendbird-ui-thread-replies__user-profiles__avatar" },
-                React.createElement(ui_Avatar.Avatar, { className: "sendbird-ui-thread-replies__user-profiles__avatar__image", src: (_b = mostRepliedUsers === null || mostRepliedUsers === void 0 ? void 0 : mostRepliedUsers[4]) === null || _b === void 0 ? void 0 : _b.profileUrl, alt: "user profile", width: "20px", height: "20px" }),
-                React.createElement("div", { className: "sendbird-ui-thread-replies__user-profiles__avatar__cover" }),
-                React.createElement("div", { className: "sendbird-ui-thread-replies__user-profiles__avatar__plus" },
-                    React.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.PLUS, fillColor: ui_Icon.IconColors.WHITE, width: "16px", height: "16px" }))))),
-        React.createElement(ui_Label.Label, { className: "sendbird-ui-thread-replies__reply-counts", type: ui_Label.LabelTypography.CAPTION_2, color: ui_Label.LabelColors.PRIMARY }, replyCount === 1
-            ? "".concat(replyCount, " ").concat(stringSet.CHANNEL__THREAD_REPLY)
-            : "".concat(replyCount > 99 ? stringSet.CHANNEL__THREAD_OVER_MAX : replyCount, " ").concat(stringSet.CHANNEL__THREAD_REPLIES)),
-        React.createElement(ui_Icon.default, { className: "sendbird-ui-thread-replies__icon", type: ui_Icon.IconTypes.CHEVRON_RIGHT, fillColor: ui_Icon.IconColors.PRIMARY, width: "16px", height: "16px" })));
-}
-
-module.exports = ThreadReplies;
-//# sourceMappingURL=ThreadReplies.js.map

package/dist/cjs/ui/ThumbnailMessageItemBody.js

@@ -1,45 +0,0 @@
-'use strict';
-
-var _tslib = require('../chunks/bundle-0pCHXNhB.js');
-var React = require('react');
-var ui_Icon = require('./Icon.js');
-var ui_ImageRenderer = require('./ImageRenderer.js');
-var index = require('../chunks/bundle-5ApFd_AY.js');
-var utils$1 = require('../chunks/bundle-V1HT7uWN.js');
-var useLongPress = require('../chunks/bundle-2k4v26zP.js');
-var utils = require('../chunks/bundle-Et2Mrxtk.js');
-require('../utils/message/getOutgoingMessageState.js');
-require('../chunks/bundle-tWIm10AV.js');
-require('../chunks/bundle-oXJwwgxy.js');
-
-function ThumbnailMessageItemBody(_a) {
-    var _b, _c;
-    var _d = _a.className, className = _d === void 0 ? '' : _d, message = _a.message, _e = _a.isByMe, isByMe = _e === void 0 ? false : _e, _f = _a.mouseHover, mouseHover = _f === void 0 ? false : _f, _g = _a.isReactionEnabled, isReactionEnabled = _g === void 0 ? false : _g, _h = _a.showFileViewer, showFileViewer = _h === void 0 ? utils$1.noop : _h, _j = _a.style, style = _j === void 0 ? {} : _j;
-    var thumbnailUrl = utils.getMessageFirstFileThumbnailUrl(message);
-    var _k = React.useState(false), imageRendered = _k[0], setImageRendered = _k[1];
-    var onClickHandler = useLongPress.useLongPress({
-        onLongPress: utils$1.noop,
-        onClick: function () {
-            if (index.isSentMessage(message)) {
-                showFileViewer === null || showFileViewer === void 0 ? void 0 : showFileViewer(true);
-            }
-        },
-    });
-    return (React.createElement("div", _tslib.__assign({ className: index.getClassName([
-            className,
-            'sendbird-thumbnail-message-item-body',
-            isByMe ? 'outgoing' : 'incoming',
-            mouseHover ? 'mouse-hover' : '',
-            (isReactionEnabled && ((_c = (_b = message.reactions) === null || _b === void 0 ? void 0 : _b.length) !== null && _c !== void 0 ? _c : 0) > 0) ? 'reactions' : '',
-        ]) }, onClickHandler),
-        React.createElement(ui_ImageRenderer.default, { className: "sendbird-thumbnail-message-item-body__thumbnail", url: thumbnailUrl || utils.getMessageFirstFileUrl(message), alt: utils.getMessageFirstFileType(message), width: (style === null || style === void 0 ? void 0 : style.width) || '360px', height: (style === null || style === void 0 ? void 0 : style.height) || '270px', onLoad: function () { setImageRendered(true); }, placeHolder: function (style_) { return (React.createElement("div", { className: "sendbird-thumbnail-message-item-body__placeholder", style: style_ })); } }),
-        (index.isVideoMessage(message) && !thumbnailUrl) && !imageRendered && (React.createElement("video", { className: "sendbird-thumbnail-message-item-body__video" },
-            React.createElement("source", { src: utils.getMessageFirstFileUrl(message), type: utils.getMessageFirstFileType(message) }))),
-        React.createElement("div", { className: "sendbird-thumbnail-message-item-body__image-cover" }),
-        (index.isVideoMessage(message) || index.isGifMessage(message)) && (React.createElement("div", { className: "sendbird-thumbnail-message-item-body__icon-wrapper" },
-            React.createElement("div", { className: "sendbird-thumbnail-message-item-body__icon-wrapper__icon" },
-                React.createElement(ui_Icon.default, { type: index.isVideoMessage(message) ? ui_Icon.IconTypes.PLAY : ui_Icon.IconTypes.GIF, fillColor: ui_Icon.IconColors.THUMBNAIL_ICON, width: "34px", height: "34px" }))))));
-}
-
-module.exports = ThumbnailMessageItemBody;
-//# sourceMappingURL=ThumbnailMessageItemBody.js.map

package/dist/cjs/ui/Toggle.js

@@ -1,131 +0,0 @@
-'use strict';
-
-var React = require('react');
-var _tslib = require('../chunks/bundle-0pCHXNhB.js');
-var useSendbirdStateContext = require('../useSendbirdStateContext.js');
-require('../withSendbird.js');
-
-/**
- * The default value of `checked` should be null
- * to support both case of controlled and uncontrolled component
- * ref: https://github.com/aaronshaf/react-toggle#props
- */
-var noop = function () { };
-var TOGGLE_DEFAULT_VALUE = {
-    checked: null,
-    defaultChecked: false,
-    disabled: false,
-    onChange: noop,
-    onFocus: noop,
-    onBlur: noop,
-};
-var ToggleContext = React.createContext(TOGGLE_DEFAULT_VALUE);
-function useToggleContext() {
-    var context = React.useContext(ToggleContext);
-    if (context === undefined) {
-        throw new Error('@sendbird/uikit-react/ui/Toggle: useToggleContext must be used within a ToggleContainer.');
-    }
-    return context;
-}
-
-// Props Explanation https://github.com/aaronshaf/react-toggle#props
-function ToggleContainer(_a) {
-    var _b = _a.checked, checked = _b === void 0 ? TOGGLE_DEFAULT_VALUE.checked : _b, // null
-    _c = _a.defaultChecked, // null
-    defaultChecked = _c === void 0 ? TOGGLE_DEFAULT_VALUE.defaultChecked : _c, _d = _a.disabled, disabled = _d === void 0 ? TOGGLE_DEFAULT_VALUE.disabled : _d, _e = _a.onChange, onChange = _e === void 0 ? TOGGLE_DEFAULT_VALUE.onChange : _e, _f = _a.onFocus, onFocus = _f === void 0 ? TOGGLE_DEFAULT_VALUE.onFocus : _f, _g = _a.onBlur, onBlur = _g === void 0 ? TOGGLE_DEFAULT_VALUE.onBlur : _g, children = _a.children;
-    var _h = React.useState(defaultChecked || false), isChecked = _h[0], setChecked = _h[1];
-    var handleChange = React.useCallback(function (e) {
-        if (disabled) {
-            return;
-        }
-        if (checked === null) {
-            setChecked(e.currentTarget.checked);
-        }
-        onChange(e);
-    }, [onChange, checked]);
-    return (React.createElement(ToggleContext.Provider, { value: {
-            checked: checked !== null ? checked : isChecked,
-            disabled: disabled,
-            onChange: handleChange,
-            onFocus: function (e) {
-                if (!disabled) {
-                    onFocus(e);
-                }
-            },
-            onBlur: function (e) {
-                if (!disabled) {
-                    onBlur(e);
-                }
-            },
-        } }, children));
-}
-
-function filterNumber(input) {
-    if (typeof input !== 'string' && typeof input !== 'number') {
-        try {
-            var config = useSendbirdStateContext.useSendbirdStateContext().config;
-            var logger = config.logger;
-            logger.warning('@sendbird/uikit-react/ui/Toggle: TypeError - expected string or number.', input);
-        }
-        catch (_) { /* noop */ }
-        return [];
-    }
-    if (typeof input === 'number') {
-        return [input];
-    }
-    var regex = /(-?\d+)(\.\d+)?/g;
-    var numbers = input.match(regex) || [];
-    return numbers.map(parseFloat);
-}
-
-function ToggleUI(props) {
-    var _a;
-    var _b = props.reversed, reversed = _b === void 0 ? false : _b, _c = props.width, width = _c === void 0 ? '40px' : _c, _d = props.animationDuration, animationDuration = _d === void 0 ? '0.5s' : _d, _e = props.style, style = _e === void 0 ? {} : _e, _f = props.name, name = _f === void 0 ? '' : _f, _g = props.id, id = _g === void 0 ? '' : _g, _h = props.ariaLabel, ariaLabel = _h === void 0 ? '' : _h, _j = props.ariaLabelledby, ariaLabelledby = _j === void 0 ? '' : _j;
-    var _k = useToggleContext(), checked = _k.checked, disabled = _k.disabled, onChange = _k.onChange, onFocus = _k.onFocus, onBlur = _k.onBlur;
-    // animation should not be activated in the initialization step
-    var _l = React.useState(''), animatedClassName = _l[0], setAnimatedClassName = _l[1];
-    var toggleWidth = (_a = filterNumber(width)) === null || _a === void 0 ? void 0 : _a[0];
-    var toggleHeight = toggleWidth / 2;
-    // The size of dot should be 60% of toggle height
-    var dotSize = toggleHeight * 0.6;
-    return (React.createElement("label", { className: [
-            'sendbird-input-toggle-button',
-            animatedClassName,
-            checked ? 'sendbird-input-toggle-button--checked' : 'sendbird-input-toggle-button--unchecked',
-            disabled ? 'sendbird-input-toggle-button--disabled' : [],
-            reversed ? 'sendbird-input-toggle-button--reversed' : [],
-        ].flat().join(' '), style: _tslib.__assign({ width: "".concat(toggleWidth, "px"), height: "".concat(toggleHeight, "px"), borderRadius: "".concat(dotSize, "px") }, style) },
-        React.createElement("div", { className: [
-                'sendbird-input-toggle-button__inner-dot',
-                checked
-                    ? 'sendbird-input-toggle-button__inner-dot--activate'
-                    : 'sendbird-input-toggle-button__inner-dot--inactivate',
-            ].join(' '), style: {
-                width: "".concat(dotSize, "px"),
-                height: "".concat(dotSize, "px"),
-                animationDuration: animationDuration,
-            } }),
-        React.createElement("input", { type: "checkbox", "aria-label": ariaLabel, "aria-labelledby": ariaLabelledby, name: name, id: id, checked: checked, disabled: disabled, onChange: function (e) {
-                onChange(e);
-                setAnimatedClassName(e.currentTarget.checked ? 'sendbird-input-toggle-button--turned-on' : 'sendbird-input-toggle-button--turned-off');
-            }, onFocus: onFocus, onBlur: onBlur })));
-}
-
-function Toggle(props) {
-    var 
-    // ToggleProvider
-    checked = props.checked, defaultChecked = props.defaultChecked, disabled = props.disabled, onChange = props.onChange, onFocus = props.onFocus, onBlur = props.onBlur, 
-    // ToggleUI
-    className = props.className, reversed = props.reversed, width = props.width, 
-    // height will be half of width
-    animationDuration = props.animationDuration, style = props.style, name = props.name, id = props.id, ariaLabel = props.ariaLabel, ariaLabelledby = props.ariaLabelledby;
-    return (React.createElement("div", { className: "sendbird-ui-toggle ".concat(className) },
-        React.createElement(ToggleContainer, { checked: checked, defaultChecked: defaultChecked, disabled: disabled, onChange: onChange, onFocus: onFocus, onBlur: onBlur },
-            React.createElement(ToggleUI, { reversed: reversed, width: width, animationDuration: animationDuration, style: style, name: name, id: id, ariaLabel: ariaLabel, ariaLabelledby: ariaLabelledby }))));
-}
-
-exports.Toggle = Toggle;
-exports.ToggleContainer = ToggleContainer;
-exports.ToggleUI = ToggleUI;
-exports.useToggleContext = useToggleContext;
-//# sourceMappingURL=Toggle.js.map

package/dist/cjs/ui/Tooltip.js

@@ -1,17 +0,0 @@
-'use strict';
-
-var _tslib = require('../chunks/bundle-0pCHXNhB.js');
-var React = require('react');
-var ui_Label = require('../chunks/bundle-4RnnhACR.js');
-require('../chunks/bundle-4c_n4Hqm.js');
-
-function Tooltip(_a) {
-    var _b = _a.className, className = _b === void 0 ? '' : _b, _c = _a.children, children = _c === void 0 ? '' : _c;
-    return (React.createElement("div", { className: _tslib.__spreadArray(_tslib.__spreadArray([], (Array.isArray(className) ? className : [className]), true), [
-            'sendbird-tooltip',
-        ], false).join(' ') },
-        React.createElement(ui_Label.Label, { className: "sendbird-tooltip__text", type: ui_Label.LabelTypography.CAPTION_2, color: ui_Label.LabelColors.ONCONTENT_1 }, children)));
-}
-
-module.exports = Tooltip;
-//# sourceMappingURL=Tooltip.js.map

package/dist/cjs/ui/TooltipWrapper.js

@@ -1,21 +0,0 @@
-'use strict';
-
-var _tslib = require('../chunks/bundle-0pCHXNhB.js');
-var React = require('react');
-
-var SPACE_FROM_TRIGGER = 8;
-function TooltipWrapper(_a) {
-    var _b = _a.className, className = _b === void 0 ? '' : _b, children = _a.children, hoverTooltip = _a.hoverTooltip;
-    var _c = React.useState(false), showHoverTooltip = _c[0], setShowHoverTooltip = _c[1];
-    var childrenRef = React.useRef(null);
-    return (React.createElement("div", { className: _tslib.__spreadArray(_tslib.__spreadArray([], (Array.isArray(className) ? className : [className]), true), [
-            'sendbird-tooltip-wrapper',
-        ], false).join(' '), onMouseOver: function () { setShowHoverTooltip(true); }, onFocus: function () { setShowHoverTooltip(true); }, onMouseOut: function () { setShowHoverTooltip(false); }, onBlur: function () { setShowHoverTooltip(false); } },
-        React.createElement("div", { className: "sendbird-tooltip-wrapper__children", ref: childrenRef }, children),
-        showHoverTooltip && (React.createElement("div", { className: "sendbird-tooltip-wrapper__hover-tooltip", style: { bottom: "calc(100% + ".concat(SPACE_FROM_TRIGGER, "px)") } },
-            React.createElement("div", { className: "sendbird-tooltip-wrapper__hover-tooltip__inner" },
-                React.createElement("div", { className: "sendbird-tooltip-wrapper__hover-tooltip__inner__tooltip-container", style: { left: childrenRef.current && "calc(".concat(childrenRef.current.offsetWidth / 2, "px - 50%)") } }, hoverTooltip))))));
-}
-
-module.exports = TooltipWrapper;
-//# sourceMappingURL=TooltipWrapper.js.map