@ornikar/kitt-universal 1.0.0-pre

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 (146) hide show
  1. package/dist/index-browser-all-dev.es.js +1934 -0
  2. package/dist/index-browser-all-dev.es.js.map +1 -0
  3. package/dist/index-browser-all.es.js +1920 -0
  4. package/dist/index-browser-all.es.js.map +1 -0
  5. package/dist/index-node-12.13-dev.cjs.js +2059 -0
  6. package/dist/index-node-12.13-dev.cjs.js.map +1 -0
  7. package/dist/index-node-12.13.cjs.js +2048 -0
  8. package/dist/index-node-12.13.cjs.js.map +1 -0
  9. package/index.js +7 -0
  10. package/package.json +61 -0
  11. package/src/.eslintrc.json +42 -0
  12. package/src/Avatar/Avatar.stories.tsx +47 -0
  13. package/src/Avatar/Avatar.tsx +60 -0
  14. package/src/Avatar/__snapshots__/Avatar.stories.tsx.snap +1229 -0
  15. package/src/Button/Button.stories.tsx +303 -0
  16. package/src/Button/Button.tsx +60 -0
  17. package/src/Button/ButtonContainer.tsx +32 -0
  18. package/src/Button/ButtonContent.tsx +133 -0
  19. package/src/Button/__snapshots__/Button.stories.tsx.snap +7483 -0
  20. package/src/Button/useButton.ts +14 -0
  21. package/src/Card/Card.stories.tsx +33 -0
  22. package/src/Card/Card.tsx +25 -0
  23. package/src/Card/__snapshots__/Card.stories.tsx.snap +306 -0
  24. package/src/FullScreenModal/Body.tsx +25 -0
  25. package/src/FullScreenModal/FullScreenModal.stories.tsx +65 -0
  26. package/src/FullScreenModal/FullScreenModal.tsx +21 -0
  27. package/src/FullScreenModal/Header.tsx +129 -0
  28. package/src/FullScreenModal/__snapshots__/FullScreenModal.stories.tsx.snap +771 -0
  29. package/src/Icon/Icon.stories.tsx +61 -0
  30. package/src/Icon/Icon.tsx +37 -0
  31. package/src/Icon/SpinningIcon.tsx +38 -0
  32. package/src/Icon/SpinningIcon.web.css +13 -0
  33. package/src/Icon/SpinningIcon.web.tsx +11 -0
  34. package/src/Icon/__snapshots__/Icon.stories.tsx.snap +5648 -0
  35. package/src/KittBreakpoints.ts +44 -0
  36. package/src/KittThemeProvider.tsx +30 -0
  37. package/src/ListItem/ListItem.stories.tsx +124 -0
  38. package/src/ListItem/ListItem.tsx +61 -0
  39. package/src/ListItem/ListItemContent.tsx +17 -0
  40. package/src/ListItem/ListItemSideContent.tsx +41 -0
  41. package/src/ListItem/__snapshots__/ListItem.stories.tsx.snap +1514 -0
  42. package/src/Loader/LargeLoader.tsx +12 -0
  43. package/src/Loader/LargeLoader.web.css +103 -0
  44. package/src/Loader/LargeLoader.web.test.tsx +10 -0
  45. package/src/Loader/LargeLoader.web.tsx +18 -0
  46. package/src/Loader/Loader.stories.tsx +49 -0
  47. package/src/Loader/Loader.tsx +21 -0
  48. package/src/Loader/Loader.web.test.tsx +20 -0
  49. package/src/Loader/Loader.web.tsx +14 -0
  50. package/src/Loader/__snapshots__/LargeLoader.web.test.tsx.snap +33 -0
  51. package/src/Loader/__snapshots__/Loader.stories.tsx.snap +607 -0
  52. package/src/Loader/__snapshots__/Loader.web.test.tsx.snap +103 -0
  53. package/src/Message/Message.stories.tsx +104 -0
  54. package/src/Message/Message.tsx +114 -0
  55. package/src/Message/__snapshots__/Message.stories.tsx.snap +2776 -0
  56. package/src/Modal/Body.tsx +20 -0
  57. package/src/Modal/Footer.tsx +18 -0
  58. package/src/Modal/Header.tsx +66 -0
  59. package/src/Modal/Modal.stories.tsx +183 -0
  60. package/src/Modal/Modal.tsx +66 -0
  61. package/src/Modal/OnCloseContext.ts +3 -0
  62. package/src/Modal/__snapshots__/Modal.stories.tsx.snap +2960 -0
  63. package/src/Notification/Notification.stories.tsx +103 -0
  64. package/src/Notification/Notification.tsx +21 -0
  65. package/src/Notification/__snapshots__/Notification.stories.tsx.snap +2861 -0
  66. package/src/Overlay/Overlay.tsx +22 -0
  67. package/src/Tag/Tag.stories.tsx +19 -0
  68. package/src/Tag/Tag.tsx +31 -0
  69. package/src/Tag/__snapshots__/Tag.stories.tsx.snap +303 -0
  70. package/src/Tooltip/Tooltip.tsx +17 -0
  71. package/src/__mocks__/react-native-safe-area-context.tsx +26 -0
  72. package/src/forms/InputFeedback/InputFeedback.stories.tsx +20 -0
  73. package/src/forms/InputFeedback/InputFeedback.tsx +28 -0
  74. package/src/forms/InputFeedback/__snapshots__/InputFeedback.stories.tsx.snap +252 -0
  75. package/src/forms/InputField/InputField.stories.tsx +21 -0
  76. package/src/forms/InputField/InputField.tsx +45 -0
  77. package/src/forms/InputField/__snapshots__/InputField.stories.tsx.snap +240 -0
  78. package/src/forms/InputFormState.ts +1 -0
  79. package/src/forms/InputText/InputText.stories.tsx +87 -0
  80. package/src/forms/InputText/InputText.tsx +172 -0
  81. package/src/forms/InputText/__snapshots__/InputText.stories.tsx.snap +4274 -0
  82. package/src/forms/InputText/useInputText.ts +19 -0
  83. package/src/forms/Label/Label.stories.tsx +16 -0
  84. package/src/forms/Label/Label.tsx +17 -0
  85. package/src/forms/Label/__snapshots__/Label.stories.tsx.snap +174 -0
  86. package/src/forms/Radio/Radio.stories.tsx +50 -0
  87. package/src/forms/Radio/Radio.tsx +81 -0
  88. package/src/forms/Radio/__snapshots__/Radio.stories.tsx.snap +967 -0
  89. package/src/forms/TextArea/TextArea.stories.tsx +74 -0
  90. package/src/forms/TextArea/TextArea.tsx +12 -0
  91. package/src/forms/TextArea/__snapshots__/TextArea.stories.tsx.snap +2091 -0
  92. package/src/index.ts +43 -0
  93. package/src/stories/Block.tsx +24 -0
  94. package/src/stories/Flex.tsx +16 -0
  95. package/src/stories/color-tokens.stories.tsx +143 -0
  96. package/src/stories-list.tsx +22 -0
  97. package/src/story-components/Section.tsx +56 -0
  98. package/src/story-components/Story.tsx +24 -0
  99. package/src/story-components/StoryDecorator.tsx +8 -0
  100. package/src/story-components/StoryGrid.tsx +80 -0
  101. package/src/story-components/StoryTitle.stories.tsx +12 -0
  102. package/src/story-components/StoryTitle.tsx +69 -0
  103. package/src/story-components/__snapshots__/StoryTitle.stories.tsx.snap +155 -0
  104. package/src/story-components/index.ts +13 -0
  105. package/src/themes/default.ts +34 -0
  106. package/src/themes/late-ocean/avatarLateOceanTheme.ts +12 -0
  107. package/src/themes/late-ocean/buttonLateOceanTheme.ts +37 -0
  108. package/src/themes/late-ocean/cardLateOceanTheme.ts +19 -0
  109. package/src/themes/late-ocean/colorsLateOceanTheme.ts +19 -0
  110. package/src/themes/late-ocean/feedbackMessageLateOceanTheme.ts +10 -0
  111. package/src/themes/late-ocean/formLateOceanTheme.ts +9 -0
  112. package/src/themes/late-ocean/fullScreenModalLateOceanTheme.ts +8 -0
  113. package/src/themes/late-ocean/inputFieldLateOceanTheme.ts +4 -0
  114. package/src/themes/late-ocean/inputLateOceanTheme.ts +55 -0
  115. package/src/themes/late-ocean/listItemLateOceanTheme.ts +8 -0
  116. package/src/themes/late-ocean/radioLateOceanTheme.ts +19 -0
  117. package/src/themes/late-ocean/shadowsLateOceanTheme.ts +3 -0
  118. package/src/themes/late-ocean/tagLateOceanTheme.ts +17 -0
  119. package/src/themes/late-ocean/typographyLateOceanTheme.ts +94 -0
  120. package/src/themes/palettes/lateOceanColorPalette.ts +24 -0
  121. package/src/typings/babel-config.d.ts +6 -0
  122. package/src/typings/metro.d.ts +6 -0
  123. package/src/typography/Typography.stories.tsx +115 -0
  124. package/src/typography/Typography.tsx +165 -0
  125. package/src/typography/TypographyIcon.stories.tsx +32 -0
  126. package/src/typography/TypographyIcon.tsx +35 -0
  127. package/src/typography/TypographyLink.stories.tsx +89 -0
  128. package/src/typography/TypographyLink.tsx +48 -0
  129. package/src/typography/__snapshots__/Typography.stories.tsx.snap +6118 -0
  130. package/src/typography/__snapshots__/TypographyIcon.stories.tsx.snap +334 -0
  131. package/src/typography/__snapshots__/TypographyLink.stories.tsx.snap +10945 -0
  132. package/src/utils/storybook/decorators/KittThemeDecorator.tsx +11 -0
  133. package/src/utils/storybook/decorators/SafeAreaProviderDecorator.tsx +11 -0
  134. package/src/utils/storybook/setup-global-decorators.ts +6 -0
  135. package/src/utils/tests/renderWithProvidersUtils.tsx +17 -0
  136. package/src/utils/typeUtils.ts +6 -0
  137. package/src/utils/windowSize/MatchWindowSize.tsx +14 -0
  138. package/src/utils/windowSize/__snapshots__/windowSize.stories.tsx.snap +1485 -0
  139. package/src/utils/windowSize/createWindowSizeHelper.test.ts +11 -0
  140. package/src/utils/windowSize/createWindowSizeHelper.ts +65 -0
  141. package/src/utils/windowSize/useMatchWindowSize.ts +14 -0
  142. package/src/utils/windowSize/useWindowSize.ts +1 -0
  143. package/src/utils/windowSize/windowSize.stories.tsx +116 -0
  144. package/tsconfig.build.json +30 -0
  145. package/tsconfig.json +13 -0
  146. package/yarn-error.log +22274 -0
package/src/FullScreenModal/__snapshots__/FullScreenModal.stories.tsx.snap ADDED
@@ -0,0 +1,771 @@
1
+ // Jest Snapshot v1, https://goo.gl/fbAQLP
2
+
3
+ exports[`kitt/FullScreenModal Full Screen Modal 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
+ Default
58
+ </Text>
59
+ </View>
60
+ <View
61
+ style={
62
+ Array [
63
+ Object {
64
+ "backgroundColor": "#F9F9F9",
65
+ "flexBasis": 0,
66
+ "flexGrow": 1,
67
+ "flexShrink": 1,
68
+ },
69
+ ]
70
+ }
71
+ >
72
+ <View
73
+ style={
74
+ Array [
75
+ Object {
76
+ "alignItems": "center",
77
+ "borderBottomColor": "#E5E5E5",
78
+ "borderBottomWidth": 1,
79
+ "flexDirection": "row",
80
+ "paddingBottom": 11,
81
+ "paddingLeft": 11,
82
+ "paddingRight": 11,
83
+ "paddingTop": 11,
84
+ },
85
+ ]
86
+ }
87
+ >
88
+ <View
89
+ leftWidth={0}
90
+ rightWidth={0}
91
+ style={
92
+ Array [
93
+ Object {
94
+ "alignItems": "center",
95
+ "justifyContent": "center",
96
+ "marginLeft": 0,
97
+ "width": 298,
98
+ },
99
+ ]
100
+ }
101
+ windowWidth={320}
102
+ >
103
+ <Text
104
+ color="black"
105
+ isHeader={false}
106
+ style={
107
+ Array [
108
+ Object {
109
+ "color": "#000000",
110
+ "fontFamily": "NotoSans-Bold",
111
+ "fontSize": 18,
112
+ "fontStyle": "normal",
113
+ "fontWeight": "700",
114
+ "lineHeight": 29,
115
+ "textDecorationColor": "#000000",
116
+ },
117
+ ]
118
+ }
119
+ type="body-large"
120
+ variant="bold"
121
+ >
122
+ Title
123
+ </Text>
124
+ </View>
125
+ <View
126
+ onLayout={[Function]}
127
+ side="right"
128
+ style={
129
+ Array [
130
+ Object {
131
+ "paddingLeft": 8,
132
+ },
133
+ ]
134
+ }
135
+ >
136
+ <View
137
+ accessibilityRole="button"
138
+ accessible={true}
139
+ collapsable={false}
140
+ focusable={true}
141
+ isPressed={false}
142
+ onBlur={[Function]}
143
+ onClick={[Function]}
144
+ onFocus={[Function]}
145
+ onResponderGrant={[Function]}
146
+ onResponderMove={[Function]}
147
+ onResponderRelease={[Function]}
148
+ onResponderTerminate={[Function]}
149
+ onResponderTerminationRequest={[Function]}
150
+ onStartShouldSetResponder={[Function]}
151
+ style={
152
+ Array [
153
+ Object {
154
+ "alignSelf": "flex-start",
155
+ "backgroundColor": "transparent",
156
+ "borderColor": "transparent",
157
+ "borderRadius": 30,
158
+ "borderWidth": 2,
159
+ "flexDirection": "row",
160
+ "maxWidth": 335,
161
+ "minHeight": 42,
162
+ "minWidth": 40,
163
+ "paddingBottom": 8,
164
+ "paddingLeft": 16,
165
+ "paddingRight": 16,
166
+ "paddingTop": 8,
167
+ "width": "auto",
168
+ },
169
+ ]
170
+ }
171
+ type="subtle"
172
+ >
173
+ <View
174
+ style={
175
+ Array [
176
+ Object {
177
+ "alignItems": "center",
178
+ "flexBasis": "auto",
179
+ "flexDirection": "row",
180
+ "flexGrow": 0,
181
+ "flexShrink": 1,
182
+ "justifyContent": "center",
183
+ },
184
+ ]
185
+ }
186
+ >
187
+ <Text
188
+ color="primary"
189
+ isHeader={false}
190
+ style={
191
+ Array [
192
+ Object {
193
+ "color": "#4C34E0",
194
+ "fontFamily": "NotoSans-Bold",
195
+ "fontSize": 16,
196
+ "fontStyle": "normal",
197
+ "fontWeight": "700",
198
+ "lineHeight": 26,
199
+ "textDecorationColor": "#4C34E0",
200
+ },
201
+ Object {
202
+ "textAlign": "center",
203
+ },
204
+ ]
205
+ }
206
+ type="body"
207
+ variant="bold"
208
+ >
209
+ <Text
210
+ isHeader={false}
211
+ style={
212
+ Array [
213
+ Object {
214
+ "fontFamily": "NotoSans-Bold",
215
+ "fontSize": 18,
216
+ "fontStyle": "normal",
217
+ "fontWeight": "700",
218
+ "lineHeight": 29,
219
+ },
220
+ ]
221
+ }
222
+ type="body-large"
223
+ variant="bold"
224
+ >
225
+ Ok
226
+ </Text>
227
+ </Text>
228
+ </View>
229
+ </View>
230
+ </View>
231
+ </View>
232
+ <View
233
+ style={
234
+ Array [
235
+ Object {
236
+ "backgroundColor": "#FFFFFF",
237
+ "flexBasis": 0,
238
+ "flexGrow": 1,
239
+ "flexShrink": 1,
240
+ "paddingLeft": 24,
241
+ "paddingRight": 24,
242
+ },
243
+ ]
244
+ }
245
+ >
246
+ <Text
247
+ color="black"
248
+ isHeader={false}
249
+ style={
250
+ Array [
251
+ Object {
252
+ "color": "#000000",
253
+ "fontFamily": "NotoSans",
254
+ "fontSize": 16,
255
+ "fontStyle": "normal",
256
+ "fontWeight": "400",
257
+ "lineHeight": 26,
258
+ "textDecorationColor": "#000000",
259
+ },
260
+ ]
261
+ }
262
+ type="body"
263
+ variant="regular"
264
+ >
265
+ Content
266
+ </Text>
267
+ </View>
268
+ </View>
269
+ </View>
270
+ </RCTScrollView>
271
+ </RNCSafeAreaProvider>
272
+ `;
273
+
274
+ exports[`kitt/FullScreenModal Left and Right Header Actions 1`] = `
275
+ <RNCSafeAreaProvider
276
+ onInsetsChange={[Function]}
277
+ style={
278
+ Array [
279
+ Object {
280
+ "flex": 1,
281
+ },
282
+ undefined,
283
+ ]
284
+ }
285
+ >
286
+ <RCTScrollView
287
+ style={
288
+ Array [
289
+ Object {
290
+ "paddingBottom": 10,
291
+ "paddingLeft": 10,
292
+ "paddingRight": 10,
293
+ "paddingTop": 10,
294
+ },
295
+ ]
296
+ }
297
+ >
298
+ <View>
299
+ <View
300
+ style={
301
+ Array [
302
+ Object {
303
+ "marginBottom": 30,
304
+ },
305
+ ]
306
+ }
307
+ >
308
+ <Text
309
+ aria-level="1"
310
+ color="black"
311
+ isHeader={true}
312
+ style={
313
+ Array [
314
+ Object {
315
+ "color": "#000000",
316
+ "fontFamily": "Moderat-Extended-Bold",
317
+ "fontSize": 38,
318
+ "fontStyle": "normal",
319
+ "fontWeight": "400",
320
+ "lineHeight": 49,
321
+ "textDecorationColor": "#000000",
322
+ },
323
+ ]
324
+ }
325
+ type="header1"
326
+ variant="bold"
327
+ >
328
+ Left and Right action
329
+ </Text>
330
+ </View>
331
+ <View
332
+ style={
333
+ Array [
334
+ Object {
335
+ "backgroundColor": "#F9F9F9",
336
+ "flexBasis": 0,
337
+ "flexGrow": 1,
338
+ "flexShrink": 1,
339
+ },
340
+ ]
341
+ }
342
+ >
343
+ <View
344
+ style={
345
+ Array [
346
+ Object {
347
+ "alignItems": "center",
348
+ "borderBottomColor": "#E5E5E5",
349
+ "borderBottomWidth": 1,
350
+ "flexDirection": "row",
351
+ "paddingBottom": 11,
352
+ "paddingLeft": 11,
353
+ "paddingRight": 11,
354
+ "paddingTop": 11,
355
+ },
356
+ ]
357
+ }
358
+ >
359
+ <View
360
+ onLayout={[Function]}
361
+ style={
362
+ Array [
363
+ Object {
364
+ "paddingRight": 8,
365
+ },
366
+ ]
367
+ }
368
+ >
369
+ <View
370
+ accessibilityRole="button"
371
+ accessible={true}
372
+ collapsable={false}
373
+ focusable={true}
374
+ isPressed={false}
375
+ onBlur={[Function]}
376
+ onClick={[Function]}
377
+ onFocus={[Function]}
378
+ onResponderGrant={[Function]}
379
+ onResponderMove={[Function]}
380
+ onResponderRelease={[Function]}
381
+ onResponderTerminate={[Function]}
382
+ onResponderTerminationRequest={[Function]}
383
+ onStartShouldSetResponder={[Function]}
384
+ style={
385
+ Array [
386
+ Object {
387
+ "alignSelf": "flex-start",
388
+ "backgroundColor": "transparent",
389
+ "borderColor": "transparent",
390
+ "borderRadius": 30,
391
+ "borderWidth": 2,
392
+ "flexDirection": "row",
393
+ "maxWidth": 335,
394
+ "minHeight": 42,
395
+ "minWidth": 40,
396
+ "paddingBottom": 8,
397
+ "paddingLeft": 16,
398
+ "paddingRight": 16,
399
+ "paddingTop": 8,
400
+ "width": "auto",
401
+ },
402
+ ]
403
+ }
404
+ type="subtle"
405
+ >
406
+ <View
407
+ iconOnly={true}
408
+ style={
409
+ Array [
410
+ Object {
411
+ "alignItems": "center",
412
+ "flexBasis": "auto",
413
+ "flexDirection": "row",
414
+ "flexGrow": 1,
415
+ "flexShrink": 1,
416
+ "justifyContent": "center",
417
+ },
418
+ ]
419
+ }
420
+ >
421
+ <View
422
+ color="#4C34E0"
423
+ size={18}
424
+ style={
425
+ Array [
426
+ Object {
427
+ "alignSelf": "auto",
428
+ "color": "#4C34E0",
429
+ "height": 18,
430
+ "width": 18,
431
+ },
432
+ ]
433
+ }
434
+ >
435
+ <svg
436
+ color="#4C34E0"
437
+ data-file-name="SvgArrowLeftInline"
438
+ />
439
+ </View>
440
+ </View>
441
+ </View>
442
+ </View>
443
+ <View
444
+ leftWidth={0}
445
+ rightWidth={0}
446
+ style={
447
+ Array [
448
+ Object {
449
+ "alignItems": "center",
450
+ "justifyContent": "center",
451
+ "marginLeft": 0,
452
+ "width": 298,
453
+ },
454
+ ]
455
+ }
456
+ windowWidth={320}
457
+ >
458
+ <Text
459
+ color="black"
460
+ isHeader={false}
461
+ style={
462
+ Array [
463
+ Object {
464
+ "color": "#000000",
465
+ "fontFamily": "NotoSans-Bold",
466
+ "fontSize": 18,
467
+ "fontStyle": "normal",
468
+ "fontWeight": "700",
469
+ "lineHeight": 29,
470
+ "textDecorationColor": "#000000",
471
+ },
472
+ ]
473
+ }
474
+ type="body-large"
475
+ variant="bold"
476
+ >
477
+ Title
478
+ </Text>
479
+ </View>
480
+ <View
481
+ onLayout={[Function]}
482
+ side="right"
483
+ style={
484
+ Array [
485
+ Object {
486
+ "paddingLeft": 8,
487
+ },
488
+ ]
489
+ }
490
+ >
491
+ <View
492
+ accessibilityRole="button"
493
+ accessible={true}
494
+ collapsable={false}
495
+ focusable={true}
496
+ isPressed={false}
497
+ onBlur={[Function]}
498
+ onClick={[Function]}
499
+ onFocus={[Function]}
500
+ onResponderGrant={[Function]}
501
+ onResponderMove={[Function]}
502
+ onResponderRelease={[Function]}
503
+ onResponderTerminate={[Function]}
504
+ onResponderTerminationRequest={[Function]}
505
+ onStartShouldSetResponder={[Function]}
506
+ style={
507
+ Array [
508
+ Object {
509
+ "alignSelf": "flex-start",
510
+ "backgroundColor": "transparent",
511
+ "borderColor": "transparent",
512
+ "borderRadius": 30,
513
+ "borderWidth": 2,
514
+ "flexDirection": "row",
515
+ "maxWidth": 335,
516
+ "minHeight": 42,
517
+ "minWidth": 40,
518
+ "paddingBottom": 8,
519
+ "paddingLeft": 16,
520
+ "paddingRight": 16,
521
+ "paddingTop": 8,
522
+ "width": "auto",
523
+ },
524
+ ]
525
+ }
526
+ type="subtle"
527
+ >
528
+ <View
529
+ iconOnly={true}
530
+ style={
531
+ Array [
532
+ Object {
533
+ "alignItems": "center",
534
+ "flexBasis": "auto",
535
+ "flexDirection": "row",
536
+ "flexGrow": 1,
537
+ "flexShrink": 1,
538
+ "justifyContent": "center",
539
+ },
540
+ ]
541
+ }
542
+ >
543
+ <View
544
+ color="#4C34E0"
545
+ size={18}
546
+ style={
547
+ Array [
548
+ Object {
549
+ "alignSelf": "auto",
550
+ "color": "#4C34E0",
551
+ "height": 18,
552
+ "width": 18,
553
+ },
554
+ ]
555
+ }
556
+ >
557
+ <svg
558
+ color="#4C34E0"
559
+ data-file-name="SvgXInline"
560
+ />
561
+ </View>
562
+ </View>
563
+ </View>
564
+ </View>
565
+ </View>
566
+ <View
567
+ style={
568
+ Array [
569
+ Object {
570
+ "backgroundColor": "#FFFFFF",
571
+ "flexBasis": 0,
572
+ "flexGrow": 1,
573
+ "flexShrink": 1,
574
+ "paddingLeft": 24,
575
+ "paddingRight": 24,
576
+ },
577
+ ]
578
+ }
579
+ >
580
+ <Text
581
+ color="black"
582
+ isHeader={false}
583
+ style={
584
+ Array [
585
+ Object {
586
+ "color": "#000000",
587
+ "fontFamily": "NotoSans",
588
+ "fontSize": 16,
589
+ "fontStyle": "normal",
590
+ "fontWeight": "400",
591
+ "lineHeight": 26,
592
+ "textDecorationColor": "#000000",
593
+ },
594
+ ]
595
+ }
596
+ type="body"
597
+ variant="regular"
598
+ >
599
+ Content
600
+ </Text>
601
+ </View>
602
+ </View>
603
+ </View>
604
+ </RCTScrollView>
605
+ </RNCSafeAreaProvider>
606
+ `;
607
+
608
+ exports[`kitt/FullScreenModal No Header Actions 1`] = `
609
+ <RNCSafeAreaProvider
610
+ onInsetsChange={[Function]}
611
+ style={
612
+ Array [
613
+ Object {
614
+ "flex": 1,
615
+ },
616
+ undefined,
617
+ ]
618
+ }
619
+ >
620
+ <RCTScrollView
621
+ style={
622
+ Array [
623
+ Object {
624
+ "paddingBottom": 10,
625
+ "paddingLeft": 10,
626
+ "paddingRight": 10,
627
+ "paddingTop": 10,
628
+ },
629
+ ]
630
+ }
631
+ >
632
+ <View>
633
+ <View
634
+ style={
635
+ Array [
636
+ Object {
637
+ "marginBottom": 30,
638
+ },
639
+ ]
640
+ }
641
+ >
642
+ <Text
643
+ aria-level="1"
644
+ color="black"
645
+ isHeader={true}
646
+ style={
647
+ Array [
648
+ Object {
649
+ "color": "#000000",
650
+ "fontFamily": "Moderat-Extended-Bold",
651
+ "fontSize": 38,
652
+ "fontStyle": "normal",
653
+ "fontWeight": "400",
654
+ "lineHeight": 49,
655
+ "textDecorationColor": "#000000",
656
+ },
657
+ ]
658
+ }
659
+ type="header1"
660
+ variant="bold"
661
+ >
662
+ No Header Actions
663
+ </Text>
664
+ </View>
665
+ <View
666
+ style={
667
+ Array [
668
+ Object {
669
+ "backgroundColor": "#F9F9F9",
670
+ "flexBasis": 0,
671
+ "flexGrow": 1,
672
+ "flexShrink": 1,
673
+ },
674
+ ]
675
+ }
676
+ >
677
+ <View
678
+ style={
679
+ Array [
680
+ Object {
681
+ "alignItems": "center",
682
+ "borderBottomColor": "#E5E5E5",
683
+ "borderBottomWidth": 1,
684
+ "flexDirection": "row",
685
+ "paddingBottom": 11,
686
+ "paddingLeft": 11,
687
+ "paddingRight": 11,
688
+ "paddingTop": 11,
689
+ },
690
+ ]
691
+ }
692
+ >
693
+ <View
694
+ leftWidth={0}
695
+ rightWidth={0}
696
+ style={
697
+ Array [
698
+ Object {
699
+ "alignItems": "center",
700
+ "justifyContent": "center",
701
+ "marginLeft": 0,
702
+ "width": 298,
703
+ },
704
+ ]
705
+ }
706
+ windowWidth={320}
707
+ >
708
+ <Text
709
+ color="black"
710
+ isHeader={false}
711
+ style={
712
+ Array [
713
+ Object {
714
+ "color": "#000000",
715
+ "fontFamily": "NotoSans-Bold",
716
+ "fontSize": 18,
717
+ "fontStyle": "normal",
718
+ "fontWeight": "700",
719
+ "lineHeight": 29,
720
+ "textDecorationColor": "#000000",
721
+ },
722
+ ]
723
+ }
724
+ type="body-large"
725
+ variant="bold"
726
+ >
727
+ Title
728
+ </Text>
729
+ </View>
730
+ </View>
731
+ <View
732
+ style={
733
+ Array [
734
+ Object {
735
+ "backgroundColor": "#FFFFFF",
736
+ "flexBasis": 0,
737
+ "flexGrow": 1,
738
+ "flexShrink": 1,
739
+ "paddingLeft": 24,
740
+ "paddingRight": 24,
741
+ },
742
+ ]
743
+ }
744
+ >
745
+ <Text
746
+ color="black"
747
+ isHeader={false}
748
+ style={
749
+ Array [
750
+ Object {
751
+ "color": "#000000",
752
+ "fontFamily": "NotoSans",
753
+ "fontSize": 16,
754
+ "fontStyle": "normal",
755
+ "fontWeight": "400",
756
+ "lineHeight": 26,
757
+ "textDecorationColor": "#000000",
758
+ },
759
+ ]
760
+ }
761
+ type="body"
762
+ variant="regular"
763
+ >
764
+ Content
765
+ </Text>
766
+ </View>
767
+ </View>
768
+ </View>
769
+ </RCTScrollView>
770
+ </RNCSafeAreaProvider>
771
+ `;