@hero-design/rn 8.42.0 → 8.42.2

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.
@@ -1,53 +1,40 @@
1
1
  // Jest Snapshot v1, https://goo.gl/fbAQLP
2
2
 
3
3
  exports[`DatePickerIOS renders correctly 1`] = `
4
- <View
5
- accessibilityState={
6
- {
7
- "disabled": false,
4
+ [
5
+ <View
6
+ accessibilityState={
7
+ {
8
+ "disabled": false,
9
+ }
8
10
  }
9
- }
10
- accessible={true}
11
- collapsable={false}
12
- focusable={true}
13
- onClick={[Function]}
14
- onResponderGrant={[Function]}
15
- onResponderMove={[Function]}
16
- onResponderRelease={[Function]}
17
- onResponderTerminate={[Function]}
18
- onResponderTerminationRequest={[Function]}
19
- onStartShouldSetResponder={[Function]}
20
- style={
21
- {
22
- "opacity": 1,
11
+ accessible={true}
12
+ collapsable={false}
13
+ focusable={true}
14
+ onClick={[Function]}
15
+ onResponderGrant={[Function]}
16
+ onResponderMove={[Function]}
17
+ onResponderRelease={[Function]}
18
+ onResponderTerminate={[Function]}
19
+ onResponderTerminationRequest={[Function]}
20
+ onStartShouldSetResponder={[Function]}
21
+ style={
22
+ {
23
+ "opacity": 1,
24
+ }
23
25
  }
24
- }
25
- >
26
- <View
27
- pointerEvents="none"
28
- testID="datePickerInputIOS"
29
26
  >
30
27
  <View
31
- pointerEvents="auto"
32
- style={
33
- [
34
- {
35
- "marginTop": 8,
36
- "width": "100%",
37
- },
38
- undefined,
39
- ]
40
- }
28
+ pointerEvents="none"
29
+ testID="datePickerInputIOS"
41
30
  >
42
31
  <View
32
+ pointerEvents="auto"
43
33
  style={
44
34
  [
45
35
  {
46
- "alignItems": "center",
47
- "backgroundColor": "#ffffff",
48
- "borderRadius": 8,
49
- "flexDirection": "row",
50
- "padding": 16,
36
+ "marginTop": 8,
37
+ "width": "100%",
51
38
  },
52
39
  undefined,
53
40
  ]
@@ -57,247 +44,358 @@ exports[`DatePickerIOS renders correctly 1`] = `
57
44
  style={
58
45
  [
59
46
  {
60
- "borderColor": "#001f23",
61
- "borderRadius": 8,
62
- "borderWidth": 1,
63
- "bottom": 0,
64
- "left": 0,
65
- "position": "absolute",
66
- "right": 0,
67
- "top": 0,
68
- },
69
- [
70
- {
71
- "backgroundColor": "#ffffff",
72
- },
73
- undefined,
74
- ],
75
- ]
76
- }
77
- testID="text-input-border"
78
- themeFocused={false}
79
- themeState="filled"
80
- />
81
- <View
82
- pointerEvents="none"
83
- style={
84
- [
85
- {
47
+ "alignItems": "center",
86
48
  "backgroundColor": "#ffffff",
49
+ "borderRadius": 8,
87
50
  "flexDirection": "row",
88
- "left": 16,
89
- "paddingHorizontal": 4,
90
- "position": "absolute",
91
- "top": -4,
92
- "zIndex": 1,
93
- },
94
- {
95
- "backgroundColor": "#ffffff",
51
+ "padding": 16,
96
52
  },
53
+ undefined,
97
54
  ]
98
55
  }
99
- testID="label-container"
100
56
  >
101
- <Text
102
- allowFontScaling={false}
57
+ <View
103
58
  style={
104
59
  [
105
60
  {
106
- "color": "#001f23",
107
- "fontFamily": "BeVietnamPro-Regular",
108
- "fontSize": 12,
109
- "letterSpacing": 0.48,
110
- "lineHeight": 16,
61
+ "borderColor": "#001f23",
62
+ "borderRadius": 8,
63
+ "borderWidth": 1,
64
+ "bottom": 0,
65
+ "left": 0,
66
+ "position": "absolute",
67
+ "right": 0,
68
+ "top": 0,
111
69
  },
112
70
  [
113
- {
114
- "color": "#001f23",
115
- "lineHeight": 12,
116
- },
117
71
  {
118
72
  "backgroundColor": "#ffffff",
119
73
  },
74
+ undefined,
120
75
  ],
121
76
  ]
122
77
  }
123
- testID="input-label"
124
- themeFontWeight="regular"
125
- themeIntent="body"
78
+ testID="text-input-border"
79
+ themeFocused={false}
126
80
  themeState="filled"
81
+ />
82
+ <View
83
+ pointerEvents="none"
84
+ style={
85
+ [
86
+ {
87
+ "backgroundColor": "#ffffff",
88
+ "flexDirection": "row",
89
+ "left": 16,
90
+ "paddingHorizontal": 4,
91
+ "position": "absolute",
92
+ "top": -4,
93
+ "zIndex": 1,
94
+ },
95
+ {
96
+ "backgroundColor": "#ffffff",
97
+ },
98
+ ]
99
+ }
100
+ testID="label-container"
127
101
  >
128
- Start date
129
- </Text>
130
- </View>
131
- <View
132
- style={
133
- [
134
- {
135
- "alignItems": "center",
136
- "alignSelf": "stretch",
137
- "flexDirection": "row",
138
- "flexGrow": 2,
139
- "flexShrink": 1,
140
- },
141
- undefined,
142
- ]
143
- }
144
- >
145
- <TextInput
146
- accessibilityState={
147
- {
148
- "disabled": false,
102
+ <Text
103
+ allowFontScaling={false}
104
+ style={
105
+ [
106
+ {
107
+ "color": "#001f23",
108
+ "fontFamily": "BeVietnamPro-Regular",
109
+ "fontSize": 12,
110
+ "letterSpacing": 0.48,
111
+ "lineHeight": 16,
112
+ },
113
+ [
114
+ {
115
+ "color": "#001f23",
116
+ "lineHeight": 12,
117
+ },
118
+ {
119
+ "backgroundColor": "#ffffff",
120
+ },
121
+ ],
122
+ ]
149
123
  }
150
- }
151
- allowFontScaling={false}
152
- editable={true}
153
- onBlur={[Function]}
154
- onChangeText={[Function]}
155
- onFocus={[Function]}
156
- placeholder=" "
124
+ testID="input-label"
125
+ themeFontWeight="regular"
126
+ themeIntent="body"
127
+ themeState="filled"
128
+ >
129
+ Start date
130
+ </Text>
131
+ </View>
132
+ <View
157
133
  style={
158
134
  [
159
135
  {
136
+ "alignItems": "center",
160
137
  "alignSelf": "stretch",
138
+ "flexDirection": "row",
161
139
  "flexGrow": 2,
162
- "fontFamily": "BeVietnamPro-Regular",
163
- "fontSize": 16,
164
- "height": undefined,
165
- "marginHorizontal": 8,
166
- "maxHeight": 144,
167
- "paddingVertical": 0,
168
- "textAlignVertical": "center",
140
+ "flexShrink": 1,
169
141
  },
142
+ undefined,
143
+ ]
144
+ }
145
+ >
146
+ <TextInput
147
+ accessibilityState={
148
+ {
149
+ "disabled": false,
150
+ }
151
+ }
152
+ allowFontScaling={false}
153
+ editable={true}
154
+ onBlur={[Function]}
155
+ onChangeText={[Function]}
156
+ onFocus={[Function]}
157
+ placeholder=" "
158
+ style={
159
+ [
160
+ {
161
+ "alignSelf": "stretch",
162
+ "flexGrow": 2,
163
+ "fontFamily": "BeVietnamPro-Regular",
164
+ "fontSize": 16,
165
+ "height": undefined,
166
+ "marginHorizontal": 8,
167
+ "maxHeight": 144,
168
+ "paddingVertical": 0,
169
+ "textAlignVertical": "center",
170
+ },
171
+ {
172
+ "backgroundColor": "#ffffff",
173
+ "color": "#001f23",
174
+ },
175
+ ]
176
+ }
177
+ testID="text-input"
178
+ themeVariant="text"
179
+ value="21/12/1995"
180
+ />
181
+ </View>
182
+ <HeroIcon
183
+ name="calendar-dates-outlined"
184
+ style={
185
+ [
170
186
  {
171
- "backgroundColor": "#ffffff",
172
187
  "color": "#001f23",
188
+ "fontSize": 24,
173
189
  },
190
+ undefined,
174
191
  ]
175
192
  }
176
- testID="text-input"
177
- themeVariant="text"
178
- value="21/12/1995"
193
+ testID="input-suffix"
194
+ themeIntent="text"
195
+ themeSize="medium"
179
196
  />
180
197
  </View>
181
- <HeroIcon
182
- name="calendar-dates-outlined"
183
- style={
184
- [
185
- {
186
- "color": "#001f23",
187
- "fontSize": 24,
188
- },
189
- undefined,
190
- ]
191
- }
192
- testID="input-suffix"
193
- themeIntent="text"
194
- themeSize="medium"
195
- />
196
- </View>
197
- <View
198
- style={
199
- [
200
- {
201
- "minHeight": 16,
202
- "paddingLeft": 16,
203
- "paddingTop": 2,
204
- },
205
- undefined,
206
- ]
207
- }
208
- >
209
198
  <View
210
199
  style={
211
200
  [
212
201
  {
213
- "flexDirection": "row",
214
- "justifyContent": "space-between",
202
+ "minHeight": 16,
203
+ "paddingLeft": 16,
204
+ "paddingTop": 2,
215
205
  },
216
206
  undefined,
217
207
  ]
218
208
  }
219
- />
209
+ >
210
+ <View
211
+ style={
212
+ [
213
+ {
214
+ "flexDirection": "row",
215
+ "justifyContent": "space-between",
216
+ },
217
+ undefined,
218
+ ]
219
+ }
220
+ />
221
+ </View>
220
222
  </View>
221
223
  </View>
222
- </View>
223
- <RCTModalHostView
224
- animationType="none"
225
- hardwareAccelerated={false}
226
- identifier={0}
227
- onDismiss={[Function]}
228
- onRequestClose={[Function]}
229
- onStartShouldSetResponder={[Function]}
230
- presentationStyle="overFullScreen"
224
+ </View>,
225
+ <View
226
+ collapsable={false}
231
227
  style={
232
228
  {
229
+ "backgroundColor": "transparent",
230
+ "bottom": 0,
231
+ "left": 0,
232
+ "opacity": 0.4,
233
233
  "position": "absolute",
234
+ "right": 0,
235
+ "top": 0,
236
+ }
237
+ }
238
+ />,
239
+ <View
240
+ collapsable={false}
241
+ style={
242
+ {
243
+ "bottom": 0,
244
+ "left": 0,
245
+ "opacity": 1,
246
+ "position": "absolute",
247
+ "right": 0,
248
+ "top": 0,
249
+ "transform": [
250
+ {
251
+ "translateY": 0,
252
+ },
253
+ ],
234
254
  }
235
255
  }
236
- transparent={true}
237
- visible={true}
238
256
  >
239
257
  <View
240
- collapsable={false}
258
+ pointerEvents="box-none"
241
259
  style={
242
260
  [
243
261
  {
244
- "flex": 1,
262
+ "bottom": 0,
263
+ "flexDirection": "column-reverse",
245
264
  "left": 0,
265
+ "position": "absolute",
266
+ "right": 0,
246
267
  "top": 0,
247
268
  },
248
- {
249
- "backgroundColor": "transparent",
250
- },
269
+ undefined,
251
270
  ]
252
271
  }
253
272
  >
254
273
  <View
255
- pointerEvents="box-none"
274
+ onLayout={[Function]}
256
275
  style={
257
- {
258
- "flex": 1,
259
- }
276
+ [
277
+ [
278
+ {
279
+ "flex": 1,
280
+ "flexDirection": "column-reverse",
281
+ },
282
+ undefined,
283
+ ],
284
+ {
285
+ "paddingBottom": 0,
286
+ },
287
+ ]
260
288
  }
261
289
  >
262
290
  <View
263
- collapsable={true}
264
- pointerEvents="box-none"
291
+ accessible={true}
292
+ collapsable={false}
293
+ focusable={true}
294
+ onBlur={[Function]}
295
+ onClick={[Function]}
296
+ onFocus={[Function]}
297
+ onResponderGrant={[Function]}
298
+ onResponderMove={[Function]}
299
+ onResponderRelease={[Function]}
300
+ onResponderTerminate={[Function]}
301
+ onResponderTerminationRequest={[Function]}
302
+ onStartShouldSetResponder={[Function]}
303
+ style={
304
+ {
305
+ "backgroundColor": "#000000",
306
+ "bottom": 0,
307
+ "left": 0,
308
+ "opacity": 0.48,
309
+ "position": "absolute",
310
+ "right": 0,
311
+ "top": 0,
312
+ }
313
+ }
314
+ />
315
+ <RCTSafeAreaView
316
+ collapsable={false}
317
+ emulateUnlessSupported={true}
265
318
  style={
266
319
  {
267
- "flex": 1,
320
+ "backgroundColor": "#ffffff",
321
+ "borderTopLeftRadius": 16,
322
+ "borderTopRightRadius": 16,
323
+ "elevation": 10,
324
+ "maxHeight": "94%",
325
+ "shadowColor": "#001f23",
326
+ "shadowOffset": {
327
+ "height": 3,
328
+ "width": 0,
329
+ },
330
+ "shadowOpacity": 0.4,
331
+ "shadowRadius": 16,
332
+ "transform": [
333
+ {
334
+ "scaleY": 1,
335
+ },
336
+ {
337
+ "translateY": 0,
338
+ },
339
+ ],
340
+ "width": "100%",
268
341
  }
269
342
  }
270
343
  >
271
344
  <View
272
- pointerEvents="box-none"
273
345
  style={
274
346
  [
275
347
  {
276
- "bottom": 0,
277
- "flexDirection": "column-reverse",
278
- "left": 0,
279
- "position": "absolute",
280
- "right": 0,
281
- "top": 0,
348
+ "flexDirection": "row",
349
+ "paddingHorizontal": 16,
350
+ "paddingVertical": 8,
282
351
  },
283
352
  undefined,
284
353
  ]
285
354
  }
286
355
  >
287
356
  <View
288
- onLayout={[Function]}
289
357
  style={
290
358
  [
359
+ {
360
+ "flex": 1,
361
+ "justifyContent": "center",
362
+ },
363
+ undefined,
364
+ ]
365
+ }
366
+ >
367
+ <Text
368
+ allowFontScaling={false}
369
+ style={
291
370
  [
292
371
  {
293
- "flex": 1,
294
- "flexDirection": "column-reverse",
372
+ "color": "#001f23",
373
+ "fontFamily": "BeVietnamPro-SemiBold",
374
+ "fontSize": 16,
375
+ "letterSpacing": 0.24,
376
+ "lineHeight": 24,
295
377
  },
296
378
  undefined,
297
- ],
379
+ ]
380
+ }
381
+ themeIntent="body"
382
+ themeTypeface="neutral"
383
+ themeVariant="regular-bold"
384
+ >
385
+ Start date
386
+ </Text>
387
+ </View>
388
+ <View
389
+ style={
390
+ [
298
391
  {
299
- "paddingBottom": 0,
392
+ "alignItems": "center",
393
+ "height": 48,
394
+ "justifyContent": "center",
395
+ "marginLeft": 12,
396
+ "width": 48,
300
397
  },
398
+ undefined,
301
399
  ]
302
400
  }
303
401
  >
@@ -305,9 +403,7 @@ exports[`DatePickerIOS renders correctly 1`] = `
305
403
  accessible={true}
306
404
  collapsable={false}
307
405
  focusable={true}
308
- onBlur={[Function]}
309
406
  onClick={[Function]}
310
- onFocus={[Function]}
311
407
  onResponderGrant={[Function]}
312
408
  onResponderMove={[Function]}
313
409
  onResponderRelease={[Function]}
@@ -316,248 +412,135 @@ exports[`DatePickerIOS renders correctly 1`] = `
316
412
  onStartShouldSetResponder={[Function]}
317
413
  style={
318
414
  {
319
- "backgroundColor": "#000000",
320
- "bottom": 0,
321
- "left": 0,
322
- "opacity": 0.48,
323
- "position": "absolute",
324
- "right": 0,
325
- "top": 0,
326
- }
327
- }
328
- />
329
- <RCTSafeAreaView
330
- collapsable={false}
331
- emulateUnlessSupported={true}
332
- style={
333
- {
334
- "backgroundColor": "#ffffff",
335
- "borderTopLeftRadius": 16,
336
- "borderTopRightRadius": 16,
337
- "elevation": 10,
338
- "maxHeight": "94%",
339
- "shadowColor": "#001f23",
340
- "shadowOffset": {
341
- "height": 3,
342
- "width": 0,
343
- },
344
- "shadowOpacity": 0.4,
345
- "shadowRadius": 16,
346
- "transform": [
347
- {
348
- "scaleY": 1,
349
- },
350
- {
351
- "translateY": 0,
352
- },
353
- ],
354
- "width": "100%",
415
+ "opacity": 1,
355
416
  }
356
417
  }
418
+ testID="bottom-sheet-close-icon"
357
419
  >
358
- <View
420
+ <HeroIcon
421
+ name="cancel"
359
422
  style={
360
423
  [
361
424
  {
362
- "flexDirection": "row",
363
- "paddingHorizontal": 16,
364
- "paddingVertical": 8,
425
+ "color": "#001f23",
426
+ "fontSize": 16,
365
427
  },
366
428
  undefined,
367
429
  ]
368
430
  }
369
- >
370
- <View
371
- style={
372
- [
373
- {
374
- "flex": 1,
375
- "justifyContent": "center",
376
- },
377
- undefined,
378
- ]
379
- }
380
- >
381
- <Text
382
- allowFontScaling={false}
383
- style={
384
- [
385
- {
386
- "color": "#001f23",
387
- "fontFamily": "BeVietnamPro-SemiBold",
388
- "fontSize": 16,
389
- "letterSpacing": 0.24,
390
- "lineHeight": 24,
391
- },
392
- undefined,
393
- ]
394
- }
395
- themeIntent="body"
396
- themeTypeface="neutral"
397
- themeVariant="regular-bold"
398
- >
399
- Start date
400
- </Text>
401
- </View>
402
- <View
403
- style={
404
- [
405
- {
406
- "alignItems": "center",
407
- "height": 48,
408
- "justifyContent": "center",
409
- "marginLeft": 12,
410
- "width": 48,
411
- },
412
- undefined,
413
- ]
414
- }
415
- >
416
- <View
417
- accessible={true}
418
- collapsable={false}
419
- focusable={true}
420
- onClick={[Function]}
421
- onResponderGrant={[Function]}
422
- onResponderMove={[Function]}
423
- onResponderRelease={[Function]}
424
- onResponderTerminate={[Function]}
425
- onResponderTerminationRequest={[Function]}
426
- onStartShouldSetResponder={[Function]}
427
- style={
428
- {
429
- "opacity": 1,
430
- }
431
- }
432
- testID="bottom-sheet-close-icon"
433
- >
434
- <HeroIcon
435
- name="cancel"
436
- style={
437
- [
438
- {
439
- "color": "#001f23",
440
- "fontSize": 16,
441
- },
442
- undefined,
443
- ]
444
- }
445
- themeIntent="text"
446
- themeSize="xsmall"
447
- />
448
- </View>
449
- </View>
450
- </View>
451
- <View
431
+ themeIntent="text"
432
+ themeSize="xsmall"
433
+ />
434
+ </View>
435
+ </View>
436
+ </View>
437
+ <View
438
+ style={
439
+ [
440
+ {
441
+ "height": 176,
442
+ },
443
+ undefined,
444
+ ]
445
+ }
446
+ >
447
+ <Picker
448
+ display="spinner"
449
+ mode="date"
450
+ onChange={[Function]}
451
+ style={
452
+ {
453
+ "flex": 1,
454
+ }
455
+ }
456
+ testID="datePickerIOS"
457
+ textColor="#001f23"
458
+ value={1995-12-21T00:00:00.000Z}
459
+ />
460
+ </View>
461
+ <View>
462
+ <View
463
+ style={
464
+ [
465
+ {
466
+ "alignItems": "center",
467
+ "flexDirection": "row",
468
+ "justifyContent": "flex-end",
469
+ "paddingHorizontal": 12,
470
+ "paddingVertical": 2,
471
+ },
472
+ undefined,
473
+ ]
474
+ }
475
+ >
476
+ <View
477
+ accessibilityState={
478
+ {
479
+ "disabled": false,
480
+ }
481
+ }
482
+ accessible={true}
483
+ focusable={true}
484
+ onClick={[Function]}
485
+ onResponderGrant={[Function]}
486
+ onResponderMove={[Function]}
487
+ onResponderRelease={[Function]}
488
+ onResponderTerminate={[Function]}
489
+ onResponderTerminationRequest={[Function]}
490
+ onStartShouldSetResponder={[Function]}
491
+ style={
492
+ [
493
+ {
494
+ "alignItems": "center",
495
+ "backgroundColor": "transparent",
496
+ "borderRadius": 4,
497
+ "borderWidth": 0,
498
+ "flexDirection": "row",
499
+ "justifyContent": "center",
500
+ "padding": 12,
501
+ },
502
+ undefined,
503
+ ]
504
+ }
505
+ >
506
+ <Text
507
+ allowFontScaling={false}
508
+ disabled={false}
509
+ ellipsizeMode="tail"
510
+ numberOfLines={1}
452
511
  style={
453
512
  [
454
513
  {
455
- "height": 176,
514
+ "color": "#001f23",
515
+ "fontFamily": "BeVietnamPro-SemiBold",
516
+ "fontSize": 16,
517
+ "letterSpacing": 0.24,
518
+ "lineHeight": 24,
456
519
  },
457
- undefined,
458
- ]
459
- }
460
- >
461
- <Picker
462
- display="spinner"
463
- mode="date"
464
- onChange={[Function]}
465
- style={
466
- {
467
- "flex": 1,
468
- }
469
- }
470
- testID="datePickerIOS"
471
- textColor="#001f23"
472
- value={1995-12-21T00:00:00.000Z}
473
- />
474
- </View>
475
- <View>
476
- <View
477
- style={
478
520
  [
479
521
  {
480
- "alignItems": "center",
481
- "flexDirection": "row",
482
- "justifyContent": "flex-end",
483
- "paddingHorizontal": 12,
484
- "paddingVertical": 2,
522
+ "color": "#401960",
523
+ "flexShrink": 1,
524
+ "lineHeight": 22,
525
+ "textAlign": "center",
485
526
  },
486
527
  undefined,
487
- ]
488
- }
489
- >
490
- <View
491
- accessibilityState={
492
- {
493
- "disabled": false,
494
- }
495
- }
496
- accessible={true}
497
- focusable={true}
498
- onClick={[Function]}
499
- onResponderGrant={[Function]}
500
- onResponderMove={[Function]}
501
- onResponderRelease={[Function]}
502
- onResponderTerminate={[Function]}
503
- onResponderTerminationRequest={[Function]}
504
- onStartShouldSetResponder={[Function]}
505
- style={
506
- [
507
- {
508
- "alignItems": "center",
509
- "backgroundColor": "transparent",
510
- "borderRadius": 4,
511
- "borderWidth": 0,
512
- "flexDirection": "row",
513
- "justifyContent": "center",
514
- "padding": 12,
515
- },
516
- undefined,
517
- ]
518
- }
519
- >
520
- <Text
521
- allowFontScaling={false}
522
- disabled={false}
523
- ellipsizeMode="tail"
524
- numberOfLines={1}
525
- style={
526
- [
527
- {
528
- "color": "#001f23",
529
- "fontFamily": "BeVietnamPro-SemiBold",
530
- "fontSize": 16,
531
- "letterSpacing": 0.24,
532
- "lineHeight": 24,
533
- },
534
- [
535
- {
536
- "color": "#401960",
537
- "flexShrink": 1,
538
- "lineHeight": 22,
539
- "textAlign": "center",
540
- },
541
- undefined,
542
- ],
543
- ]
544
- }
545
- themeButtonVariant="text-primary"
546
- themeIntent="body"
547
- themeTypeface="neutral"
548
- themeVariant="regular-bold"
549
- >
550
- Confirm
551
- </Text>
552
- </View>
553
- </View>
554
- </View>
555
- </RCTSafeAreaView>
528
+ ],
529
+ ]
530
+ }
531
+ themeButtonVariant="text-primary"
532
+ themeIntent="body"
533
+ themeTypeface="neutral"
534
+ themeVariant="regular-bold"
535
+ >
536
+ Confirm
537
+ </Text>
538
+ </View>
556
539
  </View>
557
540
  </View>
558
- </View>
541
+ </RCTSafeAreaView>
559
542
  </View>
560
543
  </View>
561
- </RCTModalHostView>
562
- </View>
544
+ </View>,
545
+ ]
563
546
  `;