@bpd-library/components 1.3.3 → 1.3.4
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,3 +1,3 @@
|
|
|
1
1
|
import { PolygonThemeSetting } from '@bpd-library/types';
|
|
2
|
-
declare const layer: (map: mapboxgl.Map, { variant, normal, hover, minzoom, maxzoom }: PolygonThemeSetting) => void;
|
|
2
|
+
declare const layer: (map: mapboxgl.Map, { variant, normal, hover, minzoom, maxzoom, visibility }: PolygonThemeSetting) => void;
|
|
3
3
|
export default layer;
|
|
@@ -22,7 +22,7 @@ const RGBAString = ([r, g, b, a], overwriteAlpha) => {
|
|
|
22
22
|
a = overwriteAlpha !== undefined ? overwriteAlpha : a;
|
|
23
23
|
return `rgba(${r},${g},${b},${a})`;
|
|
24
24
|
};
|
|
25
|
-
const layer = (map, { variant, normal, hover, minzoom, maxzoom }) => {
|
|
25
|
+
const layer = (map, { variant, normal, hover, minzoom, maxzoom, visibility = 'visible' }) => {
|
|
26
26
|
let layerMinzoom = minzoom ? minzoom - TRANSITION_ZOOM_MARGIN : MIN_ZOOM;
|
|
27
27
|
let layerMaxzoom = maxzoom ? maxzoom + TRANSITION_ZOOM_MARGIN : MAX_ZOOM;
|
|
28
28
|
if (layerMinzoom < 1)
|
|
@@ -36,6 +36,9 @@ const layer = (map, { variant, normal, hover, minzoom, maxzoom }) => {
|
|
|
36
36
|
source: variant,
|
|
37
37
|
minzoom: layerMinzoom,
|
|
38
38
|
maxzoom: layerMaxzoom,
|
|
39
|
+
layout: {
|
|
40
|
+
visibility: visibility,
|
|
41
|
+
},
|
|
39
42
|
paint: {
|
|
40
43
|
'fill-color': RGBAString(normal.fill),
|
|
41
44
|
'fill-opacity': NORMAL_FEATURE_STATE,
|
|
@@ -50,6 +53,9 @@ const layer = (map, { variant, normal, hover, minzoom, maxzoom }) => {
|
|
|
50
53
|
source: variant,
|
|
51
54
|
minzoom: layerMinzoom,
|
|
52
55
|
maxzoom: layerMaxzoom,
|
|
56
|
+
layout: {
|
|
57
|
+
visibility: 'visible',
|
|
58
|
+
},
|
|
53
59
|
paint: {
|
|
54
60
|
'line-color': RGBAString(normal.stroke),
|
|
55
61
|
'line-width': LINE_WIDTH,
|
|
@@ -65,6 +71,9 @@ const layer = (map, { variant, normal, hover, minzoom, maxzoom }) => {
|
|
|
65
71
|
source: variant,
|
|
66
72
|
minzoom: layerMinzoom,
|
|
67
73
|
maxzoom: layerMaxzoom,
|
|
74
|
+
layout: {
|
|
75
|
+
visibility: visibility,
|
|
76
|
+
},
|
|
68
77
|
paint: {
|
|
69
78
|
'fill-color': RGBAString(hover.fill),
|
|
70
79
|
'fill-opacity': HOVER_FEATURE_STATE,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"layer.js","sourceRoot":"","sources":["../../../../../../src/molecules/map/utilities/mapbox/polygons/layer.ts"],"names":[],"mappings":"AAEA,MAAM,QAAQ,GAAG,CAAC,CAAC;AACnB,MAAM,QAAQ,GAAG,EAAE,CAAC;AACpB,MAAM,UAAU,GAAG,CAAC,CAAC;AACrB,MAAM,sBAAsB,GAAG,IAAI,CAAC;AAEpC,MAAM,oBAAoB,GAAwB;IAC9C,MAAM;IACN,CAAC,SAAS,EAAE,CAAC,eAAe,EAAE,OAAO,CAAC,EAAE,KAAK,CAAC;IAC9C,CAAC;IACD,CAAC,SAAS,EAAE,CAAC,eAAe,EAAE,OAAO,CAAC,EAAE,KAAK,CAAC;IAC9C,CAAC;IACD,CAAC;CACJ,CAAC;AAEF,MAAM,mBAAmB,GAAwB;IAC7C,MAAM;IACN,CAAC,SAAS,EAAE,CAAC,eAAe,EAAE,OAAO,CAAC,EAAE,KAAK,CAAC;IAC9C,CAAC;IACD,CAAC,SAAS,EAAE,CAAC,eAAe,EAAE,OAAO,CAAC,EAAE,KAAK,CAAC;IAC9C,CAAC;IACD,CAAC;CACJ,CAAC;AAEF,MAAM,UAAU,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAO,EAAE,cAAuB,EAAE,EAAE;IAC/D,CAAC,GAAG,cAAc,KAAK,SAAS,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC;IAEtD,OAAO,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC;AACvC,CAAC,CAAC;AAEF,MAAM,KAAK,GAAG,CACV,GAAiB,EACjB,EAAE,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,OAAO,EAAuB,
|
|
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"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@bpd-library/components",
|
|
3
|
-
"version": "1.3.
|
|
3
|
+
"version": "1.3.4",
|
|
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": "
|
|
49
|
+
"gitHead": "6c30fdc7102bf2e736581e29aec376234d2d939c",
|
|
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.3.
|
|
56
|
-
"@bpd-library/utilities": "^1.3.
|
|
55
|
+
"@bpd-library/types": "^1.3.4",
|
|
56
|
+
"@bpd-library/utilities": "^1.3.4",
|
|
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",
|