@ornikar/bumper 2.7.2-canary.1768566928.e85c568dc49c9180e37b7aec8792b1e8d45968a6.0 → 2.8.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (93) hide show
  1. package/CHANGELOG.md +4 -4
  2. package/CLAUDE.md +45 -0
  3. package/dist/definitions/system/core/breakpoints/hooks/useCurrentBreakpointName.d.ts +1 -1
  4. package/dist/definitions/system/core/breakpoints/hooks/useCurrentBreakpointName.d.ts.map +1 -1
  5. package/dist/definitions/system/core/breakpoints/utils/breakpointsUtils.d.ts +1 -1
  6. package/dist/definitions/system/core/breakpoints/utils/breakpointsUtils.d.ts.map +1 -1
  7. package/dist/definitions/system/core/primitives/Pressable.d.ts +0 -9
  8. package/dist/definitions/system/core/primitives/Pressable.d.ts.map +1 -1
  9. package/dist/definitions/system/core/{breakpoints/constants.d.ts → tokens/breakpoints.d.ts} +1 -1
  10. package/dist/definitions/system/core/tokens/breakpoints.d.ts.map +1 -0
  11. package/dist/definitions/tamagui.config.d.ts +2 -28
  12. package/dist/definitions/tamagui.config.d.ts.map +1 -1
  13. package/dist/index-metro.es.android.js +42 -26
  14. package/dist/index-metro.es.android.js.map +1 -1
  15. package/dist/index-metro.es.ios.js +42 -26
  16. package/dist/index-metro.es.ios.js.map +1 -1
  17. package/dist/index-node-22.22.cjs.js +42 -26
  18. package/dist/index-node-22.22.cjs.js.map +1 -1
  19. package/dist/index-node-22.22.cjs.web.js +42 -26
  20. package/dist/index-node-22.22.cjs.web.js.map +1 -1
  21. package/dist/index-node-22.22.es.mjs +42 -26
  22. package/dist/index-node-22.22.es.mjs.map +1 -1
  23. package/dist/index-node-22.22.es.web.mjs +42 -26
  24. package/dist/index-node-22.22.es.web.mjs.map +1 -1
  25. package/dist/index.es.js +36 -20
  26. package/dist/index.es.js.map +1 -1
  27. package/dist/index.es.web.js +36 -20
  28. package/dist/index.es.web.js.map +1 -1
  29. package/dist/tsbuildinfo +1 -1
  30. package/package.json +9 -9
  31. package/src/system/content/typography/Typography.features.stories.tsx +156 -0
  32. package/src/system/content/typography/Typography.stories.tsx +72 -166
  33. package/src/system/content/typography/__snapshots__/Typography.features.stories.tsx.snap +826 -0
  34. package/src/system/content/typography/__snapshots__/Typography.stories.tsx.snap +10 -1990
  35. package/src/system/content/typography/__snapshots_web__/Typography.features.stories.tsx.snap +501 -0
  36. package/src/system/content/typography/__snapshots_web__/Typography.stories.tsx.snap +7 -808
  37. package/src/system/core/breakpoints/hooks/useBreakpointValue.test.ts +1 -1
  38. package/src/system/core/breakpoints/hooks/useCurrentBreakpointName.test.ts +1 -1
  39. package/src/system/core/breakpoints/hooks/useCurrentBreakpointName.ts +1 -1
  40. package/src/system/core/breakpoints/utils/breakpointsUtils.test.ts +1 -1
  41. package/src/system/core/breakpoints/utils/breakpointsUtils.ts +1 -1
  42. package/src/system/core/primitives/Center.features.stories.tsx +63 -0
  43. package/src/system/core/primitives/Center.stories.tsx +111 -12
  44. package/src/system/core/primitives/Pressable.features.stories.tsx +171 -0
  45. package/src/system/core/primitives/Pressable.stories.tsx +82 -20
  46. package/src/system/core/primitives/Pressable.tsx +0 -9
  47. package/src/system/core/primitives/Stack.features.stories.tsx +179 -0
  48. package/src/system/core/primitives/Stack.stories.tsx +74 -44
  49. package/src/system/core/primitives/View.features.stories.tsx +452 -0
  50. package/src/system/core/primitives/View.stories.tsx +122 -9
  51. package/src/system/core/primitives/__snapshots__/Center.features.stories.tsx.snap +208 -0
  52. package/src/system/core/primitives/__snapshots__/Center.stories.tsx.snap +13 -8
  53. package/src/system/core/primitives/__snapshots__/Pressable.features.stories.tsx.snap +470 -0
  54. package/src/system/core/primitives/__snapshots__/Pressable.stories.tsx.snap +11 -10
  55. package/src/system/core/primitives/__snapshots__/Stack.features.stories.tsx.snap +1234 -0
  56. package/src/system/core/primitives/__snapshots__/Stack.stories.tsx.snap +63 -84
  57. package/src/system/core/primitives/__snapshots__/View.features.stories.tsx.snap +2338 -0
  58. package/src/system/core/primitives/__snapshots__/View.stories.tsx.snap +6 -4
  59. package/src/system/core/primitives/__snapshots_web__/Center.features.stories.tsx.snap +107 -0
  60. package/src/system/core/primitives/__snapshots_web__/Center.stories.tsx.snap +9 -6
  61. package/src/system/core/primitives/__snapshots_web__/Pressable.features.stories.tsx.snap +193 -0
  62. package/src/system/core/primitives/__snapshots_web__/Pressable.stories.tsx.snap +5 -5
  63. package/src/system/core/primitives/__snapshots_web__/Stack.features.stories.tsx.snap +515 -0
  64. package/src/system/core/primitives/__snapshots_web__/Stack.stories.tsx.snap +30 -22
  65. package/src/system/core/primitives/__snapshots_web__/View.features.stories.tsx.snap +941 -0
  66. package/src/system/core/primitives/__snapshots_web__/View.stories.tsx.snap +3 -3
  67. package/src/system/core/themes/__snapshots__/light.stories.tsx.snap +3822 -2233
  68. package/src/system/core/themes/__snapshots_web__/light.stories.tsx.snap +1244 -992
  69. package/src/system/core/themes/light.stories.tsx +61 -28
  70. package/src/system/core/tokens/__snapshots__/breakpoints.stories.tsx.snap +423 -0
  71. package/src/system/core/tokens/__snapshots__/fonts.stories.tsx.snap +1635 -0
  72. package/src/system/core/tokens/__snapshots__/radius.stories.tsx.snap +383 -0
  73. package/src/system/core/tokens/__snapshots__/size.stories.tsx.snap +864 -0
  74. package/src/system/core/tokens/__snapshots__/space.stories.tsx.snap +945 -0
  75. package/src/system/core/tokens/__snapshots_web__/breakpoints.stories.tsx.snap +194 -0
  76. package/src/system/core/tokens/__snapshots_web__/fonts.stories.tsx.snap +729 -0
  77. package/src/system/core/tokens/__snapshots_web__/radius.stories.tsx.snap +174 -0
  78. package/src/system/core/tokens/__snapshots_web__/size.stories.tsx.snap +363 -0
  79. package/src/system/core/tokens/__snapshots_web__/space.stories.tsx.snap +396 -0
  80. package/src/system/core/tokens/breakpoints.stories.tsx +46 -0
  81. package/src/system/core/tokens/fonts.stories.tsx +39 -0
  82. package/src/system/core/tokens/palettes/__snapshots__/deepPurpleColorPalette.stories.tsx.snap +4337 -2747
  83. package/src/system/core/tokens/palettes/__snapshots_web__/deepPurpleColorPalette.stories.tsx.snap +1525 -1257
  84. package/src/system/core/tokens/palettes/deepPurpleColorPalette.stories.tsx +42 -28
  85. package/src/system/core/tokens/radius.stories.tsx +39 -0
  86. package/src/system/core/tokens/size.stories.tsx +39 -0
  87. package/src/system/core/tokens/space.stories.tsx +40 -0
  88. package/src/tamagui.config.ts +3 -3
  89. package/dist/definitions/system/core/breakpoints/constants.d.ts.map +0 -1
  90. package/src/system/core/breakpoints/__snapshots__/breakpoints.stories.tsx.snap +0 -49
  91. package/src/system/core/breakpoints/__snapshots_web__/breakpoints.stories.tsx.snap +0 -43
  92. package/src/system/core/breakpoints/breakpoints.stories.tsx +0 -45
  93. /package/src/system/core/{breakpoints/constants.ts → tokens/breakpoints.ts} +0 -0
package/src/system/content/typography/__snapshots__/Typography.stories.tsx.snap CHANGED
@@ -1,6 +1,6 @@
1
1
  // Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
2
2
 
3
- exports[`bumper/Typography/Typography Typography 1`] = `
3
+ exports[`Bumper/Content/Typography Default 1`] = `
4
4
  <RNCSafeAreaProvider
5
5
  onInsetsChange={[Function]}
6
6
  style={
@@ -12,1999 +12,19 @@ exports[`bumper/Typography/Typography Typography 1`] = `
12
12
  ]
13
13
  }
14
14
  >
15
- <View
15
+ <Text
16
16
  style={
17
17
  {
18
- "flexDirection": "column",
19
- "paddingBottom": 12,
20
- "paddingLeft": 4,
21
- "paddingRight": 4,
22
- "paddingTop": 4,
18
+ "color": "#101010",
19
+ "fontFamily": "GTStandardRegular",
20
+ "fontSize": 16,
21
+ "letterSpacing": 0.3,
22
+ "lineHeight": 24,
23
23
  }
24
24
  }
25
+ suppressHighlighting={true}
25
26
  >
26
- <Text
27
- style={
28
- {
29
- "fontFamily": "GTStandardSemibold",
30
- "fontSize": "$heading-l",
31
- "letterSpacing": 0,
32
- "lineHeight": 44,
33
- "marginBottom": 4,
34
- }
35
- }
36
- suppressHighlighting={true}
37
- >
38
- Demo
39
- </Text>
40
- <Text
41
- style={
42
- {
43
- "color": "#101010",
44
- "fontFamily": "GTStandardRegular",
45
- "fontSize": "$body-m",
46
- "letterSpacing": 0.3,
47
- "lineHeight": 24,
48
- }
49
- }
50
- suppressHighlighting={true}
51
- >
52
- Hello World
53
- </Text>
54
- </View>
55
- <View
56
- style={
57
- {
58
- "flexDirection": "column",
59
- "paddingBottom": 4,
60
- "paddingLeft": 4,
61
- "paddingRight": 4,
62
- "paddingTop": 4,
63
- }
64
- }
65
- >
66
- <Text
67
- style={
68
- {
69
- "fontFamily": "GTStandardSemibold",
70
- "fontSize": "$heading-l",
71
- "letterSpacing": 0,
72
- "lineHeight": 44,
73
- "marginBottom": 4,
74
- }
75
- }
76
- suppressHighlighting={true}
77
- >
78
- Inheritance
79
- </Text>
80
- <View
81
- style={
82
- {
83
- "flexDirection": "column",
84
- "paddingBottom": 4,
85
- "paddingLeft": 4,
86
- "paddingRight": 4,
87
- "paddingTop": 4,
88
- }
89
- }
90
- >
91
- <Text
92
- style={
93
- {
94
- "fontFamily": "GTStandardSemibold",
95
- "fontSize": "$heading-m",
96
- "letterSpacing": 0,
97
- "lineHeight": 32,
98
- "marginBottom": 4,
99
- }
100
- }
101
- suppressHighlighting={true}
102
- >
103
- Type inheritance
104
- </Text>
105
- <Text
106
- style={
107
- {
108
- "fontFamily": "GTStandard",
109
- "fontSize": "$body-l",
110
- "letterSpacing": 0.3,
111
- "lineHeight": 26,
112
- }
113
- }
114
- suppressHighlighting={true}
115
- >
116
- Type is body-l
117
-
118
- <Text
119
- style={
120
- {
121
- "fontFamily": "GTStandardSemibold",
122
- "fontSize": "$heading-l",
123
- "letterSpacing": 0,
124
- "lineHeight": 44,
125
- }
126
- }
127
- suppressHighlighting={true}
128
- >
129
- type is heading-l
130
- <Text
131
- style={
132
- {
133
- "color": "#563B56",
134
- "fontFamily": "GTStandardSemibold",
135
- "fontSize": "$heading-l",
136
- "letterSpacing": 0,
137
- "lineHeight": 44,
138
- }
139
- }
140
- suppressHighlighting={true}
141
- >
142
- type is undefined
143
- </Text>
144
- </Text>
145
-
146
- <Text
147
- style={
148
- {
149
- "color": "#BD100F",
150
- "fontFamily": "GTStandard",
151
- "fontSize": "$body-l",
152
- "letterSpacing": 0.3,
153
- "lineHeight": 26,
154
- }
155
- }
156
- suppressHighlighting={true}
157
- >
158
- type is undefined
159
- <Text
160
- style={
161
- {
162
- "color": "#BD100F",
163
- "fontFamily": "GTStandard",
164
- "fontSize": "$body-s",
165
- "letterSpacing": 0.3,
166
- "lineHeight": 20,
167
- }
168
- }
169
- suppressHighlighting={true}
170
- >
171
- Type is body-s
172
- </Text>
173
- </Text>
174
- .
175
- </Text>
176
- </View>
177
- <View
178
- style={
179
- {
180
- "flexDirection": "column",
181
- "paddingBottom": 4,
182
- "paddingLeft": 4,
183
- "paddingRight": 4,
184
- "paddingTop": 4,
185
- }
186
- }
187
- >
188
- <Text
189
- style={
190
- {
191
- "fontFamily": "GTStandardSemibold",
192
- "fontSize": "$heading-m",
193
- "letterSpacing": 0,
194
- "lineHeight": 32,
195
- "marginBottom": 4,
196
- }
197
- }
198
- suppressHighlighting={true}
199
- >
200
- Weight inheritance
201
- </Text>
202
- <Text
203
- style={
204
- {
205
- "fontFamily": "GTStandard",
206
- }
207
- }
208
- suppressHighlighting={true}
209
- >
210
- weight is undefined
211
-
212
- <Text
213
- style={
214
- {
215
- "fontFamily": "GTStandardBold",
216
- }
217
- }
218
- suppressHighlighting={true}
219
- >
220
- weight is bold
221
-
222
- <Text
223
- style={
224
- {
225
- "fontFamily": "GTStandardSemibold",
226
- "fontSize": "$heading-m",
227
- "letterSpacing": 0,
228
- "lineHeight": 32,
229
- }
230
- }
231
- suppressHighlighting={true}
232
- >
233
- weight is undefined and type is heading-m
234
-
235
- <Text
236
- style={
237
- {
238
- "fontFamily": "GTStandardRegular",
239
- "fontSize": "$body-m",
240
- "letterSpacing": 0.3,
241
- "lineHeight": 24,
242
- }
243
- }
244
- suppressHighlighting={true}
245
- >
246
- weight is regular
247
- <Text
248
- style={
249
- {
250
- "fontFamily": "GTStandardBold",
251
- "fontSize": "$body-m",
252
- "letterSpacing": 0.3,
253
- "lineHeight": 24,
254
- }
255
- }
256
- suppressHighlighting={true}
257
- >
258
- weight is bold
259
- </Text>
260
- </Text>
261
- </Text>
262
- </Text>
263
-
264
- </Text>
265
- </View>
266
- <View
267
- style={
268
- {
269
- "flexDirection": "column",
270
- "paddingBottom": 4,
271
- "paddingLeft": 4,
272
- "paddingRight": 4,
273
- "paddingTop": 4,
274
- }
275
- }
276
- >
277
- <Text
278
- style={
279
- {
280
- "fontFamily": "GTStandardSemibold",
281
- "fontSize": "$heading-m",
282
- "letterSpacing": 0,
283
- "lineHeight": 32,
284
- "marginBottom": 4,
285
- }
286
- }
287
- suppressHighlighting={true}
288
- >
289
- Color inheritance
290
- </Text>
291
- <Text
292
- style={
293
- {
294
- "fontFamily": "GTStandard",
295
- }
296
- }
297
- suppressHighlighting={true}
298
- >
299
- color is undefined
300
-
301
- <Text
302
- style={
303
- {
304
- "color": "#563B56",
305
- "fontFamily": "GTStandard",
306
- }
307
- }
308
- suppressHighlighting={true}
309
- >
310
- color is $content.accent
311
-
312
- <Text
313
- style={
314
- {
315
- "color": "#563B56",
316
- "fontFamily": "GTStandard",
317
- }
318
- }
319
- suppressHighlighting={true}
320
- >
321
- color is undefined
322
-
323
- <Text
324
- style={
325
- {
326
- "color": "#BD100F",
327
- "fontFamily": "GTStandard",
328
- }
329
- }
330
- suppressHighlighting={true}
331
- >
332
- color is content.danger
333
-
334
- <Text
335
- style={
336
- {
337
- "color": "#101010",
338
- "fontFamily": "GTStandard",
339
- }
340
- }
341
- suppressHighlighting={true}
342
- >
343
- color is content.base.hi
344
- </Text>
345
- </Text>
346
- </Text>
347
- </Text>
348
- </Text>
349
- </View>
350
- <View
351
- style={
352
- {
353
- "flexDirection": "column",
354
- "paddingBottom": 4,
355
- "paddingLeft": 4,
356
- "paddingRight": 4,
357
- "paddingTop": 4,
358
- }
359
- }
360
- >
361
- <Text
362
- style={
363
- {
364
- "fontFamily": "GTStandardSemibold",
365
- "fontSize": "$heading-l",
366
- "letterSpacing": 0,
367
- "lineHeight": 44,
368
- "marginBottom": 4,
369
- }
370
- }
371
- suppressHighlighting={true}
372
- >
373
- Heading
374
- </Text>
375
- <View
376
- style={
377
- {
378
- "flexDirection": "column",
379
- "marginBottom": 16,
380
- }
381
- }
382
- >
383
- <Text
384
- style={
385
- {
386
- "fontFamily": "GTStandardSemibold",
387
- "fontSize": "$heading-s",
388
- "letterSpacing": 0,
389
- "lineHeight": 28,
390
- }
391
- }
392
- suppressHighlighting={true}
393
- >
394
- heading 2xl - semibold
395
- </Text>
396
- <View
397
- style={
398
- {
399
- "backgroundColor": "#F7F4EE",
400
- "borderBottomLeftRadius": 4,
401
- "borderBottomRightRadius": 4,
402
- "borderTopLeftRadius": 4,
403
- "borderTopRightRadius": 4,
404
- "marginTop": 4,
405
- "paddingBottom": 4,
406
- "paddingLeft": 8,
407
- "paddingRight": 8,
408
- "paddingTop": 4,
409
- }
410
- }
411
- >
412
- <Text
413
- style={
414
- {
415
- "fontFamily": "GTStandardSemibold",
416
- "fontSize": "$heading-2xl",
417
- "letterSpacing": 0,
418
- "lineHeight": 64,
419
- }
420
- }
421
- suppressHighlighting={true}
422
- >
423
- The quick brown fox jumps over the lazy dog
424
- </Text>
425
- </View>
426
- </View>
427
- <View
428
- style={
429
- {
430
- "flexDirection": "column",
431
- "marginBottom": 16,
432
- }
433
- }
434
- >
435
- <Text
436
- style={
437
- {
438
- "fontFamily": "GTStandardSemibold",
439
- "fontSize": "$heading-s",
440
- "letterSpacing": 0,
441
- "lineHeight": 28,
442
- }
443
- }
444
- suppressHighlighting={true}
445
- >
446
- heading xl - semibold
447
- </Text>
448
- <View
449
- style={
450
- {
451
- "backgroundColor": "#F7F4EE",
452
- "borderBottomLeftRadius": 4,
453
- "borderBottomRightRadius": 4,
454
- "borderTopLeftRadius": 4,
455
- "borderTopRightRadius": 4,
456
- "marginTop": 4,
457
- "paddingBottom": 4,
458
- "paddingLeft": 8,
459
- "paddingRight": 8,
460
- "paddingTop": 4,
461
- }
462
- }
463
- >
464
- <Text
465
- style={
466
- {
467
- "fontFamily": "GTStandardSemibold",
468
- "fontSize": "$heading-xl",
469
- "letterSpacing": 0,
470
- "lineHeight": 56,
471
- }
472
- }
473
- suppressHighlighting={true}
474
- >
475
- The quick brown fox jumps over the lazy dog
476
- </Text>
477
- </View>
478
- </View>
479
- <View
480
- style={
481
- {
482
- "flexDirection": "column",
483
- "marginBottom": 16,
484
- }
485
- }
486
- >
487
- <Text
488
- style={
489
- {
490
- "fontFamily": "GTStandardSemibold",
491
- "fontSize": "$heading-s",
492
- "letterSpacing": 0,
493
- "lineHeight": 28,
494
- }
495
- }
496
- suppressHighlighting={true}
497
- >
498
- heading l - semibold
499
- </Text>
500
- <View
501
- style={
502
- {
503
- "backgroundColor": "#F7F4EE",
504
- "borderBottomLeftRadius": 4,
505
- "borderBottomRightRadius": 4,
506
- "borderTopLeftRadius": 4,
507
- "borderTopRightRadius": 4,
508
- "marginTop": 4,
509
- "paddingBottom": 4,
510
- "paddingLeft": 8,
511
- "paddingRight": 8,
512
- "paddingTop": 4,
513
- }
514
- }
515
- >
516
- <Text
517
- style={
518
- {
519
- "fontFamily": "GTStandardSemibold",
520
- "fontSize": "$heading-l",
521
- "letterSpacing": 0,
522
- "lineHeight": 44,
523
- }
524
- }
525
- suppressHighlighting={true}
526
- >
527
- The quick brown fox jumps over the lazy dog
528
- </Text>
529
- </View>
530
- </View>
531
- <View
532
- style={
533
- {
534
- "flexDirection": "column",
535
- "marginBottom": 16,
536
- }
537
- }
538
- >
539
- <Text
540
- style={
541
- {
542
- "fontFamily": "GTStandardSemibold",
543
- "fontSize": "$heading-s",
544
- "letterSpacing": 0,
545
- "lineHeight": 28,
546
- }
547
- }
548
- suppressHighlighting={true}
549
- >
550
- heading m - semibold
551
- </Text>
552
- <View
553
- style={
554
- {
555
- "backgroundColor": "#F7F4EE",
556
- "borderBottomLeftRadius": 4,
557
- "borderBottomRightRadius": 4,
558
- "borderTopLeftRadius": 4,
559
- "borderTopRightRadius": 4,
560
- "marginTop": 4,
561
- "paddingBottom": 4,
562
- "paddingLeft": 8,
563
- "paddingRight": 8,
564
- "paddingTop": 4,
565
- }
566
- }
567
- >
568
- <Text
569
- style={
570
- {
571
- "fontFamily": "GTStandardSemibold",
572
- "fontSize": "$heading-m",
573
- "letterSpacing": 0,
574
- "lineHeight": 32,
575
- }
576
- }
577
- suppressHighlighting={true}
578
- >
579
- The quick brown fox jumps over the lazy dog
580
- </Text>
581
- </View>
582
- </View>
583
- <View
584
- style={
585
- {
586
- "flexDirection": "column",
587
- "marginBottom": 16,
588
- }
589
- }
590
- >
591
- <Text
592
- style={
593
- {
594
- "fontFamily": "GTStandardSemibold",
595
- "fontSize": "$heading-s",
596
- "letterSpacing": 0,
597
- "lineHeight": 28,
598
- }
599
- }
600
- suppressHighlighting={true}
601
- >
602
- heading s - semibold
603
- </Text>
604
- <View
605
- style={
606
- {
607
- "backgroundColor": "#F7F4EE",
608
- "borderBottomLeftRadius": 4,
609
- "borderBottomRightRadius": 4,
610
- "borderTopLeftRadius": 4,
611
- "borderTopRightRadius": 4,
612
- "marginTop": 4,
613
- "paddingBottom": 4,
614
- "paddingLeft": 8,
615
- "paddingRight": 8,
616
- "paddingTop": 4,
617
- }
618
- }
619
- >
620
- <Text
621
- style={
622
- {
623
- "fontFamily": "GTStandardSemibold",
624
- "fontSize": "$heading-s",
625
- "letterSpacing": 0,
626
- "lineHeight": 28,
627
- }
628
- }
629
- suppressHighlighting={true}
630
- >
631
- The quick brown fox jumps over the lazy dog
632
- </Text>
633
- </View>
634
- </View>
635
- <View
636
- style={
637
- {
638
- "flexDirection": "column",
639
- "marginBottom": 16,
640
- }
641
- }
642
- >
643
- <Text
644
- style={
645
- {
646
- "fontFamily": "GTStandardSemibold",
647
- "fontSize": "$heading-s",
648
- "letterSpacing": 0,
649
- "lineHeight": 28,
650
- }
651
- }
652
- suppressHighlighting={true}
653
- >
654
- heading xs - semibold
655
- </Text>
656
- <View
657
- style={
658
- {
659
- "backgroundColor": "#F7F4EE",
660
- "borderBottomLeftRadius": 4,
661
- "borderBottomRightRadius": 4,
662
- "borderTopLeftRadius": 4,
663
- "borderTopRightRadius": 4,
664
- "marginTop": 4,
665
- "paddingBottom": 4,
666
- "paddingLeft": 8,
667
- "paddingRight": 8,
668
- "paddingTop": 4,
669
- }
670
- }
671
- >
672
- <Text
673
- style={
674
- {
675
- "fontFamily": "GTStandardSemibold",
676
- "fontSize": "$heading-xs",
677
- "letterSpacing": 0,
678
- "lineHeight": 24,
679
- }
680
- }
681
- suppressHighlighting={true}
682
- >
683
- The quick brown fox jumps over the lazy dog
684
- </Text>
685
- </View>
686
- </View>
687
- <View
688
- style={
689
- {
690
- "flexDirection": "column",
691
- "marginBottom": 16,
692
- }
693
- }
694
- >
695
- <Text
696
- style={
697
- {
698
- "fontFamily": "GTStandardSemibold",
699
- "fontSize": "$heading-s",
700
- "letterSpacing": 0,
701
- "lineHeight": 28,
702
- }
703
- }
704
- suppressHighlighting={true}
705
- >
706
- heading 2xs - semibold
707
- </Text>
708
- <View
709
- style={
710
- {
711
- "backgroundColor": "#F7F4EE",
712
- "borderBottomLeftRadius": 4,
713
- "borderBottomRightRadius": 4,
714
- "borderTopLeftRadius": 4,
715
- "borderTopRightRadius": 4,
716
- "marginTop": 4,
717
- "paddingBottom": 4,
718
- "paddingLeft": 8,
719
- "paddingRight": 8,
720
- "paddingTop": 4,
721
- }
722
- }
723
- >
724
- <Text
725
- style={
726
- {
727
- "fontFamily": "GTStandardSemibold",
728
- "fontSize": "$heading-2xs",
729
- "letterSpacing": 0,
730
- "lineHeight": 20,
731
- }
732
- }
733
- suppressHighlighting={true}
734
- >
735
- The quick brown fox jumps over the lazy dog
736
- </Text>
737
- </View>
738
- </View>
739
- </View>
740
- <View
741
- style={
742
- {
743
- "flexDirection": "column",
744
- "paddingBottom": 4,
745
- "paddingLeft": 4,
746
- "paddingRight": 4,
747
- "paddingTop": 4,
748
- }
749
- }
750
- >
751
- <Text
752
- style={
753
- {
754
- "fontFamily": "GTStandardSemibold",
755
- "fontSize": "$heading-l",
756
- "letterSpacing": 0,
757
- "lineHeight": 44,
758
- "marginBottom": 4,
759
- }
760
- }
761
- suppressHighlighting={true}
762
- >
763
- Body
764
- </Text>
765
- <View
766
- style={
767
- {
768
- "flexDirection": "column",
769
- "marginBottom": 16,
770
- }
771
- }
772
- >
773
- <Text
774
- style={
775
- {
776
- "fontFamily": "GTStandardSemibold",
777
- "fontSize": "$heading-s",
778
- "letterSpacing": 0,
779
- "lineHeight": 28,
780
- }
781
- }
782
- suppressHighlighting={true}
783
- >
784
- body xl - bold
785
- </Text>
786
- <View
787
- style={
788
- {
789
- "backgroundColor": "#F7F4EE",
790
- "borderBottomLeftRadius": 4,
791
- "borderBottomRightRadius": 4,
792
- "borderTopLeftRadius": 4,
793
- "borderTopRightRadius": 4,
794
- "marginTop": 4,
795
- "paddingBottom": 4,
796
- "paddingLeft": 8,
797
- "paddingRight": 8,
798
- "paddingTop": 4,
799
- }
800
- }
801
- >
802
- <Text
803
- style={
804
- {
805
- "fontFamily": "GTStandardBold",
806
- "fontSize": "$body-xl",
807
- "letterSpacing": 0.3,
808
- "lineHeight": 32,
809
- }
810
- }
811
- suppressHighlighting={true}
812
- >
813
- The quick brown fox jumps over the lazy dog
814
- </Text>
815
- </View>
816
- </View>
817
- <View
818
- style={
819
- {
820
- "flexDirection": "column",
821
- "marginBottom": 16,
822
- }
823
- }
824
- >
825
- <Text
826
- style={
827
- {
828
- "fontFamily": "GTStandardSemibold",
829
- "fontSize": "$heading-s",
830
- "letterSpacing": 0,
831
- "lineHeight": 28,
832
- }
833
- }
834
- suppressHighlighting={true}
835
- >
836
- body xl - regular
837
- </Text>
838
- <View
839
- style={
840
- {
841
- "backgroundColor": "#F7F4EE",
842
- "borderBottomLeftRadius": 4,
843
- "borderBottomRightRadius": 4,
844
- "borderTopLeftRadius": 4,
845
- "borderTopRightRadius": 4,
846
- "marginTop": 4,
847
- "paddingBottom": 4,
848
- "paddingLeft": 8,
849
- "paddingRight": 8,
850
- "paddingTop": 4,
851
- }
852
- }
853
- >
854
- <Text
855
- style={
856
- {
857
- "fontFamily": "GTStandardRegular",
858
- "fontSize": "$body-xl",
859
- "letterSpacing": 0.3,
860
- "lineHeight": 32,
861
- }
862
- }
863
- suppressHighlighting={true}
864
- >
865
- The quick brown fox jumps over the lazy dog
866
- </Text>
867
- </View>
868
- </View>
869
- <View
870
- style={
871
- {
872
- "flexDirection": "column",
873
- "marginBottom": 16,
874
- }
875
- }
876
- >
877
- <Text
878
- style={
879
- {
880
- "fontFamily": "GTStandardSemibold",
881
- "fontSize": "$heading-s",
882
- "letterSpacing": 0,
883
- "lineHeight": 28,
884
- }
885
- }
886
- suppressHighlighting={true}
887
- >
888
- body l - bold
889
- </Text>
890
- <View
891
- style={
892
- {
893
- "backgroundColor": "#F7F4EE",
894
- "borderBottomLeftRadius": 4,
895
- "borderBottomRightRadius": 4,
896
- "borderTopLeftRadius": 4,
897
- "borderTopRightRadius": 4,
898
- "marginTop": 4,
899
- "paddingBottom": 4,
900
- "paddingLeft": 8,
901
- "paddingRight": 8,
902
- "paddingTop": 4,
903
- }
904
- }
905
- >
906
- <Text
907
- style={
908
- {
909
- "fontFamily": "GTStandardBold",
910
- "fontSize": "$body-l",
911
- "letterSpacing": 0.3,
912
- "lineHeight": 26,
913
- }
914
- }
915
- suppressHighlighting={true}
916
- >
917
- The quick brown fox jumps over the lazy dog
918
- </Text>
919
- </View>
920
- </View>
921
- <View
922
- style={
923
- {
924
- "flexDirection": "column",
925
- "marginBottom": 16,
926
- }
927
- }
928
- >
929
- <Text
930
- style={
931
- {
932
- "fontFamily": "GTStandardSemibold",
933
- "fontSize": "$heading-s",
934
- "letterSpacing": 0,
935
- "lineHeight": 28,
936
- }
937
- }
938
- suppressHighlighting={true}
939
- >
940
- body l - regular
941
- </Text>
942
- <View
943
- style={
944
- {
945
- "backgroundColor": "#F7F4EE",
946
- "borderBottomLeftRadius": 4,
947
- "borderBottomRightRadius": 4,
948
- "borderTopLeftRadius": 4,
949
- "borderTopRightRadius": 4,
950
- "marginTop": 4,
951
- "paddingBottom": 4,
952
- "paddingLeft": 8,
953
- "paddingRight": 8,
954
- "paddingTop": 4,
955
- }
956
- }
957
- >
958
- <Text
959
- style={
960
- {
961
- "fontFamily": "GTStandardRegular",
962
- "fontSize": "$body-l",
963
- "letterSpacing": 0.3,
964
- "lineHeight": 26,
965
- }
966
- }
967
- suppressHighlighting={true}
968
- >
969
- The quick brown fox jumps over the lazy dog
970
- </Text>
971
- </View>
972
- </View>
973
- <View
974
- style={
975
- {
976
- "flexDirection": "column",
977
- "marginBottom": 16,
978
- }
979
- }
980
- >
981
- <Text
982
- style={
983
- {
984
- "fontFamily": "GTStandardSemibold",
985
- "fontSize": "$heading-s",
986
- "letterSpacing": 0,
987
- "lineHeight": 28,
988
- }
989
- }
990
- suppressHighlighting={true}
991
- >
992
- body m - bold
993
- </Text>
994
- <View
995
- style={
996
- {
997
- "backgroundColor": "#F7F4EE",
998
- "borderBottomLeftRadius": 4,
999
- "borderBottomRightRadius": 4,
1000
- "borderTopLeftRadius": 4,
1001
- "borderTopRightRadius": 4,
1002
- "marginTop": 4,
1003
- "paddingBottom": 4,
1004
- "paddingLeft": 8,
1005
- "paddingRight": 8,
1006
- "paddingTop": 4,
1007
- }
1008
- }
1009
- >
1010
- <Text
1011
- style={
1012
- {
1013
- "fontFamily": "GTStandardBold",
1014
- "fontSize": "$body-m",
1015
- "letterSpacing": 0.3,
1016
- "lineHeight": 24,
1017
- }
1018
- }
1019
- suppressHighlighting={true}
1020
- >
1021
- The quick brown fox jumps over the lazy dog
1022
- </Text>
1023
- </View>
1024
- </View>
1025
- <View
1026
- style={
1027
- {
1028
- "flexDirection": "column",
1029
- "marginBottom": 16,
1030
- }
1031
- }
1032
- >
1033
- <Text
1034
- style={
1035
- {
1036
- "fontFamily": "GTStandardSemibold",
1037
- "fontSize": "$heading-s",
1038
- "letterSpacing": 0,
1039
- "lineHeight": 28,
1040
- }
1041
- }
1042
- suppressHighlighting={true}
1043
- >
1044
- body m - regular
1045
- </Text>
1046
- <View
1047
- style={
1048
- {
1049
- "backgroundColor": "#F7F4EE",
1050
- "borderBottomLeftRadius": 4,
1051
- "borderBottomRightRadius": 4,
1052
- "borderTopLeftRadius": 4,
1053
- "borderTopRightRadius": 4,
1054
- "marginTop": 4,
1055
- "paddingBottom": 4,
1056
- "paddingLeft": 8,
1057
- "paddingRight": 8,
1058
- "paddingTop": 4,
1059
- }
1060
- }
1061
- >
1062
- <Text
1063
- style={
1064
- {
1065
- "fontFamily": "GTStandardRegular",
1066
- "fontSize": "$body-m",
1067
- "letterSpacing": 0.3,
1068
- "lineHeight": 24,
1069
- }
1070
- }
1071
- suppressHighlighting={true}
1072
- >
1073
- The quick brown fox jumps over the lazy dog
1074
- </Text>
1075
- </View>
1076
- </View>
1077
- <View
1078
- style={
1079
- {
1080
- "flexDirection": "column",
1081
- "marginBottom": 16,
1082
- }
1083
- }
1084
- >
1085
- <Text
1086
- style={
1087
- {
1088
- "fontFamily": "GTStandardSemibold",
1089
- "fontSize": "$heading-s",
1090
- "letterSpacing": 0,
1091
- "lineHeight": 28,
1092
- }
1093
- }
1094
- suppressHighlighting={true}
1095
- >
1096
- body s - bold
1097
- </Text>
1098
- <View
1099
- style={
1100
- {
1101
- "backgroundColor": "#F7F4EE",
1102
- "borderBottomLeftRadius": 4,
1103
- "borderBottomRightRadius": 4,
1104
- "borderTopLeftRadius": 4,
1105
- "borderTopRightRadius": 4,
1106
- "marginTop": 4,
1107
- "paddingBottom": 4,
1108
- "paddingLeft": 8,
1109
- "paddingRight": 8,
1110
- "paddingTop": 4,
1111
- }
1112
- }
1113
- >
1114
- <Text
1115
- style={
1116
- {
1117
- "fontFamily": "GTStandardBold",
1118
- "fontSize": "$body-s",
1119
- "letterSpacing": 0.3,
1120
- "lineHeight": 20,
1121
- }
1122
- }
1123
- suppressHighlighting={true}
1124
- >
1125
- The quick brown fox jumps over the lazy dog
1126
- </Text>
1127
- </View>
1128
- </View>
1129
- <View
1130
- style={
1131
- {
1132
- "flexDirection": "column",
1133
- "marginBottom": 16,
1134
- }
1135
- }
1136
- >
1137
- <Text
1138
- style={
1139
- {
1140
- "fontFamily": "GTStandardSemibold",
1141
- "fontSize": "$heading-s",
1142
- "letterSpacing": 0,
1143
- "lineHeight": 28,
1144
- }
1145
- }
1146
- suppressHighlighting={true}
1147
- >
1148
- body s - regular
1149
- </Text>
1150
- <View
1151
- style={
1152
- {
1153
- "backgroundColor": "#F7F4EE",
1154
- "borderBottomLeftRadius": 4,
1155
- "borderBottomRightRadius": 4,
1156
- "borderTopLeftRadius": 4,
1157
- "borderTopRightRadius": 4,
1158
- "marginTop": 4,
1159
- "paddingBottom": 4,
1160
- "paddingLeft": 8,
1161
- "paddingRight": 8,
1162
- "paddingTop": 4,
1163
- }
1164
- }
1165
- >
1166
- <Text
1167
- style={
1168
- {
1169
- "fontFamily": "GTStandardRegular",
1170
- "fontSize": "$body-s",
1171
- "letterSpacing": 0.3,
1172
- "lineHeight": 20,
1173
- }
1174
- }
1175
- suppressHighlighting={true}
1176
- >
1177
- The quick brown fox jumps over the lazy dog
1178
- </Text>
1179
- </View>
1180
- </View>
1181
- <View
1182
- style={
1183
- {
1184
- "flexDirection": "column",
1185
- "marginBottom": 16,
1186
- }
1187
- }
1188
- >
1189
- <Text
1190
- style={
1191
- {
1192
- "fontFamily": "GTStandardSemibold",
1193
- "fontSize": "$heading-s",
1194
- "letterSpacing": 0,
1195
- "lineHeight": 28,
1196
- }
1197
- }
1198
- suppressHighlighting={true}
1199
- >
1200
- body xs - bold
1201
- </Text>
1202
- <View
1203
- style={
1204
- {
1205
- "backgroundColor": "#F7F4EE",
1206
- "borderBottomLeftRadius": 4,
1207
- "borderBottomRightRadius": 4,
1208
- "borderTopLeftRadius": 4,
1209
- "borderTopRightRadius": 4,
1210
- "marginTop": 4,
1211
- "paddingBottom": 4,
1212
- "paddingLeft": 8,
1213
- "paddingRight": 8,
1214
- "paddingTop": 4,
1215
- }
1216
- }
1217
- >
1218
- <Text
1219
- style={
1220
- {
1221
- "fontFamily": "GTStandardBold",
1222
- "fontSize": "$body-xs",
1223
- "letterSpacing": 0.3,
1224
- "lineHeight": 16,
1225
- }
1226
- }
1227
- suppressHighlighting={true}
1228
- >
1229
- The quick brown fox jumps over the lazy dog
1230
- </Text>
1231
- </View>
1232
- </View>
1233
- <View
1234
- style={
1235
- {
1236
- "flexDirection": "column",
1237
- "marginBottom": 16,
1238
- }
1239
- }
1240
- >
1241
- <Text
1242
- style={
1243
- {
1244
- "fontFamily": "GTStandardSemibold",
1245
- "fontSize": "$heading-s",
1246
- "letterSpacing": 0,
1247
- "lineHeight": 28,
1248
- }
1249
- }
1250
- suppressHighlighting={true}
1251
- >
1252
- body xs - regular
1253
- </Text>
1254
- <View
1255
- style={
1256
- {
1257
- "backgroundColor": "#F7F4EE",
1258
- "borderBottomLeftRadius": 4,
1259
- "borderBottomRightRadius": 4,
1260
- "borderTopLeftRadius": 4,
1261
- "borderTopRightRadius": 4,
1262
- "marginTop": 4,
1263
- "paddingBottom": 4,
1264
- "paddingLeft": 8,
1265
- "paddingRight": 8,
1266
- "paddingTop": 4,
1267
- }
1268
- }
1269
- >
1270
- <Text
1271
- style={
1272
- {
1273
- "fontFamily": "GTStandardRegular",
1274
- "fontSize": "$body-xs",
1275
- "letterSpacing": 0.3,
1276
- "lineHeight": 16,
1277
- }
1278
- }
1279
- suppressHighlighting={true}
1280
- >
1281
- The quick brown fox jumps over the lazy dog
1282
- </Text>
1283
- </View>
1284
- </View>
1285
- </View>
1286
- <View
1287
- style={
1288
- {
1289
- "flexDirection": "column",
1290
- "paddingBottom": 4,
1291
- "paddingLeft": 4,
1292
- "paddingRight": 4,
1293
- "paddingTop": 4,
1294
- }
1295
- }
1296
- >
1297
- <Text
1298
- style={
1299
- {
1300
- "fontFamily": "GTStandardSemibold",
1301
- "fontSize": "$heading-l",
1302
- "letterSpacing": 0,
1303
- "lineHeight": 44,
1304
- "marginBottom": 4,
1305
- }
1306
- }
1307
- suppressHighlighting={true}
1308
- >
1309
- Label
1310
- </Text>
1311
- <View
1312
- style={
1313
- {
1314
- "flexDirection": "column",
1315
- "marginBottom": 16,
1316
- }
1317
- }
1318
- >
1319
- <Text
1320
- style={
1321
- {
1322
- "fontFamily": "GTStandardSemibold",
1323
- "fontSize": "$heading-s",
1324
- "letterSpacing": 0,
1325
- "lineHeight": 28,
1326
- }
1327
- }
1328
- suppressHighlighting={true}
1329
- >
1330
- label xl - semibold
1331
- </Text>
1332
- <View
1333
- style={
1334
- {
1335
- "backgroundColor": "#F7F4EE",
1336
- "borderBottomLeftRadius": 4,
1337
- "borderBottomRightRadius": 4,
1338
- "borderTopLeftRadius": 4,
1339
- "borderTopRightRadius": 4,
1340
- "marginTop": 4,
1341
- "paddingBottom": 4,
1342
- "paddingLeft": 8,
1343
- "paddingRight": 8,
1344
- "paddingTop": 4,
1345
- }
1346
- }
1347
- >
1348
- <Text
1349
- style={
1350
- {
1351
- "fontFamily": "GTStandardSemibold",
1352
- "fontSize": "$label-xl",
1353
- "letterSpacing": 0,
1354
- "lineHeight": 26,
1355
- }
1356
- }
1357
- suppressHighlighting={true}
1358
- >
1359
- The quick brown fox jumps over the lazy dog
1360
- </Text>
1361
- </View>
1362
- </View>
1363
- <View
1364
- style={
1365
- {
1366
- "flexDirection": "column",
1367
- "marginBottom": 16,
1368
- }
1369
- }
1370
- >
1371
- <Text
1372
- style={
1373
- {
1374
- "fontFamily": "GTStandardSemibold",
1375
- "fontSize": "$heading-s",
1376
- "letterSpacing": 0,
1377
- "lineHeight": 28,
1378
- }
1379
- }
1380
- suppressHighlighting={true}
1381
- >
1382
- label l - semibold
1383
- </Text>
1384
- <View
1385
- style={
1386
- {
1387
- "backgroundColor": "#F7F4EE",
1388
- "borderBottomLeftRadius": 4,
1389
- "borderBottomRightRadius": 4,
1390
- "borderTopLeftRadius": 4,
1391
- "borderTopRightRadius": 4,
1392
- "marginTop": 4,
1393
- "paddingBottom": 4,
1394
- "paddingLeft": 8,
1395
- "paddingRight": 8,
1396
- "paddingTop": 4,
1397
- }
1398
- }
1399
- >
1400
- <Text
1401
- style={
1402
- {
1403
- "fontFamily": "GTStandardSemibold",
1404
- "fontSize": "$label-l",
1405
- "letterSpacing": 0,
1406
- "lineHeight": 20,
1407
- }
1408
- }
1409
- suppressHighlighting={true}
1410
- >
1411
- The quick brown fox jumps over the lazy dog
1412
- </Text>
1413
- </View>
1414
- </View>
1415
- <View
1416
- style={
1417
- {
1418
- "flexDirection": "column",
1419
- "marginBottom": 16,
1420
- }
1421
- }
1422
- >
1423
- <Text
1424
- style={
1425
- {
1426
- "fontFamily": "GTStandardSemibold",
1427
- "fontSize": "$heading-s",
1428
- "letterSpacing": 0,
1429
- "lineHeight": 28,
1430
- }
1431
- }
1432
- suppressHighlighting={true}
1433
- >
1434
- label m - semibold
1435
- </Text>
1436
- <View
1437
- style={
1438
- {
1439
- "backgroundColor": "#F7F4EE",
1440
- "borderBottomLeftRadius": 4,
1441
- "borderBottomRightRadius": 4,
1442
- "borderTopLeftRadius": 4,
1443
- "borderTopRightRadius": 4,
1444
- "marginTop": 4,
1445
- "paddingBottom": 4,
1446
- "paddingLeft": 8,
1447
- "paddingRight": 8,
1448
- "paddingTop": 4,
1449
- }
1450
- }
1451
- >
1452
- <Text
1453
- style={
1454
- {
1455
- "fontFamily": "GTStandardSemibold",
1456
- "fontSize": "$label-m",
1457
- "letterSpacing": 0,
1458
- "lineHeight": 18,
1459
- }
1460
- }
1461
- suppressHighlighting={true}
1462
- >
1463
- The quick brown fox jumps over the lazy dog
1464
- </Text>
1465
- </View>
1466
- </View>
1467
- <View
1468
- style={
1469
- {
1470
- "flexDirection": "column",
1471
- "marginBottom": 16,
1472
- }
1473
- }
1474
- >
1475
- <Text
1476
- style={
1477
- {
1478
- "fontFamily": "GTStandardSemibold",
1479
- "fontSize": "$heading-s",
1480
- "letterSpacing": 0,
1481
- "lineHeight": 28,
1482
- }
1483
- }
1484
- suppressHighlighting={true}
1485
- >
1486
- label s - semibold
1487
- </Text>
1488
- <View
1489
- style={
1490
- {
1491
- "backgroundColor": "#F7F4EE",
1492
- "borderBottomLeftRadius": 4,
1493
- "borderBottomRightRadius": 4,
1494
- "borderTopLeftRadius": 4,
1495
- "borderTopRightRadius": 4,
1496
- "marginTop": 4,
1497
- "paddingBottom": 4,
1498
- "paddingLeft": 8,
1499
- "paddingRight": 8,
1500
- "paddingTop": 4,
1501
- }
1502
- }
1503
- >
1504
- <Text
1505
- style={
1506
- {
1507
- "fontFamily": "GTStandardSemibold",
1508
- "fontSize": "$label-s",
1509
- "letterSpacing": 0,
1510
- "lineHeight": 14,
1511
- }
1512
- }
1513
- suppressHighlighting={true}
1514
- >
1515
- The quick brown fox jumps over the lazy dog
1516
- </Text>
1517
- </View>
1518
- </View>
1519
- </View>
1520
- <View
1521
- style={
1522
- {
1523
- "flexDirection": "column",
1524
- "paddingBottom": 4,
1525
- "paddingLeft": 4,
1526
- "paddingRight": 4,
1527
- "paddingTop": 4,
1528
- }
1529
- }
1530
- >
1531
- <Text
1532
- style={
1533
- {
1534
- "fontFamily": "GTStandardSemibold",
1535
- "fontSize": "$heading-l",
1536
- "letterSpacing": 0,
1537
- "lineHeight": 44,
1538
- "marginBottom": 4,
1539
- }
1540
- }
1541
- suppressHighlighting={true}
1542
- >
1543
- Content Caps
1544
- </Text>
1545
- <View
1546
- style={
1547
- {
1548
- "flexDirection": "column",
1549
- "marginBottom": 16,
1550
- }
1551
- }
1552
- >
1553
- <Text
1554
- style={
1555
- {
1556
- "fontFamily": "GTStandardSemibold",
1557
- "fontSize": "$heading-s",
1558
- "letterSpacing": 0,
1559
- "lineHeight": 28,
1560
- }
1561
- }
1562
- suppressHighlighting={true}
1563
- >
1564
- content caps 3xl - bold
1565
- </Text>
1566
- <View
1567
- style={
1568
- {
1569
- "backgroundColor": "#F7F4EE",
1570
- "borderBottomLeftRadius": 4,
1571
- "borderBottomRightRadius": 4,
1572
- "borderTopLeftRadius": 4,
1573
- "borderTopRightRadius": 4,
1574
- "marginTop": 4,
1575
- "paddingBottom": 4,
1576
- "paddingLeft": 8,
1577
- "paddingRight": 8,
1578
- "paddingTop": 4,
1579
- }
1580
- }
1581
- >
1582
- <Text
1583
- style={
1584
- {
1585
- "fontFamily": "GTStandardBold",
1586
- "fontSize": "$content-caps-3xl",
1587
- "letterSpacing": 0,
1588
- "lineHeight": 40,
1589
- }
1590
- }
1591
- suppressHighlighting={true}
1592
- >
1593
- The quick brown fox jumps over the lazy dog
1594
- </Text>
1595
- </View>
1596
- </View>
1597
- <View
1598
- style={
1599
- {
1600
- "flexDirection": "column",
1601
- "marginBottom": 16,
1602
- }
1603
- }
1604
- >
1605
- <Text
1606
- style={
1607
- {
1608
- "fontFamily": "GTStandardSemibold",
1609
- "fontSize": "$heading-s",
1610
- "letterSpacing": 0,
1611
- "lineHeight": 28,
1612
- }
1613
- }
1614
- suppressHighlighting={true}
1615
- >
1616
- content caps 2xl - bold
1617
- </Text>
1618
- <View
1619
- style={
1620
- {
1621
- "backgroundColor": "#F7F4EE",
1622
- "borderBottomLeftRadius": 4,
1623
- "borderBottomRightRadius": 4,
1624
- "borderTopLeftRadius": 4,
1625
- "borderTopRightRadius": 4,
1626
- "marginTop": 4,
1627
- "paddingBottom": 4,
1628
- "paddingLeft": 8,
1629
- "paddingRight": 8,
1630
- "paddingTop": 4,
1631
- }
1632
- }
1633
- >
1634
- <Text
1635
- style={
1636
- {
1637
- "fontFamily": "GTStandardBold",
1638
- "fontSize": "$content-caps-2xl",
1639
- "letterSpacing": 0,
1640
- "lineHeight": 40,
1641
- }
1642
- }
1643
- suppressHighlighting={true}
1644
- >
1645
- The quick brown fox jumps over the lazy dog
1646
- </Text>
1647
- </View>
1648
- </View>
1649
- <View
1650
- style={
1651
- {
1652
- "flexDirection": "column",
1653
- "marginBottom": 16,
1654
- }
1655
- }
1656
- >
1657
- <Text
1658
- style={
1659
- {
1660
- "fontFamily": "GTStandardSemibold",
1661
- "fontSize": "$heading-s",
1662
- "letterSpacing": 0,
1663
- "lineHeight": 28,
1664
- }
1665
- }
1666
- suppressHighlighting={true}
1667
- >
1668
- content caps xl - bold
1669
- </Text>
1670
- <View
1671
- style={
1672
- {
1673
- "backgroundColor": "#F7F4EE",
1674
- "borderBottomLeftRadius": 4,
1675
- "borderBottomRightRadius": 4,
1676
- "borderTopLeftRadius": 4,
1677
- "borderTopRightRadius": 4,
1678
- "marginTop": 4,
1679
- "paddingBottom": 4,
1680
- "paddingLeft": 8,
1681
- "paddingRight": 8,
1682
- "paddingTop": 4,
1683
- }
1684
- }
1685
- >
1686
- <Text
1687
- style={
1688
- {
1689
- "fontFamily": "GTStandardBold",
1690
- "fontSize": "$content-caps-xl",
1691
- "letterSpacing": 0,
1692
- "lineHeight": 28,
1693
- }
1694
- }
1695
- suppressHighlighting={true}
1696
- >
1697
- The quick brown fox jumps over the lazy dog
1698
- </Text>
1699
- </View>
1700
- </View>
1701
- <View
1702
- style={
1703
- {
1704
- "flexDirection": "column",
1705
- "marginBottom": 16,
1706
- }
1707
- }
1708
- >
1709
- <Text
1710
- style={
1711
- {
1712
- "fontFamily": "GTStandardSemibold",
1713
- "fontSize": "$heading-s",
1714
- "letterSpacing": 0,
1715
- "lineHeight": 28,
1716
- }
1717
- }
1718
- suppressHighlighting={true}
1719
- >
1720
- content caps l - bold
1721
- </Text>
1722
- <View
1723
- style={
1724
- {
1725
- "backgroundColor": "#F7F4EE",
1726
- "borderBottomLeftRadius": 4,
1727
- "borderBottomRightRadius": 4,
1728
- "borderTopLeftRadius": 4,
1729
- "borderTopRightRadius": 4,
1730
- "marginTop": 4,
1731
- "paddingBottom": 4,
1732
- "paddingLeft": 8,
1733
- "paddingRight": 8,
1734
- "paddingTop": 4,
1735
- }
1736
- }
1737
- >
1738
- <Text
1739
- style={
1740
- {
1741
- "fontFamily": "GTStandardBold",
1742
- "fontSize": "$content-caps-l",
1743
- "letterSpacing": 0,
1744
- "lineHeight": 20,
1745
- }
1746
- }
1747
- suppressHighlighting={true}
1748
- >
1749
- The quick brown fox jumps over the lazy dog
1750
- </Text>
1751
- </View>
1752
- </View>
1753
- <View
1754
- style={
1755
- {
1756
- "flexDirection": "column",
1757
- "marginBottom": 16,
1758
- }
1759
- }
1760
- >
1761
- <Text
1762
- style={
1763
- {
1764
- "fontFamily": "GTStandardSemibold",
1765
- "fontSize": "$heading-s",
1766
- "letterSpacing": 0,
1767
- "lineHeight": 28,
1768
- }
1769
- }
1770
- suppressHighlighting={true}
1771
- >
1772
- content caps m - bold
1773
- </Text>
1774
- <View
1775
- style={
1776
- {
1777
- "backgroundColor": "#F7F4EE",
1778
- "borderBottomLeftRadius": 4,
1779
- "borderBottomRightRadius": 4,
1780
- "borderTopLeftRadius": 4,
1781
- "borderTopRightRadius": 4,
1782
- "marginTop": 4,
1783
- "paddingBottom": 4,
1784
- "paddingLeft": 8,
1785
- "paddingRight": 8,
1786
- "paddingTop": 4,
1787
- }
1788
- }
1789
- >
1790
- <Text
1791
- style={
1792
- {
1793
- "fontFamily": "GTStandardBold",
1794
- "fontSize": "$content-caps-m",
1795
- "letterSpacing": 0,
1796
- "lineHeight": 18,
1797
- }
1798
- }
1799
- suppressHighlighting={true}
1800
- >
1801
- The quick brown fox jumps over the lazy dog
1802
- </Text>
1803
- </View>
1804
- </View>
1805
- <View
1806
- style={
1807
- {
1808
- "flexDirection": "column",
1809
- "marginBottom": 16,
1810
- }
1811
- }
1812
- >
1813
- <Text
1814
- style={
1815
- {
1816
- "fontFamily": "GTStandardSemibold",
1817
- "fontSize": "$heading-s",
1818
- "letterSpacing": 0,
1819
- "lineHeight": 28,
1820
- }
1821
- }
1822
- suppressHighlighting={true}
1823
- >
1824
- content caps s - bold
1825
- </Text>
1826
- <View
1827
- style={
1828
- {
1829
- "backgroundColor": "#F7F4EE",
1830
- "borderBottomLeftRadius": 4,
1831
- "borderBottomRightRadius": 4,
1832
- "borderTopLeftRadius": 4,
1833
- "borderTopRightRadius": 4,
1834
- "marginTop": 4,
1835
- "paddingBottom": 4,
1836
- "paddingLeft": 8,
1837
- "paddingRight": 8,
1838
- "paddingTop": 4,
1839
- }
1840
- }
1841
- >
1842
- <Text
1843
- style={
1844
- {
1845
- "fontFamily": "GTStandardBold",
1846
- "fontSize": "$content-caps-s",
1847
- "letterSpacing": 0,
1848
- "lineHeight": 16,
1849
- }
1850
- }
1851
- suppressHighlighting={true}
1852
- >
1853
- The quick brown fox jumps over the lazy dog
1854
- </Text>
1855
- </View>
1856
- </View>
1857
- <View
1858
- style={
1859
- {
1860
- "flexDirection": "column",
1861
- "marginBottom": 16,
1862
- }
1863
- }
1864
- >
1865
- <Text
1866
- style={
1867
- {
1868
- "fontFamily": "GTStandardSemibold",
1869
- "fontSize": "$heading-s",
1870
- "letterSpacing": 0,
1871
- "lineHeight": 28,
1872
- }
1873
- }
1874
- suppressHighlighting={true}
1875
- >
1876
- content caps xs - bold
1877
- </Text>
1878
- <View
1879
- style={
1880
- {
1881
- "backgroundColor": "#F7F4EE",
1882
- "borderBottomLeftRadius": 4,
1883
- "borderBottomRightRadius": 4,
1884
- "borderTopLeftRadius": 4,
1885
- "borderTopRightRadius": 4,
1886
- "marginTop": 4,
1887
- "paddingBottom": 4,
1888
- "paddingLeft": 8,
1889
- "paddingRight": 8,
1890
- "paddingTop": 4,
1891
- }
1892
- }
1893
- >
1894
- <Text
1895
- style={
1896
- {
1897
- "fontFamily": "GTStandardBold",
1898
- "fontSize": "$content-caps-xs",
1899
- "letterSpacing": 0,
1900
- "lineHeight": 14,
1901
- }
1902
- }
1903
- suppressHighlighting={true}
1904
- >
1905
- The quick brown fox jumps over the lazy dog
1906
- </Text>
1907
- </View>
1908
- </View>
1909
- </View>
1910
- <View
1911
- style={
1912
- {
1913
- "flexDirection": "column",
1914
- "paddingBottom": 4,
1915
- "paddingLeft": 4,
1916
- "paddingRight": 4,
1917
- "paddingTop": 4,
1918
- }
1919
- }
1920
- >
1921
- <Text
1922
- style={
1923
- {
1924
- "fontFamily": "GTStandardSemibold",
1925
- "fontSize": "$heading-l",
1926
- "letterSpacing": 0,
1927
- "lineHeight": 44,
1928
- "marginBottom": 4,
1929
- }
1930
- }
1931
- suppressHighlighting={true}
1932
- >
1933
- Accessibility
1934
- </Text>
1935
- <Text
1936
- aria-level={1}
1937
- role="heading"
1938
- style={
1939
- {
1940
- "fontFamily": "GTStandard",
1941
- }
1942
- }
1943
- suppressHighlighting={true}
1944
- >
1945
- role: heading aria-level: 1
1946
- </Text>
1947
- <Text
1948
- aria-level={2}
1949
- role="heading"
1950
- style={
1951
- {
1952
- "fontFamily": "GTStandard",
1953
- }
1954
- }
1955
- suppressHighlighting={true}
1956
- >
1957
- role: heading aria-level: 2
1958
- </Text>
1959
- <Text
1960
- aria-level={3}
1961
- role="heading"
1962
- style={
1963
- {
1964
- "fontFamily": "GTStandard",
1965
- }
1966
- }
1967
- suppressHighlighting={true}
1968
- >
1969
- role: heading aria-level: 3
1970
- </Text>
1971
- <Text
1972
- aria-level={4}
1973
- role="heading"
1974
- style={
1975
- {
1976
- "fontFamily": "GTStandard",
1977
- }
1978
- }
1979
- suppressHighlighting={true}
1980
- >
1981
- role: heading aria-level: 4
1982
- </Text>
1983
- <Text
1984
- aria-level={5}
1985
- role="heading"
1986
- style={
1987
- {
1988
- "fontFamily": "GTStandard",
1989
- }
1990
- }
1991
- suppressHighlighting={true}
1992
- >
1993
- role: heading aria-level: 5
1994
- </Text>
1995
- <Text
1996
- aria-level={6}
1997
- role="heading"
1998
- style={
1999
- {
2000
- "fontFamily": "GTStandard",
2001
- }
2002
- }
2003
- suppressHighlighting={true}
2004
- >
2005
- role: heading aria-level: 6
2006
- </Text>
2007
- </View>
2008
- </View>
27
+ The quick brown fox jumps over the lazy dog
28
+ </Text>
2009
29
  </RNCSafeAreaProvider>
2010
30
  `;