react-native-gifted-chat 2.4.0 → 2.5.1

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 (159) hide show
  1. package/README.md +16 -6
  2. package/lib/Actions.d.ts +5 -6
  3. package/lib/Actions.js +16 -13
  4. package/lib/Actions.js.map +1 -1
  5. package/lib/Avatar.d.ts +10 -24
  6. package/lib/Avatar.js +24 -35
  7. package/lib/Avatar.js.flow +1 -1
  8. package/lib/Avatar.js.map +1 -1
  9. package/lib/Bubble.d.ts +30 -29
  10. package/lib/Bubble.js +90 -72
  11. package/lib/Bubble.js.flow +3 -1
  12. package/lib/Bubble.js.map +1 -1
  13. package/lib/Composer.d.ts +1 -1
  14. package/lib/Composer.js +30 -32
  15. package/lib/Composer.js.map +1 -1
  16. package/lib/Constant.js +1 -0
  17. package/lib/Constant.js.map +1 -1
  18. package/lib/Day.d.ts +3 -15
  19. package/lib/Day.js +2 -14
  20. package/lib/Day.js.flow +1 -1
  21. package/lib/Day.js.map +1 -1
  22. package/lib/GiftedAvatar.d.ts +7 -7
  23. package/lib/GiftedAvatar.js +30 -29
  24. package/lib/GiftedAvatar.js.map +1 -1
  25. package/lib/GiftedChat.d.ts +16 -89
  26. package/lib/GiftedChat.js +204 -350
  27. package/lib/GiftedChat.js.flow +3 -3
  28. package/lib/GiftedChat.js.map +1 -1
  29. package/lib/GiftedChatContext.d.ts +2 -1
  30. package/lib/GiftedChatContext.js.map +1 -1
  31. package/lib/InputToolbar.d.ts +7 -5
  32. package/lib/InputToolbar.js +41 -34
  33. package/lib/InputToolbar.js.map +1 -1
  34. package/lib/LoadEarlier.d.ts +4 -4
  35. package/lib/LoadEarlier.js +8 -6
  36. package/lib/LoadEarlier.js.map +1 -1
  37. package/lib/Message.d.ts +8 -9
  38. package/lib/Message.js +47 -40
  39. package/lib/Message.js.flow +1 -1
  40. package/lib/Message.js.map +1 -1
  41. package/lib/MessageAudio.d.ts +2 -1
  42. package/lib/MessageAudio.js +4 -4
  43. package/lib/MessageAudio.js.flow +1 -1
  44. package/lib/MessageAudio.js.map +1 -1
  45. package/lib/MessageContainer.d.ts +17 -17
  46. package/lib/MessageContainer.js +33 -51
  47. package/lib/MessageContainer.js.map +1 -1
  48. package/lib/MessageImage.d.ts +8 -5
  49. package/lib/MessageImage.js +6 -6
  50. package/lib/MessageImage.js.flow +1 -1
  51. package/lib/MessageImage.js.map +1 -1
  52. package/lib/MessageText.d.ts +11 -10
  53. package/lib/MessageText.js +5 -10
  54. package/lib/MessageText.js.flow +1 -1
  55. package/lib/MessageText.js.map +1 -1
  56. package/lib/MessageVideo.d.ts +2 -1
  57. package/lib/MessageVideo.js +4 -4
  58. package/lib/MessageVideo.js.flow +1 -1
  59. package/lib/MessageVideo.js.map +1 -1
  60. package/lib/Models.d.ts +7 -7
  61. package/lib/QuickReplies.d.ts +4 -3
  62. package/lib/QuickReplies.js +10 -16
  63. package/lib/QuickReplies.js.flow +4 -2
  64. package/lib/QuickReplies.js.map +1 -1
  65. package/lib/Send.d.ts +4 -4
  66. package/lib/Send.js +6 -9
  67. package/lib/Send.js.map +1 -1
  68. package/lib/SystemMessage.d.ts +6 -5
  69. package/lib/SystemMessage.js +1 -2
  70. package/lib/SystemMessage.js.flow +1 -1
  71. package/lib/SystemMessage.js.map +1 -1
  72. package/lib/Time.d.ts +7 -6
  73. package/lib/Time.js +1 -3
  74. package/lib/Time.js.flow +1 -1
  75. package/lib/Time.js.map +1 -1
  76. package/lib/TypingIndicator.d.ts +2 -1
  77. package/lib/TypingIndicator.js +5 -5
  78. package/lib/TypingIndicator.js.map +1 -1
  79. package/lib/hooks/useUpdateLayoutEffect.js +2 -4
  80. package/lib/hooks/useUpdateLayoutEffect.js.map +1 -1
  81. package/lib/index.d.ts +1 -0
  82. package/lib/index.js +1 -0
  83. package/lib/index.js.map +1 -1
  84. package/lib/logging.d.ts +2 -2
  85. package/lib/logging.js.map +1 -1
  86. package/lib/types.js.flow +1 -1
  87. package/lib/utils.d.ts +1 -1
  88. package/lib/utils.js +2 -4
  89. package/lib/utils.js.map +1 -1
  90. package/package.json +83 -53
  91. package/src/Actions.tsx +114 -0
  92. package/src/Avatar.tsx +178 -0
  93. package/src/Bubble.tsx +601 -0
  94. package/src/Color.ts +17 -0
  95. package/src/Composer.tsx +147 -0
  96. package/src/Constant.ts +18 -0
  97. package/src/Day.tsx +71 -0
  98. package/src/GiftedAvatar.tsx +205 -0
  99. package/src/GiftedChat.tsx +670 -0
  100. package/src/GiftedChatContext.ts +23 -0
  101. package/src/InputToolbar.tsx +113 -0
  102. package/src/LoadEarlier.tsx +108 -0
  103. package/src/Message.tsx +229 -0
  104. package/src/MessageAudio.tsx +19 -0
  105. package/src/MessageContainer.tsx +362 -0
  106. package/src/MessageImage.tsx +78 -0
  107. package/src/MessageText.tsx +187 -0
  108. package/src/MessageVideo.tsx +19 -0
  109. package/src/Models.ts +84 -0
  110. package/src/QuickReplies.tsx +186 -0
  111. package/src/Send.tsx +102 -0
  112. package/src/SystemMessage.tsx +61 -0
  113. package/src/Time.tsx +97 -0
  114. package/src/TypingIndicator.tsx +108 -0
  115. package/src/__tests__/Actions.test.tsx +10 -0
  116. package/src/__tests__/Avatar.test.tsx +13 -0
  117. package/src/__tests__/Bubble.test.tsx +23 -0
  118. package/src/__tests__/Color.test.tsx +5 -0
  119. package/src/__tests__/Composer.test.tsx +11 -0
  120. package/src/__tests__/Constant.test.tsx +5 -0
  121. package/src/__tests__/Day.test.tsx +23 -0
  122. package/src/__tests__/GiftedAvatar.test.tsx +11 -0
  123. package/src/__tests__/GiftedChat.test.tsx +36 -0
  124. package/src/__tests__/InputToolbar.test.tsx +11 -0
  125. package/src/__tests__/LoadEarlier.test.tsx +11 -0
  126. package/src/__tests__/Message.test.tsx +77 -0
  127. package/src/__tests__/MessageContainer.test.tsx +11 -0
  128. package/src/__tests__/MessageImage.test.tsx +27 -0
  129. package/src/__tests__/MessageText.test.tsx +11 -0
  130. package/src/__tests__/Send.test.tsx +22 -0
  131. package/src/__tests__/SystemMessage.test.tsx +27 -0
  132. package/src/__tests__/Time.test.tsx +29 -0
  133. package/src/__tests__/__snapshots__/Actions.test.tsx.snap +76 -0
  134. package/src/__tests__/__snapshots__/Avatar.test.tsx.snap +17 -0
  135. package/src/__tests__/__snapshots__/Bubble.test.tsx.snap +145 -0
  136. package/src/__tests__/__snapshots__/Color.test.tsx.snap +21 -0
  137. package/src/__tests__/__snapshots__/Composer.test.tsx.snap +35 -0
  138. package/src/__tests__/__snapshots__/Constant.test.tsx.snap +16 -0
  139. package/src/__tests__/__snapshots__/Day.test.tsx.snap +37 -0
  140. package/src/__tests__/__snapshots__/GiftedAvatar.test.tsx.snap +22 -0
  141. package/src/__tests__/__snapshots__/GiftedChat.test.tsx.snap +15 -0
  142. package/src/__tests__/__snapshots__/InputToolbar.test.tsx.snap +60 -0
  143. package/src/__tests__/__snapshots__/LoadEarlier.test.tsx.snap +74 -0
  144. package/src/__tests__/__snapshots__/Message.test.tsx.snap +628 -0
  145. package/src/__tests__/__snapshots__/MessageContainer.test.tsx.snap +127 -0
  146. package/src/__tests__/__snapshots__/MessageImage.test.tsx.snap +38 -0
  147. package/src/__tests__/__snapshots__/MessageText.test.tsx.snap +30 -0
  148. package/src/__tests__/__snapshots__/Send.test.tsx.snap +129 -0
  149. package/src/__tests__/__snapshots__/SystemMessage.test.tsx.snap +38 -0
  150. package/src/__tests__/__snapshots__/Time.test.tsx.snap +33 -0
  151. package/src/__tests__/data.ts +8 -0
  152. package/src/__tests__/utils.test.ts +31 -0
  153. package/src/hooks/useUpdateLayoutEffect.ts +21 -0
  154. package/src/index.ts +4 -0
  155. package/src/logging.ts +8 -0
  156. package/src/utils.ts +39 -0
  157. package/.eslintignore +0 -2
  158. package/.eslintrc.js +0 -21
  159. package/jest.config.js +0 -15
package/src/__tests__/__snapshots__/Message.test.tsx.snap ADDED
@@ -0,0 +1,628 @@
1
+ // Jest Snapshot v1, https://goo.gl/fbAQLP
2
+
3
+ exports[`Message component should NOT render <Message /> 1`] = `null`;
4
+
5
+ exports[`Message component should render <Message /> and compare with snapshot 1`] = `
6
+ <View>
7
+ <View
8
+ style={
9
+ [
10
+ {
11
+ "alignItems": "center",
12
+ "justifyContent": "center",
13
+ "marginBottom": 10,
14
+ "marginTop": 5,
15
+ },
16
+ undefined,
17
+ ]
18
+ }
19
+ >
20
+ <View>
21
+ <Text
22
+ style={
23
+ [
24
+ {
25
+ "backgroundColor": "transparent",
26
+ "color": "#b2b2b2",
27
+ "fontSize": 12,
28
+ "fontWeight": "600",
29
+ },
30
+ undefined,
31
+ ]
32
+ }
33
+ >
34
+ Apr 8, 2019
35
+ </Text>
36
+ </View>
37
+ </View>
38
+ <View
39
+ style={
40
+ [
41
+ {
42
+ "alignItems": "flex-end",
43
+ "flexDirection": "row",
44
+ "justifyContent": "flex-start",
45
+ "marginLeft": 8,
46
+ "marginRight": 0,
47
+ },
48
+ {
49
+ "marginBottom": 10,
50
+ },
51
+ false,
52
+ undefined,
53
+ ]
54
+ }
55
+ >
56
+ <View
57
+ style={
58
+ [
59
+ {
60
+ "alignItems": "flex-start",
61
+ "flex": 1,
62
+ },
63
+ undefined,
64
+ ]
65
+ }
66
+ >
67
+ <View
68
+ style={
69
+ [
70
+ {
71
+ "backgroundColor": "#f0f0f0",
72
+ "borderRadius": 15,
73
+ "justifyContent": "flex-end",
74
+ "marginRight": 60,
75
+ "minHeight": 20,
76
+ },
77
+ null,
78
+ null,
79
+ undefined,
80
+ ]
81
+ }
82
+ >
83
+ <View
84
+ accessibilityRole="text"
85
+ accessibilityState={
86
+ {
87
+ "busy": undefined,
88
+ "checked": undefined,
89
+ "disabled": undefined,
90
+ "expanded": undefined,
91
+ "selected": undefined,
92
+ }
93
+ }
94
+ accessible={true}
95
+ focusable={true}
96
+ onClick={[Function]}
97
+ onResponderGrant={[Function]}
98
+ onResponderMove={[Function]}
99
+ onResponderRelease={[Function]}
100
+ onResponderTerminate={[Function]}
101
+ onResponderTerminationRequest={[Function]}
102
+ onStartShouldSetResponder={[Function]}
103
+ >
104
+ <View>
105
+ <View
106
+ style={
107
+ [
108
+ {},
109
+ undefined,
110
+ ]
111
+ }
112
+ >
113
+ <Text
114
+ style={
115
+ [
116
+ {
117
+ "color": "black",
118
+ "fontSize": 16,
119
+ "lineHeight": 20,
120
+ "marginBottom": 5,
121
+ "marginLeft": 10,
122
+ "marginRight": 10,
123
+ "marginTop": 5,
124
+ },
125
+ undefined,
126
+ undefined,
127
+ ]
128
+ }
129
+ >
130
+ <Text
131
+ style={
132
+ [
133
+ [
134
+ {
135
+ "color": "black",
136
+ "fontSize": 16,
137
+ "lineHeight": 20,
138
+ "marginBottom": 5,
139
+ "marginLeft": 10,
140
+ "marginRight": 10,
141
+ "marginTop": 5,
142
+ },
143
+ undefined,
144
+ undefined,
145
+ ],
146
+ undefined,
147
+ ]
148
+ }
149
+ >
150
+ test
151
+ </Text>
152
+ </Text>
153
+ </View>
154
+ </View>
155
+ <View
156
+ style={
157
+ [
158
+ {
159
+ "flexDirection": "row",
160
+ "justifyContent": "flex-start",
161
+ },
162
+ undefined,
163
+ ]
164
+ }
165
+ >
166
+ <View
167
+ style={
168
+ [
169
+ {
170
+ "marginBottom": 5,
171
+ "marginLeft": 10,
172
+ "marginRight": 10,
173
+ },
174
+ undefined,
175
+ ]
176
+ }
177
+ >
178
+ <Text
179
+ style={
180
+ [
181
+ {
182
+ "color": "#aaa",
183
+ "fontSize": 10,
184
+ "textAlign": "right",
185
+ },
186
+ undefined,
187
+ ]
188
+ }
189
+ >
190
+ 7:20 PM
191
+ </Text>
192
+ </View>
193
+ </View>
194
+ </View>
195
+ </View>
196
+ </View>
197
+ </View>
198
+ </View>
199
+ `;
200
+
201
+ exports[`Message component should render <Message /> with Avatar 1`] = `
202
+ <View>
203
+ <View
204
+ style={
205
+ [
206
+ {
207
+ "alignItems": "center",
208
+ "justifyContent": "center",
209
+ "marginBottom": 10,
210
+ "marginTop": 5,
211
+ },
212
+ undefined,
213
+ ]
214
+ }
215
+ >
216
+ <View>
217
+ <Text
218
+ style={
219
+ [
220
+ {
221
+ "backgroundColor": "transparent",
222
+ "color": "#b2b2b2",
223
+ "fontSize": 12,
224
+ "fontWeight": "600",
225
+ },
226
+ undefined,
227
+ ]
228
+ }
229
+ >
230
+ Apr 8, 2019
231
+ </Text>
232
+ </View>
233
+ </View>
234
+ <View
235
+ style={
236
+ [
237
+ {
238
+ "alignItems": "flex-end",
239
+ "flexDirection": "row",
240
+ "justifyContent": "flex-start",
241
+ "marginLeft": 8,
242
+ "marginRight": 0,
243
+ },
244
+ {
245
+ "marginBottom": 10,
246
+ },
247
+ false,
248
+ undefined,
249
+ ]
250
+ }
251
+ >
252
+ <View
253
+ style={
254
+ [
255
+ {
256
+ "marginRight": 8,
257
+ },
258
+ undefined,
259
+ undefined,
260
+ ]
261
+ }
262
+ >
263
+ <View
264
+ accessibilityRole="image"
265
+ style={
266
+ [
267
+ {
268
+ "alignItems": "center",
269
+ "borderRadius": 20,
270
+ "height": 40,
271
+ "justifyContent": "center",
272
+ "width": 40,
273
+ },
274
+ {
275
+ "backgroundColor": "transparent",
276
+ },
277
+ [
278
+ {
279
+ "borderRadius": 18,
280
+ "height": 36,
281
+ "width": 36,
282
+ },
283
+ undefined,
284
+ ],
285
+ ]
286
+ }
287
+ />
288
+ </View>
289
+ <View
290
+ style={
291
+ [
292
+ {
293
+ "alignItems": "flex-start",
294
+ "flex": 1,
295
+ },
296
+ undefined,
297
+ ]
298
+ }
299
+ >
300
+ <View
301
+ style={
302
+ [
303
+ {
304
+ "backgroundColor": "#f0f0f0",
305
+ "borderRadius": 15,
306
+ "justifyContent": "flex-end",
307
+ "marginRight": 60,
308
+ "minHeight": 20,
309
+ },
310
+ null,
311
+ null,
312
+ undefined,
313
+ ]
314
+ }
315
+ >
316
+ <View
317
+ accessibilityRole="text"
318
+ accessibilityState={
319
+ {
320
+ "busy": undefined,
321
+ "checked": undefined,
322
+ "disabled": undefined,
323
+ "expanded": undefined,
324
+ "selected": undefined,
325
+ }
326
+ }
327
+ accessible={true}
328
+ focusable={true}
329
+ onClick={[Function]}
330
+ onResponderGrant={[Function]}
331
+ onResponderMove={[Function]}
332
+ onResponderRelease={[Function]}
333
+ onResponderTerminate={[Function]}
334
+ onResponderTerminationRequest={[Function]}
335
+ onStartShouldSetResponder={[Function]}
336
+ >
337
+ <View>
338
+ <View
339
+ style={
340
+ [
341
+ {},
342
+ undefined,
343
+ ]
344
+ }
345
+ >
346
+ <Text
347
+ style={
348
+ [
349
+ {
350
+ "color": "black",
351
+ "fontSize": 16,
352
+ "lineHeight": 20,
353
+ "marginBottom": 5,
354
+ "marginLeft": 10,
355
+ "marginRight": 10,
356
+ "marginTop": 5,
357
+ },
358
+ undefined,
359
+ undefined,
360
+ ]
361
+ }
362
+ >
363
+ <Text
364
+ style={
365
+ [
366
+ [
367
+ {
368
+ "color": "black",
369
+ "fontSize": 16,
370
+ "lineHeight": 20,
371
+ "marginBottom": 5,
372
+ "marginLeft": 10,
373
+ "marginRight": 10,
374
+ "marginTop": 5,
375
+ },
376
+ undefined,
377
+ undefined,
378
+ ],
379
+ undefined,
380
+ ]
381
+ }
382
+ >
383
+ test
384
+ </Text>
385
+ </Text>
386
+ </View>
387
+ </View>
388
+ <View
389
+ style={
390
+ [
391
+ {
392
+ "flexDirection": "row",
393
+ "justifyContent": "flex-start",
394
+ },
395
+ undefined,
396
+ ]
397
+ }
398
+ >
399
+ <View
400
+ style={
401
+ [
402
+ {
403
+ "marginBottom": 5,
404
+ "marginLeft": 10,
405
+ "marginRight": 10,
406
+ },
407
+ undefined,
408
+ ]
409
+ }
410
+ >
411
+ <Text
412
+ style={
413
+ [
414
+ {
415
+ "color": "#aaa",
416
+ "fontSize": 10,
417
+ "textAlign": "right",
418
+ },
419
+ undefined,
420
+ ]
421
+ }
422
+ >
423
+ 7:20 PM
424
+ </Text>
425
+ </View>
426
+ </View>
427
+ </View>
428
+ </View>
429
+ </View>
430
+ </View>
431
+ </View>
432
+ `;
433
+
434
+ exports[`Message component should render null if user has no Avatar 1`] = `
435
+ <View>
436
+ <View
437
+ style={
438
+ [
439
+ {
440
+ "alignItems": "center",
441
+ "justifyContent": "center",
442
+ "marginBottom": 10,
443
+ "marginTop": 5,
444
+ },
445
+ undefined,
446
+ ]
447
+ }
448
+ >
449
+ <View>
450
+ <Text
451
+ style={
452
+ [
453
+ {
454
+ "backgroundColor": "transparent",
455
+ "color": "#b2b2b2",
456
+ "fontSize": 12,
457
+ "fontWeight": "600",
458
+ },
459
+ undefined,
460
+ ]
461
+ }
462
+ >
463
+ Apr 8, 2019
464
+ </Text>
465
+ </View>
466
+ </View>
467
+ <View
468
+ style={
469
+ [
470
+ {
471
+ "alignItems": "flex-end",
472
+ "flexDirection": "row",
473
+ "justifyContent": "flex-start",
474
+ "marginLeft": 8,
475
+ "marginRight": 0,
476
+ },
477
+ {
478
+ "marginBottom": 10,
479
+ },
480
+ false,
481
+ undefined,
482
+ ]
483
+ }
484
+ >
485
+ <View
486
+ style={
487
+ [
488
+ {
489
+ "alignItems": "flex-start",
490
+ "flex": 1,
491
+ },
492
+ undefined,
493
+ ]
494
+ }
495
+ >
496
+ <View
497
+ style={
498
+ [
499
+ {
500
+ "backgroundColor": "#f0f0f0",
501
+ "borderRadius": 15,
502
+ "justifyContent": "flex-end",
503
+ "marginRight": 60,
504
+ "minHeight": 20,
505
+ },
506
+ null,
507
+ null,
508
+ undefined,
509
+ ]
510
+ }
511
+ >
512
+ <View
513
+ accessibilityRole="text"
514
+ accessibilityState={
515
+ {
516
+ "busy": undefined,
517
+ "checked": undefined,
518
+ "disabled": undefined,
519
+ "expanded": undefined,
520
+ "selected": undefined,
521
+ }
522
+ }
523
+ accessible={true}
524
+ focusable={true}
525
+ onClick={[Function]}
526
+ onResponderGrant={[Function]}
527
+ onResponderMove={[Function]}
528
+ onResponderRelease={[Function]}
529
+ onResponderTerminate={[Function]}
530
+ onResponderTerminationRequest={[Function]}
531
+ onStartShouldSetResponder={[Function]}
532
+ >
533
+ <View>
534
+ <View
535
+ style={
536
+ [
537
+ {},
538
+ undefined,
539
+ ]
540
+ }
541
+ >
542
+ <Text
543
+ style={
544
+ [
545
+ {
546
+ "color": "black",
547
+ "fontSize": 16,
548
+ "lineHeight": 20,
549
+ "marginBottom": 5,
550
+ "marginLeft": 10,
551
+ "marginRight": 10,
552
+ "marginTop": 5,
553
+ },
554
+ undefined,
555
+ undefined,
556
+ ]
557
+ }
558
+ >
559
+ <Text
560
+ style={
561
+ [
562
+ [
563
+ {
564
+ "color": "black",
565
+ "fontSize": 16,
566
+ "lineHeight": 20,
567
+ "marginBottom": 5,
568
+ "marginLeft": 10,
569
+ "marginRight": 10,
570
+ "marginTop": 5,
571
+ },
572
+ undefined,
573
+ undefined,
574
+ ],
575
+ undefined,
576
+ ]
577
+ }
578
+ >
579
+ test
580
+ </Text>
581
+ </Text>
582
+ </View>
583
+ </View>
584
+ <View
585
+ style={
586
+ [
587
+ {
588
+ "flexDirection": "row",
589
+ "justifyContent": "flex-start",
590
+ },
591
+ undefined,
592
+ ]
593
+ }
594
+ >
595
+ <View
596
+ style={
597
+ [
598
+ {
599
+ "marginBottom": 5,
600
+ "marginLeft": 10,
601
+ "marginRight": 10,
602
+ },
603
+ undefined,
604
+ ]
605
+ }
606
+ >
607
+ <Text
608
+ style={
609
+ [
610
+ {
611
+ "color": "#aaa",
612
+ "fontSize": 10,
613
+ "textAlign": "right",
614
+ },
615
+ undefined,
616
+ ]
617
+ }
618
+ >
619
+ 7:20 PM
620
+ </Text>
621
+ </View>
622
+ </View>
623
+ </View>
624
+ </View>
625
+ </View>
626
+ </View>
627
+ </View>
628
+ `;