stream-chat-react-native-core 5.18.0-beta.2 → 5.18.0-beta.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (20) hide show
  1. package/lib/commonjs/components/Message/MessageSimple/MessageReplies.js +19 -26
  2. package/lib/commonjs/components/Message/MessageSimple/MessageReplies.js.map +1 -1
  3. package/lib/commonjs/components/Message/MessageSimple/MessageRepliesAvatars.js +1 -3
  4. package/lib/commonjs/components/Message/MessageSimple/MessageRepliesAvatars.js.map +1 -1
  5. package/lib/commonjs/components/MessageOverlay/OverlayReactions.js +51 -28
  6. package/lib/commonjs/components/MessageOverlay/OverlayReactions.js.map +1 -1
  7. package/lib/commonjs/version.json +1 -1
  8. package/lib/module/components/Message/MessageSimple/MessageReplies.js +19 -26
  9. package/lib/module/components/Message/MessageSimple/MessageReplies.js.map +1 -1
  10. package/lib/module/components/Message/MessageSimple/MessageRepliesAvatars.js +1 -3
  11. package/lib/module/components/Message/MessageSimple/MessageRepliesAvatars.js.map +1 -1
  12. package/lib/module/components/MessageOverlay/OverlayReactions.js +51 -28
  13. package/lib/module/components/MessageOverlay/OverlayReactions.js.map +1 -1
  14. package/lib/module/version.json +1 -1
  15. package/package.json +1 -1
  16. package/src/components/Message/MessageSimple/MessageReplies.tsx +6 -17
  17. package/src/components/Message/MessageSimple/MessageRepliesAvatars.tsx +1 -1
  18. package/src/components/Message/MessageSimple/__tests__/__snapshots__/MessageReplies.test.js.snap +7 -3
  19. package/src/components/MessageOverlay/OverlayReactions.tsx +48 -27
  20. package/src/version.json +1 -1
package/lib/commonjs/components/Message/MessageSimple/MessageReplies.js CHANGED
@@ -21,16 +21,11 @@ var styles = _reactNative.StyleSheet.create({
21
21
  curveContainer: {
22
22
  flexDirection: 'row'
23
23
  },
24
- leftMessageRepliesCurve: (0, _extends2["default"])({
24
+ leftMessageRepliesCurve: {
25
25
  borderBottomLeftRadius: 16,
26
- borderRightColor: 'transparent'
27
- }, _reactNative.Platform.select({
28
- android: {
29
- borderRightWidth: 0
30
- }
31
- })),
26
+ borderRightWidth: 0
27
+ },
32
28
  messageRepliesCurve: {
33
- borderTopColor: 'transparent',
34
29
  borderTopWidth: 0,
35
30
  borderWidth: 1,
36
31
  height: 16,
@@ -40,16 +35,12 @@ var styles = _reactNative.StyleSheet.create({
40
35
  fontSize: 12,
41
36
  fontWeight: '700',
42
37
  paddingBottom: 5,
43
- paddingLeft: 8
38
+ paddingHorizontal: 8
44
39
  },
45
- rightMessageRepliesCurve: (0, _extends2["default"])({
40
+ rightMessageRepliesCurve: {
46
41
  borderBottomRightRadius: 16,
47
- borderLeftColor: 'transparent'
48
- }, _reactNative.Platform.select({
49
- android: {
50
- borderLeftWidth: 0
51
- }
52
- }))
42
+ borderLeftWidth: 0
43
+ }
53
44
  });
54
45
  var MessageRepliesWithContext = function MessageRepliesWithContext(props) {
55
46
  var alignment = props.alignment,
@@ -78,15 +69,16 @@ var MessageRepliesWithContext = function MessageRepliesWithContext(props) {
78
69
  __self: _this,
79
70
  __source: {
80
71
  fileName: _jsxFileName,
81
- lineNumber: 113,
72
+ lineNumber: 102,
82
73
  columnNumber: 5
83
74
  }
84
75
  }, alignment === 'left' && _react["default"].createElement(_reactNative.View, {
76
+ style: styles.curveContainer,
85
77
  testID: "message-replies-left",
86
78
  __self: _this,
87
79
  __source: {
88
80
  fileName: _jsxFileName,
89
- lineNumber: 115,
81
+ lineNumber: 104,
90
82
  columnNumber: 9
91
83
  }
92
84
  }, !noBorder && _react["default"].createElement(_reactNative.View, {
@@ -96,7 +88,7 @@ var MessageRepliesWithContext = function MessageRepliesWithContext(props) {
96
88
  __self: _this,
97
89
  __source: {
98
90
  fileName: _jsxFileName,
99
- lineNumber: 117,
91
+ lineNumber: 106,
100
92
  columnNumber: 13
101
93
  }
102
94
  }), _react["default"].createElement(MessageRepliesAvatars, {
@@ -105,7 +97,7 @@ var MessageRepliesWithContext = function MessageRepliesWithContext(props) {
105
97
  __self: _this,
106
98
  __source: {
107
99
  fileName: _jsxFileName,
108
- lineNumber: 126,
100
+ lineNumber: 115,
109
101
  columnNumber: 11
110
102
  }
111
103
  })), _react["default"].createElement(_reactNative.TouchableOpacity, {
@@ -141,7 +133,7 @@ var MessageRepliesWithContext = function MessageRepliesWithContext(props) {
141
133
  __self: _this,
142
134
  __source: {
143
135
  fileName: _jsxFileName,
144
- lineNumber: 129,
136
+ lineNumber: 118,
145
137
  columnNumber: 7
146
138
  }
147
139
  }, _react["default"].createElement(_reactNative.Text, {
@@ -151,17 +143,18 @@ var MessageRepliesWithContext = function MessageRepliesWithContext(props) {
151
143
  __self: _this,
152
144
  __source: {
153
145
  fileName: _jsxFileName,
154
- lineNumber: 160,
146
+ lineNumber: 149,
155
147
  columnNumber: 9
156
148
  }
157
149
  }, message.reply_count === 1 ? t('1 Thread Reply') : t('{{ replyCount }} Thread Replies', {
158
150
  replyCount: message.reply_count
159
151
  }))), alignment === 'right' && _react["default"].createElement(_reactNative.View, {
152
+ style: styles.curveContainer,
160
153
  testID: "message-replies-right",
161
154
  __self: _this,
162
155
  __source: {
163
156
  fileName: _jsxFileName,
164
- lineNumber: 169,
157
+ lineNumber: 158,
165
158
  columnNumber: 9
166
159
  }
167
160
  }, _react["default"].createElement(MessageRepliesAvatars, {
@@ -170,7 +163,7 @@ var MessageRepliesWithContext = function MessageRepliesWithContext(props) {
170
163
  __self: _this,
171
164
  __source: {
172
165
  fileName: _jsxFileName,
173
- lineNumber: 170,
166
+ lineNumber: 159,
174
167
  columnNumber: 11
175
168
  }
176
169
  }), !noBorder && _react["default"].createElement(_reactNative.View, {
@@ -180,7 +173,7 @@ var MessageRepliesWithContext = function MessageRepliesWithContext(props) {
180
173
  __self: _this,
181
174
  __source: {
182
175
  fileName: _jsxFileName,
183
- lineNumber: 172,
176
+ lineNumber: 161,
184
177
  columnNumber: 13
185
178
  }
186
179
  })));
@@ -238,7 +231,7 @@ var MessageReplies = function MessageReplies(props) {
238
231
  __self: _this,
239
232
  __source: {
240
233
  fileName: _jsxFileName,
241
- lineNumber: 252,
234
+ lineNumber: 241,
242
235
  columnNumber: 5
243
236
  }
244
237
  }));
package/lib/commonjs/components/Message/MessageSimple/MessageReplies.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"names":["_react","_interopRequireDefault","require","_reactNative","_MessageContext","_MessagesContext","_ThemeContext","_TranslationContext","_this","_jsxFileName","styles","StyleSheet","create","container","alignItems","flexDirection","marginTop","curveContainer","leftMessageRepliesCurve","_extends2","borderBottomLeftRadius","borderRightColor","Platform","select","android","borderRightWidth","messageRepliesCurve","borderTopColor","borderTopWidth","borderWidth","height","width","messageRepliesText","fontSize","fontWeight","paddingBottom","paddingLeft","rightMessageRepliesCurve","borderBottomRightRadius","borderLeftColor","borderLeftWidth","MessageRepliesWithContext","props","alignment","message","MessageRepliesAvatars","noBorder","onLongPress","onOpenThread","onPress","onPressIn","preventPress","repliesCurveColor","t","threadList","_useTheme","useTheme","_useTheme$theme","theme","accent_blue","colors","_useTheme$theme$messa","messageSimple","replies","leftCurve","rightCurve","reply_count","createElement","View","style","__self","__source","fileName","lineNumber","columnNumber","testID","borderColor","TouchableOpacity","disabled","event","emitter","defaultHandler","Text","color","replyCount","areEqual","prevProps","nextProps","prevMessage","prevNoBorder","prevOnOpenThread","prevT","prevThreadList","nextMessage","nextNoBorder","nextOnOpenThread","nextT","nextThreadList","threadListEqual","messageReplyCountEqual","noBorderEqual","tEqual","onOpenThreadEqual","MemoizedMessageReplies","React","memo","MessageReplies","_useMessageContext","useMessageContext","_useMessagesContext","useMessagesContext","_useTranslationContex","useTranslationContext","exports","displayName"],"sources":["MessageReplies.tsx"],"sourcesContent":["import React from 'react';\nimport { ColorValue, Platform, StyleSheet, Text, TouchableOpacity, View } from 'react-native';\n\nimport {\n MessageContextValue,\n useMessageContext,\n} from '../../../contexts/messageContext/MessageContext';\nimport {\n MessagesContextValue,\n useMessagesContext,\n} from '../../../contexts/messagesContext/MessagesContext';\nimport { useTheme } from '../../../contexts/themeContext/ThemeContext';\nimport {\n TranslationContextValue,\n useTranslationContext,\n} from '../../../contexts/translationContext/TranslationContext';\n\nimport type { DefaultStreamChatGenerics } from '../../../types/types';\n\nconst styles = StyleSheet.create({\n container: {\n alignItems: 'center',\n flexDirection: 'row',\n marginTop: 8,\n },\n curveContainer: {\n flexDirection: 'row',\n },\n leftMessageRepliesCurve: {\n borderBottomLeftRadius: 16,\n borderRightColor: 'transparent',\n ...Platform.select({\n android: {\n borderRightWidth: 0,\n },\n }),\n },\n messageRepliesCurve: {\n borderTopColor: 'transparent',\n borderTopWidth: 0,\n borderWidth: 1,\n height: 16,\n width: 16,\n },\n messageRepliesText: {\n fontSize: 12,\n fontWeight: '700',\n paddingBottom: 5,\n paddingLeft: 8,\n },\n rightMessageRepliesCurve: {\n borderBottomRightRadius: 16,\n borderLeftColor: 'transparent',\n ...Platform.select({\n android: {\n borderLeftWidth: 0,\n },\n }),\n },\n});\n\nexport type MessageRepliesPropsWithContext<\n StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n> = Pick<\n MessageContextValue<StreamChatGenerics>,\n | 'alignment'\n | 'message'\n | 'onLongPress'\n | 'onPress'\n | 'onPressIn'\n | 'onOpenThread'\n | 'preventPress'\n | 'threadList'\n> &\n Pick<MessagesContextValue<StreamChatGenerics>, 'MessageRepliesAvatars'> &\n Pick<TranslationContextValue, 't'> & {\n noBorder?: boolean;\n repliesCurveColor?: ColorValue;\n };\n\nconst MessageRepliesWithContext = <\n StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n>(\n props: MessageRepliesPropsWithContext<StreamChatGenerics>,\n) => {\n const {\n alignment,\n message,\n MessageRepliesAvatars,\n noBorder,\n onLongPress,\n onOpenThread,\n onPress,\n onPressIn,\n preventPress,\n repliesCurveColor,\n t,\n threadList,\n } = props;\n\n const {\n theme: {\n colors: { accent_blue },\n messageSimple: {\n replies: { container, leftCurve, messageRepliesText, rightCurve },\n },\n },\n } = useTheme();\n\n if (threadList || !message.reply_count) return null;\n\n return (\n <View style={styles.curveContainer}>\n {alignment === 'left' && (\n <View testID='message-replies-left'>\n {!noBorder && (\n <View\n style={[\n { borderColor: repliesCurveColor },\n styles.messageRepliesCurve,\n styles.leftMessageRepliesCurve,\n leftCurve,\n ]}\n />\n )}\n <MessageRepliesAvatars alignment={alignment} message={message} />\n </View>\n )}\n <TouchableOpacity\n disabled={preventPress}\n onLongPress={(event) => {\n if (onLongPress) {\n onLongPress({\n emitter: 'messageReplies',\n event,\n });\n }\n }}\n onPress={(event) => {\n if (onPress) {\n onPress({\n defaultHandler: onOpenThread,\n emitter: 'messageReplies',\n event,\n });\n }\n }}\n onPressIn={(event) => {\n if (onPressIn) {\n onPressIn({\n defaultHandler: onOpenThread,\n emitter: 'messageReplies',\n event,\n });\n }\n }}\n style={[styles.container, container]}\n testID='message-replies'\n >\n <Text style={[styles.messageRepliesText, { color: accent_blue }, messageRepliesText]}>\n {message.reply_count === 1\n ? t('1 Thread Reply')\n : t('{{ replyCount }} Thread Replies', {\n replyCount: message.reply_count,\n })}\n </Text>\n </TouchableOpacity>\n {alignment === 'right' && (\n <View testID='message-replies-right'>\n <MessageRepliesAvatars alignment={alignment} message={message} />\n {!noBorder && (\n <View\n style={[\n { borderColor: repliesCurveColor },\n styles.messageRepliesCurve,\n styles.rightMessageRepliesCurve,\n rightCurve,\n ]}\n />\n )}\n </View>\n )}\n </View>\n );\n};\n\nconst areEqual = <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>(\n prevProps: MessageRepliesPropsWithContext<StreamChatGenerics>,\n nextProps: MessageRepliesPropsWithContext<StreamChatGenerics>,\n) => {\n const {\n message: prevMessage,\n noBorder: prevNoBorder,\n onOpenThread: prevOnOpenThread,\n t: prevT,\n threadList: prevThreadList,\n } = prevProps;\n const {\n message: nextMessage,\n noBorder: nextNoBorder,\n onOpenThread: nextOnOpenThread,\n t: nextT,\n threadList: nextThreadList,\n } = nextProps;\n\n const threadListEqual = prevThreadList === nextThreadList;\n if (!threadListEqual) return false;\n\n const messageReplyCountEqual = prevMessage.reply_count === nextMessage.reply_count;\n if (!messageReplyCountEqual) return false;\n\n const noBorderEqual = prevNoBorder === nextNoBorder;\n if (!noBorderEqual) return false;\n\n const tEqual = prevT === nextT;\n if (!tEqual) return false;\n\n const onOpenThreadEqual = prevOnOpenThread === nextOnOpenThread;\n if (!onOpenThreadEqual) return false;\n\n return true;\n};\n\nconst MemoizedMessageReplies = React.memo(\n MessageRepliesWithContext,\n areEqual,\n) as typeof MessageRepliesWithContext;\n\nexport type MessageRepliesProps<\n StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n> = Partial<MessageRepliesPropsWithContext<StreamChatGenerics>>;\n\nexport const MessageReplies = <\n StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n>(\n props: MessageRepliesProps<StreamChatGenerics>,\n) => {\n const {\n alignment,\n message,\n onLongPress,\n onOpenThread,\n onPress,\n onPressIn,\n preventPress,\n threadList,\n } = useMessageContext<StreamChatGenerics>();\n const { MessageRepliesAvatars } = useMessagesContext<StreamChatGenerics>();\n const { t } = useTranslationContext();\n\n return (\n <MemoizedMessageReplies\n {...{\n alignment,\n message,\n MessageRepliesAvatars,\n onLongPress,\n onOpenThread,\n onPress,\n onPressIn,\n preventPress,\n t,\n threadList,\n }}\n {...props}\n />\n );\n};\n\nMessageReplies.displayName = 'MessageReplies{messageSimple{replies}}';\n"],"mappings":"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"}
1
+ {"version":3,"names":["_react","_interopRequireDefault","require","_reactNative","_MessageContext","_MessagesContext","_ThemeContext","_TranslationContext","_this","_jsxFileName","styles","StyleSheet","create","container","alignItems","flexDirection","marginTop","curveContainer","leftMessageRepliesCurve","borderBottomLeftRadius","borderRightWidth","messageRepliesCurve","borderTopWidth","borderWidth","height","width","messageRepliesText","fontSize","fontWeight","paddingBottom","paddingHorizontal","rightMessageRepliesCurve","borderBottomRightRadius","borderLeftWidth","MessageRepliesWithContext","props","alignment","message","MessageRepliesAvatars","noBorder","onLongPress","onOpenThread","onPress","onPressIn","preventPress","repliesCurveColor","t","threadList","_useTheme","useTheme","_useTheme$theme","theme","accent_blue","colors","_useTheme$theme$messa","messageSimple","replies","leftCurve","rightCurve","reply_count","createElement","View","style","__self","__source","fileName","lineNumber","columnNumber","testID","borderColor","TouchableOpacity","disabled","event","emitter","defaultHandler","Text","color","replyCount","areEqual","prevProps","nextProps","prevMessage","prevNoBorder","prevOnOpenThread","prevT","prevThreadList","nextMessage","nextNoBorder","nextOnOpenThread","nextT","nextThreadList","threadListEqual","messageReplyCountEqual","noBorderEqual","tEqual","onOpenThreadEqual","MemoizedMessageReplies","React","memo","MessageReplies","_useMessageContext","useMessageContext","_useMessagesContext","useMessagesContext","_useTranslationContex","useTranslationContext","_extends2","exports","displayName"],"sources":["MessageReplies.tsx"],"sourcesContent":["import React from 'react';\nimport { ColorValue, StyleSheet, Text, TouchableOpacity, View } from 'react-native';\n\nimport {\n MessageContextValue,\n useMessageContext,\n} from '../../../contexts/messageContext/MessageContext';\nimport {\n MessagesContextValue,\n useMessagesContext,\n} from '../../../contexts/messagesContext/MessagesContext';\nimport { useTheme } from '../../../contexts/themeContext/ThemeContext';\nimport {\n TranslationContextValue,\n useTranslationContext,\n} from '../../../contexts/translationContext/TranslationContext';\n\nimport type { DefaultStreamChatGenerics } from '../../../types/types';\n\nconst styles = StyleSheet.create({\n container: {\n alignItems: 'center',\n flexDirection: 'row',\n marginTop: 8,\n },\n curveContainer: {\n flexDirection: 'row',\n },\n leftMessageRepliesCurve: {\n borderBottomLeftRadius: 16,\n borderRightWidth: 0,\n },\n messageRepliesCurve: {\n borderTopWidth: 0,\n borderWidth: 1,\n height: 16,\n width: 16,\n },\n messageRepliesText: {\n fontSize: 12,\n fontWeight: '700',\n paddingBottom: 5,\n paddingHorizontal: 8,\n },\n rightMessageRepliesCurve: {\n borderBottomRightRadius: 16,\n borderLeftWidth: 0,\n },\n});\n\nexport type MessageRepliesPropsWithContext<\n StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n> = Pick<\n MessageContextValue<StreamChatGenerics>,\n | 'alignment'\n | 'message'\n | 'onLongPress'\n | 'onPress'\n | 'onPressIn'\n | 'onOpenThread'\n | 'preventPress'\n | 'threadList'\n> &\n Pick<MessagesContextValue<StreamChatGenerics>, 'MessageRepliesAvatars'> &\n Pick<TranslationContextValue, 't'> & {\n noBorder?: boolean;\n repliesCurveColor?: ColorValue;\n };\n\nconst MessageRepliesWithContext = <\n StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n>(\n props: MessageRepliesPropsWithContext<StreamChatGenerics>,\n) => {\n const {\n alignment,\n message,\n MessageRepliesAvatars,\n noBorder,\n onLongPress,\n onOpenThread,\n onPress,\n onPressIn,\n preventPress,\n repliesCurveColor,\n t,\n threadList,\n } = props;\n\n const {\n theme: {\n colors: { accent_blue },\n messageSimple: {\n replies: { container, leftCurve, messageRepliesText, rightCurve },\n },\n },\n } = useTheme();\n\n if (threadList || !message.reply_count) return null;\n\n return (\n <View style={styles.curveContainer}>\n {alignment === 'left' && (\n <View style={styles.curveContainer} testID='message-replies-left'>\n {!noBorder && (\n <View\n style={[\n { borderColor: repliesCurveColor },\n styles.messageRepliesCurve,\n styles.leftMessageRepliesCurve,\n leftCurve,\n ]}\n />\n )}\n <MessageRepliesAvatars alignment={alignment} message={message} />\n </View>\n )}\n <TouchableOpacity\n disabled={preventPress}\n onLongPress={(event) => {\n if (onLongPress) {\n onLongPress({\n emitter: 'messageReplies',\n event,\n });\n }\n }}\n onPress={(event) => {\n if (onPress) {\n onPress({\n defaultHandler: onOpenThread,\n emitter: 'messageReplies',\n event,\n });\n }\n }}\n onPressIn={(event) => {\n if (onPressIn) {\n onPressIn({\n defaultHandler: onOpenThread,\n emitter: 'messageReplies',\n event,\n });\n }\n }}\n style={[styles.container, container]}\n testID='message-replies'\n >\n <Text style={[styles.messageRepliesText, { color: accent_blue }, messageRepliesText]}>\n {message.reply_count === 1\n ? t('1 Thread Reply')\n : t('{{ replyCount }} Thread Replies', {\n replyCount: message.reply_count,\n })}\n </Text>\n </TouchableOpacity>\n {alignment === 'right' && (\n <View style={styles.curveContainer} testID='message-replies-right'>\n <MessageRepliesAvatars alignment={alignment} message={message} />\n {!noBorder && (\n <View\n style={[\n { borderColor: repliesCurveColor },\n styles.messageRepliesCurve,\n styles.rightMessageRepliesCurve,\n rightCurve,\n ]}\n />\n )}\n </View>\n )}\n </View>\n );\n};\n\nconst areEqual = <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>(\n prevProps: MessageRepliesPropsWithContext<StreamChatGenerics>,\n nextProps: MessageRepliesPropsWithContext<StreamChatGenerics>,\n) => {\n const {\n message: prevMessage,\n noBorder: prevNoBorder,\n onOpenThread: prevOnOpenThread,\n t: prevT,\n threadList: prevThreadList,\n } = prevProps;\n const {\n message: nextMessage,\n noBorder: nextNoBorder,\n onOpenThread: nextOnOpenThread,\n t: nextT,\n threadList: nextThreadList,\n } = nextProps;\n\n const threadListEqual = prevThreadList === nextThreadList;\n if (!threadListEqual) return false;\n\n const messageReplyCountEqual = prevMessage.reply_count === nextMessage.reply_count;\n if (!messageReplyCountEqual) return false;\n\n const noBorderEqual = prevNoBorder === nextNoBorder;\n if (!noBorderEqual) return false;\n\n const tEqual = prevT === nextT;\n if (!tEqual) return false;\n\n const onOpenThreadEqual = prevOnOpenThread === nextOnOpenThread;\n if (!onOpenThreadEqual) return false;\n\n return true;\n};\n\nconst MemoizedMessageReplies = React.memo(\n MessageRepliesWithContext,\n areEqual,\n) as typeof MessageRepliesWithContext;\n\nexport type MessageRepliesProps<\n StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n> = Partial<MessageRepliesPropsWithContext<StreamChatGenerics>>;\n\nexport const MessageReplies = <\n StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n>(\n props: MessageRepliesProps<StreamChatGenerics>,\n) => {\n const {\n alignment,\n message,\n onLongPress,\n onOpenThread,\n onPress,\n onPressIn,\n preventPress,\n threadList,\n } = useMessageContext<StreamChatGenerics>();\n const { MessageRepliesAvatars } = useMessagesContext<StreamChatGenerics>();\n const { t } = useTranslationContext();\n\n return (\n <MemoizedMessageReplies\n {...{\n alignment,\n message,\n MessageRepliesAvatars,\n onLongPress,\n onOpenThread,\n onPress,\n onPressIn,\n preventPress,\n t,\n threadList,\n }}\n {...props}\n />\n );\n};\n\nMessageReplies.displayName = 'MessageReplies{messageSimple{replies}}';\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AAEA,IAAAE,eAAA,GAAAF,OAAA;AAIA,IAAAG,gBAAA,GAAAH,OAAA;AAIA,IAAAI,aAAA,GAAAJ,OAAA;AACA,IAAAK,mBAAA,GAAAL,OAAA;AAGiE,IAAAM,KAAA;EAAAC,YAAA;AAIjE,IAAMC,MAAM,GAAGC,uBAAU,CAACC,MAAM,CAAC;EAC/BC,SAAS,EAAE;IACTC,UAAU,EAAE,QAAQ;IACpBC,aAAa,EAAE,KAAK;IACpBC,SAAS,EAAE;EACb,CAAC;EACDC,cAAc,EAAE;IACdF,aAAa,EAAE;EACjB,CAAC;EACDG,uBAAuB,EAAE;IACvBC,sBAAsB,EAAE,EAAE;IAC1BC,gBAAgB,EAAE;EACpB,CAAC;EACDC,mBAAmB,EAAE;IACnBC,cAAc,EAAE,CAAC;IACjBC,WAAW,EAAE,CAAC;IACdC,MAAM,EAAE,EAAE;IACVC,KAAK,EAAE;EACT,CAAC;EACDC,kBAAkB,EAAE;IAClBC,QAAQ,EAAE,EAAE;IACZC,UAAU,EAAE,KAAK;IACjBC,aAAa,EAAE,CAAC;IAChBC,iBAAiB,EAAE;EACrB,CAAC;EACDC,wBAAwB,EAAE;IACxBC,uBAAuB,EAAE,EAAE;IAC3BC,eAAe,EAAE;EACnB;AACF,CAAC,CAAC;AAqBF,IAAMC,yBAAyB,GAAG,SAA5BA,yBAAyBA,CAG7BC,KAAyD,EACtD;EACH,IACEC,SAAS,GAYPD,KAAK,CAZPC,SAAS;IACTC,OAAO,GAWLF,KAAK,CAXPE,OAAO;IACPC,qBAAqB,GAUnBH,KAAK,CAVPG,qBAAqB;IACrBC,QAAQ,GASNJ,KAAK,CATPI,QAAQ;IACRC,YAAW,GAQTL,KAAK,CARPK,WAAW;IACXC,YAAY,GAOVN,KAAK,CAPPM,YAAY;IACZC,QAAO,GAMLP,KAAK,CANPO,OAAO;IACPC,UAAS,GAKPR,KAAK,CALPQ,SAAS;IACTC,YAAY,GAIVT,KAAK,CAJPS,YAAY;IACZC,iBAAiB,GAGfV,KAAK,CAHPU,iBAAiB;IACjBC,CAAC,GAECX,KAAK,CAFPW,CAAC;IACDC,UAAU,GACRZ,KAAK,CADPY,UAAU;EAGZ,IAAAC,SAAA,GAOI,IAAAC,sBAAQ,EAAC,CAAC;IAAAC,eAAA,GAAAF,SAAA,CANZG,KAAK;IACOC,WAAW,GAAAF,eAAA,CAArBG,MAAM,CAAID,WAAW;IAAAE,qBAAA,GAAAJ,eAAA,CACrBK,aAAa,CACXC,OAAO;IAAI3C,SAAS,GAAAyC,qBAAA,CAATzC,SAAS;IAAE4C,SAAS,GAAAH,qBAAA,CAATG,SAAS;IAAE/B,kBAAkB,GAAA4B,qBAAA,CAAlB5B,kBAAkB;IAAEgC,UAAU,GAAAJ,qBAAA,CAAVI,UAAU;EAKrE,IAAIX,UAAU,IAAI,CAACV,OAAO,CAACsB,WAAW,EAAE,OAAO,IAAI;EAEnD,OACE3D,MAAA,YAAA4D,aAAA,CAACzD,YAAA,CAAA0D,IAAI;IAACC,KAAK,EAAEpD,MAAM,CAACO,cAAe;IAAA8C,MAAA,EAAAvD,KAAA;IAAAwD,QAAA;MAAAC,QAAA,EAAAxD,YAAA;MAAAyD,UAAA;MAAAC,YAAA;IAAA;EAAA,GAChC/B,SAAS,KAAK,MAAM,IACnBpC,MAAA,YAAA4D,aAAA,CAACzD,YAAA,CAAA0D,IAAI;IAACC,KAAK,EAAEpD,MAAM,CAACO,cAAe;IAACmD,MAAM,EAAC,sBAAsB;IAAAL,MAAA,EAAAvD,KAAA;IAAAwD,QAAA;MAAAC,QAAA,EAAAxD,YAAA;MAAAyD,UAAA;MAAAC,YAAA;IAAA;EAAA,GAC9D,CAAC5B,QAAQ,IACRvC,MAAA,YAAA4D,aAAA,CAACzD,YAAA,CAAA0D,IAAI;IACHC,KAAK,EAAE,CACL;MAAEO,WAAW,EAAExB;IAAkB,CAAC,EAClCnC,MAAM,CAACW,mBAAmB,EAC1BX,MAAM,CAACQ,uBAAuB,EAC9BuC,SAAS,CACT;IAAAM,MAAA,EAAAvD,KAAA;IAAAwD,QAAA;MAAAC,QAAA,EAAAxD,YAAA;MAAAyD,UAAA;MAAAC,YAAA;IAAA;EAAA,CACH,CACF,EACDnE,MAAA,YAAA4D,aAAA,CAACtB,qBAAqB;IAACF,SAAS,EAAEA,SAAU;IAACC,OAAO,EAAEA,OAAQ;IAAA0B,MAAA,EAAAvD,KAAA;IAAAwD,QAAA;MAAAC,QAAA,EAAAxD,YAAA;MAAAyD,UAAA;MAAAC,YAAA;IAAA;EAAA,CAAE,CAC5D,CACP,EACDnE,MAAA,YAAA4D,aAAA,CAACzD,YAAA,CAAAmE,gBAAgB;IACfC,QAAQ,EAAE3B,YAAa;IACvBJ,WAAW,EAAE,SAAAA,YAACgC,KAAK,EAAK;MACtB,IAAIhC,YAAW,EAAE;QACfA,YAAW,CAAC;UACViC,OAAO,EAAE,gBAAgB;UACzBD,KAAK,EAALA;QACF,CAAC,CAAC;MACJ;IACF,CAAE;IACF9B,OAAO,EAAE,SAAAA,QAAC8B,KAAK,EAAK;MAClB,IAAI9B,QAAO,EAAE;QACXA,QAAO,CAAC;UACNgC,cAAc,EAAEjC,YAAY;UAC5BgC,OAAO,EAAE,gBAAgB;UACzBD,KAAK,EAALA;QACF,CAAC,CAAC;MACJ;IACF,CAAE;IACF7B,SAAS,EAAE,SAAAA,UAAC6B,KAAK,EAAK;MACpB,IAAI7B,UAAS,EAAE;QACbA,UAAS,CAAC;UACR+B,cAAc,EAAEjC,YAAY;UAC5BgC,OAAO,EAAE,gBAAgB;UACzBD,KAAK,EAALA;QACF,CAAC,CAAC;MACJ;IACF,CAAE;IACFV,KAAK,EAAE,CAACpD,MAAM,CAACG,SAAS,EAAEA,SAAS,CAAE;IACrCuD,MAAM,EAAC,iBAAiB;IAAAL,MAAA,EAAAvD,KAAA;IAAAwD,QAAA;MAAAC,QAAA,EAAAxD,YAAA;MAAAyD,UAAA;MAAAC,YAAA;IAAA;EAAA,GAExBnE,MAAA,YAAA4D,aAAA,CAACzD,YAAA,CAAAwE,IAAI;IAACb,KAAK,EAAE,CAACpD,MAAM,CAACgB,kBAAkB,EAAE;MAAEkD,KAAK,EAAExB;IAAY,CAAC,EAAE1B,kBAAkB,CAAE;IAAAqC,MAAA,EAAAvD,KAAA;IAAAwD,QAAA;MAAAC,QAAA,EAAAxD,YAAA;MAAAyD,UAAA;MAAAC,YAAA;IAAA;EAAA,GAClF9B,OAAO,CAACsB,WAAW,KAAK,CAAC,GACtBb,CAAC,CAAC,gBAAgB,CAAC,GACnBA,CAAC,CAAC,iCAAiC,EAAE;IACnC+B,UAAU,EAAExC,OAAO,CAACsB;EACtB,CAAC,CACD,CACU,CAAC,EAClBvB,SAAS,KAAK,OAAO,IACpBpC,MAAA,YAAA4D,aAAA,CAACzD,YAAA,CAAA0D,IAAI;IAACC,KAAK,EAAEpD,MAAM,CAACO,cAAe;IAACmD,MAAM,EAAC,uBAAuB;IAAAL,MAAA,EAAAvD,KAAA;IAAAwD,QAAA;MAAAC,QAAA,EAAAxD,YAAA;MAAAyD,UAAA;MAAAC,YAAA;IAAA;EAAA,GAChEnE,MAAA,YAAA4D,aAAA,CAACtB,qBAAqB;IAACF,SAAS,EAAEA,SAAU;IAACC,OAAO,EAAEA,OAAQ;IAAA0B,MAAA,EAAAvD,KAAA;IAAAwD,QAAA;MAAAC,QAAA,EAAAxD,YAAA;MAAAyD,UAAA;MAAAC,YAAA;IAAA;EAAA,CAAE,CAAC,EAChE,CAAC5B,QAAQ,IACRvC,MAAA,YAAA4D,aAAA,CAACzD,YAAA,CAAA0D,IAAI;IACHC,KAAK,EAAE,CACL;MAAEO,WAAW,EAAExB;IAAkB,CAAC,EAClCnC,MAAM,CAACW,mBAAmB,EAC1BX,MAAM,CAACqB,wBAAwB,EAC/B2B,UAAU,CACV;IAAAK,MAAA,EAAAvD,KAAA;IAAAwD,QAAA;MAAAC,QAAA,EAAAxD,YAAA;MAAAyD,UAAA;MAAAC,YAAA;IAAA;EAAA,CACH,CAEC,CAEJ,CAAC;AAEX,CAAC;AAED,IAAMW,QAAQ,GAAG,SAAXA,QAAQA,CACZC,SAA6D,EAC7DC,SAA6D,EAC1D;EACH,IACWC,WAAW,GAKlBF,SAAS,CALX1C,OAAO;IACG6C,YAAY,GAIpBH,SAAS,CAJXxC,QAAQ;IACM4C,gBAAgB,GAG5BJ,SAAS,CAHXtC,YAAY;IACT2C,KAAK,GAENL,SAAS,CAFXjC,CAAC;IACWuC,cAAc,GACxBN,SAAS,CADXhC,UAAU;EAEZ,IACWuC,WAAW,GAKlBN,SAAS,CALX3C,OAAO;IACGkD,YAAY,GAIpBP,SAAS,CAJXzC,QAAQ;IACMiD,gBAAgB,GAG5BR,SAAS,CAHXvC,YAAY;IACTgD,KAAK,GAENT,SAAS,CAFXlC,CAAC;IACW4C,cAAc,GACxBV,SAAS,CADXjC,UAAU;EAGZ,IAAM4C,eAAe,GAAGN,cAAc,KAAKK,cAAc;EACzD,IAAI,CAACC,eAAe,EAAE,OAAO,KAAK;EAElC,IAAMC,sBAAsB,GAAGX,WAAW,CAACtB,WAAW,KAAK2B,WAAW,CAAC3B,WAAW;EAClF,IAAI,CAACiC,sBAAsB,EAAE,OAAO,KAAK;EAEzC,IAAMC,aAAa,GAAGX,YAAY,KAAKK,YAAY;EACnD,IAAI,CAACM,aAAa,EAAE,OAAO,KAAK;EAEhC,IAAMC,MAAM,GAAGV,KAAK,KAAKK,KAAK;EAC9B,IAAI,CAACK,MAAM,EAAE,OAAO,KAAK;EAEzB,IAAMC,iBAAiB,GAAGZ,gBAAgB,KAAKK,gBAAgB;EAC/D,IAAI,CAACO,iBAAiB,EAAE,OAAO,KAAK;EAEpC,OAAO,IAAI;AACb,CAAC;AAED,IAAMC,sBAAsB,GAAGC,iBAAK,CAACC,IAAI,CACvChE,yBAAyB,EACzB4C,QACF,CAAqC;AAM9B,IAAMqB,cAAc,GAAG,SAAjBA,cAAcA,CAGzBhE,KAA8C,EAC3C;EACH,IAAAiE,kBAAA,GASI,IAAAC,iCAAiB,EAAqB,CAAC;IARzCjE,SAAS,GAAAgE,kBAAA,CAAThE,SAAS;IACTC,OAAO,GAAA+D,kBAAA,CAAP/D,OAAO;IACPG,WAAW,GAAA4D,kBAAA,CAAX5D,WAAW;IACXC,YAAY,GAAA2D,kBAAA,CAAZ3D,YAAY;IACZC,OAAO,GAAA0D,kBAAA,CAAP1D,OAAO;IACPC,SAAS,GAAAyD,kBAAA,CAATzD,SAAS;IACTC,YAAY,GAAAwD,kBAAA,CAAZxD,YAAY;IACZG,UAAU,GAAAqD,kBAAA,CAAVrD,UAAU;EAEZ,IAAAuD,mBAAA,GAAkC,IAAAC,mCAAkB,EAAqB,CAAC;IAAlEjE,qBAAqB,GAAAgE,mBAAA,CAArBhE,qBAAqB;EAC7B,IAAAkE,qBAAA,GAAc,IAAAC,yCAAqB,EAAC,CAAC;IAA7B3D,CAAC,GAAA0D,qBAAA,CAAD1D,CAAC;EAET,OACE9C,MAAA,YAAA4D,aAAA,CAACoC,sBAAsB,MAAAU,SAAA;IAEnBtE,SAAS,EAATA,SAAS;IACTC,OAAO,EAAPA,OAAO;IACPC,qBAAqB,EAArBA,qBAAqB;IACrBE,WAAW,EAAXA,WAAW;IACXC,YAAY,EAAZA,YAAY;IACZC,OAAO,EAAPA,OAAO;IACPC,SAAS,EAATA,SAAS;IACTC,YAAY,EAAZA,YAAY;IACZE,CAAC,EAADA,CAAC;IACDC,UAAU,EAAVA;EAAU,GAERZ,KAAK;IAAA4B,MAAA,EAAAvD,KAAA;IAAAwD,QAAA;MAAAC,QAAA,EAAAxD,YAAA;MAAAyD,UAAA;MAAAC,YAAA;IAAA;EAAA,EACV,CAAC;AAEN,CAAC;AAACwC,OAAA,CAAAR,cAAA,GAAAA,cAAA;AAEFA,cAAc,CAACS,WAAW,GAAG,wCAAwC"}
package/lib/commonjs/components/Message/MessageSimple/MessageRepliesAvatars.js CHANGED
@@ -40,9 +40,7 @@ var MessageRepliesAvatarsWithContext = function MessageRepliesAvatarsWithContext
40
40
  var avatars = ((_message$thread_parti = message.thread_participants) == null ? void 0 : _message$thread_parti.slice(-2)) || [];
41
41
  var hasMoreThanOneReply = avatars.length > 1;
42
42
  return _react["default"].createElement(_reactNative.View, {
43
- style: [styles.avatarContainer, alignment === 'right' ? (0, _extends2["default"])({
44
- marginLeft: 8
45
- }, rightAvatarsContainer) : leftAvatarsContainer],
43
+ style: [styles.avatarContainer, alignment === 'right' ? rightAvatarsContainer : leftAvatarsContainer],
46
44
  __self: _this,
47
45
  __source: {
48
46
  fileName: _jsxFileName,
package/lib/commonjs/components/Message/MessageSimple/MessageRepliesAvatars.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"names":["_react","_interopRequireDefault","require","_reactNative","_ChatContext","_ThemeContext","_Avatar","_this","_jsxFileName","styles","StyleSheet","create","avatarContainer","alignItems","flexDirection","paddingTop","topAvatar","position","MessageRepliesAvatarsWithContext","props","_message$thread_parti","alignment","ImageComponent","message","_useTheme","useTheme","_useTheme$theme","theme","white_snow","colors","_useTheme$theme$messa","messageSimple","replies","avatar","avatarContainerMultiple","avatarContainerSingle","avatarSize","leftAvatarsContainer","rightAvatarsContainer","avatars","thread_participants","slice","hasMoreThanOneReply","length","createElement","View","style","_extends2","marginLeft","__self","__source","fileName","lineNumber","columnNumber","map","user","i","key","id","paddingLeft","Avatar","containerStyle","borderColor","borderWidth","image","name","size","exports","MessageRepliesAvatars","_useChatContext","useChatContext"],"sources":["MessageRepliesAvatars.tsx"],"sourcesContent":["import React from 'react';\nimport { StyleSheet, View } from 'react-native';\n\nimport { ChatContextValue, useChatContext } from '../../../contexts/chatContext/ChatContext';\nimport type { MessageContextValue } from '../../../contexts/messageContext/MessageContext';\nimport { useTheme } from '../../../contexts/themeContext/ThemeContext';\n\nimport type { DefaultStreamChatGenerics } from '../../../types/types';\nimport { Avatar } from '../../Avatar/Avatar';\n\nconst styles = StyleSheet.create({\n avatarContainer: {\n alignItems: 'center',\n flexDirection: 'row',\n paddingTop: 2,\n },\n topAvatar: {\n paddingTop: 2,\n position: 'absolute',\n },\n});\n\nexport type MessageRepliesAvatarsProps<\n StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n> = Pick<MessageContextValue<StreamChatGenerics>, 'alignment' | 'message'>;\n\nexport const MessageRepliesAvatarsWithContext = <\n StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n>(\n props: MessageRepliesAvatarsProps<StreamChatGenerics> & Pick<ChatContextValue, 'ImageComponent'>,\n) => {\n const { alignment, ImageComponent, message } = props;\n\n const {\n theme: {\n colors: { white_snow },\n messageSimple: {\n replies: {\n avatar,\n avatarContainerMultiple,\n avatarContainerSingle,\n avatarSize,\n leftAvatarsContainer,\n rightAvatarsContainer,\n },\n },\n },\n } = useTheme();\n\n const avatars = message.thread_participants?.slice(-2) || [];\n const hasMoreThanOneReply = avatars.length > 1;\n\n return (\n <View\n style={[\n styles.avatarContainer,\n alignment === 'right' ? { marginLeft: 8, ...rightAvatarsContainer } : leftAvatarsContainer,\n ]}\n >\n {avatars.map((user, i) => (\n <View\n key={user.id}\n style={\n i === 1\n ? { ...styles.topAvatar, ...avatarContainerSingle }\n : {\n paddingLeft: hasMoreThanOneReply ? 8 : 0,\n ...avatarContainerMultiple,\n }\n }\n >\n <Avatar\n containerStyle={[\n i === 1 && {\n borderColor: white_snow,\n borderWidth: 1,\n },\n avatar,\n ]}\n image={user.image}\n ImageComponent={ImageComponent}\n name={user.name}\n size={avatarSize ? avatarSize : i === 1 ? 18 : 16}\n />\n </View>\n ))}\n </View>\n );\n};\n\nexport const MessageRepliesAvatars = <\n StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n>(\n props: MessageRepliesAvatarsProps<StreamChatGenerics>,\n) => {\n const { ImageComponent } = useChatContext();\n\n return <MessageRepliesAvatarsWithContext {...props} ImageComponent={ImageComponent} />;\n};\n"],"mappings":"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"}
1
+ {"version":3,"names":["_react","_interopRequireDefault","require","_reactNative","_ChatContext","_ThemeContext","_Avatar","_this","_jsxFileName","styles","StyleSheet","create","avatarContainer","alignItems","flexDirection","paddingTop","topAvatar","position","MessageRepliesAvatarsWithContext","props","_message$thread_parti","alignment","ImageComponent","message","_useTheme","useTheme","_useTheme$theme","theme","white_snow","colors","_useTheme$theme$messa","messageSimple","replies","avatar","avatarContainerMultiple","avatarContainerSingle","avatarSize","leftAvatarsContainer","rightAvatarsContainer","avatars","thread_participants","slice","hasMoreThanOneReply","length","createElement","View","style","__self","__source","fileName","lineNumber","columnNumber","map","user","i","key","id","_extends2","paddingLeft","Avatar","containerStyle","borderColor","borderWidth","image","name","size","exports","MessageRepliesAvatars","_useChatContext","useChatContext"],"sources":["MessageRepliesAvatars.tsx"],"sourcesContent":["import React from 'react';\nimport { StyleSheet, View } from 'react-native';\n\nimport { ChatContextValue, useChatContext } from '../../../contexts/chatContext/ChatContext';\nimport type { MessageContextValue } from '../../../contexts/messageContext/MessageContext';\nimport { useTheme } from '../../../contexts/themeContext/ThemeContext';\n\nimport type { DefaultStreamChatGenerics } from '../../../types/types';\nimport { Avatar } from '../../Avatar/Avatar';\n\nconst styles = StyleSheet.create({\n avatarContainer: {\n alignItems: 'center',\n flexDirection: 'row',\n paddingTop: 2,\n },\n topAvatar: {\n paddingTop: 2,\n position: 'absolute',\n },\n});\n\nexport type MessageRepliesAvatarsProps<\n StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n> = Pick<MessageContextValue<StreamChatGenerics>, 'alignment' | 'message'>;\n\nexport const MessageRepliesAvatarsWithContext = <\n StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n>(\n props: MessageRepliesAvatarsProps<StreamChatGenerics> & Pick<ChatContextValue, 'ImageComponent'>,\n) => {\n const { alignment, ImageComponent, message } = props;\n\n const {\n theme: {\n colors: { white_snow },\n messageSimple: {\n replies: {\n avatar,\n avatarContainerMultiple,\n avatarContainerSingle,\n avatarSize,\n leftAvatarsContainer,\n rightAvatarsContainer,\n },\n },\n },\n } = useTheme();\n\n const avatars = message.thread_participants?.slice(-2) || [];\n const hasMoreThanOneReply = avatars.length > 1;\n\n return (\n <View\n style={[\n styles.avatarContainer,\n alignment === 'right' ? rightAvatarsContainer : leftAvatarsContainer,\n ]}\n >\n {avatars.map((user, i) => (\n <View\n key={user.id}\n style={\n i === 1\n ? { ...styles.topAvatar, ...avatarContainerSingle }\n : {\n paddingLeft: hasMoreThanOneReply ? 8 : 0,\n ...avatarContainerMultiple,\n }\n }\n >\n <Avatar\n containerStyle={[\n i === 1 && {\n borderColor: white_snow,\n borderWidth: 1,\n },\n avatar,\n ]}\n image={user.image}\n ImageComponent={ImageComponent}\n name={user.name}\n size={avatarSize ? avatarSize : i === 1 ? 18 : 16}\n />\n </View>\n ))}\n </View>\n );\n};\n\nexport const MessageRepliesAvatars = <\n StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n>(\n props: MessageRepliesAvatarsProps<StreamChatGenerics>,\n) => {\n const { ImageComponent } = useChatContext();\n\n return <MessageRepliesAvatarsWithContext {...props} ImageComponent={ImageComponent} />;\n};\n"],"mappings":"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"}
package/lib/commonjs/components/MessageOverlay/OverlayReactions.js CHANGED
@@ -4,6 +4,7 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.OverlayReactions = void 0;
7
+ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
7
8
  var _react = _interopRequireDefault(require("react"));
8
9
  var _reactNative = require("react-native");
9
10
  var _reactNativeGestureHandler = require("react-native-gesture-handler");
@@ -64,6 +65,10 @@ var styles = _reactNative.StyleSheet.create({
64
65
  fontSize: 16,
65
66
  fontWeight: '700',
66
67
  paddingTop: 16
68
+ },
69
+ unseenItemContainer: {
70
+ opacity: 0,
71
+ position: 'absolute'
67
72
  }
68
73
  });
69
74
  var reactionData = [{
@@ -98,7 +103,7 @@ var ReactionIcon = function ReactionIcon(_ref) {
98
103
  __self: _this,
99
104
  __source: {
100
105
  fileName: _jsxFileName,
101
- lineNumber: 123,
106
+ lineNumber: 127,
102
107
  columnNumber: 10
103
108
  }
104
109
  });
@@ -113,6 +118,10 @@ var OverlayReactions = function OverlayReactions(props) {
113
118
  OverlayReactionsAvatar = props.OverlayReactionsAvatar;
114
119
  var layoutHeight = (0, _reactNativeReanimated.useSharedValue)(0);
115
120
  var layoutWidth = (0, _reactNativeReanimated.useSharedValue)(0);
121
+ var _React$useState = _react["default"].useState(0),
122
+ _React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
123
+ itemHeight = _React$useState2[0],
124
+ setItemHeight = _React$useState2[1];
116
125
  var _useTheme = (0, _ThemeContext.useTheme)(),
117
126
  _useTheme$theme = _useTheme.theme,
118
127
  _useTheme$theme$color = _useTheme$theme.colors,
@@ -133,7 +142,6 @@ var OverlayReactions = function OverlayReactions(props) {
133
142
  reactionBubbleBackground = _useTheme$theme$overl2.reactionBubbleBackground,
134
143
  titleStyle = _useTheme$theme$overl2.title;
135
144
  var width = (0, _reactNative.useWindowDimensions)().width;
136
- var height = (0, _reactNative.useWindowDimensions)().height;
137
145
  var supportedReactionTypes = supportedReactions.map(function (supportedReaction) {
138
146
  return supportedReaction.type;
139
147
  });
@@ -141,7 +149,6 @@ var OverlayReactions = function OverlayReactions(props) {
141
149
  return supportedReactionTypes.includes(reaction.type);
142
150
  });
143
151
  var numColumns = Math.floor((width - overlayPadding * 2 - ((Number(flatListContainer.paddingHorizontal || 0) || styles.flatListContainer.paddingHorizontal) + (Number(avatarContainer.padding || 0) || styles.avatarContainer.padding)) * 2) / (avatarSize + (Number(avatarContainer.padding || 0) || styles.avatarContainer.padding) * 2));
144
- var maxHeight = Math.floor(height - overlayPadding * 2 - ((Number(flatListContainer.paddingVertical || 0) || styles.flatListContainer.paddingVertical) + (Number(avatarContainer.padding || 0) || styles.avatarContainer.padding)) * 2);
145
152
  var renderItem = function renderItem(_ref2) {
146
153
  var item = _ref2.item;
147
154
  var _item$alignment = item.alignment,
@@ -157,7 +164,7 @@ var OverlayReactions = function OverlayReactions(props) {
157
164
  __self: _this,
158
165
  __source: {
159
166
  fileName: _jsxFileName,
160
- lineNumber: 208,
167
+ lineNumber: 204,
161
168
  columnNumber: 7
162
169
  }
163
170
  }, _react["default"].createElement(_reactNative.View, {
@@ -165,7 +172,7 @@ var OverlayReactions = function OverlayReactions(props) {
165
172
  __self: _this,
166
173
  __source: {
167
174
  fileName: _jsxFileName,
168
- lineNumber: 209,
175
+ lineNumber: 205,
169
176
  columnNumber: 9
170
177
  }
171
178
  }, _react["default"].createElement(OverlayReactionsAvatar, {
@@ -174,7 +181,7 @@ var OverlayReactions = function OverlayReactions(props) {
174
181
  __self: _this,
175
182
  __source: {
176
183
  fileName: _jsxFileName,
177
- lineNumber: 210,
184
+ lineNumber: 206,
178
185
  columnNumber: 11
179
186
  }
180
187
  }), _react["default"].createElement(_reactNative.View, {
@@ -182,14 +189,14 @@ var OverlayReactions = function OverlayReactions(props) {
182
189
  __self: _this,
183
190
  __source: {
184
191
  fileName: _jsxFileName,
185
- lineNumber: 211,
192
+ lineNumber: 207,
186
193
  columnNumber: 11
187
194
  }
188
195
  }, _react["default"].createElement(_reactNativeSvg["default"], {
189
196
  __self: _this,
190
197
  __source: {
191
198
  fileName: _jsxFileName,
192
- lineNumber: 212,
199
+ lineNumber: 208,
193
200
  columnNumber: 13
194
201
  }
195
202
  }, _react["default"].createElement(_reactNativeSvg.Circle, {
@@ -202,7 +209,7 @@ var OverlayReactions = function OverlayReactions(props) {
202
209
  __self: _this,
203
210
  __source: {
204
211
  fileName: _jsxFileName,
205
- lineNumber: 213,
212
+ lineNumber: 209,
206
213
  columnNumber: 15
207
214
  }
208
215
  }), _react["default"].createElement(_reactNativeSvg.Circle, {
@@ -215,7 +222,7 @@ var OverlayReactions = function OverlayReactions(props) {
215
222
  __self: _this,
216
223
  __source: {
217
224
  fileName: _jsxFileName,
218
- lineNumber: 221,
225
+ lineNumber: 217,
219
226
  columnNumber: 15
220
227
  }
221
228
  })), _react["default"].createElement(_reactNative.View, {
@@ -229,7 +236,7 @@ var OverlayReactions = function OverlayReactions(props) {
229
236
  __self: _this,
230
237
  __source: {
231
238
  fileName: _jsxFileName,
232
- lineNumber: 230,
239
+ lineNumber: 226,
233
240
  columnNumber: 13
234
241
  }
235
242
  }), _react["default"].createElement(_reactNative.View, {
@@ -237,14 +244,14 @@ var OverlayReactions = function OverlayReactions(props) {
237
244
  __self: _this,
238
245
  __source: {
239
246
  fileName: _jsxFileName,
240
- lineNumber: 243,
247
+ lineNumber: 239,
241
248
  columnNumber: 13
242
249
  }
243
250
  }, _react["default"].createElement(_reactNativeSvg["default"], {
244
251
  __self: _this,
245
252
  __source: {
246
253
  fileName: _jsxFileName,
247
- lineNumber: 244,
254
+ lineNumber: 240,
248
255
  columnNumber: 15
249
256
  }
250
257
  }, _react["default"].createElement(_reactNativeSvg.Circle, {
@@ -255,7 +262,7 @@ var OverlayReactions = function OverlayReactions(props) {
255
262
  __self: _this,
256
263
  __source: {
257
264
  fileName: _jsxFileName,
258
- lineNumber: 245,
265
+ lineNumber: 241,
259
266
  columnNumber: 17
260
267
  }
261
268
  }))), _react["default"].createElement(_reactNative.View, {
@@ -269,7 +276,7 @@ var OverlayReactions = function OverlayReactions(props) {
269
276
  __self: _this,
270
277
  __source: {
271
278
  fileName: _jsxFileName,
272
- lineNumber: 253,
279
+ lineNumber: 249,
273
280
  columnNumber: 13
274
281
  }
275
282
  }, _react["default"].createElement(ReactionIcon, {
@@ -280,7 +287,7 @@ var OverlayReactions = function OverlayReactions(props) {
280
287
  __self: _this,
281
288
  __source: {
282
289
  fileName: _jsxFileName,
283
- lineNumber: 270,
290
+ lineNumber: 266,
284
291
  columnNumber: 15
285
292
  }
286
293
  })))), _react["default"].createElement(_reactNative.View, {
@@ -288,7 +295,7 @@ var OverlayReactions = function OverlayReactions(props) {
288
295
  __self: _this,
289
296
  __source: {
290
297
  fileName: _jsxFileName,
291
- lineNumber: 279,
298
+ lineNumber: 275,
292
299
  columnNumber: 9
293
300
  }
294
301
  }, _react["default"].createElement(_reactNative.Text, {
@@ -298,7 +305,7 @@ var OverlayReactions = function OverlayReactions(props) {
298
305
  __self: _this,
299
306
  __source: {
300
307
  fileName: _jsxFileName,
301
- lineNumber: 280,
308
+ lineNumber: 276,
302
309
  columnNumber: 11
303
310
  }
304
311
  }, name)));
@@ -314,20 +321,21 @@ var OverlayReactions = function OverlayReactions(props) {
314
321
  }]
315
322
  };
316
323
  }, [overlayAlignment]);
317
- return _react["default"].createElement(_reactNativeReanimated["default"].View, {
324
+ return _react["default"].createElement(_react["default"].Fragment, null, _react["default"].createElement(_reactNativeReanimated["default"].View, {
318
325
  onLayout: function onLayout(_ref3) {
319
326
  var layout = _ref3.nativeEvent.layout;
320
327
  layoutWidth.value = layout.width;
321
328
  layoutHeight.value = layout.height;
322
329
  },
323
330
  style: [styles.container, {
324
- backgroundColor: white
331
+ backgroundColor: white,
332
+ opacity: itemHeight ? 1 : 0
325
333
  }, container, showScreenStyle],
326
334
  __self: _this,
327
335
  __source: {
328
336
  fileName: _jsxFileName,
329
- lineNumber: 308,
330
- columnNumber: 5
337
+ lineNumber: 305,
338
+ columnNumber: 7
331
339
  }
332
340
  }, _react["default"].createElement(_reactNative.Text, {
333
341
  style: [styles.title, {
@@ -336,12 +344,13 @@ var OverlayReactions = function OverlayReactions(props) {
336
344
  __self: _this,
337
345
  __source: {
338
346
  fileName: _jsxFileName,
339
- lineNumber: 315,
340
- columnNumber: 7
347
+ lineNumber: 317,
348
+ columnNumber: 9
341
349
  }
342
350
  }, title), _react["default"].createElement(_reactNativeGestureHandler.FlatList, {
343
351
  contentContainerStyle: styles.flatListContentContainer,
344
352
  data: filteredReactions,
353
+ key: numColumns,
345
354
  keyExtractor: function keyExtractor(_ref4, index) {
346
355
  var name = _ref4.name;
347
356
  return name + "_" + index;
@@ -349,15 +358,29 @@ var OverlayReactions = function OverlayReactions(props) {
349
358
  numColumns: numColumns,
350
359
  renderItem: renderItem,
351
360
  style: [styles.flatListContainer, flatListContainer, {
352
- maxHeight: maxHeight / numColumns
361
+ maxHeight: itemHeight + (filteredReactions.length / numColumns > 1 ? itemHeight / 8 : 0)
353
362
  }],
354
363
  __self: _this,
355
364
  __source: {
356
365
  fileName: _jsxFileName,
357
- lineNumber: 316,
358
- columnNumber: 7
366
+ lineNumber: 318,
367
+ columnNumber: 9
368
+ }
369
+ }), _react["default"].createElement(_reactNative.View, {
370
+ onLayout: function onLayout(_ref5) {
371
+ var layout = _ref5.nativeEvent.layout;
372
+ setItemHeight(layout.height);
373
+ },
374
+ style: [styles.unseenItemContainer, styles.flatListContentContainer],
375
+ __self: _this,
376
+ __source: {
377
+ fileName: _jsxFileName,
378
+ lineNumber: 336,
379
+ columnNumber: 9
359
380
  }
360
- }));
381
+ }, renderItem({
382
+ item: filteredReactions[0]
383
+ }))));
361
384
  };
362
385
  exports.OverlayReactions = OverlayReactions;
363
386
  OverlayReactions.displayName = 'OverlayReactions{overlay{reactions}}';