@sendbird/uikit-react-native-foundation 2.5.0 → 3.0.0-rc.0

package/lib/commonjs/ui/GroupChannelMessage/Message.file.video.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_uikitUtils","_Box","_interopRequireDefault","_Icon","_ImageWithPlaceholder","_PressBox","_createStyleSheet","_useUIKitTheme","_MessageContainer","obj","__esModule","default","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","VideoFileMessage","props","onPress","onLongPress","variant","colors","palette","select","useUIKitTheme","uri","getAvailableUriFromFileMessage","message","thumbnail","loading","useRetry","fetchThumbnailFromVideoSource","createElement","style","styles","container","backgroundColor","ui","groupChannelMessage","enabled","background","activeOpacity","image","StyleSheet","absoluteFill","dark","background400","light","background100","source","alignItems","justifyContent","icon","size","color","onBackgroundLight02","containerStyle","playIcon","onBackgroundDark01","children","fetch","retryCount","arguments","length","undefined","state","setState","useState","retryCountRef","useRef","retryTimeoutRef","fetchThumbnail","current","useEffect","reloadReservation","setTimeout","then","result","path","clearTimeout","createStyleSheet","borderRadius","overflow","maxWidth","width","height","padding","_default","exports"],"sources":["Message.file.video.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport { StyleSheet } from 'react-native';\n\nimport type { SendbirdFileMessage } from '@sendbird/uikit-utils';\nimport { getAvailableUriFromFileMessage } from '@sendbird/uikit-utils';\n\nimport Box from '../../components/Box';\nimport Icon from '../../components/Icon';\nimport ImageWithPlaceholder from '../../components/ImageWithPlaceholder';\nimport PressBox from '../../components/PressBox';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\nimport MessageContainer from './MessageContainer';\nimport type { GroupChannelMessageProps } from './index';\n\ntype Props = GroupChannelMessageProps<\n  SendbirdFileMessage,\n  {\n    fetchThumbnailFromVideoSource: (uri: string) => Promise<{ path: string } | null>;\n  }\n>;\n\nconst VideoFileMessage = (props: Props) => {\n  const { onPress, onLongPress, variant = 'incoming' } = props;\n\n  const { colors, palette, select } = useUIKitTheme();\n  const uri = getAvailableUriFromFileMessage(props.message);\n  const { thumbnail, loading } = useRetry(() => props.fetchThumbnailFromVideoSource(uri));\n\n  return (\n    <MessageContainer {...props}>\n      <Box style={styles.container} backgroundColor={colors.ui.groupChannelMessage[variant].enabled.background}>\n        <PressBox activeOpacity={0.8} onPress={onPress} onLongPress={onLongPress} style={styles.image}>\n          {loading ? (\n            <Box\n              style={StyleSheet.absoluteFill}\n              backgroundColor={select({ dark: palette.background400, light: palette.background100 })}\n            />\n          ) : (\n            <ImageWithPlaceholder source={{ uri: thumbnail ?? 'invalid-image' }} style={StyleSheet.absoluteFill} />\n          )}\n\n          {(loading || thumbnail !== null) && (\n            <Box style={StyleSheet.absoluteFill} alignItems={'center'} justifyContent={'center'}>\n              <Icon\n                icon={'play'}\n                size={28}\n                color={palette.onBackgroundLight02}\n                containerStyle={[styles.playIcon, { backgroundColor: palette.onBackgroundDark01 }]}\n              />\n            </Box>\n          )}\n        </PressBox>\n        {props.children}\n      </Box>\n    </MessageContainer>\n  );\n};\n\nconst useRetry = (fetch: () => Promise<{ path: string } | null>, retryCount = 5) => {\n  const [state, setState] = useState({ thumbnail: null as null | string, loading: true });\n  const retryCountRef = useRef(0);\n  const retryTimeoutRef = useRef<NodeJS.Timeout>();\n  const fetchThumbnail = useRef(fetch);\n  fetchThumbnail.current = fetch;\n\n  useEffect(() => {\n    if (!state.thumbnail) {\n      const reloadReservation = () => {\n        if (retryCountRef.current < retryCount) {\n          retryTimeoutRef.current = setTimeout(() => {\n            retryCountRef.current++;\n            reloadReservation();\n            fetchThumbnail.current().then((result) => {\n              setState({ loading: false, thumbnail: result?.path ?? null });\n            });\n          }, retryCountRef.current * 5000);\n        }\n      };\n\n      return reloadReservation();\n    } else {\n      return clearTimeout(retryTimeoutRef.current);\n    }\n  }, [state.thumbnail]);\n\n  return state;\n};\nconst styles = createStyleSheet({\n  container: {\n    borderRadius: 16,\n    overflow: 'hidden',\n  },\n  image: {\n    maxWidth: 240,\n    width: 240,\n    height: 160,\n    borderRadius: 16,\n    overflow: 'hidden',\n  },\n  playIcon: {\n    padding: 10,\n    borderRadius: 50,\n  },\n});\nexport default VideoFileMessage;\n"],"mappings":"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"}

package/lib/commonjs/ui/GroupChannelMessage/Message.unknown.js

@@ -0,0 +1,54 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _Box = _interopRequireDefault(require("../../components/Box"));
+var _PressBox = _interopRequireDefault(require("../../components/PressBox"));
+var _Text = _interopRequireDefault(require("../../components/Text"));
+var _createStyleSheet = _interopRequireDefault(require("../../styles/createStyleSheet"));
+var _useUIKitTheme = _interopRequireDefault(require("../../theme/useUIKitTheme"));
+var _MessageContainer = _interopRequireDefault(require("./MessageContainer"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+const UnknownMessage = props => {
+  const {
+    variant = 'incoming'
+  } = props;
+  const {
+    colors
+  } = (0, _useUIKitTheme.default)();
+  const color = colors.ui.groupChannelMessage['incoming'];
+  const titleColor = variant === 'incoming' ? colors.onBackground01 : colors.onBackgroundReverse01;
+  const descColor = variant === 'incoming' ? colors.onBackground02 : colors.onBackgroundReverse02;
+  return /*#__PURE__*/_react.default.createElement(_MessageContainer.default, props, /*#__PURE__*/_react.default.createElement(_PressBox.default, {
+    onPress: props.onPress,
+    onLongPress: props.onLongPress
+  }, _ref => {
+    var _props$strings, _props$strings2;
+    let {
+      pressed
+    } = _ref;
+    return /*#__PURE__*/_react.default.createElement(_Box.default, {
+      style: styles.bubble,
+      backgroundColor: pressed ? color.pressed.background : color.enabled.background
+    }, /*#__PURE__*/_react.default.createElement(_Text.default, {
+      body3: true,
+      color: titleColor
+    }, ((_props$strings = props.strings) === null || _props$strings === void 0 ? void 0 : _props$strings.unknownTitle) ?? '(Unknown message type)'), /*#__PURE__*/_react.default.createElement(_Text.default, {
+      body3: true,
+      color: descColor
+    }, ((_props$strings2 = props.strings) === null || _props$strings2 === void 0 ? void 0 : _props$strings2.unknownDescription) ?? 'Cannot read this message.'));
+  }));
+};
+const styles = (0, _createStyleSheet.default)({
+  bubble: {
+    paddingVertical: 6,
+    paddingHorizontal: 12,
+    borderRadius: 16
+  }
+});
+var _default = UnknownMessage;
+exports.default = _default;
+//# sourceMappingURL=Message.unknown.js.map

package/lib/commonjs/ui/GroupChannelMessage/Message.unknown.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireDefault","require","_Box","_PressBox","_Text","_createStyleSheet","_useUIKitTheme","_MessageContainer","obj","__esModule","default","UnknownMessage","props","variant","colors","useUIKitTheme","color","ui","groupChannelMessage","titleColor","onBackground01","onBackgroundReverse01","descColor","onBackground02","onBackgroundReverse02","createElement","onPress","onLongPress","_ref","_props$strings","_props$strings2","pressed","style","styles","bubble","backgroundColor","background","enabled","body3","strings","unknownTitle","unknownDescription","createStyleSheet","paddingVertical","paddingHorizontal","borderRadius","_default","exports"],"sources":["Message.unknown.tsx"],"sourcesContent":["import React from 'react';\n\nimport type { SendbirdMessage } from '@sendbird/uikit-utils';\n\nimport Box from '../../components/Box';\nimport PressBox from '../../components/PressBox';\nimport Text from '../../components/Text';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\nimport MessageContainer from './MessageContainer';\nimport type { GroupChannelMessageProps } from './index';\n\nconst UnknownMessage = (props: GroupChannelMessageProps<SendbirdMessage>) => {\n  const { variant = 'incoming' } = props;\n\n  const { colors } = useUIKitTheme();\n  const color = colors.ui.groupChannelMessage['incoming'];\n  const titleColor = variant === 'incoming' ? colors.onBackground01 : colors.onBackgroundReverse01;\n  const descColor = variant === 'incoming' ? colors.onBackground02 : colors.onBackgroundReverse02;\n\n  return (\n    <MessageContainer {...props}>\n      <PressBox onPress={props.onPress} onLongPress={props.onLongPress}>\n        {({ pressed }) => (\n          <Box style={styles.bubble} backgroundColor={pressed ? color.pressed.background : color.enabled.background}>\n            <Text body3 color={titleColor}>\n              {props.strings?.unknownTitle ?? '(Unknown message type)'}\n            </Text>\n            <Text body3 color={descColor}>\n              {props.strings?.unknownDescription ?? 'Cannot read this message.'}\n            </Text>\n          </Box>\n        )}\n      </PressBox>\n    </MessageContainer>\n  );\n};\n\nconst styles = createStyleSheet({\n  bubble: {\n    paddingVertical: 6,\n    paddingHorizontal: 12,\n    borderRadius: 16,\n  },\n});\n\nexport default UnknownMessage;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAIA,IAAAC,IAAA,GAAAF,sBAAA,CAAAC,OAAA;AACA,IAAAE,SAAA,GAAAH,sBAAA,CAAAC,OAAA;AACA,IAAAG,KAAA,GAAAJ,sBAAA,CAAAC,OAAA;AACA,IAAAI,iBAAA,GAAAL,sBAAA,CAAAC,OAAA;AACA,IAAAK,cAAA,GAAAN,sBAAA,CAAAC,OAAA;AACA,IAAAM,iBAAA,GAAAP,sBAAA,CAAAC,OAAA;AAAkD,SAAAD,uBAAAQ,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAGlD,MAAMG,cAAc,GAAIC,KAAgD,IAAK;EAC3E,MAAM;IAAEC,OAAO,GAAG;EAAW,CAAC,GAAGD,KAAK;EAEtC,MAAM;IAAEE;EAAO,CAAC,GAAG,IAAAC,sBAAa,GAAE;EAClC,MAAMC,KAAK,GAAGF,MAAM,CAACG,EAAE,CAACC,mBAAmB,CAAC,UAAU,CAAC;EACvD,MAAMC,UAAU,GAAGN,OAAO,KAAK,UAAU,GAAGC,MAAM,CAACM,cAAc,GAAGN,MAAM,CAACO,qBAAqB;EAChG,MAAMC,SAAS,GAAGT,OAAO,KAAK,UAAU,GAAGC,MAAM,CAACS,cAAc,GAAGT,MAAM,CAACU,qBAAqB;EAE/F,oBACEzB,MAAA,CAAAW,OAAA,CAAAe,aAAA,CAAClB,iBAAA,CAAAG,OAAgB,EAAKE,KAAK,eACzBb,MAAA,CAAAW,OAAA,CAAAe,aAAA,CAACtB,SAAA,CAAAO,OAAQ;IAACgB,OAAO,EAAEd,KAAK,CAACc,OAAQ;IAACC,WAAW,EAAEf,KAAK,CAACe;EAAY,GAC9DC,IAAA;IAAA,IAAAC,cAAA,EAAAC,eAAA;IAAA,IAAC;MAAEC;IAAQ,CAAC,GAAAH,IAAA;IAAA,oBACX7B,MAAA,CAAAW,OAAA,CAAAe,aAAA,CAACvB,IAAA,CAAAQ,OAAG;MAACsB,KAAK,EAAEC,MAAM,CAACC,MAAO;MAACC,eAAe,EAAEJ,OAAO,GAAGf,KAAK,CAACe,OAAO,CAACK,UAAU,GAAGpB,KAAK,CAACqB,OAAO,CAACD;IAAW,gBACxGrC,MAAA,CAAAW,OAAA,CAAAe,aAAA,CAACrB,KAAA,CAAAM,OAAI;MAAC4B,KAAK;MAACtB,KAAK,EAAEG;IAAW,GAC3B,EAAAU,cAAA,GAAAjB,KAAK,CAAC2B,OAAO,cAAAV,cAAA,uBAAbA,cAAA,CAAeW,YAAY,KAAI,wBAAwB,CACnD,eACPzC,MAAA,CAAAW,OAAA,CAAAe,aAAA,CAACrB,KAAA,CAAAM,OAAI;MAAC4B,KAAK;MAACtB,KAAK,EAAEM;IAAU,GAC1B,EAAAQ,eAAA,GAAAlB,KAAK,CAAC2B,OAAO,cAAAT,eAAA,uBAAbA,eAAA,CAAeW,kBAAkB,KAAI,2BAA2B,CAC5D,CACH;EAAA,CACP,CACQ,CACM;AAEvB,CAAC;AAED,MAAMR,MAAM,GAAG,IAAAS,yBAAgB,EAAC;EAC9BR,MAAM,EAAE;IACNS,eAAe,EAAE,CAAC;IAClBC,iBAAiB,EAAE,EAAE;IACrBC,YAAY,EAAE;EAChB;AACF,CAAC,CAAC;AAAC,IAAAC,QAAA,GAEYnC,cAAc;AAAAoC,OAAA,CAAArC,OAAA,GAAAoC,QAAA"}

package/lib/commonjs/ui/GroupChannelMessage/Message.user.js

@@ -0,0 +1,44 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _Box = _interopRequireDefault(require("../../components/Box"));
+var _PressBox = _interopRequireDefault(require("../../components/PressBox"));
+var _createStyleSheet = _interopRequireDefault(require("../../styles/createStyleSheet"));
+var _useUIKitTheme = _interopRequireDefault(require("../../theme/useUIKitTheme"));
+var _MessageBubbleWithText = _interopRequireDefault(require("./MessageBubbleWithText"));
+var _MessageContainer = _interopRequireDefault(require("./MessageContainer"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+const UserMessage = props => {
+  const {
+    variant = 'incoming'
+  } = props;
+  const {
+    colors
+  } = (0, _useUIKitTheme.default)();
+  const color = colors.ui.groupChannelMessage[variant];
+  return /*#__PURE__*/_react.default.createElement(_MessageContainer.default, props, /*#__PURE__*/_react.default.createElement(_PressBox.default, {
+    onPress: props.onPress,
+    onLongPress: props.onLongPress
+  }, _ref => {
+    let {
+      pressed
+    } = _ref;
+    return /*#__PURE__*/_react.default.createElement(_Box.default, {
+      backgroundColor: pressed ? color.pressed.background : color.enabled.background,
+      style: styles.container
+    }, /*#__PURE__*/_react.default.createElement(_MessageBubbleWithText.default, props), props.children);
+  }));
+};
+const styles = (0, _createStyleSheet.default)({
+  container: {
+    overflow: 'hidden',
+    borderRadius: 16
+  }
+});
+var _default = UserMessage;
+exports.default = _default;
+//# sourceMappingURL=Message.user.js.map

package/lib/commonjs/ui/GroupChannelMessage/Message.user.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireDefault","require","_Box","_PressBox","_createStyleSheet","_useUIKitTheme","_MessageBubbleWithText","_MessageContainer","obj","__esModule","default","UserMessage","props","variant","colors","useUIKitTheme","color","ui","groupChannelMessage","createElement","onPress","onLongPress","_ref","pressed","backgroundColor","background","enabled","style","styles","container","children","createStyleSheet","overflow","borderRadius","_default","exports"],"sources":["Message.user.tsx"],"sourcesContent":["import React from 'react';\n\nimport type { SendbirdUserMessage } from '@sendbird/uikit-utils';\n\nimport Box from '../../components/Box';\nimport PressBox from '../../components/PressBox';\nimport type { RegexTextPattern } from '../../components/RegexText';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\nimport MessageBubbleWithText from './MessageBubbleWithText';\nimport MessageContainer from './MessageContainer';\nimport type { GroupChannelMessageProps } from './index';\n\ntype Props = GroupChannelMessageProps<\n  SendbirdUserMessage,\n  {\n    regexTextPatterns?: RegexTextPattern[];\n    renderRegexTextChildren?: (message: SendbirdUserMessage) => string;\n  }\n>;\n\nconst UserMessage = (props: Props) => {\n  const { variant = 'incoming' } = props;\n\n  const { colors } = useUIKitTheme();\n  const color = colors.ui.groupChannelMessage[variant];\n\n  return (\n    <MessageContainer {...props}>\n      <PressBox onPress={props.onPress} onLongPress={props.onLongPress}>\n        {({ pressed }) => (\n          <Box backgroundColor={pressed ? color.pressed.background : color.enabled.background} style={styles.container}>\n            <MessageBubbleWithText {...props} />\n            {props.children}\n          </Box>\n        )}\n      </PressBox>\n    </MessageContainer>\n  );\n};\n\nconst styles = createStyleSheet({\n  container: {\n    overflow: 'hidden',\n    borderRadius: 16,\n  },\n});\n\nexport default UserMessage;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAIA,IAAAC,IAAA,GAAAF,sBAAA,CAAAC,OAAA;AACA,IAAAE,SAAA,GAAAH,sBAAA,CAAAC,OAAA;AAEA,IAAAG,iBAAA,GAAAJ,sBAAA,CAAAC,OAAA;AACA,IAAAI,cAAA,GAAAL,sBAAA,CAAAC,OAAA;AACA,IAAAK,sBAAA,GAAAN,sBAAA,CAAAC,OAAA;AACA,IAAAM,iBAAA,GAAAP,sBAAA,CAAAC,OAAA;AAAkD,SAAAD,uBAAAQ,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAWlD,MAAMG,WAAW,GAAIC,KAAY,IAAK;EACpC,MAAM;IAAEC,OAAO,GAAG;EAAW,CAAC,GAAGD,KAAK;EAEtC,MAAM;IAAEE;EAAO,CAAC,GAAG,IAAAC,sBAAa,GAAE;EAClC,MAAMC,KAAK,GAAGF,MAAM,CAACG,EAAE,CAACC,mBAAmB,CAACL,OAAO,CAAC;EAEpD,oBACEd,MAAA,CAAAW,OAAA,CAAAS,aAAA,CAACZ,iBAAA,CAAAG,OAAgB,EAAKE,KAAK,eACzBb,MAAA,CAAAW,OAAA,CAAAS,aAAA,CAAChB,SAAA,CAAAO,OAAQ;IAACU,OAAO,EAAER,KAAK,CAACQ,OAAQ;IAACC,WAAW,EAAET,KAAK,CAACS;EAAY,GAC9DC,IAAA;IAAA,IAAC;MAAEC;IAAQ,CAAC,GAAAD,IAAA;IAAA,oBACXvB,MAAA,CAAAW,OAAA,CAAAS,aAAA,CAACjB,IAAA,CAAAQ,OAAG;MAACc,eAAe,EAAED,OAAO,GAAGP,KAAK,CAACO,OAAO,CAACE,UAAU,GAAGT,KAAK,CAACU,OAAO,CAACD,UAAW;MAACE,KAAK,EAAEC,MAAM,CAACC;IAAU,gBAC3G9B,MAAA,CAAAW,OAAA,CAAAS,aAAA,CAACb,sBAAA,CAAAI,OAAqB,EAAKE,KAAK,CAAI,EACnCA,KAAK,CAACkB,QAAQ,CACX;EAAA,CACP,CACQ,CACM;AAEvB,CAAC;AAED,MAAMF,MAAM,GAAG,IAAAG,yBAAgB,EAAC;EAC9BF,SAAS,EAAE;IACTG,QAAQ,EAAE,QAAQ;IAClBC,YAAY,EAAE;EAChB;AACF,CAAC,CAAC;AAAC,IAAAC,QAAA,GAEYvB,WAAW;AAAAwB,OAAA,CAAAzB,OAAA,GAAAwB,QAAA"}

package/lib/commonjs/ui/GroupChannelMessage/Message.user.og.js

@@ -0,0 +1,59 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _Box = _interopRequireDefault(require("../../components/Box"));
+var _PressBox = _interopRequireDefault(require("../../components/PressBox"));
+var _createStyleSheet = _interopRequireDefault(require("../../styles/createStyleSheet"));
+var _useUIKitTheme = _interopRequireDefault(require("../../theme/useUIKitTheme"));
+var _MessageBubbleWithText = _interopRequireDefault(require("./MessageBubbleWithText"));
+var _MessageContainer = _interopRequireDefault(require("./MessageContainer"));
+var _MessageOpenGraph = _interopRequireDefault(require("./MessageOpenGraph"));
+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 OpenGraphUserMessage = props => {
+  const {
+    variant = 'incoming'
+  } = props;
+  const {
+    palette,
+    select,
+    colors
+  } = (0, _useUIKitTheme.default)();
+  const color = colors.ui.groupChannelMessage[variant];
+  const containerBackgroundColor = select({
+    dark: palette.background400,
+    light: palette.background100
+  });
+  return /*#__PURE__*/_react.default.createElement(_MessageContainer.default, props, /*#__PURE__*/_react.default.createElement(_PressBox.default, {
+    onPress: props.onPress,
+    onLongPress: props.onLongPress
+  }, _ref => {
+    let {
+      pressed
+    } = _ref;
+    return /*#__PURE__*/_react.default.createElement(_Box.default, {
+      backgroundColor: containerBackgroundColor,
+      style: styles.container
+    }, /*#__PURE__*/_react.default.createElement(_MessageBubbleWithText.default, _extends({
+      backgroundColor: pressed ? color.pressed.background : color.enabled.background
+    }, props)), props.message.ogMetaData && /*#__PURE__*/_react.default.createElement(_MessageOpenGraph.default, {
+      variant: variant,
+      ogMetaData: props.message.ogMetaData,
+      onLongPress: props.onLongPress,
+      onPressURL: props.onPressURL
+    }), props.children);
+  }));
+};
+const styles = (0, _createStyleSheet.default)({
+  container: {
+    borderRadius: 16,
+    overflow: 'hidden'
+  }
+});
+var _default = OpenGraphUserMessage;
+exports.default = _default;
+//# sourceMappingURL=Message.user.og.js.map

package/lib/commonjs/ui/GroupChannelMessage/Message.user.og.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireDefault","require","_Box","_PressBox","_createStyleSheet","_useUIKitTheme","_MessageBubbleWithText","_MessageContainer","_MessageOpenGraph","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","OpenGraphUserMessage","props","variant","palette","select","colors","useUIKitTheme","color","ui","groupChannelMessage","containerBackgroundColor","dark","background400","light","background100","createElement","onPress","onLongPress","_ref","pressed","backgroundColor","style","styles","container","background","enabled","message","ogMetaData","onPressURL","children","createStyleSheet","borderRadius","overflow","_default","exports"],"sources":["Message.user.og.tsx"],"sourcesContent":["import React from 'react';\n\nimport type { SendbirdUserMessage } from '@sendbird/uikit-utils';\n\nimport Box from '../../components/Box';\nimport PressBox from '../../components/PressBox';\nimport type { RegexTextPattern } from '../../components/RegexText';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\nimport MessageBubbleWithText from './MessageBubbleWithText';\nimport MessageContainer from './MessageContainer';\nimport MessageOpenGraph from './MessageOpenGraph';\nimport type { GroupChannelMessageProps } from './index';\n\ntype Props = GroupChannelMessageProps<\n  SendbirdUserMessage,\n  {\n    regexTextPatterns?: RegexTextPattern[];\n    renderRegexTextChildren?: (message: SendbirdUserMessage) => string;\n  }\n>;\n\nconst OpenGraphUserMessage = (props: Props) => {\n  const { variant = 'incoming' } = props;\n\n  const { palette, select, colors } = useUIKitTheme();\n  const color = colors.ui.groupChannelMessage[variant];\n  const containerBackgroundColor = select({ dark: palette.background400, light: palette.background100 });\n\n  return (\n    <MessageContainer {...props}>\n      <PressBox onPress={props.onPress} onLongPress={props.onLongPress}>\n        {({ pressed }) => (\n          <Box backgroundColor={containerBackgroundColor} style={styles.container}>\n            <MessageBubbleWithText\n              backgroundColor={pressed ? color.pressed.background : color.enabled.background}\n              {...props}\n            />\n            {props.message.ogMetaData && (\n              <MessageOpenGraph\n                variant={variant}\n                ogMetaData={props.message.ogMetaData}\n                onLongPress={props.onLongPress}\n                onPressURL={props.onPressURL}\n              />\n            )}\n            {props.children}\n          </Box>\n        )}\n      </PressBox>\n    </MessageContainer>\n  );\n};\n\nconst styles = createStyleSheet({\n  container: {\n    borderRadius: 16,\n    overflow: 'hidden',\n  },\n});\n\nexport default OpenGraphUserMessage;\n"],"mappings":"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"}

package/lib/commonjs/ui/GroupChannelMessage/MessageBubbleWithText.js

@@ -0,0 +1,74 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _uikitUtils = require("@sendbird/uikit-utils");
+var _Box = _interopRequireDefault(require("../../components/Box"));
+var _RegexText = _interopRequireDefault(require("../../components/RegexText"));
+var _Text = _interopRequireDefault(require("../../components/Text"));
+var _createStyleSheet = _interopRequireDefault(require("../../styles/createStyleSheet"));
+var _useUIKitTheme = _interopRequireDefault(require("../../theme/useUIKitTheme"));
+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 MessageBubbleWithText = _ref => {
+  let {
+    backgroundColor,
+    message,
+    onPressURL,
+    onLongPress,
+    strings,
+    variant = 'incoming',
+    regexTextPatterns = [],
+    renderRegexTextChildren = msg => msg.message
+  } = _ref;
+  const {
+    colors
+  } = (0, _useUIKitTheme.default)();
+  const color = colors.ui.groupChannelMessage[variant];
+  return /*#__PURE__*/_react.default.createElement(_Box.default, {
+    backgroundColor: backgroundColor,
+    style: styles.bubble
+  }, /*#__PURE__*/_react.default.createElement(_Text.default, {
+    body3: true,
+    color: color.enabled.textMsg,
+    suppressHighlighting: true
+  }, /*#__PURE__*/_react.default.createElement(_RegexText.default, {
+    body3: true,
+    color: color.enabled.textMsg,
+    patterns: [...regexTextPatterns, {
+      regex: _uikitUtils.urlRegexStrict,
+      replacer(_ref2) {
+        let {
+          match,
+          parentProps,
+          keyPrefix,
+          index
+        } = _ref2;
+        return /*#__PURE__*/_react.default.createElement(_Text.default, _extends({}, parentProps, {
+          key: `${keyPrefix}-${index}`,
+          onPress: () => onPressURL === null || onPressURL === void 0 ? void 0 : onPressURL(match),
+          onLongPress: onLongPress,
+          style: [parentProps === null || parentProps === void 0 ? void 0 : parentProps.style, styles.urlText]
+        }), match);
+      }
+    }]
+  }, renderRegexTextChildren(message)), Boolean(message.updatedAt) && /*#__PURE__*/_react.default.createElement(_Text.default, {
+    body3: true,
+    color: color.enabled.textEdited
+  }, (strings === null || strings === void 0 ? void 0 : strings.edited) ?? ' (edited)')));
+};
+const styles = (0, _createStyleSheet.default)({
+  bubble: {
+    paddingHorizontal: 12,
+    paddingVertical: 6
+  },
+  urlText: {
+    textDecorationLine: 'underline'
+  }
+});
+var _default = MessageBubbleWithText;
+exports.default = _default;
+//# sourceMappingURL=MessageBubbleWithText.js.map

package/lib/commonjs/ui/GroupChannelMessage/MessageBubbleWithText.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireDefault","require","_uikitUtils","_Box","_RegexText","_Text","_createStyleSheet","_useUIKitTheme","obj","__esModule","default","_extends","Object","assign","bind","target","i","arguments","length","source","key","prototype","hasOwnProperty","call","apply","MessageBubbleWithText","_ref","backgroundColor","message","onPressURL","onLongPress","strings","variant","regexTextPatterns","renderRegexTextChildren","msg","colors","useUIKitTheme","color","ui","groupChannelMessage","createElement","style","styles","bubble","body3","enabled","textMsg","suppressHighlighting","patterns","regex","urlRegexStrict","replacer","_ref2","match","parentProps","keyPrefix","index","onPress","urlText","Boolean","updatedAt","textEdited","edited","createStyleSheet","paddingHorizontal","paddingVertical","textDecorationLine","_default","exports"],"sources":["MessageBubbleWithText.tsx"],"sourcesContent":["import React from 'react';\n\nimport { SendbirdUserMessage, urlRegexStrict } from '@sendbird/uikit-utils';\n\nimport Box from '../../components/Box';\nimport RegexText, { RegexTextPattern } from '../../components/RegexText';\nimport Text from '../../components/Text';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\nimport type { GroupChannelMessageProps } from './index';\n\ntype Props = GroupChannelMessageProps<\n  SendbirdUserMessage,\n  {\n    backgroundColor?: string;\n    regexTextPatterns?: RegexTextPattern[];\n    renderRegexTextChildren?: (message: SendbirdUserMessage) => string;\n  }\n>;\n\nconst MessageBubbleWithText = ({\n  backgroundColor,\n  message,\n  onPressURL,\n  onLongPress,\n  strings,\n  variant = 'incoming',\n  regexTextPatterns = [],\n  renderRegexTextChildren = (msg) => msg.message,\n}: Props) => {\n  const { colors } = useUIKitTheme();\n  const color = colors.ui.groupChannelMessage[variant];\n  return (\n    <Box backgroundColor={backgroundColor} style={styles.bubble}>\n      <Text body3 color={color.enabled.textMsg} suppressHighlighting>\n        <RegexText\n          body3\n          color={color.enabled.textMsg}\n          patterns={[\n            ...regexTextPatterns,\n            {\n              regex: urlRegexStrict,\n              replacer({ match, parentProps, keyPrefix, index }) {\n                return (\n                  <Text\n                    {...parentProps}\n                    key={`${keyPrefix}-${index}`}\n                    onPress={() => onPressURL?.(match)}\n                    onLongPress={onLongPress}\n                    style={[parentProps?.style, styles.urlText]}\n                  >\n                    {match}\n                  </Text>\n                );\n              },\n            },\n          ]}\n        >\n          {renderRegexTextChildren(message)}\n        </RegexText>\n        {Boolean(message.updatedAt) && (\n          <Text body3 color={color.enabled.textEdited}>\n            {strings?.edited ?? ' (edited)'}\n          </Text>\n        )}\n      </Text>\n    </Box>\n  );\n};\n\nconst styles = createStyleSheet({\n  bubble: {\n    paddingHorizontal: 12,\n    paddingVertical: 6,\n  },\n  urlText: {\n    textDecorationLine: 'underline',\n  },\n});\nexport default MessageBubbleWithText;\n"],"mappings":"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"}

package/lib/commonjs/ui/GroupChannelMessage/MessageContainer.js

@@ -0,0 +1,110 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _reactNative = require("react-native");
+var _uikitUtils = require("@sendbird/uikit-utils");
+var _Box = _interopRequireDefault(require("../../components/Box"));
+var _Text = _interopRequireDefault(require("../../components/Text"));
+var _createStyleSheet = _interopRequireDefault(require("../../styles/createStyleSheet"));
+var _useUIKitTheme = _interopRequireDefault(require("../../theme/useUIKitTheme"));
+var _Avatar = _interopRequireDefault(require("../Avatar"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+const MessageContainer = props => {
+  if (props.variant === 'incoming') {
+    return /*#__PURE__*/_react.default.createElement(MessageContainer.Incoming, props);
+  } else {
+    return /*#__PURE__*/_react.default.createElement(MessageContainer.Outgoing, props);
+  }
+};
+MessageContainer.Incoming = function MessageContainerIncoming(_ref) {
+  var _message$sender;
+  let {
+    children,
+    groupedWithNext,
+    groupedWithPrev,
+    message,
+    onPressAvatar,
+    strings
+  } = _ref;
+  const {
+    colors
+  } = (0, _useUIKitTheme.default)();
+  const color = colors.ui.groupChannelMessage.incoming;
+  return /*#__PURE__*/_react.default.createElement(_Box.default, {
+    flexDirection: 'row',
+    justifyContent: 'flex-start',
+    alignItems: 'flex-end'
+  }, /*#__PURE__*/_react.default.createElement(_Box.default, {
+    width: 26,
+    marginRight: 12
+  }, (message.isFileMessage() || message.isUserMessage()) && !groupedWithNext && /*#__PURE__*/_react.default.createElement(_reactNative.Pressable, {
+    onPress: onPressAvatar
+  }, /*#__PURE__*/_react.default.createElement(_Avatar.default, {
+    size: 26,
+    uri: (_message$sender = message.sender) === null || _message$sender === void 0 ? void 0 : _message$sender.profileUrl
+  }))), /*#__PURE__*/_react.default.createElement(_Box.default, {
+    flexShrink: 1
+  }, !groupedWithPrev && /*#__PURE__*/_react.default.createElement(_Box.default, {
+    marginLeft: 12,
+    marginBottom: 4
+  }, (message.isFileMessage() || message.isUserMessage()) && /*#__PURE__*/_react.default.createElement(_Text.default, {
+    caption1: true,
+    color: color.enabled.textSenderName,
+    numberOfLines: 1
+  }, (strings === null || strings === void 0 ? void 0 : strings.senderName) ?? message.sender.nickname)), /*#__PURE__*/_react.default.createElement(_Box.default, {
+    flexDirection: 'row',
+    alignItems: 'flex-end'
+  }, /*#__PURE__*/_react.default.createElement(_Box.default, {
+    style: styles.bubble
+  }, children), !groupedWithNext && /*#__PURE__*/_react.default.createElement(_Box.default, {
+    marginLeft: 4
+  }, /*#__PURE__*/_react.default.createElement(_Text.default, {
+    caption4: true,
+    color: color.enabled.textTime
+  }, (strings === null || strings === void 0 ? void 0 : strings.sentDate) ?? (0, _uikitUtils.getMessageTimeFormat)(new Date(message.createdAt)))))));
+};
+MessageContainer.Outgoing = function MessageContainerOutgoing(_ref2) {
+  let {
+    children,
+    message,
+    groupedWithNext,
+    strings,
+    sendingStatus
+  } = _ref2;
+  const {
+    colors
+  } = (0, _useUIKitTheme.default)();
+  const color = colors.ui.groupChannelMessage.outgoing;
+  return /*#__PURE__*/_react.default.createElement(_Box.default, {
+    flexDirection: 'row',
+    justifyContent: 'flex-end',
+    alignItems: 'flex-end'
+  }, /*#__PURE__*/_react.default.createElement(_Box.default, {
+    flexDirection: 'row',
+    alignItems: 'flex-end',
+    justifyContent: 'center'
+  }, sendingStatus && /*#__PURE__*/_react.default.createElement(_Box.default, {
+    marginRight: 4
+  }, sendingStatus), !groupedWithNext && /*#__PURE__*/_react.default.createElement(_Box.default, {
+    marginRight: 4
+  }, /*#__PURE__*/_react.default.createElement(_Text.default, {
+    caption4: true,
+    color: color.enabled.textTime
+  }, (strings === null || strings === void 0 ? void 0 : strings.sentDate) ?? (0, _uikitUtils.getMessageTimeFormat)(new Date(message.createdAt))))), /*#__PURE__*/_react.default.createElement(_Box.default, {
+    style: styles.bubble
+  }, children));
+};
+const styles = (0, _createStyleSheet.default)({
+  bubble: {
+    maxWidth: 240,
+    overflow: 'hidden',
+    flexShrink: 1
+  }
+});
+var _default = MessageContainer;
+exports.default = _default;
+//# sourceMappingURL=MessageContainer.js.map

package/lib/commonjs/ui/GroupChannelMessage/MessageContainer.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireDefault","require","_reactNative","_uikitUtils","_Box","_Text","_createStyleSheet","_useUIKitTheme","_Avatar","obj","__esModule","default","MessageContainer","props","variant","createElement","Incoming","Outgoing","MessageContainerIncoming","_ref","_message$sender","children","groupedWithNext","groupedWithPrev","message","onPressAvatar","strings","colors","useUIKitTheme","color","ui","groupChannelMessage","incoming","flexDirection","justifyContent","alignItems","width","marginRight","isFileMessage","isUserMessage","Pressable","onPress","size","uri","sender","profileUrl","flexShrink","marginLeft","marginBottom","caption1","enabled","textSenderName","numberOfLines","senderName","nickname","style","styles","bubble","caption4","textTime","sentDate","getMessageTimeFormat","Date","createdAt","MessageContainerOutgoing","_ref2","sendingStatus","outgoing","createStyleSheet","maxWidth","overflow","_default","exports"],"sources":["MessageContainer.tsx"],"sourcesContent":["import React from 'react';\nimport { Pressable } from 'react-native';\n\nimport type { SendbirdMessage } from '@sendbird/uikit-utils';\nimport { getMessageTimeFormat } from '@sendbird/uikit-utils';\n\nimport Box from '../../components/Box';\nimport Text from '../../components/Text';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\nimport Avatar from '../Avatar';\nimport type { GroupChannelMessageProps } from './index';\n\ntype Props = GroupChannelMessageProps<SendbirdMessage>;\n\nconst MessageContainer = (props: Props) => {\n  if (props.variant === 'incoming') {\n    return <MessageContainer.Incoming {...props} />;\n  } else {\n    return <MessageContainer.Outgoing {...props} />;\n  }\n};\n\nMessageContainer.Incoming = function MessageContainerIncoming({\n  children,\n  groupedWithNext,\n  groupedWithPrev,\n  message,\n  onPressAvatar,\n  strings,\n}: Props) {\n  const { colors } = useUIKitTheme();\n  const color = colors.ui.groupChannelMessage.incoming;\n\n  return (\n    <Box flexDirection={'row'} justifyContent={'flex-start'} alignItems={'flex-end'}>\n      <Box width={26} marginRight={12}>\n        {(message.isFileMessage() || message.isUserMessage()) && !groupedWithNext && (\n          <Pressable onPress={onPressAvatar}>\n            <Avatar size={26} uri={message.sender?.profileUrl} />\n          </Pressable>\n        )}\n      </Box>\n      <Box flexShrink={1}>\n        {!groupedWithPrev && (\n          <Box marginLeft={12} marginBottom={4}>\n            {(message.isFileMessage() || message.isUserMessage()) && (\n              <Text caption1 color={color.enabled.textSenderName} numberOfLines={1}>\n                {strings?.senderName ?? message.sender.nickname}\n              </Text>\n            )}\n          </Box>\n        )}\n\n        <Box flexDirection={'row'} alignItems={'flex-end'}>\n          <Box style={styles.bubble}>{children}</Box>\n          {!groupedWithNext && (\n            <Box marginLeft={4}>\n              <Text caption4 color={color.enabled.textTime}>\n                {strings?.sentDate ?? getMessageTimeFormat(new Date(message.createdAt))}\n              </Text>\n            </Box>\n          )}\n        </Box>\n      </Box>\n    </Box>\n  );\n};\n\nMessageContainer.Outgoing = function MessageContainerOutgoing({\n  children,\n  message,\n  groupedWithNext,\n  strings,\n  sendingStatus,\n}: Props) {\n  const { colors } = useUIKitTheme();\n  const color = colors.ui.groupChannelMessage.outgoing;\n\n  return (\n    <Box flexDirection={'row'} justifyContent={'flex-end'} alignItems={'flex-end'}>\n      <Box flexDirection={'row'} alignItems={'flex-end'} justifyContent={'center'}>\n        {sendingStatus && <Box marginRight={4}>{sendingStatus}</Box>}\n\n        {!groupedWithNext && (\n          <Box marginRight={4}>\n            <Text caption4 color={color.enabled.textTime}>\n              {strings?.sentDate ?? getMessageTimeFormat(new Date(message.createdAt))}\n            </Text>\n          </Box>\n        )}\n      </Box>\n      <Box style={styles.bubble}>{children}</Box>\n    </Box>\n  );\n};\n\nconst styles = createStyleSheet({\n  bubble: {\n    maxWidth: 240,\n    overflow: 'hidden',\n    flexShrink: 1,\n  },\n});\n\nexport default MessageContainer;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AAGA,IAAAE,WAAA,GAAAF,OAAA;AAEA,IAAAG,IAAA,GAAAJ,sBAAA,CAAAC,OAAA;AACA,IAAAI,KAAA,GAAAL,sBAAA,CAAAC,OAAA;AACA,IAAAK,iBAAA,GAAAN,sBAAA,CAAAC,OAAA;AACA,IAAAM,cAAA,GAAAP,sBAAA,CAAAC,OAAA;AACA,IAAAO,OAAA,GAAAR,sBAAA,CAAAC,OAAA;AAA+B,SAAAD,uBAAAS,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAK/B,MAAMG,gBAAgB,GAAIC,KAAY,IAAK;EACzC,IAAIA,KAAK,CAACC,OAAO,KAAK,UAAU,EAAE;IAChC,oBAAOf,MAAA,CAAAY,OAAA,CAAAI,aAAA,CAACH,gBAAgB,CAACI,QAAQ,EAAKH,KAAK,CAAI;EACjD,CAAC,MAAM;IACL,oBAAOd,MAAA,CAAAY,OAAA,CAAAI,aAAA,CAACH,gBAAgB,CAACK,QAAQ,EAAKJ,KAAK,CAAI;EACjD;AACF,CAAC;AAEDD,gBAAgB,CAACI,QAAQ,GAAG,SAASE,wBAAwBA,CAAAC,IAAA,EAOnD;EAAA,IAAAC,eAAA;EAAA,IAPoD;IAC5DC,QAAQ;IACRC,eAAe;IACfC,eAAe;IACfC,OAAO;IACPC,aAAa;IACbC;EACK,CAAC,GAAAP,IAAA;EACN,MAAM;IAAEQ;EAAO,CAAC,GAAG,IAAAC,sBAAa,GAAE;EAClC,MAAMC,KAAK,GAAGF,MAAM,CAACG,EAAE,CAACC,mBAAmB,CAACC,QAAQ;EAEpD,oBACEjC,MAAA,CAAAY,OAAA,CAAAI,aAAA,CAACX,IAAA,CAAAO,OAAG;IAACsB,aAAa,EAAE,KAAM;IAACC,cAAc,EAAE,YAAa;IAACC,UAAU,EAAE;EAAW,gBAC9EpC,MAAA,CAAAY,OAAA,CAAAI,aAAA,CAACX,IAAA,CAAAO,OAAG;IAACyB,KAAK,EAAE,EAAG;IAACC,WAAW,EAAE;EAAG,GAC7B,CAACb,OAAO,CAACc,aAAa,EAAE,IAAId,OAAO,CAACe,aAAa,EAAE,KAAK,CAACjB,eAAe,iBACvEvB,MAAA,CAAAY,OAAA,CAAAI,aAAA,CAACb,YAAA,CAAAsC,SAAS;IAACC,OAAO,EAAEhB;EAAc,gBAChC1B,MAAA,CAAAY,OAAA,CAAAI,aAAA,CAACP,OAAA,CAAAG,OAAM;IAAC+B,IAAI,EAAE,EAAG;IAACC,GAAG,GAAAvB,eAAA,GAAEI,OAAO,CAACoB,MAAM,cAAAxB,eAAA,uBAAdA,eAAA,CAAgByB;EAAW,EAAG,CAExD,CACG,eACN9C,MAAA,CAAAY,OAAA,CAAAI,aAAA,CAACX,IAAA,CAAAO,OAAG;IAACmC,UAAU,EAAE;EAAE,GAChB,CAACvB,eAAe,iBACfxB,MAAA,CAAAY,OAAA,CAAAI,aAAA,CAACX,IAAA,CAAAO,OAAG;IAACoC,UAAU,EAAE,EAAG;IAACC,YAAY,EAAE;EAAE,GAClC,CAACxB,OAAO,CAACc,aAAa,EAAE,IAAId,OAAO,CAACe,aAAa,EAAE,kBAClDxC,MAAA,CAAAY,OAAA,CAAAI,aAAA,CAACV,KAAA,CAAAM,OAAI;IAACsC,QAAQ;IAACpB,KAAK,EAAEA,KAAK,CAACqB,OAAO,CAACC,cAAe;IAACC,aAAa,EAAE;EAAE,GAClE,CAAA1B,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAE2B,UAAU,KAAI7B,OAAO,CAACoB,MAAM,CAACU,QAAQ,CAElD,CAEJ,eAEDvD,MAAA,CAAAY,OAAA,CAAAI,aAAA,CAACX,IAAA,CAAAO,OAAG;IAACsB,aAAa,EAAE,KAAM;IAACE,UAAU,EAAE;EAAW,gBAChDpC,MAAA,CAAAY,OAAA,CAAAI,aAAA,CAACX,IAAA,CAAAO,OAAG;IAAC4C,KAAK,EAAEC,MAAM,CAACC;EAAO,GAAEpC,QAAQ,CAAO,EAC1C,CAACC,eAAe,iBACfvB,MAAA,CAAAY,OAAA,CAAAI,aAAA,CAACX,IAAA,CAAAO,OAAG;IAACoC,UAAU,EAAE;EAAE,gBACjBhD,MAAA,CAAAY,OAAA,CAAAI,aAAA,CAACV,KAAA,CAAAM,OAAI;IAAC+C,QAAQ;IAAC7B,KAAK,EAAEA,KAAK,CAACqB,OAAO,CAACS;EAAS,GAC1C,CAAAjC,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEkC,QAAQ,KAAI,IAAAC,gCAAoB,EAAC,IAAIC,IAAI,CAACtC,OAAO,CAACuC,SAAS,CAAC,CAAC,CAClE,CAEV,CACG,CACF,CACF;AAEV,CAAC;AAEDnD,gBAAgB,CAACK,QAAQ,GAAG,SAAS+C,wBAAwBA,CAAAC,KAAA,EAMnD;EAAA,IANoD;IAC5D5C,QAAQ;IACRG,OAAO;IACPF,eAAe;IACfI,OAAO;IACPwC;EACK,CAAC,GAAAD,KAAA;EACN,MAAM;IAAEtC;EAAO,CAAC,GAAG,IAAAC,sBAAa,GAAE;EAClC,MAAMC,KAAK,GAAGF,MAAM,CAACG,EAAE,CAACC,mBAAmB,CAACoC,QAAQ;EAEpD,oBACEpE,MAAA,CAAAY,OAAA,CAAAI,aAAA,CAACX,IAAA,CAAAO,OAAG;IAACsB,aAAa,EAAE,KAAM;IAACC,cAAc,EAAE,UAAW;IAACC,UAAU,EAAE;EAAW,gBAC5EpC,MAAA,CAAAY,OAAA,CAAAI,aAAA,CAACX,IAAA,CAAAO,OAAG;IAACsB,aAAa,EAAE,KAAM;IAACE,UAAU,EAAE,UAAW;IAACD,cAAc,EAAE;EAAS,GACzEgC,aAAa,iBAAInE,MAAA,CAAAY,OAAA,CAAAI,aAAA,CAACX,IAAA,CAAAO,OAAG;IAAC0B,WAAW,EAAE;EAAE,GAAE6B,aAAa,CAAO,EAE3D,CAAC5C,eAAe,iBACfvB,MAAA,CAAAY,OAAA,CAAAI,aAAA,CAACX,IAAA,CAAAO,OAAG;IAAC0B,WAAW,EAAE;EAAE,gBAClBtC,MAAA,CAAAY,OAAA,CAAAI,aAAA,CAACV,KAAA,CAAAM,OAAI;IAAC+C,QAAQ;IAAC7B,KAAK,EAAEA,KAAK,CAACqB,OAAO,CAACS;EAAS,GAC1C,CAAAjC,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEkC,QAAQ,KAAI,IAAAC,gCAAoB,EAAC,IAAIC,IAAI,CAACtC,OAAO,CAACuC,SAAS,CAAC,CAAC,CAClE,CAEV,CACG,eACNhE,MAAA,CAAAY,OAAA,CAAAI,aAAA,CAACX,IAAA,CAAAO,OAAG;IAAC4C,KAAK,EAAEC,MAAM,CAACC;EAAO,GAAEpC,QAAQ,CAAO,CACvC;AAEV,CAAC;AAED,MAAMmC,MAAM,GAAG,IAAAY,yBAAgB,EAAC;EAC9BX,MAAM,EAAE;IACNY,QAAQ,EAAE,GAAG;IACbC,QAAQ,EAAE,QAAQ;IAClBxB,UAAU,EAAE;EACd;AACF,CAAC,CAAC;AAAC,IAAAyB,QAAA,GAEY3D,gBAAgB;AAAA4D,OAAA,CAAA7D,OAAA,GAAA4D,QAAA"}

package/lib/commonjs/ui/GroupChannelMessage/MessageOpenGraph.js

@@ -0,0 +1,91 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _Box = _interopRequireDefault(require("../../components/Box"));
+var _ImageWithPlaceholder = _interopRequireDefault(require("../../components/ImageWithPlaceholder"));
+var _PressBox = _interopRequireDefault(require("../../components/PressBox"));
+var _Text = _interopRequireDefault(require("../../components/Text"));
+var _createStyleSheet = _interopRequireDefault(require("../../styles/createStyleSheet"));
+var _useUIKitTheme = _interopRequireDefault(require("../../theme/useUIKitTheme"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+const MessageOpenGraph = _ref => {
+  let {
+    onPressURL,
+    onLongPress,
+    ogMetaData,
+    variant
+  } = _ref;
+  const {
+    palette,
+    select,
+    colors
+  } = (0, _useUIKitTheme.default)();
+  const color = colors.ui.groupChannelMessage[variant];
+  return /*#__PURE__*/_react.default.createElement(_PressBox.default, {
+    activeOpacity: 0.85,
+    onPress: () => typeof (ogMetaData === null || ogMetaData === void 0 ? void 0 : ogMetaData.url) === 'string' && (onPressURL === null || onPressURL === void 0 ? void 0 : onPressURL(ogMetaData.url)),
+    onLongPress: onLongPress
+  }, _ref2 => {
+    let {
+      pressed
+    } = _ref2;
+    return /*#__PURE__*/_react.default.createElement(_Box.default, {
+      backgroundColor: pressed ? color.pressed.background : color.enabled.background
+    }, Boolean(ogMetaData.defaultImage) && /*#__PURE__*/_react.default.createElement(_ImageWithPlaceholder.default, {
+      style: styles.ogImage,
+      source: {
+        uri: ogMetaData.defaultImage.url
+      }
+    }), /*#__PURE__*/_react.default.createElement(_Box.default, {
+      style: styles.ogContainer,
+      backgroundColor: select({
+        dark: palette.background400,
+        light: palette.background100
+      })
+    }, /*#__PURE__*/_react.default.createElement(_Text.default, {
+      numberOfLines: 3,
+      body2: true,
+      color: colors.onBackground01,
+      style: styles.ogTitle
+    }, ogMetaData.title), Boolean(ogMetaData.description) && /*#__PURE__*/_react.default.createElement(_Text.default, {
+      numberOfLines: 1,
+      caption2: true,
+      color: colors.onBackground01,
+      style: styles.ogDesc
+    }, ogMetaData.description), /*#__PURE__*/_react.default.createElement(_Text.default, {
+      numberOfLines: 1,
+      caption2: true,
+      color: colors.onBackground02
+    }, ogMetaData.url)));
+  });
+};
+const styles = (0, _createStyleSheet.default)({
+  ogContainer: {
+    overflow: 'hidden',
+    paddingHorizontal: 12,
+    paddingTop: 8,
+    paddingBottom: 12
+  },
+  ogImage: {
+    maxWidth: 240,
+    width: 240,
+    height: 136
+  },
+  ogUrl: {
+    marginBottom: 4
+  },
+  ogTitle: {
+    marginBottom: 4
+  },
+  ogDesc: {
+    lineHeight: 14,
+    marginBottom: 8
+  }
+});
+var _default = MessageOpenGraph;
+exports.default = _default;
+//# sourceMappingURL=MessageOpenGraph.js.map

package/lib/commonjs/ui/GroupChannelMessage/MessageOpenGraph.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireDefault","require","_Box","_ImageWithPlaceholder","_PressBox","_Text","_createStyleSheet","_useUIKitTheme","obj","__esModule","default","MessageOpenGraph","_ref","onPressURL","onLongPress","ogMetaData","variant","palette","select","colors","useUIKitTheme","color","ui","groupChannelMessage","createElement","activeOpacity","onPress","url","_ref2","pressed","backgroundColor","background","enabled","Boolean","defaultImage","style","styles","ogImage","source","uri","ogContainer","dark","background400","light","background100","numberOfLines","body2","onBackground01","ogTitle","title","description","caption2","ogDesc","onBackground02","createStyleSheet","overflow","paddingHorizontal","paddingTop","paddingBottom","maxWidth","width","height","ogUrl","marginBottom","lineHeight","_default","exports"],"sources":["MessageOpenGraph.tsx"],"sourcesContent":["import React from 'react';\n\nimport type { SendbirdUserMessage } from '@sendbird/uikit-utils';\n\nimport Box from '../../components/Box';\nimport ImageWithPlaceholder from '../../components/ImageWithPlaceholder';\nimport PressBox from '../../components/PressBox';\nimport Text from '../../components/Text';\nimport createStyleSheet from '../../styles/createStyleSheet';\nimport useUIKitTheme from '../../theme/useUIKitTheme';\n\nconst MessageOpenGraph = ({\n  onPressURL,\n  onLongPress,\n  ogMetaData,\n  variant,\n}: {\n  ogMetaData: Required<SendbirdUserMessage>['ogMetaData'];\n  variant: 'outgoing' | 'incoming';\n  onPressURL?: (url: string) => void;\n  onLongPress?: () => void;\n}) => {\n  const { palette, select, colors } = useUIKitTheme();\n  const color = colors.ui.groupChannelMessage[variant];\n\n  return (\n    <PressBox\n      activeOpacity={0.85}\n      onPress={() => typeof ogMetaData?.url === 'string' && onPressURL?.(ogMetaData.url)}\n      onLongPress={onLongPress}\n    >\n      {({ pressed }) => (\n        <Box backgroundColor={pressed ? color.pressed.background : color.enabled.background}>\n          {Boolean(ogMetaData.defaultImage) && (\n            <ImageWithPlaceholder style={styles.ogImage} source={{ uri: ogMetaData.defaultImage.url }} />\n          )}\n\n          <Box\n            style={styles.ogContainer}\n            backgroundColor={select({ dark: palette.background400, light: palette.background100 })}\n          >\n            <Text numberOfLines={3} body2 color={colors.onBackground01} style={styles.ogTitle}>\n              {ogMetaData.title}\n            </Text>\n            {Boolean(ogMetaData.description) && (\n              <Text numberOfLines={1} caption2 color={colors.onBackground01} style={styles.ogDesc}>\n                {ogMetaData.description}\n              </Text>\n            )}\n            <Text numberOfLines={1} caption2 color={colors.onBackground02}>\n              {ogMetaData.url}\n            </Text>\n          </Box>\n        </Box>\n      )}\n    </PressBox>\n  );\n};\n\nconst styles = createStyleSheet({\n  ogContainer: {\n    overflow: 'hidden',\n    paddingHorizontal: 12,\n    paddingTop: 8,\n    paddingBottom: 12,\n  },\n  ogImage: {\n    maxWidth: 240,\n    width: 240,\n    height: 136,\n  },\n  ogUrl: {\n    marginBottom: 4,\n  },\n  ogTitle: {\n    marginBottom: 4,\n  },\n  ogDesc: {\n    lineHeight: 14,\n    marginBottom: 8,\n  },\n});\n\nexport default MessageOpenGraph;\n"],"mappings":"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"}

package/lib/commonjs/ui/GroupChannelMessage/index.js

@@ -0,0 +1,26 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _Message = _interopRequireDefault(require("./Message.admin"));
+var _Message2 = _interopRequireDefault(require("./Message.file"));
+var _MessageFile = _interopRequireDefault(require("./Message.file.image"));
+var _MessageFile2 = _interopRequireDefault(require("./Message.file.video"));
+var _Message3 = _interopRequireDefault(require("./Message.unknown"));
+var _Message4 = _interopRequireDefault(require("./Message.user"));
+var _MessageUser = _interopRequireDefault(require("./Message.user.og"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+const GroupChannelMessage = {
+  User: _Message4.default,
+  OpenGraphUser: _MessageUser.default,
+  File: _Message2.default,
+  ImageFile: _MessageFile.default,
+  VideoFile: _MessageFile2.default,
+  Admin: _Message.default,
+  Unknown: _Message3.default
+};
+var _default = GroupChannelMessage;
+exports.default = _default;
+//# sourceMappingURL=index.js.map

package/lib/commonjs/ui/GroupChannelMessage/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_Message","_interopRequireDefault","require","_Message2","_MessageFile","_MessageFile2","_Message3","_Message4","_MessageUser","obj","__esModule","default","GroupChannelMessage","User","UserMessage","OpenGraphUser","File","FileMessage","ImageFile","ImageFileMessage","VideoFile","VideoFileMessage","Admin","AdminMessage","Unknown","UnknownMessage","_default","exports"],"sources":["index.ts"],"sourcesContent":["import type React from 'react';\n\nimport type { SendbirdGroupChannel, SendbirdMessage, SendbirdUser } from '@sendbird/uikit-utils';\n\nimport AdminMessage from './Message.admin';\nimport FileMessage from './Message.file';\nimport ImageFileMessage from './Message.file.image';\nimport VideoFileMessage from './Message.file.video';\nimport UnknownMessage from './Message.unknown';\nimport UserMessage from './Message.user';\nimport OpenGraphUser from './Message.user.og';\n\nexport type GroupChannelMessageProps<T extends SendbirdMessage, AdditionalProps = unknown> = {\n  channel: SendbirdGroupChannel;\n  message: T;\n  variant?: 'outgoing' | 'incoming';\n  strings?: {\n    senderName?: string;\n    sentDate?: string;\n    edited?: string;\n    fileName?: string;\n    unknownTitle?: string;\n    unknownDescription?: string;\n  };\n\n  children?: React.ReactNode;\n  sendingStatus?: React.ReactNode;\n\n  groupedWithPrev: boolean;\n  groupedWithNext: boolean;\n  onPress?: () => void;\n  onLongPress?: () => void;\n  onPressAvatar?: () => void;\n  onPressURL?: (url: string) => void;\n  onPressMentionedUser?: (mentionedUser?: SendbirdUser) => void;\n} & AdditionalProps;\n\nconst GroupChannelMessage = {\n  User: UserMessage,\n  OpenGraphUser: OpenGraphUser,\n  File: FileMessage,\n  ImageFile: ImageFileMessage,\n  VideoFile: VideoFileMessage,\n  Admin: AdminMessage,\n  Unknown: UnknownMessage,\n};\n\nexport default GroupChannelMessage;\n"],"mappings":";;;;;;AAIA,IAAAA,QAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,SAAA,GAAAF,sBAAA,CAAAC,OAAA;AACA,IAAAE,YAAA,GAAAH,sBAAA,CAAAC,OAAA;AACA,IAAAG,aAAA,GAAAJ,sBAAA,CAAAC,OAAA;AACA,IAAAI,SAAA,GAAAL,sBAAA,CAAAC,OAAA;AACA,IAAAK,SAAA,GAAAN,sBAAA,CAAAC,OAAA;AACA,IAAAM,YAAA,GAAAP,sBAAA,CAAAC,OAAA;AAA8C,SAAAD,uBAAAQ,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AA2B9C,MAAMG,mBAAmB,GAAG;EAC1BC,IAAI,EAAEC,iBAAW;EACjBC,aAAa,EAAEA,oBAAa;EAC5BC,IAAI,EAAEC,iBAAW;EACjBC,SAAS,EAAEC,oBAAgB;EAC3BC,SAAS,EAAEC,qBAAgB;EAC3BC,KAAK,EAAEC,gBAAY;EACnBC,OAAO,EAAEC;AACX,CAAC;AAAC,IAAAC,QAAA,GAEad,mBAAmB;AAAAe,OAAA,CAAAhB,OAAA,GAAAe,QAAA"}

package/lib/commonjs/ui/OpenChannelMessage/Message.user.js

@@ -51,7 +51,7 @@ const UserMessage = props => {
           } = _ref2;
           return /*#__PURE__*/_react.default.createElement(_Text.default, _extends({}, parentProps, {
             key: `${keyPrefix}-${index}`,
-            onPress: onPressURL,
+            onPress: () => onPressURL === null || onPressURL === void 0 ? void 0 : onPressURL(match),
             onLongPress: onLongPress,
             color: colors.primary,
             style: parentProps === null || parentProps === void 0 ? void 0 : parentProps.style