pigeon-maps - npm Package Compare versions

Comparing version 0.17.1 to 0.17.2

CHANGELOG.md

@@ -10,2 +10,11 @@ # Change Log
 
+## 0.17.2 - 2021-03-16
+### Changes
+- Use a `ResizeObserver` to update the size even when the window doesn't resize (#125 by @mischnic)
+- Add classes `pigeon-tile-box`, `pigeon-tiles`, `pigeon-overlays` and `pigeon-overlay-warning` to internal divs.
+
+## 0.17.1 - 2021-02-13
+### Changes
+- Fixes faulty types for `Marker` and `Overlay`
+
 ## 0.17.0 - 2020-12-03
@@ -12,0 +21,0 @@ ### Changes

lib/index.cjs.js

@@ -205,2 +205,3 @@ 'use strict';
     _this._minMaxCache = null;
+    _this._resizeObserver = null;
 
@@ -1049,2 +1050,4 @@ _this.updateWidthHeight = function () {
   _proto.componentDidMount = function componentDidMount() {
+    var _this2 = this;
+
     this.props.mouseEvents && this.bindMouseEvents();
@@ -1063,2 +1066,10 @@ this.props.touchEvents && this.bindTouchEvents();
     this.syncToProps();
+
+    if (typeof ResizeObserver != 'undefined') {
+      this._resizeObserver = new ResizeObserver(function () {
+        _this2.updateWidthHeight();
+      });
+
+      this._resizeObserver.observe(this._containerRef);
+    }
   };
@@ -1074,2 +1085,6 @@
     }
+
+    if (this._resizeObserver) {
+      this._resizeObserver.disconnect();
+    }
   };
@@ -1179,3 +1194,3 @@
   _proto.renderTiles = function renderTiles() {
-    var _this2 = this;
+    var _this3 = this;
 
@@ -1267,3 +1282,3 @@ var oldTiles = this.state.oldTiles;
     };
-    var boxClassname = this.props.boxClassname || '';
+    var boxClassname = this.props.boxClassname || 'pigeon-tiles-box';
     var left = -((tileCenterX - tileMinX) * 256 - scaleWidth / 2);
@@ -1282,2 +1297,3 @@ var top = -((tileCenterY - tileMinY) * 256 - scaleHeight / 2);
     }, /*#__PURE__*/React__default.createElement("div", {
+      className: "pigeon-tiles",
       style: tilesStyle
@@ -1293,3 +1309,3 @@ }, tiles.map(function (tile) {
         onLoad: function onLoad() {
-          return _this2.imageLoaded(tile.key);
+          return _this3.imageLoaded(tile.key);
         },
@@ -1310,3 +1326,3 @@ alt: '',
   _proto.renderOverlays = function renderOverlays() {
-    var _this3 = this;
+    var _this4 = this;
 
@@ -1338,3 +1354,3 @@ var _this$state11 = this.state,
 
-      var c = _this3.latLngToPixel(anchor || position || center);
+      var c = _this4.latLngToPixel(anchor || position || center);
 
@@ -1344,4 +1360,4 @@ return /*#__PURE__*/React__default.cloneElement(child, {
         top: c[1] - (offset ? offset[1] : 0),
-        latLngToPixel: _this3.latLngToPixel,
-        pixelToLatLng: _this3.pixelToLatLng,
+        latLngToPixel: _this4.latLngToPixel,
+        pixelToLatLng: _this4.pixelToLatLng,
         mapState: mapState
@@ -1358,2 +1374,3 @@ });
     return /*#__PURE__*/React__default.createElement("div", {
+      className: "pigeon-overlays",
       style: childrenStyle
@@ -1440,2 +1457,3 @@ }, childrenWithProps);
       return /*#__PURE__*/React__default.createElement("div", {
+        className: "pigeon-overlay-warning",
         style: style
@@ -1442,0 +1460,0 @@ }, warningText.replace('META', meta));

lib/index.esm.js

@@ -198,2 +198,3 @@ import React, { Component, useState } from 'react';
     _this._minMaxCache = null;
+    _this._resizeObserver = null;
 
@@ -1042,2 +1043,4 @@ _this.updateWidthHeight = function () {
   _proto.componentDidMount = function componentDidMount() {
+    var _this2 = this;
+
     this.props.mouseEvents && this.bindMouseEvents();
@@ -1056,2 +1059,10 @@ this.props.touchEvents && this.bindTouchEvents();
     this.syncToProps();
+
+    if (typeof ResizeObserver != 'undefined') {
+      this._resizeObserver = new ResizeObserver(function () {
+        _this2.updateWidthHeight();
+      });
+
+      this._resizeObserver.observe(this._containerRef);
+    }
   };
@@ -1067,2 +1078,6 @@
     }
+
+    if (this._resizeObserver) {
+      this._resizeObserver.disconnect();
+    }
   };
@@ -1172,3 +1187,3 @@
   _proto.renderTiles = function renderTiles() {
-    var _this2 = this;
+    var _this3 = this;
 
@@ -1260,3 +1275,3 @@ var oldTiles = this.state.oldTiles;
     };
-    var boxClassname = this.props.boxClassname || '';
+    var boxClassname = this.props.boxClassname || 'pigeon-tiles-box';
     var left = -((tileCenterX - tileMinX) * 256 - scaleWidth / 2);
@@ -1275,2 +1290,3 @@ var top = -((tileCenterY - tileMinY) * 256 - scaleHeight / 2);
     }, /*#__PURE__*/React.createElement("div", {
+      className: "pigeon-tiles",
       style: tilesStyle
@@ -1286,3 +1302,3 @@ }, tiles.map(function (tile) {
         onLoad: function onLoad() {
-          return _this2.imageLoaded(tile.key);
+          return _this3.imageLoaded(tile.key);
         },
@@ -1303,3 +1319,3 @@ alt: '',
   _proto.renderOverlays = function renderOverlays() {
-    var _this3 = this;
+    var _this4 = this;
 
@@ -1331,3 +1347,3 @@ var _this$state11 = this.state,
 
-      var c = _this3.latLngToPixel(anchor || position || center);
+      var c = _this4.latLngToPixel(anchor || position || center);
 
@@ -1337,4 +1353,4 @@ return /*#__PURE__*/React.cloneElement(child, {
         top: c[1] - (offset ? offset[1] : 0),
-        latLngToPixel: _this3.latLngToPixel,
-        pixelToLatLng: _this3.pixelToLatLng,
+        latLngToPixel: _this4.latLngToPixel,
+        pixelToLatLng: _this4.pixelToLatLng,
         mapState: mapState
@@ -1351,2 +1367,3 @@ });
     return /*#__PURE__*/React.createElement("div", {
+      className: "pigeon-overlays",
       style: childrenStyle
@@ -1433,2 +1450,3 @@ }, childrenWithProps);
       return /*#__PURE__*/React.createElement("div", {
+        className: "pigeon-overlay-warning",
         style: style
@@ -1435,0 +1453,0 @@ }, warningText.replace('META', meta));

lib/map.d.ts

@@ -128,2 +128,3 @@ import React, { Component } from 'react';
     _centerStart?: Point;
+    _resizeObserver: any;
     constructor(props: MapProps);
@@ -130,0 +131,0 @@ componentDidMount(): void;

package.json

 {
   "name": "pigeon-maps",
-  "version": "0.17.1",
+  "version": "0.17.2",
   "description": "ReactJS maps without external dependencies",
@@ -88,3 +88,3 @@ "author": "Marius Andra",
     "tslib": "^2.0.1",
-    "typescript": "^3.9.7",
+    "typescript": "^4.2.3",
     "webpack": "^4.44.1",
@@ -91,0 +91,0 @@ "webpack-cli": "^3.3.12",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

184846

increased by1%

Lines of code

4246

increased by1.12%

No dependency changes