react-leaflet - npm Package Compare versions

Comparing version 0.8.1 to 0.9.0

CHANGELOG.md

@@ -0,1 +1,9 @@
+## v0.9.0 (12/11/15)
+
+- Removed `PopupContainer` component, extended internally by other components.
+- `FeatureGroup` now expects its layers to be passed as children, like `LayerGroup`.
+- Added `renderChildrenWithProps()` to `MapLayer`, used internally by the library.
+- Added `MapControl` as base component for controls.
+- Added `ZoomControl`.
+
 ## v0.8.1 (21/10/15)
@@ -2,0 +10,0 @@

lib/BaseTileLayer.js

@@ -9,3 +9,3 @@ 'use strict';
 
-var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; desc = parent = getter = undefined; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
+var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; desc = parent = undefined; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
 
@@ -12,0 +12,0 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }

lib/CanvasTileLayer.js

@@ -9,3 +9,3 @@ 'use strict';
 
-var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; desc = parent = getter = undefined; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
+var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; desc = parent = undefined; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
 
@@ -12,0 +12,0 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }

lib/Circle.js

@@ -9,3 +9,3 @@ 'use strict';
 
-var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; desc = parent = getter = undefined; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
+var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; desc = parent = undefined; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
 
@@ -12,0 +12,0 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }

lib/CircleMarker.js

@@ -9,3 +9,3 @@ 'use strict';
 
-var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; desc = parent = getter = undefined; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
+var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; desc = parent = undefined; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
 
@@ -12,0 +12,0 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }

lib/FeatureGroup.js

@@ -9,3 +9,3 @@ 'use strict';
 
-var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; desc = parent = getter = undefined; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
+var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; desc = parent = undefined; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
 
@@ -20,4 +20,2 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
 
-var _react = require('react');
-
 var _leaflet = require('leaflet');
@@ -42,10 +40,15 @@
       var _props = this.props;
-      var layers = _props.layers;
       var map = _props.map;
 
-      var props = _objectWithoutProperties(_props, ['layers', 'map']);
+      var props = _objectWithoutProperties(_props, ['map']);
 
-      this.leafletElement = (0, _leaflet.featureGroup)(layers);
+      this.leafletElement = (0, _leaflet.featureGroup)();
     }
   }, {
+    key: 'componentDidMount',
+    value: function componentDidMount() {
+      _get(Object.getPrototypeOf(FeatureGroup.prototype), 'componentDidMount', this).call(this);
+      this.setStyle(this.props);
+    }
+  }, {
     key: 'componentDidUpdate',
@@ -55,8 +58,10 @@ value: function componentDidUpdate(prevProps) {
     }
-  }], [{
-    key: 'propTypes',
-    value: {
-      layers: _react.PropTypes.array.isRequired
-    },
-    enumerable: true
+  }, {
+    key: 'render',
+    value: function render() {
+      return this.renderChildrenWithProps({
+        layerGroup: this.leafletElement,
+        popupContainer: this.leafletElement
+      });
+    }
   }]);
@@ -63,0 +68,0 @@

lib/GeoJson.js

@@ -9,3 +9,3 @@ 'use strict';
 
-var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; desc = parent = getter = undefined; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
+var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; desc = parent = undefined; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
 
@@ -12,0 +12,0 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }

lib/ImageOverlay.js

@@ -9,3 +9,3 @@ 'use strict';
 
-var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; desc = parent = getter = undefined; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
+var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; desc = parent = undefined; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
 
@@ -12,0 +12,0 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }

lib/index.js

@@ -81,2 +81,8 @@ 'use strict';
 
+var _MapControl2 = require('./MapControl');
+
+var _MapControl3 = _interopRequireDefault(_MapControl2);
+
+exports.MapControl = _MapControl3['default'];
+
 var _MapLayer2 = require('./MapLayer');
@@ -130,8 +136,2 @@
 
-var _PopupContainer2 = require('./PopupContainer');
-
-var _PopupContainer3 = _interopRequireDefault(_PopupContainer2);
-
-exports.PopupContainer = _PopupContainer3['default'];
-
 var _Rectangle2 = require('./Rectangle');
@@ -154,2 +154,8 @@
 exports.WMSTileLayer = _WMSTileLayer3['default'];
+
+var _ZoomControl2 = require('./ZoomControl');
+
+var _ZoomControl3 = _interopRequireDefault(_ZoomControl2);
+
+exports.ZoomControl = _ZoomControl3['default'];
 var setIconDefaultImagePath = function setIconDefaultImagePath(path) {
@@ -160,2 +166,2 @@ _leaflet2['default'].Icon.Default.imagePath = path;
 exports.setIconDefaultImagePath = setIconDefaultImagePath;
-setIconDefaultImagePath('//cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.5/images');
+setIconDefaultImagePath('//cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.7/images');

lib/LayerGroup.js

@@ -9,3 +9,3 @@ 'use strict';
 
-var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; desc = parent = getter = undefined; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
+var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; desc = parent = undefined; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
 
@@ -18,6 +18,2 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
 
-var _react = require('react');
-
-var _react2 = _interopRequireDefault(_react);
-
 var _leaflet = require('leaflet');
@@ -47,24 +43,6 @@
     value: function render() {
-      var _this = this;
-
-      var children = _react2['default'].Children.map(this.props.children, function (child) {
-        return child ? _react2['default'].cloneElement(child, {
-          layerGroup: _this.leafletElement,
-          map: _this.props.map
-        }) : null;
+      return this.renderChildrenWithProps({
+        layerGroup: this.leafletElement
       });
-
-      return _react2['default'].createElement(
-        'div',
-        { style: { display: 'none' } },
-        children
-      );
     }
-  }], [{
-    key: 'propTypes',
-    value: {
-      children: _react.PropTypes.oneOfType([_react.PropTypes.arrayOf(_react.PropTypes.node), _react.PropTypes.node]),
-      map: _react.PropTypes.instanceOf(_leaflet.Map)
-    },
-    enumerable: true
   }]);
@@ -71,0 +49,0 @@

lib/Map.js

@@ -11,3 +11,3 @@ /* eslint-disable react/no-did-mount-set-state */
 
-var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; desc = parent = getter = undefined; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
+var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; desc = parent = undefined; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
 
@@ -63,2 +63,3 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
       bounds: _typesBounds2['default'],
+      boundsOptions: _react.PropTypes.object,
       center: _typesLatlng2['default'],
@@ -93,3 +94,3 @@ children: _react.PropTypes.oneOfType([_react.PropTypes.arrayOf(_react.PropTypes.node), _react.PropTypes.node]),
       if (!(0, _lodashLangIsUndefined2['default'])(this.props.bounds)) {
-        this.leafletElement.fitBounds(this.props.bounds);
+        this.leafletElement.fitBounds(this.props.bounds, this.props.boundsOptions);
       }
@@ -115,3 +116,3 @@ }
       if (bounds && this.shouldUpdateBounds(bounds, prevProps.bounds)) {
-        this.leafletElement.fitBounds(bounds);
+        this.leafletElement.fitBounds(bounds, this.props.boundsOptions);
       }
@@ -118,0 +119,0 @@ }

lib/MapComponent.js

@@ -9,3 +9,3 @@ 'use strict';
 
-var _get = function get(_x3, _x4, _x5) { var _again = true; _function: while (_again) { var object = _x3, property = _x4, receiver = _x5; desc = parent = getter = undefined; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x3 = parent; _x4 = property; _x5 = receiver; _again = true; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
+var _get = function get(_x3, _x4, _x5) { var _again = true; _function: while (_again) { var object = _x3, property = _x4, receiver = _x5; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x3 = parent; _x4 = property; _x5 = receiver; _again = true; desc = parent = undefined; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
 
@@ -12,0 +12,0 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }

lib/MapLayer.js

@@ -9,3 +9,3 @@ 'use strict';
 
-var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; desc = parent = getter = undefined; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
+var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; desc = parent = undefined; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
 
@@ -26,2 +26,4 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
 
+var _leaflet = require('leaflet');
+
 var _MapComponent2 = require('./MapComponent');
@@ -65,2 +67,19 @@
     }
+  }, {
+    key: 'renderChildrenWithProps',
+    value: function renderChildrenWithProps(props) {
+      var children = this.getClonedChildrenWithMap(props);
+      return _react2['default'].createElement(
+        'div',
+        { style: { display: 'none' } },
+        children
+      );
+    }
+  }], [{
+    key: 'propTypes',
+    value: {
+      children: _react.PropTypes.oneOfType([_react.PropTypes.arrayOf(_react.PropTypes.node), _react.PropTypes.node]),
+      map: _react.PropTypes.instanceOf(_leaflet.Map)
+    },
+    enumerable: true
   }]);
@@ -67,0 +86,0 @@

lib/Marker.js

@@ -9,3 +9,3 @@ 'use strict';
 
-var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; desc = parent = getter = undefined; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
+var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; desc = parent = undefined; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
 
@@ -28,8 +28,8 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
 
-var _PopupContainer2 = require('./PopupContainer');
+var _MapLayer2 = require('./MapLayer');
 
-var _PopupContainer3 = _interopRequireDefault(_PopupContainer2);
+var _MapLayer3 = _interopRequireDefault(_MapLayer2);
 
-var Marker = (function (_PopupContainer) {
-  _inherits(Marker, _PopupContainer);
+var Marker = (function (_MapLayer) {
+  _inherits(Marker, _MapLayer);
 
@@ -70,2 +70,9 @@ function Marker() {
     }
+  }, {
+    key: 'render',
+    value: function render() {
+      return this.renderChildrenWithProps({
+        popupContainer: this.leafletElement
+      });
+    }
   }], [{
@@ -83,5 +90,5 @@ key: 'propTypes',
   return Marker;
-})(_PopupContainer3['default']);
+})(_MapLayer3['default']);
 
 exports['default'] = Marker;
 module.exports = exports['default'];

lib/MultiPolygon.js

@@ -9,3 +9,3 @@ 'use strict';
 
-var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; desc = parent = getter = undefined; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
+var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; desc = parent = undefined; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
 
@@ -12,0 +12,0 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }

lib/MultiPolyline.js

@@ -9,3 +9,3 @@ 'use strict';
 
-var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; desc = parent = getter = undefined; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
+var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; desc = parent = undefined; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
 
@@ -12,0 +12,0 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }

lib/Path.js

@@ -9,3 +9,3 @@ 'use strict';
 
-var _get = function get(_x2, _x3, _x4) { var _again = true; _function: while (_again) { var object = _x2, property = _x3, receiver = _x4; desc = parent = getter = undefined; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x2 = parent; _x3 = property; _x4 = receiver; _again = true; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
+var _get = function get(_x2, _x3, _x4) { var _again = true; _function: while (_again) { var object = _x2, property = _x3, receiver = _x4; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x2 = parent; _x3 = property; _x4 = receiver; _again = true; desc = parent = undefined; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
 
@@ -26,10 +26,10 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
 
-var _PopupContainer2 = require('./PopupContainer');
+var _MapLayer2 = require('./MapLayer');
 
-var _PopupContainer3 = _interopRequireDefault(_PopupContainer2);
+var _MapLayer3 = _interopRequireDefault(_MapLayer2);
 
 var OPTIONS = ['stroke', 'color', 'weight', 'opacity', 'fill', 'fillColor', 'fillOpacity', 'fillRule', 'dashArray', 'lineCap', 'lineJoin', 'clickable', 'pointerEvents', 'className'];
 
-var Path = (function (_PopupContainer) {
-  _inherits(Path, _PopupContainer);
+var Path = (function (_MapLayer) {
+  _inherits(Path, _MapLayer);
 
@@ -62,8 +62,15 @@ function Path() {
     }
+  }, {
+    key: 'render',
+    value: function render() {
+      return this.renderChildrenWithProps({
+        popupContainer: this.leafletElement
+      });
+    }
   }]);
 
   return Path;
-})(_PopupContainer3['default']);
+})(_MapLayer3['default']);
 
 exports['default'] = Path;
 module.exports = exports['default'];

lib/Polygon.js

@@ -9,3 +9,3 @@ 'use strict';
 
-var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; desc = parent = getter = undefined; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
+var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; desc = parent = undefined; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
 
@@ -12,0 +12,0 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }

lib/Polyline.js

@@ -9,3 +9,3 @@ 'use strict';
 
-var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; desc = parent = getter = undefined; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
+var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; desc = parent = undefined; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
 
@@ -12,0 +12,0 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }

lib/Popup.js

@@ -9,3 +9,3 @@ 'use strict';
 
-var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; desc = parent = getter = undefined; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
+var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; desc = parent = undefined; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
 
@@ -12,0 +12,0 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }

lib/Rectangle.js

@@ -9,3 +9,3 @@ 'use strict';
 
-var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; desc = parent = getter = undefined; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
+var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; desc = parent = undefined; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
 
@@ -12,0 +12,0 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }

lib/TileLayer.js

@@ -9,3 +9,3 @@ 'use strict';
 
-var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; desc = parent = getter = undefined; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
+var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; desc = parent = undefined; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
 
@@ -12,0 +12,0 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }

lib/types/bounds.js

@@ -11,8 +11,4 @@ 'use strict';
 
-var _react2 = _interopRequireDefault(_react);
-
 var _leaflet = require('leaflet');
 
-var _leaflet2 = _interopRequireDefault(_leaflet);
-
 var _latlngList = require('./latlngList');
@@ -22,3 +18,3 @@
 
-exports['default'] = _react2['default'].PropTypes.oneOfType([_react2['default'].PropTypes.instanceOf(_leaflet2['default'].LatLngBounds), _latlngList2['default']]);
+exports['default'] = _react.PropTypes.oneOfType([_react.PropTypes.instanceOf(_leaflet.LatLngBounds), _latlngList2['default']]);
 module.exports = exports['default'];

lib/types/index.js

@@ -15,2 +15,8 @@ 'use strict';
 
+var _controlPosition2 = require('./controlPosition');
+
+var _controlPosition3 = _interopRequireDefault(_controlPosition2);
+
+exports.controlPosition = _controlPosition3['default'];
+
 var _latlng2 = require('./latlng');
@@ -17,0 +23,0 @@

lib/WMSTileLayer.js

@@ -9,3 +9,3 @@ 'use strict';
 
-var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; desc = parent = getter = undefined; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
+var _get = function get(_x, _x2, _x3) { var _again = true; _function: while (_again) { var object = _x, property = _x2, receiver = _x3; _again = false; if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { _x = parent; _x2 = property; _x3 = receiver; _again = true; desc = parent = undefined; continue _function; } } else if ('value' in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } } };
 
@@ -12,0 +12,0 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }

package.json

 {
   "name": "react-leaflet",
-  "version": "0.8.1",
+  "version": "0.9.0",
   "description": "React components for Leaflet maps",
@@ -18,4 +18,3 @@ "main": "lib/index.js",
     "prepublish": "npm ls && npm start",
-    "example:compile": "gulp",
-    "example:watch": "gulp watch:example",
+    "examples": "webpack-dev-server --config ./example/webpack.config.js",
     "lint": "eslint ./src",
@@ -49,23 +48,18 @@ "lintAndTest": "npm run lint && jest"
   "devDependencies": {
-    "babel": "^5.8.23",
-    "babel-core": "^5.8.25",
-    "babel-eslint": "^4.1.3",
+    "babel": "^5.8.29",
+    "babel-core": "^5.8.33",
+    "babel-eslint": "^4.1.5",
+    "babel-jest": "^5.3.0",
     "babel-loader": "^5.3.2",
-    "babel-jest": "^5.3.0",
-    "babelify": "^6.4.0",
-    "browserify": "^11.2.0",
-    "eslint": "^1.7.3",
-    "eslint-plugin-react": "^3.6.3",
-    "gulp": "^3.9.0",
-    "gulp-load-plugins": "^1.0.0",
-    "gulp-util": "^3.0.7",
-    "gulp-webserver": "^0.9.1",
-    "jest-cli": "^0.5.10",
-    "leaflet": "^0.7.5",
+    "babel-plugin-react-transform": "^1.1.1",
+    "eslint": "^1.9.0",
+    "eslint-plugin-react": "^3.8.0",
+    "jest-cli": "^0.7.1",
+    "leaflet": "^0.7.7",
     "onchange": "^2.0.0",
-    "react": "^0.14.0-rc1",
-    "react-dom": "^0.14.0-rc1",
-    "vinyl-source-stream": "^1.1.0",
-    "watchify": "^3.4.0",
-    "webpack": "^1.12.2"
+    "react": "^0.14.2",
+    "react-dom": "^0.14.2",
+    "react-transform-hmr": "^1.0.1",
+    "webpack": "^1.12.4",
+    "webpack-dev-server": "^1.12.1"
   },
@@ -72,0 +66,0 @@ "jest": {

README.md

@@ -75,12 +75,14 @@ # React-Leaflet
 
-**setIconDefaultImagePath(path: string)**: Setter for `Leaflet.Icon.Default.imagePath`, set to `//cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.5/images` by default.
+**setIconDefaultImagePath(path: string)**: Setter for `Leaflet.Icon.Default.imagePath`, set to `//cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.7/images` by default.
 
 ### PropTypes
 
-**LatLng**: One of `[Number, Number]`, `{lat: Number, lng: Number}` or `{lat: Number, lon: Number}`.
+**latLng**: One of `[number, number]`, `{lat: number, lng: number}` or `{lat: number, lon: number}`.
 
-**LatLngList**: An Array of *LatLng*.
+**latLngList**: An Array of *LatLng*.
 
-**Bounds**: An instance of *Leaflet.LatLngBounds* or a *LatLngList*.
+**bounds**: An instance of *Leaflet.LatLngBounds* or a *LatLngList*.
 
+**controlPosition**: One of `topleft`, `topright`, `bottomleft` or `bottomright`.
+
 ### Events
@@ -107,5 +109,13 @@
 
+##### MapControl
+
+Base class extending `React.Component` for controls.  
+It exposes a `getLeafletElement()` method to access the `Leaflet` object created for the control.
+
 ##### MapLayer
 
-Base class extending `MapComponent` using the provided `map` prop to add its element and passing it down to its children.
+Base class extending `MapComponent` using the provided `map` prop to add its element and passing it down to its children.  
+It exposes the following methods:
+- `getClonedChildrenWithMap(object extra): object`: returns the cloned children of the component, adding the `map` and the `extra` props provided to them.
+- `renderChildrenWithProps(object props): object`: returns the cloned children of the component using `getClonedChildrenWithMap()`, wrapped in a `<div>` with `display: none` style.
 
@@ -116,12 +126,8 @@ ##### BaseTileLayer
 
-##### PopupContainer
-
-Base class extending `MapLayer` with a `render()` method passing its `leafletElement` to its children as the `popupContainer` prop.
-
 ##### Path
 
-Base class extending `PopupContainer` with the following methods:
-- `getPathOptions(Object props): Object`: filters the input `props` and return a new object of [Path options](http://leafletjs.com/reference.html#path-options) properties.
-- `setStyle(Object options = {}): void`: alias to the Leaflet element [`setStyle()`](http://leafletjs.com/reference.html#path-setstyle).
-- `setStyleIfChanged(Object fromProps, Object toProps): void`: extracts the Path options of the two arguments, and calls `setStyle()` with the new options if different from the previous ones.
+Base class extending `MapLayer` with the following methods:
+- `getPathOptions(object props): object`: filters the input `props` and return a new object of [Path options](http://leafletjs.com/reference.html#path-options) properties.
+- `setStyle(object options = {}): void`: alias to the Leaflet element [`setStyle()`](http://leafletjs.com/reference.html#path-setstyle).
+- `setStyleIfChanged(object fromProps, object toProps): void`: extracts the Path options of the two arguments, and calls `setStyle()` with the new options if different from the previous ones.
 
@@ -133,11 +139,12 @@ #### Map
 **Properties**
-- `bounds: Bounds` (optional, dynamic): A rectangle for the map to contain. It will be centered, and the map will zoom in as close as it can while still showing the full bounds. This property is dynamic, if you change it it will be reflected on the map.
-- `center: LatLng` (optional, dynamic): Center of the map. This property is dynamic, if you change it it will be reflected in the map.
-- `className: String` (optional, dynamic): className property of the `<div>` container for the map.
-- `id: String` (optional): The ID of the `<div>` container for the map. If you don't provide it, a unique one will be created.
-- `maxBounds: Bounds` (optional, dynamic)
-- `maxZoom: Number` (optional)
-- `minZoom: Number` (optional)
-- `style: Object` (optional, dynamic): style property of the `<div>` container for the map.
-- `zoom: Number` (optional, dynamic)
+- `bounds: bounds` (optional, dynamic): A rectangle for the map to contain. It will be centered, and the map will zoom in as close as it can while still showing the full bounds. This property is dynamic, if you change it it will be reflected on the map.
+- `boundsOptions: object` (optional, dynamic): Options passed to the `fitBounds()` method.
+- `center: latLng` (optional, dynamic): Center of the map. This property is dynamic, if you change it it will be reflected in the map.
+- `className: string` (optional, dynamic): className property of the `<div>` container for the map.
+- `id: string` (optional): The ID of the `<div>` container for the map. If you don't provide it, a unique one will be created.
+- `maxBounds: bounds` (optional, dynamic)
+- `maxZoom: number` (optional)
+- `minZoom: number` (optional)
+- `style: object` (optional, dynamic): style property of the `<div>` container for the map.
+- `zoom: number` (optional, dynamic)
 
@@ -148,6 +155,6 @@ #### UI Layers
 
-- `position: LatLng` (required, dynamic)
+- `position: latLng` (required, dynamic)
 - `icon: Leaflet.Icon` (optional, dynamic)
-- `zIndexOffset: Number` (optional, dynamic)
-- `opacity: Number` (optional, dynamic)
+- `zIndexOffset: number` (optional, dynamic)
+- `opacity: number` (optional, dynamic)
 
@@ -158,3 +165,3 @@ ##### Popup
 
-- `position: LatLng` (optional, dynamic)
+- `position: latLng` (optional, dynamic)
 
@@ -165,11 +172,11 @@ #### Raster Layers
 
-- `url: String` (required, dynamic)
-- `opacity: Number` (optional, dynamic)
-- `zIndex: Number` (optional, dynamic)
+- `url: string` (required, dynamic)
+- `opacity: number` (optional, dynamic)
+- `zIndex: number` (optional, dynamic)
 
 ##### ImageOverlay
 
-- `url: String` (required, dynamic)
-- `opacity: Number` (optional, dynamic)
-- `attribution: String` (optional)
+- `url: string` (required, dynamic)
+- `opacity: number` (optional, dynamic)
+- `attribution: string` (optional)
 
@@ -187,29 +194,29 @@ ##### Implemented but needing testing and documentation
 
-- `center: LatLng` (required, dynamic)
-- `radius: Number` (required, dynamic)
+- `center: latLng` (required, dynamic)
+- `radius: number` (required, dynamic)
 
 ##### CircleMarker
 
-- `center: LatLng` (required, dynamic)
-- `radius: Number` (optional, dynamic)
+- `center: latLng` (required, dynamic)
+- `radius: number` (optional, dynamic)
 
 ##### Polyline
 
-- `positions: LatLngList` (required, dynamic)
+- `positions: latLngList` (required, dynamic)
 
 ##### MultiPolyline
 
-- `polylines: Array<LatLngList>` (required, dynamic)
+- `polylines: array<latLngList>` (required, dynamic)
 
 ##### Polygon
 
-- `positions: LatLngList | Array<LatLngList>` (required, dynamic)
+- `positions: latLngList | Array<latLngList>` (required, dynamic)
 
 ##### MultiPolygon
 
-- `polygons: Array<LatLngList>` (required, dynamic)
+- `polygons: array<latLngList>` (required, dynamic)
 
 ##### Rectangle
 
-- `bounds: Bounds` (required, dynamic)
+- `bounds: bounds` (required, dynamic)
 
@@ -222,7 +229,20 @@ #### Other Layers
 
-##### Implemented but needing testing and documentation
+##### FeatureGroup
 
-- FeatureGroup
-- GeoJson
+Extended `LayerGroup` supporting a `Popup` child.
 
+##### GeoJson
+
+- `data: GeoJSON` (required)
+
+#### Controls
+
+##### ZoomControl
+
+- `position: controlPosition` (optional, dynamic)
+- `zoomInText: string` (optional)
+- `zoomInTitle: string` (optional)
+- `zoomOutText: string` (optional)
+- `zoomOutTitle: string` (optional)
+
 ## Creating custom components
@@ -229,0 +249,0 @@

src/FeatureGroup.js

@@ -1,2 +0,1 @@
-import { PropTypes } from 'react';
 import { featureGroup } from 'leaflet';
@@ -7,14 +6,22 @@
 export default class FeatureGroup extends Path {
-  static propTypes = {
-    layers: PropTypes.array.isRequired,
-  };
-
   componentWillMount() {
-    const { layers, map, ...props } = this.props;
-    this.leafletElement = featureGroup(layers);
+    const { map, ...props } = this.props;
+    this.leafletElement = featureGroup();
   }
 
+  componentDidMount() {
+    super.componentDidMount();
+    this.setStyle(this.props);
+  }
+
   componentDidUpdate(prevProps) {
     this.setStyleIfChanged(prevProps, this.props);
   }
+
+  render() {
+    return this.renderChildrenWithProps({
+      layerGroup: this.leafletElement,
+      popupContainer: this.leafletElement,
+    });
+  }
 }

src/index.js

@@ -15,2 +15,3 @@ import Leaflet from 'leaflet';
 export MapComponent from './MapComponent';
+export MapControl from './MapControl';
 export MapLayer from './MapLayer';
@@ -24,6 +25,6 @@ export Marker from './Marker';
 export Popup from './Popup';
-export PopupContainer from './PopupContainer';
 export Rectangle from './Rectangle';
 export TileLayer from './TileLayer';
 export WMSTileLayer from './WMSTileLayer';
+export ZoomControl from './ZoomControl';
 
@@ -34,2 +35,2 @@ export const setIconDefaultImagePath = path => {
 
-setIconDefaultImagePath('//cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.5/images');
+setIconDefaultImagePath('//cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.7/images');

src/LayerGroup.js

@@ -1,3 +0,2 @@
-import React, { PropTypes } from 'react';
-import { layerGroup, Map } from 'leaflet';
+import { layerGroup } from 'leaflet';
 
@@ -7,10 +6,2 @@ import MapLayer from './MapLayer';
 export default class LayerGroup extends MapLayer {
-  static propTypes = {
-    children: PropTypes.oneOfType([
-      PropTypes.arrayOf(PropTypes.node),
-      PropTypes.node,
-    ]),
-    map: PropTypes.instanceOf(Map),
-  };
-
   componentWillMount() {
@@ -22,11 +13,6 @@ super.componentWillMount();
   render() {
-    const children = React.Children.map(this.props.children, child => {
-      return child ? React.cloneElement(child, {
-        layerGroup: this.leafletElement,
-        map: this.props.map,
-      }) : null;
+    return this.renderChildrenWithProps({
+      layerGroup: this.leafletElement,
     });
-
-    return <div style={{display: 'none'}}>{children}</div>;
   }
 }

src/Map.js

@@ -20,2 +20,3 @@ /* eslint-disable react/no-did-mount-set-state */
     bounds: boundsType,
+    boundsOptions: PropTypes.object,
     center: latlngType,
@@ -47,3 +48,3 @@ children: PropTypes.oneOfType([
     if (!isUndefined(this.props.bounds)) {
-      this.leafletElement.fitBounds(this.props.bounds);
+      this.leafletElement.fitBounds(this.props.bounds, this.props.boundsOptions);
     }
@@ -64,3 +65,3 @@ }
     if (bounds && this.shouldUpdateBounds(bounds, prevProps.bounds)) {
-      this.leafletElement.fitBounds(bounds);
+      this.leafletElement.fitBounds(bounds, this.props.boundsOptions);
     }
@@ -67,0 +68,0 @@ }

src/MapLayer.js

 import assign from 'lodash/object/assign';
-import React from 'react';
+import React, { PropTypes } from 'react';
+import { Map } from 'leaflet';
+
 import MapComponent from './MapComponent';
 
 export default class MapLayer extends MapComponent {
+  static propTypes = {
+    children: PropTypes.oneOfType([
+      PropTypes.arrayOf(PropTypes.node),
+      PropTypes.node,
+    ]),
+    map: PropTypes.instanceOf(Map),
+  };
+
   componentDidMount() {
@@ -24,2 +34,7 @@ super.componentDidMount();
   }
+
+  renderChildrenWithProps(props) {
+    const children = this.getClonedChildrenWithMap(props);
+    return <div style={{display: 'none'}}>{children}</div>;
+  }
 }

src/Marker.js

@@ -5,5 +5,5 @@ import { PropTypes } from 'react';
 import latlngType from './types/latlng';
-import PopupContainer from './PopupContainer';
+import MapLayer from './MapLayer';
 
-export default class Marker extends PopupContainer {
+export default class Marker extends MapLayer {
   static propTypes = {
@@ -36,2 +36,8 @@ icon: PropTypes.instanceOf(Icon),
   }
+
+  render() {
+    return this.renderChildrenWithProps({
+      popupContainer: this.leafletElement,
+    });
+  }
 }

src/Path.js

 import isEqual from 'lodash/lang/isEqual';
 import pick from 'lodash/object/pick';
 
-import PopupContainer from './PopupContainer';
+import MapLayer from './MapLayer';
 
@@ -23,3 +23,3 @@ const OPTIONS = [
 
-export default class Path extends PopupContainer {
+export default class Path extends MapLayer {
   getPathOptions(props) {
@@ -39,2 +39,8 @@ return pick(props, OPTIONS);
   }
+
+  render() {
+    return this.renderChildrenWithProps({
+      popupContainer: this.leafletElement,
+    });
+  }
 }

src/types/bounds.js

@@ -1,9 +0,9 @@
-import React from 'react';
-import Leaflet from 'leaflet';
+import { PropTypes } from 'react';
+import { LatLngBounds } from 'leaflet';
 
 import latlngList from './latlngList';
 
-export default React.PropTypes.oneOfType([
-  React.PropTypes.instanceOf(Leaflet.LatLngBounds),
+export default PropTypes.oneOfType([
+  PropTypes.instanceOf(LatLngBounds),
   latlngList,
 ]);

src/types/index.js

 export bounds from './bounds';
+export controlPosition from './controlPosition';
 export latlng from './latlng';
 export latlngList from './latlngList';

src/types/latlng.js

@@ -1,16 +0,16 @@
-import { PropTypes as Type } from 'react';
+import { PropTypes } from 'react';
 
-export default Type.oneOfType([
+export default PropTypes.oneOfType([
   // [Number, Number]
-  Type.arrayOf(Type.number),
+  PropTypes.arrayOf(PropTypes.number),
   // {lat: Number, lng: Number}
-  Type.shape({
-    lat: Type.number,
-    lng: Type.number,
+  PropTypes.shape({
+    lat: PropTypes.number,
+    lng: PropTypes.number,
   }),
   // {lat: Number, lon: Number}
-  Type.shape({
-    lat: Type.number,
-    lon: Type.number,
+  PropTypes.shape({
+    lat: PropTypes.number,
+    lon: PropTypes.number,
   }),
 ]);

No alert changes

Improved metrics

Total package byte prevSize

389596

increased by3.7%

Dev dependency count

16

decreased by-23.81%

Number of package files

67

increased by6.35%

Lines of code

6803

increased by5.77%

Number of lines in readme file

252

increased by8.62%

No dependency changes