ikualo-ui-kit-mobile 1.2.2 → 1.2.3

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 (2) hide show
  1. package/assets/styles/elements/inputs.ts +173 -173
  2. package/package.json +1 -1
package/assets/styles/elements/inputs.ts CHANGED
@@ -1,176 +1,176 @@
1
1
  import { StyleSheet } from 'react-native';
2
2
  import { ITheme } from '../../../src/models';
3
- export const getStyleInput = (theme: ITheme) => StyleSheet.create({
4
- input: {
5
- borderRadius: 8,
6
- borderBottomColor: theme.colors.border_dark,
7
- borderBottomWidth: 1,
8
- },
9
- 'input-txt': {
10
- fontFamily: 'MontserratRegular',
11
- fontSize: 16,
12
- lineHeight: 19.5,
13
- color: theme.colors.text_p,
14
- borderTopRightRadius: 4,
15
- borderTopLeftRadius: 4,
16
- },
17
- 'input-label': {
18
- backgroundColor: 'transparent',
19
- fontSize: 16,
20
- color: theme.colors.text_p,
21
- borderRadius: 4,
22
- fontFamily: 'MontserratRegular',
23
- },
24
- 'input-error-focused': {
25
- backgroundColor: theme.colors.background_error,
26
- borderTopLeftRadius: 4,
27
- borderTopRightRadius: 4,
28
- color: theme.colors.text_p,
29
- fontFamily: 'MontserratSemiBold',
30
- },
31
- 'input-txt-error': {
32
- fontFamily: 'MontserratRegular',
33
- fontSize: 12,
34
- lineHeight: 14.63,
35
- color: theme.colors.text_p,
36
- marginLeft: 5,
37
- borderBottomColor: theme.colors.error,
38
- borderTopLeftRadius: 4,
39
- borderTopRightRadius: 4,
40
- },
41
- 'input-error': {
42
- flex: 1,
43
- alignItems: 'flex-start',
44
- justifyContent: 'flex-start',
45
- flexDirection: 'row',
46
- marginTop: 10,
47
- marginBottom: 10,
48
- backgroundColor: 'transparent',
49
- borderTopLeftRadius: 4,
50
- borderTopRightRadius: 4,
51
- },
52
- 'input-text-underline': {
53
- color: theme.colors.border_dark,
54
- },
55
- 'input-text--activeUnderline': {
56
- color: theme.colors.error,
57
- },
58
- 'input-text--focused': {
59
- backgroundColor: theme.colors.background_focus,
60
- borderTopRightRadius: 4,
61
- borderTopLeftRadius: 4,
62
- },
63
- 'input-text-color': {
64
- color: theme.colors.text_p,
65
- },
66
- 'input-helper--error': {
67
- flexDirection: 'row',
68
- alignItems: 'center',
69
- marginTop: 1,
70
- backgroundColor: theme.colors.background_app,
71
- gap: 16,
72
- width: '100%',
73
- },
74
- 'input-helper--error-text': {
75
- flexDirection: 'row',
76
- alignItems: 'center',
77
- backgroundColor: 'transparent',
78
- paddingTop: 4,
79
- paddingRight: 16,
80
- },
81
- 'input-helper--error-image': { marginLeft: 8, width: 16, height: 16 },
82
- 'input-phone': { backgroundColor: theme.colors.background_app, color: theme.colors.text_p },
83
- 'input-phone-container': {
84
- flexDirection: 'row',
85
- borderTopLeftRadius: 4,
86
- borderTopRightRadius: 4,
87
- width: '100%',
88
- gap: 4,
89
- backgroundColor: theme.colors.background_app,
90
- },
91
- 'input-phone-code': {
92
- backgroundColor: 'transparent',
93
- width: '20%',
94
- fontSize: 14,
95
- fontWeight: 'bold',
96
- borderBottomColor: theme.colors.border_dark,
97
- borderBottomWidth: 1,
98
- },
99
- 'input-phone-icon': { paddingLeft: 24, color: theme.colors.text_p },
100
- 'input-phone-number': {
101
- backgroundColor: 'transparent',
102
- fontSize: 14,
103
- width: '79%',
104
- fontWeight: 'bold',
105
- borderBottomColor: theme.colors.border_dark,
106
- borderBottomWidth: 1,
107
- color: theme.colors.text_p,
108
- },
109
- 'input-phone-helper': { fontSize: 12, color: theme.colors.text_p, paddingLeft: 16 },
110
- 'input-phone-container--focused': {
111
- backgroundColor: theme.colors.background_focus,
112
- borderTopRightRadius: 4,
113
- borderTopLeftRadius: 4,
114
- },
115
- 'input-phone--focused': {
116
- backgroundColor: theme.colors.background_focus,
117
- borderBottomWidth: 4,
118
- borderTopRightRadius: 4,
119
- borderTopLeftRadius: 4,
120
- },
121
- 'input-phone-list': { marginTop: -26 },
122
- 'input-phone-list-height': { maxHeight: '80%' },
123
- 'input-phone-list-item': {
124
- backgroundColor: theme.colors.background_focus,
125
- borderBottomWidth: 1,
126
- borderBottomColor: theme.colors.border,
127
- borderTopRightRadius: 4,
128
- borderTopLeftRadius: 4,
129
- },
130
- 'input-phone-list-item-text': { color: theme.colors.text_p, fontSize: 14, fontWeight: 'bold' },
131
- 'input-phone-list-item-icon': { marginLeft: 8, width: 25 },
132
- 'input-phone-search-container': {
133
- backgroundColor: theme.colors.background_app,
134
- marginTop: 4,
135
- borderBottomWidth: 0.5,
136
- borderBottomColor: theme.colors.border_dark,
137
- },
138
- 'input-phone-search': {
139
- color: theme.colors.text_p,
140
- fontFamily: 'MontserratSemiBold',
141
- fontSize: 14,
142
- },
143
-
144
- 'input-password-helper---error': {
145
- flexDirection: 'row',
146
- alignItems: 'center',
147
- backgroundColor: theme.colors.background_app,
148
- paddingTop: 4,
149
- },
150
- 'input-password-helper--error-text': {
151
- fontSize: 12,
152
- color: theme.colors.text_p,
153
- fontFamily: 'MontserratLight',
154
- marginLeft: 8,
155
- flexWrap: 'wrap',
156
- },
157
- 'input-password-helper': {
158
- color: theme.colors.text_p,
159
- fontSize: 12,
160
- fontFamily: 'MontserratRegular',
161
- backgroundColor: theme.colors.background_app,
162
- paddingTop: 4,
163
- },
164
- 'input--disabeld': {
165
- color: theme.colors.text_btn_disabled,
166
- fontFamily: 'MontserratMedium',
167
- },
168
- 'input-label--disabled': {
169
- fontFamily: 'MontserratMedium',
170
- },
171
- 'input-checkbox': {
172
- width: 24,
173
- height: 24,
174
- }
175
- });
3
+ export const getStyleInput = (theme: ITheme) =>
4
+ StyleSheet.create({
5
+ input: {
6
+ borderRadius: 8,
7
+ borderBottomColor: theme.colors.border_dark,
8
+ borderBottomWidth: 1,
9
+ },
10
+ 'input-txt': {
11
+ fontFamily: 'MontserratRegular',
12
+ fontSize: 16,
13
+ lineHeight: 19.5,
14
+ color: theme.colors.text_p,
15
+ borderTopRightRadius: 4,
16
+ borderTopLeftRadius: 4,
17
+ },
18
+ 'input-label': {
19
+ backgroundColor: 'transparent',
20
+ fontSize: 16,
21
+ color: theme.colors.text_p,
22
+ borderRadius: 4,
23
+ fontFamily: 'MontserratRegular',
24
+ },
25
+ 'input-error-focused': {
26
+ backgroundColor: theme.colors.background_error,
27
+ borderTopLeftRadius: 4,
28
+ borderTopRightRadius: 4,
29
+ color: theme.colors.text_p,
30
+ fontFamily: 'MontserratSemiBold',
31
+ },
32
+ 'input-txt-error': {
33
+ fontFamily: 'MontserratRegular',
34
+ fontSize: 12,
35
+ lineHeight: 14.63,
36
+ color: theme.colors.text_p,
37
+ marginLeft: 5,
38
+ borderBottomColor: theme.colors.error,
39
+ borderTopLeftRadius: 4,
40
+ borderTopRightRadius: 4,
41
+ },
42
+ 'input-error': {
43
+ flex: 1,
44
+ alignItems: 'flex-start',
45
+ justifyContent: 'flex-start',
46
+ flexDirection: 'row',
47
+ marginTop: 10,
48
+ marginBottom: 10,
49
+ backgroundColor: 'transparent',
50
+ borderTopLeftRadius: 4,
51
+ borderTopRightRadius: 4,
52
+ },
53
+ 'input-text-underline': {
54
+ color: theme.colors.border_dark,
55
+ },
56
+ 'input-text--activeUnderline': {
57
+ color: theme.colors.error,
58
+ },
59
+ 'input-text--focused': {
60
+ backgroundColor: theme.colors.background_focus,
61
+ borderTopRightRadius: 4,
62
+ borderTopLeftRadius: 4,
63
+ },
64
+ 'input-text-color': {
65
+ color: theme.colors.text_p,
66
+ },
67
+ 'input-helper--error': {
68
+ flexDirection: 'row',
69
+ alignItems: 'center',
70
+ marginTop: 1,
71
+ backgroundColor: theme.colors.background_app,
72
+ gap: 16,
73
+ width: '100%',
74
+ },
75
+ 'input-helper--error-text': {
76
+ flexDirection: 'row',
77
+ alignItems: 'center',
78
+ backgroundColor: 'transparent',
79
+ paddingTop: 4,
80
+ paddingRight: 16,
81
+ },
82
+ 'input-helper--error-image': { marginLeft: 8, width: 16, height: 16 },
83
+ 'input-phone': { backgroundColor: theme.colors.background_app, color: theme.colors.text_p },
84
+ 'input-phone-container': {
85
+ flexDirection: 'row',
86
+ borderTopLeftRadius: 4,
87
+ borderTopRightRadius: 4,
88
+ width: '100%',
89
+ gap: 4,
90
+ backgroundColor: theme.colors.background_app,
91
+ },
92
+ 'input-phone-code': {
93
+ backgroundColor: 'transparent',
94
+ width: '20%',
95
+ fontSize: 14,
96
+ fontWeight: 'bold',
97
+ borderBottomColor: theme.colors.border_dark,
98
+ borderBottomWidth: 1,
99
+ },
100
+ 'input-phone-icon': { paddingLeft: 24, color: theme.colors.text_p },
101
+ 'input-phone-number': {
102
+ backgroundColor: 'transparent',
103
+ fontSize: 14,
104
+ width: '79%',
105
+ fontWeight: 'bold',
106
+ borderBottomColor: theme.colors.border_dark,
107
+ borderBottomWidth: 1,
108
+ color: theme.colors.text_p,
109
+ },
110
+ 'input-phone-helper': { fontSize: 12, color: theme.colors.text_p, paddingLeft: 16 },
111
+ 'input-phone-container--focused': {
112
+ backgroundColor: theme.colors.background_focus,
113
+ borderTopRightRadius: 4,
114
+ borderTopLeftRadius: 4,
115
+ },
116
+ 'input-phone--focused': {
117
+ backgroundColor: theme.colors.background_focus,
118
+ borderBottomWidth: 4,
119
+ borderTopRightRadius: 4,
120
+ borderTopLeftRadius: 4,
121
+ },
122
+ 'input-phone-list': { marginTop: -26 },
123
+ 'input-phone-list-height': { maxHeight: '80%' },
124
+ 'input-phone-list-item': {
125
+ backgroundColor: theme.colors.background_focus,
126
+ borderBottomWidth: 1,
127
+ borderBottomColor: theme.colors.border,
128
+ borderTopRightRadius: 4,
129
+ borderTopLeftRadius: 4,
130
+ },
131
+ 'input-phone-list-item-text': { color: theme.colors.text_p, fontSize: 14, fontWeight: 'bold' },
132
+ 'input-phone-list-item-icon': { marginLeft: 8, width: 25 },
133
+ 'input-phone-search-container': {
134
+ backgroundColor: theme.colors.background_app,
135
+ marginTop: 4,
136
+ borderBottomWidth: 0.5,
137
+ borderBottomColor: theme.colors.border_dark,
138
+ },
139
+ 'input-phone-search': {
140
+ color: theme.colors.text_p,
141
+ fontFamily: 'MontserratSemiBold',
142
+ fontSize: 14,
143
+ },
176
144
 
145
+ 'input-password-helper---error': {
146
+ flexDirection: 'row',
147
+ alignItems: 'center',
148
+ backgroundColor: theme.colors.transparent,
149
+ paddingTop: 4,
150
+ },
151
+ 'input-password-helper--error-text': {
152
+ fontSize: 12,
153
+ color: theme.colors.text_p,
154
+ fontFamily: 'MontserratLight',
155
+ marginLeft: 8,
156
+ flexWrap: 'wrap',
157
+ },
158
+ 'input-password-helper': {
159
+ color: theme.colors.text_p,
160
+ fontSize: 12,
161
+ fontFamily: 'MontserratRegular',
162
+ backgroundColor: theme.colors.transparent,
163
+ paddingTop: 4,
164
+ },
165
+ 'input--disabeld': {
166
+ color: theme.colors.text_btn_disabled,
167
+ fontFamily: 'MontserratMedium',
168
+ },
169
+ 'input-label--disabled': {
170
+ fontFamily: 'MontserratMedium',
171
+ },
172
+ 'input-checkbox': {
173
+ width: 24,
174
+ height: 24,
175
+ },
176
+ });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "ikualo-ui-kit-mobile",
3
- "version": "1.2.2",
3
+ "version": "1.2.3",
4
4
  "main": "src/index.ts",
5
5
  "scripts": {
6
6
  "start": "expo start",