@react-google-maps/api - npm Package Compare versions

Comparing version 1.0.4 to 1.0.5

package.json

 {
   "name": "@react-google-maps/api",
-  "version": "1.0.4",
+  "version": "1.0.5",
   "description": "React.js Google Maps API integration",
@@ -85,2 +85,3 @@ "license": "MIT",
       "*.js": [
+        "npx eslint --fix",
         "git add -A"
@@ -124,9 +125,9 @@ ]
     "@types/acorn": "4.0.4",
-    "@types/eslint": "4.16.5",
+    "@types/eslint": "4.16.6",
     "@types/googlemaps": "3.30.16",
     "@types/markerclustererplus": "2.1.33",
-    "@types/react": "16.7.20",
+    "@types/react": "16.8.0",
     "@types/react-dom": "16.0.11",
     "@types/webpack-bundle-analyzer": "2.13.0",
-    "acorn": "6.0.5",
+    "acorn": "6.0.6",
     "babel-eslint": "10.0.1",
@@ -148,5 +149,5 @@ "babel-loader": "8.0.5",
     "eslint-plugin-html": "5.0.0",
-    "eslint-plugin-import": "2.15.0",
+    "eslint-plugin-import": "2.16.0",
     "eslint-plugin-json": "1.3.2",
-    "eslint-plugin-jsx-a11y": "6.1.2",
+    "eslint-plugin-jsx-a11y": "6.2.0",
     "eslint-plugin-no-inferred-method-name": "1.0.2",
@@ -163,3 +164,3 @@ "eslint-plugin-node": "8.0.1",
     "husky": "1.3.1",
-    "lint-staged": "8.1.0",
+    "lint-staged": "8.1.1",
     "npm-watch": "0.6.0",
@@ -172,3 +173,3 @@ "prop-types": "15.6.2",
     "terser-webpack-plugin": "1.2.1",
-    "typescript": "3.2.4",
+    "typescript": "3.3.1",
     "webpack": "4.29.0",
@@ -178,3 +179,3 @@ "webpack-bundle-analyzer": "3.0.3",
   },
-  "gitHead": "c8320292f26e85eeca413bfa7a7944b97827fae2"
+  "gitHead": "634ea34b292f9ee5ce0ec8a6b185e2dc7ca3795d"
 }

README.md

@@ -7,3 +7,3 @@ # @react-google-maps/api
 
-This is complete re-write of the (sadly unmaintained) ```react-google-maps``` library. We thank [tomchentw](https://github.com/tomchentw/) for his great work that made possible.
+This is complete re-write of the (sadly unmaintained) `react-google-maps` library. We thank [tomchentw](https://github.com/tomchentw/) for his great work that made possible.
 
@@ -37,3 +37,3 @@ @react-google-maps/api provides very simple bindings to the google maps api and lets you use it in your app as React components.
 
-## Advise
+## Advice
 
@@ -40,0 +40,0 @@ You can save on bundle size if you import only components, which you use from `@react-google-maps/api/lib/...`, although whole library is tree-shakable.

src/components/places/StandaloneSearchBox.js

 /* global google */
-import { PureComponent, Children } from 'react'
+import React, { PureComponent } from 'react'
 import invariant from 'invariant'
 
-import {
-  unregisterEvents,
-  applyUpdatersToPropsAndRegisterEvents
-} from '../../utils/helper'
+import { unregisterEvents, applyUpdatersToPropsAndRegisterEvents } from '../../utils/helper'
 
@@ -15,3 +12,3 @@ import MapContext from '../../map-context'
 const eventMap = {
-  onPlacesChanged: 'places_changed',
+  onPlacesChanged: 'places_changed'
 }
@@ -22,3 +19,3 @@
     instance.setBounds(bounds)
-  },
+  }
 }
@@ -40,6 +37,4 @@
 
-    invariant(
-      google.maps.places,
-      'Did you include "libraries=places" in the URL?'
-    )
+    invariant(google.maps.places, 'Did you include "libraries=places" in the URL?')
+    this.containerElement = React.createRef()
   }
@@ -49,7 +44,8 @@
     const searchBox = new google.maps.places.SearchBox(
-      this.props.containerElement.querySelector('input'),
-      Object.assign({
-        map: this.context
-      },
-      this.props.options
+      this.containerElement.current.querySelector('input'),
+      Object.assign(
+        {
+          map: this.context
+        },
+        this.props.options
       )
@@ -90,11 +86,11 @@ )
 
-  render = () => Children.only(this.props.children)
+  render = () => {
+    return <div ref={this.containerElement}>{React.Children.only(this.props.children)}</div>
+  }
 
-  getBounds = () =>
-    this.state.searchBox.getBounds()
+  getBounds = () => this.state.searchBox.getBounds()
 
-  getPlaces = () =>
-    this.state.searchBox.getPlaces()
+  getPlaces = () => this.state.searchBox.getPlaces()
 }
 
 export default StandaloneSearchBox

src/GoogleMap.js

 /* global google */
-import React, {
-  PureComponent
-} from 'react'
-import {
-  GoogleMapPropTypes
-} from './proptypes'
+import React, { PureComponent } from 'react'
+import { GoogleMapPropTypes } from './proptypes'
 import MapContext from './map-context'
-import {
-  saveInstance,
-  restoreInstance
-} from './utils/instance-persistance'
-import {
-  unregisterEvents,
-  applyUpdatersToPropsAndRegisterEvents
-} from './utils/helper'
+import { saveInstance, restoreInstance } from './utils/instance-persistance'
+import { unregisterEvents, applyUpdatersToPropsAndRegisterEvents } from './utils/helper'
 
@@ -77,3 +67,3 @@ const eventMap = {
     reuseSameInstance: false,
-    onLoad: () => { }
+    onLoad: () => {}
   }
@@ -92,6 +82,7 @@
 
-    return map || new google.maps.Map(
-      this.mapRef, {
+    return (
+      map ||
+      new google.maps.Map(this.mapRef, {
         ...this.props.options
-      }
+      })
     )
@@ -144,25 +135,9 @@ }
   render = () => {
-    const {
-      id,
-      mapContainerStyle,
-      mapContainerClassName,
-      children
-    } = this.props
+    const { id, mapContainerStyle, mapContainerClassName, children } = this.props
 
-    const {
-      map
-    } = this.state
+    const { map } = this.state
 
     return (
-      <div
-        id={id}
-        ref={this.getRef}
-        style={mapContainerStyle}
-        className={mapContainerClassName}
-      >
-        <MapContext.Provider
-          value={map}
-        >
-          {map !== null ? children : null}
-        </MapContext.Provider>
+      <div id={id} ref={this.getRef} style={mapContainerStyle} className={mapContainerClassName}>
+        <MapContext.Provider value={map}>{map !== null ? children : null}</MapContext.Provider>
       </div>
@@ -169,0 +144,0 @@ )

src/index.js

@@ -32,3 +32,3 @@ export { default as GoogleMap } from './GoogleMap'
 // export { default as SearchBox } from './components/places/SearchBox'
-// export { default as StandaloneSearchBox } from './components/places/StandaloneSearchBox'
+export { default as StandaloneSearchBox } from './components/places/StandaloneSearchBox'
 
@@ -35,0 +35,0 @@ // export { default as InfoBox } from './components/addons/InfoBox'

src/LoadScript.js

@@ -41,2 +41,4 @@ import React, { Component } from 'react'
 
+      // TODO: There should be better way to do it, but I don't have time now :)
+      // eslint-disable-next-line react/no-did-update-set-state
       this.setState(
@@ -43,0 +45,0 @@ () => ({

No alert changes

Improved metrics

Total package byte prevSize

648258

increased by0.02%

Worsened metrics

Lines of code

9755

decreased by-0.28%

No dependency changes