@dynatrace/strato-geo 1.2.1 → 1.4.2

package/esm/map/MapView.js

@@ -85,34 +85,41 @@ const _MapView = forwardRef(
           {
             value: truncationMode ?? DEFAULT_TRUNCATION_MODE
           },
-          /* @__PURE__ */ React.createElement(FormatterContext.Provider, { value: formatter }, /* @__PURE__ */ React.createElement(MapRawDataContext.Provider, { value: layersData }, /* @__PURE__ */ React.createElement(MapStoreProvider, null, /* @__PURE__ */ React.createElement(ColorScaleProvider, { categories }, /* @__PURE__ */ React.createElement(LayerColorStrategyProvider, null, /* @__PURE__ */ React.createElement(
-            ChartLayout,
+          /* @__PURE__ */ React.createElement(FormatterContext.Provider, { value: formatter }, /* @__PURE__ */ React.createElement(MapRawDataContext.Provider, { value: layersData }, /* @__PURE__ */ React.createElement(MapStoreProvider, null, /* @__PURE__ */ React.createElement(
+            ColorScaleProvider,
             {
-              ref: chartLayoutRef,
-              chartHeight,
-              errorState,
-              showLoader: loading || isLoading
+              categories,
+              dataMax: legendDomain[1]
             },
-            /* @__PURE__ */ React.createElement(ChartLayout.Graph, null, baseFeatureCollection && /* @__PURE__ */ React.createElement(
-              MapContent,
+            /* @__PURE__ */ React.createElement(LayerColorStrategyProvider, null, /* @__PURE__ */ React.createElement(
+              ChartLayout,
               {
-                ref: forwardedRef,
-                onMapLoad: () => setIsMapLoaded(true),
-                ...remaining
+                ref: chartLayoutRef,
+                chartHeight,
+                errorState,
+                showLoader: loading || isLoading
               },
-              parsedChildren
-            )),
-            !isLegendHidden && /* @__PURE__ */ React.createElement(
-              ChartLayout.Legend,
-              {
-                position: legendPosition,
-                ratio: legendRatio,
-                ratioBoundaries: DEFAULT_LEGEND_SIZES,
-                onResize: legendOnRatioChange
-              },
-              /* @__PURE__ */ React.createElement(MapLegendRenderer, null)
-            )
-          ))))))
+              /* @__PURE__ */ React.createElement(ChartLayout.Graph, null, baseFeatureCollection && /* @__PURE__ */ React.createElement(
+                MapContent,
+                {
+                  ref: forwardedRef,
+                  onMapLoad: () => setIsMapLoaded(true),
+                  ...remaining
+                },
+                parsedChildren
+              )),
+              !isLegendHidden && /* @__PURE__ */ React.createElement(
+                ChartLayout.Legend,
+                {
+                  position: legendPosition,
+                  ratio: legendRatio,
+                  ratioBoundaries: DEFAULT_LEGEND_SIZES,
+                  onResize: legendOnRatioChange
+                },
+                /* @__PURE__ */ React.createElement(MapLegendRenderer, null)
+              )
+            ))
+          ))))
         )))
       ))
     );

package/esm/map/MapView.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/map/MapView.tsx"],
-  "sourcesContent": ["import React, { forwardRef, type PropsWithChildren, useState } from 'react';\n\nimport {\n  _ChartLayout as ChartLayout,\n  _coerceSizeValue as coerceSizeValue,\n  _useAutoLegendRefresh as useAutoLegendRefresh,\n} from '@dynatrace/strato-components-preview/charts';\n\nimport { MapLegendRenderer } from './components/legend/MapLegendRenderer.js';\nimport { MapContent } from './components/MapContent.js';\nimport { MapUnavailable } from './components/MapUnavailable.js';\nimport {\n  DEFAULT_LEGEND_SIZES,\n  DEFAULT_MAP_HEIGHT,\n  DEFAULT_TRUNCATION_MODE,\n} from './constants.js';\nimport { FormatterContext } from './contexts/formatter.context.js';\nimport { LayerIdsContext } from './contexts/layer-ids.context.js';\nimport { MapBaseLayerFeaturesContext } from './contexts/map-base-layer.context.js';\nimport { MapConfigurationContext } from './contexts/map-configuration.context.js';\nimport { MapLoadingContext } from './contexts/map-loading.context.js';\nimport { MapRawDataContext } from './contexts/map-raw-data.context.js';\nimport { MapTruncationModeContext } from './contexts/map-truncation-mode.context.js';\nimport { useLoadMapBaseLayer } from './hooks/use-load-map-base-layer.js';\nimport { ColorScaleProvider } from './providers/color-scale.provider.js';\nimport { LayerColorStrategyProvider } from './providers/layer-color-strategy.provider.js';\nimport { ErrorStateSlot } from './slots/states/ErrorStateSlot.js';\nimport { MapStoreProvider } from './store/map-store.provider.js';\nimport type { MapViewProps, MapViewRef } from './types/map-view.js';\nimport { extractLayersData } from './utils/extract-layers-data.js';\nimport { getMapStatesTemplates } from './utils/get-map-states-template.js';\nimport { iterateConfigSlots } from './utils/iterate-config-slots.js';\nimport { setLayersId } from './utils/set-layers-id.js';\n\n// eslint-disable-next-line no-restricted-imports\nimport './styles/react-mapgl-styles.css';\n\n/**\n * MapView Component\n */\nconst _MapView = forwardRef<MapViewRef, PropsWithChildren<MapViewProps>>(\n  (props, forwardedRef) => {\n    const {\n      children,\n      loading = false,\n      style: costumerStyle,\n      className: customerClassNames,\n      formatter,\n      truncationMode,\n      ...remaining\n    } = props;\n    const { layerIds, parsedChildren, valueAccessors } = setLayersId(children);\n\n    const {\n      flattenData: layersData,\n      categories,\n      legendDomain,\n    } = extractLayersData(parsedChildren, valueAccessors);\n\n    const config = iterateConfigSlots(children, legendDomain);\n\n    const isLegendHidden = !config.legend || !!config.legend.hidden;\n    const legendPosition = config.legend?.position;\n    const legendRatio = config.legend?.ratio;\n    const legendOnRatioChange = config.legend?.onRatioChange;\n\n    const { isMapEnabled, isFetchingFeatures, baseFeatureCollection, error } =\n      useLoadMapBaseLayer(config.baseLayer);\n\n    const [isMapLoaded, setIsMapLoaded] = useState<boolean>(false);\n    const { errorState } = getMapStatesTemplates(children);\n\n    const chartHeight = coerceSizeValue(props.height) || DEFAULT_MAP_HEIGHT;\n\n    const containerStyles = { width: '100%', ...costumerStyle };\n\n    const chartLayoutRef = useAutoLegendRefresh(layersData);\n    const mapUnavailable = (!isFetchingFeatures && !isMapEnabled) || error;\n\n    const isLoading = isFetchingFeatures || !isMapLoaded;\n\n    return (\n      <div\n        style={containerStyles}\n        className={customerClassNames}\n        data-testid=\"mapview-container\"\n      >\n        {\n          // TODO: Error boundaries global fix needed - this error state only purpose is to make map not rendering when there error in response\n          mapUnavailable ? (\n            <MapUnavailable\n              isFetchingFeatures={isFetchingFeatures}\n              isDisabled={!isMapEnabled}\n              chartHeight={chartHeight}\n              error={error}\n            />\n          ) : (\n            <MapLoadingContext.Provider value={loading}>\n              <MapBaseLayerFeaturesContext.Provider\n                value={baseFeatureCollection}\n              >\n                <MapConfigurationContext.Provider value={config}>\n                  <LayerIdsContext.Provider value={layerIds}>\n                    <MapTruncationModeContext.Provider\n                      value={truncationMode ?? DEFAULT_TRUNCATION_MODE}\n                    >\n                      <FormatterContext.Provider value={formatter}>\n                        <MapRawDataContext.Provider value={layersData}>\n                          <MapStoreProvider>\n                            <ColorScaleProvider categories={categories}>\n                              <LayerColorStrategyProvider>\n                                <ChartLayout\n                                  ref={chartLayoutRef}\n                                  chartHeight={chartHeight}\n                                  errorState={errorState}\n                                  showLoader={loading || isLoading}\n                                >\n                                  <ChartLayout.Graph>\n                                    {baseFeatureCollection && (\n                                      <MapContent\n                                        ref={forwardedRef}\n                                        onMapLoad={() => setIsMapLoaded(true)}\n                                        {...remaining}\n                                      >\n                                        {parsedChildren}\n                                      </MapContent>\n                                    )}\n                                  </ChartLayout.Graph>\n                                  {!isLegendHidden && (\n                                    <ChartLayout.Legend\n                                      position={legendPosition}\n                                      ratio={legendRatio}\n                                      ratioBoundaries={DEFAULT_LEGEND_SIZES}\n                                      onResize={legendOnRatioChange}\n                                    >\n                                      <MapLegendRenderer />\n                                    </ChartLayout.Legend>\n                                  )}\n                                </ChartLayout>\n                              </LayerColorStrategyProvider>\n                            </ColorScaleProvider>\n                          </MapStoreProvider>\n                        </MapRawDataContext.Provider>\n                      </FormatterContext.Provider>\n                    </MapTruncationModeContext.Provider>\n                  </LayerIdsContext.Provider>\n                </MapConfigurationContext.Provider>\n              </MapBaseLayerFeaturesContext.Provider>\n            </MapLoadingContext.Provider>\n          )\n        }\n      </div>\n    );\n  },\n);\n\n(_MapView as typeof _MapView & { displayName: string })['displayName'] =\n  'MapView';\n\n/**\n * The `MapView` is a component that renders a map with various geospatial data layers.\n * @public\n */\nexport const MapView = Object.assign(_MapView, {\n  ErrorState: ErrorStateSlot,\n});\n"],
-  "mappings": "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",
+  "sourcesContent": ["import React, { forwardRef, type PropsWithChildren, useState } from 'react';\n\nimport {\n  _ChartLayout as ChartLayout,\n  _coerceSizeValue as coerceSizeValue,\n  _useAutoLegendRefresh as useAutoLegendRefresh,\n} from '@dynatrace/strato-components-preview/charts';\n\nimport { MapLegendRenderer } from './components/legend/MapLegendRenderer.js';\nimport { MapContent } from './components/MapContent.js';\nimport { MapUnavailable } from './components/MapUnavailable.js';\nimport {\n  DEFAULT_LEGEND_SIZES,\n  DEFAULT_MAP_HEIGHT,\n  DEFAULT_TRUNCATION_MODE,\n} from './constants.js';\nimport { FormatterContext } from './contexts/formatter.context.js';\nimport { LayerIdsContext } from './contexts/layer-ids.context.js';\nimport { MapBaseLayerFeaturesContext } from './contexts/map-base-layer.context.js';\nimport { MapConfigurationContext } from './contexts/map-configuration.context.js';\nimport { MapLoadingContext } from './contexts/map-loading.context.js';\nimport { MapRawDataContext } from './contexts/map-raw-data.context.js';\nimport { MapTruncationModeContext } from './contexts/map-truncation-mode.context.js';\nimport { useLoadMapBaseLayer } from './hooks/use-load-map-base-layer.js';\nimport { ColorScaleProvider } from './providers/color-scale.provider.js';\nimport { LayerColorStrategyProvider } from './providers/layer-color-strategy.provider.js';\nimport { ErrorStateSlot } from './slots/states/ErrorStateSlot.js';\nimport { MapStoreProvider } from './store/map-store.provider.js';\nimport type { MapViewProps, MapViewRef } from './types/map-view.js';\nimport { extractLayersData } from './utils/extract-layers-data.js';\nimport { getMapStatesTemplates } from './utils/get-map-states-template.js';\nimport { iterateConfigSlots } from './utils/iterate-config-slots.js';\nimport { setLayersId } from './utils/set-layers-id.js';\n\n// eslint-disable-next-line no-restricted-imports\nimport './styles/react-mapgl-styles.css';\n\n/**\n * MapView Component\n */\nconst _MapView = forwardRef<MapViewRef, PropsWithChildren<MapViewProps>>(\n  (props, forwardedRef) => {\n    const {\n      children,\n      loading = false,\n      style: costumerStyle,\n      className: customerClassNames,\n      formatter,\n      truncationMode,\n      ...remaining\n    } = props;\n    const { layerIds, parsedChildren, valueAccessors } = setLayersId(children);\n\n    const {\n      flattenData: layersData,\n      categories,\n      legendDomain,\n    } = extractLayersData(parsedChildren, valueAccessors);\n\n    const config = iterateConfigSlots(children, legendDomain);\n\n    const isLegendHidden = !config.legend || !!config.legend.hidden;\n    const legendPosition = config.legend?.position;\n    const legendRatio = config.legend?.ratio;\n    const legendOnRatioChange = config.legend?.onRatioChange;\n\n    const { isMapEnabled, isFetchingFeatures, baseFeatureCollection, error } =\n      useLoadMapBaseLayer(config.baseLayer);\n\n    const [isMapLoaded, setIsMapLoaded] = useState<boolean>(false);\n    const { errorState } = getMapStatesTemplates(children);\n\n    const chartHeight = coerceSizeValue(props.height) || DEFAULT_MAP_HEIGHT;\n\n    const containerStyles = { width: '100%', ...costumerStyle };\n\n    const chartLayoutRef = useAutoLegendRefresh(layersData);\n    const mapUnavailable = (!isFetchingFeatures && !isMapEnabled) || error;\n\n    const isLoading = isFetchingFeatures || !isMapLoaded;\n\n    return (\n      <div\n        style={containerStyles}\n        className={customerClassNames}\n        data-testid=\"mapview-container\"\n      >\n        {\n          // TODO: Error boundaries global fix needed - this error state only purpose is to make map not rendering when there error in response\n          mapUnavailable ? (\n            <MapUnavailable\n              isFetchingFeatures={isFetchingFeatures}\n              isDisabled={!isMapEnabled}\n              chartHeight={chartHeight}\n              error={error}\n            />\n          ) : (\n            <MapLoadingContext.Provider value={loading}>\n              <MapBaseLayerFeaturesContext.Provider\n                value={baseFeatureCollection}\n              >\n                <MapConfigurationContext.Provider value={config}>\n                  <LayerIdsContext.Provider value={layerIds}>\n                    <MapTruncationModeContext.Provider\n                      value={truncationMode ?? DEFAULT_TRUNCATION_MODE}\n                    >\n                      <FormatterContext.Provider value={formatter}>\n                        <MapRawDataContext.Provider value={layersData}>\n                          <MapStoreProvider>\n                            <ColorScaleProvider\n                              categories={categories}\n                              dataMax={legendDomain[1]}\n                            >\n                              <LayerColorStrategyProvider>\n                                <ChartLayout\n                                  ref={chartLayoutRef}\n                                  chartHeight={chartHeight}\n                                  errorState={errorState}\n                                  showLoader={loading || isLoading}\n                                >\n                                  <ChartLayout.Graph>\n                                    {baseFeatureCollection && (\n                                      <MapContent\n                                        ref={forwardedRef}\n                                        onMapLoad={() => setIsMapLoaded(true)}\n                                        {...remaining}\n                                      >\n                                        {parsedChildren}\n                                      </MapContent>\n                                    )}\n                                  </ChartLayout.Graph>\n                                  {!isLegendHidden && (\n                                    <ChartLayout.Legend\n                                      position={legendPosition}\n                                      ratio={legendRatio}\n                                      ratioBoundaries={DEFAULT_LEGEND_SIZES}\n                                      onResize={legendOnRatioChange}\n                                    >\n                                      <MapLegendRenderer />\n                                    </ChartLayout.Legend>\n                                  )}\n                                </ChartLayout>\n                              </LayerColorStrategyProvider>\n                            </ColorScaleProvider>\n                          </MapStoreProvider>\n                        </MapRawDataContext.Provider>\n                      </FormatterContext.Provider>\n                    </MapTruncationModeContext.Provider>\n                  </LayerIdsContext.Provider>\n                </MapConfigurationContext.Provider>\n              </MapBaseLayerFeaturesContext.Provider>\n            </MapLoadingContext.Provider>\n          )\n        }\n      </div>\n    );\n  },\n);\n\n(_MapView as typeof _MapView & { displayName: string })['displayName'] =\n  'MapView';\n\n/**\n * The `MapView` is a component that renders a map with various geospatial data layers.\n * @public\n */\nexport const MapView = Object.assign(_MapView, {\n  ErrorState: ErrorStateSlot,\n});\n"],
+  "mappings": "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",
   "names": []
 }

package/esm/map/components/MapContent.js

@@ -1,9 +1,14 @@
-import { Layer, Map, Source } from "@vis.gl/react-maplibre";
+import {
+  Layer,
+  Map,
+  Source
+} from "@vis.gl/react-maplibre";
 import { isUndefined } from "lodash-es";
 import React, {
   forwardRef,
   useContext,
-  useRef
+  useRef,
+  useState
 } from "react";
 import { _useGraphSize as useGraphSize } from "@dynatrace/strato-components-preview/charts";
 import { useMergeRefs } from "@dynatrace/strato-components-preview/core";
@@ -19,6 +24,7 @@ import {
   MAX_LONGITUDE,
   MAX_LATITUDE
 } from "../constants.js";
+import { useMapZoomState, useSetStateZoom } from "../store/store.js";
 import { MapToolbar } from "./toolbar/MapToolbar.js";
 import { LayerIdsContext } from "../contexts/layer-ids.context.js";
 import { MapDataBoundingBoxContext } from "../contexts/map-data-bounding-box.context.js";
@@ -36,6 +42,7 @@ import { getColorFromToken } from "../utils/get-color-from-token.js";
 import { getDataLayersBoundingBox } from "../utils/get-data-layers-bounding-box.js";
 import { toMapBoxInitialViewState } from "../utils/to-mapbox-initial-view-state.js";
 import { useSetMapInitialConfiguration } from "../utils/use-set-map-initial-configuration.js";
+import { generateNewZoomState } from "./toolbar/utils/zoom-state-utils.js";
 const lineLayer = {
   id: BASE_LAYER_LINE_ID,
   type: "line"
@@ -92,6 +99,8 @@ const MapContent = forwardRef((props, forwardedRef) => {
     ...remaining
   } = props;
   const loading = useMapLoading();
+  const setZoomState = useSetStateZoom();
+  const [savedInitialViewState, setSavedInitialViewState] = useState();
   const mapContainerRef = useRef(null);
   const mergedRefs = useMergeRefs([
     mapContainerRef,
@@ -117,6 +126,28 @@ const MapContent = forwardRef((props, forwardedRef) => {
   } = useOverlayEvents();
   const initialViewState = initialViewStateProp ?? dataLayersBBox;
   const { onLoadHandler, onRenderHandler } = useMapPerformance(mapContainerRef);
+  const calculatedInitialViewState = toMapBoxInitialViewState(initialViewState);
+  const { zoomToFitInProgress } = useMapZoomState();
+  const handleZoomEnd = (event) => {
+    if (savedInitialViewState) {
+      const zoomState = generateNewZoomState(
+        event,
+        savedInitialViewState,
+        zoomToFitInProgress
+      );
+      setZoomState(zoomState);
+    }
+  };
+  const handleDragEnd = (event) => {
+    if (savedInitialViewState) {
+      const zoomState = generateNewZoomState(
+        event,
+        savedInitialViewState,
+        zoomToFitInProgress
+      );
+      setZoomState(zoomState);
+    }
+  };
   return /* @__PURE__ */ React.createElement(
     "div",
     {
@@ -131,7 +162,7 @@ const MapContent = forwardRef((props, forwardedRef) => {
         onMove: (evt) => {
           onViewStateChange?.(evt.viewState);
         },
-        initialViewState: toMapBoxInitialViewState(initialViewState),
+        initialViewState: calculatedInitialViewState,
         style: {
           width: graphWidth,
           height: `${graphHeight}px`,
@@ -149,12 +180,20 @@ const MapContent = forwardRef((props, forwardedRef) => {
         onMouseMove: (e) => handleMouseMove(e),
         onClick: (e) => handleMouseClick(e),
         onZoom: handleZoom,
+        onZoomEnd: handleZoomEnd,
         onDrag: handleDrag,
+        onDragEnd: handleDragEnd,
         attributionControl: false,
         onRender: () => onRenderHandler && onRenderHandler(),
-        onLoad: () => {
+        onLoad: (e) => {
           onMapLoad();
           onLoadHandler && onLoadHandler();
+          const initialCenter = e.target.getCenter();
+          setSavedInitialViewState({
+            latitude: initialCenter.lat,
+            longitude: initialCenter.lng,
+            zoom: e.target.getZoom()
+          });
         },
         ref: useSetMapInitialConfiguration(),
         interactive: true,

package/esm/map/components/MapContent.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/map/components/MapContent.tsx"],
-  "sourcesContent": ["import { Layer, type LayerProps, Map, Source } from '@vis.gl/react-maplibre';\nimport { isUndefined } from 'lodash-es';\nimport type { MapLayerMouseEvent } from 'maplibre-gl';\nimport React, {\n  forwardRef,\n  type PropsWithChildren,\n  useContext,\n  useRef,\n} from 'react';\n\nimport { _useGraphSize as useGraphSize } from '@dynatrace/strato-components-preview/charts';\nimport { useMergeRefs } from '@dynatrace/strato-components-preview/core';\n\nimport {\n  BASE_LAYER_FILL_ID,\n  BASE_LAYER_LINE_ID,\n  DEFAULT_BOUNDARIES_BORDER_COLOR,\n  DEFAULT_COUNTRIES_FILL_COLOR,\n  REGION_BORDER_WIDTH,\n  COUNTRY_BORDER_WIDTH,\n  MIN_LONGITUDE,\n  MIN_LATITUDE,\n  MAX_LONGITUDE,\n  MAX_LATITUDE,\n} from '../constants.js';\nimport { MapToolbar } from './toolbar/MapToolbar.js';\nimport { LayerIdsContext } from '../contexts/layer-ids.context.js';\nimport { MapDataBoundingBoxContext } from '../contexts/map-data-bounding-box.context.js';\nimport { useActiveInteraction } from '../hooks/use-active-interaction.js';\nimport { useHoverInteraction } from '../hooks/use-hover-interaction.js';\nimport { useMapBaseLayerFeatures } from '../hooks/use-map-base-layer-features.js';\nimport { useMapConfig } from '../hooks/use-map-config.js';\nimport { useMapLoading } from '../hooks/use-map-loading.js';\nimport { useMapPerformance } from '../hooks/use-map-performance.js';\nimport { useOverlayEvents } from '../hooks/use-overlay-events.js';\nimport { useTooltipEventListeners } from '../hooks/use-tooltip-event-listeners.js';\nimport { defaultStyle } from '../map-styles/default-style.js';\nimport { MapViewImperativeHandler } from '../providers/imperative-handler.provider.js';\nimport type { MapViewProps, MapViewRef } from '../types/map-view.js';\nimport { getColorFromToken } from '../utils/get-color-from-token.js';\nimport { getDataLayersBoundingBox } from '../utils/get-data-layers-bounding-box.js';\nimport { toMapBoxInitialViewState } from '../utils/to-mapbox-initial-view-state.js';\nimport { useSetMapInitialConfiguration } from '../utils/use-set-map-initial-configuration.js';\n\nconst lineLayer: LayerProps = {\n  id: BASE_LAYER_LINE_ID,\n  type: 'line',\n};\n\nconst fillLayer: LayerProps = {\n  id: BASE_LAYER_FILL_ID,\n  type: 'fill',\n};\n\nconst MapSource = () => {\n  const baseLayerFeatures = useMapBaseLayerFeatures();\n  return (\n    baseLayerFeatures && (\n      <Source id=\"data\" type=\"geojson\" data={baseLayerFeatures}>\n        <Layer\n          {...fillLayer}\n          paint={{\n            'fill-color': getColorFromToken(DEFAULT_COUNTRIES_FILL_COLOR),\n          }}\n        />\n        <Layer\n          {...lineLayer}\n          type={'line'}\n          filter={[\n            'any',\n            ['==', 'region_type', 'COUNTRY'],\n            ['==', 'region_type', 'REGION'],\n          ]}\n          paint={{\n            'line-color': getColorFromToken(DEFAULT_BOUNDARIES_BORDER_COLOR),\n            'line-width': [\n              'case',\n              ['==', ['get', 'region_type'], 'REGION'],\n              REGION_BORDER_WIDTH,\n              COUNTRY_BORDER_WIDTH,\n            ],\n          }}\n        />\n      </Source>\n    )\n  );\n};\n\nconst MapInteractions = ({ children }: PropsWithChildren) => {\n  useHoverInteraction();\n  useActiveInteraction();\n\n  return children;\n};\ntype MapContentProps = MapViewProps & {\n  onMapLoad: () => void;\n};\n\nexport const MapContent = forwardRef<\n  MapViewRef,\n  PropsWithChildren<MapContentProps>\n>((props, forwardedRef) => {\n  const {\n    initialViewState: initialViewStateProp,\n    children,\n    style,\n    mapStyle = defaultStyle,\n    onViewStateChange,\n    onMapLoad,\n    ...remaining\n  } = props;\n\n  const loading = useMapLoading();\n\n  const mapContainerRef = useRef<HTMLDivElement>(null);\n  const mergedRefs = useMergeRefs<MapViewRef | HTMLDivElement>([\n    mapContainerRef,\n    forwardedRef,\n  ]);\n\n  const baseFeatureCollection = useMapBaseLayerFeatures();\n\n  const dataLayersBBox = getDataLayersBoundingBox(\n    children,\n    baseFeatureCollection?.features,\n  );\n\n  useTooltipEventListeners();\n\n  const { toolbar: toolbarConfig, interactions: interactionsConfig } =\n    useMapConfig();\n  const layerIds = useContext(LayerIdsContext);\n  const shouldRenderToolbar =\n    !isUndefined(toolbarConfig) || !isUndefined(interactionsConfig);\n\n  const { height: graphHeight, width: graphWidth } = useGraphSize();\n\n  const {\n    handleMouseEnter,\n    handleMouseMove,\n    handleMouseLeave,\n    handleMouseClick,\n    handleZoom,\n    handleDrag,\n  } = useOverlayEvents();\n\n  const initialViewState = initialViewStateProp ?? dataLayersBBox;\n\n  const { onLoadHandler, onRenderHandler } = useMapPerformance(mapContainerRef);\n\n  return (\n    <div\n      data-testid=\"map-container\"\n      ref={mergedRefs}\n      onMouseEnter={handleMouseEnter}\n      onMouseLeave={handleMouseLeave}\n    >\n      <Map\n        onMove={(evt) => {\n          onViewStateChange?.(evt.viewState);\n        }}\n        initialViewState={toMapBoxInitialViewState(initialViewState)}\n        style={{\n          width: graphWidth,\n          height: `${graphHeight}px`,\n          ...style,\n        }}\n        mapStyle={mapStyle}\n        dragRotate={false}\n        fadeDuration={0}\n        renderWorldCopies={false}\n        interactiveLayerIds={layerIds}\n        maxBounds={[\n          [MIN_LONGITUDE, MIN_LATITUDE],\n          [MAX_LONGITUDE, MAX_LATITUDE],\n        ]}\n        onMouseMove={(e) => handleMouseMove(e as MapLayerMouseEvent)}\n        onClick={(e) => handleMouseClick(e as MapLayerMouseEvent)}\n        onZoom={handleZoom}\n        onDrag={handleDrag}\n        attributionControl={false}\n        onRender={() => onRenderHandler && onRenderHandler()}\n        onLoad={() => {\n          onMapLoad();\n          onLoadHandler && onLoadHandler();\n        }}\n        ref={useSetMapInitialConfiguration()}\n        interactive\n        {...remaining}\n      >\n        <MapDataBoundingBoxContext.Provider value={dataLayersBBox}>\n          <MapViewImperativeHandler\n            forwardedRef={forwardedRef}\n            containerRef={mapContainerRef}\n          >\n            <MapSource />\n            {loading ? null : (\n              <>\n                <MapInteractions>{children}</MapInteractions>\n                {shouldRenderToolbar ? <MapToolbar /> : null}\n              </>\n            )}\n          </MapViewImperativeHandler>\n        </MapDataBoundingBoxContext.Provider>\n      </Map>\n    </div>\n  );\n});\n\n(MapContent as typeof MapContent & { displayName: string }).displayName =\n  'MapContent';\n"],
-  "mappings": "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",
+  "sourcesContent": ["import {\n  Layer,\n  type LayerProps,\n  Map,\n  Source,\n  type ViewStateChangeEvent,\n} from '@vis.gl/react-maplibre';\nimport { isUndefined } from 'lodash-es';\nimport type { MapLayerMouseEvent } from 'maplibre-gl';\nimport React, {\n  forwardRef,\n  type PropsWithChildren,\n  useContext,\n  useRef,\n  useState,\n} from 'react';\n\nimport { _useGraphSize as useGraphSize } from '@dynatrace/strato-components-preview/charts';\nimport { useMergeRefs } from '@dynatrace/strato-components-preview/core';\n\nimport {\n  BASE_LAYER_FILL_ID,\n  BASE_LAYER_LINE_ID,\n  DEFAULT_BOUNDARIES_BORDER_COLOR,\n  DEFAULT_COUNTRIES_FILL_COLOR,\n  REGION_BORDER_WIDTH,\n  COUNTRY_BORDER_WIDTH,\n  MIN_LONGITUDE,\n  MIN_LATITUDE,\n  MAX_LONGITUDE,\n  MAX_LATITUDE,\n} from '../constants.js';\nimport { useMapZoomState, useSetStateZoom } from '../store/store.js';\nimport { MapToolbar } from './toolbar/MapToolbar.js';\nimport { LayerIdsContext } from '../contexts/layer-ids.context.js';\nimport { MapDataBoundingBoxContext } from '../contexts/map-data-bounding-box.context.js';\nimport { useActiveInteraction } from '../hooks/use-active-interaction.js';\nimport { useHoverInteraction } from '../hooks/use-hover-interaction.js';\nimport { useMapBaseLayerFeatures } from '../hooks/use-map-base-layer-features.js';\nimport { useMapConfig } from '../hooks/use-map-config.js';\nimport { useMapLoading } from '../hooks/use-map-loading.js';\nimport { useMapPerformance } from '../hooks/use-map-performance.js';\nimport { useOverlayEvents } from '../hooks/use-overlay-events.js';\nimport { useTooltipEventListeners } from '../hooks/use-tooltip-event-listeners.js';\nimport { defaultStyle } from '../map-styles/default-style.js';\nimport { MapViewImperativeHandler } from '../providers/imperative-handler.provider.js';\nimport type {\n  MapViewProps,\n  MapViewRef,\n  ViewStateRequired,\n} from '../types/map-view.js';\nimport { getColorFromToken } from '../utils/get-color-from-token.js';\nimport { getDataLayersBoundingBox } from '../utils/get-data-layers-bounding-box.js';\nimport { toMapBoxInitialViewState } from '../utils/to-mapbox-initial-view-state.js';\nimport { useSetMapInitialConfiguration } from '../utils/use-set-map-initial-configuration.js';\nimport { generateNewZoomState } from './toolbar/utils/zoom-state-utils.js';\n\nconst lineLayer: LayerProps = {\n  id: BASE_LAYER_LINE_ID,\n  type: 'line',\n};\n\nconst fillLayer: LayerProps = {\n  id: BASE_LAYER_FILL_ID,\n  type: 'fill',\n};\n\nconst MapSource = () => {\n  const baseLayerFeatures = useMapBaseLayerFeatures();\n  return (\n    baseLayerFeatures && (\n      <Source id=\"data\" type=\"geojson\" data={baseLayerFeatures}>\n        <Layer\n          {...fillLayer}\n          paint={{\n            'fill-color': getColorFromToken(DEFAULT_COUNTRIES_FILL_COLOR),\n          }}\n        />\n        <Layer\n          {...lineLayer}\n          type={'line'}\n          filter={[\n            'any',\n            ['==', 'region_type', 'COUNTRY'],\n            ['==', 'region_type', 'REGION'],\n          ]}\n          paint={{\n            'line-color': getColorFromToken(DEFAULT_BOUNDARIES_BORDER_COLOR),\n            'line-width': [\n              'case',\n              ['==', ['get', 'region_type'], 'REGION'],\n              REGION_BORDER_WIDTH,\n              COUNTRY_BORDER_WIDTH,\n            ],\n          }}\n        />\n      </Source>\n    )\n  );\n};\n\nconst MapInteractions = ({ children }: PropsWithChildren) => {\n  useHoverInteraction();\n  useActiveInteraction();\n\n  return children;\n};\ntype MapContentProps = MapViewProps & {\n  onMapLoad: () => void;\n};\n\nexport const MapContent = forwardRef<\n  MapViewRef,\n  PropsWithChildren<MapContentProps>\n>((props, forwardedRef) => {\n  const {\n    initialViewState: initialViewStateProp,\n    children,\n    style,\n    mapStyle = defaultStyle,\n    onViewStateChange,\n    onMapLoad,\n    ...remaining\n  } = props;\n\n  const loading = useMapLoading();\n  const setZoomState = useSetStateZoom();\n  const [savedInitialViewState, setSavedInitialViewState] = useState<\n    ViewStateRequired | undefined\n  >();\n\n  const mapContainerRef = useRef<HTMLDivElement>(null);\n  const mergedRefs = useMergeRefs<MapViewRef | HTMLDivElement>([\n    mapContainerRef,\n    forwardedRef,\n  ]);\n\n  const baseFeatureCollection = useMapBaseLayerFeatures();\n\n  const dataLayersBBox = getDataLayersBoundingBox(\n    children,\n    baseFeatureCollection?.features,\n  );\n\n  useTooltipEventListeners();\n\n  const { toolbar: toolbarConfig, interactions: interactionsConfig } =\n    useMapConfig();\n  const layerIds = useContext(LayerIdsContext);\n  const shouldRenderToolbar =\n    !isUndefined(toolbarConfig) || !isUndefined(interactionsConfig);\n\n  const { height: graphHeight, width: graphWidth } = useGraphSize();\n\n  const {\n    handleMouseEnter,\n    handleMouseMove,\n    handleMouseLeave,\n    handleMouseClick,\n    handleZoom,\n    handleDrag,\n  } = useOverlayEvents();\n\n  const initialViewState = initialViewStateProp ?? dataLayersBBox;\n\n  const { onLoadHandler, onRenderHandler } = useMapPerformance(mapContainerRef);\n  const calculatedInitialViewState = toMapBoxInitialViewState(initialViewState);\n\n  const { zoomToFitInProgress } = useMapZoomState();\n\n  const handleZoomEnd = (event: ViewStateChangeEvent) => {\n    if (savedInitialViewState) {\n      const zoomState = generateNewZoomState(\n        event,\n        savedInitialViewState,\n        zoomToFitInProgress,\n      );\n\n      setZoomState(zoomState);\n    }\n  };\n\n  const handleDragEnd = (event: ViewStateChangeEvent) => {\n    if (savedInitialViewState) {\n      const zoomState = generateNewZoomState(\n        event,\n        savedInitialViewState,\n        zoomToFitInProgress,\n      );\n\n      setZoomState(zoomState);\n    }\n  };\n\n  return (\n    <div\n      data-testid=\"map-container\"\n      ref={mergedRefs}\n      onMouseEnter={handleMouseEnter}\n      onMouseLeave={handleMouseLeave}\n    >\n      <Map\n        onMove={(evt) => {\n          onViewStateChange?.(evt.viewState);\n        }}\n        initialViewState={calculatedInitialViewState}\n        style={{\n          width: graphWidth,\n          height: `${graphHeight}px`,\n          ...style,\n        }}\n        mapStyle={mapStyle}\n        dragRotate={false}\n        fadeDuration={0}\n        renderWorldCopies={false}\n        interactiveLayerIds={layerIds}\n        maxBounds={[\n          [MIN_LONGITUDE, MIN_LATITUDE],\n          [MAX_LONGITUDE, MAX_LATITUDE],\n        ]}\n        onMouseMove={(e) => handleMouseMove(e as MapLayerMouseEvent)}\n        onClick={(e) => handleMouseClick(e as MapLayerMouseEvent)}\n        onZoom={handleZoom}\n        onZoomEnd={handleZoomEnd}\n        onDrag={handleDrag}\n        onDragEnd={handleDragEnd}\n        attributionControl={false}\n        onRender={() => onRenderHandler && onRenderHandler()}\n        onLoad={(e) => {\n          onMapLoad();\n          onLoadHandler && onLoadHandler();\n\n          const initialCenter = e.target.getCenter();\n\n          setSavedInitialViewState({\n            latitude: initialCenter.lat,\n            longitude: initialCenter.lng,\n            zoom: e.target.getZoom(),\n          });\n        }}\n        ref={useSetMapInitialConfiguration()}\n        interactive\n        {...remaining}\n      >\n        <MapDataBoundingBoxContext.Provider value={dataLayersBBox}>\n          <MapViewImperativeHandler\n            forwardedRef={forwardedRef}\n            containerRef={mapContainerRef}\n          >\n            <MapSource />\n            {loading ? null : (\n              <>\n                <MapInteractions>{children}</MapInteractions>\n                {shouldRenderToolbar ? <MapToolbar /> : null}\n              </>\n            )}\n          </MapViewImperativeHandler>\n        </MapDataBoundingBoxContext.Provider>\n      </Map>\n    </div>\n  );\n});\n\n(MapContent as typeof MapContent & { displayName: string }).displayName =\n  'MapContent';\n"],
+  "mappings": "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",
   "names": []
 }

package/esm/map/components/toolbar/buttons/MapResetButton.js

@@ -4,16 +4,20 @@ import { useIntl } from "react-intl";
 import { _ChartToolbarRenderer as ChartToolbarRenderer } from "@dynatrace/strato-components-preview/charts";
 import { ResetIcon } from "@dynatrace/strato-icons";
 import { useInitialViewContext } from "../../../hooks/use-initial-view-context.js";
+import { useMapZoomState, useSetStateZoom } from "../../../store/store.js";
 import { TOOLBAR_MESSAGES } from "../constants.js";
 import { useA11yToolbarTabIndex } from "../hooks/use-a11y-toolbar-tab-index.js";
 const MapResetButton = () => {
   const { current: map } = useMap();
   const { longitude = 0, latitude = 0, zoom = 0 } = useInitialViewContext();
   const intl = useIntl();
+  const { resetEnabled } = useMapZoomState();
+  const setZoomState = useSetStateZoom();
   const resetButtonRef = useRef();
   const tabIndex = useA11yToolbarTabIndex("reset");
   const handleReset = () => {
     map?.flyTo({ center: [longitude, latitude], zoom });
+    setZoomState({ zoomToFitEnabled: true, resetEnabled: false });
   };
   const handleKeyDown = (event) => {
     if (event.code === "Enter") {
@@ -29,7 +33,8 @@ const MapResetButton = () => {
       testId: "map-toolbar-reset",
       onKeyDown: handleKeyDown,
       onClick: handleReset,
-      tabIndex
+      tabIndex,
+      disabled: !resetEnabled
     }
   );
 };

package/esm/map/components/toolbar/buttons/MapResetButton.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/map/components/toolbar/buttons/MapResetButton.tsx"],
-  "sourcesContent": ["import { useMap } from '@vis.gl/react-maplibre';\nimport React, { useRef } from 'react';\nimport { useIntl } from 'react-intl';\n\nimport { _ChartToolbarRenderer as ChartToolbarRenderer } from '@dynatrace/strato-components-preview/charts';\nimport { ResetIcon } from '@dynatrace/strato-icons';\n\nimport { useInitialViewContext } from '../../../hooks/use-initial-view-context.js';\nimport { TOOLBAR_MESSAGES } from '../constants.js';\nimport { useA11yToolbarTabIndex } from '../hooks/use-a11y-toolbar-tab-index.js';\n\nexport const MapResetButton = () => {\n  const { current: map } = useMap();\n  const { longitude = 0, latitude = 0, zoom = 0 } = useInitialViewContext();\n  const intl = useIntl();\n\n  const resetButtonRef = useRef<HTMLButtonElement>();\n  const tabIndex = useA11yToolbarTabIndex('reset');\n\n  const handleReset = () => {\n    map?.flyTo({ center: [longitude, latitude], zoom: zoom });\n  };\n\n  const handleKeyDown = (event: React.KeyboardEvent) => {\n    if (event.code === 'Enter') {\n      handleReset();\n    }\n  };\n\n  return (\n    <ChartToolbarRenderer.Control\n      ref={resetButtonRef}\n      prefixIcon={<ResetIcon />}\n      tooltipText={intl.formatMessage(TOOLBAR_MESSAGES.zoomActionReset)}\n      testId=\"map-toolbar-reset\"\n      onKeyDown={handleKeyDown}\n      onClick={handleReset}\n      tabIndex={tabIndex}\n    />\n  );\n};\n"],
-  "mappings": "AAAA,SAAS,cAAc;AACvB,OAAO,SAAS,cAAc;AAC9B,SAAS,eAAe;AAExB,SAAS,yBAAyB,4BAA4B;AAC9D,SAAS,iBAAiB;AAE1B,SAAS,6BAA6B;AACtC,SAAS,wBAAwB;AACjC,SAAS,8BAA8B;AAEhC,MAAM,iBAAiB,MAAM;AAClC,QAAM,EAAE,SAAS,IAAI,IAAI,OAAO;AAChC,QAAM,EAAE,YAAY,GAAG,WAAW,GAAG,OAAO,EAAE,IAAI,sBAAsB;AACxE,QAAM,OAAO,QAAQ;AAErB,QAAM,iBAAiB,OAA0B;AACjD,QAAM,WAAW,uBAAuB,OAAO;AAE/C,QAAM,cAAc,MAAM;AACxB,SAAK,MAAM,EAAE,QAAQ,CAAC,WAAW,QAAQ,GAAG,KAAW,CAAC;AAAA,EAC1D;AAEA,QAAM,gBAAgB,CAAC,UAA+B;AACpD,QAAI,MAAM,SAAS,SAAS;AAC1B,kBAAY;AAAA,IACd;AAAA,EACF;AAEA,SACE;AAAA,IAAC,qBAAqB;AAAA,IAArB;AAAA,MACC,KAAK;AAAA,MACL,YAAY,oCAAC,eAAU;AAAA,MACvB,aAAa,KAAK,cAAc,iBAAiB,eAAe;AAAA,MAChE,QAAO;AAAA,MACP,WAAW;AAAA,MACX,SAAS;AAAA,MACT;AAAA;AAAA,EACF;AAEJ;",
+  "sourcesContent": ["import { useMap } from '@vis.gl/react-maplibre';\nimport React, { useRef } from 'react';\nimport { useIntl } from 'react-intl';\n\nimport { _ChartToolbarRenderer as ChartToolbarRenderer } from '@dynatrace/strato-components-preview/charts';\nimport { ResetIcon } from '@dynatrace/strato-icons';\n\nimport { useInitialViewContext } from '../../../hooks/use-initial-view-context.js';\nimport { useMapZoomState, useSetStateZoom } from '../../../store/store.js';\nimport { TOOLBAR_MESSAGES } from '../constants.js';\nimport { useA11yToolbarTabIndex } from '../hooks/use-a11y-toolbar-tab-index.js';\n\nexport const MapResetButton = () => {\n  const { current: map } = useMap();\n  const { longitude = 0, latitude = 0, zoom = 0 } = useInitialViewContext();\n  const intl = useIntl();\n  const { resetEnabled } = useMapZoomState();\n  const setZoomState = useSetStateZoom();\n\n  const resetButtonRef = useRef<HTMLButtonElement>();\n  const tabIndex = useA11yToolbarTabIndex('reset');\n\n  const handleReset = () => {\n    map?.flyTo({ center: [longitude, latitude], zoom: zoom });\n    setZoomState({ zoomToFitEnabled: true, resetEnabled: false });\n  };\n\n  const handleKeyDown = (event: React.KeyboardEvent) => {\n    if (event.code === 'Enter') {\n      handleReset();\n    }\n  };\n\n  return (\n    <ChartToolbarRenderer.Control\n      ref={resetButtonRef}\n      prefixIcon={<ResetIcon />}\n      tooltipText={intl.formatMessage(TOOLBAR_MESSAGES.zoomActionReset)}\n      testId=\"map-toolbar-reset\"\n      onKeyDown={handleKeyDown}\n      onClick={handleReset}\n      tabIndex={tabIndex}\n      disabled={!resetEnabled}\n    />\n  );\n};\n"],
+  "mappings": "AAAA,SAAS,cAAc;AACvB,OAAO,SAAS,cAAc;AAC9B,SAAS,eAAe;AAExB,SAAS,yBAAyB,4BAA4B;AAC9D,SAAS,iBAAiB;AAE1B,SAAS,6BAA6B;AACtC,SAAS,iBAAiB,uBAAuB;AACjD,SAAS,wBAAwB;AACjC,SAAS,8BAA8B;AAEhC,MAAM,iBAAiB,MAAM;AAClC,QAAM,EAAE,SAAS,IAAI,IAAI,OAAO;AAChC,QAAM,EAAE,YAAY,GAAG,WAAW,GAAG,OAAO,EAAE,IAAI,sBAAsB;AACxE,QAAM,OAAO,QAAQ;AACrB,QAAM,EAAE,aAAa,IAAI,gBAAgB;AACzC,QAAM,eAAe,gBAAgB;AAErC,QAAM,iBAAiB,OAA0B;AACjD,QAAM,WAAW,uBAAuB,OAAO;AAE/C,QAAM,cAAc,MAAM;AACxB,SAAK,MAAM,EAAE,QAAQ,CAAC,WAAW,QAAQ,GAAG,KAAW,CAAC;AACxD,iBAAa,EAAE,kBAAkB,MAAM,cAAc,MAAM,CAAC;AAAA,EAC9D;AAEA,QAAM,gBAAgB,CAAC,UAA+B;AACpD,QAAI,MAAM,SAAS,SAAS;AAC1B,kBAAY;AAAA,IACd;AAAA,EACF;AAEA,SACE;AAAA,IAAC,qBAAqB;AAAA,IAArB;AAAA,MACC,KAAK;AAAA,MACL,YAAY,oCAAC,eAAU;AAAA,MACvB,aAAa,KAAK,cAAc,iBAAiB,eAAe;AAAA,MAChE,QAAO;AAAA,MACP,WAAW;AAAA,MACX,SAAS;AAAA,MACT;AAAA,MACA,UAAU,CAAC;AAAA;AAAA,EACb;AAEJ;",
   "names": []
 }

package/esm/map/components/toolbar/buttons/MapZoomInOutButtons.js

@@ -3,12 +3,12 @@ import React, { useRef } from "react";
 import { useIntl } from "react-intl";
 import { _ChartToolbarRenderer as ChartToolbarRenderer } from "@dynatrace/strato-components-preview/charts";
 import { ZoomInIcon, ZoomOutIcon } from "@dynatrace/strato-icons";
+import { useMapZoomState } from "../../../store/selectors.js";
 import { TOOLBAR_MESSAGES } from "../constants.js";
 import { useA11yToolbarTabIndex } from "../hooks/use-a11y-toolbar-tab-index.js";
 const MapZoomInOutButtons = () => {
   const { current: map } = useMap();
-  const isMaxZoom = map && map?.getMaxZoom() === map?.getZoom();
-  const isMinZoom = map && map?.getMinZoom() === map?.getZoom();
+  const { zoomInEnabled, zoomOutEnabled } = useMapZoomState();
   const zoomInButtonRef = useRef();
   const zoomButtonOutRef = useRef();
   const intl = useIntl();
@@ -37,7 +37,7 @@ const MapZoomInOutButtons = () => {
       onKeyDown: (event) => handleZoomKeyboardMode(event, "zoom-in"),
       onClick: () => handleZoomStepToolbarMode("zoom-in"),
       tabIndex: tabIndexIn,
-      disabled: isMaxZoom
+      disabled: !zoomInEnabled
     }
   ), /* @__PURE__ */ React.createElement(
     ChartToolbarRenderer.Control,
@@ -49,7 +49,7 @@ const MapZoomInOutButtons = () => {
       onKeyDown: (event) => handleZoomKeyboardMode(event, "zoom-out"),
       onClick: () => handleZoomStepToolbarMode("zoom-out"),
       tabIndex: tabIndexOut,
-      disabled: isMinZoom
+      disabled: !zoomOutEnabled
     }
   ));
 };

package/esm/map/components/toolbar/buttons/MapZoomInOutButtons.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/map/components/toolbar/buttons/MapZoomInOutButtons.tsx"],
-  "sourcesContent": ["import { useMap } from '@vis.gl/react-maplibre';\nimport React, { useRef } from 'react';\nimport { useIntl } from 'react-intl';\n\nimport { _ChartToolbarRenderer as ChartToolbarRenderer } from '@dynatrace/strato-components-preview/charts';\nimport { ZoomInIcon, ZoomOutIcon } from '@dynatrace/strato-icons';\n\nimport { TOOLBAR_MESSAGES } from '../constants.js';\nimport { useA11yToolbarTabIndex } from '../hooks/use-a11y-toolbar-tab-index.js';\n\ntype ZoomBehavior = 'zoom-in' | 'zoom-out';\nexport const MapZoomInOutButtons = () => {\n  const { current: map } = useMap();\n  const isMaxZoom = map && map?.getMaxZoom() === map?.getZoom();\n  const isMinZoom = map && map?.getMinZoom() === map?.getZoom();\n\n  const zoomInButtonRef = useRef<HTMLButtonElement>();\n  const zoomButtonOutRef = useRef<HTMLButtonElement>();\n  const intl = useIntl();\n  const tabIndexIn = useA11yToolbarTabIndex('zoom-in');\n  const tabIndexOut = useA11yToolbarTabIndex('zoom-out');\n\n  const handleZoomKeyboardMode = (\n    event: React.KeyboardEvent,\n    zoomBehavior: ZoomBehavior,\n  ) => {\n    if (event.code === 'Enter') {\n      handleZoomStepToolbarMode(zoomBehavior);\n    }\n  };\n\n  const handleZoomStepToolbarMode = (zoomBehavior: ZoomBehavior) => {\n    if (zoomBehavior === 'zoom-in') {\n      map?.zoomIn();\n    }\n    if (zoomBehavior === 'zoom-out') {\n      map?.zoomOut();\n    }\n  };\n\n  return (\n    <>\n      <ChartToolbarRenderer.Control\n        ref={zoomInButtonRef}\n        prefixIcon={<ZoomInIcon />}\n        tooltipText={intl.formatMessage(TOOLBAR_MESSAGES.zoomActionZoomIn)}\n        testId=\"map-toolbar-zoom-in\"\n        onKeyDown={(event) => handleZoomKeyboardMode(event, 'zoom-in')}\n        onClick={() => handleZoomStepToolbarMode('zoom-in')}\n        tabIndex={tabIndexIn}\n        disabled={isMaxZoom}\n      />\n      <ChartToolbarRenderer.Control\n        ref={zoomButtonOutRef}\n        prefixIcon={<ZoomOutIcon />}\n        tooltipText={intl.formatMessage(TOOLBAR_MESSAGES.zoomActionZoomOut)}\n        testId=\"map-toolbar-zoom-out\"\n        onKeyDown={(event) => handleZoomKeyboardMode(event, 'zoom-out')}\n        onClick={() => handleZoomStepToolbarMode('zoom-out')}\n        tabIndex={tabIndexOut}\n        disabled={isMinZoom}\n      />\n    </>\n  );\n};\n"],
-  "mappings": "AAAA,SAAS,cAAc;AACvB,OAAO,SAAS,cAAc;AAC9B,SAAS,eAAe;AAExB,SAAS,yBAAyB,4BAA4B;AAC9D,SAAS,YAAY,mBAAmB;AAExC,SAAS,wBAAwB;AACjC,SAAS,8BAA8B;AAGhC,MAAM,sBAAsB,MAAM;AACvC,QAAM,EAAE,SAAS,IAAI,IAAI,OAAO;AAChC,QAAM,YAAY,OAAO,KAAK,WAAW,MAAM,KAAK,QAAQ;AAC5D,QAAM,YAAY,OAAO,KAAK,WAAW,MAAM,KAAK,QAAQ;AAE5D,QAAM,kBAAkB,OAA0B;AAClD,QAAM,mBAAmB,OAA0B;AACnD,QAAM,OAAO,QAAQ;AACrB,QAAM,aAAa,uBAAuB,SAAS;AACnD,QAAM,cAAc,uBAAuB,UAAU;AAErD,QAAM,yBAAyB,CAC7B,OACA,iBACG;AACH,QAAI,MAAM,SAAS,SAAS;AAC1B,gCAA0B,YAAY;AAAA,IACxC;AAAA,EACF;AAEA,QAAM,4BAA4B,CAAC,iBAA+B;AAChE,QAAI,iBAAiB,WAAW;AAC9B,WAAK,OAAO;AAAA,IACd;AACA,QAAI,iBAAiB,YAAY;AAC/B,WAAK,QAAQ;AAAA,IACf;AAAA,EACF;AAEA,SACE,0DACE;AAAA,IAAC,qBAAqB;AAAA,IAArB;AAAA,MACC,KAAK;AAAA,MACL,YAAY,oCAAC,gBAAW;AAAA,MACxB,aAAa,KAAK,cAAc,iBAAiB,gBAAgB;AAAA,MACjE,QAAO;AAAA,MACP,WAAW,CAAC,UAAU,uBAAuB,OAAO,SAAS;AAAA,MAC7D,SAAS,MAAM,0BAA0B,SAAS;AAAA,MAClD,UAAU;AAAA,MACV,UAAU;AAAA;AAAA,EACZ,GACA;AAAA,IAAC,qBAAqB;AAAA,IAArB;AAAA,MACC,KAAK;AAAA,MACL,YAAY,oCAAC,iBAAY;AAAA,MACzB,aAAa,KAAK,cAAc,iBAAiB,iBAAiB;AAAA,MAClE,QAAO;AAAA,MACP,WAAW,CAAC,UAAU,uBAAuB,OAAO,UAAU;AAAA,MAC9D,SAAS,MAAM,0BAA0B,UAAU;AAAA,MACnD,UAAU;AAAA,MACV,UAAU;AAAA;AAAA,EACZ,CACF;AAEJ;",
+  "sourcesContent": ["import { useMap } from '@vis.gl/react-maplibre';\nimport React, { useRef } from 'react';\nimport { useIntl } from 'react-intl';\n\nimport { _ChartToolbarRenderer as ChartToolbarRenderer } from '@dynatrace/strato-components-preview/charts';\nimport { ZoomInIcon, ZoomOutIcon } from '@dynatrace/strato-icons';\n\nimport { useMapZoomState } from '../../../store/selectors.js';\nimport { TOOLBAR_MESSAGES } from '../constants.js';\nimport { useA11yToolbarTabIndex } from '../hooks/use-a11y-toolbar-tab-index.js';\n\ntype ZoomBehavior = 'zoom-in' | 'zoom-out';\nexport const MapZoomInOutButtons = () => {\n  const { current: map } = useMap();\n  const { zoomInEnabled, zoomOutEnabled } = useMapZoomState();\n\n  const zoomInButtonRef = useRef<HTMLButtonElement>();\n  const zoomButtonOutRef = useRef<HTMLButtonElement>();\n  const intl = useIntl();\n  const tabIndexIn = useA11yToolbarTabIndex('zoom-in');\n  const tabIndexOut = useA11yToolbarTabIndex('zoom-out');\n\n  const handleZoomKeyboardMode = (\n    event: React.KeyboardEvent,\n    zoomBehavior: ZoomBehavior,\n  ) => {\n    if (event.code === 'Enter') {\n      handleZoomStepToolbarMode(zoomBehavior);\n    }\n  };\n\n  const handleZoomStepToolbarMode = (zoomBehavior: ZoomBehavior) => {\n    if (zoomBehavior === 'zoom-in') {\n      map?.zoomIn();\n    }\n    if (zoomBehavior === 'zoom-out') {\n      map?.zoomOut();\n    }\n  };\n\n  return (\n    <>\n      <ChartToolbarRenderer.Control\n        ref={zoomInButtonRef}\n        prefixIcon={<ZoomInIcon />}\n        tooltipText={intl.formatMessage(TOOLBAR_MESSAGES.zoomActionZoomIn)}\n        testId=\"map-toolbar-zoom-in\"\n        onKeyDown={(event) => handleZoomKeyboardMode(event, 'zoom-in')}\n        onClick={() => handleZoomStepToolbarMode('zoom-in')}\n        tabIndex={tabIndexIn}\n        disabled={!zoomInEnabled}\n      />\n      <ChartToolbarRenderer.Control\n        ref={zoomButtonOutRef}\n        prefixIcon={<ZoomOutIcon />}\n        tooltipText={intl.formatMessage(TOOLBAR_MESSAGES.zoomActionZoomOut)}\n        testId=\"map-toolbar-zoom-out\"\n        onKeyDown={(event) => handleZoomKeyboardMode(event, 'zoom-out')}\n        onClick={() => handleZoomStepToolbarMode('zoom-out')}\n        tabIndex={tabIndexOut}\n        disabled={!zoomOutEnabled}\n      />\n    </>\n  );\n};\n"],
+  "mappings": "AAAA,SAAS,cAAc;AACvB,OAAO,SAAS,cAAc;AAC9B,SAAS,eAAe;AAExB,SAAS,yBAAyB,4BAA4B;AAC9D,SAAS,YAAY,mBAAmB;AAExC,SAAS,uBAAuB;AAChC,SAAS,wBAAwB;AACjC,SAAS,8BAA8B;AAGhC,MAAM,sBAAsB,MAAM;AACvC,QAAM,EAAE,SAAS,IAAI,IAAI,OAAO;AAChC,QAAM,EAAE,eAAe,eAAe,IAAI,gBAAgB;AAE1D,QAAM,kBAAkB,OAA0B;AAClD,QAAM,mBAAmB,OAA0B;AACnD,QAAM,OAAO,QAAQ;AACrB,QAAM,aAAa,uBAAuB,SAAS;AACnD,QAAM,cAAc,uBAAuB,UAAU;AAErD,QAAM,yBAAyB,CAC7B,OACA,iBACG;AACH,QAAI,MAAM,SAAS,SAAS;AAC1B,gCAA0B,YAAY;AAAA,IACxC;AAAA,EACF;AAEA,QAAM,4BAA4B,CAAC,iBAA+B;AAChE,QAAI,iBAAiB,WAAW;AAC9B,WAAK,OAAO;AAAA,IACd;AACA,QAAI,iBAAiB,YAAY;AAC/B,WAAK,QAAQ;AAAA,IACf;AAAA,EACF;AAEA,SACE,0DACE;AAAA,IAAC,qBAAqB;AAAA,IAArB;AAAA,MACC,KAAK;AAAA,MACL,YAAY,oCAAC,gBAAW;AAAA,MACxB,aAAa,KAAK,cAAc,iBAAiB,gBAAgB;AAAA,MACjE,QAAO;AAAA,MACP,WAAW,CAAC,UAAU,uBAAuB,OAAO,SAAS;AAAA,MAC7D,SAAS,MAAM,0BAA0B,SAAS;AAAA,MAClD,UAAU;AAAA,MACV,UAAU,CAAC;AAAA;AAAA,EACb,GACA;AAAA,IAAC,qBAAqB;AAAA,IAArB;AAAA,MACC,KAAK;AAAA,MACL,YAAY,oCAAC,iBAAY;AAAA,MACzB,aAAa,KAAK,cAAc,iBAAiB,iBAAiB;AAAA,MAClE,QAAO;AAAA,MACP,WAAW,CAAC,UAAU,uBAAuB,OAAO,UAAU;AAAA,MAC9D,SAAS,MAAM,0BAA0B,UAAU;AAAA,MACnD,UAAU;AAAA,MACV,UAAU,CAAC;AAAA;AAAA,EACb,CACF;AAEJ;",
   "names": []
 }

package/esm/map/components/toolbar/buttons/MapZoomToFitButton.js

@@ -5,6 +5,7 @@ import { _ChartToolbarRenderer as ChartToolbarRenderer } from "@dynatrace/strato
 import { ZoomToFitIcon } from "@dynatrace/strato-icons";
 import { FIT_BOUNDS_OPTIONS } from "../../../constants.js";
 import { useDataBoundingBox } from "../../../hooks/use-data-bounding-box.js";
+import { useMapZoomState, useSetStateZoom } from "../../../store/store.js";
 import { TOOLBAR_MESSAGES } from "../constants.js";
 import { useA11yToolbarTabIndex } from "../hooks/use-a11y-toolbar-tab-index.js";
 const MapZoomToFitButton = () => {
@@ -13,8 +14,11 @@ const MapZoomToFitButton = () => {
   const tabIndex = useA11yToolbarTabIndex("zoom-to-fit");
   const intl = useIntl();
   const boundingBox = useDataBoundingBox();
+  const { zoomToFitEnabled } = useMapZoomState();
+  const setZoomState = useSetStateZoom();
   const handleZoomToFit = () => {
     map?.fitBounds(boundingBox, FIT_BOUNDS_OPTIONS);
+    setZoomState({ zoomToFitEnabled: false, zoomToFitInProgress: true });
   };
   const handleKeyDown = (event) => {
     if (event.code === "Enter") {
@@ -30,7 +34,8 @@ const MapZoomToFitButton = () => {
       testId: "map-toolbar-zoom-to-fit",
       onKeyDown: handleKeyDown,
       onClick: handleZoomToFit,
-      tabIndex
+      tabIndex,
+      disabled: !zoomToFitEnabled
     }
   );
 };

package/esm/map/components/toolbar/buttons/MapZoomToFitButton.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../src/map/components/toolbar/buttons/MapZoomToFitButton.tsx"],
-  "sourcesContent": ["import { useMap } from '@vis.gl/react-maplibre';\nimport React, { useRef } from 'react';\nimport { useIntl } from 'react-intl';\n\nimport { _ChartToolbarRenderer as ChartToolbarRenderer } from '@dynatrace/strato-components-preview/charts';\nimport { ZoomToFitIcon } from '@dynatrace/strato-icons';\n\nimport { FIT_BOUNDS_OPTIONS } from '../../../constants.js';\nimport { useDataBoundingBox } from '../../../hooks/use-data-bounding-box.js';\nimport { TOOLBAR_MESSAGES } from '../constants.js';\nimport { useA11yToolbarTabIndex } from '../hooks/use-a11y-toolbar-tab-index.js';\n\nexport const MapZoomToFitButton = () => {\n  const resetButtonRef = useRef();\n  const { current: map } = useMap();\n  const tabIndex = useA11yToolbarTabIndex('zoom-to-fit');\n  const intl = useIntl();\n  const boundingBox = useDataBoundingBox();\n  const handleZoomToFit = () => {\n    map?.fitBounds(boundingBox, FIT_BOUNDS_OPTIONS);\n  };\n\n  const handleKeyDown = (event: React.KeyboardEvent) => {\n    if (event.code === 'Enter') {\n      handleZoomToFit();\n    }\n  };\n\n  return (\n    <ChartToolbarRenderer.Control\n      ref={resetButtonRef}\n      prefixIcon={<ZoomToFitIcon />}\n      tooltipText={intl.formatMessage(TOOLBAR_MESSAGES.zoomActionZoomToFit)}\n      testId=\"map-toolbar-zoom-to-fit\"\n      onKeyDown={handleKeyDown}\n      onClick={handleZoomToFit}\n      tabIndex={tabIndex}\n    />\n  );\n};\n\nMapZoomToFitButton['displayName'] = 'MapZoomToFit';\n"],
-  "mappings": "AAAA,SAAS,cAAc;AACvB,OAAO,SAAS,cAAc;AAC9B,SAAS,eAAe;AAExB,SAAS,yBAAyB,4BAA4B;AAC9D,SAAS,qBAAqB;AAE9B,SAAS,0BAA0B;AACnC,SAAS,0BAA0B;AACnC,SAAS,wBAAwB;AACjC,SAAS,8BAA8B;AAEhC,MAAM,qBAAqB,MAAM;AACtC,QAAM,iBAAiB,OAAO;AAC9B,QAAM,EAAE,SAAS,IAAI,IAAI,OAAO;AAChC,QAAM,WAAW,uBAAuB,aAAa;AACrD,QAAM,OAAO,QAAQ;AACrB,QAAM,cAAc,mBAAmB;AACvC,QAAM,kBAAkB,MAAM;AAC5B,SAAK,UAAU,aAAa,kBAAkB;AAAA,EAChD;AAEA,QAAM,gBAAgB,CAAC,UAA+B;AACpD,QAAI,MAAM,SAAS,SAAS;AAC1B,sBAAgB;AAAA,IAClB;AAAA,EACF;AAEA,SACE;AAAA,IAAC,qBAAqB;AAAA,IAArB;AAAA,MACC,KAAK;AAAA,MACL,YAAY,oCAAC,mBAAc;AAAA,MAC3B,aAAa,KAAK,cAAc,iBAAiB,mBAAmB;AAAA,MACpE,QAAO;AAAA,MACP,WAAW;AAAA,MACX,SAAS;AAAA,MACT;AAAA;AAAA,EACF;AAEJ;AAEA,mBAAmB,aAAa,IAAI;",
+  "sourcesContent": ["import { useMap } from '@vis.gl/react-maplibre';\nimport React, { useRef } from 'react';\nimport { useIntl } from 'react-intl';\n\nimport { _ChartToolbarRenderer as ChartToolbarRenderer } from '@dynatrace/strato-components-preview/charts';\nimport { ZoomToFitIcon } from '@dynatrace/strato-icons';\n\nimport { FIT_BOUNDS_OPTIONS } from '../../../constants.js';\nimport { useDataBoundingBox } from '../../../hooks/use-data-bounding-box.js';\nimport { useMapZoomState, useSetStateZoom } from '../../../store/store.js';\nimport { TOOLBAR_MESSAGES } from '../constants.js';\nimport { useA11yToolbarTabIndex } from '../hooks/use-a11y-toolbar-tab-index.js';\n\nexport const MapZoomToFitButton = () => {\n  const resetButtonRef = useRef();\n  const { current: map } = useMap();\n  const tabIndex = useA11yToolbarTabIndex('zoom-to-fit');\n  const intl = useIntl();\n  const boundingBox = useDataBoundingBox();\n  const { zoomToFitEnabled } = useMapZoomState();\n  const setZoomState = useSetStateZoom();\n  const handleZoomToFit = () => {\n    map?.fitBounds(boundingBox, FIT_BOUNDS_OPTIONS);\n    setZoomState({ zoomToFitEnabled: false, zoomToFitInProgress: true });\n  };\n\n  const handleKeyDown = (event: React.KeyboardEvent) => {\n    if (event.code === 'Enter') {\n      handleZoomToFit();\n    }\n  };\n\n  return (\n    <ChartToolbarRenderer.Control\n      ref={resetButtonRef}\n      prefixIcon={<ZoomToFitIcon />}\n      tooltipText={intl.formatMessage(TOOLBAR_MESSAGES.zoomActionZoomToFit)}\n      testId=\"map-toolbar-zoom-to-fit\"\n      onKeyDown={handleKeyDown}\n      onClick={handleZoomToFit}\n      tabIndex={tabIndex}\n      disabled={!zoomToFitEnabled}\n    />\n  );\n};\n\nMapZoomToFitButton['displayName'] = 'MapZoomToFit';\n"],
+  "mappings": "AAAA,SAAS,cAAc;AACvB,OAAO,SAAS,cAAc;AAC9B,SAAS,eAAe;AAExB,SAAS,yBAAyB,4BAA4B;AAC9D,SAAS,qBAAqB;AAE9B,SAAS,0BAA0B;AACnC,SAAS,0BAA0B;AACnC,SAAS,iBAAiB,uBAAuB;AACjD,SAAS,wBAAwB;AACjC,SAAS,8BAA8B;AAEhC,MAAM,qBAAqB,MAAM;AACtC,QAAM,iBAAiB,OAAO;AAC9B,QAAM,EAAE,SAAS,IAAI,IAAI,OAAO;AAChC,QAAM,WAAW,uBAAuB,aAAa;AACrD,QAAM,OAAO,QAAQ;AACrB,QAAM,cAAc,mBAAmB;AACvC,QAAM,EAAE,iBAAiB,IAAI,gBAAgB;AAC7C,QAAM,eAAe,gBAAgB;AACrC,QAAM,kBAAkB,MAAM;AAC5B,SAAK,UAAU,aAAa,kBAAkB;AAC9C,iBAAa,EAAE,kBAAkB,OAAO,qBAAqB,KAAK,CAAC;AAAA,EACrE;AAEA,QAAM,gBAAgB,CAAC,UAA+B;AACpD,QAAI,MAAM,SAAS,SAAS;AAC1B,sBAAgB;AAAA,IAClB;AAAA,EACF;AAEA,SACE;AAAA,IAAC,qBAAqB;AAAA,IAArB;AAAA,MACC,KAAK;AAAA,MACL,YAAY,oCAAC,mBAAc;AAAA,MAC3B,aAAa,KAAK,cAAc,iBAAiB,mBAAmB;AAAA,MACpE,QAAO;AAAA,MACP,WAAW;AAAA,MACX,SAAS;AAAA,MACT;AAAA,MACA,UAAU,CAAC;AAAA;AAAA,EACb;AAEJ;AAEA,mBAAmB,aAAa,IAAI;",
   "names": []
 }

package/esm/map/components/toolbar/utils/zoom-state-utils.js

@@ -0,0 +1,36 @@
+import {
+  MAX_BOUNDS_PRECISION,
+  MAX_LATITUDE,
+  MAX_LONGITUDE,
+  MIN_LATITUDE,
+  MIN_LONGITUDE,
+  VIEW_STATE_PRECISION
+} from "../../../constants.js";
+function compareViewStates(currentViewState, initialViewState) {
+  return currentViewState.zoom.toFixed(VIEW_STATE_PRECISION) === initialViewState.zoom.toFixed(VIEW_STATE_PRECISION) && currentViewState.latitude.toFixed(VIEW_STATE_PRECISION) === initialViewState.latitude.toFixed(VIEW_STATE_PRECISION) && currentViewState.longitude.toFixed(VIEW_STATE_PRECISION) === initialViewState.longitude.toFixed(VIEW_STATE_PRECISION);
+}
+function isMinZoomReached(currentBounds) {
+  return currentBounds._ne.lat.toFixed(MAX_BOUNDS_PRECISION) === MAX_LATITUDE.toFixed(MAX_BOUNDS_PRECISION) && currentBounds._sw.lat.toFixed(MAX_BOUNDS_PRECISION) === MIN_LATITUDE.toFixed(MAX_BOUNDS_PRECISION) || currentBounds._ne.lng.toFixed(MAX_BOUNDS_PRECISION) === MAX_LONGITUDE.toFixed(MAX_BOUNDS_PRECISION) && currentBounds._sw.lng.toFixed(MAX_BOUNDS_PRECISION) === MIN_LONGITUDE.toFixed(MAX_BOUNDS_PRECISION);
+}
+function generateNewZoomState(event, initialViewState, zoomToFitInProgress) {
+  const map = event.target;
+  const viewState = event.viewState;
+  const currentBBox = map?.getBounds();
+  const zoomState = {};
+  if (event.type === "zoomend") {
+    zoomState.zoomInEnabled = map?.getMaxZoom() !== map?.getZoom();
+    zoomState.zoomOutEnabled = !isMinZoomReached(currentBBox);
+  }
+  if (zoomToFitInProgress) {
+    zoomState.zoomToFitEnabled = false;
+    zoomState.zoomToFitInProgress = false;
+  } else {
+    zoomState.zoomToFitEnabled = true;
+  }
+  zoomState.resetEnabled = !compareViewStates(viewState, initialViewState);
+  return zoomState;
+}
+export {
+  generateNewZoomState
+};
+//# sourceMappingURL=zoom-state-utils.js.map

package/esm/map/components/toolbar/utils/zoom-state-utils.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../src/map/components/toolbar/utils/zoom-state-utils.ts"],
+  "sourcesContent": ["import {\n  LngLatBounds,\n  type ViewState,\n  type ViewStateChangeEvent,\n} from '@vis.gl/react-maplibre';\n\nimport {\n  MAX_BOUNDS_PRECISION,\n  MAX_LATITUDE,\n  MAX_LONGITUDE,\n  MIN_LATITUDE,\n  MIN_LONGITUDE,\n  VIEW_STATE_PRECISION,\n} from '../../../constants.js';\nimport type { ViewStateRequired } from '../../../types/map-view.js';\nimport type { ZoomState } from '../../../types/state.js';\n\nfunction compareViewStates(\n  currentViewState: ViewState,\n  initialViewState: ViewStateRequired,\n): boolean {\n  return (\n    currentViewState.zoom.toFixed(VIEW_STATE_PRECISION) ===\n      initialViewState.zoom.toFixed(VIEW_STATE_PRECISION) &&\n    currentViewState.latitude.toFixed(VIEW_STATE_PRECISION) ===\n      initialViewState.latitude.toFixed(VIEW_STATE_PRECISION) &&\n    currentViewState.longitude.toFixed(VIEW_STATE_PRECISION) ===\n      initialViewState.longitude.toFixed(VIEW_STATE_PRECISION)\n  );\n}\n\nfunction isMinZoomReached(currentBounds: LngLatBounds): boolean {\n  return (\n    (currentBounds._ne.lat.toFixed(MAX_BOUNDS_PRECISION) ===\n      MAX_LATITUDE.toFixed(MAX_BOUNDS_PRECISION) &&\n      currentBounds._sw.lat.toFixed(MAX_BOUNDS_PRECISION) ===\n        MIN_LATITUDE.toFixed(MAX_BOUNDS_PRECISION)) ||\n    (currentBounds._ne.lng.toFixed(MAX_BOUNDS_PRECISION) ===\n      MAX_LONGITUDE.toFixed(MAX_BOUNDS_PRECISION) &&\n      currentBounds._sw.lng.toFixed(MAX_BOUNDS_PRECISION) ===\n        MIN_LONGITUDE.toFixed(MAX_BOUNDS_PRECISION))\n  );\n}\n\nexport function generateNewZoomState(\n  event: ViewStateChangeEvent,\n  initialViewState: ViewStateRequired,\n  zoomToFitInProgress?: boolean,\n): Partial<ZoomState> {\n  const map = event.target;\n  const viewState = event.viewState;\n  const currentBBox = map?.getBounds();\n  const zoomState: Partial<ZoomState> = {};\n\n  if (event.type === 'zoomend') {\n    zoomState.zoomInEnabled = map?.getMaxZoom() !== map?.getZoom();\n    zoomState.zoomOutEnabled = !isMinZoomReached(currentBBox);\n  }\n\n  if (zoomToFitInProgress) {\n    zoomState.zoomToFitEnabled = false;\n    zoomState.zoomToFitInProgress = false;\n  } else {\n    zoomState.zoomToFitEnabled = true;\n  }\n\n  zoomState.resetEnabled = !compareViewStates(viewState, initialViewState);\n\n  return zoomState;\n}\n"],
+  "mappings": "AAMA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAIP,SAAS,kBACP,kBACA,kBACS;AACT,SACE,iBAAiB,KAAK,QAAQ,oBAAoB,MAChD,iBAAiB,KAAK,QAAQ,oBAAoB,KACpD,iBAAiB,SAAS,QAAQ,oBAAoB,MACpD,iBAAiB,SAAS,QAAQ,oBAAoB,KACxD,iBAAiB,UAAU,QAAQ,oBAAoB,MACrD,iBAAiB,UAAU,QAAQ,oBAAoB;AAE7D;AAEA,SAAS,iBAAiB,eAAsC;AAC9D,SACG,cAAc,IAAI,IAAI,QAAQ,oBAAoB,MACjD,aAAa,QAAQ,oBAAoB,KACzC,cAAc,IAAI,IAAI,QAAQ,oBAAoB,MAChD,aAAa,QAAQ,oBAAoB,KAC5C,cAAc,IAAI,IAAI,QAAQ,oBAAoB,MACjD,cAAc,QAAQ,oBAAoB,KAC1C,cAAc,IAAI,IAAI,QAAQ,oBAAoB,MAChD,cAAc,QAAQ,oBAAoB;AAElD;AAEO,SAAS,qBACd,OACA,kBACA,qBACoB;AACpB,QAAM,MAAM,MAAM;AAClB,QAAM,YAAY,MAAM;AACxB,QAAM,cAAc,KAAK,UAAU;AACnC,QAAM,YAAgC,CAAC;AAEvC,MAAI,MAAM,SAAS,WAAW;AAC5B,cAAU,gBAAgB,KAAK,WAAW,MAAM,KAAK,QAAQ;AAC7D,cAAU,iBAAiB,CAAC,iBAAiB,WAAW;AAAA,EAC1D;AAEA,MAAI,qBAAqB;AACvB,cAAU,mBAAmB;AAC7B,cAAU,sBAAsB;AAAA,EAClC,OAAO;AACL,cAAU,mBAAmB;AAAA,EAC/B;AAEA,YAAU,eAAe,CAAC,kBAAkB,WAAW,gBAAgB;AAEvE,SAAO;AACT;",
+  "names": []
+}

package/esm/map/constants.js

@@ -86,6 +86,9 @@ const DEFAULT_BASE_LAYER_RULES = {
   include: [INCLUDE_ALL_WILDCARD_RULE],
   exclude: []
 };
+const BOUNDING_BOX_PRECISION = 6;
+const VIEW_STATE_PRECISION = 4;
+const MAX_BOUNDS_PRECISION = 2;
 export {
   ACTIVE_BORDER_WIDTH_INNER,
   ACTIVE_BORDER_WIDTH_OUTER,
@@ -93,6 +96,7 @@ export {
   BASE_LAYER_FILL_ID,
   BASE_LAYER_IDS,
   BASE_LAYER_LINE_ID,
+  BOUNDING_BOX_PRECISION,
   BUBBLE_DEFAULT_OPACITY,
   BUBBLE_OUTLINE_STROKE,
   BUBBLE_STROKE,
@@ -134,6 +138,7 @@ export {
   ICON_BACKGROUND_OPACITY,
   ICON_BACKGROUND_RADIUS,
   INCLUDE_ALL_WILDCARD_RULE,
+  MAX_BOUNDS_PRECISION,
   MAX_LATITUDE,
   MAX_LINE_THICKNESS,
   MAX_LONGITUDE,
@@ -144,6 +149,7 @@ export {
   SHAPE_OPACITY_DEFAULT,
   SHAPE_OPACITY_DIMMED,
   TRANSPARENT_BORDER_COLOR,
+  VIEW_STATE_PRECISION,
   WORLD_VIEW_MAX_BOUNDARIES
 };
 //# sourceMappingURL=constants.js.map

package/esm/map/constants.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/map/constants.ts"],
-  "sourcesContent": ["import type { ExpressionSpecification } from '@maplibre/maplibre-gl-style-spec';\nimport { defineMessages } from 'react-intl';\n\nimport type { _TruncationMode as TruncationMode } from '@dynatrace/strato-components/typography';\nimport Colors from '@dynatrace/strato-design-tokens/colors';\n\nimport type { BaseLayerRules } from './types/base-layer.js';\n\n//region GENERAL\nexport const DEFAULT_COUNTRIES_FILL_COLOR =\n  Colors.Background.Container.Neutral.Default;\nexport const DEFAULT_BOUNDARIES_BORDER_COLOR = Colors.Border.Neutral.Default;\nexport const COUNTRY_BORDER_WIDTH = 1;\nexport const REGION_BORDER_WIDTH = 0.4;\nexport const TRANSPARENT_BORDER_COLOR = '#00000000';\n\n// region Map max bounds:\n// These bounds hide the space used by Antarctica and some portion of the North Pole\nexport const MAX_LATITUDE = 85;\nexport const MIN_LATITUDE = -60;\nexport const MAX_LONGITUDE = 179.99;\nexport const MIN_LONGITUDE = -179.99;\n// endregion\n\nexport const WORLD_VIEW_MAX_BOUNDARIES: [number, number, number, number] = [\n  MAX_LONGITUDE,\n  MAX_LATITUDE,\n  MIN_LONGITUDE,\n  MIN_LATITUDE,\n];\nexport const DEFAULT_COUNTRY_CODE = 'default';\nexport const FIT_BOUNDS_OPTIONS = { padding: 20 };\nexport const DEFAULT_MAP_HEIGHT = 400;\nexport const DEFAULT_MAP_LEGEND_RATIO = 'auto';\nexport const DEFAULT_MAP_POSITION = 'auto';\nexport const DEFAULT_INPUT_ICON_SIZE = 20;\nexport const ACTIVE_COLOR = Colors.Border.Neutral.Accent;\n\nexport const BASE_LAYER_FILL_ID = 'geojson-fill';\nexport const BASE_LAYER_LINE_ID = 'geojson-line';\nexport const BASE_LAYER_IDS = [BASE_LAYER_LINE_ID, BASE_LAYER_FILL_ID];\nexport const SHAPE_OPACITY_DEFAULT = 1;\nexport const SHAPE_OPACITY_DIMMED = 0.2;\n\nexport const DEFAULT_SYMBOL_SIZE = 32;\nexport const FALLBACK_SYMBOL_SIZE = 1;\nexport const DEFAULT_TRUNCATION_MODE = 'middle' as TruncationMode;\n\nexport const CDN_BASE_PATH =\n  'https://dt-cdn.net/scripts/data/worldmap/maps/v004/' as const;\nexport const INCLUDE_ALL_WILDCARD_RULE = '*' as const;\n//endregion\n\n//region LEGEND\nexport const DEFAULT_BASIC_SHAPE_COLOR_TOKEN =\n  Colors.Charts.CategoricalThemed.PurpleRain.Color01;\nexport const DEFAULT_LEGEND_SIZES = {\n  // Minimum size in which the legend can be resized (vertical layout)\n  minWidth: 0.1,\n  // Minimum size in which the legend can be resized (horizontal layout)\n  minHeight: 0.1,\n  // Maximum size in which the legend can be resized (vertical layout). 80% represent 4 / 5ths of the container.\n  maxWidth: 0.8,\n  // Maximum size in which the legend can be resized (horizontal layout). 80% represent 4 / 5ths of the container.\n  maxHeight: 0.8,\n};\nexport const DEFAULT_FORMATTER = {\n  maximumFractionDigits: 1,\n};\nexport const DEFAULT_RANGE_COLOR = Colors.Background.Container.Neutral.Accent;\nexport const DEFAULT_SEQUENTIAL_LEGEND_COLOR_PALETTE = 'blue';\n//endregion\n\n//region DOT LAYER\nexport const ICON_BACKGROUND_OPACITY = 0.7;\nexport const ICON_BACKGROUND_RADIUS = 16;\nexport const DEFAULT_ICON_BACKGROUND_COLOR =\n  Colors.Background.Container.Neutral.Subdued;\nexport const DEFAULT_ICON_SIZE_RATIO = 0.6;\nexport const DEFAULT_SHAPE_COLOR = Colors.Charts.Categorical.Color15.Default;\nexport const DEFAULT_ICON_COLOR = Colors.Icon.Neutral.Default;\n//endregion\n\n//region BUBBLE LAYER\nexport const DEFAULT_BUBBLE_COLOR = Colors.Charts.Categorical.Color07.Default;\nexport const DEFAULT_RADIUS = 12;\nexport const BUBBLE_DEFAULT_OPACITY = 0.4;\nexport const BUBBLE_STROKE = 1;\nexport const BUBBLE_OUTLINE_STROKE = 1;\nexport const DEFAULT_RADIUS_EXPRESSION: ExpressionSpecification = [\n  'get',\n  '__radius',\n];\n//endregion\n\n//region CONNECTION LAYER\nexport const DEFAULT_LINE_JOIN: 'bevel' | 'round' | 'miter' = 'miter';\nexport const DEFAULT_LINE_CAP: 'butt' | 'round' | 'square' = 'butt';\nexport const DEFAULT_LINE_THICKNESS = 2;\nexport const DEFAULT_LINE_COLOR = Colors.Charts.Categorical.Color03.Default;\nexport const DEFAULT_LINE_DASH_ARRAY = [5, 2.5];\nexport const MIN_LINE_THICKNESS = 1;\nexport const MAX_LINE_THICKNESS = 64;\nexport const DIRECTION_ICON_OUTPUT_SIZE = 128;\nexport const DIRECTION_ICON_SHRINK_RATIO = 1 / 15;\n//endregion\n\n//region CHOROPLETH LAYER\nexport const ACTIVE_BORDER_WIDTH_OUTER = 3;\nexport const ACTIVE_BORDER_WIDTH_INNER = 1;\n\nexport const DEFAULT_CHOROPLETH_COLOR =\n  Colors.Charts.Sequential.Blue.Color05.Default;\n\nexport const COPY_TO_CLIPBOARD_MESSAGES = defineMessages({\n  copyActionCoords: {\n    id: 'g2qESM+ibB5sUyjf',\n    defaultMessage: 'Copy coordinates',\n    description:\n      'Text in a tooltip shown when hovering a tooltip item and hovering the copy button next to its coordinates',\n  },\n});\n//endregion\n\n//region BASE LAYER RULES\nexport const DEFAULT_BASE_LAYER_RULES = {\n  include: [INCLUDE_ALL_WILDCARD_RULE],\n  exclude: [],\n} as const as BaseLayerRules;\n\n//endregion\n"],
-  "mappings": "AACA,SAAS,sBAAsB;AAG/B,OAAO,YAAY;AAKZ,MAAM,+BACX,OAAO,WAAW,UAAU,QAAQ;AAC/B,MAAM,kCAAkC,OAAO,OAAO,QAAQ;AAC9D,MAAM,uBAAuB;AAC7B,MAAM,sBAAsB;AAC5B,MAAM,2BAA2B;AAIjC,MAAM,eAAe;AACrB,MAAM,eAAe;AACrB,MAAM,gBAAgB;AACtB,MAAM,gBAAgB;AAGtB,MAAM,4BAA8D;AAAA,EACzE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;AACO,MAAM,uBAAuB;AAC7B,MAAM,qBAAqB,EAAE,SAAS,GAAG;AACzC,MAAM,qBAAqB;AAC3B,MAAM,2BAA2B;AACjC,MAAM,uBAAuB;AAC7B,MAAM,0BAA0B;AAChC,MAAM,eAAe,OAAO,OAAO,QAAQ;AAE3C,MAAM,qBAAqB;AAC3B,MAAM,qBAAqB;AAC3B,MAAM,iBAAiB,CAAC,oBAAoB,kBAAkB;AAC9D,MAAM,wBAAwB;AAC9B,MAAM,uBAAuB;AAE7B,MAAM,sBAAsB;AAC5B,MAAM,uBAAuB;AAC7B,MAAM,0BAA0B;AAEhC,MAAM,gBACX;AACK,MAAM,4BAA4B;AAIlC,MAAM,kCACX,OAAO,OAAO,kBAAkB,WAAW;AACtC,MAAM,uBAAuB;AAAA;AAAA,EAElC,UAAU;AAAA;AAAA,EAEV,WAAW;AAAA;AAAA,EAEX,UAAU;AAAA;AAAA,EAEV,WAAW;AACb;AACO,MAAM,oBAAoB;AAAA,EAC/B,uBAAuB;AACzB;AACO,MAAM,sBAAsB,OAAO,WAAW,UAAU,QAAQ;AAChE,MAAM,0CAA0C;AAIhD,MAAM,0BAA0B;AAChC,MAAM,yBAAyB;AAC/B,MAAM,gCACX,OAAO,WAAW,UAAU,QAAQ;AAC/B,MAAM,0BAA0B;AAChC,MAAM,sBAAsB,OAAO,OAAO,YAAY,QAAQ;AAC9D,MAAM,qBAAqB,OAAO,KAAK,QAAQ;AAI/C,MAAM,uBAAuB,OAAO,OAAO,YAAY,QAAQ;AAC/D,MAAM,iBAAiB;AACvB,MAAM,yBAAyB;AAC/B,MAAM,gBAAgB;AACtB,MAAM,wBAAwB;AAC9B,MAAM,4BAAqD;AAAA,EAChE;AAAA,EACA;AACF;AAIO,MAAM,oBAAiD;AACvD,MAAM,mBAAgD;AACtD,MAAM,yBAAyB;AAC/B,MAAM,qBAAqB,OAAO,OAAO,YAAY,QAAQ;AAC7D,MAAM,0BAA0B,CAAC,GAAG,GAAG;AACvC,MAAM,qBAAqB;AAC3B,MAAM,qBAAqB;AAC3B,MAAM,6BAA6B;AACnC,MAAM,8BAA8B,IAAI;AAIxC,MAAM,4BAA4B;AAClC,MAAM,4BAA4B;AAElC,MAAM,2BACX,OAAO,OAAO,WAAW,KAAK,QAAQ;AAEjC,MAAM,6BAA6B,eAAe;AAAA,EACvD,kBAAkB;AAAA,IAChB,IAAI;AAAA,IACJ,gBAAgB;AAAA,IAChB,aACE;AAAA,EACJ;AACF,CAAC;AAIM,MAAM,2BAA2B;AAAA,EACtC,SAAS,CAAC,yBAAyB;AAAA,EACnC,SAAS,CAAC;AACZ;",
+  "sourcesContent": ["import type { ExpressionSpecification } from '@maplibre/maplibre-gl-style-spec';\nimport { defineMessages } from 'react-intl';\n\nimport type { _TruncationMode as TruncationMode } from '@dynatrace/strato-components/typography';\nimport Colors from '@dynatrace/strato-design-tokens/colors';\n\nimport type { BaseLayerRules } from './types/base-layer.js';\nimport type { BoundingBoxCoords } from './types/map-view.js';\n\n//region GENERAL\nexport const DEFAULT_COUNTRIES_FILL_COLOR =\n  Colors.Background.Container.Neutral.Default;\nexport const DEFAULT_BOUNDARIES_BORDER_COLOR = Colors.Border.Neutral.Default;\nexport const COUNTRY_BORDER_WIDTH = 1;\nexport const REGION_BORDER_WIDTH = 0.4;\nexport const TRANSPARENT_BORDER_COLOR = '#00000000';\n\n// region Map max bounds:\n// These bounds hide the space used by Antarctica and some portion of the North Pole\nexport const MAX_LATITUDE = 85;\nexport const MIN_LATITUDE = -60;\nexport const MAX_LONGITUDE = 179.99;\nexport const MIN_LONGITUDE = -179.99;\n// endregion\n\nexport const WORLD_VIEW_MAX_BOUNDARIES: BoundingBoxCoords = [\n  MAX_LONGITUDE,\n  MAX_LATITUDE,\n  MIN_LONGITUDE,\n  MIN_LATITUDE,\n];\nexport const DEFAULT_COUNTRY_CODE = 'default';\nexport const FIT_BOUNDS_OPTIONS = { padding: 20 };\nexport const DEFAULT_MAP_HEIGHT = 400;\nexport const DEFAULT_MAP_LEGEND_RATIO = 'auto';\nexport const DEFAULT_MAP_POSITION = 'auto';\nexport const DEFAULT_INPUT_ICON_SIZE = 20;\nexport const ACTIVE_COLOR = Colors.Border.Neutral.Accent;\n\nexport const BASE_LAYER_FILL_ID = 'geojson-fill';\nexport const BASE_LAYER_LINE_ID = 'geojson-line';\nexport const BASE_LAYER_IDS = [BASE_LAYER_LINE_ID, BASE_LAYER_FILL_ID];\nexport const SHAPE_OPACITY_DEFAULT = 1;\nexport const SHAPE_OPACITY_DIMMED = 0.2;\n\nexport const DEFAULT_SYMBOL_SIZE = 32;\nexport const FALLBACK_SYMBOL_SIZE = 1;\nexport const DEFAULT_TRUNCATION_MODE = 'middle' as TruncationMode;\n\nexport const CDN_BASE_PATH =\n  'https://dt-cdn.net/scripts/data/worldmap/maps/v004/' as const;\nexport const INCLUDE_ALL_WILDCARD_RULE = '*' as const;\n//endregion\n\n//region LEGEND\nexport const DEFAULT_BASIC_SHAPE_COLOR_TOKEN =\n  Colors.Charts.CategoricalThemed.PurpleRain.Color01;\nexport const DEFAULT_LEGEND_SIZES = {\n  // Minimum size in which the legend can be resized (vertical layout)\n  minWidth: 0.1,\n  // Minimum size in which the legend can be resized (horizontal layout)\n  minHeight: 0.1,\n  // Maximum size in which the legend can be resized (vertical layout). 80% represent 4 / 5ths of the container.\n  maxWidth: 0.8,\n  // Maximum size in which the legend can be resized (horizontal layout). 80% represent 4 / 5ths of the container.\n  maxHeight: 0.8,\n};\nexport const DEFAULT_FORMATTER = {\n  maximumFractionDigits: 1,\n};\nexport const DEFAULT_RANGE_COLOR = Colors.Background.Container.Neutral.Accent;\nexport const DEFAULT_SEQUENTIAL_LEGEND_COLOR_PALETTE = 'blue';\n//endregion\n\n//region DOT LAYER\nexport const ICON_BACKGROUND_OPACITY = 0.7;\nexport const ICON_BACKGROUND_RADIUS = 16;\nexport const DEFAULT_ICON_BACKGROUND_COLOR =\n  Colors.Background.Container.Neutral.Subdued;\nexport const DEFAULT_ICON_SIZE_RATIO = 0.6;\nexport const DEFAULT_SHAPE_COLOR = Colors.Charts.Categorical.Color15.Default;\nexport const DEFAULT_ICON_COLOR = Colors.Icon.Neutral.Default;\n//endregion\n\n//region BUBBLE LAYER\nexport const DEFAULT_BUBBLE_COLOR = Colors.Charts.Categorical.Color07.Default;\nexport const DEFAULT_RADIUS = 12;\nexport const BUBBLE_DEFAULT_OPACITY = 0.4;\nexport const BUBBLE_STROKE = 1;\nexport const BUBBLE_OUTLINE_STROKE = 1;\nexport const DEFAULT_RADIUS_EXPRESSION: ExpressionSpecification = [\n  'get',\n  '__radius',\n];\n//endregion\n\n//region CONNECTION LAYER\nexport const DEFAULT_LINE_JOIN: 'bevel' | 'round' | 'miter' = 'miter';\nexport const DEFAULT_LINE_CAP: 'butt' | 'round' | 'square' = 'butt';\nexport const DEFAULT_LINE_THICKNESS = 2;\nexport const DEFAULT_LINE_COLOR = Colors.Charts.Categorical.Color03.Default;\nexport const DEFAULT_LINE_DASH_ARRAY = [5, 2.5];\nexport const MIN_LINE_THICKNESS = 1;\nexport const MAX_LINE_THICKNESS = 64;\nexport const DIRECTION_ICON_OUTPUT_SIZE = 128;\nexport const DIRECTION_ICON_SHRINK_RATIO = 1 / 15;\n//endregion\n\n//region CHOROPLETH LAYER\nexport const ACTIVE_BORDER_WIDTH_OUTER = 3;\nexport const ACTIVE_BORDER_WIDTH_INNER = 1;\n\nexport const DEFAULT_CHOROPLETH_COLOR =\n  Colors.Charts.Sequential.Blue.Color05.Default;\n\nexport const COPY_TO_CLIPBOARD_MESSAGES = defineMessages({\n  copyActionCoords: {\n    id: 'g2qESM+ibB5sUyjf',\n    defaultMessage: 'Copy coordinates',\n    description:\n      'Text in a tooltip shown when hovering a tooltip item and hovering the copy button next to its coordinates',\n  },\n});\n//endregion\n\n//region BASE LAYER RULES\nexport const DEFAULT_BASE_LAYER_RULES = {\n  include: [INCLUDE_ALL_WILDCARD_RULE],\n  exclude: [],\n} as const as BaseLayerRules;\n\n//endregion\n\n//region Zoom state comparison precision\nexport const BOUNDING_BOX_PRECISION = 6;\nexport const VIEW_STATE_PRECISION = 4;\nexport const MAX_BOUNDS_PRECISION = 2;\n//endregion\n"],
+  "mappings": "AACA,SAAS,sBAAsB;AAG/B,OAAO,YAAY;AAMZ,MAAM,+BACX,OAAO,WAAW,UAAU,QAAQ;AAC/B,MAAM,kCAAkC,OAAO,OAAO,QAAQ;AAC9D,MAAM,uBAAuB;AAC7B,MAAM,sBAAsB;AAC5B,MAAM,2BAA2B;AAIjC,MAAM,eAAe;AACrB,MAAM,eAAe;AACrB,MAAM,gBAAgB;AACtB,MAAM,gBAAgB;AAGtB,MAAM,4BAA+C;AAAA,EAC1D;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;AACO,MAAM,uBAAuB;AAC7B,MAAM,qBAAqB,EAAE,SAAS,GAAG;AACzC,MAAM,qBAAqB;AAC3B,MAAM,2BAA2B;AACjC,MAAM,uBAAuB;AAC7B,MAAM,0BAA0B;AAChC,MAAM,eAAe,OAAO,OAAO,QAAQ;AAE3C,MAAM,qBAAqB;AAC3B,MAAM,qBAAqB;AAC3B,MAAM,iBAAiB,CAAC,oBAAoB,kBAAkB;AAC9D,MAAM,wBAAwB;AAC9B,MAAM,uBAAuB;AAE7B,MAAM,sBAAsB;AAC5B,MAAM,uBAAuB;AAC7B,MAAM,0BAA0B;AAEhC,MAAM,gBACX;AACK,MAAM,4BAA4B;AAIlC,MAAM,kCACX,OAAO,OAAO,kBAAkB,WAAW;AACtC,MAAM,uBAAuB;AAAA;AAAA,EAElC,UAAU;AAAA;AAAA,EAEV,WAAW;AAAA;AAAA,EAEX,UAAU;AAAA;AAAA,EAEV,WAAW;AACb;AACO,MAAM,oBAAoB;AAAA,EAC/B,uBAAuB;AACzB;AACO,MAAM,sBAAsB,OAAO,WAAW,UAAU,QAAQ;AAChE,MAAM,0CAA0C;AAIhD,MAAM,0BAA0B;AAChC,MAAM,yBAAyB;AAC/B,MAAM,gCACX,OAAO,WAAW,UAAU,QAAQ;AAC/B,MAAM,0BAA0B;AAChC,MAAM,sBAAsB,OAAO,OAAO,YAAY,QAAQ;AAC9D,MAAM,qBAAqB,OAAO,KAAK,QAAQ;AAI/C,MAAM,uBAAuB,OAAO,OAAO,YAAY,QAAQ;AAC/D,MAAM,iBAAiB;AACvB,MAAM,yBAAyB;AAC/B,MAAM,gBAAgB;AACtB,MAAM,wBAAwB;AAC9B,MAAM,4BAAqD;AAAA,EAChE;AAAA,EACA;AACF;AAIO,MAAM,oBAAiD;AACvD,MAAM,mBAAgD;AACtD,MAAM,yBAAyB;AAC/B,MAAM,qBAAqB,OAAO,OAAO,YAAY,QAAQ;AAC7D,MAAM,0BAA0B,CAAC,GAAG,GAAG;AACvC,MAAM,qBAAqB;AAC3B,MAAM,qBAAqB;AAC3B,MAAM,6BAA6B;AACnC,MAAM,8BAA8B,IAAI;AAIxC,MAAM,4BAA4B;AAClC,MAAM,4BAA4B;AAElC,MAAM,2BACX,OAAO,OAAO,WAAW,KAAK,QAAQ;AAEjC,MAAM,6BAA6B,eAAe;AAAA,EACvD,kBAAkB;AAAA,IAChB,IAAI;AAAA,IACJ,gBAAgB;AAAA,IAChB,aACE;AAAA,EACJ;AACF,CAAC;AAIM,MAAM,2BAA2B;AAAA,EACtC,SAAS,CAAC,yBAAyB;AAAA,EACnC,SAAS,CAAC;AACZ;AAKO,MAAM,yBAAyB;AAC/B,MAAM,uBAAuB;AAC7B,MAAM,uBAAuB;",
   "names": []
 }

package/esm/map/contexts/map-data-bounding-box.context.js

@@ -1,6 +1,8 @@
 import React from "react";
 import { WORLD_VIEW_MAX_BOUNDARIES } from "../constants.js";
-const MapDataBoundingBoxContext = React.createContext(WORLD_VIEW_MAX_BOUNDARIES);
+const MapDataBoundingBoxContext = React.createContext(
+  WORLD_VIEW_MAX_BOUNDARIES
+);
 export {
   MapDataBoundingBoxContext
 };

package/esm/map/contexts/map-data-bounding-box.context.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/map/contexts/map-data-bounding-box.context.ts"],
-  "sourcesContent": ["import React from 'react';\n\nimport { WORLD_VIEW_MAX_BOUNDARIES } from '../constants.js';\n\nexport const MapDataBoundingBoxContext = React.createContext<\n  [number, number, number, number]\n>(WORLD_VIEW_MAX_BOUNDARIES);\n"],
-  "mappings": "AAAA,OAAO,WAAW;AAElB,SAAS,iCAAiC;AAEnC,MAAM,4BAA4B,MAAM,cAE7C,yBAAyB;",
+  "sourcesContent": ["import React from 'react';\n\nimport { WORLD_VIEW_MAX_BOUNDARIES } from '../constants.js';\nimport type { BoundingBoxCoords } from '../types/map-view.js';\n\nexport const MapDataBoundingBoxContext = React.createContext<BoundingBoxCoords>(\n  WORLD_VIEW_MAX_BOUNDARIES,\n);\n"],
+  "mappings": "AAAA,OAAO,WAAW;AAElB,SAAS,iCAAiC;AAGnC,MAAM,4BAA4B,MAAM;AAAA,EAC7C;AACF;",
   "names": []
 }