@sendbird/uikit-react 3.4.6 → 3.4.7-0

package/ui/ThumbnailMessageItemBody.js

@@ -1,33 +1,30 @@
 import React__default, { useState } from 'react';
 import Icon, { IconTypes, IconColors } from './Icon.js';
 import ImageRenderer from './ImageRenderer.js';
-import { j as getClassName, u as isSentMessage, q as isVideoMessage, p as isGifMessage } from '../index-e378ca4e.js';
+import { j as getClassName, u as isSentMessage, q as isVideoMessage, p as isGifMessage } from '../index-dbe0e004.js';
 import 'prop-types';
-import '../tslib.es6-d6e50ec3.js';
+import '../_rollupPluginBabelHelpers-b2d9bfc5.js';
 import '../utils/message/getOutgoingMessageState.js';
 
-function ThumbnailMessageItemBody(_a) {
-  var _b, _c;
-  var className = _a.className,
-    message = _a.message,
-    _d = _a.isByMe,
-    isByMe = _d === void 0 ? false : _d,
-    _e = _a.mouseHover,
-    mouseHover = _e === void 0 ? false : _e,
-    _f = _a.isReactionEnabled,
-    isReactionEnabled = _f === void 0 ? false : _f,
-    showFileViewer = _a.showFileViewer,
-    _g = _a.style,
-    style = _g === void 0 ? {} : _g;
-  var _h = message.thumbnails,
-    thumbnails = _h === void 0 ? [] : _h;
-  var thumbnailUrl = thumbnails.length > 0 ? (_b = thumbnails[0]) === null || _b === void 0 ? void 0 : _b.url : '';
-  var _j = useState(false),
-    imageRendered = _j[0],
-    setImageRendered = _j[1];
+function ThumbnailMessageItemBody(_ref) {
+  var _thumbnails$, _message$reactions;
+  let {
+    className,
+    message,
+    isByMe = false,
+    mouseHover = false,
+    isReactionEnabled = false,
+    showFileViewer,
+    style = {}
+  } = _ref;
+  const {
+    thumbnails = []
+  } = message;
+  const thumbnailUrl = thumbnails.length > 0 ? (_thumbnails$ = thumbnails[0]) === null || _thumbnails$ === void 0 ? void 0 : _thumbnails$.url : '';
+  const [imageRendered, setImageRendered] = useState(false);
   return /*#__PURE__*/React__default.createElement("div", {
-    className: getClassName([className, 'sendbird-thumbnail-message-item-body', isByMe ? 'outgoing' : 'incoming', mouseHover ? 'mouse-hover' : '', isReactionEnabled && ((_c = message === null || message === void 0 ? void 0 : message.reactions) === null || _c === void 0 ? void 0 : _c.length) > 0 ? 'reactions' : '']),
-    onClick: function () {
+    className: getClassName([className, 'sendbird-thumbnail-message-item-body', isByMe ? 'outgoing' : 'incoming', mouseHover ? 'mouse-hover' : '', isReactionEnabled && (message === null || message === void 0 ? void 0 : (_message$reactions = message.reactions) === null || _message$reactions === void 0 ? void 0 : _message$reactions.length) > 0 ? 'reactions' : '']),
+    onClick: () => {
       if (isSentMessage(message)) {
         showFileViewer(true);
       }
@@ -38,22 +35,20 @@ function ThumbnailMessageItemBody(_a) {
     alt: message === null || message === void 0 ? void 0 : message.type,
     width: (style === null || style === void 0 ? void 0 : style.width) || '360px',
     height: (style === null || style === void 0 ? void 0 : style.height) || '270px',
-    onLoad: function () {
+    onLoad: () => {
       setImageRendered(true);
     },
-    placeHolder: function (style_) {
-      return /*#__PURE__*/React__default.createElement("div", {
-        className: "sendbird-thumbnail-message-item-body__placeholder",
-        style: style_
-      }, /*#__PURE__*/React__default.createElement("div", {
-        className: "sendbird-thumbnail-message-item-body__placeholder__icon"
-      }, /*#__PURE__*/React__default.createElement(Icon, {
-        type: isVideoMessage(message) ? IconTypes.PLAY : IconTypes.PHOTO,
-        fillColor: IconColors.ON_BACKGROUND_2,
-        width: "34px",
-        height: "34px"
-      })));
-    }
+    placeHolder: style_ => /*#__PURE__*/React__default.createElement("div", {
+      className: "sendbird-thumbnail-message-item-body__placeholder",
+      style: style_
+    }, /*#__PURE__*/React__default.createElement("div", {
+      className: "sendbird-thumbnail-message-item-body__placeholder__icon"
+    }, /*#__PURE__*/React__default.createElement(Icon, {
+      type: isVideoMessage(message) ? IconTypes.PLAY : IconTypes.PHOTO,
+      fillColor: IconColors.ON_BACKGROUND_2,
+      width: "34px",
+      height: "34px"
+    })))
   }), isVideoMessage(message) && !thumbnailUrl && !imageRendered && /*#__PURE__*/React__default.createElement("video", {
     className: "sendbird-thumbnail-message-item-body__video"
   }, /*#__PURE__*/React__default.createElement("source", {

package/ui/ThumbnailMessageItemBody.js.map

@@ -1 +1 @@
-{"version":3,"file":"ThumbnailMessageItemBody.js","sources":["../../src/ui/ThumbnailMessageItemBody/index.tsx"],"sourcesContent":["import './index.scss';\nimport React, { ReactElement, useState } from 'react';\nimport type { FileMessage } from '@sendbird/chat/message';\n\nimport Icon, { IconTypes, IconColors } from '../Icon';\nimport ImageRenderer from '../ImageRenderer';\nimport { getClassName, isGifMessage, isSentMessage, isVideoMessage } from '../../utils';\n\ninterface Props {\n  className?: string | Array<string>;\n  message: FileMessage;\n  isByMe?: boolean;\n  mouseHover?: boolean;\n  isReactionEnabled?: boolean;\n  showFileViewer?: (bool: boolean) => void;\n  style?: Record<string, any>;\n}\n\nexport default function ThumbnailMessageItemBody({\n  className,\n  message,\n  isByMe = false,\n  mouseHover = false,\n  isReactionEnabled = false,\n  showFileViewer,\n  style = {},\n}: Props): ReactElement {\n  const { thumbnails = [] } = message;\n  const thumbnailUrl: string = thumbnails.length > 0 ? thumbnails[0]?.url : '';\n  const [imageRendered, setImageRendered] = useState(false);\n  return (\n    <div\n      className={getClassName([\n        className,\n        'sendbird-thumbnail-message-item-body',\n        isByMe ? 'outgoing' : 'incoming',\n        mouseHover ? 'mouse-hover' : '',\n        (isReactionEnabled && message?.reactions?.length > 0) ? 'reactions' : '',\n      ])}\n      onClick={() => {\n        if (isSentMessage(message)) {\n          showFileViewer(true);\n        }\n      }}\n    >\n      <ImageRenderer\n        className=\"sendbird-thumbnail-message-item-body__thumbnail\"\n        url={thumbnailUrl || message?.url}\n        alt={message?.type}\n        width={style?.width || '360px'}\n        height={style?.height || '270px'}\n        onLoad={() => { setImageRendered(true) }}\n        placeHolder={(style_: Record<string, any>) => (\n          <div\n            className=\"sendbird-thumbnail-message-item-body__placeholder\"\n            style={style_}\n          >\n            <div className=\"sendbird-thumbnail-message-item-body__placeholder__icon\">\n              <Icon\n                type={isVideoMessage(message) ? IconTypes.PLAY : IconTypes.PHOTO}\n                fillColor={IconColors.ON_BACKGROUND_2}\n                width=\"34px\"\n                height=\"34px\"\n              />\n            </div>\n          </div>\n        )}\n      />\n      {\n        (isVideoMessage(message) && !thumbnailUrl) && !imageRendered && (\n          <video className=\"sendbird-thumbnail-message-item-body__video\">\n            <source src={message?.url} type={message?.type} />\n          </video>\n        )\n      }\n      <div className=\"sendbird-thumbnail-message-item-body__image-cover\" />\n      {\n        (isVideoMessage(message) || isGifMessage(message)) && (\n          <div className=\"sendbird-thumbnail-message-item-body__icon-wrapper\">\n            <div className=\"sendbird-thumbnail-message-item-body__icon-wrapper__icon\">\n              <Icon\n                type={isVideoMessage(message) ? IconTypes.PLAY : IconTypes.GIF}\n                fillColor={IconColors.GRAY}\n                width=\"34px\"\n                height=\"34px\"\n              />\n            </div>\n          </div>\n        )\n      }\n    </div>\n  );\n}\n"],"names":["ThumbnailMessageItemBody","_a","className","message","_d","isByMe","_e","mouseHover","_f","isReactionEnabled","showFileViewer","_g","style","_h","thumbnails","thumbnailUrl","length","_b","url","_j","useState","imageRendered","setImageRendered","React","createElement","getClassName","_c","reactions","onClick","isSentMessage","ImageRenderer","alt","type","width","height","onLoad","placeHolder","style_","Icon","isVideoMessage","IconTypes","PLAY","PHOTO","fillColor","IconColors","ON_BACKGROUND_2","src","isGifMessage","GIF","GRAY"],"mappings":"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"}
+{"version":3,"file":"ThumbnailMessageItemBody.js","sources":["../../src/ui/ThumbnailMessageItemBody/index.tsx"],"sourcesContent":["import './index.scss';\nimport React, { ReactElement, useState } from 'react';\nimport type { FileMessage } from '@sendbird/chat/message';\n\nimport Icon, { IconTypes, IconColors } from '../Icon';\nimport ImageRenderer from '../ImageRenderer';\nimport { getClassName, isGifMessage, isSentMessage, isVideoMessage } from '../../utils';\n\ninterface Props {\n  className?: string | Array<string>;\n  message: FileMessage;\n  isByMe?: boolean;\n  mouseHover?: boolean;\n  isReactionEnabled?: boolean;\n  showFileViewer?: (bool: boolean) => void;\n  style?: Record<string, any>;\n}\n\nexport default function ThumbnailMessageItemBody({\n  className,\n  message,\n  isByMe = false,\n  mouseHover = false,\n  isReactionEnabled = false,\n  showFileViewer,\n  style = {},\n}: Props): ReactElement {\n  const { thumbnails = [] } = message;\n  const thumbnailUrl: string = thumbnails.length > 0 ? thumbnails[0]?.url : '';\n  const [imageRendered, setImageRendered] = useState(false);\n  return (\n    <div\n      className={getClassName([\n        className,\n        'sendbird-thumbnail-message-item-body',\n        isByMe ? 'outgoing' : 'incoming',\n        mouseHover ? 'mouse-hover' : '',\n        (isReactionEnabled && message?.reactions?.length > 0) ? 'reactions' : '',\n      ])}\n      onClick={() => {\n        if (isSentMessage(message)) {\n          showFileViewer(true);\n        }\n      }}\n    >\n      <ImageRenderer\n        className=\"sendbird-thumbnail-message-item-body__thumbnail\"\n        url={thumbnailUrl || message?.url}\n        alt={message?.type}\n        width={style?.width || '360px'}\n        height={style?.height || '270px'}\n        onLoad={() => { setImageRendered(true) }}\n        placeHolder={(style_: Record<string, any>) => (\n          <div\n            className=\"sendbird-thumbnail-message-item-body__placeholder\"\n            style={style_}\n          >\n            <div className=\"sendbird-thumbnail-message-item-body__placeholder__icon\">\n              <Icon\n                type={isVideoMessage(message) ? IconTypes.PLAY : IconTypes.PHOTO}\n                fillColor={IconColors.ON_BACKGROUND_2}\n                width=\"34px\"\n                height=\"34px\"\n              />\n            </div>\n          </div>\n        )}\n      />\n      {\n        (isVideoMessage(message) && !thumbnailUrl) && !imageRendered && (\n          <video className=\"sendbird-thumbnail-message-item-body__video\">\n            <source src={message?.url} type={message?.type} />\n          </video>\n        )\n      }\n      <div className=\"sendbird-thumbnail-message-item-body__image-cover\" />\n      {\n        (isVideoMessage(message) || isGifMessage(message)) && (\n          <div className=\"sendbird-thumbnail-message-item-body__icon-wrapper\">\n            <div className=\"sendbird-thumbnail-message-item-body__icon-wrapper__icon\">\n              <Icon\n                type={isVideoMessage(message) ? IconTypes.PLAY : IconTypes.GIF}\n                fillColor={IconColors.GRAY}\n                width=\"34px\"\n                height=\"34px\"\n              />\n            </div>\n          </div>\n        )\n      }\n    </div>\n  );\n}\n"],"names":["ThumbnailMessageItemBody","_ref","_thumbnails$","_message$reactions","className","message","isByMe","mouseHover","isReactionEnabled","showFileViewer","style","thumbnails","thumbnailUrl","length","url","imageRendered","setImageRendered","useState","React","createElement","getClassName","reactions","onClick","isSentMessage","ImageRenderer","alt","type","width","height","onLoad","placeHolder","style_","Icon","isVideoMessage","IconTypes","PLAY","PHOTO","fillColor","IconColors","ON_BACKGROUND_2","src","isGifMessage","GIF","GRAY"],"mappings":"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"}

package/ui/Toggle.js

@@ -0,0 +1,191 @@
+import React__default, { useState, useCallback } from 'react';
+import { _ as _objectSpread2 } from '../_rollupPluginBabelHelpers-b2d9bfc5.js';
+import useSendbirdStateContext from '../useSendbirdStateContext.js';
+import '../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
+ */
+const noop = () => {/* noop */};
+const TOGGLE_DEFAULT_VALUE = {
+  checked: null,
+  defaultChecked: false,
+  disabled: false,
+  onChange: noop,
+  onFocus: noop,
+  onBlur: noop
+};
+const ToggleContext = /*#__PURE__*/React__default.createContext(TOGGLE_DEFAULT_VALUE);
+function useToggleContext() {
+  const context = React__default.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(_ref) {
+  let {
+    checked = TOGGLE_DEFAULT_VALUE.checked,
+    // null
+    defaultChecked = TOGGLE_DEFAULT_VALUE.defaultChecked,
+    disabled = TOGGLE_DEFAULT_VALUE.disabled,
+    onChange = TOGGLE_DEFAULT_VALUE.onChange,
+    onFocus = TOGGLE_DEFAULT_VALUE.onFocus,
+    onBlur = TOGGLE_DEFAULT_VALUE.onBlur,
+    children
+  } = _ref;
+  const [isChecked, setChecked] = useState(defaultChecked || false);
+  const handleChange = useCallback(e => {
+    if (disabled) {
+      return;
+    }
+    if (checked === null) {
+      setChecked(e.currentTarget.checked);
+    }
+    onChange(e);
+  }, [onChange, checked]);
+  return /*#__PURE__*/React__default.createElement(ToggleContext.Provider, {
+    value: {
+      checked: checked !== null ? checked : isChecked,
+      disabled,
+      onChange: handleChange,
+      onFocus: e => {
+        if (!disabled) {
+          onFocus(e);
+        }
+      },
+      onBlur: e => {
+        if (!disabled) {
+          onBlur(e);
+        }
+      }
+    }
+  }, children);
+}
+
+function filterNumber(input) {
+  if (typeof input !== 'string' && typeof input !== 'number') {
+    try {
+      const {
+        config
+      } = useSendbirdStateContext();
+      const {
+        logger
+      } = config;
+      logger.warning('@sendbird/uikit-react/ui/Toggle: TypeError - expected string or number.', input);
+    } catch (_) {/* noop */}
+    return [];
+  }
+  if (typeof input === 'number') {
+    return [input];
+  }
+  const regex = /(-?\d+)(\.\d+)?/g;
+  const numbers = input.match(regex) || [];
+  return numbers.map(parseFloat);
+}
+
+function ToggleUI(props) {
+  var _filterNumber;
+  const {
+    reversed = false,
+    width = '40px',
+    animationDuration = '0.5s',
+    style = {},
+    name = '',
+    id = '',
+    ariaLabel = '',
+    ariaLabelledby = ''
+  } = props;
+  const {
+    checked,
+    disabled,
+    onChange,
+    onFocus,
+    onBlur
+  } = useToggleContext();
+
+  // animation should not be activated in the initialization step
+  const [animatedClassName, setAnimatedClassName] = useState('');
+  const toggleWidth = (_filterNumber = filterNumber(width)) === null || _filterNumber === void 0 ? void 0 : _filterNumber[0];
+  const toggleHeight = toggleWidth / 2;
+  // The size of dot should be 60% of toggle height
+  const dotSize = toggleHeight * 0.6;
+  return /*#__PURE__*/React__default.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: _objectSpread2({
+      width: `${toggleWidth}px`,
+      height: `${toggleHeight}px`,
+      borderRadius: `${dotSize}px`
+    }, style)
+  }, /*#__PURE__*/React__default.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: `${dotSize}px`,
+      height: `${dotSize}px`,
+      animationDuration
+    }
+  }), /*#__PURE__*/React__default.createElement("input", {
+    type: "checkbox",
+    "aria-label": ariaLabel,
+    "aria-labelledby": ariaLabelledby,
+    name: name,
+    id: id,
+    checked: checked,
+    disabled: disabled,
+    onChange: 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) {
+  const {
+    // ToggleProvider
+    checked,
+    defaultChecked,
+    disabled,
+    onChange,
+    onFocus,
+    onBlur,
+    // ToggleUI
+    className,
+    reversed,
+    width,
+    // height will be half of width
+    animationDuration,
+    style,
+    name,
+    id,
+    ariaLabel,
+    ariaLabelledby
+  } = props;
+  return /*#__PURE__*/React__default.createElement("div", {
+    className: `sendbird-ui-toggle ${className}`
+  }, /*#__PURE__*/React__default.createElement(ToggleContainer, {
+    checked: checked,
+    defaultChecked: defaultChecked,
+    disabled: disabled,
+    onChange: onChange,
+    onFocus: onFocus,
+    onBlur: onBlur
+  }, /*#__PURE__*/React__default.createElement(ToggleUI, {
+    reversed: reversed,
+    width: width,
+    animationDuration: animationDuration,
+    style: style,
+    name: name,
+    id: id,
+    ariaLabel: ariaLabel,
+    ariaLabelledby: ariaLabelledby
+  })));
+}
+
+export { Toggle, ToggleContainer, ToggleUI, useToggleContext };
+//# sourceMappingURL=Toggle.js.map

package/ui/Toggle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toggle.js","sources":["../../src/ui/Toggle/ToggleContext.ts","../../src/ui/Toggle/ToggleContainer.tsx","../../src/ui/Toggle/utils.ts","../../src/ui/Toggle/ToggleUI.tsx","../../src/ui/Toggle/index.tsx"],"sourcesContent":["import React, { ChangeEventHandler } from 'react';\n\n/**\n * The default value of `checked` should be null\n * to support both case of controlled and uncontrolled component\n * ref: https://github.com/aaronshaf/react-toggle#props\n */\nconst noop = (): void => { /* noop */ };\nexport const TOGGLE_DEFAULT_VALUE = {\n  checked: null,\n  defaultChecked: false,\n  disabled: false,\n  onChange: noop,\n  onFocus: noop,\n  onBlur: noop,\n};\n\nexport interface ToggleContextInterface {\n  checked?: boolean | null;\n  defaultChecked?: boolean;\n  disabled?: boolean;\n  onChange?: ChangeEventHandler<HTMLInputElement>;\n  onFocus?: ChangeEventHandler<HTMLInputElement>;\n  onBlur?: ChangeEventHandler<HTMLInputElement>;\n}\n\nexport const ToggleContext = React.createContext<ToggleContextInterface>(TOGGLE_DEFAULT_VALUE);\n\nexport function useToggleContext(): ToggleContextInterface {\n  const context = React.useContext(ToggleContext);\n  if (context === undefined) {\n    throw new Error('@sendbird/uikit-react/ui/Toggle: useToggleContext must be used within a ToggleContainer.');\n  }\n  return context;\n}\n","import React, { ChangeEvent, useCallback, useState } from 'react';\n\nimport {\n  ToggleContext,\n  ToggleContextInterface,\n  TOGGLE_DEFAULT_VALUE as Dvalue,\n} from './ToggleContext';\n\nexport interface ToggleContainerProps extends ToggleContextInterface {\n  children?: React.ReactElement;\n}\n\n// Props Explanation https://github.com/aaronshaf/react-toggle#props\nexport function ToggleContainer({\n  checked = Dvalue.checked, // null\n  defaultChecked = Dvalue.defaultChecked,\n  disabled = Dvalue.disabled,\n  onChange = Dvalue.onChange,\n  onFocus = Dvalue.onFocus,\n  onBlur = Dvalue.onBlur,\n  children,\n}: ToggleContainerProps): React.ReactElement {\n  const [isChecked, setChecked] = useState(defaultChecked || false);\n  const handleChange = useCallback((e: ChangeEvent<HTMLInputElement>) => {\n    if (disabled) {\n      return;\n    }\n    if (checked === null) {\n      setChecked(e.currentTarget.checked);\n    }\n    onChange(e);\n  }, [onChange, checked]);\n\n  return (\n    <ToggleContext.Provider value={{\n      checked: checked !== null ? checked : isChecked,\n      disabled,\n      onChange: handleChange,\n      onFocus: (e) => {\n        if (!disabled) {\n          onFocus(e);\n        }\n      },\n      onBlur: (e) => {\n        if (!disabled) {\n          onBlur(e);\n        }\n      },\n    }}>\n      {children}\n    </ToggleContext.Provider>\n  );\n}\n","import useSendbirdStateContext from '../../hooks/useSendbirdStateContext';\n\nexport function filterNumber(input: string | number): Array<number> {\n  if (typeof input !== 'string' && typeof input !== 'number') {\n    try {\n      const { config } = useSendbirdStateContext();\n      const { logger } = config;\n      logger.warning('@sendbird/uikit-react/ui/Toggle: TypeError - expected string or number.', input);\n    } catch (_) { /* noop */ }\n    return [];\n  }\n  if (typeof input === 'number') {\n    return [input];\n  }\n  const regex = /(-?\\d+)(\\.\\d+)?/g;\n  const numbers = input.match(regex) || [];\n  return numbers.map(parseFloat);\n}\n","import React, { useState } from 'react';\nimport { useToggleContext } from './ToggleContext';\nimport { filterNumber } from './utils';\n\nexport interface ToggleUIProps {\n  reversed?: boolean;\n  width?: string;\n  animationDuration?: string;\n  style?: Record<string, string>;\n  name?: string;\n  id?: string;\n  ariaLabel?: string;\n  ariaLabelledby?: string;\n}\n\nexport function ToggleUI(props: ToggleUIProps): React.ReactElement {\n  const {\n    reversed = false,\n    width = '40px',\n    animationDuration = '0.5s',\n    style = {},\n    name = '',\n    id = '',\n    ariaLabel = '',\n    ariaLabelledby = '',\n  } = props;\n  const {\n    checked,\n    disabled,\n    onChange,\n    onFocus,\n    onBlur,\n  } = useToggleContext();\n\n  // animation should not be activated in the initialization step\n  const [animatedClassName, setAnimatedClassName] = useState('');\n\n  const toggleWidth = filterNumber(width)?.[0];\n  const toggleHeight = toggleWidth / 2;\n  // The size of dot should be 60% of toggle height\n  const dotSize = toggleHeight * 0.6;\n\n  return (\n    <label\n      className={[\n        'sendbird-input-toggle-button',\n        animatedClassName,\n        checked ? 'sendbird-input-toggle-button--checked' : 'sendbird-input-toggle-button--unchecked',\n        disabled ? 'sendbird-input-toggle-button--disabled' : [],\n        reversed ? 'sendbird-input-toggle-button--reversed' : [],\n      ].flat().join(' ')}\n      style={{\n        width: `${toggleWidth}px`,\n        height: `${toggleHeight}px`,\n        borderRadius: `${dotSize}px`,\n        ...style,\n      }}\n    >\n      <div\n        className={[\n          'sendbird-input-toggle-button__inner-dot',\n          checked\n            ? 'sendbird-input-toggle-button__inner-dot--activate'\n            : 'sendbird-input-toggle-button__inner-dot--inactivate',\n        ].join(' ')}\n        style={{\n          width: `${dotSize}px`,\n          height: `${dotSize}px`,\n          animationDuration,\n        }}\n      />\n      <input\n        type=\"checkbox\"\n        aria-label={ariaLabel}\n        aria-labelledby={ariaLabelledby}\n        name={name}\n        id={id}\n        checked={checked}\n        disabled={disabled}\n        onChange={(e) => {\n          onChange(e);\n          setAnimatedClassName(e.currentTarget.checked ? 'sendbird-input-toggle-button--turned-on' : 'sendbird-input-toggle-button--turned-off');\n        }}\n        onFocus={onFocus}\n        onBlur={onBlur}\n      />\n    </label>\n  );\n}\n","import React from 'react';\nimport './index.scss';\n\nimport { ToggleContainer, ToggleContainerProps } from './ToggleContainer';\nimport { useToggleContext } from './ToggleContext';\nimport { ToggleUI, ToggleUIProps } from './ToggleUI';\n\nexport interface ToggleProps extends ToggleContainerProps, ToggleUIProps {\n  className?: string;\n}\nfunction Toggle(props: ToggleProps): React.ReactElement {\n  const {\n    // ToggleProvider\n    checked,\n    defaultChecked,\n    disabled,\n    onChange,\n    onFocus,\n    onBlur,\n    // ToggleUI\n    className,\n    reversed,\n    width,\n    // height will be half of width\n    animationDuration,\n    style,\n    name,\n    id,\n    ariaLabel,\n    ariaLabelledby,\n  } = props;\n  return (\n    <div className={`sendbird-ui-toggle ${className}`}>\n      <ToggleContainer\n        checked={checked}\n        defaultChecked={defaultChecked}\n        disabled={disabled}\n        onChange={onChange}\n        onFocus={onFocus}\n        onBlur={onBlur}\n        >\n        <ToggleUI\n          reversed={reversed}\n          width={width}\n          animationDuration={animationDuration}\n          style={style}\n          name={name}\n          id={id}\n          ariaLabel={ariaLabel}\n          ariaLabelledby={ariaLabelledby}\n        />\n      </ToggleContainer>\n    </div>\n  );\n}\n\nexport type { ToggleContainerProps, ToggleUIProps };\nexport { Toggle, ToggleContainer, ToggleUI, useToggleContext };\n"],"names":["noop","TOGGLE_DEFAULT_VALUE","checked","defaultChecked","disabled","onChange","onFocus","onBlur","ToggleContext","React","createContext","useToggleContext","context","useContext","undefined","Error","ToggleContainer","_ref","Dvalue","children","isChecked","setChecked","useState","handleChange","useCallback","e","currentTarget","createElement","Provider","value","filterNumber","input","config","useSendbirdStateContext","logger","warning","_","regex","numbers","match","map","parseFloat","ToggleUI","props","_filterNumber","reversed","width","animationDuration","style","name","id","ariaLabel","ariaLabelledby","animatedClassName","setAnimatedClassName","toggleWidth","toggleHeight","dotSize","className","flat","join","_objectSpread","height","borderRadius","type","Toggle"],"mappings":"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"}

package/ui/Tooltip.js

@@ -1,16 +1,15 @@
-import { a as __spreadArray } from '../tslib.es6-d6e50ec3.js';
 import React__default from 'react';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../index-cce0e324.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../index-4111594a.js';
 import 'prop-types';
-import '../stringSet-9d579825.js';
+import '../stringSet-1f18348a.js';
 
-function Tooltip(_a) {
-  var _b = _a.className,
-    className = _b === void 0 ? '' : _b,
-    _c = _a.children,
-    children = _c === void 0 ? '' : _c;
+function Tooltip(_ref) {
+  let {
+    className = '',
+    children = ''
+  } = _ref;
   return /*#__PURE__*/React__default.createElement("div", {
-    className: __spreadArray(__spreadArray([], Array.isArray(className) ? className : [className], true), ['sendbird-tooltip'], false).join(' ')
+    className: [...(Array.isArray(className) ? className : [className]), 'sendbird-tooltip'].join(' ')
   }, /*#__PURE__*/React__default.createElement(Label, {
     className: "sendbird-tooltip__text",
     type: LabelTypography.CAPTION_2,

package/ui/Tooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.js","sources":["../../src/ui/Tooltip/index.tsx"],"sourcesContent":["import React, { ReactElement } from 'react';\n\nimport './index.scss';\n\nimport Label, { LabelColors, LabelTypography } from '../Label';\n\nexport interface TooltipProps {\n  className?: string | Array<string>;\n  children?: string | ReactElement;\n}\nexport default function Tooltip({\n  className = '',\n  children = '',\n}: TooltipProps): ReactElement {\n  return (\n    <div\n      className={[\n        ...(Array.isArray(className) ? className : [className]),\n        'sendbird-tooltip',\n      ].join(' ')}\n    >\n      <Label\n        className=\"sendbird-tooltip__text\"\n        type={LabelTypography.CAPTION_2}\n        color={LabelColors.ONCONTENT_1}\n      >\n        {children}\n      </Label>\n    </div>\n  );\n}\n"],"names":["Tooltip","_a","_b","className","_c","children","React","createElement","__spreadArray","Array","isArray","join","Label","type","LabelTypography","CAPTION_2","color","LabelColors","ONCONTENT_1"],"mappings":";;;;;;AAUwB,SAAAA,OAAOA,CAACC,EAGjB,EAAA;MAFbC,EAAc,GAAAD,EAAA,CAAAE,SAAA;IAAdA,SAAS,GAAAD,EAAA,KAAA,KAAA,CAAA,GAAG,EAAE,GAAAA,EAAA;IACdE,EAAA,GAAAH,EAAA,CAAAI,QAAa;IAAbA,QAAQ,GAAGD,EAAA,KAAA,KAAA,CAAA,GAAA,EAAE,GAAAA,EAAA,CAAA;EAEb,oBACEE,cAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AACEJ,IAAAA,SAAS,EAAEK,aAAA,CAAAA,aAAA,CAAA,EAAA,EACLC,KAAK,CAACC,OAAO,CAACP,SAAS,CAAC,GAAGA,SAAS,GAAG,CAACA,SAAS,CAAC,EAAC,IAAA,CAAA,EAAA,CACvD,kBAAkB,CAClB,EAAA,KAAA,CAAA,CAAAQ,IAAI,CAAC,GAAG,CAAA;AAAE,GAAA,eAEZL,cAAA,CAAAC,aAAA,CAACK,KAAK,EAAA;AACJT,IAAAA,SAAS,EAAC,wBAAwB;IAClCU,IAAI,EAAEC,eAAe,CAACC,SAAU;IAChCC,KAAK,EAAEC,WAAW,CAACC,WAAAA;GAElBb,EAAAA,QAAQ,CAEb,CAAM,CAAA;AAEV;;;;"}
+{"version":3,"file":"Tooltip.js","sources":["../../src/ui/Tooltip/index.tsx"],"sourcesContent":["import React, { ReactElement } from 'react';\n\nimport './index.scss';\n\nimport Label, { LabelColors, LabelTypography } from '../Label';\n\nexport interface TooltipProps {\n  className?: string | Array<string>;\n  children?: string | ReactElement;\n}\nexport default function Tooltip({\n  className = '',\n  children = '',\n}: TooltipProps): ReactElement {\n  return (\n    <div\n      className={[\n        ...(Array.isArray(className) ? className : [className]),\n        'sendbird-tooltip',\n      ].join(' ')}\n    >\n      <Label\n        className=\"sendbird-tooltip__text\"\n        type={LabelTypography.CAPTION_2}\n        color={LabelColors.ONCONTENT_1}\n      >\n        {children}\n      </Label>\n    </div>\n  );\n}\n"],"names":["Tooltip","_ref","className","children","React","createElement","Array","isArray","join","Label","type","LabelTypography","CAPTION_2","color","LabelColors","ONCONTENT_1"],"mappings":";;;;;AAUe,SAASA,OAAOA,CAAAC,IAAA,EAGA;EAAA,IAHC;AAC9BC,IAAAA,SAAS,GAAG,EAAE;AACdC,IAAAA,QAAQ,GAAG,EAAA;AACC,GAAC,GAAAF,IAAA,CAAA;EACb,oBACEG,cAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;IACEH,SAAS,EAAE,CACT,IAAII,KAAK,CAACC,OAAO,CAACL,SAAS,CAAC,GAAGA,SAAS,GAAG,CAACA,SAAS,CAAC,CAAC,EACvD,kBAAkB,CACnB,CAACM,IAAI,CAAC,GAAG,CAAA;AAAE,GAAA,eAEZJ,cAAA,CAAAC,aAAA,CAACI,KAAK,EAAA;AACJP,IAAAA,SAAS,EAAC,wBAAwB;IAClCQ,IAAI,EAAEC,eAAe,CAACC,SAAU;IAChCC,KAAK,EAAEC,WAAW,CAACC,WAAAA;GAElBZ,EAAAA,QACI,CACJ,CAAC,CAAA;AAEV;;;;"}

package/ui/TooltipWrapper.js

@@ -1,28 +1,27 @@
-import { a as __spreadArray } from '../tslib.es6-d6e50ec3.js';
 import React__default, { useState, useRef } from '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 = useState(false),
-    showHoverTooltip = _c[0],
-    setShowHoverTooltip = _c[1];
-  var childrenRef = useRef(null);
+const SPACE_FROM_TRIGGER = 8;
+function TooltipWrapper(_ref) {
+  let {
+    className = '',
+    children,
+    hoverTooltip
+    // clickTooltip can be added later
+  } = _ref;
+  const [showHoverTooltip, setShowHoverTooltip] = useState(false);
+  const childrenRef = useRef(null);
   return /*#__PURE__*/React__default.createElement("div", {
-    className: __spreadArray(__spreadArray([], Array.isArray(className) ? className : [className], true), ['sendbird-tooltip-wrapper'], false).join(' '),
-    onMouseOver: function () {
+    className: [...(Array.isArray(className) ? className : [className]), 'sendbird-tooltip-wrapper'].join(' '),
+    onMouseOver: () => {
       setShowHoverTooltip(true);
     },
-    onFocus: function () {
+    onFocus: () => {
       setShowHoverTooltip(true);
     },
-    onMouseOut: function () {
+    onMouseOut: () => {
       setShowHoverTooltip(false);
     },
-    onBlur: function () {
+    onBlur: () => {
       setShowHoverTooltip(false);
     }
   }, /*#__PURE__*/React__default.createElement("div", {
@@ -31,14 +30,14 @@ function TooltipWrapper(_a) {
   }, children), showHoverTooltip && /*#__PURE__*/React__default.createElement("div", {
     className: "sendbird-tooltip-wrapper__hover-tooltip",
     style: {
-      bottom: "calc(100% + ".concat(SPACE_FROM_TRIGGER, "px)")
+      bottom: `calc(100% + ${SPACE_FROM_TRIGGER}px)`
     }
   }, /*#__PURE__*/React__default.createElement("div", {
     className: "sendbird-tooltip-wrapper__hover-tooltip__inner"
   }, /*#__PURE__*/React__default.createElement("div", {
     className: "sendbird-tooltip-wrapper__hover-tooltip__inner__tooltip-container",
     style: {
-      left: childrenRef.current && "calc(".concat(childrenRef.current.offsetWidth / 2, "px - 50%)")
+      left: childrenRef.current && `calc(${childrenRef.current.offsetWidth / 2}px - 50%)`
     }
   }, hoverTooltip))));
 }

package/ui/TooltipWrapper.js.map

@@ -1 +1 @@
-{"version":3,"file":"TooltipWrapper.js","sources":["../../src/ui/TooltipWrapper/index.tsx"],"sourcesContent":["import React, { useState, useRef, ReactElement } from 'react';\n\nimport './index.scss';\n\nconst SPACE_FROM_TRIGGER = 8;\n\nexport interface TooltipWrapperProps {\n  className?: string | Array<string>;\n  children: ReactElement;\n  hoverTooltip: ReactElement;\n}\nexport default function TooltipWrapper({\n  className = '',\n  children,\n  hoverTooltip,\n  // clickTooltip can be added later\n}: TooltipWrapperProps): ReactElement {\n  const [showHoverTooltip, setShowHoverTooltip] = useState(false);\n  const childrenRef = useRef(null);\n\n  return (\n    <div\n      className={[\n        ...(Array.isArray(className) ? className : [className]),\n        'sendbird-tooltip-wrapper',\n      ].join(' ')}\n      onMouseOver={() => { setShowHoverTooltip(true); }}\n      onFocus={() => { setShowHoverTooltip(true); }}\n      onMouseOut={() => { setShowHoverTooltip(false); }}\n      onBlur={() => { setShowHoverTooltip(false); }}\n    >\n      <div\n        className=\"sendbird-tooltip-wrapper__children\"\n        ref={childrenRef}\n      >\n        {children}\n      </div>\n      {\n        showHoverTooltip && (\n          <div\n            className=\"sendbird-tooltip-wrapper__hover-tooltip\"\n            style={{ bottom: `calc(100% + ${SPACE_FROM_TRIGGER}px)` }}\n          >\n            <div className=\"sendbird-tooltip-wrapper__hover-tooltip__inner\">\n              <div\n                className=\"sendbird-tooltip-wrapper__hover-tooltip__inner__tooltip-container\"\n                style={{ left: childrenRef.current && `calc(${childrenRef.current.offsetWidth / 2}px - 50%)` }}\n              >\n                {hoverTooltip}\n              </div>\n            </div>\n          </div>\n        )\n      }\n    </div>\n  );\n}\n"],"names":["SPACE_FROM_TRIGGER","TooltipWrapper","_a","_b","className","children","hoverTooltip","_c","useState","showHoverTooltip","setShowHoverTooltip","childrenRef","useRef","React","createElement","__spreadArray","Array","isArray","join","onMouseOver","onFocus","onMouseOut","onBlur","ref","style","bottom","left","current","concat","offsetWidth"],"mappings":";;;AAIA,IAAMA,kBAAkB,GAAG,CAAC,CAAA;AAOJ,SAAAC,cAAcA,CAACC,EAKjB,EAAA;MAJpBC,EAAc,GAAAD,EAAA,CAAAE,SAAA;IAAdA,SAAS,GAAAD,EAAA,KAAA,KAAA,CAAA,GAAG,EAAE,GAAAA,EAAA;IACdE,QAAQ,GAAAH,EAAA,CAAAG,QAAA;IACRC,YAAY,GAAAJ,EAAA,CAAAI,YAAA,CAAA;AAGN,EAAA,IAAAC,EAAA,GAA0CC,QAAQ,CAAC,KAAK,CAAC;AAAxDC,IAAAA,gBAAgB,GAAAF,EAAA,CAAA,CAAA,CAAA;AAAEG,IAAAA,mBAAmB,GAAAH,EAAA,CAAA,CAAA,CAAmB,CAAA;AAC/D,EAAA,IAAMI,WAAW,GAAGC,MAAM,CAAC,IAAI,CAAC,CAAA;EAEhC,oBACEC,cAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AACEV,IAAAA,SAAS,EAAEW,aAAA,CAAAA,aAAA,CAAA,EAAA,EACLC,KAAK,CAACC,OAAO,CAACb,SAAS,CAAC,GAAGA,SAAS,GAAG,CAACA,SAAS,CAAC,EAAC,IAAA,CAAA,EAAA,CACvD,0BAA0B,UAC1Bc,IAAI,CAAC,GAAG,CAAE;IACZC,WAAW,EAAE,YAAA;MAAQT,mBAAmB,CAAC,IAAI,CAAC,CAAA;KAAI;IAClDU,OAAO,EAAE,YAAA;MAAQV,mBAAmB,CAAC,IAAI,CAAC,CAAA;KAAI;IAC9CW,UAAU,EAAE,YAAA;MAAQX,mBAAmB,CAAC,KAAK,CAAC,CAAA;KAAI;IAClDY,MAAM,EAAE,YAAA;MAAQZ,mBAAmB,CAAC,KAAK,CAAC,CAAA;AAAE,KAAA;GAE5CG,eAAAA,cAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AACEV,IAAAA,SAAS,EAAC,oCAAoC;AAC9CmB,IAAAA,GAAG,EAAEZ,WAAAA;AAAY,GAAA,EAEhBN,QAAQ,CAEX,EACEI,gBAAgB,iBACdI,cAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AACEV,IAAAA,SAAS,EAAC,yCAAyC;AACnDoB,IAAAA,KAAK,EAAE;AAAEC,MAAAA,MAAM,EAAE,sBAAezB,kBAAkB,EAAA,KAAA,CAAA;AAAO,KAAA;GAEzDa,eAAAA,cAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AAAKV,IAAAA,SAAS,EAAC,gDAAA;GACbS,eAAAA,cAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AACEV,IAAAA,SAAS,EAAC,mEAAmE;AAC7EoB,IAAAA,KAAK,EAAE;AAAEE,MAAAA,IAAI,EAAEf,WAAW,CAACgB,OAAO,IAAI,OAAA,CAAAC,MAAA,CAAQjB,WAAW,CAACgB,OAAO,CAACE,WAAW,GAAG,CAAC,EAAA,WAAA,CAAA;AAAa,KAAA;AAAC,GAAA,EAE9FvB,YAAY,CAEjB,CACF,CACD,CAEC,CAAA;AAEV;;;;"}
+{"version":3,"file":"TooltipWrapper.js","sources":["../../src/ui/TooltipWrapper/index.tsx"],"sourcesContent":["import React, { useState, useRef, ReactElement } from 'react';\n\nimport './index.scss';\n\nconst SPACE_FROM_TRIGGER = 8;\n\nexport interface TooltipWrapperProps {\n  className?: string | Array<string>;\n  children: ReactElement;\n  hoverTooltip: ReactElement;\n}\nexport default function TooltipWrapper({\n  className = '',\n  children,\n  hoverTooltip,\n  // clickTooltip can be added later\n}: TooltipWrapperProps): ReactElement {\n  const [showHoverTooltip, setShowHoverTooltip] = useState(false);\n  const childrenRef = useRef(null);\n\n  return (\n    <div\n      className={[\n        ...(Array.isArray(className) ? className : [className]),\n        'sendbird-tooltip-wrapper',\n      ].join(' ')}\n      onMouseOver={() => { setShowHoverTooltip(true); }}\n      onFocus={() => { setShowHoverTooltip(true); }}\n      onMouseOut={() => { setShowHoverTooltip(false); }}\n      onBlur={() => { setShowHoverTooltip(false); }}\n    >\n      <div\n        className=\"sendbird-tooltip-wrapper__children\"\n        ref={childrenRef}\n      >\n        {children}\n      </div>\n      {\n        showHoverTooltip && (\n          <div\n            className=\"sendbird-tooltip-wrapper__hover-tooltip\"\n            style={{ bottom: `calc(100% + ${SPACE_FROM_TRIGGER}px)` }}\n          >\n            <div className=\"sendbird-tooltip-wrapper__hover-tooltip__inner\">\n              <div\n                className=\"sendbird-tooltip-wrapper__hover-tooltip__inner__tooltip-container\"\n                style={{ left: childrenRef.current && `calc(${childrenRef.current.offsetWidth / 2}px - 50%)` }}\n              >\n                {hoverTooltip}\n              </div>\n            </div>\n          </div>\n        )\n      }\n    </div>\n  );\n}\n"],"names":["SPACE_FROM_TRIGGER","TooltipWrapper","_ref","className","children","hoverTooltip","showHoverTooltip","setShowHoverTooltip","useState","childrenRef","useRef","React","createElement","Array","isArray","join","onMouseOver","onFocus","onMouseOut","onBlur","ref","style","bottom","left","current","offsetWidth"],"mappings":";;AAIA,MAAMA,kBAAkB,GAAG,CAAC,CAAA;AAOb,SAASC,cAAcA,CAAAC,IAAA,EAKA;EAAA,IALC;AACrCC,IAAAA,SAAS,GAAG,EAAE;IACdC,QAAQ;AACRC,IAAAA,YAAAA;AACA;AACmB,GAAC,GAAAH,IAAA,CAAA;EACpB,MAAM,CAACI,gBAAgB,EAAEC,mBAAmB,CAAC,GAAGC,QAAQ,CAAC,KAAK,CAAC,CAAA;AAC/D,EAAA,MAAMC,WAAW,GAAGC,MAAM,CAAC,IAAI,CAAC,CAAA;EAEhC,oBACEC,cAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;IACET,SAAS,EAAE,CACT,IAAIU,KAAK,CAACC,OAAO,CAACX,SAAS,CAAC,GAAGA,SAAS,GAAG,CAACA,SAAS,CAAC,CAAC,EACvD,0BAA0B,CAC3B,CAACY,IAAI,CAAC,GAAG,CAAE;IACZC,WAAW,EAAEA,MAAM;MAAET,mBAAmB,CAAC,IAAI,CAAC,CAAA;KAAI;IAClDU,OAAO,EAAEA,MAAM;MAAEV,mBAAmB,CAAC,IAAI,CAAC,CAAA;KAAI;IAC9CW,UAAU,EAAEA,MAAM;MAAEX,mBAAmB,CAAC,KAAK,CAAC,CAAA;KAAI;IAClDY,MAAM,EAAEA,MAAM;MAAEZ,mBAAmB,CAAC,KAAK,CAAC,CAAA;AAAE,KAAA;GAE5CI,eAAAA,cAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AACET,IAAAA,SAAS,EAAC,oCAAoC;AAC9CiB,IAAAA,GAAG,EAAEX,WAAAA;AAAY,GAAA,EAEhBL,QACE,CAAC,EAEJE,gBAAgB,iBACdK,cAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AACET,IAAAA,SAAS,EAAC,yCAAyC;AACnDkB,IAAAA,KAAK,EAAE;MAAEC,MAAM,EAAG,eAActB,kBAAmB,CAAA,GAAA,CAAA;AAAK,KAAA;GAExDW,eAAAA,cAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AAAKT,IAAAA,SAAS,EAAC,gDAAA;GACbQ,eAAAA,cAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AACET,IAAAA,SAAS,EAAC,mEAAmE;AAC7EkB,IAAAA,KAAK,EAAE;AAAEE,MAAAA,IAAI,EAAEd,WAAW,CAACe,OAAO,IAAK,CAAA,KAAA,EAAOf,WAAW,CAACe,OAAO,CAACC,WAAW,GAAG,CAAE,CAAA,SAAA,CAAA;AAAW,KAAA;AAAE,GAAA,EAE9FpB,YACE,CACF,CACF,CAGN,CAAC,CAAA;AAEV;;;;"}

package/ui/UnknownMessageItemBody.js

@@ -1,26 +1,27 @@
 import React__default, { useContext } from 'react';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../index-cce0e324.js';
-import { j as getClassName } from '../index-e378ca4e.js';
-import { a as LocalizationContext } from '../LocalizationContext-3d8c0b24.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../index-4111594a.js';
+import { j as getClassName } from '../index-dbe0e004.js';
+import { a as LocalizationContext } from '../LocalizationContext-9c54e783.js';
 import 'prop-types';
-import '../stringSet-9d579825.js';
-import '../tslib.es6-d6e50ec3.js';
+import '../stringSet-1f18348a.js';
+import '../_rollupPluginBabelHelpers-b2d9bfc5.js';
 import '../utils/message/getOutgoingMessageState.js';
-import '../index-aaa9b9f8.js';
+import '../index-a9ddd0f5.js';
 
-function UnknownMessageItemBody(_a) {
-  var _b;
-  var className = _a.className,
-    message = _a.message,
-    _c = _a.isByMe,
-    isByMe = _c === void 0 ? false : _c,
-    _d = _a.mouseHover,
-    mouseHover = _d === void 0 ? false : _d,
-    _e = _a.isReactionEnabled,
-    isReactionEnabled = _e === void 0 ? false : _e;
-  var stringSet = useContext(LocalizationContext).stringSet;
+function UnknownMessageItemBody(_ref) {
+  var _message$reactions;
+  let {
+    className,
+    message,
+    isByMe = false,
+    mouseHover = false,
+    isReactionEnabled = false
+  } = _ref;
+  const {
+    stringSet
+  } = useContext(LocalizationContext);
   return /*#__PURE__*/React__default.createElement("div", {
-    className: getClassName([className, 'sendbird-unknown-message-item-body', isByMe ? 'outgoing' : 'incoming', mouseHover ? 'mouse-hover' : '', isReactionEnabled && ((_b = message === null || message === void 0 ? void 0 : message.reactions) === null || _b === void 0 ? void 0 : _b.length) > 0 ? 'reactions' : ''])
+    className: getClassName([className, 'sendbird-unknown-message-item-body', isByMe ? 'outgoing' : 'incoming', mouseHover ? 'mouse-hover' : '', isReactionEnabled && (message === null || message === void 0 ? void 0 : (_message$reactions = message.reactions) === null || _message$reactions === void 0 ? void 0 : _message$reactions.length) > 0 ? 'reactions' : ''])
   }, /*#__PURE__*/React__default.createElement(Label, {
     className: "sendbird-unknown-message-item-body__header",
     type: LabelTypography.BODY_1,

package/ui/UnknownMessageItemBody.js.map

@@ -1 +1 @@
-{"version":3,"file":"UnknownMessageItemBody.js","sources":["../../src/ui/UnknownMessageItemBody/index.tsx"],"sourcesContent":["import React, { ReactElement, useContext } from 'react';\nimport './index.scss';\n\nimport Label, { LabelTypography, LabelColors } from '../Label';\nimport { getClassName } from '../../utils';\nimport { LocalizationContext } from '../../lib/LocalizationContext';\nimport { BaseMessage } from '@sendbird/chat/message';\n\ninterface Props {\n  className?: string | Array<string>;\n  isByMe?: boolean;\n  message: BaseMessage;\n  mouseHover?: boolean;\n  isReactionEnabled?: boolean;\n}\n\nexport default function UnknownMessageItemBody({\n  className,\n  message,\n  isByMe = false,\n  mouseHover = false,\n  isReactionEnabled = false,\n}: Props): ReactElement {\n  const { stringSet } = useContext(LocalizationContext);\n  return (\n    <div className={getClassName([\n      className,\n      'sendbird-unknown-message-item-body',\n      isByMe ? 'outgoing' : 'incoming',\n      mouseHover ? 'mouse-hover' : '',\n      (isReactionEnabled && message?.reactions?.length > 0) ? 'reactions' : '',\n    ])}>\n      <Label\n        className=\"sendbird-unknown-message-item-body__header\"\n        type={LabelTypography.BODY_1}\n        color={isByMe ? LabelColors.ONCONTENT_1 : LabelColors.ONBACKGROUND_1}\n      >\n        {stringSet.UNKNOWN__UNKNOWN_MESSAGE_TYPE}\n      </Label>\n      <Label\n        className=\"sendbird-unknown-message-item-body__description\"\n        type={LabelTypography.BODY_1}\n        color={isByMe ? LabelColors.ONCONTENT_2 : LabelColors.ONBACKGROUND_2}\n      >\n        {stringSet.UNKNOWN__CANNOT_READ_MESSAGE}\n      </Label>\n    </div>\n  );\n}\n"],"names":["UnknownMessageItemBody","_a","className","message","_c","isByMe","_d","mouseHover","_e","isReactionEnabled","stringSet","useContext","LocalizationContext","React","createElement","getClassName","_b","reactions","length","Label","type","LabelTypography","BODY_1","color","LabelColors","ONCONTENT_1","ONBACKGROUND_1","UNKNOWN__UNKNOWN_MESSAGE_TYPE","ONCONTENT_2","ONBACKGROUND_2","UNKNOWN__CANNOT_READ_MESSAGE"],"mappings":";;;;;;;;;;AAgBwB,SAAAA,sBAAsBA,CAACC,EAMvC,EAAA;;MALNC,SAAS,GAAAD,EAAA,CAAAC,SAAA;IACTC,OAAO,GAAAF,EAAA,CAAAE,OAAA;IACPC,cAAc;IAAdC,MAAM,GAAGD,EAAA,KAAA,KAAA,CAAA,GAAA,KAAK,GAAAA,EAAA;IACdE,kBAAkB;IAAlBC,UAAU,GAAGD,EAAA,KAAA,KAAA,CAAA,GAAA,KAAK,GAAAA,EAAA;IAClBE,yBAAyB;IAAzBC,iBAAiB,GAAGD,EAAA,KAAA,KAAA,CAAA,GAAA,KAAK,GAAAA,EAAA,CAAA;AAEjB,EAAA,IAAAE,SAAS,GAAKC,UAAU,CAACC,mBAAmB,CAAC,UAApC,CAAA;EACjB,oBACEC,cAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AAAKZ,IAAAA,SAAS,EAAEa,YAAY,CAAC,CAC3Bb,SAAS,EACT,oCAAoC,EACpCG,MAAM,GAAG,UAAU,GAAG,UAAU,EAChCE,UAAU,GAAG,aAAa,GAAG,EAAE,EAC9BE,iBAAiB,IAAI,CAAA,CAAAO,EAAA,GAAAb,OAAO,KAAP,IAAA,IAAAA,OAAO,KAAP,KAAA,CAAA,GAAA,KAAA,CAAA,GAAAA,OAAO,CAAEc,SAAS,0CAAEC,MAAM,IAAG,CAAC,GAAI,WAAW,GAAG,EAAE,CACzE,CAAA;AAAE,GAAA,eACDL,cAAA,CAAAC,aAAA,CAACK,KAAK,EAAA;AACJjB,IAAAA,SAAS,EAAC,4CAA4C;IACtDkB,IAAI,EAAEC,eAAe,CAACC,MAAO;IAC7BC,KAAK,EAAElB,MAAM,GAAGmB,WAAW,CAACC,WAAW,GAAGD,WAAW,CAACE,cAAAA;GAErDhB,EAAAA,SAAS,CAACiB,6BAA6B,CAE1C,eAAAd,cAAA,CAAAC,aAAA,CAACK,KAAK,EAAA;AACJjB,IAAAA,SAAS,EAAC,iDAAiD;IAC3DkB,IAAI,EAAEC,eAAe,CAACC,MAAO;IAC7BC,KAAK,EAAElB,MAAM,GAAGmB,WAAW,CAACI,WAAW,GAAGJ,WAAW,CAACK,cAAAA;AAAe,GAAA,EAEpEnB,SAAS,CAACoB,4BAA4B,CAE3C,CAAM,CAAA;AAEV;;;;"}
+{"version":3,"file":"UnknownMessageItemBody.js","sources":["../../src/ui/UnknownMessageItemBody/index.tsx"],"sourcesContent":["import React, { ReactElement, useContext } from 'react';\nimport './index.scss';\n\nimport Label, { LabelTypography, LabelColors } from '../Label';\nimport { getClassName } from '../../utils';\nimport { LocalizationContext } from '../../lib/LocalizationContext';\nimport { BaseMessage } from '@sendbird/chat/message';\n\ninterface Props {\n  className?: string | Array<string>;\n  isByMe?: boolean;\n  message: BaseMessage;\n  mouseHover?: boolean;\n  isReactionEnabled?: boolean;\n}\n\nexport default function UnknownMessageItemBody({\n  className,\n  message,\n  isByMe = false,\n  mouseHover = false,\n  isReactionEnabled = false,\n}: Props): ReactElement {\n  const { stringSet } = useContext(LocalizationContext);\n  return (\n    <div className={getClassName([\n      className,\n      'sendbird-unknown-message-item-body',\n      isByMe ? 'outgoing' : 'incoming',\n      mouseHover ? 'mouse-hover' : '',\n      (isReactionEnabled && message?.reactions?.length > 0) ? 'reactions' : '',\n    ])}>\n      <Label\n        className=\"sendbird-unknown-message-item-body__header\"\n        type={LabelTypography.BODY_1}\n        color={isByMe ? LabelColors.ONCONTENT_1 : LabelColors.ONBACKGROUND_1}\n      >\n        {stringSet.UNKNOWN__UNKNOWN_MESSAGE_TYPE}\n      </Label>\n      <Label\n        className=\"sendbird-unknown-message-item-body__description\"\n        type={LabelTypography.BODY_1}\n        color={isByMe ? LabelColors.ONCONTENT_2 : LabelColors.ONBACKGROUND_2}\n      >\n        {stringSet.UNKNOWN__CANNOT_READ_MESSAGE}\n      </Label>\n    </div>\n  );\n}\n"],"names":["UnknownMessageItemBody","_ref","_message$reactions","className","message","isByMe","mouseHover","isReactionEnabled","stringSet","useContext","LocalizationContext","React","createElement","getClassName","reactions","length","Label","type","LabelTypography","BODY_1","color","LabelColors","ONCONTENT_1","ONBACKGROUND_1","UNKNOWN__UNKNOWN_MESSAGE_TYPE","ONCONTENT_2","ONBACKGROUND_2","UNKNOWN__CANNOT_READ_MESSAGE"],"mappings":";;;;;;;;;;AAgBe,SAASA,sBAAsBA,CAAAC,IAAA,EAMtB;AAAA,EAAA,IAAAC,kBAAA,CAAA;EAAA,IANuB;IAC7CC,SAAS;IACTC,OAAO;AACPC,IAAAA,MAAM,GAAG,KAAK;AACdC,IAAAA,UAAU,GAAG,KAAK;AAClBC,IAAAA,iBAAiB,GAAG,KAAA;AACf,GAAC,GAAAN,IAAA,CAAA;EACN,MAAM;AAAEO,IAAAA,SAAAA;AAAU,GAAC,GAAGC,UAAU,CAACC,mBAAmB,CAAC,CAAA;EACrD,oBACEC,cAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;IAAKT,SAAS,EAAEU,YAAY,CAAC,CAC3BV,SAAS,EACT,oCAAoC,EACpCE,MAAM,GAAG,UAAU,GAAG,UAAU,EAChCC,UAAU,GAAG,aAAa,GAAG,EAAE,EAC9BC,iBAAiB,IAAI,CAAAH,OAAO,KAAA,IAAA,IAAPA,OAAO,KAAAF,KAAAA,CAAAA,GAAAA,KAAAA,CAAAA,GAAAA,CAAAA,kBAAA,GAAPE,OAAO,CAAEU,SAAS,MAAAZ,IAAAA,IAAAA,kBAAA,uBAAlBA,kBAAA,CAAoBa,MAAM,IAAG,CAAC,GAAI,WAAW,GAAG,EAAE,CACzE,CAAA;AAAE,GAAA,eACDJ,cAAA,CAAAC,aAAA,CAACI,KAAK,EAAA;AACJb,IAAAA,SAAS,EAAC,4CAA4C;IACtDc,IAAI,EAAEC,eAAe,CAACC,MAAO;IAC7BC,KAAK,EAAEf,MAAM,GAAGgB,WAAW,CAACC,WAAW,GAAGD,WAAW,CAACE,cAAAA;GAErDf,EAAAA,SAAS,CAACgB,6BACN,CAAC,eACRb,cAAA,CAAAC,aAAA,CAACI,KAAK,EAAA;AACJb,IAAAA,SAAS,EAAC,iDAAiD;IAC3Dc,IAAI,EAAEC,eAAe,CAACC,MAAO;IAC7BC,KAAK,EAAEf,MAAM,GAAGgB,WAAW,CAACI,WAAW,GAAGJ,WAAW,CAACK,cAAAA;AAAe,GAAA,EAEpElB,SAAS,CAACmB,4BACN,CACJ,CAAC,CAAA;AAEV;;;;"}