diff --git a/GooglePlacesAutocomplete.js b/GooglePlacesAutocomplete.js index 60836de..621b55b 100644 --- a/GooglePlacesAutocomplete.js +++ b/GooglePlacesAutocomplete.js @@ -2,9 +2,9 @@ import debounce from 'lodash.debounce'; import PropTypes from 'prop-types'; import Qs from 'qs'; +import 'react-native-get-random-values'; import { v4 as uuidv4 } from 'uuid'; import React, { - forwardRef, useMemo, useEffect, useImperativeHandle, @@ -71,7 +71,58 @@ const defaultStyles = { powered: {}, }; -export const GooglePlacesAutocomplete = forwardRef((props, ref) => { +const defaultProps = { + autoFillOnNotFound: false, + currentLocation: false, + currentLocationLabel: 'Current location', + debounce: 0, + disableScroll: false, + enableHighAccuracyLocation: true, + enablePoweredByContainer: true, + fetchDetails: false, + filterReverseGeocodingByTypes: [], + GooglePlacesDetailsQuery: {}, + GooglePlacesSearchQuery: { + rankby: 'distance', + type: 'restaurant', + }, + GoogleReverseGeocodingQuery: {}, + isRowScrollable: true, + keyboardShouldPersistTaps: 'always', + listHoverColor: '#ececec', + listUnderlayColor: '#c8c7cc', + listViewDisplayed: 'auto', + keepResultsAfterBlur: false, + minLength: 0, + nearbyPlacesAPI: 'GooglePlacesSearch', + numberOfLines: 1, + onFail: () => { }, + onNotFound: () => { }, + onPress: () => { }, + onTimeout: () => console.warn('google places autocomplete: request timeout'), + placeholder: '', + predefinedPlaces: [], + predefinedPlacesAlwaysVisible: false, + query: { + key: 'missing api key', + language: 'en', + types: 'geocode', + }, + styles: {}, + suppressDefaultStyles: false, + textInputHide: false, + textInputProps: {}, + timeout: 20000, + isNewPlacesAPI: false, + fields: '*', +}; + +export const GooglePlacesAutocomplete = ({ ref, ...rest }) => { + const props = { + ...defaultProps, + ...rest, + }; + let _results = []; let _requests = []; @@ -331,23 +382,23 @@ export const GooglePlacesAutocomplete = forwardRef((props, ref) => { request.open( 'GET', `${url}/v1/places/${rowData.place_id}?` + - Qs.stringify({ - key: props.query.key, - sessionToken, - fields: props.fields, - }), + Qs.stringify({ + key: props.query.key, + sessionToken, + fields: props.fields, + }), ); setSessionToken(uuidv4()); } else { request.open( 'GET', `${url}/place/details/json?` + - Qs.stringify({ - key: props.query.key, - placeid: rowData.place_id, - language: props.query.language, - ...props.GooglePlacesDetailsQuery, - }), + Qs.stringify({ + key: props.query.key, + placeid: rowData.place_id, + language: props.query.language, + ...props.GooglePlacesDetailsQuery, + }), ); } @@ -571,9 +622,9 @@ export const GooglePlacesAutocomplete = forwardRef((props, ref) => { const results = props.nearbyPlacesAPI === 'GoogleReverseGeocoding' ? _filterResultsByTypes( - responseJSON.predictions, - props.filterReverseGeocodingByTypes, - ) + responseJSON.predictions, + props.filterReverseGeocodingByTypes, + ) : responseJSON.predictions; _results = results; @@ -609,18 +660,18 @@ export const GooglePlacesAutocomplete = forwardRef((props, ref) => { if (props.isNewPlacesAPI) { const keyQueryParam = props.query.key ? '?' + - Qs.stringify({ - key: props.query.key, - }) + Qs.stringify({ + key: props.query.key, + }) : ''; request.open('POST', `${url}/v1/places:autocomplete${keyQueryParam}`); } else { request.open( 'GET', `${url}/place/autocomplete/json?input=` + - encodeURIComponent(text) + - '&' + - Qs.stringify(props.query), + encodeURIComponent(text) + + '&' + + Qs.stringify(props.query), ); } @@ -735,8 +786,8 @@ export const GooglePlacesAutocomplete = forwardRef((props, ref) => { backgroundColor: pressed ? props.listUnderlayColor : hovered - ? props.listHoverColor - : undefined, + ? props.listHoverColor + : undefined, }, ]} onPress={() => _onPress(rowData)} @@ -933,17 +984,17 @@ export const GooglePlacesAutocomplete = forwardRef((props, ref) => { onFocus={ onFocus ? (e) => { - _onFocus(); - onFocus(e); - } + _onFocus(); + onFocus(e); + } : _onFocus } onBlur={ onBlur ? (e) => { - _onBlur(e); - onBlur(e); - } + _onBlur(e); + onBlur(e); + } : _onBlur } clearButtonMode={clearButtonMode || 'while-editing'} @@ -958,7 +1009,7 @@ export const GooglePlacesAutocomplete = forwardRef((props, ref) => { {props.children} ); -}); +}; GooglePlacesAutocomplete.propTypes = { autoFillOnNotFound: PropTypes.bool, @@ -1017,52 +1068,6 @@ GooglePlacesAutocomplete.propTypes = { fields: PropTypes.string, }; -GooglePlacesAutocomplete.defaultProps = { - autoFillOnNotFound: false, - currentLocation: false, - currentLocationLabel: 'Current location', - debounce: 0, - disableScroll: false, - enableHighAccuracyLocation: true, - enablePoweredByContainer: true, - fetchDetails: false, - filterReverseGeocodingByTypes: [], - GooglePlacesDetailsQuery: {}, - GooglePlacesSearchQuery: { - rankby: 'distance', - type: 'restaurant', - }, - GoogleReverseGeocodingQuery: {}, - isRowScrollable: true, - keyboardShouldPersistTaps: 'always', - listHoverColor: '#ececec', - listUnderlayColor: '#c8c7cc', - listViewDisplayed: 'auto', - keepResultsAfterBlur: false, - minLength: 0, - nearbyPlacesAPI: 'GooglePlacesSearch', - numberOfLines: 1, - onFail: () => {}, - onNotFound: () => {}, - onPress: () => {}, - onTimeout: () => console.warn('google places autocomplete: request timeout'), - placeholder: '', - predefinedPlaces: [], - predefinedPlacesAlwaysVisible: false, - query: { - key: 'missing api key', - language: 'en', - types: 'geocode', - }, - styles: {}, - suppressDefaultStyles: false, - textInputHide: false, - textInputProps: {}, - timeout: 20000, - isNewPlacesAPI: false, - fields: '*', -}; - GooglePlacesAutocomplete.displayName = 'GooglePlacesAutocomplete'; -export default { GooglePlacesAutocomplete }; +export default { GooglePlacesAutocomplete }; \ No newline at end of file diff --git a/package.json b/package.json index ba5265f..4d62093 100644 --- a/package.json +++ b/package.json @@ -32,6 +32,7 @@ "lodash.debounce": "^4.0.8", "prop-types": "^15.7.2", "qs": "~6.9.1", + "react-native-get-random-values": "^1.11.0", "uuid": "^10.0.0" }, "devDependencies": { diff --git a/yarn.lock b/yarn.lock index 6be4c60..00021fe 100644 --- a/yarn.lock +++ b/yarn.lock @@ -753,6 +753,11 @@ execa@^4.0.3: signal-exit "^3.0.2" strip-final-newline "^2.0.0" +fast-base64-decode@^1.0.0: + version "1.0.0" + resolved "https://registry.yarnpkg.com/fast-base64-decode/-/fast-base64-decode-1.0.0.tgz#b434a0dd7d92b12b43f26819300d2dafb83ee418" + integrity sha512-qwaScUgUGBYeDNRnbc/KyllVU88Jk1pRHPStuF/lO7B0/RTRLj7U0lkdTAutlBblY08rwZDff6tNU9cjv6j//Q== + fast-deep-equal@^3.1.1: version "3.1.3" resolved "https://registry.yarnpkg.com/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz#3a7d56b559d6cbc3eb512325244e619a65c6c525" @@ -1480,6 +1485,13 @@ react-is@^16.8.1: resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4" integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ== +react-native-get-random-values@^1.11.0: + version "1.11.0" + resolved "https://registry.yarnpkg.com/react-native-get-random-values/-/react-native-get-random-values-1.11.0.tgz#1ca70d1271f4b08af92958803b89dccbda78728d" + integrity sha512-4BTbDbRmS7iPdhYLRcz3PGFIpFJBwNZg9g42iwa2P6FOv9vZj/xJc678RZXnLNZzd0qd7Q3CCF6Yd+CU2eoXKQ== + dependencies: + fast-base64-decode "^1.0.0" + regexp.prototype.flags@^1.3.0: version "1.3.0" resolved "https://registry.yarnpkg.com/regexp.prototype.flags/-/regexp.prototype.flags-1.3.0.tgz#7aba89b3c13a64509dabcf3ca8d9fbb9bdf5cb75" @@ -1780,6 +1792,11 @@ uri-js@^4.2.2: dependencies: punycode "^2.1.0" +uuid@^10.0.0: + version "10.0.0" + resolved "https://registry.yarnpkg.com/uuid/-/uuid-10.0.0.tgz#5a95aa454e6e002725c79055fd42aaba30ca6294" + integrity sha512-8XkAphELsDnEGrDxUOHB3RGvXz6TeuYSGEZBOjtTtPm2lwhGBjLgOzLHB63IUWfBpNucQjND6d3AOudO+H3RWQ== + v8-compile-cache@^2.0.3: version "2.1.1" resolved "https://registry.yarnpkg.com/v8-compile-cache/-/v8-compile-cache-2.1.1.tgz#54bc3cdd43317bca91e35dcaf305b1a7237de745"