<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
import React, { useState } from 'react';
import { StyleSheet, View, Image, Text, TouchableOpacity } from 'react-native';
import CountryPicker, { Flag } from 'react-native-country-picker-modal';
import imagePath from '../constants/imagePath';
import colors from '../styles/colors';
import { moderateScale, moderateScaleVertical, width } from '../styles/responsiveSize';
function CountryCodePicker() {
const [countryCode, setCountryCode] = useState('91');
const [countryFlag, setCountryFlag] = useState('IN');
const onSelect = country => {
setCountryFlag(country.cca2);
setCountryCode(country.callingCode[0]);
};
return (
<>
<View style={style.countryview}>
<CountryPicker
onSelect={onSelect}
visible={false}
countryCode={countryFlag}
withCallingCode={true}
withCallingCodeButton={countryCode}
withEmoji={true}
theme={{
onBackgroundTextColor: 'white',
backgroundColor: colors.themeColor
}}
/>
<Image
