expose autocomplete service instance from usePlacesAutocompleteService (

#110)
ErrorPro · May 19, 2021 · 4a2705d · 4a2705d
1 parent 7918929
commit 4a2705d
Show file tree

Hide file tree

Showing 9 changed files with 51 additions and 44 deletions.
diff --git a/README.md b/README.md
@@ -158,6 +158,7 @@ The hook has only one config argument.
 
 The hook returns an object with properties:
 
+- `placesAutocompleteService`: Instance of [AutocompleteService](https://developers.google.com/maps/documentation/javascript/reference/places-autocomplete-service#AutocompleteService)
 - `placePredictions`: an array of [AutocompletePrediction](https://developers.google.com/maps/documentation/javascript/reference/places-autocomplete-service#AutocompleteResponse)
 - `isPlacePredictionsLoading`: sets to true when a `getPlacePredictions` request is being sent and not yet resolved.
 - `getPlacePredictions: (opt: `[Options](https://developers.google.com/maps/documentation/javascript/reference/places-autocomplete-service#AutocompletionRequest)`): void`: a function which you call whenever you want to request places predictions. Takes one [argument](https://developers.google.com/maps/documentation/javascript/reference/places-autocomplete-service#AutocompleteResponse).

diff --git a/lib/ReactGoogleAutocomplete.js b/lib/ReactGoogleAutocomplete.js
@@ -5,19 +5,19 @@ function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "functi
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = void 0;
+exports.default = void 0;
 
 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 _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 _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); }
 
@@ -34,7 +34,7 @@ function ReactGoogleAutocomplete(props) {
       refProp = props.refProp,
       rest = _objectWithoutProperties(props, ["onPlaceSelected", "apiKey", "inputAutocompleteValue", "options", "googleMapsScriptBaseUrl", "refProp"]);
 
-  var _usePlacesWidget = (0, _usePlacesWidget2["default"])({
+  var _usePlacesWidget = (0, _usePlacesWidget2.default)({
     ref: refProp,
     googleMapsScriptBaseUrl: googleMapsScriptBaseUrl,
     onPlaceSelected: onPlaceSelected,
@@ -44,37 +44,37 @@ function ReactGoogleAutocomplete(props) {
   }),
       ref = _usePlacesWidget.ref;
 
-  return /*#__PURE__*/_react["default"].createElement("input", _extends({
+  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
+  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)
+  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, {
+  return /*#__PURE__*/_react.default.createElement(ReactGoogleAutocomplete, _extends({}, props, {
     refProp: ref
   }));
 });
 
-exports["default"] = _default;
+exports.default = _default;
diff --git a/lib/index.js b/lib/index.js
@@ -6,18 +6,18 @@ Object.defineProperty(exports, "__esModule", {
 Object.defineProperty(exports, "default", {
   enumerable: true,
   get: function get() {
-    return _ReactGoogleAutocomplete["default"];
+    return _ReactGoogleAutocomplete.default;
   }
 });
 Object.defineProperty(exports, "usePlacesWidget", {
   enumerable: true,
   get: function get() {
-    return _usePlacesWidget["default"];
+    return _usePlacesWidget.default;
   }
 });
 
 var _ReactGoogleAutocomplete = _interopRequireDefault(require("./ReactGoogleAutocomplete"));
 
 var _usePlacesWidget = _interopRequireDefault(require("./usePlacesWidget"));
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
diff --git a/lib/usePlacesAutocompleteService.d.ts b/lib/usePlacesAutocompleteService.d.ts
@@ -7,6 +7,7 @@ interface usePlacesAutocompleteServiceConfig {
 }
 
 interface usePlacesAutocompleteServiceResponse {
+  placesAutocompleteService: google.maps.places.AutocompleteService | null;
   placePredictions: google.maps.places.AutocompletePrediction[];
   isPlacePredictionsLoading: boolean;
   getPlacePredictions: (opt: google.maps.places.AutocompletionRequest) => void;

diff --git a/lib/usePlacesAutocompleteService.js b/lib/usePlacesAutocompleteService.js
@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = usePlacesAutocompleteService;
+exports.default = usePlacesAutocompleteService;
 
 var _react = require("react");
 
@@ -13,7 +13,7 @@ var _utils = require("./utils");
 
 var _constants = require("./constants");
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
@@ -74,21 +74,21 @@ function usePlacesAutocompleteService(_ref) {
       queryPredictions = _useState12[0],
       setQueryPredictions = _useState12[1];
 
-  var googleAutocompleteService = (0, _react.useRef)(null);
+  var placesAutocompleteService = (0, _react.useRef)(null);
   var autocompleteSession = (0, _react.useRef)(null);
   var handleLoadScript = (0, _react.useCallback)(function () {
     return (0, _utils.loadGoogleMapScript)(googleMapsScriptBaseUrl, googleMapsScriptUrl);
   }, [googleMapsScriptBaseUrl, googleMapsScriptUrl]);
-  var debouncedPlacePredictions = (0, _react.useCallback)((0, _lodash["default"])(function (optionsArg) {
-    if (googleAutocompleteService.current && optionsArg.input) googleAutocompleteService.current.getPlacePredictions(_objectSpread(_objectSpread(_objectSpread({}, options), optionsArg), sessionToken && autocompleteSession.current ? {
+  var debouncedPlacePredictions = (0, _react.useCallback)((0, _lodash.default)(function (optionsArg) {
+    if (placesAutocompleteService.current && optionsArg.input) placesAutocompleteService.current.getPlacePredictions(_objectSpread(_objectSpread(_objectSpread({}, options), optionsArg), sessionToken && autocompleteSession.current ? {
       sessionToken: autocompleteSession.current
     } : {}), function (r) {
       setIsPlacePredsLoading(false);
       setPlacePredictions(r || []);
     });
   }, debounce), [debounce]);
-  var debouncedQueryPredictions = (0, _react.useCallback)((0, _lodash["default"])(function (optionsArg) {
-    if (googleAutocompleteService.current && optionsArg.input) googleAutocompleteService.current.getQueryPredictions(_objectSpread(_objectSpread(_objectSpread({}, options), optionsArg), sessionToken && autocompleteSession.current ? {
+  var debouncedQueryPredictions = (0, _react.useCallback)((0, _lodash.default)(function (optionsArg) {
+    if (placesAutocompleteService.current && optionsArg.input) placesAutocompleteService.current.getQueryPredictions(_objectSpread(_objectSpread(_objectSpread({}, options), optionsArg), sessionToken && autocompleteSession.current ? {
       sessionToken: autocompleteSession.current
     } : {}), function (r) {
       setIsQueryPredsLoading(false);
@@ -102,7 +102,7 @@ function usePlacesAutocompleteService(_ref) {
       // eslint-disable-next-line no-undef
       if (!google) return console.error("Google has not been found. Make sure your provide apiKey prop."); // eslint-disable-next-line no-undef
 
-      googleAutocompleteService.current = new google.maps.places.AutocompleteService();
+      placesAutocompleteService.current = new google.maps.places.AutocompleteService();
       if (sessionToken) autocompleteSession.current = new google.maps.places.AutocompleteSessionToken();
     };
 
@@ -115,6 +115,7 @@ function usePlacesAutocompleteService(_ref) {
     }
   }, []);
   return {
+    placesAutocompleteService: placesAutocompleteService.current,
     placePredictions: placeInputValue ? placePredictions : [],
     isPlacePredictionsLoading: isPlacePredsLoading,
     getPlacePredictions: function getPlacePredictions(opt) {

diff --git a/lib/usePlacesWidget.js b/lib/usePlacesWidget.js
@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = usePlacesWidget;
+exports.default = usePlacesWidget;
 
 var _react = require("react");
 

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "react-google-autocomplete",
-  "version": "2.1.2",
+  "version": "2.2.0",
   "description": "React component for google autocomplete.",
   "main": "index.js",
   "types": "index.d.ts",

diff --git a/src/usePlacesAutocompleteService.d.ts b/src/usePlacesAutocompleteService.d.ts
@@ -7,6 +7,7 @@ interface usePlacesAutocompleteServiceConfig {
 }
 
 interface usePlacesAutocompleteServiceResponse {
+  placesAutocompleteService: google.maps.places.AutocompleteService | null;
   placePredictions: google.maps.places.AutocompletePrediction[];
   isPlacePredictionsLoading: boolean;
   getPlacePredictions: (opt: google.maps.places.AutocompletionRequest) => void;

diff --git a/src/usePlacesAutocompleteService.js b/src/usePlacesAutocompleteService.js
@@ -18,7 +18,7 @@ export default function usePlacesAutocompleteService({
   const [isQueryPredsLoading, setIsQueryPredsLoading] = useState(false);
   const [queryInputValue, setQueryInputValue] = useState(false);
   const [queryPredictions, setQueryPredictions] = useState([]);
-  const googleAutocompleteService = useRef(null);
+  const placesAutocompleteService = useRef(null);
   const autocompleteSession = useRef(null);
   const handleLoadScript = useCallback(
     () => loadGoogleMapScript(googleMapsScriptBaseUrl, googleMapsScriptUrl),
@@ -27,8 +27,8 @@ export default function usePlacesAutocompleteService({
 
   const debouncedPlacePredictions = useCallback(
     debounceFn((optionsArg) => {
-      if (googleAutocompleteService.current && optionsArg.input)
-        googleAutocompleteService.current.getPlacePredictions(
+      if (placesAutocompleteService.current && optionsArg.input)
+        placesAutocompleteService.current.getPlacePredictions(
           {
             ...options,
             ...optionsArg,
@@ -47,8 +47,8 @@ export default function usePlacesAutocompleteService({
 
   const debouncedQueryPredictions = useCallback(
     debounceFn((optionsArg) => {
-      if (googleAutocompleteService.current && optionsArg.input)
-        googleAutocompleteService.current.getQueryPredictions(
+      if (placesAutocompleteService.current && optionsArg.input)
+        placesAutocompleteService.current.getQueryPredictions(
           {
             ...options,
             ...optionsArg,
@@ -76,10 +76,12 @@ export default function usePlacesAutocompleteService({
         );
 
       // eslint-disable-next-line no-undef
-      googleAutocompleteService.current = new google.maps.places.AutocompleteService();
+      placesAutocompleteService.current =
+        new google.maps.places.AutocompleteService();
 
       if (sessionToken)
-        autocompleteSession.current = new google.maps.places.AutocompleteSessionToken();
+        autocompleteSession.current =
+          new google.maps.places.AutocompleteSessionToken();
     };
 
     if (apiKey) {
@@ -90,6 +92,7 @@ export default function usePlacesAutocompleteService({
   }, []);
 
   return {
+    placesAutocompleteService: placesAutocompleteService.current,
     placePredictions: placeInputValue ? placePredictions : [],
     isPlacePredictionsLoading: isPlacePredsLoading,
     getPlacePredictions: (opt) => {