@bpd-library/components 1.2.3-beta.2 → 1.2.3-beta.6

package/dist/molecules/map/map.js

@@ -49,6 +49,7 @@ const Map = () => {
         mapStore.subscribe(handleHover, ['hover']);
         mapStore.subscribe(handleClick, ['click']);
         mapStore.subscribe(handleFocus, ['focus']);
+        mapStore.subscribe(handleIsochrone, ['isochroneSetting']);
         mapStore.subscribe(({ filter, data }) => addData(filter ? filter : data), ['filter']);
         mapStore.subscribe(({ layerRasterSettings }) => layerRasterSettings && mapboxHelpers.raster(layerRasterSettings), ['layerRasterSettings']);
     }
@@ -141,6 +142,15 @@ const Map = () => {
             removeTooltip();
         }
     }
+    function handleIsochrone({ isochroneSetting }) {
+        const { removeIsochrone, addIsochrone } = mapboxHelpers;
+        if (isochroneSetting) {
+            addIsochrone(isochroneSetting);
+        }
+        else {
+            removeIsochrone();
+        }
+    }
     function pointerFocusToggle(id, action) {
         const pointer = getPointerElementById(id);
         if (pointer) {

package/dist/molecules/map/map.js.map

@@ -1 +1 @@
-{"version":3,"file":"map.js","sourceRoot":"","sources":["../../../src/molecules/map/map.tsx"],"names":[],"mappings":"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","sourcesContent":["import { defineElement, FC, onDidLoad, useElement, useProp } from '@atomify/hooks';\nimport { Fragment, h } from '@atomify/jsx';\nimport { MapInfobox, MapOptions, MapSearchOptions, MapTheme } from '@bpd-library/types';\nimport {\n    calculateMapDataBoundingBox,\n    calculateMapDataCenter,\n    detectTouch,\n    expandBoundingBox,\n    functionIsTrue,\n    getCountryBoundingBox,\n} from '@bpd-library/utilities';\nimport MapboxLanguage from '@mapbox/mapbox-gl-language';\nimport mapboxgl from 'mapbox-gl';\n\nimport { Button } from '../../atoms/button';\nimport { Infobox } from '../infobox';\nimport { clearHover, MapState, mapStore, setMapInstance } from './store/map';\nimport mapbox from './utilities/mapbox';\n\nconst DEFAULT_OPTIONS: MapOptions = {\n    zoomButtons: true,\n    mobileToggle: false,\n    tooltipMode: 'hover',\n    openInTab: false,\n    autoOpenUrl: true,\n    language: window.__ENVIRONMENT_DETAILS__.language || 'nl',\n    searchCountryIsoCodes: ['nl', 'de'],\n};\n\nconst CONTAINER_VISIBLE = 'map--is-visible';\nconst MOBILE_TOGGLE_CLASS = 'map--mobile-toggle';\nconst MAP_HOVERING_CLASS = 'map--hovering';\nconst POINTER_FOCUS_CLASS = 'map__pointer--focus';\n\nconst Map: FC = () => {\n    let [options] = useProp<MapOptions>('options', {});\n    const [theme] = useProp<MapTheme>('theme');\n    const container = useElement<HTMLDivElement>('[js-hook-map-container]');\n    const infoboxWrapper = useElement<HTMLDivElement>('[js-hook-infobox-wrapper]');\n    const element = useElement<HTMLDivElement>('[js-hook-map]');\n\n    let map: mapboxgl.Map;\n    let mapboxHelpers: ReturnType<typeof mapbox>;\n    let focusTimeout: ReturnType<typeof setTimeout> | undefined;\n\n    onDidLoad(async () => {\n        if (options.mobileToggle) element.current!.classList.add(MOBILE_TOGGLE_CLASS);\n        options = { ...DEFAULT_OPTIONS, ...options };\n\n        map = createMapboxInstance();\n        mapboxHelpers = mapbox(map, options, theme);\n        setMapInstance(map);\n\n        await setupMapbox();\n\n        subscribe();\n\n        if (options.search)\n            options.search.forEach((e: MapSearchOptions) => mapboxHelpers.search(e));\n    });\n\n    function subscribe() {\n        const { filter, data } = mapStore.getState();\n        const { addData } = mapboxHelpers;\n\n        addData(filter ? filter : data);\n\n        mapStore.subscribe(({ data }) => addData(data), ['data']);\n        mapStore.subscribe(handleHover, ['hover']);\n        mapStore.subscribe(handleClick, ['click']);\n        mapStore.subscribe(handleFocus, ['focus']);\n        mapStore.subscribe(({ filter, data }) => addData(filter ? filter : data), ['filter']);\n        mapStore.subscribe(\n            ({ layerRasterSettings }) =>\n                layerRasterSettings && mapboxHelpers.raster(layerRasterSettings),\n            ['layerRasterSettings'],\n        );\n    }\n\n    function handleHover({ hover }: MapState) {\n        const { current, previous } = hover;\n        const canvasStyle = map.getCanvas().style;\n        const { setFeatureState, addTooltip, removeTooltip } = mapboxHelpers;\n\n        /*\n            Add / Remove tooltip\n        */\n        if (options.tooltipMode === 'hover') {\n            if (current?.tooltip && !detectTouch.touch) addTooltip(current.coordinates, current);\n            if (!current && !detectTouch.touch) removeTooltip();\n        }\n\n        /*\n            Set hover state\n        */\n        if (hasHoverTheme()) {\n            if (current) setFeatureState(current.variant, current.id, 'hover', true);\n            if (previous) setFeatureState(previous.variant, previous.id, 'hover', false);\n        }\n\n        canvasStyle.cursor = current ? 'pointer' : '';\n    }\n\n    function handleClick({ click }: MapState) {\n        if (!click) return;\n\n        const { addTooltip } = mapboxHelpers;\n        const { infobox, coordinates, tooltip, url } = click;\n\n        clearHover();\n\n        if (options.tooltipMode === 'click' && tooltip) {\n            addTooltip(coordinates, click);\n        }\n\n        if (options.tooltipMode === 'hover') {\n            if (url && !detectTouch.touch && options.autoOpenUrl) {\n                window.open(url, options.openInTab ? '_blank' : '_self');\n            } else if ((url && tooltip) || (detectTouch.touch && !url && tooltip)) {\n                addTooltip(coordinates, click);\n            }\n        }\n\n        if (infobox) {\n            showInfobox(infobox);\n        } else {\n            clearInfobox();\n        }\n    }\n\n    function handleFocus({ focus }: MapState) {\n        const { current, previous, options } = focus;\n        const { setFeatureState, center, addTooltip, removeTooltip } = mapboxHelpers;\n\n        if (focusTimeout) clearTimeout(focusTimeout);\n\n        if (previous) {\n            previous.forEach(({ id, variant }) => {\n                if (hasHoverTheme()) setFeatureState(variant, id, 'focus', false);\n                pointerFocusToggle(id, 'remove');\n            });\n        }\n\n        if (current) {\n            current.forEach((item) => {\n                const { variant, id, coordinates, tooltip } = item;\n\n                function handleTooltip() {\n                    const showTooltip = options?.toggleTooltip && tooltip;\n\n                    if (theme.polygon || pointerExists(id)) {\n                        if (showTooltip) addTooltip(coordinates, item);\n\n                        pointerFocusToggle(id, 'add');\n                    }\n                }\n\n                if (theme.polygon) {\n                    if (hasHoverTheme()) setFeatureState(variant, id, 'focus', true);\n                }\n\n                if (pointerExists(id)) {\n                    handleTooltip();\n                } else {\n                    /*\n                        If a pointer doesn't exist, it means it's inside a cluster or outside of the view.\n                        When the map is idle, all newly centered pointers are drawn and the tooltip can be shown. (if not in a cluster)\n                    */\n                    map.once('idle', handleTooltip);\n                }\n            });\n\n            if (options?.zoom) {\n                let bounds = calculateMapDataBoundingBox(current);\n                bounds = expandBoundingBox(bounds, 0.05);\n\n                map.fitBounds(bounds);\n            } else if (!options?.static) {\n                center([[calculateMapDataCenter(current)]]);\n            }\n        } else {\n            removeTooltip();\n        }\n    }\n\n    function pointerFocusToggle(id: string, action: 'add' | 'remove') {\n        const pointer = getPointerElementById(id);\n\n        if (pointer) {\n            pointer.classList[action](POINTER_FOCUS_CLASS);\n            element.current!.classList[action](MAP_HOVERING_CLASS);\n        }\n    }\n\n    function showInfobox(infobox: MapInfobox) {\n        clearInfobox();\n        infoboxWrapper.current!.appendChild(\n            <Infobox {...infobox} onClose={clearInfobox} openInTab={options.openInTab} />,\n        );\n    }\n\n    function clearInfobox() {\n        infoboxWrapper.current!.innerHTML = '';\n    }\n\n    function toggleMap() {\n        element.current!.classList.toggle(CONTAINER_VISIBLE);\n        map.resize();\n    }\n\n    function hasHoverTheme() {\n        return theme.polygon && theme.polygon.settings[0].hover;\n    }\n\n    function createMapboxInstance() {\n        mapboxgl.accessToken = window.__ENVIRONMENT_DETAILS__.mapbox.accessToken;\n\n        const mapboxOptions: mapboxgl.MapboxOptions = {\n            container: container.current!,\n            style: `mapbox://styles/${window.__ENVIRONMENT_DETAILS__.mapbox.style}`,\n            minZoom: 4,\n            maxZoom: 30,\n            dragPan: true,\n            scrollZoom: false,\n        };\n\n        if (options.center) mapboxOptions.center = options.center;\n        if (options.zoom) mapboxOptions.zoom = options.zoom;\n        if (options.boundingBox) mapboxOptions.bounds = options.boundingBox;\n\n        if (!options.zoom && !options.center && !options.boundingBox) {\n            mapboxOptions.bounds = getCountryBoundingBox(['nl']);\n        }\n\n        return new mapboxgl.Map(mapboxOptions);\n    }\n\n    function getMapboxLanguageString(): string {\n        let language: string | undefined;\n\n        // If language could be nl-NL etc., make sure to strip first two characters\n        if (options.language) {\n            language = options.language.substr(0, 2);\n        }\n\n        // nl is not supported, use multilanguage instead\n        language = !language || language === 'nl' ? 'mul' : language;\n\n        return language;\n    }\n\n    async function setupMapbox() {\n        const { raster, geojson, layer, interaction, setupPointers } = mapboxHelpers;\n\n        await functionIsTrue(() => map.isStyleLoaded());\n\n        // Setup Mapbox Language\n        const languageControl = new MapboxLanguage({\n            defaultLanguage: getMapboxLanguageString(),\n        });\n        map.addControl(languageControl);\n\n        // Setup Layer Raster\n        // Layer raster can be set via the store and options attribute\n        const optionsLayerRaster = options.layerRaster\n            ? { layerRaster: options.layerRaster }\n            : undefined;\n        const storeLayerRaster = mapStore.getState().layerRasterSettings;\n\n        if (optionsLayerRaster) {\n            raster(optionsLayerRaster);\n        } else if (storeLayerRaster) {\n            raster(storeLayerRaster);\n        }\n\n        // Setup in case of polygons\n        if (theme.polygon) {\n            theme.polygon.settings.forEach((setting) => {\n                geojson(setting);\n                layer(setting);\n                interaction(setting);\n            });\n        }\n\n        // Setup in case of pointers\n        if (theme.pointer) {\n            setupPointers(element.current!);\n        }\n\n        map.resize();\n    }\n\n    function getPointerElementById(id: string) {\n        return element.current!.querySelector(`#pointer-${id}`);\n    }\n\n    function pointerExists(id: string) {\n        return !!getPointerElementById(id);\n    }\n\n    return (\n        <Fragment>\n            <div class=\"c-map\" js-hook-map>\n                <div className=\"map__container\" js-hook-map-container>\n                    {options.zoomButtons && (\n                        <div class=\"map__navigation\">\n                            <button class=\"map__button\" onClick={() => map.zoomIn()}>\n                                <bpd-svg name=\"icons-plus\"></bpd-svg>\n                            </button>\n                            <button class=\"map__button\" onClick={() => map.zoomOut()}>\n                                <span class=\"map__minus\"></span>\n                            </button>\n                        </div>\n                    )}\n\n                    {options.mobileToggle && (\n                        <button type=\"button\" class=\"map__close\" onClick={toggleMap}>\n                            <bpd-svg name=\"icons-close\" />\n                        </button>\n                    )}\n\n                    <div class=\"map__infobox-wrapper\" js-hook-infobox-wrapper></div>\n                </div>\n            </div>\n\n            {options.mobileToggle && (\n                <Fragment>\n                    <Button\n                        variant=\"bg\"\n                        label={options.mobileToggleLabel || 'Toon kaart'}\n                        classes=\"map__open\"\n                        onClick={toggleMap}></Button>\n                </Fragment>\n            )}\n        </Fragment>\n    );\n};\n\nMap.props = {\n    options: {\n        type: Object,\n    },\n    theme: {\n        type: Object,\n        required: true,\n    },\n    zoomButtons: {\n        type: Boolean,\n    },\n};\n\ndefineElement('bpd-map', Map);\n"]}
+{"version":3,"file":"map.js","sourceRoot":"","sources":["../../../src/molecules/map/map.tsx"],"names":[],"mappings":"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","sourcesContent":["import { defineElement, FC, onDidLoad, useElement, useProp } from '@atomify/hooks';\nimport { Fragment, h } from '@atomify/jsx';\nimport { MapInfobox, MapOptions, MapSearchOptions, MapTheme } from '@bpd-library/types';\nimport {\n    calculateMapDataBoundingBox,\n    calculateMapDataCenter,\n    detectTouch,\n    expandBoundingBox,\n    functionIsTrue,\n    getCountryBoundingBox,\n} from '@bpd-library/utilities';\nimport MapboxLanguage from '@mapbox/mapbox-gl-language';\nimport mapboxgl from 'mapbox-gl';\n\nimport { Button } from '../../atoms/button';\nimport { Infobox } from '../infobox';\nimport { clearHover, MapState, mapStore, setMapInstance } from './store/map';\nimport mapbox from './utilities/mapbox';\n\nconst DEFAULT_OPTIONS: MapOptions = {\n    zoomButtons: true,\n    mobileToggle: false,\n    tooltipMode: 'hover',\n    openInTab: false,\n    autoOpenUrl: true,\n    language: window.__ENVIRONMENT_DETAILS__.language || 'nl',\n    searchCountryIsoCodes: ['nl', 'de'],\n};\n\nconst CONTAINER_VISIBLE = 'map--is-visible';\nconst MOBILE_TOGGLE_CLASS = 'map--mobile-toggle';\nconst MAP_HOVERING_CLASS = 'map--hovering';\nconst POINTER_FOCUS_CLASS = 'map__pointer--focus';\n\nconst Map: FC = () => {\n    let [options] = useProp<MapOptions>('options', {});\n    const [theme] = useProp<MapTheme>('theme');\n    const container = useElement<HTMLDivElement>('[js-hook-map-container]');\n    const infoboxWrapper = useElement<HTMLDivElement>('[js-hook-infobox-wrapper]');\n    const element = useElement<HTMLDivElement>('[js-hook-map]');\n\n    let map: mapboxgl.Map;\n    let mapboxHelpers: ReturnType<typeof mapbox>;\n    let focusTimeout: ReturnType<typeof setTimeout> | undefined;\n\n    onDidLoad(async () => {\n        if (options.mobileToggle) element.current!.classList.add(MOBILE_TOGGLE_CLASS);\n        options = { ...DEFAULT_OPTIONS, ...options };\n\n        map = createMapboxInstance();\n        mapboxHelpers = mapbox(map, options, theme);\n        setMapInstance(map);\n\n        await setupMapbox();\n\n        subscribe();\n\n        if (options.search)\n            options.search.forEach((e: MapSearchOptions) => mapboxHelpers.search(e));\n    });\n\n    function subscribe() {\n        const { filter, data } = mapStore.getState();\n        const { addData } = mapboxHelpers;\n\n        addData(filter ? filter : data);\n\n        mapStore.subscribe(({ data }) => addData(data), ['data']);\n        mapStore.subscribe(handleHover, ['hover']);\n        mapStore.subscribe(handleClick, ['click']);\n        mapStore.subscribe(handleFocus, ['focus']);\n        mapStore.subscribe(handleIsochrone, ['isochroneSetting']);\n        mapStore.subscribe(({ filter, data }) => addData(filter ? filter : data), ['filter']);\n        mapStore.subscribe(\n            ({ layerRasterSettings }) =>\n                layerRasterSettings && mapboxHelpers.raster(layerRasterSettings),\n            ['layerRasterSettings'],\n        );\n    }\n\n    function handleHover({ hover }: MapState) {\n        const { current, previous } = hover;\n        const canvasStyle = map.getCanvas().style;\n        const { setFeatureState, addTooltip, removeTooltip } = mapboxHelpers;\n\n        /*\n            Add / Remove tooltip\n        */\n        if (options.tooltipMode === 'hover') {\n            if (current?.tooltip && !detectTouch.touch) addTooltip(current.coordinates, current);\n            if (!current && !detectTouch.touch) removeTooltip();\n        }\n\n        /*\n            Set hover state\n        */\n        if (hasHoverTheme()) {\n            if (current) setFeatureState(current.variant, current.id, 'hover', true);\n            if (previous) setFeatureState(previous.variant, previous.id, 'hover', false);\n        }\n\n        canvasStyle.cursor = current ? 'pointer' : '';\n    }\n\n    function handleClick({ click }: MapState) {\n        if (!click) return;\n\n        const { addTooltip } = mapboxHelpers;\n        const { infobox, coordinates, tooltip, url } = click;\n\n        clearHover();\n\n        if (options.tooltipMode === 'click' && tooltip) {\n            addTooltip(coordinates, click);\n        }\n\n        if (options.tooltipMode === 'hover') {\n            if (url && !detectTouch.touch && options.autoOpenUrl) {\n                window.open(url, options.openInTab ? '_blank' : '_self');\n            } else if ((url && tooltip) || (detectTouch.touch && !url && tooltip)) {\n                addTooltip(coordinates, click);\n            }\n        }\n\n        if (infobox) {\n            showInfobox(infobox);\n        } else {\n            clearInfobox();\n        }\n    }\n\n    function handleFocus({ focus }: MapState) {\n        const { current, previous, options } = focus;\n        const { setFeatureState, center, addTooltip, removeTooltip } = mapboxHelpers;\n\n        if (focusTimeout) clearTimeout(focusTimeout);\n\n        if (previous) {\n            previous.forEach(({ id, variant }) => {\n                if (hasHoverTheme()) setFeatureState(variant, id, 'focus', false);\n                pointerFocusToggle(id, 'remove');\n            });\n        }\n\n        if (current) {\n            current.forEach((item) => {\n                const { variant, id, coordinates, tooltip } = item;\n\n                function handleTooltip() {\n                    const showTooltip = options?.toggleTooltip && tooltip;\n\n                    if (theme.polygon || pointerExists(id)) {\n                        if (showTooltip) addTooltip(coordinates, item);\n\n                        pointerFocusToggle(id, 'add');\n                    }\n                }\n\n                if (theme.polygon) {\n                    if (hasHoverTheme()) setFeatureState(variant, id, 'focus', true);\n                }\n\n                if (pointerExists(id)) {\n                    handleTooltip();\n                } else {\n                    /*\n                        If a pointer doesn't exist, it means it's inside a cluster or outside of the view.\n                        When the map is idle, all newly centered pointers are drawn and the tooltip can be shown. (if not in a cluster)\n                    */\n                    map.once('idle', handleTooltip);\n                }\n            });\n\n            if (options?.zoom) {\n                let bounds = calculateMapDataBoundingBox(current);\n                bounds = expandBoundingBox(bounds, 0.05);\n\n                map.fitBounds(bounds);\n            } else if (!options?.static) {\n                center([[calculateMapDataCenter(current)]]);\n            }\n        } else {\n            removeTooltip();\n        }\n    }\n\n    function handleIsochrone({ isochroneSetting }: MapState) {\n        const { removeIsochrone, addIsochrone } = mapboxHelpers;\n\n        if (isochroneSetting) {\n            addIsochrone(isochroneSetting);\n        } else {\n            removeIsochrone();\n        }\n    }\n\n    function pointerFocusToggle(id: string, action: 'add' | 'remove') {\n        const pointer = getPointerElementById(id);\n\n        if (pointer) {\n            pointer.classList[action](POINTER_FOCUS_CLASS);\n            element.current!.classList[action](MAP_HOVERING_CLASS);\n        }\n    }\n\n    function showInfobox(infobox: MapInfobox) {\n        clearInfobox();\n        infoboxWrapper.current!.appendChild(\n            <Infobox {...infobox} onClose={clearInfobox} openInTab={options.openInTab} />,\n        );\n    }\n\n    function clearInfobox() {\n        infoboxWrapper.current!.innerHTML = '';\n    }\n\n    function toggleMap() {\n        element.current!.classList.toggle(CONTAINER_VISIBLE);\n        map.resize();\n    }\n\n    function hasHoverTheme() {\n        return theme.polygon && theme.polygon.settings[0].hover;\n    }\n\n    function createMapboxInstance() {\n        mapboxgl.accessToken = window.__ENVIRONMENT_DETAILS__.mapbox.accessToken;\n\n        const mapboxOptions: mapboxgl.MapboxOptions = {\n            container: container.current!,\n            style: `mapbox://styles/${window.__ENVIRONMENT_DETAILS__.mapbox.style}`,\n            minZoom: 4,\n            maxZoom: 30,\n            dragPan: true,\n            scrollZoom: false,\n        };\n\n        if (options.center) mapboxOptions.center = options.center;\n        if (options.zoom) mapboxOptions.zoom = options.zoom;\n        if (options.boundingBox) mapboxOptions.bounds = options.boundingBox;\n\n        if (!options.zoom && !options.center && !options.boundingBox) {\n            mapboxOptions.bounds = getCountryBoundingBox(['nl']);\n        }\n\n        return new mapboxgl.Map(mapboxOptions);\n    }\n\n    function getMapboxLanguageString(): string {\n        let language: string | undefined;\n\n        // If language could be nl-NL etc., make sure to strip first two characters\n        if (options.language) {\n            language = options.language.substr(0, 2);\n        }\n\n        // nl is not supported, use multilanguage instead\n        language = !language || language === 'nl' ? 'mul' : language;\n\n        return language;\n    }\n\n    async function setupMapbox() {\n        const { raster, geojson, layer, interaction, setupPointers } = mapboxHelpers;\n\n        await functionIsTrue(() => map.isStyleLoaded());\n\n        // Setup Mapbox Language\n        const languageControl = new MapboxLanguage({\n            defaultLanguage: getMapboxLanguageString(),\n        });\n        map.addControl(languageControl);\n\n        // Setup Layer Raster\n        // Layer raster can be set via the store and options attribute\n        const optionsLayerRaster = options.layerRaster\n            ? { layerRaster: options.layerRaster }\n            : undefined;\n        const storeLayerRaster = mapStore.getState().layerRasterSettings;\n\n        if (optionsLayerRaster) {\n            raster(optionsLayerRaster);\n        } else if (storeLayerRaster) {\n            raster(storeLayerRaster);\n        }\n\n        // Setup in case of polygons\n        if (theme.polygon) {\n            theme.polygon.settings.forEach((setting) => {\n                geojson(setting);\n                layer(setting);\n                interaction(setting);\n            });\n        }\n\n        // Setup in case of pointers\n        if (theme.pointer) {\n            setupPointers(element.current!);\n        }\n\n        map.resize();\n    }\n\n    function getPointerElementById(id: string) {\n        return element.current!.querySelector(`#pointer-${id}`);\n    }\n\n    function pointerExists(id: string) {\n        return !!getPointerElementById(id);\n    }\n\n    return (\n        <Fragment>\n            <div class=\"c-map\" js-hook-map>\n                <div className=\"map__container\" js-hook-map-container>\n                    {options.zoomButtons && (\n                        <div class=\"map__navigation\">\n                            <button class=\"map__button\" onClick={() => map.zoomIn()}>\n                                <bpd-svg name=\"icons-plus\"></bpd-svg>\n                            </button>\n                            <button class=\"map__button\" onClick={() => map.zoomOut()}>\n                                <span class=\"map__minus\"></span>\n                            </button>\n                        </div>\n                    )}\n\n                    {options.mobileToggle && (\n                        <button type=\"button\" class=\"map__close\" onClick={toggleMap}>\n                            <bpd-svg name=\"icons-close\" />\n                        </button>\n                    )}\n\n                    <div class=\"map__infobox-wrapper\" js-hook-infobox-wrapper></div>\n                </div>\n            </div>\n\n            {options.mobileToggle && (\n                <Fragment>\n                    <Button\n                        variant=\"bg\"\n                        label={options.mobileToggleLabel || 'Toon kaart'}\n                        classes=\"map__open\"\n                        onClick={toggleMap}></Button>\n                </Fragment>\n            )}\n        </Fragment>\n    );\n};\n\nMap.props = {\n    options: {\n        type: Object,\n    },\n    theme: {\n        type: Object,\n        required: true,\n    },\n    zoomButtons: {\n        type: Boolean,\n    },\n};\n\ndefineElement('bpd-map', Map);\n"]}

package/dist/molecules/map/store/map/store.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="mapbox-gl" />
-import { BoundingBox, MapDataItem } from '@bpd-library/types';
+import { BoundingBox, MapDataItem, MapIsochroneSetting } from '@bpd-library/types';
 export declare type SearchResult = {
     items: MapDataItem[];
     result: any;
@@ -34,6 +34,7 @@ export interface MapState {
     searchIsMoving: boolean;
     manualSearch?: string;
     layerRasterSettings?: MapLayerRasterSettings;
+    isochroneSetting?: MapIsochroneSetting;
 }
 export declare const mapStore: import("@atomify/kit/dist/utilities/store/store.types").Store<MapState>;
 export declare const updateMapData: (data: MapDataItem[]) => void;
@@ -50,6 +51,8 @@ export declare const setMapInstance: (mapInstance: mapboxgl.Map) => void;
 export declare const manualSearch: (query: string) => void;
 export declare const updateSearchIsMoving: (isMoving: boolean) => void;
 export declare const setLayerRaster: (layerRasterSettings: MapLayerRasterSettings) => void;
+export declare const setIsochrone: (isochroneSetting: MapIsochroneSetting) => void;
+export declare const clearIsochrone: () => void;
 export declare const getMapboxData: () => MapDataItem[];
 export declare const getHover: () => {
     current?: MapDataItem | undefined;

package/dist/molecules/map/store/map/store.js

@@ -19,6 +19,8 @@ const CLEAR_FILTER = 'clearFilter';
 const SET_MAP_INSTANCE = 'setMapInstance';
 const SET_LAYER_RASTER = 'SET_LAYER_RASTER';
 const MANUAL_SEARCH = 'manualSearch';
+const SET_ISOCHRONE = 'setIsochrone';
+const CLEAR_ISOCHRONE = 'clearIsochrone';
 const actions = {
     [UPDATE_MAP_DATA]: (state, data) => {
         state.data = data;
@@ -93,6 +95,14 @@ const actions = {
         state.layerRasterSettings = layerRasterSettings;
         return state;
     },
+    [SET_ISOCHRONE]: (state, isochroneSetting) => {
+        state.isochroneSetting = isochroneSetting;
+        return state;
+    },
+    [CLEAR_ISOCHRONE]: (state) => {
+        state.isochroneSetting = undefined;
+        return state;
+    },
 };
 export const mapStore = createStore({
     initialState,
@@ -140,6 +150,12 @@ export const updateSearchIsMoving = (isMoving) => {
 export const setLayerRaster = (layerRasterSettings) => {
     mapStore.dispatch(SET_LAYER_RASTER, layerRasterSettings);
 };
+export const setIsochrone = (isochroneSetting) => {
+    mapStore.dispatch(SET_ISOCHRONE, isochroneSetting);
+};
+export const clearIsochrone = () => {
+    mapStore.dispatch(CLEAR_ISOCHRONE);
+};
 export const getMapboxData = () => mapStore.getState().data;
 export const getHover = () => mapStore.getState().hover;
 export const getMapInstance = () => mapStore.getState().mapInstance;

package/dist/molecules/map/store/map/store.js.map

@@ -1 +1 @@
-{"version":3,"file":"store.js","sourceRoot":"","sources":["../../../../../src/molecules/map/store/map/store.ts"],"names":[],"mappings":"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","sourcesContent":["import { createStore } from '@atomify/kit';\nimport { BoundingBox, MapDataItem } from '@bpd-library/types';\n\nexport type SearchResult = {\n    items: MapDataItem[];\n    result: any;\n    originalBoundingBox?: BoundingBox;\n    expandedBoundingBox?: BoundingBox;\n};\n\ninterface MapFocusOptions {\n    zoom?: boolean;\n    toggleTooltip?: boolean;\n    static?: boolean;\n}\n\nexport interface MapLayerRasterSettings {\n    layerRaster: string;\n    minzoom?: number;\n    maxzoom?: number;\n}\n\nexport interface MapState {\n    data: MapDataItem[];\n    mapInstance?: mapboxgl.Map;\n    hover: {\n        current?: MapDataItem;\n        previous?: MapDataItem;\n    };\n    filter?: MapDataItem[];\n    click?: MapDataItem;\n    focus: {\n        current?: MapDataItem[];\n        previous?: MapDataItem[];\n        options?: MapFocusOptions;\n    };\n    searchResult?: SearchResult;\n    searchIsMoving: boolean;\n    manualSearch?: string;\n    layerRasterSettings?: MapLayerRasterSettings;\n}\n\nconst initialState: MapState = {\n    data: [],\n    hover: {},\n    focus: {},\n    searchIsMoving: false,\n};\n\nconst UPDATE_MAP_DATA = 'updateMapData';\nconst UPDATE_HOVER = 'updateHover';\nconst CLEAR_HOVER = 'clearHover';\nconst UPDATE_CLICK = 'updateClick';\nconst SET_FOCUS = 'setFocus';\nconst CLEAR_FOCUS = 'clearFocus';\nconst UPDATE_SEARCH_RESULT = 'updateSearchResult';\nconst CLEAR_SEARCH_RESULT = 'clearSearchResult';\nconst UPDATE_SEARCH_IS_MOVING = 'updateSearchIsMoving';\nconst SET_FILTER = 'setFilter';\nconst CLEAR_FILTER = 'clearFilter';\nconst SET_MAP_INSTANCE = 'setMapInstance';\nconst SET_LAYER_RASTER = 'SET_LAYER_RASTER';\nconst MANUAL_SEARCH = 'manualSearch';\n\nconst actions = {\n    [UPDATE_MAP_DATA]: (state: MapState, data: MapDataItem[]) => {\n        state.data = data;\n        return state;\n    },\n    [UPDATE_HOVER]: (state: MapState, hover: MapDataItem) => {\n        state.hover = {\n            current: hover,\n            previous: state.hover.current,\n        };\n\n        return state;\n    },\n    [CLEAR_HOVER]: (state: MapState) => {\n        state.hover = {\n            current: undefined,\n            previous: state.hover.current,\n        };\n\n        return state;\n    },\n    [UPDATE_CLICK]: (state: MapState, click: MapDataItem) => {\n        state.click = { ...click };\n        return state;\n    },\n    [SET_FOCUS]: (\n        state: MapState,\n        { ids, options }: { ids: string[]; options: MapFocusOptions },\n    ) => {\n        const dataItems = state.data.filter(({ id }) => ids.indexOf(id) > -1);\n\n        if (dataItems.length) {\n            state.focus = {\n                current: dataItems,\n                previous: state.focus?.current,\n                options,\n            };\n        }\n\n        return state;\n    },\n    [CLEAR_FOCUS]: (state: MapState) => {\n        state.focus = {\n            current: undefined,\n            previous: state.focus.current,\n        };\n\n        return state;\n    },\n    [UPDATE_SEARCH_RESULT]: (state: MapState, searchResult: SearchResult) => {\n        state.searchResult = searchResult;\n        return state;\n    },\n    [CLEAR_SEARCH_RESULT]: (state: MapState) => {\n        state.searchResult = undefined;\n        return state;\n    },\n    [SET_FILTER]: (state: MapState, data: MapDataItem[]) => {\n        state.filter = data;\n        return state;\n    },\n    [CLEAR_FILTER]: (state: MapState) => {\n        state.filter = undefined;\n        return state;\n    },\n    [SET_MAP_INSTANCE]: (state: MapState, mapInstance: mapboxgl.Map) => {\n        state.mapInstance = mapInstance;\n        return state;\n    },\n    [MANUAL_SEARCH]: (state: MapState, query: string) => {\n        state.manualSearch = query;\n        return state;\n    },\n    [UPDATE_SEARCH_IS_MOVING]: (state: MapState, searchIsMoving: boolean) => {\n        state.searchIsMoving = searchIsMoving;\n        return state;\n    },\n    [SET_LAYER_RASTER]: (state: MapState, layerRasterSettings: MapLayerRasterSettings) => {\n        state.layerRasterSettings = layerRasterSettings;\n        return state;\n    },\n};\n\nexport const mapStore = createStore<MapState>({\n    initialState,\n    actions: actions as any,\n});\n\n/*\n    Setters\n*/\nexport const updateMapData = (data: MapDataItem[]) => {\n    mapStore.dispatch(UPDATE_MAP_DATA, data);\n};\n\nexport const clearHover = () => {\n    mapStore.dispatch(CLEAR_HOVER);\n};\n\nexport const updateHover = (hover: MapDataItem) => {\n    mapStore.dispatch(UPDATE_HOVER, hover);\n};\n\nexport const updateClick = (click: MapDataItem) => {\n    mapStore.dispatch(UPDATE_CLICK, click);\n};\n\nexport const setFocus = (ids: string[], options: MapFocusOptions = {}) => {\n    mapStore.dispatch(SET_FOCUS, { ids, options });\n};\n\nexport const clearFocus = () => {\n    mapStore.dispatch(CLEAR_FOCUS);\n};\n\nexport const updateSearchResult = (searchResult: SearchResult) => {\n    mapStore.dispatch(UPDATE_SEARCH_RESULT, searchResult);\n};\n\nexport const clearSearchResult = () => {\n    mapStore.dispatch(CLEAR_SEARCH_RESULT);\n};\n\nexport const setFilter = (data: MapDataItem[]) => {\n    mapStore.dispatch(SET_FILTER, data);\n};\n\nexport const clearFilter = () => {\n    mapStore.dispatch(CLEAR_FILTER);\n};\n\nexport const setMapInstance = (mapInstance: mapboxgl.Map) => {\n    mapStore.dispatch(SET_MAP_INSTANCE, mapInstance);\n};\n\nexport const manualSearch = (query: string) => {\n    mapStore.dispatch(MANUAL_SEARCH, query);\n};\n\nexport const updateSearchIsMoving = (isMoving: boolean) => {\n    mapStore.dispatch(UPDATE_SEARCH_IS_MOVING, isMoving);\n};\n\nexport const setLayerRaster = (layerRasterSettings: MapLayerRasterSettings) => {\n    mapStore.dispatch(SET_LAYER_RASTER, layerRasterSettings);\n};\n\n/*\n    Getters\n*/\nexport const getMapboxData = () => mapStore.getState().data;\nexport const getHover = () => mapStore.getState().hover;\nexport const getMapInstance = () => mapStore.getState().mapInstance;\nexport const getSearchIsMoving = () => mapStore.getState().searchIsMoving;\n"]}
+{"version":3,"file":"store.js","sourceRoot":"","sources":["../../../../../src/molecules/map/store/map/store.ts"],"names":[],"mappings":"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","sourcesContent":["import { createStore } from '@atomify/kit';\nimport { BoundingBox, MapDataItem, MapIsochroneSetting } from '@bpd-library/types';\n\nexport type SearchResult = {\n    items: MapDataItem[];\n    result: any;\n    originalBoundingBox?: BoundingBox;\n    expandedBoundingBox?: BoundingBox;\n};\n\ninterface MapFocusOptions {\n    zoom?: boolean;\n    toggleTooltip?: boolean;\n    static?: boolean;\n}\n\nexport interface MapLayerRasterSettings {\n    layerRaster: string;\n    minzoom?: number;\n    maxzoom?: number;\n}\n\nexport interface MapState {\n    data: MapDataItem[];\n    mapInstance?: mapboxgl.Map;\n    hover: {\n        current?: MapDataItem;\n        previous?: MapDataItem;\n    };\n    filter?: MapDataItem[];\n    click?: MapDataItem;\n    focus: {\n        current?: MapDataItem[];\n        previous?: MapDataItem[];\n        options?: MapFocusOptions;\n    };\n    searchResult?: SearchResult;\n    searchIsMoving: boolean;\n    manualSearch?: string;\n    layerRasterSettings?: MapLayerRasterSettings;\n    isochroneSetting?: MapIsochroneSetting;\n}\n\nconst initialState: MapState = {\n    data: [],\n    hover: {},\n    focus: {},\n    searchIsMoving: false,\n};\n\nconst UPDATE_MAP_DATA = 'updateMapData';\nconst UPDATE_HOVER = 'updateHover';\nconst CLEAR_HOVER = 'clearHover';\nconst UPDATE_CLICK = 'updateClick';\nconst SET_FOCUS = 'setFocus';\nconst CLEAR_FOCUS = 'clearFocus';\nconst UPDATE_SEARCH_RESULT = 'updateSearchResult';\nconst CLEAR_SEARCH_RESULT = 'clearSearchResult';\nconst UPDATE_SEARCH_IS_MOVING = 'updateSearchIsMoving';\nconst SET_FILTER = 'setFilter';\nconst CLEAR_FILTER = 'clearFilter';\nconst SET_MAP_INSTANCE = 'setMapInstance';\nconst SET_LAYER_RASTER = 'SET_LAYER_RASTER';\nconst MANUAL_SEARCH = 'manualSearch';\nconst SET_ISOCHRONE = 'setIsochrone';\nconst CLEAR_ISOCHRONE = 'clearIsochrone';\n\nconst actions = {\n    [UPDATE_MAP_DATA]: (state: MapState, data: MapDataItem[]) => {\n        state.data = data;\n        return state;\n    },\n    [UPDATE_HOVER]: (state: MapState, hover: MapDataItem) => {\n        state.hover = {\n            current: hover,\n            previous: state.hover.current,\n        };\n\n        return state;\n    },\n    [CLEAR_HOVER]: (state: MapState) => {\n        state.hover = {\n            current: undefined,\n            previous: state.hover.current,\n        };\n\n        return state;\n    },\n    [UPDATE_CLICK]: (state: MapState, click: MapDataItem) => {\n        state.click = { ...click };\n        return state;\n    },\n    [SET_FOCUS]: (\n        state: MapState,\n        { ids, options }: { ids: string[]; options: MapFocusOptions },\n    ) => {\n        const dataItems = state.data.filter(({ id }) => ids.indexOf(id) > -1);\n\n        if (dataItems.length) {\n            state.focus = {\n                current: dataItems,\n                previous: state.focus?.current,\n                options,\n            };\n        }\n\n        return state;\n    },\n    [CLEAR_FOCUS]: (state: MapState) => {\n        state.focus = {\n            current: undefined,\n            previous: state.focus.current,\n        };\n\n        return state;\n    },\n    [UPDATE_SEARCH_RESULT]: (state: MapState, searchResult: SearchResult) => {\n        state.searchResult = searchResult;\n        return state;\n    },\n    [CLEAR_SEARCH_RESULT]: (state: MapState) => {\n        state.searchResult = undefined;\n        return state;\n    },\n    [SET_FILTER]: (state: MapState, data: MapDataItem[]) => {\n        state.filter = data;\n        return state;\n    },\n    [CLEAR_FILTER]: (state: MapState) => {\n        state.filter = undefined;\n        return state;\n    },\n    [SET_MAP_INSTANCE]: (state: MapState, mapInstance: mapboxgl.Map) => {\n        state.mapInstance = mapInstance;\n        return state;\n    },\n    [MANUAL_SEARCH]: (state: MapState, query: string) => {\n        state.manualSearch = query;\n        return state;\n    },\n    [UPDATE_SEARCH_IS_MOVING]: (state: MapState, searchIsMoving: boolean) => {\n        state.searchIsMoving = searchIsMoving;\n        return state;\n    },\n    [SET_LAYER_RASTER]: (state: MapState, layerRasterSettings: MapLayerRasterSettings) => {\n        state.layerRasterSettings = layerRasterSettings;\n        return state;\n    },\n    [SET_ISOCHRONE]: (state: MapState, isochroneSetting: MapIsochroneSetting) => {\n        state.isochroneSetting = isochroneSetting;\n        return state;\n    },\n    [CLEAR_ISOCHRONE]: (state: MapState) => {\n        state.isochroneSetting = undefined;\n        return state;\n    },\n};\n\nexport const mapStore = createStore<MapState>({\n    initialState,\n    actions: actions as any,\n});\n\n/*\n    Setters\n*/\nexport const updateMapData = (data: MapDataItem[]) => {\n    mapStore.dispatch(UPDATE_MAP_DATA, data);\n};\n\nexport const clearHover = () => {\n    mapStore.dispatch(CLEAR_HOVER);\n};\n\nexport const updateHover = (hover: MapDataItem) => {\n    mapStore.dispatch(UPDATE_HOVER, hover);\n};\n\nexport const updateClick = (click: MapDataItem) => {\n    mapStore.dispatch(UPDATE_CLICK, click);\n};\n\nexport const setFocus = (ids: string[], options: MapFocusOptions = {}) => {\n    mapStore.dispatch(SET_FOCUS, { ids, options });\n};\n\nexport const clearFocus = () => {\n    mapStore.dispatch(CLEAR_FOCUS);\n};\n\nexport const updateSearchResult = (searchResult: SearchResult) => {\n    mapStore.dispatch(UPDATE_SEARCH_RESULT, searchResult);\n};\n\nexport const clearSearchResult = () => {\n    mapStore.dispatch(CLEAR_SEARCH_RESULT);\n};\n\nexport const setFilter = (data: MapDataItem[]) => {\n    mapStore.dispatch(SET_FILTER, data);\n};\n\nexport const clearFilter = () => {\n    mapStore.dispatch(CLEAR_FILTER);\n};\n\nexport const setMapInstance = (mapInstance: mapboxgl.Map) => {\n    mapStore.dispatch(SET_MAP_INSTANCE, mapInstance);\n};\n\nexport const manualSearch = (query: string) => {\n    mapStore.dispatch(MANUAL_SEARCH, query);\n};\n\nexport const updateSearchIsMoving = (isMoving: boolean) => {\n    mapStore.dispatch(UPDATE_SEARCH_IS_MOVING, isMoving);\n};\n\nexport const setLayerRaster = (layerRasterSettings: MapLayerRasterSettings) => {\n    mapStore.dispatch(SET_LAYER_RASTER, layerRasterSettings);\n};\n\nexport const setIsochrone = (isochroneSetting: MapIsochroneSetting) => {\n    mapStore.dispatch(SET_ISOCHRONE, isochroneSetting);\n};\n\nexport const clearIsochrone = () => {\n    mapStore.dispatch(CLEAR_ISOCHRONE);\n};\n\n/*\n    Getters\n*/\nexport const getMapboxData = () => mapStore.getState().data;\nexport const getHover = () => mapStore.getState().hover;\nexport const getMapInstance = () => mapStore.getState().mapInstance;\nexport const getSearchIsMoving = () => mapStore.getState().searchIsMoving;\n"]}

package/dist/molecules/map/utilities/mapbox/isochrone.d.ts

@@ -1,4 +1,5 @@
 import { MapIsochroneSetting } from '@bpd-library/types';
 import mapboxgl from 'mapbox-gl';
-declare const isochrone: (map: mapboxgl.Map, isochroneSetting: MapIsochroneSetting) => Promise<void>;
-export default isochrone;
+declare const addIsochrone: (map: mapboxgl.Map, isochroneSetting: MapIsochroneSetting) => Promise<void>;
+declare const removeIsochrone: (map: mapboxgl.Map) => void;
+export { addIsochrone, removeIsochrone };

package/dist/molecules/map/utilities/mapbox/isochrone.js

@@ -1,47 +1,114 @@
-import { environment } from '@bpd-library/utilities';
-const isochrone = async (map, isochroneSetting) => {
-    if (!map.getSource('isochrone')) {
-        setupSource(map);
-        setupLayer(map);
-    }
-    const { coordinate, minutes, profile } = isochroneSetting;
-    const accessToken = window.__ENVIRONMENT_DETAILS__.mapbox.accessToken;
-    try {
-        const url = `https://api.mapbox.com/isochrone/v1/mapbox/${profile}/${coordinate[0]},${coordinate[1]}?contours_minutes=${minutes}&polygons=true&access_token=${accessToken}`;
-        const result = await fetch(url);
-        const parsedResult = await result.json();
-        console.log(parsedResult);
-        if (parsedResult) {
-            const source = map.getSource('isochrone');
-            source === null || source === void 0 ? void 0 : source.setData(parsedResult);
+import { calculateBoundingBox, environment } from '@bpd-library/utilities';
+const OUTER_COORDINATES = [
+    [
+        [-42, 74],
+        [-42, 1],
+        [80, 1],
+        [80, 74],
+        [-42, 74],
+    ],
+];
+const ISOCHRONE_SOURCE = 'isochrone';
+const DEFAULT_FILL_COLOR = '#000000';
+const DEFAULT_STROKE_COLOR = '#32C1DE';
+let mask;
+let polygon;
+const addIsochrone = async (map, isochroneSetting) => {
+    await init();
+    async function init() {
+        if (!mask || !polygon) {
+            const maskPackage = await import('@turf/mask');
+            const helpersPackage = await import('@turf/helpers');
+            mask = await maskPackage.default;
+            polygon = await helpersPackage.polygon;
         }
-    }
-    catch (e) {
-        if (environment.isLocal) {
-            console.log(e);
+        if (!map.getSource(ISOCHRONE_SOURCE)) {
+            setupSource();
+            setupLayer();
+        }
+        const { coordinate, minutes, profile, fitBounds } = isochroneSetting;
+        const accessToken = window.__ENVIRONMENT_DETAILS__.mapbox.accessToken;
+        try {
+            let url = `https://api.mapbox.com/isochrone/v1/mapbox/${profile}/${coordinate[0]},${coordinate[1]}?contours_minutes=${minutes}&polygons=true&access_token=${accessToken}`;
+            if (profile === 'driving') {
+                url += '&generalize=100';
+            }
+            const result = await fetch(url);
+            const parsedResult = await result.json();
+            if (parsedResult) {
+                const source = map.getSource(ISOCHRONE_SOURCE);
+                const invertedCoordinates = invertCoordinates(parsedResult);
+                if (fitBounds) {
+                    fitApiResultBounds(parsedResult);
+                }
+                source === null || source === void 0 ? void 0 : source.setData(invertedCoordinates);
+            }
         }
+        catch (e) {
+            if (environment.isLocal) {
+                console.error(e);
+            }
+        }
+    }
+    function setupSource() {
+        map.addSource(ISOCHRONE_SOURCE, {
+            type: 'geojson',
+            data: {
+                type: 'FeatureCollection',
+                features: [],
+            },
+        });
+    }
+    function setupLayer() {
+        const { fill = DEFAULT_FILL_COLOR, stroke = DEFAULT_STROKE_COLOR } = isochroneSetting.color || {};
+        map.addLayer({
+            id: 'isochroneFill',
+            type: 'fill',
+            source: ISOCHRONE_SOURCE,
+            layout: {},
+            paint: {
+                'fill-color': fill,
+                'fill-opacity': 0.07,
+            },
+        });
+        map.addLayer({
+            id: 'isochroneStroke',
+            type: 'line',
+            source: ISOCHRONE_SOURCE,
+            layout: {},
+            paint: {
+                'line-color': stroke,
+                'line-width': 1,
+            },
+        });
+    }
+    function invertCoordinates(apiResult) {
+        var _a;
+        const apiCoordinates = (_a = apiResult.features[0]) === null || _a === void 0 ? void 0 : _a.geometry.coordinates;
+        const outerPolygon = polygon(apiCoordinates);
+        const innerPolygon = polygon([...OUTER_COORDINATES]);
+        const invertedPolygon = mask(outerPolygon, innerPolygon);
+        return invertedPolygon;
+    }
+    function fitApiResultBounds(apiResult) {
+        var _a;
+        const coordinates = (_a = apiResult.features[0]) === null || _a === void 0 ? void 0 : _a.geometry.coordinates;
+        const boundingBox = calculateBoundingBox(coordinates);
+        map.fitBounds(boundingBox, {
+            padding: 20,
+            animate: true,
+            duration: 1000,
+        });
     }
 };
-function setupSource(map) {
-    map.addSource('isochrone', {
-        type: 'geojson',
-        data: {
-            type: 'FeatureCollection',
-            features: [],
-        },
+const removeIsochrone = (map) => {
+    const source = map.getSource(ISOCHRONE_SOURCE);
+    if (!source)
+        return;
+    source.setData({
+        type: 'FeatureCollection',
+        features: [],
     });
-}
-function setupLayer(map) {
-    map.addLayer({
-        id: 'isochroneLayer',
-        type: 'fill',
-        source: 'isochrone',
-        layout: {},
-        paint: {
-            'fill-color': '#5a3fc0',
-            'fill-opacity': 0.3,
-        },
-    });
-}
-export default isochrone;
+};
+export { addIsochrone, removeIsochrone };
 //# sourceMappingURL=isochrone.js.map

package/dist/molecules/map/utilities/mapbox/isochrone.js.map

@@ -1 +1 @@
-{"version":3,"file":"isochrone.js","sourceRoot":"","sources":["../../../../../src/molecules/map/utilities/mapbox/isochrone.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAC;AAGrD,MAAM,SAAS,GAAG,KAAK,EAAE,GAAiB,EAAE,gBAAqC,EAAE,EAAE;IAEjF,IAAI,CAAC,GAAG,CAAC,SAAS,CAAC,WAAW,CAAC,EAAE;QAC7B,WAAW,CAAC,GAAG,CAAC,CAAC;QACjB,UAAU,CAAC,GAAG,CAAC,CAAC;KACnB;IAED,MAAM,EAAE,UAAU,EAAE,OAAO,EAAE,OAAO,EAAE,GAAG,gBAAgB,CAAC;IAE1D,MAAM,WAAW,GAAG,MAAM,CAAC,uBAAuB,CAAC,MAAM,CAAC,WAAW,CAAC;IAEtE,IAAI;QACA,MAAM,GAAG,GAAG,8CAA8C,OAAO,IAAI,UAAU,CAAC,CAAC,CAAC,IAAI,UAAU,CAAC,CAAC,CAAC,qBAAqB,OAAO,+BAA+B,WAAW,EAAE,CAAC;QAC5K,MAAM,MAAM,GAAG,MAAM,KAAK,CAAC,GAAG,CAAC,CAAC;QAChC,MAAM,YAAY,GAAQ,MAAM,MAAM,CAAC,IAAI,EAAE,CAAC;QAE9C,OAAO,CAAC,GAAG,CAAC,YAAY,CAAC,CAAC;QAE1B,IAAI,YAAY,EAAE;YACd,MAAM,MAAM,GAAG,GAAG,CAAC,SAAS,CAAC,WAAW,CAAuC,CAAC;YAChF,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,OAAO,CAAC,YAAY,EAAE;SACjC;KACJ;IAAC,OAAO,CAAC,EAAE;QACR,IAAI,WAAW,CAAC,OAAO,EAAE;YACrB,OAAO,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;SAClB;KACJ;AACL,CAAC,CAAC;AAEF,SAAS,WAAW,CAAC,GAAiB;IAClC,GAAG,CAAC,SAAS,CAAC,WAAW,EAAE;QACvB,IAAI,EAAE,SAAS;QACf,IAAI,EAAE;YACF,IAAI,EAAE,mBAAmB;YACzB,QAAQ,EAAE,EAAE;SACf;KACJ,CAAC,CAAC;AACP,CAAC;AAED,SAAS,UAAU,CAAC,GAAiB;IACjC,GAAG,CAAC,QAAQ,CAAC;QACT,EAAE,EAAE,gBAAgB;QACpB,IAAI,EAAE,MAAM;QACZ,MAAM,EAAE,WAAW;QACnB,MAAM,EAAE,EAAE;QACV,KAAK,EAAE;YACH,YAAY,EAAE,SAAS;YACvB,cAAc,EAAE,GAAG;SACtB;KACJ,CAAC,CAAC;AACP,CAAC;AAED,eAAe,SAAS,CAAC","sourcesContent":["import { MapIsochroneSetting } from '@bpd-library/types';\nimport { environment } from '@bpd-library/utilities';\nimport mapboxgl from 'mapbox-gl';\n\nconst isochrone = async (map: mapboxgl.Map, isochroneSetting: MapIsochroneSetting) => {\n    // Setup source and layer, if not existing\n    if (!map.getSource('isochrone')) {\n        setupSource(map);\n        setupLayer(map);\n    }\n\n    const { coordinate, minutes, profile } = isochroneSetting;\n\n    const accessToken = window.__ENVIRONMENT_DETAILS__.mapbox.accessToken;\n\n    try {\n        const url = `https://api.mapbox.com/isochrone/v1/mapbox/${profile}/${coordinate[0]},${coordinate[1]}?contours_minutes=${minutes}&polygons=true&access_token=${accessToken}`;\n        const result = await fetch(url);\n        const parsedResult: any = await result.json();\n\n        console.log(parsedResult);\n\n        if (parsedResult) {\n            const source = map.getSource('isochrone') as mapboxgl.GeoJSONSource | undefined;\n            source?.setData(parsedResult);\n        }\n    } catch (e) {\n        if (environment.isLocal) {\n            console.log(e);\n        }\n    }\n};\n\nfunction setupSource(map: mapboxgl.Map) {\n    map.addSource('isochrone', {\n        type: 'geojson',\n        data: {\n            type: 'FeatureCollection',\n            features: [],\n        },\n    });\n}\n\nfunction setupLayer(map: mapboxgl.Map) {\n    map.addLayer({\n        id: 'isochroneLayer',\n        type: 'fill',\n        source: 'isochrone',\n        layout: {},\n        paint: {\n            'fill-color': '#5a3fc0',\n            'fill-opacity': 0.3,\n        },\n    });\n}\n\nexport default isochrone;\n"]}
+{"version":3,"file":"isochrone.js","sourceRoot":"","sources":["../../../../../src/molecules/map/utilities/mapbox/isochrone.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,oBAAoB,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAC;AAG3E,MAAM,iBAAiB,GAAgB;IACnC;QACI,CAAC,CAAC,EAAE,EAAE,EAAE,CAAC;QACT,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC;QACR,CAAC,EAAE,EAAE,CAAC,CAAC;QACP,CAAC,EAAE,EAAE,EAAE,CAAC;QACR,CAAC,CAAC,EAAE,EAAE,EAAE,CAAC;KACZ;CACJ,CAAC;AACF,MAAM,gBAAgB,GAAG,WAAW,CAAC;AACrC,MAAM,kBAAkB,GAAG,SAAS,CAAC;AACrC,MAAM,oBAAoB,GAAG,SAAS,CAAC;AAIvC,IAAI,IAAS,CAAC;AACd,IAAI,OAAY,CAAC;AAEjB,MAAM,YAAY,GAAG,KAAK,EAAE,GAAiB,EAAE,gBAAqC,EAAE,EAAE;IACpF,MAAM,IAAI,EAAE,CAAC;IAEb,KAAK,UAAU,IAAI;QAEf,IAAI,CAAC,IAAI,IAAI,CAAC,OAAO,EAAE;YACnB,MAAM,WAAW,GAAG,MAAM,MAAM,CAAC,YAAY,CAAC,CAAC;YAC/C,MAAM,cAAc,GAAG,MAAM,MAAM,CAAC,eAAe,CAAC,CAAC;YAErD,IAAI,GAAG,MAAM,WAAW,CAAC,OAAO,CAAC;YACjC,OAAO,GAAG,MAAM,cAAc,CAAC,OAAO,CAAC;SAC1C;QAGD,IAAI,CAAC,GAAG,CAAC,SAAS,CAAC,gBAAgB,CAAC,EAAE;YAClC,WAAW,EAAE,CAAC;YACd,UAAU,EAAE,CAAC;SAChB;QAED,MAAM,EAAE,UAAU,EAAE,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,GAAG,gBAAgB,CAAC;QAErE,MAAM,WAAW,GAAG,MAAM,CAAC,uBAAuB,CAAC,MAAM,CAAC,WAAW,CAAC;QAEtE,IAAI;YACA,IAAI,GAAG,GAAW,8CAA8C,OAAO,IAAI,UAAU,CAAC,CAAC,CAAC,IAAI,UAAU,CAAC,CAAC,CAAC,qBAAqB,OAAO,+BAA+B,WAAW,EAAE,CAAC;YAGlL,IAAI,OAAO,KAAK,SAAS,EAAE;gBACvB,GAAG,IAAI,iBAAiB,CAAC;aAC5B;YAED,MAAM,MAAM,GAAG,MAAM,KAAK,CAAC,GAAG,CAAC,CAAC;YAChC,MAAM,YAAY,GAAuB,MAAM,MAAM,CAAC,IAAI,EAAE,CAAC;YAE7D,IAAI,YAAY,EAAE;gBACd,MAAM,MAAM,GAAG,GAAG,CAAC,SAAS,CAAC,gBAAgB,CAE9B,CAAC;gBAEhB,MAAM,mBAAmB,GAAG,iBAAiB,CAAC,YAAY,CAAC,CAAC;gBAE5D,IAAI,SAAS,EAAE;oBACX,kBAAkB,CAAC,YAAY,CAAC,CAAC;iBACpC;gBAED,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,OAAO,CAAC,mBAAmB,EAAE;aACxC;SACJ;QAAC,OAAO,CAAC,EAAE;YACR,IAAI,WAAW,CAAC,OAAO,EAAE;gBACrB,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;aACpB;SACJ;IACL,CAAC;IAED,SAAS,WAAW;QAChB,GAAG,CAAC,SAAS,CAAC,gBAAgB,EAAE;YAC5B,IAAI,EAAE,SAAS;YACf,IAAI,EAAE;gBACF,IAAI,EAAE,mBAAmB;gBACzB,QAAQ,EAAE,EAAE;aACf;SACJ,CAAC,CAAC;IACP,CAAC;IAED,SAAS,UAAU;QACf,MAAM,EACF,IAAI,GAAG,kBAAkB,EACzB,MAAM,GAAG,oBAAoB,EAChC,GAAG,gBAAgB,CAAC,KAAK,IAAI,EAAE,CAAC;QAEjC,GAAG,CAAC,QAAQ,CAAC;YACT,EAAE,EAAE,eAAe;YACnB,IAAI,EAAE,MAAM;YACZ,MAAM,EAAE,gBAAgB;YACxB,MAAM,EAAE,EAAE;YACV,KAAK,EAAE;gBACH,YAAY,EAAE,IAAI;gBAClB,cAAc,EAAE,IAAI;aACvB;SACJ,CAAC,CAAC;QAEH,GAAG,CAAC,QAAQ,CAAC;YACT,EAAE,EAAE,iBAAiB;YACrB,IAAI,EAAE,MAAM;YACZ,MAAM,EAAE,gBAAgB;YACxB,MAAM,EAAE,EAAE;YACV,KAAK,EAAE;gBACH,YAAY,EAAE,MAAM;gBACpB,YAAY,EAAE,CAAC;aAClB;SACJ,CAAC,CAAC;IACP,CAAC;IAED,SAAS,iBAAiB,CAAC,SAA6B;;QACpD,MAAM,cAAc,SAAG,SAAS,CAAC,QAAQ,CAAC,CAAC,CAAC,0CAAE,QAAQ,CAAC,WAAW,CAAC;QAEnE,MAAM,YAAY,GAAG,OAAO,CAAC,cAAc,CAAC,CAAC;QAC7C,MAAM,YAAY,GAAG,OAAO,CAAC,CAAC,GAAG,iBAAiB,CAAC,CAAC,CAAC;QAErD,MAAM,eAAe,GAAG,IAAI,CAAC,YAAY,EAAE,YAAY,CAAC,CAAC;QAEzD,OAAO,eAAe,CAAC;IAC3B,CAAC;IAED,SAAS,kBAAkB,CAAC,SAA6B;;QACrD,MAAM,WAAW,GAAG,MAAA,SAAS,CAAC,QAAQ,CAAC,CAAC,CAAC,0CAAE,QAAQ,CAAC,WAA0B,CAAC;QAC/E,MAAM,WAAW,GAAG,oBAAoB,CAAC,WAAW,CAAC,CAAC;QAEtD,GAAG,CAAC,SAAS,CAAC,WAAW,EAAE;YACvB,OAAO,EAAE,EAAE;YACX,OAAO,EAAE,IAAI;YACb,QAAQ,EAAE,IAAI;SACjB,CAAC,CAAC;IACP,CAAC;AACL,CAAC,CAAC;AAEF,MAAM,eAAe,GAAG,CAAC,GAAiB,EAAE,EAAE;IAC1C,MAAM,MAAM,GAAG,GAAG,CAAC,SAAS,CAAC,gBAAgB,CAAuC,CAAC;IAErF,IAAI,CAAC,MAAM;QAAE,OAAO;IAEpB,MAAM,CAAC,OAAO,CAAC;QACX,IAAI,EAAE,mBAAmB;QACzB,QAAQ,EAAE,EAAE;KACf,CAAC,CAAC;AACP,CAAC,CAAC;AAEF,OAAO,EAAE,YAAY,EAAE,eAAe,EAAE,CAAC","sourcesContent":["import { Coordinates, MapIsochroneSetting } from '@bpd-library/types';\nimport { calculateBoundingBox, environment } from '@bpd-library/utilities';\nimport mapboxgl from 'mapbox-gl';\n\nconst OUTER_COORDINATES: Coordinates = [\n    [\n        [-42, 74],\n        [-42, 1],\n        [80, 1],\n        [80, 74],\n        [-42, 74],\n    ],\n];\nconst ISOCHRONE_SOURCE = 'isochrone';\nconst DEFAULT_FILL_COLOR = '#000000';\nconst DEFAULT_STROKE_COLOR = '#32C1DE';\n\ntype IsochroneApiResult = GeoJSON.FeatureCollection<GeoJSON.Polygon>;\n\nlet mask: any;\nlet polygon: any;\n\nconst addIsochrone = async (map: mapboxgl.Map, isochroneSetting: MapIsochroneSetting) => {\n    await init();\n\n    async function init() {\n        // Lazyload turf package\n        if (!mask || !polygon) {\n            const maskPackage = await import('@turf/mask');\n            const helpersPackage = await import('@turf/helpers');\n\n            mask = await maskPackage.default;\n            polygon = await helpersPackage.polygon;\n        }\n\n        // Setup source and layer, if not existing\n        if (!map.getSource(ISOCHRONE_SOURCE)) {\n            setupSource();\n            setupLayer();\n        }\n\n        const { coordinate, minutes, profile, fitBounds } = isochroneSetting;\n\n        const accessToken = window.__ENVIRONMENT_DETAILS__.mapbox.accessToken;\n\n        try {\n            let url: string = `https://api.mapbox.com/isochrone/v1/mapbox/${profile}/${coordinate[0]},${coordinate[1]}?contours_minutes=${minutes}&polygons=true&access_token=${accessToken}`;\n\n            // To simplify the polygon. Makes calculating boundingBoxes more performant\n            if (profile === 'driving') {\n                url += '&generalize=100';\n            }\n\n            const result = await fetch(url);\n            const parsedResult: IsochroneApiResult = await result.json();\n\n            if (parsedResult) {\n                const source = map.getSource(ISOCHRONE_SOURCE) as\n                    | mapboxgl.GeoJSONSource\n                    | undefined;\n\n                const invertedCoordinates = invertCoordinates(parsedResult);\n\n                if (fitBounds) {\n                    fitApiResultBounds(parsedResult);\n                }\n\n                source?.setData(invertedCoordinates);\n            }\n        } catch (e) {\n            if (environment.isLocal) {\n                console.error(e);\n            }\n        }\n    }\n\n    function setupSource() {\n        map.addSource(ISOCHRONE_SOURCE, {\n            type: 'geojson',\n            data: {\n                type: 'FeatureCollection',\n                features: [],\n            },\n        });\n    }\n\n    function setupLayer() {\n        const {\n            fill = DEFAULT_FILL_COLOR,\n            stroke = DEFAULT_STROKE_COLOR\n        } = isochroneSetting.color || {};\n\n        map.addLayer({\n            id: 'isochroneFill',\n            type: 'fill',\n            source: ISOCHRONE_SOURCE,\n            layout: {},\n            paint: {\n                'fill-color': fill,\n                'fill-opacity': 0.07,\n            },\n        });\n\n        map.addLayer({\n            id: 'isochroneStroke',\n            type: 'line',\n            source: ISOCHRONE_SOURCE,\n            layout: {},\n            paint: {\n                'line-color': stroke,\n                'line-width': 1,\n            },\n        });\n    }\n\n    function invertCoordinates(apiResult: IsochroneApiResult) {\n        const apiCoordinates = apiResult.features[0]?.geometry.coordinates;\n\n        const outerPolygon = polygon(apiCoordinates);\n        const innerPolygon = polygon([...OUTER_COORDINATES]);\n\n        const invertedPolygon = mask(outerPolygon, innerPolygon);\n\n        return invertedPolygon;\n    }\n\n    function fitApiResultBounds(apiResult: IsochroneApiResult) {\n        const coordinates = apiResult.features[0]?.geometry.coordinates as Coordinates;\n        const boundingBox = calculateBoundingBox(coordinates);\n\n        map.fitBounds(boundingBox, {\n            padding: 20,\n            animate: true,\n            duration: 1000,\n        });\n    }\n};\n\nconst removeIsochrone = (map: mapboxgl.Map) => {\n    const source = map.getSource(ISOCHRONE_SOURCE) as mapboxgl.GeoJSONSource | undefined;\n\n    if (!source) return;\n\n    source.setData({\n        type: 'FeatureCollection',\n        features: [],\n    });\n};\n\nexport { addIsochrone, removeIsochrone };\n"]}

package/dist/molecules/map/utilities/mapbox/mapbox.d.ts

@@ -1,4 +1,4 @@
-import { Coordinates, MapData, MapDataItem, MapOptions, MapSearchOptions, MapTheme, PolygonThemeSetting } from '@bpd-library/types';
+import { Coordinates, MapData, MapDataItem, MapIsochroneSetting, MapOptions, MapSearchOptions, MapTheme, PolygonThemeSetting } from '@bpd-library/types';
 import { MapLayerRasterSettings } from '../../store/map';
 declare const mapbox: (map: mapboxgl.Map, options: MapOptions, theme: MapTheme) => {
     raster: (settings: MapLayerRasterSettings) => void;
@@ -12,5 +12,7 @@ declare const mapbox: (map: mapboxgl.Map, options: MapOptions, theme: MapTheme)
     removeTooltip: () => void;
     setFeatureState: (variant: string, id: string, type: 'hover' | 'focus', hover: boolean) => void;
     search: (searchOptions: MapSearchOptions) => Promise<void>;
+    addIsochrone: (isochroneSetting: MapIsochroneSetting) => Promise<void>;
+    removeIsochrone: () => void;
 };
 export default mapbox;

package/dist/molecules/map/utilities/mapbox/mapbox.js

@@ -1,5 +1,6 @@
 import addData from './add-data';
 import center from './center';
+import { addIsochrone, removeIsochrone } from './isochrone';
 import setupPointers from './pointers/setup-pointers';
 import setFeatureState from './polygons/feature-state';
 import geojson from './polygons/geojson';
@@ -20,6 +21,8 @@ const mapbox = (map, options, theme) => ({
     removeTooltip,
     setFeatureState: (variant, id, type, hover) => setFeatureState(map, variant, id, type, hover),
     search: (searchOptions) => search(map, searchOptions, options),
+    addIsochrone: (isochroneSetting) => addIsochrone(map, isochroneSetting),
+    removeIsochrone: () => removeIsochrone(map),
 });
 export default mapbox;
 //# sourceMappingURL=mapbox.js.map

package/dist/molecules/map/utilities/mapbox/mapbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"mapbox.js","sourceRoot":"","sources":["../../../../../src/molecules/map/utilities/mapbox/mapbox.ts"],"names":[],"mappings":"AAWA,OAAO,OAAO,MAAM,YAAY,CAAC;AACjC,OAAO,MAAM,MAAM,UAAU,CAAC;AAC9B,OAAO,aAAa,MAAM,2BAA2B,CAAC;AACtD,OAAO,eAAe,MAAM,0BAA0B,CAAC;AACvD,OAAO,OAAO,MAAM,oBAAoB,CAAC;AACzC,OAAO,WAAW,MAAM,wBAAwB,CAAC;AACjD,OAAO,KAAK,MAAM,kBAAkB,CAAC;AACrC,OAAO,MAAM,MAAM,UAAU,CAAC;AAC9B,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,UAAU,EAAE,aAAa,EAAE,MAAM,WAAW,CAAC;AAEtD,MAAM,MAAM,GAAG,CAAC,GAAiB,EAAE,OAAmB,EAAE,KAAe,EAAE,EAAE,CAAC,CAAC;IACzE,MAAM,EAAE,CAAC,QAAgC,EAAE,EAAE,CAAC,MAAM,CAAC,GAAG,EAAE,QAAQ,CAAC;IACnE,OAAO,EAAE,CAAC,OAA4B,EAAE,EAAE,CAAC,OAAO,CAAC,GAAG,EAAE,OAAO,CAAC;IAChE,KAAK,EAAE,CAAC,OAA4B,EAAE,EAAE,CAAC,KAAK,CAAC,GAAG,EAAE,OAAO,CAAC;IAC5D,WAAW,EAAE,CAAC,OAA4B,EAAE,EAAE,CAAC,WAAW,CAAC,GAAG,EAAE,OAAO,CAAC;IACxE,MAAM,EAAE,CAAC,WAAwB,EAAE,EAAE,CAAC,MAAM,CAAC,GAAG,EAAE,WAAW,CAAC;IAC9D,aAAa,EAAE,CAAC,OAAoB,EAAE,EAAE,CAAC,aAAa,CAAC,GAAG,EAAE,KAAK,EAAE,OAAO,CAAC;IAC3E,OAAO,EAAE,CAAC,IAAa,EAAE,EAAE,CAAC,OAAO,CAAC,GAAG,EAAE,IAAI,EAAE,KAAK,CAAC;IACrD,UAAU,EAAE,CAAC,WAAwB,EAAE,WAAwB,EAAE,EAAE,CAC/D,UAAU,CAAC,GAAG,EAAE,WAAW,EAAE,WAAW,EAAE,OAAO,CAAC,SAAS,CAAC;IAChE,aAAa;IACb,eAAe,EAAE,CAAC,OAAe,EAAE,EAAU,EAAE,IAAuB,EAAE,KAAc,EAAE,EAAE,CACtF,eAAe,CAAC,GAAG,EAAE,OAAO,EAAE,EAAE,EAAE,IAAI,EAAE,KAAK,CAAC;IAClD,MAAM,EAAE,CAAC,aAA+B,EAAE,EAAE,CAAC,MAAM,CAAC,GAAG,EAAE,aAAa,EAAE,OAAO,CAAC;CACnF,CAAC,CAAC;AAEH,eAAe,MAAM,CAAC","sourcesContent":["import {\n    Coordinates,\n    MapData,\n    MapDataItem,\n    MapOptions,\n    MapSearchOptions,\n    MapTheme,\n    PolygonThemeSetting,\n} from '@bpd-library/types';\n\nimport { MapLayerRasterSettings } from '../../store/map';\nimport addData from './add-data';\nimport center from './center';\nimport setupPointers from './pointers/setup-pointers';\nimport setFeatureState from './polygons/feature-state';\nimport geojson from './polygons/geojson';\nimport interaction from './polygons/interaction';\nimport layer from './polygons/layer';\nimport raster from './raster';\nimport search from './search/search';\nimport { addTooltip, removeTooltip } from './tooltip';\n\nconst mapbox = (map: mapboxgl.Map, options: MapOptions, theme: MapTheme) => ({\n    raster: (settings: MapLayerRasterSettings) => raster(map, settings),\n    geojson: (setting: PolygonThemeSetting) => geojson(map, setting),\n    layer: (setting: PolygonThemeSetting) => layer(map, setting),\n    interaction: (setting: PolygonThemeSetting) => interaction(map, setting),\n    center: (coordinates: Coordinates) => center(map, coordinates),\n    setupPointers: (element: HTMLElement) => setupPointers(map, theme, element),\n    addData: (data: MapData) => addData(map, data, theme),\n    addTooltip: (coordinates: Coordinates, mapDataItem: MapDataItem) =>\n        addTooltip(map, coordinates, mapDataItem, options.openInTab),\n    removeTooltip,\n    setFeatureState: (variant: string, id: string, type: 'hover' | 'focus', hover: boolean) =>\n        setFeatureState(map, variant, id, type, hover),\n    search: (searchOptions: MapSearchOptions) => search(map, searchOptions, options),\n});\n\nexport default mapbox;\n"]}
+{"version":3,"file":"mapbox.js","sourceRoot":"","sources":["../../../../../src/molecules/map/utilities/mapbox/mapbox.ts"],"names":[],"mappings":"AAYA,OAAO,OAAO,MAAM,YAAY,CAAC;AACjC,OAAO,MAAM,MAAM,UAAU,CAAC;AAC9B,OAAO,EAAE,YAAY,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAC5D,OAAO,aAAa,MAAM,2BAA2B,CAAC;AACtD,OAAO,eAAe,MAAM,0BAA0B,CAAC;AACvD,OAAO,OAAO,MAAM,oBAAoB,CAAC;AACzC,OAAO,WAAW,MAAM,wBAAwB,CAAC;AACjD,OAAO,KAAK,MAAM,kBAAkB,CAAC;AACrC,OAAO,MAAM,MAAM,UAAU,CAAC;AAC9B,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,UAAU,EAAE,aAAa,EAAE,MAAM,WAAW,CAAC;AAEtD,MAAM,MAAM,GAAG,CAAC,GAAiB,EAAE,OAAmB,EAAE,KAAe,EAAE,EAAE,CAAC,CAAC;IACzE,MAAM,EAAE,CAAC,QAAgC,EAAE,EAAE,CAAC,MAAM,CAAC,GAAG,EAAE,QAAQ,CAAC;IACnE,OAAO,EAAE,CAAC,OAA4B,EAAE,EAAE,CAAC,OAAO,CAAC,GAAG,EAAE,OAAO,CAAC;IAChE,KAAK,EAAE,CAAC,OAA4B,EAAE,EAAE,CAAC,KAAK,CAAC,GAAG,EAAE,OAAO,CAAC;IAC5D,WAAW,EAAE,CAAC,OAA4B,EAAE,EAAE,CAAC,WAAW,CAAC,GAAG,EAAE,OAAO,CAAC;IACxE,MAAM,EAAE,CAAC,WAAwB,EAAE,EAAE,CAAC,MAAM,CAAC,GAAG,EAAE,WAAW,CAAC;IAC9D,aAAa,EAAE,CAAC,OAAoB,EAAE,EAAE,CAAC,aAAa,CAAC,GAAG,EAAE,KAAK,EAAE,OAAO,CAAC;IAC3E,OAAO,EAAE,CAAC,IAAa,EAAE,EAAE,CAAC,OAAO,CAAC,GAAG,EAAE,IAAI,EAAE,KAAK,CAAC;IACrD,UAAU,EAAE,CAAC,WAAwB,EAAE,WAAwB,EAAE,EAAE,CAC/D,UAAU,CAAC,GAAG,EAAE,WAAW,EAAE,WAAW,EAAE,OAAO,CAAC,SAAS,CAAC;IAChE,aAAa;IACb,eAAe,EAAE,CAAC,OAAe,EAAE,EAAU,EAAE,IAAuB,EAAE,KAAc,EAAE,EAAE,CACtF,eAAe,CAAC,GAAG,EAAE,OAAO,EAAE,EAAE,EAAE,IAAI,EAAE,KAAK,CAAC;IAClD,MAAM,EAAE,CAAC,aAA+B,EAAE,EAAE,CAAC,MAAM,CAAC,GAAG,EAAE,aAAa,EAAE,OAAO,CAAC;IAChF,YAAY,EAAE,CAAC,gBAAqC,EAAE,EAAE,CAAC,YAAY,CAAC,GAAG,EAAE,gBAAgB,CAAC;IAC5F,eAAe,EAAE,GAAG,EAAE,CAAC,eAAe,CAAC,GAAG,CAAC;CAC9C,CAAC,CAAC;AAEH,eAAe,MAAM,CAAC","sourcesContent":["import {\n    Coordinates,\n    MapData,\n    MapDataItem,\n    MapIsochroneSetting,\n    MapOptions,\n    MapSearchOptions,\n    MapTheme,\n    PolygonThemeSetting,\n} from '@bpd-library/types';\n\nimport { MapLayerRasterSettings } from '../../store/map';\nimport addData from './add-data';\nimport center from './center';\nimport { addIsochrone, removeIsochrone } from './isochrone';\nimport setupPointers from './pointers/setup-pointers';\nimport setFeatureState from './polygons/feature-state';\nimport geojson from './polygons/geojson';\nimport interaction from './polygons/interaction';\nimport layer from './polygons/layer';\nimport raster from './raster';\nimport search from './search/search';\nimport { addTooltip, removeTooltip } from './tooltip';\n\nconst mapbox = (map: mapboxgl.Map, options: MapOptions, theme: MapTheme) => ({\n    raster: (settings: MapLayerRasterSettings) => raster(map, settings),\n    geojson: (setting: PolygonThemeSetting) => geojson(map, setting),\n    layer: (setting: PolygonThemeSetting) => layer(map, setting),\n    interaction: (setting: PolygonThemeSetting) => interaction(map, setting),\n    center: (coordinates: Coordinates) => center(map, coordinates),\n    setupPointers: (element: HTMLElement) => setupPointers(map, theme, element),\n    addData: (data: MapData) => addData(map, data, theme),\n    addTooltip: (coordinates: Coordinates, mapDataItem: MapDataItem) =>\n        addTooltip(map, coordinates, mapDataItem, options.openInTab),\n    removeTooltip,\n    setFeatureState: (variant: string, id: string, type: 'hover' | 'focus', hover: boolean) =>\n        setFeatureState(map, variant, id, type, hover),\n    search: (searchOptions: MapSearchOptions) => search(map, searchOptions, options),\n    addIsochrone: (isochroneSetting: MapIsochroneSetting) => addIsochrone(map, isochroneSetting),\n    removeIsochrone: () => removeIsochrone(map),\n});\n\nexport default mapbox;\n"]}

package/dist/molecules/map/utilities/mapbox/search/search.d.ts

@@ -1,4 +1,4 @@
 import { MapOptions, MapSearchOptions } from '@bpd-library/types';
 import mapboxgl from 'mapbox-gl';
-declare const search: (map: mapboxgl.Map, { hook, kmPadding, onSearchSuggestion }: MapSearchOptions, { searchCountryIsoCodes, language }: MapOptions) => Promise<void>;
+declare const search: (map: mapboxgl.Map, { hook, kmPadding, onSearchSuggestion, noZoomAfterSearch }: MapSearchOptions, { searchCountryIsoCodes, language }: MapOptions) => Promise<void>;
 export default search;

package/dist/molecules/map/utilities/mapbox/search/search.js

@@ -5,7 +5,7 @@ import { clearSearchResult, getMapboxData, mapStore, updateSearchIsMoving, updat
 import { fitBounds } from '../../fit-bounds';
 import getCityAlternativeSuggestions from './alternative-city-suggestions';
 const MIN_KM_PADDING = 10;
-const search = async (map, { hook, kmPadding = MIN_KM_PADDING, onSearchSuggestion }, { searchCountryIsoCodes = ['nl', 'de'], language = 'nl' }) => {
+const search = async (map, { hook, kmPadding = MIN_KM_PADDING, onSearchSuggestion, noZoomAfterSearch }, { searchCountryIsoCodes = ['nl', 'de'], language = 'nl' }) => {
     const element = document.querySelector(hook);
     const bounds = getCountryBoundingBox(searchCountryIsoCodes);
     if (!element) {
@@ -71,7 +71,9 @@ const search = async (map, { hook, kmPadding = MIN_KM_PADDING, onSearchSuggestio
         clearSuggestionsContainer();
     }
     function handleFitBounds() {
-        return fitBounds(map, bounds);
+        if (noZoomAfterSearch)
+            return;
+        fitBounds(map, bounds);
     }
     function onKeyDown(e) {
         const { value } = inputElement;
@@ -155,11 +157,13 @@ const search = async (map, { hook, kmPadding = MIN_KM_PADDING, onSearchSuggestio
         const originalBoundingBox = result.bbox;
         const mapData = getMapboxData();
         const filteredData = mapData.filter((item) => withinBoundingBox(item.coordinates, expandedBoundingBox));
-        map.fitBounds(expandedBoundingBox);
-        updateSearchIsMoving(true);
-        map.once('moveend', () => {
-            updateSearchIsMoving(false);
-        });
+        if (!noZoomAfterSearch) {
+            map.fitBounds(expandedBoundingBox);
+            updateSearchIsMoving(true);
+            map.once('moveend', () => {
+                updateSearchIsMoving(false);
+            });
+        }
         updateSearchResult({
             items: filteredData,
             result,

package/dist/molecules/map/utilities/mapbox/search/search.js.map

@@ -1 +1 @@
-{"version":3,"file":"search.js","sourceRoot":"","sources":["../../../../../../src/molecules/map/utilities/mapbox/search/search.tsx"],"names":[],"mappings":"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","sourcesContent":["import { h } from '@atomify/jsx';\nimport { BoundingBox, MapOptions, MapSearchOptions, MapSearchSuggestion } from '@bpd-library/types';\nimport {\n    calculateBoundingBoxCenter,\n    debounce,\n    environment,\n    expandBoundingBox,\n    getCountryBoundingBox,\n    useClickOutside,\n    withinBoundingBox,\n} from '@bpd-library/utilities';\nimport mapboxgl from 'mapbox-gl';\n\nimport {\n    clearSearchResult,\n    getMapboxData,\n    MapState,\n    mapStore,\n    updateSearchIsMoving,\n    updateSearchResult,\n} from '../../../store/map';\nimport { fitBounds } from '../../fit-bounds';\nimport getCityAlternativeSuggestions from './alternative-city-suggestions';\n\nconst MIN_KM_PADDING = 10;\n\nconst search = async (\n    map: mapboxgl.Map,\n    { hook, kmPadding = MIN_KM_PADDING, onSearchSuggestion }: MapSearchOptions,\n    { searchCountryIsoCodes = ['nl', 'de'], language = 'nl' }: MapOptions,\n) => {\n    const element = document.querySelector(hook);\n    const bounds = getCountryBoundingBox(searchCountryIsoCodes);\n\n    if (!element) {\n        if (environment.isLocal) console.error(`Search element can't be found: ${hook}`);\n        return;\n    }\n\n    const inputElement = element.querySelector('[js-hook-map-search-input]') as HTMLInputElement;\n    const form = inputElement.closest<HTMLFormElement>('form');\n    const suggestionsElement = element.querySelector(\n        '[js-hook-map-search-suggestions]',\n    ) as HTMLElement;\n    const buttonElement = element.querySelector('[js-hook-map-search-button]') as HTMLButtonElement;\n\n    let geocoder: any | undefined;\n    let suggestions: any | undefined;\n\n    init();\n\n    async function init() {\n        // Dynamically import geocoder library\n        const { default: MapboxGeocoder } = await import('@mapbox/mapbox-gl-geocoder');\n\n        geocoder = new MapboxGeocoder({\n            accessToken: mapboxgl.accessToken,\n            mapboxgl,\n            countries: searchCountryIsoCodes.join(',').toUpperCase(),\n            types: 'region,district,place,neighborhood',\n            localGeocoder,\n            language,\n            enableEventLogging: false,\n            marker: false,\n        });\n\n        map.addControl(geocoder);\n\n        bindEvents();\n        subscribe();\n    }\n\n    function bindEvents() {\n        const debouncedOnKeyDown = debounce(onKeyDown, 300);\n\n        inputElement.addEventListener('keydown', debouncedOnKeyDown);\n        buttonElement.addEventListener('click', handleButtonClick);\n        form?.addEventListener('submit', (e) => e.preventDefault());\n\n        useClickOutside(inputElement!, handleClickOutside);\n\n        geocoder.on('results', (results: any) => {\n            suggestions = results;\n\n            renderSuggestions(suggestions);\n        });\n    }\n\n    function subscribe() {\n        handleManualSearch(mapStore.getState());\n        mapStore.subscribe(handleManualSearch, ['manualSearch']);\n    }\n\n    function handleManualSearch({ manualSearch }: MapState) {\n        if (manualSearch) {\n            geocoder.setInput(manualSearch).on('results', function handleResults(results: any) {\n                suggestions = results;\n\n                // First check if there's an exact match, in some cases bigger cities that are not an exact match are returned as first and most relevant result, while doing a manual search you always want an exact match.\n                const firstExactMatch = results?.features?.find(\n                    ({ text }: { text?: string }) =>\n                        text?.toLowerCase() === manualSearch.toLowerCase(),\n                );\n\n                if (firstExactMatch) {\n                    submitSuggestion(firstExactMatch);\n                } else {\n                    submitFirstSuggestion();\n                }\n\n                geocoder.off('results', handleResults);\n            });\n        }\n    }\n\n    function handleClickOutside() {\n        clearSuggestionsContainer();\n    }\n\n    function handleFitBounds() {\n        return fitBounds(map, bounds);\n    }\n\n    function onKeyDown(e: KeyboardEvent) {\n        const { value } = inputElement!;\n\n        if (e.key === 'Enter') {\n            if (!value) {\n                clearAll();\n                return;\n            } else {\n                geocoder.on('results', function handleEnter() {\n                    submitFirstSuggestion();\n                    inputElement?.blur();\n\n                    geocoder.off('results', handleEnter);\n                });\n            }\n        }\n\n        if (value.length >= 3) {\n            geocoder.setInput(value);\n        } else {\n            suggestions = undefined;\n            handleFitBounds();\n            clearSuggestionsContainer();\n            clearSearchResult();\n        }\n    }\n\n    function handleButtonClick() {\n        const { value } = inputElement!;\n\n        if (!value) {\n            clearAll();\n        } else {\n            submitFirstSuggestion();\n        }\n    }\n\n    function submitFirstSuggestion() {\n        const firstSuggestion = suggestions?.features[0];\n\n        submitSuggestion(firstSuggestion);\n    }\n\n    function submitSuggestion(feature: any) {\n        updateStore(feature);\n        clearSuggestionsContainer();\n    }\n\n    function clearSuggestionsContainer() {\n        suggestionsElement.innerHTML = '';\n    }\n\n    function clearAll() {\n        suggestions = undefined;\n        handleFitBounds();\n        clearSuggestionsContainer();\n        clearSearchResult();\n        inputElement?.blur();\n    }\n\n    function localGeocoder(query: string) {\n        const createSuggestion = ({ title, bbox, type, id }: MapSearchSuggestion) => {\n            const center = calculateBoundingBoxCenter(bbox);\n\n            return {\n                place_name: title,\n                bbox,\n                center,\n                type,\n                id,\n            };\n        };\n\n        const customSuggestions = onSearchSuggestion\n            ? onSearchSuggestion(query.toLowerCase()).map(createSuggestion)\n            : [];\n        const cityAlternatives = getCityAlternativeSuggestions(query.toLowerCase()).map(\n            createSuggestion,\n        );\n\n        return [...customSuggestions, ...cityAlternatives].slice(0, 4);\n    }\n\n    function updateStore(result: any) {\n        if (!result) {\n            updateSearchResult({\n                items: [],\n                result: false,\n            });\n\n            handleFitBounds();\n\n            return;\n        }\n\n        const expandedBoundingBox = expandBoundingBox(result.bbox as BoundingBox, kmPadding);\n        const originalBoundingBox = result.bbox as BoundingBox;\n\n        const mapData = getMapboxData();\n        const filteredData = mapData.filter((item) =>\n            withinBoundingBox(item.coordinates, expandedBoundingBox),\n        );\n\n        map.fitBounds(expandedBoundingBox);\n\n        // Update searchIsMoving boolean in store. Is used to block other focus interactions when searched.\n        updateSearchIsMoving(true);\n\n        map.once('moveend', () => {\n            updateSearchIsMoving(false);\n        });\n\n        updateSearchResult({\n            items: filteredData,\n            result,\n            originalBoundingBox,\n            expandedBoundingBox,\n        });\n    }\n\n    function handleSuggestionClick(feature: any) {\n        inputElement.value = feature.place_name;\n\n        clearSuggestionsContainer();\n        updateStore(feature);\n    }\n\n    function renderSuggestions(suggestions: any) {\n        clearSuggestionsContainer();\n\n        suggestionsElement.append(\n            <ul class=\"map-search__suggestions\">\n                {suggestions.features.map((feature: any) => (\n                    <li class=\"map-search__suggestion\">\n                        <button onClick={() => handleSuggestionClick(feature)}>\n                            {feature.place_name}\n                        </button>\n                    </li>\n                ))}\n            </ul>,\n        );\n    }\n};\n\nexport default search;\n"]}
+{"version":3,"file":"search.js","sourceRoot":"","sources":["../../../../../../src/molecules/map/utilities/mapbox/search/search.tsx"],"names":[],"mappings":"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","sourcesContent":["import { h } from '@atomify/jsx';\nimport { BoundingBox, MapOptions, MapSearchOptions, MapSearchSuggestion } from '@bpd-library/types';\nimport {\n    calculateBoundingBoxCenter,\n    debounce,\n    environment,\n    expandBoundingBox,\n    getCountryBoundingBox,\n    useClickOutside,\n    withinBoundingBox,\n} from '@bpd-library/utilities';\nimport mapboxgl from 'mapbox-gl';\n\nimport {\n    clearSearchResult,\n    getMapboxData,\n    MapState,\n    mapStore,\n    updateSearchIsMoving,\n    updateSearchResult,\n} from '../../../store/map';\nimport { fitBounds } from '../../fit-bounds';\nimport getCityAlternativeSuggestions from './alternative-city-suggestions';\n\nconst MIN_KM_PADDING = 10;\n\nconst search = async (\n    map: mapboxgl.Map,\n    { hook, kmPadding = MIN_KM_PADDING, onSearchSuggestion, noZoomAfterSearch }: MapSearchOptions,\n    { searchCountryIsoCodes = ['nl', 'de'], language = 'nl' }: MapOptions,\n) => {\n    const element = document.querySelector(hook);\n    const bounds = getCountryBoundingBox(searchCountryIsoCodes);\n\n    if (!element) {\n        if (environment.isLocal) console.error(`Search element can't be found: ${hook}`);\n        return;\n    }\n\n    const inputElement = element.querySelector('[js-hook-map-search-input]') as HTMLInputElement;\n    const form = inputElement.closest<HTMLFormElement>('form');\n    const suggestionsElement = element.querySelector(\n        '[js-hook-map-search-suggestions]',\n    ) as HTMLElement;\n    const buttonElement = element.querySelector('[js-hook-map-search-button]') as HTMLButtonElement;\n\n    let geocoder: any | undefined;\n    let suggestions: any | undefined;\n\n    init();\n\n    async function init() {\n        // Dynamically import geocoder library\n        const { default: MapboxGeocoder } = await import('@mapbox/mapbox-gl-geocoder');\n\n        geocoder = new MapboxGeocoder({\n            accessToken: mapboxgl.accessToken,\n            mapboxgl,\n            countries: searchCountryIsoCodes.join(',').toUpperCase(),\n            types: 'region,district,place,neighborhood',\n            localGeocoder,\n            language,\n            enableEventLogging: false,\n            marker: false,\n        });\n\n        map.addControl(geocoder);\n\n        bindEvents();\n        subscribe();\n    }\n\n    function bindEvents() {\n        const debouncedOnKeyDown = debounce(onKeyDown, 300);\n\n        inputElement.addEventListener('keydown', debouncedOnKeyDown);\n        buttonElement.addEventListener('click', handleButtonClick);\n        form?.addEventListener('submit', (e) => e.preventDefault());\n\n        useClickOutside(inputElement!, handleClickOutside);\n\n        geocoder.on('results', (results: any) => {\n            suggestions = results;\n\n            renderSuggestions(suggestions);\n        });\n    }\n\n    function subscribe() {\n        handleManualSearch(mapStore.getState());\n        mapStore.subscribe(handleManualSearch, ['manualSearch']);\n    }\n\n    function handleManualSearch({ manualSearch }: MapState) {\n        if (manualSearch) {\n            geocoder.setInput(manualSearch).on('results', function handleResults(results: any) {\n                suggestions = results;\n\n                // First check if there's an exact match, in some cases bigger cities that are not an exact match are returned as first and most relevant result, while doing a manual search you always want an exact match.\n                const firstExactMatch = results?.features?.find(\n                    ({ text }: { text?: string }) =>\n                        text?.toLowerCase() === manualSearch.toLowerCase(),\n                );\n\n                if (firstExactMatch) {\n                    submitSuggestion(firstExactMatch);\n                } else {\n                    submitFirstSuggestion();\n                }\n\n                geocoder.off('results', handleResults);\n            });\n        }\n    }\n\n    function handleClickOutside() {\n        clearSuggestionsContainer();\n    }\n\n    function handleFitBounds() {\n        if (noZoomAfterSearch) return;\n\n        fitBounds(map, bounds);\n    }\n\n    function onKeyDown(e: KeyboardEvent) {\n        const { value } = inputElement!;\n\n        if (e.key === 'Enter') {\n            if (!value) {\n                clearAll();\n                return;\n            } else {\n                geocoder.on('results', function handleEnter() {\n                    submitFirstSuggestion();\n                    inputElement?.blur();\n\n                    geocoder.off('results', handleEnter);\n                });\n            }\n        }\n\n        if (value.length >= 3) {\n            geocoder.setInput(value);\n        } else {\n            suggestions = undefined;\n            handleFitBounds();\n            clearSuggestionsContainer();\n            clearSearchResult();\n        }\n    }\n\n    function handleButtonClick() {\n        const { value } = inputElement!;\n\n        if (!value) {\n            clearAll();\n        } else {\n            submitFirstSuggestion();\n        }\n    }\n\n    function submitFirstSuggestion() {\n        const firstSuggestion = suggestions?.features[0];\n\n        submitSuggestion(firstSuggestion);\n    }\n\n    function submitSuggestion(feature: any) {\n        updateStore(feature);\n        clearSuggestionsContainer();\n    }\n\n    function clearSuggestionsContainer() {\n        suggestionsElement.innerHTML = '';\n    }\n\n    function clearAll() {\n        suggestions = undefined;\n        handleFitBounds();\n        clearSuggestionsContainer();\n        clearSearchResult();\n        inputElement?.blur();\n    }\n\n    function localGeocoder(query: string) {\n        const createSuggestion = ({ title, bbox, type, id }: MapSearchSuggestion) => {\n            const center = calculateBoundingBoxCenter(bbox);\n\n            return {\n                place_name: title,\n                bbox,\n                center,\n                type,\n                id,\n            };\n        };\n\n        const customSuggestions = onSearchSuggestion\n            ? onSearchSuggestion(query.toLowerCase()).map(createSuggestion)\n            : [];\n        const cityAlternatives = getCityAlternativeSuggestions(query.toLowerCase()).map(\n            createSuggestion,\n        );\n\n        return [...customSuggestions, ...cityAlternatives].slice(0, 4);\n    }\n\n    function updateStore(result: any) {\n        if (!result) {\n            updateSearchResult({\n                items: [],\n                result: false,\n            });\n\n            handleFitBounds();\n\n            return;\n        }\n\n        const expandedBoundingBox = expandBoundingBox(result.bbox as BoundingBox, kmPadding);\n        const originalBoundingBox = result.bbox as BoundingBox;\n\n        const mapData = getMapboxData();\n        const filteredData = mapData.filter((item) =>\n            withinBoundingBox(item.coordinates, expandedBoundingBox),\n        );\n\n        if (!noZoomAfterSearch) {\n            map.fitBounds(expandedBoundingBox);\n\n            // Update searchIsMoving boolean in store. Is used to block other focus interactions when searched.\n            updateSearchIsMoving(true);\n\n            map.once('moveend', () => {\n                updateSearchIsMoving(false);\n            });\n        }\n\n        updateSearchResult({\n            items: filteredData,\n            result,\n            originalBoundingBox,\n            expandedBoundingBox,\n        });\n    }\n\n    function handleSuggestionClick(feature: any) {\n        inputElement.value = feature.place_name;\n\n        clearSuggestionsContainer();\n        updateStore(feature);\n    }\n\n    function renderSuggestions(suggestions: any) {\n        clearSuggestionsContainer();\n\n        suggestionsElement.append(\n            <ul class=\"map-search__suggestions\">\n                {suggestions.features.map((feature: any) => (\n                    <li class=\"map-search__suggestion\">\n                        <button onClick={() => handleSuggestionClick(feature)}>\n                            {feature.place_name}\n                        </button>\n                    </li>\n                ))}\n            </ul>,\n        );\n    }\n};\n\nexport default search;\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@bpd-library/components",
-    "version": "1.2.3-beta.2",
+    "version": "1.2.3-beta.6",
     "description": "Description",
     "license": "MIT",
     "types": "dist/index.d.ts",
@@ -46,16 +46,19 @@
     "publishConfig": {
         "access": "public"
     },
-    "gitHead": "0cbdc4ba634a88dc7b021a5dc85c8741888fd039",
+    "gitHead": "5c31464bcb98abef8fa71e9c77f646916c1d5587",
     "dependencies": {
         "@atomify/core": "2.4.1",
         "@atomify/hooks": "1.1.11",
         "@atomify/jsx": "1.7.1",
         "@atomify/kit": "1.1.11",
-        "@bpd-library/types": "^1.2.3-beta.2",
-        "@bpd-library/utilities": "^1.2.3-beta.2",
+        "@bpd-library/types": "^1.2.3-beta.6",
+        "@bpd-library/utilities": "^1.2.3-beta.6",
         "@mapbox/mapbox-gl-geocoder": "^4.7.0",
         "@mapbox/mapbox-gl-language": "^0.10.1",
+        "@turf/helpers": "^6.5.0",
+        "@turf/mask": "^6.5.0",
+        "@turf/turf": "^6.5.0",
         "@types/mapbox-gl": "^2.4.1",
         "mapbox-gl": "^2.4.1",
         "nouislider": "^14.6.3"