@react-google-maps/marker-clusterer 2.10.1 → 2.11.2

package/dist/umd.js

@@ -4,6 +4,37 @@
     (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.markerClusterer = {}));
 })(this, (function (exports) { 'use strict';
 
+    /******************************************************************************
+    Copyright (c) Microsoft Corporation.
+
+    Permission to use, copy, modify, and/or distribute this software for any
+    purpose with or without fee is hereby granted.
+
+    THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
+    REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
+    AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
+    INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
+    LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
+    OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
+    PERFORMANCE OF THIS SOFTWARE.
+    ***************************************************************************** */
+    /* global Reflect, Promise */
+
+    var extendStatics = function(d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+
+    function __extends(d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    }
+
     var ClusterIcon = /** @class */ (function () {
         function ClusterIcon(cluster, styles) {
             cluster.getClusterer().extend(ClusterIcon, google.maps.OverlayView);
@@ -31,8 +62,6 @@
             this.cMouseDownInCluster = null;
             this.cDraggingMapByCluster = null;
             this.timeOut = null;
-            // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-            // @ts-ignore
             this.setMap(cluster.getMap()); // Note: this causes onAdd to be called
         }
         ClusterIcon.prototype.onBoundsChanged = function () {
@@ -60,22 +89,23 @@
                     // Zoom into the cluster.
                     var maxZoom_1 = markerClusterer_1.getMaxZoom();
                     var bounds_1 = this.cluster.getBounds();
-                    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-                    // @ts-ignore
-                    markerClusterer_1.getMap().fitBounds(bounds_1);
+                    var map = markerClusterer_1.getMap();
+                    if (map !== null && 'fitBounds' in map) {
+                        map.fitBounds(bounds_1);
+                    }
                     // There is a fix for Issue 170 here:
                     this.timeOut = window.setTimeout(function () {
-                        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-                        // @ts-ignore
-                        markerClusterer_1.getMap().fitBounds(bounds_1);
-                        // Don't zoom beyond the max zoom level
-                        if (maxZoom_1 !== null &&
-                            // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-                            // @ts-ignore
-                            markerClusterer_1.getMap().getZoom() > maxZoom_1) {
-                            // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-                            // @ts-ignore
-                            markerClusterer_1.getMap().setZoom(maxZoom_1 + 1);
+                        var map = markerClusterer_1.getMap();
+                        if (map !== null) {
+                            if ('fitBounds' in map) {
+                                map.fitBounds(bounds_1);
+                            }
+                            var zoom = map.getZoom() || 0;
+                            // Don't zoom beyond the max zoom level
+                            if (maxZoom_1 !== null &&
+                                zoom > maxZoom_1) {
+                                map.setZoom(maxZoom_1 + 1);
+                            }
                         }
                     }, 100);
                 }
@@ -105,23 +135,22 @@
             google.maps.event.trigger(this.cluster.getClusterer(), 'mouseout', this.cluster);
         };
         ClusterIcon.prototype.onAdd = function () {
+            var _a;
             this.div = document.createElement('div');
             this.div.className = this.className;
             if (this.visible) {
                 this.show();
             }
-            // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-            // @ts-ignore
-            this.getPanes().overlayMouseTarget.appendChild(this.div);
-            // Fix for Issue 157
-            this.boundsChangedListener = google.maps.event.addListener(
-            // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-            // @ts-ignore
-            this.getMap(), 'bounds_changed', this.onBoundsChanged);
-            this.div.addEventListener('mousedown', this.onMouseDown);
-            this.div.addEventListener('click', this.onClick);
-            this.div.addEventListener('mouseover', this.onMouseOver);
-            this.div.addEventListener('mouseout', this.onMouseOut);
+            (_a = this.getPanes()) === null || _a === void 0 ? void 0 : _a.overlayMouseTarget.appendChild(this.div);
+            var map = this.getMap();
+            if (map !== null) {
+                // Fix for Issue 157
+                this.boundsChangedListener = google.maps.event.addListener(map, 'bounds_changed', this.onBoundsChanged);
+                this.div.addEventListener('mousedown', this.onMouseDown);
+                this.div.addEventListener('click', this.onClick);
+                this.div.addEventListener('mouseover', this.onMouseOver);
+                this.div.addEventListener('mouseout', this.onMouseOut);
+            }
         };
         ClusterIcon.prototype.onRemove = function () {
             if (this.div && this.div.parentNode) {
@@ -143,9 +172,9 @@
         };
         ClusterIcon.prototype.draw = function () {
             if (this.visible && this.div !== null && this.center) {
-                var _a = this.getPosFromLatLng(this.center), x = _a.x, y = _a.y;
-                this.div.style.top = "".concat(y, "px");
-                this.div.style.left = "".concat(x, "px");
+                var pos = this.getPosFromLatLng(this.center);
+                this.div.style.top = pos !== null ? "".concat(pos.y, "px") : '0';
+                this.div.style.left = pos !== null ? "".concat(pos.x, "px") : '0';
             }
         };
         ClusterIcon.prototype.hide = function () {
@@ -173,8 +202,8 @@
                 }
                 this.div.style.cursor = 'pointer';
                 this.div.style.position = 'absolute';
-                this.div.style.top = "".concat(pos.y, "px");
-                this.div.style.left = "".concat(pos.x, "px");
+                this.div.style.top = pos !== null ? "".concat(pos.y, "px") : '0';
+                this.div.style.left = pos !== null ? "".concat(pos.x, "px") : '0';
                 this.div.style.width = "".concat(this.width, "px");
                 this.div.style.height = "".concat(this.height, "px");
                 var img = document.createElement('img');
@@ -231,10 +260,11 @@
             this.center = center;
         };
         ClusterIcon.prototype.getPosFromLatLng = function (latlng) {
-            // @ts-ignore
             var pos = this.getProjection().fromLatLngToDivPixel(latlng);
-            pos.x -= this.anchorIcon[1];
-            pos.y -= this.anchorIcon[0];
+            if (pos !== null) {
+                pos.x -= this.anchorIcon[1];
+                pos.y -= this.anchorIcon[0];
+            }
             return pos;
         };
         return ClusterIcon;
@@ -243,8 +273,6 @@
     var Cluster = /** @class */ (function () {
         function Cluster(markerClusterer) {
             this.markerClusterer = markerClusterer;
-            // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-            // @ts-ignore
             this.map = this.markerClusterer.getMap();
             this.gridSize = this.markerClusterer.getGridSize();
             this.minClusterSize = this.markerClusterer.getMinimumClusterSize();
@@ -281,8 +309,6 @@
             return bounds;
         };
         Cluster.prototype.remove = function () {
-            // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-            // @ts-ignore
             this.clusterIcon.setMap(null);
             this.markers = [];
             // eslint-disable-next-line @typescript-eslint/ban-ts-comment
@@ -290,6 +316,7 @@
             delete this.markers;
         };
         Cluster.prototype.addMarker = function (marker) {
+            var _a;
             if (this.isMarkerAlreadyAdded(marker)) {
                 return false;
             }
@@ -314,7 +341,7 @@
             this.markers.push(marker);
             var mCount = this.markers.length;
             var maxZoom = this.markerClusterer.getMaxZoom();
-            var zoom = this.map.getZoom();
+            var zoom = (_a = this.map) === null || _a === void 0 ? void 0 : _a.getZoom();
             if (maxZoom !== null && typeof zoom !== 'undefined' && zoom > maxZoom) {
                 // Zoomed in past max zoom, so show the marker.
                 if (marker.getMap() !== this.map) {
@@ -351,9 +378,10 @@
             this.bounds = this.markerClusterer.getExtendedBounds(new google.maps.LatLngBounds(this.center, this.center));
         };
         Cluster.prototype.updateIcon = function () {
+            var _a;
             var mCount = this.markers.length;
             var maxZoom = this.markerClusterer.getMaxZoom();
-            var zoom = this.map.getZoom();
+            var zoom = (_a = this.map) === null || _a === void 0 ? void 0 : _a.getZoom();
             if (maxZoom !== null && typeof zoom !== 'undefined' && zoom > maxZoom) {
                 this.clusterIcon.hide();
                 return;
@@ -383,7 +411,6 @@
         return Cluster;
     }());
 
-    /* global google */
     /**
      * Supports up to 9007199254740991 (Number.MAX_SAFE_INTEGER) markers
      * which is not a problem as max array length is 4294967296 (2**32)
@@ -404,91 +431,84 @@
     var IMAGE_EXTENSION = 'png';
     var IMAGE_SIZES = [53, 56, 66, 78, 90];
     var CLUSTERER_CLASS = 'cluster';
-    var Clusterer = /** @class */ (function () {
+    var Clusterer = /** @class */ (function (_super) {
+        __extends(Clusterer, _super);
         function Clusterer(map, optMarkers, optOptions) {
             if (optMarkers === void 0) { optMarkers = []; }
             if (optOptions === void 0) { optOptions = {}; }
-            this.extend(Clusterer, google.maps.OverlayView);
-            this.markers = [];
-            this.clusters = [];
-            this.listeners = [];
-            this.activeMap = null;
-            this.ready = false;
-            this.gridSize = optOptions.gridSize || 60;
-            this.minClusterSize = optOptions.minimumClusterSize || 2;
-            this.maxZoom = optOptions.maxZoom || null;
-            this.styles = optOptions.styles || [];
-            this.title = optOptions.title || '';
-            this.zoomOnClick = true;
+            var _this = _super.call(this) || this;
+            _this.extend(Clusterer, google.maps.OverlayView);
+            _this.markers = [];
+            _this.clusters = [];
+            _this.listeners = [];
+            _this.activeMap = null;
+            _this.ready = false;
+            _this.gridSize = optOptions.gridSize || 60;
+            _this.minClusterSize = optOptions.minimumClusterSize || 2;
+            _this.maxZoom = optOptions.maxZoom || null;
+            _this.styles = optOptions.styles || [];
+            _this.title = optOptions.title || '';
+            _this.zoomOnClick = true;
             if (optOptions.zoomOnClick !== undefined) {
-                this.zoomOnClick = optOptions.zoomOnClick;
+                _this.zoomOnClick = optOptions.zoomOnClick;
             }
-            this.averageCenter = false;
+            _this.averageCenter = false;
             if (optOptions.averageCenter !== undefined) {
-                this.averageCenter = optOptions.averageCenter;
+                _this.averageCenter = optOptions.averageCenter;
             }
-            this.ignoreHidden = false;
+            _this.ignoreHidden = false;
             if (optOptions.ignoreHidden !== undefined) {
-                this.ignoreHidden = optOptions.ignoreHidden;
+                _this.ignoreHidden = optOptions.ignoreHidden;
             }
-            this.enableRetinaIcons = false;
+            _this.enableRetinaIcons = false;
             if (optOptions.enableRetinaIcons !== undefined) {
-                this.enableRetinaIcons = optOptions.enableRetinaIcons;
-            }
-            this.imagePath = optOptions.imagePath || IMAGE_PATH;
-            this.imageExtension = optOptions.imageExtension || IMAGE_EXTENSION;
-            this.imageSizes = optOptions.imageSizes || IMAGE_SIZES;
-            this.calculator = optOptions.calculator || CALCULATOR;
-            this.batchSize = optOptions.batchSize || BATCH_SIZE;
-            this.batchSizeIE = optOptions.batchSizeIE || BATCH_SIZE_IE;
-            this.clusterClass = optOptions.clusterClass || CLUSTERER_CLASS;
+                _this.enableRetinaIcons = optOptions.enableRetinaIcons;
+            }
+            _this.imagePath = optOptions.imagePath || IMAGE_PATH;
+            _this.imageExtension = optOptions.imageExtension || IMAGE_EXTENSION;
+            _this.imageSizes = optOptions.imageSizes || IMAGE_SIZES;
+            _this.calculator = optOptions.calculator || CALCULATOR;
+            _this.batchSize = optOptions.batchSize || BATCH_SIZE;
+            _this.batchSizeIE = optOptions.batchSizeIE || BATCH_SIZE_IE;
+            _this.clusterClass = optOptions.clusterClass || CLUSTERER_CLASS;
             if (navigator.userAgent.toLowerCase().indexOf('msie') !== -1) {
                 // Try to avoid IE timeout when processing a huge number of markers:
-                this.batchSize = this.batchSizeIE;
+                _this.batchSize = _this.batchSizeIE;
             }
-            this.timerRefStatic = null;
-            this.setupStyles();
-            this.addMarkers(optMarkers, true);
-            // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-            // @ts-ignore
-            this.setMap(map); // Note: this causes onAdd to be called
+            _this.timerRefStatic = null;
+            _this.setupStyles();
+            _this.addMarkers(optMarkers, true);
+            _this.setMap(map); // Note: this causes onAdd to be called
+            return _this;
         }
+        Clusterer.prototype.onZoomChanged = function () {
+            var _a, _b;
+            this.resetViewport(false);
+            // Workaround for this Google bug: when map is at level 0 and "-" of
+            // zoom slider is clicked, a "zoom_changed" event is fired even though
+            // the map doesn't zoom out any further. In this situation, no "idle"
+            // event is triggered so the cluster markers that have been removed
+            // do not get redrawn. Same goes for a zoom in at maxZoom.
+            if (((_a = this.getMap()) === null || _a === void 0 ? void 0 : _a.getZoom()) === (this.get('minZoom') || 0) ||
+                ((_b = this.getMap()) === null || _b === void 0 ? void 0 : _b.getZoom()) === this.get('maxZoom')) {
+                google.maps.event.trigger(this, 'idle');
+            }
+        };
+        Clusterer.prototype.onIdle = function () {
+            this.redraw();
+        };
         Clusterer.prototype.onAdd = function () {
-            var _this = this;
-            // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-            // @ts-ignore
-            this.activeMap = this.getMap();
+            var map = this.getMap();
+            this.activeMap = map;
             this.ready = true;
             this.repaint();
-            // Add the map event listeners
-            this.listeners = [
-                google.maps.event.addListener(
-                // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-                // @ts-ignore
-                this.getMap(), 'zoom_changed', function () {
-                    _this.resetViewport(false);
-                    // Workaround for this Google bug: when map is at level 0 and "-" of
-                    // zoom slider is clicked, a "zoom_changed" event is fired even though
-                    // the map doesn't zoom out any further. In this situation, no "idle"
-                    // event is triggered so the cluster markers that have been removed
-                    // do not get redrawn. Same goes for a zoom in at maxZoom.
-                    if (
-                    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-                    // @ts-ignore
-                    _this.getMap().getZoom() === (_this.get('minZoom') || 0) ||
-                        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-                        // @ts-ignore
-                        _this.getMap().getZoom() === _this.get('maxZoom')) {
-                        google.maps.event.trigger(_this, 'idle');
-                    }
-                }),
-                google.maps.event.addListener(
-                // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-                // @ts-ignore
-                this.getMap(), 'idle', function () {
-                    _this.redraw();
-                }),
-            ];
+            if (map !== null) {
+                // Add the map event listeners
+                this.listeners = [
+                    google.maps.event.addListener(map, 'zoom_changed', this.onZoomChanged),
+                    google.maps.event.addListener(map, 'idle', this.onIdle),
+                ];
+            }
         };
         Clusterer.prototype.onRemove = function () {
             // Put all the managed markers back on the map:
@@ -533,9 +553,10 @@
                     bounds.extend(position);
                 }
             }
-            // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-            // @ts-ignore
-            this.getMap().fitBounds(bounds);
+            var map = this.getMap();
+            if (map !== null && 'fitBounds' in map) {
+                map.fitBounds(bounds);
+            }
         };
         Clusterer.prototype.getGridSize = function () {
             return this.gridSize;
@@ -725,27 +746,37 @@
             }, 0);
         };
         Clusterer.prototype.getExtendedBounds = function (bounds) {
-            // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-            // @ts-ignore
             var projection = this.getProjection();
             // Convert the points to pixels and the extend out by the grid size.
             var trPix = projection.fromLatLngToDivPixel(
             // Turn the bounds into latlng.
             new google.maps.LatLng(bounds.getNorthEast().lat(), bounds.getNorthEast().lng()));
-            trPix.x += this.gridSize;
-            trPix.y -= this.gridSize;
+            if (trPix !== null) {
+                trPix.x += this.gridSize;
+                trPix.y -= this.gridSize;
+            }
             var blPix = projection.fromLatLngToDivPixel(
             // Turn the bounds into latlng.
             new google.maps.LatLng(bounds.getSouthWest().lat(), bounds.getSouthWest().lng()));
-            blPix.x -= this.gridSize;
-            blPix.y += this.gridSize;
+            if (blPix !== null) {
+                blPix.x -= this.gridSize;
+                blPix.y += this.gridSize;
+            }
             // Extend the bounds to contain the new bounds.
-            bounds.extend(
-            // Convert the pixel points back to LatLng nw
-            projection.fromDivPixelToLatLng(trPix));
-            bounds.extend(
-            // Convert the pixel points back to LatLng sw
-            projection.fromDivPixelToLatLng(blPix));
+            if (trPix !== null) {
+                // Convert the pixel points back to LatLng nw
+                var point1 = projection.fromDivPixelToLatLng(trPix);
+                if (point1 !== null) {
+                    bounds.extend(point1);
+                }
+            }
+            if (blPix !== null) {
+                // Convert the pixel points back to LatLng sw
+                var point2 = projection.fromDivPixelToLatLng(blPix);
+                if (point2 !== null) {
+                    bounds.extend(point2);
+                }
+            }
             return bounds;
         };
         Clusterer.prototype.redraw = function () {
@@ -832,31 +863,21 @@
                     delete this.timerRefStatic;
                 }
             }
+            var map = this.getMap();
+            var bounds = map !== null && 'getBounds' in map ? map.getBounds() : null;
+            var zoom = (map === null || map === void 0 ? void 0 : map.getZoom()) || 0;
             // Get our current map view bounds.
             // Create a new bounds object so we don't affect the map.
             //
             // See Comments 9 & 11 on Issue 3651 relating to this workaround for a Google Maps bug:
-            var mapBounds = 
-            // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-            // @ts-ignore
-            this.getMap().getZoom() > 3
-                ? new google.maps.LatLngBounds(
-                // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-                // @ts-ignore
-                this.getMap()
-                    .getBounds()
-                    .getSouthWest(), 
-                // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-                // @ts-ignore
-                this.getMap()
-                    .getBounds()
-                    .getNorthEast())
+            var mapBounds = zoom > 3
+                ? new google.maps.LatLngBounds(bounds === null || bounds === void 0 ? void 0 : bounds.getSouthWest(), bounds === null || bounds === void 0 ? void 0 : bounds.getNorthEast())
                 : new google.maps.LatLngBounds(new google.maps.LatLng(85.02070771743472, -178.48388434375), new google.maps.LatLng(-85.08136444384544, 178.00048865625));
-            var bounds = this.getExtendedBounds(mapBounds);
+            var extendedMapBounds = this.getExtendedBounds(mapBounds);
             var iLast = Math.min(iFirst + this.batchSize, this.markers.length);
             for (var i = iFirst; i < iLast; i++) {
                 var marker = this.markers[i];
-                if (!marker.isAdded && this.isMarkerInBounds(marker, bounds) && (!this.ignoreHidden || (this.ignoreHidden && marker.getVisible()))) {
+                if (!marker.isAdded && this.isMarkerInBounds(marker, extendedMapBounds) && (!this.ignoreHidden || (this.ignoreHidden && marker.getVisible()))) {
                     this.addToClosestCluster(marker);
                 }
             }
@@ -882,19 +903,14 @@
         };
         Clusterer.prototype.extend = function (obj1, obj2) {
             return function applyExtend(object) {
-                // eslint-disable-next-line guard-for-in
                 for (var property in object.prototype) {
-                    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-                    // @ts-ignore
-                    this.prototype[property] = object.prototype[property];
+                    this.prototype.set(property, object.prototype.get(property));
                 }
-                // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-                // @ts-ignore
                 return this;
             }.apply(obj1, [obj2]);
         };
         return Clusterer;
-    }());
+    }(google.maps.OverlayView));
 
     exports.Cluster = Cluster;
     exports.ClusterIcon = ClusterIcon;