@open-pioneer/map 0.10.0 → 0.11.0-dev.20250515143825

package/CHANGELOG.md

@@ -1,5 +1,27 @@
 # @open-pioneer/map
 
+## 0.11.0-dev.20250515143825
+
+### Minor Changes
+
+- 738390e: Update to Chakra v3
+
+### Patch Changes
+
+- 738390e: Fix an issue with "raw" map container children that are not wrapped in a map anchor.
+
+    Consider, for example, the following snippet:
+
+    ```tsx
+    <MapContainer>
+        {/* .custom-content does absolute positioning relative to map container */}
+        <div className="custom-content">Hi</div>
+    </MapContainer>
+    ```
+
+    Previously, the `div` was rendered relative to the map container div but did _not_ respect the map's view padding.
+    Now the `div` will move according to the map padding as well.
+
 ## 0.10.0
 
 ### Minor Changes
@@ -84,20 +106,6 @@
     }
     ```
 
-    This change also fixes an issue with "raw" map container children that are not wrapped in a map anchor.
-
-    Consider, for example, the following snippet:
-
-    ```tsx
-    <MapContainer>
-        {/* .custom-content does absolute positioning relative to map container */}
-        <div className="custom-content">Hi</div>
-    </MapContainer>
-    ```
-
-    Previously, the `div` was rendered relative to the map container div but _did not_ respect the map's view padding.
-    Now the `div` will move according to the map padding as well.
-
 ## 0.9.0
 
 ### Minor Changes

package/README.md

@@ -24,7 +24,7 @@ The `MapContainer` fills the entire available space.
 Example: Integration of a map container with a given map (for an example with `DefaultMapProvider` see [Using the `DefaultMapProvider`](#using-the-defaultmapprovider):
 
 ```jsx
-import { Box } from "@open-pioneer/chakra-integration";
+import { Box } from "@chakra-ui/react";
 import { MapContainer } from "@open-pioneer/map";
 
 // ...

package/model/Highlights.js

@@ -16,7 +16,7 @@ import 'ol/Observable.js';
 import 'ol/proj.js';
 import 'react';
 import 'react/jsx-runtime';
-import '@open-pioneer/chakra-integration';
+import '@chakra-ui/react';
 import '@open-pioneer/react-utils';
 import 'react-dom';
 import '../ui/MapContainerContext.js';

package/package.json

@@ -1,7 +1,7 @@
 {
   "type": "module",
   "name": "@open-pioneer/map",
-  "version": "0.10.0",
+  "version": "0.11.0-dev.20250515143825",
   "description": "This package integrates OpenLayers maps into an open pioneer trails application.",
   "keywords": [
     "open-pioneer-trails"
@@ -14,11 +14,11 @@
     "directory": "src/packages/map"
   },
   "dependencies": {
-    "@open-pioneer/chakra-integration": "^3.1.0",
-    "@open-pioneer/core": "^3.1.0",
-    "@open-pioneer/http": "^3.1.0",
-    "@open-pioneer/react-utils": "^3.1.0",
-    "@open-pioneer/runtime": "^3.1.0",
+    "@chakra-ui/react": "^3.17.0",
+    "@open-pioneer/core": "4.0.0-dev.20250512105016",
+    "@open-pioneer/http": "4.0.0-dev.20250512105016",
+    "@open-pioneer/react-utils": "4.0.0-dev.20250512105016",
+    "@open-pioneer/runtime": "4.0.0-dev.20250512105016",
     "@types/proj4": "^2.5.2",
     "ol": "^10.5.0",
     "proj4": "^2.12.1",
@@ -26,7 +26,7 @@
     "react-dom": "^19.1.0",
     "react-use": "^17.5.1",
     "uuid": "^11.1.0",
-    "@conterra/reactivity-core": "^0.5.0"
+    "@conterra/reactivity-core": "^0.6.0"
   },
   "exports": {
     "./package.json": "./package.json",

package/ui/MapAnchor.js

@@ -1,5 +1,5 @@
 import { jsx } from 'react/jsx-runtime';
-import { Box } from '@open-pioneer/chakra-integration';
+import { Box } from '@chakra-ui/react';
 import { useCommonComponentProps } from '@open-pioneer/react-utils';
 import { useMemo } from 'react';
 import { createPortal } from 'react-dom';

package/ui/MapAnchor.js.map

@@ -1 +1 @@
-{"version":3,"file":"MapAnchor.js","sources":["MapAnchor.tsx"],"sourcesContent":["// SPDX-FileCopyrightText: 2023-2025 Open Pioneer project (https://github.com/open-pioneer)\n// SPDX-License-Identifier: Apache-2.0\nimport { Box } from \"@open-pioneer/chakra-integration\";\nimport { CommonComponentProps, useCommonComponentProps } from \"@open-pioneer/react-utils\";\nimport { ReactNode, useMemo } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { computeMapAnchorStyles } from \"./computeMapAnchorStyles\";\nimport { useMapContainerContext } from \"./MapContainerContext\";\n\n/**\n * The position of an anchor on the map.\n *\n * This is either a predefined position (like a corner) or a completely manual position.\n */\nexport type MapAnchorPosition =\n    | \"manual\"\n    | \"top-left\"\n    | \"top-right\"\n    | \"top-center\"\n    | \"bottom-left\"\n    | \"bottom-right\"\n    | \"bottom-center\"\n    | \"left-center\"\n    | \"right-center\"\n    | \"center\";\n\nconst defaultPosition: MapAnchorPosition = \"top-right\";\n\nexport interface MapAnchorProps extends CommonComponentProps {\n    /**\n     * The position of the anchor container above the map.\n     *\n     * Use `manual` if you wish to position the anchor manually using absolute positioning.\n     * This can be achieved by configuring a css class on the map anchor and using css properties like `left`, `top`, etc.\n     *\n     * @default \"top-right\"\n     */\n    position?: MapAnchorPosition;\n\n    /**\n     * Horizontal gap in pixel applied to anchor container.\n     * Only interpreted if a non-manual position is used.\n     *\n     * @default 0\n     */\n    horizontalGap?: number;\n\n    /**\n     * Vertical gap in pixel applied to anchor container.\n     * Only interpreted if a non-manual position is used.\n     *\n     * @default 0 (If positioned at the bottom, default verticalGap == `30`)\n     */\n    verticalGap?: number;\n\n    children?: ReactNode;\n}\n\n/**\n * A map anchor is a layout component that sits on top of the map.\n *\n * It can be used to position widgets (such as zoom buttons) at a specific location.\n *\n * Map anchors respect the map's current _view padding_.\n */\nexport function MapAnchor(props: MapAnchorProps): ReactNode {\n    const { position = defaultPosition, children, horizontalGap, verticalGap } = props;\n    const { containerProps } = useCommonComponentProps(\"map-anchor\", props);\n    const { mapAnchorsHost } = useMapContainerContext();\n    const styleProps = useMemo(\n        () => computeMapAnchorStyles(position, horizontalGap, verticalGap),\n        [position, horizontalGap, verticalGap]\n    );\n\n    return createPortal(\n        <Box {...containerProps} {...styleProps}>\n            {children}\n        </Box>,\n        mapAnchorsHost\n    );\n}\n"],"names":[],"mappings":";;;;;;;;AA0BA,MAAM,eAAqC,GAAA,WAAA;AAuCpC,SAAS,UAAU,KAAkC,EAAA;AACxD,EAAA,MAAM,EAAE,QAAW,GAAA,eAAA,EAAiB,QAAU,EAAA,aAAA,EAAe,aAAgB,GAAA,KAAA;AAC7E,EAAA,MAAM,EAAE,cAAA,EAAmB,GAAA,uBAAA,CAAwB,cAAc,KAAK,CAAA;AACtE,EAAM,MAAA,EAAE,cAAe,EAAA,GAAI,sBAAuB,EAAA;AAClD,EAAA,MAAM,UAAa,GAAA,OAAA;AAAA,IACf,MAAM,sBAAA,CAAuB,QAAU,EAAA,aAAA,EAAe,WAAW,CAAA;AAAA,IACjE,CAAC,QAAU,EAAA,aAAA,EAAe,WAAW;AAAA,GACzC;AAEA,EAAO,OAAA,YAAA;AAAA,wBACF,GAAK,EAAA,EAAA,GAAG,cAAiB,EAAA,GAAG,YACxB,QACL,EAAA,CAAA;AAAA,IACA;AAAA,GACJ;AACJ;;;;"}
+{"version":3,"file":"MapAnchor.js","sources":["MapAnchor.tsx"],"sourcesContent":["// SPDX-FileCopyrightText: 2023-2025 Open Pioneer project (https://github.com/open-pioneer)\n// SPDX-License-Identifier: Apache-2.0\nimport { Box } from \"@chakra-ui/react\";\nimport { CommonComponentProps, useCommonComponentProps } from \"@open-pioneer/react-utils\";\nimport { ReactNode, useMemo } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { computeMapAnchorStyles } from \"./computeMapAnchorStyles\";\nimport { useMapContainerContext } from \"./MapContainerContext\";\n\n/**\n * The position of an anchor on the map.\n *\n * This is either a predefined position (like a corner) or a completely manual position.\n */\nexport type MapAnchorPosition =\n    | \"manual\"\n    | \"top-left\"\n    | \"top-right\"\n    | \"top-center\"\n    | \"bottom-left\"\n    | \"bottom-right\"\n    | \"bottom-center\"\n    | \"left-center\"\n    | \"right-center\"\n    | \"center\";\n\nconst defaultPosition: MapAnchorPosition = \"top-right\";\n\nexport interface MapAnchorProps extends CommonComponentProps {\n    /**\n     * The position of the anchor container above the map.\n     *\n     * Use `manual` if you wish to position the anchor manually using absolute positioning.\n     * This can be achieved by configuring a css class on the map anchor and using css properties like `left`, `top`, etc.\n     *\n     * @default \"top-right\"\n     */\n    position?: MapAnchorPosition;\n\n    /**\n     * Horizontal gap in pixel applied to anchor container.\n     * Only interpreted if a non-manual position is used.\n     *\n     * @default 0\n     */\n    horizontalGap?: number;\n\n    /**\n     * Vertical gap in pixel applied to anchor container.\n     * Only interpreted if a non-manual position is used.\n     *\n     * @default 0 (If positioned at the bottom, default verticalGap == `30`)\n     */\n    verticalGap?: number;\n\n    children?: ReactNode;\n}\n\n/**\n * A map anchor is a layout component that sits on top of the map.\n *\n * It can be used to position widgets (such as zoom buttons) at a specific location.\n *\n * Map anchors respect the map's current _view padding_.\n */\nexport function MapAnchor(props: MapAnchorProps): ReactNode {\n    const { position = defaultPosition, children, horizontalGap, verticalGap } = props;\n    const { containerProps } = useCommonComponentProps(\"map-anchor\", props);\n    const { mapAnchorsHost } = useMapContainerContext();\n    const styleProps = useMemo(\n        () => computeMapAnchorStyles(position, horizontalGap, verticalGap),\n        [position, horizontalGap, verticalGap]\n    );\n\n    return createPortal(\n        <Box {...containerProps} {...styleProps}>\n            {children}\n        </Box>,\n        mapAnchorsHost\n    );\n}\n"],"names":[],"mappings":";;;;;;;;AA0BA,MAAM,eAAqC,GAAA,WAAA;AAuCpC,SAAS,UAAU,KAAkC,EAAA;AACxD,EAAA,MAAM,EAAE,QAAW,GAAA,eAAA,EAAiB,QAAU,EAAA,aAAA,EAAe,aAAgB,GAAA,KAAA;AAC7E,EAAA,MAAM,EAAE,cAAA,EAAmB,GAAA,uBAAA,CAAwB,cAAc,KAAK,CAAA;AACtE,EAAM,MAAA,EAAE,cAAe,EAAA,GAAI,sBAAuB,EAAA;AAClD,EAAA,MAAM,UAAa,GAAA,OAAA;AAAA,IACf,MAAM,sBAAA,CAAuB,QAAU,EAAA,aAAA,EAAe,WAAW,CAAA;AAAA,IACjE,CAAC,QAAU,EAAA,aAAA,EAAe,WAAW;AAAA,GACzC;AAEA,EAAO,OAAA,YAAA;AAAA,wBACF,GAAK,EAAA,EAAA,GAAG,cAAiB,EAAA,GAAG,YACxB,QACL,EAAA,CAAA;AAAA,IACA;AAAA,GACJ;AACJ;;;;"}

package/ui/MapContainer.js

@@ -1,5 +1,5 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
-import { chakra } from '@open-pioneer/chakra-integration';
+import { chakra } from '@chakra-ui/react';
 import { createLogger } from '@open-pioneer/core';
 import { useCommonComponentProps } from '@open-pioneer/react-utils';
 import { useRef, useState, useEffect, useMemo } from 'react';
@@ -16,7 +16,7 @@ function MapContainer(props) {
     "aria-label": ariaLabel,
     "aria-labelledby": ariaLabelledBy
   } = props;
-  const { containerProps } = useCommonComponentProps("map-container", props);
+  const { containerProps } = useCommonComponentProps("map-container-root", props);
   const mapContainer = useRef(null);
   const mapAnchorsHost = useRef(null);
   const modelState = useMapModel(props);
@@ -53,31 +53,31 @@ function MapContainer(props) {
       "--map-padding-right": `${viewPadding?.right ?? 0}px`
     };
   }, [viewPadding]);
-  return /* @__PURE__ */ jsxs(
-    chakra.div,
-    {
-      ...containerProps,
-      role,
-      "aria-label": ariaLabel,
-      "aria-labelledby": ariaLabelledBy,
-      ref: mapContainer,
-      sx: styleProps,
-      tabIndex: 0,
-      children: [
-        ready && map && /* @__PURE__ */ jsx(
-          MapContainerReady,
-          {
-            olMap: map.olMap,
-            mapAnchorsHost: mapAnchorsHost.current,
-            viewPadding,
-            viewPaddingChangeBehavior,
-            children
-          }
-        ),
-        /* @__PURE__ */ jsx(chakra.div, { ref: mapAnchorsHost, className: "map-anchors" })
-      ]
-    }
-  );
+  return /* @__PURE__ */ jsxs(chakra.div, { ...containerProps, css: styleProps, children: [
+    /* @__PURE__ */ jsx(
+      chakra.div,
+      {
+        className: "map-container",
+        ref: mapContainer,
+        role,
+        "aria-label": ariaLabel,
+        "aria-labelledby": ariaLabelledBy,
+        h: "100%",
+        w: "100%",
+        tabIndex: 0
+      }
+    ),
+    /* @__PURE__ */ jsx(chakra.div, { ref: mapAnchorsHost, className: "map-anchors", children: ready && map && /* @__PURE__ */ jsx(
+      MapContainerReady,
+      {
+        olMap: map.olMap,
+        mapAnchorsHost: mapAnchorsHost.current,
+        viewPadding,
+        viewPaddingChangeBehavior,
+        children
+      }
+    ) })
+  ] });
 }
 function MapContainerReady(props) {
   const {

package/ui/MapContainer.js.map

@@ -1 +1 @@
-{"version":3,"file":"MapContainer.js","sources":["MapContainer.tsx"],"sourcesContent":["// SPDX-FileCopyrightText: 2023-2025 Open Pioneer project (https://github.com/open-pioneer)\n// SPDX-License-Identifier: Apache-2.0\nimport { chakra } from \"@open-pioneer/chakra-integration\";\nimport { Resource, createLogger } from \"@open-pioneer/core\";\nimport { CommonComponentProps, useCommonComponentProps } from \"@open-pioneer/react-utils\";\nimport type OlMap from \"ol/Map\";\nimport { Extent } from \"ol/extent\";\nimport { ReactNode, useEffect, useMemo, useRef, useState } from \"react\";\nimport { MapModel, MapPadding } from \"../api\";\nimport { MapContainerContextProvider, MapContainerContextType } from \"./MapContainerContext\";\nimport { MapModelProps, useMapModel } from \"./useMapModel\";\nconst LOG = createLogger(\"map:MapContainer\");\n\nexport interface MapContainerProps extends CommonComponentProps, MapModelProps {\n    /**\n     * Sets the map's padding directly.\n     * Do not use the view's padding property directly on the OL map.\n     *\n     * See: https://openlayers.org/en/latest/apidoc/module-ol_View-View.html#padding)\n     */\n    viewPadding?: MapPadding | undefined;\n\n    /**\n     * Behavior performed by the map when the view padding changes.\n     *\n     * - `none`: Do nothing.\n     * - `preserve-center`: Ensures that the center point remains the same by animating the view.\n     * - `preserve-extent`: Ensures that the extent remains the same by zooming.\n     *\n     * @default \"preserve-center\"\n     */\n    viewPaddingChangeBehavior?: \"none\" | \"preserve-center\" | \"preserve-extent\";\n\n    children?: ReactNode;\n\n    /**\n     * Optional role property.\n     *\n     * This property is directly applied to the map's container div element.\n     */\n    role?: string;\n\n    /**\n     * Optional aria-labelledby property.\n     * Do not use together with aria-label.\n     *\n     * This property is directly applied to the map's container div element.\n     */\n    \"aria-labelledby\"?: string;\n\n    /**\n     * Optional aria-label property.\n     * Do not use together with aria-label.\n     *\n     * This property is directly applied to the map's container div element.\n     */\n    \"aria-label\"?: string;\n}\n\n/**\n * Displays the map with the given id.\n *\n * There can only be at most one MapContainer for every map.\n */\nexport function MapContainer(props: MapContainerProps) {\n    const {\n        viewPadding,\n        viewPaddingChangeBehavior,\n        children,\n        role,\n        \"aria-label\": ariaLabel,\n        \"aria-labelledby\": ariaLabelledBy\n    } = props;\n    const { containerProps } = useCommonComponentProps(\"map-container\", props);\n    const mapContainer = useRef<HTMLDivElement>(null);\n    const mapAnchorsHost = useRef<HTMLDivElement>(null);\n    const modelState = useMapModel(props);\n    const map = modelState.map;\n\n    const [ready, setReady] = useState(false);\n\n    useEffect(() => {\n        if (modelState.kind === \"loading\") {\n            return;\n        }\n\n        if (modelState.kind === \"rejected\") {\n            LOG.error(`Cannot display the map. Caused by `, modelState.error);\n            return;\n        }\n\n        if (!map) {\n            LOG.error(`No configuration available for the configured map.`);\n            return;\n        }\n\n        // Mount the map into the DOM\n        if (mapContainer.current) {\n            const resource = registerMapTarget(map, mapContainer.current);\n            return () => resource?.destroy();\n        }\n    }, [modelState, map]);\n\n    // Wait for mount to make sure that the map anchors host is available\n    useEffect(() => {\n        setReady(true);\n    }, []);\n\n    const styleProps = useMemo(() => {\n        return {\n            height: \"100%\",\n            position: \"relative\",\n\n            // set css variables according to view padding\n            \"--map-padding-top\": `${viewPadding?.top ?? 0}px`,\n            \"--map-padding-bottom\": `${viewPadding?.bottom ?? 0}px`,\n            \"--map-padding-left\": `${viewPadding?.left ?? 0}px`,\n            \"--map-padding-right\": `${viewPadding?.right ?? 0}px`\n        };\n    }, [viewPadding]);\n\n    return (\n        <chakra.div\n            {...containerProps}\n            role={role}\n            aria-label={ariaLabel}\n            aria-labelledby={ariaLabelledBy}\n            ref={mapContainer}\n            sx={styleProps}\n            //eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex\n            tabIndex={0}\n        >\n            {ready && map && (\n                <MapContainerReady\n                    olMap={map.olMap}\n                    mapAnchorsHost={mapAnchorsHost.current!}\n                    viewPadding={viewPadding}\n                    viewPaddingChangeBehavior={viewPaddingChangeBehavior}\n                >\n                    {children}\n                </MapContainerReady>\n            )}\n            <chakra.div ref={mapAnchorsHost} className=\"map-anchors\">\n                {/* Map anchors will be mounted here via portal */}\n            </chakra.div>\n        </chakra.div>\n    );\n}\n\n/**\n * This inner component is rendered when the map has been loaded.\n *\n * It provides the map instance and additional properties down the component tree.\n */\nfunction MapContainerReady(\n    props: { olMap: OlMap; mapAnchorsHost: HTMLElement } & Omit<\n        MapContainerProps,\n        \"mapId\" | \"map\" | \"className\"\n    >\n): ReactNode {\n    const {\n        olMap,\n        mapAnchorsHost,\n        viewPadding: viewPaddingProp,\n        viewPaddingChangeBehavior = \"preserve-center\",\n        children\n    } = props;\n\n    const viewPadding = useMemo<Required<MapPadding>>(() => {\n        return {\n            left: viewPaddingProp?.left ?? 0,\n            right: viewPaddingProp?.right ?? 0,\n            top: viewPaddingProp?.top ?? 0,\n            bottom: viewPaddingProp?.bottom ?? 0\n        };\n    }, [viewPaddingProp]);\n\n    // Apply view padding\n    useEffect(() => {\n        const mapView = olMap?.getView();\n        if (!olMap || !mapView) {\n            return;\n        }\n\n        const oldCenter = mapView.getCenter();\n        const oldPadding = fromOlPadding(mapView.padding);\n        const oldExtent = extentIncludingPadding(olMap, oldPadding);\n\n        mapView.padding = toOlPadding(viewPadding);\n        switch (viewPaddingChangeBehavior) {\n            case \"preserve-center\":\n                mapView.animate({ center: oldCenter, duration: 300 });\n                break;\n            case \"preserve-extent\": {\n                if (oldExtent) {\n                    mapView.animate({\n                        center: oldCenter,\n                        resolution: mapView.getResolutionForExtent(oldExtent),\n                        duration: 300\n                    });\n                }\n                break;\n            }\n            case \"none\":\n        }\n    }, [viewPadding, olMap, viewPaddingChangeBehavior]);\n\n    const mapContext = useMemo((): MapContainerContextType => {\n        return {\n            mapAnchorsHost\n        };\n    }, [mapAnchorsHost]);\n    return <MapContainerContextProvider value={mapContext}>{children}</MapContainerContextProvider>;\n}\n\nfunction registerMapTarget(mapModel: MapModel, target: HTMLDivElement): Resource | undefined {\n    const mapId = mapModel.id;\n    const olMap = mapModel.olMap;\n    if (olMap.getTarget()) {\n        LOG.error(\n            `Failed to display the map: the map already has a target. There may be more than one <MapContainer />.`\n        );\n        return undefined;\n    }\n\n    LOG.isDebug() && LOG.debug(`Setting target of map '${mapId}':`, target);\n    if (!(\"keyboardEventTarget_\" in olMap)) {\n        throw new Error(\n            \"Internal error: failed to override keyboard event target. The property is no longer present.\"\n        );\n    }\n\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    (olMap as any).keyboardEventTarget_ = target;\n    olMap.setTarget(target);\n\n    let unregistered = false;\n    return {\n        destroy() {\n            if (!unregistered) {\n                LOG.isDebug() && LOG.debug(`Removing target of map '${mapId}':`, target);\n                // eslint-disable-next-line @typescript-eslint/no-explicit-any\n                (olMap as any).keyboardEventTarget_ = undefined;\n                olMap.setTarget(undefined);\n                unregistered = true;\n            }\n        }\n    };\n}\n\n/**\n * Returns the extent visible in the non-padded region of the map.\n */\nfunction extentIncludingPadding(map: OlMap, padding: Required<MapPadding>): Extent | undefined {\n    const size = map.getSize();\n    if (!size || size.length < 2) {\n        return undefined;\n    }\n\n    const [width, height] = size as [number, number];\n    const bottomLeft = map.getCoordinateFromPixel([padding.left, padding.bottom]);\n    const topRight = map.getCoordinateFromPixel([\n        Math.max(0, width - padding.right),\n        Math.max(0, height - padding.top)\n    ]);\n    if (!bottomLeft || !topRight) {\n        return undefined;\n    }\n\n    const [xmin, ymin] = bottomLeft;\n    const [xmax, ymax] = topRight;\n    return [xmin, ymin, xmax, ymax] as Extent;\n}\n\nfunction fromOlPadding(padding: number[] | undefined): Required<MapPadding> {\n    // top, right, bottom, left\n    return {\n        top: padding?.[0] ?? 0,\n        right: padding?.[1] ?? 0,\n        bottom: padding?.[2] ?? 0,\n        left: padding?.[3] ?? 0\n    };\n}\n\nfunction toOlPadding(padding: Required<MapPadding>): number[] {\n    // top, right, bottom, left\n    const { top, right, bottom, left } = padding;\n    return [top, right, bottom, left];\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"MapContainer.js","sources":["MapContainer.tsx"],"sourcesContent":["// SPDX-FileCopyrightText: 2023-2025 Open Pioneer project (https://github.com/open-pioneer)\n// SPDX-License-Identifier: Apache-2.0\nimport { chakra } from \"@chakra-ui/react\";\nimport { Resource, createLogger } from \"@open-pioneer/core\";\nimport { CommonComponentProps, useCommonComponentProps } from \"@open-pioneer/react-utils\";\nimport type OlMap from \"ol/Map\";\nimport { Extent } from \"ol/extent\";\nimport { ReactNode, useEffect, useMemo, useRef, useState } from \"react\";\nimport { MapModel, MapPadding } from \"../api\";\nimport { MapContainerContextProvider, MapContainerContextType } from \"./MapContainerContext\";\nimport { MapModelProps, useMapModel } from \"./useMapModel\";\nconst LOG = createLogger(\"map:MapContainer\");\n\nexport interface MapContainerProps extends CommonComponentProps, MapModelProps {\n    /**\n     * Sets the map's padding directly.\n     * Do not use the view's padding property directly on the OL map.\n     *\n     * See: https://openlayers.org/en/latest/apidoc/module-ol_View-View.html#padding)\n     */\n    viewPadding?: MapPadding | undefined;\n\n    /**\n     * Behavior performed by the map when the view padding changes.\n     *\n     * - `none`: Do nothing.\n     * - `preserve-center`: Ensures that the center point remains the same by animating the view.\n     * - `preserve-extent`: Ensures that the extent remains the same by zooming.\n     *\n     * @default \"preserve-center\"\n     */\n    viewPaddingChangeBehavior?: \"none\" | \"preserve-center\" | \"preserve-extent\";\n\n    children?: ReactNode;\n\n    /**\n     * Optional role property.\n     *\n     * This property is directly applied to the map's container div element.\n     */\n    role?: string;\n\n    /**\n     * Optional aria-labelledby property.\n     * Do not use together with aria-label.\n     *\n     * This property is directly applied to the map's container div element.\n     */\n    \"aria-labelledby\"?: string;\n\n    /**\n     * Optional aria-label property.\n     * Do not use together with aria-label.\n     *\n     * This property is directly applied to the map's container div element.\n     */\n    \"aria-label\"?: string;\n}\n\n/**\n * Displays the map with the given id.\n *\n * There can only be at most one MapContainer for every map.\n */\nexport function MapContainer(props: MapContainerProps) {\n    const {\n        viewPadding,\n        viewPaddingChangeBehavior,\n        children,\n        role,\n        \"aria-label\": ariaLabel,\n        \"aria-labelledby\": ariaLabelledBy\n    } = props;\n    const { containerProps } = useCommonComponentProps(\"map-container-root\", props);\n    const mapContainer = useRef<HTMLDivElement>(null);\n    const mapAnchorsHost = useRef<HTMLDivElement>(null);\n    const modelState = useMapModel(props);\n    const map = modelState.map;\n\n    const [ready, setReady] = useState(false);\n\n    useEffect(() => {\n        if (modelState.kind === \"loading\") {\n            return;\n        }\n\n        if (modelState.kind === \"rejected\") {\n            LOG.error(`Cannot display the map. Caused by `, modelState.error);\n            return;\n        }\n\n        if (!map) {\n            LOG.error(`No configuration available for the configured map.`);\n            return;\n        }\n\n        // Mount the map into the DOM\n        if (mapContainer.current) {\n            const resource = registerMapTarget(map, mapContainer.current);\n            return () => resource?.destroy();\n        }\n    }, [modelState, map]);\n\n    // Wait for mount to make sure that the map anchors host is available\n    useEffect(() => {\n        setReady(true);\n    }, []);\n\n    const styleProps = useMemo(() => {\n        return {\n            height: \"100%\",\n            position: \"relative\",\n\n            // set css variables according to view padding\n            \"--map-padding-top\": `${viewPadding?.top ?? 0}px`,\n            \"--map-padding-bottom\": `${viewPadding?.bottom ?? 0}px`,\n            \"--map-padding-left\": `${viewPadding?.left ?? 0}px`,\n            \"--map-padding-right\": `${viewPadding?.right ?? 0}px`\n        };\n    }, [viewPadding]);\n\n    return (\n        <chakra.div {...containerProps} css={styleProps}>\n            {/* Used by open layers to mount the map. This node receives the keyboard focus when interacting with the map. */}\n            <chakra.div\n                className=\"map-container\"\n                ref={mapContainer}\n                role={role}\n                aria-label={ariaLabel}\n                aria-labelledby={ariaLabelledBy}\n                h=\"100%\"\n                w=\"100%\"\n                //eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex\n                tabIndex={0}\n            />\n\n            {/* Contains user widgets (map anchors and raw children). These are separate from the map so they don't interfere with mouse/keyboard events. */}\n            <chakra.div ref={mapAnchorsHost} className=\"map-anchors\">\n                {ready && map && (\n                    <MapContainerReady\n                        olMap={map.olMap}\n                        mapAnchorsHost={mapAnchorsHost.current!}\n                        viewPadding={viewPadding}\n                        viewPaddingChangeBehavior={viewPaddingChangeBehavior}\n                    >\n                        {children}\n                    </MapContainerReady>\n                )}\n            </chakra.div>\n        </chakra.div>\n    );\n}\n\n/**\n * This inner component is rendered when the map has been loaded.\n *\n * It provides the map instance and additional properties down the component tree.\n */\nfunction MapContainerReady(\n    props: { olMap: OlMap; mapAnchorsHost: HTMLElement } & Omit<\n        MapContainerProps,\n        \"mapId\" | \"map\" | \"className\"\n    >\n): ReactNode {\n    const {\n        olMap,\n        mapAnchorsHost,\n        viewPadding: viewPaddingProp,\n        viewPaddingChangeBehavior = \"preserve-center\",\n        children\n    } = props;\n\n    const viewPadding = useMemo<Required<MapPadding>>(() => {\n        return {\n            left: viewPaddingProp?.left ?? 0,\n            right: viewPaddingProp?.right ?? 0,\n            top: viewPaddingProp?.top ?? 0,\n            bottom: viewPaddingProp?.bottom ?? 0\n        };\n    }, [viewPaddingProp]);\n\n    // Apply view padding\n    useEffect(() => {\n        const mapView = olMap?.getView();\n        if (!olMap || !mapView) {\n            return;\n        }\n\n        const oldCenter = mapView.getCenter();\n        const oldPadding = fromOlPadding(mapView.padding);\n        const oldExtent = extentIncludingPadding(olMap, oldPadding);\n\n        mapView.padding = toOlPadding(viewPadding);\n        switch (viewPaddingChangeBehavior) {\n            case \"preserve-center\":\n                mapView.animate({ center: oldCenter, duration: 300 });\n                break;\n            case \"preserve-extent\": {\n                if (oldExtent) {\n                    mapView.animate({\n                        center: oldCenter,\n                        resolution: mapView.getResolutionForExtent(oldExtent),\n                        duration: 300\n                    });\n                }\n                break;\n            }\n            case \"none\":\n        }\n    }, [viewPadding, olMap, viewPaddingChangeBehavior]);\n\n    const mapContext = useMemo((): MapContainerContextType => {\n        return {\n            mapAnchorsHost\n        };\n    }, [mapAnchorsHost]);\n    return <MapContainerContextProvider value={mapContext}>{children}</MapContainerContextProvider>;\n}\n\nfunction registerMapTarget(mapModel: MapModel, target: HTMLDivElement): Resource | undefined {\n    const mapId = mapModel.id;\n    const olMap = mapModel.olMap;\n    if (olMap.getTarget()) {\n        LOG.error(\n            `Failed to display the map: the map already has a target. There may be more than one <MapContainer />.`\n        );\n        return undefined;\n    }\n\n    LOG.isDebug() && LOG.debug(`Setting target of map '${mapId}':`, target);\n    if (!(\"keyboardEventTarget_\" in olMap)) {\n        throw new Error(\n            \"Internal error: failed to override keyboard event target. The property is no longer present.\"\n        );\n    }\n\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    (olMap as any).keyboardEventTarget_ = target;\n    olMap.setTarget(target);\n\n    let unregistered = false;\n    return {\n        destroy() {\n            if (!unregistered) {\n                LOG.isDebug() && LOG.debug(`Removing target of map '${mapId}':`, target);\n                // eslint-disable-next-line @typescript-eslint/no-explicit-any\n                (olMap as any).keyboardEventTarget_ = undefined;\n                olMap.setTarget(undefined);\n                unregistered = true;\n            }\n        }\n    };\n}\n\n/**\n * Returns the extent visible in the non-padded region of the map.\n */\nfunction extentIncludingPadding(map: OlMap, padding: Required<MapPadding>): Extent | undefined {\n    const size = map.getSize();\n    if (!size || size.length < 2) {\n        return undefined;\n    }\n\n    const [width, height] = size as [number, number];\n    const bottomLeft = map.getCoordinateFromPixel([padding.left, padding.bottom]);\n    const topRight = map.getCoordinateFromPixel([\n        Math.max(0, width - padding.right),\n        Math.max(0, height - padding.top)\n    ]);\n    if (!bottomLeft || !topRight) {\n        return undefined;\n    }\n\n    const [xmin, ymin] = bottomLeft;\n    const [xmax, ymax] = topRight;\n    return [xmin, ymin, xmax, ymax] as Extent;\n}\n\nfunction fromOlPadding(padding: number[] | undefined): Required<MapPadding> {\n    // top, right, bottom, left\n    return {\n        top: padding?.[0] ?? 0,\n        right: padding?.[1] ?? 0,\n        bottom: padding?.[2] ?? 0,\n        left: padding?.[3] ?? 0\n    };\n}\n\nfunction toOlPadding(padding: Required<MapPadding>): number[] {\n    // top, right, bottom, left\n    const { top, right, bottom, left } = padding;\n    return [top, right, bottom, left];\n}\n"],"names":[],"mappings":"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"}

package/ui/computeMapAnchorStyles.d.ts

@@ -1,3 +1,3 @@
-import { StyleProps } from "@open-pioneer/chakra-integration";
+import { SystemStyleObject } from "@chakra-ui/react";
 import { MapAnchorPosition } from "./MapAnchor";
-export declare function computeMapAnchorStyles(position: MapAnchorPosition, horizontalGap?: number | undefined, verticalGap?: number | undefined): StyleProps;
+export declare function computeMapAnchorStyles(position: MapAnchorPosition, horizontalGap?: number | undefined, verticalGap?: number | undefined): SystemStyleObject;

package/ui/computeMapAnchorStyles.js.map

@@ -1 +1 @@
-{"version":3,"file":"computeMapAnchorStyles.js","sources":["computeMapAnchorStyles.ts"],"sourcesContent":["// SPDX-FileCopyrightText: 2023-2025 Open Pioneer project (https://github.com/open-pioneer)\n// SPDX-License-Identifier: Apache-2.0\nimport { StyleProps } from \"@open-pioneer/chakra-integration\";\nimport { MapAnchorPosition } from \"./MapAnchor\";\n\nexport function computeMapAnchorStyles(\n    position: MapAnchorPosition,\n    horizontalGap?: number | undefined,\n    verticalGap?: number | undefined\n): StyleProps {\n    const horizontal = horizontalGap ?? 0;\n    const vertical = verticalGap ?? 0;\n    const attributionGap = verticalGap == null ? ATTR_GAP : 0;\n\n    const styleProps: StyleProps = {};\n    switch (position) {\n        case \"top-left\":\n            styleProps.left = `${horizontal}px`;\n            styleProps.top = `${vertical}px`;\n            break;\n        case \"top-right\":\n            styleProps.right = `${horizontal}px`;\n            styleProps.top = `${vertical}px`;\n            break;\n        case \"bottom-left\":\n            styleProps.left = `${horizontal}px`;\n            styleProps.bottom = `${vertical + attributionGap}px`;\n            break;\n        case \"bottom-right\":\n            styleProps.right = `${horizontal}px`;\n            styleProps.bottom = `${vertical + attributionGap}px`;\n            break;\n        case \"top-center\":\n            styleProps.top = `${vertical}px`;\n            styleProps.left = `calc((100% - ${horizontal}px) / 2)`;\n            styleProps.transform = \"translateX(-50%)\";\n            break;\n        case \"bottom-center\":\n            styleProps.bottom = `${vertical + attributionGap}px`;\n            styleProps.left = `calc((100% - ${horizontal}px) / 2)`;\n            styleProps.transform = \"translateX(-50%)\";\n            break;\n        case \"left-center\":\n            styleProps.left = `${horizontal}px`;\n            styleProps.top = `calc((100% - ${vertical}px) / 2)`;\n            styleProps.transform = \"translateY(-50%)\";\n            break;\n        case \"right-center\":\n            styleProps.right = `${horizontal}px`;\n            styleProps.top = `calc((100% - ${vertical}px) / 2)`;\n            styleProps.transform = \"translateY(-50%)\";\n            break;\n        case \"center\":\n            styleProps.top = `calc((100% - ${vertical}px) / 2)`;\n            styleProps.left = `calc((100% - ${horizontal}px) / 2)`;\n            styleProps.transform = \"translate(-50%, -50%)\";\n            break;\n    }\n\n    styleProps.maxW = `calc((100%) - ${2 * horizontal}px)`;\n    styleProps.maxH = `calc((100%) - ${attributionGap}px - ${2 * vertical}px)`;\n    return styleProps;\n}\n\n/**\n * height of the ol attribution component\n * improvement: Get height directly from `Attribution` HTMLDivElement\n */\nconst ATTR_HEIGHT = 20;\n\n/**\n * additional space between attribution and map anchor container\n */\nconst ATTR_SPACE = 10;\nconst ATTR_GAP = ATTR_HEIGHT + ATTR_SPACE;\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"computeMapAnchorStyles.js","sources":["computeMapAnchorStyles.ts"],"sourcesContent":["// SPDX-FileCopyrightText: 2023-2025 Open Pioneer project (https://github.com/open-pioneer)\n// SPDX-License-Identifier: Apache-2.0\nimport { SystemStyleObject } from \"@chakra-ui/react\";\nimport { MapAnchorPosition } from \"./MapAnchor\";\n\nexport function computeMapAnchorStyles(\n    position: MapAnchorPosition,\n    horizontalGap?: number | undefined,\n    verticalGap?: number | undefined\n): SystemStyleObject {\n    const horizontal = horizontalGap ?? 0;\n    const vertical = verticalGap ?? 0;\n    const attributionGap = verticalGap == null ? ATTR_GAP : 0;\n\n    const styleProps: SystemStyleObject = {};\n    switch (position) {\n        case \"top-left\":\n            styleProps.left = `${horizontal}px`;\n            styleProps.top = `${vertical}px`;\n            break;\n        case \"top-right\":\n            styleProps.right = `${horizontal}px`;\n            styleProps.top = `${vertical}px`;\n            break;\n        case \"bottom-left\":\n            styleProps.left = `${horizontal}px`;\n            styleProps.bottom = `${vertical + attributionGap}px`;\n            break;\n        case \"bottom-right\":\n            styleProps.right = `${horizontal}px`;\n            styleProps.bottom = `${vertical + attributionGap}px`;\n            break;\n        case \"top-center\":\n            styleProps.top = `${vertical}px`;\n            styleProps.left = `calc((100% - ${horizontal}px) / 2)`;\n            styleProps.transform = \"translateX(-50%)\";\n            break;\n        case \"bottom-center\":\n            styleProps.bottom = `${vertical + attributionGap}px`;\n            styleProps.left = `calc((100% - ${horizontal}px) / 2)`;\n            styleProps.transform = \"translateX(-50%)\";\n            break;\n        case \"left-center\":\n            styleProps.left = `${horizontal}px`;\n            styleProps.top = `calc((100% - ${vertical}px) / 2)`;\n            styleProps.transform = \"translateY(-50%)\";\n            break;\n        case \"right-center\":\n            styleProps.right = `${horizontal}px`;\n            styleProps.top = `calc((100% - ${vertical}px) / 2)`;\n            styleProps.transform = \"translateY(-50%)\";\n            break;\n        case \"center\":\n            styleProps.top = `calc((100% - ${vertical}px) / 2)`;\n            styleProps.left = `calc((100% - ${horizontal}px) / 2)`;\n            styleProps.transform = \"translate(-50%, -50%)\";\n            break;\n    }\n\n    styleProps.maxW = `calc((100%) - ${2 * horizontal}px)`;\n    styleProps.maxH = `calc((100%) - ${attributionGap}px - ${2 * vertical}px)`;\n    return styleProps;\n}\n\n/**\n * height of the ol attribution component\n * improvement: Get height directly from `Attribution` HTMLDivElement\n */\nconst ATTR_HEIGHT = 20;\n\n/**\n * additional space between attribution and map anchor container\n */\nconst ATTR_SPACE = 10;\nconst ATTR_GAP = ATTR_HEIGHT + ATTR_SPACE;\n"],"names":[],"mappings":"AAKgB,SAAA,sBAAA,CACZ,QACA,EAAA,aAAA,EACA,WACiB,EAAA;AACjB,EAAA,MAAM,aAAa,aAAiB,IAAA,CAAA;AACpC,EAAA,MAAM,WAAW,WAAe,IAAA,CAAA;AAChC,EAAM,MAAA,cAAA,GAAiB,WAAe,IAAA,IAAA,GAAO,QAAW,GAAA,CAAA;AAExD,EAAA,MAAM,aAAgC,EAAC;AACvC,EAAA,QAAQ,QAAU;AAAA,IACd,KAAK,UAAA;AACD,MAAW,UAAA,CAAA,IAAA,GAAO,GAAG,UAAU,CAAA,EAAA,CAAA;AAC/B,MAAW,UAAA,CAAA,GAAA,GAAM,GAAG,QAAQ,CAAA,EAAA,CAAA;AAC5B,MAAA;AAAA,IACJ,KAAK,WAAA;AACD,MAAW,UAAA,CAAA,KAAA,GAAQ,GAAG,UAAU,CAAA,EAAA,CAAA;AAChC,MAAW,UAAA,CAAA,GAAA,GAAM,GAAG,QAAQ,CAAA,EAAA,CAAA;AAC5B,MAAA;AAAA,IACJ,KAAK,aAAA;AACD,MAAW,UAAA,CAAA,IAAA,GAAO,GAAG,UAAU,CAAA,EAAA,CAAA;AAC/B,MAAW,UAAA,CAAA,MAAA,GAAS,CAAG,EAAA,QAAA,GAAW,cAAc,CAAA,EAAA,CAAA;AAChD,MAAA;AAAA,IACJ,KAAK,cAAA;AACD,MAAW,UAAA,CAAA,KAAA,GAAQ,GAAG,UAAU,CAAA,EAAA,CAAA;AAChC,MAAW,UAAA,CAAA,MAAA,GAAS,CAAG,EAAA,QAAA,GAAW,cAAc,CAAA,EAAA,CAAA;AAChD,MAAA;AAAA,IACJ,KAAK,YAAA;AACD,MAAW,UAAA,CAAA,GAAA,GAAM,GAAG,QAAQ,CAAA,EAAA,CAAA;AAC5B,MAAW,UAAA,CAAA,IAAA,GAAO,gBAAgB,UAAU,CAAA,QAAA,CAAA;AAC5C,MAAA,UAAA,CAAW,SAAY,GAAA,kBAAA;AACvB,MAAA;AAAA,IACJ,KAAK,eAAA;AACD,MAAW,UAAA,CAAA,MAAA,GAAS,CAAG,EAAA,QAAA,GAAW,cAAc,CAAA,EAAA,CAAA;AAChD,MAAW,UAAA,CAAA,IAAA,GAAO,gBAAgB,UAAU,CAAA,QAAA,CAAA;AAC5C,MAAA,UAAA,CAAW,SAAY,GAAA,kBAAA;AACvB,MAAA;AAAA,IACJ,KAAK,aAAA;AACD,MAAW,UAAA,CAAA,IAAA,GAAO,GAAG,UAAU,CAAA,EAAA,CAAA;AAC/B,MAAW,UAAA,CAAA,GAAA,GAAM,gBAAgB,QAAQ,CAAA,QAAA,CAAA;AACzC,MAAA,UAAA,CAAW,SAAY,GAAA,kBAAA;AACvB,MAAA;AAAA,IACJ,KAAK,cAAA;AACD,MAAW,UAAA,CAAA,KAAA,GAAQ,GAAG,UAAU,CAAA,EAAA,CAAA;AAChC,MAAW,UAAA,CAAA,GAAA,GAAM,gBAAgB,QAAQ,CAAA,QAAA,CAAA;AACzC,MAAA,UAAA,CAAW,SAAY,GAAA,kBAAA;AACvB,MAAA;AAAA,IACJ,KAAK,QAAA;AACD,MAAW,UAAA,CAAA,GAAA,GAAM,gBAAgB,QAAQ,CAAA,QAAA,CAAA;AACzC,MAAW,UAAA,CAAA,IAAA,GAAO,gBAAgB,UAAU,CAAA,QAAA,CAAA;AAC5C,MAAA,UAAA,CAAW,SAAY,GAAA,uBAAA;AACvB,MAAA;AAAA;AAGR,EAAW,UAAA,CAAA,IAAA,GAAO,CAAiB,cAAA,EAAA,CAAA,GAAI,UAAU,CAAA,GAAA,CAAA;AACjD,EAAA,UAAA,CAAW,IAAO,GAAA,CAAA,cAAA,EAAiB,cAAc,CAAA,KAAA,EAAQ,IAAI,QAAQ,CAAA,GAAA,CAAA;AACrE,EAAO,OAAA,UAAA;AACX;AAMA,MAAM,WAAc,GAAA,EAAA;AAKpB,MAAM,UAAa,GAAA,EAAA;AACnB,MAAM,WAAW,WAAc,GAAA,UAAA;;;;"}

package/ui/styles.css

@@ -2,12 +2,12 @@
 
 /* Move attribution according to map view's padding */
 
-.map-container .ol-viewport .ol-attribution {
+.map-container-root .map-container .ol-viewport .ol-attribution {
     bottom: var(--map-padding-bottom);
     right: var(--map-padding-right);
 }
 
-.map-container .map-anchors {
+.map-container-root .map-anchors {
     pointer-events: none;
     overflow: hidden;
 
@@ -22,8 +22,7 @@
     transition-timing-function: ease-in-out;
 }
 
-.map-container .map-anchors .map-anchor {
-    pointer-events: auto;
+.map-container-root .map-anchors .map-anchor {
     z-index: 1;
     overflow: hidden;
 
@@ -31,4 +30,8 @@
     /* positioned absolute in .map-anchors, but actual coordinates are currently set via JS */
 }
 
+.map-container-root .map-anchors > * {
+    pointer-events: auto;
+}
+
 /*# sourceMappingURL=styles.css.map */

package/ui/styles.css.map

@@ -1 +1 @@
-{"version":3,"sources":["styles.css"],"names":[],"mappings":"AAAA,mBAAmB;;AAEnB,qDAAqD;;AACrD;IACI,iCAAiC;IACjC,+BAA+B;AACnC;;AAEA;IACI,oBAAoB;IACpB,gBAAgB;;IAEhB,kBAAkB;IAClB,2BAA2B;IAC3B,iCAAiC;IACjC,6BAA6B;IAC7B,+BAA+B;;IAE/B,6CAA6C;IAC7C,0BAA0B;IAC1B,uCAAuC;AAC3C;;AAEA;IACI,oBAAoB;IACpB,UAAU;IACV,gBAAgB;;IAEhB,kBAAkB;IAClB,yFAAyF;AAC7F","file":"styles.css","sourcesContent":["@import \"ol/ol.css\";\n\n/* Move attribution according to map view's padding */\n.map-container .ol-viewport .ol-attribution {\n    bottom: var(--map-padding-bottom);\n    right: var(--map-padding-right);\n}\n\n.map-container .map-anchors {\n    pointer-events: none;\n    overflow: hidden;\n\n    position: absolute;\n    top: var(--map-padding-top);\n    bottom: var(--map-padding-bottom);\n    left: var(--map-padding-left);\n    right: var(--map-padding-right);\n\n    transition-property: left, right, top, bottom;\n    transition-duration: 200ms;\n    transition-timing-function: ease-in-out;\n}\n\n.map-container .map-anchors .map-anchor {\n    pointer-events: auto;\n    z-index: 1;\n    overflow: hidden;\n\n    position: absolute;\n    /* positioned absolute in .map-anchors, but actual coordinates are currently set via JS */\n}\n"]}
+{"version":3,"sources":["styles.css"],"names":[],"mappings":"AAAA,mBAAmB;;AAEnB,qDAAqD;;AACrD;IACI,iCAAiC;IACjC,+BAA+B;AACnC;;AAEA;IACI,oBAAoB;IACpB,gBAAgB;;IAEhB,kBAAkB;IAClB,2BAA2B;IAC3B,iCAAiC;IACjC,6BAA6B;IAC7B,+BAA+B;;IAE/B,6CAA6C;IAC7C,0BAA0B;IAC1B,uCAAuC;AAC3C;;AAEA;IACI,UAAU;IACV,gBAAgB;;IAEhB,kBAAkB;IAClB,yFAAyF;AAC7F;;AAEA;IACI,oBAAoB;AACxB","file":"styles.css","sourcesContent":["@import \"ol/ol.css\";\n\n/* Move attribution according to map view's padding */\n.map-container-root .map-container .ol-viewport .ol-attribution {\n    bottom: var(--map-padding-bottom);\n    right: var(--map-padding-right);\n}\n\n.map-container-root .map-anchors {\n    pointer-events: none;\n    overflow: hidden;\n\n    position: absolute;\n    top: var(--map-padding-top);\n    bottom: var(--map-padding-bottom);\n    left: var(--map-padding-left);\n    right: var(--map-padding-right);\n\n    transition-property: left, right, top, bottom;\n    transition-duration: 200ms;\n    transition-timing-function: ease-in-out;\n}\n\n.map-container-root .map-anchors .map-anchor {\n    z-index: 1;\n    overflow: hidden;\n\n    position: absolute;\n    /* positioned absolute in .map-anchors, but actual coordinates are currently set via JS */\n}\n\n.map-container-root .map-anchors > * {\n    pointer-events: auto;\n}\n"]}