@rio-cloud/rio-uikit 2.3.0 → 2.4.1

package/components/map/components/Map.js.map

@@ -1 +1 @@
-{"version":3,"file":"Map.js","sources":["../../../../src/components/map/components/Map.tsx"],"sourcesContent":["import { useRef, useState, useEffect, type CSSProperties } from 'react';\nimport { isEmpty } from 'es-toolkit/compat';\nimport { isEqual } from 'es-toolkit/predicate';\n\nimport {\n    MAP_TYPE_DEFAULT,\n    MAP_TYPE_FLEET_STYLE,\n    MAP_TYPE_SATELLITE,\n    MAP_TYPE_TERRAIN,\n    MAP_TYPE_NIGHT,\n    MAP_LAYER_INCIDENTS,\n    MAP_LAYER_TRAFFIC,\n    MAP_LAYER_ROAD_RESTRICTIONS,\n    DEFAULT_MIN_ZOOM,\n    DEFAULT_MAX_ZOOM,\n    DEFAULT_PIXEL_RATIO,\n} from './constants';\n\nimport { addEventListenerMap, removeEventListenerMap } from '../utils/eventHandling';\nimport { MapContext } from './MapContext';\nimport { createUtils, getMapBounds } from '../utils/mapUtils';\nimport { getHereUi } from '../utils/mapUi';\nimport useDarkMode from '../../../hooks/useDarkMode';\nimport MapZoom from './features/MapZoom';\nimport MapOverlayLayers from './features/layers/MapOverlayLayers';\nimport MapSize from './MapSize';\nimport MapPosition from './MapPosition';\nimport MapElements from './MapElements';\nimport type { MapApi, MapLayer, MapProps, MapType } from '../utils/mapTypes';\nimport { getPlatform, getEngineType, getBaseLayer } from '../utils/rendering';\n\nconst MARKER_POINTER_EVENTS_DISABLED_CLASS = 'map-disable-marker-pointer-events';\nconst MARKER_POINTER_EVENTS_RESET_DELAY_MS = 140;\n\nconst Map = (props: MapProps) => {\n    const {\n        children,\n        credentials,\n        width,\n        height,\n        language: lang = 'en',\n        center,\n        zoom,\n        zoomAnimation = false,\n        boundingBox,\n        hideClusterSettings = false,\n        hideMapLayerSettings = false,\n        disableMapEvents,\n        disableBehavior = false,\n        disableZoomMomentum = true,\n        enableFractionalZoom = false,\n        eventListenerMap,\n        mapType = MAP_TYPE_DEFAULT,\n        mapLayer = [],\n        showCluster: externalShowCluster = true,\n        showScaleBar = false,\n        onMapLayerChange = () => {},\n        onMapTypeChange = () => {},\n        onShowClusterChange = () => {},\n        onZoomIn = () => {},\n        onZoomOut = () => {},\n        onIncidentsChange = () => {},\n        mapSettingsTooltip,\n        mapSettings,\n        enableWebGL = true,\n        enableDevicePixelRatio = true,\n        enableMarkerIconCache = true,\n        disableMarkerPointerEventsWhileZooming = false,\n        pixelRatio = DEFAULT_PIXEL_RATIO,\n        minZoom = DEFAULT_MIN_ZOOM,\n        maxZoom = DEFAULT_MAX_ZOOM,\n    } = props;\n\n    let safeMaxZoom = maxZoom;\n\n    if (minZoom > maxZoom) {\n        // Avoid crashing the map for invalid zoom limits\n        safeMaxZoom = DEFAULT_MAX_ZOOM;\n        console.error('Invalid condition for zoom limits: min <= max)');\n    }\n\n    const mapRef = useRef<HTMLDivElement>(null);\n    const markerPointerEventsResetTimeoutRef = useRef<number | undefined>();\n    const markerPointerEventsDisabledRef = useRef(false);\n    const disableMarkerPointerEventsWhileZoomingRef = useRef(disableMarkerPointerEventsWhileZooming);\n\n    const [isMapInitialized, setMapInitialized] = useState(false);\n    const [isZoomInteractionActive, setIsZoomInteractionActive] = useState(false);\n\n    const [api, setApi] = useState<MapApi>();\n\n    const [baseLayer, setBaseLayer] = useState<MapType>(mapType);\n    const [activeLayers, setActiveLayers] = useState<MapLayer[]>(mapLayer);\n    const [showCluster, setShowCluster] = useState(externalShowCluster);\n\n    const devicePixelRatio = enableDevicePixelRatio ? window.devicePixelRatio || pixelRatio : pixelRatio;\n\n    // Only short locale is supported by HERE Map\n    const language = (locale => (locale === 'nb' ? 'no' : locale))(lang.split('-')[0].toLowerCase());\n\n    const setMarkerPointerEventsDisabled = (disabled: boolean) => {\n        if (disabled && !disableMarkerPointerEventsWhileZoomingRef.current) {\n            return;\n        }\n\n        const mapElement = mapRef.current;\n\n        if (!mapElement) {\n            return;\n        }\n\n        mapElement.classList.toggle(MARKER_POINTER_EVENTS_DISABLED_CLASS, disabled);\n        markerPointerEventsDisabledRef.current = disabled;\n    };\n\n    const clearMarkerPointerEventsResetTimeout = () => {\n        if (markerPointerEventsResetTimeoutRef.current !== undefined) {\n            window.clearTimeout(markerPointerEventsResetTimeoutRef.current);\n            markerPointerEventsResetTimeoutRef.current = undefined;\n        }\n    };\n\n    const scheduleMarkerPointerEventsEnable = () => {\n        clearMarkerPointerEventsResetTimeout();\n        markerPointerEventsResetTimeoutRef.current = window.setTimeout(() => {\n            setMarkerPointerEventsDisabled(false);\n            setIsZoomInteractionActive(false);\n            markerPointerEventsResetTimeoutRef.current = undefined;\n        }, MARKER_POINTER_EVENTS_RESET_DELAY_MS);\n    };\n\n    const temporarilyDisableMarkerPointerEvents = () => {\n        setIsZoomInteractionActive(true);\n\n        clearMarkerPointerEventsResetTimeout();\n\n        if (disableMarkerPointerEventsWhileZoomingRef.current && !markerPointerEventsDisabledRef.current) {\n            setMarkerPointerEventsDisabled(true);\n        }\n    };\n\n    useEffect(() => {\n        disableMarkerPointerEventsWhileZoomingRef.current = disableMarkerPointerEventsWhileZooming;\n    }, [disableMarkerPointerEventsWhileZooming]);\n\n    useEffect(() => {\n        const mapElement = mapRef.current;\n\n        if (!mapElement) {\n            return;\n        }\n\n        const handleWheel = () => {\n            temporarilyDisableMarkerPointerEvents();\n            scheduleMarkerPointerEventsEnable();\n        };\n\n        mapElement.addEventListener('wheel', handleWheel, { passive: true, capture: true });\n\n        return () => {\n            mapElement.removeEventListener('wheel', handleWheel, { capture: true });\n        };\n    }, []);\n\n    useEffect(() => {\n        let allMapObjects: H.map.Object[] = [];\n        let removeMapViewChangeListeners = () => {};\n\n        if (api?.map) {\n            allMapObjects = api.map.getObjects();\n            console.debug('re-initialize here map');\n        } else {\n            console.debug('initialize here map');\n        }\n\n        if (api?.map) {\n            // Cleanup any previously initialized map before doing anything else\n            console.debug('disposing previous map');\n            removeEventListenerMap(api.map);\n\n            if (api.mapEvents) {\n                api.mapEvents.dispose();\n            }\n\n            api.map.dispose();\n        }\n\n        const bounds = boundingBox && getMapBounds(boundingBox);\n\n        // Initialize communication with the platform\n        const platform = getPlatform(credentials);\n\n        // Specify engine type. In this example, we use HARP rendering engine, which is capable\n        // of rendering vector data using the style configuration exported from the HERE Style Editor.\n        // HARP engine is not the default engine, and it's not included in the mapsjs-core.js module.\n        // To use this engine, you need to include mapsjs-harp.js file to your HTML page\n        const engineType = getEngineType(baseLayer, enableWebGL);\n\n        // Obtain the default map types from the platform object\n        // @ts-expect-error-next-line: according to the Here docs, the engine type exists\n        // see https://www.here.com/docs/bundle/maps-api-for-javascript-developer-guide/page/topics/harp-migrate.html\n        const defaultLayers = platform.createDefaultLayers({ engineType, lg: language, pois: true });\n\n        getBaseLayer({\n            baseLayerName: baseLayer,\n            defaultLayers,\n            enableWebGL,\n            platform,\n            engineType,\n            vehicleRestrictions: activeLayers.includes(MAP_LAYER_ROAD_RESTRICTIONS),\n            language,\n            minZoom,\n            maxZoom: safeMaxZoom,\n        }).then(defaultLayerMap => {\n            const handleMapViewChangeStart = () => {\n                temporarilyDisableMarkerPointerEvents();\n            };\n\n            const handleMapViewChangeEnd = () => {\n                scheduleMarkerPointerEventsEnable();\n            };\n\n            // Initialize the map\n            const hereMap = new H.Map(mapRef.current as Element, defaultLayerMap.baseLayer, {\n                zoom,\n                center,\n                bounds,\n                engineType,\n                pixelRatio: devicePixelRatio,\n                fixedCenter: true,\n            });\n\n            if (defaultLayerMap.overlayLayer) {\n                // Special case for satellite map where we render street labels and road signs as well as additional pois as vector data\n                // hereMap.setBaseLayer(defaultLayerMap.baseLayer);\n                hereMap.addLayer(defaultLayerMap.overlayLayer);\n            }\n\n            setMapInitialized(true);\n\n            let hereMapEvents: H.mapevents.MapEvents | false = false;\n            let hereBehavior: H.mapevents.Behavior | undefined;\n\n            if (!disableMapEvents) {\n                // Enable the map event system\n                hereMapEvents = new H.mapevents.MapEvents(hereMap);\n            }\n\n            if (!(disableMapEvents || disableBehavior)) {\n                hereBehavior = new H.mapevents.Behavior(hereMapEvents as H.mapevents.MapEvents);\n                if (!enableFractionalZoom) {\n                    // Fractional zoom feels less predictable with mouse wheels in some setups,\n                    // but keeping it enabled can noticeably improve trackpad zoom smoothness.\n                    // @ts-expect-error-next-line\n                    hereBehavior.disable(H.mapevents.Behavior.Feature.FRACTIONAL_ZOOM);\n                }\n\n                if (disableZoomMomentum) {\n                    // Disable the inertia that occurs on WebGL maps when scrolling/zooming.\n                    // This resulted in a very high scroll sensitivity.\n                    // @ts-expect-error-next-line\n                    hereBehavior.disable(H.mapevents.Behavior.Feature.ZOOM_MOMENTUM);\n                }\n            }\n\n            addEventListenerMap(hereMap, eventListenerMap, hereMap);\n            hereMap.addEventListener('mapviewchangestart', handleMapViewChangeStart as EventListener);\n            hereMap.addEventListener('mapviewchangeend', handleMapViewChangeEnd as EventListener);\n\n            const hereUi = getHereUi(hereMap, defaultLayers, showScaleBar, language);\n\n            // The api will be passed to services when using a render function.\n            // This allows the service to access the map internals\n            setApi({\n                credentials,\n                defaultLayers,\n                map: hereMap,\n                mapEvents: hereMapEvents,\n                behavior: hereBehavior,\n                platform,\n                ui: hereUi,\n                utils: createUtils(hereMap),\n                // Put settings back into the map API object so the invoking service\n                // can check on these settings for instance inside a test\n                settings: {\n                    enableWebGL,\n                    baseLayer,\n                    activeLayers,\n                    showCluster,\n                    minZoom,\n                    maxZoom: safeMaxZoom,\n                },\n            });\n\n            if (allMapObjects) {\n                // If the base layer changed, re-add all previous objects again,\n                // otherwise the map would be empty\n                hereMap.addObjects(allMapObjects);\n            }\n\n            removeMapViewChangeListeners = () => {\n                hereMap.removeEventListener('mapviewchangestart', handleMapViewChangeStart as EventListener);\n                hereMap.removeEventListener('mapviewchangeend', handleMapViewChangeEnd as EventListener);\n            };\n        });\n\n        return () => {\n            removeMapViewChangeListeners();\n            clearMarkerPointerEventsResetTimeout();\n            setMarkerPointerEventsDisabled(false);\n            setIsZoomInteractionActive(false);\n        };\n    }, [\n        enableWebGL,\n        enableDevicePixelRatio,\n        language,\n        baseLayer,\n        minZoom,\n        maxZoom,\n        disableZoomMomentum,\n        enableFractionalZoom,\n    ]);\n\n    useEffect(() => {\n        if (!disableMarkerPointerEventsWhileZooming) {\n            clearMarkerPointerEventsResetTimeout();\n            setMarkerPointerEventsDisabled(false);\n        }\n\n        return () => {\n            clearMarkerPointerEventsResetTimeout();\n            setMarkerPointerEventsDisabled(false);\n            setIsZoomInteractionActive(false);\n        };\n    }, [disableMarkerPointerEventsWhileZooming]);\n\n    const isDarkMode = useDarkMode();\n    useEffect(() => {\n        // Toggle night map only if current map type is default\n        if (isDarkMode && baseLayer === MAP_TYPE_DEFAULT) {\n            handleMapTypeChange(MAP_TYPE_NIGHT);\n        }\n        // Toggle back to default map only if current map type is night\n        else if (!isDarkMode && baseLayer === MAP_TYPE_NIGHT) {\n            handleMapTypeChange(MAP_TYPE_DEFAULT);\n        }\n    }, [isDarkMode, language]);\n\n    // Update MapType from outside\n    useEffect(() => handleMapTypeChange(mapType), [mapType]);\n\n    // Update MapLayer from outside\n    const [previousMapLayer, setPreviousMapLayer] = useState(mapLayer);\n    if (!isEqual(mapLayer, previousMapLayer)) {\n        setActiveLayers(mapLayer);\n        setPreviousMapLayer(mapLayer);\n    }\n\n    // Update Cluster setting from outside\n    useEffect(() => setShowCluster(externalShowCluster), [externalShowCluster]);\n\n    const handleMapTypeChange = (newMapType: MapType) => {\n        setBaseLayer(newMapType);\n        onMapTypeChange(newMapType, mapType);\n    };\n\n    const handleMapLayerChange = (layer: MapLayer) => {\n        const removeLayer = (layerToRemove: string) => activeLayers.filter(item => item !== layerToRemove);\n        const newActiveLayers = activeLayers.includes(layer) ? removeLayer(layer) : [...activeLayers, layer];\n        setActiveLayers(newActiveLayers);\n        onMapLayerChange(newActiveLayers, activeLayers);\n    };\n\n    const handleShowClusterChange = (newShowCluster: boolean) => {\n        setShowCluster(newShowCluster);\n        onShowClusterChange(newShowCluster);\n    };\n\n    // Note: For performance reasons, we deactivate pointer events and hence CSS style recalculation for the\n    // the body. Having for instance many assets in the tree causes a performance loss when clicking on the map\n    // to move it and zoom in/out since the map triggers a style invalidation and recalculation and\n    // due to the nature of the AssetTree with it's hundreds DOM nodes, applying the CSS selectors\n    // takes time.\n    const handleMapInteractionStart = () => {\n        document.querySelector('.AssetTree')?.classList.add('pointer-events-none');\n    };\n    const handleMapInteractionEnd = () => {\n        document.querySelector('.AssetTree')?.classList.remove('pointer-events-none');\n    };\n\n    const style: CSSProperties = {};\n    if (height) {\n        style.height = height;\n    }\n    if (width) {\n        style.width = width;\n    }\n    const autoHeightClass = isEmpty(style) ? 'height-100pct' : '';\n\n    return (\n        <div\n            className={`Map position-relative map-type-${baseLayer.toLowerCase()} ${autoHeightClass}`}\n            style={style}\n            ref={mapRef}\n            onTouchStart={handleMapInteractionStart}\n            onTouchEnd={handleMapInteractionEnd}\n            onMouseEnter={handleMapInteractionStart}\n            onMouseOut={handleMapInteractionEnd}\n            onBlur={handleMapInteractionEnd}\n        >\n            {isMapInitialized && api && (\n                <MapContext.Provider\n                    value={{\n                        api,\n                        language,\n                        enableWebGL,\n                        enableMarkerIconCache,\n                        enableFractionalZoom,\n                        isZoomInteractionActive,\n                        showCluster,\n                        activeLayers,\n                        baseLayer,\n                        hideMapLayerSettings,\n                        hideClusterSettings,\n                        onMapTypeChange: handleMapTypeChange,\n                        onMapLayerChange: handleMapLayerChange,\n                        onShowClusterChange: handleShowClusterChange,\n                        mapSettingsTooltip,\n                        onIncidentsChange,\n                        devicePixelRatio,\n                    }}\n                >\n                    <MapPosition api={api} boundingBox={boundingBox} center={center} zoomAnimation={zoomAnimation} />\n                    <MapSize api={api} />\n                    <MapZoom\n                        zoom={zoom}\n                        hideZoomButtons={disableBehavior}\n                        onZoomIn={onZoomIn}\n                        onZoomOut={onZoomOut}\n                        zoomAnimation={zoomAnimation}\n                    />\n                    {mapSettings && mapSettings}\n                    <MapOverlayLayers layers={activeLayers} />\n                    <MapElements api={api}>{children}</MapElements>\n                </MapContext.Provider>\n            )}\n        </div>\n    );\n};\n\nMap.TYPE_DEFAULT = MAP_TYPE_DEFAULT;\nMap.TYPE_FLEET_STYLE = MAP_TYPE_FLEET_STYLE;\nMap.TYPE_SATELLITE = MAP_TYPE_SATELLITE;\nMap.TYPE_TERRAIN = MAP_TYPE_TERRAIN;\nMap.TYPE_NIGHT = MAP_TYPE_NIGHT;\n\nMap.LAYER_INCIDENTS = MAP_LAYER_INCIDENTS;\nMap.LAYER_TRAFFIC = MAP_LAYER_TRAFFIC;\nMap.LAYER_ROAD_RESTRICTIONS = MAP_LAYER_ROAD_RESTRICTIONS;\n\nexport default Map;\n"],"names":["MARKER_POINTER_EVENTS_DISABLED_CLASS","MARKER_POINTER_EVENTS_RESET_DELAY_MS","Map","props","children","credentials","width","height","lang","center","zoom","zoomAnimation","boundingBox","hideClusterSettings","hideMapLayerSettings","disableMapEvents","disableBehavior","disableZoomMomentum","enableFractionalZoom","eventListenerMap","mapType","MAP_TYPE_DEFAULT","mapLayer","externalShowCluster","showScaleBar","onMapLayerChange","onMapTypeChange","onShowClusterChange","onZoomIn","onZoomOut","onIncidentsChange","mapSettingsTooltip","mapSettings","enableWebGL","enableDevicePixelRatio","enableMarkerIconCache","disableMarkerPointerEventsWhileZooming","pixelRatio","DEFAULT_PIXEL_RATIO","minZoom","DEFAULT_MIN_ZOOM","maxZoom","DEFAULT_MAX_ZOOM","safeMaxZoom","mapRef","useRef","markerPointerEventsResetTimeoutRef","markerPointerEventsDisabledRef","disableMarkerPointerEventsWhileZoomingRef","isMapInitialized","setMapInitialized","useState","isZoomInteractionActive","setIsZoomInteractionActive","api","setApi","baseLayer","setBaseLayer","activeLayers","setActiveLayers","showCluster","setShowCluster","devicePixelRatio","language","locale","setMarkerPointerEventsDisabled","disabled","mapElement","clearMarkerPointerEventsResetTimeout","scheduleMarkerPointerEventsEnable","temporarilyDisableMarkerPointerEvents","useEffect","handleWheel","allMapObjects","removeMapViewChangeListeners","removeEventListenerMap","bounds","getMapBounds","platform","getPlatform","engineType","getEngineType","defaultLayers","getBaseLayer","MAP_LAYER_ROAD_RESTRICTIONS","defaultLayerMap","handleMapViewChangeStart","handleMapViewChangeEnd","hereMap","hereMapEvents","hereBehavior","addEventListenerMap","hereUi","getHereUi","createUtils","isDarkMode","useDarkMode","handleMapTypeChange","MAP_TYPE_NIGHT","previousMapLayer","setPreviousMapLayer","isEqual","newMapType","handleMapLayerChange","layer","removeLayer","layerToRemove","item","newActiveLayers","handleShowClusterChange","newShowCluster","handleMapInteractionStart","handleMapInteractionEnd","style","autoHeightClass","isEmpty","jsx","jsxs","MapContext","MapPosition","MapSize","MapZoom","MapOverlayLayers","MapElements","MAP_TYPE_FLEET_STYLE","MAP_TYPE_SATELLITE","MAP_TYPE_TERRAIN","MAP_LAYER_INCIDENTS","MAP_LAYER_TRAFFIC"],"mappings":"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"}
+{"version":3,"file":"Map.js","sources":["../../../../src/components/map/components/Map.tsx"],"sourcesContent":["import { useRef, useState, useEffect, useMemo, type CSSProperties } from 'react';\nimport { isEmpty } from 'es-toolkit/compat';\nimport { isEqual } from 'es-toolkit/predicate';\n\nimport {\n    MAP_TYPE_DEFAULT,\n    MAP_TYPE_FLEET_STYLE,\n    MAP_TYPE_SATELLITE,\n    MAP_TYPE_TERRAIN,\n    MAP_TYPE_NIGHT,\n    MAP_LAYER_INCIDENTS,\n    MAP_LAYER_TRAFFIC,\n    MAP_LAYER_ROAD_RESTRICTIONS,\n    DEFAULT_MIN_ZOOM,\n    DEFAULT_MAX_ZOOM,\n    DEFAULT_PIXEL_RATIO,\n} from './constants';\n\nimport { addEventListenerMap, removeEventListenerMap } from '../utils/eventHandling';\nimport { MapContext } from './MapContext';\nimport { createUtils, getMapBounds } from '../utils/mapUtils';\nimport { getHereUi } from '../utils/mapUi';\nimport useDarkMode from '../../../hooks/useDarkMode';\nimport MapZoom from './features/MapZoom';\nimport MapOverlayLayers from './features/layers/MapOverlayLayers';\nimport MapSize from './MapSize';\nimport MapPosition from './MapPosition';\nimport MapElements from './MapElements';\nimport type { MapApi, MapLayer, MapProps, MapType } from '../utils/mapTypes';\nimport { getPlatform, getEngineType, getBaseLayer } from '../utils/rendering';\nimport { useMapViewportHistory } from '../hooks/useMapViewportHistory';\n\nconst MARKER_POINTER_EVENTS_DISABLED_CLASS = 'map-disable-marker-pointer-events';\nconst MARKER_POINTER_EVENTS_RESET_DELAY_MS = 140;\n\nconst Map = (props: MapProps) => {\n    const {\n        children,\n        credentials,\n        width,\n        height,\n        language: lang = 'en',\n        center,\n        zoom,\n        zoomAnimation = false,\n        boundingBox,\n        hideClusterSettings = false,\n        hideMapLayerSettings = false,\n        disableMapEvents,\n        disableBehavior = false,\n        disableZoomMomentum = true,\n        enableFractionalZoom = false,\n        eventListenerMap,\n        mapType = MAP_TYPE_DEFAULT,\n        mapLayer = [],\n        showCluster: externalShowCluster = true,\n        showScaleBar = false,\n        onMapLayerChange = () => {},\n        onMapTypeChange = () => {},\n        onShowClusterChange = () => {},\n        onZoomIn = () => {},\n        onZoomOut = () => {},\n        onIncidentsChange = () => {},\n        mapSettingsTooltip,\n        mapSettings,\n        maxViewportHistoryEntries,\n        enableWebGL = true,\n        enableDevicePixelRatio = true,\n        enableMarkerIconCache = true,\n        disableMarkerPointerEventsWhileZooming = false,\n        pixelRatio = DEFAULT_PIXEL_RATIO,\n        minZoom = DEFAULT_MIN_ZOOM,\n        maxZoom = DEFAULT_MAX_ZOOM,\n    } = props;\n\n    let safeMaxZoom = maxZoom;\n\n    if (minZoom > maxZoom) {\n        // Avoid crashing the map for invalid zoom limits\n        safeMaxZoom = DEFAULT_MAX_ZOOM;\n        console.error('Invalid condition for zoom limits: min <= max)');\n    }\n\n    const mapRef = useRef<HTMLDivElement>(null);\n    const markerPointerEventsResetTimeoutRef = useRef<number | undefined>();\n    const markerPointerEventsDisabledRef = useRef(false);\n    const disableMarkerPointerEventsWhileZoomingRef = useRef(disableMarkerPointerEventsWhileZooming);\n\n    const [isMapInitialized, setMapInitialized] = useState(false);\n    const [isZoomInteractionActive, setIsZoomInteractionActive] = useState(false);\n\n    const [api, setApi] = useState<MapApi>();\n\n    const [baseLayer, setBaseLayer] = useState<MapType>(mapType);\n    const [activeLayers, setActiveLayers] = useState<MapLayer[]>(mapLayer);\n    const [showCluster, setShowCluster] = useState(externalShowCluster);\n    const controlledViewport = useMemo(\n        () => (center && zoom !== undefined ? { center, zoom } : undefined),\n        [center?.lat, center?.lng, zoom]\n    );\n    const viewportHistory = useMapViewportHistory(api, {\n        maxEntries: maxViewportHistoryEntries,\n        zoomAnimation,\n        controlledViewport,\n    });\n\n    const devicePixelRatio = enableDevicePixelRatio ? window.devicePixelRatio || pixelRatio : pixelRatio;\n\n    // Only short locale is supported by HERE Map\n    const language = (locale => (locale === 'nb' ? 'no' : locale))(lang.split('-')[0].toLowerCase());\n\n    const setMarkerPointerEventsDisabled = (disabled: boolean) => {\n        if (disabled && !disableMarkerPointerEventsWhileZoomingRef.current) {\n            return;\n        }\n\n        const mapElement = mapRef.current;\n\n        if (!mapElement) {\n            return;\n        }\n\n        mapElement.classList.toggle(MARKER_POINTER_EVENTS_DISABLED_CLASS, disabled);\n        markerPointerEventsDisabledRef.current = disabled;\n    };\n\n    const clearMarkerPointerEventsResetTimeout = () => {\n        if (markerPointerEventsResetTimeoutRef.current !== undefined) {\n            window.clearTimeout(markerPointerEventsResetTimeoutRef.current);\n            markerPointerEventsResetTimeoutRef.current = undefined;\n        }\n    };\n\n    const scheduleMarkerPointerEventsEnable = () => {\n        clearMarkerPointerEventsResetTimeout();\n        markerPointerEventsResetTimeoutRef.current = window.setTimeout(() => {\n            setMarkerPointerEventsDisabled(false);\n            setIsZoomInteractionActive(false);\n            markerPointerEventsResetTimeoutRef.current = undefined;\n        }, MARKER_POINTER_EVENTS_RESET_DELAY_MS);\n    };\n\n    const temporarilyDisableMarkerPointerEvents = () => {\n        setIsZoomInteractionActive(true);\n\n        clearMarkerPointerEventsResetTimeout();\n\n        if (disableMarkerPointerEventsWhileZoomingRef.current && !markerPointerEventsDisabledRef.current) {\n            setMarkerPointerEventsDisabled(true);\n        }\n    };\n\n    useEffect(() => {\n        disableMarkerPointerEventsWhileZoomingRef.current = disableMarkerPointerEventsWhileZooming;\n    }, [disableMarkerPointerEventsWhileZooming]);\n\n    useEffect(() => {\n        const mapElement = mapRef.current;\n\n        if (!mapElement) {\n            return;\n        }\n\n        const handleWheel = () => {\n            temporarilyDisableMarkerPointerEvents();\n            scheduleMarkerPointerEventsEnable();\n        };\n\n        mapElement.addEventListener('wheel', handleWheel, { passive: true, capture: true });\n\n        return () => {\n            mapElement.removeEventListener('wheel', handleWheel, { capture: true });\n        };\n    }, []);\n\n    useEffect(() => {\n        let allMapObjects: H.map.Object[] = [];\n        let removeMapViewChangeListeners = () => {};\n\n        if (api?.map) {\n            allMapObjects = api.map.getObjects();\n            console.debug('re-initialize here map');\n        } else {\n            console.debug('initialize here map');\n        }\n\n        if (api?.map) {\n            // Cleanup any previously initialized map before doing anything else\n            console.debug('disposing previous map');\n            removeEventListenerMap(api.map);\n\n            if (api.mapEvents) {\n                api.mapEvents.dispose();\n            }\n\n            api.map.dispose();\n        }\n\n        const bounds = boundingBox && getMapBounds(boundingBox);\n\n        // Initialize communication with the platform\n        const platform = getPlatform(credentials);\n\n        // Specify engine type. In this example, we use HARP rendering engine, which is capable\n        // of rendering vector data using the style configuration exported from the HERE Style Editor.\n        // HARP engine is not the default engine, and it's not included in the mapsjs-core.js module.\n        // To use this engine, you need to include mapsjs-harp.js file to your HTML page\n        const engineType = getEngineType(baseLayer, enableWebGL);\n\n        // Obtain the default map types from the platform object\n        // @ts-expect-error-next-line: according to the Here docs, the engine type exists\n        // see https://www.here.com/docs/bundle/maps-api-for-javascript-developer-guide/page/topics/harp-migrate.html\n        const defaultLayers = platform.createDefaultLayers({ engineType, lg: language, pois: true });\n\n        getBaseLayer({\n            baseLayerName: baseLayer,\n            defaultLayers,\n            enableWebGL,\n            platform,\n            engineType,\n            vehicleRestrictions: activeLayers.includes(MAP_LAYER_ROAD_RESTRICTIONS),\n            language,\n            minZoom,\n            maxZoom: safeMaxZoom,\n        }).then(defaultLayerMap => {\n            const handleMapViewChangeStart = () => {\n                temporarilyDisableMarkerPointerEvents();\n            };\n\n            const handleMapViewChangeEnd = () => {\n                scheduleMarkerPointerEventsEnable();\n            };\n\n            // Initialize the map\n            const hereMap = new H.Map(mapRef.current as Element, defaultLayerMap.baseLayer, {\n                zoom,\n                center,\n                bounds,\n                engineType,\n                pixelRatio: devicePixelRatio,\n                fixedCenter: true,\n            });\n\n            if (defaultLayerMap.overlayLayer) {\n                // Special case for satellite map where we render street labels and road signs as well as additional pois as vector data\n                // hereMap.setBaseLayer(defaultLayerMap.baseLayer);\n                hereMap.addLayer(defaultLayerMap.overlayLayer);\n            }\n\n            setMapInitialized(true);\n\n            let hereMapEvents: H.mapevents.MapEvents | false = false;\n            let hereBehavior: H.mapevents.Behavior | undefined;\n\n            if (!disableMapEvents) {\n                // Enable the map event system\n                hereMapEvents = new H.mapevents.MapEvents(hereMap);\n            }\n\n            if (!(disableMapEvents || disableBehavior)) {\n                hereBehavior = new H.mapevents.Behavior(hereMapEvents as H.mapevents.MapEvents);\n                if (!enableFractionalZoom) {\n                    // Fractional zoom feels less predictable with mouse wheels in some setups,\n                    // but keeping it enabled can noticeably improve trackpad zoom smoothness.\n                    // @ts-expect-error-next-line\n                    hereBehavior.disable(H.mapevents.Behavior.Feature.FRACTIONAL_ZOOM);\n                }\n\n                if (disableZoomMomentum) {\n                    // Disable the inertia that occurs on WebGL maps when scrolling/zooming.\n                    // This resulted in a very high scroll sensitivity.\n                    // @ts-expect-error-next-line\n                    hereBehavior.disable(H.mapevents.Behavior.Feature.ZOOM_MOMENTUM);\n                }\n            }\n\n            addEventListenerMap(hereMap, eventListenerMap, hereMap);\n            hereMap.addEventListener('mapviewchangestart', handleMapViewChangeStart as EventListener);\n            hereMap.addEventListener('mapviewchangeend', handleMapViewChangeEnd as EventListener);\n\n            const hereUi = getHereUi(hereMap, defaultLayers, showScaleBar, language);\n\n            // The api will be passed to services when using a render function.\n            // This allows the service to access the map internals\n            setApi({\n                credentials,\n                defaultLayers,\n                map: hereMap,\n                mapEvents: hereMapEvents,\n                behavior: hereBehavior,\n                platform,\n                ui: hereUi,\n                utils: createUtils(hereMap),\n                // Put settings back into the map API object so the invoking service\n                // can check on these settings for instance inside a test\n                settings: {\n                    enableWebGL,\n                    baseLayer,\n                    activeLayers,\n                    showCluster,\n                    minZoom,\n                    maxZoom: safeMaxZoom,\n                },\n            });\n\n            if (allMapObjects) {\n                // If the base layer changed, re-add all previous objects again,\n                // otherwise the map would be empty\n                hereMap.addObjects(allMapObjects);\n            }\n\n            removeMapViewChangeListeners = () => {\n                hereMap.removeEventListener('mapviewchangestart', handleMapViewChangeStart as EventListener);\n                hereMap.removeEventListener('mapviewchangeend', handleMapViewChangeEnd as EventListener);\n            };\n        });\n\n        return () => {\n            removeMapViewChangeListeners();\n            clearMarkerPointerEventsResetTimeout();\n            setMarkerPointerEventsDisabled(false);\n            setIsZoomInteractionActive(false);\n        };\n    }, [\n        enableWebGL,\n        enableDevicePixelRatio,\n        language,\n        baseLayer,\n        minZoom,\n        maxZoom,\n        disableZoomMomentum,\n        enableFractionalZoom,\n    ]);\n\n    useEffect(() => {\n        if (!disableMarkerPointerEventsWhileZooming) {\n            clearMarkerPointerEventsResetTimeout();\n            setMarkerPointerEventsDisabled(false);\n        }\n\n        return () => {\n            clearMarkerPointerEventsResetTimeout();\n            setMarkerPointerEventsDisabled(false);\n            setIsZoomInteractionActive(false);\n        };\n    }, [disableMarkerPointerEventsWhileZooming]);\n\n    const isDarkMode = useDarkMode();\n    useEffect(() => {\n        // Toggle night map only if current map type is default\n        if (isDarkMode && baseLayer === MAP_TYPE_DEFAULT) {\n            handleMapTypeChange(MAP_TYPE_NIGHT);\n        }\n        // Toggle back to default map only if current map type is night\n        else if (!isDarkMode && baseLayer === MAP_TYPE_NIGHT) {\n            handleMapTypeChange(MAP_TYPE_DEFAULT);\n        }\n    }, [isDarkMode, language]);\n\n    // Update MapType from outside\n    useEffect(() => handleMapTypeChange(mapType), [mapType]);\n\n    // Update MapLayer from outside\n    const [previousMapLayer, setPreviousMapLayer] = useState(mapLayer);\n    if (!isEqual(mapLayer, previousMapLayer)) {\n        setActiveLayers(mapLayer);\n        setPreviousMapLayer(mapLayer);\n    }\n\n    // Update Cluster setting from outside\n    useEffect(() => setShowCluster(externalShowCluster), [externalShowCluster]);\n\n    const handleMapTypeChange = (newMapType: MapType) => {\n        setBaseLayer(newMapType);\n        onMapTypeChange(newMapType, mapType);\n    };\n\n    const handleMapLayerChange = (layer: MapLayer) => {\n        const removeLayer = (layerToRemove: string) => activeLayers.filter(item => item !== layerToRemove);\n        const newActiveLayers = activeLayers.includes(layer) ? removeLayer(layer) : [...activeLayers, layer];\n        setActiveLayers(newActiveLayers);\n        onMapLayerChange(newActiveLayers, activeLayers);\n    };\n\n    const handleShowClusterChange = (newShowCluster: boolean) => {\n        setShowCluster(newShowCluster);\n        onShowClusterChange(newShowCluster);\n    };\n\n    // Note: For performance reasons, we deactivate pointer events and hence CSS style recalculation for the\n    // the body. Having for instance many assets in the tree causes a performance loss when clicking on the map\n    // to move it and zoom in/out since the map triggers a style invalidation and recalculation and\n    // due to the nature of the AssetTree with it's hundreds DOM nodes, applying the CSS selectors\n    // takes time.\n    const handleMapInteractionStart = () => {\n        document.querySelector('.AssetTree')?.classList.add('pointer-events-none');\n    };\n    const handleMapInteractionEnd = () => {\n        document.querySelector('.AssetTree')?.classList.remove('pointer-events-none');\n    };\n\n    const style: CSSProperties = {};\n    if (height) {\n        style.height = height;\n    }\n    if (width) {\n        style.width = width;\n    }\n    const autoHeightClass = isEmpty(style) ? 'height-100pct' : '';\n\n    return (\n        <div\n            className={`Map position-relative map-type-${baseLayer.toLowerCase()} ${autoHeightClass}`}\n            style={style}\n            ref={mapRef}\n            onTouchStart={handleMapInteractionStart}\n            onTouchEnd={handleMapInteractionEnd}\n            onMouseEnter={handleMapInteractionStart}\n            onMouseOut={handleMapInteractionEnd}\n            onBlur={handleMapInteractionEnd}\n        >\n            {isMapInitialized && api && (\n                <MapContext.Provider\n                    value={{\n                        api,\n                        language,\n                        enableWebGL,\n                        enableMarkerIconCache,\n                        enableFractionalZoom,\n                        isZoomInteractionActive,\n                        showCluster,\n                        activeLayers,\n                        baseLayer,\n                        hideMapLayerSettings,\n                        hideClusterSettings,\n                        viewportHistory,\n                        onMapTypeChange: handleMapTypeChange,\n                        onMapLayerChange: handleMapLayerChange,\n                        onShowClusterChange: handleShowClusterChange,\n                        mapSettingsTooltip,\n                        onIncidentsChange,\n                        devicePixelRatio,\n                    }}\n                >\n                    <MapPosition\n                        api={api}\n                        boundingBox={boundingBox}\n                        center={center}\n                        zoom={zoom}\n                        zoomAnimation={zoomAnimation}\n                    />\n                    <MapSize api={api} />\n                    <MapZoom\n                        hideZoomButtons={disableBehavior}\n                        onZoomIn={onZoomIn}\n                        onZoomOut={onZoomOut}\n                        zoomAnimation={zoomAnimation}\n                    />\n                    {mapSettings && mapSettings}\n                    <MapOverlayLayers layers={activeLayers} />\n                    <MapElements api={api}>{children}</MapElements>\n                </MapContext.Provider>\n            )}\n        </div>\n    );\n};\n\nMap.TYPE_DEFAULT = MAP_TYPE_DEFAULT;\nMap.TYPE_FLEET_STYLE = MAP_TYPE_FLEET_STYLE;\nMap.TYPE_SATELLITE = MAP_TYPE_SATELLITE;\nMap.TYPE_TERRAIN = MAP_TYPE_TERRAIN;\nMap.TYPE_NIGHT = MAP_TYPE_NIGHT;\n\nMap.LAYER_INCIDENTS = MAP_LAYER_INCIDENTS;\nMap.LAYER_TRAFFIC = MAP_LAYER_TRAFFIC;\nMap.LAYER_ROAD_RESTRICTIONS = MAP_LAYER_ROAD_RESTRICTIONS;\n\nexport default Map;\n"],"names":["MARKER_POINTER_EVENTS_DISABLED_CLASS","MARKER_POINTER_EVENTS_RESET_DELAY_MS","Map","props","children","credentials","width","height","lang","center","zoom","zoomAnimation","boundingBox","hideClusterSettings","hideMapLayerSettings","disableMapEvents","disableBehavior","disableZoomMomentum","enableFractionalZoom","eventListenerMap","mapType","MAP_TYPE_DEFAULT","mapLayer","externalShowCluster","showScaleBar","onMapLayerChange","onMapTypeChange","onShowClusterChange","onZoomIn","onZoomOut","onIncidentsChange","mapSettingsTooltip","mapSettings","maxViewportHistoryEntries","enableWebGL","enableDevicePixelRatio","enableMarkerIconCache","disableMarkerPointerEventsWhileZooming","pixelRatio","DEFAULT_PIXEL_RATIO","minZoom","DEFAULT_MIN_ZOOM","maxZoom","DEFAULT_MAX_ZOOM","safeMaxZoom","mapRef","useRef","markerPointerEventsResetTimeoutRef","markerPointerEventsDisabledRef","disableMarkerPointerEventsWhileZoomingRef","isMapInitialized","setMapInitialized","useState","isZoomInteractionActive","setIsZoomInteractionActive","api","setApi","baseLayer","setBaseLayer","activeLayers","setActiveLayers","showCluster","setShowCluster","controlledViewport","useMemo","viewportHistory","useMapViewportHistory","devicePixelRatio","language","locale","setMarkerPointerEventsDisabled","disabled","mapElement","clearMarkerPointerEventsResetTimeout","scheduleMarkerPointerEventsEnable","temporarilyDisableMarkerPointerEvents","useEffect","handleWheel","allMapObjects","removeMapViewChangeListeners","removeEventListenerMap","bounds","getMapBounds","platform","getPlatform","engineType","getEngineType","defaultLayers","getBaseLayer","MAP_LAYER_ROAD_RESTRICTIONS","defaultLayerMap","handleMapViewChangeStart","handleMapViewChangeEnd","hereMap","hereMapEvents","hereBehavior","addEventListenerMap","hereUi","getHereUi","createUtils","isDarkMode","useDarkMode","handleMapTypeChange","MAP_TYPE_NIGHT","previousMapLayer","setPreviousMapLayer","isEqual","newMapType","handleMapLayerChange","layer","removeLayer","layerToRemove","item","newActiveLayers","handleShowClusterChange","newShowCluster","handleMapInteractionStart","handleMapInteractionEnd","style","autoHeightClass","isEmpty","jsx","jsxs","MapContext","MapPosition","MapSize","MapZoom","MapOverlayLayers","MapElements","MAP_TYPE_FLEET_STYLE","MAP_TYPE_SATELLITE","MAP_TYPE_TERRAIN","MAP_LAYER_INCIDENTS","MAP_LAYER_TRAFFIC"],"mappings":"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"}

package/components/map/components/MapContext.d.ts

@@ -1,4 +1,5 @@
 import { MapApi, MapIncidents, MapLayer, MapType } from '../utils/mapTypes';
+import { MapViewportHistory } from '../hooks/useMapViewportHistory';
 export type MapContextType = {
     api: MapApi;
     language: string;
@@ -16,6 +17,7 @@ export type MapContextType = {
     mapSettingsTooltip?: string | React.ReactNode;
     hideMapLayerSettings?: boolean;
     hideClusterSettings?: boolean;
+    viewportHistory: MapViewportHistory;
     onIncidentsChange: (incidentsResult: MapIncidents) => void;
 };
 export declare const defaultMapContext: MapContextType;

package/components/map/components/MapContext.js

@@ -1,22 +1,24 @@
 import { createContext as e, useContext as t } from "react";
-import { MAP_TYPE_DEFAULT as a } from "./constants.js";
-const o = {
+import { MAP_TYPE_DEFAULT as o } from "./constants.js";
+import { defaultMapViewportHistory as a } from "../hooks/useMapViewportHistory.js";
+const r = {
   api: {},
   language: "en",
   enableWebGL: !0,
   enableMarkerIconCache: !0,
   enableFractionalZoom: !1,
   isZoomInteractionActive: !1,
-  baseLayer: a,
+  baseLayer: o,
   activeLayers: [],
   showCluster: !0,
   devicePixelRatio: 1,
+  viewportHistory: a,
   onIncidentsChange: () => {
   }
-}, n = e(o), c = () => t(n);
+}, n = e(r), l = () => t(n);
 export {
   n as MapContext,
-  o as defaultMapContext,
-  c as useMapContext
+  r as defaultMapContext,
+  l as useMapContext
 };
 //# sourceMappingURL=MapContext.js.map

package/components/map/components/MapContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"MapContext.js","sources":["../../../../src/components/map/components/MapContext.ts"],"sourcesContent":["import { createContext, useContext } from 'react';\n\nimport type { MapApi, MapIncidents, MapLayer, MapType } from '../utils/mapTypes';\nimport { MAP_TYPE_DEFAULT } from './constants';\n\nexport type MapContextType = {\n    api: MapApi;\n    language: string;\n    enableWebGL: boolean;\n    enableMarkerIconCache: boolean;\n    enableFractionalZoom: boolean;\n    isZoomInteractionActive: boolean;\n    baseLayer: MapType;\n    activeLayers: MapLayer[];\n    showCluster: boolean;\n    devicePixelRatio: number;\n    onMapTypeChange?: (type: MapType) => void;\n    onMapLayerChange?: (layer: MapLayer) => void;\n    onShowClusterChange?: (showCluster: boolean) => void;\n    mapSettingsTooltip?: string | React.ReactNode;\n    hideMapLayerSettings?: boolean;\n    hideClusterSettings?: boolean;\n    onIncidentsChange: (incidentsResult: MapIncidents) => void;\n};\n\nexport const defaultMapContext: MapContextType = {\n    api: {},\n    language: 'en',\n    enableWebGL: true,\n    enableMarkerIconCache: true,\n    enableFractionalZoom: false,\n    isZoomInteractionActive: false,\n    baseLayer: MAP_TYPE_DEFAULT,\n    activeLayers: [],\n    showCluster: true,\n    devicePixelRatio: 1,\n    onIncidentsChange: () => {},\n};\n\nexport const MapContext = createContext<MapContextType>(defaultMapContext);\n\nexport const useMapContext = () => useContext(MapContext);\n"],"names":["defaultMapContext","MAP_TYPE_DEFAULT","MapContext","createContext","useMapContext","useContext"],"mappings":";;AAyBO,MAAMA,IAAoC;AAAA,EAC7C,KAAK,CAAA;AAAA,EACL,UAAU;AAAA,EACV,aAAa;AAAA,EACb,uBAAuB;AAAA,EACvB,sBAAsB;AAAA,EACtB,yBAAyB;AAAA,EACzB,WAAWC;AAAA,EACX,cAAc,CAAA;AAAA,EACd,aAAa;AAAA,EACb,kBAAkB;AAAA,EAClB,mBAAmB,MAAM;AAAA,EAAC;AAC9B,GAEaC,IAAaC,EAA8BH,CAAiB,GAE5DI,IAAgB,MAAMC,EAAWH,CAAU;"}
+{"version":3,"file":"MapContext.js","sources":["../../../../src/components/map/components/MapContext.ts"],"sourcesContent":["import { createContext, useContext } from 'react';\n\nimport type { MapApi, MapIncidents, MapLayer, MapType } from '../utils/mapTypes';\nimport { MAP_TYPE_DEFAULT } from './constants';\nimport { defaultMapViewportHistory, type MapViewportHistory } from '../hooks/useMapViewportHistory';\n\nexport type MapContextType = {\n    api: MapApi;\n    language: string;\n    enableWebGL: boolean;\n    enableMarkerIconCache: boolean;\n    enableFractionalZoom: boolean;\n    isZoomInteractionActive: boolean;\n    baseLayer: MapType;\n    activeLayers: MapLayer[];\n    showCluster: boolean;\n    devicePixelRatio: number;\n    onMapTypeChange?: (type: MapType) => void;\n    onMapLayerChange?: (layer: MapLayer) => void;\n    onShowClusterChange?: (showCluster: boolean) => void;\n    mapSettingsTooltip?: string | React.ReactNode;\n    hideMapLayerSettings?: boolean;\n    hideClusterSettings?: boolean;\n    viewportHistory: MapViewportHistory;\n    onIncidentsChange: (incidentsResult: MapIncidents) => void;\n};\n\nexport const defaultMapContext: MapContextType = {\n    api: {},\n    language: 'en',\n    enableWebGL: true,\n    enableMarkerIconCache: true,\n    enableFractionalZoom: false,\n    isZoomInteractionActive: false,\n    baseLayer: MAP_TYPE_DEFAULT,\n    activeLayers: [],\n    showCluster: true,\n    devicePixelRatio: 1,\n    viewportHistory: defaultMapViewportHistory,\n    onIncidentsChange: () => {},\n};\n\nexport const MapContext = createContext<MapContextType>(defaultMapContext);\n\nexport const useMapContext = () => useContext(MapContext);\n"],"names":["defaultMapContext","MAP_TYPE_DEFAULT","defaultMapViewportHistory","MapContext","createContext","useMapContext","useContext"],"mappings":";;;AA2BO,MAAMA,IAAoC;AAAA,EAC7C,KAAK,CAAA;AAAA,EACL,UAAU;AAAA,EACV,aAAa;AAAA,EACb,uBAAuB;AAAA,EACvB,sBAAsB;AAAA,EACtB,yBAAyB;AAAA,EACzB,WAAWC;AAAA,EACX,cAAc,CAAA;AAAA,EACd,aAAa;AAAA,EACb,kBAAkB;AAAA,EAClB,iBAAiBC;AAAA,EACjB,mBAAmB,MAAM;AAAA,EAAC;AAC9B,GAEaC,IAAaC,EAA8BJ,CAAiB,GAE5DK,IAAgB,MAAMC,EAAWH,CAAU;"}

package/components/map/components/MapPosition.d.ts

@@ -1,5 +1,5 @@
 import { MapApi, MapProps } from '../utils/mapTypes';
-export type MapPositionProps = Pick<MapProps, 'boundingBox' | 'center' | 'zoomAnimation'> & {
+export type MapPositionProps = Pick<MapProps, 'boundingBox' | 'center' | 'zoom' | 'zoomAnimation'> & {
     api: MapApi;
 };
 declare const MapPosition: (props: MapPositionProps) => null;

package/components/map/components/MapPosition.js

@@ -1,19 +1,26 @@
-import { useEffect as r } from "react";
-const c = (s) => {
-  const { api: t, boundingBox: n, center: e, zoomAnimation: i = !1 } = s;
-  return r(() => {
-    if (t && n) {
-      const { top: o, left: a, bottom: l, right: f } = n;
-      t.map?.getViewModel().setLookAtData({ bounds: new H.geo.Rect(o, a, l, f) }, i);
+import { useRef as f, useEffect as h } from "react";
+import { useMapContext as P } from "./MapContext.js";
+const C = 1e-6, Z = 1e-3, N = (b) => {
+  const { api: o, boundingBox: a, center: t, zoom: e, zoomAnimation: r = !1 } = b, { enableFractionalZoom: g } = P(), p = f(), c = f(t), d = f(e);
+  return h(() => {
+    if (o && a) {
+      const { top: n, left: i, bottom: l, right: u } = a;
+      o.map?.getViewModel().setLookAtData({ bounds: new H.geo.Rect(n, i, l, u) }, r);
     }
-  }, [n]), r(() => {
-    if (!(t && e))
+  }, [a]), h(() => {
+    const n = o.map;
+    if (!(n && (t || e !== void 0)))
       return;
-    const o = t.utils?.getCenter();
-    o && (o.lat !== e.lat || o.lng !== e.lng) && t.utils?.setCenter(e, i);
-  }, [e]), null;
+    const i = p.current !== n, l = t?.lat !== c.current?.lat || t?.lng !== c.current?.lng, u = e !== d.current;
+    if (!(i || l || u))
+      return;
+    const s = {}, m = o.utils?.getCenter();
+    t && m && (Math.abs(m.lat - t.lat) > C || Math.abs(m.lng - t.lng) > C) && (s.position = t);
+    const M = g ? o.utils?.getPreciseZoom() : o.utils?.getZoom();
+    e !== void 0 && M !== void 0 && Math.abs(M - e) > Z && (s.zoom = e), Object.keys(s).length > 0 && n.getViewModel().setLookAtData(s, r), p.current = n, c.current = t, d.current = e;
+  }, [o, t, e, r, g]), null;
 };
 export {
-  c as default
+  N as default
 };
 //# sourceMappingURL=MapPosition.js.map

package/components/map/components/MapPosition.js.map

@@ -1 +1 @@
-{"version":3,"file":"MapPosition.js","sources":["../../../../src/components/map/components/MapPosition.tsx"],"sourcesContent":["import { useEffect } from 'react';\n\nimport type { MapApi, MapProps } from '../utils/mapTypes';\n\nexport type MapPositionProps = Pick<MapProps, 'boundingBox' | 'center' | 'zoomAnimation'> & {\n    api: MapApi;\n};\n\nconst MapPosition = (props: MapPositionProps) => {\n    const { api, boundingBox, center, zoomAnimation = false } = props;\n\n    // Update BoundingBox from outside\n    useEffect(() => {\n        if (api && boundingBox) {\n            const { top, left, bottom, right } = boundingBox;\n            api.map?.getViewModel().setLookAtData({ bounds: new H.geo.Rect(top, left, bottom, right) }, zoomAnimation);\n        }\n    }, [boundingBox]);\n\n    // Update Lat & Lng from outside if value is different\n    useEffect(() => {\n        if (!(api && center)) {\n            return;\n        }\n\n        const currentMapCenter = api.utils?.getCenter();\n        if (currentMapCenter) {\n            if (currentMapCenter.lat !== center.lat || currentMapCenter.lng !== center.lng) {\n                api.utils?.setCenter(center, zoomAnimation);\n            }\n        }\n    }, [center]);\n\n    return null;\n};\n\nexport default MapPosition;\n"],"names":["MapPosition","props","api","boundingBox","center","zoomAnimation","useEffect","top","left","bottom","right","currentMapCenter"],"mappings":";AAQA,MAAMA,IAAc,CAACC,MAA4B;AAC7C,QAAM,EAAE,KAAAC,GAAK,aAAAC,GAAa,QAAAC,GAAQ,eAAAC,IAAgB,OAAUJ;AAG5D,SAAAK,EAAU,MAAM;AACZ,QAAIJ,KAAOC,GAAa;AACpB,YAAM,EAAE,KAAAI,GAAK,MAAAC,GAAM,QAAAC,GAAQ,OAAAC,MAAUP;AACrC,MAAAD,EAAI,KAAK,aAAA,EAAe,cAAc,EAAE,QAAQ,IAAI,EAAE,IAAI,KAAKK,GAAKC,GAAMC,GAAQC,CAAK,EAAA,GAAKL,CAAa;AAAA,IAC7G;AAAA,EACJ,GAAG,CAACF,CAAW,CAAC,GAGhBG,EAAU,MAAM;AACZ,QAAI,EAAEJ,KAAOE;AACT;AAGJ,UAAMO,IAAmBT,EAAI,OAAO,UAAA;AACpC,IAAIS,MACIA,EAAiB,QAAQP,EAAO,OAAOO,EAAiB,QAAQP,EAAO,QACvEF,EAAI,OAAO,UAAUE,GAAQC,CAAa;AAAA,EAGtD,GAAG,CAACD,CAAM,CAAC,GAEJ;AACX;"}
+{"version":3,"file":"MapPosition.js","sources":["../../../../src/components/map/components/MapPosition.tsx"],"sourcesContent":["import { useEffect, useRef } from 'react';\n\nimport type { MapApi, MapProps } from '../utils/mapTypes';\nimport { useMapContext } from './MapContext';\n\nconst CENTER_SYNC_EPSILON = 0.000001;\nconst ZOOM_SYNC_EPSILON = 0.001;\n\n// Keeps externally controlled viewport props in sync with HERE.\n// `center` and `zoom` may change together, but either value must also work independently.\nexport type MapPositionProps = Pick<MapProps, 'boundingBox' | 'center' | 'zoom' | 'zoomAnimation'> & {\n    api: MapApi;\n};\n\nconst MapPosition = (props: MapPositionProps) => {\n    const { api, boundingBox, center, zoom, zoomAnimation = false } = props;\n    const { enableFractionalZoom } = useMapContext();\n    const lastProcessedMapRef = useRef<H.Map>();\n    const lastProcessedCenterRef = useRef(center);\n    const lastProcessedZoomRef = useRef(zoom);\n\n    // Update BoundingBox from outside\n    useEffect(() => {\n        if (api && boundingBox) {\n            const { top, left, bottom, right } = boundingBox;\n            api.map?.getViewModel().setLookAtData({ bounds: new H.geo.Rect(top, left, bottom, right) }, zoomAnimation);\n        }\n    }, [boundingBox]);\n\n    // Update viewport from outside if center or zoom value is different.\n    // If only zoom changed, HERE receives only `{ zoom }`; if only center changed, only `{ position }`.\n    // If both changed in the same render, they are applied atomically to avoid animated zooming around the old center.\n    useEffect(() => {\n        const map = api.map;\n\n        if (!(map && (center || zoom !== undefined))) {\n            return;\n        }\n\n        const hasMapChanged = lastProcessedMapRef.current !== map;\n        const hasCenterChanged =\n            center?.lat !== lastProcessedCenterRef.current?.lat || center?.lng !== lastProcessedCenterRef.current?.lng;\n        const hasZoomChanged = zoom !== lastProcessedZoomRef.current;\n\n        if (!(hasMapChanged || hasCenterChanged || hasZoomChanged)) {\n            return;\n        }\n\n        const lookAtData: H.map.ViewModel.ILookAtData = {};\n\n        const currentMapCenter = api.utils?.getCenter();\n        if (\n            center &&\n            currentMapCenter &&\n            (Math.abs(currentMapCenter.lat - center.lat) > CENTER_SYNC_EPSILON ||\n                Math.abs(currentMapCenter.lng - center.lng) > CENTER_SYNC_EPSILON)\n        ) {\n            lookAtData.position = center;\n        }\n\n        const currentMapZoom = enableFractionalZoom ? api.utils?.getPreciseZoom() : api.utils?.getZoom();\n        if (zoom !== undefined && currentMapZoom !== undefined && Math.abs(currentMapZoom - zoom) > ZOOM_SYNC_EPSILON) {\n            lookAtData.zoom = zoom;\n        }\n\n        if (Object.keys(lookAtData).length > 0) {\n            map.getViewModel().setLookAtData(lookAtData, zoomAnimation);\n        }\n\n        lastProcessedMapRef.current = map;\n        lastProcessedCenterRef.current = center;\n        lastProcessedZoomRef.current = zoom;\n    }, [api, center, zoom, zoomAnimation, enableFractionalZoom]);\n\n    return null;\n};\n\nexport default MapPosition;\n"],"names":["CENTER_SYNC_EPSILON","ZOOM_SYNC_EPSILON","MapPosition","props","api","boundingBox","center","zoom","zoomAnimation","enableFractionalZoom","useMapContext","lastProcessedMapRef","useRef","lastProcessedCenterRef","lastProcessedZoomRef","useEffect","top","left","bottom","right","map","hasMapChanged","hasCenterChanged","hasZoomChanged","lookAtData","currentMapCenter","currentMapZoom"],"mappings":";;AAKA,MAAMA,IAAsB,MACtBC,IAAoB,MAQpBC,IAAc,CAACC,MAA4B;AAC7C,QAAM,EAAE,KAAAC,GAAK,aAAAC,GAAa,QAAAC,GAAQ,MAAAC,GAAM,eAAAC,IAAgB,OAAUL,GAC5D,EAAE,sBAAAM,EAAA,IAAyBC,EAAA,GAC3BC,IAAsBC,EAAA,GACtBC,IAAyBD,EAAON,CAAM,GACtCQ,IAAuBF,EAAOL,CAAI;AAGxC,SAAAQ,EAAU,MAAM;AACZ,QAAIX,KAAOC,GAAa;AACpB,YAAM,EAAE,KAAAW,GAAK,MAAAC,GAAM,QAAAC,GAAQ,OAAAC,MAAUd;AACrC,MAAAD,EAAI,KAAK,aAAA,EAAe,cAAc,EAAE,QAAQ,IAAI,EAAE,IAAI,KAAKY,GAAKC,GAAMC,GAAQC,CAAK,EAAA,GAAKX,CAAa;AAAA,IAC7G;AAAA,EACJ,GAAG,CAACH,CAAW,CAAC,GAKhBU,EAAU,MAAM;AACZ,UAAMK,IAAMhB,EAAI;AAEhB,QAAI,EAAEgB,MAAQd,KAAUC,MAAS;AAC7B;AAGJ,UAAMc,IAAgBV,EAAoB,YAAYS,GAChDE,IACFhB,GAAQ,QAAQO,EAAuB,SAAS,OAAOP,GAAQ,QAAQO,EAAuB,SAAS,KACrGU,IAAiBhB,MAASO,EAAqB;AAErD,QAAI,EAAEO,KAAiBC,KAAoBC;AACvC;AAGJ,UAAMC,IAA0C,CAAA,GAE1CC,IAAmBrB,EAAI,OAAO,UAAA;AACpC,IACIE,KACAmB,MACC,KAAK,IAAIA,EAAiB,MAAMnB,EAAO,GAAG,IAAIN,KAC3C,KAAK,IAAIyB,EAAiB,MAAMnB,EAAO,GAAG,IAAIN,OAElDwB,EAAW,WAAWlB;AAG1B,UAAMoB,IAAiBjB,IAAuBL,EAAI,OAAO,mBAAmBA,EAAI,OAAO,QAAA;AACvF,IAAIG,MAAS,UAAamB,MAAmB,UAAa,KAAK,IAAIA,IAAiBnB,CAAI,IAAIN,MACxFuB,EAAW,OAAOjB,IAGlB,OAAO,KAAKiB,CAAU,EAAE,SAAS,KACjCJ,EAAI,aAAA,EAAe,cAAcI,GAAYhB,CAAa,GAG9DG,EAAoB,UAAUS,GAC9BP,EAAuB,UAAUP,GACjCQ,EAAqB,UAAUP;AAAA,EACnC,GAAG,CAACH,GAAKE,GAAQC,GAAMC,GAAeC,CAAoB,CAAC,GAEpD;AACX;"}

package/components/map/components/features/MapZoom.d.ts

@@ -1,5 +1,4 @@
 export type MapZoomProps = {
-    zoom?: number;
     hideZoomButtons: boolean;
     zoomAnimation: boolean;
     onZoomIn: (zoom: number) => void;

package/components/map/components/features/MapZoom.js

@@ -1,25 +1,17 @@
-import { jsx as p } from "react/jsx-runtime";
-import { useRef as d, useEffect as O } from "react";
-import I from "./settings/ZoomButtons.js";
-import { useMapContext as M } from "../MapContext.js";
-const g = 1e-3, P = (i) => {
-  const { zoom: t, hideZoomButtons: Z, zoomAnimation: r, onZoomIn: c, onZoomOut: a } = i, { api: o, enableFractionalZoom: m, isZoomInteractionActive: s } = M(), u = d();
-  O(() => {
-    if (!(o && t !== void 0) || u.current === t || m && s)
-      return;
-    const n = m ? o.utils?.getPreciseZoom() : o.utils?.getZoom();
-    n !== void 0 && (m ? Math.abs(n - t) > g : n !== t) && o.utils?.setZoom(t, r), u.current = t;
-  }, [o, t, r, m, s]);
-  const l = () => {
-    const e = (o?.utils?.getZoom() ?? 0) + 1;
-    c(e), o?.utils?.setZoom(e, r);
-  }, f = () => {
-    const e = (o?.utils?.getZoom() ?? 0) - 1;
-    a(e), o?.utils?.setZoom(e, r);
+import { jsx as i } from "react/jsx-runtime";
+import l from "./settings/ZoomButtons.js";
+import { useMapContext as a } from "../MapContext.js";
+const h = (m) => {
+  const { hideZoomButtons: s, zoomAnimation: n, onZoomIn: e, onZoomOut: r } = m, { api: t } = a(), Z = () => {
+    const o = (t?.utils?.getZoom() ?? 0) + 1;
+    e(o), t?.utils?.setZoom(o, n);
+  }, u = () => {
+    const o = (t?.utils?.getZoom() ?? 0) - 1;
+    r(o), t?.utils?.setZoom(o, n);
   };
-  return Z ? null : /* @__PURE__ */ p(I, { onZoomIn: l, onZoomOut: f });
+  return s ? null : /* @__PURE__ */ i(l, { onZoomIn: Z, onZoomOut: u });
 };
 export {
-  P as default
+  h as default
 };
 //# sourceMappingURL=MapZoom.js.map

package/components/map/components/features/MapZoom.js.map

@@ -1 +1 @@
-{"version":3,"file":"MapZoom.js","sources":["../../../../../src/components/map/components/features/MapZoom.tsx"],"sourcesContent":["import { useEffect, useRef } from 'react';\n\nimport ZoomButtons from './settings/ZoomButtons';\nimport { useMapContext } from '../MapContext';\n\nconst ZOOM_SYNC_EPSILON = 0.001;\n\nexport type MapZoomProps = {\n    zoom?: number;\n    hideZoomButtons: boolean;\n    zoomAnimation: boolean;\n    onZoomIn: (zoom: number) => void;\n    onZoomOut: (zoom: number) => void;\n};\n\nconst MapZoom = (props: MapZoomProps) => {\n    const { zoom, hideZoomButtons, zoomAnimation, onZoomIn, onZoomOut } = props;\n\n    const { api, enableFractionalZoom, isZoomInteractionActive } = useMapContext();\n    const lastProcessedExternalZoomRef = useRef<number | undefined>();\n\n    // Update Zoom from outside if value is different\n    useEffect(() => {\n        if (!(api && zoom !== undefined)) {\n            return;\n        }\n\n        if (lastProcessedExternalZoomRef.current === zoom) {\n            return;\n        }\n\n        if (enableFractionalZoom && isZoomInteractionActive) {\n            return;\n        }\n\n        const currentMapZoom = enableFractionalZoom ? api.utils?.getPreciseZoom() : api.utils?.getZoom();\n\n        if (\n            currentMapZoom !== undefined &&\n            (enableFractionalZoom ? Math.abs(currentMapZoom - zoom) > ZOOM_SYNC_EPSILON : currentMapZoom !== zoom)\n        ) {\n            api.utils?.setZoom(zoom, zoomAnimation);\n        }\n\n        lastProcessedExternalZoomRef.current = zoom;\n    }, [api, zoom, zoomAnimation, enableFractionalZoom, isZoomInteractionActive]);\n\n    const handleZoomIn = () => {\n        const currentZoom = api?.utils?.getZoom() ?? 0;\n        const newZoom = currentZoom + 1;\n\n        onZoomIn(newZoom);\n        api?.utils?.setZoom(newZoom, zoomAnimation);\n    };\n\n    const handleZoomOut = () => {\n        const currentZoom = api?.utils?.getZoom() ?? 0;\n        const newZoom = currentZoom - 1;\n\n        onZoomOut(newZoom);\n        api?.utils?.setZoom(newZoom, zoomAnimation);\n    };\n\n    if (hideZoomButtons) {\n        return null;\n    }\n\n    return <ZoomButtons onZoomIn={handleZoomIn} onZoomOut={handleZoomOut} />;\n};\n\nexport default MapZoom;\n"],"names":["ZOOM_SYNC_EPSILON","MapZoom","props","zoom","hideZoomButtons","zoomAnimation","onZoomIn","onZoomOut","api","enableFractionalZoom","isZoomInteractionActive","useMapContext","lastProcessedExternalZoomRef","useRef","useEffect","currentMapZoom","handleZoomIn","newZoom","handleZoomOut","jsx","ZoomButtons"],"mappings":";;;;AAKA,MAAMA,IAAoB,MAUpBC,IAAU,CAACC,MAAwB;AACrC,QAAM,EAAE,MAAAC,GAAM,iBAAAC,GAAiB,eAAAC,GAAe,UAAAC,GAAU,WAAAC,MAAcL,GAEhE,EAAE,KAAAM,GAAK,sBAAAC,GAAsB,yBAAAC,EAAA,IAA4BC,EAAA,GACzDC,IAA+BC,EAAA;AAGrC,EAAAC,EAAU,MAAM;AASZ,QARI,EAAEN,KAAOL,MAAS,WAIlBS,EAA6B,YAAYT,KAIzCM,KAAwBC;AACxB;AAGJ,UAAMK,IAAiBN,IAAuBD,EAAI,OAAO,mBAAmBA,EAAI,OAAO,QAAA;AAEvF,IACIO,MAAmB,WAClBN,IAAuB,KAAK,IAAIM,IAAiBZ,CAAI,IAAIH,IAAoBe,MAAmBZ,MAEjGK,EAAI,OAAO,QAAQL,GAAME,CAAa,GAG1CO,EAA6B,UAAUT;AAAA,EAC3C,GAAG,CAACK,GAAKL,GAAME,GAAeI,GAAsBC,CAAuB,CAAC;AAE5E,QAAMM,IAAe,MAAM;AAEvB,UAAMC,KADcT,GAAK,OAAO,QAAA,KAAa,KACf;AAE9B,IAAAF,EAASW,CAAO,GAChBT,GAAK,OAAO,QAAQS,GAASZ,CAAa;AAAA,EAC9C,GAEMa,IAAgB,MAAM;AAExB,UAAMD,KADcT,GAAK,OAAO,QAAA,KAAa,KACf;AAE9B,IAAAD,EAAUU,CAAO,GACjBT,GAAK,OAAO,QAAQS,GAASZ,CAAa;AAAA,EAC9C;AAEA,SAAID,IACO,OAGJ,gBAAAe,EAACC,GAAA,EAAY,UAAUJ,GAAc,WAAWE,GAAe;AAC1E;"}
+{"version":3,"file":"MapZoom.js","sources":["../../../../../src/components/map/components/features/MapZoom.tsx"],"sourcesContent":["import ZoomButtons from './settings/ZoomButtons';\nimport { useMapContext } from '../MapContext';\n\nexport type MapZoomProps = {\n    hideZoomButtons: boolean;\n    zoomAnimation: boolean;\n    onZoomIn: (zoom: number) => void;\n    onZoomOut: (zoom: number) => void;\n};\n\nconst MapZoom = (props: MapZoomProps) => {\n    const { hideZoomButtons, zoomAnimation, onZoomIn, onZoomOut } = props;\n\n    const { api } = useMapContext();\n\n    const handleZoomIn = () => {\n        const currentZoom = api?.utils?.getZoom() ?? 0;\n        const newZoom = currentZoom + 1;\n\n        onZoomIn(newZoom);\n        api?.utils?.setZoom(newZoom, zoomAnimation);\n    };\n\n    const handleZoomOut = () => {\n        const currentZoom = api?.utils?.getZoom() ?? 0;\n        const newZoom = currentZoom - 1;\n\n        onZoomOut(newZoom);\n        api?.utils?.setZoom(newZoom, zoomAnimation);\n    };\n\n    if (hideZoomButtons) {\n        return null;\n    }\n\n    return <ZoomButtons onZoomIn={handleZoomIn} onZoomOut={handleZoomOut} />;\n};\n\nexport default MapZoom;\n"],"names":["MapZoom","props","hideZoomButtons","zoomAnimation","onZoomIn","onZoomOut","api","useMapContext","handleZoomIn","newZoom","handleZoomOut","jsx","ZoomButtons"],"mappings":";;;AAUA,MAAMA,IAAU,CAACC,MAAwB;AACrC,QAAM,EAAE,iBAAAC,GAAiB,eAAAC,GAAe,UAAAC,GAAU,WAAAC,MAAcJ,GAE1D,EAAE,KAAAK,EAAA,IAAQC,EAAA,GAEVC,IAAe,MAAM;AAEvB,UAAMC,KADcH,GAAK,OAAO,QAAA,KAAa,KACf;AAE9B,IAAAF,EAASK,CAAO,GAChBH,GAAK,OAAO,QAAQG,GAASN,CAAa;AAAA,EAC9C,GAEMO,IAAgB,MAAM;AAExB,UAAMD,KADcH,GAAK,OAAO,QAAA,KAAa,KACf;AAE9B,IAAAD,EAAUI,CAAO,GACjBH,GAAK,OAAO,QAAQG,GAASN,CAAa;AAAA,EAC9C;AAEA,SAAID,IACO,OAGJ,gBAAAS,EAACC,GAAA,EAAY,UAAUJ,GAAc,WAAWE,GAAe;AAC1E;"}

package/components/map/components/features/layers/overlayLayers/IncidentsLayer.d.ts

@@ -2,5 +2,6 @@ export declare const CLUSTER_ICON_WIDTH = 34;
 export declare const CLUSTER_ICON_HEIGHT = 38;
 export declare const MARKER_ICON_WIDTH = 26;
 export declare const MARKER_ICON_HEIGHT = 31;
+export declare const buildTrafficIncidentsUrl: (area: string, apiKey?: string, language?: string) => string;
 declare const IncidentsLayer: () => null;
 export default IncidentsLayer;

package/components/map/components/features/layers/overlayLayers/IncidentsLayer.js

@@ -1,30 +1,36 @@
 import { useState as k, useEffect as P } from "react";
 import { useMapContext as _ } from "../../../MapContext.js";
-import { MAP_LAYER_INCIDENTS as v } from "../../../constants.js";
-const L = 34, M = 38, g = 26, f = 31, w = (o) => `<svg width="${g}" height="${f}" xmlns="http://www.w3.org/2000/svg" baseProfile="tiny" viewBox="0 0 26 31">
+import { MAP_LAYER_INCIDENTS as C } from "../../../constants.js";
+const D = 34, I = 38, g = 26, f = 31, R = (c, p, h) => [
+  "https://data.traffic.hereapi.com/v7/incidents?in=",
+  `bbox:${c}`,
+  "&locationReferencing=shape",
+  h ? `&lang=${encodeURIComponent(h)}` : "",
+  `&apiKey=${p}`
+].join(""), L = (c) => `<svg width="${g}" height="${f}" xmlns="http://www.w3.org/2000/svg" baseProfile="tiny" viewBox="0 0 26 31">
         <path fill="#868686" d="M16.995 28.98c0 1.115-1.79 2.02-4 2.02s-4-.905-4-2.02c0-1.118 1.79-2.026 4-2.026s4 .907 4 2.025"/>
-        <path fill="${o}" d="M1.702 17.693C.13 16.127.118 13.837 1.675 11.995l8.41-10.098c.772-.9 1.806-1.394 2.914-1.394 1.124 0 2.212.525 2.91 1.404l8.402 10.09c1.602 1.867 1.592 4.052-.027 5.693l-11.29 11.286L1.702 17.693z"/>
+        <path fill="${c}" d="M1.702 17.693C.13 16.127.118 13.837 1.675 11.995l8.41-10.098c.772-.9 1.806-1.394 2.914-1.394 1.124 0 2.212.525 2.91 1.404l8.402 10.09c1.602 1.867 1.592 4.052-.027 5.693l-11.29 11.286L1.702 17.693z"/>
         <path fill="#fff" d="M12.998 1.007c.97 0 1.91.445 2.516 1.213l8.41 10.1c1.375 1.602 1.494 3.503 0 5.016l-10.93 10.93-10.936-10.93c-1.392-1.384-1.39-3.374 0-5.016l8.41-10.1c.723-.84 1.642-1.213 2.53-1.213m0-1.007C11.74 0 10.57.555 9.703 1.563l-8.42 10.112c-1.732 2.047-1.708 4.61.063 6.374L12.28 28.976l.714.712.713-.713 10.93-10.93c1.8-1.82 1.818-4.324.055-6.383L16.288 1.576C15.514.596 14.278 0 12.998 0zM13.035 16.534c-.754 0-1.365.595-1.365 1.32 0 .73.613 1.326 1.365 1.326s1.363-.595 1.363-1.326c0-.725-.61-1.32-1.363-1.32zm0-1.332c.568 0 1.057-.448 1.088-.993l.365-5.916c.033-.548-.615-.996-1.455-.996-.832 0-1.49.448-1.453.996l.36 5.915c.034.544.526.992 1.095.992z"/>
-    </svg>`, R = (o) => `<svg width="${g}" height="${f}" xmlns="http://www.w3.org/2000/svg">
+    </svg>`, N = (c) => `<svg width="${g}" height="${f}" xmlns="http://www.w3.org/2000/svg">
         <path fill="#878787" d="m 16.8,29.4 c 0,-1.1 -1.8,-2 -4,-2 -2.2,0 -4.01,0.9 -4.01,2 0,1.1 1.81,2 4.01,2 2.2,0 4,-0.9 4,-2"/>
-        <path fill="${o}" d="m 24.1,17.8 c 1.6,-1.6 1.6,-3.8 0,-5.7 L 15.8,1.9 C 15,0.998 14,0.498 12.9,0.498 11.8,0.498 10.7,1.1 10,1.9 L 1.7,12.1 c -1.6,1.9 -1.6,4.1 0,5.7 L 12.9,29 24.1,17.8 z" stroke="#fff" stroke-width="1" />
+        <path fill="${c}" d="m 24.1,17.8 c 1.6,-1.6 1.6,-3.8 0,-5.7 L 15.8,1.9 C 15,0.998 14,0.498 12.9,0.498 11.8,0.498 10.7,1.1 10,1.9 L 1.7,12.1 c -1.6,1.9 -1.6,4.1 0,5.7 L 12.9,29 24.1,17.8 z" stroke="#fff" stroke-width="1" />
         <path d="m 18,15 0,0 c 0,-0.1 0,-0.2 0,-0.4 l 0,-0.2 c 0,-0.1 0,-0.2 0,-0.4 0,0 0,0 0,0 0.6,0 1.1,-0.4 1.1,-1 0,-0.5 -0.5,-1 -1,-1 -0.7,0 -1.1,0.5 -1.1,1 -0.1,0 -0.3,-0.1 -0.4,-0.1 l -0.6,0 -0.3,-0.5 C 15.2,11.6 14.3,11 13.3,11 L 18,11 17.2,9.6 C 17,9.3 16.7,9 16.3,9 L 12.8,9 C 12.4,9 12,9.3 11.8,9.6 L 11.1,11 9.8,11 C 9.7,11 9.6,11 9.5,11 9.2,11 9,10.9 9,10.6 L 9,10.4 C 9,10.2 9.2,9.9 9.5,9.9 l 1.2,0 0.6,-1.04 c 0.3,-0.5 0.9,-0.9 1.5,-0.9 l 3.5,0 c 0.6,0 1.2,0.4 1.5,0.9 l 0.6,1.04 1.2,0 c 0.2,0 0.4,0.3 0.4,0.5 l 0,0.2 c 0,0.3 -0.2,0.5 -0.4,0.5 l -0.1,0 c 0.3,0.3 0.5,0.7 0.5,1.1 l 0,3.4 c 0,0.2 -0.2,0.4 -0.4,0.4 l -1.1,0 C 18.3,16 18,15.8 18,15.6 L 18,15 z M 8,18.1 c 0.6,0 1.1,-0.5 1.1,-1.1 0,-0.5 -0.5,-1 -1.1,-1 -0.6,0 -1.1,0.5 -1.1,1 0,0.6 0.5,1.1 1.1,1.1 m 7,0 c 0.6,0 1.1,-0.5 1.1,-1.1 0,-0.5 -0.5,-1 -1.1,-1 -0.5,0 -1,0.5 -1,1 0,0.6 0.5,1.1 1,1.1 M 14.2,13.6 C 14,13.3 13.7,13 13.3,13 L 9.8,13 C 9.4,13 9,13.3 8.8,13.6 L 8.1,15 15,15 14.2,13.6 z m -8.2,1 0,-0.2 c 0,-0.2 0.2,-0.5 0.5,-0.5 l 1.1,0 0.7,-1 C 8.6,12.4 9.2,12 9.8,12 l 3.5,0 c 0.6,0 1.2,0.4 1.5,0.9 l 0.6,1 1.2,0 c 0.2,0 0.4,0.3 0.4,0.5 l 0,0.2 c 0,0.3 -0.2,0.5 -0.4,0.5 l -0.1,0 c 0.3,0.3 0.5,0.7 0.5,1.1 l 0,3.4 c 0,0.2 -0.2,0.4 -0.4,0.4 l -1.1,0 C 15.3,20 15,19.8 15,19.6 L 15,19 8,19 8,19.6 C 8,19.8 7.8,20 7.5,20 l -1,0 C 6.2,20 6,19.8 6,19.6 l 0,-3.4 c 0,-0.4 0.2,-0.8 0.6,-1.1 l -0.1,0 C 6.2,15.1 6,14.9 6,14.6" fill="#ffffff" />
-    </svg>`, C = (o) => `<svg width="${g}" height="${f}" viewBox="0 0 26 32" xmlns="http://www.w3.org/2000/svg">
+    </svg>`, M = (c) => `<svg width="${g}" height="${f}" viewBox="0 0 26 32" xmlns="http://www.w3.org/2000/svg">
         <g fill="none">
             <g>
                 <path fill="#868686" d="M16.995 28.98c0 1.116-1.79 2.02-4 2.02s-4-.904-4-2.02c0-1.118 1.79-2.023 4-2.023 2.21-.004 4 .904 4 2.022" />
-                <path fill="${o}" id="Shape" d="M1.675 11.995l8.41-10.098c.772-.9 1.806-1.394 2.914-1.394 1.124 0 2.212.525 2.91 1.404l8.402 10.09c1.602 1.867 1.592 4.052-.027 5.692l-11.29 11.286L1.702 17.693C.13 16.127.118 13.837 1.675 11.995z" />
+                <path fill="${c}" id="Shape" d="M1.675 11.995l8.41-10.098c.772-.9 1.806-1.394 2.914-1.394 1.124 0 2.212.525 2.91 1.404l8.402 10.09c1.602 1.867 1.592 4.052-.027 5.692l-11.29 11.286L1.702 17.693C.13 16.127.118 13.837 1.675 11.995z" />
                 <path fill="#fff" id="Shape" d="M12.998 1.007c.97 0 1.91.445 2.516 1.213l8.41 10.1c1.375 1.602 1.494 3.503 0 5.016l-10.93 10.93-10.936-10.93c-1.392-1.384-1.39-3.374 0-5.016l8.41-10.1c.723-.84 1.642-1.213 2.53-1.213zm0-1.007C11.74 0 10.57.555 9.703 1.563l-8.42 10.112c-1.732 2.047-1.708 4.61.063 6.374L12.28 28.976l.714.713.713-.713 10.93-10.93c1.8-1.82 1.818-4.324.055-6.383L16.288 1.576C15.514.596 14.278 0 12.998 0z" />
                 <path fill="#fff" d="M9 15h1.5v3.8H9zM16 15h1.5v3.8H16z" />
                 <path fill="#fff" id="Shape" d="M20.01 13.965c0 .276-.225.5-.5.5h-13c-.275 0-.5-.224-.5-.5v-2.637c0-.276.225-.5.5-.5h13c.275 0 .5.224.5.5v2.637z" />
                 <path fill="#D5232F" d="M9.565 11.33l-2.638 2.634h3.107l2.635-2.635H9.564zM16.004 11.33l-2.634 2.634h3.105l2.634-2.635h-3.106z" />
             </g>
         </g>
-    </svg>`, N = (o) => `<svg width="${g}" height="${f}" xmlns="http://www.w3.org/2000/svg">
+    </svg>`, A = (c) => `<svg width="${g}" height="${f}" xmlns="http://www.w3.org/2000/svg">
         <path fill="#878787" d="m 16.8,29.4 c 0,-1.1 -1.8,-2 -4,-2 -2.2,0 -4.01,0.9 -4.01,2 0,1.1 1.81,2 4.01,2 2.2,0 4,-0.9 4,-2" />
-        <path fill="${o}" stroke="#fff" stroke-width="1" d="m 24.1,17.8 c 1.6,-1.6 1.6,-3.8 0,-5.7 L 15.8,1.9 C 15,0.998 14,0.498 12.9,0.498 11.8,0.498 10.7,1.1 10,1.9 L 1.7,12.1 c -1.6,1.9 -1.6,4.1 0,5.7 L 12.9,29 24.1,17.8 z" />
+        <path fill="${c}" stroke="#fff" stroke-width="1" d="m 24.1,17.8 c 1.6,-1.6 1.6,-3.8 0,-5.7 L 15.8,1.9 C 15,0.998 14,0.498 12.9,0.498 11.8,0.498 10.7,1.1 10,1.9 L 1.7,12.1 c -1.6,1.9 -1.6,4.1 0,5.7 L 12.9,29 24.1,17.8 z" />
         <path fill="#ffffff" d="m 9.24,13.2 -3.7,6.8 1.3,0 2.8,-5.1 1.36,1.5 0,3.6 1.1,0 0,-4 -1.4,-1.6 -1.46,-1.2 z M 14.2,9.5 c 0.7,0 1.3,-0.5 1.3,-1.21 0,-0.7 -0.6,-1.2 -1.3,-1.2 -0.7,0 -1.2,0.5 -1.2,1.2 0,0.71 0.5,1.21 1.2,1.21 m -4.46,0.5 1.06,0 -0.96,2.1 -1,-0.8 0.9,-1.3 z m 2.56,4 -1,-0.7 1,-1.9 0,2.6 z m 6.9,1.7 c -0.4,-0.5 -1.5,-1.1 -2.3,0 -0.2,0.3 -0.6,0.7 -0.9,1.2 l -2.7,-2.1 0,-5 -0.8,-0.7 -3.26,0 -1.5,2.3 7.86,6 C 14.7,18.6 13.8,20 13.8,20 l 6,0 1.5,-1.6 c 0,0 -1.7,-2.2 -2.1,-2.7" />
-    </svg>`, A = (o) => `<svg xmlns="http://www.w3.org/2000/svg" width="${L}" height="${M}" viewBox="0 0 40 44">
+    </svg>`, O = (c) => `<svg xmlns="http://www.w3.org/2000/svg" width="${D}" height="${I}" viewBox="0 0 40 44">
         <g opacity=".25">
             <path fill="#4B4B4C" d="M20.498 42.5C12.778 42.5 6.5 39.584 6.5 36s6.28-6.5 13.998-6.5c7.72 0 14.002 2.916 14.002 6.5s-6.28 6.5-14.002 6.5z" />
             <path d="M20.498 30C28.574 30 34 33.104 34 36s-5.426 6-13.502 6C12.424 42 7 38.896 7 36s5.424-6 13.498-6m0-1C12.492 29 6 32.113 6 36s6.492 7 14.498 7C28.508 43 35 39.887 35 36s-6.49-7-14.502-7z" />
@@ -37,13 +43,13 @@ const L = 34, M = 38, g = 26, f = 31, w = (o) => `<svg width="${g}" height="${f}
         <path fill="#fff" d="M19.998 1c-1.453 0-2.803.64-3.803 1.803L6.48 14.47c-2 2.363-1.97 5.32.072 7.355L19 35l1 1 1-1 12.426-13.176c2.076-2.1 2.1-4.988.064-7.365L23.793 2.817C22.9 1.688 21.473 1 19.998 1z" />
         <path fill="#646469" d="M19.998 2.162c1.12 0 2.2.514 2.902 1.398l9.703 11.653c1.588 1.85 1.725 4.044 0 5.79L20 34.5 7.375 21.004c-1.607-1.598-1.605-3.895 0-5.79l9.703-11.65c.834-.972 1.895-1.402 2.92-1.402" />
         <path fill="none" d="M18.333 12.667H45.75v10.736H18.333z" />
-        <text transform="translate(20 23)" fill="#fff" font-family="sans-serif" font-size="14" color="#fff" font-weight="600" text-anchor="middle">${o}</text>
+        <text transform="translate(20 23)" fill="#fff" font-family="sans-serif" font-size="14" color="#fff" font-weight="600" text-anchor="middle">${c}</text>
     </svg>`, G = () => {
-  const { api: o, language: D, onIncidentsChange: I } = _(), l = o.map, [m, y] = k([]);
+  const { api: c, language: p, onIncidentsChange: h } = _(), l = c.map, [v, y] = k([]);
   P(() => {
-    let e, c;
+    let e, i;
     if (l) {
-      const i = new H.clustering.Provider(m, {
+      const o = new H.clustering.Provider(v, {
         min: 1,
         max: 21,
         clusteringOptions: {
@@ -52,7 +58,7 @@ const L = 34, M = 38, g = 26, f = 31, w = (o) => `<svg width="${g}" height="${f}
         },
         theme: {
           getClusterPresentation(n) {
-            const t = A(n.getWeight()), a = L, s = M, r = new H.map.Icon(t, {
+            const t = O(n.getWeight()), a = D, s = I, r = new H.map.Icon(t, {
               size: { w: a, h: s },
               anchor: { x: a / 2, y: s / 2 }
             }), d = new H.map.Marker(n.getPosition(), {
@@ -65,7 +71,7 @@ const L = 34, M = 38, g = 26, f = 31, w = (o) => `<svg width="${g}" height="${f}
             return d.setData(n), d;
           },
           getNoisePresentation(n) {
-            const t = B(n), a = g, s = f, r = new H.map.Icon(t, {
+            const t = b(n), a = g, s = f, r = new H.map.Icon(t, {
               size: { w: a, h: s },
               anchor: { x: a / 2, y: s }
             }), d = new H.map.Marker(n.getPosition(), {
@@ -73,55 +79,50 @@ const L = 34, M = 38, g = 26, f = 31, w = (o) => `<svg width="${g}" height="${f}
               // Use min zoom from a noise point to show it correctly at certain zoom levels:
               min: n.getMinZoom()
             });
-            return d.setData(n), d.addEventListener("pointerenter", (p) => {
-              const E = p.target.getData().getData().tooltipContent, S = p.target.getData().getPosition(), h = l.geoToScreen(S);
-              h.x += 0, h.y += -f;
-              const b = new H.ui.InfoBubble(l.screenToGeo(h.x, h.y), {
-                content: E
+            return d.setData(n), d.addEventListener("pointerenter", (u) => {
+              const B = u.target.getData().getData().tooltipContent, E = u.target.getData().getPosition(), m = l.geoToScreen(E);
+              m.x += 0, m.y += -f;
+              const S = new H.ui.InfoBubble(l.screenToGeo(m.x, m.y), {
+                content: B
               });
-              o.ui?.addBubble(b);
-            }), d.addEventListener("pointerleave", (p) => {
-              u();
+              c.ui?.addBubble(S);
+            }), d.addEventListener("pointerleave", (u) => {
+              w();
             }), d;
           }
         }
       });
-      c = () => {
-        u(), i.setDataPoints(m);
+      i = () => {
+        w(), o.setDataPoints(v);
         const n = l.getViewModel().getLookAtData().bounds?.getBoundingBox(), t = l.getViewModel().getLookAtData().position;
-        n && t && z(i, n, t, D);
-      }, c(), l?.addEventListener("mapviewchangeend", c), e = new H.map.layer.ObjectLayer(i), l.addLayer(e), console.log(`add layer - ${v}`);
+        n && t && z(o, n, t, p);
+      }, i(), l?.addEventListener("mapviewchangeend", i), e = new H.map.layer.ObjectLayer(o), l.addLayer(e), console.log(`add layer - ${C}`);
     }
     return () => {
-      e && (o.map?.removeLayer(e), e.dispose(), console.log(`remove layer - ${v}`)), c && l?.removeEventListener("mapviewchangeend", c);
+      e && (c.map?.removeLayer(e), e.dispose(), console.log(`remove layer - ${C}`)), i && l?.removeEventListener("mapviewchangeend", i);
     };
-  }, [o.map]);
-  const z = (e, c, i, n) => {
+  }, [c.map, p]);
+  const z = (e, i, o, n) => {
     if (l && l.getZoom() < 11) {
       console.log("Too much incidents to show, please zoom in");
       return;
     }
-    const a = [
-      "https://data.traffic.hereapi.com/v7/incidents?in=",
-      `bbox:${`${c.getLeft()},${c.getBottom()},${c.getRight()},${c.getTop()}`}`,
-      "&locationReferencing=shape",
-      `&apiKey=${o.credentials?.apikey}`
-    ].join("");
+    const t = `${i.getLeft()},${i.getBottom()},${i.getRight()},${i.getTop()}`, a = R(t, c.credentials?.apikey, n);
     fetch(a).then((s) => s.json()).then((s) => {
       if (s.results) {
         const r = $(s, n);
         e.setDataPoints(r), y(r);
       }
     });
-  }, $ = (e, c) => {
-    const i = [], n = {
+  }, $ = (e, i) => {
+    const o = [], n = {
       sourceUpdated: e.sourceUpdated,
       results: []
     };
     return e.results.forEach((t) => {
       const a = t.location.shape.links[0].points[0].lat, s = t.location.shape.links[0].points[0].lng, r = {
         id: t.incidentDetails.id,
-        tooltipContent: x(t, c),
+        tooltipContent: x(t, i),
         criticality: t.incidentDetails.criticality,
         description: t.incidentDetails.description,
         summary: t.incidentDetails.summary,
@@ -135,20 +136,20 @@ const L = 34, M = 38, g = 26, f = 31, w = (o) => `<svg width="${g}" height="${f}
           lng: s
         }
       };
-      n.results.push(r), i.push(new H.clustering.DataPoint(a, s, 1, r));
-    }), I(n), i;
-  }, x = (e, c) => {
-    const { comment: i = "", description: n, startTime: t, endTime: a } = e.incidentDetails;
+      n.results.push(r), o.push(new H.clustering.DataPoint(a, s, 1, r));
+    }), h(n), o;
+  }, x = (e, i) => {
+    const { comment: o = "", description: n, startTime: t, endTime: a } = e.incidentDetails;
     return `
-            <div class="text-size-12 line-height-16 margin-right-5 ${i ? "min-width-250" : "min-width-150"}">
+            <div class="text-size-12 line-height-16 margin-right-5 ${o ? "min-width-250" : "min-width-150"}">
                 <div class="text-medium">${n.value}</div>
                 <div class="margin-top-5 text-color-dark">
-                    ${new Intl.DateTimeFormat(c).format(Date.parse(t))} - 
-                    ${new Intl.DateTimeFormat(c).format(Date.parse(a))}
+                    ${new Intl.DateTimeFormat(i).format(Date.parse(t))} - 
+                    ${new Intl.DateTimeFormat(i).format(Date.parse(a))}
                 </div>
-                <hr class="${i ? "margin-y-10" : "display-none"}" />
+                <hr class="${o ? "margin-y-10" : "display-none"}" />
                 <div>
-                    ${i}
+                    ${o}
                 </div>
             </div>
         `;
@@ -163,32 +164,33 @@ const L = 34, M = 38, g = 26, f = 31, w = (o) => `<svg width="${g}" height="${f}
       default:
         return "#000";
     }
-  }, B = (e) => {
-    const c = e.getData().type, i = T(e);
-    switch (c) {
+  }, b = (e) => {
+    const i = e.getData().type, o = T(e);
+    switch (i) {
       case "congestion":
-        return R(i);
+        return N(o);
       case "roadClosure":
-        return C(i);
+        return M(o);
       case "construction":
-        return N(i);
+        return A(o);
       case "other":
-        return e.getData().roadClosed ? C(i) : w(i);
+        return e.getData().roadClosed ? M(o) : L(o);
       default:
-        return w(i);
+        return L(o);
     }
-  }, u = () => {
-    o.ui?.getBubbles().forEach((e) => {
-      o.ui?.removeBubble(e);
+  }, w = () => {
+    c.ui?.getBubbles().forEach((e) => {
+      c.ui?.removeBubble(e);
     });
   };
   return null;
 };
 export {
-  M as CLUSTER_ICON_HEIGHT,
-  L as CLUSTER_ICON_WIDTH,
+  I as CLUSTER_ICON_HEIGHT,
+  D as CLUSTER_ICON_WIDTH,
   f as MARKER_ICON_HEIGHT,
   g as MARKER_ICON_WIDTH,
+  R as buildTrafficIncidentsUrl,
   G as default
 };
 //# sourceMappingURL=IncidentsLayer.js.map