@dynatrace/strato-geo 2.10.2 → 2.12.2

package/map/types/toolbar.d.ts

@@ -1,4 +1,4 @@
-import type { ToolbarPlacement, ZoomChangeHandler } from '@dynatrace/strato-components-preview/charts';
+import type { ChartToolbarConfig, DraggableToolbarProps, ZoomChangeHandler } from '@dynatrace/strato-components-preview/charts';
 export type ToolbarInteractionModes = 'zoom' | 'zoom-to-fit' | 'zoom-in' | 'zoom-out' | 'reset' | 'download-data';
 /**
  * Props for the ChartInteractions component
@@ -9,16 +9,15 @@ export interface ChartInteractionsProps {
     onZoomChange?: ZoomChangeHandler;
 }
 /** Internal toolbar configuration interface **/
-export interface MapToolbarConfig {
-    /** When enabled show the toolbar in collapsed state */
-    collapsed?: boolean;
-    /** When enabled the toolbar can be dragged inside the container */
-    draggable?: boolean;
-    /** When enabled it defines the initial placement of the Toolbar */
-    placement?: ToolbarPlacement;
-    /** When enabled the toolbar download button will be shown */
-    downloadData?: boolean;
-}
+export type MapToolbarConfig = Omit<ChartToolbarConfig, 'downloadData'> & DraggableToolbarProps & {
+    /** When enabled show the download CSV button in the toolbar */
+    downloadCSV?: {
+        enabled: boolean;
+    };
+    zoom?: {
+        enabled: boolean;
+    };
+};
 /** API config for the chart interactions */
 export interface ChartInteractionsConfig {
     /** Handler triggered when there is a change on the time domain caused by a zoom action */
@@ -33,3 +32,7 @@ export interface ChartInteractionsConfig {
     };
 }
 export type A11yToolbarTabIndex = Record<string, number>;
+/** Props for the ChartToolbar implementation in MapView
+ * @public
+ */
+export type MapToolbarSlotProps = DraggableToolbarProps;

package/map/utils/iterate-config-slots.js

@@ -21,6 +21,7 @@ __export(iterate_config_slots_exports, {
   iterateConfigSlots: () => iterateConfigSlots
 });
 module.exports = __toCommonJS(iterate_config_slots_exports);
+var import_lodash_es = require("lodash");
 var import_react = require("react");
 var import_charts = require("@dynatrace/strato-components-preview/charts");
 var import_constants = require("../constants.js");
@@ -29,8 +30,11 @@ var import_replace_infinite_values_in_ranges = require("./replace-infinite-value
 var import_BaseLayer = require("../slots/BaseLayer.js");
 var import_CategoricalLegend = require("../slots/CategoricalLegend.js");
 var import_ChartInteractions = require("../slots/ChartInteractions.js");
+var import_DownloadCSV = require("../slots/DownloadCSV.js");
 var import_SequentialLegend = require("../slots/SequentialLegend.js");
 var import_ThresholdLegend = require("../slots/ThresholdLegend.js");
+var import_Toolbar = require("../slots/Toolbar.js");
+var import_Zoom = require("../slots/Zoom.js");
 const iterateConfigSlots = (children, legendDomain) => {
   let slots = {
     toolbar: void 0,
@@ -38,6 +42,7 @@ const iterateConfigSlots = (children, legendDomain) => {
     legend: void 0,
     baseLayer: import_constants.DEFAULT_BASE_LAYER_RULES
   };
+  let slotMapToolbarConfig = {};
   import_react.Children.forEach(children, (child) => {
     if ((0, import_is_slot.isSlot)(child, import_ChartInteractions.ChartInteractions)) {
       const { children: children2, ...previousInteractions } = child.props;
@@ -97,6 +102,18 @@ const iterateConfigSlots = (children, legendDomain) => {
           ranges
         }
       };
+    } else if ((0, import_is_slot.isSlot)(child, import_Toolbar.Toolbar)) {
+      slotMapToolbarConfig = { ...slotMapToolbarConfig, ...child.props };
+    } else if ((0, import_is_slot.isSlot)(child, import_DownloadCSV.DownloadCSV)) {
+      slotMapToolbarConfig = {
+        ...slotMapToolbarConfig,
+        downloadCSV: { enabled: true }
+      };
+    } else if ((0, import_is_slot.isSlot)(child, import_Zoom.Zoom)) {
+      slotMapToolbarConfig = {
+        ...slotMapToolbarConfig,
+        zoom: { enabled: true }
+      };
     } else if ((0, import_is_slot.isSlot)(child, import_BaseLayer.BaseLayer)) {
       slots = {
         ...slots,
@@ -107,6 +124,9 @@ const iterateConfigSlots = (children, legendDomain) => {
       };
     }
   });
+  if (!(0, import_lodash_es.isEmpty)(slotMapToolbarConfig)) {
+    slots.toolbar = { ...slots.toolbar, ...slotMapToolbarConfig };
+  }
   return slots;
 };
 const iterateChartInteractionsSlots = (children) => {
@@ -126,7 +146,7 @@ const iterateChartToolbarSlots = (children) => {
     if ((0, import_is_slot.isSlot)(childToolbar, import_charts.ChartToolbar.DownloadData)) {
       toolbar = {
         ...toolbar,
-        downloadData: { enabled: true }
+        downloadCSV: { enabled: true }
       };
     }
   });

package/map/utils/parse-tooltip-data.d.ts

@@ -1,6 +1,15 @@
-import type { MapGeoJSONFeature } from 'maplibre-gl';
+import type { MapGeoJSONFeature, MapLayerMouseEvent } from 'maplibre-gl';
 /**
  * Extracts useful map features data for the tooltip
  * @param features - map features
  */
 export declare const parseTooltipData: (features: MapGeoJSONFeature[]) => unknown[];
+export declare const extractDataFromEvent: (event: MapLayerMouseEvent) => {
+    featureId?: undefined;
+    hoveredLayerId?: undefined;
+    data?: undefined;
+} | {
+    featureId: string;
+    hoveredLayerId: string;
+    data: unknown[];
+};

package/map/utils/parse-tooltip-data.js

@@ -18,6 +18,7 @@ var __copyProps = (to, from, except, desc) => {
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var parse_tooltip_data_exports = {};
 __export(parse_tooltip_data_exports, {
+  extractDataFromEvent: () => extractDataFromEvent,
   parseTooltipData: () => parseTooltipData
 });
 module.exports = __toCommonJS(parse_tooltip_data_exports);
@@ -52,3 +53,19 @@ const parseTooltipData = (features) => {
   }
   return data;
 };
+const extractDataFromEvent = (event) => {
+  if (!event.features?.length) {
+    return {};
+  }
+  const feature = event.features[0];
+  const hoveredLayerId = feature.layer.id;
+  const hoveredFeatures = event.features.filter(
+    (feature2) => feature2.layer.id === hoveredLayerId
+  );
+  const data = parseTooltipData(hoveredFeatures);
+  return {
+    featureId: `${hoveredLayerId}-${feature.id}`,
+    hoveredLayerId,
+    data
+  };
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dynatrace/strato-geo",
-  "version": "2.10.2",
+  "version": "2.12.2",
   "private": false,
   "license": "Apache-2.0",
   "keywords": [
@@ -48,7 +48,7 @@
     "d3-array": "^3.2.4",
     "d3-interpolate": "^3.0.1",
     "d3-scale": "^4.0.2",
-    "maplibre-gl": "^5.0.0"
+    "maplibre-gl": ">=5.0.0 <5.12.0"
   },
   "peerDependencies": {
     "@dynatrace-sdk/client-classic-environment-v2": "^3.7.3",
@@ -58,10 +58,10 @@
     "react-dom": "^18.0.0",
     "react-intl": "^6.0.8 || ^7.0.0",
     "react-is": "^18.0.0",
-    "@dynatrace/strato-components": "^1.13.0",
-    "@dynatrace/strato-components-preview": "^2.10.2",
+    "@dynatrace/strato-components": "^1.14.0",
+    "@dynatrace/strato-components-preview": "^2.12.2",
     "@dynatrace/strato-design-tokens": "^1.2.0",
-    "@dynatrace/strato-icons": "^1.10.0"
+    "@dynatrace/strato-icons": "^1.11.0"
   },
   "sideEffects": [
     "./map/styles/react-mapgl-styles.css",