@sendbird/uikit-react 3.10.1 → 3.10.2-alpha.0

package/cjs/chunks/bundle-JVe1J2FX.js

@@ -1,179 +0,0 @@
-'use strict';
-
-var React = require('react');
-var ui_Icon = require('../ui/Icon.js');
-var message = require('@sendbird/chat/message');
-var ui_ImageRenderer = require('../ui/ImageRenderer.js');
-var index = require('./bundle-p6kWiWDv.js');
-var ui_FileViewer = require('./bundle-68NdNRjR.js');
-var index$1 = require('./bundle-65IwoStx.js');
-
-function ImageGrid(_a) {
-    var _b;
-    var children = _a.children, className = _a.className, message = _a.message, isReactionEnabled = _a.isReactionEnabled;
-    return (React.createElement("div", { className: 'sendbird-image-grid-wrap' },
-        React.createElement("div", { className: index.getClassName([
-                className,
-                'sendbird-image-grid',
-                (isReactionEnabled && ((_b = message === null || message === void 0 ? void 0 : message.reactions) === null || _b === void 0 ? void 0 : _b.length) > 0) ? 'reactions' : '',
-            ]) }, children)));
-}
-
-var GRID_WIDTH_CHAT_WEB = 400;
-var GRID_SIDE_PADDING = 8;
-var GRID_GAP = 4;
-var TIMESTAMP_WIDTH_AND_ITS_SIDE_MARGIN = 54;
-var PROFILE_IMAGE_WIDTH = 40;
-var CHAT_MOBILE_SIDE_PADDING = 48;
-var THREAD_PARENT_WIDTH = 320;
-var THREAD_PARENT_SIDE_PADDING = 28;
-var THREAD_PARENT_GRID_MARGIN_LEFT = 12;
-var THREAD_CHILD_WIDTH = 200;
-var THREAD_CHILD_SIDE_PADDING = 8;
-var THREAD_CHILD_MOBILE_SIDE_PADDING = 32;
-var THREAD_CHILD_MOBILE_TIMESTAMP_WIDTH_AND_ITS_SIDE_MARGIN = 60;
-var MULTIPLE_FILES_IMAGE_SIDE_LENGTH = {
-    CHAT_WEB: "calc(".concat(GRID_WIDTH_CHAT_WEB / 2, "px - ").concat((GRID_SIDE_PADDING + GRID_GAP) / 2, "px)"),
-    CHAT_MOBILE: "calc(50vw - ".concat((CHAT_MOBILE_SIDE_PADDING + PROFILE_IMAGE_WIDTH + TIMESTAMP_WIDTH_AND_ITS_SIDE_MARGIN + GRID_SIDE_PADDING + GRID_GAP) / 2, "px)"),
-    THREAD_PARENT_WEB: "calc(".concat((THREAD_PARENT_WIDTH - (THREAD_PARENT_SIDE_PADDING + PROFILE_IMAGE_WIDTH + THREAD_PARENT_GRID_MARGIN_LEFT + GRID_GAP)) / 2, "px)"),
-    THREAD_PARENT_MOBILE: "calc(50vw - ".concat((THREAD_PARENT_SIDE_PADDING + PROFILE_IMAGE_WIDTH + THREAD_PARENT_GRID_MARGIN_LEFT + GRID_GAP) / 2, "px)"),
-    THREAD_CHILD_WEB: "calc(".concat((THREAD_CHILD_WIDTH - THREAD_CHILD_SIDE_PADDING - GRID_GAP) / 2, "px)"),
-    THREAD_CHILD_MOBILE: "calc(50vw - ".concat((THREAD_CHILD_MOBILE_SIDE_PADDING + PROFILE_IMAGE_WIDTH + THREAD_CHILD_MOBILE_TIMESTAMP_WIDTH_AND_ITS_SIDE_MARGIN + GRID_SIDE_PADDING + GRID_GAP) / 2, "px)"),
-};
-var MULTIPLE_FILES_IMAGE_BORDER_RADIUS = {
-    CHAT_WEB: '6px',
-    CHAT_MOBILE: '6px',
-    THREAD_PARENT_WEB: '6px',
-    THREAD_PARENT_MOBILE: '6px',
-    THREAD_CHILD_WEB: '6px',
-    THREAD_CHILD_MOBILE: '6px',
-};
-var MULTIPLE_FILES_IMAGE_THUMBNAIL_SIDE_LENGTH = '34px';
-
-var ThreadMessageKind = {
-    PARENT: 'parent',
-    CHILD: 'child',
-};
-function MultipleFilesMessageItemBody(_a) {
-    var className = _a.className, message$1 = _a.message, _b = _a.isReactionEnabled, isReactionEnabled = _b === void 0 ? false : _b, threadMessageKindKey = _a.threadMessageKindKey, _c = _a.statefulFileInfoList, statefulFileInfoList = _c === void 0 ? [] : _c;
-    var _d = React.useState(-1), currentFileViewerIndex = _d[0], setCurrentFileViewerIndex = _d[1];
-    function onClose() {
-        setCurrentFileViewerIndex(-1);
-    }
-    function onClickLeft() {
-        setCurrentFileViewerIndex(currentFileViewerIndex === 0
-            ? statefulFileInfoList.length - 1
-            : currentFileViewerIndex - 1);
-    }
-    function onClickRight() {
-        setCurrentFileViewerIndex(currentFileViewerIndex === statefulFileInfoList.length - 1
-            ? 0
-            : currentFileViewerIndex + 1);
-    }
-    return threadMessageKindKey && (React.createElement(React.Fragment, null,
-        currentFileViewerIndex > -1 && (React.createElement(ui_FileViewer.FileViewer, { message: message$1, statefulFileInfoList: statefulFileInfoList, currentIndex: currentFileViewerIndex, onClickLeft: onClickLeft, onClickRight: onClickRight, onClose: onClose })),
-        React.createElement(ImageGrid, { className: className, message: message$1, isReactionEnabled: isReactionEnabled }, statefulFileInfoList.map(function (fileInfo, index$1) {
-            var _a, _b, _c;
-            var isGifValue = index.isGif(fileInfo.mimeType);
-            return React.createElement("div", { className: 'sendbird-multiple-files-image-renderer-wrapper', onClick: message$1.sendingStatus === message.SendingStatus.SUCCEEDED
-                    ? function () { return setCurrentFileViewerIndex(index$1); }
-                    : undefined, key: "sendbird-multiple-files-image-renderer-".concat(index$1, "-").concat(fileInfo.url) },
-                React.createElement(ui_ImageRenderer.default, { url: (_c = (_b = (_a = fileInfo.thumbnails) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.url) !== null && _c !== void 0 ? _c : fileInfo.url, fixedSize: false, width: MULTIPLE_FILES_IMAGE_SIDE_LENGTH[threadMessageKindKey], maxSideLength: MULTIPLE_FILES_IMAGE_SIDE_LENGTH.CHAT_WEB, height: MULTIPLE_FILES_IMAGE_SIDE_LENGTH[threadMessageKindKey], borderRadius: ui_ImageRenderer.getBorderRadiusForMultipleImageRenderer(MULTIPLE_FILES_IMAGE_BORDER_RADIUS[threadMessageKindKey], index$1, statefulFileInfoList.length), shadeOnHover: true, isUploaded: !!fileInfo.isUploaded, placeHolder: function (style_) { return (React.createElement("div", { className: "sendbird-multiple-files-image-renderer__thumbnail__placeholder", style: style_ }, isGifValue
-                        ? React.createElement("div", { className: "sendbird-multiple-files-image-renderer__thumbnail__placeholder__icon" },
-                            React.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.GIF, fillColor: ui_Icon.IconColors.THUMBNAIL_ICON, width: MULTIPLE_FILES_IMAGE_THUMBNAIL_SIDE_LENGTH, height: MULTIPLE_FILES_IMAGE_THUMBNAIL_SIDE_LENGTH }))
-                        : React.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.PHOTO, fillColor: ui_Icon.IconColors.ON_BACKGROUND_2, width: MULTIPLE_FILES_IMAGE_THUMBNAIL_SIDE_LENGTH, height: MULTIPLE_FILES_IMAGE_THUMBNAIL_SIDE_LENGTH }))); }, defaultComponent: React.createElement("div", { className: "sendbird-multiple-files-image-renderer__thumbnail__placeholder" }, React.createElement(ui_Icon.default, { type: ui_Icon.IconTypes.THUMBNAIL_NONE, fillColor: ui_Icon.IconColors.ON_BACKGROUND_2, width: MULTIPLE_FILES_IMAGE_THUMBNAIL_SIDE_LENGTH, height: MULTIPLE_FILES_IMAGE_THUMBNAIL_SIDE_LENGTH })) }));
-        }))));
-}
-
-function useThreadMessageKindKeySelector(_a) {
-    var threadMessageKind = _a.threadMessageKind, isMobile = _a.isMobile;
-    var threadMessageKindKey = React.useMemo(function () {
-        return index$1.K(threadMessageKind)
-            .with(ThreadMessageKind.PARENT, function () { return (isMobile
-            ? 'THREAD_PARENT_MOBILE'
-            : 'THREAD_PARENT_WEB'); })
-            .with(ThreadMessageKind.CHILD, function () { return (isMobile
-            ? 'THREAD_CHILD_MOBILE'
-            : 'THREAD_CHILD_WEB'); })
-            .otherwise(function () { return (isMobile
-            ? 'CHAT_MOBILE'
-            : 'CHAT_WEB'); });
-    }, [isMobile, threadMessageKind]);
-    return threadMessageKindKey;
-}
-
-function createStatefulFileInfoList(message$1, oldStatefulFileInfoList) {
-    var _a;
-    if (!message$1)
-        return null;
-    // Handle sent messages.
-    if (message$1.sendingStatus === message.SendingStatus.SUCCEEDED) {
-        return message$1.fileInfoList.map(function (fileInfo) {
-            return {
-                fileName: fileInfo.fileName,
-                fileSize: fileInfo.fileSize,
-                mimeType: fileInfo.mimeType,
-                thumbnails: fileInfo.thumbnails,
-                url: fileInfo.url,
-                isUploaded: true,
-            };
-        });
-    }
-    // Handle unsent message.
-    if (!Array.isArray((_a = message$1.messageParams) === null || _a === void 0 ? void 0 : _a.fileInfoList))
-        return null;
-    return message$1.messageParams.fileInfoList
-        .map(function (fileInfo, index) {
-        var _a, _b, _c;
-        return ({
-            fileName: fileInfo.fileName,
-            fileSize: fileInfo.fileSize,
-            mimeType: fileInfo.mimeType,
-            /**
-             * Note here, we prioritize using fileUrl (implying uploaded state) over file.
-             * This is necessary because cache loaded pending/failed mfms is mixed with
-             * files (not yet uploaded ones) and fileUrls (uploaded).
-             *
-             * Notice that if file is used in the old state, it will not be replace with the new fileUrl
-             * because doing so will rerender the ImageRenderer component which makes rendering process awkward and slow.
-             * */
-            url: (_c = (_b = (_a = oldStatefulFileInfoList[index]) === null || _a === void 0 ? void 0 : _a.url) !== null && _b !== void 0 ? _b : fileInfo.fileUrl) !== null && _c !== void 0 ? _c : (fileInfo.file instanceof Blob
-                ? URL.createObjectURL(fileInfo.file)
-                : undefined),
-            /**
-             * Side note: It was a bad design to not include this property by SDK.
-             * Because if original object has fileUrl set and no file, then uploaded result remains
-             * the same so customer cannot know whether it has been uploaded or not.
-             */
-            isUploaded: !fileInfo.file && typeof fileInfo.fileUrl === 'string' && fileInfo.fileUrl.length > 0,
-        });
-    });
-}
-
-var useStatefulFileInfoList = function (message) {
-    var _a, _b, _c;
-    var _d = React.useState([]), statefulFileInfoList = _d[0], setStatefulFileInfoList = _d[1];
-    React.useEffect(function () {
-        if (index.isMultipleFilesMessage(message)) {
-            var newStatefulFileInfoList = createStatefulFileInfoList(message, statefulFileInfoList);
-            setStatefulFileInfoList(newStatefulFileInfoList);
-        }
-    }, [
-        // Sent message dependency.
-        (_a = message.fileInfoList) === null || _a === void 0 ? void 0 : _a.length,
-        // Unsent message dependency.
-        /**
-         * Side note: It was a bad design to not include 'isUploaded' property by SDK.
-         * Because if original object has fileUrl set and no file, then uploaded result remains
-         * the same so customer cannot know whether it has been uploaded or not.
-         */
-        (_c = (_b = message.messageParams) === null || _b === void 0 ? void 0 : _b.fileInfoList) === null || _c === void 0 ? void 0 : _c.map(function (fileInfo) { return fileInfo.fileUrl; }).join(','),
-    ]);
-    return statefulFileInfoList;
-};
-
-exports.MultipleFilesMessageItemBody = MultipleFilesMessageItemBody;
-exports.ThreadMessageKind = ThreadMessageKind;
-exports.useStatefulFileInfoList = useStatefulFileInfoList;
-exports.useThreadMessageKindKeySelector = useThreadMessageKindKeySelector;
-//# sourceMappingURL=bundle-JVe1J2FX.js.map

package/cjs/chunks/bundle-JbxviE94.js.map

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

package/cjs/chunks/bundle-LRCFL23q.js.map

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

package/cjs/chunks/bundle-OVfymd1y.js.map

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

package/cjs/chunks/bundle-Oc2T5_VP.js.map

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

package/cjs/chunks/bundle-TFo3Eb8z.js.map

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

package/cjs/chunks/bundle-TxdziCwH.js.map

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

package/cjs/chunks/bundle-UaSM_xZY.js.map

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