@kesha-antonov/react-native-chat 4.1.0
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.
- package/LICENSE +22 -0
- package/README.md +1087 -0
- package/lib/Actions.d.ts +16 -0
- package/lib/Actions.d.ts.map +1 -0
- package/lib/Actions.js +64 -0
- package/lib/Actions.js.map +1 -0
- package/lib/Avatar.d.ts +19 -0
- package/lib/Avatar.d.ts.map +1 -0
- package/lib/Avatar.js +93 -0
- package/lib/Avatar.js.map +1 -0
- package/lib/Bubble/index.d.ts +6 -0
- package/lib/Bubble/index.d.ts.map +1 -0
- package/lib/Bubble/index.js +391 -0
- package/lib/Bubble/index.js.map +1 -0
- package/lib/Bubble/styles.d.ts +57 -0
- package/lib/Bubble/styles.d.ts.map +1 -0
- package/lib/Bubble/styles.js +59 -0
- package/lib/Bubble/styles.js.map +1 -0
- package/lib/Bubble/types.d.ts +62 -0
- package/lib/Bubble/types.d.ts.map +1 -0
- package/lib/Bubble/types.js +2 -0
- package/lib/Bubble/types.js.map +1 -0
- package/lib/Chat/index.d.ts +10 -0
- package/lib/Chat/index.d.ts.map +1 -0
- package/lib/Chat/index.js +243 -0
- package/lib/Chat/index.js.map +1 -0
- package/lib/Chat/styles.d.ts +13 -0
- package/lib/Chat/styles.d.ts.map +1 -0
- package/lib/Chat/styles.js +13 -0
- package/lib/Chat/styles.js.map +1 -0
- package/lib/Chat/types.d.ts +102 -0
- package/lib/Chat/types.d.ts.map +1 -0
- package/lib/Chat/types.js +2 -0
- package/lib/Chat/types.js.map +1 -0
- package/lib/ChatAvatar.d.ts +12 -0
- package/lib/ChatAvatar.d.ts.map +1 -0
- package/lib/ChatAvatar.js +100 -0
- package/lib/ChatAvatar.js.map +1 -0
- package/lib/ChatContext.d.ts +12 -0
- package/lib/ChatContext.d.ts.map +1 -0
- package/lib/ChatContext.js +10 -0
- package/lib/ChatContext.js.map +1 -0
- package/lib/Color.d.ts +18 -0
- package/lib/Color.d.ts.map +1 -0
- package/lib/Color.js +18 -0
- package/lib/Color.js.map +1 -0
- package/lib/Composer.d.ts +9 -0
- package/lib/Composer.d.ts.map +1 -0
- package/lib/Composer.js +63 -0
- package/lib/Composer.js.map +1 -0
- package/lib/Constant.d.ts +8 -0
- package/lib/Constant.d.ts.map +1 -0
- package/lib/Constant.js +8 -0
- package/lib/Constant.js.map +1 -0
- package/lib/Day/index.d.ts +5 -0
- package/lib/Day/index.d.ts.map +1 -0
- package/lib/Day/index.js +39 -0
- package/lib/Day/index.js.map +1 -0
- package/lib/Day/styles.d.ts +21 -0
- package/lib/Day/styles.d.ts.map +1 -0
- package/lib/Day/styles.js +22 -0
- package/lib/Day/styles.js.map +1 -0
- package/lib/Day/types.d.ts +17 -0
- package/lib/Day/types.d.ts.map +1 -0
- package/lib/Day/types.js +2 -0
- package/lib/Day/types.js.map +1 -0
- package/lib/InputToolbar.d.ts +36 -0
- package/lib/InputToolbar.d.ts.map +1 -0
- package/lib/InputToolbar.js +108 -0
- package/lib/InputToolbar.js.map +1 -0
- package/lib/LoadEarlierMessages.d.ts +17 -0
- package/lib/LoadEarlierMessages.d.ts.map +1 -0
- package/lib/LoadEarlierMessages.js +44 -0
- package/lib/LoadEarlierMessages.js.map +1 -0
- package/lib/Message/index.d.ts +6 -0
- package/lib/Message/index.d.ts.map +1 -0
- package/lib/Message/index.js +180 -0
- package/lib/Message/index.js.map +1 -0
- package/lib/Message/styles.d.ts +18 -0
- package/lib/Message/styles.d.ts.map +1 -0
- package/lib/Message/styles.js +18 -0
- package/lib/Message/styles.js.map +1 -0
- package/lib/Message/types.d.ts +28 -0
- package/lib/Message/types.d.ts.map +1 -0
- package/lib/Message/types.js +2 -0
- package/lib/Message/types.js.map +1 -0
- package/lib/MessageAudio.d.ts +3 -0
- package/lib/MessageAudio.d.ts.map +1 -0
- package/lib/MessageAudio.js +24 -0
- package/lib/MessageAudio.js.map +1 -0
- package/lib/MessageImage.d.ts +12 -0
- package/lib/MessageImage.d.ts.map +1 -0
- package/lib/MessageImage.js +164 -0
- package/lib/MessageImage.js.map +1 -0
- package/lib/MessageReply.d.ts +15 -0
- package/lib/MessageReply.d.ts.map +1 -0
- package/lib/MessageReply.js +102 -0
- package/lib/MessageReply.js.map +1 -0
- package/lib/MessageText.d.ts +24 -0
- package/lib/MessageText.d.ts.map +1 -0
- package/lib/MessageText.js +51 -0
- package/lib/MessageText.js.map +1 -0
- package/lib/MessageVideo.d.ts +3 -0
- package/lib/MessageVideo.d.ts.map +1 -0
- package/lib/MessageVideo.js +24 -0
- package/lib/MessageVideo.js.map +1 -0
- package/lib/MessagesContainer/components/DayAnimated/debug.d.ts +8 -0
- package/lib/MessagesContainer/components/DayAnimated/debug.d.ts.map +1 -0
- package/lib/MessagesContainer/components/DayAnimated/debug.js +38 -0
- package/lib/MessagesContainer/components/DayAnimated/debug.js.map +1 -0
- package/lib/MessagesContainer/components/DayAnimated/index.d.ts +5 -0
- package/lib/MessagesContainer/components/DayAnimated/index.d.ts.map +1 -0
- package/lib/MessagesContainer/components/DayAnimated/index.js +123 -0
- package/lib/MessagesContainer/components/DayAnimated/index.js.map +1 -0
- package/lib/MessagesContainer/components/DayAnimated/styles.d.ts +12 -0
- package/lib/MessagesContainer/components/DayAnimated/styles.d.ts.map +1 -0
- package/lib/MessagesContainer/components/DayAnimated/styles.js +12 -0
- package/lib/MessagesContainer/components/DayAnimated/styles.js.map +1 -0
- package/lib/MessagesContainer/components/DayAnimated/types.d.ts +22 -0
- package/lib/MessagesContainer/components/DayAnimated/types.d.ts.map +1 -0
- package/lib/MessagesContainer/components/DayAnimated/types.js +2 -0
- package/lib/MessagesContainer/components/DayAnimated/types.js.map +1 -0
- package/lib/MessagesContainer/components/DayAnimated/useScrollGatedOpacity.d.ts +4 -0
- package/lib/MessagesContainer/components/DayAnimated/useScrollGatedOpacity.d.ts.map +1 -0
- package/lib/MessagesContainer/components/DayAnimated/useScrollGatedOpacity.js +37 -0
- package/lib/MessagesContainer/components/DayAnimated/useScrollGatedOpacity.js.map +1 -0
- package/lib/MessagesContainer/components/Item/index.d.ts +6 -0
- package/lib/MessagesContainer/components/Item/index.d.ts.map +1 -0
- package/lib/MessagesContainer/components/Item/index.js +86 -0
- package/lib/MessagesContainer/components/Item/index.js.map +1 -0
- package/lib/MessagesContainer/components/Item/types.d.ts +22 -0
- package/lib/MessagesContainer/components/Item/types.d.ts.map +1 -0
- package/lib/MessagesContainer/components/Item/types.js +2 -0
- package/lib/MessagesContainer/components/Item/types.js.map +1 -0
- package/lib/MessagesContainer/components/dayLayout.d.ts +10 -0
- package/lib/MessagesContainer/components/dayLayout.d.ts.map +1 -0
- package/lib/MessagesContainer/components/dayLayout.js +37 -0
- package/lib/MessagesContainer/components/dayLayout.js.map +1 -0
- package/lib/MessagesContainer/index.d.ts +6 -0
- package/lib/MessagesContainer/index.d.ts.map +1 -0
- package/lib/MessagesContainer/index.js +308 -0
- package/lib/MessagesContainer/index.js.map +1 -0
- package/lib/MessagesContainer/styles.d.ts +55 -0
- package/lib/MessagesContainer/styles.d.ts.map +1 -0
- package/lib/MessagesContainer/styles.js +42 -0
- package/lib/MessagesContainer/styles.js.map +1 -0
- package/lib/MessagesContainer/types.d.ts +91 -0
- package/lib/MessagesContainer/types.d.ts.map +1 -0
- package/lib/MessagesContainer/types.js +10 -0
- package/lib/MessagesContainer/types.js.map +1 -0
- package/lib/Models.d.ts +67 -0
- package/lib/Models.d.ts.map +1 -0
- package/lib/Models.js +2 -0
- package/lib/Models.js.map +1 -0
- package/lib/QuickReplies.d.ts +16 -0
- package/lib/QuickReplies.d.ts.map +1 -0
- package/lib/QuickReplies.js +107 -0
- package/lib/QuickReplies.js.map +1 -0
- package/lib/Reactions/MessageReactions.d.ts +5 -0
- package/lib/Reactions/MessageReactions.d.ts.map +1 -0
- package/lib/Reactions/MessageReactions.js +83 -0
- package/lib/Reactions/MessageReactions.js.map +1 -0
- package/lib/Reactions/ReactionPicker.d.ts +10 -0
- package/lib/Reactions/ReactionPicker.d.ts.map +1 -0
- package/lib/Reactions/ReactionPicker.js +84 -0
- package/lib/Reactions/ReactionPicker.js.map +1 -0
- package/lib/Reactions/index.d.ts +6 -0
- package/lib/Reactions/index.d.ts.map +1 -0
- package/lib/Reactions/index.js +6 -0
- package/lib/Reactions/index.js.map +1 -0
- package/lib/Reactions/types.d.ts +79 -0
- package/lib/Reactions/types.d.ts.map +1 -0
- package/lib/Reactions/types.js +2 -0
- package/lib/Reactions/types.js.map +1 -0
- package/lib/Reply/index.d.ts +2 -0
- package/lib/Reply/index.d.ts.map +1 -0
- package/lib/Reply/index.js +2 -0
- package/lib/Reply/index.js.map +1 -0
- package/lib/Reply/types.d.ts +72 -0
- package/lib/Reply/types.d.ts.map +1 -0
- package/lib/Reply/types.js +2 -0
- package/lib/Reply/types.js.map +1 -0
- package/lib/ReplyPreview.d.ts +14 -0
- package/lib/ReplyPreview.d.ts.map +1 -0
- package/lib/ReplyPreview.js +94 -0
- package/lib/ReplyPreview.js.map +1 -0
- package/lib/Send.d.ts +19 -0
- package/lib/Send.d.ts.map +1 -0
- package/lib/Send.js +56 -0
- package/lib/Send.js.map +1 -0
- package/lib/SystemMessage.d.ts +14 -0
- package/lib/SystemMessage.d.ts.map +1 -0
- package/lib/SystemMessage.js +42 -0
- package/lib/SystemMessage.js.map +1 -0
- package/lib/Time.d.ts +12 -0
- package/lib/Time.d.ts.map +1 -0
- package/lib/Time.js +38 -0
- package/lib/Time.js.map +1 -0
- package/lib/TypingIndicator/index.d.ts +5 -0
- package/lib/TypingIndicator/index.d.ts.map +1 -0
- package/lib/TypingIndicator/index.js +94 -0
- package/lib/TypingIndicator/index.js.map +1 -0
- package/lib/TypingIndicator/styles.d.ts +21 -0
- package/lib/TypingIndicator/styles.d.ts.map +1 -0
- package/lib/TypingIndicator/styles.js +22 -0
- package/lib/TypingIndicator/styles.js.map +1 -0
- package/lib/TypingIndicator/types.d.ts +6 -0
- package/lib/TypingIndicator/types.d.ts.map +1 -0
- package/lib/TypingIndicator/types.js +2 -0
- package/lib/TypingIndicator/types.js.map +1 -0
- package/lib/components/MessageReply.d.ts +29 -0
- package/lib/components/MessageReply.d.ts.map +1 -0
- package/lib/components/MessageReply.js +87 -0
- package/lib/components/MessageReply.js.map +1 -0
- package/lib/components/ReplyPreview.d.ts +17 -0
- package/lib/components/ReplyPreview.d.ts.map +1 -0
- package/lib/components/ReplyPreview.js +148 -0
- package/lib/components/ReplyPreview.js.map +1 -0
- package/lib/components/StreamingCursor.d.ts +15 -0
- package/lib/components/StreamingCursor.d.ts.map +1 -0
- package/lib/components/StreamingCursor.js +16 -0
- package/lib/components/StreamingCursor.js.map +1 -0
- package/lib/components/TouchableOpacity.d.ts +9 -0
- package/lib/components/TouchableOpacity.d.ts.map +1 -0
- package/lib/components/TouchableOpacity.js +47 -0
- package/lib/components/TouchableOpacity.js.map +1 -0
- package/lib/hooks/useColorScheme.d.ts +8 -0
- package/lib/hooks/useColorScheme.d.ts.map +1 -0
- package/lib/hooks/useColorScheme.js +17 -0
- package/lib/hooks/useColorScheme.js.map +1 -0
- package/lib/hooks/useStreamingMessages.d.ts +42 -0
- package/lib/hooks/useStreamingMessages.d.ts.map +1 -0
- package/lib/hooks/useStreamingMessages.js +96 -0
- package/lib/hooks/useStreamingMessages.js.map +1 -0
- package/lib/hooks/useUpdateLayoutEffect.d.ts +9 -0
- package/lib/hooks/useUpdateLayoutEffect.d.ts.map +1 -0
- package/lib/hooks/useUpdateLayoutEffect.js +17 -0
- package/lib/hooks/useUpdateLayoutEffect.js.map +1 -0
- package/lib/index.d.ts +35 -0
- package/lib/index.d.ts.map +1 -0
- package/lib/index.js +34 -0
- package/lib/index.js.map +1 -0
- package/lib/linkParser.d.ts +39 -0
- package/lib/linkParser.d.ts.map +1 -0
- package/lib/linkParser.js +154 -0
- package/lib/linkParser.js.map +1 -0
- package/lib/logging.d.ts +3 -0
- package/lib/logging.d.ts.map +1 -0
- package/lib/logging.js +5 -0
- package/lib/logging.js.map +1 -0
- package/lib/styles.d.ts +14 -0
- package/lib/styles.d.ts.map +1 -0
- package/lib/styles.js +23 -0
- package/lib/styles.js.map +1 -0
- package/lib/types.d.ts +19 -0
- package/lib/types.d.ts.map +1 -0
- package/lib/types.js +2 -0
- package/lib/types.js.map +1 -0
- package/lib/utils.d.ts +8 -0
- package/lib/utils.d.ts.map +1 -0
- package/lib/utils.js +105 -0
- package/lib/utils.js.map +1 -0
- package/package.json +119 -0
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/TypingIndicator/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AAEnD,MAAM,WAAW,oBAAoB;IACnC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAA;CAC7B"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.js","sourceRoot":"","sources":["../../src/TypingIndicator/types.ts"],"names":[],"mappings":""}
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { ImageStyle, StyleProp, TextStyle, ViewStyle } from 'react-native';
|
|
3
|
+
import { IMessage, ReplyMessage } from '../Models';
|
|
4
|
+
export interface MessageReplyProps<TMessage extends IMessage = IMessage> {
|
|
5
|
+
/** The reply message to display */
|
|
6
|
+
replyMessage: ReplyMessage;
|
|
7
|
+
/** The current message containing the reply */
|
|
8
|
+
currentMessage: TMessage;
|
|
9
|
+
/** Position of the bubble (left or right) */
|
|
10
|
+
position: 'left' | 'right';
|
|
11
|
+
/** Container style for the reply */
|
|
12
|
+
containerStyle?: StyleProp<ViewStyle>;
|
|
13
|
+
/** Container style for left position */
|
|
14
|
+
containerStyleLeft?: StyleProp<ViewStyle>;
|
|
15
|
+
/** Container style for right position */
|
|
16
|
+
containerStyleRight?: StyleProp<ViewStyle>;
|
|
17
|
+
/** Text style for the reply */
|
|
18
|
+
textStyle?: StyleProp<TextStyle>;
|
|
19
|
+
/** Text style for left position */
|
|
20
|
+
textStyleLeft?: StyleProp<TextStyle>;
|
|
21
|
+
/** Text style for right position */
|
|
22
|
+
textStyleRight?: StyleProp<TextStyle>;
|
|
23
|
+
/** Image style for the reply */
|
|
24
|
+
imageStyle?: StyleProp<ImageStyle>;
|
|
25
|
+
/** Callback when reply is pressed */
|
|
26
|
+
onPress?: (replyMessage: ReplyMessage) => void;
|
|
27
|
+
}
|
|
28
|
+
export declare function MessageReply<TMessage extends IMessage = IMessage>({ replyMessage, currentMessage, position, containerStyle, containerStyleLeft, containerStyleRight, textStyle, textStyleLeft, textStyleRight, imageStyle, onPress, }: MessageReplyProps<TMessage>): React.JSX.Element;
|
|
29
|
+
//# sourceMappingURL=MessageReply.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MessageReply.d.ts","sourceRoot":"","sources":["../../src/components/MessageReply.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkB,MAAM,OAAO,CAAA;AACtC,OAAO,EAEL,UAAU,EAEV,SAAS,EAGT,SAAS,EAET,SAAS,EACV,MAAM,cAAc,CAAA;AAErB,OAAO,EAAE,QAAQ,EAAE,YAAY,EAAE,MAAM,WAAW,CAAA;AAGlD,MAAM,WAAW,iBAAiB,CAAC,QAAQ,SAAS,QAAQ,GAAG,QAAQ;IACrE,mCAAmC;IACnC,YAAY,EAAE,YAAY,CAAA;IAC1B,+CAA+C;IAC/C,cAAc,EAAE,QAAQ,CAAA;IACxB,6CAA6C;IAC7C,QAAQ,EAAE,MAAM,GAAG,OAAO,CAAA;IAC1B,oCAAoC;IACpC,cAAc,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAA;IACrC,wCAAwC;IACxC,kBAAkB,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAA;IACzC,yCAAyC;IACzC,mBAAmB,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAA;IAC1C,+BAA+B;IAC/B,SAAS,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAA;IAChC,mCAAmC;IACnC,aAAa,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAA;IACpC,oCAAoC;IACpC,cAAc,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAA;IACrC,gCAAgC;IAChC,UAAU,CAAC,EAAE,SAAS,CAAC,UAAU,CAAC,CAAA;IAClC,qCAAqC;IACrC,OAAO,CAAC,EAAE,CAAC,YAAY,EAAE,YAAY,KAAK,IAAI,CAAA;CAC/C;AA8CD,wBAAgB,YAAY,CAAC,QAAQ,SAAS,QAAQ,GAAG,QAAQ,EAAG,EAClE,YAAY,EACZ,cAAc,EACd,QAAQ,EACR,cAAc,EACd,kBAAkB,EAClB,mBAAmB,EACnB,SAAS,EACT,aAAa,EACb,cAAc,EACd,UAAU,EACV,OAAO,GACR,EAAE,iBAAiB,CAAC,QAAQ,CAAC,qBA0D7B"}
|
|
@@ -0,0 +1,87 @@
|
|
|
1
|
+
import React, { useMemo } from 'react';
|
|
2
|
+
import { Image, Pressable, StyleSheet, Text, View, } from 'react-native';
|
|
3
|
+
import { isSameUser } from '../utils';
|
|
4
|
+
const styles = StyleSheet.create({
|
|
5
|
+
container: {
|
|
6
|
+
borderRadius: 8,
|
|
7
|
+
marginBottom: 4,
|
|
8
|
+
paddingHorizontal: 10,
|
|
9
|
+
paddingVertical: 6,
|
|
10
|
+
},
|
|
11
|
+
containerLeft: {
|
|
12
|
+
backgroundColor: 'rgba(0, 0, 0, 0.06)',
|
|
13
|
+
borderLeftColor: '#0084ff',
|
|
14
|
+
borderLeftWidth: 3,
|
|
15
|
+
},
|
|
16
|
+
containerRight: {
|
|
17
|
+
backgroundColor: 'rgba(255, 255, 255, 0.15)',
|
|
18
|
+
borderLeftColor: 'rgba(255, 255, 255, 0.6)',
|
|
19
|
+
borderLeftWidth: 3,
|
|
20
|
+
},
|
|
21
|
+
image: {
|
|
22
|
+
borderRadius: 4,
|
|
23
|
+
height: 40,
|
|
24
|
+
marginTop: 4,
|
|
25
|
+
width: 40,
|
|
26
|
+
},
|
|
27
|
+
text: {
|
|
28
|
+
fontSize: 13,
|
|
29
|
+
},
|
|
30
|
+
textLeft: {
|
|
31
|
+
color: '#333',
|
|
32
|
+
},
|
|
33
|
+
textRight: {
|
|
34
|
+
color: 'rgba(255, 255, 255, 0.9)',
|
|
35
|
+
},
|
|
36
|
+
username: {
|
|
37
|
+
fontWeight: '600',
|
|
38
|
+
marginBottom: 2,
|
|
39
|
+
},
|
|
40
|
+
usernameLeft: {
|
|
41
|
+
color: '#0084ff',
|
|
42
|
+
},
|
|
43
|
+
usernameRight: {
|
|
44
|
+
color: 'rgba(255, 255, 255, 0.9)',
|
|
45
|
+
},
|
|
46
|
+
});
|
|
47
|
+
export function MessageReply({ replyMessage, currentMessage, position, containerStyle, containerStyleLeft, containerStyleRight, textStyle, textStyleLeft, textStyleRight, imageStyle, onPress, }) {
|
|
48
|
+
const isCurrentUser = useMemo(() => isSameUser(currentMessage, { user: replyMessage.user }), [currentMessage, replyMessage.user]);
|
|
49
|
+
const displayName = useMemo(() => {
|
|
50
|
+
if (isCurrentUser)
|
|
51
|
+
return 'You';
|
|
52
|
+
return replyMessage.user?.name || 'Unknown';
|
|
53
|
+
}, [isCurrentUser, replyMessage.user?.name]);
|
|
54
|
+
const handlePress = () => {
|
|
55
|
+
onPress?.(replyMessage);
|
|
56
|
+
};
|
|
57
|
+
const containerStyles = [
|
|
58
|
+
styles.container,
|
|
59
|
+
position === 'left' ? styles.containerLeft : styles.containerRight,
|
|
60
|
+
containerStyle,
|
|
61
|
+
position === 'left' ? containerStyleLeft : containerStyleRight,
|
|
62
|
+
];
|
|
63
|
+
const usernameStyles = [
|
|
64
|
+
styles.username,
|
|
65
|
+
position === 'left' ? styles.usernameLeft : styles.usernameRight,
|
|
66
|
+
textStyle,
|
|
67
|
+
position === 'left' ? textStyleLeft : textStyleRight,
|
|
68
|
+
];
|
|
69
|
+
const textStyles = [
|
|
70
|
+
styles.text,
|
|
71
|
+
position === 'left' ? styles.textLeft : styles.textRight,
|
|
72
|
+
textStyle,
|
|
73
|
+
position === 'left' ? textStyleLeft : textStyleRight,
|
|
74
|
+
];
|
|
75
|
+
return (<Pressable onPress={handlePress}>
|
|
76
|
+
<View style={containerStyles}>
|
|
77
|
+
<Text style={usernameStyles} numberOfLines={1}>
|
|
78
|
+
{displayName}
|
|
79
|
+
</Text>
|
|
80
|
+
{replyMessage.text && (<Text style={textStyles} numberOfLines={2}>
|
|
81
|
+
{replyMessage.text}
|
|
82
|
+
</Text>)}
|
|
83
|
+
{replyMessage.image && (<Image source={{ uri: replyMessage.image }} style={[styles.image, imageStyle]}/>)}
|
|
84
|
+
</View>
|
|
85
|
+
</Pressable>);
|
|
86
|
+
}
|
|
87
|
+
//# sourceMappingURL=MessageReply.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MessageReply.js","sourceRoot":"","sources":["../../src/components/MessageReply.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { ImageStyle, StyleProp, TextStyle, ViewStyle } from 'react-native';
|
|
3
|
+
import { ReplyMessage } from '../Models';
|
|
4
|
+
export interface ReplyPreviewProps {
|
|
5
|
+
/** The reply message to preview */
|
|
6
|
+
replyMessage: ReplyMessage;
|
|
7
|
+
/** Callback to clear the reply */
|
|
8
|
+
onClearReply?: () => void;
|
|
9
|
+
/** Container style */
|
|
10
|
+
containerStyle?: StyleProp<ViewStyle>;
|
|
11
|
+
/** Text style */
|
|
12
|
+
textStyle?: StyleProp<TextStyle>;
|
|
13
|
+
/** Image style */
|
|
14
|
+
imageStyle?: StyleProp<ImageStyle>;
|
|
15
|
+
}
|
|
16
|
+
export declare function ReplyPreview({ replyMessage, onClearReply, containerStyle, textStyle, imageStyle, }: ReplyPreviewProps): React.JSX.Element;
|
|
17
|
+
//# sourceMappingURL=ReplyPreview.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ReplyPreview.d.ts","sourceRoot":"","sources":["../../src/components/ReplyPreview.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoB,MAAM,OAAO,CAAA;AACxC,OAAO,EAEL,UAAU,EAEV,SAAS,EAGT,SAAS,EAET,SAAS,EACV,MAAM,cAAc,CAAA;AAWrB,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAA;AAMxC,MAAM,WAAW,iBAAiB;IAChC,mCAAmC;IACnC,YAAY,EAAE,YAAY,CAAA;IAC1B,kCAAkC;IAClC,YAAY,CAAC,EAAE,MAAM,IAAI,CAAA;IACzB,sBAAsB;IACtB,cAAc,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAA;IACrC,iBAAiB;IACjB,SAAS,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAA;IAChC,kBAAkB;IAClB,UAAU,CAAC,EAAE,SAAS,CAAC,UAAU,CAAC,CAAA;CACnC;AAoED,wBAAgB,YAAY,CAAE,EAC5B,YAAY,EACZ,YAAY,EACZ,cAAc,EACd,SAAS,EACT,UAAU,GACX,EAAE,iBAAiB,qBAoHnB"}
|
|
@@ -0,0 +1,148 @@
|
|
|
1
|
+
import React, { useEffect } from 'react';
|
|
2
|
+
import { Image, Pressable, StyleSheet, Text, View, } from 'react-native';
|
|
3
|
+
import Animated, { useAnimatedStyle, useSharedValue, withTiming, Easing, interpolate, runOnJS, } from 'react-native-reanimated';
|
|
4
|
+
import { useColorScheme } from '../hooks/useColorScheme';
|
|
5
|
+
const ANIMATION_DURATION = 200;
|
|
6
|
+
const ANIMATION_EASING = Easing.bezier(0.25, 0.1, 0.25, 1);
|
|
7
|
+
const DEFAULT_HEIGHT = 68;
|
|
8
|
+
const styles = StyleSheet.create({
|
|
9
|
+
borderIndicator: {
|
|
10
|
+
backgroundColor: '#0084ff',
|
|
11
|
+
borderTopLeftRadius: 4,
|
|
12
|
+
height: '100%',
|
|
13
|
+
width: 4,
|
|
14
|
+
},
|
|
15
|
+
clearButton: {
|
|
16
|
+
alignItems: 'center',
|
|
17
|
+
borderRadius: 12,
|
|
18
|
+
height: 24,
|
|
19
|
+
justifyContent: 'center',
|
|
20
|
+
width: 24,
|
|
21
|
+
},
|
|
22
|
+
clearButtonText: {
|
|
23
|
+
fontSize: 18,
|
|
24
|
+
fontWeight: '600',
|
|
25
|
+
},
|
|
26
|
+
container: {
|
|
27
|
+
borderRadius: 8,
|
|
28
|
+
flexDirection: 'row',
|
|
29
|
+
marginBottom: 8,
|
|
30
|
+
marginHorizontal: 10,
|
|
31
|
+
overflow: 'hidden',
|
|
32
|
+
},
|
|
33
|
+
containerDark: {
|
|
34
|
+
backgroundColor: '#2c2c2e',
|
|
35
|
+
},
|
|
36
|
+
containerLight: {
|
|
37
|
+
backgroundColor: '#e9e9eb',
|
|
38
|
+
},
|
|
39
|
+
content: {
|
|
40
|
+
flex: 1,
|
|
41
|
+
paddingHorizontal: 10,
|
|
42
|
+
paddingVertical: 8,
|
|
43
|
+
},
|
|
44
|
+
image: {
|
|
45
|
+
borderRadius: 4,
|
|
46
|
+
height: 40,
|
|
47
|
+
marginRight: 8,
|
|
48
|
+
width: 40,
|
|
49
|
+
},
|
|
50
|
+
row: {
|
|
51
|
+
alignItems: 'center',
|
|
52
|
+
flexDirection: 'row',
|
|
53
|
+
},
|
|
54
|
+
text: {
|
|
55
|
+
fontSize: 14,
|
|
56
|
+
},
|
|
57
|
+
textDark: {
|
|
58
|
+
color: '#fff',
|
|
59
|
+
},
|
|
60
|
+
textLight: {
|
|
61
|
+
color: '#333',
|
|
62
|
+
},
|
|
63
|
+
username: {
|
|
64
|
+
color: '#0084ff',
|
|
65
|
+
fontSize: 13,
|
|
66
|
+
fontWeight: '600',
|
|
67
|
+
marginBottom: 2,
|
|
68
|
+
},
|
|
69
|
+
wrapper: {
|
|
70
|
+
overflow: 'hidden',
|
|
71
|
+
},
|
|
72
|
+
});
|
|
73
|
+
export function ReplyPreview({ replyMessage, onClearReply, containerStyle, textStyle, imageStyle, }) {
|
|
74
|
+
const colorScheme = useColorScheme();
|
|
75
|
+
const isDark = colorScheme === 'dark';
|
|
76
|
+
const animationProgress = useSharedValue(0);
|
|
77
|
+
const contentHeight = useSharedValue(DEFAULT_HEIGHT);
|
|
78
|
+
// Animate in on mount
|
|
79
|
+
useEffect(() => {
|
|
80
|
+
animationProgress.value = withTiming(1, {
|
|
81
|
+
duration: ANIMATION_DURATION,
|
|
82
|
+
easing: ANIMATION_EASING,
|
|
83
|
+
});
|
|
84
|
+
}, [animationProgress]);
|
|
85
|
+
const handleClear = () => {
|
|
86
|
+
'worklet';
|
|
87
|
+
animationProgress.value = withTiming(0, {
|
|
88
|
+
duration: ANIMATION_DURATION,
|
|
89
|
+
easing: ANIMATION_EASING,
|
|
90
|
+
}, finished => {
|
|
91
|
+
if (finished && onClearReply)
|
|
92
|
+
runOnJS(onClearReply)();
|
|
93
|
+
});
|
|
94
|
+
};
|
|
95
|
+
const wrapperAnimatedStyle = useAnimatedStyle(() => {
|
|
96
|
+
const height = interpolate(animationProgress.value, [0, 1], [0, contentHeight.value]);
|
|
97
|
+
const opacity = interpolate(animationProgress.value, [0, 0.5, 1], [0, 0.5, 1]);
|
|
98
|
+
const translateY = interpolate(animationProgress.value, [0, 1], [10, 0]);
|
|
99
|
+
return {
|
|
100
|
+
height,
|
|
101
|
+
opacity,
|
|
102
|
+
transform: [{ translateY }],
|
|
103
|
+
};
|
|
104
|
+
});
|
|
105
|
+
const displayName = replyMessage.user?.name || 'Unknown';
|
|
106
|
+
return (<Animated.View style={[styles.wrapper, wrapperAnimatedStyle]}>
|
|
107
|
+
<View style={[
|
|
108
|
+
styles.container,
|
|
109
|
+
isDark ? styles.containerDark : styles.containerLight,
|
|
110
|
+
containerStyle,
|
|
111
|
+
]} onLayout={e => {
|
|
112
|
+
const newHeight = e.nativeEvent.layout.height + 8;
|
|
113
|
+
// Animate height change smoothly when content changes
|
|
114
|
+
contentHeight.value = withTiming(newHeight, {
|
|
115
|
+
duration: ANIMATION_DURATION,
|
|
116
|
+
easing: ANIMATION_EASING,
|
|
117
|
+
});
|
|
118
|
+
}}>
|
|
119
|
+
<View style={styles.borderIndicator}/>
|
|
120
|
+
<View style={styles.content}>
|
|
121
|
+
<View style={styles.row}>
|
|
122
|
+
{replyMessage.image && (<Image source={{ uri: replyMessage.image }} style={[styles.image, imageStyle]}/>)}
|
|
123
|
+
<View style={{ flex: 1 }}>
|
|
124
|
+
<Text style={styles.username} numberOfLines={1}>
|
|
125
|
+
Replying to {displayName}
|
|
126
|
+
</Text>
|
|
127
|
+
{replyMessage.text && (<Text style={[
|
|
128
|
+
styles.text,
|
|
129
|
+
isDark ? styles.textDark : styles.textLight,
|
|
130
|
+
textStyle,
|
|
131
|
+
]} numberOfLines={2}>
|
|
132
|
+
{replyMessage.text}
|
|
133
|
+
</Text>)}
|
|
134
|
+
</View>
|
|
135
|
+
</View>
|
|
136
|
+
</View>
|
|
137
|
+
<Pressable style={styles.clearButton} onPress={handleClear} hitSlop={8}>
|
|
138
|
+
<Text style={[
|
|
139
|
+
styles.clearButtonText,
|
|
140
|
+
isDark ? styles.textDark : styles.textLight,
|
|
141
|
+
]}>
|
|
142
|
+
×
|
|
143
|
+
</Text>
|
|
144
|
+
</Pressable>
|
|
145
|
+
</View>
|
|
146
|
+
</Animated.View>);
|
|
147
|
+
}
|
|
148
|
+
//# sourceMappingURL=ReplyPreview.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ReplyPreview.js","sourceRoot":"","sources":["../../src/components/ReplyPreview.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { StyleProp, TextStyle } from 'react-native';
|
|
3
|
+
export interface StreamingCursorProps {
|
|
4
|
+
/** Caret glyph. Defaults to a thin block. */
|
|
5
|
+
char?: string;
|
|
6
|
+
/** Blink period in ms (one fade cycle). Default 600. */
|
|
7
|
+
duration?: number;
|
|
8
|
+
style?: StyleProp<TextStyle>;
|
|
9
|
+
}
|
|
10
|
+
/**
|
|
11
|
+
* A blinking caret meant to be rendered inline at the end of a streaming
|
|
12
|
+
* message. Rendered as nested <Text>, so it inherits the bubble text color.
|
|
13
|
+
*/
|
|
14
|
+
export declare function StreamingCursor({ char, duration, style, }: StreamingCursorProps): React.ReactElement;
|
|
15
|
+
//# sourceMappingURL=StreamingCursor.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"StreamingCursor.d.ts","sourceRoot":"","sources":["../../src/components/StreamingCursor.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoB,MAAM,OAAO,CAAA;AACxC,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AAUnD,MAAM,WAAW,oBAAoB;IACnC,6CAA6C;IAC7C,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,wDAAwD;IACxD,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAA;CAC7B;AAED;;;GAGG;AACH,wBAAgB,eAAe,CAAE,EAC/B,IAAU,EACV,QAAc,EACd,KAAK,GACN,EAAE,oBAAoB,GAAG,KAAK,CAAC,YAAY,CAe3C"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import React, { useEffect } from 'react';
|
|
2
|
+
import Animated, { Easing, cancelAnimation, useAnimatedStyle, useSharedValue, withRepeat, withTiming, } from 'react-native-reanimated';
|
|
3
|
+
/**
|
|
4
|
+
* A blinking caret meant to be rendered inline at the end of a streaming
|
|
5
|
+
* message. Rendered as nested <Text>, so it inherits the bubble text color.
|
|
6
|
+
*/
|
|
7
|
+
export function StreamingCursor({ char = '▍', duration = 600, style, }) {
|
|
8
|
+
const opacity = useSharedValue(1);
|
|
9
|
+
useEffect(() => {
|
|
10
|
+
opacity.value = withRepeat(withTiming(0, { duration, easing: Easing.inOut(Easing.ease) }), -1, true);
|
|
11
|
+
return () => cancelAnimation(opacity);
|
|
12
|
+
}, [opacity, duration]);
|
|
13
|
+
const animatedStyle = useAnimatedStyle(() => ({ opacity: opacity.value }));
|
|
14
|
+
return <Animated.Text style={[style, animatedStyle]}>{char}</Animated.Text>;
|
|
15
|
+
}
|
|
16
|
+
//# sourceMappingURL=StreamingCursor.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"StreamingCursor.js","sourceRoot":"","sources":["../../src/components/StreamingCursor.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAExC,OAAO,QAAQ,EAAE,EACf,MAAM,EACN,eAAe,EACf,gBAAgB,EAChB,cAAc,EACd,UAAU,EACV,UAAU,GACX,MAAM,yBAAyB,CAAA;AAUhC;;;GAGG;AACH,MAAM,UAAU,eAAe,CAAE,EAC/B,IAAI,GAAG,GAAG,EACV,QAAQ,GAAG,GAAG,EACd,KAAK,GACgB;IACrB,MAAM,OAAO,GAAG,cAAc,CAAC,CAAC,CAAC,CAAA;IAEjC,SAAS,CAAC,GAAG,EAAE;QACb,OAAO,CAAC,KAAK,GAAG,UAAU,CACxB,UAAU,CAAC,CAAC,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,CAAC,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,EAC9D,CAAC,CAAC,EACF,IAAI,CACL,CAAA;QACD,OAAO,GAAG,EAAE,CAAC,eAAe,CAAC,OAAO,CAAC,CAAA;IACvC,CAAC,EAAE,CAAC,OAAO,EAAE,QAAQ,CAAC,CAAC,CAAA;IAEvB,MAAM,aAAa,GAAG,gBAAgB,CAAC,GAAG,EAAE,CAAC,CAAC,EAAE,OAAO,EAAE,OAAO,CAAC,KAAK,EAAE,CAAC,CAAC,CAAA;IAE1E,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK,EAAE,aAAa,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,EAAE,QAAQ,CAAC,IAAI,CAAC,CAAA;AAC7E,CAAC"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { BaseButton } from 'react-native-gesture-handler';
|
|
3
|
+
import Animated from 'react-native-reanimated';
|
|
4
|
+
export type TouchableOpacityProps = Omit<React.ComponentProps<typeof BaseButton>, 'onPress'> & {
|
|
5
|
+
activeOpacity?: number;
|
|
6
|
+
onPress?: () => void;
|
|
7
|
+
} & React.ComponentProps<typeof Animated.View>;
|
|
8
|
+
export declare const TouchableOpacity: React.FC<TouchableOpacityProps>;
|
|
9
|
+
//# sourceMappingURL=TouchableOpacity.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TouchableOpacity.d.ts","sourceRoot":"","sources":["../../src/components/TouchableOpacity.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsB,MAAM,OAAO,CAAA;AAE1C,OAAO,EAAE,UAAU,EAAE,MAAM,8BAA8B,CAAA;AACzD,OAAO,QAIN,MAAM,yBAAyB,CAAA;AAEhC,MAAM,MAAM,qBAAqB,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,UAAU,CAAC,EAAE,SAAS,CAAC,GAAG;IAC7F,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;CACrB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,QAAQ,CAAC,IAAI,CAAC,CAAA;AAE9C,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CAwD5D,CAAA"}
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
import React, { useCallback } from 'react';
|
|
2
|
+
import { StyleSheet } from 'react-native';
|
|
3
|
+
import { BaseButton } from 'react-native-gesture-handler';
|
|
4
|
+
import Animated, { useAnimatedStyle, useSharedValue, withTiming, } from 'react-native-reanimated';
|
|
5
|
+
export const TouchableOpacity = ({ children, style, activeOpacity = 0.2, onPress, ...rest }) => {
|
|
6
|
+
const opacity = useSharedValue(1);
|
|
7
|
+
const isAnimationInFinished = useSharedValue(false);
|
|
8
|
+
const handlePressIn = useCallback(() => {
|
|
9
|
+
opacity.value = withTiming(activeOpacity, { duration: 150 }, () => {
|
|
10
|
+
isAnimationInFinished.value = true;
|
|
11
|
+
});
|
|
12
|
+
}, [activeOpacity, opacity, isAnimationInFinished]);
|
|
13
|
+
const handlePressOut = useCallback(() => {
|
|
14
|
+
setTimeout(() => {
|
|
15
|
+
'worklet';
|
|
16
|
+
opacity.value = withTiming(1, { duration: 150 });
|
|
17
|
+
isAnimationInFinished.value = false;
|
|
18
|
+
}, isAnimationInFinished.value ? 0 : 150);
|
|
19
|
+
}, [opacity, isAnimationInFinished]);
|
|
20
|
+
const handleActiveStateChange = useCallback((isActive) => {
|
|
21
|
+
if (isActive)
|
|
22
|
+
handlePressIn();
|
|
23
|
+
else
|
|
24
|
+
handlePressOut();
|
|
25
|
+
}, [handlePressIn, handlePressOut]);
|
|
26
|
+
const animatedStyle = useAnimatedStyle(() => ({
|
|
27
|
+
opacity: opacity.value,
|
|
28
|
+
}));
|
|
29
|
+
const handlePress = useCallback(() => {
|
|
30
|
+
onPress?.();
|
|
31
|
+
}, [onPress]);
|
|
32
|
+
return (<BaseButton {...rest} onPress={handlePress} onActiveStateChange={handleActiveStateChange}>
|
|
33
|
+
<Animated.View
|
|
34
|
+
// The content view must not capture touches, otherwise it swallows the
|
|
35
|
+
// BaseButton's press on Android (see #2714). pointerEvents in style is
|
|
36
|
+
// the non-deprecated form on RN's New Architecture.
|
|
37
|
+
style={[style, animatedStyle, styles.content]}>
|
|
38
|
+
{children}
|
|
39
|
+
</Animated.View>
|
|
40
|
+
</BaseButton>);
|
|
41
|
+
};
|
|
42
|
+
const styles = StyleSheet.create({
|
|
43
|
+
content: {
|
|
44
|
+
pointerEvents: 'none',
|
|
45
|
+
},
|
|
46
|
+
});
|
|
47
|
+
//# sourceMappingURL=TouchableOpacity.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TouchableOpacity.js","sourceRoot":"","sources":["../../src/components/TouchableOpacity.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,MAAM,OAAO,CAAA;AAC1C,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AACzC,OAAO,EAAE,UAAU,EAAE,MAAM,8BAA8B,CAAA;AACzD,OAAO,QAAQ,EAAE,EACf,gBAAgB,EAChB,cAAc,EACd,UAAU,GACX,MAAM,yBAAyB,CAAA;AAOhC,MAAM,CAAC,MAAM,gBAAgB,GAAoC,CAAC,EAChE,QAAQ,EACR,KAAK,EACL,aAAa,GAAG,GAAG,EACnB,OAAO,EACP,GAAG,IAAI,EACR,EAAE,EAAE;IACH,MAAM,OAAO,GAAG,cAAc,CAAC,CAAC,CAAC,CAAA;IACjC,MAAM,qBAAqB,GAAG,cAAc,CAAC,KAAK,CAAC,CAAA;IAEnD,MAAM,aAAa,GAAG,WAAW,CAAC,GAAG,EAAE;QACrC,OAAO,CAAC,KAAK,GAAG,UAAU,CAAC,aAAa,EAAE,EAAE,QAAQ,EAAE,GAAG,EAAE,EAAE,GAAG,EAAE;YAChE,qBAAqB,CAAC,KAAK,GAAG,IAAI,CAAA;QACpC,CAAC,CAAC,CAAA;IACJ,CAAC,EAAE,CAAC,aAAa,EAAE,OAAO,EAAE,qBAAqB,CAAC,CAAC,CAAA;IAEnD,MAAM,cAAc,GAAG,WAAW,CAAC,GAAG,EAAE;QACtC,UAAU,CAAC,GAAG,EAAE;YACd,SAAS,CAAA;YAET,OAAO,CAAC,KAAK,GAAG,UAAU,CAAC,CAAC,EAAE,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,CAAA;YAChD,qBAAqB,CAAC,KAAK,GAAG,KAAK,CAAA;QACrC,CAAC,EAAE,qBAAqB,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAA;IAC3C,CAAC,EAAE,CAAC,OAAO,EAAE,qBAAqB,CAAC,CAAC,CAAA;IAEpC,MAAM,uBAAuB,GAAG,WAAW,CAAC,CAAC,QAAiB,EAAE,EAAE;QAChE,IAAI,QAAQ;YACV,aAAa,EAAE,CAAA;;YAEf,cAAc,EAAE,CAAA;IACpB,CAAC,EAAE,CAAC,aAAa,EAAE,cAAc,CAAC,CAAC,CAAA;IAEnC,MAAM,aAAa,GAAG,gBAAgB,CAAC,GAAG,EAAE,CAAC,CAAC;QAC5C,OAAO,EAAE,OAAO,CAAC,KAAK;KACvB,CAAC,CAAC,CAAA;IAEH,MAAM,WAAW,GAAG,WAAW,CAAC,GAAG,EAAE;QACnC,OAAO,EAAE,EAAE,CAAA;IACb,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAA;IAEb,OAAO,CACL,CAAC,UAAU,CACT,IAAI,IAAI,CAAC,CACT,OAAO,CAAC,CAAC,WAAW,CAAC,CACrB,mBAAmB,CAAC,CAAC,uBAAuB,CAAC,CAE7C;MAAA,CAAC,QAAQ,CAAC,IAAI;IACZ,uEAAuE;IACvE,uEAAuE;IACvE,oDAAoD;IACpD,KAAK,CAAC,CAAC,CAAC,KAAK,EAAE,aAAa,EAAE,MAAM,CAAC,OAAO,CAAC,CAAC,CAE9C;QAAA,CAAC,QAAQ,CACX;MAAA,EAAE,QAAQ,CAAC,IAAI,CACjB;IAAA,EAAE,UAAU,CAAC,CACd,CAAA;AACH,CAAC,CAAA;AAED,MAAM,MAAM,GAAG,UAAU,CAAC,MAAM,CAAC;IAC/B,OAAO,EAAE;QACP,aAAa,EAAE,MAAM;KACtB;CACF,CAAC,CAAA"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Custom hook that returns the color scheme from Chat context if provided,
|
|
3
|
+
* otherwise falls back to the system color scheme from React Native.
|
|
4
|
+
*
|
|
5
|
+
* @returns The current color scheme ('light', 'dark', null, or undefined)
|
|
6
|
+
*/
|
|
7
|
+
export declare function useColorScheme(): import("react-native").ColorSchemeName;
|
|
8
|
+
//# sourceMappingURL=useColorScheme.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useColorScheme.d.ts","sourceRoot":"","sources":["../../src/hooks/useColorScheme.ts"],"names":[],"mappings":"AAGA;;;;;GAKG;AACH,wBAAgB,cAAc,2CAQ7B"}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { useColorScheme as useRNColorScheme } from 'react-native';
|
|
2
|
+
import { useChatContext } from '../ChatContext';
|
|
3
|
+
/**
|
|
4
|
+
* Custom hook that returns the color scheme from Chat context if provided,
|
|
5
|
+
* otherwise falls back to the system color scheme from React Native.
|
|
6
|
+
*
|
|
7
|
+
* @returns The current color scheme ('light', 'dark', null, or undefined)
|
|
8
|
+
*/
|
|
9
|
+
export function useColorScheme() {
|
|
10
|
+
const { getColorScheme } = useChatContext();
|
|
11
|
+
const contextColorScheme = getColorScheme();
|
|
12
|
+
const systemColorScheme = useRNColorScheme();
|
|
13
|
+
return contextColorScheme !== undefined && contextColorScheme !== null
|
|
14
|
+
? contextColorScheme
|
|
15
|
+
: systemColorScheme;
|
|
16
|
+
}
|
|
17
|
+
//# sourceMappingURL=useColorScheme.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useColorScheme.js","sourceRoot":"","sources":["../../src/hooks/useColorScheme.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,IAAI,gBAAgB,EAAE,MAAM,cAAc,CAAA;AACjE,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAA;AAE/C;;;;;GAKG;AACH,MAAM,UAAU,cAAc;IAC5B,MAAM,EAAE,cAAc,EAAE,GAAG,cAAc,EAAE,CAAA;IAC3C,MAAM,kBAAkB,GAAG,cAAc,EAAE,CAAA;IAC3C,MAAM,iBAAiB,GAAG,gBAAgB,EAAE,CAAA;IAE5C,OAAO,kBAAkB,KAAK,SAAS,IAAI,kBAAkB,KAAK,IAAI;QACpE,CAAC,CAAC,kBAAkB;QACpB,CAAC,CAAC,iBAAiB,CAAA;AACvB,CAAC"}
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
import { IMessage, User } from '../Models';
|
|
2
|
+
/** Fields you provide when opening a stream for an assistant reply. */
|
|
3
|
+
export type StartStreamInput<TMessage extends IMessage = IMessage> = Partial<TMessage> & {
|
|
4
|
+
user: User;
|
|
5
|
+
};
|
|
6
|
+
/** Handle returned by `startStream` to feed tokens into the placeholder message. */
|
|
7
|
+
export interface StreamHandle {
|
|
8
|
+
/** _id of the streaming message. */
|
|
9
|
+
id: IMessage['_id'];
|
|
10
|
+
/** Append a token/chunk to the message text (batched per animation frame). */
|
|
11
|
+
push: (chunk: string) => void;
|
|
12
|
+
/** Replace the whole message text. */
|
|
13
|
+
set: (text: string) => void;
|
|
14
|
+
/** Flush remaining text, clear the streaming flag, optionally patch fields. */
|
|
15
|
+
done: (finalPatch?: Partial<IMessage>) => void;
|
|
16
|
+
/** AbortSignal tied to this stream; pass it to your fetch/LLM call. */
|
|
17
|
+
signal: AbortSignal;
|
|
18
|
+
}
|
|
19
|
+
export interface UseStreamingMessagesOptions<TMessage extends IMessage = IMessage> {
|
|
20
|
+
initialMessages?: TMessage[];
|
|
21
|
+
/** Newest message first in the array (matches `<Chat>` default). Default true. */
|
|
22
|
+
inverted?: boolean;
|
|
23
|
+
}
|
|
24
|
+
export interface UseStreamingMessagesResult<TMessage extends IMessage = IMessage> {
|
|
25
|
+
messages: TMessage[];
|
|
26
|
+
setMessages: React.Dispatch<React.SetStateAction<TMessage[]>>;
|
|
27
|
+
/** Add message(s) respecting the configured order. */
|
|
28
|
+
append: (newMessages: TMessage | TMessage[]) => void;
|
|
29
|
+
/** Insert an empty assistant message flagged `streaming` and return a feed handle. */
|
|
30
|
+
startStream: (assistant: StartStreamInput<TMessage>) => StreamHandle;
|
|
31
|
+
/** True between `startStream` and `done`/`stop`. */
|
|
32
|
+
isStreaming: boolean;
|
|
33
|
+
/** Abort the active stream (also fires the stream's AbortSignal). */
|
|
34
|
+
stop: () => void;
|
|
35
|
+
}
|
|
36
|
+
/**
|
|
37
|
+
* Message state tuned for streamed (AI) replies. Token pushes are coalesced
|
|
38
|
+
* with `requestAnimationFrame` so a fast stream produces at most one render per
|
|
39
|
+
* frame, and only the streaming message is updated.
|
|
40
|
+
*/
|
|
41
|
+
export declare function useStreamingMessages<TMessage extends IMessage = IMessage>(options?: UseStreamingMessagesOptions<TMessage>): UseStreamingMessagesResult<TMessage>;
|
|
42
|
+
//# sourceMappingURL=useStreamingMessages.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useStreamingMessages.d.ts","sourceRoot":"","sources":["../../src/hooks/useStreamingMessages.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,QAAQ,EAAE,IAAI,EAAE,MAAM,WAAW,CAAA;AAE1C,uEAAuE;AACvE,MAAM,MAAM,gBAAgB,CAAC,QAAQ,SAAS,QAAQ,GAAG,QAAQ,IAC/D,OAAO,CAAC,QAAQ,CAAC,GAAG;IAAE,IAAI,EAAE,IAAI,CAAA;CAAE,CAAA;AAEpC,oFAAoF;AACpF,MAAM,WAAW,YAAY;IAC3B,oCAAoC;IACpC,EAAE,EAAE,QAAQ,CAAC,KAAK,CAAC,CAAA;IACnB,8EAA8E;IAC9E,IAAI,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAC7B,sCAAsC;IACtC,GAAG,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAA;IAC3B,+EAA+E;IAC/E,IAAI,EAAE,CAAC,UAAU,CAAC,EAAE,OAAO,CAAC,QAAQ,CAAC,KAAK,IAAI,CAAA;IAC9C,uEAAuE;IACvE,MAAM,EAAE,WAAW,CAAA;CACpB;AAED,MAAM,WAAW,2BAA2B,CAAC,QAAQ,SAAS,QAAQ,GAAG,QAAQ;IAC/E,eAAe,CAAC,EAAE,QAAQ,EAAE,CAAA;IAC5B,kFAAkF;IAClF,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAED,MAAM,WAAW,0BAA0B,CAAC,QAAQ,SAAS,QAAQ,GAAG,QAAQ;IAC9E,QAAQ,EAAE,QAAQ,EAAE,CAAA;IACpB,WAAW,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAA;IAC7D,sDAAsD;IACtD,MAAM,EAAE,CAAC,WAAW,EAAE,QAAQ,GAAG,QAAQ,EAAE,KAAK,IAAI,CAAA;IACpD,sFAAsF;IACtF,WAAW,EAAE,CAAC,SAAS,EAAE,gBAAgB,CAAC,QAAQ,CAAC,KAAK,YAAY,CAAA;IACpE,oDAAoD;IACpD,WAAW,EAAE,OAAO,CAAA;IACpB,qEAAqE;IACrE,IAAI,EAAE,MAAM,IAAI,CAAA;CACjB;AAED;;;;GAIG;AACH,wBAAgB,oBAAoB,CAAC,QAAQ,SAAS,QAAQ,GAAG,QAAQ,EACvE,OAAO,GAAE,2BAA2B,CAAC,QAAQ,CAAM,GAClD,0BAA0B,CAAC,QAAQ,CAAC,CAmHtC"}
|
|
@@ -0,0 +1,96 @@
|
|
|
1
|
+
import { useCallback, useEffect, useRef, useState } from 'react';
|
|
2
|
+
/**
|
|
3
|
+
* Message state tuned for streamed (AI) replies. Token pushes are coalesced
|
|
4
|
+
* with `requestAnimationFrame` so a fast stream produces at most one render per
|
|
5
|
+
* frame, and only the streaming message is updated.
|
|
6
|
+
*/
|
|
7
|
+
export function useStreamingMessages(options = {}) {
|
|
8
|
+
const { initialMessages = [], inverted = true } = options;
|
|
9
|
+
const [messages, setMessages] = useState(initialMessages);
|
|
10
|
+
const [isStreaming, setIsStreaming] = useState(false);
|
|
11
|
+
const idCounter = useRef(0);
|
|
12
|
+
const bufferRef = useRef('');
|
|
13
|
+
const rafRef = useRef(null);
|
|
14
|
+
const activeIdRef = useRef(null);
|
|
15
|
+
const abortRef = useRef(null);
|
|
16
|
+
const cancelFrame = useCallback(() => {
|
|
17
|
+
if (rafRef.current != null) {
|
|
18
|
+
cancelAnimationFrame(rafRef.current);
|
|
19
|
+
rafRef.current = null;
|
|
20
|
+
}
|
|
21
|
+
}, []);
|
|
22
|
+
const flush = useCallback(() => {
|
|
23
|
+
rafRef.current = null;
|
|
24
|
+
const id = activeIdRef.current;
|
|
25
|
+
const chunk = bufferRef.current;
|
|
26
|
+
if (id == null || !chunk)
|
|
27
|
+
return;
|
|
28
|
+
bufferRef.current = '';
|
|
29
|
+
setMessages(prev => prev.map(m => (m._id === id ? { ...m, text: m.text + chunk } : m)));
|
|
30
|
+
}, []);
|
|
31
|
+
const scheduleFlush = useCallback(() => {
|
|
32
|
+
if (rafRef.current == null)
|
|
33
|
+
rafRef.current = requestAnimationFrame(flush);
|
|
34
|
+
}, [flush]);
|
|
35
|
+
const append = useCallback((newMessages) => {
|
|
36
|
+
const arr = Array.isArray(newMessages) ? newMessages : [newMessages];
|
|
37
|
+
setMessages(prev => (inverted ? arr.concat(prev) : prev.concat(arr)));
|
|
38
|
+
}, [inverted]);
|
|
39
|
+
const stop = useCallback(() => {
|
|
40
|
+
abortRef.current?.abort();
|
|
41
|
+
}, []);
|
|
42
|
+
const startStream = useCallback((assistant) => {
|
|
43
|
+
// Finalize any previous stream before starting a new one.
|
|
44
|
+
cancelFrame();
|
|
45
|
+
bufferRef.current = '';
|
|
46
|
+
abortRef.current?.abort();
|
|
47
|
+
const id = (assistant._id ?? `stream-${Date.now()}-${idCounter.current++}`);
|
|
48
|
+
const controller = new AbortController();
|
|
49
|
+
abortRef.current = controller;
|
|
50
|
+
activeIdRef.current = id;
|
|
51
|
+
const placeholder = {
|
|
52
|
+
text: '',
|
|
53
|
+
createdAt: new Date(),
|
|
54
|
+
...assistant,
|
|
55
|
+
_id: id,
|
|
56
|
+
streaming: true,
|
|
57
|
+
};
|
|
58
|
+
setMessages(prev => (inverted ? [placeholder, ...prev] : [...prev, placeholder]));
|
|
59
|
+
setIsStreaming(true);
|
|
60
|
+
let finished = false;
|
|
61
|
+
const finalize = (finalPatch) => {
|
|
62
|
+
if (finished)
|
|
63
|
+
return;
|
|
64
|
+
finished = true;
|
|
65
|
+
cancelFrame();
|
|
66
|
+
const remaining = bufferRef.current;
|
|
67
|
+
bufferRef.current = '';
|
|
68
|
+
setMessages(prev => prev.map(m => m._id === id
|
|
69
|
+
? { ...m, text: m.text + remaining, streaming: false, ...finalPatch }
|
|
70
|
+
: m));
|
|
71
|
+
if (activeIdRef.current === id)
|
|
72
|
+
activeIdRef.current = null;
|
|
73
|
+
setIsStreaming(false);
|
|
74
|
+
};
|
|
75
|
+
controller.signal.onabort = () => finalize();
|
|
76
|
+
return {
|
|
77
|
+
id,
|
|
78
|
+
push: (chunk) => {
|
|
79
|
+
bufferRef.current += chunk;
|
|
80
|
+
scheduleFlush();
|
|
81
|
+
},
|
|
82
|
+
set: (text) => {
|
|
83
|
+
bufferRef.current = '';
|
|
84
|
+
setMessages(prev => prev.map(m => (m._id === id ? { ...m, text } : m)));
|
|
85
|
+
},
|
|
86
|
+
done: (finalPatch) => finalize(finalPatch),
|
|
87
|
+
signal: controller.signal,
|
|
88
|
+
};
|
|
89
|
+
}, [inverted, cancelFrame, scheduleFlush]);
|
|
90
|
+
useEffect(() => () => {
|
|
91
|
+
cancelFrame();
|
|
92
|
+
abortRef.current?.abort();
|
|
93
|
+
}, [cancelFrame]);
|
|
94
|
+
return { messages, setMessages, append, startStream, isStreaming, stop };
|
|
95
|
+
}
|
|
96
|
+
//# sourceMappingURL=useStreamingMessages.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useStreamingMessages.js","sourceRoot":"","sources":["../../src/hooks/useStreamingMessages.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { DependencyList } from 'react';
|
|
2
|
+
/**
|
|
3
|
+
* A custom useEffect hook that only triggers on updates, not on initial mount
|
|
4
|
+
* Idea stolen from: https://stackoverflow.com/a/55075818/1526448
|
|
5
|
+
* @param {()=>void} effect the function to call
|
|
6
|
+
* @param {DependencyList} dependencies the state(s) that fires the update
|
|
7
|
+
*/
|
|
8
|
+
export declare function useUpdateLayoutEffect(effect: () => void, dependencies?: DependencyList): void;
|
|
9
|
+
//# sourceMappingURL=useUpdateLayoutEffect.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useUpdateLayoutEffect.d.ts","sourceRoot":"","sources":["../../src/hooks/useUpdateLayoutEffect.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAA2B,MAAM,OAAO,CAAA;AAE/D;;;;;GAKG;AACH,wBAAgB,qBAAqB,CACnC,MAAM,EAAE,MAAM,IAAI,EAClB,YAAY,GAAE,cAAmB,QAUlC"}
|