1import { lightTheme } from '@expo/styleguide-native';
2import { Text as RNText, TextInput as RNTextInput } from 'react-native';
3import { create } from 'react-native-primitives';
4
5import { text, textDark } from './theme';
6
7export const Heading = create(RNText, {
8  base: {
9    fontSize: 22,
10    lineHeight: 28,
11    fontWeight: '600',
12    color: lightTheme.text.default,
13  },
14
15  props: {
16    accessibilityRole: 'header',
17  },
18
19  variants: {
20    ...text,
21
22    size: {
23      small: {
24        fontSize: 18,
25        lineHeight: 20,
26      },
27      medium: {
28        fontSize: 22,
29        lineHeight: 28,
30      },
31      large: {
32        fontSize: 28,
33        lineHeight: 32,
34      },
35    },
36  },
37
38  selectors: {
39    dark: textDark,
40  },
41});
42
43export const Text = create(RNText, {
44  base: {
45    fontWeight: 'normal',
46    color: lightTheme.text.default,
47    fontSize: 16,
48  },
49
50  props: {
51    accessibilityRole: 'text',
52  },
53
54  variants: {
55    ...text,
56  },
57
58  selectors: {
59    dark: textDark,
60  },
61});
62
63export const TextInput = create(RNTextInput, {
64  base: {
65    fontWeight: 'normal',
66    color: lightTheme.text.default,
67    fontSize: 16,
68    lineHeight: 18,
69  },
70
71  variants: {
72    ...text,
73  },
74
75  selectors: {
76    dark: textDark,
77  },
78});
79