@hero-design/rn-work-uikit 1.3.1 → 1.4.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.
Files changed (36) hide show
  1. package/CHANGELOG.md +14 -0
  2. package/lib/index.js +19228 -186
  3. package/package.json +3 -2
  4. package/src/components/FormGroup/__tests__/__snapshots__/index.spec.tsx.snap +880 -0
  5. package/src/components/FormGroup/__tests__/index.spec.tsx +179 -0
  6. package/src/components/FormGroup/__tests__/utils.spec.ts +73 -0
  7. package/src/components/FormGroup/index.tsx +97 -0
  8. package/src/components/FormGroup/utils.ts +67 -0
  9. package/src/components/RichTextEditor/EditorEvent.ts +7 -0
  10. package/src/components/RichTextEditor/EditorToolbar.tsx +216 -0
  11. package/src/components/RichTextEditor/MentionList.tsx +99 -0
  12. package/src/components/RichTextEditor/RichTextEditor.tsx +88 -0
  13. package/src/components/RichTextEditor/RichTextEditorInput.tsx +286 -0
  14. package/src/components/RichTextEditor/StyledRichTextEditor.tsx +18 -0
  15. package/src/components/RichTextEditor/StyledToolbar.ts +32 -0
  16. package/src/components/RichTextEditor/__mocks__/hero-editor.js +3 -0
  17. package/src/components/RichTextEditor/__mocks__/heroEditorApp.ts +2 -0
  18. package/src/components/RichTextEditor/__tests__/EditorToolbar.spec.tsx +144 -0
  19. package/src/components/RichTextEditor/__tests__/MentionList.spec.tsx +105 -0
  20. package/src/components/RichTextEditor/__tests__/RichTextEditorInput.spec.tsx +136 -0
  21. package/src/components/RichTextEditor/__tests__/__snapshots__/EditorToolbar.spec.tsx.snap +414 -0
  22. package/src/components/RichTextEditor/__tests__/__snapshots__/MentionList.spec.tsx.snap +13 -0
  23. package/src/components/RichTextEditor/constants.ts +9 -0
  24. package/src/{hero-editor.d.ts → components/RichTextEditor/hero-editor.d.ts} +6 -0
  25. package/src/components/RichTextEditor/heroEditorApp.ts +3 -0
  26. package/src/components/RichTextEditor/index.tsx +20 -0
  27. package/src/components/RichTextEditor/types.ts +87 -0
  28. package/src/components/RichTextEditor/utils/events.ts +31 -0
  29. package/src/components/RichTextEditor/utils/rnWebView.tsx +30 -0
  30. package/src/components/TextInput/InputComponent.tsx +59 -18
  31. package/src/components/TextInput/InputRow.tsx +13 -7
  32. package/src/components/TextInput/index.tsx +20 -11
  33. package/src/components/TextInput/types.ts +29 -4
  34. package/src/index.ts +2 -1
  35. package/stats/1.4.0/rn-work-uikit-stats.html +4844 -0
  36. package/stats/1.3.1/rn-work-uikit-stats.html +0 -4844
@@ -0,0 +1,880 @@
1
+ // Jest Snapshot v1, https://goo.gl/fbAQLP
2
+
3
+ exports[`FormGroup should render: xxx 1`] = `
4
+ <View
5
+ style={
6
+ [
7
+ [
8
+ {},
9
+ ],
10
+ undefined,
11
+ ]
12
+ }
13
+ >
14
+ <Pressable
15
+ accessibilityState={
16
+ {
17
+ "disabled": false,
18
+ }
19
+ }
20
+ disabled={false}
21
+ onPress={[Function]}
22
+ style={
23
+ [
24
+ [
25
+ {
26
+ "flexDirection": "row",
27
+ "marginTop": 7.846153846153847,
28
+ "minHeight": 54.92307692307692,
29
+ "paddingHorizontal": 15.692307692307693,
30
+ "width": "100%",
31
+ "zIndex": 0,
32
+ },
33
+ ],
34
+ {
35
+ "marginTop": 0,
36
+ },
37
+ ]
38
+ }
39
+ themeFocused={false}
40
+ themeHasError={false}
41
+ themeUseGroupStyleEnabled={true}
42
+ >
43
+ <View
44
+ pointerEvents="none"
45
+ style={
46
+ [
47
+ [
48
+ {
49
+ "borderColor": "#e8e9ea",
50
+ "borderRadius": 8,
51
+ "borderWidth": 2,
52
+ },
53
+ ],
54
+ [
55
+ {
56
+ "backgroundColor": "#ffffff",
57
+ },
58
+ {
59
+ "borderBottomLeftRadius": 0,
60
+ "borderBottomRightRadius": 0,
61
+ },
62
+ ],
63
+ ]
64
+ }
65
+ testID="text-input-border"
66
+ themeFocused={false}
67
+ themeState="filled"
68
+ />
69
+ <View
70
+ style={
71
+ [
72
+ [
73
+ {
74
+ "backgroundColor": "transparent",
75
+ "borderRadius": 8,
76
+ "flex": 1,
77
+ "flexDirection": "column",
78
+ "marginBottom": 7.846153846153847,
79
+ "marginTop": 7.846153846153847,
80
+ "overflow": "hidden",
81
+ },
82
+ ],
83
+ undefined,
84
+ ]
85
+ }
86
+ >
87
+ <AnimatedView
88
+ style={
89
+ [
90
+ [
91
+ {
92
+ "alignItems": "center",
93
+ "backgroundColor": "transparent",
94
+ "flexDirection": "row",
95
+ },
96
+ ],
97
+ [
98
+ {
99
+ "transformOrigin": "left center",
100
+ },
101
+ {
102
+ "transform": [
103
+ {
104
+ "translateY": {
105
+ "addListener": [MockFunction],
106
+ "removeListener": [MockFunction],
107
+ "setValue": [MockFunction],
108
+ },
109
+ },
110
+ {
111
+ "scale": {
112
+ "addListener": [MockFunction],
113
+ "removeListener": [MockFunction],
114
+ "setValue": [MockFunction],
115
+ },
116
+ },
117
+ ],
118
+ },
119
+ ],
120
+ ]
121
+ }
122
+ testID="input-label"
123
+ themeVariant="text"
124
+ >
125
+ <AnimatedView
126
+ style={
127
+ {
128
+ "flexDirection": "row",
129
+ }
130
+ }
131
+ >
132
+ <Text
133
+ allowFontScaling={false}
134
+ numberOfLines={1}
135
+ style={
136
+ [
137
+ [
138
+ {
139
+ "color": "#001f23",
140
+ "fontFamily": "BeVietnamPro-Regular",
141
+ "fontSize": 11.76923076923077,
142
+ "letterSpacing": 0.36,
143
+ "lineHeight": 15.76923076923077,
144
+ },
145
+ ],
146
+ [
147
+ [
148
+ {
149
+ "color": "#808f91",
150
+ },
151
+ ],
152
+ {
153
+ "backgroundColor": "transparent",
154
+ },
155
+ ],
156
+ ]
157
+ }
158
+ testID="input-label-text"
159
+ themeFontWeight="regular"
160
+ themeIntent="body"
161
+ themeState="filled"
162
+ >
163
+ Text Input 1
164
+ </Text>
165
+ </AnimatedView>
166
+ </AnimatedView>
167
+ <Pressable
168
+ style={
169
+ [
170
+ [
171
+ {
172
+ "alignItems": "center",
173
+ "flexDirection": "row",
174
+ "flexGrow": 2,
175
+ "flexShrink": 1,
176
+ "opacity": 1,
177
+ },
178
+ ],
179
+ undefined,
180
+ ]
181
+ }
182
+ themeOpacity={1}
183
+ >
184
+ <View />
185
+ <View
186
+ accessibilityLabel="Text input field"
187
+ style={
188
+ {
189
+ "flex": 1,
190
+ }
191
+ }
192
+ testID="input-row-input-wrapper"
193
+ >
194
+ <TextInput
195
+ accessibilityState={
196
+ {
197
+ "disabled": false,
198
+ }
199
+ }
200
+ allowFontScaling={false}
201
+ editable={true}
202
+ onBlur={[Function]}
203
+ onChangeText={[Function]}
204
+ onFocus={[Function]}
205
+ placeholder=" "
206
+ placeholderTextColor="#4d6265"
207
+ style={
208
+ [
209
+ [
210
+ {
211
+ "flexGrow": 2,
212
+ "fontFamily": "BeVietnamPro-Regular",
213
+ "fontSize": 15.692307692307693,
214
+ "height": undefined,
215
+ "maxHeight": 141.23076923076923,
216
+ "minHeight": 23.53846153846154,
217
+ "paddingVertical": 0,
218
+ "textAlignVertical": "center",
219
+ },
220
+ ],
221
+ [
222
+ {
223
+ "backgroundColor": "#ffffff",
224
+ "color": "#001f23",
225
+ },
226
+ {},
227
+ ],
228
+ ]
229
+ }
230
+ testID="text-input"
231
+ themeVariant="text"
232
+ value="Text Input 1"
233
+ />
234
+ </View>
235
+ </Pressable>
236
+ <View
237
+ style={
238
+ [
239
+ [
240
+ {
241
+ "alignItems": "flex-start",
242
+ "flexDirection": "row",
243
+ "justifyContent": "space-between",
244
+ },
245
+ ],
246
+ undefined,
247
+ ]
248
+ }
249
+ />
250
+ </View>
251
+ <View
252
+ style={
253
+ [
254
+ [
255
+ {
256
+ "alignItems": "center",
257
+ "flexDirection": "row",
258
+ "justifyContent": "flex-end",
259
+ },
260
+ ],
261
+ undefined,
262
+ ]
263
+ }
264
+ />
265
+ </Pressable>
266
+ <Pressable
267
+ accessibilityState={
268
+ {
269
+ "disabled": false,
270
+ }
271
+ }
272
+ disabled={false}
273
+ onPress={[Function]}
274
+ style={
275
+ [
276
+ [
277
+ {
278
+ "flexDirection": "row",
279
+ "marginTop": 7.846153846153847,
280
+ "minHeight": 54.92307692307692,
281
+ "paddingHorizontal": 15.692307692307693,
282
+ "width": "100%",
283
+ "zIndex": 1,
284
+ },
285
+ ],
286
+ {
287
+ "marginTop": -2,
288
+ },
289
+ ]
290
+ }
291
+ testID="text-input-2"
292
+ themeFocused={false}
293
+ themeHasError={true}
294
+ themeUseGroupStyleEnabled={true}
295
+ >
296
+ <View
297
+ pointerEvents="none"
298
+ style={
299
+ [
300
+ [
301
+ {
302
+ "borderColor": "#cb300a",
303
+ "borderRadius": 8,
304
+ "borderWidth": 2,
305
+ },
306
+ ],
307
+ [
308
+ {
309
+ "backgroundColor": "#ffffff",
310
+ },
311
+ {
312
+ "borderRadius": 0,
313
+ },
314
+ ],
315
+ ]
316
+ }
317
+ testID="text-input-border"
318
+ themeFocused={false}
319
+ themeState="error"
320
+ />
321
+ <View
322
+ style={
323
+ [
324
+ [
325
+ {
326
+ "backgroundColor": "transparent",
327
+ "borderRadius": 8,
328
+ "flex": 1,
329
+ "flexDirection": "column",
330
+ "marginBottom": 7.846153846153847,
331
+ "marginTop": 7.846153846153847,
332
+ "overflow": "hidden",
333
+ },
334
+ ],
335
+ undefined,
336
+ ]
337
+ }
338
+ >
339
+ <AnimatedView
340
+ style={
341
+ [
342
+ [
343
+ {
344
+ "alignItems": "center",
345
+ "backgroundColor": "transparent",
346
+ "flexDirection": "row",
347
+ },
348
+ ],
349
+ [
350
+ {
351
+ "transformOrigin": "left center",
352
+ },
353
+ {
354
+ "transform": [
355
+ {
356
+ "translateY": {
357
+ "addListener": [MockFunction],
358
+ "removeListener": [MockFunction],
359
+ "setValue": [MockFunction],
360
+ },
361
+ },
362
+ {
363
+ "scale": {
364
+ "addListener": [MockFunction],
365
+ "removeListener": [MockFunction],
366
+ "setValue": [MockFunction],
367
+ },
368
+ },
369
+ ],
370
+ },
371
+ ],
372
+ ]
373
+ }
374
+ testID="input-label-text-input-2"
375
+ themeVariant="text"
376
+ >
377
+ <AnimatedView
378
+ style={
379
+ {
380
+ "flexDirection": "row",
381
+ }
382
+ }
383
+ >
384
+ <Text
385
+ allowFontScaling={false}
386
+ numberOfLines={1}
387
+ style={
388
+ [
389
+ [
390
+ {
391
+ "color": "#001f23",
392
+ "fontFamily": "BeVietnamPro-Regular",
393
+ "fontSize": 11.76923076923077,
394
+ "letterSpacing": 0.36,
395
+ "lineHeight": 15.76923076923077,
396
+ },
397
+ ],
398
+ [
399
+ [
400
+ {
401
+ "color": "#cb300a",
402
+ },
403
+ ],
404
+ {
405
+ "backgroundColor": "transparent",
406
+ },
407
+ ],
408
+ ]
409
+ }
410
+ testID="input-label-text-text-input-2"
411
+ themeFontWeight="regular"
412
+ themeIntent="body"
413
+ themeState="error"
414
+ >
415
+ Text Input 2
416
+ </Text>
417
+ <Text
418
+ allowFontScaling={false}
419
+ style={
420
+ [
421
+ [
422
+ {
423
+ "color": "#001f23",
424
+ "fontFamily": "BeVietnamPro-Regular",
425
+ "fontSize": 11.76923076923077,
426
+ "letterSpacing": 0.36,
427
+ "lineHeight": 15.76923076923077,
428
+ },
429
+ ],
430
+ [
431
+ [
432
+ {
433
+ "color": "#cb300a",
434
+ },
435
+ ],
436
+ undefined,
437
+ ],
438
+ ]
439
+ }
440
+ themeFontWeight="regular"
441
+ themeIntent="body"
442
+ themeState="error"
443
+ >
444
+ (Optional)
445
+ </Text>
446
+ </AnimatedView>
447
+ </AnimatedView>
448
+ <Pressable
449
+ style={
450
+ [
451
+ [
452
+ {
453
+ "alignItems": "center",
454
+ "flexDirection": "row",
455
+ "flexGrow": 2,
456
+ "flexShrink": 1,
457
+ "opacity": 1,
458
+ },
459
+ ],
460
+ undefined,
461
+ ]
462
+ }
463
+ themeOpacity={1}
464
+ >
465
+ <View />
466
+ <View
467
+ accessibilityLabel="Text input field"
468
+ style={
469
+ {
470
+ "flex": 1,
471
+ }
472
+ }
473
+ testID="input-row-input-wrapper"
474
+ >
475
+ <TextInput
476
+ accessibilityState={
477
+ {
478
+ "disabled": false,
479
+ }
480
+ }
481
+ allowFontScaling={false}
482
+ editable={true}
483
+ onBlur={[Function]}
484
+ onChangeText={[Function]}
485
+ onFocus={[Function]}
486
+ placeholder=" "
487
+ placeholderTextColor="#4d6265"
488
+ style={
489
+ [
490
+ [
491
+ {
492
+ "flexGrow": 2,
493
+ "fontFamily": "BeVietnamPro-Regular",
494
+ "fontSize": 15.692307692307693,
495
+ "height": undefined,
496
+ "maxHeight": 141.23076923076923,
497
+ "minHeight": 23.53846153846154,
498
+ "paddingVertical": 0,
499
+ "textAlignVertical": "center",
500
+ },
501
+ ],
502
+ [
503
+ {
504
+ "backgroundColor": "#ffffff",
505
+ "color": "#001f23",
506
+ },
507
+ {},
508
+ ],
509
+ ]
510
+ }
511
+ testID="text-input-text-input-2"
512
+ themeVariant="text"
513
+ value="Text Input 2"
514
+ />
515
+ </View>
516
+ </Pressable>
517
+ <View
518
+ style={
519
+ [
520
+ [
521
+ {
522
+ "alignItems": "flex-start",
523
+ "flexDirection": "row",
524
+ "justifyContent": "space-between",
525
+ },
526
+ ],
527
+ undefined,
528
+ ]
529
+ }
530
+ >
531
+ <View
532
+ style={
533
+ [
534
+ [
535
+ {
536
+ "alignItems": "center",
537
+ "flex": 1,
538
+ "flexDirection": "row",
539
+ "flexGrow": 4,
540
+ "marginRight": 3.9230769230769234,
541
+ },
542
+ ],
543
+ undefined,
544
+ ]
545
+ }
546
+ >
547
+ <Text
548
+ allowFontScaling={false}
549
+ selectable={false}
550
+ style={
551
+ [
552
+ {
553
+ "color": undefined,
554
+ "fontSize": 12,
555
+ },
556
+ [
557
+ [
558
+ {
559
+ "color": "#cb300a",
560
+ "fontSize": 15.692307692307693,
561
+ },
562
+ ],
563
+ undefined,
564
+ ],
565
+ {
566
+ "fontFamily": "hero-icons-mobile",
567
+ "fontStyle": "normal",
568
+ "fontWeight": "normal",
569
+ },
570
+ {},
571
+ ]
572
+ }
573
+ testID="input-error-icon"
574
+ themeIntent="danger"
575
+ themeSize="xsmall"
576
+ >
577
+
578
+ </Text>
579
+ <Text
580
+ allowFontScaling={false}
581
+ style={
582
+ [
583
+ [
584
+ {
585
+ "color": "#001f23",
586
+ "fontFamily": "BeVietnamPro-Regular",
587
+ "fontSize": 11.76923076923077,
588
+ "letterSpacing": 0.36,
589
+ "lineHeight": 15.76923076923077,
590
+ },
591
+ ],
592
+ [
593
+ [
594
+ {
595
+ "color": "#cb300a",
596
+ "marginLeft": 3.9230769230769234,
597
+ },
598
+ ],
599
+ undefined,
600
+ ],
601
+ ]
602
+ }
603
+ testID="input-error-message"
604
+ themeFontWeight="regular"
605
+ themeIntent="body"
606
+ >
607
+ This is an error
608
+ </Text>
609
+ </View>
610
+ </View>
611
+ </View>
612
+ <View
613
+ style={
614
+ [
615
+ [
616
+ {
617
+ "alignItems": "center",
618
+ "flexDirection": "row",
619
+ "justifyContent": "flex-end",
620
+ },
621
+ ],
622
+ undefined,
623
+ ]
624
+ }
625
+ />
626
+ </Pressable>
627
+ <Pressable
628
+ accessibilityState={
629
+ {
630
+ "disabled": false,
631
+ }
632
+ }
633
+ disabled={false}
634
+ onPress={[Function]}
635
+ style={
636
+ [
637
+ [
638
+ {
639
+ "flexDirection": "row",
640
+ "marginTop": 7.846153846153847,
641
+ "minHeight": 54.92307692307692,
642
+ "paddingHorizontal": 15.692307692307693,
643
+ "width": "100%",
644
+ "zIndex": 0,
645
+ },
646
+ ],
647
+ {
648
+ "marginTop": -2,
649
+ },
650
+ ]
651
+ }
652
+ themeFocused={false}
653
+ themeHasError={false}
654
+ themeUseGroupStyleEnabled={true}
655
+ >
656
+ <View
657
+ pointerEvents="none"
658
+ style={
659
+ [
660
+ [
661
+ {
662
+ "borderColor": "#e8e9ea",
663
+ "borderRadius": 8,
664
+ "borderWidth": 2,
665
+ },
666
+ ],
667
+ [
668
+ {
669
+ "backgroundColor": "#ffffff",
670
+ },
671
+ {
672
+ "borderTopLeftRadius": 0,
673
+ "borderTopRightRadius": 0,
674
+ },
675
+ ],
676
+ ]
677
+ }
678
+ testID="text-input-border"
679
+ themeFocused={false}
680
+ themeState="filled"
681
+ />
682
+ <View
683
+ style={
684
+ [
685
+ [
686
+ {
687
+ "backgroundColor": "transparent",
688
+ "borderRadius": 8,
689
+ "flex": 1,
690
+ "flexDirection": "column",
691
+ "marginBottom": 7.846153846153847,
692
+ "marginTop": 7.846153846153847,
693
+ "overflow": "hidden",
694
+ },
695
+ ],
696
+ undefined,
697
+ ]
698
+ }
699
+ >
700
+ <AnimatedView
701
+ style={
702
+ [
703
+ [
704
+ {
705
+ "alignItems": "center",
706
+ "backgroundColor": "transparent",
707
+ "flexDirection": "row",
708
+ },
709
+ ],
710
+ [
711
+ {
712
+ "transformOrigin": "left center",
713
+ },
714
+ {
715
+ "transform": [
716
+ {
717
+ "translateY": {
718
+ "addListener": [MockFunction],
719
+ "removeListener": [MockFunction],
720
+ "setValue": [MockFunction],
721
+ },
722
+ },
723
+ {
724
+ "scale": {
725
+ "addListener": [MockFunction],
726
+ "removeListener": [MockFunction],
727
+ "setValue": [MockFunction],
728
+ },
729
+ },
730
+ ],
731
+ },
732
+ ],
733
+ ]
734
+ }
735
+ testID="input-label"
736
+ themeVariant="text"
737
+ >
738
+ <AnimatedView
739
+ style={
740
+ {
741
+ "flexDirection": "row",
742
+ }
743
+ }
744
+ >
745
+ <Text
746
+ allowFontScaling={false}
747
+ numberOfLines={1}
748
+ style={
749
+ [
750
+ [
751
+ {
752
+ "color": "#001f23",
753
+ "fontFamily": "BeVietnamPro-Regular",
754
+ "fontSize": 11.76923076923077,
755
+ "letterSpacing": 0.36,
756
+ "lineHeight": 15.76923076923077,
757
+ },
758
+ ],
759
+ [
760
+ [
761
+ {
762
+ "color": "#808f91",
763
+ },
764
+ ],
765
+ {
766
+ "backgroundColor": "transparent",
767
+ },
768
+ ],
769
+ ]
770
+ }
771
+ testID="input-label-text"
772
+ themeFontWeight="regular"
773
+ themeIntent="body"
774
+ themeState="filled"
775
+ >
776
+ Text Input 3
777
+ </Text>
778
+ </AnimatedView>
779
+ </AnimatedView>
780
+ <Pressable
781
+ style={
782
+ [
783
+ [
784
+ {
785
+ "alignItems": "center",
786
+ "flexDirection": "row",
787
+ "flexGrow": 2,
788
+ "flexShrink": 1,
789
+ "opacity": 1,
790
+ },
791
+ ],
792
+ undefined,
793
+ ]
794
+ }
795
+ themeOpacity={1}
796
+ >
797
+ <View />
798
+ <View
799
+ accessibilityLabel="Text input field"
800
+ style={
801
+ {
802
+ "flex": 1,
803
+ }
804
+ }
805
+ testID="input-row-input-wrapper"
806
+ >
807
+ <TextInput
808
+ accessibilityState={
809
+ {
810
+ "disabled": false,
811
+ }
812
+ }
813
+ allowFontScaling={false}
814
+ editable={true}
815
+ onBlur={[Function]}
816
+ onChangeText={[Function]}
817
+ onFocus={[Function]}
818
+ placeholder=" "
819
+ placeholderTextColor="#4d6265"
820
+ style={
821
+ [
822
+ [
823
+ {
824
+ "flexGrow": 2,
825
+ "fontFamily": "BeVietnamPro-Regular",
826
+ "fontSize": 15.692307692307693,
827
+ "height": undefined,
828
+ "maxHeight": 141.23076923076923,
829
+ "minHeight": 23.53846153846154,
830
+ "paddingVertical": 0,
831
+ "textAlignVertical": "center",
832
+ },
833
+ ],
834
+ [
835
+ {
836
+ "backgroundColor": "#ffffff",
837
+ "color": "#001f23",
838
+ },
839
+ {},
840
+ ],
841
+ ]
842
+ }
843
+ testID="text-input"
844
+ themeVariant="text"
845
+ value="Text Input 3"
846
+ />
847
+ </View>
848
+ </Pressable>
849
+ <View
850
+ style={
851
+ [
852
+ [
853
+ {
854
+ "alignItems": "flex-start",
855
+ "flexDirection": "row",
856
+ "justifyContent": "space-between",
857
+ },
858
+ ],
859
+ undefined,
860
+ ]
861
+ }
862
+ />
863
+ </View>
864
+ <View
865
+ style={
866
+ [
867
+ [
868
+ {
869
+ "alignItems": "center",
870
+ "flexDirection": "row",
871
+ "justifyContent": "flex-end",
872
+ },
873
+ ],
874
+ undefined,
875
+ ]
876
+ }
877
+ />
878
+ </Pressable>
879
+ </View>
880
+ `;