@sendbird/uikit-react-native 1.0.1 → 1.0.2

package/lib/commonjs/components/MessageRenderer/FileMessage/BaseFileMessage.js

@@ -0,0 +1,76 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _reactNative = require("react-native");
+
+var _uikitReactNativeFoundation = require("@sendbird/uikit-react-native-foundation");
+
+var _useContext = require("../../../hooks/useContext");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+const iconMapper = {
+  audio: 'file-audio',
+  image: 'photo',
+  video: 'play',
+  file: 'file-document'
+};
+
+const BaseFileMessage = _ref => {
+  let {
+    message,
+    variant,
+    pressed,
+    type
+  } = _ref;
+  const {
+    STRINGS
+  } = (0, _useContext.useLocalization)();
+  const {
+    colors
+  } = (0, _uikitReactNativeFoundation.useUIKitTheme)();
+  const color = colors.ui.message[variant][pressed ? 'pressed' : 'enabled'];
+  return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: [styles.container, {
+      backgroundColor: color.background
+    }]
+  }, /*#__PURE__*/_react.default.createElement(_uikitReactNativeFoundation.Icon, {
+    icon: iconMapper[type],
+    size: 24,
+    containerStyle: {
+      backgroundColor: colors.background,
+      padding: 2,
+      borderRadius: 8,
+      marginRight: 8
+    }
+  }), /*#__PURE__*/_react.default.createElement(_uikitReactNativeFoundation.Text, {
+    body3: true,
+    ellipsizeMode: 'middle',
+    numberOfLines: 1,
+    color: color.textMsg,
+    style: styles.name
+  }, STRINGS.GROUP_CHANNEL.MESSAGE_BUBBLE_FILE_TITLE(message)));
+};
+
+const styles = (0, _uikitReactNativeFoundation.createStyleSheet)({
+  container: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'center',
+    paddingHorizontal: 12,
+    paddingVertical: 6,
+    borderRadius: 16
+  },
+  name: {
+    flexShrink: 1
+  }
+});
+var _default = BaseFileMessage;
+exports.default = _default;
+//# sourceMappingURL=BaseFileMessage.js.map

package/lib/commonjs/components/MessageRenderer/FileMessage/BaseFileMessage.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["iconMapper","audio","image","video","file","BaseFileMessage","message","variant","pressed","type","STRINGS","useLocalization","colors","useUIKitTheme","color","ui","styles","container","backgroundColor","background","padding","borderRadius","marginRight","textMsg","name","GROUP_CHANNEL","MESSAGE_BUBBLE_FILE_TITLE","createStyleSheet","flexDirection","alignItems","justifyContent","paddingHorizontal","paddingVertical","flexShrink"],"sources":["BaseFileMessage.tsx"],"sourcesContent":["import React from 'react';\nimport { View } from 'react-native';\n\nimport { Icon, Text, createStyleSheet, useUIKitTheme } from '@sendbird/uikit-react-native-foundation';\n\nimport { useLocalization } from '../../../hooks/useContext';\nimport type { FileMessageProps } from './index';\n\nconst iconMapper = { audio: 'file-audio', image: 'photo', video: 'play', file: 'file-document' } as const;\n\ntype Props = FileMessageProps & {\n  type: 'image' | 'audio' | 'video' | 'file';\n};\nconst BaseFileMessage = ({ message, variant, pressed, type }: Props) => {\n  const { STRINGS } = useLocalization();\n  const { colors } = useUIKitTheme();\n  const color = colors.ui.message[variant][pressed ? 'pressed' : 'enabled'];\n  return (\n    <View style={[styles.container, { backgroundColor: color.background }]}>\n      <Icon\n        icon={iconMapper[type]}\n        size={24}\n        containerStyle={{ backgroundColor: colors.background, padding: 2, borderRadius: 8, marginRight: 8 }}\n      />\n      <Text body3 ellipsizeMode={'middle'} numberOfLines={1} color={color.textMsg} style={styles.name}>\n        {STRINGS.GROUP_CHANNEL.MESSAGE_BUBBLE_FILE_TITLE(message)}\n      </Text>\n    </View>\n  );\n};\n\nconst styles = createStyleSheet({\n  container: {\n    flexDirection: 'row',\n    alignItems: 'center',\n    justifyContent: 'center',\n    paddingHorizontal: 12,\n    paddingVertical: 6,\n    borderRadius: 16,\n  },\n  name: {\n    flexShrink: 1,\n  },\n});\n\nexport default BaseFileMessage;\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AAEA;;;;AAGA,MAAMA,UAAU,GAAG;EAAEC,KAAK,EAAE,YAAT;EAAuBC,KAAK,EAAE,OAA9B;EAAuCC,KAAK,EAAE,MAA9C;EAAsDC,IAAI,EAAE;AAA5D,CAAnB;;AAKA,MAAMC,eAAe,GAAG,QAAgD;EAAA,IAA/C;IAAEC,OAAF;IAAWC,OAAX;IAAoBC,OAApB;IAA6BC;EAA7B,CAA+C;EACtE,MAAM;IAAEC;EAAF,IAAc,IAAAC,2BAAA,GAApB;EACA,MAAM;IAAEC;EAAF,IAAa,IAAAC,yCAAA,GAAnB;EACA,MAAMC,KAAK,GAAGF,MAAM,CAACG,EAAP,CAAUT,OAAV,CAAkBC,OAAlB,EAA2BC,OAAO,GAAG,SAAH,GAAe,SAAjD,CAAd;EACA,oBACE,6BAAC,iBAAD;IAAM,KAAK,EAAE,CAACQ,MAAM,CAACC,SAAR,EAAmB;MAAEC,eAAe,EAAEJ,KAAK,CAACK;IAAzB,CAAnB;EAAb,gBACE,6BAAC,gCAAD;IACE,IAAI,EAAEnB,UAAU,CAACS,IAAD,CADlB;IAEE,IAAI,EAAE,EAFR;IAGE,cAAc,EAAE;MAAES,eAAe,EAAEN,MAAM,CAACO,UAA1B;MAAsCC,OAAO,EAAE,CAA/C;MAAkDC,YAAY,EAAE,CAAhE;MAAmEC,WAAW,EAAE;IAAhF;EAHlB,EADF,eAME,6BAAC,gCAAD;IAAM,KAAK,MAAX;IAAY,aAAa,EAAE,QAA3B;IAAqC,aAAa,EAAE,CAApD;IAAuD,KAAK,EAAER,KAAK,CAACS,OAApE;IAA6E,KAAK,EAAEP,MAAM,CAACQ;EAA3F,GACGd,OAAO,CAACe,aAAR,CAAsBC,yBAAtB,CAAgDpB,OAAhD,CADH,CANF,CADF;AAYD,CAhBD;;AAkBA,MAAMU,MAAM,GAAG,IAAAW,4CAAA,EAAiB;EAC9BV,SAAS,EAAE;IACTW,aAAa,EAAE,KADN;IAETC,UAAU,EAAE,QAFH;IAGTC,cAAc,EAAE,QAHP;IAITC,iBAAiB,EAAE,EAJV;IAKTC,eAAe,EAAE,CALR;IAMTX,YAAY,EAAE;EANL,CADmB;EAS9BG,IAAI,EAAE;IACJS,UAAU,EAAE;EADR;AATwB,CAAjB,CAAf;eAce5B,e"}

package/lib/commonjs/components/MessageRenderer/FileMessage/ImageFileMessage.js

@@ -0,0 +1,61 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _uikitReactNativeFoundation = require("@sendbird/uikit-react-native-foundation");
+
+var _uikitUtils = require("@sendbird/uikit-utils");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+const ImageFileMessage = _ref => {
+  let {
+    message
+  } = _ref;
+  const {
+    colors
+  } = (0, _uikitReactNativeFoundation.useUIKitTheme)();
+  const [imageNotFound, setImageNotFound] = (0, _react.useState)(false);
+  const fileUrl = (0, _uikitUtils.getAvailableUriFromFileMessage)(message);
+  const style = [styles.image, {
+    backgroundColor: colors.onBackground04
+  }];
+
+  if (imageNotFound) {
+    return /*#__PURE__*/_react.default.createElement(_uikitReactNativeFoundation.Icon, {
+      containerStyle: style,
+      icon: 'thumbnail-none',
+      size: 48,
+      color: colors.onBackground02
+    });
+  }
+
+  return /*#__PURE__*/_react.default.createElement(_uikitReactNativeFoundation.Image, {
+    source: {
+      uri: fileUrl
+    },
+    style: style,
+    resizeMode: 'cover',
+    resizeMethod: 'resize',
+    onError: () => setImageNotFound(true)
+  });
+};
+
+const styles = (0, _uikitReactNativeFoundation.createStyleSheet)({
+  image: {
+    width: 240,
+    maxWidth: 240,
+    height: 160,
+    borderRadius: 16
+  }
+});
+var _default = ImageFileMessage;
+exports.default = _default;
+//# sourceMappingURL=ImageFileMessage.js.map

package/lib/commonjs/components/MessageRenderer/FileMessage/ImageFileMessage.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["ImageFileMessage","message","colors","useUIKitTheme","imageNotFound","setImageNotFound","useState","fileUrl","getAvailableUriFromFileMessage","style","styles","image","backgroundColor","onBackground04","onBackground02","uri","createStyleSheet","width","maxWidth","height","borderRadius"],"sources":["ImageFileMessage.tsx"],"sourcesContent":["import React, { useState } from 'react';\n\nimport { Icon, Image, createStyleSheet, useUIKitTheme } from '@sendbird/uikit-react-native-foundation';\nimport { getAvailableUriFromFileMessage } from '@sendbird/uikit-utils';\n\nimport type { FileMessageProps } from './index';\n\nconst ImageFileMessage = ({ message }: FileMessageProps) => {\n  const { colors } = useUIKitTheme();\n  const [imageNotFound, setImageNotFound] = useState(false);\n\n  const fileUrl = getAvailableUriFromFileMessage(message);\n  const style = [styles.image, { backgroundColor: colors.onBackground04 }];\n\n  if (imageNotFound) {\n    return <Icon containerStyle={style} icon={'thumbnail-none'} size={48} color={colors.onBackground02} />;\n  }\n\n  return (\n    <Image\n      source={{ uri: fileUrl }}\n      style={style}\n      resizeMode={'cover'}\n      resizeMethod={'resize'}\n      onError={() => setImageNotFound(true)}\n    />\n  );\n};\n\nconst styles = createStyleSheet({\n  image: {\n    width: 240,\n    maxWidth: 240,\n    height: 160,\n    borderRadius: 16,\n  },\n});\n\nexport default ImageFileMessage;\n"],"mappings":";;;;;;;AAAA;;AAEA;;AACA;;;;;;AAIA,MAAMA,gBAAgB,GAAG,QAAmC;EAAA,IAAlC;IAAEC;EAAF,CAAkC;EAC1D,MAAM;IAAEC;EAAF,IAAa,IAAAC,yCAAA,GAAnB;EACA,MAAM,CAACC,aAAD,EAAgBC,gBAAhB,IAAoC,IAAAC,eAAA,EAAS,KAAT,CAA1C;EAEA,MAAMC,OAAO,GAAG,IAAAC,0CAAA,EAA+BP,OAA/B,CAAhB;EACA,MAAMQ,KAAK,GAAG,CAACC,MAAM,CAACC,KAAR,EAAe;IAAEC,eAAe,EAAEV,MAAM,CAACW;EAA1B,CAAf,CAAd;;EAEA,IAAIT,aAAJ,EAAmB;IACjB,oBAAO,6BAAC,gCAAD;MAAM,cAAc,EAAEK,KAAtB;MAA6B,IAAI,EAAE,gBAAnC;MAAqD,IAAI,EAAE,EAA3D;MAA+D,KAAK,EAAEP,MAAM,CAACY;IAA7E,EAAP;EACD;;EAED,oBACE,6BAAC,iCAAD;IACE,MAAM,EAAE;MAAEC,GAAG,EAAER;IAAP,CADV;IAEE,KAAK,EAAEE,KAFT;IAGE,UAAU,EAAE,OAHd;IAIE,YAAY,EAAE,QAJhB;IAKE,OAAO,EAAE,MAAMJ,gBAAgB,CAAC,IAAD;EALjC,EADF;AASD,CApBD;;AAsBA,MAAMK,MAAM,GAAG,IAAAM,4CAAA,EAAiB;EAC9BL,KAAK,EAAE;IACLM,KAAK,EAAE,GADF;IAELC,QAAQ,EAAE,GAFL;IAGLC,MAAM,EAAE,GAHH;IAILC,YAAY,EAAE;EAJT;AADuB,CAAjB,CAAf;eASepB,gB"}

package/lib/commonjs/components/MessageRenderer/FileMessage/index.js

@@ -0,0 +1,31 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _uikitUtils = require("@sendbird/uikit-utils");
+
+var _BaseFileMessage = _interopRequireDefault(require("./BaseFileMessage"));
+
+var _ImageFileMessage = _interopRequireDefault(require("./ImageFileMessage"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+const FileMessage = props => {
+  const fileType = (0, _uikitUtils.getFileType)(props.message.type || (0, _uikitUtils.getFileExtension)(props.message.name));
+  if (fileType === 'image') return /*#__PURE__*/_react.default.createElement(_ImageFileMessage.default, props);
+  return /*#__PURE__*/_react.default.createElement(_BaseFileMessage.default, _extends({}, props, {
+    type: fileType
+  }));
+};
+
+var _default = /*#__PURE__*/_react.default.memo(FileMessage);
+
+exports.default = _default;
+//# sourceMappingURL=index.js.map

package/lib/commonjs/components/MessageRenderer/FileMessage/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["FileMessage","props","fileType","getFileType","message","type","getFileExtension","name","React","memo"],"sources":["index.tsx"],"sourcesContent":["import React from 'react';\n\nimport { SendbirdFileMessage, getFileExtension, getFileType } from '@sendbird/uikit-utils';\n\nimport type { MessageRendererInterface } from '../index';\nimport BaseFileMessage from './BaseFileMessage';\nimport ImageFileMessage from './ImageFileMessage';\n\nexport type FileMessageProps = MessageRendererInterface<SendbirdFileMessage>;\nconst FileMessage = (props: FileMessageProps) => {\n  const fileType = getFileType(props.message.type || getFileExtension(props.message.name));\n\n  if (fileType === 'image') return <ImageFileMessage {...props} />;\n  return <BaseFileMessage {...props} type={fileType} />;\n};\n\nexport default React.memo(FileMessage);\n"],"mappings":";;;;;;;AAAA;;AAEA;;AAGA;;AACA;;;;;;AAGA,MAAMA,WAAW,GAAIC,KAAD,IAA6B;EAC/C,MAAMC,QAAQ,GAAG,IAAAC,uBAAA,EAAYF,KAAK,CAACG,OAAN,CAAcC,IAAd,IAAsB,IAAAC,4BAAA,EAAiBL,KAAK,CAACG,OAAN,CAAcG,IAA/B,CAAlC,CAAjB;EAEA,IAAIL,QAAQ,KAAK,OAAjB,EAA0B,oBAAO,6BAAC,yBAAD,EAAsBD,KAAtB,CAAP;EAC1B,oBAAO,6BAAC,wBAAD,eAAqBA,KAArB;IAA4B,IAAI,EAAEC;EAAlC,GAAP;AACD,CALD;;4BAOeM,cAAA,CAAMC,IAAN,CAAWT,WAAX,C"}

package/lib/commonjs/components/MessageRenderer/MessageContainer.js

@@ -0,0 +1,33 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _reactNative = require("react-native");
+
+var _uikitReactNativeFoundation = require("@sendbird/uikit-react-native-foundation");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+const MessageContainer = _ref => {
+  let {
+    children
+  } = _ref;
+  return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: styles.container
+  }, children);
+};
+
+const styles = (0, _uikitReactNativeFoundation.createStyleSheet)({
+  container: {
+    flexDirection: 'column',
+    paddingHorizontal: 16
+  }
+});
+var _default = MessageContainer;
+exports.default = _default;
+//# sourceMappingURL=MessageContainer.js.map

package/lib/commonjs/components/MessageRenderer/MessageContainer.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["MessageContainer","children","styles","container","createStyleSheet","flexDirection","paddingHorizontal"],"sources":["MessageContainer.tsx"],"sourcesContent":["import React from 'react';\nimport { View } from 'react-native';\n\nimport { createStyleSheet } from '@sendbird/uikit-react-native-foundation';\n\nconst MessageContainer = ({ children }: React.PropsWithChildren) => {\n  return <View style={styles.container}>{children}</View>;\n};\n\nconst styles = createStyleSheet({\n  container: {\n    flexDirection: 'column',\n    paddingHorizontal: 16,\n  },\n});\n\nexport default MessageContainer;\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;;;AAEA,MAAMA,gBAAgB,GAAG,QAA2C;EAAA,IAA1C;IAAEC;EAAF,CAA0C;EAClE,oBAAO,6BAAC,iBAAD;IAAM,KAAK,EAAEC,MAAM,CAACC;EAApB,GAAgCF,QAAhC,CAAP;AACD,CAFD;;AAIA,MAAMC,MAAM,GAAG,IAAAE,4CAAA,EAAiB;EAC9BD,SAAS,EAAE;IACTE,aAAa,EAAE,QADN;IAETC,iBAAiB,EAAE;EAFV;AADmB,CAAjB,CAAf;eAOeN,gB"}

package/lib/commonjs/components/MessageRenderer/MessageDateSeparator.js

@@ -0,0 +1,58 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _isSameDay = _interopRequireDefault(require("date-fns/isSameDay"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _reactNative = require("react-native");
+
+var _uikitReactNativeFoundation = require("@sendbird/uikit-react-native-foundation");
+
+var _useContext = require("../../hooks/useContext");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+const MessageDateSeparator = _ref => {
+  let {
+    message,
+    prevMessage
+  } = _ref;
+  const {
+    STRINGS
+  } = (0, _useContext.useLocalization)();
+  const {
+    colors
+  } = (0, _uikitReactNativeFoundation.useUIKitTheme)();
+  const sameDay = (0, _isSameDay.default)(message.createdAt, (prevMessage === null || prevMessage === void 0 ? void 0 : prevMessage.createdAt) ?? 0);
+  if (sameDay) return null;
+  return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: styles.container
+  }, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: [styles.view, {
+      backgroundColor: colors.ui.dateSeparator.default.none.background
+    }]
+  }, /*#__PURE__*/_react.default.createElement(_uikitReactNativeFoundation.Text, {
+    caption1: true,
+    color: colors.ui.dateSeparator.default.none.text
+  }, STRINGS.GROUP_CHANNEL.LIST_DATE_SEPARATOR(new Date(message.createdAt)))));
+};
+
+const styles = (0, _uikitReactNativeFoundation.createStyleSheet)({
+  container: {
+    alignItems: 'center',
+    marginVertical: 16
+  },
+  view: {
+    borderRadius: 10,
+    paddingVertical: 4,
+    paddingHorizontal: 10
+  }
+});
+var _default = MessageDateSeparator;
+exports.default = _default;
+//# sourceMappingURL=MessageDateSeparator.js.map

package/lib/commonjs/components/MessageRenderer/MessageDateSeparator.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["MessageDateSeparator","message","prevMessage","STRINGS","useLocalization","colors","useUIKitTheme","sameDay","isSameDay","createdAt","styles","container","view","backgroundColor","ui","dateSeparator","default","none","background","text","GROUP_CHANNEL","LIST_DATE_SEPARATOR","Date","createStyleSheet","alignItems","marginVertical","borderRadius","paddingVertical","paddingHorizontal"],"sources":["MessageDateSeparator.tsx"],"sourcesContent":["import isSameDay from 'date-fns/isSameDay';\nimport React from 'react';\nimport { View } from 'react-native';\n\nimport { Text, createStyleSheet, useUIKitTheme } from '@sendbird/uikit-react-native-foundation';\nimport type { SendbirdMessage } from '@sendbird/uikit-utils';\n\nimport { useLocalization } from '../../hooks/useContext';\n\ntype Props = {\n  message: SendbirdMessage;\n  prevMessage?: SendbirdMessage;\n};\n\nconst MessageDateSeparator = ({ message, prevMessage }: Props) => {\n  const { STRINGS } = useLocalization();\n  const { colors } = useUIKitTheme();\n  const sameDay = isSameDay(message.createdAt, prevMessage?.createdAt ?? 0);\n  if (sameDay) return null;\n  return (\n    <View style={styles.container}>\n      <View style={[styles.view, { backgroundColor: colors.ui.dateSeparator.default.none.background }]}>\n        <Text caption1 color={colors.ui.dateSeparator.default.none.text}>\n          {STRINGS.GROUP_CHANNEL.LIST_DATE_SEPARATOR(new Date(message.createdAt))}\n        </Text>\n      </View>\n    </View>\n  );\n};\n\nconst styles = createStyleSheet({\n  container: {\n    alignItems: 'center',\n    marginVertical: 16,\n  },\n  view: {\n    borderRadius: 10,\n    paddingVertical: 4,\n    paddingHorizontal: 10,\n  },\n});\n\nexport default MessageDateSeparator;\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AAEA;;AAGA;;;;AAOA,MAAMA,oBAAoB,GAAG,QAAqC;EAAA,IAApC;IAAEC,OAAF;IAAWC;EAAX,CAAoC;EAChE,MAAM;IAAEC;EAAF,IAAc,IAAAC,2BAAA,GAApB;EACA,MAAM;IAAEC;EAAF,IAAa,IAAAC,yCAAA,GAAnB;EACA,MAAMC,OAAO,GAAG,IAAAC,kBAAA,EAAUP,OAAO,CAACQ,SAAlB,EAA6B,CAAAP,WAAW,SAAX,IAAAA,WAAW,WAAX,YAAAA,WAAW,CAAEO,SAAb,KAA0B,CAAvD,CAAhB;EACA,IAAIF,OAAJ,EAAa,OAAO,IAAP;EACb,oBACE,6BAAC,iBAAD;IAAM,KAAK,EAAEG,MAAM,CAACC;EAApB,gBACE,6BAAC,iBAAD;IAAM,KAAK,EAAE,CAACD,MAAM,CAACE,IAAR,EAAc;MAAEC,eAAe,EAAER,MAAM,CAACS,EAAP,CAAUC,aAAV,CAAwBC,OAAxB,CAAgCC,IAAhC,CAAqCC;IAAxD,CAAd;EAAb,gBACE,6BAAC,gCAAD;IAAM,QAAQ,MAAd;IAAe,KAAK,EAAEb,MAAM,CAACS,EAAP,CAAUC,aAAV,CAAwBC,OAAxB,CAAgCC,IAAhC,CAAqCE;EAA3D,GACGhB,OAAO,CAACiB,aAAR,CAAsBC,mBAAtB,CAA0C,IAAIC,IAAJ,CAASrB,OAAO,CAACQ,SAAjB,CAA1C,CADH,CADF,CADF,CADF;AASD,CAdD;;AAgBA,MAAMC,MAAM,GAAG,IAAAa,4CAAA,EAAiB;EAC9BZ,SAAS,EAAE;IACTa,UAAU,EAAE,QADH;IAETC,cAAc,EAAE;EAFP,CADmB;EAK9Bb,IAAI,EAAE;IACJc,YAAY,EAAE,EADV;IAEJC,eAAe,EAAE,CAFb;IAGJC,iBAAiB,EAAE;EAHf;AALwB,CAAjB,CAAf;eAYe5B,oB"}

package/lib/commonjs/components/MessageRenderer/MessageIncomingAvatar.js

@@ -0,0 +1,42 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _reactNative = require("react-native");
+
+var _uikitReactNativeFoundation = require("@sendbird/uikit-react-native-foundation");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+const MessageIncomingAvatar = _ref => {
+  var _message$sender;
+
+  let {
+    message,
+    grouping
+  } = _ref;
+  if (grouping) return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: styles.avatar
+  });
+  return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: styles.avatar
+  }, (message.isFileMessage() || message.isUserMessage()) && /*#__PURE__*/_react.default.createElement(_uikitReactNativeFoundation.Avatar, {
+    size: 26,
+    uri: (_message$sender = message.sender) === null || _message$sender === void 0 ? void 0 : _message$sender.profileUrl
+  }));
+};
+
+const styles = (0, _uikitReactNativeFoundation.createStyleSheet)({
+  avatar: {
+    width: 26,
+    marginRight: 12
+  }
+});
+var _default = MessageIncomingAvatar;
+exports.default = _default;
+//# sourceMappingURL=MessageIncomingAvatar.js.map

package/lib/commonjs/components/MessageRenderer/MessageIncomingAvatar.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["MessageIncomingAvatar","message","grouping","styles","avatar","isFileMessage","isUserMessage","sender","profileUrl","createStyleSheet","width","marginRight"],"sources":["MessageIncomingAvatar.tsx"],"sourcesContent":["import React from 'react';\nimport { View } from 'react-native';\n\nimport { Avatar, createStyleSheet } from '@sendbird/uikit-react-native-foundation';\nimport type { SendbirdMessage } from '@sendbird/uikit-utils';\n\ntype Props = {\n  message: SendbirdMessage;\n  grouping: boolean;\n};\nconst MessageIncomingAvatar = ({ message, grouping }: Props) => {\n  if (grouping) return <View style={styles.avatar} />;\n  return (\n    <View style={styles.avatar}>\n      {(message.isFileMessage() || message.isUserMessage()) && <Avatar size={26} uri={message.sender?.profileUrl} />}\n    </View>\n  );\n};\n\nconst styles = createStyleSheet({\n  avatar: {\n    width: 26,\n    marginRight: 12,\n  },\n});\n\nexport default MessageIncomingAvatar;\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;;;AAOA,MAAMA,qBAAqB,GAAG,QAAkC;EAAA;;EAAA,IAAjC;IAAEC,OAAF;IAAWC;EAAX,CAAiC;EAC9D,IAAIA,QAAJ,EAAc,oBAAO,6BAAC,iBAAD;IAAM,KAAK,EAAEC,MAAM,CAACC;EAApB,EAAP;EACd,oBACE,6BAAC,iBAAD;IAAM,KAAK,EAAED,MAAM,CAACC;EAApB,GACG,CAACH,OAAO,CAACI,aAAR,MAA2BJ,OAAO,CAACK,aAAR,EAA5B,kBAAwD,6BAAC,kCAAD;IAAQ,IAAI,EAAE,EAAd;IAAkB,GAAG,qBAAEL,OAAO,CAACM,MAAV,oDAAE,gBAAgBC;EAAvC,EAD3D,CADF;AAKD,CAPD;;AASA,MAAML,MAAM,GAAG,IAAAM,4CAAA,EAAiB;EAC9BL,MAAM,EAAE;IACNM,KAAK,EAAE,EADD;IAENC,WAAW,EAAE;EAFP;AADsB,CAAjB,CAAf;eAOeX,qB"}

package/lib/commonjs/components/MessageRenderer/MessageIncomingSenderName.js

@@ -0,0 +1,48 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _reactNative = require("react-native");
+
+var _uikitReactNativeFoundation = require("@sendbird/uikit-react-native-foundation");
+
+var _useContext = require("../../hooks/useContext");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+const MessageIncomingSenderName = _ref => {
+  var _message$sender;
+
+  let {
+    message,
+    grouping
+  } = _ref;
+  const {
+    colors
+  } = (0, _uikitReactNativeFoundation.useUIKitTheme)();
+  const {
+    STRINGS
+  } = (0, _useContext.useLocalization)();
+  if (grouping) return null;
+  return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: styles.sender
+  }, (message.isFileMessage() || message.isUserMessage()) && /*#__PURE__*/_react.default.createElement(_uikitReactNativeFoundation.Text, {
+    caption1: true,
+    color: colors.ui.message.incoming.enabled.textSenderName
+  }, ((_message$sender = message.sender) === null || _message$sender === void 0 ? void 0 : _message$sender.nickname) || STRINGS.LABELS.USER_NO_NAME));
+};
+
+const styles = (0, _uikitReactNativeFoundation.createStyleSheet)({
+  sender: {
+    marginLeft: 12,
+    marginBottom: 4
+  }
+});
+var _default = MessageIncomingSenderName;
+exports.default = _default;
+//# sourceMappingURL=MessageIncomingSenderName.js.map

package/lib/commonjs/components/MessageRenderer/MessageIncomingSenderName.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["MessageIncomingSenderName","message","grouping","colors","useUIKitTheme","STRINGS","useLocalization","styles","sender","isFileMessage","isUserMessage","ui","incoming","enabled","textSenderName","nickname","LABELS","USER_NO_NAME","createStyleSheet","marginLeft","marginBottom"],"sources":["MessageIncomingSenderName.tsx"],"sourcesContent":["import React from 'react';\nimport { View } from 'react-native';\n\nimport { Text, createStyleSheet, useUIKitTheme } from '@sendbird/uikit-react-native-foundation';\nimport type { SendbirdMessage } from '@sendbird/uikit-utils';\n\nimport { useLocalization } from '../../hooks/useContext';\n\ntype Props = {\n  message: SendbirdMessage;\n  grouping: boolean;\n};\nconst MessageIncomingSenderName = ({ message, grouping }: Props) => {\n  const { colors } = useUIKitTheme();\n  const { STRINGS } = useLocalization();\n  if (grouping) return null;\n\n  return (\n    <View style={styles.sender}>\n      {(message.isFileMessage() || message.isUserMessage()) && (\n        <Text caption1 color={colors.ui.message.incoming.enabled.textSenderName}>\n          {message.sender?.nickname || STRINGS.LABELS.USER_NO_NAME}\n        </Text>\n      )}\n    </View>\n  );\n};\n\nconst styles = createStyleSheet({\n  sender: {\n    marginLeft: 12,\n    marginBottom: 4,\n  },\n});\n\nexport default MessageIncomingSenderName;\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AAGA;;;;AAMA,MAAMA,yBAAyB,GAAG,QAAkC;EAAA;;EAAA,IAAjC;IAAEC,OAAF;IAAWC;EAAX,CAAiC;EAClE,MAAM;IAAEC;EAAF,IAAa,IAAAC,yCAAA,GAAnB;EACA,MAAM;IAAEC;EAAF,IAAc,IAAAC,2BAAA,GAApB;EACA,IAAIJ,QAAJ,EAAc,OAAO,IAAP;EAEd,oBACE,6BAAC,iBAAD;IAAM,KAAK,EAAEK,MAAM,CAACC;EAApB,GACG,CAACP,OAAO,CAACQ,aAAR,MAA2BR,OAAO,CAACS,aAAR,EAA5B,kBACC,6BAAC,gCAAD;IAAM,QAAQ,MAAd;IAAe,KAAK,EAAEP,MAAM,CAACQ,EAAP,CAAUV,OAAV,CAAkBW,QAAlB,CAA2BC,OAA3B,CAAmCC;EAAzD,GACG,oBAAAb,OAAO,CAACO,MAAR,oEAAgBO,QAAhB,KAA4BV,OAAO,CAACW,MAAR,CAAeC,YAD9C,CAFJ,CADF;AASD,CAdD;;AAgBA,MAAMV,MAAM,GAAG,IAAAW,4CAAA,EAAiB;EAC9BV,MAAM,EAAE;IACNW,UAAU,EAAE,EADN;IAENC,YAAY,EAAE;EAFR;AADsB,CAAjB,CAAf;eAOepB,yB"}

package/lib/commonjs/components/MessageRenderer/MessageOutgoingStatus.js

@@ -0,0 +1,134 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _uikitReactNativeFoundation = require("@sendbird/uikit-react-native-foundation");
+
+var _uikitUtils = require("@sendbird/uikit-utils");
+
+var _useContext = require("../../hooks/useContext");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+const SIZE = 16;
+
+const MessageOutgoingStatus = _ref => {
+  let {
+    channel,
+    message
+  } = _ref;
+  if (!message.isUserMessage() && !message.isFileMessage()) return null;
+  const handlerId = (0, _uikitUtils.useUniqId)('MessageOutgoingStatus');
+  const {
+    sdk,
+    features
+  } = (0, _useContext.useSendbirdChat)();
+  const {
+    colors
+  } = (0, _uikitReactNativeFoundation.useUIKitTheme)();
+  const [state, setState] = (0, _react.useState)(() => ({
+    unreadCount: channel.getUnreadMemberCount(message),
+    undeliveredCount: channel.getUndeliveredMemberCount(message)
+  }));
+
+  const getCounts = (channel, message) => {
+    return {
+      unreadCount: channel.getUnreadMemberCount(message),
+      undeliveredCount: channel.getUndeliveredMemberCount(message)
+    };
+  };
+
+  (0, _react.useEffect)(() => {
+    const id = String(handlerId);
+
+    if (message.sendingStatus === 'succeeded' && state.unreadCount === 0 && state.undeliveredCount === 0) {
+      sdk.removeChannelHandler(id);
+    } else {
+      const handler = new sdk.ChannelHandler();
+
+      handler.onReadReceiptUpdated = channel => {
+        if (channel.url === message.channelUrl) setState(getCounts(channel, message));
+      };
+
+      if (features.deliveryReceiptEnabled) {
+        handler.onDeliveryReceiptUpdated = channel => {
+          if (channel.url === message.channelUrl && channel.isGroupChannel()) setState(getCounts(channel, message));
+        };
+      }
+
+      sdk.addChannelHandler(id, handler);
+    }
+
+    return () => {
+      sdk.removeChannelHandler(id);
+    };
+  }, [message.sendingStatus]);
+
+  if (message.sendingStatus === 'pending') {
+    return /*#__PURE__*/_react.default.createElement(_uikitReactNativeFoundation.LoadingSpinner, {
+      size: SIZE,
+      style: styles.container
+    });
+  }
+
+  if (message.sendingStatus === 'failed') {
+    return /*#__PURE__*/_react.default.createElement(_uikitReactNativeFoundation.Icon, {
+      icon: 'error',
+      size: SIZE,
+      color: colors.error,
+      style: styles.container
+    });
+  }
+
+  if (state.unreadCount === 0) {
+    return /*#__PURE__*/_react.default.createElement(_uikitReactNativeFoundation.Icon, {
+      icon: 'done-all',
+      size: SIZE,
+      color: colors.secondary,
+      style: styles.container
+    });
+  }
+
+  if (features.deliveryReceiptEnabled) {
+    if (state.undeliveredCount === 0) {
+      return /*#__PURE__*/_react.default.createElement(_uikitReactNativeFoundation.Icon, {
+        icon: 'done-all',
+        size: SIZE,
+        color: colors.onBackground03,
+        style: styles.container
+      });
+    }
+
+    return /*#__PURE__*/_react.default.createElement(_uikitReactNativeFoundation.Icon, {
+      icon: 'done',
+      size: SIZE,
+      color: colors.onBackground03,
+      style: styles.container
+    });
+  }
+
+  return /*#__PURE__*/_react.default.createElement(_uikitReactNativeFoundation.Icon, {
+    icon: 'done-all',
+    size: SIZE,
+    color: colors.onBackground03,
+    style: styles.container
+  });
+};
+
+const styles = (0, _uikitReactNativeFoundation.createStyleSheet)({
+  container: {
+    marginRight: 4
+  }
+});
+
+var _default = /*#__PURE__*/_react.default.memo(MessageOutgoingStatus);
+
+exports.default = _default;
+//# sourceMappingURL=MessageOutgoingStatus.js.map

package/lib/commonjs/components/MessageRenderer/MessageOutgoingStatus.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["SIZE","MessageOutgoingStatus","channel","message","isUserMessage","isFileMessage","handlerId","useUniqId","sdk","features","useSendbirdChat","colors","useUIKitTheme","state","setState","useState","unreadCount","getUnreadMemberCount","undeliveredCount","getUndeliveredMemberCount","getCounts","useEffect","id","String","sendingStatus","removeChannelHandler","handler","ChannelHandler","onReadReceiptUpdated","url","channelUrl","deliveryReceiptEnabled","onDeliveryReceiptUpdated","isGroupChannel","addChannelHandler","styles","container","error","secondary","onBackground03","createStyleSheet","marginRight","React","memo"],"sources":["MessageOutgoingStatus.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\n\nimport { Icon, LoadingSpinner, createStyleSheet, useUIKitTheme } from '@sendbird/uikit-react-native-foundation';\nimport type {\n  SendbirdFileMessage,\n  SendbirdGroupChannel,\n  SendbirdMessage,\n  SendbirdUserMessage,\n} from '@sendbird/uikit-utils';\nimport { useUniqId } from '@sendbird/uikit-utils';\n\nimport { useSendbirdChat } from '../../hooks/useContext';\n\nconst SIZE = 16;\n\ntype Props = { channel: SendbirdGroupChannel; message: SendbirdMessage };\nconst MessageOutgoingStatus = ({ channel, message }: Props) => {\n  if (!message.isUserMessage() && !message.isFileMessage()) return null;\n\n  const handlerId = useUniqId('MessageOutgoingStatus');\n\n  const { sdk, features } = useSendbirdChat();\n  const { colors } = useUIKitTheme();\n\n  const [state, setState] = useState(() => ({\n    unreadCount: channel.getUnreadMemberCount(message),\n    undeliveredCount: channel.getUndeliveredMemberCount(message),\n  }));\n\n  const getCounts = (channel: SendbirdGroupChannel, message: SendbirdUserMessage | SendbirdFileMessage) => {\n    return {\n      unreadCount: channel.getUnreadMemberCount(message),\n      undeliveredCount: channel.getUndeliveredMemberCount(message),\n    };\n  };\n\n  useEffect(() => {\n    const id = String(handlerId);\n    if (message.sendingStatus === 'succeeded' && state.unreadCount === 0 && state.undeliveredCount === 0) {\n      sdk.removeChannelHandler(id);\n    } else {\n      const handler = new sdk.ChannelHandler();\n      handler.onReadReceiptUpdated = (channel) => {\n        if (channel.url === message.channelUrl) setState(getCounts(channel, message));\n      };\n\n      if (features.deliveryReceiptEnabled) {\n        handler.onDeliveryReceiptUpdated = (channel) => {\n          if (channel.url === message.channelUrl && channel.isGroupChannel()) setState(getCounts(channel, message));\n        };\n      }\n      sdk.addChannelHandler(id, handler);\n    }\n\n    return () => {\n      sdk.removeChannelHandler(id);\n    };\n  }, [message.sendingStatus]);\n\n  if (message.sendingStatus === 'pending') {\n    return <LoadingSpinner size={SIZE} style={styles.container} />;\n  }\n\n  if (message.sendingStatus === 'failed') {\n    return <Icon icon={'error'} size={SIZE} color={colors.error} style={styles.container} />;\n  }\n\n  if (state.unreadCount === 0) {\n    return <Icon icon={'done-all'} size={SIZE} color={colors.secondary} style={styles.container} />;\n  }\n\n  if (features.deliveryReceiptEnabled) {\n    if (state.undeliveredCount === 0) {\n      return <Icon icon={'done-all'} size={SIZE} color={colors.onBackground03} style={styles.container} />;\n    }\n    return <Icon icon={'done'} size={SIZE} color={colors.onBackground03} style={styles.container} />;\n  }\n\n  return <Icon icon={'done-all'} size={SIZE} color={colors.onBackground03} style={styles.container} />;\n};\n\nconst styles = createStyleSheet({\n  container: {\n    marginRight: 4,\n  },\n});\n\nexport default React.memo(MessageOutgoingStatus);\n"],"mappings":"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"}

package/lib/commonjs/components/MessageRenderer/MessageTime.js

@@ -0,0 +1,41 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _reactNative = require("react-native");
+
+var _uikitReactNativeFoundation = require("@sendbird/uikit-react-native-foundation");
+
+var _useContext = require("../../hooks/useContext");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+const MessageTime = _ref => {
+  let {
+    message,
+    grouping,
+    style
+  } = _ref;
+  const {
+    STRINGS
+  } = (0, _useContext.useLocalization)();
+  const {
+    colors
+  } = (0, _uikitReactNativeFoundation.useUIKitTheme)();
+  if (grouping) return null;
+  return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: style
+  }, /*#__PURE__*/_react.default.createElement(_uikitReactNativeFoundation.Text, {
+    caption4: true,
+    color: colors.ui.message.incoming.enabled.textTime
+  }, STRINGS.GROUP_CHANNEL.MESSAGE_BUBBLE_TIME(message)));
+};
+
+var _default = MessageTime;
+exports.default = _default;
+//# sourceMappingURL=MessageTime.js.map

package/lib/commonjs/components/MessageRenderer/MessageTime.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["MessageTime","message","grouping","style","STRINGS","useLocalization","colors","useUIKitTheme","ui","incoming","enabled","textTime","GROUP_CHANNEL","MESSAGE_BUBBLE_TIME"],"sources":["MessageTime.tsx"],"sourcesContent":["import React from 'react';\nimport { StyleProp, View, ViewStyle } from 'react-native';\n\nimport { Text, useUIKitTheme } from '@sendbird/uikit-react-native-foundation';\nimport type { SendbirdMessage } from '@sendbird/uikit-utils';\n\nimport { useLocalization } from '../../hooks/useContext';\n\ntype Props = {\n  message: SendbirdMessage;\n  grouping: boolean;\n  style?: StyleProp<ViewStyle>;\n};\nconst MessageTime = ({ message, grouping, style }: Props) => {\n  const { STRINGS } = useLocalization();\n  const { colors } = useUIKitTheme();\n  if (grouping) return null;\n\n  return (\n    <View style={style}>\n      <Text caption4 color={colors.ui.message.incoming.enabled.textTime}>\n        {STRINGS.GROUP_CHANNEL.MESSAGE_BUBBLE_TIME(message)}\n      </Text>\n    </View>\n  );\n};\n\nexport default MessageTime;\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AAGA;;;;AAOA,MAAMA,WAAW,GAAG,QAAyC;EAAA,IAAxC;IAAEC,OAAF;IAAWC,QAAX;IAAqBC;EAArB,CAAwC;EAC3D,MAAM;IAAEC;EAAF,IAAc,IAAAC,2BAAA,GAApB;EACA,MAAM;IAAEC;EAAF,IAAa,IAAAC,yCAAA,GAAnB;EACA,IAAIL,QAAJ,EAAc,OAAO,IAAP;EAEd,oBACE,6BAAC,iBAAD;IAAM,KAAK,EAAEC;EAAb,gBACE,6BAAC,gCAAD;IAAM,QAAQ,MAAd;IAAe,KAAK,EAAEG,MAAM,CAACE,EAAP,CAAUP,OAAV,CAAkBQ,QAAlB,CAA2BC,OAA3B,CAAmCC;EAAzD,GACGP,OAAO,CAACQ,aAAR,CAAsBC,mBAAtB,CAA0CZ,OAA1C,CADH,CADF,CADF;AAOD,CAZD;;eAceD,W"}

package/lib/commonjs/components/MessageRenderer/UnknownMessage/index.js

@@ -0,0 +1,53 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _reactNative = require("react-native");
+
+var _uikitReactNativeFoundation = require("@sendbird/uikit-react-native-foundation");
+
+var _useContext = require("../../../hooks/useContext");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+const UnknownMessage = _ref => {
+  let {
+    message,
+    variant,
+    pressed
+  } = _ref;
+  const {
+    STRINGS
+  } = (0, _useContext.useLocalization)();
+  const {
+    colors
+  } = (0, _uikitReactNativeFoundation.useUIKitTheme)();
+  const color = colors.ui.message[variant][pressed ? 'pressed' : 'enabled'];
+  return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: [styles.container, {
+      backgroundColor: color.background
+    }]
+  }, /*#__PURE__*/_react.default.createElement(_uikitReactNativeFoundation.Text, {
+    body3: true,
+    color: colors.onBackground01
+  }, STRINGS.GROUP_CHANNEL.MESSAGE_BUBBLE_UNKNOWN_TITLE(message)), /*#__PURE__*/_react.default.createElement(_uikitReactNativeFoundation.Text, {
+    body3: true,
+    color: colors.onBackground02
+  }, STRINGS.GROUP_CHANNEL.MESSAGE_BUBBLE_UNKNOWN_DESC(message)));
+};
+
+const styles = (0, _uikitReactNativeFoundation.createStyleSheet)({
+  container: {
+    paddingHorizontal: 12,
+    paddingVertical: 6,
+    borderRadius: 16
+  }
+});
+var _default = UnknownMessage;
+exports.default = _default;
+//# sourceMappingURL=index.js.map