@sendbird/uikit-react 3.7.0 → 3.8.1

package/chunks/bundle-FQAabli1.js.map

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

package/chunks/bundle-G3cS-S1W.js

@@ -0,0 +1,24 @@
+import React__default from 'react';
+
+/**
+ * user profile goes deep inside the component tree
+ * use this context as a short circuit to send in values
+ */
+var UserProfileContext = React__default.createContext({
+    disableUserProfile: true,
+    isOpenChannel: false,
+    renderUserProfile: null,
+    onUserProfileMessage: null,
+});
+var UserProfileProvider = function (_a) {
+    var _b = _a.isOpenChannel, isOpenChannel = _b === void 0 ? false : _b, _c = _a.disableUserProfile, disableUserProfile = _c === void 0 ? false : _c, _d = _a.renderUserProfile, renderUserProfile = _d === void 0 ? null : _d, _e = _a.onUserProfileMessage, onUserProfileMessage = _e === void 0 ? null : _e, children = _a.children;
+    return (React__default.createElement(UserProfileContext.Provider, { value: {
+            isOpenChannel: isOpenChannel,
+            disableUserProfile: disableUserProfile,
+            renderUserProfile: renderUserProfile,
+            onUserProfileMessage: onUserProfileMessage,
+        } }, children));
+};
+
+export { UserProfileProvider as U, UserProfileContext as a };
+//# sourceMappingURL=bundle-G3cS-S1W.js.map

package/chunks/bundle-G3cS-S1W.js.map

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

package/chunks/bundle-GqUhOzeC.js

@@ -0,0 +1,16 @@
+import React__default from 'react';
+import { g as getStringSet } from './bundle-4zdVdGkr.js';
+import { d as defaultLocale } from './bundle-ltzZCtkR.js';
+
+var LocalizationContext = React__default.createContext({
+    stringSet: getStringSet('en'),
+    dateLocale: defaultLocale,
+});
+var LocalizationProvider = function (props) {
+    var children = props.children;
+    return (React__default.createElement(LocalizationContext.Provider, { value: props }, children));
+};
+var useLocalization = function () { return React__default.useContext(LocalizationContext); };
+
+export { LocalizationContext as L, LocalizationProvider as a, useLocalization as u };
+//# sourceMappingURL=bundle-GqUhOzeC.js.map

package/chunks/bundle-GqUhOzeC.js.map

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

package/chunks/bundle-J7RD0FpU.js

@@ -0,0 +1,96 @@
+import React__default, { useState, useMemo, useCallback } from 'react';
+import { PlaybackTime } from '../ui/PlaybackTime.js';
+import { ProgressBar } from '../ui/ProgressBar.js';
+import TextButton from '../ui/TextButton.js';
+import Icon, { IconTypes, IconColors } from '../ui/Icon.js';
+import { b as LabelColors, L as Label, a as LabelTypography } from './bundle-lDOyfwhb.js';
+import { u as useLocalization } from './bundle-GqUhOzeC.js';
+import { f as VOICE_RECORDER_CLICK_BUFFER_TIME, e as VOICE_RECORDER_DEFAULT_MIN } from './bundle-UjngV2Kp.js';
+
+/* eslint-disable no-redeclare */
+var VoiceMessageInputStatus = {
+    READY_TO_RECORD: 'READY_TO_RECORD',
+    RECORDING: 'RECORDING',
+    READY_TO_PLAY: 'READY_TO_PLAY',
+    PLAYING: 'PLAYING',
+};
+
+var ControlerIcon = function (_a) {
+    var inputState = _a.inputState;
+    switch (inputState) {
+        case VoiceMessageInputStatus.READY_TO_RECORD: {
+            return (React__default.createElement("div", { className: "sendbird-controler-icon record-icon" }));
+        }
+        case VoiceMessageInputStatus.RECORDING: {
+            return (React__default.createElement("div", { className: "sendbird-controler-icon stop-icon" }));
+        }
+        case VoiceMessageInputStatus.READY_TO_PLAY: {
+            return (React__default.createElement(Icon, { className: "sendbird-controler-icon play-icon", width: "20px", height: "20px", type: IconTypes.PLAY, fillColor: IconColors.ON_BACKGROUND_1 }));
+        }
+        case VoiceMessageInputStatus.PLAYING: {
+            return (React__default.createElement("div", { className: "sendbird-controler-icon pause-icon" },
+                React__default.createElement("div", { className: "sendbird-controler-icon pause-icon-inner" }),
+                React__default.createElement("div", { className: "sendbird-controler-icon pause-icon-inner" })));
+        }
+        default:
+            return null;
+    }
+};
+
+var VoiceMessageInput = function (_a) {
+    var _b = _a.minRecordTime, minRecordTime = _b === void 0 ? VOICE_RECORDER_DEFAULT_MIN : _b, maximumValue = _a.maximumValue, _c = _a.currentValue, currentValue = _c === void 0 ? 0 : _c, currentType = _a.currentType, onCancelClick = _a.onCancelClick, onControlClick = _a.onControlClick, onSubmitClick = _a.onSubmitClick, renderCancelButton = _a.renderCancelButton, renderControlButton = _a.renderControlButton, renderSubmitButton = _a.renderSubmitButton;
+    var _d = useState(0), lastClickTime = _d[0], setLastClickTime = _d[1];
+    var isReadyToRecord = useMemo(function () { return currentType === VoiceMessageInputStatus.READY_TO_RECORD; }, [currentType]);
+    var isRecording = useMemo(function () { return currentType === VoiceMessageInputStatus.RECORDING; }, [currentType]);
+    var isSendButtonDisabled = useMemo(function () {
+        if (currentType === VoiceMessageInputStatus.READY_TO_RECORD
+            || currentType === VoiceMessageInputStatus.RECORDING) {
+            return minRecordTime > currentValue;
+        }
+        return false;
+    }, [currentType, minRecordTime, currentValue]);
+    var isPlayMode = useMemo(function () {
+        return (currentType === VoiceMessageInputStatus.READY_TO_PLAY
+            || currentType === VoiceMessageInputStatus.PLAYING);
+    }, [currentType]);
+    var stringSet = useLocalization().stringSet;
+    var handleOnCancelClick = function () {
+        var currentTime = Date.now();
+        if (currentTime - lastClickTime > VOICE_RECORDER_CLICK_BUFFER_TIME) {
+            onCancelClick();
+            setLastClickTime(currentTime);
+        }
+    };
+    var handleOnControlClick = useCallback(function () {
+        var currentTime = Date.now();
+        if (currentTime - lastClickTime > VOICE_RECORDER_CLICK_BUFFER_TIME) {
+            onControlClick(currentType);
+            setLastClickTime(currentTime);
+        }
+    }, [currentType]);
+    var handleOnSubmitClick = function () {
+        var currentTime = Date.now();
+        if (currentTime - lastClickTime > VOICE_RECORDER_CLICK_BUFFER_TIME) {
+            if (!isSendButtonDisabled) {
+                onSubmitClick();
+            }
+            setLastClickTime(currentTime);
+        }
+    };
+    return (React__default.createElement("div", { className: "sendbird-voice-message-input" },
+        React__default.createElement("div", { className: "sendbird-voice-message-input__indicator" },
+            React__default.createElement("div", { className: "sendbird-voice-message-input__indicator__progress-bar" },
+                React__default.createElement(ProgressBar, { className: "sendbird-voice-message-input__indicator__progress-bar__bar", disabled: isReadyToRecord, maxSize: maximumValue, currentSize: currentValue })),
+            (isRecording) ? (React__default.createElement("div", { className: "sendbird-voice-message-input__indicator__on-rec" })) : null,
+            React__default.createElement(PlaybackTime, { className: "sendbird-voice-message-input__indicator__playback-time", time: isPlayMode ? maximumValue - currentValue : currentValue, labelColor: isReadyToRecord ? LabelColors.ONBACKGROUND_4 : LabelColors.ONCONTENT_1 })),
+        React__default.createElement("div", { className: "sendbird-voice-message-input__controler" },
+            (renderCancelButton === null || renderCancelButton === void 0 ? void 0 : renderCancelButton()) || (React__default.createElement(TextButton, { className: "sendbird-voice-message-input__controler__cancel", onClick: handleOnCancelClick, disableUnderline: true },
+                React__default.createElement(Label, { type: LabelTypography.BUTTON_1, color: LabelColors.PRIMARY }, stringSet.BUTTON__CANCEL))),
+            (renderControlButton === null || renderControlButton === void 0 ? void 0 : renderControlButton(currentType)) || (React__default.createElement("div", { className: "sendbird-voice-message-input__controler__main", onClick: handleOnControlClick },
+                React__default.createElement(ControlerIcon, { inputState: currentType }))),
+            (renderSubmitButton === null || renderSubmitButton === void 0 ? void 0 : renderSubmitButton()) || (React__default.createElement("div", { className: "sendbird-voice-message-input__controler__submit ".concat(isSendButtonDisabled ? 'voice-message--disabled' : ''), onClick: handleOnSubmitClick },
+                React__default.createElement(Icon, { width: "19px", height: "19px", type: IconTypes.SEND, fillColor: isSendButtonDisabled ? IconColors.ON_BACKGROUND_4 : IconColors.CONTENT }))))));
+};
+
+export { VoiceMessageInputStatus as V, VoiceMessageInput as a };
+//# sourceMappingURL=bundle-J7RD0FpU.js.map

package/chunks/bundle-J7RD0FpU.js.map

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

package/{index-f8a9cb51.js → chunks/bundle-J7om32yx.js}

@@ -1,5 +1,5 @@
-import { i as isSameDay } from './index-682a192c.js';
-import { r as requiredArgs, t as toDate, a as toInteger } from './index-2d27aeef.js';
+import { i as isSameDay } from './bundle-ZZuBYhV1.js';
+import { r as requiredArgs, t as toDate, a as toInteger } from './bundle-LPkaaUo4.js';
 
 /**
  * @name isToday
@@ -22,6 +22,7 @@ import { r as requiredArgs, t as toDate, a as toInteger } from './index-2d27aeef
  * const result = isToday(new Date(2014, 9, 6, 14, 0))
  * //=> true
  */
+
 function isToday(dirtyDate) {
   requiredArgs(1, arguments);
   return isSameDay(dirtyDate, Date.now());
@@ -45,6 +46,7 @@ function isToday(dirtyDate) {
  * const result = isSameYear(new Date(2014, 8, 2), new Date(2014, 8, 25))
  * //=> true
  */
+
 function isSameYear(dirtyDateLeft, dirtyDateRight) {
   requiredArgs(2, arguments);
   var dateLeft = toDate(dirtyDateLeft);
@@ -73,6 +75,7 @@ function isSameYear(dirtyDateLeft, dirtyDateRight) {
  * const result = isThisYear(new Date(2014, 6, 2))
  * //=> true
  */
+
 function isThisYear(dirtyDate) {
   requiredArgs(1, arguments);
   return isSameYear(dirtyDate, Date.now());
@@ -96,17 +99,21 @@ function isThisYear(dirtyDate) {
  * const result = addDays(new Date(2014, 8, 1), 10)
  * //=> Thu Sep 11 2014 00:00:00
  */
+
 function addDays(dirtyDate, dirtyAmount) {
   requiredArgs(2, arguments);
   var date = toDate(dirtyDate);
   var amount = toInteger(dirtyAmount);
+
   if (isNaN(amount)) {
     return new Date(NaN);
   }
+
   if (!amount) {
     // If 0 days, no-op to avoid changing times in the hour before end of DST
     return date;
   }
+
   date.setDate(date.getDate() + amount);
   return date;
 }
@@ -129,6 +136,7 @@ function addDays(dirtyDate, dirtyAmount) {
  * const result = subDays(new Date(2014, 8, 1), 10)
  * //=> Fri Aug 22 2014 00:00:00
  */
+
 function subDays(dirtyDate, dirtyAmount) {
   requiredArgs(2, arguments);
   var amount = toInteger(dirtyAmount);
@@ -156,10 +164,11 @@ function subDays(dirtyDate, dirtyAmount) {
  * const result = isYesterday(new Date(2014, 9, 5, 14, 0))
  * //=> true
  */
+
 function isYesterday(dirtyDate) {
   requiredArgs(1, arguments);
   return isSameDay(dirtyDate, subDays(Date.now(), 1));
 }
 
 export { isYesterday as a, isThisYear as b, isToday as i };
-//# sourceMappingURL=index-f8a9cb51.js.map
+//# sourceMappingURL=bundle-J7om32yx.js.map

package/chunks/bundle-J7om32yx.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"bundle-J7om32yx.js","sources":["../../node_modules/date-fns/esm/isToday/index.js","../../node_modules/date-fns/esm/isSameYear/index.js","../../node_modules/date-fns/esm/isThisYear/index.js","../../node_modules/date-fns/esm/addDays/index.js","../../node_modules/date-fns/esm/subDays/index.js","../../node_modules/date-fns/esm/isYesterday/index.js"],"sourcesContent":["import isSameDay from \"../isSameDay/index.js\";\nimport requiredArgs from \"../_lib/requiredArgs/index.js\";\n/**\n * @name isToday\n * @category Day Helpers\n * @summary Is the given date today?\n * @pure false\n *\n * @description\n * Is the given date today?\n *\n * > ⚠️ Please note that this function is not present in the FP submodule as\n * > it uses `Date.now()` internally hence impure and can't be safely curried.\n *\n * @param {Date|Number} date - the date to check\n * @returns {Boolean} the date is today\n * @throws {TypeError} 1 argument required\n *\n * @example\n * // If today is 6 October 2014, is 6 October 14:00:00 today?\n * const result = isToday(new Date(2014, 9, 6, 14, 0))\n * //=> true\n */\n\nexport default function isToday(dirtyDate) {\n  requiredArgs(1, arguments);\n  return isSameDay(dirtyDate, Date.now());\n}","import toDate from \"../toDate/index.js\";\nimport requiredArgs from \"../_lib/requiredArgs/index.js\";\n/**\n * @name isSameYear\n * @category Year Helpers\n * @summary Are the given dates in the same year?\n *\n * @description\n * Are the given dates in the same year?\n *\n * @param {Date|Number} dateLeft - the first date to check\n * @param {Date|Number} dateRight - the second date to check\n * @returns {Boolean} the dates are in the same year\n * @throws {TypeError} 2 arguments required\n *\n * @example\n * // Are 2 September 2014 and 25 September 2014 in the same year?\n * const result = isSameYear(new Date(2014, 8, 2), new Date(2014, 8, 25))\n * //=> true\n */\n\nexport default function isSameYear(dirtyDateLeft, dirtyDateRight) {\n  requiredArgs(2, arguments);\n  var dateLeft = toDate(dirtyDateLeft);\n  var dateRight = toDate(dirtyDateRight);\n  return dateLeft.getFullYear() === dateRight.getFullYear();\n}","import isSameYear from \"../isSameYear/index.js\";\nimport requiredArgs from \"../_lib/requiredArgs/index.js\";\n/**\n * @name isThisYear\n * @category Year Helpers\n * @summary Is the given date in the same year as the current date?\n * @pure false\n *\n * @description\n * Is the given date in the same year as the current date?\n *\n * > ⚠️ Please note that this function is not present in the FP submodule as\n * > it uses `Date.now()` internally hence impure and can't be safely curried.\n *\n * @param {Date|Number} date - the date to check\n * @returns {Boolean} the date is in this year\n * @throws {TypeError} 1 argument required\n *\n * @example\n * // If today is 25 September 2014, is 2 July 2014 in this year?\n * const result = isThisYear(new Date(2014, 6, 2))\n * //=> true\n */\n\nexport default function isThisYear(dirtyDate) {\n  requiredArgs(1, arguments);\n  return isSameYear(dirtyDate, Date.now());\n}","import toInteger from \"../_lib/toInteger/index.js\";\nimport toDate from \"../toDate/index.js\";\nimport requiredArgs from \"../_lib/requiredArgs/index.js\";\n/**\n * @name addDays\n * @category Day Helpers\n * @summary Add the specified number of days to the given date.\n *\n * @description\n * Add the specified number of days to the given date.\n *\n * @param {Date|Number} date - the date to be changed\n * @param {Number} amount - the amount of days to be added. Positive decimals will be rounded using `Math.floor`, decimals less than zero will be rounded using `Math.ceil`.\n * @returns {Date} - the new date with the days added\n * @throws {TypeError} - 2 arguments required\n *\n * @example\n * // Add 10 days to 1 September 2014:\n * const result = addDays(new Date(2014, 8, 1), 10)\n * //=> Thu Sep 11 2014 00:00:00\n */\n\nexport default function addDays(dirtyDate, dirtyAmount) {\n  requiredArgs(2, arguments);\n  var date = toDate(dirtyDate);\n  var amount = toInteger(dirtyAmount);\n\n  if (isNaN(amount)) {\n    return new Date(NaN);\n  }\n\n  if (!amount) {\n    // If 0 days, no-op to avoid changing times in the hour before end of DST\n    return date;\n  }\n\n  date.setDate(date.getDate() + amount);\n  return date;\n}","import addDays from \"../addDays/index.js\";\nimport requiredArgs from \"../_lib/requiredArgs/index.js\";\nimport toInteger from \"../_lib/toInteger/index.js\";\n/**\n * @name subDays\n * @category Day Helpers\n * @summary Subtract the specified number of days from the given date.\n *\n * @description\n * Subtract the specified number of days from the given date.\n *\n * @param {Date|Number} date - the date to be changed\n * @param {Number} amount - the amount of days to be subtracted. Positive decimals will be rounded using `Math.floor`, decimals less than zero will be rounded using `Math.ceil`.\n * @returns {Date} the new date with the days subtracted\n * @throws {TypeError} 2 arguments required\n *\n * @example\n * // Subtract 10 days from 1 September 2014:\n * const result = subDays(new Date(2014, 8, 1), 10)\n * //=> Fri Aug 22 2014 00:00:00\n */\n\nexport default function subDays(dirtyDate, dirtyAmount) {\n  requiredArgs(2, arguments);\n  var amount = toInteger(dirtyAmount);\n  return addDays(dirtyDate, -amount);\n}","import isSameDay from \"../isSameDay/index.js\";\nimport subDays from \"../subDays/index.js\";\nimport requiredArgs from \"../_lib/requiredArgs/index.js\";\n/**\n * @name isYesterday\n * @category Day Helpers\n * @summary Is the given date yesterday?\n * @pure false\n *\n * @description\n * Is the given date yesterday?\n *\n * > ⚠️ Please note that this function is not present in the FP submodule as\n * > it uses `Date.now()` internally hence impure and can't be safely curried.\n *\n * @param {Date|Number} date - the date to check\n * @returns {Boolean} the date is yesterday\n * @throws {TypeError} 1 argument required\n *\n * @example\n * // If today is 6 October 2014, is 5 October 14:00:00 yesterday?\n * const result = isYesterday(new Date(2014, 9, 5, 14, 0))\n * //=> true\n */\n\nexport default function isYesterday(dirtyDate) {\n  requiredArgs(1, arguments);\n  return isSameDay(dirtyDate, subDays(Date.now(), 1));\n}"],"names":[],"mappings":"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","x_google_ignoreList":[0,1,2,3,4,5]}

package/{const-73db0277.js → chunks/bundle-JGFwpJZJ.js}

@@ -1,13 +1,13 @@
-var PREV_RESULT_SIZE = 30;
-var NEXT_RESULT_SIZE = 15;
-var MAX_USER_MENTION_COUNT = 10;
-var MAX_USER_SUGGESTION_COUNT = 15;
-var USER_MENTION_TEMP_CHAR = '@';
-var ThreadReplySelectType;
-(function (ThreadReplySelectType) {
-  ThreadReplySelectType["PARENT"] = "PARENT";
-  ThreadReplySelectType["THREAD"] = "THREAD";
+var PREV_RESULT_SIZE = 30;
+var NEXT_RESULT_SIZE = 15;
+var MAX_USER_MENTION_COUNT = 10;
+var MAX_USER_SUGGESTION_COUNT = 15;
+var USER_MENTION_TEMP_CHAR = '@';
+var ThreadReplySelectType;
+(function (ThreadReplySelectType) {
+    ThreadReplySelectType["PARENT"] = "PARENT";
+    ThreadReplySelectType["THREAD"] = "THREAD";
 })(ThreadReplySelectType || (ThreadReplySelectType = {}));
 
 export { MAX_USER_MENTION_COUNT as M, NEXT_RESULT_SIZE as N, PREV_RESULT_SIZE as P, ThreadReplySelectType as T, USER_MENTION_TEMP_CHAR as U, MAX_USER_SUGGESTION_COUNT as a };
-//# sourceMappingURL=const-73db0277.js.map
+//# sourceMappingURL=bundle-JGFwpJZJ.js.map

package/chunks/bundle-JGFwpJZJ.js.map

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

package/chunks/bundle-KaSW5xxP.js

@@ -0,0 +1,176 @@
+import { _ as __assign } from './bundle-AVOWwEQ4.js';
+import React__default, { useLayoutEffect, useCallback, useRef, useContext } from 'react';
+import { createPortal } from 'react-dom';
+import { L as LocalizationContext } from './bundle-GqUhOzeC.js';
+import '../hooks/useModal.js';
+import { b as isMultipleFilesMessage, c as isFileMessage, d as isSupportedFileView, e as isVideo$1, f as isImage$1 } from './bundle-OoXqnc0l.js';
+import { n as noop } from './bundle-FQAabli1.js';
+import { A as Avatar } from './bundle-x3udz03j.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from './bundle-lDOyfwhb.js';
+import Icon, { IconTypes, IconColors } from '../ui/Icon.js';
+import { h as SLIDER_BUTTON_ICON_SIDE_LENGTH } from './bundle-UjngV2Kp.js';
+import { a as MODAL_ROOT } from './bundle-gYyMZyCn.js';
+
+// https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/MIME_types/Complete_list_of_MIME_types
+var SUPPORTED_MIMES = {
+    IMAGE: [
+        'image/jpeg',
+        'image/jpg',
+        'image/png',
+        'image/gif',
+        'image/svg+xml',
+        'image/webp',
+    ],
+    VIDEO: [
+        'video/mpeg',
+        'video/ogg',
+        'video/webm',
+        'video/mp4',
+    ],
+};
+var isImage = function (type) { return SUPPORTED_MIMES.IMAGE.indexOf(type) >= 0; };
+var isVideo = function (type) { return SUPPORTED_MIMES.VIDEO.indexOf(type) >= 0; };
+__assign({}, SUPPORTED_MIMES);
+var ViewerTypes = {
+    SINGLE: 'SINGLE',
+    MULTI: 'MULTI',
+};
+
+function useKeyDown(_a) {
+    var props = _a.props, ref = _a.ref;
+    var onClose = props.onClose;
+    var onClickLeft = noop;
+    var onClickRight = noop;
+    if (props.viewerType === ViewerTypes.MULTI) {
+        onClickLeft = props.onClickLeft;
+        onClickRight = props.onClickRight;
+    }
+    useLayoutEffect(function () {
+        var _a;
+        (_a = ref.current) === null || _a === void 0 ? void 0 : _a.focus();
+    }, [ref.current]);
+    // this usecallback is not super necessary
+    // discuss with others and remove it if it's not needed
+    var onKeyDown = useCallback(function (event) {
+        switch (event.key) {
+            case 'Escape':
+                // @ts-ignore
+                onClose(event);
+                break;
+            case 'ArrowLeft':
+                onClickLeft();
+                break;
+            case 'ArrowRight':
+                onClickRight();
+                break;
+        }
+        event.stopPropagation();
+    }, [onClose, onClickLeft, onClickRight]);
+    return {
+        onKeyDown: onKeyDown,
+    };
+}
+
+function mapFileViewerComponentProps(_a) {
+    var props = _a.props;
+    if (props.viewerType === ViewerTypes.MULTI) {
+        var _b = props, fileInfoList = _b.fileInfoList, currentIndex = _b.currentIndex;
+        return fileInfoList[currentIndex];
+    }
+    var fileInfo = props;
+    return {
+        name: fileInfo.name,
+        type: fileInfo.type,
+        url: fileInfo.url,
+    };
+}
+
+function DeleteButton(props) {
+    if (props.viewerType !== ViewerTypes.MULTI) {
+        var onDelete_1 = props.onDelete, isByMe = props.isByMe, disableDelete_1 = props.disableDelete, className = props.className;
+        return (isByMe)
+            ? (React__default.createElement("div", { className: "sendbird-fileviewer__header__right__actions__delete ".concat(className) },
+                React__default.createElement(Icon, { className: disableDelete_1 ? 'disabled' : '', type: IconTypes.DELETE, fillColor: disableDelete_1 ? IconColors.GRAY : IconColors.ON_BACKGROUND_1, height: "24px", width: "24px", onClick: function (e) { if (!disableDelete_1) {
+                        onDelete_1 === null || onDelete_1 === void 0 ? void 0 : onDelete_1(e);
+                    } } })))
+            : React__default.createElement(React__default.Fragment, null);
+    }
+    return React__default.createElement(React__default.Fragment, null);
+}
+
+// this is a slider component that is used to navigate between images
+function Slider(props) {
+    if (props.viewerType === ViewerTypes.MULTI) {
+        var onClickLeft_1 = props.onClickLeft, onClickRight_1 = props.onClickRight;
+        return (React__default.createElement("div", { className: "sendbird-file-viewer-slider" },
+            React__default.createElement("div", { className: "sendbird-file-viewer-arrow--left" },
+                React__default.createElement(Icon, { type: IconTypes.SLIDE_LEFT, fillColor: IconColors.ON_BACKGROUND_1, height: SLIDER_BUTTON_ICON_SIDE_LENGTH, width: SLIDER_BUTTON_ICON_SIDE_LENGTH, onClick: function (e) {
+                        onClickLeft_1 === null || onClickLeft_1 === void 0 ? void 0 : onClickLeft_1();
+                        e.stopPropagation();
+                    } })),
+            React__default.createElement("div", { className: "sendbird-file-viewer-arrow--right" },
+                React__default.createElement(Icon, { type: IconTypes.SLIDE_LEFT, fillColor: IconColors.ON_BACKGROUND_1, height: SLIDER_BUTTON_ICON_SIDE_LENGTH, width: SLIDER_BUTTON_ICON_SIDE_LENGTH, onClick: function (e) {
+                        e.stopPropagation();
+                        onClickRight_1 === null || onClickRight_1 === void 0 ? void 0 : onClickRight_1();
+                    } }))));
+    }
+    // return empty fragment if viewerType is not ViewerTypes.MULTI
+    return React__default.createElement(React__default.Fragment, null);
+}
+
+var FileViewerComponent = function (props) {
+    var ref = useRef(null);
+    var profileUrl = props.profileUrl, nickname = props.nickname, onClose = props.onClose;
+    var onKeyDown = useKeyDown({ props: props, ref: ref }).onKeyDown;
+    var _a = mapFileViewerComponentProps({ props: props }), name = _a.name, type = _a.type, url = _a.url;
+    var stringSet = useContext(LocalizationContext).stringSet;
+    return (React__default.createElement("div", { className: "sendbird-fileviewer", onKeyDown: onKeyDown, 
+        // to focus
+        tabIndex: 1, ref: ref },
+        React__default.createElement("div", { className: "sendbird-fileviewer__header" },
+            React__default.createElement("div", { className: "sendbird-fileviewer__header__left" },
+                React__default.createElement("div", { className: "sendbird-fileviewer__header__left__avatar" },
+                    React__default.createElement(Avatar, { height: "32px", width: "32px", src: profileUrl })),
+                React__default.createElement(Label, { className: "sendbird-fileviewer__header__left__filename", type: LabelTypography.H_2, color: LabelColors.ONBACKGROUND_1 }, name),
+                React__default.createElement(Label, { className: "sendbird-fileviewer__header__left__sender-name", type: LabelTypography.BODY_1, color: LabelColors.ONBACKGROUND_2 }, nickname)),
+            React__default.createElement("div", { className: "sendbird-fileviewer__header__right" },
+                isSupportedFileView(type) && (React__default.createElement("div", { className: "sendbird-fileviewer__header__right__actions" },
+                    React__default.createElement("a", { className: "sendbird-fileviewer__header__right__actions__download", rel: "noopener noreferrer", href: url, target: "_blank" },
+                        React__default.createElement(Icon, { type: IconTypes.DOWNLOAD, fillColor: IconColors.ON_BACKGROUND_1, height: "24px", width: "24px" })),
+                    React__default.createElement(DeleteButton, __assign({ className: 'sendbird-fileviewer__header__right__actions__delete' }, props)))),
+                React__default.createElement("div", { className: "sendbird-fileviewer__header__right__actions__close" },
+                    React__default.createElement(Icon, { type: IconTypes.CLOSE, fillColor: IconColors.ON_BACKGROUND_1, height: "24px", width: "24px", onClick: function (e) { return onClose === null || onClose === void 0 ? void 0 : onClose(e); } })))),
+        React__default.createElement("div", { className: "sendbird-fileviewer__content" },
+            isVideo$1(type) && (React__default.createElement("video", { controls: true, className: "sendbird-fileviewer__content__video" },
+                React__default.createElement("source", { src: url, type: type }))),
+            isImage$1(type) && (React__default.createElement("img", { src: url, alt: name, className: props.viewerType === ViewerTypes.MULTI
+                    ? 'sendbird-fileviewer__content__img__multi'
+                    : 'sendbird-fileviewer__content__img' })),
+            !isSupportedFileView(type) && (React__default.createElement("div", { className: "sendbird-fileviewer__content__unsupported" },
+                React__default.createElement(Label, { type: LabelTypography.H_1, color: LabelColors.ONBACKGROUND_1 }, (stringSet === null || stringSet === void 0 ? void 0 : stringSet.UI__FILE_VIEWER__UNSUPPORT) || 'Unsupported message'))),
+            React__default.createElement(Slider, __assign({}, props)))));
+};
+function FileViewer(_a) {
+    var _b, _c, _d;
+    var message = _a.message, _e = _a.statefulFileInfoList, statefulFileInfoList = _e === void 0 ? [] : _e, onClose = _a.onClose, _f = _a.isByMe, isByMe = _f === void 0 ? false : _f, onDelete = _a.onDelete, currentIndex = _a.currentIndex, onClickLeft = _a.onClickLeft, onClickRight = _a.onClickRight;
+    if (isMultipleFilesMessage(message)) {
+        var castedMessage = message;
+        return (React__default.createElement(FileViewerComponent, { profileUrl: castedMessage.sender.profileUrl, nickname: castedMessage.sender.nickname, viewerType: ViewerTypes.MULTI, fileInfoList: statefulFileInfoList.filter(function (fileInfo) {
+                return fileInfo.url; // Caution: This assumes that defined url means file upload has completed.
+            }).map(function (fileInfo) {
+                return {
+                    name: fileInfo.fileName || '',
+                    type: fileInfo.mimeType || '',
+                    url: fileInfo.url,
+                };
+            }), currentIndex: currentIndex || 0, onClickLeft: onClickLeft || noop, onClickRight: onClickRight || noop, onClose: onClose }));
+    }
+    else if (isFileMessage(message)) {
+        var castedMessage = message;
+        return createPortal((React__default.createElement(FileViewerComponent, { profileUrl: (_b = castedMessage.sender) === null || _b === void 0 ? void 0 : _b.profileUrl, nickname: (_c = castedMessage.sender) === null || _c === void 0 ? void 0 : _c.nickname, name: castedMessage.name, type: castedMessage.type, url: castedMessage === null || castedMessage === void 0 ? void 0 : castedMessage.url, isByMe: isByMe, disableDelete: (((_d = castedMessage.threadInfo) === null || _d === void 0 ? void 0 : _d.replyCount) || 0) > 0, onClose: onClose, onDelete: onDelete || noop })), document.getElementById(MODAL_ROOT));
+    }
+    return React__default.createElement(React__default.Fragment, null);
+}
+
+export { FileViewer as F, isVideo as a, FileViewerComponent as b, isImage as i };
+//# sourceMappingURL=bundle-KaSW5xxP.js.map

package/chunks/bundle-KaSW5xxP.js.map

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