Skip to content

Commit

Permalink
update babel, IE 11 support, add sessionToken to autocomplete service (
Browse files Browse the repository at this point in the history
  • Loading branch information
ErrorPro authored May 2, 2021
1 parent 3755f73 commit cb60de1
Show file tree
Hide file tree
Showing 15 changed files with 3,224 additions and 2,398 deletions.
16 changes: 15 additions & 1 deletion .babelrc
Original file line number Diff line number Diff line change
@@ -1,3 +1,17 @@
{
"presets": ["es2015", "react", "stage-0", "minify"]
"presets": [
"@babel/preset-react",
[
"@babel/preset-env",
{
"useBuiltIns": "usage",
"targets": {
"ie": "11"
},
"corejs": "3.6.5"
}
]
// TODO: Minify breaks IE 11
// ["minify"]
]
}
3 changes: 2 additions & 1 deletion README.md
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@

1. [ReactGoogleAutocomplete](#reactgoogleautocomplete) is a simple html input component that provides functionality of the [google places widgets](https://developers.google.com/maps/documentation/javascript/reference/places-widget#AutocompleteOptions).
2. [usePlacesWidget](#useplaceswidget) is a react hook that provides the same functionality as `ReactGoogleAutocomplete` does but it does not create any dom elements. Instead, it gives you back a react ref which you can set to any input you want.
3. [usePlacesAutocompleteService](#useplacesautocompleteservice) is a more complex tool. It uses [google places autocomplete service](https://developers.google.com/maps/documentation/javascript/reference/places-autocomplete-service) and it provides all the functionality to you as the returned value. In addition to that, you can set a `debounce` prop which will reduce the amount of requests users send to Google.
3. [usePlacesAutocompleteService](#useplacesautocompleteservice) is a more complex react hook. It uses [google places autocomplete service](https://developers.google.com/maps/documentation/javascript/reference/places-autocomplete-service) and it provides all the functionality to you as the returned value. In addition to that, you can set a `debounce` prop which will reduce the amount of requests users send to Google.

## Install

Expand Down Expand Up @@ -153,6 +153,7 @@ The hook has only one config argument.
- `googleMapsScriptBaseUrl`: Provide custom google maps url. By default `https://maps.googleapis.com/maps/api/js`.
- `debounce`: Number of milliseconds to accumulate responses for.
- `options`: Default [options](https://developers.google.com/maps/documentation/javascript/reference/places-autocomplete-service#QueryAutocompletionRequest) which will be passed to every request.
- `sessionToken`: If true then a [session token](https://developers.google.com/maps/documentation/javascript/reference/places-autocomplete-service#AutocompleteSessionToken) will be attached to every request.

### Returned value

Expand Down
105 changes: 102 additions & 3 deletions lib/ReactGoogleAutocomplete.js
Original file line number Diff line number Diff line change
@@ -1,3 +1,102 @@
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var _extends=Object.assign||function(a){for(var b,c=1;c<arguments.length;c++)for(var d in b=arguments[c],b)Object.prototype.hasOwnProperty.call(b,d)&&(a[d]=b[d]);return a},_react=require("react"),_react2=_interopRequireDefault(_react),_propTypes=require("prop-types"),_propTypes2=_interopRequireDefault(_propTypes),_usePlacesWidget2=require("./usePlacesWidget"),_usePlacesWidget3=_interopRequireDefault(_usePlacesWidget2);function _interopRequireDefault(a){return a&&a.__esModule?a:{default:a}}function _objectWithoutProperties(a,b){var c={};for(var d in a)0<=b.indexOf(d)||Object.prototype.hasOwnProperty.call(a,d)&&(c[d]=a[d]);return c}function ReactGoogleAutocomplete(a){var b=a.onPlaceSelected,c=a.apiKey,d=a.inputAutocompleteValue,e=a.options,f=a.googleMapsScriptBaseUrl,g=a.refProp,h=_objectWithoutProperties(a,["onPlaceSelected","apiKey","inputAutocompleteValue","options","googleMapsScriptBaseUrl","refProp"]),i=(0,_usePlacesWidget3.default)({ref:g,googleMapsScriptBaseUrl:f,onPlaceSelected:b,apiKey:c,inputAutocompleteValue:d,options:e}),j=i.ref;return _react2.default.createElement("input",_extends({ref:j},h))}ReactGoogleAutocomplete.propTypes={apiKey:_propTypes2.default.string,ref:_propTypes2.default.oneOfType([// Either a function
_propTypes2.default.func,// Or anything shaped { current: any }
_propTypes2.default.shape({current:_propTypes2.default.any})]),googleMapsScriptBaseUrl:_propTypes2.default.string,onPlaceSelected:_propTypes2.default.func,inputAutocompleteValue:_propTypes2.default.string,options:_propTypes2.default.shape({componentRestrictions:_propTypes2.default.object,bounds:_propTypes2.default.object,location:_propTypes2.default.object,offset:_propTypes2.default.number,origin:_propTypes2.default.object,radius:_propTypes2.default.number,sessionToken:_propTypes2.default.object,types:_propTypes2.default.arrayOf(_propTypes2.default.string)})},exports.default=(0,_react.forwardRef)(function(a,b){return _react2.default.createElement(ReactGoogleAutocomplete,_extends({},a,{refProp:b}))});
"use strict";

function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }

require("core-js/modules/es.symbol.js");

require("core-js/modules/es.object.assign.js");

require("core-js/modules/es.array.iterator.js");

require("core-js/modules/es.object.to-string.js");

require("core-js/modules/es.string.iterator.js");

require("core-js/modules/es.weak-map.js");

require("core-js/modules/web.dom-collections.iterator.js");

require("core-js/modules/es.object.get-own-property-descriptor.js");

require("core-js/modules/es.symbol.description.js");

require("core-js/modules/es.symbol.iterator.js");

Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;

require("core-js/modules/es.object.keys.js");

var _react = _interopRequireWildcard(require("react"));

var _propTypes = _interopRequireDefault(require("prop-types"));

var _usePlacesWidget2 = _interopRequireDefault(require("./usePlacesWidget"));

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }

function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }

function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }

function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }

function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }

function ReactGoogleAutocomplete(props) {
var onPlaceSelected = props.onPlaceSelected,
apiKey = props.apiKey,
inputAutocompleteValue = props.inputAutocompleteValue,
options = props.options,
googleMapsScriptBaseUrl = props.googleMapsScriptBaseUrl,
refProp = props.refProp,
rest = _objectWithoutProperties(props, ["onPlaceSelected", "apiKey", "inputAutocompleteValue", "options", "googleMapsScriptBaseUrl", "refProp"]);

var _usePlacesWidget = (0, _usePlacesWidget2.default)({
ref: refProp,
googleMapsScriptBaseUrl: googleMapsScriptBaseUrl,
onPlaceSelected: onPlaceSelected,
apiKey: apiKey,
inputAutocompleteValue: inputAutocompleteValue,
options: options
}),
ref = _usePlacesWidget.ref;

return /*#__PURE__*/_react.default.createElement("input", _extends({
ref: ref
}, rest));
}

ReactGoogleAutocomplete.propTypes = {
apiKey: _propTypes.default.string,
ref: _propTypes.default.oneOfType([// Either a function
_propTypes.default.func, // Or anything shaped { current: any }
_propTypes.default.shape({
current: _propTypes.default.any
})]),
googleMapsScriptBaseUrl: _propTypes.default.string,
onPlaceSelected: _propTypes.default.func,
inputAutocompleteValue: _propTypes.default.string,
options: _propTypes.default.shape({
componentRestrictions: _propTypes.default.object,
bounds: _propTypes.default.object,
location: _propTypes.default.object,
offset: _propTypes.default.number,
origin: _propTypes.default.object,
radius: _propTypes.default.number,
sessionToken: _propTypes.default.object,
types: _propTypes.default.arrayOf(_propTypes.default.string)
})
};

var _default = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
return /*#__PURE__*/_react.default.createElement(ReactGoogleAutocomplete, _extends({}, props, {
refProp: ref
}));
});

exports.default = _default;
9 changes: 8 additions & 1 deletion lib/constants.js
Original file line number Diff line number Diff line change
@@ -1 +1,8 @@
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var GOOGLE_MAP_SCRIPT_BASE_URL=exports.GOOGLE_MAP_SCRIPT_BASE_URL="https://maps.googleapis.com/maps/api/js";
"use strict";

Object.defineProperty(exports, "__esModule", {
value: true
});
exports.GOOGLE_MAP_SCRIPT_BASE_URL = void 0;
var GOOGLE_MAP_SCRIPT_BASE_URL = "https://maps.googleapis.com/maps/api/js";
exports.GOOGLE_MAP_SCRIPT_BASE_URL = GOOGLE_MAP_SCRIPT_BASE_URL;
24 changes: 23 additions & 1 deletion lib/index.js
Original file line number Diff line number Diff line change
@@ -1 +1,23 @@
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var _ReactGoogleAutocomplete=require("./ReactGoogleAutocomplete");Object.defineProperty(exports,"default",{enumerable:!0,get:function a(){return _interopRequireDefault(_ReactGoogleAutocomplete).default}});var _usePlacesWidget=require("./usePlacesWidget");Object.defineProperty(exports,"usePlacesWidget",{enumerable:!0,get:function a(){return _interopRequireDefault(_usePlacesWidget).default}});function _interopRequireDefault(a){return a&&a.__esModule?a:{default:a}}
"use strict";

Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "default", {
enumerable: true,
get: function get() {
return _ReactGoogleAutocomplete.default;
}
});
Object.defineProperty(exports, "usePlacesWidget", {
enumerable: true,
get: function get() {
return _usePlacesWidget.default;
}
});

var _ReactGoogleAutocomplete = _interopRequireDefault(require("./ReactGoogleAutocomplete"));

var _usePlacesWidget = _interopRequireDefault(require("./usePlacesWidget"));

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
22 changes: 22 additions & 0 deletions lib/usePlacesAutocompleteService.d.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
interface usePlacesAutocompleteServiceConfig {
apiKey?: string;
googleMapsScriptBaseUrl?: string;
debounce?: number;
options?: google.maps.places.QueryAutocompletionRequest;
sessionToken?: boolean;
}

interface usePlacesAutocompleteServiceResponse {
placePredictions: google.maps.places.AutocompletePrediction[];
isPlacePredictionsLoading: boolean;
getPlacePredictions: (opt: google.maps.places.AutocompletionRequest) => void;
queryPredictions: google.maps.places.QueryAutocompletePrediction[];
isQueryPredictionsLoading: boolean;
getQueryPredictions: (
opt: google.maps.places.QueryAutocompletionRequest
) => void;
}

export default function usePlacesAutocompleteService(
options: usePlacesAutocompleteServiceConfig
): usePlacesAutocompleteServiceResponse;
Loading

0 comments on commit cb60de1

Please sign in to comment.