feat(src): rewrite with new API

* remove the usage of React undocumented context API
* embrace es6 with babel

src/Circle.js

@@ -0,0 +1,13 @@
+import SimpleChildComponent from "./internals/SimpleChildComponent";
+import createRegisterEvents from "./internals/createRegisterEvents";
+
+class Circle extends SimpleChildComponent {
+}
+
+Circle._GoogleMapsClassName = "Circle";
+
+Circle._registerEvents = createRegisterEvents(
+  "center_changed click dblclick drag dragend dragstart mousedown mousemove mouseout mouseover mouseup radius_changed rightclick"
+);
+
+export default Circle;

src/DirectionsRenderer.js

@@ -0,0 +1,14 @@
+import SimpleChildComponent from "./internals/SimpleChildComponent";
+import createRegisterEvents from "./internals/createRegisterEvents";
+import BASIC_EVENT_NAMES from "./internals/BASIC_EVENT_NAMES";
+
+class DirectionsRenderer extends SimpleChildComponent {
+}
+
+DirectionsRenderer._GoogleMapsClassName = "DirectionsRenderer";
+
+DirectionsRenderer._registerEvents = createRegisterEvents(
+  BASIC_EVENT_NAMES
+);
+
+export default DirectionsRenderer;

src/GoogleMaps.js

@@ -0,0 +1,108 @@
+import React from "react";
+
+import EventComponent from "./internals/EventComponent";
+import exposeGetters from "./internals/exposeGetters";
+import createRegisterEvents from "./internals/createRegisterEvents";
+
+const {PropTypes} = React;
+
+class GoogleMaps extends EventComponent {
+  /*
+   * Some public API we'd like to expose
+   */
+  panBy (x, y) {
+    const {instance} = this.state;
+    if (instance) {
+      instance.panBy(x, y);
+    }
+  }
+
+  panTo (latLng) {
+    const {instance} = this.state;
+    if (instance) {
+      instance.panTo(latLng);
+    }
+  }
+
+  panToBounds (latLngBounds) {
+    const {instance} = this.state;
+    if (instance) {
+      instance.panToBounds(latLngBounds);
+    }
+  }
+
+  fitBounds (latLngBounds) {
+    const {instance} = this.state;
+    if (instance) {
+      instance.fitBounds(latLngBounds);
+    }
+  }
+  /*
+   * Internals
+   */
+  constructor (props) {
+    super(props);
+    this.state = {};
+  }
+
+  _createOrUpdateInstance () {
+    const {props} = this;
+    if (!props.googleMapsApi) {
+      return;
+    }
+    // googleMapsApi can be async loaded
+    const {containerProps, googleMapsApi, key, ref, ...googleMapsConfig} = props;
+    var {instance} = this.state;
+
+    if (instance) {
+      instance.setOptions(googleMapsConfig);
+    } else {
+      const GoogleMapsClass = googleMapsApi.Map;
+      instance = new GoogleMapsClass(
+        React.findDOMNode(this.refs.googleMaps),
+        googleMapsConfig
+      );
+      exposeGetters(this, GoogleMapsClass.prototype, instance);
+
+      this.setState({instance});
+    }
+    return instance;
+  }
+
+  render () {
+    const {props} = this;
+
+    return (
+      <div {...props.containerProps}>
+        <div {...props.mapProps} ref="googleMaps" />
+        {this._render_children_()}
+      </div>
+    );
+  }
+
+  _render_children_ () {
+    const extraProps = {
+      googleMapsApi: this.props.googleMapsApi,
+      map: this.state.instance,
+    };
+
+    return React.Children.map(this.props.children, (child) => {
+      if (child && child.type) {
+        child = React.cloneElement(child, extraProps);
+      }
+      return child;
+    });
+  }
+}
+
+GoogleMaps.propTypes = {
+  ...EventComponent.propTypes,
+  containerProps: PropTypes.object.isRequired,
+  mapProps: PropTypes.object.isRequired,
+};
+
+GoogleMaps._registerEvents = createRegisterEvents(
+  "bounds_changed center_changed click dblclick drag dragend dragstart heading_changed idle maptypeid_changed mousemove mouseout mouseover projection_changed resize rightclick tilesloaded tilt_changed zoom_changed"
+);
+
+export default GoogleMaps;

src/InfoWindow.js

@@ -0,0 +1,34 @@
+import React from "react";
+
+import SimpleChildComponent from "./internals/SimpleChildComponent";
+import createRegisterEvents from "./internals/createRegisterEvents";
+
+const {PropTypes} = React;
+
+class InfoWindow extends SimpleChildComponent {
+
+  _createOrUpdateInstance () {
+    const instance = super._createOrUpdateInstance();
+    if (instance) {
+      instance.open(
+        this.props.map,
+        this.props.anchor
+      );
+    }
+    return instance;
+  }
+
+}
+
+InfoWindow.propTypes = {
+  ...SimpleChildComponent.propTypes,
+  anchor: PropTypes.object,
+};
+
+InfoWindow._GoogleMapsClassName = "InfoWindow";
+
+InfoWindow._registerEvents = createRegisterEvents(
+  "closeclick content_changed domready position_changed zindex_changed"
+);
+
+export default InfoWindow;

src/Marker.js

@@ -0,0 +1,43 @@
+import React from "react";
+
+import SimpleChildComponent from "./internals/SimpleChildComponent";
+import createRegisterEvents from "./internals/createRegisterEvents";
+
+import InfoWindow from "./InfoWindow";
+
+class Marker extends SimpleChildComponent {
+
+  render () {
+    const {props} = this;
+
+    return (
+      <noscript>
+        {this._render_potential_info_windows_()}
+      </noscript>
+    );
+  }
+
+  _render_potential_info_windows_ () {
+    const extraProps = {
+      googleMapsApi: this.props.googleMapsApi,
+      map: this.props.map,
+      anchor: this.state.instance,
+    };
+
+    return React.Children.map(this.props.children, (child) => {
+      if (React.isValidElement(child) && child.type === InfoWindow) {
+        child = React.cloneElement(child, extraProps);
+      }
+      return child;
+    }, this);
+  }
+
+}
+
+Marker._GoogleMapsClassName = "Marker";
+
+Marker._registerEvents = createRegisterEvents(
+  "animation_changed click clickable_changed cursor_changed dblclick drag dragend draggable_changed dragstart flat_changed icon_changed mousedown mouseout mouseover mouseup position_changed rightclick shape_changed title_changed visible_changed zindex_changed"
+);
+
+export default Marker;

src/Polygon.js

@@ -0,0 +1,14 @@
+import SimpleChildComponent from "./internals/SimpleChildComponent";
+import createRegisterEvents from "./internals/createRegisterEvents";
+import BASIC_EVENT_NAMES from "./internals/BASIC_EVENT_NAMES";
+
+class Polygon extends SimpleChildComponent {
+}
+
+Polygon._GoogleMapsClassName = "Polygon";
+
+Polygon._registerEvents = createRegisterEvents(
+  BASIC_EVENT_NAMES
+);
+
+export default Polygon;

src/Polyline.js

@@ -0,0 +1,14 @@
+import SimpleChildComponent from "./internals/SimpleChildComponent";
+import createRegisterEvents from "./internals/createRegisterEvents";
+import BASIC_EVENT_NAMES from "./internals/BASIC_EVENT_NAMES";
+
+class Polyline extends SimpleChildComponent {
+}
+
+Polyline._GoogleMapsClassName = "Polyline";
+
+Polyline._registerEvents = createRegisterEvents(
+  BASIC_EVENT_NAMES
+);
+
+export default Polyline;