From bf0d48afa2f5cd565edda2e77a24ef4bd2a266d5 Mon Sep 17 00:00:00 2001 From: Paul Le Cam Date: Sat, 20 Aug 2016 10:17:59 +0100 Subject: [PATCH] v1.0.0-beta.2 --- CHANGELOG.md | 6 +- dist/react-leaflet.js | 142 +++++++++++++++++++++++++++++++++- dist/react-leaflet.min.js | 6 +- docs/Components.md | 7 ++ docs/Extending.md | 1 + example/components/index.js | 17 ++-- example/components/tooltip.js | 73 +++++++++++++++++ lib/Tooltip.js | 124 +++++++++++++++++++++++++++++ lib/index.js | 7 +- package.json | 8 +- src/Tooltip.js | 81 +++++++++++++++++++ src/index.js | 1 + 12 files changed, 452 insertions(+), 21 deletions(-) create mode 100644 example/components/tooltip.js create mode 100644 lib/Tooltip.js create mode 100644 src/Tooltip.js diff --git a/CHANGELOG.md b/CHANGELOG.md index 2a5981e6..3fde067a 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,6 +1,8 @@ -## v1.0.0-beta.2 (unreleased) +## v1.0.0-beta.2 (2016-08-20) -- Revert basing components from `React.PureComponent` to `React.Component`. +- Added `Tooltip` component introduced in Leaflet v1.0.0-rc.2. See [Leaflet's documentation](http://leafletjs.com/reference-1.0.0.html#tooltip) for usage. +- Updated Leaflet dependency to v1.0.0-rc.3. +- Reverted basing components on `React.PureComponent`, they are now based on `React.Component`. ## v1.0.0-beta.1 (2016-07-30) diff --git a/dist/react-leaflet.js b/dist/react-leaflet.js index aa2110cb..09073456 100644 --- a/dist/react-leaflet.js +++ b/dist/react-leaflet.js @@ -59,7 +59,7 @@ return /******/ (function(modules) { // webpackBootstrap Object.defineProperty(exports, "__esModule", { value: true }); - exports.setIconDefaultImagePath = exports.ZoomControl = exports.WMSTileLayer = exports.TileLayer = exports.ScaleControl = exports.Rectangle = exports.Popup = exports.Polyline = exports.Polygon = exports.Path = exports.Marker = exports.MapLayer = exports.MapControl = exports.MapComponent = exports.Map = exports.LayersControl = exports.LayerGroup = exports.ImageOverlay = exports.GridLayer = exports.GeoJSON = exports.FeatureGroup = exports.CircleMarker = exports.Circle = exports.AttributionControl = exports.PropTypes = undefined; + exports.setIconDefaultImagePath = exports.ZoomControl = exports.WMSTileLayer = exports.Tooltip = exports.TileLayer = exports.ScaleControl = exports.Rectangle = exports.Popup = exports.Polyline = exports.Polygon = exports.Path = exports.Marker = exports.MapLayer = exports.MapControl = exports.MapComponent = exports.Map = exports.LayersControl = exports.LayerGroup = exports.ImageOverlay = exports.GridLayer = exports.GeoJSON = exports.FeatureGroup = exports.CircleMarker = exports.Circle = exports.AttributionControl = exports.PropTypes = undefined; var _leaflet = __webpack_require__(1); @@ -153,11 +153,15 @@ return /******/ (function(modules) { // webpackBootstrap var _TileLayer3 = _interopRequireDefault(_TileLayer2); - var _WMSTileLayer2 = __webpack_require__(104); + var _Tooltip2 = __webpack_require__(104); + + var _Tooltip3 = _interopRequireDefault(_Tooltip2); + + var _WMSTileLayer2 = __webpack_require__(105); var _WMSTileLayer3 = _interopRequireDefault(_WMSTileLayer2); - var _ZoomControl2 = __webpack_require__(105); + var _ZoomControl2 = __webpack_require__(106); var _ZoomControl3 = _interopRequireDefault(_ZoomControl2); @@ -187,6 +191,7 @@ return /******/ (function(modules) { // webpackBootstrap exports.Rectangle = _Rectangle3.default; exports.ScaleControl = _ScaleControl3.default; exports.TileLayer = _TileLayer3.default; + exports.Tooltip = _Tooltip3.default; exports.WMSTileLayer = _WMSTileLayer3.default; exports.ZoomControl = _ZoomControl3.default; var setIconDefaultImagePath = exports.setIconDefaultImagePath = function setIconDefaultImagePath(path) { @@ -4848,6 +4853,135 @@ return /******/ (function(modules) { // webpackBootstrap var _react = __webpack_require__(4); + var _reactDom = __webpack_require__(100); + + var _MapComponent2 = __webpack_require__(51); + + var _MapComponent3 = _interopRequireDefault(_MapComponent2); + + function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + + function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; } + + function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + + function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } + + function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } + + var Tooltip = function (_MapComponent) { + _inherits(Tooltip, _MapComponent); + + function Tooltip() { + var _Object$getPrototypeO; + + var _temp, _this, _ret; + + _classCallCheck(this, Tooltip); + + for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) { + args[_key] = arguments[_key]; + } + + return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(Tooltip)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.onTooltipOpen = function (_ref) { + var tooltip = _ref.tooltip; + + if (tooltip === _this.leafletElement) { + _this.renderTooltipContent(); + } + }, _this.onTooltipClose = function (_ref2) { + var tooltip = _ref2.tooltip; + + if (tooltip === _this.leafletElement) { + _this.removeTooltipContent(); + } + }, _this.renderTooltipContent = function () { + if (_this.props.children) { + (0, _reactDom.render)(_react.Children.only(_this.props.children), _this.leafletElement._contentNode); + _this.leafletElement.update(); + } else { + _this.removeTooltipContent(); + } + }, _this.removeTooltipContent = function () { + if (_this.leafletElement._contentNode) { + (0, _reactDom.unmountComponentAtNode)(_this.leafletElement._contentNode); + } + }, _temp), _possibleConstructorReturn(_this, _ret); + } + + _createClass(Tooltip, [{ + key: 'componentWillMount', + value: function componentWillMount() { + _get(Object.getPrototypeOf(Tooltip.prototype), 'componentWillMount', this).call(this); + var _props = this.props; + var _children = _props.children; + + var props = _objectWithoutProperties(_props, ['children']); + + this.leafletElement = (0, _leaflet.tooltip)(props, this.context.popupContainer); + this.context.popupContainer.on({ + tooltipopen: this.onTooltipOpen, + tooltipclose: this.onTooltipClose + }); + } + }, { + key: 'componentDidMount', + value: function componentDidMount() { + this.context.popupContainer.bindTooltip(this.leafletElement); + } + }, { + key: 'componentDidUpdate', + value: function componentDidUpdate() { + if (this.leafletElement.isOpen()) { + this.renderTooltipContent(); + } + } + }, { + key: 'componentWillUnmount', + value: function componentWillUnmount() { + this.context.popupContainer.off({ + tooltipopen: this.onTooltipOpen, + tooltipclose: this.onTooltipClose + }); + this.context.popupContainer.removeLayer(this.leafletElement); + _get(Object.getPrototypeOf(Tooltip.prototype), 'componentWillUnmount', this).call(this); + } + }, { + key: 'render', + value: function render() { + return null; + } + }]); + + return Tooltip; + }(_MapComponent3.default); + + Tooltip.propTypes = { + children: _react.PropTypes.node + }; + Tooltip.contextTypes = { + popupContainer: _react.PropTypes.object + }; + exports.default = Tooltip; + +/***/ }, +/* 105 */ +/***/ function(module, exports, __webpack_require__) { + + 'use strict'; + + Object.defineProperty(exports, "__esModule", { + value: true + }); + + var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); + + var _get = function get(object, property, receiver) { 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 { return get(parent, property, receiver); } } else if ("value" in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } }; + + var _leaflet = __webpack_require__(1); + + var _react = __webpack_require__(4); + var _GridLayer2 = __webpack_require__(78); var _GridLayer3 = _interopRequireDefault(_GridLayer2); @@ -4893,7 +5027,7 @@ return /******/ (function(modules) { // webpackBootstrap exports.default = WMSTileLayer; /***/ }, -/* 105 */ +/* 106 */ /***/ function(module, exports, __webpack_require__) { 'use strict'; diff --git a/dist/react-leaflet.min.js b/dist/react-leaflet.min.js index 0c31175a..e418a7f0 100644 --- a/dist/react-leaflet.min.js +++ b/dist/react-leaflet.min.js @@ -1,3 +1,3 @@ -!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("leaflet"),require("react"),require("react-dom")):"function"==typeof define&&define.amd?define(["leaflet","react","react-dom"],t):"object"==typeof exports?exports.ReactLeaflet=t(require("leaflet"),require("react"),require("react-dom")):e.ReactLeaflet=t(e.L,e.React,e.ReactDOM)}(this,function(e,t,n){return function(e){function t(r){if(n[r])return n[r].exports;var o=n[r]={exports:{},id:r,loaded:!1};return e[r].call(o.exports,o,o.exports,t),o.loaded=!0,o.exports}var n={};return t.m=e,t.c=n,t.p="",t(0)}([function(e,t,n){"use strict";function r(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&(t[n]=e[n]);return t["default"]=e,t}function o(e){return e&&e.__esModule?e:{"default":e}}Object.defineProperty(t,"__esModule",{value:!0}),t.setIconDefaultImagePath=t.ZoomControl=t.WMSTileLayer=t.TileLayer=t.ScaleControl=t.Rectangle=t.Popup=t.Polyline=t.Polygon=t.Path=t.Marker=t.MapLayer=t.MapControl=t.MapComponent=t.Map=t.LayersControl=t.LayerGroup=t.ImageOverlay=t.GridLayer=t.GeoJSON=t.FeatureGroup=t.CircleMarker=t.Circle=t.AttributionControl=t.PropTypes=void 0;var i=n(1),u=o(i),a=n(2),l=r(a),p=n(11),c=o(p),f=n(13),s=o(f),y=n(74),d=o(y),h=n(75),v=o(h),b=n(76),O=o(b),m=n(78),P=o(m),j=n(79),g=o(j),_=n(80),w=o(_),x=n(81),T=o(x),E=n(82),M=o(E),k=n(51),C=o(k),L=n(12),R=o(L),W=n(50),S=o(W),D=n(96),U=o(D),I=n(14),A=o(I),F=n(97),q=o(F),B=n(98),z=o(B),N=n(99),G=o(N),Z=n(101),J=o(Z),V=n(102),$=o(V),H=n(103),K=o(H),Q=n(104),X=o(Q),Y=n(105),ee=o(Y);t.PropTypes=l,t.AttributionControl=c["default"],t.Circle=s["default"],t.CircleMarker=d["default"],t.FeatureGroup=v["default"],t.GeoJSON=O["default"],t.GridLayer=P["default"],t.ImageOverlay=g["default"],t.LayerGroup=w["default"],t.LayersControl=T["default"],t.Map=M["default"],t.MapComponent=C["default"],t.MapControl=R["default"],t.MapLayer=S["default"],t.Marker=U["default"],t.Path=A["default"],t.Polygon=q["default"],t.Polyline=z["default"],t.Popup=G["default"],t.Rectangle=J["default"],t.ScaleControl=$["default"],t.TileLayer=K["default"],t.WMSTileLayer=X["default"],t.ZoomControl=ee["default"];var te=t.setIconDefaultImagePath=function(e){u["default"].Icon.Default.imagePath=e};te("//cdnjs.cloudflare.com/ajax/libs/leaflet/1.0.0-rc.3/images")},function(t,n){t.exports=e},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{"default":e}}Object.defineProperty(t,"__esModule",{value:!0}),t.map=t.layerContainer=t.latlngList=t.latlng=t.controlPosition=t.children=t.bounds=void 0;var o=n(3),i=r(o),u=n(7),a=r(u),l=n(8),p=r(l),c=n(6),f=r(c),s=n(5),y=r(s),d=n(9),h=r(d),v=n(10),b=r(v);t.bounds=i["default"],t.children=a["default"],t.controlPosition=p["default"],t.latlng=f["default"],t.latlngList=y["default"],t.layerContainer=h["default"],t.map=b["default"]},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{"default":e}}Object.defineProperty(t,"__esModule",{value:!0});var o=n(4),i=n(1),u=n(5),a=r(u);t["default"]=o.PropTypes.oneOfType([o.PropTypes.instanceOf(i.LatLngBounds),a["default"]])},function(e,n){e.exports=t},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{"default":e}}Object.defineProperty(t,"__esModule",{value:!0});var o=n(4),i=n(6),u=r(i);t["default"]=o.PropTypes.arrayOf(u["default"])},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var r=n(4);t["default"]=r.PropTypes.oneOfType([r.PropTypes.arrayOf(r.PropTypes.number),r.PropTypes.shape({lat:r.PropTypes.number,lng:r.PropTypes.number}),r.PropTypes.shape({lat:r.PropTypes.number,lon:r.PropTypes.number})])},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var r=n(4);t["default"]=r.PropTypes.oneOfType([r.PropTypes.arrayOf(r.PropTypes.node),r.PropTypes.node])},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var r=n(4);t["default"]=r.PropTypes.oneOf(["topleft","topright","bottomleft","bottomright"])},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var r=n(4);t["default"]=r.PropTypes.shape({addLayer:r.PropTypes.func.isRequired,removeLayer:r.PropTypes.func.isRequired})},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var r=n(1),o=n(4);t["default"]=o.PropTypes.instanceOf(r.Map)},function(e,t,n){"use strict";function r(e){return e&&e.__esModule?e:{"default":e}}function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function i(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function u(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var a=function(){function e(e,t){for(var n=0;n=0||Object.prototype.hasOwnProperty.call(e,r)&&(n[r]=e[r]);return n}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function u(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var l=function(){function e(e,t){for(var n=0;n-1}var o=n(29);e.exports=r},function(e,t,n){function r(e,t){var n=this.__data__,r=o(n,e);return r<0?n.push([e,t]):n[r][1]=t,this}var o=n(29);e.exports=r},function(e,t,n){function r(e,t,n,r,l,p){var c=l&a,f=e.length,s=t.length;if(f!=s&&!(c&&s>f))return!1;var y=p.get(e);if(y&&p.get(t))return y==t;var d=-1,h=!0,v=l&u?new o:void 0;for(p.set(e,t),p.set(t,e);++d=0||Object.prototype.hasOwnProperty.call(e,r)&&(n[r]=e[r]);return n}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function u(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var l=function(){function e(e,t){for(var n=0;n=0||Object.prototype.hasOwnProperty.call(e,r)&&(n[r]=e[r]);return n}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function u(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var l=n(77),p=r(l),c=function(){function e(e,t){for(var n=0;n=0||Object.prototype.hasOwnProperty.call(e,r)&&(n[r]=e[r]);return n}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function u(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var l=function(){function e(e,t){for(var n=0;n=0||Object.prototype.hasOwnProperty.call(e,r)&&(n[r]=e[r]);return n}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function u(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var l=function T(e,t,n){null===e&&(e=Function.prototype);var r=Object.getOwnPropertyDescriptor(e,t);if(void 0===r){var o=Object.getPrototypeOf(e);return null===o?void 0:T(o,t,n)}if("value"in r)return r.value;var i=r.get;if(void 0!==i)return i.call(n)},p=function(){function e(e,t){for(var n=0;n=c&&(s=p,y=!1,t=new o(t));e:for(;++f-1}var o=n(86);e.exports=r},function(e,t,n){function r(e,t,n){if(t!==t)return o(e,i,n);for(var r=n-1,u=e.length;++r=0||Object.prototype.hasOwnProperty.call(e,r)&&(n[r]=e[r]);return n}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function u(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var l=function(){function e(e,t){for(var n=0;n=0||Object.prototype.hasOwnProperty.call(e,r)&&(n[r]=e[r]);return n}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function u(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var l=function(){function e(e,t){for(var n=0;n=0||Object.prototype.hasOwnProperty.call(e,r)&&(n[r]=e[r]);return n}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function u(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var l=function(){function e(e,t){for(var n=0;n=0||Object.prototype.hasOwnProperty.call(e,r)&&(n[r]=e[r]);return n}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function u(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var l=function(){function e(e,t){for(var n=0;n=0||Object.prototype.hasOwnProperty.call(e,r)&&(n[r]=e[r]);return n}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function u(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var l=function(){function e(e,t){for(var n=0;n=0||Object.prototype.hasOwnProperty.call(e,r)&&(n[r]=e[r]);return n}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function u(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var l=function(){function e(e,t){for(var n=0;n=0||Object.prototype.hasOwnProperty.call(e,r)&&(n[r]=e[r]);return n}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function u(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var l=function(){function e(e,t){for(var n=0;n=0||Object.prototype.hasOwnProperty.call(e,o)&&(n[o]=e[o]);return n}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function u(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var l=function(){function e(e,t){for(var n=0;n-1}var r=n(29);e.exports=o},function(e,t,n){function o(e,t){var n=this.__data__,o=r(n,e);return o<0?n.push([e,t]):n[o][1]=t,this}var r=n(29);e.exports=o},function(e,t,n){function o(e,t,n,o,l,p){var c=l&a,f=e.length,s=t.length;if(f!=s&&!(c&&s>f))return!1;var y=p.get(e);if(y&&p.get(t))return y==t;var d=-1,h=!0,v=l&u?new r:void 0;for(p.set(e,t),p.set(t,e);++d=0||Object.prototype.hasOwnProperty.call(e,o)&&(n[o]=e[o]);return n}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function u(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var l=function(){function e(e,t){for(var n=0;n=0||Object.prototype.hasOwnProperty.call(e,o)&&(n[o]=e[o]);return n}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function u(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var l=n(77),p=o(l),c=function(){function e(e,t){for(var n=0;n=0||Object.prototype.hasOwnProperty.call(e,o)&&(n[o]=e[o]);return n}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function u(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var l=function(){function e(e,t){for(var n=0;n=0||Object.prototype.hasOwnProperty.call(e,o)&&(n[o]=e[o]);return n}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function u(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var l=function x(e,t,n){null===e&&(e=Function.prototype);var o=Object.getOwnPropertyDescriptor(e,t);if(void 0===o){var r=Object.getPrototypeOf(e);return null===r?void 0:x(r,t,n)}if("value"in o)return o.value;var i=o.get;if(void 0!==i)return i.call(n)},p=function(){function e(e,t){for(var n=0;n=c&&(s=p,y=!1,t=new r(t));e:for(;++f-1}var r=n(86);e.exports=o},function(e,t,n){function o(e,t,n){if(t!==t)return r(e,i,n);for(var o=n-1,u=e.length;++o=0||Object.prototype.hasOwnProperty.call(e,o)&&(n[o]=e[o]);return n}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function u(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var l=function(){function e(e,t){for(var n=0;n=0||Object.prototype.hasOwnProperty.call(e,o)&&(n[o]=e[o]);return n}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function u(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var l=function(){function e(e,t){for(var n=0;n=0||Object.prototype.hasOwnProperty.call(e,o)&&(n[o]=e[o]);return n}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function u(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var l=function(){function e(e,t){for(var n=0;n=0||Object.prototype.hasOwnProperty.call(e,o)&&(n[o]=e[o]);return n}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function u(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var l=function(){function e(e,t){for(var n=0;n=0||Object.prototype.hasOwnProperty.call(e,o)&&(n[o]=e[o]);return n}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function u(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var l=function(){function e(e,t){for(var n=0;n=0||Object.prototype.hasOwnProperty.call(e,o)&&(n[o]=e[o]);return n}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function u(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var l=function(){function e(e,t){for(var n=0;n=0||Object.prototype.hasOwnProperty.call(e,o)&&(n[o]=e[o]);return n}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function u(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var l=function(){function e(e,t){for(var n=0;n=0||Object.prototype.hasOwnProperty.call(e,o)&&(n[o]=e[o]);return n}function i(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function u(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function a(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}Object.defineProperty(t,"__esModule",{value:!0});var l=function(){function e(e,t){for(var n=0;n

React-Leaflet examples

Popup with Marker

-

Draggable Marker

-

Events

Click the map to show a marker at your detected location

-

Map view by bounds

-

Click a rectangle to fit the map to its bounds

-

Vector layers

Other layers

+

Tooltips

+

Zoom control

Layers control

+

Draggable Marker

+ +

Map view by bounds

+

Click a rectangle to fit the map to its bounds

+

List of markers (custom component)

Animate

diff --git a/example/components/tooltip.js b/example/components/tooltip.js new file mode 100644 index 00000000..2d7adcb9 --- /dev/null +++ b/example/components/tooltip.js @@ -0,0 +1,73 @@ +import React, { Component } from 'react' +import { + Circle, + CircleMarker, + Map, + Polygon, + Rectangle, + TileLayer, + Tooltip, +} from '../../src' + +export default class TooltipExample extends Component { + state = { + clicked: 0, + }; + + onClickCircle = () => { + this.setState({clicked: this.state.clicked + 1}) + }; + + render () { + const center = [51.505, -0.09] + + const polygon = [ + [51.515, -0.09], + [51.52, -0.1], + [51.52, -0.12], + ] + + const multiPolygon = [ + [[51.51, -0.12], [51.51, -0.13], [51.53, -0.13]], + [[51.51, -0.05], [51.51, -0.07], [51.53, -0.07]], + ] + + const rectangle = [ + [51.49, -0.08], + [51.5, -0.06], + ] + + const clickedText = this.state.clicked === 0 + ? 'Click this Circle to change the Tooltip text' + : `Circle click: ${this.state.clicked}` + + return ( + + + + + {clickedText} + + + + + Tooltip for CircleMarker + + + + + sticky Tooltip for Polygon + + + + + permanent Tooltip for Rectangle + + + + ) + } +} diff --git a/lib/Tooltip.js b/lib/Tooltip.js new file mode 100644 index 00000000..08784f2f --- /dev/null +++ b/lib/Tooltip.js @@ -0,0 +1,124 @@ +'use strict'; + +Object.defineProperty(exports, "__esModule", { + value: true +}); + +var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); + +var _get = function get(object, property, receiver) { 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 { return get(parent, property, receiver); } } else if ("value" in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } }; + +var _leaflet = require('leaflet'); + +var _react = require('react'); + +var _reactDom = require('react-dom'); + +var _MapComponent2 = require('./MapComponent'); + +var _MapComponent3 = _interopRequireDefault(_MapComponent2); + +function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } + +function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; } + +function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + +function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } + +function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } + +var Tooltip = function (_MapComponent) { + _inherits(Tooltip, _MapComponent); + + function Tooltip() { + var _Object$getPrototypeO; + + var _temp, _this, _ret; + + _classCallCheck(this, Tooltip); + + for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) { + args[_key] = arguments[_key]; + } + + return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(Tooltip)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.onTooltipOpen = function (_ref) { + var tooltip = _ref.tooltip; + + if (tooltip === _this.leafletElement) { + _this.renderTooltipContent(); + } + }, _this.onTooltipClose = function (_ref2) { + var tooltip = _ref2.tooltip; + + if (tooltip === _this.leafletElement) { + _this.removeTooltipContent(); + } + }, _this.renderTooltipContent = function () { + if (_this.props.children) { + (0, _reactDom.render)(_react.Children.only(_this.props.children), _this.leafletElement._contentNode); + _this.leafletElement.update(); + } else { + _this.removeTooltipContent(); + } + }, _this.removeTooltipContent = function () { + if (_this.leafletElement._contentNode) { + (0, _reactDom.unmountComponentAtNode)(_this.leafletElement._contentNode); + } + }, _temp), _possibleConstructorReturn(_this, _ret); + } + + _createClass(Tooltip, [{ + key: 'componentWillMount', + value: function componentWillMount() { + _get(Object.getPrototypeOf(Tooltip.prototype), 'componentWillMount', this).call(this); + var _props = this.props; + var _children = _props.children; + + var props = _objectWithoutProperties(_props, ['children']); + + this.leafletElement = (0, _leaflet.tooltip)(props, this.context.popupContainer); + this.context.popupContainer.on({ + tooltipopen: this.onTooltipOpen, + tooltipclose: this.onTooltipClose + }); + } + }, { + key: 'componentDidMount', + value: function componentDidMount() { + this.context.popupContainer.bindTooltip(this.leafletElement); + } + }, { + key: 'componentDidUpdate', + value: function componentDidUpdate() { + if (this.leafletElement.isOpen()) { + this.renderTooltipContent(); + } + } + }, { + key: 'componentWillUnmount', + value: function componentWillUnmount() { + this.context.popupContainer.off({ + tooltipopen: this.onTooltipOpen, + tooltipclose: this.onTooltipClose + }); + this.context.popupContainer.removeLayer(this.leafletElement); + _get(Object.getPrototypeOf(Tooltip.prototype), 'componentWillUnmount', this).call(this); + } + }, { + key: 'render', + value: function render() { + return null; + } + }]); + + return Tooltip; +}(_MapComponent3.default); + +Tooltip.propTypes = { + children: _react.PropTypes.node +}; +Tooltip.contextTypes = { + popupContainer: _react.PropTypes.object +}; +exports.default = Tooltip; \ No newline at end of file diff --git a/lib/index.js b/lib/index.js index ca67dce8..80f34304 100644 --- a/lib/index.js +++ b/lib/index.js @@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true }); -exports.setIconDefaultImagePath = exports.ZoomControl = exports.WMSTileLayer = exports.TileLayer = exports.ScaleControl = exports.Rectangle = exports.Popup = exports.Polyline = exports.Polygon = exports.Path = exports.Marker = exports.MapLayer = exports.MapControl = exports.MapComponent = exports.Map = exports.LayersControl = exports.LayerGroup = exports.ImageOverlay = exports.GridLayer = exports.GeoJSON = exports.FeatureGroup = exports.CircleMarker = exports.Circle = exports.AttributionControl = exports.PropTypes = undefined; +exports.setIconDefaultImagePath = exports.ZoomControl = exports.WMSTileLayer = exports.Tooltip = exports.TileLayer = exports.ScaleControl = exports.Rectangle = exports.Popup = exports.Polyline = exports.Polygon = exports.Path = exports.Marker = exports.MapLayer = exports.MapControl = exports.MapComponent = exports.Map = exports.LayersControl = exports.LayerGroup = exports.ImageOverlay = exports.GridLayer = exports.GeoJSON = exports.FeatureGroup = exports.CircleMarker = exports.Circle = exports.AttributionControl = exports.PropTypes = undefined; var _leaflet = require('leaflet'); @@ -97,6 +97,10 @@ var _TileLayer2 = require('./TileLayer'); var _TileLayer3 = _interopRequireDefault(_TileLayer2); +var _Tooltip2 = require('./Tooltip'); + +var _Tooltip3 = _interopRequireDefault(_Tooltip2); + var _WMSTileLayer2 = require('./WMSTileLayer'); var _WMSTileLayer3 = _interopRequireDefault(_WMSTileLayer2); @@ -131,6 +135,7 @@ exports.Popup = _Popup3.default; exports.Rectangle = _Rectangle3.default; exports.ScaleControl = _ScaleControl3.default; exports.TileLayer = _TileLayer3.default; +exports.Tooltip = _Tooltip3.default; exports.WMSTileLayer = _WMSTileLayer3.default; exports.ZoomControl = _ZoomControl3.default; var setIconDefaultImagePath = exports.setIconDefaultImagePath = function setIconDefaultImagePath(path) { diff --git a/package.json b/package.json index 208c2adc..4a604d36 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "react-leaflet", - "version": "1.0.0-beta.1", + "version": "1.0.0-beta.2", "description": "React components for Leaflet maps", "main": "lib/index.js", "scripts": { @@ -67,9 +67,9 @@ "leaflet": "^1.0.0-rc.3", "lodash-webpack-plugin": "^0.10.0", "onchange": "^2.5.0", - "react": "^15.3.0", - "react-addons-test-utils": "^15.3.0", - "react-dom": "^15.3.0", + "react": "^15.3.1", + "react-addons-test-utils": "^15.3.1", + "react-dom": "^15.3.1", "react-transform-hmr": "^1.0.4", "webpack": "^1.13.2", "webpack-dev-server": "^1.14.1" diff --git a/src/Tooltip.js b/src/Tooltip.js new file mode 100644 index 00000000..4108a1b8 --- /dev/null +++ b/src/Tooltip.js @@ -0,0 +1,81 @@ +/* @flow */ + +import { tooltip as createTooltip } from 'leaflet' +import { Children, PropTypes } from 'react' +import { render, unmountComponentAtNode } from 'react-dom' + +import MapComponent from './MapComponent' + +export default class Tooltip extends MapComponent { + static propTypes = { + children: PropTypes.node, + }; + + static contextTypes = { + popupContainer: PropTypes.object, + }; + + componentWillMount () { + super.componentWillMount() + const { children: _children, ...props } = this.props + + this.leafletElement = createTooltip(props, this.context.popupContainer) + this.context.popupContainer.on({ + tooltipopen: this.onTooltipOpen, + tooltipclose: this.onTooltipClose, + }) + } + + componentDidMount () { + this.context.popupContainer.bindTooltip(this.leafletElement) + } + + componentDidUpdate () { + if (this.leafletElement.isOpen()) { + this.renderTooltipContent() + } + } + + componentWillUnmount () { + this.context.popupContainer.off({ + tooltipopen: this.onTooltipOpen, + tooltipclose: this.onTooltipClose, + }) + this.context.popupContainer.removeLayer(this.leafletElement) + super.componentWillUnmount() + } + + onTooltipOpen: Function = ({ tooltip }: Object) => { + if (tooltip === this.leafletElement) { + this.renderTooltipContent() + } + }; + + onTooltipClose: Function = ({ tooltip }: Object) => { + if (tooltip === this.leafletElement) { + this.removeTooltipContent() + } + }; + + renderTooltipContent: Function = () => { + if (this.props.children) { + render( + Children.only(this.props.children), + this.leafletElement._contentNode + ) + this.leafletElement.update() + } else { + this.removeTooltipContent() + } + }; + + removeTooltipContent: Function = () => { + if (this.leafletElement._contentNode) { + unmountComponentAtNode(this.leafletElement._contentNode) + } + }; + + render () { + return null + } +} diff --git a/src/index.js b/src/index.js index e2b3ef65..7e02921a 100644 --- a/src/index.js +++ b/src/index.js @@ -23,6 +23,7 @@ export Popup from './Popup' export Rectangle from './Rectangle' export ScaleControl from './ScaleControl' export TileLayer from './TileLayer' +export Tooltip from './Tooltip' export WMSTileLayer from './WMSTileLayer' export ZoomControl from './ZoomControl'