react-native-srschat 0.1.4 → 0.1.7

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 (8) hide show
  1. package/lib/commonjs/index.js +183 -74
  2. package/lib/commonjs/index.js.map +1 -1
  3. package/lib/module/index.js +184 -75
  4. package/lib/module/index.js.map +1 -1
  5. package/lib/typescript/index.d.ts +2 -1
  6. package/lib/typescript/index.d.ts.map +1 -1
  7. package/package.json +6 -3
  8. package/src/index.tsx +210 -81
package/lib/commonjs/index.js CHANGED
@@ -6,39 +6,87 @@ Object.defineProperty(exports, "__esModule", {
6
6
  exports.Chat = void 0;
7
7
  var _react = _interopRequireDefault(require("react"));
8
8
  var _reactNative = require("react-native");
9
+ var _vectorIcons = require("@expo/vector-icons");
9
10
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
10
11
  const defaultTheme = {
11
12
  primaryColor: '#007AFF',
12
13
  backgroundColor: '#FFFFFF',
13
- textColor: '#000000'
14
+ textColor: '#000000',
15
+ inputBackgroundColor: '#FFFFFF'
14
16
  };
15
17
  const Chat = ({
16
18
  onSendMessage,
19
+ placeholder = 'Type your message here...',
17
20
  theme = defaultTheme
18
21
  }) => {
19
22
  const [message, setMessage] = _react.default.useState('');
20
23
  const [messages, setMessages] = _react.default.useState([]);
24
+ const [refreshing, setRefreshing] = _react.default.useState(false);
25
+ const onRefresh = _react.default.useCallback(async () => {
26
+ setRefreshing(true);
27
+ try {
28
+ const response = await onSendMessage("Hi, I'm refreshing the chat!");
29
+ const currentTime = new Date().toLocaleTimeString([], {
30
+ hour: 'numeric',
31
+ minute: '2-digit',
32
+ hour12: true
33
+ });
34
+ setMessages(prev => [...prev, {
35
+ text: response,
36
+ isUser: false,
37
+ timestamp: currentTime
38
+ }]);
39
+ } catch (error) {
40
+ console.error('Error refreshing chat:', error);
41
+ } finally {
42
+ setRefreshing(false);
43
+ }
44
+ }, [onSendMessage]);
21
45
  const handleSend = async () => {
22
46
  if (!message.trim()) return;
23
47
  const userMessage = message;
24
48
  setMessage('');
49
+ const currentTime = new Date().toLocaleTimeString([], {
50
+ hour: 'numeric',
51
+ minute: '2-digit',
52
+ hour12: true
53
+ });
25
54
  setMessages(prev => [...prev, {
26
55
  text: userMessage,
27
- isUser: true
56
+ isUser: true,
57
+ timestamp: currentTime
28
58
  }]);
29
59
  try {
30
- const response = await onSendMessage(userMessage);
60
+ // Create bot message placeholder before streaming
31
61
  setMessages(prev => [...prev, {
32
- text: response,
33
- isUser: false
62
+ text: '',
63
+ isUser: false,
64
+ timestamp: currentTime
34
65
  }]);
66
+ const response = await onSendMessage(userMessage, chunk => {
67
+ setMessages(prev => {
68
+ const newMessages = [...prev];
69
+ const lastMessage = newMessages[newMessages.length - 1];
70
+ if (lastMessage && !lastMessage.isUser) {
71
+ lastMessage.text += chunk;
72
+ }
73
+ return newMessages;
74
+ });
75
+ });
76
+
77
+ // Only update if final response is different from streamed content
78
+ setMessages(prev => {
79
+ const newMessages = [...prev];
80
+ const lastMessage = newMessages[newMessages.length - 1];
81
+ if (lastMessage && !lastMessage.isUser && lastMessage.text !== response) {
82
+ lastMessage.text = response;
83
+ }
84
+ return newMessages;
85
+ });
35
86
  } catch (error) {
36
87
  console.error('Error sending message:', error);
37
88
  }
38
89
  };
39
- const containerStyle = [styles.container, {
40
- backgroundColor: theme.backgroundColor
41
- }];
42
90
  const getMessageStyle = fromUser => [styles.messageBubble, fromUser ? styles.userMessage : styles.botMessage, {
43
91
  backgroundColor: fromUser ? theme.primaryColor : '#E8E8E8'
44
92
  }];
@@ -46,33 +94,72 @@ const Chat = ({
46
94
  color: fromUser ? '#fff' : theme.textColor
47
95
  }];
48
96
  return /*#__PURE__*/_react.default.createElement(_reactNative.SafeAreaView, {
49
- style: containerStyle,
50
- testID: "chat-container"
97
+ style: [styles.container, {
98
+ backgroundColor: theme.backgroundColor
99
+ }]
51
100
  }, /*#__PURE__*/_react.default.createElement(_reactNative.KeyboardAvoidingView, {
52
101
  behavior: _reactNative.Platform.OS === 'ios' ? 'padding' : 'height',
53
- style: styles.content
102
+ style: styles.content,
103
+ keyboardVerticalOffset: _reactNative.Platform.OS === 'ios' ? 60 : 0
54
104
  }, /*#__PURE__*/_react.default.createElement(_reactNative.ScrollView, {
55
- style: styles.messagesContainer
105
+ style: styles.messagesContainer,
106
+ contentContainerStyle: styles.messagesContent,
107
+ refreshControl: /*#__PURE__*/_react.default.createElement(_reactNative.RefreshControl, {
108
+ refreshing: refreshing,
109
+ onRefresh: onRefresh,
110
+ tintColor: theme.primaryColor || defaultTheme.primaryColor,
111
+ colors: [theme.primaryColor || defaultTheme.primaryColor],
112
+ progressBackgroundColor: "#ffffff"
113
+ })
56
114
  }, messages.map((msg, i) => /*#__PURE__*/_react.default.createElement(_reactNative.View, {
57
115
  key: i,
58
- style: getMessageStyle(msg.isUser)
116
+ style: styles.messageWrapper
117
+ }, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
118
+ style: [getMessageStyle(msg.isUser), styles.messageShadow]
59
119
  }, /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
60
120
  style: getTextStyle(msg.isUser)
61
- }, msg.text)))), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
121
+ }, msg.text)), /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
122
+ style: [styles.timestamp, msg.isUser ? styles.timestampRight : styles.timestampLeft]
123
+ }, msg.timestamp)))), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
124
+ style: styles.inputWrapper
125
+ }, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
62
126
  style: styles.inputContainer
63
127
  }, /*#__PURE__*/_react.default.createElement(_reactNative.TextInput, {
64
- style: [styles.input, {
65
- color: theme.textColor
66
- }],
128
+ style: styles.input,
67
129
  value: message,
68
130
  onChangeText: setMessage,
69
- placeholder: "Type a message...",
70
- placeholderTextColor: "#999"
71
- }), /*#__PURE__*/_react.default.createElement(_reactNative.Button, {
72
- title: "Send",
131
+ placeholder: placeholder,
132
+ placeholderTextColor: "#999",
133
+ multiline: true
134
+ })), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
135
+ style: styles.inputButtonsContainer
136
+ }, /*#__PURE__*/_react.default.createElement(_reactNative.TouchableOpacity, {
137
+ style: styles.inputButton
138
+ }, /*#__PURE__*/_react.default.createElement(_vectorIcons.Ionicons, {
139
+ name: "add",
140
+ size: 28,
141
+ color: "#8E8E93"
142
+ })), /*#__PURE__*/_react.default.createElement(_reactNative.TouchableOpacity, {
143
+ style: styles.inputButton
144
+ }, /*#__PURE__*/_react.default.createElement(_vectorIcons.Ionicons, {
145
+ name: "refresh-outline",
146
+ size: 28,
147
+ color: "#8E8E93"
148
+ })), /*#__PURE__*/_react.default.createElement(_reactNative.TouchableOpacity, {
149
+ style: styles.inputButton
150
+ }, /*#__PURE__*/_react.default.createElement(_vectorIcons.Ionicons, {
151
+ name: "mic-outline",
152
+ size: 28,
153
+ color: "#8E8E93"
154
+ })), /*#__PURE__*/_react.default.createElement(_reactNative.TouchableOpacity, {
155
+ style: [styles.sendButton, !message.trim() && styles.disabledButton],
73
156
  onPress: handleSend,
74
- color: theme.primaryColor
75
- }))));
157
+ disabled: !message.trim()
158
+ }, /*#__PURE__*/_react.default.createElement(_vectorIcons.Ionicons, {
159
+ name: "paper-plane-outline",
160
+ size: 28,
161
+ color: message.trim() ? theme.primaryColor : '#8E8E93'
162
+ }))))));
76
163
  };
77
164
  exports.Chat = Chat;
78
165
  const styles = _reactNative.StyleSheet.create({
@@ -81,86 +168,108 @@ const styles = _reactNative.StyleSheet.create({
81
168
  backgroundColor: '#FFFFFF'
82
169
  },
83
170
  content: {
84
- flex: 1,
85
- backgroundColor: '#F8F9FA'
171
+ flex: 1
86
172
  },
87
173
  messagesContainer: {
88
- flex: 1,
89
- padding: 20,
90
- paddingTop: 30
174
+ flex: 1
91
175
  },
92
- messageBubble: {
93
- maxWidth: '85%',
176
+ messagesContent: {
94
177
  padding: 16,
178
+ paddingBottom: 32
179
+ },
180
+ messageWrapper: {
181
+ marginBottom: 16
182
+ },
183
+ timestamp: {
184
+ fontSize: 12,
185
+ color: '#8E8E93',
186
+ marginTop: 4,
187
+ paddingHorizontal: 4
188
+ },
189
+ timestampRight: {
190
+ textAlign: 'right'
191
+ },
192
+ timestampLeft: {
193
+ textAlign: 'left'
194
+ },
195
+ messageBubble: {
196
+ maxWidth: '70%',
197
+ padding: 12,
198
+ paddingHorizontal: 16,
95
199
  borderRadius: 20,
96
- marginBottom: 16,
97
- backgroundColor: '#FFFFFF',
200
+ backgroundColor: '#FFFFFF'
201
+ },
202
+ messageShadow: {
98
203
  shadowColor: '#000',
99
204
  shadowOffset: {
100
205
  width: 0,
101
- height: 2
206
+ height: 1
102
207
  },
103
- shadowOpacity: 0.05,
104
- shadowRadius: 8,
105
- elevation: 3
208
+ shadowOpacity: 0.08,
209
+ shadowRadius: 2,
210
+ elevation: 2
106
211
  },
107
212
  userMessage: {
108
213
  alignSelf: 'flex-end',
109
- backgroundColor: '#FFFFFF',
110
- borderWidth: 1,
111
- borderColor: 'rgba(0, 0, 0, 0.04)'
214
+ backgroundColor: '#007AFF'
112
215
  },
113
216
  botMessage: {
114
217
  alignSelf: 'flex-start',
115
- backgroundColor: '#FFFFFF',
116
- borderWidth: 1,
117
- borderColor: 'rgba(0, 0, 0, 0.04)'
218
+ backgroundColor: '#F2F2F7'
118
219
  },
119
220
  messageText: {
120
- fontSize: 15,
121
- lineHeight: 22,
122
- fontWeight: '400',
123
- color: '#2C2C2E',
124
- letterSpacing: 0.2
221
+ fontSize: 16,
222
+ lineHeight: 22
223
+ },
224
+ inputWrapper: {
225
+ backgroundColor: '#FFFFFF',
226
+ paddingHorizontal: 8,
227
+ paddingVertical: 8,
228
+ borderTopWidth: 1,
229
+ borderTopColor: 'rgba(0, 0, 0, 0.1)'
125
230
  },
126
231
  inputContainer: {
127
232
  flexDirection: 'row',
128
233
  alignItems: 'center',
129
- paddingHorizontal: 16,
130
- paddingVertical: 12,
234
+ paddingHorizontal: 8,
235
+ paddingVertical: 8,
131
236
  backgroundColor: '#FFFFFF',
132
- borderTopWidth: 1,
133
- borderTopColor: 'rgba(0, 0, 0, 0.06)',
237
+ borderRadius: 16,
238
+ margin: 8,
134
239
  shadowColor: '#000',
135
240
  shadowOffset: {
136
241
  width: 0,
137
- height: -8
242
+ height: 2
138
243
  },
139
- shadowOpacity: 0.04,
140
- shadowRadius: 12,
141
- elevation: 8,
142
- marginTop: 'auto'
244
+ shadowOpacity: 0.1,
245
+ shadowRadius: 4,
246
+ elevation: 3
143
247
  },
144
248
  input: {
145
249
  flex: 1,
146
- backgroundColor: '#F8F9FA',
147
- borderRadius: 16,
148
- borderWidth: 1,
149
- borderColor: 'rgba(0, 0, 0, 0.06)',
150
- paddingHorizontal: 20,
151
- paddingVertical: 12,
152
- marginRight: 12,
153
- fontSize: 15,
154
- maxHeight: 120,
155
- color: '#2C2C2E',
156
- shadowColor: '#000',
157
- shadowOffset: {
158
- width: 0,
159
- height: 1
160
- },
161
- shadowOpacity: 0.04,
162
- shadowRadius: 4,
163
- elevation: 2
250
+ fontSize: 16,
251
+ paddingVertical: 8,
252
+ paddingHorizontal: 12,
253
+ maxHeight: 100,
254
+ color: '#000000'
255
+ },
256
+ inputButtonsContainer: {
257
+ flexDirection: 'row',
258
+ alignItems: 'center',
259
+ justifyContent: 'space-between',
260
+ paddingHorizontal: 8,
261
+ marginTop: 4
262
+ },
263
+ inputButton: {
264
+ padding: 6,
265
+ marginHorizontal: 4
266
+ },
267
+ sendButton: {
268
+ padding: 6,
269
+ marginLeft: 'auto'
270
+ },
271
+ disabledButton: {
272
+ opacity: 0.7
164
273
  }
165
274
  });
166
275
  //# sourceMappingURL=index.js.map
package/lib/commonjs/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"names":["_react","_interopRequireDefault","require","_reactNative","e","__esModule","default","defaultTheme","primaryColor","backgroundColor","textColor","Chat","onSendMessage","theme","message","setMessage","React","useState","messages","setMessages","handleSend","trim","userMessage","prev","text","isUser","response","error","console","containerStyle","styles","container","getMessageStyle","fromUser","messageBubble","botMessage","getTextStyle","messageText","color","createElement","SafeAreaView","style","testID","KeyboardAvoidingView","behavior","Platform","OS","content","ScrollView","messagesContainer","map","msg","i","View","key","Text","inputContainer","TextInput","input","value","onChangeText","placeholder","placeholderTextColor","Button","title","onPress","exports","StyleSheet","create","flex","padding","paddingTop","maxWidth","borderRadius","marginBottom","shadowColor","shadowOffset","width","height","shadowOpacity","shadowRadius","elevation","alignSelf","borderWidth","borderColor","fontSize","lineHeight","fontWeight","letterSpacing","flexDirection","alignItems","paddingHorizontal","paddingVertical","borderTopWidth","borderTopColor","marginTop","marginRight","maxHeight"],"sourceRoot":"../../src","sources":["index.tsx"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"names":["_react","_interopRequireDefault","require","_reactNative","_vectorIcons","e","__esModule","default","defaultTheme","primaryColor","backgroundColor","textColor","inputBackgroundColor","Chat","onSendMessage","placeholder","theme","message","setMessage","React","useState","messages","setMessages","refreshing","setRefreshing","onRefresh","useCallback","response","currentTime","Date","toLocaleTimeString","hour","minute","hour12","prev","text","isUser","timestamp","error","console","handleSend","trim","userMessage","chunk","newMessages","lastMessage","length","getMessageStyle","fromUser","styles","messageBubble","botMessage","getTextStyle","messageText","color","createElement","SafeAreaView","style","container","KeyboardAvoidingView","behavior","Platform","OS","content","keyboardVerticalOffset","ScrollView","messagesContainer","contentContainerStyle","messagesContent","refreshControl","RefreshControl","tintColor","colors","progressBackgroundColor","map","msg","i","View","key","messageWrapper","messageShadow","Text","timestampRight","timestampLeft","inputWrapper","inputContainer","TextInput","input","value","onChangeText","placeholderTextColor","multiline","inputButtonsContainer","TouchableOpacity","inputButton","Ionicons","name","size","sendButton","disabledButton","onPress","disabled","exports","StyleSheet","create","flex","padding","paddingBottom","marginBottom","fontSize","marginTop","paddingHorizontal","textAlign","maxWidth","borderRadius","shadowColor","shadowOffset","width","height","shadowOpacity","shadowRadius","elevation","alignSelf","lineHeight","paddingVertical","borderTopWidth","borderTopColor","flexDirection","alignItems","margin","maxHeight","justifyContent","marginHorizontal","marginLeft","opacity"],"sourceRoot":"../../src","sources":["index.tsx"],"mappings":"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","ignoreList":[]}
package/lib/module/index.js CHANGED
@@ -1,37 +1,85 @@
1
1
  import React from 'react';
2
- import { SafeAreaView, Text, StyleSheet, View, TextInput, ScrollView, KeyboardAvoidingView, Platform, Button } from 'react-native';
2
+ import { SafeAreaView, Text, StyleSheet, View, TextInput, ScrollView, KeyboardAvoidingView, Platform, TouchableOpacity, RefreshControl } from 'react-native';
3
+ import { Ionicons as Icon } from '@expo/vector-icons';
3
4
  const defaultTheme = {
4
5
  primaryColor: '#007AFF',
5
6
  backgroundColor: '#FFFFFF',
6
- textColor: '#000000'
7
+ textColor: '#000000',
8
+ inputBackgroundColor: '#FFFFFF'
7
9
  };
8
10
  export const Chat = ({
9
11
  onSendMessage,
12
+ placeholder = 'Type your message here...',
10
13
  theme = defaultTheme
11
14
  }) => {
12
15
  const [message, setMessage] = React.useState('');
13
16
  const [messages, setMessages] = React.useState([]);
17
+ const [refreshing, setRefreshing] = React.useState(false);
18
+ const onRefresh = React.useCallback(async () => {
19
+ setRefreshing(true);
20
+ try {
21
+ const response = await onSendMessage("Hi, I'm refreshing the chat!");
22
+ const currentTime = new Date().toLocaleTimeString([], {
23
+ hour: 'numeric',
24
+ minute: '2-digit',
25
+ hour12: true
26
+ });
27
+ setMessages(prev => [...prev, {
28
+ text: response,
29
+ isUser: false,
30
+ timestamp: currentTime
31
+ }]);
32
+ } catch (error) {
33
+ console.error('Error refreshing chat:', error);
34
+ } finally {
35
+ setRefreshing(false);
36
+ }
37
+ }, [onSendMessage]);
14
38
  const handleSend = async () => {
15
39
  if (!message.trim()) return;
16
40
  const userMessage = message;
17
41
  setMessage('');
42
+ const currentTime = new Date().toLocaleTimeString([], {
43
+ hour: 'numeric',
44
+ minute: '2-digit',
45
+ hour12: true
46
+ });
18
47
  setMessages(prev => [...prev, {
19
48
  text: userMessage,
20
- isUser: true
49
+ isUser: true,
50
+ timestamp: currentTime
21
51
  }]);
22
52
  try {
23
- const response = await onSendMessage(userMessage);
53
+ // Create bot message placeholder before streaming
24
54
  setMessages(prev => [...prev, {
25
- text: response,
26
- isUser: false
55
+ text: '',
56
+ isUser: false,
57
+ timestamp: currentTime
27
58
  }]);
59
+ const response = await onSendMessage(userMessage, chunk => {
60
+ setMessages(prev => {
61
+ const newMessages = [...prev];
62
+ const lastMessage = newMessages[newMessages.length - 1];
63
+ if (lastMessage && !lastMessage.isUser) {
64
+ lastMessage.text += chunk;
65
+ }
66
+ return newMessages;
67
+ });
68
+ });
69
+
70
+ // Only update if final response is different from streamed content
71
+ setMessages(prev => {
72
+ const newMessages = [...prev];
73
+ const lastMessage = newMessages[newMessages.length - 1];
74
+ if (lastMessage && !lastMessage.isUser && lastMessage.text !== response) {
75
+ lastMessage.text = response;
76
+ }
77
+ return newMessages;
78
+ });
28
79
  } catch (error) {
29
80
  console.error('Error sending message:', error);
30
81
  }
31
82
  };
32
- const containerStyle = [styles.container, {
33
- backgroundColor: theme.backgroundColor
34
- }];
35
83
  const getMessageStyle = fromUser => [styles.messageBubble, fromUser ? styles.userMessage : styles.botMessage, {
36
84
  backgroundColor: fromUser ? theme.primaryColor : '#E8E8E8'
37
85
  }];
@@ -39,33 +87,72 @@ export const Chat = ({
39
87
  color: fromUser ? '#fff' : theme.textColor
40
88
  }];
41
89
  return /*#__PURE__*/React.createElement(SafeAreaView, {
42
- style: containerStyle,
43
- testID: "chat-container"
90
+ style: [styles.container, {
91
+ backgroundColor: theme.backgroundColor
92
+ }]
44
93
  }, /*#__PURE__*/React.createElement(KeyboardAvoidingView, {
45
94
  behavior: Platform.OS === 'ios' ? 'padding' : 'height',
46
- style: styles.content
95
+ style: styles.content,
96
+ keyboardVerticalOffset: Platform.OS === 'ios' ? 60 : 0
47
97
  }, /*#__PURE__*/React.createElement(ScrollView, {
48
- style: styles.messagesContainer
98
+ style: styles.messagesContainer,
99
+ contentContainerStyle: styles.messagesContent,
100
+ refreshControl: /*#__PURE__*/React.createElement(RefreshControl, {
101
+ refreshing: refreshing,
102
+ onRefresh: onRefresh,
103
+ tintColor: theme.primaryColor || defaultTheme.primaryColor,
104
+ colors: [theme.primaryColor || defaultTheme.primaryColor],
105
+ progressBackgroundColor: "#ffffff"
106
+ })
49
107
  }, messages.map((msg, i) => /*#__PURE__*/React.createElement(View, {
50
108
  key: i,
51
- style: getMessageStyle(msg.isUser)
109
+ style: styles.messageWrapper
110
+ }, /*#__PURE__*/React.createElement(View, {
111
+ style: [getMessageStyle(msg.isUser), styles.messageShadow]
52
112
  }, /*#__PURE__*/React.createElement(Text, {
53
113
  style: getTextStyle(msg.isUser)
54
- }, msg.text)))), /*#__PURE__*/React.createElement(View, {
114
+ }, msg.text)), /*#__PURE__*/React.createElement(Text, {
115
+ style: [styles.timestamp, msg.isUser ? styles.timestampRight : styles.timestampLeft]
116
+ }, msg.timestamp)))), /*#__PURE__*/React.createElement(View, {
117
+ style: styles.inputWrapper
118
+ }, /*#__PURE__*/React.createElement(View, {
55
119
  style: styles.inputContainer
56
120
  }, /*#__PURE__*/React.createElement(TextInput, {
57
- style: [styles.input, {
58
- color: theme.textColor
59
- }],
121
+ style: styles.input,
60
122
  value: message,
61
123
  onChangeText: setMessage,
62
- placeholder: "Type a message...",
63
- placeholderTextColor: "#999"
64
- }), /*#__PURE__*/React.createElement(Button, {
65
- title: "Send",
124
+ placeholder: placeholder,
125
+ placeholderTextColor: "#999",
126
+ multiline: true
127
+ })), /*#__PURE__*/React.createElement(View, {
128
+ style: styles.inputButtonsContainer
129
+ }, /*#__PURE__*/React.createElement(TouchableOpacity, {
130
+ style: styles.inputButton
131
+ }, /*#__PURE__*/React.createElement(Icon, {
132
+ name: "add",
133
+ size: 28,
134
+ color: "#8E8E93"
135
+ })), /*#__PURE__*/React.createElement(TouchableOpacity, {
136
+ style: styles.inputButton
137
+ }, /*#__PURE__*/React.createElement(Icon, {
138
+ name: "refresh-outline",
139
+ size: 28,
140
+ color: "#8E8E93"
141
+ })), /*#__PURE__*/React.createElement(TouchableOpacity, {
142
+ style: styles.inputButton
143
+ }, /*#__PURE__*/React.createElement(Icon, {
144
+ name: "mic-outline",
145
+ size: 28,
146
+ color: "#8E8E93"
147
+ })), /*#__PURE__*/React.createElement(TouchableOpacity, {
148
+ style: [styles.sendButton, !message.trim() && styles.disabledButton],
66
149
  onPress: handleSend,
67
- color: theme.primaryColor
68
- }))));
150
+ disabled: !message.trim()
151
+ }, /*#__PURE__*/React.createElement(Icon, {
152
+ name: "paper-plane-outline",
153
+ size: 28,
154
+ color: message.trim() ? theme.primaryColor : '#8E8E93'
155
+ }))))));
69
156
  };
70
157
  const styles = StyleSheet.create({
71
158
  container: {
@@ -73,86 +160,108 @@ const styles = StyleSheet.create({
73
160
  backgroundColor: '#FFFFFF'
74
161
  },
75
162
  content: {
76
- flex: 1,
77
- backgroundColor: '#F8F9FA'
163
+ flex: 1
78
164
  },
79
165
  messagesContainer: {
80
- flex: 1,
81
- padding: 20,
82
- paddingTop: 30
166
+ flex: 1
83
167
  },
84
- messageBubble: {
85
- maxWidth: '85%',
168
+ messagesContent: {
86
169
  padding: 16,
170
+ paddingBottom: 32
171
+ },
172
+ messageWrapper: {
173
+ marginBottom: 16
174
+ },
175
+ timestamp: {
176
+ fontSize: 12,
177
+ color: '#8E8E93',
178
+ marginTop: 4,
179
+ paddingHorizontal: 4
180
+ },
181
+ timestampRight: {
182
+ textAlign: 'right'
183
+ },
184
+ timestampLeft: {
185
+ textAlign: 'left'
186
+ },
187
+ messageBubble: {
188
+ maxWidth: '70%',
189
+ padding: 12,
190
+ paddingHorizontal: 16,
87
191
  borderRadius: 20,
88
- marginBottom: 16,
89
- backgroundColor: '#FFFFFF',
192
+ backgroundColor: '#FFFFFF'
193
+ },
194
+ messageShadow: {
90
195
  shadowColor: '#000',
91
196
  shadowOffset: {
92
197
  width: 0,
93
- height: 2
198
+ height: 1
94
199
  },
95
- shadowOpacity: 0.05,
96
- shadowRadius: 8,
97
- elevation: 3
200
+ shadowOpacity: 0.08,
201
+ shadowRadius: 2,
202
+ elevation: 2
98
203
  },
99
204
  userMessage: {
100
205
  alignSelf: 'flex-end',
101
- backgroundColor: '#FFFFFF',
102
- borderWidth: 1,
103
- borderColor: 'rgba(0, 0, 0, 0.04)'
206
+ backgroundColor: '#007AFF'
104
207
  },
105
208
  botMessage: {
106
209
  alignSelf: 'flex-start',
107
- backgroundColor: '#FFFFFF',
108
- borderWidth: 1,
109
- borderColor: 'rgba(0, 0, 0, 0.04)'
210
+ backgroundColor: '#F2F2F7'
110
211
  },
111
212
  messageText: {
112
- fontSize: 15,
113
- lineHeight: 22,
114
- fontWeight: '400',
115
- color: '#2C2C2E',
116
- letterSpacing: 0.2
213
+ fontSize: 16,
214
+ lineHeight: 22
215
+ },
216
+ inputWrapper: {
217
+ backgroundColor: '#FFFFFF',
218
+ paddingHorizontal: 8,
219
+ paddingVertical: 8,
220
+ borderTopWidth: 1,
221
+ borderTopColor: 'rgba(0, 0, 0, 0.1)'
117
222
  },
118
223
  inputContainer: {
119
224
  flexDirection: 'row',
120
225
  alignItems: 'center',
121
- paddingHorizontal: 16,
122
- paddingVertical: 12,
226
+ paddingHorizontal: 8,
227
+ paddingVertical: 8,
123
228
  backgroundColor: '#FFFFFF',
124
- borderTopWidth: 1,
125
- borderTopColor: 'rgba(0, 0, 0, 0.06)',
229
+ borderRadius: 16,
230
+ margin: 8,
126
231
  shadowColor: '#000',
127
232
  shadowOffset: {
128
233
  width: 0,
129
- height: -8
234
+ height: 2
130
235
  },
131
- shadowOpacity: 0.04,
132
- shadowRadius: 12,
133
- elevation: 8,
134
- marginTop: 'auto'
236
+ shadowOpacity: 0.1,
237
+ shadowRadius: 4,
238
+ elevation: 3
135
239
  },
136
240
  input: {
137
241
  flex: 1,
138
- backgroundColor: '#F8F9FA',
139
- borderRadius: 16,
140
- borderWidth: 1,
141
- borderColor: 'rgba(0, 0, 0, 0.06)',
142
- paddingHorizontal: 20,
143
- paddingVertical: 12,
144
- marginRight: 12,
145
- fontSize: 15,
146
- maxHeight: 120,
147
- color: '#2C2C2E',
148
- shadowColor: '#000',
149
- shadowOffset: {
150
- width: 0,
151
- height: 1
152
- },
153
- shadowOpacity: 0.04,
154
- shadowRadius: 4,
155
- elevation: 2
242
+ fontSize: 16,
243
+ paddingVertical: 8,
244
+ paddingHorizontal: 12,
245
+ maxHeight: 100,
246
+ color: '#000000'
247
+ },
248
+ inputButtonsContainer: {
249
+ flexDirection: 'row',
250
+ alignItems: 'center',
251
+ justifyContent: 'space-between',
252
+ paddingHorizontal: 8,
253
+ marginTop: 4
254
+ },
255
+ inputButton: {
256
+ padding: 6,
257
+ marginHorizontal: 4
258
+ },
259
+ sendButton: {
260
+ padding: 6,
261
+ marginLeft: 'auto'
262
+ },
263
+ disabledButton: {
264
+ opacity: 0.7
156
265
  }
157
266
  });
158
267
  //# sourceMappingURL=index.js.map
package/lib/module/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"names":["React","SafeAreaView","Text","StyleSheet","View","TextInput","ScrollView","KeyboardAvoidingView","Platform","Button","defaultTheme","primaryColor","backgroundColor","textColor","Chat","onSendMessage","theme","message","setMessage","useState","messages","setMessages","handleSend","trim","userMessage","prev","text","isUser","response","error","console","containerStyle","styles","container","getMessageStyle","fromUser","messageBubble","botMessage","getTextStyle","messageText","color","createElement","style","testID","behavior","OS","content","messagesContainer","map","msg","i","key","inputContainer","input","value","onChangeText","placeholder","placeholderTextColor","title","onPress","create","flex","padding","paddingTop","maxWidth","borderRadius","marginBottom","shadowColor","shadowOffset","width","height","shadowOpacity","shadowRadius","elevation","alignSelf","borderWidth","borderColor","fontSize","lineHeight","fontWeight","letterSpacing","flexDirection","alignItems","paddingHorizontal","paddingVertical","borderTopWidth","borderTopColor","marginTop","marginRight","maxHeight"],"sourceRoot":"../../src","sources":["index.tsx"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"names":["React","SafeAreaView","Text","StyleSheet","View","TextInput","ScrollView","KeyboardAvoidingView","Platform","TouchableOpacity","RefreshControl","Ionicons","Icon","defaultTheme","primaryColor","backgroundColor","textColor","inputBackgroundColor","Chat","onSendMessage","placeholder","theme","message","setMessage","useState","messages","setMessages","refreshing","setRefreshing","onRefresh","useCallback","response","currentTime","Date","toLocaleTimeString","hour","minute","hour12","prev","text","isUser","timestamp","error","console","handleSend","trim","userMessage","chunk","newMessages","lastMessage","length","getMessageStyle","fromUser","styles","messageBubble","botMessage","getTextStyle","messageText","color","createElement","style","container","behavior","OS","content","keyboardVerticalOffset","messagesContainer","contentContainerStyle","messagesContent","refreshControl","tintColor","colors","progressBackgroundColor","map","msg","i","key","messageWrapper","messageShadow","timestampRight","timestampLeft","inputWrapper","inputContainer","input","value","onChangeText","placeholderTextColor","multiline","inputButtonsContainer","inputButton","name","size","sendButton","disabledButton","onPress","disabled","create","flex","padding","paddingBottom","marginBottom","fontSize","marginTop","paddingHorizontal","textAlign","maxWidth","borderRadius","shadowColor","shadowOffset","width","height","shadowOpacity","shadowRadius","elevation","alignSelf","lineHeight","paddingVertical","borderTopWidth","borderTopColor","flexDirection","alignItems","margin","maxHeight","justifyContent","marginHorizontal","marginLeft","opacity"],"sourceRoot":"../../src","sources":["index.tsx"],"mappings":"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","ignoreList":[]}
package/lib/typescript/index.d.ts CHANGED
@@ -1,11 +1,12 @@
1
1
  import React from 'react';
2
2
  interface ChatProps {
3
- onSendMessage: (message: string) => Promise<string>;
3
+ onSendMessage: (message: string, onStream?: (chunk: string) => void) => Promise<string>;
4
4
  placeholder?: string;
5
5
  theme?: {
6
6
  primaryColor?: string;
7
7
  backgroundColor?: string;
8
8
  textColor?: string;
9
+ inputBackgroundColor?: string;
9
10
  };
10
11
  }
11
12
  export declare const Chat: React.FC<ChatProps>;
package/lib/typescript/index.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAa1B,UAAU,SAAS;IACjB,aAAa,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,OAAO,CAAC,MAAM,CAAC,CAAC;IACpD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,CAAC,EAAE;QACN,YAAY,CAAC,EAAE,MAAM,CAAC;QACtB,eAAe,CAAC,EAAE,MAAM,CAAC;QACzB,SAAS,CAAC,EAAE,MAAM,CAAC;KACpB,CAAC;CACH;AAQD,eAAO,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CA2EpC,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAe1B,UAAU,SAAS;IACjB,aAAa,EAAE,CACb,OAAO,EAAE,MAAM,EACf,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,KAC/B,OAAO,CAAC,MAAM,CAAC,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,CAAC,EAAE;QACN,YAAY,CAAC,EAAE,MAAM,CAAC;QACtB,eAAe,CAAC,EAAE,MAAM,CAAC;QACzB,SAAS,CAAC,EAAE,MAAM,CAAC;QACnB,oBAAoB,CAAC,EAAE,MAAM,CAAC;KAC/B,CAAC;CACH;AASD,eAAO,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CA+KpC,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "react-native-srschat",
3
- "version": "0.1.4",
3
+ "version": "0.1.7",
4
4
  "private": false,
5
5
  "description": "A modern, sophisticated chat interface for React Native",
6
6
  "main": "lib/commonjs/index",
@@ -33,11 +33,12 @@
33
33
  "@babel/preset-env": "^7.20.0",
34
34
  "@babel/preset-react": "^7.20.0",
35
35
  "@babel/preset-typescript": "^7.20.0",
36
- "@react-native/eslint-config": "^0.72.2",
37
36
  "@react-native/babel-preset": "^0.73.18",
38
37
  "@react-native/codegen": "^0.73.3",
38
+ "@react-native/eslint-config": "^0.72.2",
39
39
  "@types/react": "^18.2.0",
40
40
  "@types/react-native": "~0.72.8",
41
+ "@types/react-native-vector-icons": "^6.4.18",
41
42
  "@typescript-eslint/eslint-plugin": "^5.0.0",
42
43
  "@typescript-eslint/parser": "^5.0.0",
43
44
  "eslint": "^8.0.0",
@@ -58,7 +59,8 @@
58
59
  },
59
60
  "homepage": "https://github.com/alxkai/react-native-srschat#readme",
60
61
  "dependencies": {
61
- "@babel/runtime": "^7.20.0"
62
+ "@babel/runtime": "^7.20.0",
63
+ "@expo/vector-icons": "^14.0.4"
62
64
  },
63
65
  "react-native-builder-bob": {
64
66
  "source": "src",
@@ -71,6 +73,7 @@
71
73
  },
72
74
  "packageManager": "yarn@1.22.22+sha512.a6b2f7906b721bba3d67d4aff083df04dad64c399707841b7acf00f6b133b7ac24255f2652fa22ae3534329dc6180534e98d17432037ff6fd140556e2bb3137e",
73
75
  "scripts": {
76
+ "build": "bob build",
74
77
  "prepare": "bob build",
75
78
  "release": "release-it",
76
79
  "example": "yarn --cwd example",
package/src/index.tsx CHANGED
@@ -8,16 +8,22 @@ import {
8
8
  ScrollView,
9
9
  KeyboardAvoidingView,
10
10
  Platform,
11
- Button,
11
+ TouchableOpacity,
12
+ RefreshControl,
12
13
  } from 'react-native';
14
+ import { Ionicons as Icon } from '@expo/vector-icons';
13
15
 
14
16
  interface ChatProps {
15
- onSendMessage: (message: string) => Promise<string>;
17
+ onSendMessage: (
18
+ message: string,
19
+ onStream?: (chunk: string) => void
20
+ ) => Promise<string>;
16
21
  placeholder?: string;
17
22
  theme?: {
18
23
  primaryColor?: string;
19
24
  backgroundColor?: string;
20
25
  textColor?: string;
26
+ inputBackgroundColor?: string;
21
27
  };
22
28
  }
23
29
 
@@ -25,37 +31,96 @@ const defaultTheme = {
25
31
  primaryColor: '#007AFF',
26
32
  backgroundColor: '#FFFFFF',
27
33
  textColor: '#000000',
34
+ inputBackgroundColor: '#FFFFFF',
28
35
  };
29
36
 
30
37
  export const Chat: React.FC<ChatProps> = ({
31
38
  onSendMessage,
39
+ placeholder = 'Type your message here...',
32
40
  theme = defaultTheme,
33
41
  }) => {
34
42
  const [message, setMessage] = React.useState('');
35
- const [messages, setMessages] = React.useState<Array<{text: string; isUser: boolean}>>([]);
43
+ const [messages, setMessages] = React.useState<Array<{
44
+ text: string;
45
+ isUser: boolean;
46
+ timestamp: string;
47
+ }>>([]);
48
+ const [refreshing, setRefreshing] = React.useState(false);
49
+
50
+ const onRefresh = React.useCallback(async () => {
51
+ setRefreshing(true);
52
+ try {
53
+ const response = await onSendMessage("Hi, I'm refreshing the chat!");
54
+ const currentTime = new Date().toLocaleTimeString([], {
55
+ hour: 'numeric',
56
+ minute: '2-digit',
57
+ hour12: true
58
+ });
59
+ setMessages(prev => [...prev, {
60
+ text: response,
61
+ isUser: false,
62
+ timestamp: currentTime
63
+ }]);
64
+ } catch (error) {
65
+ console.error('Error refreshing chat:', error);
66
+ } finally {
67
+ setRefreshing(false);
68
+ }
69
+ }, [onSendMessage]);
36
70
 
37
71
  const handleSend = async () => {
38
72
  if (!message.trim()) return;
39
73
 
40
74
  const userMessage = message;
41
75
  setMessage('');
42
- setMessages(prev => [...prev, { text: userMessage, isUser: true }]);
76
+ const currentTime = new Date().toLocaleTimeString([], {
77
+ hour: 'numeric',
78
+ minute: '2-digit',
79
+ hour12: true
80
+ });
81
+
82
+ setMessages(prev => [...prev, {
83
+ text: userMessage,
84
+ isUser: true,
85
+ timestamp: currentTime
86
+ }]);
43
87
 
44
88
  try {
45
- const response = await onSendMessage(userMessage);
46
- setMessages(prev => [...prev, { text: response, isUser: false }]);
89
+ // Create bot message placeholder before streaming
90
+ setMessages(prev => [...prev, {
91
+ text: '',
92
+ isUser: false,
93
+ timestamp: currentTime
94
+ }]);
95
+
96
+ const response = await onSendMessage(
97
+ userMessage,
98
+ (chunk) => {
99
+ setMessages(prev => {
100
+ const newMessages = [...prev];
101
+ const lastMessage = newMessages[newMessages.length - 1];
102
+ if (lastMessage && !lastMessage.isUser) {
103
+ lastMessage.text += chunk;
104
+ }
105
+ return newMessages;
106
+ });
107
+ }
108
+ );
109
+
110
+ // Only update if final response is different from streamed content
111
+ setMessages(prev => {
112
+ const newMessages = [...prev];
113
+ const lastMessage = newMessages[newMessages.length - 1];
114
+ if (lastMessage && !lastMessage.isUser && lastMessage.text !== response) {
115
+ lastMessage.text = response;
116
+ }
117
+ return newMessages;
118
+ });
47
119
  } catch (error) {
48
120
  console.error('Error sending message:', error);
49
121
  }
50
122
  };
51
123
 
52
- const containerStyle = [
53
- styles.container,
54
- {
55
- backgroundColor: theme.backgroundColor,
56
- },
57
- ];
58
-
59
124
  const getMessageStyle = (fromUser: boolean) => [
60
125
  styles.messageBubble,
61
126
  fromUser ? styles.userMessage : styles.botMessage,
@@ -68,36 +133,78 @@ export const Chat: React.FC<ChatProps> = ({
68
133
  ];
69
134
 
70
135
  return (
71
- <SafeAreaView style={containerStyle} testID="chat-container">
136
+ <SafeAreaView style={[styles.container, { backgroundColor: theme.backgroundColor }]}>
72
137
  <KeyboardAvoidingView
73
138
  behavior={Platform.OS === 'ios' ? 'padding' : 'height'}
74
139
  style={styles.content}
140
+ keyboardVerticalOffset={Platform.OS === 'ios' ? 60 : 0}
75
141
  >
76
- <ScrollView style={styles.messagesContainer}>
142
+ <ScrollView
143
+ style={styles.messagesContainer}
144
+ contentContainerStyle={styles.messagesContent}
145
+ refreshControl={
146
+ <RefreshControl
147
+ refreshing={refreshing}
148
+ onRefresh={onRefresh}
149
+ tintColor={theme.primaryColor || defaultTheme.primaryColor}
150
+ colors={[theme.primaryColor || defaultTheme.primaryColor]}
151
+ progressBackgroundColor="#ffffff"
152
+ />
153
+ }
154
+ >
77
155
  {messages.map((msg, i) => (
78
- <View
79
- key={i}
80
- style={getMessageStyle(msg.isUser)}
81
- >
82
- <Text style={getTextStyle(msg.isUser)}>
83
- {msg.text}
156
+ <View key={i} style={styles.messageWrapper}>
157
+ <View style={[getMessageStyle(msg.isUser), styles.messageShadow]}>
158
+ <Text style={getTextStyle(msg.isUser)}>
159
+ {msg.text}
160
+ </Text>
161
+ </View>
162
+ <Text style={[
163
+ styles.timestamp,
164
+ msg.isUser ? styles.timestampRight : styles.timestampLeft
165
+ ]}>
166
+ {msg.timestamp}
84
167
  </Text>
85
168
  </View>
86
169
  ))}
87
170
  </ScrollView>
88
- <View style={styles.inputContainer}>
89
- <TextInput
90
- style={[styles.input, { color: theme.textColor }]}
91
- value={message}
92
- onChangeText={setMessage}
93
- placeholder="Type a message..."
94
- placeholderTextColor="#999"
95
- />
96
- <Button
97
- title="Send"
98
- onPress={handleSend}
99
- color={theme.primaryColor}
100
- />
171
+
172
+ <View style={styles.inputWrapper}>
173
+ <View style={styles.inputContainer}>
174
+ <TextInput
175
+ style={styles.input}
176
+ value={message}
177
+ onChangeText={setMessage}
178
+ placeholder={placeholder}
179
+ placeholderTextColor="#999"
180
+ multiline
181
+ />
182
+ </View>
183
+ <View style={styles.inputButtonsContainer}>
184
+ <TouchableOpacity style={styles.inputButton}>
185
+ <Icon name="add" size={28} color="#8E8E93" />
186
+ </TouchableOpacity>
187
+ <TouchableOpacity style={styles.inputButton}>
188
+ <Icon name="refresh-outline" size={28} color="#8E8E93" />
189
+ </TouchableOpacity>
190
+ <TouchableOpacity style={styles.inputButton}>
191
+ <Icon name="mic-outline" size={28} color="#8E8E93" />
192
+ </TouchableOpacity>
193
+ <TouchableOpacity
194
+ style={[
195
+ styles.sendButton,
196
+ !message.trim() && styles.disabledButton
197
+ ]}
198
+ onPress={handleSend}
199
+ disabled={!message.trim()}
200
+ >
201
+ <Icon
202
+ name="paper-plane-outline"
203
+ size={28}
204
+ color={message.trim() ? theme.primaryColor : '#8E8E93'}
205
+ />
206
+ </TouchableOpacity>
207
+ </View>
101
208
  </View>
102
209
  </KeyboardAvoidingView>
103
210
  </SafeAreaView>
@@ -111,84 +218,106 @@ const styles = StyleSheet.create({
111
218
  },
112
219
  content: {
113
220
  flex: 1,
114
- backgroundColor: '#F8F9FA',
115
221
  },
116
222
  messagesContainer: {
117
223
  flex: 1,
118
- padding: 20,
119
- paddingTop: 30,
120
224
  },
121
- messageBubble: {
122
- maxWidth: '85%',
225
+ messagesContent: {
123
226
  padding: 16,
124
- borderRadius: 20,
227
+ paddingBottom: 32,
228
+ },
229
+ messageWrapper: {
125
230
  marginBottom: 16,
231
+ },
232
+ timestamp: {
233
+ fontSize: 12,
234
+ color: '#8E8E93',
235
+ marginTop: 4,
236
+ paddingHorizontal: 4,
237
+ },
238
+ timestampRight: {
239
+ textAlign: 'right',
240
+ },
241
+ timestampLeft: {
242
+ textAlign: 'left',
243
+ },
244
+ messageBubble: {
245
+ maxWidth: '70%',
246
+ padding: 12,
247
+ paddingHorizontal: 16,
248
+ borderRadius: 20,
126
249
  backgroundColor: '#FFFFFF',
250
+ },
251
+ messageShadow: {
127
252
  shadowColor: '#000',
128
253
  shadowOffset: {
129
254
  width: 0,
130
- height: 2,
255
+ height: 1,
131
256
  },
132
- shadowOpacity: 0.05,
133
- shadowRadius: 8,
134
- elevation: 3,
257
+ shadowOpacity: 0.08,
258
+ shadowRadius: 2,
259
+ elevation: 2,
135
260
  },
136
261
  userMessage: {
137
262
  alignSelf: 'flex-end',
138
- backgroundColor: '#FFFFFF',
139
- borderWidth: 1,
140
- borderColor: 'rgba(0, 0, 0, 0.04)',
263
+ backgroundColor: '#007AFF',
141
264
  },
142
265
  botMessage: {
143
266
  alignSelf: 'flex-start',
144
- backgroundColor: '#FFFFFF',
145
- borderWidth: 1,
146
- borderColor: 'rgba(0, 0, 0, 0.04)',
267
+ backgroundColor: '#F2F2F7',
147
268
  },
148
269
  messageText: {
149
- fontSize: 15,
270
+ fontSize: 16,
150
271
  lineHeight: 22,
151
- fontWeight: '400',
152
- color: '#2C2C2E',
153
- letterSpacing: 0.2,
272
+ },
273
+ inputWrapper: {
274
+ backgroundColor: '#FFFFFF',
275
+ paddingHorizontal: 8,
276
+ paddingVertical: 8,
277
+ borderTopWidth: 1,
278
+ borderTopColor: 'rgba(0, 0, 0, 0.1)',
154
279
  },
155
280
  inputContainer: {
156
281
  flexDirection: 'row',
157
282
  alignItems: 'center',
158
- paddingHorizontal: 16,
159
- paddingVertical: 12,
283
+ paddingHorizontal: 8,
284
+ paddingVertical: 8,
160
285
  backgroundColor: '#FFFFFF',
161
- borderTopWidth: 1,
162
- borderTopColor: 'rgba(0, 0, 0, 0.06)',
286
+ borderRadius: 16,
287
+ margin: 8,
163
288
  shadowColor: '#000',
164
289
  shadowOffset: {
165
290
  width: 0,
166
- height: -8,
291
+ height: 2,
167
292
  },
168
- shadowOpacity: 0.04,
169
- shadowRadius: 12,
170
- elevation: 8,
171
- marginTop: 'auto',
293
+ shadowOpacity: 0.1,
294
+ shadowRadius: 4,
295
+ elevation: 3,
172
296
  },
173
297
  input: {
174
298
  flex: 1,
175
- backgroundColor: '#F8F9FA',
176
- borderRadius: 16,
177
- borderWidth: 1,
178
- borderColor: 'rgba(0, 0, 0, 0.06)',
179
- paddingHorizontal: 20,
180
- paddingVertical: 12,
181
- marginRight: 12,
182
- fontSize: 15,
183
- maxHeight: 120,
184
- color: '#2C2C2E',
185
- shadowColor: '#000',
186
- shadowOffset: {
187
- width: 0,
188
- height: 1,
189
- },
190
- shadowOpacity: 0.04,
191
- shadowRadius: 4,
192
- elevation: 2,
299
+ fontSize: 16,
300
+ paddingVertical: 8,
301
+ paddingHorizontal: 12,
302
+ maxHeight: 100,
303
+ color: '#000000',
304
+ },
305
+ inputButtonsContainer: {
306
+ flexDirection: 'row',
307
+ alignItems: 'center',
308
+ justifyContent: 'space-between',
309
+ paddingHorizontal: 8,
310
+ marginTop: 4,
311
+ },
312
+ inputButton: {
313
+ padding: 6,
314
+ marginHorizontal: 4,
315
+ },
316
+ sendButton: {
317
+ padding: 6,
318
+ marginLeft: 'auto',
319
+ },
320
+ disabledButton: {
321
+ opacity: 0.7,
193
322
  },
194
323
  });