@sendbird/uikit-react-native 3.7.6 → 3.8.1

package/lib/module/components/ScrollToBottomButton.js

@@ -1,11 +1,10 @@
 import React from 'react';
 import { Platform, TouchableOpacity } from 'react-native';
 import { Icon, createStyleSheet, useUIKitTheme } from '@sendbird/uikit-react-native-foundation';
-const ScrollToBottomButton = _ref => {
-  let {
-    visible,
-    onPress
-  } = _ref;
+const ScrollToBottomButton = ({
+  visible,
+  onPress
+}) => {
   const {
     palette,
     select

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

@@ -1 +1 @@
-{"version":3,"names":["React","Platform","TouchableOpacity","Icon","createStyleSheet","useUIKitTheme","ScrollToBottomButton","_ref","visible","onPress","palette","select","createElement","activeOpacity","disabled","style","styles","container","backgroundColor","dark","background400","light","background50","icon","size","padding","borderRadius","android","elevation","ios","shadowColor","shadowRadius","shadowOffset","width","height","shadowOpacity","memo"],"sources":["ScrollToBottomButton.tsx"],"sourcesContent":["import React from 'react';\nimport { Platform, TouchableOpacity } from 'react-native';\n\nimport { Icon, createStyleSheet, useUIKitTheme } from '@sendbird/uikit-react-native-foundation';\n\ntype Props = {\n  visible: boolean;\n  onPress: () => void;\n};\nconst ScrollToBottomButton = ({ visible, onPress }: Props) => {\n  const { palette, select } = useUIKitTheme();\n  if (!visible) return null;\n\n  return (\n    <TouchableOpacity\n      onPress={onPress}\n      activeOpacity={0.8}\n      disabled={!visible}\n      style={[\n        styles.container,\n        { backgroundColor: select({ dark: palette.background400, light: palette.background50 }) },\n      ]}\n    >\n      <Icon icon={'chevron-down'} size={22} />\n    </TouchableOpacity>\n  );\n};\n\nconst styles = createStyleSheet({\n  container: {\n    padding: 8,\n    borderRadius: 24,\n    ...Platform.select({\n      android: {\n        elevation: 4,\n      },\n      ios: {\n        shadowColor: 'black',\n        shadowRadius: 4,\n        shadowOffset: { width: 0, height: 4 },\n        shadowOpacity: 0.3,\n      },\n    }),\n  },\n});\n\nexport default React.memo(ScrollToBottomButton);\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,QAAQ,EAAEC,gBAAgB,QAAQ,cAAc;AAEzD,SAASC,IAAI,EAAEC,gBAAgB,EAAEC,aAAa,QAAQ,yCAAyC;AAM/F,MAAMC,oBAAoB,GAAGC,IAAA,IAAiC;EAAA,IAAhC;IAAEC,OAAO;IAAEC;EAAe,CAAC,GAAAF,IAAA;EACvD,MAAM;IAAEG,OAAO;IAAEC;EAAO,CAAC,GAAGN,aAAa,EAAE;EAC3C,IAAI,CAACG,OAAO,EAAE,OAAO,IAAI;EAEzB,oBACER,KAAA,CAAAY,aAAA,CAACV,gBAAgB;IACfO,OAAO,EAAEA,OAAQ;IACjBI,aAAa,EAAE,GAAI;IACnBC,QAAQ,EAAE,CAACN,OAAQ;IACnBO,KAAK,EAAE,CACLC,MAAM,CAACC,SAAS,EAChB;MAAEC,eAAe,EAAEP,MAAM,CAAC;QAAEQ,IAAI,EAAET,OAAO,CAACU,aAAa;QAAEC,KAAK,EAAEX,OAAO,CAACY;MAAa,CAAC;IAAE,CAAC;EACzF,gBAEFtB,KAAA,CAAAY,aAAA,CAACT,IAAI;IAACoB,IAAI,EAAE,cAAe;IAACC,IAAI,EAAE;EAAG,EAAG,CACvB;AAEvB,CAAC;AAED,MAAMR,MAAM,GAAGZ,gBAAgB,CAAC;EAC9Ba,SAAS,EAAE;IACTQ,OAAO,EAAE,CAAC;IACVC,YAAY,EAAE,EAAE;IAChB,GAAGzB,QAAQ,CAACU,MAAM,CAAC;MACjBgB,OAAO,EAAE;QACPC,SAAS,EAAE;MACb,CAAC;MACDC,GAAG,EAAE;QACHC,WAAW,EAAE,OAAO;QACpBC,YAAY,EAAE,CAAC;QACfC,YAAY,EAAE;UAAEC,KAAK,EAAE,CAAC;UAAEC,MAAM,EAAE;QAAE,CAAC;QACrCC,aAAa,EAAE;MACjB;IACF,CAAC;EACH;AACF,CAAC,CAAC;AAEF,4BAAenC,KAAK,CAACoC,IAAI,CAAC9B,oBAAoB,CAAC"}
+{"version":3,"names":["React","Platform","TouchableOpacity","Icon","createStyleSheet","useUIKitTheme","ScrollToBottomButton","visible","onPress","palette","select","createElement","activeOpacity","disabled","style","styles","container","backgroundColor","dark","background400","light","background50","icon","size","padding","borderRadius","android","elevation","ios","shadowColor","shadowRadius","shadowOffset","width","height","shadowOpacity","memo"],"sources":["ScrollToBottomButton.tsx"],"sourcesContent":["import React from 'react';\nimport { Platform, TouchableOpacity } from 'react-native';\n\nimport { Icon, createStyleSheet, useUIKitTheme } from '@sendbird/uikit-react-native-foundation';\n\ntype Props = {\n  visible: boolean;\n  onPress: () => void;\n};\nconst ScrollToBottomButton = ({ visible, onPress }: Props) => {\n  const { palette, select } = useUIKitTheme();\n  if (!visible) return null;\n\n  return (\n    <TouchableOpacity\n      onPress={onPress}\n      activeOpacity={0.8}\n      disabled={!visible}\n      style={[\n        styles.container,\n        { backgroundColor: select({ dark: palette.background400, light: palette.background50 }) },\n      ]}\n    >\n      <Icon icon={'chevron-down'} size={22} />\n    </TouchableOpacity>\n  );\n};\n\nconst styles = createStyleSheet({\n  container: {\n    padding: 8,\n    borderRadius: 24,\n    ...Platform.select({\n      android: {\n        elevation: 4,\n      },\n      ios: {\n        shadowColor: 'black',\n        shadowRadius: 4,\n        shadowOffset: { width: 0, height: 4 },\n        shadowOpacity: 0.3,\n      },\n    }),\n  },\n});\n\nexport default React.memo(ScrollToBottomButton);\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,QAAQ,EAAEC,gBAAgB,QAAQ,cAAc;AAEzD,SAASC,IAAI,EAAEC,gBAAgB,EAAEC,aAAa,QAAQ,yCAAyC;AAM/F,MAAMC,oBAAoB,GAAGA,CAAC;EAAEC,OAAO;EAAEC;AAAe,CAAC,KAAK;EAC5D,MAAM;IAAEC,OAAO;IAAEC;EAAO,CAAC,GAAGL,aAAa,CAAC,CAAC;EAC3C,IAAI,CAACE,OAAO,EAAE,OAAO,IAAI;EAEzB,oBACEP,KAAA,CAAAW,aAAA,CAACT,gBAAgB;IACfM,OAAO,EAAEA,OAAQ;IACjBI,aAAa,EAAE,GAAI;IACnBC,QAAQ,EAAE,CAACN,OAAQ;IACnBO,KAAK,EAAE,CACLC,MAAM,CAACC,SAAS,EAChB;MAAEC,eAAe,EAAEP,MAAM,CAAC;QAAEQ,IAAI,EAAET,OAAO,CAACU,aAAa;QAAEC,KAAK,EAAEX,OAAO,CAACY;MAAa,CAAC;IAAE,CAAC;EACzF,gBAEFrB,KAAA,CAAAW,aAAA,CAACR,IAAI;IAACmB,IAAI,EAAE,cAAe;IAACC,IAAI,EAAE;EAAG,CAAE,CACvB,CAAC;AAEvB,CAAC;AAED,MAAMR,MAAM,GAAGX,gBAAgB,CAAC;EAC9BY,SAAS,EAAE;IACTQ,OAAO,EAAE,CAAC;IACVC,YAAY,EAAE,EAAE;IAChB,GAAGxB,QAAQ,CAACS,MAAM,CAAC;MACjBgB,OAAO,EAAE;QACPC,SAAS,EAAE;MACb,CAAC;MACDC,GAAG,EAAE;QACHC,WAAW,EAAE,OAAO;QACpBC,YAAY,EAAE,CAAC;QACfC,YAAY,EAAE;UAAEC,KAAK,EAAE,CAAC;UAAEC,MAAM,EAAE;QAAE,CAAC;QACrCC,aAAa,EAAE;MACjB;IACF,CAAC;EACH;AACF,CAAC,CAAC;AAEF,4BAAelC,KAAK,CAACmC,IAAI,CAAC7B,oBAAoB,CAAC","ignoreList":[]}

package/lib/module/components/StatusComposition.js

@@ -1,12 +1,11 @@
 import React from 'react';
-const StatusComposition = _ref => {
-  let {
-    children,
-    error,
-    ErrorComponent,
-    LoadingComponent,
-    loading
-  } = _ref;
+const StatusComposition = ({
+  children,
+  error,
+  ErrorComponent,
+  LoadingComponent,
+  loading
+}) => {
   if (loading && LoadingComponent) return /*#__PURE__*/React.createElement(React.Fragment, null, LoadingComponent);
   if (error && ErrorComponent) return /*#__PURE__*/React.createElement(React.Fragment, null, ErrorComponent);
   return /*#__PURE__*/React.createElement(React.Fragment, null, children);

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

@@ -1 +1 @@
-{"version":3,"names":["React","StatusComposition","_ref","children","error","ErrorComponent","LoadingComponent","loading","createElement","Fragment"],"sources":["StatusComposition.tsx"],"sourcesContent":["import React, { ReactNode } from 'react';\n\ntype Props = {\n  loading?: boolean;\n  LoadingComponent?: ReactNode;\n  error?: boolean;\n  ErrorComponent?: ReactNode;\n  children: React.ReactNode;\n};\nconst StatusComposition = ({ children, error, ErrorComponent, LoadingComponent, loading }: Props) => {\n  if (loading && LoadingComponent) return <>{LoadingComponent}</>;\n  if (error && ErrorComponent) return <>{ErrorComponent}</>;\n  return <>{children}</>;\n};\n\nexport default StatusComposition;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAqB,OAAO;AASxC,MAAMC,iBAAiB,GAAGC,IAAA,IAA2E;EAAA,IAA1E;IAAEC,QAAQ;IAAEC,KAAK;IAAEC,cAAc;IAAEC,gBAAgB;IAAEC;EAAe,CAAC,GAAAL,IAAA;EAC9F,IAAIK,OAAO,IAAID,gBAAgB,EAAE,oBAAON,KAAA,CAAAQ,aAAA,CAAAR,KAAA,CAAAS,QAAA,QAAGH,gBAAgB,CAAI;EAC/D,IAAIF,KAAK,IAAIC,cAAc,EAAE,oBAAOL,KAAA,CAAAQ,aAAA,CAAAR,KAAA,CAAAS,QAAA,QAAGJ,cAAc,CAAI;EACzD,oBAAOL,KAAA,CAAAQ,aAAA,CAAAR,KAAA,CAAAS,QAAA,QAAGN,QAAQ,CAAI;AACxB,CAAC;AAED,eAAeF,iBAAiB"}
+{"version":3,"names":["React","StatusComposition","children","error","ErrorComponent","LoadingComponent","loading","createElement","Fragment"],"sources":["StatusComposition.tsx"],"sourcesContent":["import React, { ReactNode } from 'react';\n\ntype Props = {\n  loading?: boolean;\n  LoadingComponent?: ReactNode;\n  error?: boolean;\n  ErrorComponent?: ReactNode;\n  children: React.ReactNode;\n};\nconst StatusComposition = ({ children, error, ErrorComponent, LoadingComponent, loading }: Props) => {\n  if (loading && LoadingComponent) return <>{LoadingComponent}</>;\n  if (error && ErrorComponent) return <>{ErrorComponent}</>;\n  return <>{children}</>;\n};\n\nexport default StatusComposition;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAqB,OAAO;AASxC,MAAMC,iBAAiB,GAAGA,CAAC;EAAEC,QAAQ;EAAEC,KAAK;EAAEC,cAAc;EAAEC,gBAAgB;EAAEC;AAAe,CAAC,KAAK;EACnG,IAAIA,OAAO,IAAID,gBAAgB,EAAE,oBAAOL,KAAA,CAAAO,aAAA,CAAAP,KAAA,CAAAQ,QAAA,QAAGH,gBAAmB,CAAC;EAC/D,IAAIF,KAAK,IAAIC,cAAc,EAAE,oBAAOJ,KAAA,CAAAO,aAAA,CAAAP,KAAA,CAAAQ,QAAA,QAAGJ,cAAiB,CAAC;EACzD,oBAAOJ,KAAA,CAAAO,aAAA,CAAAP,KAAA,CAAAQ,QAAA,QAAGN,QAAW,CAAC;AACxB,CAAC;AAED,eAAeD,iBAAiB","ignoreList":[]}

package/lib/module/components/ThreadChatFlatList/index.js

@@ -1,4 +1,4 @@
-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); }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 import React, { forwardRef, useRef } from 'react';
 import { StyleSheet } from 'react-native';
 import { useUIKitTheme } from '@sendbird/uikit-react-native-foundation';
@@ -6,20 +6,19 @@ import { NOOP, getMessageUniqId, useFreshCallback } from '@sendbird/uikit-utils'
 import FlatListInternal from '../ChatFlatList/FlatListInternal';
 const BOTTOM_DETECT_THRESHOLD = 50;
 const UNREACHABLE_THRESHOLD = Number.MIN_SAFE_INTEGER;
-const ThreadChatFlatList = /*#__PURE__*/forwardRef(function ThreadChatFlatList(_ref, ref) {
-  let {
-    onTopReached,
-    onBottomReached,
-    onScrolledAwayFromBottom,
-    onScroll,
-    ...props
-  } = _ref;
+const ThreadChatFlatList = /*#__PURE__*/forwardRef(function ThreadChatFlatList({
+  onTopReached,
+  onBottomReached,
+  onScrolledAwayFromBottom,
+  onScroll,
+  ...props
+}, ref) {
   const {
     select
   } = useUIKitTheme();
   const contentOffsetY = useRef(0);
   const _onScroll = useFreshCallback(event => {
-    onScroll === null || onScroll === void 0 ? void 0 : onScroll(event);
+    onScroll === null || onScroll === void 0 || onScroll(event);
     const {
       contentOffset,
       contentSize,

package/lib/module/components/ThreadChatFlatList/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","forwardRef","useRef","StyleSheet","useUIKitTheme","NOOP","getMessageUniqId","useFreshCallback","FlatListInternal","BOTTOM_DETECT_THRESHOLD","UNREACHABLE_THRESHOLD","Number","MIN_SAFE_INTEGER","ThreadChatFlatList","_ref","ref","onTopReached","onBottomReached","onScrolledAwayFromBottom","onScroll","props","select","contentOffsetY","_onScroll","event","contentOffset","contentSize","layoutMeasurement","nativeEvent","prevOffsetY","current","currOffsetY","y","bottomDetectThreshold","height","createElement","_extends","bounces","removeClippedSubviews","keyboardDismissMode","keyboardShouldPersistTaps","indicatorStyle","light","dark","onEndReached","onScrollToIndexFailed","onStartReached","scrollEventThrottle","keyExtractor","style","flex","flatten","maintainVisibleContentPosition","minIndexForVisible","autoscrollToTopThreshold"],"sources":["index.tsx"],"sourcesContent":["import React, { forwardRef, useRef } from 'react';\nimport { FlatListProps, FlatList as RNFlatList, StyleSheet } from 'react-native';\n\nimport { useUIKitTheme } from '@sendbird/uikit-react-native-foundation';\nimport { NOOP, SendbirdMessage, getMessageUniqId, useFreshCallback } from '@sendbird/uikit-utils';\n\nimport FlatListInternal from '../ChatFlatList/FlatListInternal';\n\nconst BOTTOM_DETECT_THRESHOLD = 50;\nconst UNREACHABLE_THRESHOLD = Number.MIN_SAFE_INTEGER;\n\ntype Props = Omit<FlatListProps<SendbirdMessage>, 'onEndReached'> & {\n  onBottomReached: () => void;\n  onTopReached: () => void;\n  onScrolledAwayFromBottom: (value: boolean) => void;\n};\nconst ThreadChatFlatList = forwardRef<RNFlatList, Props>(function ThreadChatFlatList(\n  { onTopReached, onBottomReached, onScrolledAwayFromBottom, onScroll, ...props },\n  ref,\n) {\n  const { select } = useUIKitTheme();\n  const contentOffsetY = useRef(0);\n\n  const _onScroll = useFreshCallback<NonNullable<Props['onScroll']>>((event) => {\n    onScroll?.(event);\n\n    const { contentOffset, contentSize, layoutMeasurement } = event.nativeEvent;\n\n    const prevOffsetY = contentOffsetY.current;\n    const currOffsetY = contentOffset.y;\n\n    const bottomDetectThreshold = contentSize.height - layoutMeasurement.height - BOTTOM_DETECT_THRESHOLD;\n    if (bottomDetectThreshold < prevOffsetY && currOffsetY <= bottomDetectThreshold) {\n      onScrolledAwayFromBottom(true);\n    } else if (bottomDetectThreshold < currOffsetY && prevOffsetY <= bottomDetectThreshold) {\n      onScrolledAwayFromBottom(false);\n    }\n\n    contentOffsetY.current = contentOffset.y;\n  });\n\n  return (\n    <FlatListInternal\n      bounces={false}\n      removeClippedSubviews\n      keyboardDismissMode={'on-drag'}\n      keyboardShouldPersistTaps={'handled'}\n      indicatorStyle={select({ light: 'black', dark: 'white' })}\n      {...props}\n      ref={ref}\n      onEndReached={onBottomReached}\n      onScrollToIndexFailed={NOOP}\n      onStartReached={onTopReached}\n      scrollEventThrottle={16}\n      onScroll={_onScroll}\n      keyExtractor={getMessageUniqId}\n      style={{ flex: 1, ...StyleSheet.flatten(props.style) }}\n      maintainVisibleContentPosition={{ minIndexForVisible: 0, autoscrollToTopThreshold: UNREACHABLE_THRESHOLD }}\n    />\n  );\n});\n\nexport default ThreadChatFlatList;\n"],"mappings":";AAAA,OAAOA,KAAK,IAAIC,UAAU,EAAEC,MAAM,QAAQ,OAAO;AACjD,SAAgDC,UAAU,QAAQ,cAAc;AAEhF,SAASC,aAAa,QAAQ,yCAAyC;AACvE,SAASC,IAAI,EAAmBC,gBAAgB,EAAEC,gBAAgB,QAAQ,uBAAuB;AAEjG,OAAOC,gBAAgB,MAAM,kCAAkC;AAE/D,MAAMC,uBAAuB,GAAG,EAAE;AAClC,MAAMC,qBAAqB,GAAGC,MAAM,CAACC,gBAAgB;AAOrD,MAAMC,kBAAkB,gBAAGZ,UAAU,CAAoB,SAASY,kBAAkBA,CAAAC,IAAA,EAElFC,GAAG,EACH;EAAA,IAFA;IAAEC,YAAY;IAAEC,eAAe;IAAEC,wBAAwB;IAAEC,QAAQ;IAAE,GAAGC;EAAM,CAAC,GAAAN,IAAA;EAG/E,MAAM;IAAEO;EAAO,CAAC,GAAGjB,aAAa,EAAE;EAClC,MAAMkB,cAAc,GAAGpB,MAAM,CAAC,CAAC,CAAC;EAEhC,MAAMqB,SAAS,GAAGhB,gBAAgB,CAAkCiB,KAAK,IAAK;IAC5EL,QAAQ,aAARA,QAAQ,uBAARA,QAAQ,CAAGK,KAAK,CAAC;IAEjB,MAAM;MAAEC,aAAa;MAAEC,WAAW;MAAEC;IAAkB,CAAC,GAAGH,KAAK,CAACI,WAAW;IAE3E,MAAMC,WAAW,GAAGP,cAAc,CAACQ,OAAO;IAC1C,MAAMC,WAAW,GAAGN,aAAa,CAACO,CAAC;IAEnC,MAAMC,qBAAqB,GAAGP,WAAW,CAACQ,MAAM,GAAGP,iBAAiB,CAACO,MAAM,GAAGzB,uBAAuB;IACrG,IAAIwB,qBAAqB,GAAGJ,WAAW,IAAIE,WAAW,IAAIE,qBAAqB,EAAE;MAC/Ef,wBAAwB,CAAC,IAAI,CAAC;IAChC,CAAC,MAAM,IAAIe,qBAAqB,GAAGF,WAAW,IAAIF,WAAW,IAAII,qBAAqB,EAAE;MACtFf,wBAAwB,CAAC,KAAK,CAAC;IACjC;IAEAI,cAAc,CAACQ,OAAO,GAAGL,aAAa,CAACO,CAAC;EAC1C,CAAC,CAAC;EAEF,oBACEhC,KAAA,CAAAmC,aAAA,CAAC3B,gBAAgB,EAAA4B,QAAA;IACfC,OAAO,EAAE,KAAM;IACfC,qBAAqB;IACrBC,mBAAmB,EAAE,SAAU;IAC/BC,yBAAyB,EAAE,SAAU;IACrCC,cAAc,EAAEpB,MAAM,CAAC;MAAEqB,KAAK,EAAE,OAAO;MAAEC,IAAI,EAAE;IAAQ,CAAC;EAAE,GACtDvB,KAAK;IACTL,GAAG,EAAEA,GAAI;IACT6B,YAAY,EAAE3B,eAAgB;IAC9B4B,qBAAqB,EAAExC,IAAK;IAC5ByC,cAAc,EAAE9B,YAAa;IAC7B+B,mBAAmB,EAAE,EAAG;IACxB5B,QAAQ,EAAEI,SAAU;IACpByB,YAAY,EAAE1C,gBAAiB;IAC/B2C,KAAK,EAAE;MAAEC,IAAI,EAAE,CAAC;MAAE,GAAG/C,UAAU,CAACgD,OAAO,CAAC/B,KAAK,CAAC6B,KAAK;IAAE,CAAE;IACvDG,8BAA8B,EAAE;MAAEC,kBAAkB,EAAE,CAAC;MAAEC,wBAAwB,EAAE5C;IAAsB;EAAE,GAC3G;AAEN,CAAC,CAAC;AAEF,eAAeG,kBAAkB"}
+{"version":3,"names":["React","forwardRef","useRef","StyleSheet","useUIKitTheme","NOOP","getMessageUniqId","useFreshCallback","FlatListInternal","BOTTOM_DETECT_THRESHOLD","UNREACHABLE_THRESHOLD","Number","MIN_SAFE_INTEGER","ThreadChatFlatList","onTopReached","onBottomReached","onScrolledAwayFromBottom","onScroll","props","ref","select","contentOffsetY","_onScroll","event","contentOffset","contentSize","layoutMeasurement","nativeEvent","prevOffsetY","current","currOffsetY","y","bottomDetectThreshold","height","createElement","_extends","bounces","removeClippedSubviews","keyboardDismissMode","keyboardShouldPersistTaps","indicatorStyle","light","dark","onEndReached","onScrollToIndexFailed","onStartReached","scrollEventThrottle","keyExtractor","style","flex","flatten","maintainVisibleContentPosition","minIndexForVisible","autoscrollToTopThreshold"],"sources":["index.tsx"],"sourcesContent":["import React, { forwardRef, useRef } from 'react';\nimport { FlatListProps, FlatList as RNFlatList, StyleSheet } from 'react-native';\n\nimport { useUIKitTheme } from '@sendbird/uikit-react-native-foundation';\nimport { NOOP, SendbirdMessage, getMessageUniqId, useFreshCallback } from '@sendbird/uikit-utils';\n\nimport FlatListInternal from '../ChatFlatList/FlatListInternal';\n\nconst BOTTOM_DETECT_THRESHOLD = 50;\nconst UNREACHABLE_THRESHOLD = Number.MIN_SAFE_INTEGER;\n\ntype Props = Omit<FlatListProps<SendbirdMessage>, 'onEndReached'> & {\n  onBottomReached: () => void;\n  onTopReached: () => void;\n  onScrolledAwayFromBottom: (value: boolean) => void;\n};\nconst ThreadChatFlatList = forwardRef<RNFlatList, Props>(function ThreadChatFlatList(\n  { onTopReached, onBottomReached, onScrolledAwayFromBottom, onScroll, ...props },\n  ref,\n) {\n  const { select } = useUIKitTheme();\n  const contentOffsetY = useRef(0);\n\n  const _onScroll = useFreshCallback<NonNullable<Props['onScroll']>>((event) => {\n    onScroll?.(event);\n\n    const { contentOffset, contentSize, layoutMeasurement } = event.nativeEvent;\n\n    const prevOffsetY = contentOffsetY.current;\n    const currOffsetY = contentOffset.y;\n\n    const bottomDetectThreshold = contentSize.height - layoutMeasurement.height - BOTTOM_DETECT_THRESHOLD;\n    if (bottomDetectThreshold < prevOffsetY && currOffsetY <= bottomDetectThreshold) {\n      onScrolledAwayFromBottom(true);\n    } else if (bottomDetectThreshold < currOffsetY && prevOffsetY <= bottomDetectThreshold) {\n      onScrolledAwayFromBottom(false);\n    }\n\n    contentOffsetY.current = contentOffset.y;\n  });\n\n  return (\n    <FlatListInternal\n      bounces={false}\n      removeClippedSubviews\n      keyboardDismissMode={'on-drag'}\n      keyboardShouldPersistTaps={'handled'}\n      indicatorStyle={select({ light: 'black', dark: 'white' })}\n      {...props}\n      ref={ref}\n      onEndReached={onBottomReached}\n      onScrollToIndexFailed={NOOP}\n      onStartReached={onTopReached}\n      scrollEventThrottle={16}\n      onScroll={_onScroll}\n      keyExtractor={getMessageUniqId}\n      style={{ flex: 1, ...StyleSheet.flatten(props.style) }}\n      maintainVisibleContentPosition={{ minIndexForVisible: 0, autoscrollToTopThreshold: UNREACHABLE_THRESHOLD }}\n    />\n  );\n});\n\nexport default ThreadChatFlatList;\n"],"mappings":";AAAA,OAAOA,KAAK,IAAIC,UAAU,EAAEC,MAAM,QAAQ,OAAO;AACjD,SAAgDC,UAAU,QAAQ,cAAc;AAEhF,SAASC,aAAa,QAAQ,yCAAyC;AACvE,SAASC,IAAI,EAAmBC,gBAAgB,EAAEC,gBAAgB,QAAQ,uBAAuB;AAEjG,OAAOC,gBAAgB,MAAM,kCAAkC;AAE/D,MAAMC,uBAAuB,GAAG,EAAE;AAClC,MAAMC,qBAAqB,GAAGC,MAAM,CAACC,gBAAgB;AAOrD,MAAMC,kBAAkB,gBAAGZ,UAAU,CAAoB,SAASY,kBAAkBA,CAClF;EAAEC,YAAY;EAAEC,eAAe;EAAEC,wBAAwB;EAAEC,QAAQ;EAAE,GAAGC;AAAM,CAAC,EAC/EC,GAAG,EACH;EACA,MAAM;IAAEC;EAAO,CAAC,GAAGhB,aAAa,CAAC,CAAC;EAClC,MAAMiB,cAAc,GAAGnB,MAAM,CAAC,CAAC,CAAC;EAEhC,MAAMoB,SAAS,GAAGf,gBAAgB,CAAkCgB,KAAK,IAAK;IAC5EN,QAAQ,aAARA,QAAQ,eAARA,QAAQ,CAAGM,KAAK,CAAC;IAEjB,MAAM;MAAEC,aAAa;MAAEC,WAAW;MAAEC;IAAkB,CAAC,GAAGH,KAAK,CAACI,WAAW;IAE3E,MAAMC,WAAW,GAAGP,cAAc,CAACQ,OAAO;IAC1C,MAAMC,WAAW,GAAGN,aAAa,CAACO,CAAC;IAEnC,MAAMC,qBAAqB,GAAGP,WAAW,CAACQ,MAAM,GAAGP,iBAAiB,CAACO,MAAM,GAAGxB,uBAAuB;IACrG,IAAIuB,qBAAqB,GAAGJ,WAAW,IAAIE,WAAW,IAAIE,qBAAqB,EAAE;MAC/EhB,wBAAwB,CAAC,IAAI,CAAC;IAChC,CAAC,MAAM,IAAIgB,qBAAqB,GAAGF,WAAW,IAAIF,WAAW,IAAII,qBAAqB,EAAE;MACtFhB,wBAAwB,CAAC,KAAK,CAAC;IACjC;IAEAK,cAAc,CAACQ,OAAO,GAAGL,aAAa,CAACO,CAAC;EAC1C,CAAC,CAAC;EAEF,oBACE/B,KAAA,CAAAkC,aAAA,CAAC1B,gBAAgB,EAAA2B,QAAA;IACfC,OAAO,EAAE,KAAM;IACfC,qBAAqB;IACrBC,mBAAmB,EAAE,SAAU;IAC/BC,yBAAyB,EAAE,SAAU;IACrCC,cAAc,EAAEpB,MAAM,CAAC;MAAEqB,KAAK,EAAE,OAAO;MAAEC,IAAI,EAAE;IAAQ,CAAC;EAAE,GACtDxB,KAAK;IACTC,GAAG,EAAEA,GAAI;IACTwB,YAAY,EAAE5B,eAAgB;IAC9B6B,qBAAqB,EAAEvC,IAAK;IAC5BwC,cAAc,EAAE/B,YAAa;IAC7BgC,mBAAmB,EAAE,EAAG;IACxB7B,QAAQ,EAAEK,SAAU;IACpByB,YAAY,EAAEzC,gBAAiB;IAC/B0C,KAAK,EAAE;MAAEC,IAAI,EAAE,CAAC;MAAE,GAAG9C,UAAU,CAAC+C,OAAO,CAAChC,KAAK,CAAC8B,KAAK;IAAE,CAAE;IACvDG,8BAA8B,EAAE;MAAEC,kBAAkB,EAAE,CAAC;MAAEC,wBAAwB,EAAE3C;IAAsB;EAAE,EAC5G,CAAC;AAEN,CAAC,CAAC;AAEF,eAAeG,kBAAkB","ignoreList":[]}

package/lib/module/components/ThreadParentMessageRenderer/ThreadParentMessage.file.image.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Box","PressBox","createStyleSheet","ImageWithPlaceholder","getThumbnailUriFromFileMessage","ThreadParentMessageFileImage","props","fileMessage","parentMessage","createElement","style","styles","container","onPress","onLongPress","source","uri","image","borderRadius","overflow","maxWidth","width","height"],"sources":["ThreadParentMessage.file.image.tsx"],"sourcesContent":["import React from 'react';\n\nimport { Box, PressBox, createStyleSheet } from '@sendbird/uikit-react-native-foundation';\nimport { ImageWithPlaceholder } from '@sendbird/uikit-react-native-foundation';\nimport { SendbirdFileMessage, getThumbnailUriFromFileMessage } from '@sendbird/uikit-utils';\n\nimport { ThreadParentMessageRendererProps } from './index';\n\nconst ThreadParentMessageFileImage = (props: ThreadParentMessageRendererProps) => {\n  const fileMessage: SendbirdFileMessage = props.parentMessage as SendbirdFileMessage;\n  if (!fileMessage) return null;\n\n  return (\n    <Box style={styles.container}>\n      <PressBox onPress={props.onPress} onLongPress={props.onLongPress}>\n        <ImageWithPlaceholder source={{ uri: getThumbnailUriFromFileMessage(fileMessage) }} style={styles.image} />\n      </PressBox>\n    </Box>\n  );\n};\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});\n\nexport default ThreadParentMessageFileImage;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,GAAG,EAAEC,QAAQ,EAAEC,gBAAgB,QAAQ,yCAAyC;AACzF,SAASC,oBAAoB,QAAQ,yCAAyC;AAC9E,SAA8BC,8BAA8B,QAAQ,uBAAuB;AAI3F,MAAMC,4BAA4B,GAAIC,KAAuC,IAAK;EAChF,MAAMC,WAAgC,GAAGD,KAAK,CAACE,aAAoC;EACnF,IAAI,CAACD,WAAW,EAAE,OAAO,IAAI;EAE7B,oBACER,KAAA,CAAAU,aAAA,CAACT,GAAG;IAACU,KAAK,EAAEC,MAAM,CAACC;EAAU,gBAC3Bb,KAAA,CAAAU,aAAA,CAACR,QAAQ;IAACY,OAAO,EAAEP,KAAK,CAACO,OAAQ;IAACC,WAAW,EAAER,KAAK,CAACQ;EAAY,gBAC/Df,KAAA,CAAAU,aAAA,CAACN,oBAAoB;IAACY,MAAM,EAAE;MAAEC,GAAG,EAAEZ,8BAA8B,CAACG,WAAW;IAAE,CAAE;IAACG,KAAK,EAAEC,MAAM,CAACM;EAAM,EAAG,CAClG,CACP;AAEV,CAAC;AAED,MAAMN,MAAM,GAAGT,gBAAgB,CAAC;EAC9BU,SAAS,EAAE;IACTM,YAAY,EAAE,EAAE;IAChBC,QAAQ,EAAE;EACZ,CAAC;EACDF,KAAK,EAAE;IACLG,QAAQ,EAAE,GAAG;IACbC,KAAK,EAAE,GAAG;IACVC,MAAM,EAAE,GAAG;IACXJ,YAAY,EAAE,EAAE;IAChBC,QAAQ,EAAE;EACZ;AACF,CAAC,CAAC;AAEF,eAAed,4BAA4B"}
+{"version":3,"names":["React","Box","PressBox","createStyleSheet","ImageWithPlaceholder","getThumbnailUriFromFileMessage","ThreadParentMessageFileImage","props","fileMessage","parentMessage","createElement","style","styles","container","onPress","onLongPress","source","uri","image","borderRadius","overflow","maxWidth","width","height"],"sources":["ThreadParentMessage.file.image.tsx"],"sourcesContent":["import React from 'react';\n\nimport { Box, PressBox, createStyleSheet } from '@sendbird/uikit-react-native-foundation';\nimport { ImageWithPlaceholder } from '@sendbird/uikit-react-native-foundation';\nimport { SendbirdFileMessage, getThumbnailUriFromFileMessage } from '@sendbird/uikit-utils';\n\nimport { ThreadParentMessageRendererProps } from './index';\n\nconst ThreadParentMessageFileImage = (props: ThreadParentMessageRendererProps) => {\n  const fileMessage: SendbirdFileMessage = props.parentMessage as SendbirdFileMessage;\n  if (!fileMessage) return null;\n\n  return (\n    <Box style={styles.container}>\n      <PressBox onPress={props.onPress} onLongPress={props.onLongPress}>\n        <ImageWithPlaceholder source={{ uri: getThumbnailUriFromFileMessage(fileMessage) }} style={styles.image} />\n      </PressBox>\n    </Box>\n  );\n};\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});\n\nexport default ThreadParentMessageFileImage;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,GAAG,EAAEC,QAAQ,EAAEC,gBAAgB,QAAQ,yCAAyC;AACzF,SAASC,oBAAoB,QAAQ,yCAAyC;AAC9E,SAA8BC,8BAA8B,QAAQ,uBAAuB;AAI3F,MAAMC,4BAA4B,GAAIC,KAAuC,IAAK;EAChF,MAAMC,WAAgC,GAAGD,KAAK,CAACE,aAAoC;EACnF,IAAI,CAACD,WAAW,EAAE,OAAO,IAAI;EAE7B,oBACER,KAAA,CAAAU,aAAA,CAACT,GAAG;IAACU,KAAK,EAAEC,MAAM,CAACC;EAAU,gBAC3Bb,KAAA,CAAAU,aAAA,CAACR,QAAQ;IAACY,OAAO,EAAEP,KAAK,CAACO,OAAQ;IAACC,WAAW,EAAER,KAAK,CAACQ;EAAY,gBAC/Df,KAAA,CAAAU,aAAA,CAACN,oBAAoB;IAACY,MAAM,EAAE;MAAEC,GAAG,EAAEZ,8BAA8B,CAACG,WAAW;IAAE,CAAE;IAACG,KAAK,EAAEC,MAAM,CAACM;EAAM,CAAE,CAClG,CACP,CAAC;AAEV,CAAC;AAED,MAAMN,MAAM,GAAGT,gBAAgB,CAAC;EAC9BU,SAAS,EAAE;IACTM,YAAY,EAAE,EAAE;IAChBC,QAAQ,EAAE;EACZ,CAAC;EACDF,KAAK,EAAE;IACLG,QAAQ,EAAE,GAAG;IACbC,KAAK,EAAE,GAAG;IACVC,MAAM,EAAE,GAAG;IACXJ,YAAY,EAAE,EAAE;IAChBC,QAAQ,EAAE;EACZ;AACF,CAAC,CAAC;AAEF,eAAed,4BAA4B","ignoreList":[]}

package/lib/module/components/ThreadParentMessageRenderer/ThreadParentMessage.file.js

@@ -60,7 +60,7 @@ const styles = createStyleSheet({
   },
   name: {
     flexShrink: 1,
-    marginLeft: 8
+    marginStart: 8
   }
 });
 export default ThreadParentMessageFile;

package/lib/module/components/ThreadParentMessageRenderer/ThreadParentMessage.file.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Box","Icon","PressBox","Text","createStyleSheet","useUIKitTheme","getFileExtension","getFileType","truncate","useLocalization","ThreadParentMessageFile","props","fileMessage","parentMessage","STRINGS","select","colors","palette","fileType","type","name","fileName","GROUP_CHANNEL","MESSAGE_BUBBLE_FILE_TITLE","createElement","style","styles","fileBubbleContainer","backgroundColor","light","background100","dark","background400","onPress","onLongPress","iconBackground","File","size","containerStyle","background50","borderRadius","body3","numberOfLines","color","onBackground01","mode","maxLen","alignSelf","overflow","flexDirection","alignItems","paddingHorizontal","paddingVertical","flexShrink","marginLeft"],"sources":["ThreadParentMessage.file.tsx"],"sourcesContent":["import React from 'react';\n\nimport { Box, Icon, PressBox, Text, createStyleSheet } from '@sendbird/uikit-react-native-foundation';\nimport { useUIKitTheme } from '@sendbird/uikit-react-native-foundation';\nimport { SendbirdFileMessage, getFileExtension, getFileType, truncate } from '@sendbird/uikit-utils';\n\nimport { useLocalization } from './../../hooks/useContext';\nimport { ThreadParentMessageRendererProps } from './index';\n\nconst ThreadParentMessageFile = (props: ThreadParentMessageRendererProps) => {\n  const fileMessage: SendbirdFileMessage = props.parentMessage as SendbirdFileMessage;\n  if (!fileMessage) return null;\n\n  const { STRINGS } = useLocalization();\n  const { select, colors, palette } = useUIKitTheme();\n\n  const fileType = getFileType(fileMessage.type || getFileExtension(fileMessage.name));\n  const fileName = STRINGS.GROUP_CHANNEL.MESSAGE_BUBBLE_FILE_TITLE(fileMessage) ?? fileMessage.name;\n\n  return (\n    <Box\n      style={styles.fileBubbleContainer}\n      backgroundColor={select({ light: palette.background100, dark: palette.background400 })}\n    >\n      <PressBox onPress={props.onPress} onLongPress={props.onLongPress}>\n        <Box style={styles.iconBackground}>\n          <Icon.File\n            fileType={fileType}\n            size={24}\n            containerStyle={{ backgroundColor: palette.background50, borderRadius: 8 }}\n          />\n          <Text body3 numberOfLines={1} color={colors.onBackground01} style={styles.name}>\n            {truncate(fileName, { mode: 'mid', maxLen: 30 })}\n          </Text>\n        </Box>\n      </PressBox>\n    </Box>\n  );\n};\n\nconst styles = createStyleSheet({\n  fileBubbleContainer: {\n    alignSelf: 'flex-start',\n    overflow: 'hidden',\n    flexDirection: 'row',\n    alignItems: 'center',\n    borderRadius: 16,\n    paddingHorizontal: 12,\n    paddingVertical: 8,\n  },\n  iconBackground: {\n    flexDirection: 'row',\n    alignItems: 'center',\n  },\n  name: {\n    flexShrink: 1,\n    marginLeft: 8,\n  },\n});\n\nexport default ThreadParentMessageFile;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,GAAG,EAAEC,IAAI,EAAEC,QAAQ,EAAEC,IAAI,EAAEC,gBAAgB,QAAQ,yCAAyC;AACrG,SAASC,aAAa,QAAQ,yCAAyC;AACvE,SAA8BC,gBAAgB,EAAEC,WAAW,EAAEC,QAAQ,QAAQ,uBAAuB;AAEpG,SAASC,eAAe,QAAQ,0BAA0B;AAG1D,MAAMC,uBAAuB,GAAIC,KAAuC,IAAK;EAC3E,MAAMC,WAAgC,GAAGD,KAAK,CAACE,aAAoC;EACnF,IAAI,CAACD,WAAW,EAAE,OAAO,IAAI;EAE7B,MAAM;IAAEE;EAAQ,CAAC,GAAGL,eAAe,EAAE;EACrC,MAAM;IAAEM,MAAM;IAAEC,MAAM;IAAEC;EAAQ,CAAC,GAAGZ,aAAa,EAAE;EAEnD,MAAMa,QAAQ,GAAGX,WAAW,CAACK,WAAW,CAACO,IAAI,IAAIb,gBAAgB,CAACM,WAAW,CAACQ,IAAI,CAAC,CAAC;EACpF,MAAMC,QAAQ,GAAGP,OAAO,CAACQ,aAAa,CAACC,yBAAyB,CAACX,WAAW,CAAC,IAAIA,WAAW,CAACQ,IAAI;EAEjG,oBACErB,KAAA,CAAAyB,aAAA,CAACxB,GAAG;IACFyB,KAAK,EAAEC,MAAM,CAACC,mBAAoB;IAClCC,eAAe,EAAEb,MAAM,CAAC;MAAEc,KAAK,EAAEZ,OAAO,CAACa,aAAa;MAAEC,IAAI,EAAEd,OAAO,CAACe;IAAc,CAAC;EAAE,gBAEvFjC,KAAA,CAAAyB,aAAA,CAACtB,QAAQ;IAAC+B,OAAO,EAAEtB,KAAK,CAACsB,OAAQ;IAACC,WAAW,EAAEvB,KAAK,CAACuB;EAAY,gBAC/DnC,KAAA,CAAAyB,aAAA,CAACxB,GAAG;IAACyB,KAAK,EAAEC,MAAM,CAACS;EAAe,gBAChCpC,KAAA,CAAAyB,aAAA,CAACvB,IAAI,CAACmC,IAAI;IACRlB,QAAQ,EAAEA,QAAS;IACnBmB,IAAI,EAAE,EAAG;IACTC,cAAc,EAAE;MAAEV,eAAe,EAAEX,OAAO,CAACsB,YAAY;MAAEC,YAAY,EAAE;IAAE;EAAE,EAC3E,eACFzC,KAAA,CAAAyB,aAAA,CAACrB,IAAI;IAACsC,KAAK;IAACC,aAAa,EAAE,CAAE;IAACC,KAAK,EAAE3B,MAAM,CAAC4B,cAAe;IAACnB,KAAK,EAAEC,MAAM,CAACN;EAAK,GAC5EZ,QAAQ,CAACa,QAAQ,EAAE;IAAEwB,IAAI,EAAE,KAAK;IAAEC,MAAM,EAAE;EAAG,CAAC,CAAC,CAC3C,CACH,CACG,CACP;AAEV,CAAC;AAED,MAAMpB,MAAM,GAAGtB,gBAAgB,CAAC;EAC9BuB,mBAAmB,EAAE;IACnBoB,SAAS,EAAE,YAAY;IACvBC,QAAQ,EAAE,QAAQ;IAClBC,aAAa,EAAE,KAAK;IACpBC,UAAU,EAAE,QAAQ;IACpBV,YAAY,EAAE,EAAE;IAChBW,iBAAiB,EAAE,EAAE;IACrBC,eAAe,EAAE;EACnB,CAAC;EACDjB,cAAc,EAAE;IACdc,aAAa,EAAE,KAAK;IACpBC,UAAU,EAAE;EACd,CAAC;EACD9B,IAAI,EAAE;IACJiC,UAAU,EAAE,CAAC;IACbC,UAAU,EAAE;EACd;AACF,CAAC,CAAC;AAEF,eAAe5C,uBAAuB"}
+{"version":3,"names":["React","Box","Icon","PressBox","Text","createStyleSheet","useUIKitTheme","getFileExtension","getFileType","truncate","useLocalization","ThreadParentMessageFile","props","fileMessage","parentMessage","STRINGS","select","colors","palette","fileType","type","name","fileName","GROUP_CHANNEL","MESSAGE_BUBBLE_FILE_TITLE","createElement","style","styles","fileBubbleContainer","backgroundColor","light","background100","dark","background400","onPress","onLongPress","iconBackground","File","size","containerStyle","background50","borderRadius","body3","numberOfLines","color","onBackground01","mode","maxLen","alignSelf","overflow","flexDirection","alignItems","paddingHorizontal","paddingVertical","flexShrink","marginStart"],"sources":["ThreadParentMessage.file.tsx"],"sourcesContent":["import React from 'react';\n\nimport { Box, Icon, PressBox, Text, createStyleSheet } from '@sendbird/uikit-react-native-foundation';\nimport { useUIKitTheme } from '@sendbird/uikit-react-native-foundation';\nimport { SendbirdFileMessage, getFileExtension, getFileType, truncate } from '@sendbird/uikit-utils';\n\nimport { useLocalization } from './../../hooks/useContext';\nimport { ThreadParentMessageRendererProps } from './index';\n\nconst ThreadParentMessageFile = (props: ThreadParentMessageRendererProps) => {\n  const fileMessage: SendbirdFileMessage = props.parentMessage as SendbirdFileMessage;\n  if (!fileMessage) return null;\n\n  const { STRINGS } = useLocalization();\n  const { select, colors, palette } = useUIKitTheme();\n\n  const fileType = getFileType(fileMessage.type || getFileExtension(fileMessage.name));\n  const fileName = STRINGS.GROUP_CHANNEL.MESSAGE_BUBBLE_FILE_TITLE(fileMessage) ?? fileMessage.name;\n\n  return (\n    <Box\n      style={styles.fileBubbleContainer}\n      backgroundColor={select({ light: palette.background100, dark: palette.background400 })}\n    >\n      <PressBox onPress={props.onPress} onLongPress={props.onLongPress}>\n        <Box style={styles.iconBackground}>\n          <Icon.File\n            fileType={fileType}\n            size={24}\n            containerStyle={{ backgroundColor: palette.background50, borderRadius: 8 }}\n          />\n          <Text body3 numberOfLines={1} color={colors.onBackground01} style={styles.name}>\n            {truncate(fileName, { mode: 'mid', maxLen: 30 })}\n          </Text>\n        </Box>\n      </PressBox>\n    </Box>\n  );\n};\n\nconst styles = createStyleSheet({\n  fileBubbleContainer: {\n    alignSelf: 'flex-start',\n    overflow: 'hidden',\n    flexDirection: 'row',\n    alignItems: 'center',\n    borderRadius: 16,\n    paddingHorizontal: 12,\n    paddingVertical: 8,\n  },\n  iconBackground: {\n    flexDirection: 'row',\n    alignItems: 'center',\n  },\n  name: {\n    flexShrink: 1,\n    marginStart: 8,\n  },\n});\n\nexport default ThreadParentMessageFile;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,GAAG,EAAEC,IAAI,EAAEC,QAAQ,EAAEC,IAAI,EAAEC,gBAAgB,QAAQ,yCAAyC;AACrG,SAASC,aAAa,QAAQ,yCAAyC;AACvE,SAA8BC,gBAAgB,EAAEC,WAAW,EAAEC,QAAQ,QAAQ,uBAAuB;AAEpG,SAASC,eAAe,QAAQ,0BAA0B;AAG1D,MAAMC,uBAAuB,GAAIC,KAAuC,IAAK;EAC3E,MAAMC,WAAgC,GAAGD,KAAK,CAACE,aAAoC;EACnF,IAAI,CAACD,WAAW,EAAE,OAAO,IAAI;EAE7B,MAAM;IAAEE;EAAQ,CAAC,GAAGL,eAAe,CAAC,CAAC;EACrC,MAAM;IAAEM,MAAM;IAAEC,MAAM;IAAEC;EAAQ,CAAC,GAAGZ,aAAa,CAAC,CAAC;EAEnD,MAAMa,QAAQ,GAAGX,WAAW,CAACK,WAAW,CAACO,IAAI,IAAIb,gBAAgB,CAACM,WAAW,CAACQ,IAAI,CAAC,CAAC;EACpF,MAAMC,QAAQ,GAAGP,OAAO,CAACQ,aAAa,CAACC,yBAAyB,CAACX,WAAW,CAAC,IAAIA,WAAW,CAACQ,IAAI;EAEjG,oBACErB,KAAA,CAAAyB,aAAA,CAACxB,GAAG;IACFyB,KAAK,EAAEC,MAAM,CAACC,mBAAoB;IAClCC,eAAe,EAAEb,MAAM,CAAC;MAAEc,KAAK,EAAEZ,OAAO,CAACa,aAAa;MAAEC,IAAI,EAAEd,OAAO,CAACe;IAAc,CAAC;EAAE,gBAEvFjC,KAAA,CAAAyB,aAAA,CAACtB,QAAQ;IAAC+B,OAAO,EAAEtB,KAAK,CAACsB,OAAQ;IAACC,WAAW,EAAEvB,KAAK,CAACuB;EAAY,gBAC/DnC,KAAA,CAAAyB,aAAA,CAACxB,GAAG;IAACyB,KAAK,EAAEC,MAAM,CAACS;EAAe,gBAChCpC,KAAA,CAAAyB,aAAA,CAACvB,IAAI,CAACmC,IAAI;IACRlB,QAAQ,EAAEA,QAAS;IACnBmB,IAAI,EAAE,EAAG;IACTC,cAAc,EAAE;MAAEV,eAAe,EAAEX,OAAO,CAACsB,YAAY;MAAEC,YAAY,EAAE;IAAE;EAAE,CAC5E,CAAC,eACFzC,KAAA,CAAAyB,aAAA,CAACrB,IAAI;IAACsC,KAAK;IAACC,aAAa,EAAE,CAAE;IAACC,KAAK,EAAE3B,MAAM,CAAC4B,cAAe;IAACnB,KAAK,EAAEC,MAAM,CAACN;EAAK,GAC5EZ,QAAQ,CAACa,QAAQ,EAAE;IAAEwB,IAAI,EAAE,KAAK;IAAEC,MAAM,EAAE;EAAG,CAAC,CAC3C,CACH,CACG,CACP,CAAC;AAEV,CAAC;AAED,MAAMpB,MAAM,GAAGtB,gBAAgB,CAAC;EAC9BuB,mBAAmB,EAAE;IACnBoB,SAAS,EAAE,YAAY;IACvBC,QAAQ,EAAE,QAAQ;IAClBC,aAAa,EAAE,KAAK;IACpBC,UAAU,EAAE,QAAQ;IACpBV,YAAY,EAAE,EAAE;IAChBW,iBAAiB,EAAE,EAAE;IACrBC,eAAe,EAAE;EACnB,CAAC;EACDjB,cAAc,EAAE;IACdc,aAAa,EAAE,KAAK;IACpBC,UAAU,EAAE;EACd,CAAC;EACD9B,IAAI,EAAE;IACJiC,UAAU,EAAE,CAAC;IACbC,WAAW,EAAE;EACf;AACF,CAAC,CAAC;AAEF,eAAe5C,uBAAuB","ignoreList":[]}

package/lib/module/components/ThreadParentMessageRenderer/ThreadParentMessage.file.video.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Box","PressBox","VideoThumbnail","createStyleSheet","getThumbnailUriFromFileMessage","ThreadParentMessageFileVideo","props","fileMessage","parentMessage","uri","createElement","style","styles","container","activeOpacity","onPress","onLongPress","image","source","fetchThumbnailFromVideoSource","borderRadius","overflow","maxWidth","width","height"],"sources":["ThreadParentMessage.file.video.tsx"],"sourcesContent":["import React from 'react';\n\nimport { Box, PressBox, VideoThumbnail, createStyleSheet } from '@sendbird/uikit-react-native-foundation';\nimport { SendbirdFileMessage, getThumbnailUriFromFileMessage } from '@sendbird/uikit-utils';\n\nimport { ThreadParentMessageRendererProps } from './index';\n\ntype Props = ThreadParentMessageRendererProps<{\n  fetchThumbnailFromVideoSource: (uri: string) => Promise<{ path: string } | null>;\n}>;\n\nconst ThreadParentMessageFileVideo = (props: Props) => {\n  const fileMessage: SendbirdFileMessage = props.parentMessage as SendbirdFileMessage;\n  if (!fileMessage) return null;\n\n  const uri = getThumbnailUriFromFileMessage(fileMessage);\n\n  return (\n    <Box style={styles.container}>\n      <PressBox activeOpacity={0.8} onPress={props.onPress} onLongPress={props.onLongPress}>\n        <VideoThumbnail\n          style={styles.image}\n          source={uri}\n          fetchThumbnailFromVideoSource={props.fetchThumbnailFromVideoSource}\n        />\n      </PressBox>\n    </Box>\n  );\n};\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});\n\nexport default ThreadParentMessageFileVideo;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,GAAG,EAAEC,QAAQ,EAAEC,cAAc,EAAEC,gBAAgB,QAAQ,yCAAyC;AACzG,SAA8BC,8BAA8B,QAAQ,uBAAuB;AAQ3F,MAAMC,4BAA4B,GAAIC,KAAY,IAAK;EACrD,MAAMC,WAAgC,GAAGD,KAAK,CAACE,aAAoC;EACnF,IAAI,CAACD,WAAW,EAAE,OAAO,IAAI;EAE7B,MAAME,GAAG,GAAGL,8BAA8B,CAACG,WAAW,CAAC;EAEvD,oBACER,KAAA,CAAAW,aAAA,CAACV,GAAG;IAACW,KAAK,EAAEC,MAAM,CAACC;EAAU,gBAC3Bd,KAAA,CAAAW,aAAA,CAACT,QAAQ;IAACa,aAAa,EAAE,GAAI;IAACC,OAAO,EAAET,KAAK,CAACS,OAAQ;IAACC,WAAW,EAAEV,KAAK,CAACU;EAAY,gBACnFjB,KAAA,CAAAW,aAAA,CAACR,cAAc;IACbS,KAAK,EAAEC,MAAM,CAACK,KAAM;IACpBC,MAAM,EAAET,GAAI;IACZU,6BAA6B,EAAEb,KAAK,CAACa;EAA8B,EACnE,CACO,CACP;AAEV,CAAC;AAED,MAAMP,MAAM,GAAGT,gBAAgB,CAAC;EAC9BU,SAAS,EAAE;IACTO,YAAY,EAAE,EAAE;IAChBC,QAAQ,EAAE;EACZ,CAAC;EACDJ,KAAK,EAAE;IACLK,QAAQ,EAAE,GAAG;IACbC,KAAK,EAAE,GAAG;IACVC,MAAM,EAAE,GAAG;IACXJ,YAAY,EAAE,EAAE;IAChBC,QAAQ,EAAE;EACZ;AACF,CAAC,CAAC;AAEF,eAAehB,4BAA4B"}
+{"version":3,"names":["React","Box","PressBox","VideoThumbnail","createStyleSheet","getThumbnailUriFromFileMessage","ThreadParentMessageFileVideo","props","fileMessage","parentMessage","uri","createElement","style","styles","container","activeOpacity","onPress","onLongPress","image","source","fetchThumbnailFromVideoSource","borderRadius","overflow","maxWidth","width","height"],"sources":["ThreadParentMessage.file.video.tsx"],"sourcesContent":["import React from 'react';\n\nimport { Box, PressBox, VideoThumbnail, createStyleSheet } from '@sendbird/uikit-react-native-foundation';\nimport { SendbirdFileMessage, getThumbnailUriFromFileMessage } from '@sendbird/uikit-utils';\n\nimport { ThreadParentMessageRendererProps } from './index';\n\ntype Props = ThreadParentMessageRendererProps<{\n  fetchThumbnailFromVideoSource: (uri: string) => Promise<{ path: string } | null>;\n}>;\n\nconst ThreadParentMessageFileVideo = (props: Props) => {\n  const fileMessage: SendbirdFileMessage = props.parentMessage as SendbirdFileMessage;\n  if (!fileMessage) return null;\n\n  const uri = getThumbnailUriFromFileMessage(fileMessage);\n\n  return (\n    <Box style={styles.container}>\n      <PressBox activeOpacity={0.8} onPress={props.onPress} onLongPress={props.onLongPress}>\n        <VideoThumbnail\n          style={styles.image}\n          source={uri}\n          fetchThumbnailFromVideoSource={props.fetchThumbnailFromVideoSource}\n        />\n      </PressBox>\n    </Box>\n  );\n};\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});\n\nexport default ThreadParentMessageFileVideo;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,GAAG,EAAEC,QAAQ,EAAEC,cAAc,EAAEC,gBAAgB,QAAQ,yCAAyC;AACzG,SAA8BC,8BAA8B,QAAQ,uBAAuB;AAQ3F,MAAMC,4BAA4B,GAAIC,KAAY,IAAK;EACrD,MAAMC,WAAgC,GAAGD,KAAK,CAACE,aAAoC;EACnF,IAAI,CAACD,WAAW,EAAE,OAAO,IAAI;EAE7B,MAAME,GAAG,GAAGL,8BAA8B,CAACG,WAAW,CAAC;EAEvD,oBACER,KAAA,CAAAW,aAAA,CAACV,GAAG;IAACW,KAAK,EAAEC,MAAM,CAACC;EAAU,gBAC3Bd,KAAA,CAAAW,aAAA,CAACT,QAAQ;IAACa,aAAa,EAAE,GAAI;IAACC,OAAO,EAAET,KAAK,CAACS,OAAQ;IAACC,WAAW,EAAEV,KAAK,CAACU;EAAY,gBACnFjB,KAAA,CAAAW,aAAA,CAACR,cAAc;IACbS,KAAK,EAAEC,MAAM,CAACK,KAAM;IACpBC,MAAM,EAAET,GAAI;IACZU,6BAA6B,EAAEb,KAAK,CAACa;EAA8B,CACpE,CACO,CACP,CAAC;AAEV,CAAC;AAED,MAAMP,MAAM,GAAGT,gBAAgB,CAAC;EAC9BU,SAAS,EAAE;IACTO,YAAY,EAAE,EAAE;IAChBC,QAAQ,EAAE;EACZ,CAAC;EACDJ,KAAK,EAAE;IACLK,QAAQ,EAAE,GAAG;IACbC,KAAK,EAAE,GAAG;IACVC,MAAM,EAAE,GAAG;IACXJ,YAAY,EAAE,EAAE;IAChBC,QAAQ,EAAE;EACZ;AACF,CAAC,CAAC;AAEF,eAAehB,4BAA4B","ignoreList":[]}

package/lib/module/components/ThreadParentMessageRenderer/ThreadParentMessage.file.voice.js

@@ -9,7 +9,8 @@ const ThreadParentMessageFileVoice = props => {
     onToggleVoiceMessage,
     parentMessage,
     durationMetaArrayKey = 'KEY_VOICE_MESSAGE_DURATION',
-    onUnmount
+    onUnmount,
+    initialCurrentTime
   } = props;
   const fileMessage = parentMessage;
   if (!fileMessage) return null;
@@ -19,11 +20,11 @@ const ThreadParentMessageFileVoice = props => {
   const [state, setState] = useState(() => {
     var _meta$value;
     const meta = fileMessage.metaArrays.find(it => it.key === durationMetaArrayKey);
-    const value = meta === null || meta === void 0 ? void 0 : (_meta$value = meta.value) === null || _meta$value === void 0 ? void 0 : _meta$value[0];
+    const value = meta === null || meta === void 0 || (_meta$value = meta.value) === null || _meta$value === void 0 ? void 0 : _meta$value[0];
     const initialDuration = value ? parseInt(value, 10) : 0;
     return {
       status: 'paused',
-      currentTime: 0,
+      currentTime: initialCurrentTime || 0,
       duration: initialDuration
     };
   });
@@ -69,7 +70,7 @@ const ThreadParentMessageFileVoice = props => {
       body3: true,
       style: {
         lineHeight: undefined,
-        marginLeft: 6,
+        marginStart: 6,
         opacity: 0.88
       },
       color: uiColors.enabled.textVoicePlaytime

package/lib/module/components/ThreadParentMessageRenderer/ThreadParentMessage.file.voice.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useEffect","useState","Box","Icon","PressBox","Text","useUIKitTheme","LoadingSpinner","ProgressBar","createStyleSheet","millsToMSS","ThreadParentMessageFileVoice","props","onLongPress","onToggleVoiceMessage","parentMessage","durationMetaArrayKey","onUnmount","fileMessage","colors","state","setState","_meta$value","meta","metaArrays","find","it","key","value","initialDuration","parseInt","status","currentTime","duration","uiColors","ui","groupChannelMessage","remainingTime","createElement","style","styles","container","backgroundColor","enabled","background","onPress","current","total","minWidth","height","trackColor","voiceProgressTrack","overlay","flex","flexDirection","alignItems","justifyContent","paddingHorizontal","size","color","voiceSpinner","containerStyle","voiceActionIconBackground","padding","borderRadius","icon","body3","lineHeight","undefined","marginLeft","opacity","textVoicePlaytime","overflow","maxWidth"],"sources":["ThreadParentMessage.file.voice.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\n\nimport { Box, Icon, PressBox, Text, useUIKitTheme } from '@sendbird/uikit-react-native-foundation';\nimport { LoadingSpinner, ProgressBar } from '@sendbird/uikit-react-native-foundation';\nimport { createStyleSheet } from '@sendbird/uikit-react-native-foundation';\nimport { SendbirdFileMessage, millsToMSS } from '@sendbird/uikit-utils';\n\nimport { ThreadParentMessageRendererProps } from './index';\n\nexport type VoiceFileMessageState = {\n  status: 'preparing' | 'playing' | 'paused';\n  currentTime: number;\n  duration: number;\n};\n\ntype Props = ThreadParentMessageRendererProps<{\n  durationMetaArrayKey?: string;\n  onUnmount: () => void;\n}>;\n\nconst ThreadParentMessageFileVoice = (props: Props) => {\n  const {\n    onLongPress,\n    onToggleVoiceMessage,\n    parentMessage,\n    durationMetaArrayKey = 'KEY_VOICE_MESSAGE_DURATION',\n    onUnmount,\n  } = props;\n\n  const fileMessage: SendbirdFileMessage = parentMessage as SendbirdFileMessage;\n  if (!fileMessage) return null;\n\n  const { colors } = useUIKitTheme();\n\n  const [state, setState] = useState<VoiceFileMessageState>(() => {\n    const meta = fileMessage.metaArrays.find((it) => it.key === durationMetaArrayKey);\n    const value = meta?.value?.[0];\n    const initialDuration = value ? parseInt(value, 10) : 0;\n    return {\n      status: 'paused',\n      currentTime: 0,\n      duration: initialDuration,\n    };\n  });\n\n  useEffect(() => {\n    return () => {\n      onUnmount();\n    };\n  }, []);\n\n  const uiColors = colors.ui.groupChannelMessage['incoming'];\n  const remainingTime = state.duration - state.currentTime;\n\n  return (\n    <Box style={styles.container} backgroundColor={uiColors.enabled.background}>\n      <PressBox onPress={() => onToggleVoiceMessage?.(state, setState)} onLongPress={onLongPress}>\n        <ProgressBar\n          current={state.currentTime}\n          total={state.duration}\n          style={{ minWidth: 136, height: 44 }}\n          trackColor={uiColors.enabled.voiceProgressTrack}\n          overlay={\n            <Box\n              flex={1}\n              flexDirection={'row'}\n              alignItems={'center'}\n              justifyContent={'space-between'}\n              paddingHorizontal={12}\n            >\n              {state.status === 'preparing' ? (\n                <LoadingSpinner size={24} color={uiColors.enabled.voiceSpinner} />\n              ) : (\n                <Icon\n                  size={16}\n                  containerStyle={{\n                    backgroundColor: uiColors.enabled.voiceActionIconBackground,\n                    padding: 6,\n                    borderRadius: 16,\n                  }}\n                  icon={state.status === 'paused' ? 'play' : 'pause'}\n                />\n              )}\n              <Text\n                body3\n                style={{ lineHeight: undefined, marginLeft: 6, opacity: 0.88 }}\n                color={uiColors.enabled.textVoicePlaytime}\n              >\n                {millsToMSS(state.currentTime === 0 ? state.duration : remainingTime)}\n              </Text>\n            </Box>\n          }\n        />\n      </PressBox>\n    </Box>\n  );\n};\n\nconst styles = createStyleSheet({\n  container: {\n    borderRadius: 16,\n    overflow: 'hidden',\n    maxWidth: 136,\n  },\n});\n\nexport default ThreadParentMessageFileVoice;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,SAAS,EAAEC,QAAQ,QAAQ,OAAO;AAElD,SAASC,GAAG,EAAEC,IAAI,EAAEC,QAAQ,EAAEC,IAAI,EAAEC,aAAa,QAAQ,yCAAyC;AAClG,SAASC,cAAc,EAAEC,WAAW,QAAQ,yCAAyC;AACrF,SAASC,gBAAgB,QAAQ,yCAAyC;AAC1E,SAA8BC,UAAU,QAAQ,uBAAuB;AAevE,MAAMC,4BAA4B,GAAIC,KAAY,IAAK;EACrD,MAAM;IACJC,WAAW;IACXC,oBAAoB;IACpBC,aAAa;IACbC,oBAAoB,GAAG,4BAA4B;IACnDC;EACF,CAAC,GAAGL,KAAK;EAET,MAAMM,WAAgC,GAAGH,aAAoC;EAC7E,IAAI,CAACG,WAAW,EAAE,OAAO,IAAI;EAE7B,MAAM;IAAEC;EAAO,CAAC,GAAGb,aAAa,EAAE;EAElC,MAAM,CAACc,KAAK,EAAEC,QAAQ,CAAC,GAAGpB,QAAQ,CAAwB,MAAM;IAAA,IAAAqB,WAAA;IAC9D,MAAMC,IAAI,GAAGL,WAAW,CAACM,UAAU,CAACC,IAAI,CAAEC,EAAE,IAAKA,EAAE,CAACC,GAAG,KAAKX,oBAAoB,CAAC;IACjF,MAAMY,KAAK,GAAGL,IAAI,aAAJA,IAAI,wBAAAD,WAAA,GAAJC,IAAI,CAAEK,KAAK,cAAAN,WAAA,uBAAXA,WAAA,CAAc,CAAC,CAAC;IAC9B,MAAMO,eAAe,GAAGD,KAAK,GAAGE,QAAQ,CAACF,KAAK,EAAE,EAAE,CAAC,GAAG,CAAC;IACvD,OAAO;MACLG,MAAM,EAAE,QAAQ;MAChBC,WAAW,EAAE,CAAC;MACdC,QAAQ,EAAEJ;IACZ,CAAC;EACH,CAAC,CAAC;EAEF7B,SAAS,CAAC,MAAM;IACd,OAAO,MAAM;MACXiB,SAAS,EAAE;IACb,CAAC;EACH,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMiB,QAAQ,GAAGf,MAAM,CAACgB,EAAE,CAACC,mBAAmB,CAAC,UAAU,CAAC;EAC1D,MAAMC,aAAa,GAAGjB,KAAK,CAACa,QAAQ,GAAGb,KAAK,CAACY,WAAW;EAExD,oBACEjC,KAAA,CAAAuC,aAAA,CAACpC,GAAG;IAACqC,KAAK,EAAEC,MAAM,CAACC,SAAU;IAACC,eAAe,EAAER,QAAQ,CAACS,OAAO,CAACC;EAAW,gBACzE7C,KAAA,CAAAuC,aAAA,CAAClC,QAAQ;IAACyC,OAAO,EAAEA,CAAA,KAAM/B,oBAAoB,aAApBA,oBAAoB,uBAApBA,oBAAoB,CAAGM,KAAK,EAAEC,QAAQ,CAAE;IAACR,WAAW,EAAEA;EAAY,gBACzFd,KAAA,CAAAuC,aAAA,CAAC9B,WAAW;IACVsC,OAAO,EAAE1B,KAAK,CAACY,WAAY;IAC3Be,KAAK,EAAE3B,KAAK,CAACa,QAAS;IACtBM,KAAK,EAAE;MAAES,QAAQ,EAAE,GAAG;MAAEC,MAAM,EAAE;IAAG,CAAE;IACrCC,UAAU,EAAEhB,QAAQ,CAACS,OAAO,CAACQ,kBAAmB;IAChDC,OAAO,eACLrD,KAAA,CAAAuC,aAAA,CAACpC,GAAG;MACFmD,IAAI,EAAE,CAAE;MACRC,aAAa,EAAE,KAAM;MACrBC,UAAU,EAAE,QAAS;MACrBC,cAAc,EAAE,eAAgB;MAChCC,iBAAiB,EAAE;IAAG,GAErBrC,KAAK,CAACW,MAAM,KAAK,WAAW,gBAC3BhC,KAAA,CAAAuC,aAAA,CAAC/B,cAAc;MAACmD,IAAI,EAAE,EAAG;MAACC,KAAK,EAAEzB,QAAQ,CAACS,OAAO,CAACiB;IAAa,EAAG,gBAElE7D,KAAA,CAAAuC,aAAA,CAACnC,IAAI;MACHuD,IAAI,EAAE,EAAG;MACTG,cAAc,EAAE;QACdnB,eAAe,EAAER,QAAQ,CAACS,OAAO,CAACmB,yBAAyB;QAC3DC,OAAO,EAAE,CAAC;QACVC,YAAY,EAAE;MAChB,CAAE;MACFC,IAAI,EAAE7C,KAAK,CAACW,MAAM,KAAK,QAAQ,GAAG,MAAM,GAAG;IAAQ,EAEtD,eACDhC,KAAA,CAAAuC,aAAA,CAACjC,IAAI;MACH6D,KAAK;MACL3B,KAAK,EAAE;QAAE4B,UAAU,EAAEC,SAAS;QAAEC,UAAU,EAAE,CAAC;QAAEC,OAAO,EAAE;MAAK,CAAE;MAC/DX,KAAK,EAAEzB,QAAQ,CAACS,OAAO,CAAC4B;IAAkB,GAEzC7D,UAAU,CAACU,KAAK,CAACY,WAAW,KAAK,CAAC,GAAGZ,KAAK,CAACa,QAAQ,GAAGI,aAAa,CAAC,CAChE;EAEV,EACD,CACO,CACP;AAEV,CAAC;AAED,MAAMG,MAAM,GAAG/B,gBAAgB,CAAC;EAC9BgC,SAAS,EAAE;IACTuB,YAAY,EAAE,EAAE;IAChBQ,QAAQ,EAAE,QAAQ;IAClBC,QAAQ,EAAE;EACZ;AACF,CAAC,CAAC;AAEF,eAAe9D,4BAA4B"}
+{"version":3,"names":["React","useEffect","useState","Box","Icon","PressBox","Text","useUIKitTheme","LoadingSpinner","ProgressBar","createStyleSheet","millsToMSS","ThreadParentMessageFileVoice","props","onLongPress","onToggleVoiceMessage","parentMessage","durationMetaArrayKey","onUnmount","initialCurrentTime","fileMessage","colors","state","setState","_meta$value","meta","metaArrays","find","it","key","value","initialDuration","parseInt","status","currentTime","duration","uiColors","ui","groupChannelMessage","remainingTime","createElement","style","styles","container","backgroundColor","enabled","background","onPress","current","total","minWidth","height","trackColor","voiceProgressTrack","overlay","flex","flexDirection","alignItems","justifyContent","paddingHorizontal","size","color","voiceSpinner","containerStyle","voiceActionIconBackground","padding","borderRadius","icon","body3","lineHeight","undefined","marginStart","opacity","textVoicePlaytime","overflow","maxWidth"],"sources":["ThreadParentMessage.file.voice.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\n\nimport { Box, Icon, PressBox, Text, useUIKitTheme } from '@sendbird/uikit-react-native-foundation';\nimport { LoadingSpinner, ProgressBar } from '@sendbird/uikit-react-native-foundation';\nimport { createStyleSheet } from '@sendbird/uikit-react-native-foundation';\nimport { SendbirdFileMessage, millsToMSS } from '@sendbird/uikit-utils';\n\nimport { ThreadParentMessageRendererProps } from './index';\n\nexport type VoiceFileMessageState = {\n  status: 'preparing' | 'playing' | 'paused';\n  currentTime: number;\n  duration: number;\n};\n\ntype Props = ThreadParentMessageRendererProps<{\n  durationMetaArrayKey?: string;\n  onUnmount: () => void;\n  initialCurrentTime?: number;\n}>;\n\nconst ThreadParentMessageFileVoice = (props: Props) => {\n  const {\n    onLongPress,\n    onToggleVoiceMessage,\n    parentMessage,\n    durationMetaArrayKey = 'KEY_VOICE_MESSAGE_DURATION',\n    onUnmount,\n    initialCurrentTime,\n  } = props;\n\n  const fileMessage: SendbirdFileMessage = parentMessage as SendbirdFileMessage;\n  if (!fileMessage) return null;\n\n  const { colors } = useUIKitTheme();\n\n  const [state, setState] = useState<VoiceFileMessageState>(() => {\n    const meta = fileMessage.metaArrays.find((it) => it.key === durationMetaArrayKey);\n    const value = meta?.value?.[0];\n    const initialDuration = value ? parseInt(value, 10) : 0;\n    return {\n      status: 'paused',\n      currentTime: initialCurrentTime || 0,\n      duration: initialDuration,\n    };\n  });\n\n  useEffect(() => {\n    return () => {\n      onUnmount();\n    };\n  }, []);\n\n  const uiColors = colors.ui.groupChannelMessage['incoming'];\n  const remainingTime = state.duration - state.currentTime;\n\n  return (\n    <Box style={styles.container} backgroundColor={uiColors.enabled.background}>\n      <PressBox onPress={() => onToggleVoiceMessage?.(state, setState)} onLongPress={onLongPress}>\n        <ProgressBar\n          current={state.currentTime}\n          total={state.duration}\n          style={{ minWidth: 136, height: 44 }}\n          trackColor={uiColors.enabled.voiceProgressTrack}\n          overlay={\n            <Box\n              flex={1}\n              flexDirection={'row'}\n              alignItems={'center'}\n              justifyContent={'space-between'}\n              paddingHorizontal={12}\n            >\n              {state.status === 'preparing' ? (\n                <LoadingSpinner size={24} color={uiColors.enabled.voiceSpinner} />\n              ) : (\n                <Icon\n                  size={16}\n                  containerStyle={{\n                    backgroundColor: uiColors.enabled.voiceActionIconBackground,\n                    padding: 6,\n                    borderRadius: 16,\n                  }}\n                  icon={state.status === 'paused' ? 'play' : 'pause'}\n                />\n              )}\n              <Text\n                body3\n                style={{ lineHeight: undefined, marginStart: 6, opacity: 0.88 }}\n                color={uiColors.enabled.textVoicePlaytime}\n              >\n                {millsToMSS(state.currentTime === 0 ? state.duration : remainingTime)}\n              </Text>\n            </Box>\n          }\n        />\n      </PressBox>\n    </Box>\n  );\n};\n\nconst styles = createStyleSheet({\n  container: {\n    borderRadius: 16,\n    overflow: 'hidden',\n    maxWidth: 136,\n  },\n});\n\nexport default ThreadParentMessageFileVoice;\n"],"mappings":"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","ignoreList":[]}

package/lib/module/components/ThreadParentMessageRenderer/ThreadParentMessage.user.js

@@ -1,6 +1,6 @@
-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); }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 import React from 'react';
-import { Text, useUIKitTheme } from '@sendbird/uikit-react-native-foundation';
+import { Box, Text, useUIKitTheme } from '@sendbird/uikit-react-native-foundation';
 import { RegexText, createStyleSheet } from '@sendbird/uikit-react-native-foundation';
 import { urlRegexStrict } from '@sendbird/uikit-utils';
 const ThreadParentMessageUser = props => {
@@ -10,22 +10,29 @@ const ThreadParentMessageUser = props => {
   const {
     colors
   } = useUIKitTheme();
-  return /*#__PURE__*/React.createElement(Text, {
+  return /*#__PURE__*/React.createElement(Box, {
+    flex: 1,
+    alignItems: 'flex-start'
+  }, /*#__PURE__*/React.createElement(Text, {
     body3: true,
     color: colors.onBackground01,
-    suppressHighlighting: true
+    suppressHighlighting: true,
+    supportRTLAlign: true,
+    originalText: userMessage.message
   }, /*#__PURE__*/React.createElement(RegexText, {
     body3: true,
+    suppressHighlighting: true,
+    supportRTLAlign: true,
+    originalText: userMessage.message,
     color: colors.onBackground01,
     patterns: [...(props.regexTextPatterns ?? []), {
       regex: urlRegexStrict,
-      replacer(_ref) {
-        let {
-          match,
-          parentProps,
-          keyPrefix,
-          index
-        } = _ref;
+      replacer({
+        match,
+        parentProps,
+        keyPrefix,
+        index
+      }) {
         return /*#__PURE__*/React.createElement(Text, _extends({}, parentProps, {
           key: `${keyPrefix}-${index}`,
           onPress: () => {
@@ -39,7 +46,7 @@ const ThreadParentMessageUser = props => {
   }, (_props$renderRegexTex = props.renderRegexTextChildren) === null || _props$renderRegexTex === void 0 ? void 0 : _props$renderRegexTex.call(props, userMessage)), Boolean(userMessage.updatedAt) && /*#__PURE__*/React.createElement(Text, {
     body3: true,
     color: colors.onBackground02
-  }, ' (edited)'));
+  }, ' (edited)')));
 };
 const styles = createStyleSheet({
   bubble: {

package/lib/module/components/ThreadParentMessageRenderer/ThreadParentMessage.user.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Text","useUIKitTheme","RegexText","createStyleSheet","urlRegexStrict","ThreadParentMessageUser","props","_props$renderRegexTex","userMessage","parentMessage","colors","createElement","body3","color","onBackground01","suppressHighlighting","patterns","regexTextPatterns","regex","replacer","_ref","match","parentProps","keyPrefix","index","_extends","key","onPress","_props$onPressURL","onPressURL","call","style","styles","urlText","renderRegexTextChildren","Boolean","updatedAt","onBackground02","bubble","paddingHorizontal","paddingVertical","textDecorationLine"],"sources":["ThreadParentMessage.user.tsx"],"sourcesContent":["import React from 'react';\n\nimport { type RegexTextPattern, Text, useUIKitTheme } from '@sendbird/uikit-react-native-foundation';\nimport { RegexText, createStyleSheet } from '@sendbird/uikit-react-native-foundation';\nimport { SendbirdUserMessage, urlRegexStrict } from '@sendbird/uikit-utils';\n\nimport { ThreadParentMessageRendererProps } from './index';\n\ntype Props = ThreadParentMessageRendererProps<{\n  regexTextPatterns?: RegexTextPattern[];\n  renderRegexTextChildren?: (message: SendbirdUserMessage) => string;\n}>;\n\nconst ThreadParentMessageUser = (props: Props) => {\n  const userMessage: SendbirdUserMessage = props.parentMessage as SendbirdUserMessage;\n  if (!userMessage) return null;\n\n  const { colors } = useUIKitTheme();\n\n  return (\n    <Text body3 color={colors.onBackground01} suppressHighlighting>\n      <RegexText\n        body3\n        color={colors.onBackground01}\n        patterns={[\n          ...(props.regexTextPatterns ?? []),\n          {\n            regex: urlRegexStrict,\n            replacer({ match, parentProps, keyPrefix, index }) {\n              return (\n                <Text\n                  {...parentProps}\n                  key={`${keyPrefix}-${index}`}\n                  onPress={() => props.onPressURL?.(match)}\n                  style={[parentProps?.style, styles.urlText]}\n                >\n                  {match}\n                </Text>\n              );\n            },\n          },\n        ]}\n      >\n        {props.renderRegexTextChildren?.(userMessage)}\n      </RegexText>\n      {Boolean(userMessage.updatedAt) && (\n        <Text body3 color={colors.onBackground02}>\n          {' (edited)'}\n        </Text>\n      )}\n    </Text>\n  );\n};\n\nconst styles = createStyleSheet({\n  bubble: {\n    paddingHorizontal: 12,\n    paddingVertical: 6,\n  },\n  urlText: {\n    textDecorationLine: 'underline',\n  },\n});\n\nexport default ThreadParentMessageUser;\n"],"mappings":";AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAAgCC,IAAI,EAAEC,aAAa,QAAQ,yCAAyC;AACpG,SAASC,SAAS,EAAEC,gBAAgB,QAAQ,yCAAyC;AACrF,SAA8BC,cAAc,QAAQ,uBAAuB;AAS3E,MAAMC,uBAAuB,GAAIC,KAAY,IAAK;EAAA,IAAAC,qBAAA;EAChD,MAAMC,WAAgC,GAAGF,KAAK,CAACG,aAAoC;EACnF,IAAI,CAACD,WAAW,EAAE,OAAO,IAAI;EAE7B,MAAM;IAAEE;EAAO,CAAC,GAAGT,aAAa,EAAE;EAElC,oBACEF,KAAA,CAAAY,aAAA,CAACX,IAAI;IAACY,KAAK;IAACC,KAAK,EAAEH,MAAM,CAACI,cAAe;IAACC,oBAAoB;EAAA,gBAC5DhB,KAAA,CAAAY,aAAA,CAACT,SAAS;IACRU,KAAK;IACLC,KAAK,EAAEH,MAAM,CAACI,cAAe;IAC7BE,QAAQ,EAAE,CACR,IAAIV,KAAK,CAACW,iBAAiB,IAAI,EAAE,CAAC,EAClC;MACEC,KAAK,EAAEd,cAAc;MACrBe,QAAQA,CAAAC,IAAA,EAA2C;QAAA,IAA1C;UAAEC,KAAK;UAAEC,WAAW;UAAEC,SAAS;UAAEC;QAAM,CAAC,GAAAJ,IAAA;QAC/C,oBACErB,KAAA,CAAAY,aAAA,CAACX,IAAI,EAAAyB,QAAA,KACCH,WAAW;UACfI,GAAG,EAAG,GAAEH,SAAU,IAAGC,KAAM,EAAE;UAC7BG,OAAO,EAAEA,CAAA;YAAA,IAAAC,iBAAA;YAAA,QAAAA,iBAAA,GAAMtB,KAAK,CAACuB,UAAU,cAAAD,iBAAA,uBAAhBA,iBAAA,CAAAE,IAAA,CAAAxB,KAAK,EAAce,KAAK,CAAC;UAAA,CAAC;UACzCU,KAAK,EAAE,CAACT,WAAW,aAAXA,WAAW,uBAAXA,WAAW,CAAES,KAAK,EAAEC,MAAM,CAACC,OAAO;QAAE,IAE3CZ,KAAK,CACD;MAEX;IACF,CAAC;EACD,IAAAd,qBAAA,GAEDD,KAAK,CAAC4B,uBAAuB,cAAA3B,qBAAA,uBAA7BA,qBAAA,CAAAuB,IAAA,CAAAxB,KAAK,EAA2BE,WAAW,CAAC,CACnC,EACX2B,OAAO,CAAC3B,WAAW,CAAC4B,SAAS,CAAC,iBAC7BrC,KAAA,CAAAY,aAAA,CAACX,IAAI;IAACY,KAAK;IAACC,KAAK,EAAEH,MAAM,CAAC2B;EAAe,GACtC,WAAW,CAEf,CACI;AAEX,CAAC;AAED,MAAML,MAAM,GAAG7B,gBAAgB,CAAC;EAC9BmC,MAAM,EAAE;IACNC,iBAAiB,EAAE,EAAE;IACrBC,eAAe,EAAE;EACnB,CAAC;EACDP,OAAO,EAAE;IACPQ,kBAAkB,EAAE;EACtB;AACF,CAAC,CAAC;AAEF,eAAepC,uBAAuB"}
+{"version":3,"names":["React","Box","Text","useUIKitTheme","RegexText","createStyleSheet","urlRegexStrict","ThreadParentMessageUser","props","_props$renderRegexTex","userMessage","parentMessage","colors","createElement","flex","alignItems","body3","color","onBackground01","suppressHighlighting","supportRTLAlign","originalText","message","patterns","regexTextPatterns","regex","replacer","match","parentProps","keyPrefix","index","_extends","key","onPress","_props$onPressURL","onPressURL","call","style","styles","urlText","renderRegexTextChildren","Boolean","updatedAt","onBackground02","bubble","paddingHorizontal","paddingVertical","textDecorationLine"],"sources":["ThreadParentMessage.user.tsx"],"sourcesContent":["import React from 'react';\n\nimport { Box, type RegexTextPattern, Text, useUIKitTheme } from '@sendbird/uikit-react-native-foundation';\nimport { RegexText, createStyleSheet } from '@sendbird/uikit-react-native-foundation';\nimport { SendbirdUserMessage, urlRegexStrict } from '@sendbird/uikit-utils';\n\nimport { ThreadParentMessageRendererProps } from './index';\n\ntype Props = ThreadParentMessageRendererProps<{\n  regexTextPatterns?: RegexTextPattern[];\n  renderRegexTextChildren?: (message: SendbirdUserMessage) => string;\n}>;\n\nconst ThreadParentMessageUser = (props: Props) => {\n  const userMessage: SendbirdUserMessage = props.parentMessage as SendbirdUserMessage;\n  if (!userMessage) return null;\n\n  const { colors } = useUIKitTheme();\n\n  return (\n    <Box flex={1} alignItems={'flex-start'}>\n      <Text body3 color={colors.onBackground01} suppressHighlighting supportRTLAlign originalText={userMessage.message}>\n        <RegexText\n          body3\n          suppressHighlighting\n          supportRTLAlign\n          originalText={userMessage.message}\n          color={colors.onBackground01}\n          patterns={[\n            ...(props.regexTextPatterns ?? []),\n            {\n              regex: urlRegexStrict,\n              replacer({ match, parentProps, keyPrefix, index }) {\n                return (\n                  <Text\n                    {...parentProps}\n                    key={`${keyPrefix}-${index}`}\n                    onPress={() => props.onPressURL?.(match)}\n                    style={[parentProps?.style, styles.urlText]}\n                  >\n                    {match}\n                  </Text>\n                );\n              },\n            },\n          ]}\n        >\n          {props.renderRegexTextChildren?.(userMessage)}\n        </RegexText>\n        {Boolean(userMessage.updatedAt) && (\n          <Text body3 color={colors.onBackground02}>\n            {/*FIXME: edited to string set*/}\n            {' (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});\n\nexport default ThreadParentMessageUser;\n"],"mappings":";AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,GAAG,EAAyBC,IAAI,EAAEC,aAAa,QAAQ,yCAAyC;AACzG,SAASC,SAAS,EAAEC,gBAAgB,QAAQ,yCAAyC;AACrF,SAA8BC,cAAc,QAAQ,uBAAuB;AAS3E,MAAMC,uBAAuB,GAAIC,KAAY,IAAK;EAAA,IAAAC,qBAAA;EAChD,MAAMC,WAAgC,GAAGF,KAAK,CAACG,aAAoC;EACnF,IAAI,CAACD,WAAW,EAAE,OAAO,IAAI;EAE7B,MAAM;IAAEE;EAAO,CAAC,GAAGT,aAAa,CAAC,CAAC;EAElC,oBACEH,KAAA,CAAAa,aAAA,CAACZ,GAAG;IAACa,IAAI,EAAE,CAAE;IAACC,UAAU,EAAE;EAAa,gBACrCf,KAAA,CAAAa,aAAA,CAACX,IAAI;IAACc,KAAK;IAACC,KAAK,EAAEL,MAAM,CAACM,cAAe;IAACC,oBAAoB;IAACC,eAAe;IAACC,YAAY,EAAEX,WAAW,CAACY;EAAQ,gBAC/GtB,KAAA,CAAAa,aAAA,CAACT,SAAS;IACRY,KAAK;IACLG,oBAAoB;IACpBC,eAAe;IACfC,YAAY,EAAEX,WAAW,CAACY,OAAQ;IAClCL,KAAK,EAAEL,MAAM,CAACM,cAAe;IAC7BK,QAAQ,EAAE,CACR,IAAIf,KAAK,CAACgB,iBAAiB,IAAI,EAAE,CAAC,EAClC;MACEC,KAAK,EAAEnB,cAAc;MACrBoB,QAAQA,CAAC;QAAEC,KAAK;QAAEC,WAAW;QAAEC,SAAS;QAAEC;MAAM,CAAC,EAAE;QACjD,oBACE9B,KAAA,CAAAa,aAAA,CAACX,IAAI,EAAA6B,QAAA,KACCH,WAAW;UACfI,GAAG,EAAE,GAAGH,SAAS,IAAIC,KAAK,EAAG;UAC7BG,OAAO,EAAEA,CAAA;YAAA,IAAAC,iBAAA;YAAA,QAAAA,iBAAA,GAAM1B,KAAK,CAAC2B,UAAU,cAAAD,iBAAA,uBAAhBA,iBAAA,CAAAE,IAAA,CAAA5B,KAAK,EAAcmB,KAAK,CAAC;UAAA,CAAC;UACzCU,KAAK,EAAE,CAACT,WAAW,aAAXA,WAAW,uBAAXA,WAAW,CAAES,KAAK,EAAEC,MAAM,CAACC,OAAO;QAAE,IAE3CZ,KACG,CAAC;MAEX;IACF,CAAC;EACD,IAAAlB,qBAAA,GAEDD,KAAK,CAACgC,uBAAuB,cAAA/B,qBAAA,uBAA7BA,qBAAA,CAAA2B,IAAA,CAAA5B,KAAK,EAA2BE,WAAW,CACnC,CAAC,EACX+B,OAAO,CAAC/B,WAAW,CAACgC,SAAS,CAAC,iBAC7B1C,KAAA,CAAAa,aAAA,CAACX,IAAI;IAACc,KAAK;IAACC,KAAK,EAAEL,MAAM,CAAC+B;EAAe,GAEtC,WACG,CAEJ,CACH,CAAC;AAEV,CAAC;AAED,MAAML,MAAM,GAAGjC,gBAAgB,CAAC;EAC9BuC,MAAM,EAAE;IACNC,iBAAiB,EAAE,EAAE;IACrBC,eAAe,EAAE;EACnB,CAAC;EACDP,OAAO,EAAE;IACPQ,kBAAkB,EAAE;EACtB;AACF,CAAC,CAAC;AAEF,eAAexC,uBAAuB","ignoreList":[]}

package/lib/module/components/ThreadParentMessageRenderer/ThreadParentMessage.user.og.js

@@ -1,4 +1,4 @@
-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); }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 import React from 'react';
 import { Box, ImageWithPlaceholder, PressBox, RegexText, Text, createStyleSheet, useUIKitTheme } from '@sendbird/uikit-react-native-foundation';
 import { urlRegexStrict, useFreshCallback } from '@sendbird/uikit-utils';
@@ -20,25 +20,32 @@ const ThreadParentMessageUserOg = props => {
     var _userMessage$ogMetaDa, _props$onPressURL;
     typeof ((_userMessage$ogMetaDa = userMessage.ogMetaData) === null || _userMessage$ogMetaDa === void 0 ? void 0 : _userMessage$ogMetaDa.url) === 'string' && ((_props$onPressURL = props.onPressURL) === null || _props$onPressURL === void 0 ? void 0 : _props$onPressURL.call(props, userMessage.ogMetaData.url));
   });
-  return /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement(PressBox, {
+  return /*#__PURE__*/React.createElement(Box, {
+    flex: 1,
+    alignItems: 'flex-start'
+  }, /*#__PURE__*/React.createElement(PressBox, {
     activeOpacity: 0.85,
     onPress: onPressMessage(userMessage)
   }, /*#__PURE__*/React.createElement(Text, {
     body3: true,
-    color: colors.onBackground01,
-    suppressHighlighting: true
+    suppressHighlighting: true,
+    supportRTLAlign: true,
+    originalText: userMessage.message,
+    color: colors.onBackground01
   }, /*#__PURE__*/React.createElement(RegexText, {
     body3: true,
+    suppressHighlighting: true,
+    supportRTLAlign: true,
+    originalText: userMessage.message,
     color: colors.onBackground01,
     patterns: [...(props.regexTextPatterns ?? []), {
       regex: urlRegexStrict,
-      replacer(_ref) {
-        let {
-          match,
-          parentProps,
-          keyPrefix,
-          index
-        } = _ref;
+      replacer({
+        match,
+        parentProps,
+        keyPrefix,
+        index
+      }) {
         return /*#__PURE__*/React.createElement(Text, _extends({}, parentProps, {
           key: `${keyPrefix}-${index}`,
           onPress: () => {
@@ -92,14 +99,14 @@ const styles = createStyleSheet({
     paddingTop: 8,
     paddingBottom: 12,
     maxWidth: 240,
-    borderBottomLeftRadius: 16,
-    borderBottomRightRadius: 16
+    borderBottomStartRadius: 16,
+    borderBottomEndRadius: 16
   },
   ogImage: {
     width: 240,
     height: 136,
-    borderTopLeftRadius: 16,
-    borderTopRightRadius: 16
+    borderTopStartRadius: 16,
+    borderTopEndRadius: 16
   },
   ogUrl: {
     marginBottom: 4

package/lib/module/components/ThreadParentMessageRenderer/ThreadParentMessage.user.og.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Box","ImageWithPlaceholder","PressBox","RegexText","Text","createStyleSheet","useUIKitTheme","urlRegexStrict","useFreshCallback","useSendbirdChat","ThreadParentMessageUserOg","props","_props$renderRegexTex","userMessage","parentMessage","sbOptions","select","colors","palette","enableOgtag","uikitWithAppInfo","groupChannel","channel","onPressMessage","_userMessage$ogMetaDa","_props$onPressURL","ogMetaData","url","onPressURL","call","createElement","activeOpacity","onPress","body3","color","onBackground01","suppressHighlighting","patterns","regexTextPatterns","regex","replacer","_ref","match","parentProps","keyPrefix","index","_extends","key","_props$onPressURL2","style","styles","urlText","renderRegexTextChildren","Boolean","updatedAt","onBackground02","container","defaultImage","ogImage","source","uri","ogContainer","backgroundColor","dark","background400","light","background100","numberOfLines","body2","ogTitle","title","description","caption2","ogDesc","borderRadius","overflow","paddingHorizontal","paddingTop","paddingBottom","maxWidth","borderBottomLeftRadius","borderBottomRightRadius","width","height","borderTopLeftRadius","borderTopRightRadius","ogUrl","marginBottom","lineHeight","textDecorationLine"],"sources":["ThreadParentMessage.user.og.tsx"],"sourcesContent":["import React from 'react';\n\nimport {\n  Box,\n  ImageWithPlaceholder,\n  PressBox,\n  RegexText,\n  type RegexTextPattern,\n  Text,\n  createStyleSheet,\n  useUIKitTheme,\n} from '@sendbird/uikit-react-native-foundation';\nimport { SendbirdUserMessage, urlRegexStrict, useFreshCallback } from '@sendbird/uikit-utils';\n\nimport { useSendbirdChat } from './../../hooks/useContext';\nimport { ThreadParentMessageRendererProps } from './index';\n\ntype Props = ThreadParentMessageRendererProps<{\n  regexTextPatterns?: RegexTextPattern[];\n  renderRegexTextChildren?: (message: SendbirdUserMessage) => string;\n}>;\n\nconst ThreadParentMessageUserOg = (props: Props) => {\n  const userMessage: SendbirdUserMessage = props.parentMessage as SendbirdUserMessage;\n  if (!userMessage) return null;\n\n  const { sbOptions } = useSendbirdChat();\n  const { select, colors, palette } = useUIKitTheme();\n  const enableOgtag = sbOptions.uikitWithAppInfo.groupChannel.channel.enableOgtag;\n  const onPressMessage = (userMessage: SendbirdUserMessage) =>\n    useFreshCallback(() => {\n      typeof userMessage.ogMetaData?.url === 'string' && props.onPressURL?.(userMessage.ogMetaData.url);\n    });\n\n  return (\n    <Box>\n      <PressBox activeOpacity={0.85} onPress={onPressMessage(userMessage)}>\n        <Text body3 color={colors.onBackground01} suppressHighlighting>\n          <RegexText\n            body3\n            color={colors.onBackground01}\n            patterns={[\n              ...(props.regexTextPatterns ?? []),\n              {\n                regex: urlRegexStrict,\n                replacer({ match, parentProps, keyPrefix, index }) {\n                  return (\n                    <Text\n                      {...parentProps}\n                      key={`${keyPrefix}-${index}`}\n                      onPress={() => props.onPressURL?.(match)}\n                      style={[parentProps?.style, styles.urlText]}\n                    >\n                      {match}\n                    </Text>\n                  );\n                },\n              },\n            ]}\n          >\n            {props.renderRegexTextChildren?.(userMessage)}\n          </RegexText>\n          {Boolean(userMessage.updatedAt) && (\n            <Text body3 color={colors.onBackground02}>\n              {' (edited)'}\n            </Text>\n          )}\n        </Text>\n      </PressBox>\n      {userMessage.ogMetaData && enableOgtag && (\n        <PressBox onPress={onPressMessage(userMessage)} style={styles.container}>\n          <Box>\n            {!!userMessage.ogMetaData.defaultImage && (\n              <ImageWithPlaceholder style={styles.ogImage} source={{ uri: userMessage.ogMetaData.defaultImage.url }} />\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                {userMessage.ogMetaData.title}\n              </Text>\n              {!!userMessage.ogMetaData.description && (\n                <Text numberOfLines={1} caption2 color={colors.onBackground01} style={styles.ogDesc}>\n                  {userMessage.ogMetaData.description}\n                </Text>\n              )}\n              <Text numberOfLines={1} caption2 color={colors.onBackground02}>\n                {userMessage.ogMetaData.url}\n              </Text>\n            </Box>\n          </Box>\n        </PressBox>\n      )}\n    </Box>\n  );\n};\n\nconst styles = createStyleSheet({\n  container: {\n    borderRadius: 16,\n    overflow: 'hidden',\n  },\n  ogContainer: {\n    paddingHorizontal: 12,\n    paddingTop: 8,\n    paddingBottom: 12,\n    maxWidth: 240,\n    borderBottomLeftRadius: 16,\n    borderBottomRightRadius: 16,\n  },\n  ogImage: {\n    width: 240,\n    height: 136,\n    borderTopLeftRadius: 16,\n    borderTopRightRadius: 16,\n  },\n  ogUrl: {\n    marginBottom: 4,\n  },\n  ogTitle: {\n    marginBottom: 4,\n  },\n  ogDesc: {\n    lineHeight: 14,\n    marginBottom: 8,\n  },\n  urlText: {\n    textDecorationLine: 'underline',\n  },\n});\n\nexport default ThreadParentMessageUserOg;\n"],"mappings":"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"}
+{"version":3,"names":["React","Box","ImageWithPlaceholder","PressBox","RegexText","Text","createStyleSheet","useUIKitTheme","urlRegexStrict","useFreshCallback","useSendbirdChat","ThreadParentMessageUserOg","props","_props$renderRegexTex","userMessage","parentMessage","sbOptions","select","colors","palette","enableOgtag","uikitWithAppInfo","groupChannel","channel","onPressMessage","_userMessage$ogMetaDa","_props$onPressURL","ogMetaData","url","onPressURL","call","createElement","flex","alignItems","activeOpacity","onPress","body3","suppressHighlighting","supportRTLAlign","originalText","message","color","onBackground01","patterns","regexTextPatterns","regex","replacer","match","parentProps","keyPrefix","index","_extends","key","_props$onPressURL2","style","styles","urlText","renderRegexTextChildren","Boolean","updatedAt","onBackground02","container","defaultImage","ogImage","source","uri","ogContainer","backgroundColor","dark","background400","light","background100","numberOfLines","body2","ogTitle","title","description","caption2","ogDesc","borderRadius","overflow","paddingHorizontal","paddingTop","paddingBottom","maxWidth","borderBottomStartRadius","borderBottomEndRadius","width","height","borderTopStartRadius","borderTopEndRadius","ogUrl","marginBottom","lineHeight","textDecorationLine"],"sources":["ThreadParentMessage.user.og.tsx"],"sourcesContent":["import React from 'react';\n\nimport {\n  Box,\n  ImageWithPlaceholder,\n  PressBox,\n  RegexText,\n  type RegexTextPattern,\n  Text,\n  createStyleSheet,\n  useUIKitTheme,\n} from '@sendbird/uikit-react-native-foundation';\nimport { SendbirdUserMessage, urlRegexStrict, useFreshCallback } from '@sendbird/uikit-utils';\n\nimport { useSendbirdChat } from './../../hooks/useContext';\nimport { ThreadParentMessageRendererProps } from './index';\n\ntype Props = ThreadParentMessageRendererProps<{\n  regexTextPatterns?: RegexTextPattern[];\n  renderRegexTextChildren?: (message: SendbirdUserMessage) => string;\n}>;\n\nconst ThreadParentMessageUserOg = (props: Props) => {\n  const userMessage: SendbirdUserMessage = props.parentMessage as SendbirdUserMessage;\n  if (!userMessage) return null;\n\n  const { sbOptions } = useSendbirdChat();\n  const { select, colors, palette } = useUIKitTheme();\n  const enableOgtag = sbOptions.uikitWithAppInfo.groupChannel.channel.enableOgtag;\n  const onPressMessage = (userMessage: SendbirdUserMessage) =>\n    useFreshCallback(() => {\n      typeof userMessage.ogMetaData?.url === 'string' && props.onPressURL?.(userMessage.ogMetaData.url);\n    });\n\n  return (\n    <Box flex={1} alignItems={'flex-start'}>\n      <PressBox activeOpacity={0.85} onPress={onPressMessage(userMessage)}>\n        <Text\n          body3\n          suppressHighlighting\n          supportRTLAlign\n          originalText={userMessage.message}\n          color={colors.onBackground01}\n        >\n          <RegexText\n            body3\n            suppressHighlighting\n            supportRTLAlign\n            originalText={userMessage.message}\n            color={colors.onBackground01}\n            patterns={[\n              ...(props.regexTextPatterns ?? []),\n              {\n                regex: urlRegexStrict,\n                replacer({ match, parentProps, keyPrefix, index }) {\n                  return (\n                    <Text\n                      {...parentProps}\n                      key={`${keyPrefix}-${index}`}\n                      onPress={() => props.onPressURL?.(match)}\n                      style={[parentProps?.style, styles.urlText]}\n                    >\n                      {match}\n                    </Text>\n                  );\n                },\n              },\n            ]}\n          >\n            {props.renderRegexTextChildren?.(userMessage)}\n          </RegexText>\n          {Boolean(userMessage.updatedAt) && (\n            <Text body3 color={colors.onBackground02}>\n              {' (edited)'}\n            </Text>\n          )}\n        </Text>\n      </PressBox>\n      {userMessage.ogMetaData && enableOgtag && (\n        <PressBox onPress={onPressMessage(userMessage)} style={styles.container}>\n          <Box>\n            {!!userMessage.ogMetaData.defaultImage && (\n              <ImageWithPlaceholder style={styles.ogImage} source={{ uri: userMessage.ogMetaData.defaultImage.url }} />\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                {userMessage.ogMetaData.title}\n              </Text>\n              {!!userMessage.ogMetaData.description && (\n                <Text numberOfLines={1} caption2 color={colors.onBackground01} style={styles.ogDesc}>\n                  {userMessage.ogMetaData.description}\n                </Text>\n              )}\n              <Text numberOfLines={1} caption2 color={colors.onBackground02}>\n                {userMessage.ogMetaData.url}\n              </Text>\n            </Box>\n          </Box>\n        </PressBox>\n      )}\n    </Box>\n  );\n};\n\nconst styles = createStyleSheet({\n  container: {\n    borderRadius: 16,\n    overflow: 'hidden',\n  },\n  ogContainer: {\n    paddingHorizontal: 12,\n    paddingTop: 8,\n    paddingBottom: 12,\n    maxWidth: 240,\n    borderBottomStartRadius: 16,\n    borderBottomEndRadius: 16,\n  },\n  ogImage: {\n    width: 240,\n    height: 136,\n    borderTopStartRadius: 16,\n    borderTopEndRadius: 16,\n  },\n  ogUrl: {\n    marginBottom: 4,\n  },\n  ogTitle: {\n    marginBottom: 4,\n  },\n  ogDesc: {\n    lineHeight: 14,\n    marginBottom: 8,\n  },\n  urlText: {\n    textDecorationLine: 'underline',\n  },\n});\n\nexport default ThreadParentMessageUserOg;\n"],"mappings":"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","ignoreList":[]}

package/lib/module/components/ThreadParentMessageRenderer/index.js

@@ -1,4 +1,4 @@
-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); }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 import React, { useRef } from 'react';
 import { Text, useUIKitTheme } from '@sendbird/uikit-react-native-foundation';
 import { getMessageType, isMyMessage, isVoiceMessage } from '@sendbird/uikit-utils';
@@ -16,7 +16,8 @@ const ThreadParentMessageRenderer = props => {
   const {
     sbOptions,
     currentUser,
-    mentionManager
+    mentionManager,
+    voiceMessageStatusManager
   } = useSendbirdChat();
   const {
     palette
@@ -51,12 +52,12 @@ const ThreadParentMessageRenderer = props => {
           }
           const shouldSeekToTime = state.duration > state.currentTime && state.currentTime > 0;
           let seekFinished = !shouldSeekToTime;
-          const forPlayback = playerService.addPlaybackListener(_ref => {
-            let {
-              stopped,
-              currentTime,
-              duration
-            } = _ref;
+          const forPlayback = playerService.addPlaybackListener(({
+            stopped,
+            currentTime,
+            duration
+          }) => {
+            voiceMessageStatusManager.setCurrentTime(parentMessage.channelUrl, parentMessage.messageId, stopped ? 0 : currentTime);
             if (seekFinished) {
               setState(prevState => ({
                 ...prevState,
@@ -110,22 +111,21 @@ const ThreadParentMessageRenderer = props => {
   const userMessageProps = {
     renderRegexTextChildren: message => {
       if (mentionManager.shouldUseMentionedMessageTemplate(message, sbOptions.uikit.groupChannel.channel.enableMention)) {
-        return message.mentionedMessageTemplate;
+        return message.mentionedMessageTemplate ?? '';
       } else {
         return message.message;
       }
     },
     regexTextPatterns: [{
       regex: mentionManager.templateRegex,
-      replacer(_ref2) {
+      replacer({
+        match,
+        groups,
+        parentProps,
+        index,
+        keyPrefix
+      }) {
         var _parentMessage$mentio;
-        let {
-          match,
-          groups,
-          parentProps,
-          index,
-          keyPrefix
-        } = _ref2;
         const user = (_parentMessage$mentio = parentMessage.mentionedUsers) === null || _parentMessage$mentio === void 0 ? void 0 : _parentMessage$mentio.find(it => it.userId === groups[2]);
         if (user) {
           const mentionColor = !isMyMessage(parentMessage, currentUser === null || currentUser === void 0 ? void 0 : currentUser.userId) && user.userId === (currentUser === null || currentUser === void 0 ? void 0 : currentUser.userId) ? palette.onBackgroundLight01 : parentProps === null || parentProps === void 0 ? void 0 : parentProps.color;
@@ -137,6 +137,7 @@ const ThreadParentMessageRenderer = props => {
               return (_messageProps$onPress = messageProps.onPressMentionedUser) === null || _messageProps$onPress === void 0 ? void 0 : _messageProps$onPress.call(messageProps, user);
             },
             onLongPress: messageProps.onLongPress,
+            suppressHighlighting: true,
             style: [parentProps === null || parentProps === void 0 ? void 0 : parentProps.style, {
               fontWeight: '700'
             }, user.userId === (currentUser === null || currentUser === void 0 ? void 0 : currentUser.userId) && {
@@ -179,6 +180,7 @@ const ThreadParentMessageRenderer = props => {
       {
         return /*#__PURE__*/React.createElement(ThreadParentMessageFileVoice, _extends({
           durationMetaArrayKey: VOICE_MESSAGE_META_ARRAY_DURATION_KEY,
+          initialCurrentTime: voiceMessageStatusManager.getCurrentTime(parentMessage.channelUrl, parentMessage.messageId),
           onUnmount: () => {
             if (isVoiceMessage(parentMessage) && playerService.uri === parentMessage.url) {
               resetPlayer().catch(_ => {});