@sendbird/uikit-react 3.5.0-beta.0 → 3.5.0-mobile-web-0

package/ui/MessageStatus.js

@@ -1,17 +1,16 @@
-import '../tslib.es6-bcead7e6.js';
 import 'react';
-import '../index-3f26a31c.js';
+import '../index-06f34585.js';
 import './Icon.js';
-import '../index-44470dab.js';
+import '../index-e1cd2fcf.js';
 import './Loader.js';
-import '../index-5f08f486.js';
+import '../index-fd51c7d1.js';
 import '../utils/message/getOutgoingMessageState.js';
-export { e as MessageStatusTypes, M as default } from '../index-1b91b116.js';
-import '../LocalizationContext-4df0cc32.js';
-import '../index-07e060cd.js';
+export { e as MessageStatusTypes, M as default } from '../index-c6df8184.js';
+import '../LocalizationContext-1839d2db.js';
+import '../index-d9c12cf4.js';
 import 'prop-types';
-import '../stringSet-d555d877.js';
-import '../index-defabece.js';
-import '../index-d3f6dbb9.js';
-import '../index-1572c90f.js';
+import '../stringSet-d368e289.js';
+import '../_rollupPluginBabelHelpers-ce69e916.js';
+import '../index-5db37327.js';
+import '../index-9781d2b9.js';
 //# sourceMappingURL=MessageStatus.js.map

package/ui/MessageStatus.js.map

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

package/ui/Modal.js

@@ -1,19 +1,21 @@
 import React__default, { useContext } from 'react';
 import { createPortal } from 'react-dom';
-import { M as MODAL_ROOT } from '../index-e5b78039.js';
-import { a as LocalizationContext } from '../LocalizationContext-4df0cc32.js';
+import { M as MODAL_ROOT } from '../index-3165e396.js';
+import { a as LocalizationContext } from '../LocalizationContext-1839d2db.js';
 import Button, { ButtonTypes } from './Button.js';
 import Icon, { IconTypes, IconColors } from './Icon.js';
 import IconButton from './IconButton.js';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../index-44470dab.js';
-import { u as useMediaQueryContext } from '../MediaQueryContext-74183e34.js';
-import '../stringSet-d555d877.js';
-import '../index-07e060cd.js';
-import '../tslib.es6-bcead7e6.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../index-e1cd2fcf.js';
+import { u as useMediaQueryContext } from '../MediaQueryContext-0e0b3a1b.js';
+import '../stringSet-d368e289.js';
+import '../index-d9c12cf4.js';
 import 'prop-types';
+import '../_rollupPluginBabelHelpers-ce69e916.js';
 
-var ModalHeader = function (_a) {
-  var titleText = _a.titleText;
+const ModalHeader = _ref => {
+  let {
+    titleText
+  } = _ref;
   return /*#__PURE__*/React__default.createElement("div", {
     className: "sendbird-modal__header"
   }, /*#__PURE__*/React__default.createElement(Label, {
@@ -21,8 +23,10 @@ var ModalHeader = function (_a) {
     color: LabelColors.ONBACKGROUND_1
   }, titleText));
 };
-var ModalBody = function (_a) {
-  var children = _a.children;
+const ModalBody = _ref2 => {
+  let {
+    children
+  } = _ref2;
   return /*#__PURE__*/React__default.createElement("div", {
     className: "sendbird-modal__body"
   }, /*#__PURE__*/React__default.createElement(Label, {
@@ -30,15 +34,17 @@ var ModalBody = function (_a) {
     color: LabelColors.ONBACKGROUND_2
   }, children));
 };
-var ModalFooter = function (_a) {
-  var submitText = _a.submitText,
-      _b = _a.disabled,
-      disabled = _b === void 0 ? false : _b,
-      _c = _a.type,
-      type = _c === void 0 ? ButtonTypes.DANGER : _c,
-      onSubmit = _a.onSubmit,
-      onCancel = _a.onCancel;
-  var stringSet = useContext(LocalizationContext).stringSet;
+const ModalFooter = _ref3 => {
+  let {
+    submitText,
+    disabled = false,
+    type = ButtonTypes.DANGER,
+    onSubmit,
+    onCancel
+  } = _ref3;
+  const {
+    stringSet
+  } = useContext(LocalizationContext);
   return /*#__PURE__*/React__default.createElement("div", {
     className: "sendbird-modal__footer"
   }, /*#__PURE__*/React__default.createElement(Button, {
@@ -54,30 +60,28 @@ var ModalFooter = function (_a) {
   }, submitText));
 };
 function Modal(props) {
-  var _a = props.children,
-      children = _a === void 0 ? null : _a,
-      _b = props.className,
-      className = _b === void 0 ? '' : _b,
-      _c = props.isCloseOnClickOutside,
-      isCloseOnClickOutside = _c === void 0 ? false : _c,
-      _d = props.isFullScreenOnMobile,
-      isFullScreenOnMobile = _d === void 0 ? false : _d,
-      titleText = props.titleText,
-      submitText = props.submitText,
-      _e = props.disabled,
-      disabled = _e === void 0 ? false : _e,
-      _f = props.hideFooter,
-      hideFooter = _f === void 0 ? false : _f,
-      _g = props.type,
-      type = _g === void 0 ? ButtonTypes.DANGER : _g,
-      _h = props.onCancel,
-      onCancel = _h === void 0 ? function () {} : _h,
-      _j = props.onSubmit,
-      onSubmit = _j === void 0 ? function () {} : _j,
-      renderHeader = props.renderHeader;
-  var isMobile = useMediaQueryContext().isMobile;
+  const {
+    children = null,
+    className = '',
+    isCloseOnClickOutside = false,
+    isFullScreenOnMobile = false,
+    titleText,
+    submitText,
+    disabled = false,
+    hideFooter = false,
+    type = ButtonTypes.DANGER,
+    onCancel = () => {/* noop */},
+    onSubmit = () => {/* noop */},
+    renderHeader
+  } = props;
+  const {
+    isMobile
+  } = useMediaQueryContext();
   return /*#__PURE__*/createPortal( /*#__PURE__*/React__default.createElement("div", {
-    className: "\n      sendbird-modal ".concat(className, "\n      ").concat(isFullScreenOnMobile && isMobile ? 'sendbird-modal--full-mobile' : '', "\n    ")
+    className: `
+      sendbird-modal ${className}
+      ${isFullScreenOnMobile && isMobile ? 'sendbird-modal--full-mobile' : ''}
+    `
   }, /*#__PURE__*/React__default.createElement("div", {
     className: "sendbird-modal__content"
   }, (renderHeader === null || renderHeader === void 0 ? void 0 : renderHeader()) || /*#__PURE__*/React__default.createElement(ModalHeader, {
@@ -100,10 +104,12 @@ function Modal(props) {
     width: "24px",
     height: "24px"
   })))), /*#__PURE__*/React__default.createElement("div", {
-    className: "\n          sendbird-modal__backdrop\n          ".concat(isCloseOnClickOutside && 'sendbird-modal__backdrop--clickoutside', "\n        "),
-    onClick: function (e) {
+    className: `
+          sendbird-modal__backdrop
+          ${isCloseOnClickOutside && 'sendbird-modal__backdrop--clickoutside'}
+        `,
+    onClick: e => {
       e === null || e === void 0 ? void 0 : e.stopPropagation();
-
       if (isCloseOnClickOutside) {
         onCancel();
       }

package/ui/Modal.js.map

@@ -1 +1 @@
-{"version":3,"file":"Modal.js","sources":["../../src/ui/Modal/index.tsx"],"sourcesContent":["import React, { ReactElement, useContext } from 'react';\nimport { createPortal } from 'react-dom';\n\nimport './index.scss';\n\nimport { MODAL_ROOT } from '../../hooks/useModal/ModalRoot';\nimport { LocalizationContext } from '../../lib/LocalizationContext';\n\nimport Button, { ButtonTypes } from '../Button';\nimport Icon, { IconTypes, IconColors } from '../Icon';\nimport IconButton from '../IconButton';\nimport Label, { LabelTypography, LabelColors } from '../Label';\nimport { useMediaQueryContext } from '../../lib/MediaQueryContext';\n\nexport interface ModalHeaderProps {\n  titleText: string;\n}\nexport const ModalHeader = ({ titleText }: ModalHeaderProps): ReactElement => (\n  <div className=\"sendbird-modal__header\">\n    <Label type={LabelTypography.H_1} color={LabelColors.ONBACKGROUND_1}>\n      {titleText}\n    </Label>\n  </div>\n);\n\nexport interface ModalBodyProps {\n  children?: ReactElement;\n}\nexport const ModalBody = ({ children }: ModalBodyProps): ReactElement => (\n  <div className=\"sendbird-modal__body\">\n    <Label\n      type={LabelTypography.SUBTITLE_1}\n      color={LabelColors.ONBACKGROUND_2}\n    >\n      {children}\n    </Label>\n  </div>\n);\n\nexport interface ModalFooterProps {\n  submitText: string;\n  disabled?: boolean;\n  type?: ButtonTypes;\n  onCancel: () => void;\n  onSubmit: (e: SubmitEvent) => void;\n}\nexport const ModalFooter = ({\n  submitText,\n  disabled = false,\n  type = ButtonTypes.DANGER,\n  onSubmit,\n  onCancel,\n}: ModalFooterProps): ReactElement => {\n  const { stringSet } = useContext(LocalizationContext);\n  return (\n    <div className=\"sendbird-modal__footer\">\n      <Button type={ButtonTypes.SECONDARY} onClick={onCancel}>\n        <Label type={LabelTypography.BUTTON_1} color={LabelColors.ONBACKGROUND_1}>\n          {stringSet.BUTTON__CANCEL}\n        </Label>\n      </Button>\n      <Button type={type} disabled={disabled} onClick={onSubmit}>\n        {submitText}\n      </Button>\n    </div>\n  );\n};\n\nexport interface ModalProps {\n  children?: ReactElement;\n  className?: string;\n  isCloseOnClickOutside?: boolean;\n  isFullScreenOnMobile?: boolean;\n  titleText?: string;\n  submitText?: string;\n  disabled?: boolean;\n  hideFooter?: boolean;\n  type?: ButtonTypes;\n  onCancel?: () => void;\n  onSubmit?: (e: SubmitEvent) => void;\n  renderHeader?: () => ReactElement;\n}\nexport default function Modal(props: ModalProps): ReactElement {\n  const {\n    children = null,\n    className = '',\n    isCloseOnClickOutside = false,\n    isFullScreenOnMobile = false,\n    titleText,\n    submitText,\n    disabled = false,\n    hideFooter = false,\n    type = ButtonTypes.DANGER,\n    onCancel = () => {/* noop */ },\n    onSubmit = () => {/* noop */ },\n    renderHeader,\n  } = props;\n\n  const { isMobile } = useMediaQueryContext();\n  return createPortal((\n    <div className={`\n      sendbird-modal ${className}\n      ${(isFullScreenOnMobile && isMobile) ? 'sendbird-modal--full-mobile' : ''}\n    `}>\n      <div className=\"sendbird-modal__content\">\n        {renderHeader?.() || (\n          <ModalHeader titleText={titleText} />\n        )}\n        <ModalBody>{children}</ModalBody>\n        {\n          !hideFooter && (\n            <ModalFooter\n              disabled={disabled}\n              onCancel={onCancel}\n              onSubmit={onSubmit}\n              submitText={submitText}\n              type={type}\n            />\n          )\n        }\n        <div className=\"sendbird-modal__close\">\n          <IconButton\n            width=\"32px\"\n            height=\"32px\"\n            onClick={onCancel}\n          >\n            <Icon\n              type={IconTypes.CLOSE}\n              fillColor={IconColors.DEFAULT}\n              width=\"24px\"\n              height=\"24px\"\n            />\n          </IconButton>\n        </div>\n      </div>\n      <div\n        className={`\n          sendbird-modal__backdrop\n          ${isCloseOnClickOutside && 'sendbird-modal__backdrop--clickoutside'}\n        `}\n        onClick={(e) =>{\n          e?.stopPropagation();\n          if (isCloseOnClickOutside) {\n            onCancel();\n          }\n        }}\n      />\n    </div>\n  ), document.getElementById(MODAL_ROOT));\n}\n"],"names":["ModalHeader","_a","titleText","React","LabelTypography","H_1","LabelColors","ONBACKGROUND_1","ModalBody","children","SUBTITLE_1","ONBACKGROUND_2","ModalFooter","submitText","_b","disabled","_c","type","ButtonTypes","DANGER","onSubmit","onCancel","stringSet","useContext","LocalizationContext","SECONDARY","BUTTON_1","BUTTON__CANCEL","Modal","props","className","isCloseOnClickOutside","_d","isFullScreenOnMobile","_e","_f","hideFooter","_g","_h","_j","renderHeader","isMobile","useMediaQueryContext","createPortal","concat","IconTypes","CLOSE","IconColors","DEFAULT","e","stopPropagation","document","getElementById","MODAL_ROOT"],"mappings":";;;;;;;;;;;;;;AAiBaA,IAAAA,WAAW,GAAG,UAACC,EAAD,EAAgC;AAA7B,EAAA,IAAAC,SAAS,GAAAD,EAAA,CAAAC,SAAT,CAAA;EAAgD,oBAC5EC,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAK,IAAA,SAAS,EAAC,wBAAA;AAAf,GAAA,eACEA,6BAAC,KAAD,EAAA;IAAO,IAAI,EAAEC,eAAe,CAACC,GAA7B;IAAkC,KAAK,EAAEC,WAAW,CAACC,cAAAA;GAClDL,EAAAA,SADH,CADF,CAD4E,CAAA;AAM7E,EANM;AAWMM,IAAAA,SAAS,GAAG,UAACP,EAAD,EAA6B;AAA1B,EAAA,IAAAQ,QAAQ,GAAAR,EAAA,CAAAQ,QAAR,CAAA;EAA6C,oBACvEN,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAK,IAAA,SAAS,EAAC,sBAAA;AAAf,GAAA,eACEA,6BAAC,KAAD,EAAA;IACE,IAAI,EAAEC,eAAe,CAACM,UADxB;IAEE,KAAK,EAAEJ,WAAW,CAACK,cAAAA;GAElBF,EAAAA,QAJH,CADF,CADuE,CAAA;AASxE,EATM;AAkBMG,IAAAA,WAAW,GAAG,UAACX,EAAD,EAMR;MALjBY,UAAU,GAAAZ,EAAA,CAAAY;MACVC,EAAgB,GAAAb,EAAA,CAAAc;MAAhBA,QAAQ,GAAGD,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,GAAKA;MAChBE,EAAyB,GAAAf,EAAA,CAAAgB;MAAzBA,IAAI,GAAGD,EAAA,KAAA,KAAA,CAAA,GAAAE,WAAW,CAACC,MAAZ,GAAkBH;MACzBI,QAAQ,GAAAnB,EAAA,CAAAmB;MACRC,QAAQ,GAAApB,EAAA,CAAAoB;AAEA,EAAA,IAAAC,SAAS,GAAKC,UAAU,CAACC,mBAAD,CAAV,UAAd,CAAA;EACR,oBACErB,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAK,IAAA,SAAS,EAAC,wBAAA;AAAf,GAAA,eACEA,6BAAC,MAAD,EAAA;IAAQ,IAAI,EAAEe,WAAW,CAACO,SAA1B;AAAqC,IAAA,OAAO,EAAEJ,QAAAA;AAA9C,GAAA,eACElB,6BAAC,KAAD,EAAA;IAAO,IAAI,EAAEC,eAAe,CAACsB,QAA7B;IAAuC,KAAK,EAAEpB,WAAW,CAACC,cAAAA;AAA1D,GAAA,EACGe,SAAS,CAACK,cADb,CADF,CADF,eAMExB,6BAAC,MAAD,EAAA;AAAQ,IAAA,IAAI,EAAEc,IAAd;AAAoB,IAAA,QAAQ,EAAEF,QAA9B;AAAwC,IAAA,OAAO,EAAEK,QAAAA;GAC9CP,EAAAA,UADH,CANF,CADF,CAAA;AAYD,EApBM;AAoCiB,SAAAe,KAAA,CAAMC,KAAN,EAAuB;AAE3C,EAAA,IAAA5B,EAAA,GAYE4B,KAAK,CAZQpB,QAAf;MAAAA,QAAQ,GAAGR,EAAA,KAAA,KAAA,CAAA,GAAA,IAAA,KAAX;AAAA,MACAa,EAAA,GAWEe,KAAK,CAXOC,SADd;MACAA,SAAS,GAAGhB,EAAA,KAAA,KAAA,CAAA,GAAA,EAAA,KADZ;AAAA,MAEAE,EAAA,GAUEa,KAAK,CAAAE,qBAZP;MAEAA,qBAAqB,mBAAG,QAAKf,EAF7B;AAAA,MAGAgB,EASE,GAAAH,KAAK,qBAZP;MAGAI,oBAAoB,GAAGD,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,GAAKA,EAH5B;AAAA,MAIA9B,SAAS,GAQP2B,KAAK,UAZP;AAAA,MAKAhB,UAAU,GAORgB,KAAK,CAAAhB,UAZP;AAAA,MAMAqB,EAAA,GAMEL,KAAK,CAAAd,QAZP;MAMAA,QAAQ,GAAAmB,EAAA,KAAA,KAAA,CAAA,GAAG,KAAH,GAAQA,EANhB;AAAA,MAOAC,KAKEN,KAAK,CAAAO,UAZP;MAOAA,UAAU,GAAGD,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,KAPb;AAAA,MAQAE,EAAA,GAIER,KAAK,CAJkBZ,IARzB;MAQAA,IAAI,GAAGoB,EAAA,KAAA,KAAA,CAAA,GAAAnB,WAAW,CAACC,MAAZ,GAAkBkB,EARzB;AAAA,MASAC,KAGET,KAAK,CAAAR,QAZP;MASAA,QAAQ,GAAAiB,EAAA,KAAA,KAAA,CAAA,GAAG,cAAH,GAAsBA,EAT9B;AAAA,MAUAC,EAAA,GAEEV,KAAK,CAAAT,QAZP;MAUAA,QAAQ,GAAAmB,EAAA,KAAA,KAAA,CAAA,GAAG,cAAH,GAAsBA,EAV9B;AAAA,MAWAC,YAAY,GACVX,KAAK,CAAAW,YAZP,CAAA;AAcM,EAAA,IAAAC,QAAQ,GAAKC,oBAAoB,EAAA,SAAjC,CAAA;AACR,EAAA,oBAAOC,YAAY,eACjBxC,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAK,IAAA,SAAS,EAAE,yBACGyC,CAAAA,MADH,CACGd,SADH,EAEZ,UAFY,CAEZc,CAAAA,MAFY,CAEXX,oBAAoB,IAAIQ,QAAzB,GAAqC,6BAArC,GAAqE,EAFzD,EAGf,QAHe,CAAA;GAId,eAAAtC,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAK,IAAA,SAAS,EAAC,yBAAA;AAAf,GAAA,EACG,CAAAqC,YAAY,KAAA,IAAZ,IAAAA,YAAY,KAAZ,KAAA,CAAA,GAAA,KAAA,CAAA,GAAAA,YAAY,EAAZ,kBACCrC,6BAAC,WAAD,EAAA;AAAa,IAAA,SAAS,EAAED,SAAAA;GAF5B,CAAA,eAIEC,cAAC,CAAA,aAAA,CAAA,SAAD,EAAYM,IAAAA,EAAAA,QAAZ,CAJF,EAMI,CAAC2B,UAAD,iBACEjC,cAAA,CAAA,aAAA,CAAC,WAAD,EAAA;AACE,IAAA,QAAQ,EAAEY,QADZ;AAEE,IAAA,QAAQ,EAAEM,QAFZ;AAGE,IAAA,QAAQ,EAAED,QAHZ;AAIE,IAAA,UAAU,EAAEP,UAJd;AAKE,IAAA,IAAI,EAAEI,IAAAA;AALR,GAAA,CAPN,eAgBEd,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAK,IAAA,SAAS,EAAC,uBAAA;AAAf,GAAA,eACEA,6BAAC,UAAD,EAAA;AACE,IAAA,KAAK,EAAC,MADR;AAEE,IAAA,MAAM,EAAC,MAFT;AAGE,IAAA,OAAO,EAAEkB,QAAAA;AAHX,GAAA,eAKElB,6BAAC,IAAD,EAAA;IACE,IAAI,EAAE0C,SAAS,CAACC,KADlB;IAEE,SAAS,EAAEC,UAAU,CAACC,OAFxB;AAGE,IAAA,KAAK,EAAC,MAHR;AAIE,IAAA,MAAM,EAAC,MAAA;GATX,CAAA,CADF,CAhBF,CAJF,eAmCE7C,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;IACE,SAAS,EAAE,yDAAA,CAEP4B,qBAAqB,IAAI,wCAFlB,EAE0D,YAF1D,CADb;IAKE,OAAO,EAAE,UAACkB,CAAD,EAAE;AACTA,MAAAA,CAAC,SAAD,IAAAA,CAAC,KAAA,KAAA,CAAD,GAAC,KAAA,CAAD,GAAAA,CAAC,CAAEC,eAAH,EAAA,CAAA;;AACA,MAAA,IAAInB,qBAAJ,EAA2B;QACzBV,QAAQ,EAAA,CAAA;AACT,OAAA;AACF,KAAA;GA7CL,CAAA,CADiB,EAiDhB8B,QAAQ,CAACC,cAAT,CAAwBC,UAAxB,CAjDgB,CAAnB,CAAA;AAkDD;;;;"}
+{"version":3,"file":"Modal.js","sources":["../../src/ui/Modal/index.tsx"],"sourcesContent":["import React, { ReactElement, useContext } from 'react';\nimport { createPortal } from 'react-dom';\n\nimport './index.scss';\n\nimport { MODAL_ROOT } from '../../hooks/useModal/ModalRoot';\nimport { LocalizationContext } from '../../lib/LocalizationContext';\n\nimport Button, { ButtonTypes } from '../Button';\nimport Icon, { IconTypes, IconColors } from '../Icon';\nimport IconButton from '../IconButton';\nimport Label, { LabelTypography, LabelColors } from '../Label';\nimport { useMediaQueryContext } from '../../lib/MediaQueryContext';\n\nexport interface ModalHeaderProps {\n  titleText: string;\n}\nexport const ModalHeader = ({ titleText }: ModalHeaderProps): ReactElement => (\n  <div className=\"sendbird-modal__header\">\n    <Label type={LabelTypography.H_1} color={LabelColors.ONBACKGROUND_1}>\n      {titleText}\n    </Label>\n  </div>\n);\n\nexport interface ModalBodyProps {\n  children?: ReactElement;\n}\nexport const ModalBody = ({ children }: ModalBodyProps): ReactElement => (\n  <div className=\"sendbird-modal__body\">\n    <Label\n      type={LabelTypography.SUBTITLE_1}\n      color={LabelColors.ONBACKGROUND_2}\n    >\n      {children}\n    </Label>\n  </div>\n);\n\nexport interface ModalFooterProps {\n  submitText: string;\n  disabled?: boolean;\n  type?: ButtonTypes;\n  onCancel: () => void;\n  onSubmit: (e: SubmitEvent) => void;\n}\nexport const ModalFooter = ({\n  submitText,\n  disabled = false,\n  type = ButtonTypes.DANGER,\n  onSubmit,\n  onCancel,\n}: ModalFooterProps): ReactElement => {\n  const { stringSet } = useContext(LocalizationContext);\n  return (\n    <div className=\"sendbird-modal__footer\">\n      <Button type={ButtonTypes.SECONDARY} onClick={onCancel}>\n        <Label type={LabelTypography.BUTTON_1} color={LabelColors.ONBACKGROUND_1}>\n          {stringSet.BUTTON__CANCEL}\n        </Label>\n      </Button>\n      <Button type={type} disabled={disabled} onClick={onSubmit}>\n        {submitText}\n      </Button>\n    </div>\n  );\n};\n\nexport interface ModalProps {\n  children?: ReactElement;\n  className?: string;\n  isCloseOnClickOutside?: boolean;\n  isFullScreenOnMobile?: boolean;\n  titleText?: string;\n  submitText?: string;\n  disabled?: boolean;\n  hideFooter?: boolean;\n  type?: ButtonTypes;\n  onCancel?: () => void;\n  onSubmit?: (e: SubmitEvent) => void;\n  renderHeader?: () => ReactElement;\n}\nexport default function Modal(props: ModalProps): ReactElement {\n  const {\n    children = null,\n    className = '',\n    isCloseOnClickOutside = false,\n    isFullScreenOnMobile = false,\n    titleText,\n    submitText,\n    disabled = false,\n    hideFooter = false,\n    type = ButtonTypes.DANGER,\n    onCancel = () => { /* noop */ },\n    onSubmit = () => { /* noop */ },\n    renderHeader,\n  } = props;\n\n  const { isMobile } = useMediaQueryContext();\n  return createPortal((\n    <div className={`\n      sendbird-modal ${className}\n      ${(isFullScreenOnMobile && isMobile) ? 'sendbird-modal--full-mobile' : ''}\n    `}>\n      <div className=\"sendbird-modal__content\">\n        {renderHeader?.() || (\n          <ModalHeader titleText={titleText} />\n        )}\n        <ModalBody>{children}</ModalBody>\n        {\n          !hideFooter && (\n            <ModalFooter\n              disabled={disabled}\n              onCancel={onCancel}\n              onSubmit={onSubmit}\n              submitText={submitText}\n              type={type}\n            />\n          )\n        }\n        <div className=\"sendbird-modal__close\">\n          <IconButton\n            width=\"32px\"\n            height=\"32px\"\n            onClick={onCancel}\n          >\n            <Icon\n              type={IconTypes.CLOSE}\n              fillColor={IconColors.DEFAULT}\n              width=\"24px\"\n              height=\"24px\"\n            />\n          </IconButton>\n        </div>\n      </div>\n      <div\n        className={`\n          sendbird-modal__backdrop\n          ${isCloseOnClickOutside && 'sendbird-modal__backdrop--clickoutside'}\n        `}\n        onClick={(e) => {\n          e?.stopPropagation();\n          if (isCloseOnClickOutside) {\n            onCancel();\n          }\n        }}\n      />\n    </div>\n  ), document.getElementById(MODAL_ROOT));\n}\n"],"names":["ModalHeader","_ref","titleText","React","createElement","className","Label","type","LabelTypography","H_1","color","LabelColors","ONBACKGROUND_1","ModalBody","_ref2","children","SUBTITLE_1","ONBACKGROUND_2","ModalFooter","_ref3","submitText","disabled","ButtonTypes","DANGER","onSubmit","onCancel","stringSet","useContext","LocalizationContext","Button","SECONDARY","onClick","BUTTON_1","BUTTON__CANCEL","Modal","props","isCloseOnClickOutside","isFullScreenOnMobile","hideFooter","renderHeader","isMobile","useMediaQueryContext","createPortal","IconButton","width","height","Icon","IconTypes","CLOSE","fillColor","IconColors","DEFAULT","e","stopPropagation","document","getElementById","MODAL_ROOT"],"mappings":"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"}

package/ui/MutedAvatarOverlay.js

@@ -3,29 +3,29 @@ import Icon, { IconTypes, IconColors } from './Icon.js';
 import 'prop-types';
 
 function MutedAvatarOverlay(props) {
-  var _a = props.height,
-      height = _a === void 0 ? 24 : _a,
-      _b = props.width,
-      width = _b === void 0 ? 24 : _b;
+  const {
+    height = 24,
+    width = 24
+  } = props;
   return /*#__PURE__*/React__default.createElement("div", {
     className: "sendbird-muted-avatar",
     style: {
-      height: "".concat(height, "px"),
-      width: "".concat(width, "px")
+      height: `${height}px`,
+      width: `${width}px`
     }
   }, /*#__PURE__*/React__default.createElement("div", {
     className: "sendbird-muted-avatar__icon"
   }, /*#__PURE__*/React__default.createElement("div", {
     className: "sendbird-muted-avatar__bg",
     style: {
-      height: "".concat(height, "px"),
-      width: "".concat(width, "px")
+      height: `${height}px`,
+      width: `${width}px`
     }
   }), /*#__PURE__*/React__default.createElement(Icon, {
     type: IconTypes.MUTE,
     fillColor: IconColors.WHITE,
-    width: "".concat(height - 8, "px"),
-    height: "".concat(width - 8, "px")
+    width: `${height - 8}px`,
+    height: `${width - 8}px`
   })));
 }
 

package/ui/MutedAvatarOverlay.js.map

@@ -1 +1 @@
-{"version":3,"file":"MutedAvatarOverlay.js","sources":["../../src/ui/Avatar/MutedAvatarOverlay.tsx"],"sourcesContent":["import './muted-avatar-overlay.scss';\n\nimport React, { ReactElement } from 'react'\nimport Icon, { IconTypes, IconColors } from '../Icon';\n\ninterface Props {\n  height?: number;\n  width?: number;\n}\n\nexport default function MutedAvatarOverlay(props: Props): ReactElement {\n  const { height = 24, width = 24 } = props;\n  return (\n    <div\n      className=\"sendbird-muted-avatar\"\n      style={{\n        height: `${height}px`,\n        width: `${width}px`,\n      }}\n    >\n      <div className=\"sendbird-muted-avatar__icon\">\n        <div\n          className=\"sendbird-muted-avatar__bg\"\n          style={{\n            height: `${height}px`,\n            width: `${width}px`,\n          }}\n        />\n        <Icon\n          type={IconTypes.MUTE}\n          fillColor={IconColors.WHITE}\n          width={`${height - 8}px`}\n          height={`${width - 8}px`}\n        />\n      </div>\n    </div>\n  );\n}\n"],"names":["MutedAvatarOverlay","props","_a","height","_b","width","React","concat","IconTypes","MUTE","IconColors","WHITE"],"mappings":";;;;AAUwB,SAAAA,kBAAA,CAAmBC,KAAnB,EAA+B;AAC7C,EAAA,IAAAC,KAA4BD,KAAK,CAAAE,MAAjC;MAAAA,MAAM,mBAAG,KAAED,EAAX;AAAA,MAAaE,EAAA,GAAeH,KAAK,CAAVI,KAAvB;MAAaA,KAAK,GAAGD,EAAA,KAAA,KAAA,CAAA,GAAA,EAAA,KAArB,CAAA;EACR,oBACEE,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AACE,IAAA,SAAS,EAAC,uBADZ;AAEE,IAAA,KAAK,EAAE;AACLH,MAAAA,MAAM,EAAE,EAAGI,CAAAA,MAAH,CAAGJ,MAAH,EAAa,IAAb,CADH;AAELE,MAAAA,KAAK,EAAE,EAAGE,CAAAA,MAAH,CAAGF,KAAH,EAAY,IAAZ,CAAA;AAFF,KAAA;GAKP,eAAAC,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AAAK,IAAA,SAAS,EAAC,6BAAA;GACb,eAAAA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AACE,IAAA,SAAS,EAAC,2BADZ;AAEE,IAAA,KAAK,EAAE;AACLH,MAAAA,MAAM,EAAE,EAAGI,CAAAA,MAAH,CAAGJ,MAAH,EAAa,IAAb,CADH;AAELE,MAAAA,KAAK,EAAE,EAAGE,CAAAA,MAAH,CAAGF,KAAH,EAAY,IAAZ,CAAA;AAFF,KAAA;GAHX,CAAA,eAQEC,6BAAC,IAAD,EAAA;IACE,IAAI,EAAEE,SAAS,CAACC,IADlB;IAEE,SAAS,EAAEC,UAAU,CAACC,KAFxB;IAGE,KAAK,EAAE,GAAGJ,MAAH,CAAGJ,MAAM,GAAG,CAAZ,MAAA,CAHT;IAIE,MAAM,EAAE,GAAGI,MAAH,CAAGF,KAAK,GAAG,CAAX,EAAY,IAAZ,CAAA;AAJV,GAAA,CARF,CAPF,CADF,CAAA;AAyBD;;;;"}
+{"version":3,"file":"MutedAvatarOverlay.js","sources":["../../src/ui/Avatar/MutedAvatarOverlay.tsx"],"sourcesContent":["import './muted-avatar-overlay.scss';\n\nimport React, { ReactElement } from 'react';\nimport Icon, { IconTypes, IconColors } from '../Icon';\n\ninterface Props {\n  height?: number;\n  width?: number;\n}\n\nexport default function MutedAvatarOverlay(props: Props): ReactElement {\n  const { height = 24, width = 24 } = props;\n  return (\n    <div\n      className=\"sendbird-muted-avatar\"\n      style={{\n        height: `${height}px`,\n        width: `${width}px`,\n      }}\n    >\n      <div className=\"sendbird-muted-avatar__icon\">\n        <div\n          className=\"sendbird-muted-avatar__bg\"\n          style={{\n            height: `${height}px`,\n            width: `${width}px`,\n          }}\n        />\n        <Icon\n          type={IconTypes.MUTE}\n          fillColor={IconColors.WHITE}\n          width={`${height - 8}px`}\n          height={`${width - 8}px`}\n        />\n      </div>\n    </div>\n  );\n}\n"],"names":["MutedAvatarOverlay","props","height","width","React","createElement","className","style","Icon","type","IconTypes","MUTE","fillColor","IconColors","WHITE"],"mappings":";;;;AAUe,SAASA,kBAAkBA,CAACC,KAAY,EAAgB;EACrE,MAAM;AAAEC,IAAAA,MAAM,GAAG,EAAE;AAAEC,IAAAA,KAAK,GAAG,EAAA;AAAG,GAAC,GAAGF,KAAK,CAAA;EACzC,oBACEG,cAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AACEC,IAAAA,SAAS,EAAC,uBAAuB;AACjCC,IAAAA,KAAK,EAAE;MACLL,MAAM,EAAG,CAAEA,EAAAA,MAAO,CAAG,EAAA,CAAA;MACrBC,KAAK,EAAG,GAAEA,KAAM,CAAA,EAAA,CAAA;AAClB,KAAA;GAEAC,eAAAA,cAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AAAKC,IAAAA,SAAS,EAAC,6BAAA;GACbF,eAAAA,cAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AACEC,IAAAA,SAAS,EAAC,2BAA2B;AACrCC,IAAAA,KAAK,EAAE;MACLL,MAAM,EAAG,CAAEA,EAAAA,MAAO,CAAG,EAAA,CAAA;MACrBC,KAAK,EAAG,GAAEA,KAAM,CAAA,EAAA,CAAA;AAClB,KAAA;AAAE,GAAA,CACF,eACFC,cAAA,CAAAC,aAAA,CAACG,IAAI,EAAA;IACHC,IAAI,EAAEC,SAAS,CAACC,IAAK;IACrBC,SAAS,EAAEC,UAAU,CAACC,KAAM;AAC5BX,IAAAA,KAAK,EAAG,CAAA,EAAED,MAAM,GAAG,CAAE,CAAI,EAAA,CAAA;AACzBA,IAAAA,MAAM,EAAG,CAAA,EAAEC,KAAK,GAAG,CAAE,CAAA,EAAA,CAAA;AAAI,GAAA,CACzB,CACE,CACF,CAAA;AAEV;;;;"}

package/ui/OGMessageItemBody.js

@@ -1,95 +1,99 @@
-import React__default, { useContext, useMemo } from 'react';
-import Word from './Word.js';
+import React__default, { useRef, useContext, useMemo } from 'react';
 import ImageRenderer from './ImageRenderer.js';
 import Icon, { IconTypes } from './Icon.js';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../index-44470dab.js';
-import { u as uuidv4 } from '../uuid-286ed926.js';
-import { h as getClassName, d as isEditedMessage } from '../index-5f08f486.js';
-import { a as LocalizationContext } from '../LocalizationContext-4df0cc32.js';
-import './LinkLabel.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../index-e1cd2fcf.js';
+import { j as getClassName, e as isEditedMessage } from '../index-fd51c7d1.js';
+import { a as LocalizationContext } from '../LocalizationContext-1839d2db.js';
+import { T as TextFragment } from '../index-3130ac38.js';
+import { t as tokenizeMessage } from '../tokenize-7056afb7.js';
+import { O as OG_MESSAGE_BODY_CLASSNAME } from '../consts-d46e0fc1.js';
 import 'prop-types';
+import '../stringSet-d368e289.js';
+import '../_rollupPluginBabelHelpers-ce69e916.js';
+import '../utils/message/getOutgoingMessageState.js';
+import '../index-d9c12cf4.js';
+import '../index.module-8c144786.js';
+import '../Message/context.js';
 import './MentionLabel.js';
 import './ContextMenu.js';
-import '../tslib.es6-bcead7e6.js';
 import 'react-dom';
 import './SortByRow.js';
-import '../utils/message/getOutgoingMessageState.js';
-import '../stringSet-d555d877.js';
+import '../uuid-720c99c0.js';
 import './UserProfile.js';
-import '../UserProfileContext-c58a7b86.js';
+import '../UserProfileContext-7e645551.js';
 import '../sendbirdSelectors.js';
-import '../topics-351ea731.js';
-import '../utils-e720e03a.js';
+import '../topics-f9628f1f.js';
+import '../utils-256f157f.js';
 import './Avatar.js';
 import './Button.js';
 import '../useSendbirdStateContext.js';
 import '../withSendbird.js';
-import '../_rollupPluginBabelHelpers-498add61.js';
-import '../index-07e060cd.js';
-
-function OGMessageItemBody(_a) {
-  var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
-
-  var className = _a.className,
-      message = _a.message,
-      _m = _a.isByMe,
-      isByMe = _m === void 0 ? false : _m,
-      _o = _a.mouseHover,
-      mouseHover = _o === void 0 ? false : _o,
-      _p = _a.isMentionEnabled,
-      isMentionEnabled = _p === void 0 ? false : _p,
-      _q = _a.isReactionEnabled,
-      isReactionEnabled = _q === void 0 ? false : _q;
-  var stringSet = useContext(LocalizationContext).stringSet;
-
-  var openOGUrl = function () {
-    var _a, _b;
+import './LinkLabel.js';
 
-    if ((_a = message === null || message === void 0 ? void 0 : message.ogMetaData) === null || _a === void 0 ? void 0 : _a.url) window.open((_b = message === null || message === void 0 ? void 0 : message.ogMetaData) === null || _b === void 0 ? void 0 : _b.url);
+function OGMessageItemBody(_ref) {
+  var _message$mentionedMes, _message$mentionedUse, _message$reactions, _message$ogMetaData3, _message$ogMetaData3$, _message$ogMetaData4, _message$ogMetaData4$, _message$ogMetaData5, _message$ogMetaData5$, _message$ogMetaData6, _message$ogMetaData7, _message$ogMetaData8;
+  let {
+    className,
+    message,
+    isByMe = false,
+    mouseHover = false,
+    isMentionEnabled = false,
+    isReactionEnabled = false,
+    onMessageHeightChange = () => {/* noop */}
+  } = _ref;
+  const imageRef = useRef(null);
+  const {
+    stringSet
+  } = useContext(LocalizationContext);
+  const openOGUrl = () => {
+    var _message$ogMetaData, _message$ogMetaData2;
+    if (message !== null && message !== void 0 && (_message$ogMetaData = message.ogMetaData) !== null && _message$ogMetaData !== void 0 && _message$ogMetaData.url) window.open(message === null || message === void 0 ? void 0 : (_message$ogMetaData2 = message.ogMetaData) === null || _message$ogMetaData2 === void 0 ? void 0 : _message$ogMetaData2.url);
   };
-
-  var isMessageMentioned = isMentionEnabled && ((_b = message === null || message === void 0 ? void 0 : message.mentionedMessageTemplate) === null || _b === void 0 ? void 0 : _b.length) > 0 && ((_c = message === null || message === void 0 ? void 0 : message.mentionedUsers) === null || _c === void 0 ? void 0 : _c.length) > 0;
-  var sentences = useMemo(function () {
-    var _a, _b;
-
+  const isMessageMentioned = isMentionEnabled && (message === null || message === void 0 ? void 0 : (_message$mentionedMes = message.mentionedMessageTemplate) === null || _message$mentionedMes === void 0 ? void 0 : _message$mentionedMes.length) > 0 && (message === null || message === void 0 ? void 0 : (_message$mentionedUse = message.mentionedUsers) === null || _message$mentionedUse === void 0 ? void 0 : _message$mentionedUse.length) > 0;
+  const tokens = useMemo(() => {
     if (isMessageMentioned) {
-      return (_a = message === null || message === void 0 ? void 0 : message.mentionedMessageTemplate) === null || _a === void 0 ? void 0 : _a.split(/\n/).map(function (sentence) {
-        return sentence.split(/\s/);
+      return tokenizeMessage({
+        mentionedUsers: message === null || message === void 0 ? void 0 : message.mentionedUsers,
+        messageText: message === null || message === void 0 ? void 0 : message.mentionedMessageTemplate
       });
     }
-
-    return (_b = message === null || message === void 0 ? void 0 : message.message) === null || _b === void 0 ? void 0 : _b.split(/\n/).map(function (sentence) {
-      return sentence.split(/\s/);
+    return tokenizeMessage({
+      messageText: message === null || message === void 0 ? void 0 : message.message
     });
-  }, [message === null || message === void 0 ? void 0 : message.mentionedMessageTemplate]);
+  }, [message === null || message === void 0 ? void 0 : message.updatedAt]);
   return /*#__PURE__*/React__default.createElement("div", {
-    className: getClassName([className, 'sendbird-og-message-item-body', isByMe ? 'outgoing' : 'incoming', mouseHover ? 'mouse-hover' : '', isReactionEnabled && ((_d = message === null || message === void 0 ? void 0 : message.reactions) === null || _d === void 0 ? void 0 : _d.length) > 0 ? 'reactions' : ''])
+    className: getClassName([className, 'sendbird-og-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, {
-    key: uuidv4(),
     type: LabelTypography.BODY_1,
     color: isByMe ? LabelColors.ONCONTENT_1 : LabelColors.ONBACKGROUND_1
   }, /*#__PURE__*/React__default.createElement("div", {
-    className: "sendbird-og-message-item-body__text-bubble"
-  }, sentences === null || sentences === void 0 ? void 0 : sentences.map(function (sentence, index) {
-    return [sentence === null || sentence === void 0 ? void 0 : sentence.map(function (word) {
-      return /*#__PURE__*/React__default.createElement(Word, {
-        key: uuidv4(),
-        word: word,
-        message: message,
-        isByMe: isByMe
-      });
-    }), (sentences === null || sentences === void 0 ? void 0 : sentences[index + 1]) ? /*#__PURE__*/React__default.createElement("br", null) : null];
+    className: OG_MESSAGE_BODY_CLASSNAME
+  }, /*#__PURE__*/React__default.createElement(TextFragment, {
+    tokens: tokens
   }), isEditedMessage(message) && /*#__PURE__*/React__default.createElement(Label, {
     className: "sendbird-og-message-item-body__text-bubble__message",
     type: LabelTypography.BODY_1,
     color: isByMe ? LabelColors.ONCONTENT_2 : LabelColors.ONBACKGROUND_2
-  }, " ".concat(stringSet.MESSAGE_EDITED, " ")))), /*#__PURE__*/React__default.createElement("div", {
-    className: "sendbird-og-message-item-body__og-thumbnail",
+  }, ` ${stringSet.MESSAGE_EDITED} `))), /*#__PURE__*/React__default.createElement("div", {
+    ref: imageRef,
+    className: `sendbird-og-message-item-body__og-thumbnail
+          ${message !== null && message !== void 0 && (_message$ogMetaData3 = message.ogMetaData) !== null && _message$ogMetaData3 !== void 0 && (_message$ogMetaData3$ = _message$ogMetaData3.defaultImage) !== null && _message$ogMetaData3$ !== void 0 && _message$ogMetaData3$.url ? '' : 'sendbird-og-message-item-body__og-thumbnail__empty'}
+        `,
     onClick: openOGUrl
   }, /*#__PURE__*/React__default.createElement(ImageRenderer, {
+    onLoad: onMessageHeightChange,
+    onError: () => {
+      try {
+        var _imageRef$current, _imageRef$current$cla;
+        imageRef === null || imageRef === void 0 ? void 0 : (_imageRef$current = imageRef.current) === null || _imageRef$current === void 0 ? void 0 : (_imageRef$current$cla = _imageRef$current.classList) === null || _imageRef$current$cla === void 0 ? void 0 : _imageRef$current$cla.add('sendbird-og-message-item-body__og-thumbnail__empty');
+      } catch (error) {
+        // do nothing
+      }
+    },
     className: "sendbird-og-message-item-body__og-thumbnail__image",
-    url: ((_f = (_e = message === null || message === void 0 ? void 0 : message.ogMetaData) === null || _e === void 0 ? void 0 : _e.defaultImage) === null || _f === void 0 ? void 0 : _f.url) || '',
-    alt: (_h = (_g = message === null || message === void 0 ? void 0 : message.ogMetaData) === null || _g === void 0 ? void 0 : _g.defaultImage) === null || _h === void 0 ? void 0 : _h.alt // TODO: Change fixing width and height lengths
+    url: (message === null || message === void 0 ? void 0 : (_message$ogMetaData4 = message.ogMetaData) === null || _message$ogMetaData4 === void 0 ? void 0 : (_message$ogMetaData4$ = _message$ogMetaData4.defaultImage) === null || _message$ogMetaData4$ === void 0 ? void 0 : _message$ogMetaData4$.url) || '',
+    alt: message === null || message === void 0 ? void 0 : (_message$ogMetaData5 = message.ogMetaData) === null || _message$ogMetaData5 === void 0 ? void 0 : (_message$ogMetaData5$ = _message$ogMetaData5.defaultImage) === null || _message$ogMetaData5$ === void 0 ? void 0 : _message$ogMetaData5$.alt
+    // TODO: Change fixing width and height lengths
     ,
     defaultComponent: /*#__PURE__*/React__default.createElement("div", {
       className: "sendbird-og-message-item-body__og-thumbnail__place-holder"
@@ -102,15 +106,15 @@ function OGMessageItemBody(_a) {
   })), /*#__PURE__*/React__default.createElement("div", {
     className: "sendbird-og-message-item-body__description",
     onClick: openOGUrl
-  }, ((_j = message === null || message === void 0 ? void 0 : message.ogMetaData) === null || _j === void 0 ? void 0 : _j.title) && /*#__PURE__*/React__default.createElement(Label, {
+  }, (message === null || message === void 0 ? void 0 : (_message$ogMetaData6 = message.ogMetaData) === null || _message$ogMetaData6 === void 0 ? void 0 : _message$ogMetaData6.title) && /*#__PURE__*/React__default.createElement(Label, {
     className: "sendbird-og-message-item-body__description__title",
     type: LabelTypography.SUBTITLE_2,
     color: LabelColors.ONBACKGROUND_1
-  }, message.ogMetaData.title), ((_k = message === null || message === void 0 ? void 0 : message.ogMetaData) === null || _k === void 0 ? void 0 : _k.description) && /*#__PURE__*/React__default.createElement(Label, {
+  }, message.ogMetaData.title), (message === null || message === void 0 ? void 0 : (_message$ogMetaData7 = message.ogMetaData) === null || _message$ogMetaData7 === void 0 ? void 0 : _message$ogMetaData7.description) && /*#__PURE__*/React__default.createElement(Label, {
     className: "sendbird-og-message-item-body__description__description",
     type: LabelTypography.BODY_2,
     color: LabelColors.ONBACKGROUND_1
-  }, message.ogMetaData.description), ((_l = message === null || message === void 0 ? void 0 : message.ogMetaData) === null || _l === void 0 ? void 0 : _l.url) && /*#__PURE__*/React__default.createElement(Label, {
+  }, message.ogMetaData.description), (message === null || message === void 0 ? void 0 : (_message$ogMetaData8 = message.ogMetaData) === null || _message$ogMetaData8 === void 0 ? void 0 : _message$ogMetaData8.url) && /*#__PURE__*/React__default.createElement(Label, {
     className: "sendbird-og-message-item-body__description__url",
     type: LabelTypography.CAPTION_3,
     color: LabelColors.ONBACKGROUND_2

package/ui/OGMessageItemBody.js.map

@@ -1 +1 @@
-{"version":3,"file":"OGMessageItemBody.js","sources":["../../src/ui/OGMessageItemBody/index.tsx"],"sourcesContent":["import './index.scss';\nimport React, { ReactElement, useContext, useMemo } from 'react';\nimport type { UserMessage } from '@sendbird/chat/message';\n\nimport Word from '../Word';\nimport ImageRenderer from '../ImageRenderer';\nimport Icon, { IconTypes } from '../Icon';\nimport Label, { LabelTypography, LabelColors } from '../Label';\nimport uuidv4 from '../../utils/uuid';\nimport { getClassName, isEditedMessage } from '../../utils';\nimport { LocalizationContext } from '../../lib/LocalizationContext';\n\ninterface Props {\n  className?: string | Array<string>;\n  message: UserMessage;\n  isByMe?: boolean;\n  mouseHover?: boolean;\n  isMentionEnabled?: boolean;\n  isReactionEnabled?: boolean;\n}\n\nexport default function OGMessageItemBody({\n  className,\n  message,\n  isByMe = false,\n  mouseHover = false,\n  isMentionEnabled = false,\n  isReactionEnabled = false,\n}: Props): ReactElement {\n  const { stringSet } = useContext(LocalizationContext);\n  const openOGUrl = (): void => {\n    if (message?.ogMetaData?.url) window.open(message?.ogMetaData?.url);\n  };\n  const isMessageMentioned = isMentionEnabled && message?.mentionedMessageTemplate?.length > 0 && message?.mentionedUsers?.length > 0;\n  const sentences: Array<Array<string>> = useMemo(() => {\n    if (isMessageMentioned) {\n      return message?.mentionedMessageTemplate?.split(/\\n/).map((sentence) => sentence.split(/\\s/));\n    }\n    return message?.message?.split(/\\n/).map((sentence) => sentence.split(/\\s/));\n  }, [message?.mentionedMessageTemplate]);\n  return (\n    <div className={getClassName([\n      className,\n      'sendbird-og-message-item-body',\n      isByMe ? 'outgoing' : 'incoming',\n      mouseHover ? 'mouse-hover' : '',\n      (isReactionEnabled && message?.reactions?.length > 0) ? 'reactions' : '',\n    ])}>\n      <Label\n        key={uuidv4()}\n        type={LabelTypography.BODY_1}\n        color={isByMe ? LabelColors.ONCONTENT_1 : LabelColors.ONBACKGROUND_1}\n      >\n        <div className=\"sendbird-og-message-item-body__text-bubble\">\n          {\n            sentences?.map((sentence, index) => {\n              return [\n                sentence?.map((word) => {\n                  return (\n                    <Word\n                      key={uuidv4()}\n                      word={word}\n                      message={message}\n                      isByMe={isByMe}\n                    />\n                  );\n                }),\n                sentences?.[index + 1] ? <br /> : null,\n              ]\n            })\n          }\n          {\n            isEditedMessage(message) && (\n              <Label\n                className=\"sendbird-og-message-item-body__text-bubble__message\"\n                type={LabelTypography.BODY_1}\n                color={isByMe ? LabelColors.ONCONTENT_2 : LabelColors.ONBACKGROUND_2}\n              >\n                {` ${stringSet.MESSAGE_EDITED} `}\n              </Label>\n            )\n          }\n        </div>\n      </Label>\n      <div\n        className=\"sendbird-og-message-item-body__og-thumbnail\"\n        onClick={openOGUrl}\n      >\n        <ImageRenderer\n          className=\"sendbird-og-message-item-body__og-thumbnail__image\"\n          url={message?.ogMetaData?.defaultImage?.url || ''}\n          alt={message?.ogMetaData?.defaultImage?.alt}\n          // TODO: Change fixing width and height lengths\n          defaultComponent={(\n            <div className=\"sendbird-og-message-item-body__og-thumbnail__place-holder\">\n              <Icon\n                className=\"sendbird-og-message-item-body__og-thumbnail__place-holder__icon\"\n                type={IconTypes.THUMBNAIL_NONE}\n                width=\"56px\"\n                height=\"56px\"\n              />\n            </div>\n          )}\n        />\n      </div>\n      <div\n        className=\"sendbird-og-message-item-body__description\"\n        onClick={openOGUrl}\n      >\n        {message?.ogMetaData?.title && (\n          <Label\n            className=\"sendbird-og-message-item-body__description__title\"\n            type={LabelTypography.SUBTITLE_2}\n            color={LabelColors.ONBACKGROUND_1}\n          >\n            {message.ogMetaData.title}\n          </Label>\n        )}\n        {message?.ogMetaData?.description && (\n          <Label\n            className=\"sendbird-og-message-item-body__description__description\"\n            type={LabelTypography.BODY_2}\n            color={LabelColors.ONBACKGROUND_1}\n          >\n            {message.ogMetaData.description}\n          </Label>\n        )}\n        {message?.ogMetaData?.url && (\n          <Label\n            className=\"sendbird-og-message-item-body__description__url\"\n            type={LabelTypography.CAPTION_3}\n            color={LabelColors.ONBACKGROUND_2}\n          >\n            {message.ogMetaData.url}\n          </Label>\n        )}\n      </div>\n      <div className=\"sendbird-og-message-item-body__cover\" />\n    </div>\n  );\n}\n"],"names":["OGMessageItemBody","_a","className","message","_m","isByMe","_o","mouseHover","_p","isMentionEnabled","_q","isReactionEnabled","stringSet","useContext","LocalizationContext","openOGUrl","ogMetaData","url","window","open","_b","isMessageMentioned","mentionedMessageTemplate","length","_c","mentionedUsers","sentences","useMemo","split","map","sentence","React","getClassName","_d","reactions","uuidv4","LabelTypography","BODY_1","LabelColors","ONCONTENT_1","ONBACKGROUND_1","index","word","isEditedMessage","ONCONTENT_2","ONBACKGROUND_2","concat","MESSAGE_EDITED","_f","_e","defaultImage","_g","_h","alt","IconTypes","THUMBNAIL_NONE","_j","title","SUBTITLE_2","_k","description","BODY_2","_l","CAPTION_3"],"mappings":"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"}
+{"version":3,"file":"OGMessageItemBody.js","sources":["../../src/ui/OGMessageItemBody/index.tsx"],"sourcesContent":["import './index.scss';\nimport React, {\n  ReactElement,\n  useContext,\n  useMemo,\n  useRef,\n} from 'react';\nimport type { UserMessage } from '@sendbird/chat/message';\n\nimport ImageRenderer from '../ImageRenderer';\nimport Icon, { IconTypes } from '../Icon';\nimport Label, { LabelTypography, LabelColors } from '../Label';\nimport { getClassName, isEditedMessage } from '../../utils';\nimport { LocalizationContext } from '../../lib/LocalizationContext';\nimport TextFragment from '../../modules/Message/components/TextFragment';\nimport { tokenizeMessage } from '../../modules/Message/utils/tokens/tokenize';\nimport { OG_MESSAGE_BODY_CLASSNAME } from './consts';\n\ninterface Props {\n  className?: string | Array<string>;\n  message: UserMessage;\n  isByMe?: boolean;\n  mouseHover?: boolean;\n  isMentionEnabled?: boolean;\n  isReactionEnabled?: boolean;\n  onMessageHeightChange?: () => void;\n}\n\nexport default function OGMessageItemBody({\n  className,\n  message,\n  isByMe = false,\n  mouseHover = false,\n  isMentionEnabled = false,\n  isReactionEnabled = false,\n  onMessageHeightChange = () => { /* noop */ },\n}: Props): ReactElement {\n  const imageRef = useRef<HTMLDivElement>(null);\n  const { stringSet } = useContext(LocalizationContext);\n  const openOGUrl = (): void => {\n    if (message?.ogMetaData?.url) window.open(message?.ogMetaData?.url);\n  };\n  const isMessageMentioned = isMentionEnabled && message?.mentionedMessageTemplate?.length > 0 && message?.mentionedUsers?.length > 0;\n  const tokens = useMemo(() => {\n    if (isMessageMentioned) {\n      return tokenizeMessage({\n        mentionedUsers: message?.mentionedUsers,\n        messageText: message?.mentionedMessageTemplate,\n      });\n    }\n    return tokenizeMessage({\n      messageText: message?.message,\n    });\n  }, [message?.updatedAt]);\n  return (\n    <div className={getClassName([\n      className,\n      'sendbird-og-message-item-body',\n      isByMe ? 'outgoing' : 'incoming',\n      mouseHover ? 'mouse-hover' : '',\n      (isReactionEnabled && message?.reactions?.length > 0) ? 'reactions' : '',\n    ])}>\n      <Label\n        type={LabelTypography.BODY_1}\n        color={isByMe ? LabelColors.ONCONTENT_1 : LabelColors.ONBACKGROUND_1}\n      >\n        <div className={OG_MESSAGE_BODY_CLASSNAME}>\n          <TextFragment tokens={tokens} />\n          {\n            isEditedMessage(message) && (\n              <Label\n                className=\"sendbird-og-message-item-body__text-bubble__message\"\n                type={LabelTypography.BODY_1}\n                color={isByMe ? LabelColors.ONCONTENT_2 : LabelColors.ONBACKGROUND_2}\n              >\n                {` ${stringSet.MESSAGE_EDITED} `}\n              </Label>\n            )\n          }\n        </div>\n      </Label>\n      <div\n        ref={imageRef}\n        className={`sendbird-og-message-item-body__og-thumbnail\n          ${message?.ogMetaData?.defaultImage?.url ? '' : 'sendbird-og-message-item-body__og-thumbnail__empty'}\n        `}\n        onClick={openOGUrl}\n      >\n        <ImageRenderer\n          onLoad={onMessageHeightChange}\n          onError={() => {\n            try {\n              imageRef?.current?.classList?.add('sendbird-og-message-item-body__og-thumbnail__empty');\n            } catch (error) {\n              // do nothing\n            }\n          }}\n          className=\"sendbird-og-message-item-body__og-thumbnail__image\"\n          url={message?.ogMetaData?.defaultImage?.url || ''}\n          alt={message?.ogMetaData?.defaultImage?.alt}\n          // TODO: Change fixing width and height lengths\n          defaultComponent={(\n            <div className=\"sendbird-og-message-item-body__og-thumbnail__place-holder\">\n              <Icon\n                className=\"sendbird-og-message-item-body__og-thumbnail__place-holder__icon\"\n                type={IconTypes.THUMBNAIL_NONE}\n                width=\"56px\"\n                height=\"56px\"\n              />\n            </div>\n          )}\n        />\n      </div>\n      <div\n        className=\"sendbird-og-message-item-body__description\"\n        onClick={openOGUrl}\n      >\n        {message?.ogMetaData?.title && (\n          <Label\n            className=\"sendbird-og-message-item-body__description__title\"\n            type={LabelTypography.SUBTITLE_2}\n            color={LabelColors.ONBACKGROUND_1}\n          >\n            {message.ogMetaData.title}\n          </Label>\n        )}\n        {message?.ogMetaData?.description && (\n          <Label\n            className=\"sendbird-og-message-item-body__description__description\"\n            type={LabelTypography.BODY_2}\n            color={LabelColors.ONBACKGROUND_1}\n          >\n            {message.ogMetaData.description}\n          </Label>\n        )}\n        {message?.ogMetaData?.url && (\n          <Label\n            className=\"sendbird-og-message-item-body__description__url\"\n            type={LabelTypography.CAPTION_3}\n            color={LabelColors.ONBACKGROUND_2}\n          >\n            {message.ogMetaData.url}\n          </Label>\n        )}\n      </div>\n      <div className=\"sendbird-og-message-item-body__cover\" />\n    </div>\n  );\n}\n"],"names":["OGMessageItemBody","_ref","_message$mentionedMes","_message$mentionedUse","_message$reactions","_message$ogMetaData3","_message$ogMetaData3$","_message$ogMetaData4","_message$ogMetaData4$","_message$ogMetaData5","_message$ogMetaData5$","_message$ogMetaData6","_message$ogMetaData7","_message$ogMetaData8","className","message","isByMe","mouseHover","isMentionEnabled","isReactionEnabled","onMessageHeightChange","imageRef","useRef","stringSet","useContext","LocalizationContext","openOGUrl","_message$ogMetaData","_message$ogMetaData2","ogMetaData","url","window","open","isMessageMentioned","mentionedMessageTemplate","length","mentionedUsers","tokens","useMemo","tokenizeMessage","messageText","updatedAt","React","createElement","getClassName","reactions","Label","type","LabelTypography","BODY_1","color","LabelColors","ONCONTENT_1","ONBACKGROUND_1","OG_MESSAGE_BODY_CLASSNAME","TextFragment","isEditedMessage","ONCONTENT_2","ONBACKGROUND_2","MESSAGE_EDITED","ref","defaultImage","onClick","ImageRenderer","onLoad","onError","_imageRef$current","_imageRef$current$cla","current","classList","add","error","alt","defaultComponent","Icon","IconTypes","THUMBNAIL_NONE","width","height","title","SUBTITLE_2","description","BODY_2","CAPTION_3"],"mappings":"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"}

package/ui/OpenChannelAdminMessage.js

@@ -1,14 +1,15 @@
-import { a as __spreadArray } from '../tslib.es6-bcead7e6.js';
 import React__default from 'react';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../index-44470dab.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../index-e1cd2fcf.js';
 import 'prop-types';
-import '../stringSet-d555d877.js';
+import '../stringSet-d368e289.js';
 
-function OpenChannelAdminMessage(_a) {
-  var className = _a.className,
-      message = _a.message;
+function OpenChannelAdminMessage(_ref) {
+  let {
+    className,
+    message
+  } = _ref;
   return /*#__PURE__*/React__default.createElement("div", {
-    className: __spreadArray(__spreadArray([], Array.isArray(className) ? className : [className], true), ['sendbird-openchannel-admin-message'], false).join(' ')
+    className: [...(Array.isArray(className) ? className : [className]), 'sendbird-openchannel-admin-message'].join(' ')
   }, /*#__PURE__*/React__default.createElement(Label, {
     className: "sendbird-openchannel-admin-message__text",
     type: LabelTypography.CAPTION_2,

package/ui/OpenChannelAdminMessage.js.map

@@ -1 +1 @@
-{"version":3,"file":"OpenChannelAdminMessage.js","sources":["../../src/ui/OpenChannelAdminMessage/index.tsx"],"sourcesContent":["import React, { ReactElement } from 'react';\nimport { AdminMessage } from '@sendbird/chat/message';\nimport './index.scss';\n\nimport Label, { LabelColors, LabelTypography } from '../Label';\n\ninterface Props {\n  className?: string | Array<string>;\n  message: AdminMessage;\n}\n\nexport default function OpenChannelAdminMessage({\n  className,\n  message,\n}: Props): ReactElement {\n  return (\n    <div\n      className={[\n        ...(Array.isArray(className) ? className : [className]),\n        'sendbird-openchannel-admin-message',\n      ].join(' ')}\n    >\n      <Label\n        className=\"sendbird-openchannel-admin-message__text\"\n        type={LabelTypography.CAPTION_2}\n        color={LabelColors.ONBACKGROUND_2}\n      >\n        {message.message || ''}\n      </Label>\n    </div>\n  );\n}\n"],"names":["OpenChannelAdminMessage","_a","className","message","React","__spreadArray","Array","isArray","join","LabelTypography","CAPTION_2","LabelColors","ONBACKGROUND_2"],"mappings":";;;;;;AAWwB,SAAAA,uBAAA,CAAwBC,EAAxB,EAGhB;MAFNC,SAAS,GAAAD,EAAA,CAAAC;MACTC,OAAO,GAAAF,EAAA,CAAAE;EAEP,oBACEC,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AACE,IAAA,SAAS,EAAEC,aAAA,CAAAA,aAAA,CAAA,EAAA,EACLC,KAAK,CAACC,OAAN,CAAcL,SAAd,IAA2BA,SAA3B,GAAuC,CAACA,SAAD,CADlC,EAC8C,IAD9C,CAAA,EAC8C,CACvD,oCADuD,CAD9C,EAGT,KAHS,CAAA,CAGTM,IAHS,CAGJ,GAHI,CAAA;AADb,GAAA,eAMEJ,6BAAC,KAAD,EAAA;AACE,IAAA,SAAS,EAAC,0CADZ;IAEE,IAAI,EAAEK,eAAe,CAACC,SAFxB;IAGE,KAAK,EAAEC,WAAW,CAACC,cAAAA;AAHrB,GAAA,EAKGT,OAAO,CAACA,OAAR,IAAmB,EALtB,CANF,CADF,CAAA;AAgBD;;;;"}
+{"version":3,"file":"OpenChannelAdminMessage.js","sources":["../../src/ui/OpenChannelAdminMessage/index.tsx"],"sourcesContent":["import React, { ReactElement } from 'react';\nimport { AdminMessage } from '@sendbird/chat/message';\nimport './index.scss';\n\nimport Label, { LabelColors, LabelTypography } from '../Label';\n\ninterface Props {\n  className?: string | Array<string>;\n  message: AdminMessage;\n}\n\nexport default function OpenChannelAdminMessage({\n  className,\n  message,\n}: Props): ReactElement {\n  return (\n    <div\n      className={[\n        ...(Array.isArray(className) ? className : [className]),\n        'sendbird-openchannel-admin-message',\n      ].join(' ')}\n    >\n      <Label\n        className=\"sendbird-openchannel-admin-message__text\"\n        type={LabelTypography.CAPTION_2}\n        color={LabelColors.ONBACKGROUND_2}\n      >\n        {message.message || ''}\n      </Label>\n    </div>\n  );\n}\n"],"names":["OpenChannelAdminMessage","_ref","className","message","React","createElement","Array","isArray","join","Label","type","LabelTypography","CAPTION_2","color","LabelColors","ONBACKGROUND_2"],"mappings":";;;;;AAWe,SAASA,uBAAuBA,CAAAC,IAAA,EAGvB;EAAA,IAHwB;IAC9CC,SAAS;AACTC,IAAAA,OAAAA;AACK,GAAC,GAAAF,IAAA,CAAA;EACN,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,oCAAoC,CACrC,CAACM,IAAI,CAAC,GAAG,CAAA;AAAE,GAAA,eAEZJ,cAAA,CAAAC,aAAA,CAACI,KAAK,EAAA;AACJP,IAAAA,SAAS,EAAC,0CAA0C;IACpDQ,IAAI,EAAEC,eAAe,CAACC,SAAU;IAChCC,KAAK,EAAEC,WAAW,CAACC,cAAAA;AAAe,GAAA,EAEjCZ,OAAO,CAACA,OAAO,IAAI,EAAE,CAChB,CACJ,CAAA;AAEV;;;;"}