@splunk/visualizations 26.0.0 → 26.1.0

package/common/utils/mapUtils.js

@@ -165,28 +165,38 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.columnsNullToZeros = void 0;
+
 var types_1 = __webpack_require__(9);
+
 var dsl_1 = __webpack_require__(20);
+
 var hocUtils_1 = __webpack_require__(21);
+
 var JSONSchemaUtils_1 = __webpack_require__(22);
+
 var BubbleLayer_1 = __webpack_require__(23);
+
 var columnsNullToZeros = function columnsNullToZeros(config, dataSources, options) {
   var _a, _b;
+
   var primary = dataSources.primary;
   var _primary$data = primary.data,
-    columns = _primary$data.columns,
-    fields = _primary$data.fields;
+      columns = _primary$data.columns,
+      fields = _primary$data.fields;
   var newColumns = columns;
   var mergedOptions = (0, hocUtils_1.deepMergeWithArrayPrimitiveOverrides)({}, options, (0, JSONSchemaUtils_1.pickFieldFromJSONSchema)(config.optionsSchema, 'default'));
+
   if (((_b = (_a = mergedOptions.layers) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.type) === 'bubble') {
     var latitudeField = (0, dsl_1.getFieldsFromDSL)(mergedOptions.layers[0].latitude, dataSources)[0] || '';
     var longitudeField = (0, dsl_1.getFieldsFromDSL)(mergedOptions.layers[0].longitude, dataSources)[0] || '';
     var excludedFields = [latitudeField, longitudeField, 'geobin'].concat(BubbleLayer_1.GEO_LAT_AND_LONG_FIELD);
     var indicesToEvaluate = new Set(fields.reduce(function (arr, e, i) {
       var field = typeof e === 'string' ? e : e.name.toString();
+
       if (!excludedFields.includes(field)) {
         arr.push(i);
       }
+
       return arr;
     }, []));
     newColumns = columns.map(function (column, i) {
@@ -196,9 +206,11 @@ var columnsNullToZeros = function columnsNullToZeros(config, dataSources, option
           return !value || !(0, types_1.isNumber)(value) ? 0 : +value;
         });
       }
+
       return column;
     });
   }
+
   var modifiedDatasources = Object.assign(Object.assign({}, dataSources), {
     primary: Object.assign(Object.assign({}, primary), {
       data: Object.assign(Object.assign({}, primary.data), {
@@ -208,6 +220,7 @@ var columnsNullToZeros = function columnsNullToZeros(config, dataSources, option
   });
   return modifiedDatasources;
 };
+
 exports.columnsNullToZeros = columnsNullToZeros;
 
 /***/ }),
@@ -236,36 +249,51 @@ module.exports = require("@splunk/visualizations-shared/JSONSchemaUtils");
 
 
 var _slicedToArray = __webpack_require__(7);
+
 var _defineProperty = __webpack_require__(1);
+
 var _toConsumableArray = __webpack_require__(2);
+
 var _taggedTemplateLiteral = __webpack_require__(10);
+
 var _templateObject;
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.Bubble = exports.PieSegment = exports.GEO_LAT_AND_LONG_FIELD = exports.GEO_BOUND_PREFIX = void 0;
+
 var React = __webpack_require__(3);
+
 var styled_components_1 = __webpack_require__(11);
+
 var lodash_1 = __webpack_require__(0);
+
 var colorUtils_1 = __webpack_require__(12);
+
 var MapUtils_1 = __webpack_require__(24);
+
 var MarkerWrapper_1 = __webpack_require__(28);
+
 exports.GEO_BOUND_PREFIX = '_geo_bounds_';
 exports.GEO_LAT_AND_LONG_FIELD = ['_geo_long_field', '_geo_lat_field'];
 exports.PieSegment = React.memo(function (_ref) {
   var start = _ref.start,
-    end = _ref.end,
-    radius = _ref.radius,
-    color = _ref.color,
-    themeColor = _ref.themeColor,
-    segmentMetadata = _ref.segmentMetadata,
-    handleBubbleClick = _ref.handleBubbleClick;
+      end = _ref.end,
+      radius = _ref.radius,
+      color = _ref.color,
+      themeColor = _ref.themeColor,
+      segmentMetadata = _ref.segmentMetadata,
+      handleBubbleClick = _ref.handleBubbleClick;
+
   var _ref2 = segmentMetadata !== null && segmentMetadata !== void 0 ? segmentMetadata : {},
-    name = _ref2.name,
-    value = _ref2.value;
+      name = _ref2.name,
+      value = _ref2.value;
+
   var handleSegmentClick = React.useCallback(function (e) {
     handleBubbleClick(e, name, value);
   }, [name, value, handleBubbleClick]);
+
   if (end - start === 1) {
     return React.createElement("circle", {
       onClick: handleSegmentClick,
@@ -278,6 +306,7 @@ exports.PieSegment = React.memo(function (_ref) {
       stroke: color
     });
   }
+
   var a0 = 2 * Math.PI * (start - 0.25);
   var a1 = 2 * Math.PI * (end - 0.25);
   var x0 = Math.cos(a0);
@@ -299,17 +328,17 @@ exports.PieSegment.displayName = 'MapBubblePieSegment';
 var StyledMarkerWrapper = (0, styled_components_1.default)(MarkerWrapper_1.default)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    cursor: pointer;\n"])));
 exports.Bubble = React.memo(function (_ref3) {
   var originalValues = _ref3.originalValues,
-    valueRange = _ref3.valueRange,
-    colors = _ref3.colors,
-    themeColor = _ref3.themeColor,
-    isPie = _ref3.isPie,
-    latitude = _ref3.latitude,
-    longitude = _ref3.longitude,
-    bubbleSize = _ref3.bubbleSize,
-    _ref3$additionalField = _ref3.additionalFields,
-    additionalFields = _ref3$additionalField === void 0 ? [] : _ref3$additionalField,
-    map = _ref3.map,
-    handleMapClick = _ref3.handleMapClick;
+      valueRange = _ref3.valueRange,
+      colors = _ref3.colors,
+      themeColor = _ref3.themeColor,
+      isPie = _ref3.isPie,
+      latitude = _ref3.latitude,
+      longitude = _ref3.longitude,
+      bubbleSize = _ref3.bubbleSize,
+      _ref3$additionalField = _ref3.additionalFields,
+      additionalFields = _ref3$additionalField === void 0 ? [] : _ref3$additionalField,
+      map = _ref3.map,
+      handleMapClick = _ref3.handleMapClick;
   var onBubbleClick = React.useCallback(function (e, name, value) {
     handleMapClick(e, name, value);
     e.stopPropagation();
@@ -318,14 +347,16 @@ exports.Bubble = React.memo(function (_ref3) {
     var allZeros = originalValues.every(function (v) {
       return v === 0;
     });
+
     if (allZeros || !originalValues.length) {
       return null;
-    }
-    // sanitize values
+    } // sanitize values
+
+
     var values = originalValues.map(function (v) {
       return v > 0 ? v : 0;
-    });
-    // compute offsets for pie segments
+    }); // compute offsets for pie segments
+
     var offsets = [];
     var total = 0;
     values.forEach(function (count) {
@@ -359,9 +390,11 @@ exports.Bubble = React.memo(function (_ref3) {
       });
     }));
   }, [bubbleSize, colors, isPie, onBubbleClick, originalValues, themeColor, valueRange]);
+
   if (!bubble) {
     return null;
   }
+
   return React.createElement(StyledMarkerWrapper, {
     longitude: longitude,
     latitude: latitude,
@@ -371,12 +404,13 @@ exports.Bubble = React.memo(function (_ref3) {
   }, bubble);
 });
 exports.Bubble.displayName = 'MapBubble';
+
 var BubbleLayer = function BubbleLayer(props) {
   var bubbleLayer = props.bubbleLayer,
-    themeColorScheme = props.themeColorScheme,
-    map = props.map,
-    zoom = props.zoom,
-    onMapClick = props.onMapClick;
+      themeColorScheme = props.themeColorScheme,
+      map = props.map,
+      zoom = props.zoom,
+      onMapClick = props.onMapClick;
   bubbleLayer.seriesColors = bubbleLayer.seriesColors || MapUtils_1.DEFAULT_SERIES_COLORS;
   bubbleLayer.bubbleSize = bubbleLayer.bubbleSize || [];
   var bakedData = React.useMemo(function () {
@@ -385,20 +419,22 @@ var BubbleLayer = function BubbleLayer(props) {
   var staticColors = React.useMemo(function () {
     return (0, MapUtils_1.getStaticColors)(bubbleLayer.bubbleSize.length, bubbleLayer.seriesColors);
   }, [bubbleLayer.bubbleSize.length, bubbleLayer.seriesColors]);
+
   var _ref4 = bakedData !== null && bakedData !== void 0 ? bakedData : {},
-    _ref4$data = _ref4.data,
-    data = _ref4$data === void 0 ? [] : _ref4$data,
-    _ref4$dataRange = _ref4.dataRange,
-    dataRange = _ref4$dataRange === void 0 ? [] : _ref4$dataRange,
-    resultLimit = _ref4.resultLimit,
-    bubbleSizeFields = _ref4.bubbleSizeFields,
-    isPie = _ref4.isPie;
+      _ref4$data = _ref4.data,
+      data = _ref4$data === void 0 ? [] : _ref4$data,
+      _ref4$dataRange = _ref4.dataRange,
+      dataRange = _ref4$dataRange === void 0 ? [] : _ref4$dataRange,
+      resultLimit = _ref4.resultLimit,
+      bubbleSizeFields = _ref4.bubbleSizeFields,
+      isPie = _ref4.isPie;
+
   var _bubbleLayer$addition = bubbleLayer.additionalTooltipFields,
-    additionalTooltipFields = _bubbleLayer$addition === void 0 ? [] : _bubbleLayer$addition;
+      additionalTooltipFields = _bubbleLayer$addition === void 0 ? [] : _bubbleLayer$addition;
   var roundedZoom = Math.round(zoom);
   var themeColor = themeColorScheme === 'light' ? '#ffffff' : '#1a1c20';
-  var dynamicColors = bubbleLayer.dataColors;
-  // filter data for the current zoom level and sort base on values
+  var dynamicColors = bubbleLayer.dataColors; // filter data for the current zoom level and sort base on values
+
   var dataToRender = React.useMemo(function () {
     return data.reduce(function (acc, datum, i) {
       if (datum.zoom === roundedZoom) {
@@ -407,14 +443,17 @@ var BubbleLayer = function BubbleLayer(props) {
           idx: i
         });
       }
+
       return acc;
     }, []).slice(0, resultLimit || MapUtils_1.DEFAULT_RESULT_LIMIT).sort(function (a, b) {
       return (0, lodash_1.sum)(b.data.values) - (0, lodash_1.sum)(a.data.values);
     });
   }, [data, resultLimit, roundedZoom]);
+
   var _handleMapClick = React.useCallback(function (e, name, value, i) {
-    var _a, _b, _c;
-    // retrieve metadata from the appropriate datum, indexed by i
+    var _a, _b, _c; // retrieve metadata from the appropriate datum, indexed by i
+
+
     var metadata = (_c = (_b = (_a = dataToRender[i]) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.metadata) !== null && _c !== void 0 ? _c : {};
     var payload = Object.keys(metadata).reduce(function (acc, curr) {
       var key = "row.".concat(curr, ".value");
@@ -429,13 +468,16 @@ var BubbleLayer = function BubbleLayer(props) {
       payload: payload
     });
   }, [dataToRender, onMapClick]);
+
   return React.createElement(React.Fragment, null, dataToRender.map(function (datum, i) {
     var colors = dynamicColors ? [dataToRender.map(function (obj) {
       return (0, colorUtils_1.isColor)(dynamicColors[obj.idx]) ? dynamicColors[obj.idx] : MapUtils_1.DEFAULT_CLUSTER_COLOR;
     })[i]] : staticColors;
+
     var _datum$data$coordinat = _slicedToArray(datum.data.coordinates, 2),
-      longitude = _datum$data$coordinat[0],
-      latitude = _datum$data$coordinat[1];
+        longitude = _datum$data$coordinat[0],
+        latitude = _datum$data$coordinat[1];
+
     var bubbleSize = datum.data.values.map(function (value, index) {
       return {
         name: bubbleSizeFields[index],
@@ -467,6 +509,7 @@ var BubbleLayer = function BubbleLayer(props) {
     });
   }));
 };
+
 exports.default = BubbleLayer;
 
 /***/ }),
@@ -477,35 +520,48 @@ exports.default = BubbleLayer;
 
 
 var _defineProperty = __webpack_require__(1);
+
 var _slicedToArray = __webpack_require__(7);
+
 var _toConsumableArray = __webpack_require__(2);
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.formatMetadata = exports.compareBaseStyles = exports.getScaledOpacities = exports.getGlobalLayerBoundaries = exports.isValidLatLon = exports.bakeBubbleData = exports.sanitizeValues = exports.transposeArray = exports.matchBubbleSize = exports.getStaticColors = exports.getZoomLevelFromGeobin = exports.getZoomConstraintsFromTileConfig = exports.getMapStyle = exports.getTilePreset = exports.LAYER_TYPE = exports.DEFAULT_OPACITY = exports.MAX_BUBBLE_RADIUS = exports.MIN_BUBBLE_RADIUS = exports.MAP_STYLE_VERSION_NUMBER = exports.DEFAULT_SERIES_COLORS = exports.DEFAULT_CLUSTER_COLOR = exports.DEFAULT_RESULT_LIMIT = exports.MIN_LONGITUDE = exports.MAX_LONGITUDE = exports.MIN_LATITUDE = exports.MAX_LATITUDE = void 0;
+
 var lodash_1 = __webpack_require__(0);
+
 var d3_scale_1 = __webpack_require__(25);
+
 var chroma = __webpack_require__(26);
+
 var colorUtils_1 = __webpack_require__(12);
+
 var visualization_color_palettes_1 = __webpack_require__(27);
+
 var types_1 = __webpack_require__(9);
+
 exports.MAX_LATITUDE = 90;
 exports.MIN_LATITUDE = -90;
 exports.MAX_LONGITUDE = 180;
 exports.MIN_LONGITUDE = -180;
 exports.DEFAULT_RESULT_LIMIT = 1000;
 exports.DEFAULT_CLUSTER_COLOR = '#909090';
-exports.DEFAULT_SERIES_COLORS = visualization_color_palettes_1.VIZ_CATEGORICAL;
-// MapLibre requires a map style specification number which is always 8
-exports.MAP_STYLE_VERSION_NUMBER = 8;
-// currently using one [min, max] value set for bubbles across all zoom levels
+exports.DEFAULT_SERIES_COLORS = visualization_color_palettes_1.VIZ_CATEGORICAL; // MapLibre requires a map style specification number which is always 8
+
+exports.MAP_STYLE_VERSION_NUMBER = 8; // currently using one [min, max] value set for bubbles across all zoom levels
 // TODO: design choices on [min, max] bubble size for different zoom levels
+
 exports.MIN_BUBBLE_RADIUS = 7.11; // 10px
+
 exports.MAX_BUBBLE_RADIUS = 45.26; // 85px
+
 exports.DEFAULT_OPACITY = 0.8;
 var LONGITUDE = 'longitude';
 var LATITUDE = 'latitude';
 var LAYER_TYPE;
+
 (function (LAYER_TYPE) {
   LAYER_TYPE["Marker"] = "marker";
   LAYER_TYPE["Bubble"] = "bubble";
@@ -519,12 +575,16 @@ var LAYER_TYPE;
  * @param {BaseTileConfig[]} args.customTileConfig
  * @returns {Object} tile preset
  */
+
+
 var getTilePreset = function getTilePreset(_ref) {
   var _ref$defaultTileConfi = _ref.defaultTileConfig,
-    defaultTileConfig = _ref$defaultTileConfi === void 0 ? [] : _ref$defaultTileConfi,
-    _ref$customTileConfig = _ref.customTileConfig,
-    customTileConfig = _ref$customTileConfig === void 0 ? [] : _ref$customTileConfig;
+      defaultTileConfig = _ref$defaultTileConfi === void 0 ? [] : _ref$defaultTileConfi,
+      _ref$customTileConfig = _ref.customTileConfig,
+      customTileConfig = _ref$customTileConfig === void 0 ? [] : _ref$customTileConfig;
+
   var _a, _b;
+
   var tilePreset = {};
   var defaultTileLight = {};
   var defaultTileDark = {};
@@ -538,6 +598,7 @@ var getTilePreset = function getTilePreset(_ref) {
     });
     tilePreset[key] = updatedConfig;
   });
+
   if (defaultTileConfig.length > 0) {
     defaultTileLight = (_a = defaultTileConfig.find(function (config) {
       return config.theme === 'light';
@@ -550,12 +611,14 @@ var getTilePreset = function getTilePreset(_ref) {
       return config.theme === undefined;
     });
   }
+
   return {
     tilePreset: tilePreset,
     defaultTileLight: defaultTileLight,
     defaultTileDark: defaultTileDark
   };
 };
+
 exports.getTilePreset = getTilePreset;
 /**
  * Check if baseLayerTileServer is in tilePreset and config matches current theme, if yes, return.
@@ -570,20 +633,22 @@ exports.getTilePreset = getTilePreset;
  * @param {BaseTileConfig} args.defaultTileLight
  * @returns {BaseTileConfig} mapStyle
  */
+
 var getMapStyle = function getMapStyle(_ref2) {
   var showBaseLayer = _ref2.showBaseLayer,
-    _ref2$baseLayerTileSe = _ref2.baseLayerTileServer,
-    baseLayerTileServer = _ref2$baseLayerTileSe === void 0 ? '' : _ref2$baseLayerTileSe,
-    _ref2$baseLayerTileSe2 = _ref2.baseLayerTileServerType,
-    baseLayerTileServerType = _ref2$baseLayerTileSe2 === void 0 ? '' : _ref2$baseLayerTileSe2,
-    _ref2$tilePreset = _ref2.tilePreset,
-    tilePreset = _ref2$tilePreset === void 0 ? {} : _ref2$tilePreset,
-    _ref2$colorScheme = _ref2.colorScheme,
-    colorScheme = _ref2$colorScheme === void 0 ? 'light' : _ref2$colorScheme,
-    _ref2$defaultTileLigh = _ref2.defaultTileLight,
-    defaultTileLight = _ref2$defaultTileLigh === void 0 ? {} : _ref2$defaultTileLigh,
-    _ref2$defaultTileDark = _ref2.defaultTileDark,
-    defaultTileDark = _ref2$defaultTileDark === void 0 ? {} : _ref2$defaultTileDark;
+      _ref2$baseLayerTileSe = _ref2.baseLayerTileServer,
+      baseLayerTileServer = _ref2$baseLayerTileSe === void 0 ? '' : _ref2$baseLayerTileSe,
+      _ref2$baseLayerTileSe2 = _ref2.baseLayerTileServerType,
+      baseLayerTileServerType = _ref2$baseLayerTileSe2 === void 0 ? '' : _ref2$baseLayerTileSe2,
+      _ref2$tilePreset = _ref2.tilePreset,
+      tilePreset = _ref2$tilePreset === void 0 ? {} : _ref2$tilePreset,
+      _ref2$colorScheme = _ref2.colorScheme,
+      colorScheme = _ref2$colorScheme === void 0 ? 'light' : _ref2$colorScheme,
+      _ref2$defaultTileLigh = _ref2.defaultTileLight,
+      defaultTileLight = _ref2$defaultTileLigh === void 0 ? {} : _ref2$defaultTileLigh,
+      _ref2$defaultTileDark = _ref2.defaultTileDark,
+      defaultTileDark = _ref2$defaultTileDark === void 0 ? {} : _ref2$defaultTileDark;
+
   if (!showBaseLayer) {
     return {
       version: exports.MAP_STYLE_VERSION_NUMBER,
@@ -603,9 +668,11 @@ var getMapStyle = function getMapStyle(_ref2) {
       }]
     };
   }
+
   if (baseLayerTileServer && tilePreset[baseLayerTileServer] && (tilePreset[baseLayerTileServer].theme === colorScheme || tilePreset[baseLayerTileServer].theme === 'all')) {
     return tilePreset[baseLayerTileServer];
   }
+
   if (baseLayerTileServer && baseLayerTileServerType) {
     var tiles = [];
     /**
@@ -613,6 +680,7 @@ var getMapStyle = function getMapStyle(_ref2) {
      * Subdomains are used to help with browser parallel requests per domain limitation. These subdomains are typically single letters 'a', 'b' and 'c'
      * Refer to https://leafletjs.com/SlavaUkraini/reference.html#tilelayer and https://wiki.openstreetmap.org/wiki/Tile_servers
      */
+
     if (baseLayerTileServer.match(/^(https?):\/\/{(s|S)}\../)) {
       /**
        * sXML (Leaflet) allows users to define their own tile server URLs + list of available subdomains
@@ -623,8 +691,9 @@ var getMapStyle = function getMapStyle(_ref2) {
       tiles = [baseLayerTileServer.replace(/{(s|S)}/, 'a'), baseLayerTileServer.replace(/{(s|S)}/, 'b'), baseLayerTileServer.replace(/{(s|S)}/, 'c')];
     } else {
       tiles = [baseLayerTileServer];
-    }
-    // TODO: remove hardcoded style when we allow users to pass in layer style through Viz options
+    } // TODO: remove hardcoded style when we allow users to pass in layer style through Viz options
+
+
     var mapStyle = {
       version: exports.MAP_STYLE_VERSION_NUMBER,
       sources: {
@@ -640,134 +709,164 @@ var getMapStyle = function getMapStyle(_ref2) {
         source: 'base-tiles',
         minzoom: 0,
         maxzoom: 24 // https://maplibre.org/maplibre-gl-js-docs/api/map/
+
       }]
     };
-
     return mapStyle;
-  }
-  // if tile server is not present in the preset AND we can't construct a mapStyle, fall back on defaults
+  } // if tile server is not present in the preset AND we can't construct a mapStyle, fall back on defaults
+
+
   return colorScheme === 'light' ? defaultTileLight : defaultTileDark;
 };
+
 exports.getMapStyle = getMapStyle;
+
 var getZoomConstraintsFromTileConfig = function getZoomConstraintsFromTileConfig(tileConfig, baseLayerTileServer) {
   var sources = tileConfig.sources,
-    layers = tileConfig.layers;
-  var matchedBaseLayerTileServer = false;
-  // check sources for minzoom maxzoom first
+      layers = tileConfig.layers;
+  var matchedBaseLayerTileServer = false; // check sources for minzoom maxzoom first
+
   var sourceKeys = Object.keys(sources);
+
   for (var i = 0; i < sourceKeys.length; i += 1) {
     var _sources$sourceKeys$i = sources[sourceKeys[i]],
-      minzoom = _sources$sourceKeys$i.minzoom,
-      maxzoom = _sources$sourceKeys$i.maxzoom;
+        minzoom = _sources$sourceKeys$i.minzoom,
+        maxzoom = _sources$sourceKeys$i.maxzoom;
+
     if (baseLayerTileServer && sources[sourceKeys[i]].tiles.indexOf(baseLayerTileServer) !== -1) {
       matchedBaseLayerTileServer = true;
     }
+
     if ((baseLayerTileServer && matchedBaseLayerTileServer || !baseLayerTileServer) && (0, lodash_1.isNumber)(minzoom) && (0, lodash_1.isNumber)(maxzoom)) {
       return {
         minZoom: minzoom,
         maxZoom: maxzoom
       };
     }
-  }
-  // then check layers
+  } // then check layers
+
+
   for (var _i = 0; _i < layers.length; _i += 1) {
     var _layers$_i = layers[_i],
-      _minzoom = _layers$_i.minzoom,
-      _maxzoom = _layers$_i.maxzoom;
+        _minzoom = _layers$_i.minzoom,
+        _maxzoom = _layers$_i.maxzoom;
+
     if ((baseLayerTileServer && matchedBaseLayerTileServer || !baseLayerTileServer) && (0, lodash_1.isNumber)(_minzoom) && (0, lodash_1.isNumber)(_maxzoom)) {
       return {
         minZoom: _minzoom,
         maxZoom: _maxzoom
       };
     }
-  }
-  // Maplibre default - would reset previous min/maxZoom https://maplibre.org/maplibre-gl-js-docs/api/map/
+  } // Maplibre default - would reset previous min/maxZoom https://maplibre.org/maplibre-gl-js-docs/api/map/
+
+
   return {
     minZoom: 0,
     maxZoom: 24
   };
 };
+
 exports.getZoomConstraintsFromTileConfig = getZoomConstraintsFromTileConfig;
+
 var getZoomLevelFromGeobin = function getZoomLevelFromGeobin(geobinStr) {
   var _a;
+
   if (!geobinStr) {
     return null;
-  }
-  // geostats cmds return geobin with zoom level 0-18, 0-99 in the geobinPattern covers the range
+  } // geostats cmds return geobin with zoom level 0-18, 0-99 in the geobinPattern covers the range
+
+
   var geobinPattern = /bin_id_zl_([0-9]{0,2})?_y_/g;
   var match = geobinPattern.exec(geobinStr);
   return (_a = (match === null || match === void 0 ? void 0 : match.length) && parseInt(match[1], 10)) !== null && _a !== void 0 ? _a : null;
 };
-exports.getZoomLevelFromGeobin = getZoomLevelFromGeobin;
-// Bubble colors - static
+
+exports.getZoomLevelFromGeobin = getZoomLevelFromGeobin; // Bubble colors - static
+
 var getStaticColors = function getStaticColors(colorCount, colorArray) {
   if (colorCount < 0 || !colorCount) {
     return [exports.DEFAULT_CLUSTER_COLOR];
   }
+
   if (!colorArray || !colorArray.length) {
     return _toConsumableArray(Array(colorCount).keys()).map(function (i) {
       return exports.DEFAULT_SERIES_COLORS[i];
     });
-  }
-  // loop through colorArray to pick the first $colorCount colors
+  } // loop through colorArray to pick the first $colorCount colors
   // start from begining again if colorCount > colorArray.length
+
+
   return _toConsumableArray(Array(colorCount).keys()).map(function (i) {
     return (0, colorUtils_1.isColor)(colorArray[i % colorArray.length]) ? colorArray[i % colorArray.length] : exports.DEFAULT_CLUSTER_COLOR;
   });
 };
-exports.getStaticColors = getStaticColors;
-// Bubble size
+
+exports.getStaticColors = getStaticColors; // Bubble size
+
 var matchBubbleSize = function matchBubbleSize(dataRange, data) {
   var size = (0, d3_scale_1.scalePow)().exponent(0.2).domain(dataRange).range([exports.MIN_BUBBLE_RADIUS, exports.MAX_BUBBLE_RADIUS])(data);
+
   if (size > exports.MAX_BUBBLE_RADIUS) {
     return exports.MAX_BUBBLE_RADIUS;
   }
+
   if (size < exports.MIN_BUBBLE_RADIUS) {
     return exports.MIN_BUBBLE_RADIUS;
   }
+
   return size;
 };
+
 exports.matchBubbleSize = matchBubbleSize;
+
 var transposeArray = function transposeArray(array) {
   if (!array || !array.length || !array[0] || !array[0].length) {
     return [];
   }
+
   return array[0].map(function (_, i) {
     return array.map(function (row) {
       return row[i];
     });
   });
 };
-exports.transposeArray = transposeArray;
-// sanitize values: update all null, undefined, or negative values to 0
+
+exports.transposeArray = transposeArray; // sanitize values: update all null, undefined, or negative values to 0
+
 var sanitizeValues = function sanitizeValues(values) {
   // null / undefined
   if (!values) {
     return 0;
-  }
-  // number
+  } // number
+
+
   if (!Array.isArray(values)) {
     return values > 0 ? values : 0;
-  }
-  // array
+  } // array
+
+
   return values.map(function (arr) {
     return (0, exports.sanitizeValues)(arr);
   });
 };
+
 exports.sanitizeValues = sanitizeValues;
+
 var bakeBubbleData = function bakeBubbleData(layer) {
   var _a;
+
   if (!layer || !((_a = layer.bubbleSize) === null || _a === void 0 ? void 0 : _a.length) || !layer.geobin || !layer.geobin.length || !layer.latitude || !layer.latitude.length || !layer.longitude || !layer.longitude.length) {
     return null;
-  }
-  // if bubbleSize is passed as an array of single number array (data series)
+  } // if bubbleSize is passed as an array of single number array (data series)
   // e.g. [value0, value1, ...]
   // format each value as an array to unify data operations for data series and frames
+
+
   var sanitizedBubbleSize = (0, exports.sanitizeValues)(layer.bubbleSize);
   var transposedBubbleSize;
   var transposedSanitizedBubbleSize;
-  var isPie = false;
-  // format array if bubbleSize is passed as an array of array (data frame)
+  var isPie = false; // format array if bubbleSize is passed as an array of array (data frame)
+
   if (Array.isArray(layer.bubbleSize[0])) {
     // one-time array transpose,
     // e.g. from [column0data, column0data] (multi series)
@@ -777,8 +876,8 @@ var bakeBubbleData = function bakeBubbleData(layer) {
     // for easy access of values at each geo location,
     // and min max pie size computation
     transposedBubbleSize = (0, exports.transposeArray)(layer.bubbleSize);
-    transposedSanitizedBubbleSize = (0, exports.transposeArray)(sanitizedBubbleSize);
-    // if multiple series in the dataframe, set isPie to true
+    transposedSanitizedBubbleSize = (0, exports.transposeArray)(sanitizedBubbleSize); // if multiple series in the dataframe, set isPie to true
+
     if (layer.bubbleSize.length > 1) {
       isPie = true;
     }
@@ -790,9 +889,11 @@ var bakeBubbleData = function bakeBubbleData(layer) {
       return [n];
     });
   }
+
   if (!transposedBubbleSize || !transposedBubbleSize.length) {
     return null;
   }
+
   var data = layer.latitude.map(function (lat, i) {
     return {
       zoom: (0, exports.getZoomLevelFromGeobin)(layer.geobin[i]),
@@ -803,8 +904,8 @@ var bakeBubbleData = function bakeBubbleData(layer) {
     };
   }).filter(function (d) {
     return Boolean(d.values);
-  });
-  // compute the min/max value to encode min/max pie or bubble size
+  }); // compute the min/max value to encode min/max pie or bubble size
+
   var min = (0, lodash_1.sum)(transposedSanitizedBubbleSize[0]);
   var max = (0, lodash_1.sum)(transposedSanitizedBubbleSize[1]);
   transposedSanitizedBubbleSize.forEach(function (row) {
@@ -820,22 +921,29 @@ var bakeBubbleData = function bakeBubbleData(layer) {
     bubbleSizeFields: layer.bubbleSizeFields
   };
 };
+
 exports.bakeBubbleData = bakeBubbleData;
+
 var isValidLatLon = function isValidLatLon(latlon) {
   if (!latlon || !Array.isArray(latlon) || latlon.length !== 2) {
     return false;
   }
+
   var _latlon = _slicedToArray(latlon, 2),
-    lat = _latlon[0],
-    lon = _latlon[1];
+      lat = _latlon[0],
+      lon = _latlon[1];
+
   if (!(0, types_1.isNumber)(lat) || !(lat >= exports.MIN_LATITUDE && lat <= exports.MAX_LATITUDE)) {
     return false;
   }
+
   if (!(0, types_1.isNumber)(lon) || !(lon >= exports.MIN_LONGITUDE && lon <= exports.MAX_LONGITUDE)) {
     return false;
   }
+
   return true;
 };
+
 exports.isValidLatLon = isValidLatLon;
 /**
  * Returns a list of all lat or lon coordinates used in a specified layer
@@ -843,10 +951,12 @@ exports.isValidLatLon = isValidLatLon;
  * @param {string} field
  * @returns {number[]} list of lat coordinates or lon coordinates
  */
+
 var getLatOrLonCoordinates = function getLatOrLonCoordinates(layer, field) {
   var getClusterValues = function getClusterValues(clusterLayer) {
     return (0, lodash_1.get)(clusterLayer, field, []).slice(0, clusterLayer.type === LAYER_TYPE.Marker && clusterLayer.resultLimit ? clusterLayer.resultLimit : exports.DEFAULT_RESULT_LIMIT);
   };
+
   var getChoroplethValues = function getChoroplethValues(choroplethLayer) {
     var slicedGeomList = choroplethLayer.geom.slice(0, choroplethLayer.resultLimit);
     var flatCoordinates = slicedGeomList.flatMap(function (geomObject) {
@@ -856,6 +966,7 @@ var getLatOrLonCoordinates = function getLatOrLonCoordinates(layer, field) {
       return coord[field === LONGITUDE ? 0 : 1];
     });
   };
+
   return layer.type === LAYER_TYPE.Choropleth ? getChoroplethValues(layer) : getClusterValues(layer);
 };
 /**
@@ -863,25 +974,32 @@ var getLatOrLonCoordinates = function getLatOrLonCoordinates(layer, field) {
  * @param {LayerType[]} layers
  * @returns {LngLatBoundsLike}
  */
+
+
 var getGlobalLayerBoundaries = function getGlobalLayerBoundaries(layers) {
   var isLayerValid = function isLayerValid(field) {
     return layers.every(function (layer) {
       return layer[field] || layer.geom;
     });
   };
+
   var getDefaultMax = function getDefaultMax(field) {
     return field === LONGITUDE ? exports.MAX_LONGITUDE : exports.MAX_LATITUDE;
   };
+
   var getDefaultMin = function getDefaultMin(field) {
     return field === LONGITUDE ? exports.MIN_LONGITUDE : exports.MIN_LATITUDE;
   };
+
   if (!layers || !Array.isArray(layers) || !layers.length) {
     return null;
   }
+
   var getMin = function getMin(field) {
     if (!isLayerValid(field)) {
       return getDefaultMin(field);
     }
+
     return layers.reduce(function (prevVal, layer) {
       var coordinatesNumArr = getLatOrLonCoordinates(layer, field).map(function (x) {
         return +x;
@@ -889,32 +1007,41 @@ var getGlobalLayerBoundaries = function getGlobalLayerBoundaries(layers) {
       return (0, lodash_1.min)([prevVal].concat(_toConsumableArray(coordinatesNumArr)));
     }, getDefaultMax(field));
   };
+
   var getMax = function getMax(field) {
     if (!isLayerValid(field)) {
       return getDefaultMax(field);
     }
+
     return layers.reduce(function (prevVal, layer) {
       var coordinatesNumArr = getLatOrLonCoordinates(layer, field).map(Number);
       return (0, lodash_1.max)([prevVal].concat(_toConsumableArray(coordinatesNumArr)));
     }, getDefaultMin(field));
   };
+
   return [[getMin(LONGITUDE), getMin(LATITUDE)], [getMax(LONGITUDE), getMax(LATITUDE)]];
 };
+
 exports.getGlobalLayerBoundaries = getGlobalLayerBoundaries;
+
 var getScaledOpacities = function getScaledOpacities(colors, cfgOpacity) {
   // extract opacity information from 8 digit hex codes
   var opacities = colors === null || colors === void 0 ? void 0 : colors.map(function (color) {
     var _a;
+
     return (color === null || color === void 0 ? void 0 : color.length) === 9 ? (_a = chroma(color).alpha()) !== null && _a !== void 0 ? _a : 1 : 1;
-  });
-  // opacity cannot be greater than configured opacity
+  }); // opacity cannot be greater than configured opacity
+
   return opacities === null || opacities === void 0 ? void 0 : opacities.map(function (opacity) {
     return opacity * cfgOpacity;
   });
 };
+
 exports.getScaledOpacities = getScaledOpacities;
+
 var compareBaseStyles = function compareBaseStyles(curr, next) {
   var _a, _b, _c, _d;
+
   var currBaseLayer = (_a = curr === null || curr === void 0 ? void 0 : curr.layers) === null || _a === void 0 ? void 0 : _a.find(function (layer) {
     return (layer === null || layer === void 0 ? void 0 : layer.id) === 'base-layer';
   });
@@ -923,12 +1050,16 @@ var compareBaseStyles = function compareBaseStyles(curr, next) {
   });
   var currBaseSource = (0, lodash_1.get)(curr === null || curr === void 0 ? void 0 : curr.sources, (_c = currBaseLayer === null || currBaseLayer === void 0 ? void 0 : currBaseLayer.source) !== null && _c !== void 0 ? _c : '');
   var nextBaseSource = (0, lodash_1.get)(next === null || next === void 0 ? void 0 : next.sources, (_d = nextBaseLayer === null || nextBaseLayer === void 0 ? void 0 : nextBaseLayer.source) !== null && _d !== void 0 ? _d : '');
+
   if (!currBaseLayer || !nextBaseLayer || !currBaseSource || !nextBaseSource) {
     return false;
   }
+
   return (0, lodash_1.isEqual)(currBaseLayer, nextBaseLayer) && (0, lodash_1.isEqual)(currBaseSource, nextBaseSource);
 };
+
 exports.compareBaseStyles = compareBaseStyles;
+
 var formatMetadata = function formatMetadata(choroplethLayer, i) {
   if (!choroplethLayer || !choroplethLayer.areaIds || !choroplethLayer.areaValues) return {};
   if (i >= choroplethLayer.areaIds.length) return {};
@@ -945,6 +1076,7 @@ var formatMetadata = function formatMetadata(choroplethLayer, i) {
     return Object.assign(Object.assign({}, result), _defineProperty({}, key, val));
   }, base);
 };
+
 exports.formatMetadata = formatMetadata;
 
 /***/ }),
@@ -973,39 +1105,50 @@ module.exports = require("@splunk/visualization-color-palettes");
 
 
 var _slicedToArray = __webpack_require__(7);
+
 var __rest = this && this.__rest || function (s, e) {
   var t = {};
+
   for (var p in s) {
     if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
   }
+
   if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
     if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
   }
   return t;
 };
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+
 var maplibre_gl_1 = __webpack_require__(29);
+
 var React = __webpack_require__(3);
+
 var Tooltip_1 = __webpack_require__(30);
+
 var MarkerWrapper = function MarkerWrapper(_a) {
   var longitude = _a.longitude,
-    latitude = _a.latitude,
-    areaId = _a.areaId,
-    areaValue = _a.areaValue,
-    _a$additionalFields = _a.additionalFields,
-    additionalFields = _a$additionalFields === void 0 ? [] : _a$additionalFields,
-    map = _a.map,
-    isChoroplethTooltipOpen = _a.isChoroplethTooltipOpen,
-    children = _a.children,
-    otherProps = __rest(_a, ["longitude", "latitude", "areaId", "areaValue", "additionalFields", "map", "isChoroplethTooltipOpen", "children"]);
+      latitude = _a.latitude,
+      areaId = _a.areaId,
+      areaValue = _a.areaValue,
+      _a$additionalFields = _a.additionalFields,
+      additionalFields = _a$additionalFields === void 0 ? [] : _a$additionalFields,
+      map = _a.map,
+      isChoroplethTooltipOpen = _a.isChoroplethTooltipOpen,
+      children = _a.children,
+      otherProps = __rest(_a, ["longitude", "latitude", "areaId", "areaValue", "additionalFields", "map", "isChoroplethTooltipOpen", "children"]);
+
   var container = React.useRef();
   var marker = React.useRef();
+
   var _React$useState = React.useState(false),
-    _React$useState2 = _slicedToArray(_React$useState, 2),
-    isTooltipOpen = _React$useState2[0],
-    setTooltipOpenStatus = _React$useState2[1];
+      _React$useState2 = _slicedToArray(_React$useState, 2),
+      isTooltipOpen = _React$useState2[0],
+      setTooltipOpenStatus = _React$useState2[1];
+
   var isChoroplethTooltip = React.useCallback(function () {
     return isChoroplethTooltipOpen !== undefined;
   }, [isChoroplethTooltipOpen]);
@@ -1064,6 +1207,7 @@ var MarkerWrapper = function MarkerWrapper(_a) {
     additionalFields: additionalFields
   })));
 };
+
 exports.default = MarkerWrapper;
 
 /***/ }),
@@ -1080,15 +1224,22 @@ module.exports = require("maplibre-gl");
 
 
 var _taggedTemplateLiteral = __webpack_require__(10);
+
 var _templateObject;
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.convertDegToDMS = void 0;
+
 var React = __webpack_require__(3);
+
 var styled_components_1 = __webpack_require__(11);
+
 var Popover_1 = __webpack_require__(31);
+
 var i18n_1 = __webpack_require__(32);
+
 var StyledPopover = (0, styled_components_1.default)(Popover_1.default)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    width: 250px;\n    font-size: 12px;\n"])));
 var StyledTable = styled_components_1.default.table.withConfig({
   displayName: "Tooltip__StyledTable",
@@ -1108,42 +1259,50 @@ var StyledColorBlock = styled_components_1.default.div.withConfig({
 })(["background-color:", ";display:inline-block;margin-right:4px;border-radius:2px;width:6px;height:11px;transform:translateY(1px);"], function (props) {
   return props.color;
 });
+
 var convertDegToDMS = function convertDegToDMS(decimalDegree, type) {
   var truncate = function truncate(n) {
     return n > 0 ? Math.floor(n) : Math.ceil(n);
   };
+
   var absoluteDegree = Math.abs(decimalDegree);
   var degrees = truncate(absoluteDegree);
   var minutes = truncate((absoluteDegree - degrees) * 60);
   var seconds = Math.round((absoluteDegree - degrees - minutes / 60) * 3600);
+
   if (seconds === 60) {
     minutes += 1;
     seconds = 0;
   }
+
   if (minutes === 60) {
     degrees += 1;
     minutes = 0;
   }
+
   var direction;
+
   if (type === 'longitude') {
     direction = decimalDegree < 0 ? 'W' : 'E';
   } else if (type === 'latitude') {
     direction = decimalDegree < 0 ? 'S' : 'N';
   }
+
   return "".concat(degrees, "\xB0 ").concat(minutes, "' ").concat(seconds, "\" ").concat(direction);
 };
-exports.convertDegToDMS = convertDegToDMS;
-// only want latitude/longitude for marker and bubble
+
+exports.convertDegToDMS = convertDegToDMS; // only want latitude/longitude for marker and bubble
 // omit for choropleth, and put areaid, areavalue instead
+
 var Tooltip = function Tooltip(_ref) {
   var open = _ref.open,
-    anchor = _ref.anchor,
-    latitude = _ref.latitude,
-    longitude = _ref.longitude,
-    areaId = _ref.areaId,
-    areaValue = _ref.areaValue,
-    _ref$additionalFields = _ref.additionalFields,
-    additionalFields = _ref$additionalFields === void 0 ? [] : _ref$additionalFields;
+      anchor = _ref.anchor,
+      latitude = _ref.latitude,
+      longitude = _ref.longitude,
+      areaId = _ref.areaId,
+      areaValue = _ref.areaValue,
+      _ref$additionalFields = _ref.additionalFields,
+      additionalFields = _ref$additionalFields === void 0 ? [] : _ref$additionalFields;
   return React.createElement(StyledPopover, {
     open: open,
     animation: false,
@@ -1163,8 +1322,8 @@ var Tooltip = function Tooltip(_ref) {
     return value && String(value) !== '0';
   }).map(function (_ref3, index) {
     var name = _ref3.name,
-      value = _ref3.value,
-      color = _ref3.color;
+        value = _ref3.value,
+        color = _ref3.color;
     return React.createElement("tr", {
       key: String(index)
     }, React.createElement(StyledTitleColumn, {
@@ -1177,6 +1336,7 @@ var Tooltip = function Tooltip(_ref) {
     }, value));
   }))));
 };
+
 exports.default = Tooltip;
 
 /***/ }),