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