From 38af98aca9f721659dc7a4bb0009763a96813186 Mon Sep 17 00:00:00 2001 From: Patrick Trang Date: Sun, 26 Aug 2018 15:37:40 -0700 Subject: [PATCH 01/14] rn0.54+ - optionwidget properly centered --- widgets/OptionWidget.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/widgets/OptionWidget.js b/widgets/OptionWidget.js index 34210ae..b507fea 100644 --- a/widgets/OptionWidget.js +++ b/widgets/OptionWidget.js @@ -98,7 +98,7 @@ module.exports = createReactClass({ switchTitle: { fontSize: 15, color: '#000', - flex: 0.7, + flex: 1, paddingLeft: 10, }, }, From 7cd88b77494c987df641f10cf11543564d7636ef Mon Sep 17 00:00:00 2001 From: Patrick Trang Date: Wed, 20 Nov 2019 17:18:54 -0700 Subject: [PATCH 02/14] @ptrang --- package.json | 13 ++++++++----- 1 file changed, 8 insertions(+), 5 deletions(-) diff --git a/package.json b/package.json index a7ecec0..7fcdbd0 100644 --- a/package.json +++ b/package.json @@ -1,5 +1,5 @@ { - "name": "react-native-gifted-form", + "name": "@ptrang/react-native-gifted-form", "version": "0.1.1", "description": "Form component for React Native", "main": "GiftedForm.js", @@ -8,7 +8,7 @@ }, "repository": { "type": "git", - "url": "git+https://github.com/FaridSafi/react-native-gifted-form.git" + "url": "git+https://github.com/ptrang/react-native-gifted-form.git" }, "keywords": [ "form", @@ -18,12 +18,12 @@ "ios", "android" ], - "author": "Farid from Safi", + "author": "clone of farid", "license": "MIT", "bugs": { - "url": "https://github.com/FaridSafi/react-native-gifted-form/issues" + "url": "https://github.com/ptrang/react-native-gifted-form/issues" }, - "homepage": "https://github.com/FaridSafi/react-native-gifted-form#readme", + "homepage": "https://github.com/ptrang/react-native-gifted-form#readme", "dependencies": { "apsl-react-native-button": "^3.1.0", "create-react-class": "^15.6.2", @@ -34,5 +34,8 @@ "react-native-google-places-autocomplete": "^1.3.6", "react-timer-mixin": "~0.13.3", "validator": "^9.0.0" + }, + "directories": { + "example": "example" } } From bef00c136892bd90f76c0cb51f389a0feb3f5552 Mon Sep 17 00:00:00 2001 From: Patrick Trang Date: Mon, 2 Dec 2019 15:55:59 -0700 Subject: [PATCH 03/14] add google places autocomplete ref --- package.json | 2 +- widgets/GooglePlacesWidget.js | 49 +++++++++++++++++++---------------- 2 files changed, 28 insertions(+), 23 deletions(-) diff --git a/package.json b/package.json index 7fcdbd0..9221671 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@ptrang/react-native-gifted-form", - "version": "0.1.1", + "version": "0.1.2", "description": "Form component for React Native", "main": "GiftedForm.js", "scripts": { diff --git a/widgets/GooglePlacesWidget.js b/widgets/GooglePlacesWidget.js index 753fd36..8aab76d 100644 --- a/widgets/GooglePlacesWidget.js +++ b/widgets/GooglePlacesWidget.js @@ -3,29 +3,34 @@ import createReactClass from 'create-react-class'; var WidgetMixin = require('../mixins/WidgetMixin.js'); -var {GooglePlacesAutocomplete} = require('react-native-google-places-autocomplete'); - +var { + GooglePlacesAutocomplete +} = require('react-native-google-places-autocomplete'); module.exports = createReactClass({ mixins: [WidgetMixin], getDefaultProps() { return { - type: 'GooglePlacesWidget', + type: 'GooglePlacesWidget' }; }, render() { - const everywhere = {description: 'Everywhere', geometry: { location: { lat: 0, lng: 0 } }}; - + const everywhere = { + description: 'Everywhere', + geometry: { location: { lat: 0, lng: 0 } } + }; return ( { // details is provided when fetchDetails = true + onPress={(data, details = {}) => { + // details is provided when fetchDetails = true // console.log(details); this._onChange({ name: details.formatted_address, @@ -42,33 +47,33 @@ module.exports = createReactClass({ query={this.props.query} styles={{ description: { - fontWeight: 'bold', + fontWeight: 'bold' }, predefinedPlacesDescription: { - color: '#1faadb', - }, + color: '#1faadb' + } }} - currentLocation={true} // Will add a 'Current location' button at the top of the predefined places list currentLocationLabel="Current location" - currentLocationAPI='GoogleReverseGeocoding' // Which API to use: GoogleReverseGeocoding or GooglePlacesSearch - GoogleReverseGeocodingQuery={{ - // available options for GoogleReverseGeocoding API : https://developers.google.com/maps/documentation/geocoding/intro - }} + currentLocationAPI="GoogleReverseGeocoding" // Which API to use: GoogleReverseGeocoding or GooglePlacesSearch + GoogleReverseGeocodingQuery={ + { + // available options for GoogleReverseGeocoding API : https://developers.google.com/maps/documentation/geocoding/intro + } + } GooglePlacesSearchQuery={{ // available options for GooglePlacesSearch API : https://developers.google.com/places/web-service/search rankby: 'distance', - types: 'food', + types: 'food' }} - - - filterReverseGeocodingByTypes={['locality', 'administrative_area_level_3']} // filter the reverse geocoding results by types - ['locality', 'administrative_area_level_3'] if you want to display only cities - + filterReverseGeocodingByTypes={[ + 'locality', + 'administrative_area_level_3' + ]} // filter the reverse geocoding results by types - ['locality', 'administrative_area_level_3'] if you want to display only cities // predefinedPlaces={[everywhere]} - {...this.props} // @todo test sans (need for 'name') /> ); - }, + } }); From aaad96f89ac5f9f1832a7dd2c1c4bdaed05e595c Mon Sep 17 00:00:00 2001 From: Patrick Trang Date: Mon, 2 Dec 2019 16:20:00 -0700 Subject: [PATCH 04/14] "contain" --- mixins/WidgetMixin.js | 75 +++- widgets/GooglePlacesWidget.js | 49 +- widgets/ModalWidget.js | 131 +++--- widgets/OptionWidget.js | 43 +- widgets/RowWidget.js | 33 +- widgets/SelectCountryWidget.js | 796 ++++++++++++++++++++------------- 6 files changed, 675 insertions(+), 452 deletions(-) diff --git a/mixins/WidgetMixin.js b/mixins/WidgetMixin.js index e6d9339..e34c349 100644 --- a/mixins/WidgetMixin.js +++ b/mixins/WidgetMixin.js @@ -2,14 +2,12 @@ import React from 'react'; import PropTypes from 'prop-types'; import { Image } from 'react-native'; - var GiftedFormManager = require('../GiftedFormManager'); module.exports = { - getInitialState() { return { - validationErrorMessage: null, + validationErrorMessage: null }; }, @@ -27,7 +25,7 @@ module.exports = { onBlur: PropTypes.func, validateOnEmpty: PropTypes.bool, // If we want to store the state elsewhere (Redux store, for instance), we can use value and Form's onValueChange prop - value: PropTypes.any, + value: PropTypes.any }, getDefaultProps() { @@ -43,7 +41,7 @@ module.exports = { navigator: null, onFocus: () => {}, onBlur: () => {}, - validateOnEmpty: false, + validateOnEmpty: false }; }, @@ -58,7 +56,7 @@ module.exports = { if (typeof formState !== 'undefined') { if (typeof formState.values[this.props.name] !== 'undefined') { this.setState({ - value: formState.values[this.props.name], + value: formState.values[this.props.name] }); this._validate(formState.values[this.props.name]); } @@ -66,7 +64,10 @@ module.exports = { }, componentWillReceiveProps(nextProps) { - if (typeof nextProps.value !== 'undefined' && nextProps.value !== this.props.value) { + if ( + typeof nextProps.value !== 'undefined' && + nextProps.value !== this.props.value + ) { this._onChange(nextProps.value); } }, @@ -92,7 +93,10 @@ module.exports = { for (let i = 0; i < styleNames.length; i++) { if (typeof this.props.formStyles[this.props.type] !== 'undefined') { - if (typeof this.props.formStyles[this.props.type][styleNames[i]] !== 'undefined') { + if ( + typeof this.props.formStyles[this.props.type][styleNames[i]] !== + 'undefined' + ) { styles.push(this.props.formStyles[this.props.type][styleNames[i]]); } } @@ -108,7 +112,7 @@ module.exports = { }, focus() { - this.refs.input && this.refs.input.focus() + this.refs.input && this.refs.input.focus(); }, _validate(value) { @@ -117,10 +121,17 @@ module.exports = { } // @todo option for live validation ? - var validators = GiftedFormManager.getValidators(this.props.formName, this.props.name); + var validators = GiftedFormManager.getValidators( + this.props.formName, + this.props.name + ); if (Array.isArray(validators.validate)) { if (validators.validate.length > 0) { - var validation = GiftedFormManager.validateAndParseOne(this.props.name, value, {validate: validators.validate, title: validators.title}); + var validation = GiftedFormManager.validateAndParseOne( + this.props.name, + value, + { validate: validators.validate, title: validators.title } + ); if (validation.isValid === false) { this.setState({ validationErrorMessage: validation.message @@ -158,7 +169,8 @@ module.exports = { // @todo options enable live checking _renderValidationError() { - let hasValue = typeof this.state.value !== 'undefined' && this.state.value !== ''; + let hasValue = + typeof this.state.value !== 'undefined' && this.state.value !== ''; if (this.props.validateOnEmpty) { hasValue = true; @@ -168,7 +180,9 @@ module.exports = { return null; } - const hasValidationErrors = this.state.validationErrorMessage !== null && this.state.validationErrorMessage !== ''; + const hasValidationErrors = + this.state.validationErrorMessage !== null && + this.state.validationErrorMessage !== ''; if (!hasValidationErrors) { return null; @@ -187,9 +201,15 @@ module.exports = { var validators = null; if (this.props.displayValue) { // in case of modal widget - validators = GiftedFormManager.getValidators(this.props.formName, this.props.displayValue); + validators = GiftedFormManager.getValidators( + this.props.formName, + this.props.displayValue + ); } else { - validators = GiftedFormManager.getValidators(this.props.formName, this.props.name); + validators = GiftedFormManager.getValidators( + this.props.formName, + this.props.name + ); } let toValidate = false; @@ -202,7 +222,8 @@ module.exports = { // @todo image delete_sign / checkmark should be editable via option // @todo options enable live validation - let hasValue = typeof this.state.value !== 'undefined' && this.state.value !== ''; + let hasValue = + typeof this.state.value !== 'undefined' && this.state.value !== ''; if (this.props.validateOnEmpty) { hasValue = true; @@ -210,33 +231,41 @@ module.exports = { const hasValidationErrors = this.state.validationErrorMessage !== null; const hasImageProp = this.props.image !== null; - const isOptionWidget = this.props.type === 'OptionWidget' + const isOptionWidget = this.props.type === 'OptionWidget'; const shouldShowValidationImage = this.props.validationImage === true; - if (hasValue && hasImageProp && !isOptionWidget && shouldShowValidationImage && toValidate) { - const imageSrc = hasValidationErrors ? require('../icons/delete_sign.png'):require('../icons/checkmark.png'); + if ( + hasValue && + hasImageProp && + !isOptionWidget && + shouldShowValidationImage && + toValidate + ) { + const imageSrc = hasValidationErrors + ? require('../icons/delete_sign.png') + : require('../icons/checkmark.png'); return ( ); } else if (hasImageProp) { if (typeof this.props.image === 'object') { - return(this.props.image); + return this.props.image; } return ( ); } return null; - }, + } }; diff --git a/widgets/GooglePlacesWidget.js b/widgets/GooglePlacesWidget.js index 8aab76d..753fd36 100644 --- a/widgets/GooglePlacesWidget.js +++ b/widgets/GooglePlacesWidget.js @@ -3,34 +3,29 @@ import createReactClass from 'create-react-class'; var WidgetMixin = require('../mixins/WidgetMixin.js'); -var { - GooglePlacesAutocomplete -} = require('react-native-google-places-autocomplete'); +var {GooglePlacesAutocomplete} = require('react-native-google-places-autocomplete'); + module.exports = createReactClass({ mixins: [WidgetMixin], getDefaultProps() { return { - type: 'GooglePlacesWidget' + type: 'GooglePlacesWidget', }; }, render() { - const everywhere = { - description: 'Everywhere', - geometry: { location: { lat: 0, lng: 0 } } - }; + const everywhere = {description: 'Everywhere', geometry: { location: { lat: 0, lng: 0 } }}; + return ( { - // details is provided when fetchDetails = true + onPress={(data, details = {}) => { // details is provided when fetchDetails = true // console.log(details); this._onChange({ name: details.formatted_address, @@ -47,33 +42,33 @@ module.exports = createReactClass({ query={this.props.query} styles={{ description: { - fontWeight: 'bold' + fontWeight: 'bold', }, predefinedPlacesDescription: { - color: '#1faadb' - } + color: '#1faadb', + }, }} + currentLocation={true} // Will add a 'Current location' button at the top of the predefined places list currentLocationLabel="Current location" - currentLocationAPI="GoogleReverseGeocoding" // Which API to use: GoogleReverseGeocoding or GooglePlacesSearch - GoogleReverseGeocodingQuery={ - { - // available options for GoogleReverseGeocoding API : https://developers.google.com/maps/documentation/geocoding/intro - } - } + currentLocationAPI='GoogleReverseGeocoding' // Which API to use: GoogleReverseGeocoding or GooglePlacesSearch + GoogleReverseGeocodingQuery={{ + // available options for GoogleReverseGeocoding API : https://developers.google.com/maps/documentation/geocoding/intro + }} GooglePlacesSearchQuery={{ // available options for GooglePlacesSearch API : https://developers.google.com/places/web-service/search rankby: 'distance', - types: 'food' + types: 'food', }} - filterReverseGeocodingByTypes={[ - 'locality', - 'administrative_area_level_3' - ]} // filter the reverse geocoding results by types - ['locality', 'administrative_area_level_3'] if you want to display only cities + + + filterReverseGeocodingByTypes={['locality', 'administrative_area_level_3']} // filter the reverse geocoding results by types - ['locality', 'administrative_area_level_3'] if you want to display only cities + // predefinedPlaces={[everywhere]} + {...this.props} // @todo test sans (need for 'name') /> ); - } + }, }); diff --git a/widgets/ModalWidget.js b/widgets/ModalWidget.js index 6323f84..cba4525 100644 --- a/widgets/ModalWidget.js +++ b/widgets/ModalWidget.js @@ -8,7 +8,7 @@ import { Navigator, Image, TouchableOpacity, - PixelRatio, + PixelRatio } from 'react-native'; var WidgetMixin = require('../mixins/WidgetMixin'); @@ -54,7 +54,7 @@ module.exports = createReactClass({ return ( ); @@ -63,26 +63,21 @@ module.exports = createReactClass({ }, onPress() { - // title={this.props.title} // @todo working ? var _self = this; - var { - GiftedFormModal - } = require('../GiftedForm.js'); - + var { GiftedFormModal } = require('../GiftedForm.js'); var route = { onClose: _self.onClose, renderScene(navigator) { // not passing onFocus/onBlur of the current scene to the new scene - var {onFocus, onBlur, ...others} = _self.props; + var { onFocus, onBlur, ...others } = _self.props; return ( @@ -137,28 +132,30 @@ module.exports = createReactClass({ style={{ width: 21, marginRight: 10, - tintColor: '#097881', + tintColor: '#097881' }} - resizeMode={Image.resizeMode.contain} + resizeMode="contain" source={require('../icons/check.png')} /> ); - }, + } }; // console.log('this.props.openModal from modal widget'); // console.log(typeof this.props.openModal); if (this.props.openModal === null) { - console.warn('GiftedForm: openModal prop is missing in GiftedForm component'); + console.warn( + 'GiftedForm: openModal prop is missing in GiftedForm component' + ); } else { this.props.openModal(route); } }, componentWillMount() { - this._childrenWithProps = React.Children.map(this.props.children, (child) => { + this._childrenWithProps = React.Children.map(this.props.children, child => { return React.cloneElement(child, { formStyles: this.props.formStyles, openModal: this.props.openModal, @@ -169,25 +166,25 @@ module.exports = createReactClass({ onValidation: this.props.onValidation, onValueChange: this.props.onValueChange, - onClose: this.onClose, + onClose: this.onClose }); }); }, componentDidMount() { this.setState({ - value: this._getDisplayableValue(), + value: this._getDisplayableValue() }); }, onClose(value, navigator = null) { if (typeof value === 'string') { this.setState({ - value: value, + value: value }); } else if (this.props.displayValue !== '') { this.setState({ - value: this._getDisplayableValue(), + value: this._getDisplayableValue() }); } @@ -200,19 +197,40 @@ module.exports = createReactClass({ refreshDisplayableValue() { this.setState({ - value: this._getDisplayableValue(), + value: this._getDisplayableValue() }); }, _getDisplayableValue() { if (this.props.displayValue !== '') { - if (typeof GiftedFormManager.stores[this.props.formName] !== 'undefined') { - if (typeof GiftedFormManager.stores[this.props.formName].values !== 'undefined') { - if (typeof GiftedFormManager.stores[this.props.formName].values[this.props.displayValue] !== 'undefined') { + if ( + typeof GiftedFormManager.stores[this.props.formName] !== 'undefined' + ) { + if ( + typeof GiftedFormManager.stores[this.props.formName].values !== + 'undefined' + ) { + if ( + typeof GiftedFormManager.stores[this.props.formName].values[ + this.props.displayValue + ] !== 'undefined' + ) { if (typeof this.props.transformValue === 'function') { - return this.props.transformValue(GiftedFormManager.stores[this.props.formName].values[this.props.displayValue]); - } else if (GiftedFormManager.stores[this.props.formName].values[this.props.displayValue] instanceof Date) { - return moment(GiftedFormManager.stores[this.props.formName].values[this.props.displayValue]).calendar(null, { + return this.props.transformValue( + GiftedFormManager.stores[this.props.formName].values[ + this.props.displayValue + ] + ); + } else if ( + GiftedFormManager.stores[this.props.formName].values[ + this.props.displayValue + ] instanceof Date + ) { + return moment( + GiftedFormManager.stores[this.props.formName].values[ + this.props.displayValue + ] + ).calendar(null, { sameDay: '[Today]', nextDay: '[Tomorrow]', nextWeek: 'dddd', @@ -220,8 +238,14 @@ module.exports = createReactClass({ lastWeek: '[Last] dddd' }); } - if (typeof GiftedFormManager.stores[this.props.formName].values[this.props.displayValue] === 'string') { - return GiftedFormManager.stores[this.props.formName].values[this.props.displayValue].trim(); + if ( + typeof GiftedFormManager.stores[this.props.formName].values[ + this.props.displayValue + ] === 'string' + ) { + return GiftedFormManager.stores[this.props.formName].values[ + this.props.displayValue + ].trim(); } } else { // @todo merge with when not select menu @@ -233,20 +257,25 @@ module.exports = createReactClass({ if (typeof values === 'object') { if (typeof values[this.props.displayValue] !== 'undefined') { if (typeof this.props.transformValue === 'function') { - return this.props.transformValue(values[this.props.displayValue]); + return this.props.transformValue( + values[this.props.displayValue] + ); } else { if (Array.isArray(values[this.props.displayValue])) { // @todo // should return the title and not the value in case of select menu return values[this.props.displayValue].join(', '); } else if (values[this.props.displayValue] instanceof Date) { - return moment(values[this.props.displayValue]).calendar(null, { - sameDay: '[Today]', - nextDay: '[Tomorrow]', - nextWeek: 'dddd', - lastDay: '[Yesterday]', - lastWeek: '[Last] dddd' - }); + return moment(values[this.props.displayValue]).calendar( + null, + { + sameDay: '[Today]', + nextDay: '[Tomorrow]', + nextWeek: 'dddd', + lastDay: '[Yesterday]', + lastWeek: '[Last] dddd' + } + ); } else { return values[this.props.displayValue]; } @@ -269,16 +298,18 @@ module.exports = createReactClass({ }); }} underlayColor={this.getStyle('underlayColor').pop()} - {...this.props} // mainly for underlayColor - style={this.getStyle('rowContainer')} > {this._renderImage()} - {this.props.title} + + {this.props.title} + - {this.state.value} + + {this.state.value} + {this.renderDisclosure()} @@ -290,38 +321,38 @@ module.exports = createReactClass({ rowImage: { height: 20, width: 20, - marginLeft: 10, + marginLeft: 10 }, rowContainer: { backgroundColor: '#FFF', borderBottomWidth: 1 / PixelRatio.get(), - borderColor: '#c8c7cc', + borderColor: '#c8c7cc' }, underlayColor: '#c7c7cc', row: { flexDirection: 'row', height: 44, - alignItems: 'center', + alignItems: 'center' }, disclosure: { // transform: [{rotate: '90deg'}], marginLeft: 10, marginRight: 10, - width: 11, + width: 11 }, modalTitle: { flex: 1, fontSize: 15, color: '#000', - paddingLeft: 10, + paddingLeft: 10 }, alignRight: { - alignItems: 'flex-end', + alignItems: 'flex-end' // width: 110, }, modalValue: { fontSize: 15, - color: '#c7c7cc', - }, - }, + color: '#c7c7cc' + } + } }); diff --git a/widgets/OptionWidget.js b/widgets/OptionWidget.js index b507fea..482d41d 100644 --- a/widgets/OptionWidget.js +++ b/widgets/OptionWidget.js @@ -10,49 +10,47 @@ import { var WidgetMixin = require('../mixins/WidgetMixin.js'); - - module.exports = createReactClass({ mixins: [WidgetMixin], - + getDefaultProps() { - return ({ + return { // onChange: null, - type: 'OptionWidget', - }); + type: 'OptionWidget' + }; }, - + _renderCheckmark() { if (this.state.value === true) { return ( ); } return null; }, - + _onClose() { if (this.props.multiple === false) { this.props.unSelectAll(); this._onChange(true); - + if (typeof this.props.onSelect === 'function') { // console.log('onSelect'); this.props.onSelect(this.props.value); } - + if (typeof this.props.onClose === 'function') { this.props.onClose(this.props.title, this.props.navigator); } } else { - this._onChange(!this.state.value) + this._onChange(!this.state.value); } }, - + render() { return ( @@ -67,40 +65,39 @@ module.exports = createReactClass({ {this.props.title} {this._renderCheckmark()} - + ); }, - + defaultStyles: { rowImage: { height: 20, width: 20, - marginLeft: 10, + marginLeft: 10 }, checkmark: { width: 23, marginRight: 10, - marginLeft: 10, + marginLeft: 10 }, rowContainer: { backgroundColor: '#FFF', borderBottomWidth: 1 / PixelRatio.get(), - borderColor: '#c8c7cc', + borderColor: '#c8c7cc' }, row: { flexDirection: 'row', height: 44, - alignItems: 'center', + alignItems: 'center' }, underlayColor: '#c7c7cc', switchTitle: { fontSize: 15, color: '#000', flex: 1, - paddingLeft: 10, - }, - }, + paddingLeft: 10 + } + } }); - diff --git a/widgets/RowWidget.js b/widgets/RowWidget.js index c0a35bb..26dbc9f 100644 --- a/widgets/RowWidget.js +++ b/widgets/RowWidget.js @@ -11,31 +11,30 @@ import { var WidgetMixin = require('../mixins/WidgetMixin.js'); var TimerMixin = require('react-timer-mixin'); - module.exports = createReactClass({ mixins: [TimerMixin, WidgetMixin], - + getDefaultProps() { return { type: 'RowWidget', onPress: () => {}, - disclosure: true, + disclosure: true }; }, - + _renderDisclosure() { if (this.props.disclosure === true) { return ( ); } return null; }, - + render() { return ( @@ -50,42 +49,44 @@ module.exports = createReactClass({ > {this._renderImage()} - {this.props.title} + + {this.props.title} + {this._renderDisclosure()} ); }, - + defaultStyles: { rowImage: { height: 20, width: 20, - marginLeft: 10, + marginLeft: 10 }, rowContainer: { backgroundColor: '#FFF', borderBottomWidth: 1 / PixelRatio.get(), - borderColor: '#c8c7cc', + borderColor: '#c8c7cc' }, row: { flexDirection: 'row', height: 44, - alignItems: 'center', + alignItems: 'center' }, underlayColor: '#c7c7cc', disclosure: { - transform: [{rotate: '-90deg'}], + transform: [{ rotate: '-90deg' }], marginLeft: 10, marginRight: 10, - width: 11, + width: 11 }, title: { flex: 1, fontSize: 15, color: '#000', - paddingLeft: 10, - }, - }, + paddingLeft: 10 + } + } }); diff --git a/widgets/SelectCountryWidget.js b/widgets/SelectCountryWidget.js index 130d8f8..93f886f 100644 --- a/widgets/SelectCountryWidget.js +++ b/widgets/SelectCountryWidget.js @@ -1,266 +1,441 @@ import React from 'react'; import createReactClass from 'create-react-class'; import { - View, ListView, Text, TouchableHighlight, TextInput, Image, PixelRatio + View, + ListView, + Text, + TouchableHighlight, + TextInput, + Image, + PixelRatio } from 'react-native'; var WidgetMixin = require('../mixins/WidgetMixin.js'); var OptionWidget = require('./OptionWidget.js'); // countries list from https://www.iso.org/obp/ui/#search -var countries = -[{"name": "Afghanistan", "alpha2": "AF", "alpha3": "AFG", "numeric": 4}, -{"name": "Åland Islands", "alpha2": "AX", "alpha3": "ALA", "numeric": 248}, -{"name": "Albania", "alpha2": "AL", "alpha3": "ALB", "numeric": 8}, -{"name": "Algeria", "alpha2": "DZ", "alpha3": "DZA", "numeric": 12}, -{"name": "American Samoa", "alpha2": "AS", "alpha3": "ASM", "numeric": 16}, -{"name": "Andorra", "alpha2": "AD", "alpha3": "AND", "numeric": 20}, -{"name": "Angola", "alpha2": "AO", "alpha3": "AGO", "numeric": 24}, -{"name": "Anguilla", "alpha2": "AI", "alpha3": "AIA", "numeric": 660}, -{"name": "Antarctica", "alpha2": "AQ", "alpha3": "ATA", "numeric": 10}, -{"name": "Antigua and Barbuda", "alpha2": "AG", "alpha3": "ATG", "numeric": 28}, -{"name": "Argentina", "alpha2": "AR", "alpha3": "ARG", "numeric": 32}, -{"name": "Armenia", "alpha2": "AM", "alpha3": "ARM", "numeric": 51}, -{"name": "Aruba", "alpha2": "AW", "alpha3": "ABW", "numeric": 533}, -{"name": "Australia", "alpha2": "AU", "alpha3": "AUS", "numeric": 36}, -{"name": "Austria", "alpha2": "AT", "alpha3": "AUT", "numeric": 40}, -{"name": "Azerbaijan", "alpha2": "AZ", "alpha3": "AZE", "numeric": 31}, -{"name": "Bahamas (the)", "alpha2": "BS", "alpha3": "BHS", "numeric": 44}, -{"name": "Bahrain", "alpha2": "BH", "alpha3": "BHR", "numeric": 48}, -{"name": "Bangladesh", "alpha2": "BD", "alpha3": "BGD", "numeric": 50}, -{"name": "Barbados", "alpha2": "BB", "alpha3": "BRB", "numeric": 52}, -{"name": "Belarus", "alpha2": "BY", "alpha3": "BLR", "numeric": 112}, -{"name": "Belgium", "alpha2": "BE", "alpha3": "BEL", "numeric": 56}, -{"name": "Belize", "alpha2": "BZ", "alpha3": "BLZ", "numeric": 84}, -{"name": "Benin", "alpha2": "BJ", "alpha3": "BEN", "numeric": 204}, -{"name": "Bermuda", "alpha2": "BM", "alpha3": "BMU", "numeric": 60}, -{"name": "Bhutan", "alpha2": "BT", "alpha3": "BTN", "numeric": 64}, -{"name": "Bolivia (Plurinational State of)", "alpha2": "BO", "alpha3": "BOL", "numeric": 68}, -{"name": "Bonaire, Sint Eustatius and Saba", "alpha2": "BQ", "alpha3": "BES", "numeric": 535}, -{"name": "Bosnia and Herzegovina", "alpha2": "BA", "alpha3": "BIH", "numeric": 70}, -{"name": "Botswana", "alpha2": "BW", "alpha3": "BWA", "numeric": 72}, -{"name": "Bouvet Island", "alpha2": "BV", "alpha3": "BVT", "numeric": 74}, -{"name": "Brazil", "alpha2": "BR", "alpha3": "BRA", "numeric": 76}, -{"name": "British Indian Ocean Territory (the)", "alpha2": "IO", "alpha3": "IOT", "numeric": 86}, -{"name": "Brunei Darussalam", "alpha2": "BN", "alpha3": "BRN", "numeric": 96}, -{"name": "Bulgaria", "alpha2": "BG", "alpha3": "BGR", "numeric": 100}, -{"name": "Burkina Faso", "alpha2": "BF", "alpha3": "BFA", "numeric": 854}, -{"name": "Burundi", "alpha2": "BI", "alpha3": "BDI", "numeric": 108}, -{"name": "Cabo Verde", "alpha2": "CV", "alpha3": "CPV", "numeric": 132}, -{"name": "Cambodia", "alpha2": "KH", "alpha3": "KHM", "numeric": 116}, -{"name": "Cameroon", "alpha2": "CM", "alpha3": "CMR", "numeric": 120}, -{"name": "Canada", "alpha2": "CA", "alpha3": "CAN", "numeric": 124}, -{"name": "Cayman Islands (the)", "alpha2": "KY", "alpha3": "CYM", "numeric": 136}, -{"name": "Central African Republic (the)", "alpha2": "CF", "alpha3": "CAF", "numeric": 140}, -{"name": "Chad", "alpha2": "TD", "alpha3": "TCD", "numeric": 148}, -{"name": "Chile", "alpha2": "CL", "alpha3": "CHL", "numeric": 152}, -{"name": "China", "alpha2": "CN", "alpha3": "CHN", "numeric": 156}, -{"name": "Christmas Island", "alpha2": "CX", "alpha3": "CXR", "numeric": 162}, -{"name": "Cocos (Keeling) Islands (the)", "alpha2": "CC", "alpha3": "CCK", "numeric": 166}, -{"name": "Colombia", "alpha2": "CO", "alpha3": "COL", "numeric": 170}, -{"name": "Comoros (the)", "alpha2": "KM", "alpha3": "COM", "numeric": 174}, -{"name": "Congo (the Democratic Republic of the)", "alpha2": "CD", "alpha3": "COD", "numeric": 180}, -{"name": "Congo (the)", "alpha2": "CG", "alpha3": "COG", "numeric": 178}, -{"name": "Cook Islands (the)", "alpha2": "CK", "alpha3": "COK", "numeric": 184}, -{"name": "Costa Rica", "alpha2": "CR", "alpha3": "CRI", "numeric": 188}, -{"name": "Côte d'Ivoire", "alpha2": "CI", "alpha3": "CIV", "numeric": 384}, -{"name": "Croatia", "alpha2": "HR", "alpha3": "HRV", "numeric": 191}, -{"name": "Cuba", "alpha2": "CU", "alpha3": "CUB", "numeric": 192}, -{"name": "Curaçao", "alpha2": "CW", "alpha3": "CUW", "numeric": 531}, -{"name": "Cyprus", "alpha2": "CY", "alpha3": "CYP", "numeric": 196}, -{"name": "Czech Republic (the)", "alpha2": "CZ", "alpha3": "CZE", "numeric": 203}, -{"name": "Denmark", "alpha2": "DK", "alpha3": "DNK", "numeric": 208}, -{"name": "Djibouti", "alpha2": "DJ", "alpha3": "DJI", "numeric": 262}, -{"name": "Dominica", "alpha2": "DM", "alpha3": "DMA", "numeric": 212}, -{"name": "Dominican Republic (the)", "alpha2": "DO", "alpha3": "DOM", "numeric": 214}, -{"name": "Ecuador", "alpha2": "EC", "alpha3": "ECU", "numeric": 218}, -{"name": "Egypt", "alpha2": "EG", "alpha3": "EGY", "numeric": 818}, -{"name": "El Salvador", "alpha2": "SV", "alpha3": "SLV", "numeric": 222}, -{"name": "Equatorial Guinea", "alpha2": "GQ", "alpha3": "GNQ", "numeric": 226}, -{"name": "Eritrea", "alpha2": "ER", "alpha3": "ERI", "numeric": 232}, -{"name": "Estonia", "alpha2": "EE", "alpha3": "EST", "numeric": 233}, -{"name": "Ethiopia", "alpha2": "ET", "alpha3": "ETH", "numeric": 231}, -{"name": "Falkland Islands (the) [Malvinas]", "alpha2": "FK", "alpha3": "FLK", "numeric": 238}, -{"name": "Faroe Islands (the)", "alpha2": "FO", "alpha3": "FRO", "numeric": 234}, -{"name": "Fiji", "alpha2": "FJ", "alpha3": "FJI", "numeric": 242}, -{"name": "Finland", "alpha2": "FI", "alpha3": "FIN", "numeric": 246}, -{"name": "France", "alpha2": "FR", "alpha3": "FRA", "numeric": 250}, -{"name": "French Guiana", "alpha2": "GF", "alpha3": "GUF", "numeric": 254}, -{"name": "French Polynesia", "alpha2": "PF", "alpha3": "PYF", "numeric": 258}, -{"name": "French Southern Territories (the)", "alpha2": "TF", "alpha3": "ATF", "numeric": 260}, -{"name": "Gabon", "alpha2": "GA", "alpha3": "GAB", "numeric": 266}, -{"name": "Gambia (the)", "alpha2": "GM", "alpha3": "GMB", "numeric": 270}, -{"name": "Georgia", "alpha2": "GE", "alpha3": "GEO", "numeric": 268}, -{"name": "Germany", "alpha2": "DE", "alpha3": "DEU", "numeric": 276}, -{"name": "Ghana", "alpha2": "GH", "alpha3": "GHA", "numeric": 288}, -{"name": "Gibraltar", "alpha2": "GI", "alpha3": "GIB", "numeric": 292}, -{"name": "Greece", "alpha2": "GR", "alpha3": "GRC", "numeric": 300}, -{"name": "Greenland", "alpha2": "GL", "alpha3": "GRL", "numeric": 304}, -{"name": "Grenada", "alpha2": "GD", "alpha3": "GRD", "numeric": 308}, -{"name": "Guadeloupe", "alpha2": "GP", "alpha3": "GLP", "numeric": 312}, -{"name": "Guam", "alpha2": "GU", "alpha3": "GUM", "numeric": 316}, -{"name": "Guatemala", "alpha2": "GT", "alpha3": "GTM", "numeric": 320}, -{"name": "Guernsey", "alpha2": "GG", "alpha3": "GGY", "numeric": 831}, -{"name": "Guinea", "alpha2": "GN", "alpha3": "GIN", "numeric": 324}, -{"name": "Guinea-Bissau", "alpha2": "GW", "alpha3": "GNB", "numeric": 624}, -{"name": "Guyana", "alpha2": "GY", "alpha3": "GUY", "numeric": 328}, -{"name": "Haiti", "alpha2": "HT", "alpha3": "HTI", "numeric": 332}, -{"name": "Heard Island and McDonald Islands", "alpha2": "HM", "alpha3": "HMD", "numeric": 334}, -{"name": "Holy See (the)", "alpha2": "VA", "alpha3": "VAT", "numeric": 336}, -{"name": "Honduras", "alpha2": "HN", "alpha3": "HND", "numeric": 340}, -{"name": "Hong Kong", "alpha2": "HK", "alpha3": "HKG", "numeric": 344}, -{"name": "Hungary", "alpha2": "HU", "alpha3": "HUN", "numeric": 348}, -{"name": "Iceland", "alpha2": "IS", "alpha3": "ISL", "numeric": 352}, -{"name": "India", "alpha2": "IN", "alpha3": "IND", "numeric": 356}, -{"name": "Indonesia", "alpha2": "ID", "alpha3": "IDN", "numeric": 360}, -{"name": "Iran (Islamic Republic of)", "alpha2": "IR", "alpha3": "IRN", "numeric": 364}, -{"name": "Iraq", "alpha2": "IQ", "alpha3": "IRQ", "numeric": 368}, -{"name": "Ireland", "alpha2": "IE", "alpha3": "IRL", "numeric": 372}, -{"name": "Isle of Man", "alpha2": "IM", "alpha3": "IMN", "numeric": 833}, -{"name": "Israel", "alpha2": "IL", "alpha3": "ISR", "numeric": 376}, -{"name": "Italy", "alpha2": "IT", "alpha3": "ITA", "numeric": 380}, -{"name": "Jamaica", "alpha2": "JM", "alpha3": "JAM", "numeric": 388}, -{"name": "Japan", "alpha2": "JP", "alpha3": "JPN", "numeric": 392}, -{"name": "Jersey", "alpha2": "JE", "alpha3": "JEY", "numeric": 832}, -{"name": "Jordan", "alpha2": "JO", "alpha3": "JOR", "numeric": 400}, -{"name": "Kazakhstan", "alpha2": "KZ", "alpha3": "KAZ", "numeric": 398}, -{"name": "Kenya", "alpha2": "KE", "alpha3": "KEN", "numeric": 404}, -{"name": "Kiribati", "alpha2": "KI", "alpha3": "KIR", "numeric": 296}, -{"name": "Korea (the Democratic People's Republic of)", "alpha2": "KP", "alpha3": "PRK", "numeric": 408}, -{"name": "Korea (the Republic of)", "alpha2": "KR", "alpha3": "KOR", "numeric": 410}, -{"name": "Kuwait", "alpha2": "KW", "alpha3": "KWT", "numeric": 414}, -{"name": "Kyrgyzstan", "alpha2": "KG", "alpha3": "KGZ", "numeric": 417}, -{"name": "Lao People's Democratic Republic (the)", "alpha2": "LA", "alpha3": "LAO", "numeric": 418}, -{"name": "Latvia", "alpha2": "LV", "alpha3": "LVA", "numeric": 428}, -{"name": "Lebanon", "alpha2": "LB", "alpha3": "LBN", "numeric": 422}, -{"name": "Lesotho", "alpha2": "LS", "alpha3": "LSO", "numeric": 426}, -{"name": "Liberia", "alpha2": "LR", "alpha3": "LBR", "numeric": 430}, -{"name": "Libya", "alpha2": "LY", "alpha3": "LBY", "numeric": 434}, -{"name": "Liechtenstein", "alpha2": "LI", "alpha3": "LIE", "numeric": 438}, -{"name": "Lithuania", "alpha2": "LT", "alpha3": "LTU", "numeric": 440}, -{"name": "Luxembourg", "alpha2": "LU", "alpha3": "LUX", "numeric": 442}, -{"name": "Macao", "alpha2": "MO", "alpha3": "MAC", "numeric": 446}, -{"name": "Macedonia (the former Yugoslav Republic of)", "alpha2": "MK", "alpha3": "MKD", "numeric": 807}, -{"name": "Madagascar", "alpha2": "MG", "alpha3": "MDG", "numeric": 450}, -{"name": "Malawi", "alpha2": "MW", "alpha3": "MWI", "numeric": 454}, -{"name": "Malaysia", "alpha2": "MY", "alpha3": "MYS", "numeric": 458}, -{"name": "Maldives", "alpha2": "MV", "alpha3": "MDV", "numeric": 462}, -{"name": "Mali", "alpha2": "ML", "alpha3": "MLI", "numeric": 466}, -{"name": "Malta", "alpha2": "MT", "alpha3": "MLT", "numeric": 470}, -{"name": "Marshall Islands (the)", "alpha2": "MH", "alpha3": "MHL", "numeric": 584}, -{"name": "Martinique", "alpha2": "MQ", "alpha3": "MTQ", "numeric": 474}, -{"name": "Mauritania", "alpha2": "MR", "alpha3": "MRT", "numeric": 478}, -{"name": "Mauritius", "alpha2": "MU", "alpha3": "MUS", "numeric": 480}, -{"name": "Mayotte", "alpha2": "YT", "alpha3": "MYT", "numeric": 175}, -{"name": "Mexico", "alpha2": "MX", "alpha3": "MEX", "numeric": 484}, -{"name": "Micronesia (Federated States of)", "alpha2": "FM", "alpha3": "FSM", "numeric": 583}, -{"name": "Moldova (the Republic of)", "alpha2": "MD", "alpha3": "MDA", "numeric": 498}, -{"name": "Monaco", "alpha2": "MC", "alpha3": "MCO", "numeric": 492}, -{"name": "Mongolia", "alpha2": "MN", "alpha3": "MNG", "numeric": 496}, -{"name": "Montenegro", "alpha2": "ME", "alpha3": "MNE", "numeric": 499}, -{"name": "Montserrat", "alpha2": "MS", "alpha3": "MSR", "numeric": 500}, -{"name": "Morocco", "alpha2": "MA", "alpha3": "MAR", "numeric": 504}, -{"name": "Mozambique", "alpha2": "MZ", "alpha3": "MOZ", "numeric": 508}, -{"name": "Myanmar", "alpha2": "MM", "alpha3": "MMR", "numeric": 104}, -{"name": "Namibia", "alpha2": "NA", "alpha3": "NAM", "numeric": 516}, -{"name": "Nauru", "alpha2": "NR", "alpha3": "NRU", "numeric": 520}, -{"name": "Nepal", "alpha2": "NP", "alpha3": "NPL", "numeric": 524}, -{"name": "Netherlands (the)", "alpha2": "NL", "alpha3": "NLD", "numeric": 528}, -{"name": "New Caledonia", "alpha2": "NC", "alpha3": "NCL", "numeric": 540}, -{"name": "New Zealand", "alpha2": "NZ", "alpha3": "NZL", "numeric": 554}, -{"name": "Nicaragua", "alpha2": "NI", "alpha3": "NIC", "numeric": 558}, -{"name": "Niger (the)", "alpha2": "NE", "alpha3": "NER", "numeric": 562}, -{"name": "Nigeria", "alpha2": "NG", "alpha3": "NGA", "numeric": 566}, -{"name": "Niue", "alpha2": "NU", "alpha3": "NIU", "numeric": 570}, -{"name": "Norfolk Island", "alpha2": "NF", "alpha3": "NFK", "numeric": 574}, -{"name": "Northern Mariana Islands (the)", "alpha2": "MP", "alpha3": "MNP", "numeric": 580}, -{"name": "Norway", "alpha2": "NO", "alpha3": "NOR", "numeric": 578}, -{"name": "Oman", "alpha2": "OM", "alpha3": "OMN", "numeric": 512}, -{"name": "Pakistan", "alpha2": "PK", "alpha3": "PAK", "numeric": 586}, -{"name": "Palau", "alpha2": "PW", "alpha3": "PLW", "numeric": 585}, -{"name": "Palestine, State of", "alpha2": "PS", "alpha3": "PSE", "numeric": 275}, -{"name": "Panama", "alpha2": "PA", "alpha3": "PAN", "numeric": 591}, -{"name": "Papua New Guinea", "alpha2": "PG", "alpha3": "PNG", "numeric": 598}, -{"name": "Paraguay", "alpha2": "PY", "alpha3": "PRY", "numeric": 600}, -{"name": "Peru", "alpha2": "PE", "alpha3": "PER", "numeric": 604}, -{"name": "Philippines (the)", "alpha2": "PH", "alpha3": "PHL", "numeric": 608}, -{"name": "Pitcairn", "alpha2": "PN", "alpha3": "PCN", "numeric": 612}, -{"name": "Poland", "alpha2": "PL", "alpha3": "POL", "numeric": 616}, -{"name": "Portugal", "alpha2": "PT", "alpha3": "PRT", "numeric": 620}, -{"name": "Puerto Rico", "alpha2": "PR", "alpha3": "PRI", "numeric": 630}, -{"name": "Qatar", "alpha2": "QA", "alpha3": "QAT", "numeric": 634}, -{"name": "Réunion", "alpha2": "RE", "alpha3": "REU", "numeric": 638}, -{"name": "Romania", "alpha2": "RO", "alpha3": "ROU", "numeric": 642}, -{"name": "Russian Federation (the)", "alpha2": "RU", "alpha3": "RUS", "numeric": 643}, -{"name": "Rwanda", "alpha2": "RW", "alpha3": "RWA", "numeric": 646}, -{"name": "Saint Barthélemy", "alpha2": "BL", "alpha3": "BLM", "numeric": 652}, -{"name": "Saint Helena, Ascension and Tristan da Cunha", "alpha2": "SH", "alpha3": "SHN", "numeric": 654}, -{"name": "Saint Kitts and Nevis", "alpha2": "KN", "alpha3": "KNA", "numeric": 659}, -{"name": "Saint Lucia", "alpha2": "LC", "alpha3": "LCA", "numeric": 662}, -{"name": "Saint Martin (French part)", "alpha2": "MF", "alpha3": "MAF", "numeric": 663}, -{"name": "Saint Pierre and Miquelon", "alpha2": "PM", "alpha3": "SPM", "numeric": 666}, -{"name": "Saint Vincent and the Grenadines", "alpha2": "VC", "alpha3": "VCT", "numeric": 670}, -{"name": "Samoa", "alpha2": "WS", "alpha3": "WSM", "numeric": 882}, -{"name": "San Marino", "alpha2": "SM", "alpha3": "SMR", "numeric": 674}, -{"name": "Sao Tome and Principe", "alpha2": "ST", "alpha3": "STP", "numeric": 678}, -{"name": "Saudi Arabia", "alpha2": "SA", "alpha3": "SAU", "numeric": 682}, -{"name": "Senegal", "alpha2": "SN", "alpha3": "SEN", "numeric": 686}, -{"name": "Serbia", "alpha2": "RS", "alpha3": "SRB", "numeric": 688}, -{"name": "Seychelles", "alpha2": "SC", "alpha3": "SYC", "numeric": 690}, -{"name": "Sierra Leone", "alpha2": "SL", "alpha3": "SLE", "numeric": 694}, -{"name": "Singapore", "alpha2": "SG", "alpha3": "SGP", "numeric": 702}, -{"name": "Sint Maarten (Dutch part)", "alpha2": "SX", "alpha3": "SXM", "numeric": 534}, -{"name": "Slovakia", "alpha2": "SK", "alpha3": "SVK", "numeric": 703}, -{"name": "Slovenia", "alpha2": "SI", "alpha3": "SVN", "numeric": 705}, -{"name": "Solomon Islands", "alpha2": "SB", "alpha3": "SLB", "numeric": 90}, -{"name": "Somalia", "alpha2": "SO", "alpha3": "SOM", "numeric": 706}, -{"name": "South Africa", "alpha2": "ZA", "alpha3": "ZAF", "numeric": 710}, -{"name": "South Georgia and the South Sandwich Islands", "alpha2": "GS", "alpha3": "SGS", "numeric": 239}, -{"name": "South Sudan", "alpha2": "SS", "alpha3": "SSD", "numeric": 728}, -{"name": "Spain", "alpha2": "ES", "alpha3": "ESP", "numeric": 724}, -{"name": "Sri Lanka", "alpha2": "LK", "alpha3": "LKA", "numeric": 144}, -{"name": "Sudan (the)", "alpha2": "SD", "alpha3": "SDN", "numeric": 729}, -{"name": "Suriname", "alpha2": "SR", "alpha3": "SUR", "numeric": 740}, -{"name": "Svalbard and Jan Mayen", "alpha2": "SJ", "alpha3": "SJM", "numeric": 744}, -{"name": "Swaziland", "alpha2": "SZ", "alpha3": "SWZ", "numeric": 748}, -{"name": "Sweden", "alpha2": "SE", "alpha3": "SWE", "numeric": 752}, -{"name": "Switzerland", "alpha2": "CH", "alpha3": "CHE", "numeric": 756}, -{"name": "Syrian Arab Republic", "alpha2": "SY", "alpha3": "SYR", "numeric": 760}, -{"name": "Taiwan (Province of China)", "alpha2": "TW", "alpha3": "TWN", "numeric": 158}, -{"name": "Tajikistan", "alpha2": "TJ", "alpha3": "TJK", "numeric": 762}, -{"name": "Tanzania, United Republic of", "alpha2": "TZ", "alpha3": "TZA", "numeric": 834}, -{"name": "Thailand", "alpha2": "TH", "alpha3": "THA", "numeric": 764}, -{"name": "Timor-Leste", "alpha2": "TL", "alpha3": "TLS", "numeric": 626}, -{"name": "Togo", "alpha2": "TG", "alpha3": "TGO", "numeric": 768}, -{"name": "Tokelau", "alpha2": "TK", "alpha3": "TKL", "numeric": 772}, -{"name": "Tonga", "alpha2": "TO", "alpha3": "TON", "numeric": 776}, -{"name": "Trinidad and Tobago", "alpha2": "TT", "alpha3": "TTO", "numeric": 780}, -{"name": "Tunisia", "alpha2": "TN", "alpha3": "TUN", "numeric": 788}, -{"name": "Turkey", "alpha2": "TR", "alpha3": "TUR", "numeric": 792}, -{"name": "Turkmenistan", "alpha2": "TM", "alpha3": "TKM", "numeric": 795}, -{"name": "Turks and Caicos Islands (the)", "alpha2": "TC", "alpha3": "TCA", "numeric": 796}, -{"name": "Tuvalu", "alpha2": "TV", "alpha3": "TUV", "numeric": 798}, -{"name": "Uganda", "alpha2": "UG", "alpha3": "UGA", "numeric": 800}, -{"name": "Ukraine", "alpha2": "UA", "alpha3": "UKR", "numeric": 804}, -{"name": "United Arab Emirates (the)", "alpha2": "AE", "alpha3": "ARE", "numeric": 784}, -{"name": "United Kingdom of Great Britain and Northern Ireland (the)", "alpha2": "GB", "alpha3": "GBR", "numeric": 826}, -{"name": "United States Minor Outlying Islands (the)", "alpha2": "UM", "alpha3": "UMI", "numeric": 581}, -{"name": "United States of America (the)", "alpha2": "US", "alpha3": "USA", "numeric": 840}, -{"name": "Uruguay", "alpha2": "UY", "alpha3": "URY", "numeric": 858}, -{"name": "Uzbekistan", "alpha2": "UZ", "alpha3": "UZB", "numeric": 860}, -{"name": "Vanuatu", "alpha2": "VU", "alpha3": "VUT", "numeric": 548}, -{"name": "Venezuela (Bolivarian Republic of)", "alpha2": "VE", "alpha3": "VEN", "numeric": 862}, -{"name": "Viet Nam", "alpha2": "VN", "alpha3": "VNM", "numeric": 704}, -{"name": "Virgin Islands (British)", "alpha2": "VG", "alpha3": "VGB", "numeric": 92}, -{"name": "Virgin Islands (U.S.)", "alpha2": "VI", "alpha3": "VIR", "numeric": 850}, -{"name": "Wallis and Futuna", "alpha2": "WF", "alpha3": "WLF", "numeric": 876}, -{"name": "Western Sahara*", "alpha2": "EH", "alpha3": "ESH", "numeric": 732}, -{"name": "Yemen", "alpha2": "YE", "alpha3": "YEM", "numeric": 887}, -{"name": "Zambia", "alpha2": "ZM", "alpha3": "ZMB", "numeric": 894}, -{"name": "Zimbabwe", "alpha2": "ZW", "alpha3": "ZWE", "numeric": 716} +var countries = [ + { name: 'Afghanistan', alpha2: 'AF', alpha3: 'AFG', numeric: 4 }, + { name: 'Åland Islands', alpha2: 'AX', alpha3: 'ALA', numeric: 248 }, + { name: 'Albania', alpha2: 'AL', alpha3: 'ALB', numeric: 8 }, + { name: 'Algeria', alpha2: 'DZ', alpha3: 'DZA', numeric: 12 }, + { name: 'American Samoa', alpha2: 'AS', alpha3: 'ASM', numeric: 16 }, + { name: 'Andorra', alpha2: 'AD', alpha3: 'AND', numeric: 20 }, + { name: 'Angola', alpha2: 'AO', alpha3: 'AGO', numeric: 24 }, + { name: 'Anguilla', alpha2: 'AI', alpha3: 'AIA', numeric: 660 }, + { name: 'Antarctica', alpha2: 'AQ', alpha3: 'ATA', numeric: 10 }, + { name: 'Antigua and Barbuda', alpha2: 'AG', alpha3: 'ATG', numeric: 28 }, + { name: 'Argentina', alpha2: 'AR', alpha3: 'ARG', numeric: 32 }, + { name: 'Armenia', alpha2: 'AM', alpha3: 'ARM', numeric: 51 }, + { name: 'Aruba', alpha2: 'AW', alpha3: 'ABW', numeric: 533 }, + { name: 'Australia', alpha2: 'AU', alpha3: 'AUS', numeric: 36 }, + { name: 'Austria', alpha2: 'AT', alpha3: 'AUT', numeric: 40 }, + { name: 'Azerbaijan', alpha2: 'AZ', alpha3: 'AZE', numeric: 31 }, + { name: 'Bahamas (the)', alpha2: 'BS', alpha3: 'BHS', numeric: 44 }, + { name: 'Bahrain', alpha2: 'BH', alpha3: 'BHR', numeric: 48 }, + { name: 'Bangladesh', alpha2: 'BD', alpha3: 'BGD', numeric: 50 }, + { name: 'Barbados', alpha2: 'BB', alpha3: 'BRB', numeric: 52 }, + { name: 'Belarus', alpha2: 'BY', alpha3: 'BLR', numeric: 112 }, + { name: 'Belgium', alpha2: 'BE', alpha3: 'BEL', numeric: 56 }, + { name: 'Belize', alpha2: 'BZ', alpha3: 'BLZ', numeric: 84 }, + { name: 'Benin', alpha2: 'BJ', alpha3: 'BEN', numeric: 204 }, + { name: 'Bermuda', alpha2: 'BM', alpha3: 'BMU', numeric: 60 }, + { name: 'Bhutan', alpha2: 'BT', alpha3: 'BTN', numeric: 64 }, + { + name: 'Bolivia (Plurinational State of)', + alpha2: 'BO', + alpha3: 'BOL', + numeric: 68 + }, + { + name: 'Bonaire, Sint Eustatius and Saba', + alpha2: 'BQ', + alpha3: 'BES', + numeric: 535 + }, + { name: 'Bosnia and Herzegovina', alpha2: 'BA', alpha3: 'BIH', numeric: 70 }, + { name: 'Botswana', alpha2: 'BW', alpha3: 'BWA', numeric: 72 }, + { name: 'Bouvet Island', alpha2: 'BV', alpha3: 'BVT', numeric: 74 }, + { name: 'Brazil', alpha2: 'BR', alpha3: 'BRA', numeric: 76 }, + { + name: 'British Indian Ocean Territory (the)', + alpha2: 'IO', + alpha3: 'IOT', + numeric: 86 + }, + { name: 'Brunei Darussalam', alpha2: 'BN', alpha3: 'BRN', numeric: 96 }, + { name: 'Bulgaria', alpha2: 'BG', alpha3: 'BGR', numeric: 100 }, + { name: 'Burkina Faso', alpha2: 'BF', alpha3: 'BFA', numeric: 854 }, + { name: 'Burundi', alpha2: 'BI', alpha3: 'BDI', numeric: 108 }, + { name: 'Cabo Verde', alpha2: 'CV', alpha3: 'CPV', numeric: 132 }, + { name: 'Cambodia', alpha2: 'KH', alpha3: 'KHM', numeric: 116 }, + { name: 'Cameroon', alpha2: 'CM', alpha3: 'CMR', numeric: 120 }, + { name: 'Canada', alpha2: 'CA', alpha3: 'CAN', numeric: 124 }, + { name: 'Cayman Islands (the)', alpha2: 'KY', alpha3: 'CYM', numeric: 136 }, + { + name: 'Central African Republic (the)', + alpha2: 'CF', + alpha3: 'CAF', + numeric: 140 + }, + { name: 'Chad', alpha2: 'TD', alpha3: 'TCD', numeric: 148 }, + { name: 'Chile', alpha2: 'CL', alpha3: 'CHL', numeric: 152 }, + { name: 'China', alpha2: 'CN', alpha3: 'CHN', numeric: 156 }, + { name: 'Christmas Island', alpha2: 'CX', alpha3: 'CXR', numeric: 162 }, + { + name: 'Cocos (Keeling) Islands (the)', + alpha2: 'CC', + alpha3: 'CCK', + numeric: 166 + }, + { name: 'Colombia', alpha2: 'CO', alpha3: 'COL', numeric: 170 }, + { name: 'Comoros (the)', alpha2: 'KM', alpha3: 'COM', numeric: 174 }, + { + name: 'Congo (the Democratic Republic of the)', + alpha2: 'CD', + alpha3: 'COD', + numeric: 180 + }, + { name: 'Congo (the)', alpha2: 'CG', alpha3: 'COG', numeric: 178 }, + { name: 'Cook Islands (the)', alpha2: 'CK', alpha3: 'COK', numeric: 184 }, + { name: 'Costa Rica', alpha2: 'CR', alpha3: 'CRI', numeric: 188 }, + { name: "Côte d'Ivoire", alpha2: 'CI', alpha3: 'CIV', numeric: 384 }, + { name: 'Croatia', alpha2: 'HR', alpha3: 'HRV', numeric: 191 }, + { name: 'Cuba', alpha2: 'CU', alpha3: 'CUB', numeric: 192 }, + { name: 'Curaçao', alpha2: 'CW', alpha3: 'CUW', numeric: 531 }, + { name: 'Cyprus', alpha2: 'CY', alpha3: 'CYP', numeric: 196 }, + { name: 'Czech Republic (the)', alpha2: 'CZ', alpha3: 'CZE', numeric: 203 }, + { name: 'Denmark', alpha2: 'DK', alpha3: 'DNK', numeric: 208 }, + { name: 'Djibouti', alpha2: 'DJ', alpha3: 'DJI', numeric: 262 }, + { name: 'Dominica', alpha2: 'DM', alpha3: 'DMA', numeric: 212 }, + { + name: 'Dominican Republic (the)', + alpha2: 'DO', + alpha3: 'DOM', + numeric: 214 + }, + { name: 'Ecuador', alpha2: 'EC', alpha3: 'ECU', numeric: 218 }, + { name: 'Egypt', alpha2: 'EG', alpha3: 'EGY', numeric: 818 }, + { name: 'El Salvador', alpha2: 'SV', alpha3: 'SLV', numeric: 222 }, + { name: 'Equatorial Guinea', alpha2: 'GQ', alpha3: 'GNQ', numeric: 226 }, + { name: 'Eritrea', alpha2: 'ER', alpha3: 'ERI', numeric: 232 }, + { name: 'Estonia', alpha2: 'EE', alpha3: 'EST', numeric: 233 }, + { name: 'Ethiopia', alpha2: 'ET', alpha3: 'ETH', numeric: 231 }, + { + name: 'Falkland Islands (the) [Malvinas]', + alpha2: 'FK', + alpha3: 'FLK', + numeric: 238 + }, + { name: 'Faroe Islands (the)', alpha2: 'FO', alpha3: 'FRO', numeric: 234 }, + { name: 'Fiji', alpha2: 'FJ', alpha3: 'FJI', numeric: 242 }, + { name: 'Finland', alpha2: 'FI', alpha3: 'FIN', numeric: 246 }, + { name: 'France', alpha2: 'FR', alpha3: 'FRA', numeric: 250 }, + { name: 'French Guiana', alpha2: 'GF', alpha3: 'GUF', numeric: 254 }, + { name: 'French Polynesia', alpha2: 'PF', alpha3: 'PYF', numeric: 258 }, + { + name: 'French Southern Territories (the)', + alpha2: 'TF', + alpha3: 'ATF', + numeric: 260 + }, + { name: 'Gabon', alpha2: 'GA', alpha3: 'GAB', numeric: 266 }, + { name: 'Gambia (the)', alpha2: 'GM', alpha3: 'GMB', numeric: 270 }, + { name: 'Georgia', alpha2: 'GE', alpha3: 'GEO', numeric: 268 }, + { name: 'Germany', alpha2: 'DE', alpha3: 'DEU', numeric: 276 }, + { name: 'Ghana', alpha2: 'GH', alpha3: 'GHA', numeric: 288 }, + { name: 'Gibraltar', alpha2: 'GI', alpha3: 'GIB', numeric: 292 }, + { name: 'Greece', alpha2: 'GR', alpha3: 'GRC', numeric: 300 }, + { name: 'Greenland', alpha2: 'GL', alpha3: 'GRL', numeric: 304 }, + { name: 'Grenada', alpha2: 'GD', alpha3: 'GRD', numeric: 308 }, + { name: 'Guadeloupe', alpha2: 'GP', alpha3: 'GLP', numeric: 312 }, + { name: 'Guam', alpha2: 'GU', alpha3: 'GUM', numeric: 316 }, + { name: 'Guatemala', alpha2: 'GT', alpha3: 'GTM', numeric: 320 }, + { name: 'Guernsey', alpha2: 'GG', alpha3: 'GGY', numeric: 831 }, + { name: 'Guinea', alpha2: 'GN', alpha3: 'GIN', numeric: 324 }, + { name: 'Guinea-Bissau', alpha2: 'GW', alpha3: 'GNB', numeric: 624 }, + { name: 'Guyana', alpha2: 'GY', alpha3: 'GUY', numeric: 328 }, + { name: 'Haiti', alpha2: 'HT', alpha3: 'HTI', numeric: 332 }, + { + name: 'Heard Island and McDonald Islands', + alpha2: 'HM', + alpha3: 'HMD', + numeric: 334 + }, + { name: 'Holy See (the)', alpha2: 'VA', alpha3: 'VAT', numeric: 336 }, + { name: 'Honduras', alpha2: 'HN', alpha3: 'HND', numeric: 340 }, + { name: 'Hong Kong', alpha2: 'HK', alpha3: 'HKG', numeric: 344 }, + { name: 'Hungary', alpha2: 'HU', alpha3: 'HUN', numeric: 348 }, + { name: 'Iceland', alpha2: 'IS', alpha3: 'ISL', numeric: 352 }, + { name: 'India', alpha2: 'IN', alpha3: 'IND', numeric: 356 }, + { name: 'Indonesia', alpha2: 'ID', alpha3: 'IDN', numeric: 360 }, + { + name: 'Iran (Islamic Republic of)', + alpha2: 'IR', + alpha3: 'IRN', + numeric: 364 + }, + { name: 'Iraq', alpha2: 'IQ', alpha3: 'IRQ', numeric: 368 }, + { name: 'Ireland', alpha2: 'IE', alpha3: 'IRL', numeric: 372 }, + { name: 'Isle of Man', alpha2: 'IM', alpha3: 'IMN', numeric: 833 }, + { name: 'Israel', alpha2: 'IL', alpha3: 'ISR', numeric: 376 }, + { name: 'Italy', alpha2: 'IT', alpha3: 'ITA', numeric: 380 }, + { name: 'Jamaica', alpha2: 'JM', alpha3: 'JAM', numeric: 388 }, + { name: 'Japan', alpha2: 'JP', alpha3: 'JPN', numeric: 392 }, + { name: 'Jersey', alpha2: 'JE', alpha3: 'JEY', numeric: 832 }, + { name: 'Jordan', alpha2: 'JO', alpha3: 'JOR', numeric: 400 }, + { name: 'Kazakhstan', alpha2: 'KZ', alpha3: 'KAZ', numeric: 398 }, + { name: 'Kenya', alpha2: 'KE', alpha3: 'KEN', numeric: 404 }, + { name: 'Kiribati', alpha2: 'KI', alpha3: 'KIR', numeric: 296 }, + { + name: "Korea (the Democratic People's Republic of)", + alpha2: 'KP', + alpha3: 'PRK', + numeric: 408 + }, + { + name: 'Korea (the Republic of)', + alpha2: 'KR', + alpha3: 'KOR', + numeric: 410 + }, + { name: 'Kuwait', alpha2: 'KW', alpha3: 'KWT', numeric: 414 }, + { name: 'Kyrgyzstan', alpha2: 'KG', alpha3: 'KGZ', numeric: 417 }, + { + name: "Lao People's Democratic Republic (the)", + alpha2: 'LA', + alpha3: 'LAO', + numeric: 418 + }, + { name: 'Latvia', alpha2: 'LV', alpha3: 'LVA', numeric: 428 }, + { name: 'Lebanon', alpha2: 'LB', alpha3: 'LBN', numeric: 422 }, + { name: 'Lesotho', alpha2: 'LS', alpha3: 'LSO', numeric: 426 }, + { name: 'Liberia', alpha2: 'LR', alpha3: 'LBR', numeric: 430 }, + { name: 'Libya', alpha2: 'LY', alpha3: 'LBY', numeric: 434 }, + { name: 'Liechtenstein', alpha2: 'LI', alpha3: 'LIE', numeric: 438 }, + { name: 'Lithuania', alpha2: 'LT', alpha3: 'LTU', numeric: 440 }, + { name: 'Luxembourg', alpha2: 'LU', alpha3: 'LUX', numeric: 442 }, + { name: 'Macao', alpha2: 'MO', alpha3: 'MAC', numeric: 446 }, + { + name: 'Macedonia (the former Yugoslav Republic of)', + alpha2: 'MK', + alpha3: 'MKD', + numeric: 807 + }, + { name: 'Madagascar', alpha2: 'MG', alpha3: 'MDG', numeric: 450 }, + { name: 'Malawi', alpha2: 'MW', alpha3: 'MWI', numeric: 454 }, + { name: 'Malaysia', alpha2: 'MY', alpha3: 'MYS', numeric: 458 }, + { name: 'Maldives', alpha2: 'MV', alpha3: 'MDV', numeric: 462 }, + { name: 'Mali', alpha2: 'ML', alpha3: 'MLI', numeric: 466 }, + { name: 'Malta', alpha2: 'MT', alpha3: 'MLT', numeric: 470 }, + { name: 'Marshall Islands (the)', alpha2: 'MH', alpha3: 'MHL', numeric: 584 }, + { name: 'Martinique', alpha2: 'MQ', alpha3: 'MTQ', numeric: 474 }, + { name: 'Mauritania', alpha2: 'MR', alpha3: 'MRT', numeric: 478 }, + { name: 'Mauritius', alpha2: 'MU', alpha3: 'MUS', numeric: 480 }, + { name: 'Mayotte', alpha2: 'YT', alpha3: 'MYT', numeric: 175 }, + { name: 'Mexico', alpha2: 'MX', alpha3: 'MEX', numeric: 484 }, + { + name: 'Micronesia (Federated States of)', + alpha2: 'FM', + alpha3: 'FSM', + numeric: 583 + }, + { + name: 'Moldova (the Republic of)', + alpha2: 'MD', + alpha3: 'MDA', + numeric: 498 + }, + { name: 'Monaco', alpha2: 'MC', alpha3: 'MCO', numeric: 492 }, + { name: 'Mongolia', alpha2: 'MN', alpha3: 'MNG', numeric: 496 }, + { name: 'Montenegro', alpha2: 'ME', alpha3: 'MNE', numeric: 499 }, + { name: 'Montserrat', alpha2: 'MS', alpha3: 'MSR', numeric: 500 }, + { name: 'Morocco', alpha2: 'MA', alpha3: 'MAR', numeric: 504 }, + { name: 'Mozambique', alpha2: 'MZ', alpha3: 'MOZ', numeric: 508 }, + { name: 'Myanmar', alpha2: 'MM', alpha3: 'MMR', numeric: 104 }, + { name: 'Namibia', alpha2: 'NA', alpha3: 'NAM', numeric: 516 }, + { name: 'Nauru', alpha2: 'NR', alpha3: 'NRU', numeric: 520 }, + { name: 'Nepal', alpha2: 'NP', alpha3: 'NPL', numeric: 524 }, + { name: 'Netherlands (the)', alpha2: 'NL', alpha3: 'NLD', numeric: 528 }, + { name: 'New Caledonia', alpha2: 'NC', alpha3: 'NCL', numeric: 540 }, + { name: 'New Zealand', alpha2: 'NZ', alpha3: 'NZL', numeric: 554 }, + { name: 'Nicaragua', alpha2: 'NI', alpha3: 'NIC', numeric: 558 }, + { name: 'Niger (the)', alpha2: 'NE', alpha3: 'NER', numeric: 562 }, + { name: 'Nigeria', alpha2: 'NG', alpha3: 'NGA', numeric: 566 }, + { name: 'Niue', alpha2: 'NU', alpha3: 'NIU', numeric: 570 }, + { name: 'Norfolk Island', alpha2: 'NF', alpha3: 'NFK', numeric: 574 }, + { + name: 'Northern Mariana Islands (the)', + alpha2: 'MP', + alpha3: 'MNP', + numeric: 580 + }, + { name: 'Norway', alpha2: 'NO', alpha3: 'NOR', numeric: 578 }, + { name: 'Oman', alpha2: 'OM', alpha3: 'OMN', numeric: 512 }, + { name: 'Pakistan', alpha2: 'PK', alpha3: 'PAK', numeric: 586 }, + { name: 'Palau', alpha2: 'PW', alpha3: 'PLW', numeric: 585 }, + { name: 'Palestine, State of', alpha2: 'PS', alpha3: 'PSE', numeric: 275 }, + { name: 'Panama', alpha2: 'PA', alpha3: 'PAN', numeric: 591 }, + { name: 'Papua New Guinea', alpha2: 'PG', alpha3: 'PNG', numeric: 598 }, + { name: 'Paraguay', alpha2: 'PY', alpha3: 'PRY', numeric: 600 }, + { name: 'Peru', alpha2: 'PE', alpha3: 'PER', numeric: 604 }, + { name: 'Philippines (the)', alpha2: 'PH', alpha3: 'PHL', numeric: 608 }, + { name: 'Pitcairn', alpha2: 'PN', alpha3: 'PCN', numeric: 612 }, + { name: 'Poland', alpha2: 'PL', alpha3: 'POL', numeric: 616 }, + { name: 'Portugal', alpha2: 'PT', alpha3: 'PRT', numeric: 620 }, + { name: 'Puerto Rico', alpha2: 'PR', alpha3: 'PRI', numeric: 630 }, + { name: 'Qatar', alpha2: 'QA', alpha3: 'QAT', numeric: 634 }, + { name: 'Réunion', alpha2: 'RE', alpha3: 'REU', numeric: 638 }, + { name: 'Romania', alpha2: 'RO', alpha3: 'ROU', numeric: 642 }, + { + name: 'Russian Federation (the)', + alpha2: 'RU', + alpha3: 'RUS', + numeric: 643 + }, + { name: 'Rwanda', alpha2: 'RW', alpha3: 'RWA', numeric: 646 }, + { name: 'Saint Barthélemy', alpha2: 'BL', alpha3: 'BLM', numeric: 652 }, + { + name: 'Saint Helena, Ascension and Tristan da Cunha', + alpha2: 'SH', + alpha3: 'SHN', + numeric: 654 + }, + { name: 'Saint Kitts and Nevis', alpha2: 'KN', alpha3: 'KNA', numeric: 659 }, + { name: 'Saint Lucia', alpha2: 'LC', alpha3: 'LCA', numeric: 662 }, + { + name: 'Saint Martin (French part)', + alpha2: 'MF', + alpha3: 'MAF', + numeric: 663 + }, + { + name: 'Saint Pierre and Miquelon', + alpha2: 'PM', + alpha3: 'SPM', + numeric: 666 + }, + { + name: 'Saint Vincent and the Grenadines', + alpha2: 'VC', + alpha3: 'VCT', + numeric: 670 + }, + { name: 'Samoa', alpha2: 'WS', alpha3: 'WSM', numeric: 882 }, + { name: 'San Marino', alpha2: 'SM', alpha3: 'SMR', numeric: 674 }, + { name: 'Sao Tome and Principe', alpha2: 'ST', alpha3: 'STP', numeric: 678 }, + { name: 'Saudi Arabia', alpha2: 'SA', alpha3: 'SAU', numeric: 682 }, + { name: 'Senegal', alpha2: 'SN', alpha3: 'SEN', numeric: 686 }, + { name: 'Serbia', alpha2: 'RS', alpha3: 'SRB', numeric: 688 }, + { name: 'Seychelles', alpha2: 'SC', alpha3: 'SYC', numeric: 690 }, + { name: 'Sierra Leone', alpha2: 'SL', alpha3: 'SLE', numeric: 694 }, + { name: 'Singapore', alpha2: 'SG', alpha3: 'SGP', numeric: 702 }, + { + name: 'Sint Maarten (Dutch part)', + alpha2: 'SX', + alpha3: 'SXM', + numeric: 534 + }, + { name: 'Slovakia', alpha2: 'SK', alpha3: 'SVK', numeric: 703 }, + { name: 'Slovenia', alpha2: 'SI', alpha3: 'SVN', numeric: 705 }, + { name: 'Solomon Islands', alpha2: 'SB', alpha3: 'SLB', numeric: 90 }, + { name: 'Somalia', alpha2: 'SO', alpha3: 'SOM', numeric: 706 }, + { name: 'South Africa', alpha2: 'ZA', alpha3: 'ZAF', numeric: 710 }, + { + name: 'South Georgia and the South Sandwich Islands', + alpha2: 'GS', + alpha3: 'SGS', + numeric: 239 + }, + { name: 'South Sudan', alpha2: 'SS', alpha3: 'SSD', numeric: 728 }, + { name: 'Spain', alpha2: 'ES', alpha3: 'ESP', numeric: 724 }, + { name: 'Sri Lanka', alpha2: 'LK', alpha3: 'LKA', numeric: 144 }, + { name: 'Sudan (the)', alpha2: 'SD', alpha3: 'SDN', numeric: 729 }, + { name: 'Suriname', alpha2: 'SR', alpha3: 'SUR', numeric: 740 }, + { name: 'Svalbard and Jan Mayen', alpha2: 'SJ', alpha3: 'SJM', numeric: 744 }, + { name: 'Swaziland', alpha2: 'SZ', alpha3: 'SWZ', numeric: 748 }, + { name: 'Sweden', alpha2: 'SE', alpha3: 'SWE', numeric: 752 }, + { name: 'Switzerland', alpha2: 'CH', alpha3: 'CHE', numeric: 756 }, + { name: 'Syrian Arab Republic', alpha2: 'SY', alpha3: 'SYR', numeric: 760 }, + { + name: 'Taiwan (Province of China)', + alpha2: 'TW', + alpha3: 'TWN', + numeric: 158 + }, + { name: 'Tajikistan', alpha2: 'TJ', alpha3: 'TJK', numeric: 762 }, + { + name: 'Tanzania, United Republic of', + alpha2: 'TZ', + alpha3: 'TZA', + numeric: 834 + }, + { name: 'Thailand', alpha2: 'TH', alpha3: 'THA', numeric: 764 }, + { name: 'Timor-Leste', alpha2: 'TL', alpha3: 'TLS', numeric: 626 }, + { name: 'Togo', alpha2: 'TG', alpha3: 'TGO', numeric: 768 }, + { name: 'Tokelau', alpha2: 'TK', alpha3: 'TKL', numeric: 772 }, + { name: 'Tonga', alpha2: 'TO', alpha3: 'TON', numeric: 776 }, + { name: 'Trinidad and Tobago', alpha2: 'TT', alpha3: 'TTO', numeric: 780 }, + { name: 'Tunisia', alpha2: 'TN', alpha3: 'TUN', numeric: 788 }, + { name: 'Turkey', alpha2: 'TR', alpha3: 'TUR', numeric: 792 }, + { name: 'Turkmenistan', alpha2: 'TM', alpha3: 'TKM', numeric: 795 }, + { + name: 'Turks and Caicos Islands (the)', + alpha2: 'TC', + alpha3: 'TCA', + numeric: 796 + }, + { name: 'Tuvalu', alpha2: 'TV', alpha3: 'TUV', numeric: 798 }, + { name: 'Uganda', alpha2: 'UG', alpha3: 'UGA', numeric: 800 }, + { name: 'Ukraine', alpha2: 'UA', alpha3: 'UKR', numeric: 804 }, + { + name: 'United Arab Emirates (the)', + alpha2: 'AE', + alpha3: 'ARE', + numeric: 784 + }, + { + name: 'United Kingdom of Great Britain and Northern Ireland (the)', + alpha2: 'GB', + alpha3: 'GBR', + numeric: 826 + }, + { + name: 'United States Minor Outlying Islands (the)', + alpha2: 'UM', + alpha3: 'UMI', + numeric: 581 + }, + { + name: 'United States of America (the)', + alpha2: 'US', + alpha3: 'USA', + numeric: 840 + }, + { name: 'Uruguay', alpha2: 'UY', alpha3: 'URY', numeric: 858 }, + { name: 'Uzbekistan', alpha2: 'UZ', alpha3: 'UZB', numeric: 860 }, + { name: 'Vanuatu', alpha2: 'VU', alpha3: 'VUT', numeric: 548 }, + { + name: 'Venezuela (Bolivarian Republic of)', + alpha2: 'VE', + alpha3: 'VEN', + numeric: 862 + }, + { name: 'Viet Nam', alpha2: 'VN', alpha3: 'VNM', numeric: 704 }, + { + name: 'Virgin Islands (British)', + alpha2: 'VG', + alpha3: 'VGB', + numeric: 92 + }, + { name: 'Virgin Islands (U.S.)', alpha2: 'VI', alpha3: 'VIR', numeric: 850 }, + { name: 'Wallis and Futuna', alpha2: 'WF', alpha3: 'WLF', numeric: 876 }, + { name: 'Western Sahara*', alpha2: 'EH', alpha3: 'ESH', numeric: 732 }, + { name: 'Yemen', alpha2: 'YE', alpha3: 'YEM', numeric: 887 }, + { name: 'Zambia', alpha2: 'ZM', alpha3: 'ZMB', numeric: 894 }, + { name: 'Zimbabwe', alpha2: 'ZW', alpha3: 'ZWE', numeric: 716 } ]; - module.exports = createReactClass({ mixins: [WidgetMixin], @@ -1031,7 +1206,7 @@ module.exports = createReactClass({ } return image; - }, + } }, getDefaultProps() { @@ -1039,7 +1214,7 @@ module.exports = createReactClass({ type: 'SelectCountryWidget', onClose: () => {}, code: 'alpha2', - autoFocus: false, + autoFocus: false }; }, @@ -1048,7 +1223,6 @@ module.exports = createReactClass({ this.props.onClose(name, this.props.navigator); }, - // @todo image as option renderRow(rowData, sectionID, rowID) { @@ -1811,33 +1985,38 @@ module.exports = createReactClass({ image = null; } - if (image === null) { return ( this.onSelect(rowData.name, rowData[this.props.code])} underlayColor={this.getStyle('underlayColor').pop()} - style={this.getStyle(['row'])} > - + - {rowData.name} + + {rowData.name} + ); @@ -1845,30 +2024,35 @@ module.exports = createReactClass({ return ( this.onSelect(rowData.name, rowData[this.props.code])} underlayColor={this.getStyle('underlayColor').pop()} - style={this.getStyle(['row'])} > - + - {rowData.name} + + {rowData.name} + ); @@ -1876,17 +2060,17 @@ module.exports = createReactClass({ }, getInitialState: function() { - var ds = new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !== r2}); + var ds = new ListView.DataSource({ rowHasChanged: (r1, r2) => r1 !== r2 }); return { dataSource: ds.cloneWithRows([]), - search: '', + search: '' }; }, updateRows(text = '') { if (text.length === 0) { this.setState({ - dataSource: this.state.dataSource.cloneWithRows([]), + dataSource: this.state.dataSource.cloneWithRows([]) }); return; } @@ -1894,43 +2078,39 @@ module.exports = createReactClass({ var results = []; for (let i = 0; i < countries.length; i++) { - if (countries[i].name.toLowerCase().indexOf(text.trim().toLowerCase()) !== -1) { + if ( + countries[i].name.toLowerCase().indexOf(text.trim().toLowerCase()) !== + -1 + ) { results.push(countries[i]); - if (results.length === 10) { // max results + if (results.length === 10) { + // max results break; } } } this.setState({ - dataSource: this.state.dataSource.cloneWithRows(results), + dataSource: this.state.dataSource.cloneWithRows(results) }); }, - doSearch(text) { // console.log(text); - this.setState({search: text}); + this.setState({ search: text }); this.updateRows(text); }, renderHeader() { return ( - + ); @@ -1947,40 +2127,30 @@ module.exports = createReactClass({ render: function() { return ( - + {this.renderHeader()} - ); }, defaultStyles: { container: { - flex: 1, + flex: 1 }, listView: { - flex: 1, + flex: 1 }, textInputContainer: { backgroundColor: '#C9C9CE', @@ -1988,7 +2158,7 @@ module.exports = createReactClass({ borderTopColor: '#7e7e7e', borderBottomColor: '#b5b5b5', borderTopWidth: 1 / PixelRatio.get(), - borderBottomWidth: 1 / PixelRatio.get(), + borderBottomWidth: 1 / PixelRatio.get() }, textInput: { backgroundColor: '#FFFFFF', @@ -2001,18 +2171,18 @@ module.exports = createReactClass({ marginTop: 7.5, marginLeft: 8, marginRight: 8, - fontSize: 15, + fontSize: 15 }, row: { height: 44, // padding: 10, justifyContent: 'center', - backgroundColor: '#fff', + backgroundColor: '#fff' }, separator: { height: 0.5, - backgroundColor: '#9ba1ac', + backgroundColor: '#9ba1ac' }, - underlayColor: '#c7c7cc', - }, + underlayColor: '#c7c7cc' + } }); From ea20e0f9810dec6739db236d67b8910988678633 Mon Sep 17 00:00:00 2001 From: Patrick Trang Date: Mon, 2 Dec 2019 16:20:16 -0700 Subject: [PATCH 05/14] 0.1.3 - bump version --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 9221671..6bd8aca 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@ptrang/react-native-gifted-form", - "version": "0.1.2", + "version": "0.1.3", "description": "Form component for React Native", "main": "GiftedForm.js", "scripts": { From e8f9b89494d2de89290f846efb6900fd25964756 Mon Sep 17 00:00:00 2001 From: Patrick Trang Date: Mon, 2 Dec 2019 16:23:40 -0700 Subject: [PATCH 06/14] add ref back --- widgets/GooglePlacesWidget.js | 49 +++++++++++++++++++---------------- 1 file changed, 27 insertions(+), 22 deletions(-) diff --git a/widgets/GooglePlacesWidget.js b/widgets/GooglePlacesWidget.js index 753fd36..8aab76d 100644 --- a/widgets/GooglePlacesWidget.js +++ b/widgets/GooglePlacesWidget.js @@ -3,29 +3,34 @@ import createReactClass from 'create-react-class'; var WidgetMixin = require('../mixins/WidgetMixin.js'); -var {GooglePlacesAutocomplete} = require('react-native-google-places-autocomplete'); - +var { + GooglePlacesAutocomplete +} = require('react-native-google-places-autocomplete'); module.exports = createReactClass({ mixins: [WidgetMixin], getDefaultProps() { return { - type: 'GooglePlacesWidget', + type: 'GooglePlacesWidget' }; }, render() { - const everywhere = {description: 'Everywhere', geometry: { location: { lat: 0, lng: 0 } }}; - + const everywhere = { + description: 'Everywhere', + geometry: { location: { lat: 0, lng: 0 } } + }; return ( { // details is provided when fetchDetails = true + onPress={(data, details = {}) => { + // details is provided when fetchDetails = true // console.log(details); this._onChange({ name: details.formatted_address, @@ -42,33 +47,33 @@ module.exports = createReactClass({ query={this.props.query} styles={{ description: { - fontWeight: 'bold', + fontWeight: 'bold' }, predefinedPlacesDescription: { - color: '#1faadb', - }, + color: '#1faadb' + } }} - currentLocation={true} // Will add a 'Current location' button at the top of the predefined places list currentLocationLabel="Current location" - currentLocationAPI='GoogleReverseGeocoding' // Which API to use: GoogleReverseGeocoding or GooglePlacesSearch - GoogleReverseGeocodingQuery={{ - // available options for GoogleReverseGeocoding API : https://developers.google.com/maps/documentation/geocoding/intro - }} + currentLocationAPI="GoogleReverseGeocoding" // Which API to use: GoogleReverseGeocoding or GooglePlacesSearch + GoogleReverseGeocodingQuery={ + { + // available options for GoogleReverseGeocoding API : https://developers.google.com/maps/documentation/geocoding/intro + } + } GooglePlacesSearchQuery={{ // available options for GooglePlacesSearch API : https://developers.google.com/places/web-service/search rankby: 'distance', - types: 'food', + types: 'food' }} - - - filterReverseGeocodingByTypes={['locality', 'administrative_area_level_3']} // filter the reverse geocoding results by types - ['locality', 'administrative_area_level_3'] if you want to display only cities - + filterReverseGeocodingByTypes={[ + 'locality', + 'administrative_area_level_3' + ]} // filter the reverse geocoding results by types - ['locality', 'administrative_area_level_3'] if you want to display only cities // predefinedPlaces={[everywhere]} - {...this.props} // @todo test sans (need for 'name') /> ); - }, + } }); From 74a946de3bd29da4e9565f4d2f0d6a3480aff168 Mon Sep 17 00:00:00 2001 From: Patrick Trang Date: Mon, 2 Dec 2019 16:33:22 -0700 Subject: [PATCH 07/14] 0.1.4 - bump version --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 6bd8aca..1d8224e 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@ptrang/react-native-gifted-form", - "version": "0.1.3", + "version": "0.1.4", "description": "Form component for React Native", "main": "GiftedForm.js", "scripts": { From 7f60ff27e152c888b806025941be8c1069dc4554 Mon Sep 17 00:00:00 2001 From: Patrick Trang Date: Mon, 2 Dec 2019 16:36:23 -0700 Subject: [PATCH 08/14] 0.1.5 - update readme and version bump --- README.md | 322 ++++++++++++++++++++++++++++++--------------------- package.json | 2 +- 2 files changed, 189 insertions(+), 135 deletions(-) diff --git a/README.md b/README.md index 20a2508..f8049dc 100644 --- a/README.md +++ b/README.md @@ -1,10 +1,8 @@ # Gifted Form -[![npm downloads](https://img.shields.io/npm/dm/react-native-gifted-form.svg)](https://www.npmjs.com/package/react-native-gifted-form) -[![npm version](https://img.shields.io/npm/v/react-native-gifted-form.svg)](https://www.npmjs.com/package/react-native-gifted-form) -[![Latest GitHub tag](https://img.shields.io/github/tag/FaridSafi/react-native-gifted-form.svg)](https://github.com/FaridSafi/react-native-gifted-form) +[![npm downloads](https://img.shields.io/npm/dm/react-native-gifted-form.svg)](https://www.npmjs.com/package/@ptrang/react-native-gifted-form) [![npm version](https://img.shields.io/npm/v/react-native-gifted-form.svg)](https://www.npmjs.com/package/@ptrang/react-native-gifted-form) [![Latest GitHub tag](https://img.shields.io/github/tag/FaridSafi/react-native-gifted-form.svg)](https://github.com/ptrang/react-native-gifted-form) -Form component for React Native. +Form component for React Native. @0.1.4 ![screenshot](https://raw.githubusercontent.com/FaridSafi/react-native-gifted-form/master/capture/signup.gif) @@ -17,119 +15,157 @@ var FormComponent = createReactClass({ render() { return ( { + formName="signupForm" // GiftedForm instances that use the same name will also share the same states + openModal={route => { navigator.push(route); // The ModalWidget will be opened using this method. Tested with ExNavigator }} clearOnClose={false} // delete the values of the form when unmounted - defaults={{ - /* + defaults={ + { + /* username: 'Farid', 'gender{M}': true, password: 'abcdefg', country: 'FR', birthday: new Date(((new Date()).getFullYear() - 18)+''), */ - }} + } + } validators={{ fullName: { title: 'Full name', - validate: [{ - validator: 'isLength', - arguments: [1, 23], - message: '{TITLE} must be between {ARGS[0]} and {ARGS[1]} characters' - }] + validate: [ + { + validator: 'isLength', + arguments: [1, 23], + message: + '{TITLE} must be between {ARGS[0]} and {ARGS[1]} characters' + } + ] }, username: { title: 'Username', - validate: [{ - validator: 'isLength', - arguments: [3, 16], - message: '{TITLE} must be between {ARGS[0]} and {ARGS[1]} characters' - },{ - validator: 'matches', - arguments: /^[a-zA-Z0-9]*$/, - message: '{TITLE} can contains only alphanumeric characters' - }] + validate: [ + { + validator: 'isLength', + arguments: [3, 16], + message: + '{TITLE} must be between {ARGS[0]} and {ARGS[1]} characters' + }, + { + validator: 'matches', + arguments: /^[a-zA-Z0-9]*$/, + message: '{TITLE} can contains only alphanumeric characters' + } + ] }, password: { title: 'Password', - validate: [{ - validator: 'isLength', - arguments: [6, 16], - message: '{TITLE} must be between {ARGS[0]} and {ARGS[1]} characters' - }] + validate: [ + { + validator: 'isLength', + arguments: [6, 16], + message: + '{TITLE} must be between {ARGS[0]} and {ARGS[1]} characters' + } + ] }, emailAddress: { title: 'Email address', - validate: [{ - validator: 'isLength', - arguments: [6, 255], - },{ - validator: 'isEmail', - }] + validate: [ + { + validator: 'isLength', + arguments: [6, 255] + }, + { + validator: 'isEmail' + } + ] }, bio: { title: 'Biography', - validate: [{ - validator: 'isLength', - arguments: [0, 512], - message: '{TITLE} must be between {ARGS[0]} and {ARGS[1]} characters' - }] + validate: [ + { + validator: 'isLength', + arguments: [0, 512], + message: + '{TITLE} must be between {ARGS[0]} and {ARGS[1]} characters' + } + ] }, gender: { title: 'Gender', - validate: [{ - validator: (...args) => { - if (args[0] === undefined) { - return false; - } - return true; - }, - message: '{TITLE} is required', - }] + validate: [ + { + validator: (...args) => { + if (args[0] === undefined) { + return false; + } + return true; + }, + message: '{TITLE} is required' + } + ] }, birthday: { title: 'Birthday', - validate: [{ - validator: 'isBefore', - arguments: [moment().utc().subtract(18, 'years').format('YYYY-MM-DD')], - message: 'You must be at least 18 years old' - }, { - validator: 'isAfter', - arguments: [moment().utc().subtract(100, 'years').format('YYYY-MM-DD')], - message: '{TITLE} is not valid' - }] + validate: [ + { + validator: 'isBefore', + arguments: [ + moment() + .utc() + .subtract(18, 'years') + .format('YYYY-MM-DD') + ], + message: 'You must be at least 18 years old' + }, + { + validator: 'isAfter', + arguments: [ + moment() + .utc() + .subtract(100, 'years') + .format('YYYY-MM-DD') + ], + message: '{TITLE} is not valid' + } + ] }, country: { title: 'Country', - validate: [{ - validator: 'isLength', - arguments: [2], - message: '{TITLE} is required' - }] - }, + validate: [ + { + validator: 'isLength', + arguments: [2], + message: '{TITLE} is required' + } + ] + } }} > { if (!currentText) { - let fullName = GiftedFormManager.getValue('signupForm', 'fullName'); + let fullName = GiftedFormManager.getValue( + 'signupForm', + 'fullName' + ); if (fullName) { return fullName.replace(/[^a-zA-Z0-9-_]/g, ''); } @@ -139,115 +175,131 @@ var FormComponent = createReactClass({ /> - - - + + + - + { - return new Date(((new Date()).getFullYear() - 18)+''); + return new Date(new Date().getFullYear() - 18 + ''); }} /> - + - + { + onSubmit={( + isValid, + values, + validationResults, + postSubmit = null, + modalNavigator = null + ) => { if (isValid === true) { // prepare object values.gender = values.gender[0]; values.birthday = moment(values.birthday).format('YYYY-MM-DD'); /* Implement the request to your server using values variable - ** then you can do: - ** postSubmit(); // disable the loader - ** postSubmit(['An error occurred, please try again']); // disable the loader and display an error message - ** postSubmit(['Username already taken', 'Email already taken']); // disable the loader and display an error message - ** GiftedFormManager.reset('signupForm'); // clear the states of the form manually. 'signupForm' is the formName used - */ + ** then you can do: + ** postSubmit(); // disable the loader + ** postSubmit(['An error occurred, please try again']); // disable the loader and display an error message + ** postSubmit(['Username already taken', 'Email already taken']); // disable the loader and display an error message + ** GiftedFormManager.reset('signupForm'); // clear the states of the form manually. 'signupForm' is the formName used + */ } }} /> - + - + ); } @@ -261,48 +313,50 @@ Pass `value` prop to your widgets and `onValueChange` to your GiftedForm to stor IMPORTANT: currently only TextInputWidget and HiddenWidget support this feature. PR's are welcome for the other widgets ;) ```js -import React, { AppRegistry, Component } from 'react-native' -import { GiftedForm, GiftedFormManager } from 'react-native-gifted-form' +import React, { AppRegistry, Component } from 'react-native'; +import { GiftedForm, GiftedFormManager } from 'react-native-gifted-form'; class Form extends Component { constructor(props, context) { - super(props, context) + super(props, context); this.state = { form: { fullName: 'Marco Polo', - tos: false, + tos: false } - } + }; } handleValueChange(values) { - console.log('handleValueChange', values) - this.setState({ form: values }) + console.log('handleValueChange', values); + this.setState({ form: values }); } render() { - const { fullName, tos, gender } = this.state.form - console.log('render', this.state.form) + const { fullName, tos, gender } = this.state.form; + console.log('render', this.state.form); return ( { this.props.navigator.push(route) }} + formName="signupForm" + openModal={route => { + this.props.navigator.push(route); + }} onValueChange={this.handleValueChange.bind(this)} > - + - ) + ); } } -AppRegistry.registerComponent('Form', () => Form) +AppRegistry.registerComponent('Form', () => Form); ``` ### Installation diff --git a/package.json b/package.json index 1d8224e..b49678e 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@ptrang/react-native-gifted-form", - "version": "0.1.4", + "version": "0.1.5", "description": "Form component for React Native", "main": "GiftedForm.js", "scripts": { From 6c4fc26d4a060946ebee5f52eda1099463d4352e Mon Sep 17 00:00:00 2001 From: Patrick Trang Date: Mon, 2 Dec 2019 16:36:47 -0700 Subject: [PATCH 09/14] lmao forgot to update readme --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index f8049dc..b431b26 100644 --- a/README.md +++ b/README.md @@ -2,7 +2,7 @@ [![npm downloads](https://img.shields.io/npm/dm/react-native-gifted-form.svg)](https://www.npmjs.com/package/@ptrang/react-native-gifted-form) [![npm version](https://img.shields.io/npm/v/react-native-gifted-form.svg)](https://www.npmjs.com/package/@ptrang/react-native-gifted-form) [![Latest GitHub tag](https://img.shields.io/github/tag/FaridSafi/react-native-gifted-form.svg)](https://github.com/ptrang/react-native-gifted-form) -Form component for React Native. @0.1.4 +Form component for React Native. @0.1.5 ![screenshot](https://raw.githubusercontent.com/FaridSafi/react-native-gifted-form/master/capture/signup.gif) From f3d7dd8cec7c2b5c5e32ab1d30fcb5115f99e73e Mon Sep 17 00:00:00 2001 From: Patrick Trang Date: Tue, 3 Dec 2019 09:04:38 -0700 Subject: [PATCH 10/14] use shields based on my scope + repo --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index b431b26..34cb680 100644 --- a/README.md +++ b/README.md @@ -1,6 +1,6 @@ # Gifted Form -[![npm downloads](https://img.shields.io/npm/dm/react-native-gifted-form.svg)](https://www.npmjs.com/package/@ptrang/react-native-gifted-form) [![npm version](https://img.shields.io/npm/v/react-native-gifted-form.svg)](https://www.npmjs.com/package/@ptrang/react-native-gifted-form) [![Latest GitHub tag](https://img.shields.io/github/tag/FaridSafi/react-native-gifted-form.svg)](https://github.com/ptrang/react-native-gifted-form) +[![npm downloads](https://img.shields.io/npm/dm/@ptrang/react-native-gifted-form.svg)](https://www.npmjs.com/package/@ptrang/react-native-gifted-form) [![npm version](https://img.shields.io/npm/v/@ptrang/react-native-gifted-form.svg)](https://www.npmjs.com/package/@ptrang/react-native-gifted-form) [![Latest GitHub tag](https://img.shields.io/github/tag/ptrang/react-native-gifted-form.svg)](https://github.com/ptrang/react-native-gifted-form) Form component for React Native. @0.1.5 From 9eba92c107064e610c0176f22977b4c02d2ea79c Mon Sep 17 00:00:00 2001 From: Patrick Trang Date: Fri, 20 Dec 2019 16:20:39 -0700 Subject: [PATCH 11/14] 0.1.6 & vs code auto alignment --- README.md | 2 +- package.json | 2 +- widgets/SwitchWidget.js | 48 ++++++++++++++--------------------------- 3 files changed, 18 insertions(+), 34 deletions(-) diff --git a/README.md b/README.md index 34cb680..7f4e684 100644 --- a/README.md +++ b/README.md @@ -2,7 +2,7 @@ [![npm downloads](https://img.shields.io/npm/dm/@ptrang/react-native-gifted-form.svg)](https://www.npmjs.com/package/@ptrang/react-native-gifted-form) [![npm version](https://img.shields.io/npm/v/@ptrang/react-native-gifted-form.svg)](https://www.npmjs.com/package/@ptrang/react-native-gifted-form) [![Latest GitHub tag](https://img.shields.io/github/tag/ptrang/react-native-gifted-form.svg)](https://github.com/ptrang/react-native-gifted-form) -Form component for React Native. @0.1.5 +Form component for React Native. @0.1.6 ![screenshot](https://raw.githubusercontent.com/FaridSafi/react-native-gifted-form/master/capture/signup.gif) diff --git a/package.json b/package.json index b49678e..2e9bb9c 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@ptrang/react-native-gifted-form", - "version": "0.1.5", + "version": "0.1.6", "description": "Form component for React Native", "main": "GiftedForm.js", "scripts": { diff --git a/widgets/SwitchWidget.js b/widgets/SwitchWidget.js index 27d29bb..2cfa425 100644 --- a/widgets/SwitchWidget.js +++ b/widgets/SwitchWidget.js @@ -1,40 +1,24 @@ import React from 'react'; import createReactClass from 'create-react-class'; -import { - View, - Text, - Switch, - Platform, - PixelRatio -} from 'react-native'; +import { View, Text, Switch, Platform, PixelRatio } from 'react-native'; var WidgetMixin = require('../mixins/WidgetMixin.js'); var GiftedSwitch = createReactClass({ _getSwitch() { - return ( - - ); + return ; }, render() { - return ( - - {this._getSwitch()} - - ); - }, + return {this._getSwitch()}; + } }); - - module.exports = createReactClass({ mixins: [WidgetMixin], getDefaultProps() { return { - type: 'SwitchWidget', + type: 'SwitchWidget' }; }, @@ -44,13 +28,14 @@ module.exports = createReactClass({ {this._renderImage()} - {this.props.title} + + {this.props.title} + { + onValueChange={value => { this._onChange(value); this.props.onChange && this.props.onChange(value); }} @@ -67,30 +52,29 @@ module.exports = createReactClass({ rowImage: { height: 20, width: 20, - marginLeft: 10, + marginLeft: 10 }, rowContainer: { backgroundColor: '#FFF', borderBottomWidth: 1 / PixelRatio.get(), - borderColor: '#c8c7cc', + borderColor: '#c8c7cc' }, row: { flexDirection: 'row', height: 44, - alignItems: 'center', + alignItems: 'center' }, switchTitle: { fontSize: 15, color: '#000', flex: 1, - paddingLeft: 10, + paddingLeft: 10 }, switchAlignRight: { alignItems: 'flex-end', justifyContent: 'center', - marginRight: 10, + marginRight: 10 }, - switch: { - }, - }, + switch: {} + } }); From f1eff7f1ebb81a4147cd0fc5fec909d970c7cb49 Mon Sep 17 00:00:00 2001 From: Patrick Trang Date: Fri, 20 Dec 2019 16:25:24 -0700 Subject: [PATCH 12/14] add _setSwitchValue and ref --- widgets/SwitchWidget.js | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/widgets/SwitchWidget.js b/widgets/SwitchWidget.js index 2cfa425..18ce5ff 100644 --- a/widgets/SwitchWidget.js +++ b/widgets/SwitchWidget.js @@ -22,6 +22,10 @@ module.exports = createReactClass({ }; }, + _setSwitchValue(value) { + this._onChange(value); + } + render() { return ( @@ -33,6 +37,7 @@ module.exports = createReactClass({ { From 1d9034164c8fec20f8aa5eb9074506b43fec1e84 Mon Sep 17 00:00:00 2001 From: Patrick Trang Date: Fri, 20 Dec 2019 19:51:11 -0700 Subject: [PATCH 13/14] bug, forgot comma --- widgets/SwitchWidget.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/widgets/SwitchWidget.js b/widgets/SwitchWidget.js index 18ce5ff..7a32ad4 100644 --- a/widgets/SwitchWidget.js +++ b/widgets/SwitchWidget.js @@ -24,7 +24,7 @@ module.exports = createReactClass({ _setSwitchValue(value) { this._onChange(value); - } + }, render() { return ( From 340e81def6eb646727a84a56ca5fa0912bd4f28e Mon Sep 17 00:00:00 2001 From: Patrick Trang Date: Sun, 16 Aug 2020 19:05:38 -0700 Subject: [PATCH 14/14] version bump --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 2e9bb9c..bc59de8 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@ptrang/react-native-gifted-form", - "version": "0.1.6", + "version": "0.1.7", "description": "Form component for React Native", "main": "GiftedForm.js", "scripts": {