@bpd-library/components 1.3.2-beta.5 → 1.3.2-beta.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/atoms/form-elements/range-slider/range-slider.d.ts +4 -1
- package/dist/atoms/form-elements/range-slider/range-slider.js +11 -4
- package/dist/atoms/form-elements/range-slider/range-slider.js.map +1 -1
- package/dist/atoms/form-elements/utilities/range-slider.js +49 -11
- package/dist/atoms/form-elements/utilities/range-slider.js.map +1 -1
- package/dist/esm/atoms/button/button.js +33 -0
- package/dist/esm/atoms/button/button.js.map +1 -0
- package/dist/esm/atoms/col/col.js +22 -0
- package/dist/esm/atoms/col/col.js.map +1 -0
- package/dist/esm/atoms/container/container.js +6 -0
- package/dist/esm/atoms/container/container.js.map +1 -0
- package/dist/esm/atoms/form-elements/range-slider/range-slider.js +21 -0
- package/dist/esm/atoms/form-elements/range-slider/range-slider.js.map +1 -0
- package/dist/esm/atoms/form-elements/utilities/range-slider.js +100 -0
- package/dist/esm/atoms/form-elements/utilities/range-slider.js.map +1 -0
- package/dist/esm/atoms/image/image.js +18 -0
- package/dist/esm/atoms/image/image.js.map +1 -0
- package/dist/esm/atoms/image/utilities/create-image-url.js +15 -0
- package/dist/esm/atoms/image/utilities/create-image-url.js.map +1 -0
- package/dist/esm/atoms/row/row.js +6 -0
- package/dist/esm/atoms/row/row.js.map +1 -0
- package/dist/esm/atoms/svg/svg.js +25 -0
- package/dist/esm/atoms/svg/svg.js.map +1 -0
- package/dist/esm/index.js +14 -0
- package/dist/esm/index.js.map +1 -0
- package/dist/esm/molecules/infobox/infobox.js +20 -0
- package/dist/esm/molecules/infobox/infobox.js.map +1 -0
- package/dist/esm/molecules/map/map.js +256 -0
- package/dist/esm/molecules/map/map.js.map +1 -0
- package/dist/esm/molecules/map/store/map/store.js +150 -0
- package/dist/esm/molecules/map/store/map/store.js.map +1 -0
- package/dist/esm/molecules/map/utilities/fit-bounds.js +4 -0
- package/dist/esm/molecules/map/utilities/fit-bounds.js.map +1 -0
- package/dist/esm/molecules/map/utilities/mapbox/add-data.js +54 -0
- package/dist/esm/molecules/map/utilities/mapbox/add-data.js.map +1 -0
- package/dist/esm/molecules/map/utilities/mapbox/center.js +15 -0
- package/dist/esm/molecules/map/utilities/mapbox/center.js.map +1 -0
- package/dist/esm/molecules/map/utilities/mapbox/constants.js +5 -0
- package/dist/esm/molecules/map/utilities/mapbox/constants.js.map +1 -0
- package/dist/esm/molecules/map/utilities/mapbox/index.js +3 -0
- package/dist/esm/molecules/map/utilities/mapbox/index.js.map +1 -0
- package/dist/esm/molecules/map/utilities/mapbox/mapbox.js +27 -0
- package/dist/esm/molecules/map/utilities/mapbox/mapbox.js.map +1 -0
- package/dist/esm/molecules/map/utilities/mapbox/parse-feature-properties.js +18 -0
- package/dist/esm/molecules/map/utilities/mapbox/parse-feature-properties.js.map +1 -0
- package/dist/esm/molecules/map/utilities/mapbox/pointers/setup-pointers.js +151 -0
- package/dist/esm/molecules/map/utilities/mapbox/pointers/setup-pointers.js.map +1 -0
- package/dist/esm/molecules/map/utilities/mapbox/polygons/feature-state.js +11 -0
- package/dist/esm/molecules/map/utilities/mapbox/polygons/feature-state.js.map +1 -0
- package/dist/esm/molecules/map/utilities/mapbox/polygons/geojson.js +10 -0
- package/dist/esm/molecules/map/utilities/mapbox/polygons/geojson.js.map +1 -0
- package/dist/esm/molecules/map/utilities/mapbox/polygons/interaction.js +34 -0
- package/dist/esm/molecules/map/utilities/mapbox/polygons/interaction.js.map +1 -0
- package/dist/esm/molecules/map/utilities/mapbox/polygons/layer.js +110 -0
- package/dist/esm/molecules/map/utilities/mapbox/polygons/layer.js.map +1 -0
- package/dist/esm/molecules/map/utilities/mapbox/raster.js +43 -0
- package/dist/esm/molecules/map/utilities/mapbox/raster.js.map +1 -0
- package/dist/esm/molecules/map/utilities/mapbox/search/alternative-city-suggestions.js +27 -0
- package/dist/esm/molecules/map/utilities/mapbox/search/alternative-city-suggestions.js.map +1 -0
- package/dist/esm/molecules/map/utilities/mapbox/search/search.js +174 -0
- package/dist/esm/molecules/map/utilities/mapbox/search/search.js.map +1 -0
- package/dist/esm/molecules/map/utilities/mapbox/tooltip.js +26 -0
- package/dist/esm/molecules/map/utilities/mapbox/tooltip.js.map +1 -0
- package/dist/esm/molecules/tooltip/tooltip.js +14 -0
- package/dist/esm/molecules/tooltip/tooltip.js.map +1 -0
- package/dist/esm/node_modules/tslib/tslib.es6.js +24 -0
- package/dist/esm/node_modules/tslib/tslib.es6.js.map +1 -0
- package/dist/lib/atoms/button/button.js +31 -0
- package/dist/lib/atoms/button/button.js.map +1 -0
- package/dist/lib/atoms/button/index.js +2 -0
- package/dist/lib/atoms/button/index.js.map +1 -0
- package/dist/lib/atoms/col/col.js +19 -0
- package/dist/lib/atoms/col/col.js.map +1 -0
- package/dist/lib/atoms/container/container.js +3 -0
- package/dist/lib/atoms/container/container.js.map +1 -0
- package/dist/lib/atoms/form-elements/range-slider/range-slider.js +18 -0
- package/dist/lib/atoms/form-elements/range-slider/range-slider.js.map +1 -0
- package/dist/lib/atoms/form-elements/utilities/range-slider.js +97 -0
- package/dist/lib/atoms/form-elements/utilities/range-slider.js.map +1 -0
- package/dist/lib/atoms/image/image.js +15 -0
- package/dist/lib/atoms/image/image.js.map +1 -0
- package/dist/lib/atoms/image/index.js +2 -0
- package/dist/lib/atoms/image/index.js.map +1 -0
- package/dist/lib/atoms/image/utilities/create-image-url.js +14 -0
- package/dist/lib/atoms/image/utilities/create-image-url.js.map +1 -0
- package/dist/lib/atoms/image/utilities/detect-responsive-images.js +24 -0
- package/dist/lib/atoms/image/utilities/detect-responsive-images.js.map +1 -0
- package/dist/lib/atoms/image/utilities/image.js +86 -0
- package/dist/lib/atoms/image/utilities/image.js.map +1 -0
- package/dist/lib/atoms/image/utilities/object-fit.js +35 -0
- package/dist/lib/atoms/image/utilities/object-fit.js.map +1 -0
- package/dist/lib/atoms/row/row.js +3 -0
- package/dist/lib/atoms/row/row.js.map +1 -0
- package/dist/lib/atoms/svg/svg.js +23 -0
- package/dist/lib/atoms/svg/svg.js.map +1 -0
- package/dist/lib/index.js +12 -0
- package/dist/lib/index.js.map +1 -0
- package/dist/lib/molecules/infobox/index.js +2 -0
- package/dist/lib/molecules/infobox/index.js.map +1 -0
- package/dist/lib/molecules/infobox/infobox.js +17 -0
- package/dist/lib/molecules/infobox/infobox.js.map +1 -0
- package/dist/lib/molecules/map/hooks/use-style-loaded.js +14 -0
- package/dist/lib/molecules/map/hooks/use-style-loaded.js.map +1 -0
- package/dist/lib/molecules/map/index.js +4 -0
- package/dist/lib/molecules/map/index.js.map +1 -0
- package/dist/lib/molecules/map/map.js +256 -0
- package/dist/lib/molecules/map/map.js.map +1 -0
- package/dist/lib/molecules/map/store/map/index.js +2 -0
- package/dist/lib/molecules/map/store/map/index.js.map +1 -0
- package/dist/lib/molecules/map/store/map/store.js +147 -0
- package/dist/lib/molecules/map/store/map/store.js.map +1 -0
- package/dist/lib/molecules/map/storybook/themes.js +54 -0
- package/dist/lib/molecules/map/storybook/themes.js.map +1 -0
- package/dist/lib/molecules/map/utilities/fit-bounds.js +2 -0
- package/dist/lib/molecules/map/utilities/fit-bounds.js.map +1 -0
- package/dist/lib/molecules/map/utilities/mapbox/add-data.js +52 -0
- package/dist/lib/molecules/map/utilities/mapbox/add-data.js.map +1 -0
- package/dist/lib/molecules/map/utilities/mapbox/center.js +13 -0
- package/dist/lib/molecules/map/utilities/mapbox/center.js.map +1 -0
- package/dist/lib/molecules/map/utilities/mapbox/constants.js +3 -0
- package/dist/lib/molecules/map/utilities/mapbox/constants.js.map +1 -0
- package/dist/lib/molecules/map/utilities/mapbox/index.js +3 -0
- package/dist/lib/molecules/map/utilities/mapbox/index.js.map +1 -0
- package/dist/lib/molecules/map/utilities/mapbox/mapbox.js +25 -0
- package/dist/lib/molecules/map/utilities/mapbox/mapbox.js.map +1 -0
- package/dist/lib/molecules/map/utilities/mapbox/parse-feature-properties.js +16 -0
- package/dist/lib/molecules/map/utilities/mapbox/parse-feature-properties.js.map +1 -0
- package/dist/lib/molecules/map/utilities/mapbox/pointers/setup-pointers.js +151 -0
- package/dist/lib/molecules/map/utilities/mapbox/pointers/setup-pointers.js.map +1 -0
- package/dist/lib/molecules/map/utilities/mapbox/polygons/feature-state.js +10 -0
- package/dist/lib/molecules/map/utilities/mapbox/polygons/feature-state.js.map +1 -0
- package/dist/lib/molecules/map/utilities/mapbox/polygons/geojson.js +9 -0
- package/dist/lib/molecules/map/utilities/mapbox/polygons/geojson.js.map +1 -0
- package/dist/lib/molecules/map/utilities/mapbox/polygons/interaction.js +32 -0
- package/dist/lib/molecules/map/utilities/mapbox/polygons/interaction.js.map +1 -0
- package/dist/lib/molecules/map/utilities/mapbox/polygons/layer.js +109 -0
- package/dist/lib/molecules/map/utilities/mapbox/polygons/layer.js.map +1 -0
- package/dist/lib/molecules/map/utilities/mapbox/raster.js +42 -0
- package/dist/lib/molecules/map/utilities/mapbox/raster.js.map +1 -0
- package/dist/lib/molecules/map/utilities/mapbox/search/alternative-city-suggestions.js +26 -0
- package/dist/lib/molecules/map/utilities/mapbox/search/alternative-city-suggestions.js.map +1 -0
- package/dist/lib/molecules/map/utilities/mapbox/search/search.js +172 -0
- package/dist/lib/molecules/map/utilities/mapbox/search/search.js.map +1 -0
- package/dist/lib/molecules/map/utilities/mapbox/tooltip.js +24 -0
- package/dist/lib/molecules/map/utilities/mapbox/tooltip.js.map +1 -0
- package/dist/lib/molecules/tooltip/index.js +2 -0
- package/dist/lib/molecules/tooltip/index.js.map +1 -0
- package/dist/lib/molecules/tooltip/tooltip.js +11 -0
- package/dist/lib/molecules/tooltip/tooltip.js.map +1 -0
- package/dist/molecules/map/index.d.ts +1 -0
- package/dist/molecules/map/index.js +1 -0
- package/dist/molecules/map/index.js.map +1 -1
- package/dist/molecules/map/store/map/store.d.ts +7 -1
- package/dist/molecules/map/store/map/store.js +32 -0
- package/dist/molecules/map/store/map/store.js.map +1 -1
- package/dist/molecules/map/utilities/mapbox/search/search.d.ts +1 -0
- package/dist/molecules/map/utilities/mapbox/search/search.js +6 -3
- package/dist/molecules/map/utilities/mapbox/search/search.js.map +1 -1
- package/dist/types/atoms/button/button.d.ts +17 -0
- package/dist/types/atoms/button/index.d.ts +1 -0
- package/dist/types/atoms/col/col.d.ts +11 -0
- package/dist/types/atoms/container/container.d.ts +6 -0
- package/dist/types/atoms/form-elements/range-slider/range-slider.d.ts +11 -0
- package/dist/types/atoms/form-elements/utilities/range-slider.d.ts +7 -0
- package/dist/types/atoms/image/image.d.ts +14 -0
- package/dist/types/atoms/image/index.d.ts +1 -0
- package/dist/types/atoms/image/utilities/create-image-url.d.ts +6 -0
- package/dist/types/atoms/image/utilities/detect-responsive-images.d.ts +7 -0
- package/dist/types/atoms/image/utilities/image.d.ts +18 -0
- package/dist/types/atoms/image/utilities/object-fit.d.ts +7 -0
- package/dist/types/atoms/row/row.d.ts +6 -0
- package/dist/types/atoms/svg/svg.d.ts +4 -0
- package/dist/types/index.d.ts +11 -0
- package/dist/types/molecules/infobox/index.d.ts +1 -0
- package/dist/types/molecules/infobox/infobox.d.ts +7 -0
- package/dist/types/molecules/map/hooks/use-style-loaded.d.ts +2 -0
- package/dist/types/molecules/map/index.d.ts +3 -0
- package/dist/types/molecules/map/map.d.ts +2 -0
- package/dist/types/molecules/map/store/map/index.d.ts +1 -0
- package/dist/types/molecules/map/store/map/store.d.ts +60 -0
- package/dist/types/molecules/map/storybook/themes.d.ts +3 -0
- package/dist/types/molecules/map/utilities/fit-bounds.d.ts +3 -0
- package/dist/types/molecules/map/utilities/mapbox/add-data.d.ts +3 -0
- package/dist/types/molecules/map/utilities/mapbox/center.d.ts +3 -0
- package/dist/types/molecules/map/utilities/mapbox/constants.d.ts +2 -0
- package/dist/types/molecules/map/utilities/mapbox/index.d.ts +2 -0
- package/dist/types/molecules/map/utilities/mapbox/mapbox.d.ts +16 -0
- package/dist/types/molecules/map/utilities/mapbox/parse-feature-properties.d.ts +6 -0
- package/dist/types/molecules/map/utilities/mapbox/pointers/setup-pointers.d.ts +3 -0
- package/dist/types/molecules/map/utilities/mapbox/polygons/feature-state.d.ts +2 -0
- package/dist/types/molecules/map/utilities/mapbox/polygons/geojson.d.ts +3 -0
- package/dist/types/molecules/map/utilities/mapbox/polygons/interaction.d.ts +3 -0
- package/dist/types/molecules/map/utilities/mapbox/polygons/layer.d.ts +3 -0
- package/dist/types/molecules/map/utilities/mapbox/raster.d.ts +3 -0
- package/dist/types/molecules/map/utilities/mapbox/search/alternative-city-suggestions.d.ts +3 -0
- package/dist/types/molecules/map/utilities/mapbox/search/search.d.ts +4 -0
- package/dist/types/molecules/map/utilities/mapbox/tooltip.d.ts +4 -0
- package/dist/types/molecules/tooltip/index.d.ts +1 -0
- package/dist/types/molecules/tooltip/tooltip.d.ts +7 -0
- package/package.json +4 -4
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
const TRANSITION_ZOOM_MARGIN = 0.75;
|
|
2
|
+
const raster = (map, settings) => {
|
|
3
|
+
const accessToken = window.__ENVIRONMENT_DETAILS__.mapbox.accessToken;
|
|
4
|
+
const tile = `${settings.layerRaster}/{z}/{x}/{y}.png?access_token=${accessToken}`;
|
|
5
|
+
if (map.getSource('raster')) {
|
|
6
|
+
console.warn('Adding multiple layerRasters is not possible');
|
|
7
|
+
return;
|
|
8
|
+
}
|
|
9
|
+
map.addSource('raster', {
|
|
10
|
+
type: 'raster',
|
|
11
|
+
tiles: [tile],
|
|
12
|
+
});
|
|
13
|
+
map.addLayer({
|
|
14
|
+
id: 'raster-image',
|
|
15
|
+
type: 'raster',
|
|
16
|
+
source: 'raster',
|
|
17
|
+
minzoom: 10,
|
|
18
|
+
maxzoom: 24,
|
|
19
|
+
}, 'bridge_minor');
|
|
20
|
+
if (settings.minzoom && settings.maxzoom) {
|
|
21
|
+
setTransitionPaintProperty(map, settings.minzoom, settings.maxzoom);
|
|
22
|
+
}
|
|
23
|
+
};
|
|
24
|
+
function setTransitionPaintProperty(map, minzoom, maxzoom) {
|
|
25
|
+
if (!minzoom || !maxzoom)
|
|
26
|
+
return;
|
|
27
|
+
map.setPaintProperty('raster-image', 'raster-opacity', [
|
|
28
|
+
'interpolate',
|
|
29
|
+
['exponential', TRANSITION_ZOOM_MARGIN],
|
|
30
|
+
['zoom'],
|
|
31
|
+
minzoom - TRANSITION_ZOOM_MARGIN,
|
|
32
|
+
0,
|
|
33
|
+
minzoom,
|
|
34
|
+
1,
|
|
35
|
+
maxzoom,
|
|
36
|
+
1,
|
|
37
|
+
maxzoom + TRANSITION_ZOOM_MARGIN,
|
|
38
|
+
0,
|
|
39
|
+
]);
|
|
40
|
+
}
|
|
41
|
+
export default raster;
|
|
42
|
+
//# sourceMappingURL=raster.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"raster.js","sourceRoot":"","sources":["../../../../../../src/molecules/map/utilities/mapbox/raster.ts"],"names":[],"mappings":"AAEA,MAAM,sBAAsB,GAAG,IAAI,CAAC;AAEpC,MAAM,MAAM,GAAG,CAAC,GAAiB,EAAE,QAAgC,EAAE,EAAE;IACnE,MAAM,WAAW,GAAG,MAAM,CAAC,uBAAuB,CAAC,MAAM,CAAC,WAAW,CAAC;IACtE,MAAM,IAAI,GAAG,GAAG,QAAQ,CAAC,WAAW,iCAAiC,WAAW,EAAE,CAAC;IAEnF,IAAI,GAAG,CAAC,SAAS,CAAC,QAAQ,CAAC,EAAE;QACzB,OAAO,CAAC,IAAI,CAAC,8CAA8C,CAAC,CAAC;QAC7D,OAAO;KACV;IAED,GAAG,CAAC,SAAS,CAAC,QAAQ,EAAE;QACpB,IAAI,EAAE,QAAQ;QACd,KAAK,EAAE,CAAC,IAAI,CAAC;KAChB,CAAC,CAAC;IAEH,GAAG,CAAC,QAAQ,CACR;QACI,EAAE,EAAE,cAAc;QAClB,IAAI,EAAE,QAAQ;QACd,MAAM,EAAE,QAAQ;QAChB,OAAO,EAAE,EAAE;QACX,OAAO,EAAE,EAAE;KACd,EACD,cAAc,CACjB,CAAC;IAEF,IAAI,QAAQ,CAAC,OAAO,IAAI,QAAQ,CAAC,OAAO,EAAE;QACtC,0BAA0B,CAAC,GAAG,EAAE,QAAQ,CAAC,OAAO,EAAE,QAAQ,CAAC,OAAO,CAAC,CAAC;KACvE;AACL,CAAC,CAAC;AASF,SAAS,0BAA0B,CAAC,GAAiB,EAAE,OAAe,EAAE,OAAe;IACnF,IAAI,CAAC,OAAO,IAAI,CAAC,OAAO;QAAE,OAAO;IAEjC,GAAG,CAAC,gBAAgB,CAAC,cAAc,EAAE,gBAAgB,EAAE;QACnD,aAAa;QACb,CAAC,aAAa,EAAE,sBAAsB,CAAC;QACvC,CAAC,MAAM,CAAC;QACR,OAAO,GAAG,sBAAsB;QAChC,CAAC;QACD,OAAO;QACP,CAAC;QACD,OAAO;QACP,CAAC;QACD,OAAO,GAAG,sBAAsB;QAChC,CAAC;KACJ,CAAC,CAAC;AACP,CAAC;AAED,eAAe,MAAM,CAAC","sourcesContent":["import { MapLayerRasterSettings } from '../../store/map';\n\nconst TRANSITION_ZOOM_MARGIN = 0.75;\n\nconst raster = (map: mapboxgl.Map, settings: MapLayerRasterSettings) => {\n const accessToken = window.__ENVIRONMENT_DETAILS__.mapbox.accessToken;\n const tile = `${settings.layerRaster}/{z}/{x}/{y}.png?access_token=${accessToken}`;\n\n if (map.getSource('raster')) {\n console.warn('Adding multiple layerRasters is not possible');\n return;\n }\n\n map.addSource('raster', {\n type: 'raster',\n tiles: [tile],\n });\n\n map.addLayer(\n {\n id: 'raster-image',\n type: 'raster',\n source: 'raster',\n minzoom: 10,\n maxzoom: 24,\n },\n 'bridge_minor',\n );\n\n if (settings.minzoom && settings.maxzoom) {\n setTransitionPaintProperty(map, settings.minzoom, settings.maxzoom);\n }\n};\n\n/**\n * @description Creates a fade-in effect when zooming in or out, based on a minzoom and maxzoom\n * @param {string} layer\n * @param {RGBA} color\n * @param {string} property\n * @return {*}\n */\nfunction setTransitionPaintProperty(map: mapboxgl.Map, minzoom: number, maxzoom: number) {\n if (!minzoom || !maxzoom) return;\n\n map.setPaintProperty('raster-image', 'raster-opacity', [\n 'interpolate',\n ['exponential', TRANSITION_ZOOM_MARGIN],\n ['zoom'],\n minzoom - TRANSITION_ZOOM_MARGIN,\n 0,\n minzoom,\n 1,\n maxzoom,\n 1,\n maxzoom + TRANSITION_ZOOM_MARGIN,\n 0,\n ]);\n}\n\nexport default raster;\n"]}
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
const ALTERNATIVES = [
|
|
2
|
+
{
|
|
3
|
+
query: 'Den Bosch',
|
|
4
|
+
title: 'Den Bosch, Noord-Brabant, Nederland',
|
|
5
|
+
bbox: [5.206494, 51.663997, 5.377136, 51.755477],
|
|
6
|
+
},
|
|
7
|
+
{
|
|
8
|
+
query: "'s-Gravenhage",
|
|
9
|
+
title: "'s-Gravenhage, Zuid-Holland, Nederland",
|
|
10
|
+
bbox: [4.1962, 52.014848, 4.42249, 52.128324],
|
|
11
|
+
},
|
|
12
|
+
];
|
|
13
|
+
function getCityAlternativeSuggestions(searchQuery) {
|
|
14
|
+
const suggestions = [];
|
|
15
|
+
ALTERNATIVES.forEach(({ title, query, bbox }) => {
|
|
16
|
+
if (query.toLowerCase().indexOf(searchQuery) > -1) {
|
|
17
|
+
suggestions.push({
|
|
18
|
+
title,
|
|
19
|
+
bbox,
|
|
20
|
+
});
|
|
21
|
+
}
|
|
22
|
+
});
|
|
23
|
+
return suggestions;
|
|
24
|
+
}
|
|
25
|
+
export default getCityAlternativeSuggestions;
|
|
26
|
+
//# sourceMappingURL=alternative-city-suggestions.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"alternative-city-suggestions.js","sourceRoot":"","sources":["../../../../../../../src/molecules/map/utilities/mapbox/search/alternative-city-suggestions.ts"],"names":[],"mappings":"AAQA,MAAM,YAAY,GAAsB;IACpC;QACI,KAAK,EAAE,WAAW;QAClB,KAAK,EAAE,qCAAqC;QAC5C,IAAI,EAAE,CAAC,QAAQ,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,CAAC;KACnD;IACD;QACI,KAAK,EAAE,eAAe;QACtB,KAAK,EAAE,wCAAwC;QAC/C,IAAI,EAAE,CAAC,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,SAAS,CAAC;KAChD;CACJ,CAAC;AAEF,SAAS,6BAA6B,CAAC,WAAmB;IACtD,MAAM,WAAW,GAA0B,EAAE,CAAC;IAE9C,YAAY,CAAC,OAAO,CAAC,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE,EAAE;QAC5C,IAAI,KAAK,CAAC,WAAW,EAAE,CAAC,OAAO,CAAC,WAAW,CAAC,GAAG,CAAC,CAAC,EAAE;YAC/C,WAAW,CAAC,IAAI,CAAC;gBACb,KAAK;gBACL,IAAI;aACP,CAAC,CAAC;SACN;IACL,CAAC,CAAC,CAAC;IAEH,OAAO,WAAW,CAAC;AACvB,CAAC;AAED,eAAe,6BAA6B,CAAC","sourcesContent":["import { BoundingBox, MapSearchSuggestion } from '@bpd-library/types';\n\ninterface CityAlternative {\n query: string;\n title: string;\n bbox: BoundingBox;\n}\n\nconst ALTERNATIVES: CityAlternative[] = [\n {\n query: 'Den Bosch',\n title: 'Den Bosch, Noord-Brabant, Nederland',\n bbox: [5.206494, 51.663997, 5.377136, 51.755477],\n },\n {\n query: \"'s-Gravenhage\",\n title: \"'s-Gravenhage, Zuid-Holland, Nederland\",\n bbox: [4.1962, 52.014848, 4.42249, 52.128324],\n },\n];\n\nfunction getCityAlternativeSuggestions(searchQuery: string): MapSearchSuggestion[] {\n const suggestions: MapSearchSuggestion[] = [];\n\n ALTERNATIVES.forEach(({ title, query, bbox }) => {\n if (query.toLowerCase().indexOf(searchQuery) > -1) {\n suggestions.push({\n title,\n bbox,\n });\n }\n });\n\n return suggestions;\n}\n\nexport default getCityAlternativeSuggestions;\n"]}
|
|
@@ -0,0 +1,172 @@
|
|
|
1
|
+
import { h } from '@atomify/jsx';
|
|
2
|
+
import { calculateBoundingBoxCenter, debounce, environment, expandBoundingBox, getCountryBoundingBox, useClickOutside, withinBoundingBox, } from '@bpd-library/utilities';
|
|
3
|
+
import mapboxgl from 'mapbox-gl';
|
|
4
|
+
import { clearSearchResult, getMapboxData, mapStore, updateSearchIsMoving, updateSearchResult, } from '../../../store/map';
|
|
5
|
+
import { fitBounds } from '../../fit-bounds';
|
|
6
|
+
import getCityAlternativeSuggestions from './alternative-city-suggestions';
|
|
7
|
+
const MIN_KM_PADDING = 10;
|
|
8
|
+
const search = async (map, { hook, kmPadding = MIN_KM_PADDING, onSearchSuggestion }, { searchCountryIsoCodes = ['nl', 'de'], language = 'nl' }) => {
|
|
9
|
+
const element = document.querySelector(hook);
|
|
10
|
+
const bounds = getCountryBoundingBox(searchCountryIsoCodes);
|
|
11
|
+
if (!element) {
|
|
12
|
+
if (environment.isLocal)
|
|
13
|
+
console.error(`Search element can't be found: ${hook}`);
|
|
14
|
+
return;
|
|
15
|
+
}
|
|
16
|
+
const inputElement = element.querySelector('[js-hook-map-search-input]');
|
|
17
|
+
const form = inputElement.closest('form');
|
|
18
|
+
const suggestionsElement = element.querySelector('[js-hook-map-search-suggestions]');
|
|
19
|
+
const buttonElement = element.querySelector('[js-hook-map-search-button]');
|
|
20
|
+
let geocoder;
|
|
21
|
+
let suggestions;
|
|
22
|
+
init();
|
|
23
|
+
async function init() {
|
|
24
|
+
const { default: MapboxGeocoder } = await import('@mapbox/mapbox-gl-geocoder');
|
|
25
|
+
geocoder = new MapboxGeocoder({
|
|
26
|
+
accessToken: mapboxgl.accessToken,
|
|
27
|
+
mapboxgl,
|
|
28
|
+
countries: searchCountryIsoCodes.join(',').toUpperCase(),
|
|
29
|
+
types: 'region,district,place,neighborhood',
|
|
30
|
+
localGeocoder,
|
|
31
|
+
language,
|
|
32
|
+
enableEventLogging: false,
|
|
33
|
+
marker: false,
|
|
34
|
+
});
|
|
35
|
+
map.addControl(geocoder);
|
|
36
|
+
bindEvents();
|
|
37
|
+
subscribe();
|
|
38
|
+
}
|
|
39
|
+
function bindEvents() {
|
|
40
|
+
const debouncedOnKeyDown = debounce(onKeyDown, 300);
|
|
41
|
+
inputElement.addEventListener('keydown', debouncedOnKeyDown);
|
|
42
|
+
buttonElement.addEventListener('click', handleButtonClick);
|
|
43
|
+
form === null || form === void 0 ? void 0 : form.addEventListener('submit', (e) => e.preventDefault());
|
|
44
|
+
useClickOutside(inputElement, handleClickOutside);
|
|
45
|
+
geocoder.on('results', (results) => {
|
|
46
|
+
suggestions = results;
|
|
47
|
+
renderSuggestions(suggestions);
|
|
48
|
+
});
|
|
49
|
+
}
|
|
50
|
+
function subscribe() {
|
|
51
|
+
handleManualSearch(mapStore.getState());
|
|
52
|
+
mapStore.subscribe(handleManualSearch, ['manualSearch']);
|
|
53
|
+
}
|
|
54
|
+
function handleManualSearch({ manualSearch }) {
|
|
55
|
+
if (manualSearch) {
|
|
56
|
+
geocoder.setInput(manualSearch).on('results', function handleResults(results) {
|
|
57
|
+
suggestions = results;
|
|
58
|
+
submitFirstSuggestion();
|
|
59
|
+
geocoder.off('results', handleResults);
|
|
60
|
+
});
|
|
61
|
+
}
|
|
62
|
+
}
|
|
63
|
+
function handleClickOutside() {
|
|
64
|
+
clearSuggestionsContainer();
|
|
65
|
+
}
|
|
66
|
+
function handleFitBounds() {
|
|
67
|
+
return fitBounds(map, bounds);
|
|
68
|
+
}
|
|
69
|
+
function onKeyDown(e) {
|
|
70
|
+
const { value } = inputElement;
|
|
71
|
+
if (e.key === 'Enter') {
|
|
72
|
+
if (!value) {
|
|
73
|
+
clearAll();
|
|
74
|
+
return;
|
|
75
|
+
}
|
|
76
|
+
else {
|
|
77
|
+
geocoder.on('results', function handleEnter() {
|
|
78
|
+
submitFirstSuggestion();
|
|
79
|
+
inputElement === null || inputElement === void 0 ? void 0 : inputElement.blur();
|
|
80
|
+
geocoder.off('results', handleEnter);
|
|
81
|
+
});
|
|
82
|
+
}
|
|
83
|
+
}
|
|
84
|
+
if (value.length >= 3) {
|
|
85
|
+
geocoder.setInput(value);
|
|
86
|
+
}
|
|
87
|
+
else {
|
|
88
|
+
suggestions = undefined;
|
|
89
|
+
handleFitBounds();
|
|
90
|
+
clearSuggestionsContainer();
|
|
91
|
+
clearSearchResult();
|
|
92
|
+
}
|
|
93
|
+
}
|
|
94
|
+
function handleButtonClick() {
|
|
95
|
+
const { value } = inputElement;
|
|
96
|
+
if (!value) {
|
|
97
|
+
clearAll();
|
|
98
|
+
}
|
|
99
|
+
else {
|
|
100
|
+
submitFirstSuggestion();
|
|
101
|
+
}
|
|
102
|
+
}
|
|
103
|
+
function submitFirstSuggestion() {
|
|
104
|
+
const firstSuggestion = suggestions === null || suggestions === void 0 ? void 0 : suggestions.features[0];
|
|
105
|
+
updateStore(firstSuggestion);
|
|
106
|
+
clearSuggestionsContainer();
|
|
107
|
+
}
|
|
108
|
+
function clearSuggestionsContainer() {
|
|
109
|
+
suggestionsElement.innerHTML = '';
|
|
110
|
+
}
|
|
111
|
+
function clearAll() {
|
|
112
|
+
suggestions = undefined;
|
|
113
|
+
handleFitBounds();
|
|
114
|
+
clearSuggestionsContainer();
|
|
115
|
+
clearSearchResult();
|
|
116
|
+
inputElement === null || inputElement === void 0 ? void 0 : inputElement.blur();
|
|
117
|
+
}
|
|
118
|
+
function localGeocoder(query) {
|
|
119
|
+
const createSuggestion = ({ title, bbox, type, id }) => {
|
|
120
|
+
const center = calculateBoundingBoxCenter(bbox);
|
|
121
|
+
return {
|
|
122
|
+
place_name: title,
|
|
123
|
+
bbox,
|
|
124
|
+
center,
|
|
125
|
+
type,
|
|
126
|
+
id,
|
|
127
|
+
};
|
|
128
|
+
};
|
|
129
|
+
const customSuggestions = onSearchSuggestion
|
|
130
|
+
? onSearchSuggestion(query.toLowerCase()).map(createSuggestion)
|
|
131
|
+
: [];
|
|
132
|
+
const cityAlternatives = getCityAlternativeSuggestions(query.toLowerCase()).map(createSuggestion);
|
|
133
|
+
return [...customSuggestions, ...cityAlternatives].slice(0, 4);
|
|
134
|
+
}
|
|
135
|
+
function updateStore(result) {
|
|
136
|
+
if (!result) {
|
|
137
|
+
updateSearchResult({
|
|
138
|
+
items: [],
|
|
139
|
+
result: false,
|
|
140
|
+
});
|
|
141
|
+
handleFitBounds();
|
|
142
|
+
return;
|
|
143
|
+
}
|
|
144
|
+
const expandedBoundingBox = expandBoundingBox(result.bbox, kmPadding);
|
|
145
|
+
const originalBoundingBox = result.bbox;
|
|
146
|
+
const mapData = getMapboxData();
|
|
147
|
+
const filteredData = mapData.filter((item) => withinBoundingBox(item.coordinates, expandedBoundingBox));
|
|
148
|
+
map.fitBounds(expandedBoundingBox);
|
|
149
|
+
updateSearchIsMoving(true);
|
|
150
|
+
map.once('moveend', () => {
|
|
151
|
+
updateSearchIsMoving(false);
|
|
152
|
+
});
|
|
153
|
+
updateSearchResult({
|
|
154
|
+
items: filteredData,
|
|
155
|
+
result,
|
|
156
|
+
originalBoundingBox,
|
|
157
|
+
expandedBoundingBox,
|
|
158
|
+
});
|
|
159
|
+
}
|
|
160
|
+
function handleSuggestionClick(feature) {
|
|
161
|
+
inputElement.value = feature.place_name;
|
|
162
|
+
clearSuggestionsContainer();
|
|
163
|
+
updateStore(feature);
|
|
164
|
+
}
|
|
165
|
+
function renderSuggestions(suggestions) {
|
|
166
|
+
clearSuggestionsContainer();
|
|
167
|
+
suggestionsElement.append(h("ul", { class: "map-search__suggestions" }, suggestions.features.map((feature) => (h("li", { class: "map-search__suggestion" },
|
|
168
|
+
h("button", { onClick: () => handleSuggestionClick(feature) }, feature.place_name))))));
|
|
169
|
+
}
|
|
170
|
+
};
|
|
171
|
+
export default search;
|
|
172
|
+
//# sourceMappingURL=search.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"search.js","sourceRoot":"","sources":["../../../../../../../src/molecules/map/utilities/mapbox/search/search.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,cAAc,CAAC;AAEjC,OAAO,EACH,0BAA0B,EAC1B,QAAQ,EACR,WAAW,EACX,iBAAiB,EACjB,qBAAqB,EACrB,eAAe,EACf,iBAAiB,GACpB,MAAM,wBAAwB,CAAC;AAChC,OAAO,QAAQ,MAAM,WAAW,CAAC;AAEjC,OAAO,EACH,iBAAiB,EACjB,aAAa,EAEb,QAAQ,EACR,oBAAoB,EACpB,kBAAkB,GACrB,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAC7C,OAAO,6BAA6B,MAAM,gCAAgC,CAAC;AAE3E,MAAM,cAAc,GAAG,EAAE,CAAC;AAE1B,MAAM,MAAM,GAAG,KAAK,EAChB,GAAiB,EACjB,EAAE,IAAI,EAAE,SAAS,GAAG,cAAc,EAAE,kBAAkB,EAAoB,EAC1E,EAAE,qBAAqB,GAAG,CAAC,IAAI,EAAE,IAAI,CAAC,EAAE,QAAQ,GAAG,IAAI,EAAc,EACvE,EAAE;IACA,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;IAC7C,MAAM,MAAM,GAAG,qBAAqB,CAAC,qBAAqB,CAAC,CAAC;IAE5D,IAAI,CAAC,OAAO,EAAE;QACV,IAAI,WAAW,CAAC,OAAO;YAAE,OAAO,CAAC,KAAK,CAAC,kCAAkC,IAAI,EAAE,CAAC,CAAC;QACjF,OAAO;KACV;IAED,MAAM,YAAY,GAAG,OAAO,CAAC,aAAa,CAAC,4BAA4B,CAAqB,CAAC;IAC7F,MAAM,IAAI,GAAG,YAAY,CAAC,OAAO,CAAkB,MAAM,CAAC,CAAC;IAC3D,MAAM,kBAAkB,GAAG,OAAO,CAAC,aAAa,CAC5C,kCAAkC,CACtB,CAAC;IACjB,MAAM,aAAa,GAAG,OAAO,CAAC,aAAa,CAAC,6BAA6B,CAAsB,CAAC;IAEhG,IAAI,QAAyB,CAAC;IAC9B,IAAI,WAA4B,CAAC;IAEjC,IAAI,EAAE,CAAC;IAEP,KAAK,UAAU,IAAI;QAEf,MAAM,EAAE,OAAO,EAAE,cAAc,EAAE,GAAG,MAAM,MAAM,CAAC,4BAA4B,CAAC,CAAC;QAE/E,QAAQ,GAAG,IAAI,cAAc,CAAC;YAC1B,WAAW,EAAE,QAAQ,CAAC,WAAW;YACjC,QAAQ;YACR,SAAS,EAAE,qBAAqB,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,WAAW,EAAE;YACxD,KAAK,EAAE,oCAAoC;YAC3C,aAAa;YACb,QAAQ;YACR,kBAAkB,EAAE,KAAK;YACzB,MAAM,EAAE,KAAK;SAChB,CAAC,CAAC;QAEH,GAAG,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC;QAEzB,UAAU,EAAE,CAAC;QACb,SAAS,EAAE,CAAC;IAChB,CAAC;IAED,SAAS,UAAU;QACf,MAAM,kBAAkB,GAAG,QAAQ,CAAC,SAAS,EAAE,GAAG,CAAC,CAAC;QAEpD,YAAY,CAAC,gBAAgB,CAAC,SAAS,EAAE,kBAAkB,CAAC,CAAC;QAC7D,aAAa,CAAC,gBAAgB,CAAC,OAAO,EAAE,iBAAiB,CAAC,CAAC;QAC3D,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,gBAAgB,CAAC,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,cAAc,EAAE,EAAE;QAE5D,eAAe,CAAC,YAAa,EAAE,kBAAkB,CAAC,CAAC;QAEnD,QAAQ,CAAC,EAAE,CAAC,SAAS,EAAE,CAAC,OAAY,EAAE,EAAE;YACpC,WAAW,GAAG,OAAO,CAAC;YAEtB,iBAAiB,CAAC,WAAW,CAAC,CAAC;QACnC,CAAC,CAAC,CAAC;IACP,CAAC;IAED,SAAS,SAAS;QACd,kBAAkB,CAAC,QAAQ,CAAC,QAAQ,EAAE,CAAC,CAAC;QACxC,QAAQ,CAAC,SAAS,CAAC,kBAAkB,EAAE,CAAC,cAAc,CAAC,CAAC,CAAC;IAC7D,CAAC;IAED,SAAS,kBAAkB,CAAC,EAAE,YAAY,EAAY;QAClD,IAAI,YAAY,EAAE;YACd,QAAQ,CAAC,QAAQ,CAAC,YAAY,CAAC,CAAC,EAAE,CAAC,SAAS,EAAE,SAAS,aAAa,CAAC,OAAY;gBAC7E,WAAW,GAAG,OAAO,CAAC;gBAEtB,qBAAqB,EAAE,CAAC;gBAExB,QAAQ,CAAC,GAAG,CAAC,SAAS,EAAE,aAAa,CAAC,CAAC;YAC3C,CAAC,CAAC,CAAC;SACN;IACL,CAAC;IAED,SAAS,kBAAkB;QACvB,yBAAyB,EAAE,CAAC;IAChC,CAAC;IAED,SAAS,eAAe;QACpB,OAAO,SAAS,CAAC,GAAG,EAAE,MAAM,CAAC,CAAC;IAClC,CAAC;IAED,SAAS,SAAS,CAAC,CAAgB;QAC/B,MAAM,EAAE,KAAK,EAAE,GAAG,YAAa,CAAC;QAEhC,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO,EAAE;YACnB,IAAI,CAAC,KAAK,EAAE;gBACR,QAAQ,EAAE,CAAC;gBACX,OAAO;aACV;iBAAM;gBACH,QAAQ,CAAC,EAAE,CAAC,SAAS,EAAE,SAAS,WAAW;oBACvC,qBAAqB,EAAE,CAAC;oBACxB,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,IAAI,GAAG;oBAErB,QAAQ,CAAC,GAAG,CAAC,SAAS,EAAE,WAAW,CAAC,CAAC;gBACzC,CAAC,CAAC,CAAC;aACN;SACJ;QAED,IAAI,KAAK,CAAC,MAAM,IAAI,CAAC,EAAE;YACnB,QAAQ,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;SAC5B;aAAM;YACH,WAAW,GAAG,SAAS,CAAC;YACxB,eAAe,EAAE,CAAC;YAClB,yBAAyB,EAAE,CAAC;YAC5B,iBAAiB,EAAE,CAAC;SACvB;IACL,CAAC;IAED,SAAS,iBAAiB;QACtB,MAAM,EAAE,KAAK,EAAE,GAAG,YAAa,CAAC;QAEhC,IAAI,CAAC,KAAK,EAAE;YACR,QAAQ,EAAE,CAAC;SACd;aAAM;YACH,qBAAqB,EAAE,CAAC;SAC3B;IACL,CAAC;IAED,SAAS,qBAAqB;QAC1B,MAAM,eAAe,GAAG,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,QAAQ,CAAC,CAAC,CAAC,CAAC;QAEjD,WAAW,CAAC,eAAe,CAAC,CAAC;QAC7B,yBAAyB,EAAE,CAAC;IAChC,CAAC;IAED,SAAS,yBAAyB;QAC9B,kBAAkB,CAAC,SAAS,GAAG,EAAE,CAAC;IACtC,CAAC;IAED,SAAS,QAAQ;QACb,WAAW,GAAG,SAAS,CAAC;QACxB,eAAe,EAAE,CAAC;QAClB,yBAAyB,EAAE,CAAC;QAC5B,iBAAiB,EAAE,CAAC;QACpB,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,IAAI,GAAG;IACzB,CAAC;IAED,SAAS,aAAa,CAAC,KAAa;QAChC,MAAM,gBAAgB,GAAG,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,EAAE,EAAuB,EAAE,EAAE;YACxE,MAAM,MAAM,GAAG,0BAA0B,CAAC,IAAI,CAAC,CAAC;YAEhD,OAAO;gBACH,UAAU,EAAE,KAAK;gBACjB,IAAI;gBACJ,MAAM;gBACN,IAAI;gBACJ,EAAE;aACL,CAAC;QACN,CAAC,CAAC;QAEF,MAAM,iBAAiB,GAAG,kBAAkB;YACxC,CAAC,CAAC,kBAAkB,CAAC,KAAK,CAAC,WAAW,EAAE,CAAC,CAAC,GAAG,CAAC,gBAAgB,CAAC;YAC/D,CAAC,CAAC,EAAE,CAAC;QACT,MAAM,gBAAgB,GAAG,6BAA6B,CAAC,KAAK,CAAC,WAAW,EAAE,CAAC,CAAC,GAAG,CAC3E,gBAAgB,CACnB,CAAC;QAEF,OAAO,CAAC,GAAG,iBAAiB,EAAE,GAAG,gBAAgB,CAAC,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;IACnE,CAAC;IAED,SAAS,WAAW,CAAC,MAAW;QAC5B,IAAI,CAAC,MAAM,EAAE;YACT,kBAAkB,CAAC;gBACf,KAAK,EAAE,EAAE;gBACT,MAAM,EAAE,KAAK;aAChB,CAAC,CAAC;YAEH,eAAe,EAAE,CAAC;YAElB,OAAO;SACV;QAED,MAAM,mBAAmB,GAAG,iBAAiB,CAAC,MAAM,CAAC,IAAmB,EAAE,SAAS,CAAC,CAAC;QACrF,MAAM,mBAAmB,GAAG,MAAM,CAAC,IAAmB,CAAC;QAEvD,MAAM,OAAO,GAAG,aAAa,EAAE,CAAC;QAChC,MAAM,YAAY,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC,IAAI,EAAE,EAAE,CACzC,iBAAiB,CAAC,IAAI,CAAC,WAAW,EAAE,mBAAmB,CAAC,CAC3D,CAAC;QAEF,GAAG,CAAC,SAAS,CAAC,mBAAmB,CAAC,CAAC;QAGnC,oBAAoB,CAAC,IAAI,CAAC,CAAC;QAE3B,GAAG,CAAC,IAAI,CAAC,SAAS,EAAE,GAAG,EAAE;YACrB,oBAAoB,CAAC,KAAK,CAAC,CAAC;QAChC,CAAC,CAAC,CAAC;QAEH,kBAAkB,CAAC;YACf,KAAK,EAAE,YAAY;YACnB,MAAM;YACN,mBAAmB;YACnB,mBAAmB;SACtB,CAAC,CAAC;IACP,CAAC;IAED,SAAS,qBAAqB,CAAC,OAAY;QACvC,YAAY,CAAC,KAAK,GAAG,OAAO,CAAC,UAAU,CAAC;QAExC,yBAAyB,EAAE,CAAC;QAC5B,WAAW,CAAC,OAAO,CAAC,CAAC;IACzB,CAAC;IAED,SAAS,iBAAiB,CAAC,WAAgB;QACvC,yBAAyB,EAAE,CAAC;QAE5B,kBAAkB,CAAC,MAAM,CACrB,UAAI,KAAK,EAAC,yBAAyB,IAC9B,WAAW,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,OAAY,EAAE,EAAE,CAAC,CACxC,UAAI,KAAK,EAAC,wBAAwB;YAC9B,cAAQ,OAAO,EAAE,GAAG,EAAE,CAAC,qBAAqB,CAAC,OAAO,CAAC,IAChD,OAAO,CAAC,UAAU,CACd,CACR,CACR,CAAC,CACD,CACR,CAAC;IACN,CAAC;AACL,CAAC,CAAC;AAEF,eAAe,MAAM,CAAC","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 submitFirstSuggestion();\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 updateStore(firstSuggestion);\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"]}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import { h } from '@atomify/jsx';
|
|
2
|
+
import { calculateCenter } from '@bpd-library/utilities';
|
|
3
|
+
import { Popup } from 'mapbox-gl';
|
|
4
|
+
import { Tooltip } from '../../../tooltip';
|
|
5
|
+
let currentTooltip;
|
|
6
|
+
const addTooltip = (map, coordinates, mapDataItem, openInTab) => {
|
|
7
|
+
removeTooltip();
|
|
8
|
+
const { tooltip, url } = mapDataItem;
|
|
9
|
+
if (!tooltip)
|
|
10
|
+
return;
|
|
11
|
+
const center = calculateCenter(coordinates);
|
|
12
|
+
currentTooltip = new Popup({
|
|
13
|
+
closeButton: false,
|
|
14
|
+
offset: 20,
|
|
15
|
+
})
|
|
16
|
+
.setLngLat(center)
|
|
17
|
+
.setDOMContent(h(Tooltip, Object.assign({}, tooltip, { url: url, openInTab: openInTab })))
|
|
18
|
+
.addTo(map);
|
|
19
|
+
};
|
|
20
|
+
const removeTooltip = () => {
|
|
21
|
+
currentTooltip === null || currentTooltip === void 0 ? void 0 : currentTooltip.remove();
|
|
22
|
+
};
|
|
23
|
+
export { addTooltip, removeTooltip };
|
|
24
|
+
//# sourceMappingURL=tooltip.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"tooltip.js","sourceRoot":"","sources":["../../../../../../src/molecules/map/utilities/mapbox/tooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,cAAc,CAAC;AAEjC,OAAO,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AACzD,OAAO,EAAE,KAAK,EAAE,MAAM,WAAW,CAAC;AAElC,OAAO,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAE3C,IAAI,cAA0C,CAAC;AAE/C,MAAM,UAAU,GAAG,CACf,GAAiB,EACjB,WAAwB,EACxB,WAAwB,EACxB,SAAmB,EACrB,EAAE;IACA,aAAa,EAAE,CAAC;IAEhB,MAAM,EAAE,OAAO,EAAE,GAAG,EAAE,GAAG,WAAW,CAAC;IAErC,IAAI,CAAC,OAAO;QAAE,OAAO;IAErB,MAAM,MAAM,GAAG,eAAe,CAAC,WAAW,CAAC,CAAC;IAE5C,cAAc,GAAG,IAAI,KAAK,CAAC;QACvB,WAAW,EAAE,KAAK;QAClB,MAAM,EAAE,EAAE;KACb,CAAC;SACG,SAAS,CAAC,MAAM,CAAC;SACjB,aAAa,CAAC,EAAC,OAAO,oBAAK,OAAO,IAAE,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,SAAS,IAAI,CAAC;SACvE,KAAK,CAAC,GAAG,CAAC,CAAC;AACpB,CAAC,CAAC;AAEF,MAAM,aAAa,GAAG,GAAG,EAAE;IACvB,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,MAAM,GAAG;AAC7B,CAAC,CAAC;AAEF,OAAO,EAAE,UAAU,EAAE,aAAa,EAAE,CAAC","sourcesContent":["import { h } from '@atomify/jsx';\nimport { Coordinates, MapDataItem } from '@bpd-library/types';\nimport { calculateCenter } from '@bpd-library/utilities';\nimport { Popup } from 'mapbox-gl';\n\nimport { Tooltip } from '../../../tooltip';\n\nlet currentTooltip: mapboxgl.Popup | undefined;\n\nconst addTooltip = (\n map: mapboxgl.Map,\n coordinates: Coordinates,\n mapDataItem: MapDataItem,\n openInTab?: boolean,\n) => {\n removeTooltip();\n\n const { tooltip, url } = mapDataItem;\n\n if (!tooltip) return;\n\n const center = calculateCenter(coordinates);\n\n currentTooltip = new Popup({\n closeButton: false,\n offset: 20,\n })\n .setLngLat(center)\n .setDOMContent(<Tooltip {...tooltip} url={url} openInTab={openInTab} />)\n .addTo(map);\n};\n\nconst removeTooltip = () => {\n currentTooltip?.remove();\n};\n\nexport { addTooltip, removeTooltip };\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/molecules/tooltip/index.ts"],"names":[],"mappings":"AAAA,cAAc,WAAW,CAAC","sourcesContent":["export * from './tooltip';\n"]}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { h } from '@atomify/jsx';
|
|
2
|
+
import { ButtonA } from '../../atoms/button';
|
|
3
|
+
import { Image } from '../../atoms/image';
|
|
4
|
+
export const Tooltip = ({ title, image, tags, buttonLabel, url, openInTab }) => (h("div", { class: "c-tooltip" },
|
|
5
|
+
image && (h("div", { class: "tooltip__image" },
|
|
6
|
+
h(Image, { image: image, preload: { width: 180, height: 100 }, alt: title }))),
|
|
7
|
+
h("div", { class: "tooltip__wrapper" },
|
|
8
|
+
h("h3", { class: "tooltip__title" }, title), tags === null || tags === void 0 ? void 0 :
|
|
9
|
+
tags.map((tag) => (h("span", { class: "tooltip__meta" }, tag))),
|
|
10
|
+
url && buttonLabel && (h(ButtonA, { classes: "tooltip__button", url: url, target: openInTab ? '_blank' : '_self', label: buttonLabel, size: "small" })))));
|
|
11
|
+
//# sourceMappingURL=tooltip.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"tooltip.js","sourceRoot":"","sources":["../../../../src/molecules/tooltip/tooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,cAAc,CAAC;AAGjC,OAAO,EAAE,OAAO,EAAE,MAAM,oBAAoB,CAAC;AAC7C,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAO1C,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,WAAW,EAAE,GAAG,EAAE,SAAS,EAAW,EAAE,EAAE,CAAC,CACrF,WAAK,KAAK,EAAC,WAAW;IACjB,KAAK,IAAI,CACN,WAAK,KAAK,EAAC,gBAAgB;QACvB,EAAC,KAAK,IAAC,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE,KAAK,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,EAAE,GAAG,EAAE,KAAK,GAAI,CACvE,CACT;IACD,WAAK,KAAK,EAAC,kBAAkB;QACzB,UAAI,KAAK,EAAC,gBAAgB,IAAE,KAAK,CAAM,EACtC,IAAI,aAAJ,IAAI;QAAJ,IAAI,CAAE,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,CAChB,YAAM,KAAK,EAAC,eAAe,IAAE,GAAG,CAAQ,CAC3C;QAEA,GAAG,IAAI,WAAW,IAAI,CACnB,EAAC,OAAO,IACJ,OAAO,EAAC,iBAAiB,EACzB,GAAG,EAAE,GAAG,EACR,MAAM,EAAE,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,EACtC,KAAK,EAAE,WAAW,EAClB,IAAI,EAAC,OAAO,GACd,CACL,CACC,CACJ,CACT,CAAC","sourcesContent":["import { h } from '@atomify/jsx';\nimport { MapTooltip } from '@bpd-library/types';\n\nimport { ButtonA } from '../../atoms/button';\nimport { Image } from '../../atoms/image';\n\ninterface Tooltip extends MapTooltip {\n url?: string | null;\n openInTab?: boolean;\n}\n\nexport const Tooltip = ({ title, image, tags, buttonLabel, url, openInTab }: Tooltip) => (\n <div class=\"c-tooltip\">\n {image && (\n <div class=\"tooltip__image\">\n <Image image={image} preload={{ width: 180, height: 100 }} alt={title} />\n </div>\n )}\n <div class=\"tooltip__wrapper\">\n <h3 class=\"tooltip__title\">{title}</h3>\n {tags?.map((tag) => (\n <span class=\"tooltip__meta\">{tag}</span>\n ))}\n\n {url && buttonLabel && (\n <ButtonA\n classes=\"tooltip__button\"\n url={url}\n target={openInTab ? '_blank' : '_self'}\n label={buttonLabel}\n size=\"small\"\n />\n )}\n </div>\n </div>\n);\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/molecules/map/index.ts"],"names":[],"mappings":"AAAA,cAAc,wBAAwB,CAAC;AACvC,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC","sourcesContent":["export * from './utilities/fit-bounds';\nexport * from './store';\nexport * from './hooks';\n"]}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/molecules/map/index.ts"],"names":[],"mappings":"AAAA,cAAc,wBAAwB,CAAC;AACvC,OAAO,EAAE,mBAAmB,EAAE,MAAM,kCAAkC,CAAC;AACvE,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC","sourcesContent":["export * from './utilities/fit-bounds';\nexport { setDefaultKmPadding } from './utilities/mapbox/search/search';\nexport * from './store';\nexport * from './hooks';\n"]}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/// <reference types="mapbox-gl" />
|
|
2
|
-
import { BoundingBox, MapDataItem } from '@bpd-library/types';
|
|
2
|
+
import { BoundingBox, MapDataItem, MapDirectionsSetting, MapIsochroneSetting } from '@bpd-library/types';
|
|
3
3
|
export declare type SearchResult = {
|
|
4
4
|
items: MapDataItem[];
|
|
5
5
|
result: any;
|
|
@@ -34,6 +34,8 @@ export interface MapState {
|
|
|
34
34
|
searchIsMoving: boolean;
|
|
35
35
|
manualSearch?: string;
|
|
36
36
|
layerRasterSettings?: MapLayerRasterSettings;
|
|
37
|
+
isochroneSetting?: MapIsochroneSetting;
|
|
38
|
+
directionsSetting?: MapDirectionsSetting;
|
|
37
39
|
}
|
|
38
40
|
export declare const mapStore: import("@atomify/kit/dist/utilities/store/store.types").Store<MapState>;
|
|
39
41
|
export declare const updateMapData: (data: MapDataItem[]) => void;
|
|
@@ -50,6 +52,10 @@ export declare const setMapInstance: (mapInstance: mapboxgl.Map) => void;
|
|
|
50
52
|
export declare const manualSearch: (query: string) => void;
|
|
51
53
|
export declare const updateSearchIsMoving: (isMoving: boolean) => void;
|
|
52
54
|
export declare const setLayerRaster: (layerRasterSettings: MapLayerRasterSettings) => void;
|
|
55
|
+
export declare const setIsochrone: (isochroneSetting: MapIsochroneSetting) => void;
|
|
56
|
+
export declare const clearIsochrone: () => void;
|
|
57
|
+
export declare const setDirections: (directionsSetting: MapDirectionsSetting) => void;
|
|
58
|
+
export declare const clearDirections: () => void;
|
|
53
59
|
export declare const getMapboxData: () => MapDataItem[];
|
|
54
60
|
export declare const getHover: () => {
|
|
55
61
|
current?: MapDataItem | undefined;
|
|
@@ -19,6 +19,10 @@ const CLEAR_FILTER = 'clearFilter';
|
|
|
19
19
|
const SET_MAP_INSTANCE = 'setMapInstance';
|
|
20
20
|
const SET_LAYER_RASTER = 'SET_LAYER_RASTER';
|
|
21
21
|
const MANUAL_SEARCH = 'manualSearch';
|
|
22
|
+
const SET_ISOCHRONE = 'setIsochrone';
|
|
23
|
+
const CLEAR_ISOCHRONE = 'clearIsochrone';
|
|
24
|
+
const SET_DIRECTIONS = 'setDirections';
|
|
25
|
+
const CLEAR_DIRECTIONS = 'clearDirections';
|
|
22
26
|
const actions = {
|
|
23
27
|
[UPDATE_MAP_DATA]: (state, data) => {
|
|
24
28
|
state.data = data;
|
|
@@ -93,6 +97,22 @@ const actions = {
|
|
|
93
97
|
state.layerRasterSettings = layerRasterSettings;
|
|
94
98
|
return state;
|
|
95
99
|
},
|
|
100
|
+
[SET_ISOCHRONE]: (state, isochroneSetting) => {
|
|
101
|
+
state.isochroneSetting = isochroneSetting;
|
|
102
|
+
return state;
|
|
103
|
+
},
|
|
104
|
+
[CLEAR_ISOCHRONE]: (state) => {
|
|
105
|
+
state.isochroneSetting = undefined;
|
|
106
|
+
return state;
|
|
107
|
+
},
|
|
108
|
+
[SET_DIRECTIONS]: (state, directionsSetting) => {
|
|
109
|
+
state.directionsSetting = directionsSetting;
|
|
110
|
+
return state;
|
|
111
|
+
},
|
|
112
|
+
[CLEAR_DIRECTIONS]: (state) => {
|
|
113
|
+
state.directionsSetting = undefined;
|
|
114
|
+
return state;
|
|
115
|
+
},
|
|
96
116
|
};
|
|
97
117
|
export const mapStore = createStore({
|
|
98
118
|
initialState,
|
|
@@ -140,6 +160,18 @@ export const updateSearchIsMoving = (isMoving) => {
|
|
|
140
160
|
export const setLayerRaster = (layerRasterSettings) => {
|
|
141
161
|
mapStore.dispatch(SET_LAYER_RASTER, layerRasterSettings);
|
|
142
162
|
};
|
|
163
|
+
export const setIsochrone = (isochroneSetting) => {
|
|
164
|
+
mapStore.dispatch(SET_ISOCHRONE, isochroneSetting);
|
|
165
|
+
};
|
|
166
|
+
export const clearIsochrone = () => {
|
|
167
|
+
mapStore.dispatch(CLEAR_ISOCHRONE);
|
|
168
|
+
};
|
|
169
|
+
export const setDirections = (directionsSetting) => {
|
|
170
|
+
mapStore.dispatch(SET_DIRECTIONS, directionsSetting);
|
|
171
|
+
};
|
|
172
|
+
export const clearDirections = () => {
|
|
173
|
+
mapStore.dispatch(CLEAR_DIRECTIONS);
|
|
174
|
+
};
|
|
143
175
|
export const getMapboxData = () => mapStore.getState().data;
|
|
144
176
|
export const getHover = () => mapStore.getState().hover;
|
|
145
177
|
export const getMapInstance = () => mapStore.getState().mapInstance;
|
|
@@ -1 +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"]}
|
|
1
|
+
{"version":3,"file":"store.js","sourceRoot":"","sources":["../../../../../src/molecules/map/store/map/store.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAiD3C,MAAM,YAAY,GAAa;IAC3B,IAAI,EAAE,EAAE;IACR,KAAK,EAAE,EAAE;IACT,KAAK,EAAE,EAAE;IACT,cAAc,EAAE,KAAK;CACxB,CAAC;AAEF,MAAM,eAAe,GAAG,eAAe,CAAC;AACxC,MAAM,YAAY,GAAG,aAAa,CAAC;AACnC,MAAM,WAAW,GAAG,YAAY,CAAC;AACjC,MAAM,YAAY,GAAG,aAAa,CAAC;AACnC,MAAM,SAAS,GAAG,UAAU,CAAC;AAC7B,MAAM,WAAW,GAAG,YAAY,CAAC;AACjC,MAAM,oBAAoB,GAAG,oBAAoB,CAAC;AAClD,MAAM,mBAAmB,GAAG,mBAAmB,CAAC;AAChD,MAAM,uBAAuB,GAAG,sBAAsB,CAAC;AACvD,MAAM,UAAU,GAAG,WAAW,CAAC;AAC/B,MAAM,YAAY,GAAG,aAAa,CAAC;AACnC,MAAM,gBAAgB,GAAG,gBAAgB,CAAC;AAC1C,MAAM,gBAAgB,GAAG,kBAAkB,CAAC;AAC5C,MAAM,aAAa,GAAG,cAAc,CAAC;AACrC,MAAM,aAAa,GAAG,cAAc,CAAC;AACrC,MAAM,eAAe,GAAG,gBAAgB,CAAC;AACzC,MAAM,cAAc,GAAG,eAAe,CAAC;AACvC,MAAM,gBAAgB,GAAG,iBAAiB,CAAC;AAE3C,MAAM,OAAO,GAAG;IACZ,CAAC,eAAe,CAAC,EAAE,CAAC,KAAe,EAAE,IAAmB,EAAE,EAAE;QACxD,KAAK,CAAC,IAAI,GAAG,IAAI,CAAC;QAClB,OAAO,KAAK,CAAC;IACjB,CAAC;IACD,CAAC,YAAY,CAAC,EAAE,CAAC,KAAe,EAAE,KAAkB,EAAE,EAAE;QACpD,KAAK,CAAC,KAAK,GAAG;YACV,OAAO,EAAE,KAAK;YACd,QAAQ,EAAE,KAAK,CAAC,KAAK,CAAC,OAAO;SAChC,CAAC;QAEF,OAAO,KAAK,CAAC;IACjB,CAAC;IACD,CAAC,WAAW,CAAC,EAAE,CAAC,KAAe,EAAE,EAAE;QAC/B,KAAK,CAAC,KAAK,GAAG;YACV,OAAO,EAAE,SAAS;YAClB,QAAQ,EAAE,KAAK,CAAC,KAAK,CAAC,OAAO;SAChC,CAAC;QAEF,OAAO,KAAK,CAAC;IACjB,CAAC;IACD,CAAC,YAAY,CAAC,EAAE,CAAC,KAAe,EAAE,KAAkB,EAAE,EAAE;QACpD,KAAK,CAAC,KAAK,qBAAQ,KAAK,CAAE,CAAC;QAC3B,OAAO,KAAK,CAAC;IACjB,CAAC;IACD,CAAC,SAAS,CAAC,EAAE,CACT,KAAe,EACf,EAAE,GAAG,EAAE,OAAO,EAA+C,EAC/D,EAAE;;QACA,MAAM,SAAS,GAAG,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;QAEtE,IAAI,SAAS,CAAC,MAAM,EAAE;YAClB,KAAK,CAAC,KAAK,GAAG;gBACV,OAAO,EAAE,SAAS;gBAClB,QAAQ,QAAE,KAAK,CAAC,KAAK,0CAAE,OAAO;gBAC9B,OAAO;aACV,CAAC;SACL;QAED,OAAO,KAAK,CAAC;IACjB,CAAC;IACD,CAAC,WAAW,CAAC,EAAE,CAAC,KAAe,EAAE,EAAE;QAC/B,KAAK,CAAC,KAAK,GAAG;YACV,OAAO,EAAE,SAAS;YAClB,QAAQ,EAAE,KAAK,CAAC,KAAK,CAAC,OAAO;SAChC,CAAC;QAEF,OAAO,KAAK,CAAC;IACjB,CAAC;IACD,CAAC,oBAAoB,CAAC,EAAE,CAAC,KAAe,EAAE,YAA0B,EAAE,EAAE;QACpE,KAAK,CAAC,YAAY,GAAG,YAAY,CAAC;QAClC,OAAO,KAAK,CAAC;IACjB,CAAC;IACD,CAAC,mBAAmB,CAAC,EAAE,CAAC,KAAe,EAAE,EAAE;QACvC,KAAK,CAAC,YAAY,GAAG,SAAS,CAAC;QAC/B,OAAO,KAAK,CAAC;IACjB,CAAC;IACD,CAAC,UAAU,CAAC,EAAE,CAAC,KAAe,EAAE,IAAmB,EAAE,EAAE;QACnD,KAAK,CAAC,MAAM,GAAG,IAAI,CAAC;QACpB,OAAO,KAAK,CAAC;IACjB,CAAC;IACD,CAAC,YAAY,CAAC,EAAE,CAAC,KAAe,EAAE,EAAE;QAChC,KAAK,CAAC,MAAM,GAAG,SAAS,CAAC;QACzB,OAAO,KAAK,CAAC;IACjB,CAAC;IACD,CAAC,gBAAgB,CAAC,EAAE,CAAC,KAAe,EAAE,WAAyB,EAAE,EAAE;QAC/D,KAAK,CAAC,WAAW,GAAG,WAAW,CAAC;QAChC,OAAO,KAAK,CAAC;IACjB,CAAC;IACD,CAAC,aAAa,CAAC,EAAE,CAAC,KAAe,EAAE,KAAa,EAAE,EAAE;QAChD,KAAK,CAAC,YAAY,GAAG,KAAK,CAAC;QAC3B,OAAO,KAAK,CAAC;IACjB,CAAC;IACD,CAAC,uBAAuB,CAAC,EAAE,CAAC,KAAe,EAAE,cAAuB,EAAE,EAAE;QACpE,KAAK,CAAC,cAAc,GAAG,cAAc,CAAC;QACtC,OAAO,KAAK,CAAC;IACjB,CAAC;IACD,CAAC,gBAAgB,CAAC,EAAE,CAAC,KAAe,EAAE,mBAA2C,EAAE,EAAE;QACjF,KAAK,CAAC,mBAAmB,GAAG,mBAAmB,CAAC;QAChD,OAAO,KAAK,CAAC;IACjB,CAAC;IACD,CAAC,aAAa,CAAC,EAAE,CAAC,KAAe,EAAE,gBAAqC,EAAE,EAAE;QACxE,KAAK,CAAC,gBAAgB,GAAG,gBAAgB,CAAC;QAC1C,OAAO,KAAK,CAAC;IACjB,CAAC;IACD,CAAC,eAAe,CAAC,EAAE,CAAC,KAAe,EAAE,EAAE;QACnC,KAAK,CAAC,gBAAgB,GAAG,SAAS,CAAC;QACnC,OAAO,KAAK,CAAC;IACjB,CAAC;IACD,CAAC,cAAc,CAAC,EAAE,CAAC,KAAe,EAAE,iBAAuC,EAAE,EAAE;QAC3E,KAAK,CAAC,iBAAiB,GAAG,iBAAiB,CAAC;QAC5C,OAAO,KAAK,CAAC;IACjB,CAAC;IACD,CAAC,gBAAgB,CAAC,EAAE,CAAC,KAAe,EAAE,EAAE;QACpC,KAAK,CAAC,iBAAiB,GAAG,SAAS,CAAC;QACpC,OAAO,KAAK,CAAC;IACjB,CAAC;CACJ,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG,WAAW,CAAW;IAC1C,YAAY;IACZ,OAAO,EAAE,OAAc;CAC1B,CAAC,CAAC;AAKH,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,IAAmB,EAAE,EAAE;IACjD,QAAQ,CAAC,QAAQ,CAAC,eAAe,EAAE,IAAI,CAAC,CAAC;AAC7C,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAG,GAAG,EAAE;IAC3B,QAAQ,CAAC,QAAQ,CAAC,WAAW,CAAC,CAAC;AACnC,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,KAAkB,EAAE,EAAE;IAC9C,QAAQ,CAAC,QAAQ,CAAC,YAAY,EAAE,KAAK,CAAC,CAAC;AAC3C,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,KAAkB,EAAE,EAAE;IAC9C,QAAQ,CAAC,QAAQ,CAAC,YAAY,EAAE,KAAK,CAAC,CAAC;AAC3C,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,GAAa,EAAE,UAA2B,EAAE,EAAE,EAAE;IACrE,QAAQ,CAAC,QAAQ,CAAC,SAAS,EAAE,EAAE,GAAG,EAAE,OAAO,EAAE,CAAC,CAAC;AACnD,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAG,GAAG,EAAE;IAC3B,QAAQ,CAAC,QAAQ,CAAC,WAAW,CAAC,CAAC;AACnC,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAAC,YAA0B,EAAE,EAAE;IAC7D,QAAQ,CAAC,QAAQ,CAAC,oBAAoB,EAAE,YAAY,CAAC,CAAC;AAC1D,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAG,GAAG,EAAE;IAClC,QAAQ,CAAC,QAAQ,CAAC,mBAAmB,CAAC,CAAC;AAC3C,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,IAAmB,EAAE,EAAE;IAC7C,QAAQ,CAAC,QAAQ,CAAC,UAAU,EAAE,IAAI,CAAC,CAAC;AACxC,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,WAAW,GAAG,GAAG,EAAE;IAC5B,QAAQ,CAAC,QAAQ,CAAC,YAAY,CAAC,CAAC;AACpC,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,WAAyB,EAAE,EAAE;IACxD,QAAQ,CAAC,QAAQ,CAAC,gBAAgB,EAAE,WAAW,CAAC,CAAC;AACrD,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,KAAa,EAAE,EAAE;IAC1C,QAAQ,CAAC,QAAQ,CAAC,aAAa,EAAE,KAAK,CAAC,CAAC;AAC5C,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAAC,QAAiB,EAAE,EAAE;IACtD,QAAQ,CAAC,QAAQ,CAAC,uBAAuB,EAAE,QAAQ,CAAC,CAAC;AACzD,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,mBAA2C,EAAE,EAAE;IAC1E,QAAQ,CAAC,QAAQ,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,CAAC;AAC7D,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,gBAAqC,EAAE,EAAE;IAClE,QAAQ,CAAC,QAAQ,CAAC,aAAa,EAAE,gBAAgB,CAAC,CAAC;AACvD,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,EAAE;IAC/B,QAAQ,CAAC,QAAQ,CAAC,eAAe,CAAC,CAAC;AACvC,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,iBAAuC,EAAE,EAAE;IACrE,QAAQ,CAAC,QAAQ,CAAC,cAAc,EAAE,iBAAiB,CAAC,CAAC;AACzD,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,eAAe,GAAG,GAAG,EAAE;IAChC,QAAQ,CAAC,QAAQ,CAAC,gBAAgB,CAAC,CAAC;AACxC,CAAC,CAAC;AAKF,MAAM,CAAC,MAAM,aAAa,GAAG,GAAG,EAAE,CAAC,QAAQ,CAAC,QAAQ,EAAE,CAAC,IAAI,CAAC;AAC5D,MAAM,CAAC,MAAM,QAAQ,GAAG,GAAG,EAAE,CAAC,QAAQ,CAAC,QAAQ,EAAE,CAAC,KAAK,CAAC;AACxD,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,EAAE,CAAC,QAAQ,CAAC,QAAQ,EAAE,CAAC,WAAW,CAAC;AACpE,MAAM,CAAC,MAAM,iBAAiB,GAAG,GAAG,EAAE,CAAC,QAAQ,CAAC,QAAQ,EAAE,CAAC,cAAc,CAAC","sourcesContent":["import { createStore } from '@atomify/kit';\nimport {\n BoundingBox,\n MapDataItem,\n MapDirectionsSetting,\n MapIsochroneSetting,\n} 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 directionsSetting?: MapDirectionsSetting;\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';\nconst SET_DIRECTIONS = 'setDirections';\nconst CLEAR_DIRECTIONS = 'clearDirections';\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 [SET_DIRECTIONS]: (state: MapState, directionsSetting: MapDirectionsSetting) => {\n state.directionsSetting = directionsSetting;\n return state;\n },\n [CLEAR_DIRECTIONS]: (state: MapState) => {\n state.directionsSetting = 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\nexport const setDirections = (directionsSetting: MapDirectionsSetting) => {\n mapStore.dispatch(SET_DIRECTIONS, directionsSetting);\n};\n\nexport const clearDirections = () => {\n mapStore.dispatch(CLEAR_DIRECTIONS);\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"]}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { MapOptions, MapSearchOptions } from '@bpd-library/types';
|
|
2
2
|
import mapboxgl from 'mapbox-gl';
|
|
3
|
+
export declare function setDefaultKmPadding(kmPadding: number): number;
|
|
3
4
|
declare const search: (map: mapboxgl.Map, { hook, onSearchSuggestion, noZoomAfterSearch, types }: MapSearchOptions, { searchCountryIsoCodes, language }: MapOptions) => Promise<void>;
|
|
4
5
|
export default search;
|
|
@@ -5,7 +5,10 @@ import { clearSearchResult, getMapboxData, mapStore, updateSearchIsMoving, updat
|
|
|
5
5
|
import { fitBounds } from '../../fit-bounds';
|
|
6
6
|
import getCityAlternativeSuggestions from './alternative-city-suggestions';
|
|
7
7
|
const DEFAULT_TYPES = 'region,district,place,neighborhood';
|
|
8
|
-
|
|
8
|
+
let defaultKmPadding = 10;
|
|
9
|
+
export function setDefaultKmPadding(kmPadding) {
|
|
10
|
+
return (defaultKmPadding = kmPadding);
|
|
11
|
+
}
|
|
9
12
|
const search = async (map, { hook, onSearchSuggestion, noZoomAfterSearch, types = DEFAULT_TYPES }, { searchCountryIsoCodes = ['nl', 'de'], language = 'nl' }) => {
|
|
10
13
|
const element = document.querySelector(hook);
|
|
11
14
|
const bounds = getCountryBoundingBox(searchCountryIsoCodes);
|
|
@@ -158,9 +161,9 @@ const search = async (map, { hook, onSearchSuggestion, noZoomAfterSearch, types
|
|
|
158
161
|
return [...customSuggestions, ...cityAlternatives].slice(0, 4);
|
|
159
162
|
}
|
|
160
163
|
function updateStore(result) {
|
|
161
|
-
const kmPadding = inputSelectDistanceElement
|
|
164
|
+
const kmPadding = !!Number(inputSelectDistanceElement === null || inputSelectDistanceElement === void 0 ? void 0 : inputSelectDistanceElement.value)
|
|
162
165
|
? Number(inputSelectDistanceElement.value)
|
|
163
|
-
:
|
|
166
|
+
: defaultKmPadding;
|
|
164
167
|
if (!result) {
|
|
165
168
|
updateSearchResult({
|
|
166
169
|
items: [],
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"search.js","sourceRoot":"","sources":["../../../../../../src/molecules/map/utilities/mapbox/search/search.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,cAAc,CAAC;AAEjC,OAAO,EACH,0BAA0B,EAC1B,QAAQ,EACR,kBAAkB,EAClB,iBAAiB,EACjB,qBAAqB,EACrB,eAAe,EACf,iBAAiB,GACpB,MAAM,wBAAwB,CAAC;AAChC,OAAO,QAAQ,MAAM,WAAW,CAAC;AAEjC,OAAO,EACH,iBAAiB,EACjB,aAAa,EAEb,QAAQ,EAER,oBAAoB,EACpB,kBAAkB,GACrB,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAC7C,OAAO,6BAA6B,MAAM,gCAAgC,CAAC;AAE3E,MAAM,aAAa,GAAG,oCAAoC,CAAC;AAC3D,MAAM,kBAAkB,GAAG,EAAE,CAAC;AAC9B,MAAM,MAAM,GAAG,KAAK,EAChB,GAAiB,EACjB,EAAE,IAAI,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,KAAK,GAAG,aAAa,EAAoB,EACxF,EAAE,qBAAqB,GAAG,CAAC,IAAI,EAAE,IAAI,CAAC,EAAE,QAAQ,GAAG,IAAI,EAAc,EACvE,EAAE;IACA,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;IAC7C,MAAM,MAAM,GAAG,qBAAqB,CAAC,qBAAqB,CAAC,CAAC;IAE5D,IAAI,CAAC,OAAO,EAAE;QACV,IAAI,kBAAkB,CAAC,OAAO;YAAE,OAAO,CAAC,KAAK,CAAC,kCAAkC,IAAI,EAAE,CAAC,CAAC;QACxF,OAAO;KACV;IAED,MAAM,YAAY,GAAG,OAAO,CAAC,aAAa,CAAC,4BAA4B,CAAqB,CAAC;IAC7F,MAAM,0BAA0B,GAAG,OAAO,CAAC,aAAa,CACpD,4CAA4C,CAC1B,CAAC;IAEvB,MAAM,IAAI,GAAG,YAAY,CAAC,OAAO,CAAkB,MAAM,CAAC,CAAC;IAC3D,MAAM,kBAAkB,GAAG,OAAO,CAAC,aAAa,CAC5C,kCAAkC,CACtB,CAAC;IAEjB,IAAI,QAAyB,CAAC;IAC9B,IAAI,WAA4B,CAAC;IAEjC,IAAI,EAAE,CAAC;IAEP,KAAK,UAAU,IAAI;QAEf,MAAM,EAAE,OAAO,EAAE,cAAc,EAAE,GAAG,MAAM,MAAM,CAAC,4BAA4B,CAAC,CAAC;QAE/E,QAAQ,GAAG,IAAI,cAAc,CAAC;YAC1B,WAAW,EAAE,QAAQ,CAAC,WAAW;YACjC,QAAQ;YACR,SAAS,EAAE,qBAAqB,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,WAAW,EAAE;YACxD,KAAK;YACL,aAAa;YACb,QAAQ;YACR,kBAAkB,EAAE,KAAK;YACzB,MAAM,EAAE,KAAK;SAChB,CAAC,CAAC;QAEH,GAAG,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC;QAEzB,UAAU,EAAE,CAAC;QACb,SAAS,EAAE,CAAC;IAChB,CAAC;IAED,SAAS,UAAU;QACf,MAAM,kBAAkB,GAAG,QAAQ,CAAC,SAAS,EAAE,GAAG,CAAC,CAAC;QACpD,YAAY,CAAC,gBAAgB,CAAC,SAAS,EAAE,kBAAkB,CAAC,CAAC;QAC7D,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,gBAAgB,CAAC,QAAQ,EAAE,iBAAiB,EAAE;QACpD,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,gBAAgB,CAAC,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,cAAc,EAAE,EAAE;QAE5D,eAAe,CAAC,YAAa,EAAE,kBAAkB,CAAC,CAAC;QAEnD,QAAQ,CAAC,EAAE,CAAC,SAAS,EAAE,CAAC,OAAY,EAAE,EAAE;YACpC,WAAW,GAAG,OAAO,CAAC;YAEtB,iBAAiB,CAAC,WAAW,CAAC,CAAC;QACnC,CAAC,CAAC,CAAC;IACP,CAAC;IAED,SAAS,SAAS;QACd,kBAAkB,CAAC,QAAQ,CAAC,QAAQ,EAAE,CAAC,CAAC;QACxC,QAAQ,CAAC,SAAS,CAAC,kBAAkB,EAAE,CAAC,cAAc,CAAC,CAAC,CAAC;IAC7D,CAAC;IAED,SAAS,kBAAkB,CAAC,EAAE,YAAY,EAAY;QAClD,IAAI,YAAY,EAAE;YAGd,IAAI,KAAa,CAAC;YAElB,IAAI,KAAK,CAAC,OAAO,CAAC,YAAY,CAAC,EAAE;gBAC7B,QAAQ,CAAC,OAAO,CAAC,cAAc,GAAG,IAAI,CAAC;gBACvC,KAAK,GAAG,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;aACnC;iBAAM;gBACH,QAAQ,CAAC,OAAO,CAAC,cAAc,GAAG,KAAK,CAAC;gBACxC,KAAK,GAAG,YAAY,CAAC;aACxB;YAED,QAAQ,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,SAAS,EAAE,SAAS,aAAa,CAAC,OAAY;;gBACtE,WAAW,GAAG,OAAO,CAAC;gBAEtB,IAAI,eAAoB,CAAC;gBAGzB,IAAI,OAAO,YAAY,KAAK,QAAQ,EAAE;oBAClC,eAAe,SAAG,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,QAAQ,0CAAE,IAAI,CACrC,CAAC,EAAE,IAAI,EAAqB,EAAE,EAAE,CAC5B,CAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,WAAW,QAAO,YAAY,CAAC,WAAW,EAAE,CACzD,CAAC;iBACL;gBAED,IAAI,eAAe,EAAE;oBACjB,gBAAgB,CAAC,eAAe,CAAC,CAAC;iBACrC;qBAAM;oBACH,qBAAqB,EAAE,CAAC;iBAC3B;gBAED,QAAQ,CAAC,GAAG,CAAC,SAAS,EAAE,aAAa,CAAC,CAAC;YAC3C,CAAC,CAAC,CAAC;SACN;IACL,CAAC;IAED,SAAS,kBAAkB;QACvB,yBAAyB,EAAE,CAAC;IAChC,CAAC;IAED,SAAS,eAAe;QACpB,IAAI,iBAAiB;YAAE,OAAO;QAE9B,SAAS,CAAC,GAAG,EAAE,MAAM,CAAC,CAAC;IAC3B,CAAC;IAED,SAAS,SAAS,CAAC,CAAgB;QAC/B,MAAM,EAAE,KAAK,EAAE,GAAG,YAAa,CAAC;QAEhC,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO,EAAE;YACnB,IAAI,CAAC,KAAK,EAAE;gBACR,QAAQ,EAAE,CAAC;gBACX,OAAO;aACV;iBAAM;gBACH,QAAQ,CAAC,EAAE,CAAC,SAAS,EAAE,SAAS,WAAW;oBACvC,qBAAqB,EAAE,CAAC;oBACxB,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,IAAI,GAAG;oBAErB,QAAQ,CAAC,GAAG,CAAC,SAAS,EAAE,WAAW,CAAC,CAAC;gBACzC,CAAC,CAAC,CAAC;aACN;SACJ;QAED,IAAI,KAAK,CAAC,MAAM,IAAI,CAAC,EAAE;YACnB,QAAQ,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;SAC5B;aAAM;YACH,WAAW,GAAG,SAAS,CAAC;YACxB,eAAe,EAAE,CAAC;YAClB,yBAAyB,EAAE,CAAC;YAC5B,iBAAiB,EAAE,CAAC;SACvB;IACL,CAAC;IAED,SAAS,iBAAiB;QACtB,MAAM,EAAE,KAAK,EAAE,GAAG,YAAa,CAAC;QAEhC,IAAI,CAAC,KAAK,EAAE;YACR,QAAQ,EAAE,CAAC;SACd;aAAM;YACH,qBAAqB,EAAE,CAAC;SAC3B;IACL,CAAC;IAED,SAAS,qBAAqB;QAC1B,MAAM,eAAe,GAAG,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,QAAQ,CAAC,CAAC,CAAC,CAAC;QAEjD,gBAAgB,CAAC,eAAe,CAAC,CAAC;IACtC,CAAC;IAED,SAAS,gBAAgB,CAAC,OAAY;QAClC,WAAW,CAAC,OAAO,CAAC,CAAC;QACrB,yBAAyB,EAAE,CAAC;IAChC,CAAC;IAED,SAAS,yBAAyB;QAC9B,kBAAkB,CAAC,SAAS,GAAG,EAAE,CAAC;IACtC,CAAC;IAED,SAAS,QAAQ;QACb,WAAW,GAAG,SAAS,CAAC;QACxB,eAAe,EAAE,CAAC;QAClB,yBAAyB,EAAE,CAAC;QAC5B,iBAAiB,EAAE,CAAC;QACpB,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,IAAI,GAAG;IACzB,CAAC;IAED,SAAS,aAAa,CAAC,KAAa;QAChC,MAAM,gBAAgB,GAAG,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,EAAE,EAAuB,EAAE,EAAE;YACxE,MAAM,MAAM,GAAG,0BAA0B,CAAC,IAAI,CAAC,CAAC;YAEhD,OAAO;gBACH,UAAU,EAAE,KAAK;gBACjB,IAAI;gBACJ,MAAM;gBACN,IAAI;gBACJ,EAAE;aACL,CAAC;QACN,CAAC,CAAC;QAEF,MAAM,iBAAiB,GAAG,kBAAkB;YACxC,CAAC,CAAC,kBAAkB,CAAC,KAAK,CAAC,WAAW,EAAE,CAAC,CAAC,GAAG,CAAC,gBAAgB,CAAC;YAC/D,CAAC,CAAC,EAAE,CAAC;QACT,MAAM,gBAAgB,GAAG,6BAA6B,CAAC,KAAK,CAAC,WAAW,EAAE,CAAC,CAAC,GAAG,CAC3E,gBAAgB,CACnB,CAAC;QAEF,OAAO,CAAC,GAAG,iBAAiB,EAAE,GAAG,gBAAgB,CAAC,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;IACnE,CAAC;IAED,SAAS,WAAW,CAAC,MAAW;QAC5B,MAAM,SAAS,GAAG,0BAA0B;YACxC,CAAC,CAAC,MAAM,CAAC,0BAA0B,CAAC,KAAK,CAAC;YAC1C,CAAC,CAAC,kBAAkB,CAAC;QAEzB,IAAI,CAAC,MAAM,EAAE;YACT,kBAAkB,CAAC;gBACf,KAAK,EAAE,EAAE;gBACT,MAAM,EAAE,KAAK;aAChB,CAAC,CAAC;YAEH,eAAe,EAAE,CAAC;YAElB,OAAO;SACV;QAMD,MAAM,mBAAmB,GAAgB,MAAM,CAAC,IAAI;YAChD,CAAC,CAAC,MAAM,CAAC,IAAI;YACb,CAAC,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC;QAC/E,MAAM,mBAAmB,GAAG,iBAAiB,CAAC,mBAAmB,EAAE,SAAS,CAAC,CAAC;QAE9E,MAAM,OAAO,GAAG,aAAa,EAAE,CAAC;QAChC,MAAM,YAAY,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC,IAAI,EAAE,EAAE,CACzC,iBAAiB,CAAC,IAAI,CAAC,WAAW,EAAE,mBAAmB,CAAC,CAC3D,CAAC;QAEF,IAAI,CAAC,iBAAiB,EAAE;YACpB,GAAG,CAAC,SAAS,CAAC,mBAAmB,CAAC,CAAC;YAGnC,oBAAoB,CAAC,IAAI,CAAC,CAAC;YAE3B,GAAG,CAAC,IAAI,CAAC,SAAS,EAAE,GAAG,EAAE;gBACrB,oBAAoB,CAAC,KAAK,CAAC,CAAC;YAChC,CAAC,CAAC,CAAC;SACN;QAED,MAAM,KAAK,GAAG,eAAe,CAAC,MAAM,CAAC,CAAC;QAEtC,kBAAkB,CAAC;YACf,KAAK,EAAE,YAAY;YACnB,MAAM;YACN,mBAAmB;YACnB,mBAAmB;YACnB,KAAK;YACL,SAAS;SACZ,CAAC,CAAC;IACP,CAAC;IAED,SAAS,qBAAqB,CAAC,OAAY;QACvC,YAAY,CAAC,KAAK,GAAG,OAAO,CAAC,UAAU,CAAC;QAExC,yBAAyB,EAAE,CAAC;QAC5B,WAAW,CAAC,OAAO,CAAC,CAAC;IACzB,CAAC;IAED,SAAS,iBAAiB,CAAC,WAAgB;QACvC,yBAAyB,EAAE,CAAC;QAE5B,kBAAkB,CAAC,MAAM,CACrB,UAAI,KAAK,EAAC,yBAAyB,IAC9B,WAAW,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,OAAY,EAAE,EAAE,CAAC,CACxC,UAAI,KAAK,EAAC,wBAAwB;YAC9B,cAAQ,OAAO,EAAE,GAAG,EAAE,CAAC,qBAAqB,CAAC,OAAO,CAAC,IAChD,OAAO,CAAC,UAAU,CACd,CACR,CACR,CAAC,CACD,CACR,CAAC;IACN,CAAC;IAED,SAAS,eAAe,CAAC,YAAiB;;QACtC,MAAM,IAAI,GAAW,CAAA,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,UAAU,KAAI,EAAE,CAAC;QACpD,MAAM,KAAK,SAAY,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,UAAU,0CAAE,QAAQ,CAAC,KAAK,CAAC,CAAC;QAEjE,IAAI,KAAK;YAAE,OAAO,EAAE,CAAC;QAErB,MAAM,CAAC,OAAO,EAAE,QAAQ,EAAE,IAAI,EAAE,QAAQ,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,CAAC;QAEtE,OAAO;YACH,OAAO;YACP,QAAQ;YACR,IAAI;YACJ,QAAQ;SACX,CAAC;IACN,CAAC;AACL,CAAC,CAAC;AAEF,eAAe,MAAM,CAAC","sourcesContent":["import { h } from '@atomify/jsx';\nimport { BoundingBox, MapOptions, MapSearchOptions, MapSearchSuggestion } from '@bpd-library/types';\nimport {\n calculateBoundingBoxCenter,\n debounce,\n environmentDetails,\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 SearchResultPlace,\n updateSearchIsMoving,\n updateSearchResult,\n} from '../../../store';\nimport { fitBounds } from '../../fit-bounds';\nimport getCityAlternativeSuggestions from './alternative-city-suggestions';\n\nconst DEFAULT_TYPES = 'region,district,place,neighborhood';\nconst DEFAULT_KM_PADDING = 10;\nconst search = async (\n map: mapboxgl.Map,\n { hook, onSearchSuggestion, noZoomAfterSearch, types = DEFAULT_TYPES }: 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 (environmentDetails.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 inputSelectDistanceElement = element.querySelector(\n '[js-hook-map-search-distance-select-input]',\n ) as HTMLSelectElement;\n\n const form = inputElement.closest<HTMLFormElement>('form');\n const suggestionsElement = element.querySelector(\n '[js-hook-map-search-suggestions]',\n ) as HTMLElement;\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,\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 inputElement.addEventListener('keydown', debouncedOnKeyDown);\n form?.addEventListener('change', 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 // If manualSearch is an array, it means coordinates are sent.\n // In that case, join them as a string and send it to the geocoder\n let query: string;\n\n if (Array.isArray(manualSearch)) {\n geocoder.options.reverseGeocode = true;\n query = manualSearch.join(', ');\n } else {\n geocoder.options.reverseGeocode = false;\n query = manualSearch;\n }\n\n geocoder.setInput(query).on('results', function handleResults(results: any) {\n suggestions = results;\n\n let firstExactMatch: any;\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 if (typeof manualSearch === 'string') {\n firstExactMatch = results?.features?.find(\n ({ text }: { text?: string }) =>\n text?.toLowerCase() === manualSearch.toLowerCase(),\n );\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 const kmPadding = inputSelectDistanceElement\n ? Number(inputSelectDistanceElement.value)\n : DEFAULT_KM_PADDING;\n\n if (!result) {\n updateSearchResult({\n items: [],\n result: false,\n });\n\n handleFitBounds();\n\n return;\n }\n\n /*\n There might not be a bounding box returned.\n If so, generate one based on the center.\n */\n const originalBoundingBox: BoundingBox = result.bbox\n ? result.bbox\n : [result.center[0], result.center[1], result.center[0], result.center[1]];\n const expandedBoundingBox = expandBoundingBox(originalBoundingBox, kmPadding);\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 const place = parseResultText(result);\n\n updateSearchResult({\n items: filteredData,\n result,\n originalBoundingBox,\n expandedBoundingBox,\n place,\n kmPadding,\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 function parseResultText(searchResult: any): SearchResultPlace {\n const text: string = searchResult?.place_name || '';\n const isPoi: boolean = searchResult?.place_type?.includes('poi');\n\n if (isPoi) return {};\n\n const [country, province, city, district] = text.split(',').reverse();\n\n return {\n country,\n province,\n city,\n district,\n };\n }\n};\n\nexport default search;\n"]}
|
|
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 environmentDetails,\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 SearchResultPlace,\n updateSearchIsMoving,\n updateSearchResult,\n} from '../../../store';\nimport { fitBounds } from '../../fit-bounds';\nimport getCityAlternativeSuggestions from './alternative-city-suggestions';\n\nconst DEFAULT_TYPES = 'region,district,place,neighborhood';\nlet defaultKmPadding = 10;\n\nexport function setDefaultKmPadding(kmPadding: number) {\n return (defaultKmPadding = kmPadding);\n}\n\nconst search = async (\n map: mapboxgl.Map,\n { hook, onSearchSuggestion, noZoomAfterSearch, types = DEFAULT_TYPES }: 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 (environmentDetails.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 inputSelectDistanceElement = element.querySelector(\n '[js-hook-map-search-distance-select-input]',\n ) as HTMLSelectElement;\n\n const form = inputElement.closest<HTMLFormElement>('form');\n const suggestionsElement = element.querySelector(\n '[js-hook-map-search-suggestions]',\n ) as HTMLElement;\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,\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 inputElement.addEventListener('keydown', debouncedOnKeyDown);\n form?.addEventListener('change', 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 // If manualSearch is an array, it means coordinates are sent.\n // In that case, join them as a string and send it to the geocoder\n let query: string;\n\n if (Array.isArray(manualSearch)) {\n geocoder.options.reverseGeocode = true;\n query = manualSearch.join(', ');\n } else {\n geocoder.options.reverseGeocode = false;\n query = manualSearch;\n }\n\n geocoder.setInput(query).on('results', function handleResults(results: any) {\n suggestions = results;\n\n let firstExactMatch: any;\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 if (typeof manualSearch === 'string') {\n firstExactMatch = results?.features?.find(\n ({ text }: { text?: string }) =>\n text?.toLowerCase() === manualSearch.toLowerCase(),\n );\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 const kmPadding = !!Number(inputSelectDistanceElement?.value)\n ? Number(inputSelectDistanceElement.value)\n : defaultKmPadding;\n\n if (!result) {\n updateSearchResult({\n items: [],\n result: false,\n });\n\n handleFitBounds();\n\n return;\n }\n\n /*\n There might not be a bounding box returned.\n If so, generate one based on the center.\n */\n const originalBoundingBox: BoundingBox = result.bbox\n ? result.bbox\n : [result.center[0], result.center[1], result.center[0], result.center[1]];\n const expandedBoundingBox = expandBoundingBox(originalBoundingBox, kmPadding);\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 const place = parseResultText(result);\n\n updateSearchResult({\n items: filteredData,\n result,\n originalBoundingBox,\n expandedBoundingBox,\n place,\n kmPadding,\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 function parseResultText(searchResult: any): SearchResultPlace {\n const text: string = searchResult?.place_name || '';\n const isPoi: boolean = searchResult?.place_type?.includes('poi');\n\n if (isPoi) return {};\n\n const [country, province, city, district] = text.split(',').reverse();\n\n return {\n country,\n province,\n city,\n district,\n };\n }\n};\n\nexport default search;\n"]}
|