@bpd-library/components 1.6.1-beta.0 → 2.0.1-beta.0

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.
@@ -1 +1 @@
1
- {"version":3,"file":"themes.js","sourceRoot":"","sources":["../../../../src/molecules/map/storybook/themes.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,cAAc,CAAC;AAGjC,MAAM,KAAK,GAAa;IACpB,OAAO,EAAE;QACL,QAAQ,EAAE;YACN;gBACI,OAAO,EAAE,YAAY;gBACrB,MAAM,EAAE;oBACJ,IAAI,EAAE,CAAC,GAAG,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,CAAC;oBACtB,MAAM,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;iBAC7B;gBACD,KAAK,EAAE;oBACH,IAAI,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;oBAClB,MAAM,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;iBAC7B;aACJ;YACD;gBACI,OAAO,EAAE,YAAY;gBACrB,MAAM,EAAE;oBACJ,IAAI,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,CAAC;oBACtB,MAAM,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;iBAC7B;gBACD,KAAK,EAAE;oBACH,IAAI,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;oBAClB,MAAM,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;iBAC7B;aACJ;SACJ;KACJ;IACD,OAAO,EAAE;QACL,QAAQ,EAAE;YACN;gBACI,OAAO,EAAE,YAAY;gBACrB,aAAa,EAAE,GAAG,EAAE,CAAC,CACjB,WACI,KAAK,EAAE;wBACH,KAAK,EAAE,MAAM;wBACb,MAAM,EAAE,MAAM;wBACd,eAAe,EAAE,KAAK;wBACtB,kBAAkB,EAAE,OAAO;qBAC9B,GAAQ,CAChB;aACJ;YACD;gBACI,OAAO,EAAE,YAAY;gBACrB,aAAa,EAAE,GAAG,EAAE,CAAC,CACjB,WACI,KAAK,EAAE;wBACH,KAAK,EAAE,MAAM;wBACb,MAAM,EAAE,MAAM;wBACd,eAAe,EAAE,KAAK;wBACtB,kBAAkB,EAAE,KAAK;qBAC5B,GAAQ,CAChB;aACJ;SACJ;QACD,OAAO,EAAE,CAAC,KAAa,EAAE,EAAE,CAAC,gBAAO,KAAK,CAAQ;KACnD;CACJ,CAAC;AAEF,eAAe,KAAK,CAAC","sourcesContent":["import { h } from '@atomify/jsx';\nimport { MapTheme } from '@bpd-library/types';\n\nconst THEME: MapTheme = {\n polygon: {\n settings: [\n {\n variant: 'bouwnummer',\n normal: {\n fill: [255, 0, 0, 0.5],\n stroke: [255, 255, 255, 1],\n },\n hover: {\n fill: [0, 0, 0, 1],\n stroke: [255, 255, 255, 1],\n },\n },\n {\n variant: 'woningtype',\n normal: {\n fill: [0, 255, 0, 0.5],\n stroke: [255, 255, 255, 1],\n },\n hover: {\n fill: [0, 0, 0, 1],\n stroke: [255, 255, 255, 1],\n },\n },\n ],\n },\n pointer: {\n settings: [\n {\n variant: 'bouwnummer',\n createElement: () => (\n <div\n style={{\n width: '40px',\n height: '40px',\n 'border-radius': '50%',\n 'background-color': 'green',\n }}></div>\n ),\n },\n {\n variant: 'woningtype',\n createElement: () => (\n <div\n style={{\n width: '40px',\n height: '40px',\n 'border-radius': '50%',\n 'background-color': 'red',\n }}></div>\n ),\n },\n ],\n cluster: (total: number) => <span>{total}</span>,\n },\n};\n\nexport default THEME;\n"]}
1
+ {"version":3,"file":"themes.js","sourceRoot":"","sources":["../../../../src/molecules/map/storybook/themes.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,cAAc,CAAC;AAGjC,MAAM,KAAK,GAAa;IACpB,OAAO,EAAE;QACL,QAAQ,EAAE;YACN;gBACI,OAAO,EAAE,YAAY;gBACrB,MAAM,EAAE;oBACJ,IAAI,EAAE,CAAC,GAAG,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,CAAC;oBACtB,MAAM,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;iBAC7B;gBACD,KAAK,EAAE;oBACH,IAAI,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;oBAClB,MAAM,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;iBAC7B;aACJ;YACD;gBACI,OAAO,EAAE,YAAY;gBACrB,MAAM,EAAE;oBACJ,IAAI,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,CAAC;oBACtB,MAAM,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;iBAC7B;gBACD,KAAK,EAAE;oBACH,IAAI,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;oBAClB,MAAM,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;iBAC7B;aACJ;SACJ;KACJ;IACD,OAAO,EAAE;QACL,QAAQ,EAAE;YACN;gBACI,OAAO,EAAE,YAAY;gBACrB,aAAa,EAAE,GAAG,EAAE,CAAC,CACjB,WACI,KAAK,EAAE;wBACH,KAAK,EAAE,MAAM;wBACb,MAAM,EAAE,MAAM;wBACd,eAAe,EAAE,KAAK;wBACtB,kBAAkB,EAAE,OAAO;qBAC9B,GACH,CACL;aACJ;YACD;gBACI,OAAO,EAAE,YAAY;gBACrB,aAAa,EAAE,GAAG,EAAE,CAAC,CACjB,WACI,KAAK,EAAE;wBACH,KAAK,EAAE,MAAM;wBACb,MAAM,EAAE,MAAM;wBACd,eAAe,EAAE,KAAK;wBACtB,kBAAkB,EAAE,KAAK;qBAC5B,GACH,CACL;aACJ;SACJ;QACD,OAAO,EAAE,CAAC,KAAa,EAAE,EAAE,CAAC,gBAAO,KAAK,CAAQ;KACnD;CACJ,CAAC;AAEF,eAAe,KAAK,CAAC","sourcesContent":["import { h } from '@atomify/jsx';\nimport { MapTheme } from '@bpd-library/types';\n\nconst THEME: MapTheme = {\n polygon: {\n settings: [\n {\n variant: 'bouwnummer',\n normal: {\n fill: [255, 0, 0, 0.5],\n stroke: [255, 255, 255, 1],\n },\n hover: {\n fill: [0, 0, 0, 1],\n stroke: [255, 255, 255, 1],\n },\n },\n {\n variant: 'woningtype',\n normal: {\n fill: [0, 255, 0, 0.5],\n stroke: [255, 255, 255, 1],\n },\n hover: {\n fill: [0, 0, 0, 1],\n stroke: [255, 255, 255, 1],\n },\n },\n ],\n },\n pointer: {\n settings: [\n {\n variant: 'bouwnummer',\n createElement: () => (\n <div\n style={{\n width: '40px',\n height: '40px',\n 'border-radius': '50%',\n 'background-color': 'green',\n }}\n />\n ),\n },\n {\n variant: 'woningtype',\n createElement: () => (\n <div\n style={{\n width: '40px',\n height: '40px',\n 'border-radius': '50%',\n 'background-color': 'red',\n }}\n />\n ),\n },\n ],\n cluster: (total: number) => <span>{total}</span>,\n },\n};\n\nexport default THEME;\n"]}
@@ -1,6 +1 @@
1
- export declare type FeatureProperties = {
2
- [key: string]: string;
3
- };
4
- export declare const parseFeatureProperties: (obj: FeatureProperties) => {
5
- [key: string]: any;
6
- };
1
+ export declare const parseFeatureProperties: <T extends Record<string, any>>(obj: Record<string, string> | null) => T | null;
@@ -7,10 +7,12 @@ export const parseFeatureProperties = (obj) => {
7
7
  return false;
8
8
  }
9
9
  };
10
- Object.keys(obj).forEach(key => {
10
+ if (!obj)
11
+ return null;
12
+ return Object.keys(obj).reduce((acc, key) => {
11
13
  const parsedJSON = safeJSONParse(obj[key]);
12
- obj[key] = parsedJSON || obj[key];
13
- });
14
- return obj;
14
+ acc[key] = parsedJSON || obj[key];
15
+ return acc;
16
+ }, {});
15
17
  };
16
18
  //# sourceMappingURL=parse-feature-properties.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"parse-feature-properties.js","sourceRoot":"","sources":["../../../../../src/molecules/map/utilities/mapbox/parse-feature-properties.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,sBAAsB,GAAG,CAAC,GAAsB,EAA0B,EAAE;IACrF,MAAM,aAAa,GAAG,CAAC,GAAW,EAAE,EAAE;QAClC,IAAI;YACA,OAAO,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;SAC1B;QAAC,OAAO,CAAC,EAAE;YACR,OAAO,KAAK,CAAC;SAChB;IACL,CAAC,CAAC;IAEF,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,OAAO,CAAC,GAAG,CAAC,EAAE;QAC3B,MAAM,UAAU,GAAG,aAAa,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,CAAC;QAE3C,GAAG,CAAC,GAAG,CAAC,GAAG,UAAU,IAAI,GAAG,CAAC,GAAG,CAAC,CAAC;IACtC,CAAC,CAAC,CAAC;IAEH,OAAO,GAAG,CAAC;AACf,CAAC,CAAC","sourcesContent":["export type FeatureProperties = { [key: string]: string };\n\nexport const parseFeatureProperties = (obj: FeatureProperties): { [key: string]: any } => {\n const safeJSONParse = (str: string) => {\n try {\n return JSON.parse(str);\n } catch (e) {\n return false;\n }\n };\n\n Object.keys(obj).forEach(key => {\n const parsedJSON = safeJSONParse(obj[key]);\n\n obj[key] = parsedJSON || obj[key];\n });\n\n return obj;\n};\n"]}
1
+ {"version":3,"file":"parse-feature-properties.js","sourceRoot":"","sources":["../../../../../src/molecules/map/utilities/mapbox/parse-feature-properties.ts"],"names":[],"mappings":"AAUA,MAAM,CAAC,MAAM,sBAAsB,GAAG,CAClC,GAAkC,EAC1B,EAAE;IACV,MAAM,aAAa,GAAG,CAAC,GAAW,EAAE,EAAE;QAClC,IAAI;YACA,OAAO,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;SAC1B;QAAC,OAAO,CAAC,EAAE;YACR,OAAO,KAAK,CAAC;SAChB;IACL,CAAC,CAAC;IAEF,IAAI,CAAC,GAAG;QAAE,OAAO,IAAI,CAAC;IAEtB,OAAO,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,MAAM,CAAI,CAAC,GAAG,EAAE,GAAG,EAAE,EAAE;QAC3C,MAAM,UAAU,GAAG,aAAa,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,CAAC;QAC3C,GAAG,CAAC,GAAc,CAAC,GAAG,UAAU,IAAI,GAAG,CAAC,GAAG,CAAC,CAAC;QAE7C,OAAO,GAAG,CAAC;IACf,CAAC,EAAE,EAAO,CAAC,CAAC;AAChB,CAAC,CAAC","sourcesContent":["/**\n * This function will parse the passed object and cast it to a type.\n * It is very much expected that the caller knows the expected return type\n * and that the passed object has the correct shape.\n *\n * Otherwise it may cause runtime errors since typescript will think\n * that everything is okay with the returned object and will allow\n * non-optional access to required fields.\n * @param obj\n */\nexport const parseFeatureProperties = <T extends Record<string, any>>(\n obj: Record<string, string> | null,\n): T | null => {\n const safeJSONParse = (str: string) => {\n try {\n return JSON.parse(str);\n } catch (e) {\n return false;\n }\n };\n\n if (!obj) return null;\n\n return Object.keys(obj).reduce<T>((acc, key) => {\n const parsedJSON = safeJSONParse(obj[key]);\n acc[key as keyof T] = parsedJSON || obj[key];\n\n return acc;\n }, {} as T);\n};\n"]}
@@ -67,7 +67,7 @@ const setupPointers = (map, theme, element) => {
67
67
  clusterChildren = clusterChildren === null || clusterChildren === void 0 ? void 0 : clusterChildren.filter(Boolean);
68
68
  cluster.getElement().dataset.children = String(clusterChildren);
69
69
  }
70
- function addCluster(clus, variant) {
70
+ function addCluster(clus, setting) {
71
71
  const { properties, geometry } = clus;
72
72
  const { coordinates } = geometry;
73
73
  const { cluster_id: id, point_count: count } = properties;
@@ -75,28 +75,30 @@ const setupPointers = (map, theme, element) => {
75
75
  if (id && count) {
76
76
  cluster = clusters.cache[id];
77
77
  if (!cluster) {
78
+ const onCLick = () => {
79
+ element.classList.remove(MAP_HOVER_CLASS);
80
+ const source = map.getSource(setting.variant);
81
+ source.getClusterExpansionZoom(id, (err, zoom) => {
82
+ if (err)
83
+ return;
84
+ map.easeTo({
85
+ center: coordinates,
86
+ zoom,
87
+ duration: MAP_FLY_DURATION,
88
+ easing: MAP_FLY_EASING_FUNCTION,
89
+ });
90
+ });
91
+ };
78
92
  cluster = new Marker({
79
93
  element: (h("button", { id: id, class: "map__cluster", onMouseenter: () => {
80
94
  element.classList.add(MAP_HOVER_CLASS);
81
95
  }, onMouseleave: () => {
82
96
  element.classList.remove(MAP_HOVER_CLASS);
83
- }, onClick: () => {
84
- element.classList.remove(MAP_HOVER_CLASS);
85
- map.getSource(variant).getClusterExpansionZoom(id, (err, zoom) => {
86
- if (err)
87
- return;
88
- map.easeTo({
89
- center: coordinates,
90
- zoom,
91
- duration: MAP_FLY_DURATION,
92
- easing: MAP_FLY_EASING_FUNCTION,
93
- });
94
- });
95
- } }, pointerTheme.cluster(count))),
97
+ }, onClick: onCLick }, pointerTheme.cluster(count))),
96
98
  }).setLngLat(coordinates);
97
99
  clusters.cache[id] = cluster;
98
100
  }
99
- const clusterSource = map.getSource(variant);
101
+ const clusterSource = map.getSource(setting.variant);
100
102
  const config = {
101
103
  cluster,
102
104
  clusterSource,
@@ -108,27 +110,30 @@ const setupPointers = (map, theme, element) => {
108
110
  }
109
111
  return [cluster, id];
110
112
  }
111
- function addPointer({ properties, }) {
113
+ function addPointer({ properties }, setting) {
114
+ var _a, _b;
112
115
  const mapDataItem = parseFeatureProperties(properties);
113
- const { id, variant, coordinates } = mapDataItem;
114
- const setting = pointerTheme.settings.find((setting) => setting.variant === variant);
115
- if (!setting)
116
+ if (!mapDataItem)
116
117
  return [undefined, undefined];
118
+ const { id, coordinates } = mapDataItem;
117
119
  let pointer = pointers.cache[id];
118
120
  const center = calculateCenter(coordinates);
119
121
  if (!pointer) {
122
+ const Tag = ((_a = setting.baseElementOptions) === null || _a === void 0 ? void 0 : _a.tag) || 'button';
120
123
  pointer = new Marker({
121
124
  anchor: 'center',
122
- element: (h("button", { id: `pointer-${id}`, onMouseenter: () => {
125
+ element: (h(Tag, Object.assign({ id: `pointer-${id}`, onMouseenter: () => {
123
126
  element.classList.add(MAP_HOVER_CLASS);
124
127
  updateHover(mapDataItem);
125
128
  }, onMouseleave: () => {
126
129
  element.classList.remove(MAP_HOVER_CLASS);
127
130
  clearHover();
128
- }, onClick: (e) => {
131
+ } }, (!((_b = setting.baseElementOptions) === null || _b === void 0 ? void 0 : _b.disableClickEvent) && {
132
+ onClick(e) {
129
133
  e.stopPropagation();
130
134
  updateClick(mapDataItem);
131
- }, class: `map__pointer${setting.disablePointerEvents ? ' map__pointer--disabled' : ''}` }, setting.createElement(mapDataItem))),
135
+ },
136
+ }), { class: `map__pointer${setting.disablePointerEvents ? ' map__pointer--disabled' : ''}` }), setting.createElement(mapDataItem))),
132
137
  }).setLngLat(center);
133
138
  pointers.cache[id] = pointer;
134
139
  }
@@ -140,17 +145,17 @@ const setupPointers = (map, theme, element) => {
140
145
  var _a;
141
146
  const newClusters = {};
142
147
  const newPointers = {};
143
- (_a = theme.pointer) === null || _a === void 0 ? void 0 : _a.settings.forEach(({ variant }) => {
144
- const features = map.querySourceFeatures(variant);
148
+ (_a = theme.pointer) === null || _a === void 0 ? void 0 : _a.settings.forEach((setting) => {
149
+ const features = map.querySourceFeatures(setting.variant);
145
150
  features.forEach((feature) => {
146
151
  const { properties } = feature;
147
152
  if (properties === null || properties === void 0 ? void 0 : properties.cluster) {
148
- const [cluster, id] = addCluster(feature, variant);
153
+ const [cluster, id] = addCluster(feature, setting);
149
154
  if (cluster && id)
150
155
  newClusters[id] = cluster;
151
156
  }
152
157
  else {
153
- const [pointer, id] = addPointer(feature);
158
+ const [pointer, id] = addPointer(feature, setting);
154
159
  if (pointer && id)
155
160
  newPointers[id] = pointer;
156
161
  }
@@ -1 +1 @@
1
- {"version":3,"file":"setup-pointers.js","sourceRoot":"","sources":["../../../../../../src/molecules/map/utilities/mapbox/pointers/setup-pointers.tsx"],"names":[],"mappings":"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","sourcesContent":["import { h } from '@atomify/jsx';\nimport { MapDataItem, MapTheme } from '@bpd-library/types';\nimport { calculateCenter, throttle } from '@bpd-library/utilities';\nimport { GeoJSONSource, LngLatLike, Marker } from 'mapbox-gl';\n\nimport { clearHover, updateClick, updateHover } from '../../../store';\nimport { MAP_FLY_DURATION, MAP_FLY_EASING_FUNCTION } from '../constants';\nimport { FeatureProperties, parseFeatureProperties } from '../parse-feature-properties';\n\ntype MapMarkers = { [key: string]: mapboxgl.Marker };\n\ntype MarkerObject = {\n cache: MapMarkers;\n onScreen: MapMarkers;\n};\n\ninterface ClusterChildren {\n cluster: Marker;\n clusterSource: GeoJSONSource;\n clusterId: number;\n}\n\ninterface MarkersToCluster {\n cluster: Marker;\n features: GeoJSON.Feature<GeoJSON.Geometry, GeoJSON.GeoJsonProperties>[];\n}\n\nconst MAP_HOVER_CLASS = 'map--hovering';\nconst POINTER_FADEOUT_DURATION = 300;\n\nconst setupPointers = (map: mapboxgl.Map, theme: MapTheme, element: HTMLElement) => {\n const { pointer: pointerTheme } = theme;\n const clusters: MarkerObject = { cache: {}, onScreen: {} };\n const pointers: MarkerObject = { cache: {}, onScreen: {} };\n const sourceNames: string[] = [];\n\n init();\n\n function init() {\n theme.pointer?.settings.forEach(({ variant, minzoom, maxzoom }) => {\n sourceNames.push(variant);\n\n map.addSource(variant, {\n type: 'geojson',\n data: { type: 'FeatureCollection', features: [] },\n cluster: true,\n clusterRadius: 50,\n clusterMaxZoom: 8,\n promoteId: 'id',\n });\n\n const layerSettings: mapboxgl.AnyLayer | mapboxgl.CustomLayerInterface = {\n id: variant,\n type: 'circle',\n source: variant,\n filter: ['!=', 'cluster', true],\n paint: {\n 'circle-opacity': 0,\n },\n };\n\n if (minzoom) layerSettings.minzoom = minzoom;\n if (maxzoom) layerSettings.maxzoom = maxzoom;\n\n map.addLayer(layerSettings);\n });\n\n bindEvents();\n }\n\n function bindEvents() {\n map.on('render', throttle(updateMarkers, 200));\n }\n\n function setClusterChildrenData({ cluster, clusterSource, clusterId }: ClusterChildren) {\n clusterSource?.getClusterChildren(clusterId!, (_, features) => {\n const markersLength = features[0].properties?.point_count;\n const OFFSET = 0;\n\n clusterSource.getClusterLeaves(clusterId, markersLength, OFFSET, (_, features) => {\n const config: MarkersToCluster = {\n cluster,\n features,\n };\n addMarkersToCluster(config);\n });\n });\n }\n\n function addMarkersToCluster({ cluster, features }: MarkersToCluster) {\n let clusterChildren: string[];\n\n clusterChildren = features.map((feature: any) => {\n return feature.properties?.id;\n });\n\n clusterChildren = clusterChildren?.filter(Boolean);\n cluster!.getElement().dataset.children = String(clusterChildren);\n }\n\n function addCluster(\n clus: GeoJSON.Feature,\n variant: string,\n ): [mapboxgl.Marker | undefined, number | undefined] {\n const { properties, geometry } = clus;\n const { coordinates } = geometry as GeoJSON.Point;\n const { cluster_id: id, point_count: count } = properties as {\n cluster_id?: number;\n point_count?: number;\n };\n\n let cluster: mapboxgl.Marker | undefined;\n\n if (id && count) {\n cluster = clusters.cache[id];\n if (!cluster) {\n cluster = new Marker({\n element: (\n <button\n id={id}\n class=\"map__cluster\"\n onMouseenter={() => {\n element.classList.add(MAP_HOVER_CLASS);\n }}\n onMouseleave={() => {\n element.classList.remove(MAP_HOVER_CLASS);\n }}\n onClick={() => {\n element.classList.remove(MAP_HOVER_CLASS);\n\n (map.getSource(variant) as GeoJSONSource).getClusterExpansionZoom(\n id,\n (err, zoom) => {\n if (err) return;\n\n map.easeTo({\n center: coordinates as LngLatLike,\n zoom,\n duration: MAP_FLY_DURATION,\n easing: MAP_FLY_EASING_FUNCTION,\n });\n },\n );\n }}>\n {pointerTheme!.cluster(count)}\n </button>\n ),\n }).setLngLat(coordinates as LngLatLike);\n\n clusters.cache[id] = cluster;\n }\n const clusterSource = map.getSource(variant) as GeoJSONSource;\n const config: ClusterChildren = {\n cluster,\n clusterSource,\n clusterId: id,\n };\n\n setClusterChildrenData(config);\n\n if (!clusters.onScreen[id]) cluster?.addTo(map);\n }\n\n return [cluster, id];\n }\n\n function addPointer({\n properties,\n }: GeoJSON.Feature): [mapboxgl.Marker | undefined, string | undefined] {\n const mapDataItem = parseFeatureProperties(properties as FeatureProperties) as MapDataItem;\n const { id, variant, coordinates } = mapDataItem;\n const setting = pointerTheme!.settings.find((setting) => setting.variant === variant);\n\n if (!setting) return [undefined, undefined];\n\n let pointer: mapboxgl.Marker | undefined = pointers.cache[id];\n const center = calculateCenter(coordinates);\n\n if (!pointer) {\n pointer = new Marker({\n anchor: 'center',\n element: (\n <button\n id={`pointer-${id}`}\n onMouseenter={() => {\n element.classList.add(MAP_HOVER_CLASS);\n updateHover(mapDataItem);\n }}\n onMouseleave={() => {\n element.classList.remove(MAP_HOVER_CLASS);\n clearHover();\n }}\n onClick={(e: Event) => {\n e.stopPropagation();\n updateClick(mapDataItem);\n }}\n class={`map__pointer${\n setting.disablePointerEvents ? ' map__pointer--disabled' : ''\n }`}>\n {setting.createElement(mapDataItem)}\n </button>\n ),\n }).setLngLat(center);\n\n pointers.cache[id] = pointer;\n }\n\n if (!pointers.onScreen[id]) pointer.addTo(map);\n\n return [pointer, id];\n }\n\n function updateMarkers() {\n const newClusters: MapMarkers = {};\n const newPointers: MapMarkers = {};\n\n theme.pointer?.settings.forEach(({ variant }) => {\n const features = map.querySourceFeatures(variant);\n\n features.forEach((feature) => {\n const { properties } = feature;\n\n if (properties?.cluster) {\n const [cluster, id] = addCluster(feature, variant);\n\n if (cluster && id) newClusters[id] = cluster;\n } else {\n const [pointer, id] = addPointer(feature);\n\n if (pointer && id) newPointers[id] = pointer;\n }\n });\n });\n\n Object.keys(clusters.onScreen).forEach((id) => {\n if (!newClusters[id]) clusters.onScreen[id].remove();\n });\n\n Object.keys(pointers.onScreen).forEach((id) => {\n if (!newPointers[id]) {\n fadeoutPointer(pointers.onScreen[id]);\n }\n });\n\n clusters.onScreen = newClusters;\n pointers.onScreen = newPointers;\n }\n\n function fadeoutPointer(pointer: mapboxgl.Marker) {\n const pointerElement = pointer.getElement();\n\n pointerElement.classList.add('map__pointer--fadeout');\n\n setTimeout(() => {\n pointer.remove();\n\n pointerElement.classList.remove('map__pointer--fadeout');\n }, POINTER_FADEOUT_DURATION);\n }\n};\n\nexport default setupPointers;\n"]}
1
+ {"version":3,"file":"setup-pointers.js","sourceRoot":"","sources":["../../../../../../src/molecules/map/utilities/mapbox/pointers/setup-pointers.tsx"],"names":[],"mappings":"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","sourcesContent":["import { h } from '@atomify/jsx';\nimport { MapDataItem, MapTheme, PointerThemeSetting } from '@bpd-library/types';\nimport { calculateCenter, throttle } from '@bpd-library/utilities';\nimport { GeoJSONSource, LngLatLike, Marker } from 'mapbox-gl';\n\nimport { clearHover, updateClick, updateHover } from '../../../store';\nimport { MAP_FLY_DURATION, MAP_FLY_EASING_FUNCTION } from '../constants';\nimport { parseFeatureProperties } from '../parse-feature-properties';\n\ntype MapMarkers = { [key: string]: mapboxgl.Marker };\n\ntype MarkerObject = {\n cache: MapMarkers;\n onScreen: MapMarkers;\n};\n\ninterface ClusterChildren {\n cluster: Marker;\n clusterSource: GeoJSONSource;\n clusterId: number;\n}\n\ninterface MarkersToCluster {\n cluster: Marker;\n features: GeoJSON.Feature<GeoJSON.Geometry, GeoJSON.GeoJsonProperties>[];\n}\n\nconst MAP_HOVER_CLASS = 'map--hovering';\nconst POINTER_FADEOUT_DURATION = 300;\n\nconst setupPointers = (map: mapboxgl.Map, theme: MapTheme, element: HTMLElement) => {\n const { pointer: pointerTheme } = theme;\n const clusters: MarkerObject = { cache: {}, onScreen: {} };\n const pointers: MarkerObject = { cache: {}, onScreen: {} };\n const sourceNames: string[] = [];\n\n init();\n\n function init() {\n theme.pointer?.settings.forEach(({ variant, minzoom, maxzoom }) => {\n sourceNames.push(variant);\n\n map.addSource(variant, {\n type: 'geojson',\n data: { type: 'FeatureCollection', features: [] },\n cluster: true,\n clusterRadius: 50,\n clusterMaxZoom: 8,\n promoteId: 'id',\n });\n\n const layerSettings: mapboxgl.AnyLayer | mapboxgl.CustomLayerInterface = {\n id: variant,\n type: 'circle',\n source: variant,\n filter: ['!=', 'cluster', true],\n paint: {\n 'circle-opacity': 0,\n },\n };\n\n if (minzoom) layerSettings.minzoom = minzoom;\n if (maxzoom) layerSettings.maxzoom = maxzoom;\n\n map.addLayer(layerSettings);\n });\n\n bindEvents();\n }\n\n function bindEvents() {\n map.on('render', throttle(updateMarkers, 200));\n }\n\n function setClusterChildrenData({ cluster, clusterSource, clusterId }: ClusterChildren) {\n clusterSource?.getClusterChildren(clusterId!, (_, features) => {\n const markersLength = features[0].properties?.point_count;\n const OFFSET = 0;\n\n clusterSource.getClusterLeaves(clusterId, markersLength, OFFSET, (_, features) => {\n const config: MarkersToCluster = {\n cluster,\n features,\n };\n addMarkersToCluster(config);\n });\n });\n }\n\n function addMarkersToCluster({ cluster, features }: MarkersToCluster) {\n let clusterChildren: string[];\n\n clusterChildren = features.map((feature: any) => {\n return feature.properties?.id;\n });\n\n clusterChildren = clusterChildren?.filter(Boolean);\n cluster.getElement().dataset.children = String(clusterChildren);\n }\n\n function addCluster(\n clus: GeoJSON.Feature,\n setting: PointerThemeSetting,\n ): [mapboxgl.Marker | undefined, number | undefined] {\n const { properties, geometry } = clus;\n const { coordinates } = geometry as GeoJSON.Point;\n const { cluster_id: id, point_count: count } = properties as {\n cluster_id?: number;\n point_count?: number;\n };\n\n let cluster: mapboxgl.Marker | undefined;\n\n if (id && count) {\n cluster = clusters.cache[id];\n if (!cluster) {\n const onCLick = () => {\n element.classList.remove(MAP_HOVER_CLASS);\n\n const source = map.getSource(setting.variant) as GeoJSONSource;\n source.getClusterExpansionZoom(id, (err, zoom) => {\n if (err) return;\n map.easeTo({\n center: coordinates as LngLatLike,\n zoom,\n duration: MAP_FLY_DURATION,\n easing: MAP_FLY_EASING_FUNCTION,\n });\n });\n };\n\n cluster = new Marker({\n element: (\n <button\n id={id}\n class=\"map__cluster\"\n onMouseenter={() => {\n element.classList.add(MAP_HOVER_CLASS);\n }}\n onMouseleave={() => {\n element.classList.remove(MAP_HOVER_CLASS);\n }}\n onClick={onCLick}>\n {pointerTheme!.cluster(count)}\n </button>\n ),\n }).setLngLat(coordinates as LngLatLike);\n\n clusters.cache[id] = cluster;\n }\n const clusterSource = map.getSource(setting.variant) as GeoJSONSource;\n const config: ClusterChildren = {\n cluster,\n clusterSource,\n clusterId: id,\n };\n\n setClusterChildrenData(config);\n\n if (!clusters.onScreen[id]) cluster?.addTo(map);\n }\n\n return [cluster, id];\n }\n\n function addPointer(\n { properties }: GeoJSON.Feature,\n setting: PointerThemeSetting,\n ): [mapboxgl.Marker | undefined, string | undefined] {\n const mapDataItem = parseFeatureProperties<MapDataItem>(properties);\n if (!mapDataItem) return [undefined, undefined];\n const { id, coordinates } = mapDataItem;\n\n let pointer: mapboxgl.Marker | undefined = pointers.cache[id];\n const center = calculateCenter(coordinates);\n\n if (!pointer) {\n const Tag = setting.baseElementOptions?.tag || 'button';\n pointer = new Marker({\n anchor: 'center',\n element: (\n <Tag\n id={`pointer-${id}`}\n onMouseenter={() => {\n element.classList.add(MAP_HOVER_CLASS);\n updateHover(mapDataItem);\n }}\n onMouseleave={() => {\n element.classList.remove(MAP_HOVER_CLASS);\n clearHover();\n }}\n {...(!setting.baseElementOptions?.disableClickEvent && {\n onClick(e: Event) {\n e.stopPropagation();\n updateClick(mapDataItem);\n },\n })}\n class={`map__pointer${\n setting.disablePointerEvents ? ' map__pointer--disabled' : ''\n }`}>\n {setting.createElement(mapDataItem)}\n </Tag>\n ),\n }).setLngLat(center);\n\n pointers.cache[id] = pointer;\n }\n\n if (!pointers.onScreen[id]) pointer.addTo(map);\n\n return [pointer, id];\n }\n\n function updateMarkers() {\n const newClusters: MapMarkers = {};\n const newPointers: MapMarkers = {};\n\n theme.pointer?.settings.forEach((setting) => {\n const features = map.querySourceFeatures(setting.variant);\n\n features.forEach((feature) => {\n const { properties } = feature;\n\n if (properties?.cluster) {\n const [cluster, id] = addCluster(feature, setting);\n\n if (cluster && id) newClusters[id] = cluster;\n } else {\n const [pointer, id] = addPointer(feature, setting);\n\n if (pointer && id) newPointers[id] = pointer;\n }\n });\n });\n\n Object.keys(clusters.onScreen).forEach((id) => {\n if (!newClusters[id]) clusters.onScreen[id].remove();\n });\n\n Object.keys(pointers.onScreen).forEach((id) => {\n if (!newPointers[id]) {\n fadeoutPointer(pointers.onScreen[id]);\n }\n });\n\n clusters.onScreen = newClusters;\n pointers.onScreen = newPointers;\n }\n\n function fadeoutPointer(pointer: mapboxgl.Marker) {\n const pointerElement = pointer.getElement();\n\n pointerElement.classList.add('map__pointer--fadeout');\n\n setTimeout(() => {\n pointer.remove();\n\n pointerElement.classList.remove('map__pointer--fadeout');\n }, POINTER_FADEOUT_DURATION);\n }\n};\n\nexport default setupPointers;\n"]}
@@ -14,7 +14,7 @@ const interaction = (map, setting) => {
14
14
  return;
15
15
  if (((_a = hover.current) === null || _a === void 0 ? void 0 : _a.id) !== feature.id) {
16
16
  const item = parseFeatureProperties(feature.properties);
17
- updateHover(item);
17
+ item && updateHover(item);
18
18
  }
19
19
  });
20
20
  map.on('mouseleave', setting.variant + '-fill', () => {
@@ -24,7 +24,7 @@ const interaction = (map, setting) => {
24
24
  const feature = getFeatureFromEvent(e);
25
25
  if (feature) {
26
26
  const item = parseFeatureProperties(feature.properties);
27
- updateClick(item);
27
+ item && updateClick(item);
28
28
  }
29
29
  });
30
30
  };
@@ -1 +1 @@
1
- {"version":3,"file":"interaction.js","sourceRoot":"","sources":["../../../../../../src/molecules/map/utilities/mapbox/polygons/interaction.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAChF,OAAO,EAAqB,sBAAsB,EAAE,MAAM,6BAA6B,CAAC;AAMxF,MAAM,mBAAmB,GAAG,CAAC,CAAc,EAAE,EAAE;IAC3C,MAAM,QAAQ,GAAG,CAAC,CAAC,QAAQ,CAAC;IAC5B,MAAM,OAAO,GAAG,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;IAEnD,OAAO,OAAO,IAAI,SAAS,CAAC;AAChC,CAAC,CAAC;AAEF,MAAM,WAAW,GAAG,CAAC,GAAiB,EAAE,OAA4B,EAAE,EAAE;IACpE,GAAG,CAAC,EAAE,CAAC,WAAW,EAAE,OAAO,CAAC,OAAO,GAAG,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;;QACjD,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;QACzB,MAAM,OAAO,GAAG,mBAAmB,CAAC,CAAC,CAAC,CAAC;QAEvC,IAAI,CAAC,OAAO;YAAE,OAAO;QAErB,IAAI,OAAA,KAAK,CAAC,OAAO,0CAAE,EAAE,MAAK,OAAO,CAAC,EAAE,EAAE;YAClC,MAAM,IAAI,GAAG,sBAAsB,CAC/B,OAAO,CAAC,UAA+B,CAC3B,CAAC;YAEjB,WAAW,CAAC,IAAI,CAAC,CAAC;SACrB;IACL,CAAC,CAAC,CAAC;IAEH,GAAG,CAAC,EAAE,CAAC,YAAY,EAAE,OAAO,CAAC,OAAO,GAAG,OAAO,EAAE,GAAG,EAAE;QACjD,UAAU,EAAE,CAAC;IACjB,CAAC,CAAC,CAAC;IAEH,GAAG,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,CAAC,OAAO,GAAG,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;QAC7C,MAAM,OAAO,GAAG,mBAAmB,CAAC,CAAC,CAAC,CAAC;QAEvC,IAAI,OAAO,EAAE;YACT,MAAM,IAAI,GAAG,sBAAsB,CAC/B,OAAO,CAAC,UAA+B,CAC3B,CAAC;YAEjB,WAAW,CAAC,IAAI,CAAC,CAAC;SACrB;IACL,CAAC,CAAC,CAAC;AACP,CAAC,CAAC;AAEF,eAAe,WAAW,CAAC","sourcesContent":["import { MapDataItem, PolygonThemeSetting } from '@bpd-library/types';\n\nimport { clearHover, getHover, updateClick, updateHover } from '../../../store';\nimport { FeatureProperties, parseFeatureProperties } from '../parse-feature-properties';\n\ntype MapboxEvent = mapboxgl.MapMouseEvent & {\n features?: mapboxgl.MapboxGeoJSONFeature[] | undefined;\n} & mapboxgl.EventData;\n\nconst getFeatureFromEvent = (e: MapboxEvent) => {\n const features = e.features;\n const feature = features ? features[0] : undefined;\n\n return feature || undefined;\n};\n\nconst interaction = (map: mapboxgl.Map, setting: PolygonThemeSetting) => {\n map.on('mousemove', setting.variant + '-fill', (e) => {\n const hover = getHover();\n const feature = getFeatureFromEvent(e);\n\n if (!feature) return;\n\n if (hover.current?.id !== feature.id) {\n const item = parseFeatureProperties(\n feature.properties as FeatureProperties,\n ) as MapDataItem;\n\n updateHover(item);\n }\n });\n\n map.on('mouseleave', setting.variant + '-fill', () => {\n clearHover();\n });\n\n map.on('click', setting.variant + '-fill', (e) => {\n const feature = getFeatureFromEvent(e);\n\n if (feature) {\n const item = parseFeatureProperties(\n feature.properties as FeatureProperties,\n ) as MapDataItem;\n\n updateClick(item);\n }\n });\n};\n\nexport default interaction;\n"]}
1
+ {"version":3,"file":"interaction.js","sourceRoot":"","sources":["../../../../../../src/molecules/map/utilities/mapbox/polygons/interaction.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAChF,OAAO,EAAE,sBAAsB,EAAE,MAAM,6BAA6B,CAAC;AAMrE,MAAM,mBAAmB,GAAG,CAAC,CAAc,EAAE,EAAE;IAC3C,MAAM,QAAQ,GAAG,CAAC,CAAC,QAAQ,CAAC;IAC5B,MAAM,OAAO,GAAG,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;IAEnD,OAAO,OAAO,IAAI,SAAS,CAAC;AAChC,CAAC,CAAC;AAEF,MAAM,WAAW,GAAG,CAAC,GAAiB,EAAE,OAA4B,EAAE,EAAE;IACpE,GAAG,CAAC,EAAE,CAAC,WAAW,EAAE,OAAO,CAAC,OAAO,GAAG,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;;QACjD,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;QACzB,MAAM,OAAO,GAAG,mBAAmB,CAAC,CAAC,CAAC,CAAC;QAEvC,IAAI,CAAC,OAAO;YAAE,OAAO;QACrB,IAAI,OAAA,KAAK,CAAC,OAAO,0CAAE,EAAE,MAAK,OAAO,CAAC,EAAE,EAAE;YAClC,MAAM,IAAI,GAAG,sBAAsB,CAAc,OAAO,CAAC,UAAU,CAAC,CAAC;YACrE,IAAI,IAAI,WAAW,CAAC,IAAI,CAAC,CAAC;SAC7B;IACL,CAAC,CAAC,CAAC;IAEH,GAAG,CAAC,EAAE,CAAC,YAAY,EAAE,OAAO,CAAC,OAAO,GAAG,OAAO,EAAE,GAAG,EAAE;QACjD,UAAU,EAAE,CAAC;IACjB,CAAC,CAAC,CAAC;IAEH,GAAG,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,CAAC,OAAO,GAAG,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;QAC7C,MAAM,OAAO,GAAG,mBAAmB,CAAC,CAAC,CAAC,CAAC;QACvC,IAAI,OAAO,EAAE;YACT,MAAM,IAAI,GAAG,sBAAsB,CAAc,OAAO,CAAC,UAAU,CAAC,CAAC;YACrE,IAAI,IAAI,WAAW,CAAC,IAAI,CAAC,CAAC;SAC7B;IACL,CAAC,CAAC,CAAC;AACP,CAAC,CAAC;AAEF,eAAe,WAAW,CAAC","sourcesContent":["import { MapDataItem, PolygonThemeSetting } from '@bpd-library/types';\n\nimport { clearHover, getHover, updateClick, updateHover } from '../../../store';\nimport { parseFeatureProperties } from '../parse-feature-properties';\n\ntype MapboxEvent = mapboxgl.MapMouseEvent & {\n features?: mapboxgl.MapboxGeoJSONFeature[] | undefined;\n} & mapboxgl.EventData;\n\nconst getFeatureFromEvent = (e: MapboxEvent) => {\n const features = e.features;\n const feature = features ? features[0] : undefined;\n\n return feature || undefined;\n};\n\nconst interaction = (map: mapboxgl.Map, setting: PolygonThemeSetting) => {\n map.on('mousemove', setting.variant + '-fill', (e) => {\n const hover = getHover();\n const feature = getFeatureFromEvent(e);\n\n if (!feature) return;\n if (hover.current?.id !== feature.id) {\n const item = parseFeatureProperties<MapDataItem>(feature.properties);\n item && updateHover(item);\n }\n });\n\n map.on('mouseleave', setting.variant + '-fill', () => {\n clearHover();\n });\n\n map.on('click', setting.variant + '-fill', (e) => {\n const feature = getFeatureFromEvent(e);\n if (feature) {\n const item = parseFeatureProperties<MapDataItem>(feature.properties);\n item && updateClick(item);\n }\n });\n};\n\nexport default interaction;\n"]}
@@ -64,7 +64,7 @@ const layer = (map, { variant, normal, hover, minzoom, maxzoom, visibility = 'vi
64
64
  });
65
65
  setTransitionPaintProperty(`${variant}-line`, normal.stroke, 'line-color');
66
66
  }
67
- if (hover) {
67
+ if (hover === null || hover === void 0 ? void 0 : hover.fill) {
68
68
  map.addLayer({
69
69
  id: `${variant}-fill-hover`,
70
70
  type: 'fill',
@@ -80,6 +80,8 @@ const layer = (map, { variant, normal, hover, minzoom, maxzoom, visibility = 'vi
80
80
  },
81
81
  });
82
82
  setTransitionPaintProperty(`${variant}-fill-hover`, hover.fill, 'fill-color');
83
+ }
84
+ if (hover === null || hover === void 0 ? void 0 : hover.stroke) {
83
85
  if (normal.stroke) {
84
86
  map.addLayer({
85
87
  id: `${variant}-line-hover`,
@@ -1 +1 @@
1
- {"version":3,"file":"layer.js","sourceRoot":"","sources":["../../../../../../src/molecules/map/utilities/mapbox/polygons/layer.ts"],"names":[],"mappings":"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","sourcesContent":["import { PolygonThemeSetting, RGBA } from '@bpd-library/types';\n\nconst MIN_ZOOM = 1;\nconst MAX_ZOOM = 24;\nconst LINE_WIDTH = 2;\nconst TRANSITION_ZOOM_MARGIN = 0.75;\n\nconst NORMAL_FEATURE_STATE: mapboxgl.Expression = [\n 'case',\n ['boolean', ['feature-state', 'hover'], false],\n 0,\n ['boolean', ['feature-state', 'focus'], false],\n 0,\n 1,\n];\n\nconst HOVER_FEATURE_STATE: mapboxgl.Expression = [\n 'case',\n ['boolean', ['feature-state', 'hover'], false],\n 1,\n ['boolean', ['feature-state', 'focus'], false],\n 1,\n 0,\n];\n\nconst RGBAString = ([r, g, b, a]: RGBA, overwriteAlpha?: number) => {\n a = overwriteAlpha !== undefined ? overwriteAlpha : a;\n\n return `rgba(${r},${g},${b},${a})`;\n};\n\nconst layer = (\n map: mapboxgl.Map,\n { variant, normal, hover, minzoom, maxzoom, visibility = 'visible' }: PolygonThemeSetting,\n) => {\n // Calculate the minzoom and maxzoom when it's set. This makes sure the layer gets disabled when it's invisible.\n let layerMinzoom = minzoom ? minzoom - TRANSITION_ZOOM_MARGIN : MIN_ZOOM;\n let layerMaxzoom = maxzoom ? maxzoom + TRANSITION_ZOOM_MARGIN : MAX_ZOOM;\n\n // Limit the minzoom to 1 and the maxzoom to 24.\n if (layerMinzoom < 1) layerMinzoom = 1;\n if (layerMaxzoom > 24) layerMaxzoom = 24;\n\n if (normal.fill) {\n map.addLayer({\n id: `${variant}-fill`,\n type: 'fill',\n source: variant,\n minzoom: layerMinzoom,\n maxzoom: layerMaxzoom,\n layout: {\n visibility: visibility,\n },\n paint: {\n 'fill-color': RGBAString(normal.fill),\n 'fill-opacity': NORMAL_FEATURE_STATE,\n },\n });\n\n setTransitionPaintProperty(`${variant}-fill`, normal.fill, 'fill-color');\n }\n\n // Only add stroke layer, if it is set\n if (normal.stroke) {\n map.addLayer({\n id: `${variant}-line`,\n type: 'line',\n source: variant,\n minzoom: layerMinzoom,\n maxzoom: layerMaxzoom,\n layout: {\n visibility: 'visible',\n },\n paint: {\n 'line-color': RGBAString(normal.stroke),\n 'line-width': LINE_WIDTH,\n 'line-opacity': NORMAL_FEATURE_STATE,\n },\n });\n\n setTransitionPaintProperty(`${variant}-line`, normal.stroke, 'line-color');\n }\n\n if (hover) {\n map.addLayer({\n id: `${variant}-fill-hover`,\n type: 'fill',\n source: variant,\n minzoom: layerMinzoom,\n maxzoom: layerMaxzoom,\n layout: {\n // Make the layer visible by default.\n visibility: visibility,\n },\n paint: {\n 'fill-color': RGBAString(hover.fill),\n 'fill-opacity': HOVER_FEATURE_STATE,\n },\n });\n\n setTransitionPaintProperty(`${variant}-fill-hover`, hover.fill, 'fill-color');\n\n if (normal.stroke) {\n map.addLayer({\n id: `${variant}-line-hover`,\n type: 'line',\n source: variant,\n minzoom: layerMinzoom,\n maxzoom: layerMaxzoom,\n paint: {\n 'line-color': RGBAString(hover.stroke),\n 'line-width': LINE_WIDTH,\n 'line-opacity': HOVER_FEATURE_STATE,\n },\n });\n\n setTransitionPaintProperty(`${variant}-line-hover`, hover.stroke, 'line-color');\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 */\n function setTransitionPaintProperty(layer: string, color: RGBA, property: string) {\n if (!minzoom || !maxzoom) return;\n\n map.setPaintProperty(layer, property, [\n 'interpolate',\n ['exponential', TRANSITION_ZOOM_MARGIN],\n ['zoom'],\n minzoom - TRANSITION_ZOOM_MARGIN,\n RGBAString(color, 0),\n minzoom,\n RGBAString(color),\n maxzoom,\n RGBAString(color),\n maxzoom + TRANSITION_ZOOM_MARGIN,\n RGBAString(color, 0),\n ]);\n }\n};\n\nexport default layer;\n"]}
1
+ {"version":3,"file":"layer.js","sourceRoot":"","sources":["../../../../../../src/molecules/map/utilities/mapbox/polygons/layer.ts"],"names":[],"mappings":"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","sourcesContent":["import { PolygonThemeSetting, RGBA } from '@bpd-library/types';\n\nconst MIN_ZOOM = 1;\nconst MAX_ZOOM = 24;\nconst LINE_WIDTH = 2;\nconst TRANSITION_ZOOM_MARGIN = 0.75;\n\nconst NORMAL_FEATURE_STATE: mapboxgl.Expression = [\n 'case',\n ['boolean', ['feature-state', 'hover'], false],\n 0,\n ['boolean', ['feature-state', 'focus'], false],\n 0,\n 1,\n];\n\nconst HOVER_FEATURE_STATE: mapboxgl.Expression = [\n 'case',\n ['boolean', ['feature-state', 'hover'], false],\n 1,\n ['boolean', ['feature-state', 'focus'], false],\n 1,\n 0,\n];\n\nconst RGBAString = ([r, g, b, a]: RGBA, overwriteAlpha?: number) => {\n a = overwriteAlpha !== undefined ? overwriteAlpha : a;\n\n return `rgba(${r},${g},${b},${a})`;\n};\n\nconst layer = (\n map: mapboxgl.Map,\n { variant, normal, hover, minzoom, maxzoom, visibility = 'visible' }: PolygonThemeSetting,\n) => {\n // Calculate the minzoom and maxzoom when it's set. This makes sure the layer gets disabled when it's invisible.\n let layerMinzoom = minzoom ? minzoom - TRANSITION_ZOOM_MARGIN : MIN_ZOOM;\n let layerMaxzoom = maxzoom ? maxzoom + TRANSITION_ZOOM_MARGIN : MAX_ZOOM;\n\n // Limit the minzoom to 1 and the maxzoom to 24.\n if (layerMinzoom < 1) layerMinzoom = 1;\n if (layerMaxzoom > 24) layerMaxzoom = 24;\n\n if (normal.fill) {\n map.addLayer({\n id: `${variant}-fill`,\n type: 'fill',\n source: variant,\n minzoom: layerMinzoom,\n maxzoom: layerMaxzoom,\n layout: {\n visibility: visibility,\n },\n paint: {\n 'fill-color': RGBAString(normal.fill),\n 'fill-opacity': NORMAL_FEATURE_STATE,\n },\n });\n\n setTransitionPaintProperty(`${variant}-fill`, normal.fill, 'fill-color');\n }\n\n // Only add stroke layer, if it is set\n if (normal.stroke) {\n map.addLayer({\n id: `${variant}-line`,\n type: 'line',\n source: variant,\n minzoom: layerMinzoom,\n maxzoom: layerMaxzoom,\n layout: {\n visibility: 'visible',\n },\n paint: {\n 'line-color': RGBAString(normal.stroke),\n 'line-width': LINE_WIDTH,\n 'line-opacity': NORMAL_FEATURE_STATE,\n },\n });\n\n setTransitionPaintProperty(`${variant}-line`, normal.stroke, 'line-color');\n }\n\n if (hover?.fill) {\n map.addLayer({\n id: `${variant}-fill-hover`,\n type: 'fill',\n source: variant,\n minzoom: layerMinzoom,\n maxzoom: layerMaxzoom,\n layout: {\n // Make the layer visible by default.\n visibility: visibility,\n },\n paint: {\n 'fill-color': RGBAString(hover.fill),\n 'fill-opacity': HOVER_FEATURE_STATE,\n },\n });\n\n setTransitionPaintProperty(`${variant}-fill-hover`, hover.fill, 'fill-color');\n }\n\n if (hover?.stroke) {\n if (normal.stroke) {\n map.addLayer({\n id: `${variant}-line-hover`,\n type: 'line',\n source: variant,\n minzoom: layerMinzoom,\n maxzoom: layerMaxzoom,\n paint: {\n 'line-color': RGBAString(hover.stroke),\n 'line-width': LINE_WIDTH,\n 'line-opacity': HOVER_FEATURE_STATE,\n },\n });\n\n setTransitionPaintProperty(`${variant}-line-hover`, hover.stroke, 'line-color');\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 */\n function setTransitionPaintProperty(layer: string, color: RGBA, property: string) {\n if (!minzoom || !maxzoom) return;\n\n map.setPaintProperty(layer, property, [\n 'interpolate',\n ['exponential', TRANSITION_ZOOM_MARGIN],\n ['zoom'],\n minzoom - TRANSITION_ZOOM_MARGIN,\n RGBAString(color, 0),\n minzoom,\n RGBAString(color),\n maxzoom,\n RGBAString(color),\n maxzoom + TRANSITION_ZOOM_MARGIN,\n RGBAString(color, 0),\n ]);\n }\n};\n\nexport default layer;\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bpd-library/components",
3
- "version": "1.6.1-beta.0",
3
+ "version": "2.0.1-beta.0",
4
4
  "description": "Description",
5
5
  "license": "MIT",
6
6
  "types": "dist/index.d.ts",
@@ -46,14 +46,14 @@
46
46
  "publishConfig": {
47
47
  "access": "public"
48
48
  },
49
- "gitHead": "f7d82cfedf6d09801da974f7d750b8339a01d086",
49
+ "gitHead": "34a4fe7ebc5835d041ca16edc0aa84ce2bb38032",
50
50
  "dependencies": {
51
51
  "@atomify/core": "2.4.1",
52
52
  "@atomify/hooks": "1.1.11",
53
53
  "@atomify/jsx": "1.7.1",
54
54
  "@atomify/kit": "1.1.11",
55
- "@bpd-library/types": "^1.6.1-beta.0",
56
- "@bpd-library/utilities": "^1.6.1-beta.0",
55
+ "@bpd-library/types": "^2.0.1-beta.0",
56
+ "@bpd-library/utilities": "^2.0.1-beta.0",
57
57
  "@mapbox/mapbox-gl-geocoder": "^4.7.0",
58
58
  "@mapbox/mapbox-gl-language": "^0.10.1",
59
59
  "@turf/helpers": "^6.5.0",
@@ -1,9 +0,0 @@
1
- declare type Service = 'vimeo' | 'youtube' | 'mapbox';
2
- declare type Services = {
3
- vimeo: string;
4
- youtube: string;
5
- mapbox: string;
6
- };
7
- export declare const blockedServices: Services;
8
- export declare function isBlockedService(service: Service): boolean;
9
- export {};
@@ -1,9 +0,0 @@
1
- export const blockedServices = {
2
- vimeo: 'HyEX5Nidi-m',
3
- youtube: 'BJz7qNsdj-7',
4
- mapbox: 'U8QkTd2W'
5
- };
6
- export function isBlockedService(service) {
7
- return !!document.querySelector(`[pid="${blockedServices[service]}"]`);
8
- }
9
- //# sourceMappingURL=blocklist.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"blocklist.js","sourceRoot":"","sources":["../../../../src/molecules/map/utilities/blocklist.ts"],"names":[],"mappings":"AAUA,MAAM,CAAC,MAAM,eAAe,GAAa;IACrC,KAAK,EAAE,aAAa;IACpB,OAAO,EAAE,aAAa;IACtB,MAAM,EAAE,UAAU;CACrB,CAAA;AAED,MAAM,UAAU,gBAAgB,CAAC,OAAgB;IAC7C,OAAO,CAAC,CAAC,QAAQ,CAAC,aAAa,CAAC,SAAS,eAAe,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC;AAC3E,CAAC","sourcesContent":["// TODO (abo 16/1/2024) move this to a more generic place\n\ntype Service = 'vimeo' | 'youtube' | 'mapbox';\n\ntype Services = {\n vimeo: string;\n youtube: string;\n mapbox: string;\n}\n\nexport const blockedServices: Services = {\n vimeo: 'HyEX5Nidi-m',\n youtube: 'BJz7qNsdj-7',\n mapbox: 'U8QkTd2W'\n}\n\nexport function isBlockedService(service: Service) {\n return !!document.querySelector(`[pid=\"${blockedServices[service]}\"]`);\n}\n"]}