react-native-country-select 0.1.1 → 0.1.2
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.
- package/LICENSE.md +7 -7
- package/README.md +307 -296
- package/lib/components/CountryItem/index.tsx +41 -41
- package/lib/components/CountrySelect/index.tsx +265 -159
- package/lib/components/index.ts +2 -2
- package/lib/components/styles.ts +83 -83
- package/lib/index.d.ts +21 -21
- package/lib/index.tsx +18 -18
- package/lib/interface/country.ts +111 -111
- package/lib/interface/countryCca2.ts +251 -251
- package/lib/interface/countryItemProps.ts +10 -10
- package/lib/interface/countrySelectLanguages.ts +34 -34
- package/lib/interface/countrySelectProps.ts +25 -11
- package/lib/interface/index.ts +0 -1
- package/lib/interface/itemList.ts +4 -0
- package/lib/interface/sectionTitle.ts +4 -0
- package/lib/utils/getTranslation.ts +74 -1
- package/package.json +42 -42
package/lib/components/styles.ts
CHANGED
@@ -1,83 +1,83 @@
|
|
1
|
-
import {StyleSheet} from 'react-native';
|
2
|
-
|
3
|
-
export const createStyles = (theme: 'light' | 'dark') =>
|
4
|
-
StyleSheet.create({
|
5
|
-
backdrop: {
|
6
|
-
flex: 1,
|
7
|
-
backgroundColor: 'rgba(0, 0, 0, 0.5)',
|
8
|
-
},
|
9
|
-
popupContainer: {
|
10
|
-
width: '90%',
|
11
|
-
maxWidth: 600,
|
12
|
-
height: '60%',
|
13
|
-
alignItems: 'center',
|
14
|
-
justifyContent: 'center',
|
15
|
-
alignSelf: 'center',
|
16
|
-
},
|
17
|
-
popupContent: {
|
18
|
-
flex: 1,
|
19
|
-
width: '100%',
|
20
|
-
backgroundColor: theme === 'dark' ? '#202020' : '#FFFFFF',
|
21
|
-
borderRadius: 20,
|
22
|
-
alignSelf: 'center',
|
23
|
-
padding: 16,
|
24
|
-
},
|
25
|
-
searchContainer: {
|
26
|
-
marginBottom: 16,
|
27
|
-
paddingTop: 16,
|
28
|
-
flexDirection: 'row',
|
29
|
-
},
|
30
|
-
searchInput: {
|
31
|
-
flex: 1,
|
32
|
-
borderRadius: 8,
|
33
|
-
paddingHorizontal: 16,
|
34
|
-
fontSize: 16,
|
35
|
-
borderColor: theme === 'dark' ? '#F3F3F3' : '#303030',
|
36
|
-
borderWidth: 1,
|
37
|
-
color: theme === 'dark' ? '#FFFFFF' : '#000000',
|
38
|
-
},
|
39
|
-
searchInputPlaceholder: {
|
40
|
-
color: theme === 'dark' ? '#FFFFFF80' : '#00000080',
|
41
|
-
},
|
42
|
-
list: {
|
43
|
-
flex: 1,
|
44
|
-
},
|
45
|
-
countryItem: {
|
46
|
-
flex: 1,
|
47
|
-
flexDirection: 'row',
|
48
|
-
alignItems: 'center',
|
49
|
-
padding: 12,
|
50
|
-
marginBottom: 8,
|
51
|
-
backgroundColor: theme === 'dark' ? '#404040' : '#F3F3F3',
|
52
|
-
borderColor: theme === 'dark' ? '#F3F3F3' : '#303030',
|
53
|
-
borderWidth: 1,
|
54
|
-
borderRadius: 8,
|
55
|
-
},
|
56
|
-
flag: {
|
57
|
-
flex: 0.1,
|
58
|
-
fontSize: 16,
|
59
|
-
color: theme === 'dark' ? '#FFFFFF' : '#000000',
|
60
|
-
},
|
61
|
-
countryInfo: {
|
62
|
-
flex: 0.9,
|
63
|
-
flexDirection: 'row',
|
64
|
-
alignItems: 'center',
|
65
|
-
},
|
66
|
-
callingCode: {
|
67
|
-
flex: 0.2,
|
68
|
-
fontSize: 14,
|
69
|
-
color: theme === 'dark' ? '#FFFFFF80' : '#00000080',
|
70
|
-
},
|
71
|
-
countryName: {
|
72
|
-
flex: 0.8,
|
73
|
-
fontSize: 16,
|
74
|
-
fontWeight: '500',
|
75
|
-
color: theme === 'dark' ? '#FFFFFF' : '#000000',
|
76
|
-
},
|
77
|
-
sectionTitle: {
|
78
|
-
fontSize: 16,
|
79
|
-
fontWeight: '600',
|
80
|
-
paddingVertical: 8,
|
81
|
-
color: theme === 'dark' ? '#FFFFFF' : '#000000',
|
82
|
-
},
|
83
|
-
});
|
1
|
+
import {StyleSheet} from 'react-native';
|
2
|
+
|
3
|
+
export const createStyles = (theme: 'light' | 'dark') =>
|
4
|
+
StyleSheet.create({
|
5
|
+
backdrop: {
|
6
|
+
flex: 1,
|
7
|
+
backgroundColor: 'rgba(0, 0, 0, 0.5)',
|
8
|
+
},
|
9
|
+
popupContainer: {
|
10
|
+
width: '90%',
|
11
|
+
maxWidth: 600,
|
12
|
+
height: '60%',
|
13
|
+
alignItems: 'center',
|
14
|
+
justifyContent: 'center',
|
15
|
+
alignSelf: 'center',
|
16
|
+
},
|
17
|
+
popupContent: {
|
18
|
+
flex: 1,
|
19
|
+
width: '100%',
|
20
|
+
backgroundColor: theme === 'dark' ? '#202020' : '#FFFFFF',
|
21
|
+
borderRadius: 20,
|
22
|
+
alignSelf: 'center',
|
23
|
+
padding: 16,
|
24
|
+
},
|
25
|
+
searchContainer: {
|
26
|
+
marginBottom: 16,
|
27
|
+
paddingTop: 16,
|
28
|
+
flexDirection: 'row',
|
29
|
+
},
|
30
|
+
searchInput: {
|
31
|
+
flex: 1,
|
32
|
+
borderRadius: 8,
|
33
|
+
paddingHorizontal: 16,
|
34
|
+
fontSize: 16,
|
35
|
+
borderColor: theme === 'dark' ? '#F3F3F3' : '#303030',
|
36
|
+
borderWidth: 1,
|
37
|
+
color: theme === 'dark' ? '#FFFFFF' : '#000000',
|
38
|
+
},
|
39
|
+
searchInputPlaceholder: {
|
40
|
+
color: theme === 'dark' ? '#FFFFFF80' : '#00000080',
|
41
|
+
},
|
42
|
+
list: {
|
43
|
+
flex: 1,
|
44
|
+
},
|
45
|
+
countryItem: {
|
46
|
+
flex: 1,
|
47
|
+
flexDirection: 'row',
|
48
|
+
alignItems: 'center',
|
49
|
+
padding: 12,
|
50
|
+
marginBottom: 8,
|
51
|
+
backgroundColor: theme === 'dark' ? '#404040' : '#F3F3F3',
|
52
|
+
borderColor: theme === 'dark' ? '#F3F3F3' : '#303030',
|
53
|
+
borderWidth: 1,
|
54
|
+
borderRadius: 8,
|
55
|
+
},
|
56
|
+
flag: {
|
57
|
+
flex: 0.1,
|
58
|
+
fontSize: 16,
|
59
|
+
color: theme === 'dark' ? '#FFFFFF' : '#000000',
|
60
|
+
},
|
61
|
+
countryInfo: {
|
62
|
+
flex: 0.9,
|
63
|
+
flexDirection: 'row',
|
64
|
+
alignItems: 'center',
|
65
|
+
},
|
66
|
+
callingCode: {
|
67
|
+
flex: 0.2,
|
68
|
+
fontSize: 14,
|
69
|
+
color: theme === 'dark' ? '#FFFFFF80' : '#00000080',
|
70
|
+
},
|
71
|
+
countryName: {
|
72
|
+
flex: 0.8,
|
73
|
+
fontSize: 16,
|
74
|
+
fontWeight: '500',
|
75
|
+
color: theme === 'dark' ? '#FFFFFF' : '#000000',
|
76
|
+
},
|
77
|
+
sectionTitle: {
|
78
|
+
fontSize: 16,
|
79
|
+
fontWeight: '600',
|
80
|
+
paddingVertical: 8,
|
81
|
+
color: theme === 'dark' ? '#FFFFFF' : '#000000',
|
82
|
+
},
|
83
|
+
});
|
package/lib/index.d.ts
CHANGED
@@ -1,21 +1,21 @@
|
|
1
|
-
import * as React from 'react';
|
2
|
-
|
3
|
-
import {
|
4
|
-
ICountry,
|
5
|
-
ICountryCca2,
|
6
|
-
ICountryItemProps,
|
7
|
-
ICountrySelectProps,
|
8
|
-
ICountrySelectLanguages,
|
9
|
-
} from './interface';
|
10
|
-
|
11
|
-
declare const CountrySelect: React.FC<ICountrySelectProps>;
|
12
|
-
|
13
|
-
export default CountrySelect;
|
14
|
-
|
15
|
-
export {
|
16
|
-
ICountry,
|
17
|
-
ICountryCca2,
|
18
|
-
ICountryItemProps,
|
19
|
-
ICountrySelectProps,
|
20
|
-
ICountrySelectLanguages,
|
21
|
-
};
|
1
|
+
import * as React from 'react';
|
2
|
+
|
3
|
+
import {
|
4
|
+
ICountry,
|
5
|
+
ICountryCca2,
|
6
|
+
ICountryItemProps,
|
7
|
+
ICountrySelectProps,
|
8
|
+
ICountrySelectLanguages,
|
9
|
+
} from './interface';
|
10
|
+
|
11
|
+
declare const CountrySelect: React.FC<ICountrySelectProps>;
|
12
|
+
|
13
|
+
export default CountrySelect;
|
14
|
+
|
15
|
+
export {
|
16
|
+
ICountry,
|
17
|
+
ICountryCca2,
|
18
|
+
ICountryItemProps,
|
19
|
+
ICountrySelectProps,
|
20
|
+
ICountrySelectLanguages,
|
21
|
+
};
|
package/lib/index.tsx
CHANGED
@@ -1,18 +1,18 @@
|
|
1
|
-
import {CountrySelect} from './components';
|
2
|
-
import {
|
3
|
-
ICountry,
|
4
|
-
ICountryCca2,
|
5
|
-
ICountryItemProps,
|
6
|
-
ICountrySelectProps,
|
7
|
-
ICountrySelectLanguages,
|
8
|
-
} from './interface';
|
9
|
-
|
10
|
-
export default CountrySelect;
|
11
|
-
|
12
|
-
export type {
|
13
|
-
ICountry,
|
14
|
-
ICountryCca2,
|
15
|
-
ICountryItemProps,
|
16
|
-
ICountrySelectProps,
|
17
|
-
ICountrySelectLanguages,
|
18
|
-
};
|
1
|
+
import {CountrySelect} from './components';
|
2
|
+
import {
|
3
|
+
ICountry,
|
4
|
+
ICountryCca2,
|
5
|
+
ICountryItemProps,
|
6
|
+
ICountrySelectProps,
|
7
|
+
ICountrySelectLanguages,
|
8
|
+
} from './interface';
|
9
|
+
|
10
|
+
export default CountrySelect;
|
11
|
+
|
12
|
+
export type {
|
13
|
+
ICountry,
|
14
|
+
ICountryCca2,
|
15
|
+
ICountryItemProps,
|
16
|
+
ICountrySelectProps,
|
17
|
+
ICountrySelectLanguages,
|
18
|
+
};
|
package/lib/interface/country.ts
CHANGED
@@ -1,111 +1,111 @@
|
|
1
|
-
import {ICountryCca2} from './countryCca2';
|
2
|
-
|
3
|
-
// Currency interface
|
4
|
-
export interface ICountryCurrency {
|
5
|
-
name: string;
|
6
|
-
symbol: string;
|
7
|
-
}
|
8
|
-
|
9
|
-
// Currencies object interface
|
10
|
-
export interface ICountryCurrencies {
|
11
|
-
[key: string]: ICountryCurrency | undefined;
|
12
|
-
}
|
13
|
-
|
14
|
-
// Demonym interface
|
15
|
-
export interface ICountryDemonym {
|
16
|
-
f: string;
|
17
|
-
m: string;
|
18
|
-
}
|
19
|
-
|
20
|
-
// Demonyms object interface
|
21
|
-
export interface ICountryDemonyms {
|
22
|
-
[key: string]: ICountryDemonym;
|
23
|
-
}
|
24
|
-
|
25
|
-
export interface ICountryNameTranslation {
|
26
|
-
official: string;
|
27
|
-
common: string;
|
28
|
-
}
|
29
|
-
|
30
|
-
export interface ICountryNativeName {
|
31
|
-
[key: string]: ICountryNameTranslation | undefined;
|
32
|
-
}
|
33
|
-
|
34
|
-
export interface ICountryName {
|
35
|
-
common: string;
|
36
|
-
official: string;
|
37
|
-
native: ICountryNativeName;
|
38
|
-
}
|
39
|
-
|
40
|
-
// Country name translation interface
|
41
|
-
export interface ICountryTranslations {
|
42
|
-
ara?: ICountryNameTranslation; // Arabic
|
43
|
-
bel?: ICountryNameTranslation; // Belarusian
|
44
|
-
bre?: ICountryNameTranslation; // Breton
|
45
|
-
bul?: ICountryNameTranslation; // Bulgarian
|
46
|
-
ces?: ICountryNameTranslation; // Czech
|
47
|
-
deu?: ICountryNameTranslation; // German
|
48
|
-
ell?: ICountryNameTranslation; // Greek
|
49
|
-
eng?: ICountryNameTranslation; // English
|
50
|
-
est?: ICountryNameTranslation; // Estonian
|
51
|
-
fin?: ICountryNameTranslation; // Finnish
|
52
|
-
fra?: ICountryNameTranslation; // French
|
53
|
-
heb?: ICountryNameTranslation; // Hebrew
|
54
|
-
hrv?: ICountryNameTranslation; // Croatian
|
55
|
-
hun?: ICountryNameTranslation; // Hungarian
|
56
|
-
ita?: ICountryNameTranslation; // Italian
|
57
|
-
jpn?: ICountryNameTranslation; // Japanese
|
58
|
-
kor?: ICountryNameTranslation; // Korean
|
59
|
-
nld?: ICountryNameTranslation; // Dutch
|
60
|
-
per?: ICountryNameTranslation; // Persian
|
61
|
-
pol?: ICountryNameTranslation; // Polish
|
62
|
-
por?: ICountryNameTranslation; // Portuguese
|
63
|
-
ron?: ICountryNameTranslation; // Romanian
|
64
|
-
rus?: ICountryNameTranslation; // Russian
|
65
|
-
slk?: ICountryNameTranslation; // Slovak
|
66
|
-
spa?: ICountryNameTranslation; // Spanish
|
67
|
-
srp?: ICountryNameTranslation; // Serbian
|
68
|
-
swe?: ICountryNameTranslation; // Swedish
|
69
|
-
tur?: ICountryNameTranslation; // Turkish
|
70
|
-
ukr?: ICountryNameTranslation; // Ukrainian
|
71
|
-
urd?: ICountryNameTranslation; // Urdu
|
72
|
-
zho?: ICountryNameTranslation; // Chinese
|
73
|
-
'zho-Hans'?: ICountryNameTranslation; // Simplified Chinese
|
74
|
-
'zho-Hant'?: ICountryNameTranslation; // Traditional Chinese
|
75
|
-
}
|
76
|
-
|
77
|
-
// Languages object interface
|
78
|
-
export interface ICountryLanguages {
|
79
|
-
[key: string]: string;
|
80
|
-
}
|
81
|
-
|
82
|
-
// Complete Country interface matching countries.json structure
|
83
|
-
export interface ICountry {
|
84
|
-
name: ICountryName;
|
85
|
-
tld: string[];
|
86
|
-
cca2: ICountryCca2;
|
87
|
-
ccn3: string;
|
88
|
-
cca3: string;
|
89
|
-
cioc: string;
|
90
|
-
independent: boolean;
|
91
|
-
status: string;
|
92
|
-
unMember: boolean;
|
93
|
-
unRegionalGroup: string;
|
94
|
-
currencies: ICountryCurrencies;
|
95
|
-
idd: {
|
96
|
-
root: string;
|
97
|
-
suffixes: string[];
|
98
|
-
};
|
99
|
-
capital: string[];
|
100
|
-
altSpellings: string[];
|
101
|
-
region: string;
|
102
|
-
subregion: string;
|
103
|
-
languages: ICountryLanguages;
|
104
|
-
translations: ICountryTranslations;
|
105
|
-
latlng: [number, number];
|
106
|
-
landlocked: boolean;
|
107
|
-
borders: string[];
|
108
|
-
area: number;
|
109
|
-
flag: string;
|
110
|
-
demonyms: ICountryDemonyms;
|
111
|
-
}
|
1
|
+
import {ICountryCca2} from './countryCca2';
|
2
|
+
|
3
|
+
// Currency interface
|
4
|
+
export interface ICountryCurrency {
|
5
|
+
name: string;
|
6
|
+
symbol: string;
|
7
|
+
}
|
8
|
+
|
9
|
+
// Currencies object interface
|
10
|
+
export interface ICountryCurrencies {
|
11
|
+
[key: string]: ICountryCurrency | undefined;
|
12
|
+
}
|
13
|
+
|
14
|
+
// Demonym interface
|
15
|
+
export interface ICountryDemonym {
|
16
|
+
f: string;
|
17
|
+
m: string;
|
18
|
+
}
|
19
|
+
|
20
|
+
// Demonyms object interface
|
21
|
+
export interface ICountryDemonyms {
|
22
|
+
[key: string]: ICountryDemonym;
|
23
|
+
}
|
24
|
+
|
25
|
+
export interface ICountryNameTranslation {
|
26
|
+
official: string;
|
27
|
+
common: string;
|
28
|
+
}
|
29
|
+
|
30
|
+
export interface ICountryNativeName {
|
31
|
+
[key: string]: ICountryNameTranslation | undefined;
|
32
|
+
}
|
33
|
+
|
34
|
+
export interface ICountryName {
|
35
|
+
common: string;
|
36
|
+
official: string;
|
37
|
+
native: ICountryNativeName;
|
38
|
+
}
|
39
|
+
|
40
|
+
// Country name translation interface
|
41
|
+
export interface ICountryTranslations {
|
42
|
+
ara?: ICountryNameTranslation; // Arabic
|
43
|
+
bel?: ICountryNameTranslation; // Belarusian
|
44
|
+
bre?: ICountryNameTranslation; // Breton
|
45
|
+
bul?: ICountryNameTranslation; // Bulgarian
|
46
|
+
ces?: ICountryNameTranslation; // Czech
|
47
|
+
deu?: ICountryNameTranslation; // German
|
48
|
+
ell?: ICountryNameTranslation; // Greek
|
49
|
+
eng?: ICountryNameTranslation; // English
|
50
|
+
est?: ICountryNameTranslation; // Estonian
|
51
|
+
fin?: ICountryNameTranslation; // Finnish
|
52
|
+
fra?: ICountryNameTranslation; // French
|
53
|
+
heb?: ICountryNameTranslation; // Hebrew
|
54
|
+
hrv?: ICountryNameTranslation; // Croatian
|
55
|
+
hun?: ICountryNameTranslation; // Hungarian
|
56
|
+
ita?: ICountryNameTranslation; // Italian
|
57
|
+
jpn?: ICountryNameTranslation; // Japanese
|
58
|
+
kor?: ICountryNameTranslation; // Korean
|
59
|
+
nld?: ICountryNameTranslation; // Dutch
|
60
|
+
per?: ICountryNameTranslation; // Persian
|
61
|
+
pol?: ICountryNameTranslation; // Polish
|
62
|
+
por?: ICountryNameTranslation; // Portuguese
|
63
|
+
ron?: ICountryNameTranslation; // Romanian
|
64
|
+
rus?: ICountryNameTranslation; // Russian
|
65
|
+
slk?: ICountryNameTranslation; // Slovak
|
66
|
+
spa?: ICountryNameTranslation; // Spanish
|
67
|
+
srp?: ICountryNameTranslation; // Serbian
|
68
|
+
swe?: ICountryNameTranslation; // Swedish
|
69
|
+
tur?: ICountryNameTranslation; // Turkish
|
70
|
+
ukr?: ICountryNameTranslation; // Ukrainian
|
71
|
+
urd?: ICountryNameTranslation; // Urdu
|
72
|
+
zho?: ICountryNameTranslation; // Chinese
|
73
|
+
'zho-Hans'?: ICountryNameTranslation; // Simplified Chinese
|
74
|
+
'zho-Hant'?: ICountryNameTranslation; // Traditional Chinese
|
75
|
+
}
|
76
|
+
|
77
|
+
// Languages object interface
|
78
|
+
export interface ICountryLanguages {
|
79
|
+
[key: string]: string;
|
80
|
+
}
|
81
|
+
|
82
|
+
// Complete Country interface matching countries.json structure
|
83
|
+
export interface ICountry {
|
84
|
+
name: ICountryName;
|
85
|
+
tld: string[];
|
86
|
+
cca2: ICountryCca2;
|
87
|
+
ccn3: string;
|
88
|
+
cca3: string;
|
89
|
+
cioc: string;
|
90
|
+
independent: boolean;
|
91
|
+
status: string;
|
92
|
+
unMember: boolean;
|
93
|
+
unRegionalGroup: string;
|
94
|
+
currencies: ICountryCurrencies;
|
95
|
+
idd: {
|
96
|
+
root: string;
|
97
|
+
suffixes: string[];
|
98
|
+
};
|
99
|
+
capital: string[];
|
100
|
+
altSpellings: string[];
|
101
|
+
region: string;
|
102
|
+
subregion: string;
|
103
|
+
languages: ICountryLanguages;
|
104
|
+
translations: ICountryTranslations;
|
105
|
+
latlng: [number, number];
|
106
|
+
landlocked: boolean;
|
107
|
+
borders: string[];
|
108
|
+
area: number;
|
109
|
+
flag: string;
|
110
|
+
demonyms: ICountryDemonyms;
|
111
|
+
}
|