@dynatrace/strato-geo 3.2.0 → 3.3.0

package/esm/map/MapView.js

@@ -3,7 +3,9 @@ import { forwardRef, useState } from "react";
 import {
   _ChartLayout as ChartLayout,
   _coerceSizeValue as coerceSizeValue,
-  _useAutoLegendRefresh as useAutoLegendRefresh
+  _useAutoLegendRefresh as useAutoLegendRefresh,
+  _OverlayProvider as OverlayProvider,
+  _OverlayTooltipProvider as TooltipProvider
 } from "@dynatrace/strato-components/charts";
 import { _useBehavioralTrackingProps as useBehavioralTrackingProps } from "@dynatrace/strato-components/core";
 import { MapLegendRenderer } from "./components/legend/MapLegendRenderer.js";
@@ -105,7 +107,7 @@ const _MapView = forwardRef(
               MapTruncationModeContext.Provider,
               {
                 value: truncationMode ?? DEFAULT_TRUNCATION_MODE,
-                children: /* @__PURE__ */ jsx(FormatterContext.Provider, { value: formatter, children: /* @__PURE__ */ jsx(MapRawDataContext.Provider, { value: layersData, children: /* @__PURE__ */ jsx(MapStoreProvider, { children: /* @__PURE__ */ jsx(
+                children: /* @__PURE__ */ jsx(FormatterContext.Provider, { value: formatter, children: /* @__PURE__ */ jsx(MapRawDataContext.Provider, { value: layersData, children: /* @__PURE__ */ jsx(OverlayProvider, { children: /* @__PURE__ */ jsx(TooltipProvider, { children: /* @__PURE__ */ jsx(MapStoreProvider, { children: /* @__PURE__ */ jsx(
                   ColorScaleProvider,
                   {
                     categories,
@@ -141,7 +143,7 @@ const _MapView = forwardRef(
                       }
                     ) })
                   }
-                ) }) }) })
+                ) }) }) }) }) })
               }
             ) }) })
           }

package/esm/map/MapView.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/map/MapView.tsx"],
-  "sourcesContent": ["import { 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/charts';\nimport { _useBehavioralTrackingProps as useBehavioralTrackingProps } from '@dynatrace/strato-components/core';\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  MAP_VIEW_ARIA_LABEL,\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 { DownloadCSV } from './slots/DownloadCSV.js';\nimport { ErrorStateSlot } from './slots/states/ErrorStateSlot.js';\nimport { Toolbar } from './slots/Toolbar.js';\nimport { Zoom } from './slots/Zoom.js';\nimport { MapStoreProvider } from './store/map-store.provider.js';\nimport type { MapViewProps, MapViewRef } from './types/map-view.js';\nimport { isThresholdLegend } from './utils/build-scale-from-legend-config.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';\nimport './styles/react-mapgl-styles.css';\n\n/**\n * MapView Component\n */\nconst _MapView = forwardRef<MapViewRef, PropsWithChildren<MapViewProps>>(\n  (props, forwardedRef) => {\n    const [behavioralTrackingProps] = useBehavioralTrackingProps(props);\n\n    const {\n      children,\n      loading = false,\n      style: costumerStyle,\n      className: customerClassNames,\n      'data-dtrum-mask': dataDtrumMask,\n      'data-dtrum-allow': dataDtrumAllow,\n      'data-testid': dataTestId,\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 getMaxRange = (): number => {\n      if (config.legend && isThresholdLegend(config.legend)) {\n        return config.legend.ranges.at(-1)?.to ?? legendDomain[1];\n      }\n      return legendDomain[1];\n    };\n\n    const dataMax = getMaxRange();\n\n    const isLegendHidden = !config.legend || !!config.legend.hidden;\n    const legendPosition = config.legend?.position;\n    // eslint-disable-next-line @typescript-eslint/no-deprecated\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    const chartLayoutRef = useAutoLegendRefresh(categories.join(':'));\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-dtrum-mask={dataDtrumMask}\n        data-dtrum-allow={dataDtrumAllow}\n        data-testid={dataTestId}\n        role=\"img\"\n        aria-label={MAP_VIEW_ARIA_LABEL}\n        {...behavioralTrackingProps}\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={dataMax}\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                                      // eslint-disable-next-line @typescript-eslint/no-deprecated\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  Toolbar,\n  DownloadCSV,\n  Zoom,\n});\n"],
-  "mappings": "AAiHY,cAwBoB,YAxBpB;AAjHZ,SAAS,YAAoC,gBAAgB;AAE7D;AAAA,EACE,gBAAgB;AAAA,EAChB,oBAAoB;AAAA,EACpB,yBAAyB;AAAA,OACpB;AACP,SAAS,+BAA+B,kCAAkC;AAE1E,SAAS,yBAAyB;AAClC,SAAS,kBAAkB;AAC3B,SAAS,sBAAsB;AAC/B;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,wBAAwB;AACjC,SAAS,uBAAuB;AAChC,SAAS,mCAAmC;AAC5C,SAAS,+BAA+B;AACxC,SAAS,yBAAyB;AAClC,SAAS,yBAAyB;AAClC,SAAS,gCAAgC;AACzC,SAAS,2BAA2B;AACpC,SAAS,0BAA0B;AACnC,SAAS,kCAAkC;AAC3C,SAAS,mBAAmB;AAC5B,SAAS,sBAAsB;AAC/B,SAAS,eAAe;AACxB,SAAS,YAAY;AACrB,SAAS,wBAAwB;AAEjC,SAAS,yBAAyB;AAClC,SAAS,yBAAyB;AAClC,SAAS,6BAA6B;AACtC,SAAS,0BAA0B;AACnC,SAAS,mBAAmB;AAC5B,OAAO;AAKP,MAAM,WAAW;AAAA,EACf,CAAC,OAAO,iBAAiB;AACvB,UAAM,CAAC,uBAAuB,IAAI,2BAA2B,KAAK;AAElE,UAAM;AAAA,MACJ;AAAA,MACA,UAAU;AAAA,MACV,OAAO;AAAA,MACP,WAAW;AAAA,MACX,mBAAmB;AAAA,MACnB,oBAAoB;AAAA,MACpB,eAAe;AAAA,MACf;AAAA,MACA;AAAA,MACA,GAAG;AAAA,IACL,IAAI;AACJ,UAAM,EAAE,UAAU,gBAAgB,eAAe,IAAI,YAAY,QAAQ;AAEzE,UAAM;AAAA,MACJ,aAAa;AAAA,MACb;AAAA,MACA;AAAA,IACF,IAAI,kBAAkB,gBAAgB,cAAc;AAEpD,UAAM,SAAS,mBAAmB,UAAU,YAAY;AAExD,UAAM,cAAc,MAAc;AAChC,UAAI,OAAO,UAAU,kBAAkB,OAAO,MAAM,GAAG;AACrD,eAAO,OAAO,OAAO,OAAO,GAAG,EAAE,GAAG,MAAM,aAAa,CAAC;AAAA,MAC1D;AACA,aAAO,aAAa,CAAC;AAAA,IACvB;AAEA,UAAM,UAAU,YAAY;AAE5B,UAAM,iBAAiB,CAAC,OAAO,UAAU,CAAC,CAAC,OAAO,OAAO;AACzD,UAAM,iBAAiB,OAAO,QAAQ;AAEtC,UAAM,cAAc,OAAO,QAAQ;AACnC,UAAM,sBAAsB,OAAO,QAAQ;AAE3C,UAAM,EAAE,cAAc,oBAAoB,uBAAuB,MAAM,IACrE,oBAAoB,OAAO,SAAS;AAEtC,UAAM,CAAC,aAAa,cAAc,IAAI,SAAkB,KAAK;AAC7D,UAAM,EAAE,WAAW,IAAI,sBAAsB,QAAQ;AAErD,UAAM,cAAc,gBAAgB,MAAM,MAAM,KAAK;AAErD,UAAM,kBAAkB,EAAE,OAAO,QAAQ,GAAG,cAAc;AAC1D,UAAM,iBAAiB,qBAAqB,WAAW,KAAK,GAAG,CAAC;AAChE,UAAM,iBAAkB,CAAC,sBAAsB,CAAC,gBAAiB;AAEjE,UAAM,YAAY,sBAAsB,CAAC;AAEzC,WACE;AAAA,MAAC;AAAA;AAAA,QACC,OAAO;AAAA,QACP,WAAW;AAAA,QACX,mBAAiB;AAAA,QACjB,oBAAkB;AAAA,QAClB,eAAa;AAAA,QACb,MAAK;AAAA,QACL,cAAY;AAAA,QACX,GAAG;AAAA;AAAA,QAIF,2BACE;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA,YAAY,CAAC;AAAA,YACb;AAAA,YACA;AAAA;AAAA,QACF,IAEA,oBAAC,kBAAkB,UAAlB,EAA2B,OAAO,SACjC;AAAA,UAAC,4BAA4B;AAAA,UAA5B;AAAA,YACC,OAAO;AAAA,YAEP,8BAAC,wBAAwB,UAAxB,EAAiC,OAAO,QACvC,8BAAC,gBAAgB,UAAhB,EAAyB,OAAO,UAC/B;AAAA,cAAC,yBAAyB;AAAA,cAAzB;AAAA,gBACC,OAAO,kBAAkB;AAAA,gBAEzB,8BAAC,iBAAiB,UAAjB,EAA0B,OAAO,WAChC,8BAAC,kBAAkB,UAAlB,EAA2B,OAAO,YACjC,8BAAC,oBACC;AAAA,kBAAC;AAAA;AAAA,oBACC;AAAA,oBACA;AAAA,oBAEA,8BAAC,8BACC;AAAA,sBAAC;AAAA;AAAA,wBACC,KAAK;AAAA,wBACL;AAAA,wBACA;AAAA,wBACA,YAAY,WAAW;AAAA,wBAEvB;AAAA,8CAAC,YAAY,OAAZ,EACE,mCACC;AAAA,4BAAC;AAAA;AAAA,8BACC,KAAK;AAAA,8BACL,WAAW,MAAM,eAAe,IAAI;AAAA,8BACnC,GAAG;AAAA,8BAEH;AAAA;AAAA,0BACH,GAEJ;AAAA,0BACC,CAAC,kBACA;AAAA,4BAAC,YAAY;AAAA,4BAAZ;AAAA,8BACC,UAAU;AAAA,8BAEV,OAAO;AAAA,8BACP,iBAAiB;AAAA,8BACjB,UAAU;AAAA,8BAEV,8BAAC,qBAAkB;AAAA;AAAA,0BACrB;AAAA;AAAA;AAAA,oBAEJ,GACF;AAAA;AAAA,gBACF,GACF,GACF,GACF;AAAA;AAAA,YACF,GACF,GACF;AAAA;AAAA,QACF,GACF;AAAA;AAAA,IAGN;AAAA,EAEJ;AACF;AAEC,SAAuD,aAAa,IACnE;AAMK,MAAM,UAAU,OAAO,OAAO,UAAU;AAAA,EAC7C,YAAY;AAAA,EACZ;AAAA,EACA;AAAA,EACA;AACF,CAAC;",
+  "sourcesContent": ["import { forwardRef, type PropsWithChildren, useState } from 'react';\n\nimport {\n  _ChartLayout as ChartLayout,\n  _coerceSizeValue as coerceSizeValue,\n  _useAutoLegendRefresh as useAutoLegendRefresh,\n  _OverlayProvider as OverlayProvider,\n  _OverlayTooltipProvider as TooltipProvider,\n} from '@dynatrace/strato-components/charts';\nimport { _useBehavioralTrackingProps as useBehavioralTrackingProps } from '@dynatrace/strato-components/core';\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  MAP_VIEW_ARIA_LABEL,\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 { DownloadCSV } from './slots/DownloadCSV.js';\nimport { ErrorStateSlot } from './slots/states/ErrorStateSlot.js';\nimport { Toolbar } from './slots/Toolbar.js';\nimport { Zoom } from './slots/Zoom.js';\nimport { MapStoreProvider } from './store/map-store.provider.js';\nimport type { MapViewProps, MapViewRef } from './types/map-view.js';\nimport { isThresholdLegend } from './utils/build-scale-from-legend-config.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';\nimport './styles/react-mapgl-styles.css';\n\n/**\n * MapView Component\n */\nconst _MapView = forwardRef<MapViewRef, PropsWithChildren<MapViewProps>>(\n  (props, forwardedRef) => {\n    const [behavioralTrackingProps] = useBehavioralTrackingProps(props);\n\n    const {\n      children,\n      loading = false,\n      style: costumerStyle,\n      className: customerClassNames,\n      'data-dtrum-mask': dataDtrumMask,\n      'data-dtrum-allow': dataDtrumAllow,\n      'data-testid': dataTestId,\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 getMaxRange = (): number => {\n      if (config.legend && isThresholdLegend(config.legend)) {\n        return config.legend.ranges.at(-1)?.to ?? legendDomain[1];\n      }\n      return legendDomain[1];\n    };\n\n    const dataMax = getMaxRange();\n\n    const isLegendHidden = !config.legend || !!config.legend.hidden;\n    const legendPosition = config.legend?.position;\n    // eslint-disable-next-line @typescript-eslint/no-deprecated\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    const chartLayoutRef = useAutoLegendRefresh(categories.join(':'));\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-dtrum-mask={dataDtrumMask}\n        data-dtrum-allow={dataDtrumAllow}\n        data-testid={dataTestId}\n        role=\"img\"\n        aria-label={MAP_VIEW_ARIA_LABEL}\n        {...behavioralTrackingProps}\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                          <OverlayProvider>\n                            <TooltipProvider>\n                              <MapStoreProvider>\n                                <ColorScaleProvider\n                                  categories={categories}\n                                  dataMax={dataMax}\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={() =>\n                                              setIsMapLoaded(true)\n                                            }\n                                            {...remaining}\n                                          >\n                                            {parsedChildren}\n                                          </MapContent>\n                                        )}\n                                      </ChartLayout.Graph>\n                                      {!isLegendHidden && (\n                                        <ChartLayout.Legend\n                                          position={legendPosition}\n                                          // eslint-disable-next-line @typescript-eslint/no-deprecated\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                            </TooltipProvider>\n                          </OverlayProvider>\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  Toolbar,\n  DownloadCSV,\n  Zoom,\n});\n"],
+  "mappings": "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",
   "names": []
 }

package/esm/map/components/BubbleLayer/BubbleLayerTooltip.js

@@ -1,70 +1,38 @@
 import { jsx } from "react/jsx-runtime";
 import { sortBy } from "lodash-es";
-import { useRef } from "react";
-import {
-  _ChartTooltip as ChartTooltip,
-  _useChartActionsMenu as useChartActionsMenu
-} from "@dynatrace/strato-components/charts";
-import { useGetPosition } from "../../hooks/use-get-position.js";
-import {
-  useMapTooltipPinnedState,
-  useMapTooltipState
-} from "../../store/selectors.js";
+import { _OverlayTooltip as OverlayTooltip } from "@dynatrace/strato-components/charts";
+import { useGeoLayerTooltip } from "../../hooks/use-geo-layer-tooltip.js";
+import { isDefaultTooltipHandler } from "../../utils/tooltip-type-guards.js";
 const BubbleLayerTooltip = (props) => {
   const { tooltipTemplate } = props;
-  const {
-    selectedItem: selectedItemId,
-    actionsMenuRef,
-    updateSelectedItem,
-    onLeave
-  } = useChartActionsMenu();
-  const tooltipRef = useRef(null);
-  const { data, visible, enabled } = useMapTooltipState();
-  const pinned = useMapTooltipPinnedState();
-  const closestPoint = useRef(null);
-  const remainingPoints = useRef([]);
-  const forceHideTooltip = !pinned && (!visible || !enabled);
-  const position = useGetPosition(pinned, !forceHideTooltip);
-  if (!tooltipTemplate || forceHideTooltip || !position) {
+  const { data, inBounds, position } = useGeoLayerTooltip("geoBubble");
+  if (!tooltipTemplate || !inBounds || !position) {
     return null;
   }
-  if (data?.[0]) {
-    const sanitizedData = data.map((bubbleProps) => {
-      const {
-        __color: color,
-        __radius: radius,
-        data: customData
-      } = bubbleProps;
-      return {
-        color,
-        radius,
-        data: customData
-      };
-    });
-    const sortedBubbles = sortBy(sanitizedData, ({ radius }) => radius);
-    closestPoint.current = sortedBubbles[0];
-    remainingPoints.current = sortedBubbles.slice(1);
+  if (!data || !data[0]) {
+    return null;
   }
-  const template = closestPoint.current ? tooltipTemplate(closestPoint.current, remainingPoints.current) : null;
+  const sanitizedData = data.map((bubbleProps) => {
+    const { __color: color, __radius: radius, data: customData } = bubbleProps;
+    return {
+      color,
+      radius,
+      data: customData
+    };
+  });
+  const sortedBubbles = [
+    ...sortBy(sanitizedData, ({ radius }) => radius)
+  ];
+  const closestPoint = sortedBubbles[0];
+  const remainingPoints = sortedBubbles.slice(1);
+  const template = closestPoint ? tooltipTemplate(closestPoint, remainingPoints) : null;
   if (!template) {
     return null;
   }
-  return /* @__PURE__ */ jsx(
-    ChartTooltip,
-    {
-      updatePositionWhenPinned: true,
-      position,
-      pinned,
-      ref: tooltipRef,
-      onMouseLeave: onLeave,
-      actionSelectionValue: {
-        selectedItemId,
-        actionsMenuRef,
-        updateSelectedItem
-      },
-      children: template
-    }
-  );
+  if (isDefaultTooltipHandler(tooltipTemplate)) {
+    return template;
+  }
+  return /* @__PURE__ */ jsx(OverlayTooltip, { legacyTemplate: template });
 };
 BubbleLayerTooltip["displayName"] = "BubbleLayerTooltip";
 export {

package/esm/map/components/BubbleLayer/BubbleLayerTooltip.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/map/components/BubbleLayer/BubbleLayerTooltip.tsx"],
-  "sourcesContent": ["import { sortBy } from 'lodash-es';\nimport { useRef } from 'react';\n\nimport {\n  _ChartTooltip as ChartTooltip,\n  _useChartActionsMenu as useChartActionsMenu,\n} from '@dynatrace/strato-components/charts';\n\nimport { useGetPosition } from '../../hooks/use-get-position.js';\nimport {\n  useMapTooltipPinnedState,\n  useMapTooltipState,\n} from '../../store/selectors.js';\nimport type { Location } from '../../types/location.js';\nimport type {\n  BubbleLayerTooltipData,\n  BubbleLayerTooltipHandler,\n} from '../../types/tooltip.js';\n\ninterface BubbleTooltipStatePayload {\n  __color: string;\n  __hoveredColor: string;\n  __radius: number;\n  __lat: number;\n  data: Location;\n}\n\nexport interface BubbleLayerTooltipProps {\n  tooltipTemplate?: BubbleLayerTooltipHandler;\n}\n\nexport const BubbleLayerTooltip = (props: BubbleLayerTooltipProps) => {\n  const { tooltipTemplate } = props;\n  const {\n    selectedItem: selectedItemId,\n    actionsMenuRef,\n    updateSelectedItem,\n    onLeave,\n  } = useChartActionsMenu();\n  const tooltipRef = useRef<HTMLDivElement | null>(null);\n  const { data, visible, enabled } =\n    useMapTooltipState<BubbleTooltipStatePayload>();\n\n  const pinned = useMapTooltipPinnedState();\n  const closestPoint = useRef<BubbleLayerTooltipData | null>(null);\n  const remainingPoints = useRef<BubbleLayerTooltipData[]>([]);\n\n  const forceHideTooltip = !pinned && (!visible || !enabled);\n\n  const position = useGetPosition(pinned, !forceHideTooltip);\n  if (!tooltipTemplate || forceHideTooltip || !position) {\n    return null;\n  }\n\n  if (data?.[0]) {\n    const sanitizedData = data.map((bubbleProps) => {\n      const {\n        __color: color,\n        __radius: radius,\n        data: customData,\n      } = bubbleProps;\n\n      return {\n        color,\n        radius,\n        data: customData,\n      };\n    });\n\n    const sortedBubbles = sortBy(sanitizedData, ({ radius }) => radius);\n    closestPoint.current = sortedBubbles[0];\n    remainingPoints.current = sortedBubbles.slice(1);\n  }\n  const template = closestPoint.current\n    ? tooltipTemplate(closestPoint.current, remainingPoints.current)\n    : null;\n\n  if (!template) {\n    return null;\n  }\n\n  return (\n    <ChartTooltip\n      updatePositionWhenPinned\n      position={position}\n      pinned={pinned}\n      ref={tooltipRef}\n      onMouseLeave={onLeave}\n      actionSelectionValue={{\n        selectedItemId,\n        actionsMenuRef,\n        updateSelectedItem,\n      }}\n    >\n      {template}\n    </ChartTooltip>\n  );\n};\n\nBubbleLayerTooltip['displayName'] = 'BubbleLayerTooltip';\n"],
-  "mappings": "AAkFI;AAlFJ,SAAS,cAAc;AACvB,SAAS,cAAc;AAEvB;AAAA,EACE,iBAAiB;AAAA,EACjB,wBAAwB;AAAA,OACnB;AAEP,SAAS,sBAAsB;AAC/B;AAAA,EACE;AAAA,EACA;AAAA,OACK;AAmBA,MAAM,qBAAqB,CAAC,UAAmC;AACpE,QAAM,EAAE,gBAAgB,IAAI;AAC5B,QAAM;AAAA,IACJ,cAAc;AAAA,IACd;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,oBAAoB;AACxB,QAAM,aAAa,OAA8B,IAAI;AACrD,QAAM,EAAE,MAAM,SAAS,QAAQ,IAC7B,mBAA8C;AAEhD,QAAM,SAAS,yBAAyB;AACxC,QAAM,eAAe,OAAsC,IAAI;AAC/D,QAAM,kBAAkB,OAAiC,CAAC,CAAC;AAE3D,QAAM,mBAAmB,CAAC,WAAW,CAAC,WAAW,CAAC;AAElD,QAAM,WAAW,eAAe,QAAQ,CAAC,gBAAgB;AACzD,MAAI,CAAC,mBAAmB,oBAAoB,CAAC,UAAU;AACrD,WAAO;AAAA,EACT;AAEA,MAAI,OAAO,CAAC,GAAG;AACb,UAAM,gBAAgB,KAAK,IAAI,CAAC,gBAAgB;AAC9C,YAAM;AAAA,QACJ,SAAS;AAAA,QACT,UAAU;AAAA,QACV,MAAM;AAAA,MACR,IAAI;AAEJ,aAAO;AAAA,QACL;AAAA,QACA;AAAA,QACA,MAAM;AAAA,MACR;AAAA,IACF,CAAC;AAED,UAAM,gBAAgB,OAAO,eAAe,CAAC,EAAE,OAAO,MAAM,MAAM;AAClE,iBAAa,UAAU,cAAc,CAAC;AACtC,oBAAgB,UAAU,cAAc,MAAM,CAAC;AAAA,EACjD;AACA,QAAM,WAAW,aAAa,UAC1B,gBAAgB,aAAa,SAAS,gBAAgB,OAAO,IAC7D;AAEJ,MAAI,CAAC,UAAU;AACb,WAAO;AAAA,EACT;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,0BAAwB;AAAA,MACxB;AAAA,MACA;AAAA,MACA,KAAK;AAAA,MACL,cAAc;AAAA,MACd,sBAAsB;AAAA,QACpB;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,MAEC;AAAA;AAAA,EACH;AAEJ;AAEA,mBAAmB,aAAa,IAAI;",
+  "sourcesContent": ["import { sortBy } from 'lodash-es';\n\nimport { _OverlayTooltip as OverlayTooltip } from '@dynatrace/strato-components/charts';\n\nimport { useGeoLayerTooltip } from '../../hooks/use-geo-layer-tooltip.js';\nimport type { Location } from '../../types/location.js';\nimport type {\n  BubbleLayerTooltipData,\n  BubbleLayerTooltipHandler,\n} from '../../types/tooltip.js';\nimport { isDefaultTooltipHandler } from '../../utils/tooltip-type-guards.js';\n\ninterface BubbleTooltipStatePayload {\n  __color: string;\n  __hoveredColor: string;\n  __radius: number;\n  __lat: number;\n  data: Location;\n}\n\nexport interface BubbleLayerTooltipProps {\n  tooltipTemplate?: BubbleLayerTooltipHandler;\n}\n\nexport const BubbleLayerTooltip = (props: BubbleLayerTooltipProps) => {\n  const { tooltipTemplate } = props;\n\n  const { data, inBounds, position } =\n    useGeoLayerTooltip<BubbleTooltipStatePayload>('geoBubble');\n\n  if (!tooltipTemplate || !inBounds || !position) {\n    return null;\n  }\n\n  if (!data || !data[0]) {\n    return null;\n  }\n\n  const sanitizedData: BubbleLayerTooltipData[] = data.map((bubbleProps) => {\n    const { __color: color, __radius: radius, data: customData } = bubbleProps;\n\n    return {\n      color,\n      radius,\n      data: customData,\n    };\n  });\n\n  const sortedBubbles: BubbleLayerTooltipData[] = [\n    ...sortBy(sanitizedData, ({ radius }) => radius),\n  ];\n  const closestPoint = sortedBubbles[0];\n  const remainingPoints = sortedBubbles.slice(1);\n\n  const template = closestPoint\n    ? tooltipTemplate(closestPoint, remainingPoints)\n    : null;\n\n  if (!template) {\n    return null;\n  }\n\n  if (isDefaultTooltipHandler(tooltipTemplate)) {\n    return template;\n  }\n\n  return <OverlayTooltip legacyTemplate={template} />;\n};\n\nBubbleLayerTooltip['displayName'] = 'BubbleLayerTooltip';\n"],
+  "mappings": "AAkES;AAlET,SAAS,cAAc;AAEvB,SAAS,mBAAmB,sBAAsB;AAElD,SAAS,0BAA0B;AAMnC,SAAS,+BAA+B;AAcjC,MAAM,qBAAqB,CAAC,UAAmC;AACpE,QAAM,EAAE,gBAAgB,IAAI;AAE5B,QAAM,EAAE,MAAM,UAAU,SAAS,IAC/B,mBAA8C,WAAW;AAE3D,MAAI,CAAC,mBAAmB,CAAC,YAAY,CAAC,UAAU;AAC9C,WAAO;AAAA,EACT;AAEA,MAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,GAAG;AACrB,WAAO;AAAA,EACT;AAEA,QAAM,gBAA0C,KAAK,IAAI,CAAC,gBAAgB;AACxE,UAAM,EAAE,SAAS,OAAO,UAAU,QAAQ,MAAM,WAAW,IAAI;AAE/D,WAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA,MAAM;AAAA,IACR;AAAA,EACF,CAAC;AAED,QAAM,gBAA0C;AAAA,IAC9C,GAAG,OAAO,eAAe,CAAC,EAAE,OAAO,MAAM,MAAM;AAAA,EACjD;AACA,QAAM,eAAe,cAAc,CAAC;AACpC,QAAM,kBAAkB,cAAc,MAAM,CAAC;AAE7C,QAAM,WAAW,eACb,gBAAgB,cAAc,eAAe,IAC7C;AAEJ,MAAI,CAAC,UAAU;AACb,WAAO;AAAA,EACT;AAEA,MAAI,wBAAwB,eAAe,GAAG;AAC5C,WAAO;AAAA,EACT;AAEA,SAAO,oBAAC,kBAAe,gBAAgB,UAAU;AACnD;AAEA,mBAAmB,aAAa,IAAI;",
   "names": []
 }

package/esm/map/components/ChoroplethLayer/ChoroplethLayerTooltip.js

@@ -1,53 +1,30 @@
 import { jsx } from "react/jsx-runtime";
-import { useRef } from "react";
-import {
-  _ChartTooltip as ChartTooltip,
-  _useChartActionsMenu as useChartActionsMenu
-} from "@dynatrace/strato-components/charts";
-import { useGetPosition } from "../../hooks/use-get-position.js";
-import {
-  useMapTooltipPinnedState,
-  useMapTooltipState
-} from "../../store/selectors.js";
+import { _OverlayTooltip as OverlayTooltip } from "@dynatrace/strato-components/charts";
+import { useGeoLayerTooltip } from "../../hooks/use-geo-layer-tooltip.js";
+import { isDefaultTooltipHandler } from "../../utils/tooltip-type-guards.js";
 const ChoroplethLayerTooltip = (props) => {
   const { tooltipTemplate } = props;
-  const {
-    selectedItem: selectedItemId,
-    actionsMenuRef,
-    updateSelectedItem,
-    onLeave
-  } = useChartActionsMenu();
-  const { data, visible, enabled } = useMapTooltipState();
-  const pinned = useMapTooltipPinnedState();
-  const regionData = useRef(null);
-  const forceHideTooltip = !pinned && (!visible || !enabled);
-  const position = useGetPosition(pinned, !forceHideTooltip);
-  if (!tooltipTemplate || forceHideTooltip || !position) {
+  const { data, inBounds, position } = useGeoLayerTooltip("geoChoropleth");
+  if (!tooltipTemplate || !inBounds || !position) {
     return null;
   }
-  if (data?.[0]) {
-    const { name, __color: color, data: customData } = data[0];
-    regionData.current = { data: customData, name, color };
+  if (!data || !data[0]) {
+    return null;
   }
-  const template = regionData.current && tooltipTemplate(regionData.current);
+  const { name, __color: color, data: customData } = data[0];
+  const regionData = {
+    data: customData,
+    name,
+    color
+  };
+  const template = tooltipTemplate(regionData);
   if (!template) {
     return null;
   }
-  return /* @__PURE__ */ jsx(
-    ChartTooltip,
-    {
-      updatePositionWhenPinned: true,
-      position,
-      pinned,
-      onMouseLeave: onLeave,
-      actionSelectionValue: {
-        selectedItemId,
-        actionsMenuRef,
-        updateSelectedItem
-      },
-      children: template
-    }
-  );
+  if (isDefaultTooltipHandler(tooltipTemplate)) {
+    return template;
+  }
+  return /* @__PURE__ */ jsx(OverlayTooltip, { legacyTemplate: template });
 };
 ChoroplethLayerTooltip["displayName"] = "ChoroplethLayerTooltip";
 export {

package/esm/map/components/ChoroplethLayer/ChoroplethLayerTooltip.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/map/components/ChoroplethLayer/ChoroplethLayerTooltip.tsx"],
-  "sourcesContent": ["import { useRef } from 'react';\n\nimport {\n  _ChartTooltip as ChartTooltip,\n  _useChartActionsMenu as useChartActionsMenu,\n} from '@dynatrace/strato-components/charts';\n\nimport { useGetPosition } from '../../hooks/use-get-position.js';\nimport {\n  useMapTooltipPinnedState,\n  useMapTooltipState,\n} from '../../store/selectors.js';\nimport type {\n  ChoroplethLayerTooltipData,\n  ChoroplethLayerTooltipHandler,\n} from '../../types/tooltip.js';\n\ninterface ChoroplethTooltipStatePayload {\n  name: string;\n  __color: string;\n  __hoveredColor: string;\n  data: Record<string, unknown>;\n}\n\nexport interface ChoroplethLayerTooltipProps {\n  tooltipTemplate?: ChoroplethLayerTooltipHandler;\n}\n\nexport const ChoroplethLayerTooltip = (props: ChoroplethLayerTooltipProps) => {\n  const { tooltipTemplate } = props;\n  const {\n    selectedItem: selectedItemId,\n    actionsMenuRef,\n    updateSelectedItem,\n    onLeave,\n  } = useChartActionsMenu();\n\n  const { data, visible, enabled } =\n    useMapTooltipState<ChoroplethTooltipStatePayload>();\n  const pinned = useMapTooltipPinnedState();\n  const regionData = useRef<ChoroplethLayerTooltipData | null>(null);\n\n  const forceHideTooltip = !pinned && (!visible || !enabled);\n  const position = useGetPosition(pinned, !forceHideTooltip);\n  if (!tooltipTemplate || forceHideTooltip || !position) {\n    return null;\n  }\n\n  if (data?.[0]) {\n    const { name, __color: color, data: customData } = data[0];\n\n    regionData.current = { data: customData, name, color };\n  }\n  const template = regionData.current && tooltipTemplate(regionData.current);\n\n  if (!template) {\n    return null;\n  }\n\n  return (\n    <ChartTooltip\n      updatePositionWhenPinned\n      position={position}\n      pinned={pinned}\n      onMouseLeave={onLeave}\n      actionSelectionValue={{\n        selectedItemId,\n        actionsMenuRef,\n        updateSelectedItem,\n      }}\n    >\n      {template}\n    </ChartTooltip>\n  );\n};\n\nChoroplethLayerTooltip['displayName'] = 'ChoroplethLayerTooltip';\n"],
-  "mappings": "AA4DI;AA5DJ,SAAS,cAAc;AAEvB;AAAA,EACE,iBAAiB;AAAA,EACjB,wBAAwB;AAAA,OACnB;AAEP,SAAS,sBAAsB;AAC/B;AAAA,EACE;AAAA,EACA;AAAA,OACK;AAiBA,MAAM,yBAAyB,CAAC,UAAuC;AAC5E,QAAM,EAAE,gBAAgB,IAAI;AAC5B,QAAM;AAAA,IACJ,cAAc;AAAA,IACd;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,oBAAoB;AAExB,QAAM,EAAE,MAAM,SAAS,QAAQ,IAC7B,mBAAkD;AACpD,QAAM,SAAS,yBAAyB;AACxC,QAAM,aAAa,OAA0C,IAAI;AAEjE,QAAM,mBAAmB,CAAC,WAAW,CAAC,WAAW,CAAC;AAClD,QAAM,WAAW,eAAe,QAAQ,CAAC,gBAAgB;AACzD,MAAI,CAAC,mBAAmB,oBAAoB,CAAC,UAAU;AACrD,WAAO;AAAA,EACT;AAEA,MAAI,OAAO,CAAC,GAAG;AACb,UAAM,EAAE,MAAM,SAAS,OAAO,MAAM,WAAW,IAAI,KAAK,CAAC;AAEzD,eAAW,UAAU,EAAE,MAAM,YAAY,MAAM,MAAM;AAAA,EACvD;AACA,QAAM,WAAW,WAAW,WAAW,gBAAgB,WAAW,OAAO;AAEzE,MAAI,CAAC,UAAU;AACb,WAAO;AAAA,EACT;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,0BAAwB;AAAA,MACxB;AAAA,MACA;AAAA,MACA,cAAc;AAAA,MACd,sBAAsB;AAAA,QACpB;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,MAEC;AAAA;AAAA,EACH;AAEJ;AAEA,uBAAuB,aAAa,IAAI;",
+  "sourcesContent": ["import { _OverlayTooltip as OverlayTooltip } from '@dynatrace/strato-components/charts';\n\nimport { useGeoLayerTooltip } from '../../hooks/use-geo-layer-tooltip.js';\nimport type {\n  ChoroplethLayerTooltipData,\n  ChoroplethLayerTooltipHandler,\n} from '../../types/tooltip.js';\nimport { isDefaultTooltipHandler } from '../../utils/tooltip-type-guards.js';\n\ninterface ChoroplethTooltipStatePayload {\n  name: string;\n  __color: string;\n  __hoveredColor: string;\n  data: Record<string, unknown>;\n}\n\nexport interface ChoroplethLayerTooltipProps {\n  tooltipTemplate?: ChoroplethLayerTooltipHandler;\n}\n\nexport const ChoroplethLayerTooltip = (props: ChoroplethLayerTooltipProps) => {\n  const { tooltipTemplate } = props;\n\n  const { data, inBounds, position } =\n    useGeoLayerTooltip<ChoroplethTooltipStatePayload>('geoChoropleth');\n\n  if (!tooltipTemplate || !inBounds || !position) {\n    return null;\n  }\n\n  if (!data || !data[0]) {\n    return null;\n  }\n\n  const { name, __color: color, data: customData } = data[0];\n  const regionData: ChoroplethLayerTooltipData = {\n    data: customData,\n    name,\n    color,\n  };\n\n  const template = tooltipTemplate(regionData);\n\n  if (!template) {\n    return null;\n  }\n\n  if (isDefaultTooltipHandler(tooltipTemplate)) {\n    return template;\n  }\n\n  return <OverlayTooltip legacyTemplate={template} />;\n};\n\nChoroplethLayerTooltip['displayName'] = 'ChoroplethLayerTooltip';\n"],
+  "mappings": "AAmDS;AAnDT,SAAS,mBAAmB,sBAAsB;AAElD,SAAS,0BAA0B;AAKnC,SAAS,+BAA+B;AAajC,MAAM,yBAAyB,CAAC,UAAuC;AAC5E,QAAM,EAAE,gBAAgB,IAAI;AAE5B,QAAM,EAAE,MAAM,UAAU,SAAS,IAC/B,mBAAkD,eAAe;AAEnE,MAAI,CAAC,mBAAmB,CAAC,YAAY,CAAC,UAAU;AAC9C,WAAO;AAAA,EACT;AAEA,MAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,GAAG;AACrB,WAAO;AAAA,EACT;AAEA,QAAM,EAAE,MAAM,SAAS,OAAO,MAAM,WAAW,IAAI,KAAK,CAAC;AACzD,QAAM,aAAyC;AAAA,IAC7C,MAAM;AAAA,IACN;AAAA,IACA;AAAA,EACF;AAEA,QAAM,WAAW,gBAAgB,UAAU;AAE3C,MAAI,CAAC,UAAU;AACb,WAAO;AAAA,EACT;AAEA,MAAI,wBAAwB,eAAe,GAAG;AAC5C,WAAO;AAAA,EACT;AAEA,SAAO,oBAAC,kBAAe,gBAAgB,UAAU;AACnD;AAEA,uBAAuB,aAAa,IAAI;",
   "names": []
 }

package/esm/map/components/ConnectionLayer/ConnectionLayerTooltip.js

@@ -1,61 +1,36 @@
 import { jsx } from "react/jsx-runtime";
-import { useRef } from "react";
-import {
-  _ChartTooltip as ChartTooltip,
-  _useChartActionsMenu as useChartActionsMenu
-} from "@dynatrace/strato-components/charts";
+import { _OverlayTooltip as OverlayTooltip } from "@dynatrace/strato-components/charts";
 import { restoreNullProps } from "./utils/restore-null-props.js";
-import { useGetPosition } from "../../hooks/use-get-position.js";
-import {
-  useMapTooltipPinnedState,
-  useMapTooltipState
-} from "../../store/selectors.js";
+import { useGeoLayerTooltip } from "../../hooks/use-geo-layer-tooltip.js";
+import { isDefaultTooltipHandler } from "../../utils/tooltip-type-guards.js";
 const ConnectionLayerTooltip = (props) => {
   const { tooltipTemplate } = props;
   const {
-    selectedItem: selectedItemId,
-    actionsMenuRef,
-    updateSelectedItem,
-    onLeave
-  } = useChartActionsMenu();
-  const {
-    data: dataWithoutNullProps,
-    visible,
-    enabled
-  } = useMapTooltipState();
-  const pinned = useMapTooltipPinnedState();
-  const data = restoreNullProps(dataWithoutNullProps);
-  const connectionData = useRef(
-    null
-  );
-  const forceHideTooltip = !pinned && (!visible || !enabled);
-  const position = useGetPosition(pinned, !forceHideTooltip);
-  if (!tooltipTemplate || forceHideTooltip || !position) {
+    data: rawData,
+    inBounds,
+    position
+  } = useGeoLayerTooltip("geoConnection");
+  const data = restoreNullProps(rawData);
+  if (!tooltipTemplate || !inBounds || !position) {
     return null;
   }
-  if (data?.[0]) {
-    const { __lineColor: color, __lineWidth: thickness, ...rest } = data[0];
-    connectionData.current = { color, thickness, data: rest };
+  if (!data || !data[0]) {
+    return null;
   }
-  const template = connectionData.current && tooltipTemplate(connectionData.current);
+  const { __lineColor: color, __lineWidth: thickness, ...rest } = data[0];
+  const connectionData = {
+    color,
+    thickness,
+    data: rest
+  };
+  const template = tooltipTemplate(connectionData);
   if (!template) {
     return null;
   }
-  return /* @__PURE__ */ jsx(
-    ChartTooltip,
-    {
-      updatePositionWhenPinned: true,
-      position,
-      pinned,
-      onMouseLeave: onLeave,
-      actionSelectionValue: {
-        selectedItemId,
-        actionsMenuRef,
-        updateSelectedItem
-      },
-      children: template
-    }
-  );
+  if (isDefaultTooltipHandler(tooltipTemplate)) {
+    return template;
+  }
+  return /* @__PURE__ */ jsx(OverlayTooltip, { legacyTemplate: template });
 };
 ConnectionLayerTooltip["displayName"] = "ConnectionLayerTooltip";
 export {

package/esm/map/components/ConnectionLayer/ConnectionLayerTooltip.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/map/components/ConnectionLayer/ConnectionLayerTooltip.tsx"],
-  "sourcesContent": ["import { useRef } from 'react';\n\nimport {\n  _ChartTooltip as ChartTooltip,\n  _useChartActionsMenu as useChartActionsMenu,\n} from '@dynatrace/strato-components/charts';\n\nimport { restoreNullProps } from './utils/restore-null-props.js';\nimport { useGetPosition } from '../../hooks/use-get-position.js';\nimport {\n  useMapTooltipPinnedState,\n  useMapTooltipState,\n} from '../../store/selectors.js';\nimport type {\n  Connection,\n  ConnectionTooltipStatePayload,\n} from '../../types/connection-layer.js';\nimport type {\n  ConnectionLayerTooltipData,\n  ConnectionLayerTooltipHandler,\n} from '../../types/tooltip.js';\n\nexport interface ConnectionLayerTooltipProps {\n  tooltipTemplate?: ConnectionLayerTooltipHandler;\n}\n\nexport const ConnectionLayerTooltip = (props: ConnectionLayerTooltipProps) => {\n  const { tooltipTemplate } = props;\n  const {\n    selectedItem: selectedItemId,\n    actionsMenuRef,\n    updateSelectedItem,\n    onLeave,\n  } = useChartActionsMenu();\n\n  const {\n    data: dataWithoutNullProps,\n    visible,\n    enabled,\n  } = useMapTooltipState<ConnectionTooltipStatePayload>();\n  const pinned = useMapTooltipPinnedState();\n\n  const data = restoreNullProps(dataWithoutNullProps);\n\n  const connectionData = useRef<ConnectionLayerTooltipData<Connection> | null>(\n    null,\n  );\n\n  const forceHideTooltip = !pinned && (!visible || !enabled);\n  const position = useGetPosition(pinned, !forceHideTooltip);\n\n  if (!tooltipTemplate || forceHideTooltip || !position) {\n    return null;\n  }\n\n  if (data?.[0]) {\n    const { __lineColor: color, __lineWidth: thickness, ...rest } = data[0];\n\n    connectionData.current = { color, thickness, data: rest };\n  }\n\n  const template =\n    connectionData.current && tooltipTemplate(connectionData.current);\n\n  if (!template) {\n    return null;\n  }\n\n  return (\n    <ChartTooltip\n      updatePositionWhenPinned\n      position={position}\n      pinned={pinned}\n      onMouseLeave={onLeave}\n      actionSelectionValue={{\n        selectedItemId,\n        actionsMenuRef,\n        updateSelectedItem,\n      }}\n    >\n      {template}\n    </ChartTooltip>\n  );\n};\n\nConnectionLayerTooltip['displayName'] = 'ConnectionLayerTooltip';\n"],
-  "mappings": "AAqEI;AArEJ,SAAS,cAAc;AAEvB;AAAA,EACE,iBAAiB;AAAA,EACjB,wBAAwB;AAAA,OACnB;AAEP,SAAS,wBAAwB;AACjC,SAAS,sBAAsB;AAC/B;AAAA,EACE;AAAA,EACA;AAAA,OACK;AAcA,MAAM,yBAAyB,CAAC,UAAuC;AAC5E,QAAM,EAAE,gBAAgB,IAAI;AAC5B,QAAM;AAAA,IACJ,cAAc;AAAA,IACd;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,oBAAoB;AAExB,QAAM;AAAA,IACJ,MAAM;AAAA,IACN;AAAA,IACA;AAAA,EACF,IAAI,mBAAkD;AACtD,QAAM,SAAS,yBAAyB;AAExC,QAAM,OAAO,iBAAiB,oBAAoB;AAElD,QAAM,iBAAiB;AAAA,IACrB;AAAA,EACF;AAEA,QAAM,mBAAmB,CAAC,WAAW,CAAC,WAAW,CAAC;AAClD,QAAM,WAAW,eAAe,QAAQ,CAAC,gBAAgB;AAEzD,MAAI,CAAC,mBAAmB,oBAAoB,CAAC,UAAU;AACrD,WAAO;AAAA,EACT;AAEA,MAAI,OAAO,CAAC,GAAG;AACb,UAAM,EAAE,aAAa,OAAO,aAAa,WAAW,GAAG,KAAK,IAAI,KAAK,CAAC;AAEtE,mBAAe,UAAU,EAAE,OAAO,WAAW,MAAM,KAAK;AAAA,EAC1D;AAEA,QAAM,WACJ,eAAe,WAAW,gBAAgB,eAAe,OAAO;AAElE,MAAI,CAAC,UAAU;AACb,WAAO;AAAA,EACT;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,0BAAwB;AAAA,MACxB;AAAA,MACA;AAAA,MACA,cAAc;AAAA,MACd,sBAAsB;AAAA,QACpB;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,MAEC;AAAA;AAAA,EACH;AAEJ;AAEA,uBAAuB,aAAa,IAAI;",
+  "sourcesContent": ["import { _OverlayTooltip as OverlayTooltip } from '@dynatrace/strato-components/charts';\n\nimport { restoreNullProps } from './utils/restore-null-props.js';\nimport { useGeoLayerTooltip } from '../../hooks/use-geo-layer-tooltip.js';\nimport type {\n  Connection,\n  ConnectionTooltipStatePayload,\n} from '../../types/connection-layer.js';\nimport type {\n  ConnectionLayerTooltipData,\n  ConnectionLayerTooltipHandler,\n} from '../../types/tooltip.js';\nimport { isDefaultTooltipHandler } from '../../utils/tooltip-type-guards.js';\n\nexport interface ConnectionLayerTooltipProps {\n  tooltipTemplate?: ConnectionLayerTooltipHandler;\n}\n\nexport const ConnectionLayerTooltip = (props: ConnectionLayerTooltipProps) => {\n  const { tooltipTemplate } = props;\n\n  const {\n    data: rawData,\n    inBounds,\n    position,\n  } = useGeoLayerTooltip<ConnectionTooltipStatePayload>('geoConnection');\n\n  const data = restoreNullProps(rawData);\n\n  if (!tooltipTemplate || !inBounds || !position) {\n    return null;\n  }\n\n  if (!data || !data[0]) {\n    return null;\n  }\n\n  const { __lineColor: color, __lineWidth: thickness, ...rest } = data[0];\n  const connectionData: ConnectionLayerTooltipData<Connection> = {\n    color,\n    thickness,\n    data: rest as Connection,\n  };\n\n  const template = tooltipTemplate(connectionData);\n\n  if (!template) {\n    return null;\n  }\n\n  if (isDefaultTooltipHandler(tooltipTemplate)) {\n    return template;\n  }\n\n  return <OverlayTooltip legacyTemplate={template} />;\n};\n\nConnectionLayerTooltip['displayName'] = 'ConnectionLayerTooltip';\n"],
+  "mappings": "AAsDS;AAtDT,SAAS,mBAAmB,sBAAsB;AAElD,SAAS,wBAAwB;AACjC,SAAS,0BAA0B;AASnC,SAAS,+BAA+B;AAMjC,MAAM,yBAAyB,CAAC,UAAuC;AAC5E,QAAM,EAAE,gBAAgB,IAAI;AAE5B,QAAM;AAAA,IACJ,MAAM;AAAA,IACN;AAAA,IACA;AAAA,EACF,IAAI,mBAAkD,eAAe;AAErE,QAAM,OAAO,iBAAiB,OAAO;AAErC,MAAI,CAAC,mBAAmB,CAAC,YAAY,CAAC,UAAU;AAC9C,WAAO;AAAA,EACT;AAEA,MAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,GAAG;AACrB,WAAO;AAAA,EACT;AAEA,QAAM,EAAE,aAAa,OAAO,aAAa,WAAW,GAAG,KAAK,IAAI,KAAK,CAAC;AACtE,QAAM,iBAAyD;AAAA,IAC7D;AAAA,IACA;AAAA,IACA,MAAM;AAAA,EACR;AAEA,QAAM,WAAW,gBAAgB,cAAc;AAE/C,MAAI,CAAC,UAAU;AACb,WAAO;AAAA,EACT;AAEA,MAAI,wBAAwB,eAAe,GAAG;AAC5C,WAAO;AAAA,EACT;AAEA,SAAO,oBAAC,kBAAe,gBAAgB,UAAU;AACnD;AAEA,uBAAuB,aAAa,IAAI;",
   "names": []
 }

package/esm/map/components/DefaultTooltip/DefaultTooltip.js

@@ -1,7 +1,12 @@
-import { jsx } from "react/jsx-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { isNil } from "lodash-es";
-import { _ChartTooltip as ChartTooltip } from "@dynatrace/strato-components/charts";
-import { getDefaultActions } from "./utils/get-default-actions.js";
+import {
+  _OverlayTooltip as OverlayTooltip,
+  _useDefaultConfig as useDefaultConfig,
+  _useDefaultLabels as useDefaultLabels
+} from "@dynatrace/strato-components/charts";
+import Colors from "@dynatrace/strato-design-tokens/colors";
+import { LocationMarkerFilledIcon } from "@dynatrace/strato-icons";
 import { useTruncationMode } from "../../hooks/use-truncation-mode.js";
 import { isConnection, isRegion } from "../../utils/tooltip-type-guards.js";
 const isChoroplethTooltip = (props) => isRegion(props.closestPoint);
@@ -9,19 +14,24 @@ const isConnectionTooltip = (props) => isConnection(props.closestPoint);
 const isBubbleTooltip = (props) => !isNil(props.layerData);
 const isDotTooltip = (props) => true;
 const DefaultTooltip = (props) => {
-  let locations = [];
+  const defaultConfig = useDefaultConfig();
+  const getLabel = useDefaultLabels();
   const truncationMode = useTruncationMode();
+  let locations = [];
   if (isChoroplethTooltip(props)) {
-    const { closestPoint } = props;
-    return /* @__PURE__ */ jsx(ChartTooltip.Body, { "data-testid": "default-tooltip-template", children: /* @__PURE__ */ jsx(
-      ChartTooltip.SeriesItem,
-      {
-        color: closestPoint.color,
-        name: closestPoint.name,
-        truncationMode,
-        value: closestPoint.data.value && closestPoint.data.value.toString() ? closestPoint.data.value.toString() : void 0
-      }
-    ) });
+    const { closestPoint, seriesActions } = props;
+    return /* @__PURE__ */ jsxs(OverlayTooltip, { truncation: truncationMode, children: [
+      /* @__PURE__ */ jsx(OverlayTooltip.SeriesHeader, { valueLabel: "" }),
+      /* @__PURE__ */ jsx(
+        OverlayTooltip.SeriesItem,
+        {
+          color: closestPoint.color,
+          name: closestPoint.name,
+          value: closestPoint.data.value?.toString() ?? "",
+          actions: seriesActions ? () => seriesActions(closestPoint) : void 0
+        }
+      )
+    ] });
   } else if (isConnectionTooltip(props)) {
     locations = props.closestPoint.data.path;
   } else if (isBubbleTooltip(props)) {
@@ -30,22 +40,53 @@ const DefaultTooltip = (props) => {
   } else if (isDotTooltip(props)) {
     locations = [props.closestPoint.data];
   }
-  return /* @__PURE__ */ jsx(
-    ChartTooltip.Body,
-    {
-      "data-testid": "default-tooltip-template",
-      virtualization: false,
-      children: locations.map((location) => /* @__PURE__ */ jsx(
-        ChartTooltip.GeoItem,
-        {
-          latitude: location.latitude,
-          longitude: location.longitude,
-          defaultActions: getDefaultActions(location)
-        },
-        `${location.latitude}-${location.longitude}`
-      ))
+  const seriesLabel = getLabel?.("seriesLabel") ?? "";
+  const variant = defaultConfig?.sharedVariant ? "shared" : "single";
+  const seriesData = locations.map((location) => ({
+    name: `${location.latitude}, ${location.longitude}`,
+    value: ""
+  }));
+  const getActionsForItem = (current) => {
+    if (props.actionsForItem) {
+      return props.actionsForItem(current);
+    }
+    const { seriesActions: actions } = props;
+    if (!actions || !locations.length) {
+      return void 0;
     }
-  );
+    const location = locations.find(
+      (l) => `${l.latitude}, ${l.longitude}` === current.name
+    );
+    return location ? () => actions(location) : void 0;
+  };
+  return /* @__PURE__ */ jsxs(OverlayTooltip, { truncation: truncationMode, children: [
+    /* @__PURE__ */ jsx(OverlayTooltip.Header, { header1: seriesLabel }),
+    /* @__PURE__ */ jsx(OverlayTooltip.SeriesHeader, { disabled: true }),
+    /* @__PURE__ */ jsx(
+      OverlayTooltip.Series,
+      {
+        activeItem: 0,
+        data: seriesData,
+        variant,
+        seriesItemTemplate: (current) => /* @__PURE__ */ jsx(
+          OverlayTooltip.SeriesItem,
+          {
+            ...current,
+            iconStyle: "large",
+            actions: getActionsForItem(current),
+            icon: /* @__PURE__ */ jsx(
+              LocationMarkerFilledIcon,
+              {
+                style: {
+                  fill: Colors.Text.Neutral.Default
+                }
+              }
+            )
+          }
+        )
+      }
+    )
+  ] });
 };
 DefaultTooltip["displayName"] = "DefaultTooltip";
 export {

package/esm/map/components/DefaultTooltip/DefaultTooltip.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/map/components/DefaultTooltip/DefaultTooltip.tsx"],
-  "sourcesContent": ["import { isNil } from 'lodash-es';\n\nimport { _ChartTooltip as ChartTooltip } from '@dynatrace/strato-components/charts';\n\nimport { getDefaultActions } from './utils/get-default-actions.js';\nimport { useTruncationMode } from '../../hooks/use-truncation-mode.js';\nimport type { Location } from '../../types/location.js';\nimport type {\n  BubbleLayerTooltipData,\n  ConnectionLayerTooltipData,\n  DotLayerTooltipData,\n  LayerTooltipData,\n} from '../../types/tooltip.js';\nimport { ChoroplethLayerTooltipData } from '../../types/tooltip.js';\nimport { isConnection, isRegion } from '../../utils/tooltip-type-guards.js';\n\nconst isChoroplethTooltip = (\n  props: DefaultTooltipProps,\n): props is {\n  closestPoint: ChoroplethLayerTooltipData;\n} => isRegion(props.closestPoint);\nconst isConnectionTooltip = (\n  props: DefaultTooltipProps,\n): props is {\n  closestPoint: ConnectionLayerTooltipData;\n} => isConnection(props.closestPoint);\nconst isBubbleTooltip = (\n  props: DefaultTooltipProps,\n): props is {\n  closestPoint: BubbleLayerTooltipData;\n  layerData: BubbleLayerTooltipData[];\n} => !isNil(props.layerData);\n\nconst isDotTooltip = (\n  props: DefaultTooltipProps,\n): props is {\n  closestPoint: DotLayerTooltipData;\n} => true; // if it's not any of the other tooltips, it will be Dot\n\ninterface DefaultTooltipProps {\n  closestPoint: LayerTooltipData;\n  layerData?: LayerTooltipData[];\n}\n\nexport const DefaultTooltip = (props: DefaultTooltipProps) => {\n  let locations: Location[] = [];\n  const truncationMode = useTruncationMode();\n\n  if (isChoroplethTooltip(props)) {\n    const { closestPoint } = props;\n\n    return (\n      <ChartTooltip.Body data-testid=\"default-tooltip-template\">\n        <ChartTooltip.SeriesItem\n          color={closestPoint.color}\n          name={closestPoint.name}\n          truncationMode={truncationMode}\n          value={\n            closestPoint.data.value && closestPoint.data.value.toString()\n              ? closestPoint.data.value.toString()\n              : undefined\n          }\n        />\n      </ChartTooltip.Body>\n    );\n  } else if (isConnectionTooltip(props)) {\n    locations = props.closestPoint.data.path;\n  } else if (isBubbleTooltip(props)) {\n    const { closestPoint, layerData } = props;\n    locations =\n      layerData === undefined || layerData === null || layerData.length === 0\n        ? [closestPoint.data]\n        : layerData.map((point) => point.data);\n  } else if (isDotTooltip(props)) {\n    locations = [props.closestPoint.data];\n  }\n\n  return (\n    <ChartTooltip.Body\n      data-testid=\"default-tooltip-template\"\n      virtualization={false}\n    >\n      {locations.map((location) => (\n        <ChartTooltip.GeoItem\n          key={`${location.latitude}-${location.longitude}`}\n          latitude={location.latitude}\n          longitude={location.longitude}\n          defaultActions={getDefaultActions(location)}\n        />\n      ))}\n    </ChartTooltip.Body>\n  );\n};\n\nDefaultTooltip['displayName'] = 'DefaultTooltip';\n"],
-  "mappings": "AAqDQ;AArDR,SAAS,aAAa;AAEtB,SAAS,iBAAiB,oBAAoB;AAE9C,SAAS,yBAAyB;AAClC,SAAS,yBAAyB;AASlC,SAAS,cAAc,gBAAgB;AAEvC,MAAM,sBAAsB,CAC1B,UAGG,SAAS,MAAM,YAAY;AAChC,MAAM,sBAAsB,CAC1B,UAGG,aAAa,MAAM,YAAY;AACpC,MAAM,kBAAkB,CACtB,UAIG,CAAC,MAAM,MAAM,SAAS;AAE3B,MAAM,eAAe,CACnB,UAGG;AAOE,MAAM,iBAAiB,CAAC,UAA+B;AAC5D,MAAI,YAAwB,CAAC;AAC7B,QAAM,iBAAiB,kBAAkB;AAEzC,MAAI,oBAAoB,KAAK,GAAG;AAC9B,UAAM,EAAE,aAAa,IAAI;AAEzB,WACE,oBAAC,aAAa,MAAb,EAAkB,eAAY,4BAC7B;AAAA,MAAC,aAAa;AAAA,MAAb;AAAA,QACC,OAAO,aAAa;AAAA,QACpB,MAAM,aAAa;AAAA,QACnB;AAAA,QACA,OACE,aAAa,KAAK,SAAS,aAAa,KAAK,MAAM,SAAS,IACxD,aAAa,KAAK,MAAM,SAAS,IACjC;AAAA;AAAA,IAER,GACF;AAAA,EAEJ,WAAW,oBAAoB,KAAK,GAAG;AACrC,gBAAY,MAAM,aAAa,KAAK;AAAA,EACtC,WAAW,gBAAgB,KAAK,GAAG;AACjC,UAAM,EAAE,cAAc,UAAU,IAAI;AACpC,gBACE,cAAc,UAAa,cAAc,QAAQ,UAAU,WAAW,IAClE,CAAC,aAAa,IAAI,IAClB,UAAU,IAAI,CAAC,UAAU,MAAM,IAAI;AAAA,EAC3C,WAAW,aAAa,KAAK,GAAG;AAC9B,gBAAY,CAAC,MAAM,aAAa,IAAI;AAAA,EACtC;AAEA,SACE;AAAA,IAAC,aAAa;AAAA,IAAb;AAAA,MACC,eAAY;AAAA,MACZ,gBAAgB;AAAA,MAEf,oBAAU,IAAI,CAAC,aACd;AAAA,QAAC,aAAa;AAAA,QAAb;AAAA,UAEC,UAAU,SAAS;AAAA,UACnB,WAAW,SAAS;AAAA,UACpB,gBAAgB,kBAAkB,QAAQ;AAAA;AAAA,QAHrC,GAAG,SAAS,QAAQ,IAAI,SAAS,SAAS;AAAA,MAIjD,CACD;AAAA;AAAA,EACH;AAEJ;AAEA,eAAe,aAAa,IAAI;",
+  "sourcesContent": ["import { isNil } from 'lodash-es';\n\nimport {\n  _OverlayTooltip as OverlayTooltip,\n  _OverlayTooltipData as Data,\n  _useDefaultConfig as useDefaultConfig,\n  _useDefaultLabels as useDefaultLabels,\n  type SeriesActionsTemplate,\n} from '@dynatrace/strato-components/charts';\nimport Colors from '@dynatrace/strato-design-tokens/colors';\nimport { LocationMarkerFilledIcon } from '@dynatrace/strato-icons';\n\nimport { useTruncationMode } from '../../hooks/use-truncation-mode.js';\nimport type { Location } from '../../types/location.js';\nimport type {\n  BubbleLayerTooltipData,\n  ChoroplethLayerTooltipData,\n  ConnectionLayerTooltipData,\n  DotLayerTooltipData,\n  LayerTooltipData,\n} from '../../types/tooltip.js';\nimport { isConnection, isRegion } from '../../utils/tooltip-type-guards.js';\n\nconst isChoroplethTooltip = (\n  props: DefaultTooltipProps,\n): props is {\n  closestPoint: ChoroplethLayerTooltipData;\n  seriesActions?: (\n    data: Location | ChoroplethLayerTooltipData,\n  ) => SeriesActionsTemplate;\n} => isRegion(props.closestPoint);\nconst isConnectionTooltip = (\n  props: DefaultTooltipProps,\n): props is {\n  closestPoint: ConnectionLayerTooltipData;\n} => isConnection(props.closestPoint);\nconst isBubbleTooltip = (\n  props: DefaultTooltipProps,\n): props is {\n  closestPoint: BubbleLayerTooltipData;\n  layerData: BubbleLayerTooltipData[];\n} => !isNil(props.layerData);\n\nconst isDotTooltip = (\n  props: DefaultTooltipProps,\n): props is {\n  closestPoint: DotLayerTooltipData;\n} => true; // if it's not any of the other tooltips, it will be Dot\n\ntype SeriesData = Data['series'][number];\n\ninterface DefaultTooltipProps {\n  closestPoint: LayerTooltipData;\n  layerData?: LayerTooltipData[];\n  actionsForItem?: (\n    item: SeriesData,\n  ) => (() => SeriesActionsTemplate) | undefined;\n  seriesActions?: (\n    data: Location | ChoroplethLayerTooltipData,\n  ) => SeriesActionsTemplate;\n}\n\nexport const DefaultTooltip = (props: DefaultTooltipProps) => {\n  const defaultConfig = useDefaultConfig();\n  const getLabel = useDefaultLabels();\n  const truncationMode = useTruncationMode();\n  let locations: Location[] = [];\n\n  if (isChoroplethTooltip(props)) {\n    const { closestPoint, seriesActions } = props;\n    return (\n      <OverlayTooltip truncation={truncationMode}>\n        <OverlayTooltip.SeriesHeader valueLabel=\"\" />\n        <OverlayTooltip.SeriesItem\n          color={closestPoint.color}\n          name={closestPoint.name}\n          value={closestPoint.data.value?.toString() ?? ''}\n          actions={\n            seriesActions ? () => seriesActions(closestPoint) : undefined\n          }\n        />\n      </OverlayTooltip>\n    );\n  } else if (isConnectionTooltip(props)) {\n    locations = props.closestPoint.data.path;\n  } else if (isBubbleTooltip(props)) {\n    const { closestPoint, layerData } = props;\n    locations =\n      layerData === undefined || layerData === null || layerData.length === 0\n        ? [closestPoint.data]\n        : layerData.map((point) => point.data);\n  } else if (isDotTooltip(props)) {\n    locations = [props.closestPoint.data];\n  }\n\n  const seriesLabel = getLabel?.('seriesLabel') ?? '';\n  const variant = defaultConfig?.sharedVariant ? 'shared' : 'single';\n\n  const seriesData = locations.map((location) => ({\n    name: `${location.latitude}, ${location.longitude}`,\n    value: '',\n  }));\n\n  const getActionsForItem = (\n    current: SeriesData,\n  ): (() => SeriesActionsTemplate) | undefined => {\n    if (props.actionsForItem) {\n      return props.actionsForItem(current);\n    }\n    const { seriesActions: actions } = props;\n    if (!actions || !locations.length) {\n      return undefined;\n    }\n    const location = locations.find(\n      (l) => `${l.latitude}, ${l.longitude}` === current.name,\n    );\n    return location ? () => actions(location) : undefined;\n  };\n\n  return (\n    <OverlayTooltip truncation={truncationMode}>\n      <OverlayTooltip.Header header1={seriesLabel} />\n      <OverlayTooltip.SeriesHeader disabled />\n      <OverlayTooltip.Series\n        activeItem={0}\n        data={seriesData}\n        variant={variant}\n        seriesItemTemplate={(current) => (\n          <OverlayTooltip.SeriesItem\n            {...current}\n            iconStyle=\"large\"\n            actions={getActionsForItem(current as SeriesData)}\n            icon={\n              <LocationMarkerFilledIcon\n                style={{\n                  fill: Colors.Text.Neutral.Default,\n                }}\n              />\n            }\n          />\n        )}\n      />\n    </OverlayTooltip>\n  );\n};\n\nDefaultTooltip['displayName'] = 'DefaultTooltip';\n"],
+  "mappings": "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",
   "names": []
 }