@ornikar/kitt-universal 1.0.0 → 1.0.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 (139) hide show
  1. package/package.json +4 -4
  2. package/CHANGELOG.md +0 -8
  3. package/src/.eslintrc.json +0 -19
  4. package/src/Avatar/Avatar.stories.tsx +0 -45
  5. package/src/Avatar/Avatar.tsx +0 -60
  6. package/src/Avatar/__snapshots__/Avatar.stories.tsx.snap +0 -1229
  7. package/src/Button/Button.stories.tsx +0 -301
  8. package/src/Button/Button.tsx +0 -60
  9. package/src/Button/ButtonContainer.tsx +0 -32
  10. package/src/Button/ButtonContent.tsx +0 -133
  11. package/src/Button/__snapshots__/Button.stories.tsx.snap +0 -7483
  12. package/src/Button/useButton.ts +0 -14
  13. package/src/Card/Card.stories.tsx +0 -31
  14. package/src/Card/Card.tsx +0 -25
  15. package/src/Card/__snapshots__/Card.stories.tsx.snap +0 -306
  16. package/src/FullScreenModal/Body.tsx +0 -25
  17. package/src/FullScreenModal/FullScreenModal.stories.tsx +0 -63
  18. package/src/FullScreenModal/FullScreenModal.tsx +0 -21
  19. package/src/FullScreenModal/Header.tsx +0 -129
  20. package/src/FullScreenModal/__snapshots__/FullScreenModal.stories.tsx.snap +0 -771
  21. package/src/Icon/Icon.stories.tsx +0 -59
  22. package/src/Icon/Icon.tsx +0 -37
  23. package/src/Icon/SpinningIcon.tsx +0 -38
  24. package/src/Icon/SpinningIcon.web.module.css +0 -13
  25. package/src/Icon/SpinningIcon.web.module.css.d.ts +0 -6
  26. package/src/Icon/SpinningIcon.web.tsx +0 -11
  27. package/src/Icon/__snapshots__/Icon.stories.tsx.snap +0 -5648
  28. package/src/KittBreakpoints.ts +0 -44
  29. package/src/ListItem/ListItem.stories.tsx +0 -122
  30. package/src/ListItem/ListItem.tsx +0 -61
  31. package/src/ListItem/ListItemContent.tsx +0 -17
  32. package/src/ListItem/ListItemSideContent.tsx +0 -41
  33. package/src/ListItem/__snapshots__/ListItem.stories.tsx.snap +0 -1514
  34. package/src/Loader/LargeLoader.tsx +0 -12
  35. package/src/Loader/LargeLoader.web.module.css +0 -103
  36. package/src/Loader/LargeLoader.web.module.css.d.ts +0 -11
  37. package/src/Loader/LargeLoader.web.test.tsx +0 -10
  38. package/src/Loader/LargeLoader.web.tsx +0 -18
  39. package/src/Loader/Loader.stories.tsx +0 -47
  40. package/src/Loader/Loader.tsx +0 -21
  41. package/src/Loader/Loader.web.test.tsx +0 -20
  42. package/src/Loader/Loader.web.tsx +0 -14
  43. package/src/Loader/__snapshots__/LargeLoader.web.test.tsx.snap +0 -33
  44. package/src/Loader/__snapshots__/Loader.stories.tsx.snap +0 -607
  45. package/src/Loader/__snapshots__/Loader.web.test.tsx.snap +0 -103
  46. package/src/Message/Message.stories.tsx +0 -102
  47. package/src/Message/Message.tsx +0 -114
  48. package/src/Message/__snapshots__/Message.stories.tsx.snap +0 -2776
  49. package/src/Modal/Body.tsx +0 -20
  50. package/src/Modal/Footer.tsx +0 -18
  51. package/src/Modal/Header.tsx +0 -66
  52. package/src/Modal/Modal.stories.tsx +0 -181
  53. package/src/Modal/Modal.tsx +0 -66
  54. package/src/Modal/OnCloseContext.ts +0 -3
  55. package/src/Modal/__snapshots__/Modal.stories.tsx.snap +0 -2960
  56. package/src/Notification/Notification.stories.tsx +0 -102
  57. package/src/Notification/Notification.tsx +0 -21
  58. package/src/Notification/__snapshots__/Notification.stories.tsx.snap +0 -2861
  59. package/src/Overlay/Overlay.tsx +0 -22
  60. package/src/Tag/Tag.stories.tsx +0 -18
  61. package/src/Tag/Tag.tsx +0 -31
  62. package/src/Tag/__snapshots__/Tag.stories.tsx.snap +0 -303
  63. package/src/Tooltip/Tooltip.tsx +0 -17
  64. package/src/__mocks__/react-native-safe-area-context.tsx +0 -26
  65. package/src/forms/InputFeedback/InputFeedback.stories.tsx +0 -17
  66. package/src/forms/InputFeedback/InputFeedback.tsx +0 -28
  67. package/src/forms/InputFeedback/__snapshots__/InputFeedback.stories.tsx.snap +0 -252
  68. package/src/forms/InputField/InputField.stories.tsx +0 -19
  69. package/src/forms/InputField/InputField.tsx +0 -45
  70. package/src/forms/InputField/__snapshots__/InputField.stories.tsx.snap +0 -240
  71. package/src/forms/InputFormState.ts +0 -1
  72. package/src/forms/InputText/InputText.stories.tsx +0 -85
  73. package/src/forms/InputText/InputText.tsx +0 -172
  74. package/src/forms/InputText/__snapshots__/InputText.stories.tsx.snap +0 -4274
  75. package/src/forms/InputText/useInputText.ts +0 -19
  76. package/src/forms/Label/Label.stories.tsx +0 -14
  77. package/src/forms/Label/Label.tsx +0 -17
  78. package/src/forms/Label/__snapshots__/Label.stories.tsx.snap +0 -174
  79. package/src/forms/Radio/Radio.stories.tsx +0 -48
  80. package/src/forms/Radio/Radio.tsx +0 -81
  81. package/src/forms/Radio/__snapshots__/Radio.stories.tsx.snap +0 -967
  82. package/src/forms/TextArea/TextArea.stories.tsx +0 -72
  83. package/src/forms/TextArea/TextArea.tsx +0 -12
  84. package/src/forms/TextArea/__snapshots__/TextArea.stories.tsx.snap +0 -2091
  85. package/src/index.ts +0 -61
  86. package/src/stories/Block.tsx +0 -24
  87. package/src/stories/Flex.tsx +0 -16
  88. package/src/stories/color-tokens.stories.tsx +0 -143
  89. package/src/stories-list.ts +0 -22
  90. package/src/story-components/Section.tsx +0 -56
  91. package/src/story-components/Story.tsx +0 -24
  92. package/src/story-components/StoryDecorator.tsx +0 -8
  93. package/src/story-components/StoryGrid.tsx +0 -80
  94. package/src/story-components/StoryTitle.stories.tsx +0 -12
  95. package/src/story-components/StoryTitle.tsx +0 -69
  96. package/src/story-components/__snapshots__/StoryTitle.stories.tsx.snap +0 -155
  97. package/src/story-components/index.ts +0 -5
  98. package/src/themes/default.ts +0 -34
  99. package/src/themes/late-ocean/avatarLateOceanTheme.ts +0 -12
  100. package/src/themes/late-ocean/buttonLateOceanTheme.ts +0 -37
  101. package/src/themes/late-ocean/cardLateOceanTheme.ts +0 -19
  102. package/src/themes/late-ocean/colorsLateOceanTheme.ts +0 -19
  103. package/src/themes/late-ocean/feedbackMessageLateOceanTheme.ts +0 -10
  104. package/src/themes/late-ocean/formLateOceanTheme.ts +0 -9
  105. package/src/themes/late-ocean/fullScreenModalLateOceanTheme.ts +0 -9
  106. package/src/themes/late-ocean/inputFieldLateOceanTheme.ts +0 -4
  107. package/src/themes/late-ocean/inputLateOceanTheme.ts +0 -55
  108. package/src/themes/late-ocean/listItemLateOceanTheme.ts +0 -8
  109. package/src/themes/late-ocean/radioLateOceanTheme.ts +0 -19
  110. package/src/themes/late-ocean/shadowsLateOceanTheme.ts +0 -3
  111. package/src/themes/late-ocean/tagLateOceanTheme.ts +0 -17
  112. package/src/themes/late-ocean/typographyLateOceanTheme.ts +0 -94
  113. package/src/themes/palettes/lateOceanColorPalette.ts +0 -24
  114. package/src/typings/babel-config.d.ts +0 -6
  115. package/src/typings/metro.d.ts +0 -6
  116. package/src/typography/Typography.stories.tsx +0 -113
  117. package/src/typography/Typography.tsx +0 -165
  118. package/src/typography/TypographyIcon.stories.tsx +0 -31
  119. package/src/typography/TypographyIcon.tsx +0 -35
  120. package/src/typography/TypographyLink.stories.tsx +0 -88
  121. package/src/typography/TypographyLink.tsx +0 -48
  122. package/src/typography/__snapshots__/Typography.stories.tsx.snap +0 -6118
  123. package/src/typography/__snapshots__/TypographyIcon.stories.tsx.snap +0 -334
  124. package/src/typography/__snapshots__/TypographyLink.stories.tsx.snap +0 -10945
  125. package/src/useKittTheme.tsx +0 -12
  126. package/src/utils/storybook/decorators/KittThemeDecorator.tsx +0 -27
  127. package/src/utils/storybook/decorators/SafeAreaProviderDecorator.tsx +0 -11
  128. package/src/utils/storybook/setup-global-decorators.ts +0 -6
  129. package/src/utils/tests/renderWithProvidersUtils.tsx +0 -17
  130. package/src/utils/typeUtils.ts +0 -6
  131. package/src/utils/windowSize/MatchWindowSize.tsx +0 -14
  132. package/src/utils/windowSize/__snapshots__/windowSize.stories.tsx.snap +0 -1485
  133. package/src/utils/windowSize/createWindowSizeHelper.test.ts +0 -11
  134. package/src/utils/windowSize/createWindowSizeHelper.ts +0 -65
  135. package/src/utils/windowSize/useMatchWindowSize.ts +0 -14
  136. package/src/utils/windowSize/useWindowSize.ts +0 -1
  137. package/src/utils/windowSize/windowSize.stories.tsx +0 -115
  138. package/tsconfig.build.json +0 -33
  139. package/tsconfig.json +0 -13
@@ -1,2861 +0,0 @@
1
- // Jest Snapshot v1, https://goo.gl/fbAQLP
2
-
3
- exports[`kitt-universal/Feedback Notification 1`] = `
4
- <RNCSafeAreaProvider
5
- onInsetsChange={[Function]}
6
- style={
7
- Array [
8
- Object {
9
- "flex": 1,
10
- },
11
- undefined,
12
- ]
13
- }
14
- >
15
- <RCTScrollView
16
- style={
17
- Array [
18
- Object {
19
- "paddingBottom": 10,
20
- "paddingLeft": 10,
21
- "paddingRight": 10,
22
- "paddingTop": 10,
23
- },
24
- ]
25
- }
26
- >
27
- <View>
28
- <View
29
- style={
30
- Array [
31
- Object {
32
- "marginBottom": 30,
33
- },
34
- ]
35
- }
36
- >
37
- <Text
38
- aria-level="1"
39
- color="black"
40
- isHeader={true}
41
- style={
42
- Array [
43
- Object {
44
- "color": "#000000",
45
- "fontFamily": "Moderat-Extended-Bold",
46
- "fontSize": 38,
47
- "fontStyle": "normal",
48
- "fontWeight": "400",
49
- "lineHeight": 49,
50
- "textDecorationColor": "#000000",
51
- },
52
- ]
53
- }
54
- type="header1"
55
- variant="bold"
56
- >
57
- Notification
58
- </Text>
59
- </View>
60
- <View
61
- style={
62
- Array [
63
- Object {
64
- "marginBottom": 90,
65
- },
66
- ]
67
- }
68
- >
69
- <View
70
- style={
71
- Array [
72
- Object {
73
- "marginBottom": 30,
74
- },
75
- ]
76
- }
77
- >
78
- <View
79
- style={
80
- Array [
81
- Object {
82
- "marginBottom": 30,
83
- },
84
- ]
85
- }
86
- >
87
- <Text
88
- aria-level="2"
89
- color="black"
90
- isHeader={true}
91
- style={
92
- Array [
93
- Object {
94
- "color": "#000000",
95
- "fontFamily": "Moderat-Extended-Bold",
96
- "fontSize": 32,
97
- "fontStyle": "normal",
98
- "fontWeight": "400",
99
- "lineHeight": 42,
100
- "textDecorationColor": "#000000",
101
- },
102
- ]
103
- }
104
- type="header2"
105
- variant="bold"
106
- >
107
- Demo
108
- </Text>
109
- </View>
110
- <View
111
- insets={
112
- Object {
113
- "top": 0,
114
- }
115
- }
116
- noRadius={true}
117
- style={
118
- Array [
119
- Object {
120
- "alignItems": "flex-start",
121
- "backgroundColor": "#89BDDD",
122
- "borderRadius": 0,
123
- "flexDirection": "row",
124
- "justifyContent": "space-between",
125
- "paddingBottom": 16,
126
- "paddingLeft": 16,
127
- "paddingRight": 16,
128
- "paddingTop": 16,
129
- },
130
- ]
131
- }
132
- type="info"
133
- >
134
- <View
135
- style={
136
- Array [
137
- Object {
138
- "marginRight": 16,
139
- },
140
- ]
141
- }
142
- >
143
- <View
144
- color="black"
145
- size={20}
146
- style={
147
- Array [
148
- Object {
149
- "alignSelf": "auto",
150
- "color": "black",
151
- "height": 20,
152
- "width": 20,
153
- },
154
- ]
155
- }
156
- >
157
- <svg
158
- color="black"
159
- data-file-name="SvgInfoInline"
160
- />
161
- </View>
162
- </View>
163
- <Text
164
- centeredText={false}
165
- style={
166
- Array [
167
- Object {
168
- "flexBasis": 0,
169
- "flexGrow": 1,
170
- "flexShrink": 1,
171
- "textAlign": "left",
172
- },
173
- ]
174
- }
175
- type="info"
176
- >
177
- <Text
178
- color="black"
179
- isHeader={false}
180
- style={
181
- Array [
182
- Object {
183
- "color": "#000000",
184
- "fontFamily": "NotoSans",
185
- "fontSize": 14,
186
- "fontStyle": "normal",
187
- "fontWeight": "400",
188
- "lineHeight": 22,
189
- "textDecorationColor": "#000000",
190
- },
191
- ]
192
- }
193
- type="body-small"
194
- variant="regular"
195
- >
196
- Something happened !
197
- </Text>
198
- </Text>
199
- </View>
200
- </View>
201
- </View>
202
- <View
203
- style={
204
- Array [
205
- Object {
206
- "marginBottom": 30,
207
- },
208
- ]
209
- }
210
- >
211
- <View
212
- style={
213
- Array [
214
- Object {
215
- "marginBottom": 30,
216
- },
217
- ]
218
- }
219
- >
220
- <Text
221
- aria-level="2"
222
- color="black"
223
- isHeader={true}
224
- style={
225
- Array [
226
- Object {
227
- "color": "#000000",
228
- "fontFamily": "Moderat-Extended-Bold",
229
- "fontSize": 32,
230
- "fontStyle": "normal",
231
- "fontWeight": "400",
232
- "lineHeight": 42,
233
- "textDecorationColor": "#000000",
234
- },
235
- ]
236
- }
237
- type="header2"
238
- variant="bold"
239
- >
240
- Classic
241
- </Text>
242
- </View>
243
- <View
244
- style={
245
- Array [
246
- Object {
247
- "marginBottom": 20,
248
- },
249
- ]
250
- }
251
- >
252
- <View
253
- style={
254
- Array [
255
- Object {
256
- "marginBottom": 10,
257
- },
258
- ]
259
- }
260
- >
261
- <Text
262
- aria-level="3"
263
- color="black"
264
- isHeader={true}
265
- medium="header4"
266
- style={
267
- Array [
268
- Object {
269
- "color": "#000000",
270
- "fontFamily": "Moderat-Extended-Bold",
271
- "fontSize": 24,
272
- "fontStyle": "normal",
273
- "fontWeight": "400",
274
- "lineHeight": 31,
275
- "textDecorationColor": "#000000",
276
- },
277
- ]
278
- }
279
- type="header3"
280
- variant="bold"
281
- >
282
- Info
283
- </Text>
284
- </View>
285
- <View
286
- insets={
287
- Object {
288
- "top": 0,
289
- }
290
- }
291
- noRadius={true}
292
- style={
293
- Array [
294
- Object {
295
- "alignItems": "flex-start",
296
- "backgroundColor": "#89BDDD",
297
- "borderRadius": 0,
298
- "flexDirection": "row",
299
- "justifyContent": "space-between",
300
- "paddingBottom": 16,
301
- "paddingLeft": 16,
302
- "paddingRight": 16,
303
- "paddingTop": 16,
304
- },
305
- ]
306
- }
307
- type="info"
308
- >
309
- <View
310
- style={
311
- Array [
312
- Object {
313
- "marginRight": 16,
314
- },
315
- ]
316
- }
317
- >
318
- <View
319
- color="black"
320
- size={20}
321
- style={
322
- Array [
323
- Object {
324
- "alignSelf": "auto",
325
- "color": "black",
326
- "height": 20,
327
- "width": 20,
328
- },
329
- ]
330
- }
331
- >
332
- <svg
333
- color="black"
334
- data-file-name="SvgInfoInline"
335
- />
336
- </View>
337
- </View>
338
- <Text
339
- centeredText={false}
340
- style={
341
- Array [
342
- Object {
343
- "flexBasis": 0,
344
- "flexGrow": 1,
345
- "flexShrink": 1,
346
- "textAlign": "left",
347
- },
348
- ]
349
- }
350
- type="info"
351
- >
352
- <Text
353
- color="black"
354
- isHeader={false}
355
- style={
356
- Array [
357
- Object {
358
- "color": "#000000",
359
- "fontFamily": "NotoSans",
360
- "fontSize": 14,
361
- "fontStyle": "normal",
362
- "fontWeight": "400",
363
- "lineHeight": 22,
364
- "textDecorationColor": "#000000",
365
- },
366
- ]
367
- }
368
- type="body-small"
369
- variant="regular"
370
- >
371
- Something definitely happened !
372
- </Text>
373
- </Text>
374
- </View>
375
- </View>
376
- <View
377
- style={
378
- Array [
379
- Object {
380
- "marginBottom": 20,
381
- },
382
- ]
383
- }
384
- >
385
- <View
386
- style={
387
- Array [
388
- Object {
389
- "marginBottom": 10,
390
- },
391
- ]
392
- }
393
- >
394
- <Text
395
- aria-level="3"
396
- color="black"
397
- isHeader={true}
398
- medium="header4"
399
- style={
400
- Array [
401
- Object {
402
- "color": "#000000",
403
- "fontFamily": "Moderat-Extended-Bold",
404
- "fontSize": 24,
405
- "fontStyle": "normal",
406
- "fontWeight": "400",
407
- "lineHeight": 31,
408
- "textDecorationColor": "#000000",
409
- },
410
- ]
411
- }
412
- type="header3"
413
- variant="bold"
414
- >
415
- Confirmation
416
- </Text>
417
- </View>
418
- <View
419
- insets={
420
- Object {
421
- "top": 0,
422
- }
423
- }
424
- noRadius={true}
425
- style={
426
- Array [
427
- Object {
428
- "alignItems": "flex-start",
429
- "backgroundColor": "#38836D",
430
- "borderRadius": 0,
431
- "flexDirection": "row",
432
- "justifyContent": "space-between",
433
- "paddingBottom": 16,
434
- "paddingLeft": 16,
435
- "paddingRight": 16,
436
- "paddingTop": 16,
437
- },
438
- ]
439
- }
440
- type="success"
441
- >
442
- <View
443
- style={
444
- Array [
445
- Object {
446
- "marginRight": 16,
447
- },
448
- ]
449
- }
450
- >
451
- <View
452
- color="white"
453
- size={20}
454
- style={
455
- Array [
456
- Object {
457
- "alignSelf": "auto",
458
- "color": "white",
459
- "height": 20,
460
- "width": 20,
461
- },
462
- ]
463
- }
464
- >
465
- <svg
466
- color="white"
467
- data-file-name="SvgCheckInline"
468
- />
469
- </View>
470
- </View>
471
- <Text
472
- centeredText={false}
473
- style={
474
- Array [
475
- Object {
476
- "flexBasis": 0,
477
- "flexGrow": 1,
478
- "flexShrink": 1,
479
- "textAlign": "left",
480
- },
481
- ]
482
- }
483
- type="success"
484
- >
485
- <Text
486
- color="white"
487
- isHeader={false}
488
- style={
489
- Array [
490
- Object {
491
- "color": "#FFFFFF",
492
- "fontFamily": "NotoSans",
493
- "fontSize": 14,
494
- "fontStyle": "normal",
495
- "fontWeight": "400",
496
- "lineHeight": 22,
497
- "textDecorationColor": "#FFFFFF",
498
- },
499
- ]
500
- }
501
- type="body-small"
502
- variant="regular"
503
- >
504
- Something good happened !
505
- </Text>
506
- </Text>
507
- </View>
508
- </View>
509
- <View
510
- style={
511
- Array [
512
- Object {
513
- "marginBottom": 20,
514
- },
515
- ]
516
- }
517
- >
518
- <View
519
- style={
520
- Array [
521
- Object {
522
- "marginBottom": 10,
523
- },
524
- ]
525
- }
526
- >
527
- <Text
528
- aria-level="3"
529
- color="black"
530
- isHeader={true}
531
- medium="header4"
532
- style={
533
- Array [
534
- Object {
535
- "color": "#000000",
536
- "fontFamily": "Moderat-Extended-Bold",
537
- "fontSize": 24,
538
- "fontStyle": "normal",
539
- "fontWeight": "400",
540
- "lineHeight": 31,
541
- "textDecorationColor": "#000000",
542
- },
543
- ]
544
- }
545
- type="header3"
546
- variant="bold"
547
- >
548
- Warning
549
- </Text>
550
- </View>
551
- <View
552
- insets={
553
- Object {
554
- "top": 0,
555
- }
556
- }
557
- noRadius={true}
558
- style={
559
- Array [
560
- Object {
561
- "alignItems": "flex-start",
562
- "backgroundColor": "#F8C583",
563
- "borderRadius": 0,
564
- "flexDirection": "row",
565
- "justifyContent": "space-between",
566
- "paddingBottom": 16,
567
- "paddingLeft": 16,
568
- "paddingRight": 16,
569
- "paddingTop": 16,
570
- },
571
- ]
572
- }
573
- type="warning"
574
- >
575
- <View
576
- style={
577
- Array [
578
- Object {
579
- "marginRight": 16,
580
- },
581
- ]
582
- }
583
- >
584
- <View
585
- color="black"
586
- size={20}
587
- style={
588
- Array [
589
- Object {
590
- "alignSelf": "auto",
591
- "color": "black",
592
- "height": 20,
593
- "width": 20,
594
- },
595
- ]
596
- }
597
- >
598
- <svg
599
- color="black"
600
- data-file-name="SvgAlertCircleInline"
601
- />
602
- </View>
603
- </View>
604
- <Text
605
- centeredText={false}
606
- style={
607
- Array [
608
- Object {
609
- "flexBasis": 0,
610
- "flexGrow": 1,
611
- "flexShrink": 1,
612
- "textAlign": "left",
613
- },
614
- ]
615
- }
616
- type="warning"
617
- >
618
- <Text
619
- color="black"
620
- isHeader={false}
621
- style={
622
- Array [
623
- Object {
624
- "color": "#000000",
625
- "fontFamily": "NotoSans",
626
- "fontSize": 14,
627
- "fontStyle": "normal",
628
- "fontWeight": "400",
629
- "lineHeight": 22,
630
- "textDecorationColor": "#000000",
631
- },
632
- ]
633
- }
634
- type="body-small"
635
- variant="regular"
636
- >
637
- Something weird happened !
638
- </Text>
639
- </Text>
640
- </View>
641
- </View>
642
- <View
643
- style={
644
- Array [
645
- Object {
646
- "marginBottom": 20,
647
- },
648
- ]
649
- }
650
- >
651
- <View
652
- style={
653
- Array [
654
- Object {
655
- "marginBottom": 10,
656
- },
657
- ]
658
- }
659
- >
660
- <Text
661
- aria-level="3"
662
- color="black"
663
- isHeader={true}
664
- medium="header4"
665
- style={
666
- Array [
667
- Object {
668
- "color": "#000000",
669
- "fontFamily": "Moderat-Extended-Bold",
670
- "fontSize": 24,
671
- "fontStyle": "normal",
672
- "fontWeight": "400",
673
- "lineHeight": 31,
674
- "textDecorationColor": "#000000",
675
- },
676
- ]
677
- }
678
- type="header3"
679
- variant="bold"
680
- >
681
- Error
682
- </Text>
683
- </View>
684
- <View
685
- insets={
686
- Object {
687
- "top": 0,
688
- }
689
- }
690
- noRadius={true}
691
- style={
692
- Array [
693
- Object {
694
- "alignItems": "flex-start",
695
- "backgroundColor": "#D44148",
696
- "borderRadius": 0,
697
- "flexDirection": "row",
698
- "justifyContent": "space-between",
699
- "paddingBottom": 16,
700
- "paddingLeft": 16,
701
- "paddingRight": 16,
702
- "paddingTop": 16,
703
- },
704
- ]
705
- }
706
- type="danger"
707
- >
708
- <View
709
- style={
710
- Array [
711
- Object {
712
- "marginRight": 16,
713
- },
714
- ]
715
- }
716
- >
717
- <View
718
- color="white"
719
- size={20}
720
- style={
721
- Array [
722
- Object {
723
- "alignSelf": "auto",
724
- "color": "white",
725
- "height": 20,
726
- "width": 20,
727
- },
728
- ]
729
- }
730
- >
731
- <svg
732
- color="white"
733
- data-file-name="SvgAlertTriangleInline"
734
- />
735
- </View>
736
- </View>
737
- <Text
738
- centeredText={false}
739
- style={
740
- Array [
741
- Object {
742
- "flexBasis": 0,
743
- "flexGrow": 1,
744
- "flexShrink": 1,
745
- "textAlign": "left",
746
- },
747
- ]
748
- }
749
- type="danger"
750
- >
751
- <Text
752
- color="white"
753
- isHeader={false}
754
- style={
755
- Array [
756
- Object {
757
- "color": "#FFFFFF",
758
- "fontFamily": "NotoSans",
759
- "fontSize": 14,
760
- "fontStyle": "normal",
761
- "fontWeight": "400",
762
- "lineHeight": 22,
763
- "textDecorationColor": "#FFFFFF",
764
- },
765
- ]
766
- }
767
- type="body-small"
768
- variant="regular"
769
- >
770
- Something bad happened !
771
- </Text>
772
- </Text>
773
- </View>
774
- </View>
775
- </View>
776
- <View
777
- style={
778
- Array [
779
- Object {
780
- "marginBottom": 30,
781
- },
782
- ]
783
- }
784
- >
785
- <View
786
- style={
787
- Array [
788
- Object {
789
- "marginBottom": 30,
790
- },
791
- ]
792
- }
793
- >
794
- <Text
795
- aria-level="2"
796
- color="black"
797
- isHeader={true}
798
- style={
799
- Array [
800
- Object {
801
- "color": "#000000",
802
- "fontFamily": "Moderat-Extended-Bold",
803
- "fontSize": 32,
804
- "fontStyle": "normal",
805
- "fontWeight": "400",
806
- "lineHeight": 42,
807
- "textDecorationColor": "#000000",
808
- },
809
- ]
810
- }
811
- type="header2"
812
- variant="bold"
813
- >
814
- Classic - Centered Text
815
- </Text>
816
- </View>
817
- <View
818
- style={
819
- Array [
820
- Object {
821
- "marginBottom": 20,
822
- },
823
- ]
824
- }
825
- >
826
- <View
827
- style={
828
- Array [
829
- Object {
830
- "marginBottom": 10,
831
- },
832
- ]
833
- }
834
- >
835
- <Text
836
- aria-level="3"
837
- color="black"
838
- isHeader={true}
839
- medium="header4"
840
- style={
841
- Array [
842
- Object {
843
- "color": "#000000",
844
- "fontFamily": "Moderat-Extended-Bold",
845
- "fontSize": 24,
846
- "fontStyle": "normal",
847
- "fontWeight": "400",
848
- "lineHeight": 31,
849
- "textDecorationColor": "#000000",
850
- },
851
- ]
852
- }
853
- type="header3"
854
- variant="bold"
855
- >
856
- Info
857
- </Text>
858
- </View>
859
- <View
860
- insets={
861
- Object {
862
- "top": 0,
863
- }
864
- }
865
- noRadius={true}
866
- style={
867
- Array [
868
- Object {
869
- "alignItems": "flex-start",
870
- "backgroundColor": "#89BDDD",
871
- "borderRadius": 0,
872
- "flexDirection": "row",
873
- "justifyContent": "space-between",
874
- "paddingBottom": 16,
875
- "paddingLeft": 16,
876
- "paddingRight": 16,
877
- "paddingTop": 16,
878
- },
879
- ]
880
- }
881
- type="info"
882
- >
883
- <Text
884
- centeredText={true}
885
- style={
886
- Array [
887
- Object {
888
- "flexBasis": 0,
889
- "flexGrow": 1,
890
- "flexShrink": 1,
891
- "textAlign": "center",
892
- },
893
- ]
894
- }
895
- type="info"
896
- >
897
- <Text
898
- color="black"
899
- isHeader={false}
900
- style={
901
- Array [
902
- Object {
903
- "color": "#000000",
904
- "fontFamily": "NotoSans",
905
- "fontSize": 14,
906
- "fontStyle": "normal",
907
- "fontWeight": "400",
908
- "lineHeight": 22,
909
- "textDecorationColor": "#000000",
910
- },
911
- ]
912
- }
913
- type="body-small"
914
- variant="regular"
915
- >
916
- Something definitely happened !
917
- </Text>
918
- </Text>
919
- </View>
920
- </View>
921
- <View
922
- style={
923
- Array [
924
- Object {
925
- "marginBottom": 20,
926
- },
927
- ]
928
- }
929
- >
930
- <View
931
- style={
932
- Array [
933
- Object {
934
- "marginBottom": 10,
935
- },
936
- ]
937
- }
938
- >
939
- <Text
940
- aria-level="3"
941
- color="black"
942
- isHeader={true}
943
- medium="header4"
944
- style={
945
- Array [
946
- Object {
947
- "color": "#000000",
948
- "fontFamily": "Moderat-Extended-Bold",
949
- "fontSize": 24,
950
- "fontStyle": "normal",
951
- "fontWeight": "400",
952
- "lineHeight": 31,
953
- "textDecorationColor": "#000000",
954
- },
955
- ]
956
- }
957
- type="header3"
958
- variant="bold"
959
- >
960
- Confirmation
961
- </Text>
962
- </View>
963
- <View
964
- insets={
965
- Object {
966
- "top": 0,
967
- }
968
- }
969
- noRadius={true}
970
- style={
971
- Array [
972
- Object {
973
- "alignItems": "flex-start",
974
- "backgroundColor": "#38836D",
975
- "borderRadius": 0,
976
- "flexDirection": "row",
977
- "justifyContent": "space-between",
978
- "paddingBottom": 16,
979
- "paddingLeft": 16,
980
- "paddingRight": 16,
981
- "paddingTop": 16,
982
- },
983
- ]
984
- }
985
- type="success"
986
- >
987
- <Text
988
- centeredText={true}
989
- style={
990
- Array [
991
- Object {
992
- "flexBasis": 0,
993
- "flexGrow": 1,
994
- "flexShrink": 1,
995
- "textAlign": "center",
996
- },
997
- ]
998
- }
999
- type="success"
1000
- >
1001
- <Text
1002
- color="white"
1003
- isHeader={false}
1004
- style={
1005
- Array [
1006
- Object {
1007
- "color": "#FFFFFF",
1008
- "fontFamily": "NotoSans",
1009
- "fontSize": 14,
1010
- "fontStyle": "normal",
1011
- "fontWeight": "400",
1012
- "lineHeight": 22,
1013
- "textDecorationColor": "#FFFFFF",
1014
- },
1015
- ]
1016
- }
1017
- type="body-small"
1018
- variant="regular"
1019
- >
1020
- Something good happened !
1021
- </Text>
1022
- </Text>
1023
- </View>
1024
- </View>
1025
- <View
1026
- style={
1027
- Array [
1028
- Object {
1029
- "marginBottom": 20,
1030
- },
1031
- ]
1032
- }
1033
- >
1034
- <View
1035
- style={
1036
- Array [
1037
- Object {
1038
- "marginBottom": 10,
1039
- },
1040
- ]
1041
- }
1042
- >
1043
- <Text
1044
- aria-level="3"
1045
- color="black"
1046
- isHeader={true}
1047
- medium="header4"
1048
- style={
1049
- Array [
1050
- Object {
1051
- "color": "#000000",
1052
- "fontFamily": "Moderat-Extended-Bold",
1053
- "fontSize": 24,
1054
- "fontStyle": "normal",
1055
- "fontWeight": "400",
1056
- "lineHeight": 31,
1057
- "textDecorationColor": "#000000",
1058
- },
1059
- ]
1060
- }
1061
- type="header3"
1062
- variant="bold"
1063
- >
1064
- Warning
1065
- </Text>
1066
- </View>
1067
- <View
1068
- insets={
1069
- Object {
1070
- "top": 0,
1071
- }
1072
- }
1073
- noRadius={true}
1074
- style={
1075
- Array [
1076
- Object {
1077
- "alignItems": "flex-start",
1078
- "backgroundColor": "#F8C583",
1079
- "borderRadius": 0,
1080
- "flexDirection": "row",
1081
- "justifyContent": "space-between",
1082
- "paddingBottom": 16,
1083
- "paddingLeft": 16,
1084
- "paddingRight": 16,
1085
- "paddingTop": 16,
1086
- },
1087
- ]
1088
- }
1089
- type="warning"
1090
- >
1091
- <Text
1092
- centeredText={true}
1093
- style={
1094
- Array [
1095
- Object {
1096
- "flexBasis": 0,
1097
- "flexGrow": 1,
1098
- "flexShrink": 1,
1099
- "textAlign": "center",
1100
- },
1101
- ]
1102
- }
1103
- type="warning"
1104
- >
1105
- <Text
1106
- color="black"
1107
- isHeader={false}
1108
- style={
1109
- Array [
1110
- Object {
1111
- "color": "#000000",
1112
- "fontFamily": "NotoSans",
1113
- "fontSize": 14,
1114
- "fontStyle": "normal",
1115
- "fontWeight": "400",
1116
- "lineHeight": 22,
1117
- "textDecorationColor": "#000000",
1118
- },
1119
- ]
1120
- }
1121
- type="body-small"
1122
- variant="regular"
1123
- >
1124
- Something weird happened !
1125
- </Text>
1126
- </Text>
1127
- </View>
1128
- </View>
1129
- <View
1130
- style={
1131
- Array [
1132
- Object {
1133
- "marginBottom": 20,
1134
- },
1135
- ]
1136
- }
1137
- >
1138
- <View
1139
- style={
1140
- Array [
1141
- Object {
1142
- "marginBottom": 10,
1143
- },
1144
- ]
1145
- }
1146
- >
1147
- <Text
1148
- aria-level="3"
1149
- color="black"
1150
- isHeader={true}
1151
- medium="header4"
1152
- style={
1153
- Array [
1154
- Object {
1155
- "color": "#000000",
1156
- "fontFamily": "Moderat-Extended-Bold",
1157
- "fontSize": 24,
1158
- "fontStyle": "normal",
1159
- "fontWeight": "400",
1160
- "lineHeight": 31,
1161
- "textDecorationColor": "#000000",
1162
- },
1163
- ]
1164
- }
1165
- type="header3"
1166
- variant="bold"
1167
- >
1168
- Error
1169
- </Text>
1170
- </View>
1171
- <View
1172
- insets={
1173
- Object {
1174
- "top": 0,
1175
- }
1176
- }
1177
- noRadius={true}
1178
- style={
1179
- Array [
1180
- Object {
1181
- "alignItems": "flex-start",
1182
- "backgroundColor": "#D44148",
1183
- "borderRadius": 0,
1184
- "flexDirection": "row",
1185
- "justifyContent": "space-between",
1186
- "paddingBottom": 16,
1187
- "paddingLeft": 16,
1188
- "paddingRight": 16,
1189
- "paddingTop": 16,
1190
- },
1191
- ]
1192
- }
1193
- type="danger"
1194
- >
1195
- <Text
1196
- centeredText={true}
1197
- style={
1198
- Array [
1199
- Object {
1200
- "flexBasis": 0,
1201
- "flexGrow": 1,
1202
- "flexShrink": 1,
1203
- "textAlign": "center",
1204
- },
1205
- ]
1206
- }
1207
- type="danger"
1208
- >
1209
- <Text
1210
- color="white"
1211
- isHeader={false}
1212
- style={
1213
- Array [
1214
- Object {
1215
- "color": "#FFFFFF",
1216
- "fontFamily": "NotoSans",
1217
- "fontSize": 14,
1218
- "fontStyle": "normal",
1219
- "fontWeight": "400",
1220
- "lineHeight": 22,
1221
- "textDecorationColor": "#FFFFFF",
1222
- },
1223
- ]
1224
- }
1225
- type="body-small"
1226
- variant="regular"
1227
- >
1228
- Something bad happened !
1229
- </Text>
1230
- </Text>
1231
- </View>
1232
- </View>
1233
- </View>
1234
- <View
1235
- style={
1236
- Array [
1237
- Object {
1238
- "marginBottom": 30,
1239
- },
1240
- ]
1241
- }
1242
- >
1243
- <View
1244
- style={
1245
- Array [
1246
- Object {
1247
- "marginBottom": 30,
1248
- },
1249
- ]
1250
- }
1251
- >
1252
- <Text
1253
- aria-level="2"
1254
- color="black"
1255
- isHeader={true}
1256
- style={
1257
- Array [
1258
- Object {
1259
- "color": "#000000",
1260
- "fontFamily": "Moderat-Extended-Bold",
1261
- "fontSize": 32,
1262
- "fontStyle": "normal",
1263
- "fontWeight": "400",
1264
- "lineHeight": 42,
1265
- "textDecorationColor": "#000000",
1266
- },
1267
- ]
1268
- }
1269
- type="header2"
1270
- variant="bold"
1271
- >
1272
- Dismissable
1273
- </Text>
1274
- </View>
1275
- <View
1276
- style={
1277
- Array [
1278
- Object {
1279
- "marginBottom": 20,
1280
- },
1281
- ]
1282
- }
1283
- >
1284
- <View
1285
- style={
1286
- Array [
1287
- Object {
1288
- "marginBottom": 10,
1289
- },
1290
- ]
1291
- }
1292
- >
1293
- <Text
1294
- aria-level="3"
1295
- color="black"
1296
- isHeader={true}
1297
- medium="header4"
1298
- style={
1299
- Array [
1300
- Object {
1301
- "color": "#000000",
1302
- "fontFamily": "Moderat-Extended-Bold",
1303
- "fontSize": 24,
1304
- "fontStyle": "normal",
1305
- "fontWeight": "400",
1306
- "lineHeight": 31,
1307
- "textDecorationColor": "#000000",
1308
- },
1309
- ]
1310
- }
1311
- type="header3"
1312
- variant="bold"
1313
- >
1314
- Info
1315
- </Text>
1316
- </View>
1317
- <View
1318
- insets={
1319
- Object {
1320
- "top": 0,
1321
- }
1322
- }
1323
- noRadius={true}
1324
- style={
1325
- Array [
1326
- Object {
1327
- "alignItems": "flex-start",
1328
- "backgroundColor": "#89BDDD",
1329
- "borderRadius": 0,
1330
- "flexDirection": "row",
1331
- "justifyContent": "space-between",
1332
- "paddingBottom": 16,
1333
- "paddingLeft": 16,
1334
- "paddingRight": 16,
1335
- "paddingTop": 16,
1336
- },
1337
- ]
1338
- }
1339
- type="info"
1340
- >
1341
- <View
1342
- style={
1343
- Array [
1344
- Object {
1345
- "marginRight": 16,
1346
- },
1347
- ]
1348
- }
1349
- >
1350
- <View
1351
- color="black"
1352
- size={20}
1353
- style={
1354
- Array [
1355
- Object {
1356
- "alignSelf": "auto",
1357
- "color": "black",
1358
- "height": 20,
1359
- "width": 20,
1360
- },
1361
- ]
1362
- }
1363
- >
1364
- <svg
1365
- color="black"
1366
- data-file-name="SvgInfoInline"
1367
- />
1368
- </View>
1369
- </View>
1370
- <Text
1371
- centeredText={false}
1372
- style={
1373
- Array [
1374
- Object {
1375
- "flexBasis": 0,
1376
- "flexGrow": 1,
1377
- "flexShrink": 1,
1378
- "textAlign": "left",
1379
- },
1380
- ]
1381
- }
1382
- type="info"
1383
- >
1384
- <Text
1385
- color="black"
1386
- isHeader={false}
1387
- style={
1388
- Array [
1389
- Object {
1390
- "color": "#000000",
1391
- "fontFamily": "NotoSans",
1392
- "fontSize": 14,
1393
- "fontStyle": "normal",
1394
- "fontWeight": "400",
1395
- "lineHeight": 22,
1396
- "textDecorationColor": "#000000",
1397
- },
1398
- ]
1399
- }
1400
- type="body-small"
1401
- variant="regular"
1402
- >
1403
- Something definitely happened !
1404
- </Text>
1405
- </Text>
1406
- <View
1407
- accessible={true}
1408
- focusable={true}
1409
- onClick={[Function]}
1410
- onResponderGrant={[Function]}
1411
- onResponderMove={[Function]}
1412
- onResponderRelease={[Function]}
1413
- onResponderTerminate={[Function]}
1414
- onResponderTerminationRequest={[Function]}
1415
- onStartShouldSetResponder={[Function]}
1416
- style={
1417
- Object {
1418
- "marginLeft": 16,
1419
- "opacity": 1,
1420
- "paddingBottom": 4,
1421
- "paddingLeft": 4,
1422
- "paddingRight": 4,
1423
- "paddingTop": 4,
1424
- }
1425
- }
1426
- >
1427
- <View
1428
- color="black"
1429
- size={14}
1430
- style={
1431
- Array [
1432
- Object {
1433
- "alignSelf": "auto",
1434
- "color": "black",
1435
- "height": 14,
1436
- "width": 14,
1437
- },
1438
- ]
1439
- }
1440
- >
1441
- <svg
1442
- color="black"
1443
- data-file-name="SvgXInline"
1444
- />
1445
- </View>
1446
- </View>
1447
- </View>
1448
- </View>
1449
- <View
1450
- style={
1451
- Array [
1452
- Object {
1453
- "marginBottom": 20,
1454
- },
1455
- ]
1456
- }
1457
- >
1458
- <View
1459
- style={
1460
- Array [
1461
- Object {
1462
- "marginBottom": 10,
1463
- },
1464
- ]
1465
- }
1466
- >
1467
- <Text
1468
- aria-level="3"
1469
- color="black"
1470
- isHeader={true}
1471
- medium="header4"
1472
- style={
1473
- Array [
1474
- Object {
1475
- "color": "#000000",
1476
- "fontFamily": "Moderat-Extended-Bold",
1477
- "fontSize": 24,
1478
- "fontStyle": "normal",
1479
- "fontWeight": "400",
1480
- "lineHeight": 31,
1481
- "textDecorationColor": "#000000",
1482
- },
1483
- ]
1484
- }
1485
- type="header3"
1486
- variant="bold"
1487
- >
1488
- Confirmation
1489
- </Text>
1490
- </View>
1491
- <View
1492
- insets={
1493
- Object {
1494
- "top": 0,
1495
- }
1496
- }
1497
- noRadius={true}
1498
- style={
1499
- Array [
1500
- Object {
1501
- "alignItems": "flex-start",
1502
- "backgroundColor": "#38836D",
1503
- "borderRadius": 0,
1504
- "flexDirection": "row",
1505
- "justifyContent": "space-between",
1506
- "paddingBottom": 16,
1507
- "paddingLeft": 16,
1508
- "paddingRight": 16,
1509
- "paddingTop": 16,
1510
- },
1511
- ]
1512
- }
1513
- type="success"
1514
- >
1515
- <View
1516
- style={
1517
- Array [
1518
- Object {
1519
- "marginRight": 16,
1520
- },
1521
- ]
1522
- }
1523
- >
1524
- <View
1525
- color="white"
1526
- size={20}
1527
- style={
1528
- Array [
1529
- Object {
1530
- "alignSelf": "auto",
1531
- "color": "white",
1532
- "height": 20,
1533
- "width": 20,
1534
- },
1535
- ]
1536
- }
1537
- >
1538
- <svg
1539
- color="white"
1540
- data-file-name="SvgCheckInline"
1541
- />
1542
- </View>
1543
- </View>
1544
- <Text
1545
- centeredText={false}
1546
- style={
1547
- Array [
1548
- Object {
1549
- "flexBasis": 0,
1550
- "flexGrow": 1,
1551
- "flexShrink": 1,
1552
- "textAlign": "left",
1553
- },
1554
- ]
1555
- }
1556
- type="success"
1557
- >
1558
- <Text
1559
- color="white"
1560
- isHeader={false}
1561
- style={
1562
- Array [
1563
- Object {
1564
- "color": "#FFFFFF",
1565
- "fontFamily": "NotoSans",
1566
- "fontSize": 14,
1567
- "fontStyle": "normal",
1568
- "fontWeight": "400",
1569
- "lineHeight": 22,
1570
- "textDecorationColor": "#FFFFFF",
1571
- },
1572
- ]
1573
- }
1574
- type="body-small"
1575
- variant="regular"
1576
- >
1577
- Something good happened !
1578
- </Text>
1579
- </Text>
1580
- <View
1581
- accessible={true}
1582
- focusable={true}
1583
- onClick={[Function]}
1584
- onResponderGrant={[Function]}
1585
- onResponderMove={[Function]}
1586
- onResponderRelease={[Function]}
1587
- onResponderTerminate={[Function]}
1588
- onResponderTerminationRequest={[Function]}
1589
- onStartShouldSetResponder={[Function]}
1590
- style={
1591
- Object {
1592
- "marginLeft": 16,
1593
- "opacity": 1,
1594
- "paddingBottom": 4,
1595
- "paddingLeft": 4,
1596
- "paddingRight": 4,
1597
- "paddingTop": 4,
1598
- }
1599
- }
1600
- >
1601
- <View
1602
- color="white"
1603
- size={14}
1604
- style={
1605
- Array [
1606
- Object {
1607
- "alignSelf": "auto",
1608
- "color": "white",
1609
- "height": 14,
1610
- "width": 14,
1611
- },
1612
- ]
1613
- }
1614
- >
1615
- <svg
1616
- color="white"
1617
- data-file-name="SvgXInline"
1618
- />
1619
- </View>
1620
- </View>
1621
- </View>
1622
- </View>
1623
- <View
1624
- style={
1625
- Array [
1626
- Object {
1627
- "marginBottom": 20,
1628
- },
1629
- ]
1630
- }
1631
- >
1632
- <View
1633
- style={
1634
- Array [
1635
- Object {
1636
- "marginBottom": 10,
1637
- },
1638
- ]
1639
- }
1640
- >
1641
- <Text
1642
- aria-level="3"
1643
- color="black"
1644
- isHeader={true}
1645
- medium="header4"
1646
- style={
1647
- Array [
1648
- Object {
1649
- "color": "#000000",
1650
- "fontFamily": "Moderat-Extended-Bold",
1651
- "fontSize": 24,
1652
- "fontStyle": "normal",
1653
- "fontWeight": "400",
1654
- "lineHeight": 31,
1655
- "textDecorationColor": "#000000",
1656
- },
1657
- ]
1658
- }
1659
- type="header3"
1660
- variant="bold"
1661
- >
1662
- Warning
1663
- </Text>
1664
- </View>
1665
- <View
1666
- insets={
1667
- Object {
1668
- "top": 0,
1669
- }
1670
- }
1671
- noRadius={true}
1672
- style={
1673
- Array [
1674
- Object {
1675
- "alignItems": "flex-start",
1676
- "backgroundColor": "#F8C583",
1677
- "borderRadius": 0,
1678
- "flexDirection": "row",
1679
- "justifyContent": "space-between",
1680
- "paddingBottom": 16,
1681
- "paddingLeft": 16,
1682
- "paddingRight": 16,
1683
- "paddingTop": 16,
1684
- },
1685
- ]
1686
- }
1687
- type="warning"
1688
- >
1689
- <View
1690
- style={
1691
- Array [
1692
- Object {
1693
- "marginRight": 16,
1694
- },
1695
- ]
1696
- }
1697
- >
1698
- <View
1699
- color="black"
1700
- size={20}
1701
- style={
1702
- Array [
1703
- Object {
1704
- "alignSelf": "auto",
1705
- "color": "black",
1706
- "height": 20,
1707
- "width": 20,
1708
- },
1709
- ]
1710
- }
1711
- >
1712
- <svg
1713
- color="black"
1714
- data-file-name="SvgAlertCircleInline"
1715
- />
1716
- </View>
1717
- </View>
1718
- <Text
1719
- centeredText={false}
1720
- style={
1721
- Array [
1722
- Object {
1723
- "flexBasis": 0,
1724
- "flexGrow": 1,
1725
- "flexShrink": 1,
1726
- "textAlign": "left",
1727
- },
1728
- ]
1729
- }
1730
- type="warning"
1731
- >
1732
- <Text
1733
- color="black"
1734
- isHeader={false}
1735
- style={
1736
- Array [
1737
- Object {
1738
- "color": "#000000",
1739
- "fontFamily": "NotoSans",
1740
- "fontSize": 14,
1741
- "fontStyle": "normal",
1742
- "fontWeight": "400",
1743
- "lineHeight": 22,
1744
- "textDecorationColor": "#000000",
1745
- },
1746
- ]
1747
- }
1748
- type="body-small"
1749
- variant="regular"
1750
- >
1751
- Something weird happened !
1752
- </Text>
1753
- </Text>
1754
- <View
1755
- accessible={true}
1756
- focusable={true}
1757
- onClick={[Function]}
1758
- onResponderGrant={[Function]}
1759
- onResponderMove={[Function]}
1760
- onResponderRelease={[Function]}
1761
- onResponderTerminate={[Function]}
1762
- onResponderTerminationRequest={[Function]}
1763
- onStartShouldSetResponder={[Function]}
1764
- style={
1765
- Object {
1766
- "marginLeft": 16,
1767
- "opacity": 1,
1768
- "paddingBottom": 4,
1769
- "paddingLeft": 4,
1770
- "paddingRight": 4,
1771
- "paddingTop": 4,
1772
- }
1773
- }
1774
- >
1775
- <View
1776
- color="black"
1777
- size={14}
1778
- style={
1779
- Array [
1780
- Object {
1781
- "alignSelf": "auto",
1782
- "color": "black",
1783
- "height": 14,
1784
- "width": 14,
1785
- },
1786
- ]
1787
- }
1788
- >
1789
- <svg
1790
- color="black"
1791
- data-file-name="SvgXInline"
1792
- />
1793
- </View>
1794
- </View>
1795
- </View>
1796
- </View>
1797
- <View
1798
- style={
1799
- Array [
1800
- Object {
1801
- "marginBottom": 20,
1802
- },
1803
- ]
1804
- }
1805
- >
1806
- <View
1807
- style={
1808
- Array [
1809
- Object {
1810
- "marginBottom": 10,
1811
- },
1812
- ]
1813
- }
1814
- >
1815
- <Text
1816
- aria-level="3"
1817
- color="black"
1818
- isHeader={true}
1819
- medium="header4"
1820
- style={
1821
- Array [
1822
- Object {
1823
- "color": "#000000",
1824
- "fontFamily": "Moderat-Extended-Bold",
1825
- "fontSize": 24,
1826
- "fontStyle": "normal",
1827
- "fontWeight": "400",
1828
- "lineHeight": 31,
1829
- "textDecorationColor": "#000000",
1830
- },
1831
- ]
1832
- }
1833
- type="header3"
1834
- variant="bold"
1835
- >
1836
- Error
1837
- </Text>
1838
- </View>
1839
- <View
1840
- insets={
1841
- Object {
1842
- "top": 0,
1843
- }
1844
- }
1845
- noRadius={true}
1846
- style={
1847
- Array [
1848
- Object {
1849
- "alignItems": "flex-start",
1850
- "backgroundColor": "#D44148",
1851
- "borderRadius": 0,
1852
- "flexDirection": "row",
1853
- "justifyContent": "space-between",
1854
- "paddingBottom": 16,
1855
- "paddingLeft": 16,
1856
- "paddingRight": 16,
1857
- "paddingTop": 16,
1858
- },
1859
- ]
1860
- }
1861
- type="danger"
1862
- >
1863
- <View
1864
- style={
1865
- Array [
1866
- Object {
1867
- "marginRight": 16,
1868
- },
1869
- ]
1870
- }
1871
- >
1872
- <View
1873
- color="white"
1874
- size={20}
1875
- style={
1876
- Array [
1877
- Object {
1878
- "alignSelf": "auto",
1879
- "color": "white",
1880
- "height": 20,
1881
- "width": 20,
1882
- },
1883
- ]
1884
- }
1885
- >
1886
- <svg
1887
- color="white"
1888
- data-file-name="SvgAlertTriangleInline"
1889
- />
1890
- </View>
1891
- </View>
1892
- <Text
1893
- centeredText={false}
1894
- style={
1895
- Array [
1896
- Object {
1897
- "flexBasis": 0,
1898
- "flexGrow": 1,
1899
- "flexShrink": 1,
1900
- "textAlign": "left",
1901
- },
1902
- ]
1903
- }
1904
- type="danger"
1905
- >
1906
- <Text
1907
- color="white"
1908
- isHeader={false}
1909
- style={
1910
- Array [
1911
- Object {
1912
- "color": "#FFFFFF",
1913
- "fontFamily": "NotoSans",
1914
- "fontSize": 14,
1915
- "fontStyle": "normal",
1916
- "fontWeight": "400",
1917
- "lineHeight": 22,
1918
- "textDecorationColor": "#FFFFFF",
1919
- },
1920
- ]
1921
- }
1922
- type="body-small"
1923
- variant="regular"
1924
- >
1925
- Something bad happened !
1926
- </Text>
1927
- </Text>
1928
- <View
1929
- accessible={true}
1930
- focusable={true}
1931
- onClick={[Function]}
1932
- onResponderGrant={[Function]}
1933
- onResponderMove={[Function]}
1934
- onResponderRelease={[Function]}
1935
- onResponderTerminate={[Function]}
1936
- onResponderTerminationRequest={[Function]}
1937
- onStartShouldSetResponder={[Function]}
1938
- style={
1939
- Object {
1940
- "marginLeft": 16,
1941
- "opacity": 1,
1942
- "paddingBottom": 4,
1943
- "paddingLeft": 4,
1944
- "paddingRight": 4,
1945
- "paddingTop": 4,
1946
- }
1947
- }
1948
- >
1949
- <View
1950
- color="white"
1951
- size={14}
1952
- style={
1953
- Array [
1954
- Object {
1955
- "alignSelf": "auto",
1956
- "color": "white",
1957
- "height": 14,
1958
- "width": 14,
1959
- },
1960
- ]
1961
- }
1962
- >
1963
- <svg
1964
- color="white"
1965
- data-file-name="SvgXInline"
1966
- />
1967
- </View>
1968
- </View>
1969
- </View>
1970
- </View>
1971
- </View>
1972
- <View
1973
- style={
1974
- Array [
1975
- Object {
1976
- "marginBottom": 30,
1977
- },
1978
- ]
1979
- }
1980
- >
1981
- <View
1982
- style={
1983
- Array [
1984
- Object {
1985
- "marginBottom": 30,
1986
- },
1987
- ]
1988
- }
1989
- >
1990
- <Text
1991
- aria-level="2"
1992
- color="black"
1993
- isHeader={true}
1994
- style={
1995
- Array [
1996
- Object {
1997
- "color": "#000000",
1998
- "fontFamily": "Moderat-Extended-Bold",
1999
- "fontSize": 32,
2000
- "fontStyle": "normal",
2001
- "fontWeight": "400",
2002
- "lineHeight": 42,
2003
- "textDecorationColor": "#000000",
2004
- },
2005
- ]
2006
- }
2007
- type="header2"
2008
- variant="bold"
2009
- >
2010
- Classic - with title
2011
- </Text>
2012
- </View>
2013
- <View
2014
- style={
2015
- Array [
2016
- Object {
2017
- "marginBottom": 20,
2018
- },
2019
- ]
2020
- }
2021
- >
2022
- <View
2023
- style={
2024
- Array [
2025
- Object {
2026
- "marginBottom": 10,
2027
- },
2028
- ]
2029
- }
2030
- >
2031
- <Text
2032
- aria-level="3"
2033
- color="black"
2034
- isHeader={true}
2035
- medium="header4"
2036
- style={
2037
- Array [
2038
- Object {
2039
- "color": "#000000",
2040
- "fontFamily": "Moderat-Extended-Bold",
2041
- "fontSize": 24,
2042
- "fontStyle": "normal",
2043
- "fontWeight": "400",
2044
- "lineHeight": 31,
2045
- "textDecorationColor": "#000000",
2046
- },
2047
- ]
2048
- }
2049
- type="header3"
2050
- variant="bold"
2051
- >
2052
- Info
2053
- </Text>
2054
- </View>
2055
- <View
2056
- insets={
2057
- Object {
2058
- "top": 0,
2059
- }
2060
- }
2061
- noRadius={true}
2062
- style={
2063
- Array [
2064
- Object {
2065
- "alignItems": "flex-start",
2066
- "backgroundColor": "#89BDDD",
2067
- "borderRadius": 0,
2068
- "flexDirection": "row",
2069
- "justifyContent": "space-between",
2070
- "paddingBottom": 16,
2071
- "paddingLeft": 16,
2072
- "paddingRight": 16,
2073
- "paddingTop": 16,
2074
- },
2075
- ]
2076
- }
2077
- type="info"
2078
- >
2079
- <View
2080
- style={
2081
- Array [
2082
- Object {
2083
- "marginRight": 16,
2084
- },
2085
- ]
2086
- }
2087
- >
2088
- <View
2089
- color="black"
2090
- size={20}
2091
- style={
2092
- Array [
2093
- Object {
2094
- "alignSelf": "auto",
2095
- "color": "black",
2096
- "height": 20,
2097
- "width": 20,
2098
- },
2099
- ]
2100
- }
2101
- >
2102
- <svg
2103
- color="black"
2104
- data-file-name="SvgInfoInline"
2105
- />
2106
- </View>
2107
- </View>
2108
- <Text
2109
- centeredText={false}
2110
- style={
2111
- Array [
2112
- Object {
2113
- "flexBasis": 0,
2114
- "flexGrow": 1,
2115
- "flexShrink": 1,
2116
- "textAlign": "left",
2117
- },
2118
- ]
2119
- }
2120
- type="info"
2121
- >
2122
- <Text
2123
- color="black"
2124
- isHeader={false}
2125
- style={
2126
- Array [
2127
- Object {
2128
- "color": "#000000",
2129
- "fontFamily": "NotoSans",
2130
- "fontSize": 14,
2131
- "fontStyle": "normal",
2132
- "fontWeight": "400",
2133
- "lineHeight": 22,
2134
- "textDecorationColor": "#000000",
2135
- },
2136
- ]
2137
- }
2138
- type="body-small"
2139
- variant="regular"
2140
- >
2141
- <Text
2142
- isHeader={false}
2143
- style={
2144
- Array [
2145
- Object {
2146
- "fontFamily": "NotoSans-Bold",
2147
- "fontSize": 16,
2148
- "fontStyle": "normal",
2149
- "fontWeight": "700",
2150
- "lineHeight": 26,
2151
- },
2152
- ]
2153
- }
2154
- type="body"
2155
- variant="bold"
2156
- >
2157
- This is a title
2158
-
2159
-
2160
- </Text>
2161
- <Text
2162
- isHeader={false}
2163
- style={
2164
- Array [
2165
- Object {
2166
- "fontFamily": "NotoSans",
2167
- "fontSize": 14,
2168
- "fontStyle": "normal",
2169
- "fontWeight": "400",
2170
- "lineHeight": 22,
2171
- },
2172
- ]
2173
- }
2174
- type="body-small"
2175
- variant="regular"
2176
- >
2177
- Something definitely happened !
2178
- </Text>
2179
- </Text>
2180
- </Text>
2181
- <View
2182
- accessible={true}
2183
- focusable={true}
2184
- onClick={[Function]}
2185
- onResponderGrant={[Function]}
2186
- onResponderMove={[Function]}
2187
- onResponderRelease={[Function]}
2188
- onResponderTerminate={[Function]}
2189
- onResponderTerminationRequest={[Function]}
2190
- onStartShouldSetResponder={[Function]}
2191
- style={
2192
- Object {
2193
- "marginLeft": 16,
2194
- "opacity": 1,
2195
- "paddingBottom": 4,
2196
- "paddingLeft": 4,
2197
- "paddingRight": 4,
2198
- "paddingTop": 4,
2199
- }
2200
- }
2201
- >
2202
- <View
2203
- color="black"
2204
- size={14}
2205
- style={
2206
- Array [
2207
- Object {
2208
- "alignSelf": "auto",
2209
- "color": "black",
2210
- "height": 14,
2211
- "width": 14,
2212
- },
2213
- ]
2214
- }
2215
- >
2216
- <svg
2217
- color="black"
2218
- data-file-name="SvgXInline"
2219
- />
2220
- </View>
2221
- </View>
2222
- </View>
2223
- </View>
2224
- <View
2225
- style={
2226
- Array [
2227
- Object {
2228
- "marginBottom": 20,
2229
- },
2230
- ]
2231
- }
2232
- >
2233
- <View
2234
- style={
2235
- Array [
2236
- Object {
2237
- "marginBottom": 10,
2238
- },
2239
- ]
2240
- }
2241
- >
2242
- <Text
2243
- aria-level="3"
2244
- color="black"
2245
- isHeader={true}
2246
- medium="header4"
2247
- style={
2248
- Array [
2249
- Object {
2250
- "color": "#000000",
2251
- "fontFamily": "Moderat-Extended-Bold",
2252
- "fontSize": 24,
2253
- "fontStyle": "normal",
2254
- "fontWeight": "400",
2255
- "lineHeight": 31,
2256
- "textDecorationColor": "#000000",
2257
- },
2258
- ]
2259
- }
2260
- type="header3"
2261
- variant="bold"
2262
- >
2263
- Confirmation
2264
- </Text>
2265
- </View>
2266
- <View
2267
- insets={
2268
- Object {
2269
- "top": 0,
2270
- }
2271
- }
2272
- noRadius={true}
2273
- style={
2274
- Array [
2275
- Object {
2276
- "alignItems": "flex-start",
2277
- "backgroundColor": "#38836D",
2278
- "borderRadius": 0,
2279
- "flexDirection": "row",
2280
- "justifyContent": "space-between",
2281
- "paddingBottom": 16,
2282
- "paddingLeft": 16,
2283
- "paddingRight": 16,
2284
- "paddingTop": 16,
2285
- },
2286
- ]
2287
- }
2288
- type="success"
2289
- >
2290
- <View
2291
- style={
2292
- Array [
2293
- Object {
2294
- "marginRight": 16,
2295
- },
2296
- ]
2297
- }
2298
- >
2299
- <View
2300
- color="white"
2301
- size={20}
2302
- style={
2303
- Array [
2304
- Object {
2305
- "alignSelf": "auto",
2306
- "color": "white",
2307
- "height": 20,
2308
- "width": 20,
2309
- },
2310
- ]
2311
- }
2312
- >
2313
- <svg
2314
- color="white"
2315
- data-file-name="SvgCheckInline"
2316
- />
2317
- </View>
2318
- </View>
2319
- <Text
2320
- centeredText={false}
2321
- style={
2322
- Array [
2323
- Object {
2324
- "flexBasis": 0,
2325
- "flexGrow": 1,
2326
- "flexShrink": 1,
2327
- "textAlign": "left",
2328
- },
2329
- ]
2330
- }
2331
- type="success"
2332
- >
2333
- <Text
2334
- color="white"
2335
- isHeader={false}
2336
- style={
2337
- Array [
2338
- Object {
2339
- "color": "#FFFFFF",
2340
- "fontFamily": "NotoSans",
2341
- "fontSize": 14,
2342
- "fontStyle": "normal",
2343
- "fontWeight": "400",
2344
- "lineHeight": 22,
2345
- "textDecorationColor": "#FFFFFF",
2346
- },
2347
- ]
2348
- }
2349
- type="body-small"
2350
- variant="regular"
2351
- >
2352
- <Text
2353
- isHeader={false}
2354
- style={
2355
- Array [
2356
- Object {
2357
- "fontFamily": "NotoSans-Bold",
2358
- "fontSize": 16,
2359
- "fontStyle": "normal",
2360
- "fontWeight": "700",
2361
- "lineHeight": 26,
2362
- },
2363
- ]
2364
- }
2365
- type="body"
2366
- variant="bold"
2367
- >
2368
- This is a title
2369
-
2370
-
2371
- </Text>
2372
- <Text
2373
- isHeader={false}
2374
- style={
2375
- Array [
2376
- Object {
2377
- "fontFamily": "NotoSans",
2378
- "fontSize": 14,
2379
- "fontStyle": "normal",
2380
- "fontWeight": "400",
2381
- "lineHeight": 22,
2382
- },
2383
- ]
2384
- }
2385
- type="body-small"
2386
- variant="regular"
2387
- >
2388
- Something good happened !
2389
- </Text>
2390
- </Text>
2391
- </Text>
2392
- <View
2393
- accessible={true}
2394
- focusable={true}
2395
- onClick={[Function]}
2396
- onResponderGrant={[Function]}
2397
- onResponderMove={[Function]}
2398
- onResponderRelease={[Function]}
2399
- onResponderTerminate={[Function]}
2400
- onResponderTerminationRequest={[Function]}
2401
- onStartShouldSetResponder={[Function]}
2402
- style={
2403
- Object {
2404
- "marginLeft": 16,
2405
- "opacity": 1,
2406
- "paddingBottom": 4,
2407
- "paddingLeft": 4,
2408
- "paddingRight": 4,
2409
- "paddingTop": 4,
2410
- }
2411
- }
2412
- >
2413
- <View
2414
- color="white"
2415
- size={14}
2416
- style={
2417
- Array [
2418
- Object {
2419
- "alignSelf": "auto",
2420
- "color": "white",
2421
- "height": 14,
2422
- "width": 14,
2423
- },
2424
- ]
2425
- }
2426
- >
2427
- <svg
2428
- color="white"
2429
- data-file-name="SvgXInline"
2430
- />
2431
- </View>
2432
- </View>
2433
- </View>
2434
- </View>
2435
- <View
2436
- style={
2437
- Array [
2438
- Object {
2439
- "marginBottom": 20,
2440
- },
2441
- ]
2442
- }
2443
- >
2444
- <View
2445
- style={
2446
- Array [
2447
- Object {
2448
- "marginBottom": 10,
2449
- },
2450
- ]
2451
- }
2452
- >
2453
- <Text
2454
- aria-level="3"
2455
- color="black"
2456
- isHeader={true}
2457
- medium="header4"
2458
- style={
2459
- Array [
2460
- Object {
2461
- "color": "#000000",
2462
- "fontFamily": "Moderat-Extended-Bold",
2463
- "fontSize": 24,
2464
- "fontStyle": "normal",
2465
- "fontWeight": "400",
2466
- "lineHeight": 31,
2467
- "textDecorationColor": "#000000",
2468
- },
2469
- ]
2470
- }
2471
- type="header3"
2472
- variant="bold"
2473
- >
2474
- Warning
2475
- </Text>
2476
- </View>
2477
- <View
2478
- insets={
2479
- Object {
2480
- "top": 0,
2481
- }
2482
- }
2483
- noRadius={true}
2484
- style={
2485
- Array [
2486
- Object {
2487
- "alignItems": "flex-start",
2488
- "backgroundColor": "#F8C583",
2489
- "borderRadius": 0,
2490
- "flexDirection": "row",
2491
- "justifyContent": "space-between",
2492
- "paddingBottom": 16,
2493
- "paddingLeft": 16,
2494
- "paddingRight": 16,
2495
- "paddingTop": 16,
2496
- },
2497
- ]
2498
- }
2499
- type="warning"
2500
- >
2501
- <View
2502
- style={
2503
- Array [
2504
- Object {
2505
- "marginRight": 16,
2506
- },
2507
- ]
2508
- }
2509
- >
2510
- <View
2511
- color="black"
2512
- size={20}
2513
- style={
2514
- Array [
2515
- Object {
2516
- "alignSelf": "auto",
2517
- "color": "black",
2518
- "height": 20,
2519
- "width": 20,
2520
- },
2521
- ]
2522
- }
2523
- >
2524
- <svg
2525
- color="black"
2526
- data-file-name="SvgAlertCircleInline"
2527
- />
2528
- </View>
2529
- </View>
2530
- <Text
2531
- centeredText={false}
2532
- style={
2533
- Array [
2534
- Object {
2535
- "flexBasis": 0,
2536
- "flexGrow": 1,
2537
- "flexShrink": 1,
2538
- "textAlign": "left",
2539
- },
2540
- ]
2541
- }
2542
- type="warning"
2543
- >
2544
- <Text
2545
- color="black"
2546
- isHeader={false}
2547
- style={
2548
- Array [
2549
- Object {
2550
- "color": "#000000",
2551
- "fontFamily": "NotoSans",
2552
- "fontSize": 14,
2553
- "fontStyle": "normal",
2554
- "fontWeight": "400",
2555
- "lineHeight": 22,
2556
- "textDecorationColor": "#000000",
2557
- },
2558
- ]
2559
- }
2560
- type="body-small"
2561
- variant="regular"
2562
- >
2563
- <Text
2564
- isHeader={false}
2565
- style={
2566
- Array [
2567
- Object {
2568
- "fontFamily": "NotoSans-Bold",
2569
- "fontSize": 16,
2570
- "fontStyle": "normal",
2571
- "fontWeight": "700",
2572
- "lineHeight": 26,
2573
- },
2574
- ]
2575
- }
2576
- type="body"
2577
- variant="bold"
2578
- >
2579
- This is a title
2580
-
2581
-
2582
- </Text>
2583
- <Text
2584
- isHeader={false}
2585
- style={
2586
- Array [
2587
- Object {
2588
- "fontFamily": "NotoSans",
2589
- "fontSize": 14,
2590
- "fontStyle": "normal",
2591
- "fontWeight": "400",
2592
- "lineHeight": 22,
2593
- },
2594
- ]
2595
- }
2596
- type="body-small"
2597
- variant="regular"
2598
- >
2599
- Something weird happened !
2600
- </Text>
2601
- </Text>
2602
- </Text>
2603
- <View
2604
- accessible={true}
2605
- focusable={true}
2606
- onClick={[Function]}
2607
- onResponderGrant={[Function]}
2608
- onResponderMove={[Function]}
2609
- onResponderRelease={[Function]}
2610
- onResponderTerminate={[Function]}
2611
- onResponderTerminationRequest={[Function]}
2612
- onStartShouldSetResponder={[Function]}
2613
- style={
2614
- Object {
2615
- "marginLeft": 16,
2616
- "opacity": 1,
2617
- "paddingBottom": 4,
2618
- "paddingLeft": 4,
2619
- "paddingRight": 4,
2620
- "paddingTop": 4,
2621
- }
2622
- }
2623
- >
2624
- <View
2625
- color="black"
2626
- size={14}
2627
- style={
2628
- Array [
2629
- Object {
2630
- "alignSelf": "auto",
2631
- "color": "black",
2632
- "height": 14,
2633
- "width": 14,
2634
- },
2635
- ]
2636
- }
2637
- >
2638
- <svg
2639
- color="black"
2640
- data-file-name="SvgXInline"
2641
- />
2642
- </View>
2643
- </View>
2644
- </View>
2645
- </View>
2646
- <View
2647
- style={
2648
- Array [
2649
- Object {
2650
- "marginBottom": 20,
2651
- },
2652
- ]
2653
- }
2654
- >
2655
- <View
2656
- style={
2657
- Array [
2658
- Object {
2659
- "marginBottom": 10,
2660
- },
2661
- ]
2662
- }
2663
- >
2664
- <Text
2665
- aria-level="3"
2666
- color="black"
2667
- isHeader={true}
2668
- medium="header4"
2669
- style={
2670
- Array [
2671
- Object {
2672
- "color": "#000000",
2673
- "fontFamily": "Moderat-Extended-Bold",
2674
- "fontSize": 24,
2675
- "fontStyle": "normal",
2676
- "fontWeight": "400",
2677
- "lineHeight": 31,
2678
- "textDecorationColor": "#000000",
2679
- },
2680
- ]
2681
- }
2682
- type="header3"
2683
- variant="bold"
2684
- >
2685
- Error
2686
- </Text>
2687
- </View>
2688
- <View
2689
- insets={
2690
- Object {
2691
- "top": 0,
2692
- }
2693
- }
2694
- noRadius={true}
2695
- style={
2696
- Array [
2697
- Object {
2698
- "alignItems": "flex-start",
2699
- "backgroundColor": "#D44148",
2700
- "borderRadius": 0,
2701
- "flexDirection": "row",
2702
- "justifyContent": "space-between",
2703
- "paddingBottom": 16,
2704
- "paddingLeft": 16,
2705
- "paddingRight": 16,
2706
- "paddingTop": 16,
2707
- },
2708
- ]
2709
- }
2710
- type="danger"
2711
- >
2712
- <View
2713
- style={
2714
- Array [
2715
- Object {
2716
- "marginRight": 16,
2717
- },
2718
- ]
2719
- }
2720
- >
2721
- <View
2722
- color="white"
2723
- size={20}
2724
- style={
2725
- Array [
2726
- Object {
2727
- "alignSelf": "auto",
2728
- "color": "white",
2729
- "height": 20,
2730
- "width": 20,
2731
- },
2732
- ]
2733
- }
2734
- >
2735
- <svg
2736
- color="white"
2737
- data-file-name="SvgAlertTriangleInline"
2738
- />
2739
- </View>
2740
- </View>
2741
- <Text
2742
- centeredText={false}
2743
- style={
2744
- Array [
2745
- Object {
2746
- "flexBasis": 0,
2747
- "flexGrow": 1,
2748
- "flexShrink": 1,
2749
- "textAlign": "left",
2750
- },
2751
- ]
2752
- }
2753
- type="danger"
2754
- >
2755
- <Text
2756
- color="white"
2757
- isHeader={false}
2758
- style={
2759
- Array [
2760
- Object {
2761
- "color": "#FFFFFF",
2762
- "fontFamily": "NotoSans",
2763
- "fontSize": 14,
2764
- "fontStyle": "normal",
2765
- "fontWeight": "400",
2766
- "lineHeight": 22,
2767
- "textDecorationColor": "#FFFFFF",
2768
- },
2769
- ]
2770
- }
2771
- type="body-small"
2772
- variant="regular"
2773
- >
2774
- <Text
2775
- isHeader={false}
2776
- style={
2777
- Array [
2778
- Object {
2779
- "fontFamily": "NotoSans-Bold",
2780
- "fontSize": 16,
2781
- "fontStyle": "normal",
2782
- "fontWeight": "700",
2783
- "lineHeight": 26,
2784
- },
2785
- ]
2786
- }
2787
- type="body"
2788
- variant="bold"
2789
- >
2790
- This is a title
2791
-
2792
-
2793
- </Text>
2794
- <Text
2795
- isHeader={false}
2796
- style={
2797
- Array [
2798
- Object {
2799
- "fontFamily": "NotoSans",
2800
- "fontSize": 14,
2801
- "fontStyle": "normal",
2802
- "fontWeight": "400",
2803
- "lineHeight": 22,
2804
- },
2805
- ]
2806
- }
2807
- type="body-small"
2808
- variant="regular"
2809
- >
2810
- Something bad happened !
2811
- </Text>
2812
- </Text>
2813
- </Text>
2814
- <View
2815
- accessible={true}
2816
- focusable={true}
2817
- onClick={[Function]}
2818
- onResponderGrant={[Function]}
2819
- onResponderMove={[Function]}
2820
- onResponderRelease={[Function]}
2821
- onResponderTerminate={[Function]}
2822
- onResponderTerminationRequest={[Function]}
2823
- onStartShouldSetResponder={[Function]}
2824
- style={
2825
- Object {
2826
- "marginLeft": 16,
2827
- "opacity": 1,
2828
- "paddingBottom": 4,
2829
- "paddingLeft": 4,
2830
- "paddingRight": 4,
2831
- "paddingTop": 4,
2832
- }
2833
- }
2834
- >
2835
- <View
2836
- color="white"
2837
- size={14}
2838
- style={
2839
- Array [
2840
- Object {
2841
- "alignSelf": "auto",
2842
- "color": "white",
2843
- "height": 14,
2844
- "width": 14,
2845
- },
2846
- ]
2847
- }
2848
- >
2849
- <svg
2850
- color="white"
2851
- data-file-name="SvgXInline"
2852
- />
2853
- </View>
2854
- </View>
2855
- </View>
2856
- </View>
2857
- </View>
2858
- </View>
2859
- </RCTScrollView>
2860
- </RNCSafeAreaProvider>
2861
- `;