@sendbird/uikit-react 3.0.0-beta.4 → 3.0.0-rc.0

package/cjs/ui/EmojiReactions.js

@@ -0,0 +1,127 @@
+'use strict';
+
+var React = require('react');
+var ui_Tooltip = require('./Tooltip.js');
+var ui_TooltipWrapper = require('./TooltipWrapper.js');
+var ui_ReactionBadge = require('./ReactionBadge.js');
+var ui_ReactionButton = require('./ReactionButton.js');
+var ui_ImageRenderer = require('./ImageRenderer.js');
+var ui_Icon = require('./Icon.js');
+var ui_ContextMenu = require('./ContextMenu.js');
+var index = require('../index-40d245a3.js');
+var LocalizationContext = require('../LocalizationContext-5a6a0f67.js');
+require('../_rollupPluginBabelHelpers-d984e855.js');
+require('prop-types');
+require('../index-df05e765.js');
+require('../stringSet-2f3588b5.js');
+require('react-dom');
+require('./SortByRow.js');
+require('../tslib.es6-d9c7aa8b.js');
+require('../index-72479c2a.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+var EmojiReactions = function EmojiReactions(_a) {
+  var _b, _c;
+
+  var className = _a.className,
+      userId = _a.userId,
+      message = _a.message,
+      emojiContainer = _a.emojiContainer,
+      memberNicknamesMap = _a.memberNicknamesMap,
+      _d = _a.spaceFromTrigger,
+      spaceFromTrigger = _d === void 0 ? {} : _d,
+      _e = _a.isByMe,
+      isByMe = _e === void 0 ? false : _e,
+      toggleReaction = _a.toggleReaction;
+  var stringSet = React.useContext(LocalizationContext.LocalizationContext).stringSet;
+  var emojisMap = index.getEmojiMapAll(emojiContainer);
+  var addReactionRef = React.useRef(null);
+  return /*#__PURE__*/React__default["default"].createElement("div", {
+    className: index.getClassName([className, 'sendbird-emoji-reactions', isByMe ? 'outgoing' : 'incoming'])
+  }, ((_b = message === null || message === void 0 ? void 0 : message.reactions) === null || _b === void 0 ? void 0 : _b.length) > 0 && message.reactions.map(function (reaction) {
+    var _a, _b;
+
+    var reactedByMe = index.isReactedBy(userId, reaction);
+    return /*#__PURE__*/React__default["default"].createElement(ui_TooltipWrapper, {
+      className: "sendbird-emoji-reactions__reaction-badge",
+      key: reaction === null || reaction === void 0 ? void 0 : reaction.key,
+      hoverTooltip: ((_a = reaction === null || reaction === void 0 ? void 0 : reaction.userIds) === null || _a === void 0 ? void 0 : _a.length) > 0 && /*#__PURE__*/React__default["default"].createElement(ui_Tooltip, null, index.getEmojiTooltipString(reaction, userId, memberNicknamesMap, stringSet))
+    }, /*#__PURE__*/React__default["default"].createElement(ui_ReactionBadge, {
+      count: reaction.userIds.length,
+      selected: reactedByMe,
+      onClick: function onClick() {
+        return toggleReaction(message, reaction.key, reactedByMe);
+      }
+    }, /*#__PURE__*/React__default["default"].createElement(ui_ImageRenderer, {
+      circle: true,
+      url: ((_b = emojisMap.get(reaction === null || reaction === void 0 ? void 0 : reaction.key)) === null || _b === void 0 ? void 0 : _b.url) || '',
+      width: "20px",
+      height: "20px",
+      defaultComponent: /*#__PURE__*/React__default["default"].createElement(ui_Icon["default"], {
+        width: "20px",
+        height: "20px",
+        type: ui_Icon.IconTypes.QUESTION
+      })
+    })));
+  }), ((_c = message === null || message === void 0 ? void 0 : message.reactions) === null || _c === void 0 ? void 0 : _c.length) < emojisMap.size && /*#__PURE__*/React__default["default"].createElement(ui_ContextMenu["default"], {
+    menuTrigger: function menuTrigger(toggleDropdown) {
+      return /*#__PURE__*/React__default["default"].createElement(ui_ReactionBadge, {
+        className: "sendbird-emoji-reactions__add-reaction-badge",
+        ref: addReactionRef,
+        isAdd: true,
+        onClick: toggleDropdown
+      }, /*#__PURE__*/React__default["default"].createElement(ui_Icon["default"], {
+        type: ui_Icon.IconTypes.EMOJI_MORE,
+        fillColor: ui_Icon.IconColors.ON_BACKGROUND_3,
+        width: "20px",
+        height: "20px"
+      }));
+    },
+    menuItems: function menuItems(closeDropdown) {
+      return /*#__PURE__*/React__default["default"].createElement(ui_ContextMenu.EmojiListItems, {
+        parentRef: addReactionRef,
+        parentContainRef: addReactionRef,
+        closeDropdown: closeDropdown,
+        spacefromTrigger: spaceFromTrigger
+      }, index.getEmojiListAll(emojiContainer).map(function (emoji) {
+        var _a, _b, _c;
+
+        var isReacted = (_c = (_b = (_a = message === null || message === void 0 ? void 0 : message.reactions) === null || _a === void 0 ? void 0 : _a.filter(function (reaction) {
+          return reaction.key === emoji.key;
+        })[0]) === null || _b === void 0 ? void 0 : _b.userIds) === null || _c === void 0 ? void 0 : _c.some(function (reactorId) {
+          return reactorId === userId;
+        });
+        return /*#__PURE__*/React__default["default"].createElement(ui_ReactionButton, {
+          key: emoji.key,
+          width: "36px",
+          height: "36px",
+          selected: isReacted,
+          onClick: function onClick() {
+            closeDropdown();
+            toggleReaction(message, emoji.key, isReacted);
+          }
+        }, /*#__PURE__*/React__default["default"].createElement(ui_ImageRenderer, {
+          url: (emoji === null || emoji === void 0 ? void 0 : emoji.url) || '',
+          width: "28px",
+          height: "28px",
+          placeHolder: function placeHolder(style) {
+            return /*#__PURE__*/React__default["default"].createElement("div", {
+              style: style
+            }, /*#__PURE__*/React__default["default"].createElement(ui_Icon["default"], {
+              type: ui_Icon.IconTypes.QUESTION,
+              fillColor: ui_Icon.IconColors.ON_BACKGROUND_3,
+              width: "28px",
+              height: "28px"
+            }));
+          }
+        }));
+      }));
+    }
+  }));
+};
+
+module.exports = EmojiReactions;
+//# sourceMappingURL=EmojiReactions.js.map

package/cjs/ui/EmojiReactions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EmojiReactions.js","sources":["../../../src/ui/EmojiReactions/index.tsx"],"sourcesContent":["import './index.scss';\nimport React, { ReactElement, useContext, useRef } from 'react';\nimport type { FileMessage, Reaction, UserMessage } from '@sendbird/chat/message';\nimport type { Emoji, EmojiContainer } from '@sendbird/chat';\n\nimport Tooltip from '../Tooltip';\nimport TooltipWrapper from '../TooltipWrapper';\nimport ReactionBadge from '../ReactionBadge';\nimport ReactionButton from '../ReactionButton';\nimport ImageRenderer from '../ImageRenderer';\nimport Icon, { IconTypes, IconColors } from '../Icon';\nimport ContextMenu, { EmojiListItems } from '../ContextMenu';\n\nimport { getClassName, getEmojiListAll, getEmojiMapAll, getEmojiTooltipString, isReactedBy } from '../../utils';\nimport { LocalizationContext } from '../../lib/LocalizationContext';\n\ninterface Props {\n  className?: string | Array<string>;\n  userId: string;\n  message: UserMessage | FileMessage;\n  emojiContainer: EmojiContainer;\n  memberNicknamesMap: Map<string, string>;\n  spaceFromTrigger?: Record<string, unknown>;\n  isByMe?: boolean;\n  toggleReaction?: (message: UserMessage | FileMessage, key: string, byMe: boolean) => void;\n}\n\nconst EmojiReactions = ({\n  className,\n  userId,\n  message,\n  emojiContainer,\n  memberNicknamesMap,\n  spaceFromTrigger = {},\n  isByMe = false,\n  toggleReaction,\n}: Props): ReactElement => {\n  const { stringSet } = useContext(LocalizationContext);\n  const emojisMap = getEmojiMapAll(emojiContainer);\n  const addReactionRef = useRef(null);\n\n  return (\n    <div className={getClassName([\n      className, 'sendbird-emoji-reactions',\n      isByMe ? 'outgoing' : 'incoming',\n    ])}>\n      {(message?.reactions?.length > 0) && (\n        message.reactions.map((reaction: Reaction): ReactElement => {\n          const reactedByMe = isReactedBy(userId, reaction);\n          return (\n            <TooltipWrapper\n              className=\"sendbird-emoji-reactions__reaction-badge\"\n              key={reaction?.key}\n              hoverTooltip={(reaction?.userIds?.length > 0) && (\n                <Tooltip>\n                  {getEmojiTooltipString(reaction, userId, memberNicknamesMap, stringSet)}\n                </Tooltip>\n              )}\n            >\n              <ReactionBadge\n                count={reaction.userIds.length}\n                selected={reactedByMe}\n                onClick={() => toggleReaction(message, reaction.key, reactedByMe)}\n              >\n                <ImageRenderer\n                  circle\n                  url={emojisMap.get(reaction?.key)?.url || ''}\n                  width=\"20px\"\n                  height=\"20px\"\n                  defaultComponent={(\n                    <Icon width=\"20px\" height=\"20px\" type={IconTypes.QUESTION} />\n                  )}\n                />\n              </ReactionBadge>\n            </TooltipWrapper>\n          );\n        })\n      )}\n      {(message?.reactions?.length < emojisMap.size) && (\n        <ContextMenu\n          menuTrigger={(toggleDropdown: () => void): ReactElement => (\n            <ReactionBadge\n              className=\"sendbird-emoji-reactions__add-reaction-badge\"\n              ref={addReactionRef}\n              isAdd\n              onClick={toggleDropdown}\n            >\n              <Icon\n                type={IconTypes.EMOJI_MORE}\n                fillColor={IconColors.ON_BACKGROUND_3}\n                width=\"20px\"\n                height=\"20px\"\n              />\n            </ReactionBadge>\n          )}\n          menuItems={(closeDropdown: () => void): ReactElement => (\n            <EmojiListItems\n              parentRef={addReactionRef}\n              parentContainRef={addReactionRef}\n              closeDropdown={closeDropdown}\n              spacefromTrigger={spaceFromTrigger}\n            >\n              {getEmojiListAll(emojiContainer).map((emoji: Emoji): ReactElement => {\n                const isReacted: boolean = message?.reactions?.\n                  filter((reaction: Reaction): boolean => reaction.key === emoji.key)[0]?.userIds?.\n                  some((reactorId: string): boolean => reactorId === userId);\n                return (\n                  <ReactionButton\n                    key={emoji.key}\n                    width=\"36px\"\n                    height=\"36px\"\n                    selected={isReacted}\n                    onClick={(): void => {\n                      closeDropdown();\n                      toggleReaction(message, emoji.key, isReacted);\n                    }}\n                  >\n                    <ImageRenderer\n                      url={emoji?.url || ''}\n                      width=\"28px\"\n                      height=\"28px\"\n                      placeHolder={(style: Record<string, unknown>): ReactElement => (\n                        <div style={style}>\n                          <Icon\n                            type={IconTypes.QUESTION}\n                            fillColor={IconColors.ON_BACKGROUND_3}\n                            width=\"28px\"\n                            height=\"28px\"\n                          />\n                        </div>\n                      )}\n                    />\n                  </ReactionButton>\n                );\n              })}\n            </EmojiListItems>\n          )}\n        />\n      )}\n    </div>\n  );\n}\n\nexport default EmojiReactions;\n"],"names":["EmojiReactions","_a","className","userId","message","emojiContainer","memberNicknamesMap","_d","spaceFromTrigger","_e","isByMe","toggleReaction","stringSet","useContext","LocalizationContext","emojisMap","getEmojiMapAll","addReactionRef","useRef","React","getClassName","reactions","length","map","reaction","reactedByMe","isReactedBy","TooltipWrapper","key","userIds","Tooltip","getEmojiTooltipString","ReactionBadge","ImageRenderer","get","url","Icon","IconTypes","QUESTION","size","ContextMenu","toggleDropdown","EMOJI_MORE","IconColors","ON_BACKGROUND_3","closeDropdown","EmojiListItems","getEmojiListAll","emoji","isReacted","filter","some","reactorId","ReactionButton","style"],"mappings":"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"}

package/cjs/ui/FileMessageItemBody.js

@@ -0,0 +1,57 @@
+'use strict';
+
+var React = require('react');
+var ui_Label = require('../index-df05e765.js');
+var ui_Icon = require('./Icon.js');
+var ui_TextButton = require('./TextButton.js');
+var index = require('../index-40d245a3.js');
+require('../_rollupPluginBabelHelpers-d984e855.js');
+require('prop-types');
+require('../stringSet-2f3588b5.js');
+require('../color-b30f84a2.js');
+require('../tslib.es6-d9c7aa8b.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+function FileMessageItemBody(_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;
+  return /*#__PURE__*/React__default["default"].createElement("div", {
+    className: index.getClassName([className, 'sendbird-file-message-item-body', isByMe ? 'outgoing' : 'incoming', mouseHover ? 'mouse-hover' : '', ((_b = message === null || message === void 0 ? void 0 : message.reactions) === null || _b === void 0 ? void 0 : _b.length) > 0 ? 'reactions' : ''])
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "sendbird-file-message-item-body__file-icon"
+  }, /*#__PURE__*/React__default["default"].createElement(ui_Icon["default"], {
+    className: 'sendbird-file-message-item-body__file-icon__icon',
+    type: {
+      IMAGE: ui_Icon.IconTypes.PHOTO,
+      VIDEO: ui_Icon.IconTypes.PLAY,
+      AUDIO: ui_Icon.IconTypes.FILE_AUDIO,
+      GIF: ui_Icon.IconTypes.GIF,
+      OTHERS: ui_Icon.IconTypes.FILE_DOCUMENT
+    }[index.getUIKitFileType(message === null || message === void 0 ? void 0 : message.type)],
+    fillColor: ui_Icon.IconColors.PRIMARY,
+    width: "24px",
+    height: "24px"
+  })), /*#__PURE__*/React__default["default"].createElement(ui_TextButton, {
+    className: "sendbird-file-message-item-body__file-name",
+    onClick: function onClick() {
+      window.open(message === null || message === void 0 ? void 0 : message.url);
+    },
+    color: isByMe ? ui_Label.LabelColors.ONCONTENT_1 : ui_Label.LabelColors.ONBACKGROUND_1
+  }, /*#__PURE__*/React__default["default"].createElement(ui_Label.Label, {
+    className: "sendbird-file-message-item-body__file-name__text",
+    type: ui_Label.LabelTypography.BODY_1,
+    color: isByMe ? ui_Label.LabelColors.ONCONTENT_1 : ui_Label.LabelColors.ONBACKGROUND_1
+  }, index.truncateString((message === null || message === void 0 ? void 0 : message.name) || (message === null || message === void 0 ? void 0 : message.url)))));
+}
+
+module.exports = FileMessageItemBody;
+//# sourceMappingURL=FileMessageItemBody.js.map

package/cjs/ui/FileMessageItemBody.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FileMessageItemBody.js","sources":["../../../src/ui/FileMessageItemBody/index.tsx"],"sourcesContent":["import './index.scss';\nimport React, { ReactElement } from 'react';\nimport type { FileMessage } from '@sendbird/chat/message';\n\nimport Label, { LabelTypography, LabelColors } from '../Label';\nimport Icon, { IconTypes, IconColors } from '../Icon';\nimport TextButton from '../TextButton';\nimport { getClassName, getUIKitFileType, truncateString } from '../../utils';\n\ninterface Props {\n  className?: string | Array<string>;\n  message: FileMessage;\n  isByMe?: boolean;\n  mouseHover?: boolean;\n}\n\nexport default function FileMessageItemBody({\n  className,\n  message,\n  isByMe = false,\n  mouseHover = false,\n}: Props): ReactElement {\n\n  return (\n    <div className={getClassName([\n      className,\n      'sendbird-file-message-item-body',\n      isByMe ? 'outgoing' : 'incoming',\n      mouseHover ? 'mouse-hover' : '',\n      message?.reactions?.length > 0 ? 'reactions' : '',\n    ])}>\n      <div className=\"sendbird-file-message-item-body__file-icon\">\n        <Icon\n          className={'sendbird-file-message-item-body__file-icon__icon'}\n          type={{\n            IMAGE: IconTypes.PHOTO,\n            VIDEO: IconTypes.PLAY,\n            AUDIO: IconTypes.FILE_AUDIO,\n            GIF: IconTypes.GIF,\n            OTHERS: IconTypes.FILE_DOCUMENT,\n          }[getUIKitFileType(message?.type)]}\n          fillColor={IconColors.PRIMARY}\n          width=\"24px\"\n          height=\"24px\"\n        />\n      </div>\n      <TextButton\n        className=\"sendbird-file-message-item-body__file-name\"\n        onClick={() => { window.open(message?.url) }}\n        color={isByMe ? LabelColors.ONCONTENT_1 : LabelColors.ONBACKGROUND_1}\n      >\n        <Label\n          className=\"sendbird-file-message-item-body__file-name__text\"\n          type={LabelTypography.BODY_1}\n          color={isByMe ? LabelColors.ONCONTENT_1 : LabelColors.ONBACKGROUND_1}\n        >\n          {truncateString(message?.name || message?.url)}\n        </Label>\n      </TextButton>\n    </div>\n  );\n}\n"],"names":["FileMessageItemBody","_a","className","message","_c","isByMe","_d","mouseHover","React","getClassName","reactions","length","Icon","IMAGE","IconTypes","PHOTO","VIDEO","PLAY","AUDIO","FILE_AUDIO","GIF","OTHERS","FILE_DOCUMENT","getUIKitFileType","type","IconColors","PRIMARY","TextButton","window","open","url","LabelColors","ONCONTENT_1","ONBACKGROUND_1","Label","LabelTypography","BODY_1","truncateString","name"],"mappings":";;;;;;;;;;;;;;;;;SAgBwBA,oBAAoBC;;;MAC1CC,SAAS;MACTC,OAAO;MACPC;MAAAC,MAAM,mBAAG;MACTC;MAAAC,UAAU,mBAAG;AAGb,sBACEC;AAAK,IAAA,SAAS,EAAEC,kBAAY,CAAC,CAC3BP,SAD2B,EAE3B,iCAF2B,EAG3BG,MAAM,GAAG,UAAH,GAAgB,UAHK,EAI3BE,UAAU,GAAG,aAAH,GAAmB,EAJF,EAK3B,CAAA,MAAAJ,OAAO,SAAP,IAAAA,OAAO,WAAP,SAAA,GAAAA,OAAO,CAAEO,SAAT,UAAA,iBAAA,SAAA,MAAoBC,MAApB,IAA6B,CAA7B,GAAiC,WAAjC,GAA+C,EALpB,CAAD;AAA5B,kBAOEH;AAAK,IAAA,SAAS,EAAC;AAAf,kBACEA,wCAACI,kBAAD;AACE,IAAA,SAAS,EAAE,kDADb;AAEE,IAAA,IAAI,EAAE;AACJC,MAAAA,KAAK,EAAEC,iBAAS,CAACC,KADb;AAEJC,MAAAA,KAAK,EAAEF,iBAAS,CAACG,IAFb;AAGJC,MAAAA,KAAK,EAAEJ,iBAAS,CAACK,UAHb;AAIJC,MAAAA,GAAG,EAAEN,iBAAS,CAACM,GAJX;AAKJC,MAAAA,MAAM,EAAEP,iBAAS,CAACQ;AALd,MAMJC,sBAAgB,CAACpB,OAAO,SAAP,IAAAA,OAAO,WAAP,SAAA,GAAAA,OAAO,CAAEqB,IAAV,CANZ,CAFR;AASE,IAAA,SAAS,EAAEC,kBAAU,CAACC,OATxB;AAUE,IAAA,KAAK,EAAC,MAVR;AAWE,IAAA,MAAM,EAAC;AAXT,IADF,CAPF,eAsBElB,wCAACmB,aAAD;AACE,IAAA,SAAS,EAAC,4CADZ;AAEE,IAAA,OAAO,EAAE;AAAQC,MAAAA,MAAM,CAACC,IAAP,CAAY1B,OAAO,SAAP,IAAAA,OAAO,WAAP,SAAA,GAAAA,OAAO,CAAE2B,GAArB;AAA2B,KAF9C;AAGE,IAAA,KAAK,EAAEzB,MAAM,GAAG0B,oBAAW,CAACC,WAAf,GAA6BD,oBAAW,CAACE;AAHxD,kBAKEzB,wCAAC0B,cAAD;AACE,IAAA,SAAS,EAAC,kDADZ;AAEE,IAAA,IAAI,EAAEC,wBAAe,CAACC,MAFxB;AAGE,IAAA,KAAK,EAAE/B,MAAM,GAAG0B,oBAAW,CAACC,WAAf,GAA6BD,oBAAW,CAACE;AAHxD,KAKGI,oBAAc,CAAC,CAAAlC,OAAO,SAAP,IAAAA,OAAO,WAAP,SAAA,GAAAA,OAAO,CAAEmC,IAAT,MAAiBnC,OAAO,SAAP,IAAAA,OAAO,WAAP,SAAA,GAAAA,OAAO,CAAE2B,GAA1B,CAAD,CALjB,CALF,CAtBF,CADF;AAsCD;;;;"}

package/cjs/ui/FileViewer.js

@@ -0,0 +1,174 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+var PropTypes = require('prop-types');
+var reactDom = require('react-dom');
+var ui_Avatar = require('./Avatar.js');
+var ui_Label = require('../index-df05e765.js');
+var ui_Icon = require('./Icon.js');
+var index = require('../index-ce679d41.js');
+var index$1 = require('../index-40d245a3.js');
+require('../tslib.es6-d9c7aa8b.js');
+require('./ImageRenderer.js');
+require('../_rollupPluginBabelHelpers-d984e855.js');
+require('../uuid-099485ae.js');
+require('../stringSet-2f3588b5.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
+
+var FileViewerComponent = function FileViewerComponent(_ref) {
+  var profileUrl = _ref.profileUrl,
+      nickname = _ref.nickname,
+      name = _ref.name,
+      type = _ref.type,
+      url = _ref.url,
+      isByMe = _ref.isByMe,
+      onClose = _ref.onClose,
+      onDelete = _ref.onDelete,
+      disableDelete = _ref.disableDelete;
+  return /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "sendbird-fileviewer"
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "sendbird-fileviewer__header"
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "sendbird-fileviewer__header__left"
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "sendbird-fileviewer__header__left__avatar"
+  }, /*#__PURE__*/React__default["default"].createElement(ui_Avatar["default"], {
+    height: "32px",
+    width: "32px",
+    src: profileUrl
+  })), /*#__PURE__*/React__default["default"].createElement(ui_Label.Label, {
+    className: "sendbird-fileviewer__header__left__filename",
+    type: ui_Label.LabelTypography.H_2,
+    color: ui_Label.LabelColors.ONBACKGROUND_1
+  }, name), /*#__PURE__*/React__default["default"].createElement(ui_Label.Label, {
+    className: "sendbird-fileviewer__header__left__sender-name",
+    type: ui_Label.LabelTypography.BODY_1,
+    color: ui_Label.LabelColors.ONBACKGROUND_2
+  }, nickname)), /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "sendbird-fileviewer__header__right"
+  }, index$1.isSupportedFileView(type) && /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "sendbird-fileviewer__header__right__actions"
+  }, /*#__PURE__*/React__default["default"].createElement("a", {
+    className: "sendbird-fileviewer__header__right__actions__download",
+    rel: "noopener noreferrer",
+    href: url,
+    target: "_blank"
+  }, /*#__PURE__*/React__default["default"].createElement(ui_Icon["default"], {
+    type: ui_Icon.IconTypes.DOWNLOAD,
+    fillColor: ui_Icon.IconColors.ON_BACKGROUND_1,
+    height: "24px",
+    width: "24px"
+  })), onDelete && isByMe && /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "sendbird-fileviewer__header__right__actions__delete"
+  }, /*#__PURE__*/React__default["default"].createElement(ui_Icon["default"], {
+    className: disableDelete ? 'disabled' : '',
+    type: ui_Icon.IconTypes.DELETE,
+    fillColor: disableDelete ? ui_Icon.IconColors.GRAY : ui_Icon.IconColors.ON_BACKGROUND_1,
+    height: "24px",
+    width: "24px",
+    onClick: function onClick() {
+      if (!disableDelete) {
+        onDelete();
+      }
+    }
+  }))), /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "sendbird-fileviewer__header__right__actions__close"
+  }, /*#__PURE__*/React__default["default"].createElement(ui_Icon["default"], {
+    type: ui_Icon.IconTypes.CLOSE,
+    fillColor: ui_Icon.IconColors.ON_BACKGROUND_1,
+    height: "24px",
+    width: "24px",
+    onClick: onClose
+  })))), /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "sendbird-fileviewer__content"
+  }, index$1.isVideo(type) &&
+  /*#__PURE__*/
+  // eslint-disable-next-line jsx-a11y/media-has-caption
+  React__default["default"].createElement("video", {
+    controls: true,
+    className: "sendbird-fileviewer__content__video"
+  }, /*#__PURE__*/React__default["default"].createElement("source", {
+    src: url,
+    type: type
+  })), index$1.isImage(type) && /*#__PURE__*/React__default["default"].createElement("img", {
+    src: url,
+    alt: name,
+    className: "sendbird-fileviewer__content__img"
+  }), !index$1.isSupportedFileView(type) && /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "sendbird-fileviewer__content__unsupported"
+  }, /*#__PURE__*/React__default["default"].createElement(ui_Label.Label, {
+    type: ui_Label.LabelTypography.H_1,
+    color: ui_Label.LabelColors.ONBACKGROUND_1
+  }, "Unsupoprted message"))));
+};
+FileViewerComponent.propTypes = {
+  profileUrl: PropTypes__default["default"].string.isRequired,
+  nickname: PropTypes__default["default"].string.isRequired,
+  type: PropTypes__default["default"].string.isRequired,
+  url: PropTypes__default["default"].string.isRequired,
+  name: PropTypes__default["default"].string.isRequired,
+  onClose: PropTypes__default["default"].func.isRequired,
+  onDelete: PropTypes__default["default"].func.isRequired,
+  isByMe: PropTypes__default["default"].bool,
+  disableDelete: PropTypes__default["default"].bool
+};
+FileViewerComponent.defaultProps = {
+  isByMe: true,
+  disableDelete: false
+};
+function FileViewer(props) {
+  var message = props.message,
+      isByMe = props.isByMe,
+      onClose = props.onClose,
+      onDelete = props.onDelete;
+  var sender = message.sender,
+      type = message.type,
+      url = message.url,
+      _message$name = message.name,
+      name = _message$name === void 0 ? '' : _message$name,
+      _message$threadInfo = message.threadInfo,
+      threadInfo = _message$threadInfo === void 0 ? {} : _message$threadInfo;
+  var disableDelete = (threadInfo === null || threadInfo === void 0 ? void 0 : threadInfo.replyCount) > 0;
+  var profileUrl = sender.profileUrl,
+      _sender$nickname = sender.nickname,
+      nickname = _sender$nickname === void 0 ? '' : _sender$nickname;
+  return /*#__PURE__*/reactDom.createPortal( /*#__PURE__*/React__default["default"].createElement(FileViewerComponent, {
+    profileUrl: profileUrl,
+    nickname: nickname,
+    type: type,
+    url: url,
+    name: name,
+    onClose: onClose,
+    onDelete: onDelete,
+    isByMe: isByMe,
+    disableDelete: disableDelete
+  }), document.getElementById(index.MODAL_ROOT));
+}
+FileViewer.propTypes = {
+  message: PropTypes__default["default"].shape({
+    sender: PropTypes__default["default"].shape({
+      profileUrl: PropTypes__default["default"].string,
+      nickname: PropTypes__default["default"].string
+    }),
+    type: PropTypes__default["default"].string,
+    url: PropTypes__default["default"].string,
+    name: PropTypes__default["default"].string
+  }).isRequired,
+  isByMe: PropTypes__default["default"].bool,
+  onClose: PropTypes__default["default"].func.isRequired,
+  onDelete: PropTypes__default["default"].func.isRequired
+};
+FileViewer.defaultProps = {
+  isByMe: true
+};
+
+exports.FileViewerComponent = FileViewerComponent;
+exports["default"] = FileViewer;
+//# sourceMappingURL=FileViewer.js.map

package/cjs/ui/FileViewer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FileViewer.js","sources":["../../../src/ui/FileViewer/index.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { createPortal } from 'react-dom';\n\nimport './index.scss';\nimport Avatar from '../Avatar/index';\nimport Label, { LabelTypography, LabelColors } from '../Label';\nimport Icon, { IconColors, IconTypes } from '../Icon';\nimport { MODAL_ROOT } from '../../hooks/useModal/ModalRoot';\n\nimport { isImage, isVideo, isSupportedFileView } from '../../utils';\n\nexport const FileViewerComponent = ({\n  // sender\n  profileUrl,\n  nickname,\n  // file\n  name,\n  type,\n  url,\n  // others\n  isByMe,\n  onClose,\n  onDelete,\n  disableDelete,\n}) => (\n  <div className=\"sendbird-fileviewer\">\n    <div className=\"sendbird-fileviewer__header\">\n      <div className=\"sendbird-fileviewer__header__left\">\n        <div className=\"sendbird-fileviewer__header__left__avatar\">\n          <Avatar height=\"32px\" width=\"32px\" src={profileUrl} />\n        </div>\n        <Label\n          className=\"sendbird-fileviewer__header__left__filename\"\n          type={LabelTypography.H_2}\n          color={LabelColors.ONBACKGROUND_1}\n        >\n          {name}\n        </Label>\n        <Label\n          className=\"sendbird-fileviewer__header__left__sender-name\"\n          type={LabelTypography.BODY_1}\n          color={LabelColors.ONBACKGROUND_2}\n        >\n          {nickname}\n        </Label>\n      </div>\n      <div className=\"sendbird-fileviewer__header__right\">\n        {\n          isSupportedFileView(type) && (\n            <div className=\"sendbird-fileviewer__header__right__actions\">\n              <a\n                className=\"sendbird-fileviewer__header__right__actions__download\"\n                rel=\"noopener noreferrer\"\n                href={url}\n                target=\"_blank\"\n              >\n                <Icon\n                  type={IconTypes.DOWNLOAD}\n                  fillColor={IconColors.ON_BACKGROUND_1}\n                  height=\"24px\"\n                  width=\"24px\"\n                />\n              </a>\n              {\n                onDelete && isByMe && (\n                  <div className=\"sendbird-fileviewer__header__right__actions__delete\">\n                    <Icon\n                      className={disableDelete ? 'disabled' : ''}\n                      type={IconTypes.DELETE}\n                      fillColor={disableDelete ? IconColors.GRAY : IconColors.ON_BACKGROUND_1}\n                      height=\"24px\"\n                      width=\"24px\"\n                      onClick={() => { if (!disableDelete) { onDelete(); } }}\n                    />\n                  </div>\n                )\n              }\n            </div>\n          )\n        }\n        <div className=\"sendbird-fileviewer__header__right__actions__close\">\n          <Icon\n            type={IconTypes.CLOSE}\n            fillColor={IconColors.ON_BACKGROUND_1}\n            height=\"24px\"\n            width=\"24px\"\n            onClick={onClose}\n          />\n        </div>\n      </div>\n    </div>\n    <div className=\"sendbird-fileviewer__content\">\n      {isVideo(type) && (\n        // eslint-disable-next-line jsx-a11y/media-has-caption\n        <video controls className=\"sendbird-fileviewer__content__video\">\n          <source src={url} type={type} />\n        </video>\n      )}\n      {\n        isImage(type) && (\n          <img\n            src={url}\n            alt={name}\n            className=\"sendbird-fileviewer__content__img\"\n          />\n        )\n      }\n      {\n        !isSupportedFileView(type) && (\n          <div className=\"sendbird-fileviewer__content__unsupported\">\n            <Label type={LabelTypography.H_1} color={LabelColors.ONBACKGROUND_1}>\n              Unsupoprted message\n            </Label>\n          </div>\n        )\n      }\n    </div>\n  </div>\n);\n\nFileViewerComponent.propTypes = {\n  profileUrl: PropTypes.string.isRequired,\n  nickname: PropTypes.string.isRequired,\n  type: PropTypes.string.isRequired,\n  url: PropTypes.string.isRequired,\n  name: PropTypes.string.isRequired,\n  onClose: PropTypes.func.isRequired,\n  onDelete: PropTypes.func.isRequired,\n  isByMe: PropTypes.bool,\n  disableDelete: PropTypes.bool,\n};\n\nFileViewerComponent.defaultProps = {\n  isByMe: true,\n  disableDelete: false,\n};\n\nexport default function FileViewer(props) {\n  const {\n    message,\n    isByMe,\n    onClose,\n    onDelete,\n  } = props;\n  const {\n    sender,\n    type,\n    url,\n    name = '',\n    threadInfo = {},\n  } = message;\n  const disableDelete = threadInfo?.replyCount > 0;\n  const { profileUrl, nickname = '' } = sender;\n  return createPortal(\n    (\n      <FileViewerComponent\n        profileUrl={profileUrl}\n        nickname={nickname}\n        type={type}\n        url={url}\n        name={name}\n        onClose={onClose}\n        onDelete={onDelete}\n        isByMe={isByMe}\n        disableDelete={disableDelete}\n      />\n    ),\n    document.getElementById(MODAL_ROOT),\n  );\n}\n\nFileViewer.propTypes = {\n  message: PropTypes.shape({\n    sender: PropTypes.shape({\n      profileUrl: PropTypes.string,\n      nickname: PropTypes.string,\n    }),\n    type: PropTypes.string,\n    url: PropTypes.string,\n    name: PropTypes.string,\n  }).isRequired,\n  isByMe: PropTypes.bool,\n  onClose: PropTypes.func.isRequired,\n  onDelete: PropTypes.func.isRequired,\n};\n\nFileViewer.defaultProps = {\n  isByMe: true,\n};\n"],"names":["FileViewerComponent","profileUrl","nickname","name","type","url","isByMe","onClose","onDelete","disableDelete","React","Avatar","Label","LabelTypography","H_2","LabelColors","ONBACKGROUND_1","BODY_1","ONBACKGROUND_2","isSupportedFileView","Icon","IconTypes","DOWNLOAD","IconColors","ON_BACKGROUND_1","DELETE","GRAY","CLOSE","isVideo","isImage","H_1","propTypes","PropTypes","string","isRequired","func","bool","defaultProps","FileViewer","props","message","sender","threadInfo","replyCount","createPortal","document","getElementById","MODAL_ROOT","shape"],"mappings":"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"}