@sendbird/uikit-react-native 2.4.1 → 2.4.2

package/lib/module/components/FileViewer.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useEffect","useState","StatusBar","StyleSheet","TouchableOpacity","View","useSafeAreaInsets","Icon","Image","LoadingSpinner","Text","createStyleSheet","useAlert","useHeaderStyle","useToast","useUIKitTheme","Logger","getFileExtension","getFileType","isMyMessage","toMegabyte","truncate","useIIFE","useLocalization","usePlatformService","useSendbirdChat","FileViewer","headerShown","deleteMessage","headerTopInset","fileMessage","onPressDownload","onPressDelete","onClose","loading","setLoading","bottom","currentUser","palette","topInset","statusBarTranslucent","defaultHeight","STRINGS","fileService","mediaService","toast","alert","basicTopInset","canDelete","userId","fileType","type","url","fileViewer","uri","absoluteFill","top","_onPressDelete","title","LABELS","CHANNEL_MESSAGE_DELETE_CONFIRM_TITLE","buttons","text","CHANNEL_MESSAGE_DELETE_CONFIRM_CANCEL","CHANNEL_MESSAGE_DELETE_CONFIRM_OK","style","onPress","then","catch","show","TOAST","DELETE_MSG_ERROR","_onPressDownload","size","DOWNLOAD_START","save","fileUrl","fileName","name","response","DOWNLOAD_OK","log","err","DOWNLOAD_ERROR","flex","backgroundColor","background700","alignItems","justifyContent","position","primary300","FILE_VIEWER","TITLE","SUBTITLE","FileViewerHeader","subtitle","left","right","styles","headerContainer","paddingLeft","paddingHorizontal","paddingRight","paddingTop","height","overlay01","barButton","onBackgroundDark01","barTitleContainer","headerTitle","mode","maxLen","FileViewerFooter","bottomInset","deleteShown","footerContainer","paddingBottom","flexDirection","width","marginBottom"],"sources":["FileViewer.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\nimport { StatusBar, StyleSheet, TouchableOpacity, View } from 'react-native';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\n\nimport {\n  Icon,\n  Image,\n  LoadingSpinner,\n  Text,\n  createStyleSheet,\n  useAlert,\n  useHeaderStyle,\n  useToast,\n  useUIKitTheme,\n} from '@sendbird/uikit-react-native-foundation';\nimport type { SendbirdFileMessage } from '@sendbird/uikit-utils';\nimport {\n  Logger,\n  getFileExtension,\n  getFileType,\n  isMyMessage,\n  toMegabyte,\n  truncate,\n  useIIFE,\n} from '@sendbird/uikit-utils';\n\nimport { useLocalization, usePlatformService, useSendbirdChat } from '../hooks/useContext';\n\ntype Props = {\n  fileMessage: SendbirdFileMessage;\n  deleteMessage: () => Promise<void>;\n\n  onClose: () => void;\n  onPressDownload?: (message: SendbirdFileMessage) => void;\n  onPressDelete?: (message: SendbirdFileMessage) => void;\n\n  headerShown?: boolean;\n  headerTopInset?: number;\n};\nconst FileViewer = ({\n  headerShown = true,\n  deleteMessage,\n  headerTopInset,\n  fileMessage,\n  onPressDownload,\n  onPressDelete,\n  onClose,\n}: Props) => {\n  const [loading, setLoading] = useState(true);\n\n  const { bottom } = useSafeAreaInsets();\n\n  const { currentUser } = useSendbirdChat();\n  const { palette } = useUIKitTheme();\n  const { topInset, statusBarTranslucent, defaultHeight } = useHeaderStyle();\n  const { STRINGS } = useLocalization();\n  const { fileService, mediaService } = usePlatformService();\n  const toast = useToast();\n  const { alert } = useAlert();\n\n  const basicTopInset = statusBarTranslucent ? topInset : 0;\n  const canDelete = isMyMessage(fileMessage, currentUser?.userId);\n  const fileType = getFileType(fileMessage.type || getFileExtension(fileMessage.url));\n\n  useEffect(() => {\n    if (fileType === 'file') onClose();\n  }, []);\n\n  const fileViewer = useIIFE(() => {\n    switch (fileType) {\n      case 'image': {\n        return (\n          <Image\n            source={{ uri: fileMessage.url }}\n            style={StyleSheet.absoluteFill}\n            resizeMode={'contain'}\n            onLoadEnd={() => setLoading(false)}\n          />\n        );\n      }\n\n      case 'video':\n      case 'audio': {\n        return (\n          <mediaService.VideoComponent\n            source={{ uri: fileMessage.url }}\n            style={[StyleSheet.absoluteFill, { top: basicTopInset + defaultHeight, bottom: defaultHeight + bottom }]}\n            resizeMode={'contain'}\n            onLoad={() => setLoading(false)}\n          />\n        );\n      }\n\n      default: {\n        return null;\n      }\n    }\n  });\n\n  const _onPressDelete = () => {\n    if (!canDelete) return;\n\n    if (onPressDelete) {\n      onPressDelete(fileMessage);\n    } else {\n      alert({\n        title: STRINGS.LABELS.CHANNEL_MESSAGE_DELETE_CONFIRM_TITLE,\n        buttons: [\n          {\n            text: STRINGS.LABELS.CHANNEL_MESSAGE_DELETE_CONFIRM_CANCEL,\n          },\n          {\n            text: STRINGS.LABELS.CHANNEL_MESSAGE_DELETE_CONFIRM_OK,\n            style: 'destructive',\n            onPress: () => {\n              deleteMessage()\n                .then(() => {\n                  onClose();\n                })\n                .catch(() => {\n                  toast.show(STRINGS.TOAST.DELETE_MSG_ERROR, 'error');\n                });\n            },\n          },\n        ],\n      });\n    }\n  };\n\n  const _onPressDownload = () => {\n    if (onPressDownload) {\n      onPressDownload(fileMessage);\n    } else {\n      if (toMegabyte(fileMessage.size) > 4) {\n        toast.show(STRINGS.TOAST.DOWNLOAD_START, 'success');\n      }\n\n      fileService\n        .save({ fileUrl: fileMessage.url, fileName: fileMessage.name, fileType: fileMessage.type })\n        .then((response) => {\n          toast.show(STRINGS.TOAST.DOWNLOAD_OK, 'success');\n          Logger.log('File saved to', response);\n        })\n        .catch((err) => {\n          toast.show(STRINGS.TOAST.DOWNLOAD_ERROR, 'error');\n          Logger.log('File save failure', err);\n        });\n    }\n  };\n\n  return (\n    <View style={{ flex: 1, backgroundColor: palette.background700 }}>\n      <StatusBar barStyle={'light-content'} animated />\n      <View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>\n        {fileViewer}\n        {loading && <LoadingSpinner style={{ position: 'absolute' }} size={40} color={palette.primary300} />}\n      </View>\n      {headerShown && (\n        <FileViewerHeader\n          title={STRINGS.FILE_VIEWER.TITLE(fileMessage)}\n          subtitle={STRINGS.FILE_VIEWER.SUBTITLE(fileMessage)}\n          topInset={headerTopInset ?? basicTopInset}\n          onClose={onClose}\n        />\n      )}\n      <FileViewerFooter\n        bottomInset={bottom}\n        deleteShown={canDelete}\n        onPressDelete={_onPressDelete}\n        onPressDownload={_onPressDownload}\n      />\n    </View>\n  );\n};\n\ntype HeaderProps = {\n  topInset: number;\n  onClose: () => void;\n  title: string;\n  subtitle: string;\n};\nconst FileViewerHeader = ({ topInset, onClose, subtitle, title }: HeaderProps) => {\n  const { palette } = useUIKitTheme();\n  const { defaultHeight } = useHeaderStyle();\n  const { left, right } = useSafeAreaInsets();\n\n  return (\n    <View\n      style={[\n        styles.headerContainer,\n        {\n          paddingLeft: styles.headerContainer.paddingHorizontal + left,\n          paddingRight: styles.headerContainer.paddingHorizontal + right,\n        },\n        { paddingTop: topInset, height: defaultHeight + topInset, backgroundColor: palette.overlay01 },\n      ]}\n    >\n      <TouchableOpacity onPress={onClose} style={styles.barButton}>\n        <Icon icon={'close'} size={24} color={palette.onBackgroundDark01} />\n      </TouchableOpacity>\n      <View style={styles.barTitleContainer}>\n        <Text h2 color={palette.onBackgroundDark01} style={styles.headerTitle} numberOfLines={1}>\n          {truncate(title, { mode: 'mid', maxLen: 18 })}\n        </Text>\n        <Text caption2 color={palette.onBackgroundDark01} numberOfLines={1}>\n          {subtitle}\n        </Text>\n      </View>\n      <View style={styles.barButton} />\n    </View>\n  );\n};\n\ntype FooterProps = {\n  bottomInset: number;\n  deleteShown: boolean;\n  onPressDelete: () => void;\n  onPressDownload: () => void;\n};\nconst FileViewerFooter = ({ bottomInset, deleteShown, onPressDelete, onPressDownload }: FooterProps) => {\n  const { palette } = useUIKitTheme();\n  const { defaultHeight } = useHeaderStyle();\n  const { left, right } = useSafeAreaInsets();\n\n  return (\n    <View\n      style={[\n        styles.footerContainer,\n        {\n          paddingLeft: styles.headerContainer.paddingHorizontal + left,\n          paddingRight: styles.headerContainer.paddingHorizontal + right,\n        },\n        {\n          paddingBottom: bottomInset,\n          height: defaultHeight + bottomInset,\n          backgroundColor: palette.overlay01,\n        },\n      ]}\n    >\n      <TouchableOpacity onPress={onPressDownload} style={styles.barButton}>\n        <Icon icon={'download'} size={24} color={palette.onBackgroundDark01} />\n      </TouchableOpacity>\n      <View style={styles.barTitleContainer} />\n      <TouchableOpacity onPress={onPressDelete} style={styles.barButton} disabled={!deleteShown}>\n        {deleteShown && <Icon icon={'delete'} size={24} color={palette.onBackgroundDark01} />}\n      </TouchableOpacity>\n    </View>\n  );\n};\n\nconst styles = createStyleSheet({\n  headerContainer: {\n    top: 0,\n    left: 0,\n    right: 0,\n    position: 'absolute',\n    flexDirection: 'row',\n    alignItems: 'center',\n    justifyContent: 'center',\n    paddingHorizontal: 12,\n  },\n  barButton: {\n    width: 32,\n    height: 32,\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n  barTitleContainer: {\n    flex: 1,\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n  headerTitle: {\n    marginBottom: 2,\n  },\n  footerContainer: {\n    position: 'absolute',\n    left: 0,\n    right: 0,\n    bottom: 0,\n    flexDirection: 'row',\n    alignItems: 'center',\n    justifyContent: 'center',\n    paddingHorizontal: 12,\n  },\n});\n\nexport default FileViewer;\n"],"mappings":"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"}
+{"version":3,"names":["React","useEffect","useState","StatusBar","StyleSheet","TouchableOpacity","View","useSafeAreaInsets","Icon","Image","LoadingSpinner","Text","createStyleSheet","useAlert","useHeaderStyle","useToast","useUIKitTheme","Logger","getFileExtension","getFileType","isMyMessage","toMegabyte","truncate","useIIFE","useLocalization","usePlatformService","useSendbirdChat","FileViewer","_ref","headerShown","deleteMessage","headerTopInset","fileMessage","onPressDownload","onPressDelete","onClose","loading","setLoading","bottom","currentUser","palette","topInset","statusBarTranslucent","defaultHeight","STRINGS","fileService","mediaService","toast","alert","basicTopInset","canDelete","userId","fileType","type","url","fileViewer","createElement","source","uri","style","absoluteFill","resizeMode","onLoadEnd","VideoComponent","top","onLoad","_onPressDelete","title","LABELS","CHANNEL_MESSAGE_DELETE_CONFIRM_TITLE","buttons","text","CHANNEL_MESSAGE_DELETE_CONFIRM_CANCEL","CHANNEL_MESSAGE_DELETE_CONFIRM_OK","onPress","then","catch","show","TOAST","DELETE_MSG_ERROR","_onPressDownload","size","DOWNLOAD_START","save","fileUrl","fileName","name","response","DOWNLOAD_OK","log","err","DOWNLOAD_ERROR","flex","backgroundColor","background700","barStyle","animated","alignItems","justifyContent","position","color","primary300","FileViewerHeader","FILE_VIEWER","TITLE","subtitle","SUBTITLE","FileViewerFooter","bottomInset","deleteShown","_ref2","left","right","styles","headerContainer","paddingLeft","paddingHorizontal","paddingRight","paddingTop","height","overlay01","barButton","icon","onBackgroundDark01","barTitleContainer","h2","headerTitle","numberOfLines","mode","maxLen","caption2","_ref3","footerContainer","paddingBottom","disabled","flexDirection","width","marginBottom"],"sources":["FileViewer.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\nimport { StatusBar, StyleSheet, TouchableOpacity, View } from 'react-native';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\n\nimport {\n  Icon,\n  Image,\n  LoadingSpinner,\n  Text,\n  createStyleSheet,\n  useAlert,\n  useHeaderStyle,\n  useToast,\n  useUIKitTheme,\n} from '@sendbird/uikit-react-native-foundation';\nimport type { SendbirdFileMessage } from '@sendbird/uikit-utils';\nimport {\n  Logger,\n  getFileExtension,\n  getFileType,\n  isMyMessage,\n  toMegabyte,\n  truncate,\n  useIIFE,\n} from '@sendbird/uikit-utils';\n\nimport { useLocalization, usePlatformService, useSendbirdChat } from '../hooks/useContext';\n\ntype Props = {\n  fileMessage: SendbirdFileMessage;\n  deleteMessage: () => Promise<void>;\n\n  onClose: () => void;\n  onPressDownload?: (message: SendbirdFileMessage) => void;\n  onPressDelete?: (message: SendbirdFileMessage) => void;\n\n  headerShown?: boolean;\n  headerTopInset?: number;\n};\nconst FileViewer = ({\n  headerShown = true,\n  deleteMessage,\n  headerTopInset,\n  fileMessage,\n  onPressDownload,\n  onPressDelete,\n  onClose,\n}: Props) => {\n  const [loading, setLoading] = useState(true);\n\n  const { bottom } = useSafeAreaInsets();\n\n  const { currentUser } = useSendbirdChat();\n  const { palette } = useUIKitTheme();\n  const { topInset, statusBarTranslucent, defaultHeight } = useHeaderStyle();\n  const { STRINGS } = useLocalization();\n  const { fileService, mediaService } = usePlatformService();\n  const toast = useToast();\n  const { alert } = useAlert();\n\n  const basicTopInset = statusBarTranslucent ? topInset : 0;\n  const canDelete = isMyMessage(fileMessage, currentUser?.userId);\n  const fileType = getFileType(fileMessage.type || getFileExtension(fileMessage.url));\n\n  useEffect(() => {\n    if (fileType === 'file') onClose();\n  }, []);\n\n  const fileViewer = useIIFE(() => {\n    switch (fileType) {\n      case 'image': {\n        return (\n          <Image\n            source={{ uri: fileMessage.url }}\n            style={StyleSheet.absoluteFill}\n            resizeMode={'contain'}\n            onLoadEnd={() => setLoading(false)}\n          />\n        );\n      }\n\n      case 'video':\n      case 'audio': {\n        return (\n          <mediaService.VideoComponent\n            source={{ uri: fileMessage.url }}\n            style={[StyleSheet.absoluteFill, { top: basicTopInset + defaultHeight, bottom: defaultHeight + bottom }]}\n            resizeMode={'contain'}\n            onLoad={() => setLoading(false)}\n          />\n        );\n      }\n\n      default: {\n        return null;\n      }\n    }\n  });\n\n  const _onPressDelete = () => {\n    if (!canDelete) return;\n\n    if (onPressDelete) {\n      onPressDelete(fileMessage);\n    } else {\n      alert({\n        title: STRINGS.LABELS.CHANNEL_MESSAGE_DELETE_CONFIRM_TITLE,\n        buttons: [\n          {\n            text: STRINGS.LABELS.CHANNEL_MESSAGE_DELETE_CONFIRM_CANCEL,\n          },\n          {\n            text: STRINGS.LABELS.CHANNEL_MESSAGE_DELETE_CONFIRM_OK,\n            style: 'destructive',\n            onPress: () => {\n              deleteMessage()\n                .then(() => {\n                  onClose();\n                })\n                .catch(() => {\n                  toast.show(STRINGS.TOAST.DELETE_MSG_ERROR, 'error');\n                });\n            },\n          },\n        ],\n      });\n    }\n  };\n\n  const _onPressDownload = () => {\n    if (onPressDownload) {\n      onPressDownload(fileMessage);\n    } else {\n      if (toMegabyte(fileMessage.size) > 4) {\n        toast.show(STRINGS.TOAST.DOWNLOAD_START, 'success');\n      }\n\n      fileService\n        .save({ fileUrl: fileMessage.url, fileName: fileMessage.name, fileType: fileMessage.type })\n        .then((response) => {\n          toast.show(STRINGS.TOAST.DOWNLOAD_OK, 'success');\n          Logger.log('File saved to', response);\n        })\n        .catch((err) => {\n          toast.show(STRINGS.TOAST.DOWNLOAD_ERROR, 'error');\n          Logger.log('File save failure', err);\n        });\n    }\n  };\n\n  return (\n    <View style={{ flex: 1, backgroundColor: palette.background700 }}>\n      <StatusBar barStyle={'light-content'} animated />\n      <View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>\n        {fileViewer}\n        {loading && <LoadingSpinner style={{ position: 'absolute' }} size={40} color={palette.primary300} />}\n      </View>\n      {headerShown && (\n        <FileViewerHeader\n          title={STRINGS.FILE_VIEWER.TITLE(fileMessage)}\n          subtitle={STRINGS.FILE_VIEWER.SUBTITLE(fileMessage)}\n          topInset={headerTopInset ?? basicTopInset}\n          onClose={onClose}\n        />\n      )}\n      <FileViewerFooter\n        bottomInset={bottom}\n        deleteShown={canDelete}\n        onPressDelete={_onPressDelete}\n        onPressDownload={_onPressDownload}\n      />\n    </View>\n  );\n};\n\ntype HeaderProps = {\n  topInset: number;\n  onClose: () => void;\n  title: string;\n  subtitle: string;\n};\nconst FileViewerHeader = ({ topInset, onClose, subtitle, title }: HeaderProps) => {\n  const { palette } = useUIKitTheme();\n  const { defaultHeight } = useHeaderStyle();\n  const { left, right } = useSafeAreaInsets();\n\n  return (\n    <View\n      style={[\n        styles.headerContainer,\n        {\n          paddingLeft: styles.headerContainer.paddingHorizontal + left,\n          paddingRight: styles.headerContainer.paddingHorizontal + right,\n        },\n        { paddingTop: topInset, height: defaultHeight + topInset, backgroundColor: palette.overlay01 },\n      ]}\n    >\n      <TouchableOpacity onPress={onClose} style={styles.barButton}>\n        <Icon icon={'close'} size={24} color={palette.onBackgroundDark01} />\n      </TouchableOpacity>\n      <View style={styles.barTitleContainer}>\n        <Text h2 color={palette.onBackgroundDark01} style={styles.headerTitle} numberOfLines={1}>\n          {truncate(title, { mode: 'mid', maxLen: 18 })}\n        </Text>\n        <Text caption2 color={palette.onBackgroundDark01} numberOfLines={1}>\n          {subtitle}\n        </Text>\n      </View>\n      <View style={styles.barButton} />\n    </View>\n  );\n};\n\ntype FooterProps = {\n  bottomInset: number;\n  deleteShown: boolean;\n  onPressDelete: () => void;\n  onPressDownload: () => void;\n};\nconst FileViewerFooter = ({ bottomInset, deleteShown, onPressDelete, onPressDownload }: FooterProps) => {\n  const { palette } = useUIKitTheme();\n  const { defaultHeight } = useHeaderStyle();\n  const { left, right } = useSafeAreaInsets();\n\n  return (\n    <View\n      style={[\n        styles.footerContainer,\n        {\n          paddingLeft: styles.headerContainer.paddingHorizontal + left,\n          paddingRight: styles.headerContainer.paddingHorizontal + right,\n        },\n        {\n          paddingBottom: bottomInset,\n          height: defaultHeight + bottomInset,\n          backgroundColor: palette.overlay01,\n        },\n      ]}\n    >\n      <TouchableOpacity onPress={onPressDownload} style={styles.barButton}>\n        <Icon icon={'download'} size={24} color={palette.onBackgroundDark01} />\n      </TouchableOpacity>\n      <View style={styles.barTitleContainer} />\n      <TouchableOpacity onPress={onPressDelete} style={styles.barButton} disabled={!deleteShown}>\n        {deleteShown && <Icon icon={'delete'} size={24} color={palette.onBackgroundDark01} />}\n      </TouchableOpacity>\n    </View>\n  );\n};\n\nconst styles = createStyleSheet({\n  headerContainer: {\n    top: 0,\n    left: 0,\n    right: 0,\n    position: 'absolute',\n    flexDirection: 'row',\n    alignItems: 'center',\n    justifyContent: 'center',\n    paddingHorizontal: 12,\n  },\n  barButton: {\n    width: 32,\n    height: 32,\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n  barTitleContainer: {\n    flex: 1,\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n  headerTitle: {\n    marginBottom: 2,\n  },\n  footerContainer: {\n    position: 'absolute',\n    left: 0,\n    right: 0,\n    bottom: 0,\n    flexDirection: 'row',\n    alignItems: 'center',\n    justifyContent: 'center',\n    paddingHorizontal: 12,\n  },\n});\n\nexport default FileViewer;\n"],"mappings":"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"}

package/lib/module/components/MessageRenderer/AdminMessage/index.js

@@ -1,7 +1,6 @@
 import React from 'react';
 import { StyleSheet, View } from 'react-native';
 import { Text, createStyleSheet, useUIKitTheme } from '@sendbird/uikit-react-native-foundation';
-
 const AdminMessage = _ref => {
   let {
     message,
@@ -19,7 +18,6 @@ const AdminMessage = _ref => {
     style: styles.text
   }, message.message));
 };
-
 const styles = createStyleSheet({
   container: {
     width: 300,

package/lib/module/components/MessageRenderer/AdminMessage/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","StyleSheet","View","Text","createStyleSheet","useUIKitTheme","AdminMessage","message","nextMessage","colors","isNextAdmin","isAdminMessage","flatten","styles","container","nextAdminType","next","onBackground02","text","width","alignSelf","alignItems","marginBottom","textAlign"],"sources":["index.tsx"],"sourcesContent":["import React from 'react';\nimport { StyleSheet, View } from 'react-native';\n\nimport { Text, createStyleSheet, useUIKitTheme } from '@sendbird/uikit-react-native-foundation';\nimport type { SendbirdAdminMessage } from '@sendbird/uikit-utils';\n\nimport type { MessageRendererInterface } from '../index';\n\nexport type AdminMessageProps = MessageRendererInterface<SendbirdAdminMessage>;\nconst AdminMessage = ({ message, nextMessage }: AdminMessageProps) => {\n  const { colors } = useUIKitTheme();\n\n  const isNextAdmin = nextMessage?.isAdminMessage();\n  return (\n    <View style={StyleSheet.flatten([styles.container, isNextAdmin ? styles.nextAdminType : styles.next])}>\n      <Text caption2 color={colors.onBackground02} style={styles.text}>\n        {message.message}\n      </Text>\n    </View>\n  );\n};\n\nconst styles = createStyleSheet({\n  container: {\n    width: 300,\n    alignSelf: 'center',\n    alignItems: 'center',\n  },\n  nextAdminType: {\n    marginBottom: 8,\n  },\n  next: {\n    marginBottom: 16,\n  },\n  text: {\n    textAlign: 'center',\n  },\n});\n\nexport default AdminMessage;\n"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,UAAT,EAAqBC,IAArB,QAAiC,cAAjC;AAEA,SAASC,IAAT,EAAeC,gBAAf,EAAiCC,aAAjC,QAAsD,yCAAtD;;AAMA,MAAMC,YAAY,GAAG,QAAiD;EAAA,IAAhD;IAAEC,OAAF;IAAWC;EAAX,CAAgD;EACpE,MAAM;IAAEC;EAAF,IAAaJ,aAAa,EAAhC;EAEA,MAAMK,WAAW,GAAGF,WAAH,aAAGA,WAAH,uBAAGA,WAAW,CAAEG,cAAb,EAApB;EACA,oBACE,oBAAC,IAAD;IAAM,KAAK,EAAEV,UAAU,CAACW,OAAX,CAAmB,CAACC,MAAM,CAACC,SAAR,EAAmBJ,WAAW,GAAGG,MAAM,CAACE,aAAV,GAA0BF,MAAM,CAACG,IAA/D,CAAnB;EAAb,gBACE,oBAAC,IAAD;IAAM,QAAQ,MAAd;IAAe,KAAK,EAAEP,MAAM,CAACQ,cAA7B;IAA6C,KAAK,EAAEJ,MAAM,CAACK;EAA3D,GACGX,OAAO,CAACA,OADX,CADF,CADF;AAOD,CAXD;;AAaA,MAAMM,MAAM,GAAGT,gBAAgB,CAAC;EAC9BU,SAAS,EAAE;IACTK,KAAK,EAAE,GADE;IAETC,SAAS,EAAE,QAFF;IAGTC,UAAU,EAAE;EAHH,CADmB;EAM9BN,aAAa,EAAE;IACbO,YAAY,EAAE;EADD,CANe;EAS9BN,IAAI,EAAE;IACJM,YAAY,EAAE;EADV,CATwB;EAY9BJ,IAAI,EAAE;IACJK,SAAS,EAAE;EADP;AAZwB,CAAD,CAA/B;AAiBA,eAAejB,YAAf"}
+{"version":3,"names":["React","StyleSheet","View","Text","createStyleSheet","useUIKitTheme","AdminMessage","_ref","message","nextMessage","colors","isNextAdmin","isAdminMessage","createElement","style","flatten","styles","container","nextAdminType","next","caption2","color","onBackground02","text","width","alignSelf","alignItems","marginBottom","textAlign"],"sources":["index.tsx"],"sourcesContent":["import React from 'react';\nimport { StyleSheet, View } from 'react-native';\n\nimport { Text, createStyleSheet, useUIKitTheme } from '@sendbird/uikit-react-native-foundation';\nimport type { SendbirdAdminMessage } from '@sendbird/uikit-utils';\n\nimport type { MessageRendererInterface } from '../index';\n\nexport type AdminMessageProps = MessageRendererInterface<SendbirdAdminMessage>;\nconst AdminMessage = ({ message, nextMessage }: AdminMessageProps) => {\n  const { colors } = useUIKitTheme();\n\n  const isNextAdmin = nextMessage?.isAdminMessage();\n  return (\n    <View style={StyleSheet.flatten([styles.container, isNextAdmin ? styles.nextAdminType : styles.next])}>\n      <Text caption2 color={colors.onBackground02} style={styles.text}>\n        {message.message}\n      </Text>\n    </View>\n  );\n};\n\nconst styles = createStyleSheet({\n  container: {\n    width: 300,\n    alignSelf: 'center',\n    alignItems: 'center',\n  },\n  nextAdminType: {\n    marginBottom: 8,\n  },\n  next: {\n    marginBottom: 16,\n  },\n  text: {\n    textAlign: 'center',\n  },\n});\n\nexport default AdminMessage;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,UAAU,EAAEC,IAAI,QAAQ,cAAc;AAE/C,SAASC,IAAI,EAAEC,gBAAgB,EAAEC,aAAa,QAAQ,yCAAyC;AAM/F,MAAMC,YAAY,GAAGC,IAAA,IAAiD;EAAA,IAAhD;IAAEC,OAAO;IAAEC;EAA+B,CAAC,GAAAF,IAAA;EAC/D,MAAM;IAAEG;EAAO,CAAC,GAAGL,aAAa,EAAE;EAElC,MAAMM,WAAW,GAAGF,WAAW,aAAXA,WAAW,uBAAXA,WAAW,CAAEG,cAAc,EAAE;EACjD,oBACEZ,KAAA,CAAAa,aAAA,CAACX,IAAI;IAACY,KAAK,EAAEb,UAAU,CAACc,OAAO,CAAC,CAACC,MAAM,CAACC,SAAS,EAAEN,WAAW,GAAGK,MAAM,CAACE,aAAa,GAAGF,MAAM,CAACG,IAAI,CAAC;EAAE,gBACpGnB,KAAA,CAAAa,aAAA,CAACV,IAAI;IAACiB,QAAQ;IAACC,KAAK,EAAEX,MAAM,CAACY,cAAe;IAACR,KAAK,EAAEE,MAAM,CAACO;EAAK,GAC7Df,OAAO,CAACA,OAAO,CACX,CACF;AAEX,CAAC;AAED,MAAMQ,MAAM,GAAGZ,gBAAgB,CAAC;EAC9Ba,SAAS,EAAE;IACTO,KAAK,EAAE,GAAG;IACVC,SAAS,EAAE,QAAQ;IACnBC,UAAU,EAAE;EACd,CAAC;EACDR,aAAa,EAAE;IACbS,YAAY,EAAE;EAChB,CAAC;EACDR,IAAI,EAAE;IACJQ,YAAY,EAAE;EAChB,CAAC;EACDJ,IAAI,EAAE;IACJK,SAAS,EAAE;EACb;AACF,CAAC,CAAC;AAEF,eAAetB,YAAY"}

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

@@ -8,7 +8,6 @@ const iconMapper = {
   video: 'play',
   file: 'file-document'
 };
-
 const BaseFileMessage = _ref => {
   let {
     message,
@@ -47,7 +46,6 @@ const BaseFileMessage = _ref => {
     style: styles.name
   }, STRINGS.GROUP_CHANNEL.MESSAGE_BUBBLE_FILE_TITLE(message))), children);
 };
-
 const styles = createStyleSheet({
   bubbleContainer: {
     borderRadius: 16,

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

@@ -1 +1 @@
-{"version":3,"names":["React","View","Icon","Text","createStyleSheet","useUIKitTheme","useLocalization","iconMapper","audio","image","video","file","BaseFileMessage","message","variant","pressed","type","children","STRINGS","colors","color","ui","groupChannelMessage","styles","bubbleContainer","backgroundColor","background","container","padding","borderRadius","marginRight","textMsg","name","GROUP_CHANNEL","MESSAGE_BUBBLE_FILE_TITLE","overflow","flexDirection","alignItems","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, children }: Props) => {\n  const { STRINGS } = useLocalization();\n  const { colors } = useUIKitTheme();\n  const color = colors.ui.groupChannelMessage[variant][pressed ? 'pressed' : 'enabled'];\n  return (\n    <View style={[styles.bubbleContainer, { backgroundColor: color.background }]}>\n      <View style={styles.container}>\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      {children}\n    </View>\n  );\n};\n\nconst styles = createStyleSheet({\n  bubbleContainer: {\n    borderRadius: 16,\n    overflow: 'hidden',\n  },\n  container: {\n    flexDirection: 'row',\n    alignItems: 'center',\n    paddingHorizontal: 12,\n    paddingVertical: 6,\n  },\n  name: {\n    flexShrink: 1,\n  },\n});\n\nexport default BaseFileMessage;\n"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,IAAT,QAAqB,cAArB;AAEA,SAASC,IAAT,EAAeC,IAAf,EAAqBC,gBAArB,EAAuCC,aAAvC,QAA4D,yCAA5D;AAEA,SAASC,eAAT,QAAgC,2BAAhC;AAGA,MAAMC,UAAU,GAAG;EAAEC,KAAK,EAAE,YAAT;EAAuBC,KAAK,EAAE,OAA9B;EAAuCC,KAAK,EAAE,MAA9C;EAAsDC,IAAI,EAAE;AAA5D,CAAnB;;AAKA,MAAMC,eAAe,GAAG,QAA0D;EAAA,IAAzD;IAAEC,OAAF;IAAWC,OAAX;IAAoBC,OAApB;IAA6BC,IAA7B;IAAmCC;EAAnC,CAAyD;EAChF,MAAM;IAAEC;EAAF,IAAcZ,eAAe,EAAnC;EACA,MAAM;IAAEa;EAAF,IAAad,aAAa,EAAhC;EACA,MAAMe,KAAK,GAAGD,MAAM,CAACE,EAAP,CAAUC,mBAAV,CAA8BR,OAA9B,EAAuCC,OAAO,GAAG,SAAH,GAAe,SAA7D,CAAd;EACA,oBACE,oBAAC,IAAD;IAAM,KAAK,EAAE,CAACQ,MAAM,CAACC,eAAR,EAAyB;MAAEC,eAAe,EAAEL,KAAK,CAACM;IAAzB,CAAzB;EAAb,gBACE,oBAAC,IAAD;IAAM,KAAK,EAAEH,MAAM,CAACI;EAApB,gBACE,oBAAC,IAAD;IACE,IAAI,EAAEpB,UAAU,CAACS,IAAD,CADlB;IAEE,IAAI,EAAE,EAFR;IAGE,cAAc,EAAE;MAAES,eAAe,EAAEN,MAAM,CAACO,UAA1B;MAAsCE,OAAO,EAAE,CAA/C;MAAkDC,YAAY,EAAE,CAAhE;MAAmEC,WAAW,EAAE;IAAhF;EAHlB,EADF,eAME,oBAAC,IAAD;IAAM,KAAK,MAAX;IAAY,aAAa,EAAE,QAA3B;IAAqC,aAAa,EAAE,CAApD;IAAuD,KAAK,EAAEV,KAAK,CAACW,OAApE;IAA6E,KAAK,EAAER,MAAM,CAACS;EAA3F,GACGd,OAAO,CAACe,aAAR,CAAsBC,yBAAtB,CAAgDrB,OAAhD,CADH,CANF,CADF,EAWGI,QAXH,CADF;AAeD,CAnBD;;AAqBA,MAAMM,MAAM,GAAGnB,gBAAgB,CAAC;EAC9BoB,eAAe,EAAE;IACfK,YAAY,EAAE,EADC;IAEfM,QAAQ,EAAE;EAFK,CADa;EAK9BR,SAAS,EAAE;IACTS,aAAa,EAAE,KADN;IAETC,UAAU,EAAE,QAFH;IAGTC,iBAAiB,EAAE,EAHV;IAITC,eAAe,EAAE;EAJR,CALmB;EAW9BP,IAAI,EAAE;IACJQ,UAAU,EAAE;EADR;AAXwB,CAAD,CAA/B;AAgBA,eAAe5B,eAAf"}
+{"version":3,"names":["React","View","Icon","Text","createStyleSheet","useUIKitTheme","useLocalization","iconMapper","audio","image","video","file","BaseFileMessage","_ref","message","variant","pressed","type","children","STRINGS","colors","color","ui","groupChannelMessage","createElement","style","styles","bubbleContainer","backgroundColor","background","container","icon","size","containerStyle","padding","borderRadius","marginRight","body3","ellipsizeMode","numberOfLines","textMsg","name","GROUP_CHANNEL","MESSAGE_BUBBLE_FILE_TITLE","overflow","flexDirection","alignItems","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, children }: Props) => {\n  const { STRINGS } = useLocalization();\n  const { colors } = useUIKitTheme();\n  const color = colors.ui.groupChannelMessage[variant][pressed ? 'pressed' : 'enabled'];\n  return (\n    <View style={[styles.bubbleContainer, { backgroundColor: color.background }]}>\n      <View style={styles.container}>\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      {children}\n    </View>\n  );\n};\n\nconst styles = createStyleSheet({\n  bubbleContainer: {\n    borderRadius: 16,\n    overflow: 'hidden',\n  },\n  container: {\n    flexDirection: 'row',\n    alignItems: 'center',\n    paddingHorizontal: 12,\n    paddingVertical: 6,\n  },\n  name: {\n    flexShrink: 1,\n  },\n});\n\nexport default BaseFileMessage;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,IAAI,QAAQ,cAAc;AAEnC,SAASC,IAAI,EAAEC,IAAI,EAAEC,gBAAgB,EAAEC,aAAa,QAAQ,yCAAyC;AAErG,SAASC,eAAe,QAAQ,2BAA2B;AAG3D,MAAMC,UAAU,GAAG;EAAEC,KAAK,EAAE,YAAY;EAAEC,KAAK,EAAE,OAAO;EAAEC,KAAK,EAAE,MAAM;EAAEC,IAAI,EAAE;AAAgB,CAAU;AAKzG,MAAMC,eAAe,GAAGC,IAAA,IAA0D;EAAA,IAAzD;IAAEC,OAAO;IAAEC,OAAO;IAAEC,OAAO;IAAEC,IAAI;IAAEC;EAAgB,CAAC,GAAAL,IAAA;EAC3E,MAAM;IAAEM;EAAQ,CAAC,GAAGb,eAAe,EAAE;EACrC,MAAM;IAAEc;EAAO,CAAC,GAAGf,aAAa,EAAE;EAClC,MAAMgB,KAAK,GAAGD,MAAM,CAACE,EAAE,CAACC,mBAAmB,CAACR,OAAO,CAAC,CAACC,OAAO,GAAG,SAAS,GAAG,SAAS,CAAC;EACrF,oBACEhB,KAAA,CAAAwB,aAAA,CAACvB,IAAI;IAACwB,KAAK,EAAE,CAACC,MAAM,CAACC,eAAe,EAAE;MAAEC,eAAe,EAAEP,KAAK,CAACQ;IAAW,CAAC;EAAE,gBAC3E7B,KAAA,CAAAwB,aAAA,CAACvB,IAAI;IAACwB,KAAK,EAAEC,MAAM,CAACI;EAAU,gBAC5B9B,KAAA,CAAAwB,aAAA,CAACtB,IAAI;IACH6B,IAAI,EAAExB,UAAU,CAACU,IAAI,CAAE;IACvBe,IAAI,EAAE,EAAG;IACTC,cAAc,EAAE;MAAEL,eAAe,EAAER,MAAM,CAACS,UAAU;MAAEK,OAAO,EAAE,CAAC;MAAEC,YAAY,EAAE,CAAC;MAAEC,WAAW,EAAE;IAAE;EAAE,EACpG,eACFpC,KAAA,CAAAwB,aAAA,CAACrB,IAAI;IAACkC,KAAK;IAACC,aAAa,EAAE,QAAS;IAACC,aAAa,EAAE,CAAE;IAAClB,KAAK,EAAEA,KAAK,CAACmB,OAAQ;IAACf,KAAK,EAAEC,MAAM,CAACe;EAAK,GAC7FtB,OAAO,CAACuB,aAAa,CAACC,yBAAyB,CAAC7B,OAAO,CAAC,CACpD,CACF,EACNI,QAAQ,CACJ;AAEX,CAAC;AAED,MAAMQ,MAAM,GAAGtB,gBAAgB,CAAC;EAC9BuB,eAAe,EAAE;IACfQ,YAAY,EAAE,EAAE;IAChBS,QAAQ,EAAE;EACZ,CAAC;EACDd,SAAS,EAAE;IACTe,aAAa,EAAE,KAAK;IACpBC,UAAU,EAAE,QAAQ;IACpBC,iBAAiB,EAAE,EAAE;IACrBC,eAAe,EAAE;EACnB,CAAC;EACDP,IAAI,EAAE;IACJQ,UAAU,EAAE;EACd;AACF,CAAC,CAAC;AAEF,eAAerC,eAAe"}

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

@@ -2,7 +2,6 @@ import React, { useEffect, useRef, useState } from 'react';
 import { Platform, StyleSheet, View } from 'react-native';
 import { Icon, Image, createStyleSheet, useUIKitTheme } from '@sendbird/uikit-react-native-foundation';
 import { getAvailableUriFromFileMessage, useForceUpdate } from '@sendbird/uikit-utils';
-
 const useRetry = function (hasError) {
   let retryCount = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 5;
   if (Platform.OS === 'android') return '';
@@ -20,7 +19,6 @@ const useRetry = function (hasError) {
           }, retryCountRef.current * 5000);
         }
       };
-
       return reloadReservation();
     } else {
       return clearTimeout(retryTimeoutRef.current);
@@ -28,7 +26,6 @@ const useRetry = function (hasError) {
   }, [hasError]);
   return retryCountRef.current;
 };
-
 const ImageFileMessage = _ref => {
   let {
     message,
@@ -67,7 +64,6 @@ const ImageFileMessage = _ref => {
     color: colors.onBackground02
   })), children);
 };
-
 const styles = createStyleSheet({
   bubbleContainer: {
     borderRadius: 16,

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

@@ -1 +1 @@
-{"version":3,"names":["React","useEffect","useRef","useState","Platform","StyleSheet","View","Icon","Image","createStyleSheet","useUIKitTheme","getAvailableUriFromFileMessage","useForceUpdate","useRetry","hasError","retryCount","OS","forceUpdate","retryCountRef","retryTimeoutRef","reloadReservation","current","setTimeout","clearTimeout","ImageFileMessage","message","children","variant","colors","imageNotFound","setImageNotFound","fileUrl","style","styles","image","backgroundColor","onBackground04","key","bubbleContainer","ui","groupChannelMessage","enabled","background","uri","absoluteFill","hide","onBackground02","borderRadius","overflow","width","maxWidth","height","display"],"sources":["ImageFileMessage.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport { Platform, StyleSheet, View } from 'react-native';\n\nimport { Icon, Image, createStyleSheet, useUIKitTheme } from '@sendbird/uikit-react-native-foundation';\nimport { getAvailableUriFromFileMessage, useForceUpdate } from '@sendbird/uikit-utils';\n\nimport type { FileMessageProps } from './index';\n\nconst useRetry = (hasError: boolean, retryCount = 5) => {\n  if (Platform.OS === 'android') return '';\n\n  const forceUpdate = useForceUpdate();\n  const retryCountRef = useRef(1);\n  const retryTimeoutRef = useRef<NodeJS.Timeout>();\n\n  useEffect(() => {\n    if (hasError) {\n      const reloadReservation = () => {\n        if (retryCountRef.current < retryCount) {\n          retryTimeoutRef.current = setTimeout(() => {\n            retryCountRef.current++;\n            reloadReservation();\n            forceUpdate();\n          }, retryCountRef.current * 5000);\n        }\n      };\n\n      return reloadReservation();\n    } else {\n      return clearTimeout(retryTimeoutRef.current);\n    }\n  }, [hasError]);\n\n  return retryCountRef.current;\n};\n\nconst ImageFileMessage = ({ message, children, variant }: 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  const key = useRetry(imageNotFound);\n\n  return (\n    <View\n      style={[\n        styles.bubbleContainer,\n        {\n          backgroundColor: imageNotFound\n            ? colors.onBackground04\n            : colors.ui.groupChannelMessage[variant].enabled.background,\n        },\n      ]}\n    >\n      <View style={style}>\n        <Image\n          key={key}\n          source={{ uri: fileUrl }}\n          style={[StyleSheet.absoluteFill, imageNotFound && styles.hide]}\n          resizeMode={'cover'}\n          resizeMethod={'resize'}\n          onError={() => setImageNotFound(true)}\n          onLoad={() => setImageNotFound(false)}\n        />\n        {imageNotFound && (\n          <Icon\n            containerStyle={StyleSheet.absoluteFill}\n            icon={'thumbnail-none'}\n            size={48}\n            color={colors.onBackground02}\n          />\n        )}\n      </View>\n      {children}\n    </View>\n  );\n};\n\nconst styles = createStyleSheet({\n  bubbleContainer: {\n    borderRadius: 16,\n    overflow: 'hidden',\n  },\n  image: {\n    width: 240,\n    maxWidth: 240,\n    height: 160,\n    borderRadius: 16,\n    overflow: 'hidden',\n  },\n  hide: {\n    display: 'none',\n  },\n});\n\nexport default ImageFileMessage;\n"],"mappings":"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"}
+{"version":3,"names":["React","useEffect","useRef","useState","Platform","StyleSheet","View","Icon","Image","createStyleSheet","useUIKitTheme","getAvailableUriFromFileMessage","useForceUpdate","useRetry","hasError","retryCount","arguments","length","undefined","OS","forceUpdate","retryCountRef","retryTimeoutRef","reloadReservation","current","setTimeout","clearTimeout","ImageFileMessage","_ref","message","children","variant","colors","imageNotFound","setImageNotFound","fileUrl","style","styles","image","backgroundColor","onBackground04","key","createElement","bubbleContainer","ui","groupChannelMessage","enabled","background","source","uri","absoluteFill","hide","resizeMode","resizeMethod","onError","onLoad","containerStyle","icon","size","color","onBackground02","borderRadius","overflow","width","maxWidth","height","display"],"sources":["ImageFileMessage.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport { Platform, StyleSheet, View } from 'react-native';\n\nimport { Icon, Image, createStyleSheet, useUIKitTheme } from '@sendbird/uikit-react-native-foundation';\nimport { getAvailableUriFromFileMessage, useForceUpdate } from '@sendbird/uikit-utils';\n\nimport type { FileMessageProps } from './index';\n\nconst useRetry = (hasError: boolean, retryCount = 5) => {\n  if (Platform.OS === 'android') return '';\n\n  const forceUpdate = useForceUpdate();\n  const retryCountRef = useRef(1);\n  const retryTimeoutRef = useRef<NodeJS.Timeout>();\n\n  useEffect(() => {\n    if (hasError) {\n      const reloadReservation = () => {\n        if (retryCountRef.current < retryCount) {\n          retryTimeoutRef.current = setTimeout(() => {\n            retryCountRef.current++;\n            reloadReservation();\n            forceUpdate();\n          }, retryCountRef.current * 5000);\n        }\n      };\n\n      return reloadReservation();\n    } else {\n      return clearTimeout(retryTimeoutRef.current);\n    }\n  }, [hasError]);\n\n  return retryCountRef.current;\n};\n\nconst ImageFileMessage = ({ message, children, variant }: 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  const key = useRetry(imageNotFound);\n\n  return (\n    <View\n      style={[\n        styles.bubbleContainer,\n        {\n          backgroundColor: imageNotFound\n            ? colors.onBackground04\n            : colors.ui.groupChannelMessage[variant].enabled.background,\n        },\n      ]}\n    >\n      <View style={style}>\n        <Image\n          key={key}\n          source={{ uri: fileUrl }}\n          style={[StyleSheet.absoluteFill, imageNotFound && styles.hide]}\n          resizeMode={'cover'}\n          resizeMethod={'resize'}\n          onError={() => setImageNotFound(true)}\n          onLoad={() => setImageNotFound(false)}\n        />\n        {imageNotFound && (\n          <Icon\n            containerStyle={StyleSheet.absoluteFill}\n            icon={'thumbnail-none'}\n            size={48}\n            color={colors.onBackground02}\n          />\n        )}\n      </View>\n      {children}\n    </View>\n  );\n};\n\nconst styles = createStyleSheet({\n  bubbleContainer: {\n    borderRadius: 16,\n    overflow: 'hidden',\n  },\n  image: {\n    width: 240,\n    maxWidth: 240,\n    height: 160,\n    borderRadius: 16,\n    overflow: 'hidden',\n  },\n  hide: {\n    display: 'none',\n  },\n});\n\nexport default ImageFileMessage;\n"],"mappings":"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"}

package/lib/module/components/MessageRenderer/FileMessage/VideoFileMessage.js

@@ -3,7 +3,6 @@ import { View } from 'react-native';
 import { Icon, Image, createStyleSheet, useUIKitTheme } from '@sendbird/uikit-react-native-foundation';
 import { getAvailableUriFromFileMessage } from '@sendbird/uikit-utils';
 import { usePlatformService } from '../../../hooks/useContext';
-
 const useRetry = function (videoFileUrl) {
   let retryCount = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 5;
   const [state, setState] = useState({
@@ -15,7 +14,6 @@ const useRetry = function (videoFileUrl) {
   const {
     mediaService
   } = usePlatformService();
-
   const fetchThumbnail = () => {
     return mediaService.getVideoThumbnail({
       url: videoFileUrl,
@@ -27,7 +25,6 @@ const useRetry = function (videoFileUrl) {
       });
     });
   };
-
   useEffect(() => {
     if (!state.thumbnail) {
       const reloadReservation = () => {
@@ -39,7 +36,6 @@ const useRetry = function (videoFileUrl) {
           }, retryCountRef.current * 5000);
         }
       };
-
       return reloadReservation();
     } else {
       return clearTimeout(retryTimeoutRef.current);
@@ -47,7 +43,6 @@ const useRetry = function (videoFileUrl) {
   }, [state.thumbnail]);
   return state;
 };
-
 const VideoFileMessage = _ref => {
   let {
     message,
@@ -65,7 +60,6 @@ const VideoFileMessage = _ref => {
     loading,
     thumbnail
   } = useRetry(fileUrl);
-
   if (loading) {
     return /*#__PURE__*/React.createElement(View, {
       style: [styles.bubbleContainer, {
@@ -77,7 +71,6 @@ const VideoFileMessage = _ref => {
       style: style
     }), /*#__PURE__*/React.createElement(PlayIcon, null)), children);
   }
-
   return /*#__PURE__*/React.createElement(View, {
     style: [styles.bubbleContainer, {
       backgroundColor: colors.ui.groupChannelMessage[variant].enabled.background
@@ -93,7 +86,6 @@ const VideoFileMessage = _ref => {
     resizeMethod: 'resize'
   }), /*#__PURE__*/React.createElement(PlayIcon, null)), children);
 };
-
 const PlayIcon = () => {
   const {
     colors
@@ -107,7 +99,6 @@ const PlayIcon = () => {
     }]
   });
 };
-
 const styles = createStyleSheet({
   bubbleContainer: {
     borderRadius: 16,

package/lib/module/components/MessageRenderer/FileMessage/VideoFileMessage.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useEffect","useRef","useState","View","Icon","Image","createStyleSheet","useUIKitTheme","getAvailableUriFromFileMessage","usePlatformService","useRetry","videoFileUrl","retryCount","state","setState","thumbnail","loading","retryCountRef","retryTimeoutRef","mediaService","fetchThumbnail","getVideoThumbnail","url","timeMills","then","result","path","reloadReservation","current","setTimeout","clearTimeout","VideoFileMessage","message","variant","children","colors","fileUrl","style","styles","video","backgroundColor","onBackground04","bubbleContainer","ui","groupChannelMessage","enabled","background","bubbleInnerContainer","uri","PlayIcon","onBackground02","playIcon","onBackgroundReverse01","borderRadius","overflow","alignItems","justifyContent","width","maxWidth","height","position","padding"],"sources":["VideoFileMessage.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport { View } from 'react-native';\n\nimport { Icon, Image, createStyleSheet, useUIKitTheme } from '@sendbird/uikit-react-native-foundation';\nimport { getAvailableUriFromFileMessage } from '@sendbird/uikit-utils';\n\nimport { usePlatformService } from '../../../hooks/useContext';\nimport type { FileMessageProps } from './index';\n\nconst useRetry = (videoFileUrl: string, 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\n  const { mediaService } = usePlatformService();\n\n  const fetchThumbnail = () => {\n    return mediaService.getVideoThumbnail({ url: videoFileUrl, timeMills: 1000 }).then((result) => {\n      setState({ loading: false, thumbnail: result?.path ?? null });\n    });\n  };\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();\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};\n\nconst VideoFileMessage = ({ message, variant, children }: FileMessageProps) => {\n  const { colors } = useUIKitTheme();\n\n  const fileUrl = getAvailableUriFromFileMessage(message);\n  const style = [styles.video, { backgroundColor: colors.onBackground04 }];\n\n  const { loading, thumbnail } = useRetry(fileUrl);\n\n  if (loading) {\n    return (\n      <View\n        style={[styles.bubbleContainer, { backgroundColor: colors.ui.groupChannelMessage[variant].enabled.background }]}\n      >\n        <View style={[styles.bubbleContainer, styles.bubbleInnerContainer]}>\n          <View style={style} />\n          <PlayIcon />\n        </View>\n        {children}\n      </View>\n    );\n  }\n\n  return (\n    <View\n      style={[styles.bubbleContainer, { backgroundColor: colors.ui.groupChannelMessage[variant].enabled.background }]}\n    >\n      <View style={[styles.bubbleContainer, styles.bubbleInnerContainer]}>\n        <Image source={{ uri: thumbnail || fileUrl }} style={style} resizeMode={'cover'} resizeMethod={'resize'} />\n        <PlayIcon />\n      </View>\n      {children}\n    </View>\n  );\n};\n\nconst PlayIcon = () => {\n  const { colors } = useUIKitTheme();\n\n  return (\n    <Icon\n      icon={'play'}\n      size={28}\n      color={colors.onBackground02}\n      containerStyle={[styles.playIcon, { backgroundColor: colors.onBackgroundReverse01 }]}\n    />\n  );\n};\n\nconst styles = createStyleSheet({\n  bubbleContainer: {\n    borderRadius: 16,\n    overflow: 'hidden',\n  },\n  bubbleInnerContainer: {\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n  video: {\n    width: 240,\n    maxWidth: 240,\n    height: 160,\n  },\n  playIcon: {\n    position: 'absolute',\n    padding: 10,\n    borderRadius: 50,\n  },\n});\n\nexport default VideoFileMessage;\n"],"mappings":"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"}
+{"version":3,"names":["React","useEffect","useRef","useState","View","Icon","Image","createStyleSheet","useUIKitTheme","getAvailableUriFromFileMessage","usePlatformService","useRetry","videoFileUrl","retryCount","arguments","length","undefined","state","setState","thumbnail","loading","retryCountRef","retryTimeoutRef","mediaService","fetchThumbnail","getVideoThumbnail","url","timeMills","then","result","path","reloadReservation","current","setTimeout","clearTimeout","VideoFileMessage","_ref","message","variant","children","colors","fileUrl","style","styles","video","backgroundColor","onBackground04","createElement","bubbleContainer","ui","groupChannelMessage","enabled","background","bubbleInnerContainer","PlayIcon","source","uri","resizeMode","resizeMethod","icon","size","color","onBackground02","containerStyle","playIcon","onBackgroundReverse01","borderRadius","overflow","alignItems","justifyContent","width","maxWidth","height","position","padding"],"sources":["VideoFileMessage.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport { View } from 'react-native';\n\nimport { Icon, Image, createStyleSheet, useUIKitTheme } from '@sendbird/uikit-react-native-foundation';\nimport { getAvailableUriFromFileMessage } from '@sendbird/uikit-utils';\n\nimport { usePlatformService } from '../../../hooks/useContext';\nimport type { FileMessageProps } from './index';\n\nconst useRetry = (videoFileUrl: string, 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\n  const { mediaService } = usePlatformService();\n\n  const fetchThumbnail = () => {\n    return mediaService.getVideoThumbnail({ url: videoFileUrl, timeMills: 1000 }).then((result) => {\n      setState({ loading: false, thumbnail: result?.path ?? null });\n    });\n  };\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();\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};\n\nconst VideoFileMessage = ({ message, variant, children }: FileMessageProps) => {\n  const { colors } = useUIKitTheme();\n\n  const fileUrl = getAvailableUriFromFileMessage(message);\n  const style = [styles.video, { backgroundColor: colors.onBackground04 }];\n\n  const { loading, thumbnail } = useRetry(fileUrl);\n\n  if (loading) {\n    return (\n      <View\n        style={[styles.bubbleContainer, { backgroundColor: colors.ui.groupChannelMessage[variant].enabled.background }]}\n      >\n        <View style={[styles.bubbleContainer, styles.bubbleInnerContainer]}>\n          <View style={style} />\n          <PlayIcon />\n        </View>\n        {children}\n      </View>\n    );\n  }\n\n  return (\n    <View\n      style={[styles.bubbleContainer, { backgroundColor: colors.ui.groupChannelMessage[variant].enabled.background }]}\n    >\n      <View style={[styles.bubbleContainer, styles.bubbleInnerContainer]}>\n        <Image source={{ uri: thumbnail || fileUrl }} style={style} resizeMode={'cover'} resizeMethod={'resize'} />\n        <PlayIcon />\n      </View>\n      {children}\n    </View>\n  );\n};\n\nconst PlayIcon = () => {\n  const { colors } = useUIKitTheme();\n\n  return (\n    <Icon\n      icon={'play'}\n      size={28}\n      color={colors.onBackground02}\n      containerStyle={[styles.playIcon, { backgroundColor: colors.onBackgroundReverse01 }]}\n    />\n  );\n};\n\nconst styles = createStyleSheet({\n  bubbleContainer: {\n    borderRadius: 16,\n    overflow: 'hidden',\n  },\n  bubbleInnerContainer: {\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n  video: {\n    width: 240,\n    maxWidth: 240,\n    height: 160,\n  },\n  playIcon: {\n    position: 'absolute',\n    padding: 10,\n    borderRadius: 50,\n  },\n});\n\nexport default VideoFileMessage;\n"],"mappings":"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"}

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

@@ -1,11 +1,9 @@
 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); }
-
 import React from 'react';
 import { getFileExtension, getFileType } from '@sendbird/uikit-utils';
 import BaseFileMessage from './BaseFileMessage';
 import ImageFileMessage from './ImageFileMessage';
 import VideoFileMessage from './VideoFileMessage';
-
 const FileMessage = props => {
   const fileType = getFileType(props.message.type || getFileExtension(props.message.name));
   if (fileType === 'image') return /*#__PURE__*/React.createElement(ImageFileMessage, props);
@@ -14,6 +12,5 @@ const FileMessage = props => {
     type: fileType
   }));
 };
-
 export default /*#__PURE__*/React.memo(FileMessage);
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["React","getFileExtension","getFileType","BaseFileMessage","ImageFileMessage","VideoFileMessage","FileMessage","props","fileType","message","type","name","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';\nimport VideoFileMessage from './VideoFileMessage';\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  if (fileType === 'video') return <VideoFileMessage {...props} />;\n\n  return <BaseFileMessage {...props} type={fileType} />;\n};\n\nexport default React.memo(FileMessage);\n"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAEA,SAA8BC,gBAA9B,EAAgDC,WAAhD,QAAmE,uBAAnE;AAGA,OAAOC,eAAP,MAA4B,mBAA5B;AACA,OAAOC,gBAAP,MAA6B,oBAA7B;AACA,OAAOC,gBAAP,MAA6B,oBAA7B;;AAGA,MAAMC,WAAW,GAAIC,KAAD,IAA6B;EAC/C,MAAMC,QAAQ,GAAGN,WAAW,CAACK,KAAK,CAACE,OAAN,CAAcC,IAAd,IAAsBT,gBAAgB,CAACM,KAAK,CAACE,OAAN,CAAcE,IAAf,CAAvC,CAA5B;EAEA,IAAIH,QAAQ,KAAK,OAAjB,EAA0B,oBAAO,oBAAC,gBAAD,EAAsBD,KAAtB,CAAP;EAC1B,IAAIC,QAAQ,KAAK,OAAjB,EAA0B,oBAAO,oBAAC,gBAAD,EAAsBD,KAAtB,CAAP;EAE1B,oBAAO,oBAAC,eAAD,eAAqBA,KAArB;IAA4B,IAAI,EAAEC;EAAlC,GAAP;AACD,CAPD;;AASA,4BAAeR,KAAK,CAACY,IAAN,CAAWN,WAAX,CAAf"}
+{"version":3,"names":["React","getFileExtension","getFileType","BaseFileMessage","ImageFileMessage","VideoFileMessage","FileMessage","props","fileType","message","type","name","createElement","_extends","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';\nimport VideoFileMessage from './VideoFileMessage';\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  if (fileType === 'video') return <VideoFileMessage {...props} />;\n\n  return <BaseFileMessage {...props} type={fileType} />;\n};\n\nexport default React.memo(FileMessage);\n"],"mappings":";AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAA8BC,gBAAgB,EAAEC,WAAW,QAAQ,uBAAuB;AAG1F,OAAOC,eAAe,MAAM,mBAAmB;AAC/C,OAAOC,gBAAgB,MAAM,oBAAoB;AACjD,OAAOC,gBAAgB,MAAM,oBAAoB;AAGjD,MAAMC,WAAW,GAAIC,KAAuB,IAAK;EAC/C,MAAMC,QAAQ,GAAGN,WAAW,CAACK,KAAK,CAACE,OAAO,CAACC,IAAI,IAAIT,gBAAgB,CAACM,KAAK,CAACE,OAAO,CAACE,IAAI,CAAC,CAAC;EAExF,IAAIH,QAAQ,KAAK,OAAO,EAAE,oBAAOR,KAAA,CAAAY,aAAA,CAACR,gBAAgB,EAAKG,KAAK,CAAI;EAChE,IAAIC,QAAQ,KAAK,OAAO,EAAE,oBAAOR,KAAA,CAAAY,aAAA,CAACP,gBAAgB,EAAKE,KAAK,CAAI;EAEhE,oBAAOP,KAAA,CAAAY,aAAA,CAACT,eAAe,EAAAU,QAAA,KAAKN,KAAK;IAAEG,IAAI,EAAEF;EAAS,GAAG;AACvD,CAAC;AAED,4BAAeR,KAAK,CAACc,IAAI,CAACR,WAAW,CAAC"}

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

@@ -1,7 +1,6 @@
 import React from 'react';
 import { View } from 'react-native';
 import { createStyleSheet } from '@sendbird/uikit-react-native-foundation';
-
 const MessageContainer = _ref => {
   let {
     children
@@ -10,7 +9,6 @@ const MessageContainer = _ref => {
     style: styles.container
   }, children);
 };
-
 const styles = createStyleSheet({
   container: {
     flexDirection: 'column',

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

@@ -1 +1 @@
-{"version":3,"names":["React","View","createStyleSheet","MessageContainer","children","styles","container","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,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,IAAT,QAAqB,cAArB;AAEA,SAASC,gBAAT,QAAiC,yCAAjC;;AAEA,MAAMC,gBAAgB,GAAG,QAA2C;EAAA,IAA1C;IAAEC;EAAF,CAA0C;EAClE,oBAAO,oBAAC,IAAD;IAAM,KAAK,EAAEC,MAAM,CAACC;EAApB,GAAgCF,QAAhC,CAAP;AACD,CAFD;;AAIA,MAAMC,MAAM,GAAGH,gBAAgB,CAAC;EAC9BI,SAAS,EAAE;IACTC,aAAa,EAAE,QADN;IAETC,iBAAiB,EAAE;EAFV;AADmB,CAAD,CAA/B;AAOA,eAAeL,gBAAf"}
+{"version":3,"names":["React","View","createStyleSheet","MessageContainer","_ref","children","createElement","style","styles","container","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,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,IAAI,QAAQ,cAAc;AAEnC,SAASC,gBAAgB,QAAQ,yCAAyC;AAE1E,MAAMC,gBAAgB,GAAGC,IAAA,IAA2C;EAAA,IAA1C;IAAEC;EAAkC,CAAC,GAAAD,IAAA;EAC7D,oBAAOJ,KAAA,CAAAM,aAAA,CAACL,IAAI;IAACM,KAAK,EAAEC,MAAM,CAACC;EAAU,GAAEJ,QAAQ,CAAQ;AACzD,CAAC;AAED,MAAMG,MAAM,GAAGN,gBAAgB,CAAC;EAC9BO,SAAS,EAAE;IACTC,aAAa,EAAE,QAAQ;IACvBC,iBAAiB,EAAE;EACrB;AACF,CAAC,CAAC;AAEF,eAAeR,gBAAgB"}

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

@@ -3,7 +3,6 @@ import React from 'react';
 import { View } from 'react-native';
 import { Text, createStyleSheet, useUIKitTheme } from '@sendbird/uikit-react-native-foundation';
 import { useLocalization } from '../../hooks/useContext';
-
 const MessageDateSeparator = _ref => {
   let {
     message,
@@ -28,7 +27,6 @@ const MessageDateSeparator = _ref => {
     color: colors.ui.dateSeparator.default.none.text
   }, STRINGS.GROUP_CHANNEL.LIST_DATE_SEPARATOR(new Date(message.createdAt)))));
 };
-
 const styles = createStyleSheet({
   container: {
     alignItems: 'center',

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

@@ -1 +1 @@
-{"version":3,"names":["isSameDay","React","View","Text","createStyleSheet","useUIKitTheme","useLocalization","MessageDateSeparator","message","prevMessage","STRINGS","colors","sameDay","createdAt","styles","container","view","backgroundColor","ui","dateSeparator","default","none","background","text","GROUP_CHANNEL","LIST_DATE_SEPARATOR","Date","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\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,OAAOA,SAAP,MAAsB,oBAAtB;AACA,OAAOC,KAAP,MAAkB,OAAlB;AACA,SAASC,IAAT,QAAqB,cAArB;AAEA,SAASC,IAAT,EAAeC,gBAAf,EAAiCC,aAAjC,QAAsD,yCAAtD;AAGA,SAASC,eAAT,QAAgC,wBAAhC;;AAOA,MAAMC,oBAAoB,GAAG,QAAqC;EAAA,IAApC;IAAEC,OAAF;IAAWC;EAAX,CAAoC;EAChE,MAAM;IAAEC;EAAF,IAAcJ,eAAe,EAAnC;EACA,MAAM;IAAEK;EAAF,IAAaN,aAAa,EAAhC;EAEA,MAAMO,OAAO,GAAGZ,SAAS,CAACQ,OAAO,CAACK,SAAT,EAAoB,CAAAJ,WAAW,SAAX,IAAAA,WAAW,WAAX,YAAAA,WAAW,CAAEI,SAAb,KAA0B,CAA9C,CAAzB;EACA,IAAID,OAAJ,EAAa,OAAO,IAAP;EACb,oBACE,oBAAC,IAAD;IAAM,KAAK,EAAEE,MAAM,CAACC;EAApB,gBACE,oBAAC,IAAD;IAAM,KAAK,EAAE,CAACD,MAAM,CAACE,IAAR,EAAc;MAAEC,eAAe,EAAEN,MAAM,CAACO,EAAP,CAAUC,aAAV,CAAwBC,OAAxB,CAAgCC,IAAhC,CAAqCC;IAAxD,CAAd;EAAb,gBACE,oBAAC,IAAD;IAAM,QAAQ,MAAd;IAAe,KAAK,EAAEX,MAAM,CAACO,EAAP,CAAUC,aAAV,CAAwBC,OAAxB,CAAgCC,IAAhC,CAAqCE;EAA3D,GACGb,OAAO,CAACc,aAAR,CAAsBC,mBAAtB,CAA0C,IAAIC,IAAJ,CAASlB,OAAO,CAACK,SAAjB,CAA1C,CADH,CADF,CADF,CADF;AASD,CAfD;;AAiBA,MAAMC,MAAM,GAAGV,gBAAgB,CAAC;EAC9BW,SAAS,EAAE;IACTY,UAAU,EAAE,QADH;IAETC,cAAc,EAAE;EAFP,CADmB;EAK9BZ,IAAI,EAAE;IACJa,YAAY,EAAE,EADV;IAEJC,eAAe,EAAE,CAFb;IAGJC,iBAAiB,EAAE;EAHf;AALwB,CAAD,CAA/B;AAYA,eAAexB,oBAAf"}
+{"version":3,"names":["isSameDay","React","View","Text","createStyleSheet","useUIKitTheme","useLocalization","MessageDateSeparator","_ref","message","prevMessage","STRINGS","colors","sameDay","createdAt","createElement","style","styles","container","view","backgroundColor","ui","dateSeparator","default","none","background","caption1","color","text","GROUP_CHANNEL","LIST_DATE_SEPARATOR","Date","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\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,OAAOA,SAAS,MAAM,oBAAoB;AAC1C,OAAOC,KAAK,MAAM,OAAO;AACzB,SAASC,IAAI,QAAQ,cAAc;AAEnC,SAASC,IAAI,EAAEC,gBAAgB,EAAEC,aAAa,QAAQ,yCAAyC;AAG/F,SAASC,eAAe,QAAQ,wBAAwB;AAOxD,MAAMC,oBAAoB,GAAGC,IAAA,IAAqC;EAAA,IAApC;IAAEC,OAAO;IAAEC;EAAmB,CAAC,GAAAF,IAAA;EAC3D,MAAM;IAAEG;EAAQ,CAAC,GAAGL,eAAe,EAAE;EACrC,MAAM;IAAEM;EAAO,CAAC,GAAGP,aAAa,EAAE;EAElC,MAAMQ,OAAO,GAAGb,SAAS,CAACS,OAAO,CAACK,SAAS,EAAE,CAAAJ,WAAW,aAAXA,WAAW,uBAAXA,WAAW,CAAEI,SAAS,KAAI,CAAC,CAAC;EACzE,IAAID,OAAO,EAAE,OAAO,IAAI;EACxB,oBACEZ,KAAA,CAAAc,aAAA,CAACb,IAAI;IAACc,KAAK,EAAEC,MAAM,CAACC;EAAU,gBAC5BjB,KAAA,CAAAc,aAAA,CAACb,IAAI;IAACc,KAAK,EAAE,CAACC,MAAM,CAACE,IAAI,EAAE;MAAEC,eAAe,EAAER,MAAM,CAACS,EAAE,CAACC,aAAa,CAACC,OAAO,CAACC,IAAI,CAACC;IAAW,CAAC;EAAE,gBAC/FxB,KAAA,CAAAc,aAAA,CAACZ,IAAI;IAACuB,QAAQ;IAACC,KAAK,EAAEf,MAAM,CAACS,EAAE,CAACC,aAAa,CAACC,OAAO,CAACC,IAAI,CAACI;EAAK,GAC7DjB,OAAO,CAACkB,aAAa,CAACC,mBAAmB,CAAC,IAAIC,IAAI,CAACtB,OAAO,CAACK,SAAS,CAAC,CAAC,CAClE,CACF,CACF;AAEX,CAAC;AAED,MAAMG,MAAM,GAAGb,gBAAgB,CAAC;EAC9Bc,SAAS,EAAE;IACTc,UAAU,EAAE,QAAQ;IACpBC,cAAc,EAAE;EAClB,CAAC;EACDd,IAAI,EAAE;IACJe,YAAY,EAAE,EAAE;IAChBC,eAAe,EAAE,CAAC;IAClBC,iBAAiB,EAAE;EACrB;AACF,CAAC,CAAC;AAEF,eAAe7B,oBAAoB"}

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

@@ -2,10 +2,8 @@ import React from 'react';
 import { Pressable, View } from 'react-native';
 import { Avatar, createStyleSheet } from '@sendbird/uikit-react-native-foundation';
 import { useUserProfile } from '../../hooks/useContext';
-
 const MessageIncomingAvatar = _ref => {
   var _message$sender;
-
   let {
     message,
     grouping
@@ -25,7 +23,6 @@ const MessageIncomingAvatar = _ref => {
     uri: (_message$sender = message.sender) === null || _message$sender === void 0 ? void 0 : _message$sender.profileUrl
   })));
 };
-
 const styles = createStyleSheet({
   avatar: {
     width: 26,

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

@@ -1 +1 @@
-{"version":3,"names":["React","Pressable","View","Avatar","createStyleSheet","useUserProfile","MessageIncomingAvatar","message","grouping","show","styles","avatar","isFileMessage","isUserMessage","sender","profileUrl","width","marginRight"],"sources":["MessageIncomingAvatar.tsx"],"sourcesContent":["import React from 'react';\nimport { Pressable, View } from 'react-native';\n\nimport { Avatar, createStyleSheet } from '@sendbird/uikit-react-native-foundation';\nimport type { SendbirdMessage } from '@sendbird/uikit-utils';\n\nimport { useUserProfile } from '../../hooks/useContext';\n\ntype Props = {\n  message: SendbirdMessage;\n  grouping: boolean;\n};\nconst MessageIncomingAvatar = ({ message, grouping }: Props) => {\n  const { show } = useUserProfile();\n  if (grouping) return <View style={styles.avatar} />;\n  return (\n    <View style={styles.avatar}>\n      {(message.isFileMessage() || message.isUserMessage()) && (\n        <Pressable onPress={() => show(message.sender)}>\n          <Avatar size={26} uri={message.sender?.profileUrl} />\n        </Pressable>\n      )}\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,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,SAAT,EAAoBC,IAApB,QAAgC,cAAhC;AAEA,SAASC,MAAT,EAAiBC,gBAAjB,QAAyC,yCAAzC;AAGA,SAASC,cAAT,QAA+B,wBAA/B;;AAMA,MAAMC,qBAAqB,GAAG,QAAkC;EAAA;;EAAA,IAAjC;IAAEC,OAAF;IAAWC;EAAX,CAAiC;EAC9D,MAAM;IAAEC;EAAF,IAAWJ,cAAc,EAA/B;EACA,IAAIG,QAAJ,EAAc,oBAAO,oBAAC,IAAD;IAAM,KAAK,EAAEE,MAAM,CAACC;EAApB,EAAP;EACd,oBACE,oBAAC,IAAD;IAAM,KAAK,EAAED,MAAM,CAACC;EAApB,GACG,CAACJ,OAAO,CAACK,aAAR,MAA2BL,OAAO,CAACM,aAAR,EAA5B,kBACC,oBAAC,SAAD;IAAW,OAAO,EAAE,MAAMJ,IAAI,CAACF,OAAO,CAACO,MAAT;EAA9B,gBACE,oBAAC,MAAD;IAAQ,IAAI,EAAE,EAAd;IAAkB,GAAG,qBAAEP,OAAO,CAACO,MAAV,oDAAE,gBAAgBC;EAAvC,EADF,CAFJ,CADF;AASD,CAZD;;AAcA,MAAML,MAAM,GAAGN,gBAAgB,CAAC;EAC9BO,MAAM,EAAE;IACNK,KAAK,EAAE,EADD;IAENC,WAAW,EAAE;EAFP;AADsB,CAAD,CAA/B;AAOA,eAAeX,qBAAf"}
+{"version":3,"names":["React","Pressable","View","Avatar","createStyleSheet","useUserProfile","MessageIncomingAvatar","_ref","_message$sender","message","grouping","show","createElement","style","styles","avatar","isFileMessage","isUserMessage","onPress","sender","size","uri","profileUrl","width","marginRight"],"sources":["MessageIncomingAvatar.tsx"],"sourcesContent":["import React from 'react';\nimport { Pressable, View } from 'react-native';\n\nimport { Avatar, createStyleSheet } from '@sendbird/uikit-react-native-foundation';\nimport type { SendbirdMessage } from '@sendbird/uikit-utils';\n\nimport { useUserProfile } from '../../hooks/useContext';\n\ntype Props = {\n  message: SendbirdMessage;\n  grouping: boolean;\n};\nconst MessageIncomingAvatar = ({ message, grouping }: Props) => {\n  const { show } = useUserProfile();\n  if (grouping) return <View style={styles.avatar} />;\n  return (\n    <View style={styles.avatar}>\n      {(message.isFileMessage() || message.isUserMessage()) && (\n        <Pressable onPress={() => show(message.sender)}>\n          <Avatar size={26} uri={message.sender?.profileUrl} />\n        </Pressable>\n      )}\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,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,SAAS,EAAEC,IAAI,QAAQ,cAAc;AAE9C,SAASC,MAAM,EAAEC,gBAAgB,QAAQ,yCAAyC;AAGlF,SAASC,cAAc,QAAQ,wBAAwB;AAMvD,MAAMC,qBAAqB,GAAGC,IAAA,IAAkC;EAAA,IAAAC,eAAA;EAAA,IAAjC;IAAEC,OAAO;IAAEC;EAAgB,CAAC,GAAAH,IAAA;EACzD,MAAM;IAAEI;EAAK,CAAC,GAAGN,cAAc,EAAE;EACjC,IAAIK,QAAQ,EAAE,oBAAOV,KAAA,CAAAY,aAAA,CAACV,IAAI;IAACW,KAAK,EAAEC,MAAM,CAACC;EAAO,EAAG;EACnD,oBACEf,KAAA,CAAAY,aAAA,CAACV,IAAI;IAACW,KAAK,EAAEC,MAAM,CAACC;EAAO,GACxB,CAACN,OAAO,CAACO,aAAa,EAAE,IAAIP,OAAO,CAACQ,aAAa,EAAE,kBAClDjB,KAAA,CAAAY,aAAA,CAACX,SAAS;IAACiB,OAAO,EAAEA,CAAA,KAAMP,IAAI,CAACF,OAAO,CAACU,MAAM;EAAE,gBAC7CnB,KAAA,CAAAY,aAAA,CAACT,MAAM;IAACiB,IAAI,EAAE,EAAG;IAACC,GAAG,GAAAb,eAAA,GAAEC,OAAO,CAACU,MAAM,cAAAX,eAAA,uBAAdA,eAAA,CAAgBc;EAAW,EAAG,CAExD,CACI;AAEX,CAAC;AAED,MAAMR,MAAM,GAAGV,gBAAgB,CAAC;EAC9BW,MAAM,EAAE;IACNQ,KAAK,EAAE,EAAE;IACTC,WAAW,EAAE;EACf;AACF,CAAC,CAAC;AAEF,eAAelB,qBAAqB"}

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

@@ -2,10 +2,8 @@ import React from 'react';
 import { View } from 'react-native';
 import { Text, createStyleSheet, useUIKitTheme } from '@sendbird/uikit-react-native-foundation';
 import { useLocalization } from '../../hooks/useContext';
-
 const MessageIncomingSenderName = _ref => {
   var _message$sender;
-
   let {
     message,
     grouping
@@ -25,7 +23,6 @@ const MessageIncomingSenderName = _ref => {
     numberOfLines: 1
   }, ((_message$sender = message.sender) === null || _message$sender === void 0 ? void 0 : _message$sender.nickname) || STRINGS.LABELS.USER_NO_NAME));
 };
-
 const styles = createStyleSheet({
   sender: {
     marginLeft: 12,

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

@@ -1 +1 @@
-{"version":3,"names":["React","View","Text","createStyleSheet","useUIKitTheme","useLocalization","MessageIncomingSenderName","message","grouping","colors","STRINGS","styles","sender","isFileMessage","isUserMessage","ui","groupChannelMessage","incoming","enabled","textSenderName","nickname","LABELS","USER_NO_NAME","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.groupChannelMessage.incoming.enabled.textSenderName} numberOfLines={1}>\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,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,IAAT,QAAqB,cAArB;AAEA,SAASC,IAAT,EAAeC,gBAAf,EAAiCC,aAAjC,QAAsD,yCAAtD;AAGA,SAASC,eAAT,QAAgC,wBAAhC;;AAMA,MAAMC,yBAAyB,GAAG,QAAkC;EAAA;;EAAA,IAAjC;IAAEC,OAAF;IAAWC;EAAX,CAAiC;EAClE,MAAM;IAAEC;EAAF,IAAaL,aAAa,EAAhC;EACA,MAAM;IAAEM;EAAF,IAAcL,eAAe,EAAnC;EACA,IAAIG,QAAJ,EAAc,OAAO,IAAP;EAEd,oBACE,oBAAC,IAAD;IAAM,KAAK,EAAEG,MAAM,CAACC;EAApB,GACG,CAACL,OAAO,CAACM,aAAR,MAA2BN,OAAO,CAACO,aAAR,EAA5B,kBACC,oBAAC,IAAD;IAAM,QAAQ,MAAd;IAAe,KAAK,EAAEL,MAAM,CAACM,EAAP,CAAUC,mBAAV,CAA8BC,QAA9B,CAAuCC,OAAvC,CAA+CC,cAArE;IAAqF,aAAa,EAAE;EAApG,GACG,oBAAAZ,OAAO,CAACK,MAAR,oEAAgBQ,QAAhB,KAA4BV,OAAO,CAACW,MAAR,CAAeC,YAD9C,CAFJ,CADF;AASD,CAdD;;AAgBA,MAAMX,MAAM,GAAGR,gBAAgB,CAAC;EAC9BS,MAAM,EAAE;IACNW,UAAU,EAAE,EADN;IAENC,YAAY,EAAE;EAFR;AADsB,CAAD,CAA/B;AAOA,eAAelB,yBAAf"}
+{"version":3,"names":["React","View","Text","createStyleSheet","useUIKitTheme","useLocalization","MessageIncomingSenderName","_ref","_message$sender","message","grouping","colors","STRINGS","createElement","style","styles","sender","isFileMessage","isUserMessage","caption1","color","ui","groupChannelMessage","incoming","enabled","textSenderName","numberOfLines","nickname","LABELS","USER_NO_NAME","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.groupChannelMessage.incoming.enabled.textSenderName} numberOfLines={1}>\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,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,IAAI,QAAQ,cAAc;AAEnC,SAASC,IAAI,EAAEC,gBAAgB,EAAEC,aAAa,QAAQ,yCAAyC;AAG/F,SAASC,eAAe,QAAQ,wBAAwB;AAMxD,MAAMC,yBAAyB,GAAGC,IAAA,IAAkC;EAAA,IAAAC,eAAA;EAAA,IAAjC;IAAEC,OAAO;IAAEC;EAAgB,CAAC,GAAAH,IAAA;EAC7D,MAAM;IAAEI;EAAO,CAAC,GAAGP,aAAa,EAAE;EAClC,MAAM;IAAEQ;EAAQ,CAAC,GAAGP,eAAe,EAAE;EACrC,IAAIK,QAAQ,EAAE,OAAO,IAAI;EAEzB,oBACEV,KAAA,CAAAa,aAAA,CAACZ,IAAI;IAACa,KAAK,EAAEC,MAAM,CAACC;EAAO,GACxB,CAACP,OAAO,CAACQ,aAAa,EAAE,IAAIR,OAAO,CAACS,aAAa,EAAE,kBAClDlB,KAAA,CAAAa,aAAA,CAACX,IAAI;IAACiB,QAAQ;IAACC,KAAK,EAAET,MAAM,CAACU,EAAE,CAACC,mBAAmB,CAACC,QAAQ,CAACC,OAAO,CAACC,cAAe;IAACC,aAAa,EAAE;EAAE,GACnG,EAAAlB,eAAA,GAAAC,OAAO,CAACO,MAAM,cAAAR,eAAA,uBAAdA,eAAA,CAAgBmB,QAAQ,KAAIf,OAAO,CAACgB,MAAM,CAACC,YAAY,CAE3D,CACI;AAEX,CAAC;AAED,MAAMd,MAAM,GAAGZ,gBAAgB,CAAC;EAC9Ba,MAAM,EAAE;IACNc,UAAU,EAAE,EAAE;IACdC,YAAY,EAAE;EAChB;AACF,CAAC,CAAC;AAEF,eAAezB,yBAAyB"}