@rio-cloud/rio-uikit 2.0.0-beta.1 → 2.0.0-beta.2

package/components/map/components/MapSize.d.ts

@@ -1,4 +1,4 @@
-import type { MapApi } from '../utils/mapTypes';
+import { MapApi } from '../utils/mapTypes';
 declare const MapSize: ({ api }: {
     api: MapApi;
 }) => null;

package/components/map/components/MapSize.js

@@ -1,17 +1,18 @@
-import { useEffect } from 'react';
-import { throttle } from 'es-toolkit/function';
-import useEvent from "../../../useEvent.js";
-const RESIZE_THROTTLE = 1100; // 100 more than the ApplicationLayout handler
-const MapSize = ({ api }) => {
-    useEffect(() => {
-        const resizeMap = () => api?.map?.getViewPort().resize();
-        window.addEventListener('resize', resizeMap, { passive: true });
-        return () => {
-            window.removeEventListener('resize', resizeMap);
-        };
-    }, [api?.map]);
-    // Add a orientationchange listener to make sure that the map occupies the whole container on mobile
-    useEvent('orientationchange', throttle(() => api?.map?.getViewPort().resize(), RESIZE_THROTTLE), { passive: true }, window);
-    return null;
+import { useEffect as r } from "react";
+import { throttle as o } from "es-toolkit/function";
+import i from "../../../hooks/useEvent.js";
+const n = 1100, p = ({ api: e }) => (r(() => {
+  const t = () => e?.map?.getViewPort().resize();
+  return window.addEventListener("resize", t, { passive: !0 }), () => {
+    window.removeEventListener("resize", t);
+  };
+}, [e?.map]), i(
+  "orientationchange",
+  o(() => e?.map?.getViewPort().resize(), n),
+  { passive: !0 },
+  window
+), null);
+export {
+  p as default
 };
-export default MapSize;
+//# sourceMappingURL=MapSize.js.map

package/components/map/components/MapSize.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MapSize.js","sources":["../../../../src/components/map/components/MapSize.tsx"],"sourcesContent":["import { useEffect } from 'react';\nimport { throttle } from 'es-toolkit/function';\n\nimport useEvent from '../../../useEvent';\n\nimport type { MapApi } from '../utils/mapTypes';\n\nconst RESIZE_THROTTLE = 1100; // 100 more than the ApplicationLayout handler\n\nconst MapSize = ({ api }: { api: MapApi }) => {\n    useEffect(() => {\n        const resizeMap = () => api?.map?.getViewPort().resize();\n        window.addEventListener('resize', resizeMap, { passive: true });\n        return () => {\n            window.removeEventListener('resize', resizeMap);\n        };\n    }, [api?.map]);\n\n    // Add a orientationchange listener to make sure that the map occupies the whole container on mobile\n    useEvent(\n        'orientationchange',\n        throttle(() => api?.map?.getViewPort().resize(), RESIZE_THROTTLE),\n        { passive: true },\n        window\n    );\n\n    return null;\n};\n\nexport default MapSize;\n"],"names":["RESIZE_THROTTLE","MapSize","api","useEffect","resizeMap","useEvent","throttle"],"mappings":";;;AAOA,MAAMA,IAAkB,MAElBC,IAAU,CAAC,EAAE,KAAAC,SACfC,EAAU,MAAM;AACZ,QAAMC,IAAY,MAAMF,GAAK,KAAK,YAAA,EAAc,OAAA;AAChD,gBAAO,iBAAiB,UAAUE,GAAW,EAAE,SAAS,IAAM,GACvD,MAAM;AACT,WAAO,oBAAoB,UAAUA,CAAS;AAAA,EAClD;AACJ,GAAG,CAACF,GAAK,GAAG,CAAC,GAGbG;AAAA,EACI;AAAA,EACAC,EAAS,MAAMJ,GAAK,KAAK,cAAc,OAAA,GAAUF,CAAe;AAAA,EAChE,EAAE,SAAS,GAAA;AAAA,EACX;AAAA,GAGG;"}

package/components/map/components/constants.d.ts

@@ -1,4 +1,4 @@
-import type { MapType } from '../utils/mapTypes';
+import { MapType } from '../utils/mapTypes';
 export declare const MAP_TYPE_DEFAULT: MapType;
 export declare const MAP_TYPE_FLEET_STYLE: MapType;
 export declare const MAP_TYPE_SATELLITE: MapType;

package/components/map/components/constants.js

@@ -1,22 +1,19 @@
-export const MAP_TYPE_DEFAULT = 'DEFAULT';
-export const MAP_TYPE_FLEET_STYLE = 'FLEET_STYLE';
-export const MAP_TYPE_SATELLITE = 'SATELLITE';
-export const MAP_TYPE_TERRAIN = 'TERRAIN';
-export const MAP_TYPE_NIGHT = 'NIGHT';
-export const MAP_LAYER_INCIDENTS = 'INCIDENTS';
-export const MAP_LAYER_TRAFFIC = 'TRAFFIC';
-export const MAP_LAYER_ROAD_RESTRICTIONS = 'ROAD_RESTRICTIONS';
-// outdated?
-export const FORMAT = 'png8';
-export const TILE_SIZE = 256;
-export const TILE_TYPE = 'maptile';
-export const NO_CREDENTIALS_ERROR_MESSAGE = 'Cannot instantiate the Map. Missing credentials property.';
-// @ts-ignore-next-line
-// biome-ignore lint/complexity/useLiteralKeys: <explanation>
-export const ENGINE_TYPE_HARP = H.Map.EngineType['HARP'];
-export const ENGINE_TYPE_P2D = H.Map.EngineType.P2D;
-export const DEFAULT_TILE_SIZE = 512;
-export const DEFAULT_RASTER_LAYER_FORMAT = 'png'; // 'jpeg';
-export const DEFAULT_MIN_ZOOM = 3;
-export const DEFAULT_MAX_ZOOM = 20;
-export const DEFAULT_PIXEL_RATIO = 2;
+const E = "DEFAULT", T = "FLEET_STYLE", _ = "SATELLITE", A = "TERRAIN", I = "NIGHT", R = "INCIDENTS", L = "TRAFFIC", n = "ROAD_RESTRICTIONS", P = H.Map.EngineType.HARP, o = H.Map.EngineType.P2D, t = 512, c = "png", s = 3, M = 20, N = 2;
+export {
+  M as DEFAULT_MAX_ZOOM,
+  s as DEFAULT_MIN_ZOOM,
+  N as DEFAULT_PIXEL_RATIO,
+  c as DEFAULT_RASTER_LAYER_FORMAT,
+  t as DEFAULT_TILE_SIZE,
+  P as ENGINE_TYPE_HARP,
+  o as ENGINE_TYPE_P2D,
+  R as MAP_LAYER_INCIDENTS,
+  n as MAP_LAYER_ROAD_RESTRICTIONS,
+  L as MAP_LAYER_TRAFFIC,
+  E as MAP_TYPE_DEFAULT,
+  T as MAP_TYPE_FLEET_STYLE,
+  I as MAP_TYPE_NIGHT,
+  _ as MAP_TYPE_SATELLITE,
+  A as MAP_TYPE_TERRAIN
+};
+//# sourceMappingURL=constants.js.map

package/components/map/components/constants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.js","sources":["../../../../src/components/map/components/constants.ts"],"sourcesContent":["import type { MapType } from '../utils/mapTypes';\n\nexport const MAP_TYPE_DEFAULT: MapType = 'DEFAULT';\nexport const MAP_TYPE_FLEET_STYLE: MapType = 'FLEET_STYLE';\nexport const MAP_TYPE_SATELLITE: MapType = 'SATELLITE';\nexport const MAP_TYPE_TERRAIN: MapType = 'TERRAIN';\nexport const MAP_TYPE_NIGHT: MapType = 'NIGHT';\n\nexport const MAP_LAYER_INCIDENTS = 'INCIDENTS';\nexport const MAP_LAYER_TRAFFIC = 'TRAFFIC';\nexport const MAP_LAYER_ROAD_RESTRICTIONS = 'ROAD_RESTRICTIONS';\n\n// outdated?\nexport const FORMAT = 'png8';\nexport const TILE_SIZE = 256;\nexport const TILE_TYPE = 'maptile';\n\nexport const NO_CREDENTIALS_ERROR_MESSAGE = 'Cannot instantiate the Map. Missing credentials property.';\n\n// @ts-ignore-next-line\n// biome-ignore lint/complexity/useLiteralKeys: <explanation>\nexport const ENGINE_TYPE_HARP = H.Map.EngineType['HARP'];\nexport const ENGINE_TYPE_P2D = H.Map.EngineType.P2D;\n\nexport const DEFAULT_TILE_SIZE = 512;\nexport const DEFAULT_RASTER_LAYER_FORMAT = 'png'; // 'jpeg';\n\nexport const DEFAULT_MIN_ZOOM = 3;\nexport const DEFAULT_MAX_ZOOM = 20;\n\nexport const DEFAULT_PIXEL_RATIO = 2;\n"],"names":["MAP_TYPE_DEFAULT","MAP_TYPE_FLEET_STYLE","MAP_TYPE_SATELLITE","MAP_TYPE_TERRAIN","MAP_TYPE_NIGHT","MAP_LAYER_INCIDENTS","MAP_LAYER_TRAFFIC","MAP_LAYER_ROAD_RESTRICTIONS","ENGINE_TYPE_HARP","ENGINE_TYPE_P2D","DEFAULT_TILE_SIZE","DEFAULT_RASTER_LAYER_FORMAT","DEFAULT_MIN_ZOOM","DEFAULT_MAX_ZOOM","DEFAULT_PIXEL_RATIO"],"mappings":"AAEO,MAAMA,IAA4B,WAC5BC,IAAgC,eAChCC,IAA8B,aAC9BC,IAA4B,WAC5BC,IAA0B,SAE1BC,IAAsB,aACtBC,IAAoB,WACpBC,IAA8B,qBAW9BC,IAAmB,EAAE,IAAI,WAAW,MACpCC,IAAkB,EAAE,IAAI,WAAW,KAEnCC,IAAoB,KACpBC,IAA8B,OAE9BC,IAAmB,GACnBC,IAAmB,IAEnBC,IAAsB;"}

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

@@ -1,5 +1,5 @@
-import type { ContextMenuItemProps as ContextMenuItem } from './ContextMenuItem';
-import type { Position } from '../../utils/mapTypes';
+import { ContextMenuItemProps as ContextMenuItem } from './ContextMenuItem';
+import { Position } from '../../utils/mapTypes';
 export declare const isContextMenuEvent: (event: H.mapevents.ContextMenuEvent) => boolean;
 export declare const isMapTarget: (event: H.mapevents.ContextMenuEvent, map: H.Map) => any;
 export type ContextMenuProps = {

package/components/map/components/features/ContextMenu.js

@@ -1,148 +1,59 @@
-/* eslint-disable no-undef */
-import { useRef, useLayoutEffect } from 'react';
-import { isEmpty } from 'es-toolkit/compat';
-import { noop } from 'es-toolkit/function';
-import { useMapContext } from "../MapContext.js";
-const HERE_ITEM_CLASS = 'H_context_menu_item';
-const centeredSpinner = 
-// eslint-disable-next-line max-len
-'<svg aria-labelledby="ggtrwic-aria" role="img" height="14" width="135px" class="ContentLoader  use-mix-blend-mode"><title id="ggtrwic-aria">Loading...</title><rect role="presentation" x="0" y="0" width="100%" height="100%" clip-path="url(#ggtrwic-diff)" style="fill: url(&quot;#ggtrwic-animated-diff&quot;);"></rect><defs><clipPath id="ggtrwic-diff"><rect width="100%" height="100%" rx="3" ry="3"></rect></clipPath><linearGradient id="ggtrwic-animated-diff"><stop offset="0%" stop-color="#f5f6f7" stop-opacity="1"><animate attributeName="offset" values="-2; -2; 1" keyTimes="0; 0.25; 1" dur="2s" repeatCount="indefinite"></animate></stop><stop offset="50%" stop-color="#aaaaaa" stop-opacity="1"><animate attributeName="offset" values="-1; -1; 2" keyTimes="0; 0.25; 1" dur="2s" repeatCount="indefinite"></animate></stop><stop offset="100%" stop-color="#f5f6f7" stop-opacity="1"><animate attributeName="offset" values="0; 0; 3" keyTimes="0; 0.25; 1" dur="2s" repeatCount="indefinite"></animate></stop></linearGradient></defs></svg>';
-const getDOMMenuItems = () => [...document.getElementsByClassName(HERE_ITEM_CLASS)];
-// Query DOM nodes for "H_context_menu_item" and update label when children label has changed.
-// This function allows to use HTML markup for the menu items in the second render
-const updateMenuItemLabels = (nodes, items) => {
-    // setTimeout(() => {
-    Array.from(nodes).forEach((itemNode, index) => {
-        const item = items[index];
-        if (!item) {
-            return;
-        }
-        const { hasSpinner, className, labelClassName = '', icon, label } = item.props;
-        const contentLabel = `<span class="${labelClassName}">${label}</span>`;
-        const labelWithIcon = `<span class="rioglyph ${icon} margin-right-5"></span>${contentLabel}`;
-        const content = icon ? labelWithIcon : contentLabel;
-        if (hasSpinner) {
-            itemNode.innerHTML = centeredSpinner;
-        }
-        else {
-            itemNode.innerHTML = content;
-        }
-        const wrapperClassList = itemNode.classList;
-        // Since classList.add() does not allow for space separated multiple classes, we have to add them separately
-        if (className) {
-            className.split(' ').map((singleClassName) => wrapperClassList.add(singleClassName));
-        }
-    });
-    // }, 0);
+import { useRef as C, useLayoutEffect as d } from "react";
+import { isEmpty as g } from "es-toolkit/compat";
+import { noop as b } from "es-toolkit/function";
+import { useMapContext as M } from "../MapContext.js";
+const L = "H_context_menu_item", T = (
+  // eslint-disable-next-line max-len
+  '<svg aria-labelledby="ggtrwic-aria" role="img" height="14" width="135px" class="ContentLoader  use-mix-blend-mode"><title id="ggtrwic-aria">Loading...</title><rect role="presentation" x="0" y="0" width="100%" height="100%" clip-path="url(#ggtrwic-diff)" style="fill: url(&quot;#ggtrwic-animated-diff&quot;);"></rect><defs><clipPath id="ggtrwic-diff"><rect width="100%" height="100%" rx="3" ry="3"></rect></clipPath><linearGradient id="ggtrwic-animated-diff"><stop offset="0%" stop-color="#f5f6f7" stop-opacity="1"><animate attributeName="offset" values="-2; -2; 1" keyTimes="0; 0.25; 1" dur="2s" repeatCount="indefinite"></animate></stop><stop offset="50%" stop-color="#aaaaaa" stop-opacity="1"><animate attributeName="offset" values="-1; -1; 2" keyTimes="0; 0.25; 1" dur="2s" repeatCount="indefinite"></animate></stop><stop offset="100%" stop-color="#f5f6f7" stop-opacity="1"><animate attributeName="offset" values="0; 0; 3" keyTimes="0; 0.25; 1" dur="2s" repeatCount="indefinite"></animate></stop></linearGradient></defs></svg>'
+), h = () => [...document.getElementsByClassName(L)], w = (o, s) => {
+  Array.from(o).forEach((n, a) => {
+    const r = s[a];
+    if (!r)
+      return;
+    const { hasSpinner: f, className: c, labelClassName: t = "", icon: i, label: p } = r.props, e = `<span class="${t}">${p}</span>`, l = `<span class="rioglyph ${i} margin-right-5"></span>${e}`, u = i ? l : e;
+    f ? n.innerHTML = T : n.innerHTML = u;
+    const x = n.classList;
+    c && c.split(" ").map((E) => x.add(E));
+  });
+}, y = (o, s, n, a) => {
+  const r = o.length - 1, f = s.viewportX, c = a || n.screenToGeo(f, s.viewportY);
+  o.forEach((t, i) => {
+    if (!t)
+      return;
+    const { label: p, disabled: e, callback: l = b } = t.props;
+    s.items.push(
+      new H.util.ContextItem({
+        label: p,
+        disabled: e,
+        callback: () => l(c)
+      })
+    ), i < r && s.items.push(H.util.ContextItem.SEPARATOR);
+  });
+}, v = (o) => o.type === "contextmenu", m = (o, s) => o.target === s || o.target?.data?.source_name?.startsWith("H-"), P = (o) => {
+  const { onOpen: s = b, menuItems: n, contextMenuEvent: a, targetPosition: r } = o, { api: f, baseLayer: c } = M(), { map: t } = f, i = C();
+  i.current = r, d(() => {
+    if (n && t) {
+      const e = g(a?.items);
+      a && !m(a, t) && e && y(n, a, t, i.current), w(h(), n);
+    }
+  }, [n, a, i.current]);
+  const p = (e) => {
+    if (!v(e) || !t)
+      return;
+    m(e, t) && (i.current = void 0);
+    const l = e.viewportX, u = i.current || t?.screenToGeo(l, e.viewportY);
+    u && s(u), m(e, t) && n && g(e.items) && (y(n, e, t, r), w(h(), n));
+  };
+  return d(() => {
+    if (t)
+      return t.addEventListener("contextmenu", p), () => {
+        t.removeEventListener("contextmenu", p);
+      };
+  }, [c, t]), null;
 };
-const addItemsToEvent = (items, event, map, targetPosition) => {
-    const amount = items.length - 1;
-    // FIXME: The imported typing is wrong and according to
-    // https://www.here.com/docs/bundle/maps-api-for-javascript-api-reference/page/H.mapevents.ContextMenuEvent.html#viewportX
-    // it is a number
-    const viewportX = event.viewportX;
-    // Get geo coordinates from the screen coordinates or use a fixed set to be returned when
-    // clicking the menu item.
-    const coord = targetPosition || map.screenToGeo(viewportX, event.viewportY);
-    items.forEach((item, index) => {
-        if (!item) {
-            return;
-        }
-        const { label, disabled, callback = noop } = item.props;
-        // @ts-expect-error next-line FIXME: event.items is defined in the API but the imported types are wrong
-        event.items.push(new H.util.ContextItem({
-            label,
-            disabled,
-            callback: () => callback(coord),
-        }));
-        // add separator but for last element
-        if (index < amount) {
-            // @ts-expect-error next-line FIXME: event.items is defined in the API but the imported types are wrong
-            event.items.push(H.util.ContextItem.SEPARATOR);
-        }
-    });
+export {
+  P as default,
+  v as isContextMenuEvent,
+  m as isMapTarget
 };
-export const isContextMenuEvent = (event) => event.type === 'contextmenu';
-// Depending on the click target, it may be the map itself or individual parts of the map layer.
-// To check if the context menu click happened on a marker or polygon or circle, we need to check where
-// the user has clicked.
-//
-// Some map layer sources may be:
-// source_layer: "buildings", "landuse", "pois", "roads", "water", "places"
-// source_name: 'H-107';
-export const isMapTarget = (event, map) => {
-    return event.target === map || event.target?.data?.source_name?.startsWith('H-');
-};
-const ContextMenu = (props) => {
-    const { onOpen = noop, menuItems, contextMenuEvent, targetPosition } = props;
-    const { api, baseLayer } = useMapContext();
-    const { map: hereMap } = api;
-    // Use a ref to store the target position used when a map object was clicked with a fixed
-    // position to return that position in the onOpen callback instead of the dynamic map position
-    const targetPositionRef = useRef();
-    targetPositionRef.current = targetPosition;
-    useLayoutEffect(() => {
-        if (menuItems && hereMap) {
-            // @ts-expect-error next-line FIXME: event.items is defined in the API but the imported types are wrong
-            const hasNoEventItems = isEmpty(contextMenuEvent?.items);
-            // Add the context menu item to the target event and not to the map event itself
-            // as every element on the map need to have context menu items added to the event they
-            // are triggered from
-            if (contextMenuEvent && !isMapTarget(contextMenuEvent, hereMap) && hasNoEventItems) {
-                addItemsToEvent(menuItems, contextMenuEvent, hereMap, targetPositionRef.current);
-            }
-            updateMenuItemLabels(getDOMMenuItems(), menuItems);
-        }
-    }, [menuItems, contextMenuEvent, targetPositionRef.current]);
-    const handleMapContextMenu = (event) => {
-        if (!isContextMenuEvent(event) || !hereMap) {
-            return;
-        }
-        // "contextmenu" event might be triggered not only by a pointer,
-        // but a keyboard button as well. That's why ContextMenuEvent
-        // doesn't have a "currentPointer" property.
-        // Instead it has "viewportX" and "viewportY" properties
-        // for the associates position.
-        // Reset previous target positions when the map was clicked
-        if (isMapTarget(event, hereMap)) {
-            targetPositionRef.current = undefined;
-        }
-        // FIXME: The imported typing is wrong and according to
-        // https://www.here.com/docs/bundle/maps-api-for-javascript-api-reference/page/H.mapevents.ContextMenuEvent.html#viewportX
-        // it is a number
-        const viewportX = event.viewportX;
-        // Get geo coordinates from the screen coordinates.
-        const coord = targetPositionRef.current || hereMap?.screenToGeo(viewportX, event.viewportY);
-        if (coord) {
-            onOpen(coord);
-        }
-        // As we already handle contextmenu event callback on map object like markers separately,
-        // we don't do anything if target is different than the map.
-        if (!isMapTarget(event, hereMap)) {
-            return;
-        }
-        if (!menuItems) {
-            return;
-        }
-        // @ts-expect-error next-line FIXME: event.items is defined in the API but the imported types are wrong
-        if (isEmpty(event.items)) {
-            addItemsToEvent(menuItems, event, hereMap, targetPosition);
-            updateMenuItemLabels(getDOMMenuItems(), menuItems);
-        }
-    };
-    // The contextmenu event handler has to be registered in any case to handle context menu events and to
-    // trigger the callback when the menu opens. Take care to remove and add the event listener when the
-    // base map layer changes as the map get re-initialized. Otherwise the context menu cannot be opened anymore
-    // when switching to another map view.
-    useLayoutEffect(() => {
-        if (!hereMap) {
-            return;
-        }
-        hereMap.addEventListener('contextmenu', handleMapContextMenu);
-        return () => {
-            hereMap.removeEventListener('contextmenu', handleMapContextMenu);
-        };
-    }, [baseLayer, hereMap]);
-    return null;
-};
-export default ContextMenu;
+//# sourceMappingURL=ContextMenu.js.map

package/components/map/components/features/ContextMenu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ContextMenu.js","sources":["../../../../../src/components/map/components/features/ContextMenu.tsx"],"sourcesContent":["/* eslint-disable no-undef */\nimport { useRef, useLayoutEffect } from 'react';\nimport { isEmpty } from 'es-toolkit/compat';\nimport { noop } from 'es-toolkit/function';\n\nimport { useMapContext } from '../MapContext';\nimport type { ContextMenuItemProps as ContextMenuItem } from './ContextMenuItem';\nimport type { Position } from '../../utils/mapTypes';\n\nconst HERE_ITEM_CLASS = 'H_context_menu_item';\n\nconst centeredSpinner =\n    // eslint-disable-next-line max-len\n    '<svg aria-labelledby=\"ggtrwic-aria\" role=\"img\" height=\"14\" width=\"135px\" class=\"ContentLoader  use-mix-blend-mode\"><title id=\"ggtrwic-aria\">Loading...</title><rect role=\"presentation\" x=\"0\" y=\"0\" width=\"100%\" height=\"100%\" clip-path=\"url(#ggtrwic-diff)\" style=\"fill: url(&quot;#ggtrwic-animated-diff&quot;);\"></rect><defs><clipPath id=\"ggtrwic-diff\"><rect width=\"100%\" height=\"100%\" rx=\"3\" ry=\"3\"></rect></clipPath><linearGradient id=\"ggtrwic-animated-diff\"><stop offset=\"0%\" stop-color=\"#f5f6f7\" stop-opacity=\"1\"><animate attributeName=\"offset\" values=\"-2; -2; 1\" keyTimes=\"0; 0.25; 1\" dur=\"2s\" repeatCount=\"indefinite\"></animate></stop><stop offset=\"50%\" stop-color=\"#aaaaaa\" stop-opacity=\"1\"><animate attributeName=\"offset\" values=\"-1; -1; 2\" keyTimes=\"0; 0.25; 1\" dur=\"2s\" repeatCount=\"indefinite\"></animate></stop><stop offset=\"100%\" stop-color=\"#f5f6f7\" stop-opacity=\"1\"><animate attributeName=\"offset\" values=\"0; 0; 3\" keyTimes=\"0; 0.25; 1\" dur=\"2s\" repeatCount=\"indefinite\"></animate></stop></linearGradient></defs></svg>';\n\nconst getDOMMenuItems = (): Element[] => [...document.getElementsByClassName(HERE_ITEM_CLASS)];\n\n// Query DOM nodes for \"H_context_menu_item\" and update label when children label has changed.\n// This function allows to use HTML markup for the menu items in the second render\nconst updateMenuItemLabels = (nodes: Element[], items: React.ReactElement<ContextMenuItem>[]) => {\n    // setTimeout(() => {\n    Array.from(nodes).forEach((itemNode, index) => {\n        const item = items[index];\n        if (!item) {\n            return;\n        }\n\n        const { hasSpinner, className, labelClassName = '', icon, label } = item.props;\n\n        const contentLabel = `<span class=\"${labelClassName}\">${label}</span>`;\n        const labelWithIcon = `<span class=\"rioglyph ${icon} margin-right-5\"></span>${contentLabel}`;\n        const content = icon ? labelWithIcon : contentLabel;\n\n        if (hasSpinner) {\n            itemNode.innerHTML = centeredSpinner;\n        } else {\n            itemNode.innerHTML = content;\n        }\n\n        const wrapperClassList = itemNode.classList;\n\n        // Since classList.add() does not allow for space separated multiple classes, we have to add them separately\n        if (className) {\n            className.split(' ').map((singleClassName: string) => wrapperClassList.add(singleClassName));\n        }\n    });\n    // }, 0);\n};\n\nconst addItemsToEvent = (\n    items: React.ReactElement<ContextMenuItem>[],\n    event: H.mapevents.ContextMenuEvent,\n    map: H.Map,\n    targetPosition?: Position\n) => {\n    const amount = items.length - 1;\n\n    // FIXME: The imported typing is wrong and according to\n    // https://www.here.com/docs/bundle/maps-api-for-javascript-api-reference/page/H.mapevents.ContextMenuEvent.html#viewportX\n    // it is a number\n    const viewportX = event.viewportX as unknown as number;\n\n    // Get geo coordinates from the screen coordinates or use a fixed set to be returned when\n    // clicking the menu item.\n    const coord = targetPosition || map.screenToGeo(viewportX, event.viewportY);\n\n    items.forEach((item, index) => {\n        if (!item) {\n            return;\n        }\n\n        const { label, disabled, callback = noop } = item.props;\n\n        // @ts-expect-error next-line FIXME: event.items is defined in the API but the imported types are wrong\n        event.items.push(\n            new H.util.ContextItem({\n                label,\n                disabled,\n                callback: () => callback(coord),\n            })\n        );\n\n        // add separator but for last element\n        if (index < amount) {\n            // @ts-expect-error next-line FIXME: event.items is defined in the API but the imported types are wrong\n            event.items.push(H.util.ContextItem.SEPARATOR);\n        }\n    });\n};\n\nexport const isContextMenuEvent = (event: H.mapevents.ContextMenuEvent) => event.type === 'contextmenu';\n\n// Depending on the click target, it may be the map itself or individual parts of the map layer.\n// To check if the context menu click happened on a marker or polygon or circle, we need to check where\n// the user has clicked.\n//\n// Some map layer sources may be:\n// source_layer: \"buildings\", \"landuse\", \"pois\", \"roads\", \"water\", \"places\"\n// source_name: 'H-107';\nexport const isMapTarget = (event: H.mapevents.ContextMenuEvent, map: H.Map) => {\n    return event.target === map || event.target?.data?.source_name?.startsWith('H-');\n};\n\nexport type ContextMenuProps = {\n    onOpen?: (menuPosition: Position) => void;\n    menuItems?: React.ReactElement<ContextMenuItem>[];\n    contextMenuEvent?: H.mapevents.ContextMenuEvent;\n    targetPosition?: Position;\n};\n\nconst ContextMenu = (props: ContextMenuProps) => {\n    const { onOpen = noop, menuItems, contextMenuEvent, targetPosition } = props;\n\n    const { api, baseLayer } = useMapContext();\n    const { map: hereMap } = api;\n\n    // Use a ref to store the target position used when a map object was clicked with a fixed\n    // position to return that position in the onOpen callback instead of the dynamic map position\n    const targetPositionRef = useRef<Position>();\n    targetPositionRef.current = targetPosition;\n\n    useLayoutEffect(() => {\n        if (menuItems && hereMap) {\n            // @ts-expect-error next-line FIXME: event.items is defined in the API but the imported types are wrong\n            const hasNoEventItems = isEmpty(contextMenuEvent?.items);\n\n            // Add the context menu item to the target event and not to the map event itself\n            // as every element on the map need to have context menu items added to the event they\n            // are triggered from\n            if (contextMenuEvent && !isMapTarget(contextMenuEvent, hereMap) && hasNoEventItems) {\n                addItemsToEvent(menuItems, contextMenuEvent, hereMap, targetPositionRef.current);\n            }\n\n            updateMenuItemLabels(getDOMMenuItems(), menuItems);\n        }\n    }, [menuItems, contextMenuEvent, targetPositionRef.current]);\n\n    const handleMapContextMenu = (event: H.mapevents.ContextMenuEvent) => {\n        if (!isContextMenuEvent(event) || !hereMap) {\n            return;\n        }\n\n        // \"contextmenu\" event might be triggered not only by a pointer,\n        // but a keyboard button as well. That's why ContextMenuEvent\n        // doesn't have a \"currentPointer\" property.\n        // Instead it has \"viewportX\" and \"viewportY\" properties\n        // for the associates position.\n\n        // Reset previous target positions when the map was clicked\n        if (isMapTarget(event, hereMap)) {\n            targetPositionRef.current = undefined;\n        }\n\n        // FIXME: The imported typing is wrong and according to\n        // https://www.here.com/docs/bundle/maps-api-for-javascript-api-reference/page/H.mapevents.ContextMenuEvent.html#viewportX\n        // it is a number\n        const viewportX = event.viewportX as unknown as number;\n\n        // Get geo coordinates from the screen coordinates.\n        const coord = targetPositionRef.current || hereMap?.screenToGeo(viewportX, event.viewportY);\n        if (coord) {\n            onOpen(coord);\n        }\n\n        // As we already handle contextmenu event callback on map object like markers separately,\n        // we don't do anything if target is different than the map.\n        if (!isMapTarget(event, hereMap)) {\n            return;\n        }\n\n        if (!menuItems) {\n            return;\n        }\n\n        // @ts-expect-error next-line FIXME: event.items is defined in the API but the imported types are wrong\n        if (isEmpty(event.items)) {\n            addItemsToEvent(menuItems, event, hereMap, targetPosition);\n            updateMenuItemLabels(getDOMMenuItems(), menuItems);\n        }\n    };\n\n    // The contextmenu event handler has to be registered in any case to handle context menu events and to\n    // trigger the callback when the menu opens. Take care to remove and add the event listener when the\n    // base map layer changes as the map get re-initialized. Otherwise the context menu cannot be opened anymore\n    // when switching to another map view.\n    useLayoutEffect(() => {\n        if (!hereMap) {\n            return;\n        }\n\n        hereMap.addEventListener('contextmenu', handleMapContextMenu as any);\n\n        return () => {\n            hereMap.removeEventListener('contextmenu', handleMapContextMenu as any);\n        };\n    }, [baseLayer, hereMap]);\n\n    return null;\n};\n\nexport default ContextMenu;\n"],"names":["HERE_ITEM_CLASS","centeredSpinner","getDOMMenuItems","updateMenuItemLabels","nodes","items","itemNode","index","item","hasSpinner","className","labelClassName","icon","label","contentLabel","labelWithIcon","content","wrapperClassList","singleClassName","addItemsToEvent","event","map","targetPosition","amount","viewportX","coord","disabled","callback","noop","isContextMenuEvent","isMapTarget","ContextMenu","props","onOpen","menuItems","contextMenuEvent","api","baseLayer","useMapContext","hereMap","targetPositionRef","useRef","useLayoutEffect","hasNoEventItems","isEmpty","handleMapContextMenu"],"mappings":"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"}

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

@@ -1,4 +1,4 @@
-import type { Position } from '../../utils/mapTypes';
+import { Position } from '../../utils/mapTypes';
 export type ContextMenuItemProps = {
     label: string;
     disabled?: boolean;

package/components/map/components/features/ContextMenuItem.js

@@ -1,15 +1,20 @@
-import { noop } from 'es-toolkit/function';
-const ContextMenuItem = (props) => {
-    // Note: not all defined props are passed to the Here ContextItem are used in ContextMenu component
-    const { label = '', disabled = false, callback = noop,
+import { noop as n } from "es-toolkit/function";
+const r = (t) => {
+  const {
+    label: e = "",
+    disabled: o = !1,
+    callback: l = n
     // hasSpinner = false,
     // className = '',
     // labelClassName = '',
-     } = props;
-    return new H.util.ContextItem({
-        label,
-        disabled,
-        callback: callback,
-    });
+  } = t;
+  return new H.util.ContextItem({
+    label: e,
+    disabled: o,
+    callback: l
+  });
 };
-export default ContextMenuItem;
+export {
+  r as default
+};
+//# sourceMappingURL=ContextMenuItem.js.map

package/components/map/components/features/ContextMenuItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ContextMenuItem.js","sources":["../../../../../src/components/map/components/features/ContextMenuItem.tsx"],"sourcesContent":["import { noop } from 'es-toolkit/function';\n\nimport type { Position } from '../../utils/mapTypes';\n\nexport type ContextMenuItemProps = {\n    label: string;\n    disabled?: boolean;\n    callback?: (position: Position) => void;\n    hasSpinner?: boolean;\n    icon?: string;\n    className?: string;\n    labelClassName?: string;\n};\n\nconst ContextMenuItem = (props: ContextMenuItemProps) => {\n    // Note: not all defined props are passed to the Here ContextItem are used in ContextMenu component\n    const {\n        label = '',\n        disabled = false,\n        callback = noop,\n        // hasSpinner = false,\n        // className = '',\n        // labelClassName = '',\n    } = props;\n\n    return new H.util.ContextItem({\n        label,\n        disabled,\n        callback: callback as any,\n    });\n};\n\nexport default ContextMenuItem;\n"],"names":["ContextMenuItem","props","label","disabled","callback","noop"],"mappings":";AAcA,MAAMA,IAAkB,CAACC,MAAgC;AAErD,QAAM;AAAA,IACF,OAAAC,IAAQ;AAAA,IACR,UAAAC,IAAW;AAAA,IACX,UAAAC,IAAWC;AAAA;AAAA;AAAA;AAAA,EAAA,IAIXJ;AAEJ,SAAO,IAAI,EAAE,KAAK,YAAY;AAAA,IAC1B,OAAAC;AAAA,IACA,UAAAC;AAAA,IACA,UAAAC;AAAA,EAAA,CACH;AACL;"}

package/components/map/components/features/MapSettings.js

@@ -1,43 +1,30 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import React from 'react';
-import classNames from 'classnames';
-import { map } from 'es-toolkit/compat';
-import MapTypeSettings from "./settings/builtinSettings/MapTypeSettings.js";
-import MapLayerSettings from "./settings/builtinSettings/MapLayerSettings.js";
-import MapClusterSettings from "./settings/builtinSettings/MapClusterSettings.js";
-import { useMapContext } from "../MapContext.js";
-const isMapTypeSettings = (option) => option.type === MapTypeSettings;
-const isMapLayerSettings = (option) => option.type === MapLayerSettings;
-const isMapClusterSettings = (option) => option.type === MapClusterSettings;
-const MapSettings = (props) => {
-    const { options, className = '' } = props;
-    const { baseLayer, activeLayers, showCluster, onMapTypeChange, onMapLayerChange, onShowClusterChange } = useMapContext();
-    const mapSettingsClasses = classNames('MapSettingsWrapper', className);
-    return (_jsx("div", { className: mapSettingsClasses, children: map(options, option => {
-            if (isMapTypeSettings(option)) {
-                return React.cloneElement(option, {
-                    key: option?.key ?? crypto.randomUUID(),
-                    mapType: baseLayer,
-                    onMapTypeChange,
-                });
-            }
-            if (isMapLayerSettings(option)) {
-                return React.cloneElement(option, {
-                    key: option?.key ?? crypto.randomUUID(),
-                    activeBuiltinLayers: activeLayers,
-                    onMapLayerChange,
-                });
-            }
-            if (isMapClusterSettings(option)) {
-                return React.cloneElement(option, {
-                    key: option?.key ?? crypto.randomUUID(),
-                    showCluster,
-                    onShowClusterChange,
-                });
-            }
-            return React.cloneElement(option, {
-                key: option?.key ?? `MapSettingsOption_${crypto.randomUUID()}`,
-            });
-        }) }));
+import { jsx as l } from "react/jsx-runtime";
+import r from "react";
+import g from "classnames";
+import { map as f } from "es-toolkit/compat";
+import u from "./settings/builtinSettings/MapTypeSettings.js";
+import M from "./settings/builtinSettings/MapLayerSettings.js";
+import S from "./settings/builtinSettings/MapClusterSettings.js";
+import { useMapContext as C } from "../MapContext.js";
+const k = (t) => t.type === u, U = (t) => t.type === M, d = (t) => t.type === S, N = (t) => {
+  const { options: a, className: s = "" } = t, { baseLayer: n, activeLayers: m, showCluster: p, onMapTypeChange: o, onMapLayerChange: y, onShowClusterChange: c } = C(), i = g("MapSettingsWrapper", s);
+  return /* @__PURE__ */ l("div", { className: i, children: f(a, (e) => k(e) ? r.cloneElement(e, {
+    key: e?.key ?? crypto.randomUUID(),
+    mapType: n,
+    onMapTypeChange: o
+  }) : U(e) ? r.cloneElement(e, {
+    key: e?.key ?? crypto.randomUUID(),
+    activeBuiltinLayers: m,
+    onMapLayerChange: y
+  }) : d(e) ? r.cloneElement(e, {
+    key: e?.key ?? crypto.randomUUID(),
+    showCluster: p,
+    onShowClusterChange: c
+  }) : r.cloneElement(e, {
+    key: e?.key ?? `MapSettingsOption_${crypto.randomUUID()}`
+  })) });
 };
-export default MapSettings;
+export {
+  N as default
+};
+//# sourceMappingURL=MapSettings.js.map

package/components/map/components/features/MapSettings.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MapSettings.js","sources":["../../../../../src/components/map/components/features/MapSettings.tsx"],"sourcesContent":["import React from 'react';\nimport classNames from 'classnames';\nimport { map } from 'es-toolkit/compat';\n\nimport MapTypeSettings from './settings/builtinSettings/MapTypeSettings';\nimport MapLayerSettings from './settings/builtinSettings/MapLayerSettings';\nimport MapClusterSettings from './settings/builtinSettings/MapClusterSettings';\nimport { useMapContext } from '../MapContext';\n\nconst isMapTypeSettings = (option: JSX.Element) => option.type === MapTypeSettings;\nconst isMapLayerSettings = (option: JSX.Element) => option.type === MapLayerSettings;\nconst isMapClusterSettings = (option: JSX.Element) => option.type === MapClusterSettings;\n\nexport type MapSettingsProps = {\n    options?: JSX.Element[];\n    className?: string;\n};\n\nconst MapSettings = (props: MapSettingsProps) => {\n    const { options, className = '' } = props;\n\n    const { baseLayer, activeLayers, showCluster, onMapTypeChange, onMapLayerChange, onShowClusterChange } =\n        useMapContext();\n\n    const mapSettingsClasses = classNames('MapSettingsWrapper', className);\n\n    return (\n        <div className={mapSettingsClasses}>\n            {map(options, option => {\n                if (isMapTypeSettings(option)) {\n                    return React.cloneElement(option, {\n                        key: option?.key ?? crypto.randomUUID(),\n                        mapType: baseLayer,\n                        onMapTypeChange,\n                    });\n                }\n\n                if (isMapLayerSettings(option)) {\n                    return React.cloneElement(option, {\n                        key: option?.key ?? crypto.randomUUID(),\n                        activeBuiltinLayers: activeLayers,\n                        onMapLayerChange,\n                    });\n                }\n\n                if (isMapClusterSettings(option)) {\n                    return React.cloneElement(option, {\n                        key: option?.key ?? crypto.randomUUID(),\n                        showCluster,\n                        onShowClusterChange,\n                    });\n                }\n\n                return React.cloneElement(option, {\n                    key: option?.key ?? `MapSettingsOption_${crypto.randomUUID()}`,\n                });\n            })}\n        </div>\n    );\n};\n\nexport default MapSettings;\n"],"names":["isMapTypeSettings","option","MapTypeSettings","isMapLayerSettings","MapLayerSettings","isMapClusterSettings","MapClusterSettings","MapSettings","props","options","className","baseLayer","activeLayers","showCluster","onMapTypeChange","onMapLayerChange","onShowClusterChange","useMapContext","mapSettingsClasses","classNames","map","React"],"mappings":";;;;;;;;AASA,MAAMA,IAAoB,CAACC,MAAwBA,EAAO,SAASC,GAC7DC,IAAqB,CAACF,MAAwBA,EAAO,SAASG,GAC9DC,IAAuB,CAACJ,MAAwBA,EAAO,SAASK,GAOhEC,IAAc,CAACC,MAA4B;AAC7C,QAAM,EAAE,SAAAC,GAAS,WAAAC,IAAY,GAAA,IAAOF,GAE9B,EAAE,WAAAG,GAAW,cAAAC,GAAc,aAAAC,GAAa,iBAAAC,GAAiB,kBAAAC,GAAkB,qBAAAC,EAAA,IAC7EC,EAAA,GAEEC,IAAqBC,EAAW,sBAAsBT,CAAS;AAErE,2BACK,OAAA,EAAI,WAAWQ,GACX,UAAAE,EAAIX,GAAS,CAAAR,MACND,EAAkBC,CAAM,IACjBoB,EAAM,aAAapB,GAAQ;AAAA,IAC9B,KAAKA,GAAQ,OAAO,OAAO,WAAA;AAAA,IAC3B,SAASU;AAAA,IACT,iBAAAG;AAAA,EAAA,CACH,IAGDX,EAAmBF,CAAM,IAClBoB,EAAM,aAAapB,GAAQ;AAAA,IAC9B,KAAKA,GAAQ,OAAO,OAAO,WAAA;AAAA,IAC3B,qBAAqBW;AAAA,IACrB,kBAAAG;AAAA,EAAA,CACH,IAGDV,EAAqBJ,CAAM,IACpBoB,EAAM,aAAapB,GAAQ;AAAA,IAC9B,KAAKA,GAAQ,OAAO,OAAO,WAAA;AAAA,IAC3B,aAAAY;AAAA,IACA,qBAAAG;AAAA,EAAA,CACH,IAGEK,EAAM,aAAapB,GAAQ;AAAA,IAC9B,KAAKA,GAAQ,OAAO,qBAAqB,OAAO,YAAY;AAAA,EAAA,CAC/D,CACJ,EAAA,CACL;AAER;"}

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

@@ -1,35 +1,25 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useEffect } from 'react';
-import ZoomButtons from "./settings/ZoomButtons.js";
-import { useMapContext } from "../MapContext.js";
-const MapZoom = (props) => {
-    const { zoom, hideZoomButtons, zoomAnimation, onZoomIn, onZoomOut } = props;
-    const { api } = useMapContext();
-    // Update Zoom from outside if value is different
-    useEffect(() => {
-        if (!api) {
-            return;
-        }
-        const currentMapZoom = api.utils?.getZoom();
-        if (zoom && currentMapZoom !== zoom) {
-            api.utils?.setZoom(zoom, zoomAnimation);
-        }
-    }, [zoom]);
-    const handleZoomIn = () => {
-        const currentZoom = api?.utils?.getZoom() ?? 0;
-        const newZoom = currentZoom + 1;
-        onZoomIn(newZoom);
-        api?.utils?.setZoom(newZoom, zoomAnimation);
-    };
-    const handleZoomOut = () => {
-        const currentZoom = api?.utils?.getZoom() ?? 0;
-        const newZoom = currentZoom - 1;
-        onZoomOut(newZoom);
-        api?.utils?.setZoom(newZoom, zoomAnimation);
-    };
-    if (hideZoomButtons) {
-        return null;
-    }
-    return _jsx(ZoomButtons, { onZoomIn: handleZoomIn, onZoomOut: handleZoomOut });
+import { jsx as l } from "react/jsx-runtime";
+import { useEffect as f } from "react";
+import a from "./settings/ZoomButtons.js";
+import { useMapContext as p } from "../MapContext.js";
+const I = (r) => {
+  const { zoom: n, hideZoomButtons: s, zoomAnimation: m, onZoomIn: u, onZoomOut: Z } = r, { api: o } = p();
+  f(() => {
+    if (!o)
+      return;
+    const e = o.utils?.getZoom();
+    n && e !== n && o.utils?.setZoom(n, m);
+  }, [n]);
+  const i = () => {
+    const t = (o?.utils?.getZoom() ?? 0) + 1;
+    u(t), o?.utils?.setZoom(t, m);
+  }, c = () => {
+    const t = (o?.utils?.getZoom() ?? 0) - 1;
+    Z(t), o?.utils?.setZoom(t, m);
+  };
+  return s ? null : /* @__PURE__ */ l(a, { onZoomIn: i, onZoomOut: c });
 };
-export default MapZoom;
+export {
+  I as default
+};
+//# sourceMappingURL=MapZoom.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"MapZoom.js","sources":["../../../../../src/components/map/components/features/MapZoom.tsx"],"sourcesContent":["import { useEffect } from 'react';\n\nimport ZoomButtons from './settings/ZoomButtons';\nimport { useMapContext } from '../MapContext';\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 } = useMapContext();\n\n    // Update Zoom from outside if value is different\n    useEffect(() => {\n        if (!api) {\n            return;\n        }\n\n        const currentMapZoom = api.utils?.getZoom();\n\n        if (zoom && currentMapZoom !== zoom) {\n            api.utils?.setZoom(zoom, zoomAnimation);\n        }\n    }, [zoom]);\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","zoom","hideZoomButtons","zoomAnimation","onZoomIn","onZoomOut","api","useMapContext","useEffect","currentMapZoom","handleZoomIn","newZoom","handleZoomOut","jsx","ZoomButtons"],"mappings":";;;;AAaA,MAAMA,IAAU,CAACC,MAAwB;AACrC,QAAM,EAAE,MAAAC,GAAM,iBAAAC,GAAiB,eAAAC,GAAe,UAAAC,GAAU,WAAAC,MAAcL,GAEhE,EAAE,KAAAM,EAAA,IAAQC,EAAA;AAGhB,EAAAC,EAAU,MAAM;AACZ,QAAI,CAACF;AACD;AAGJ,UAAMG,IAAiBH,EAAI,OAAO,QAAA;AAElC,IAAIL,KAAQQ,MAAmBR,KAC3BK,EAAI,OAAO,QAAQL,GAAME,CAAa;AAAA,EAE9C,GAAG,CAACF,CAAI,CAAC;AAET,QAAMS,IAAe,MAAM;AAEvB,UAAMC,KADcL,GAAK,OAAO,QAAA,KAAa,KACf;AAE9B,IAAAF,EAASO,CAAO,GAChBL,GAAK,OAAO,QAAQK,GAASR,CAAa;AAAA,EAC9C,GAEMS,IAAgB,MAAM;AAExB,UAAMD,KADcL,GAAK,OAAO,QAAA,KAAa,KACf;AAE9B,IAAAD,EAAUM,CAAO,GACjBL,GAAK,OAAO,QAAQK,GAASR,CAAa;AAAA,EAC9C;AAEA,SAAID,IACO,OAGJ,gBAAAW,EAACC,GAAA,EAAY,UAAUJ,GAAc,WAAWE,GAAe;AAC1E;"}

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

@@ -1,6 +1,6 @@
-import { type ArrowStyle } from './basics/Polyline';
-import type { Position } from '../../utils/mapTypes';
-import type { EventListenerMap } from '../../utils/eventHandling';
+import { ArrowStyle } from './basics/Polyline';
+import { Position } from '../../utils/mapTypes';
+import { EventListenerMap } from '../../utils/eventHandling';
 export declare const MISSING_POSITIONS_EXCEPTION_MSG = "Route requires a minimum of 1 positions";
 export declare const TO_LESS_LINE_WIDTH_EXCEPTION_MSG = "If isBorderIncludedInWidth is set to true than width has to be greater than twice of borderWidth";
 export declare const DEFAULT_LINE_STROKE_COLOR = "rgba(48, 194, 255, 1)";