npm - @bpd-library/components - Versions diffs - 1.3.2-beta.0 → 1.3.2-beta.10 - Mend

@bpd-library/components 1.3.2-beta.0 → 1.3.2-beta.10

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.

Files changed (20) hide show

package/dist/atoms/form-elements/range-slider/range-slider.d.ts CHANGED Viewed

@@ -7,5 +7,9 @@ export interface RangeSliderProps {
     name: string;
     classes?: string;
     disabled?: boolean;
+    enableInputControls?: boolean;
+    minLabel?: Text | string;
+    maxLabel?: Text | string;
+    valuePrefix?: Text | string;
 }
-export declare const RangeSliderElement: ({ classes, disabled, min, max, increment, start, name, onChange, }: RangeSliderProps) => any;
+export declare const RangeSliderElement: ({ classes, disabled, min, max, increment, start, name, onChange, enableInputControls, minLabel, maxLabel, valuePrefix, }: RangeSliderProps) => any;

package/dist/atoms/form-elements/range-slider/range-slider.js CHANGED Viewed

@@ -1,5 +1,5 @@
-import { h } from '@atomify/jsx';
-export const RangeSliderElement = ({ classes, disabled, min, max, increment, start, name, onChange, }) => {
+import { Fragment, h } from '@atomify/jsx';
+export const RangeSliderElement = ({ classes, disabled, min, max, increment, start, name, onChange, enableInputControls, minLabel, maxLabel, valuePrefix, }) => {
     const inputClasses = {
         ['c-range-slider']: true,
         ['form__item']: true,
@@ -9,10 +9,21 @@ export const RangeSliderElement = ({ classes, disabled, min, max, increment, sta
         h("bpd-range-slider", { min: min, max: max, increment: increment, start: start, onRangeValuesChanged: onChange, class: classes },
             h("div", { class: "range-slider__container" },
                 h("div", { "js-hook-slider-container": true }),
-                h("div", { class: "range-slider__values" },
+                h("div", { class: "range-slider__values" }, enableInputControls ? (h(Fragment, null,
+                    h("div", { class: "range-slider__value-input-container" },
+                        h("span", { class: "range-slider__value-input-label" }, minLabel),
+                        h("div", { class: "range-slider__value-input-wrapper" },
+                            h("span", { class: "range-slider__value-prefix" }, valuePrefix),
+                            h("input", { type: "number", min: min, max: max, step: increment, class: "range-slider__value-input", "js-hook-slider-min": true }))),
+                    h("div", { class: "range-slider__value-input-container" },
+                        h("span", { class: "range-slider__value-input-label" }, maxLabel),
+                        h("div", { class: "range-slider__value-input-wrapper" },
+                            h("span", { class: "range-slider__value-prefix" }, valuePrefix),
+                            h("input", { type: "number", min: min, max: max, step: increment, class: "range-slider__value-input", "js-hook-slider-max": true }))),
+                    h("input", { type: "text", id: name, name: name, class: "u-sr-only", "js-hook-slider-min-max-value": true }))) : (h(Fragment, null,
                     h("span", { class: "range-slider__values-item", "js-hook-slider-min": true }),
                     h("span", { class: "range-slider__values-item", "js-hook-slider-max": true }),
                     h("input", { type: "number", id: `${name}-0`, name: name, value: start[0], "js-hook-slider-min-value": true }),
-                    h("input", { type: "number", id: `${name}-1`, name: name, value: start[1], "js-hook-slider-max-value": true }))))));
+                    h("input", { type: "number", id: `${name}-1`, name: name, value: start[1], "js-hook-slider-max-value": true }))))))));
 };
 //# sourceMappingURL=range-slider.js.map

package/dist/atoms/form-elements/range-slider/range-slider.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"range-slider.js","sourceRoot":"","sources":["../../../../src/atoms/form-elements/range-slider/range-slider.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,cAAc,CAAC;~~AAajC~~,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAAC,EAC/B,OAAO,EACP,QAAQ,EACR,GAAG,EACH,GAAG,EACH,SAAS,EACT,KAAK,EACL,IAAI,EACJ,QAAQ,~~GACO~~,EAAE,EAAE;IACnB,MAAM,YAAY,GAAG;QACjB,CAAC,gBAAgB,CAAC,EAAE,IAAI;QACxB,CAAC,YAAY,CAAC,EAAE,IAAI;QACpB,CAAC,sBAAsB,CAAC,EAAE,QAAQ;KACrC,CAAC;IAEF,OAAO,CACH,WAAK,KAAK,EAAE,YAAY;QACpB,wBACI,GAAG,EAAE,GAAG,EACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,EACZ,oBAAoB,EAAE,QAAQ,EAC9B,KAAK,EAAE,OAAO;YACd,WAAK,KAAK,EAAC,yBAAyB;gBAChC,8CAAoC;gBACpC,WAAK,KAAK,EAAC,sBAAsB;~~oBAC7B~~,YAAM,KAAK,EAAC,2BAA2B,+BAA2B;oBAClE,YAAM,KAAK,EAAC,2BAA2B,+BAA2B;oBAClE,aACI,IAAI,EAAC,QAAQ,EACb,EAAE,EAAE,GAAG,IAAI,IAAI,EACf,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC,qCAEjB;oBACF,aACI,IAAI,EAAC,QAAQ,EACb,EAAE,EAAE,GAAG,IAAI,IAAI,EACf,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC,qCAEjB,~~CACA~~,CACJ,CACS,CACjB,CACT,CAAC;AACN,CAAC,CAAC","sourcesContent":["import { h } from '@atomify/jsx';\n\nexport interface RangeSliderProps {\n min: number;\n max: number;\n increment: number;\n start: number[];\n onChange: (e: CustomEvent) => void;\n name: string;\n classes?: string;\n disabled?: boolean;\n}\n\nexport const RangeSliderElement = ({\n classes,\n disabled,\n min,\n max,\n increment,\n start,\n name,\n onChange,\n}: RangeSliderProps) => {\n const inputClasses = {\n ['c-range-slider']: true,\n ['form__item']: true,\n ['form__item--disabled']: disabled,\n };\n\n return (\n <div class={inputClasses}>\n <bpd-range-slider\n min={min}\n max={max}\n increment={increment}\n start={start}\n onRangeValuesChanged={onChange}\n class={classes}>\n <div class=\"range-slider__container\">\n <div js-hook-slider-container></div>\n <div class=\"range-slider__values\">\n <span class=\"range-slider__values-item\" js-hook-slider-min></span>\n <span class=\"range-slider__values-item\" js-hook-slider-max></span>\n <input\n type=\"number\"\n id={`${name}-0`}\n name={name}\n value={start[0]}\n js-hook-slider-min-value\n />\n <input\n type=\"number\"\n id={`${name}-1`}\n name={name}\n value={start[1]}\n js-hook-slider-max-value\n />\n </div>\n </div>\n </bpd-range-slider>\n </div>\n );\n};\n"]}
1	+ {"version":3,"file":"range-slider.js","sourceRoot":"","sources":["../../../../src/atoms/form-elements/range-slider/range-slider.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,CAAC,EAAE,MAAM,cAAc,CAAC;AAiB3C,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAAC,EAC/B,OAAO,EACP,QAAQ,EACR,GAAG,EACH,GAAG,EACH,SAAS,EACT,KAAK,EACL,IAAI,EACJ,QAAQ,EACR,mBAAmB,EACnB,QAAQ,EACR,QAAQ,EACR,WAAW,GACI,EAAE,EAAE;IACnB,MAAM,YAAY,GAAG;QACjB,CAAC,gBAAgB,CAAC,EAAE,IAAI;QACxB,CAAC,YAAY,CAAC,EAAE,IAAI;QACpB,CAAC,sBAAsB,CAAC,EAAE,QAAQ;KACrC,CAAC;IAEF,OAAO,CACH,WAAK,KAAK,EAAE,YAAY;QACpB,wBACI,GAAG,EAAE,GAAG,EACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,EACZ,oBAAoB,EAAE,QAAQ,EAC9B,KAAK,EAAE,OAAO;YACd,WAAK,KAAK,EAAC,yBAAyB;gBAChC,8CAAoC;gBACpC,WAAK,KAAK,EAAC,sBAAsB,IAC5B,mBAAmB,CAAC,CAAC,CAAC,CACnB,EAAC,QAAQ;oBACL,WAAK,KAAK,EAAC,qCAAqC;wBAC5C,YAAM,KAAK,EAAC,iCAAiC,IAAE,QAAQ,CAAQ;wBAC/D,WAAK,KAAK,EAAC,mCAAmC;4BAC1C,YAAM,KAAK,EAAC,4BAA4B,IACnC,WAAW,CACT;4BACP,aACI,IAAI,EAAC,QAAQ,EACb,GAAG,EAAE,GAAG,EACR,GAAG,EAAE,GAAG,EACR,IAAI,EAAE,SAAS,EACf,KAAK,EAAC,2BAA2B,+BAEnC,CACA,CACJ;oBACN,WAAK,KAAK,EAAC,qCAAqC;wBAC5C,YAAM,KAAK,EAAC,iCAAiC,IAAE,QAAQ,CAAQ;wBAC/D,WAAK,KAAK,EAAC,mCAAmC;4BAC1C,YAAM,KAAK,EAAC,4BAA4B,IACnC,WAAW,CACT;4BACP,aACI,IAAI,EAAC,QAAQ,EACb,GAAG,EAAE,GAAG,EACR,GAAG,EAAE,GAAG,EACR,IAAI,EAAE,SAAS,EACf,KAAK,EAAC,2BAA2B,+BAEnC,CACA,CACJ;oBACN,aACI,IAAI,EAAC,MAAM,EACX,EAAE,EAAE,IAAI,EACR,IAAI,EAAE,IAAI,EACV,KAAK,EAAC,WAAW,yCAEnB,CACK,CACd,CAAC,CAAC,CAAC,CACA,EAAC,QAAQ;oBACL,YAAM,KAAK,EAAC,2BAA2B,+BAA2B;oBAClE,YAAM,KAAK,EAAC,2BAA2B,+BAA2B;oBAClE,aACI,IAAI,EAAC,QAAQ,EACb,EAAE,EAAE,GAAG,IAAI,IAAI,EACf,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC,qCAEjB;oBACF,aACI,IAAI,EAAC,QAAQ,EACb,EAAE,EAAE,GAAG,IAAI,IAAI,EACf,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC,qCAEjB,CACK,CACd,CACC,CACJ,CACS,CACjB,CACT,CAAC;AACN,CAAC,CAAC","sourcesContent":["import { Fragment, h } from '@atomify/jsx';\n\nexport interface RangeSliderProps {\n min: number;\n max: number;\n increment: number;\n start: number[];\n onChange: (e: CustomEvent) => void;\n name: string;\n classes?: string;\n disabled?: boolean;\n enableInputControls?: boolean;\n minLabel?: Text \| string;\n maxLabel?: Text \| string;\n valuePrefix?: Text \| string;\n}\n\nexport const RangeSliderElement = ({\n classes,\n disabled,\n min,\n max,\n increment,\n start,\n name,\n onChange,\n enableInputControls,\n minLabel,\n maxLabel,\n valuePrefix,\n}: RangeSliderProps) => {\n const inputClasses = {\n ['c-range-slider']: true,\n ['form__item']: true,\n ['form__item--disabled']: disabled,\n };\n\n return (\n <div class={inputClasses}>\n <bpd-range-slider\n min={min}\n max={max}\n increment={increment}\n start={start}\n onRangeValuesChanged={onChange}\n class={classes}>\n <div class=\"range-slider__container\">\n <div js-hook-slider-container></div>\n <div class=\"range-slider__values\">\n {enableInputControls ? (\n <Fragment>\n <div class=\"range-slider__value-input-container\">\n <span class=\"range-slider__value-input-label\">{minLabel}</span>\n <div class=\"range-slider__value-input-wrapper\">\n <span class=\"range-slider__value-prefix\">\n {valuePrefix}\n </span>\n <input\n type=\"number\"\n min={min}\n max={max}\n step={increment}\n class=\"range-slider__value-input\"\n js-hook-slider-min\n />\n </div>\n </div>\n <div class=\"range-slider__value-input-container\">\n <span class=\"range-slider__value-input-label\">{maxLabel}</span>\n <div class=\"range-slider__value-input-wrapper\">\n <span class=\"range-slider__value-prefix\">\n {valuePrefix}\n </span>\n <input\n type=\"number\"\n min={min}\n max={max}\n step={increment}\n class=\"range-slider__value-input\"\n js-hook-slider-max\n />\n </div>\n </div>\n <input\n type=\"text\"\n id={name}\n name={name}\n class=\"u-sr-only\"\n js-hook-slider-min-max-value\n />\n </Fragment>\n ) : (\n <Fragment>\n <span class=\"range-slider__values-item\" js-hook-slider-min></span>\n <span class=\"range-slider__values-item\" js-hook-slider-max></span>\n <input\n type=\"number\"\n id={`${name}-0`}\n name={name}\n value={start[0]}\n js-hook-slider-min-value\n />\n <input\n type=\"number\"\n id={`${name}-1`}\n name={name}\n value={start[1]}\n js-hook-slider-max-value\n />\n </Fragment>\n )}\n </div>\n </div>\n </bpd-range-slider>\n </div>\n );\n};\n"]}

package/dist/atoms/form-elements/utilities/range-slider.d.ts CHANGED Viewed

@@ -3,5 +3,6 @@ export interface BPDRange extends Component {
     bindValue: number[];
     start: number[];
     resetState: () => void;
+    setValues: (minValue: number, maxValue: number) => void;
 }
 export declare const RangeSlider: FC<BPDRange>;

package/dist/atoms/form-elements/utilities/range-slider.js CHANGED Viewed

@@ -1,6 +1,7 @@
-import { defineElement, onDidLoad, useBindMethod, useElement, useEvent, useProp, } from '@atomify/hooks';
+import { defineElement, onDidLoad, useBindMethod, useElement, useEvent, useListen, useProp, } from '@atomify/hooks';
 import { toCurrency } from '@bpd-library/utilities';
 import noUiSlider from 'nouislider';
+const formatValue = (value) => toCurrency(value).replace(',', '.');
 export const RangeSlider = ({ element }) => {
     const [min] = useProp('min', 0);
     const [max] = useProp('max', 0);
@@ -13,9 +14,31 @@ export const RangeSlider = ({ element }) => {
     const sliderMax = useElement('[js-hook-slider-max]');
     const sliderMinValue = useElement('[js-hook-slider-min-value]');
     const sliderMaxValue = useElement('[js-hook-slider-max-value]');
+    const sliderMinMaxInput = useElement('[js-hook-slider-min-max-value]');
     const rangeValuesChanged = useEvent({ eventName: 'rangevalueschanged' });
     useBindMethod('resetState', resetState);
+    useBindMethod('setValues', (minValue, maxValue) => {
+        var _a;
+        if (sliderMinValue.current && sliderMaxValue.current) {
+            sliderMinValue.current.value = `${minValue}`;
+            sliderMaxValue.current.value = `${maxValue}`;
+            sliderMinValue.current.checked = true;
+            sliderMaxValue.current.checked = true;
+            sliderMin.current.innerHTML = formatValue(minValue);
+            sliderMax.current.innerHTML = formatValue(maxValue);
+        }
+        if (sliderMinMaxInput.current) {
+            sliderMinMaxInput.current.value = `${minValue},${maxValue}`;
+            sliderMinMaxInput.current.checked = true;
+        }
+        (_a = sliderContainer.current) === null || _a === void 0 ? void 0 : _a.noUiSlider.updateOptions({
+            start: [Number(minValue), Number(maxValue)],
+        });
+    });
+    useListen(sliderMin, 'change', changeValuesManually);
+    useListen(sliderMax, 'change', changeValuesManually);
     onDidLoad(() => {
+        var _a, _b;
         const hasZeroValues = element.start.every((item) => item === 0);
         const settings = {
             start: hasZeroValues ? [min, max] : element.start,
@@ -28,27 +51,55 @@ export const RangeSlider = ({ element }) => {
             },
         };
         noUiSlider.create(sliderContainer.current, settings);
-        sliderContainer.current.noUiSlider.on('update', (values) => {
+        (_a = sliderContainer.current) === null || _a === void 0 ? void 0 : _a.noUiSlider.on('update', (values) => {
             const generatedValues = values.map((value) => parseInt(value));
             setStart([...generatedValues]);
         });
-        sliderContainer.current.noUiSlider.on('change', onChangeHandler);
+        (_b = sliderContainer.current) === null || _b === void 0 ? void 0 : _b.noUiSlider.on('change', () => onChangeHandler('slider'));
         setMinMaxValues();
     });
     watchStart(setMinMaxValues);
+    function changeValuesManually() {
+        var _a, _b, _c;
+        const currSliderMin = Number((_a = sliderMin.current) === null || _a === void 0 ? void 0 : _a.value);
+        const currSliderMax = Number((_b = sliderMax.current) === null || _b === void 0 ? void 0 : _b.value);
+        setStart([currSliderMin, currSliderMax]);
+        setMinMaxValues();
+        onChangeHandler('input');
+        (_c = sliderContainer.current) === null || _c === void 0 ? void 0 : _c.noUiSlider.updateOptions({
+            start: [currSliderMin, currSliderMax],
+        });
+    }
     function setMinMaxValues() {
         const { minValue, maxValue } = getValues();
-        sliderMin.current.innerHTML = `${toCurrency(minValue)}`.replace(',', '.');
-        sliderMax.current.innerHTML = `${toCurrency(maxValue)}`.replace(',', '.');
+        if (sliderMinMaxInput.current) {
+            sliderMin.current.value = `${minValue}`;
+            sliderMax.current.value = `${maxValue}`;
+        }
+        else {
+            sliderMin.current.innerHTML = formatValue(minValue);
+            sliderMax.current.innerHTML = formatValue(maxValue);
+        }
     }
-    function onChangeHandler() {
+    function onChangeHandler(rangeOrigin) {
         const { minValue, maxValue } = getValues();
-        sliderMinValue.current.value = `${minValue}`;
-        sliderMaxValue.current.value = `${maxValue}`;
-        sliderMinValue.current.checked = true;
-        sliderMaxValue.current.checked = true;
-        sliderMinValue.current.dispatchEvent(new Event('change'));
-        sliderMaxValue.current.dispatchEvent(new Event('change'));
+        if (sliderMinValue.current && sliderMaxValue.current) {
+            sliderMinValue.current.value = `${minValue}`;
+            sliderMaxValue.current.value = `${maxValue}`;
+            sliderMinValue.current.checked = true;
+            sliderMaxValue.current.checked = true;
+            sliderMin.current.innerHTML = formatValue(minValue);
+            sliderMax.current.innerHTML = formatValue(maxValue);
+            sliderMinValue.current.dispatchEvent(new Event('change'));
+            sliderMaxValue.current.dispatchEvent(new Event('change'));
+        }
+        if (sliderMinMaxInput.current) {
+            sliderMinMaxInput.current.value = `${minValue},${maxValue}`;
+            sliderMinMaxInput.current.checked = true;
+            if (rangeOrigin === 'slider') {
+                sliderMinMaxInput.current.dispatchEvent(new Event('change', { bubbles: true }));
+            }
+        }
         rangeValuesChanged.emit({ minValue, maxValue, hasChanged });
     }
     function getValues() {
@@ -63,8 +114,9 @@ export const RangeSlider = ({ element }) => {
         };
     }
     function resetState() {
-        sliderContainer.current.noUiSlider.set([min, max]);
-        setStart([0, 0]);
+        var _a;
+        (_a = sliderContainer.current) === null || _a === void 0 ? void 0 : _a.noUiSlider.set([min, max]);
+        setStart([min, max]);
         setHasChanged(false);
     }
 };

package/dist/atoms/form-elements/utilities/range-slider.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"range-slider.js","sourceRoot":"","sources":["../../../../src/atoms/form-elements/utilities/range-slider.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n defineElement,\n FC,\n onDidLoad,\n useBindMethod,\n useElement,\n useEvent,\n useProp,\n} from '@atomify/hooks';\nimport { toCurrency } from '@bpd-library/utilities';\nimport noUiSlider from 'nouislider';\n\nexport interface BPDRange extends Component {\n bindValue: number[];\n start: number[];\n resetState: () => void;\n}\n\nexport const RangeSlider: FC<BPDRange> = ({ element }) => {\n const [min] = useProp<number>('min', 0);\n const [max] = useProp<number>('max', 0);\n const [increment] = useProp<number>('increment', 0);\n const [hasChanged, setHasChanged] = useProp<boolean>('hasChanged', false);\n const [, setStart, watchStart] = useProp<number[]>('start', [0, 0]);\n const [, setBindValue] = useProp<number[]>('bindValue', [0, 0]);\n\n const sliderContainer = useElement<HTMLDivElement>('[js-hook-slider-container]');\n const sliderMin = useElement<HTMLDivElement>('[js-hook-slider-min]');\n const sliderMax = useElement<HTMLDivElement>('[js-hook-slider-max]');\n const sliderMinValue = useElement<HTMLInputElement>('[js-hook-slider-min-value]');\n const sliderMaxValue = useElement<HTMLInputElement>('[js-hook-slider-max-value]');\n\n const rangeValuesChanged = useEvent({ eventName: 'rangevalueschanged' });\n\n useBindMethod('resetState', resetState);\n\n onDidLoad(() => {\n const hasZeroValues = element.start.every((item) => item === 0);\n\n const settings = {\n start: hasZeroValues ? [min, max] : element.start,\n step: increment,\n connect: true,\n documentElement: sliderContainer.current,\n range: {\n min,\n max,\n },\n };\n\n noUiSlider.create(sliderContainer.current!, settings);\n\n (sliderContainer.current as any).noUiSlider.on('update', (values: string[]) => {\n const generatedValues = values.map((value) => parseInt(value));\n setStart([...generatedValues]);\n });\n\n (sliderContainer.current as any).noUiSlider.on('change', onChangeHandler);\n\n setMinMaxValues();\n });\n\n watchStart(setMinMaxValues);\n\n function setMinMaxValues() {\n const { minValue, maxValue } = getValues();\n\n sliderMin.current!.innerHTML = `${toCurrency(minValue)}`.replace(',', '.');\n sliderMax.current!.innerHTML = `${toCurrency(maxValue)}`.replace(',', '.');\n }\n\n function onChangeHandler() {\n const { minValue, maxValue } = getValues();\n\n sliderMinValue.current!.value = `${minValue}`;\n sliderMaxValue.current!.value = `${maxValue}`;\n\n sliderMinValue.current!.checked = true;\n sliderMaxValue.current!.checked = true;\n\n sliderMinValue.current!.dispatchEvent(new Event('change'));\n sliderMaxValue.current!.dispatchEvent(new Event('change'));\n\n rangeValuesChanged.emit({ minValue, maxValue, hasChanged });\n }\n\n function getValues() {\n const hasZeroValues = element.start.every((item) => item === 0);\n const minValue = hasZeroValues ? min : element.start[0];\n const maxValue = hasZeroValues ? max : element.start[1];\n\n setBindValue(element.start);\n setHasChanged(JSON.stringify(element.start) !== JSON.stringify([min, max]));\n\n return {\n minValue,\n maxValue,\n };\n }\n\n function resetState() {\n (sliderContainer.current as any).noUiSlider.set([min, max]);\n setStart([0, 0]);\n setHasChanged(false);\n }\n};\n\nRangeSlider.props = {\n min: {\n type: Number,\n reflectToAttr: true,\n },\n max: {\n type: Number,\n reflectToAttr: true,\n },\n increment: {\n type: Number,\n reflectToAttr: true,\n },\n hasChanged: {\n type: Boolean,\n reflectToAttr: true,\n },\n start: {\n type: Array,\n reflectToAttr: true,\n },\n bindValue: {\n type: Array,\n },\n};\n\ndefineElement('bpd-range-slider', RangeSlider);\n"]}
1	+ {"version":3,"file":"range-slider.js","sourceRoot":"","sources":["../../../../src/atoms/form-elements/utilities/range-slider.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n defineElement,\n FC,\n onDidLoad,\n useBindMethod,\n useElement,\n useEvent,\n useListen,\n useProp,\n} from '@atomify/hooks';\nimport { toCurrency } from '@bpd-library/utilities';\nimport noUiSlider, { noUiSlider as NoUiSlider } from 'nouislider';\n\nexport interface BPDRange extends Component {\n bindValue: number[];\n start: number[];\n resetState: () => void;\n setValues: (minValue: number, maxValue: number) => void;\n}\n\ninterface SliderContainer extends HTMLDivElement {\n noUiSlider: NoUiSlider;\n}\n\nconst formatValue = (value: number) => toCurrency(value).replace(',', '.');\n\nexport const RangeSlider: FC<BPDRange> = ({ element }) => {\n const [min] = useProp<number>('min', 0);\n const [max] = useProp<number>('max', 0);\n const [increment] = useProp<number>('increment', 0);\n const [hasChanged, setHasChanged] = useProp<boolean>('hasChanged', false);\n const [, setStart, watchStart] = useProp<number[]>('start', [0, 0]);\n const [, setBindValue] = useProp<number[]>('bindValue', [0, 0]);\n\n const sliderContainer = useElement<SliderContainer>('[js-hook-slider-container]');\n const sliderMin = useElement<HTMLInputElement \| HTMLSpanElement>('[js-hook-slider-min]');\n const sliderMax = useElement<HTMLInputElement \| HTMLSpanElement>('[js-hook-slider-max]');\n const sliderMinValue = useElement<HTMLInputElement>('[js-hook-slider-min-value]');\n const sliderMaxValue = useElement<HTMLInputElement>('[js-hook-slider-max-value]');\n const sliderMinMaxInput = useElement<HTMLInputElement>('[js-hook-slider-min-max-value]');\n\n const rangeValuesChanged = useEvent({ eventName: 'rangevalueschanged' });\n\n useBindMethod('resetState', resetState);\n useBindMethod('setValues', (minValue, maxValue) => {\n if (sliderMinValue.current && sliderMaxValue.current) {\n sliderMinValue.current.value = `${minValue}`;\n sliderMaxValue.current.value = `${maxValue}`;\n sliderMinValue.current.checked = true;\n sliderMaxValue.current.checked = true;\n (sliderMin.current as HTMLSpanElement)!.innerHTML = formatValue(minValue);\n (sliderMax.current as HTMLSpanElement)!.innerHTML = formatValue(maxValue);\n }\n\n if (sliderMinMaxInput.current) {\n sliderMinMaxInput.current.value = `${minValue},${maxValue}`;\n sliderMinMaxInput.current.checked = true;\n }\n\n sliderContainer.current?.noUiSlider.updateOptions({\n start: [Number(minValue), Number(maxValue)],\n });\n });\n useListen(sliderMin, 'change', changeValuesManually);\n useListen(sliderMax, 'change', changeValuesManually);\n\n onDidLoad(() => {\n const hasZeroValues = element.start.every((item) => item === 0);\n\n const settings = {\n start: hasZeroValues ? [min, max] : element.start,\n step: increment,\n connect: true,\n documentElement: sliderContainer.current,\n range: {\n min,\n max,\n },\n };\n\n noUiSlider.create(sliderContainer.current!, settings);\n\n sliderContainer.current?.noUiSlider.on('update', (values: string[]) => {\n const generatedValues = values.map((value) => parseInt(value));\n setStart([...generatedValues]);\n });\n\n sliderContainer.current?.noUiSlider.on('change', () => onChangeHandler('slider'));\n\n setMinMaxValues();\n });\n\n watchStart(setMinMaxValues);\n\n function changeValuesManually() {\n const currSliderMin = Number((sliderMin.current as HTMLInputElement)?.value);\n const currSliderMax = Number((sliderMax.current as HTMLInputElement)?.value);\n\n setStart([currSliderMin, currSliderMax]);\n setMinMaxValues();\n onChangeHandler('input');\n sliderContainer.current?.noUiSlider.updateOptions({\n start: [currSliderMin, currSliderMax],\n });\n }\n\n function setMinMaxValues() {\n const { minValue, maxValue } = getValues();\n\n if (sliderMinMaxInput.current) {\n (sliderMin.current as HTMLInputElement).value = `${minValue}`;\n (sliderMax.current as HTMLInputElement).value = `${maxValue}`;\n } else {\n (sliderMin.current as HTMLSpanElement)!.innerHTML = formatValue(minValue);\n (sliderMax.current as HTMLSpanElement)!.innerHTML = formatValue(maxValue);\n }\n }\n\n function onChangeHandler(rangeOrigin?: 'slider' \| 'input') {\n const { minValue, maxValue } = getValues();\n\n if (sliderMinValue.current && sliderMaxValue.current) {\n sliderMinValue.current.value = `${minValue}`;\n sliderMaxValue.current.value = `${maxValue}`;\n sliderMinValue.current.checked = true;\n sliderMaxValue.current.checked = true;\n (sliderMin.current as HTMLSpanElement)!.innerHTML = formatValue(minValue);\n (sliderMax.current as HTMLSpanElement)!.innerHTML = formatValue(maxValue);\n\n sliderMinValue.current!.dispatchEvent(new Event('change'));\n sliderMaxValue.current!.dispatchEvent(new Event('change'));\n }\n\n if (sliderMinMaxInput.current) {\n sliderMinMaxInput.current.value = `${minValue},${maxValue}`;\n sliderMinMaxInput.current.checked = true;\n\n if (rangeOrigin === 'slider') {\n sliderMinMaxInput.current.dispatchEvent(new Event('change', { bubbles: true }));\n }\n }\n\n rangeValuesChanged.emit({ minValue, maxValue, hasChanged });\n }\n\n function getValues() {\n const hasZeroValues = element.start.every((item) => item === 0);\n const minValue = hasZeroValues ? min : element.start[0];\n const maxValue = hasZeroValues ? max : element.start[1];\n\n setBindValue(element.start);\n setHasChanged(JSON.stringify(element.start) !== JSON.stringify([min, max]));\n\n return {\n minValue,\n maxValue,\n };\n }\n\n function resetState() {\n sliderContainer.current?.noUiSlider.set([min, max]);\n setStart([min, max]);\n setHasChanged(false);\n }\n};\n\nRangeSlider.props = {\n min: {\n type: Number,\n reflectToAttr: true,\n },\n max: {\n type: Number,\n reflectToAttr: true,\n },\n increment: {\n type: Number,\n reflectToAttr: true,\n },\n hasChanged: {\n type: Boolean,\n reflectToAttr: true,\n },\n start: {\n type: Array,\n reflectToAttr: true,\n },\n bindValue: {\n type: Array,\n },\n};\n\ndefineElement('bpd-range-slider', RangeSlider);\n"]}

package/dist/molecules/map/index.d.ts CHANGED Viewed

@@ -1,3 +1,4 @@
 export * from './utilities/fit-bounds';
+export { setDefaultKmPadding } from './utilities/mapbox/search/search';
 export * from './store';
 export * from './hooks';

package/dist/molecules/map/index.js CHANGED Viewed

@@ -1,4 +1,5 @@
 export * from './utilities/fit-bounds';
+export { setDefaultKmPadding } from './utilities/mapbox/search/search';
 export * from './store';
 export * from './hooks';
 //# sourceMappingURL=index.js.map

package/dist/molecules/map/index.js.map CHANGED Viewed

	@@ -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"]}

package/dist/molecules/map/map.js CHANGED Viewed

@@ -4,7 +4,7 @@ import { calculateMapDataBoundingBox, calculateMapDataCenter, environmentDetails
 import MapboxLanguage from '@mapbox/mapbox-gl-language';
 import mapboxgl from 'mapbox-gl';
 import { Infobox } from '../infobox';
-import { clearHover, mapStore, setMapInstance } from './store';
+import { clearHover, mapStore, setMapInstance, setZoom } from './store';
 import mapbox from './utilities/mapbox';
 const MOBILE_TOGGLE_CLASS = 'map--mobile-toggle';
 const MAP_HOVERING_CLASS = 'map--hovering';
@@ -47,7 +47,6 @@ const Map = ({ element }) => {
         mapStore.subscribe(handleFocus, ['focus']);
         mapStore.subscribe(handleIsochrone, ['isochroneSetting']);
         mapStore.subscribe(handleDirections, ['directionsSetting']);
-        mapStore.subscribe(({ filter, data }) => addData(filter ? filter : data), ['filter']);
         mapStore.subscribe(({ layerRasterSettings }) => layerRasterSettings && mapboxHelpers.raster(layerRasterSettings), ['layerRasterSettings']);
     }
     function handleHover({ hover }) {
@@ -205,9 +204,15 @@ const Map = ({ element }) => {
         h("div", { class: "c-map" },
             h("div", { className: "map__container", "js-hook-map-container": true },
                 options.zoomButtons && (h("div", { class: "map__navigation" },
-                    h("button", { class: "map__button", onClick: () => map.zoomIn() },
+                    h("button", { class: "map__button", onClick: () => {
+                            map.zoomIn();
+                            setZoom(map.getZoom());
+                        } },
                         h("bpd-svg", { name: "icons-plus" })),
-                    h("button", { class: "map__button", onClick: () => map.zoomOut() },
+                    h("button", { class: "map__button", onClick: () => {
+                            map.zoomOut();
+                            setZoom(map.getZoom());
+                        } },
                         h("span", { class: "map__minus" })))),
                 h("div", { class: "map__infobox-wrapper", "js-hook-infobox-wrapper": true })))));
 };

package/dist/molecules/map/map.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"map.js","sourceRoot":"","sources":["../../../src/molecules/map/map.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n defineElement,\n FC,\n onDidLoad,\n useBindMethod,\n useElement,\n useProp,\n} from '@atomify/hooks';\nimport { Fragment, h } from '@atomify/jsx';\nimport { MapInfobox, MapOptions, MapSearchOptions, MapTheme } from '@bpd-library/types';\nimport {\n calculateMapDataBoundingBox,\n calculateMapDataCenter,\n environmentDetails,\n expandBoundingBox,\n functionIsTrue,\n getCountryBoundingBox,\n} from '@bpd-library/utilities';\nimport MapboxLanguage from '@mapbox/mapbox-gl-language';\nimport mapboxgl from 'mapbox-gl';\n\nimport { Infobox } from '../infobox';\nimport { clearHover, MapState, mapStore, setMapInstance } from './store';\nimport mapbox from './utilities/mapbox';\n\nconst MOBILE_TOGGLE_CLASS = 'map--mobile-toggle';\nconst MAP_HOVERING_CLASS = 'map--hovering';\nconst POINTER_FOCUS_CLASS = 'map__pointer--focus';\n\nexport interface MapProps extends Component {\n pointerExists: (id: string) => boolean;\n}\n\nconst Map: FC<MapProps> = ({ element }) => {\n const DEFAULT_OPTIONS: MapOptions = {\n zoomButtons: true,\n mobileToggle: false,\n openInTab: false,\n autoOpenUrl: true,\n language: environmentDetails.languageIsoCode \|\| 'nl',\n searchCountryIsoCodes: ['nl', 'de'],\n };\n\n let [options] = useProp<MapOptions>('options', {});\n const [theme] = useProp<MapTheme>('theme');\n const container = useElement<HTMLDivElement>('[js-hook-map-container]');\n const infoboxWrapper = useElement<HTMLDivElement>('[js-hook-infobox-wrapper]');\n\n let map: mapboxgl.Map;\n let mapboxHelpers: ReturnType<typeof mapbox>;\n\n useBindMethod('pointerExists', pointerExists);\n\n onDidLoad(async () => {\n if (options.mobileToggle) element.classList.add(MOBILE_TOGGLE_CLASS);\n options = { ...DEFAULT_OPTIONS, ...options };\n\n map = createMapboxInstance();\n mapboxHelpers = mapbox(map, options, theme);\n setMapInstance(map);\n\n await setupMapbox();\n\n subscribe();\n\n if (options.search)\n options.search.forEach((e: MapSearchOptions) => mapboxHelpers.search(e));\n });\n\n function subscribe() {\n const { filter, data } = mapStore.getState();\n const { addData } = mapboxHelpers;\n\n addData(filter ? filter : data);\n\n mapStore.subscribe(({ data }) => addData(data), ['data']);\n mapStore.subscribe(handleHover, ['hover']);\n mapStore.subscribe(handleClick, ['click']);\n mapStore.subscribe(handleFocus, ['focus']);\n mapStore.subscribe(handleIsochrone, ['isochroneSetting']);\n mapStore.subscribe(handleDirections, ['directionsSetting']);\n mapStore.subscribe(({ filter, data }) => addData(filter ? filter : data), ['filter']);\n mapStore.subscribe(\n ({ layerRasterSettings }) =>\n layerRasterSettings && mapboxHelpers.raster(layerRasterSettings),\n ['layerRasterSettings'],\n );\n }\n\n function handleHover({ hover }: MapState) {\n const { current, previous } = hover;\n const canvasStyle = map.getCanvas().style;\n const { setFeatureState } = mapboxHelpers;\n\n /\n Set hover state\n /\n if (hasHoverTheme()) {\n if (current) setFeatureState(current.variant, current.id, 'hover', true);\n if (previous) setFeatureState(previous.variant, previous.id, 'hover', false);\n }\n\n canvasStyle.cursor = current ? 'pointer' : '';\n }\n\n function handleClick({ click }: MapState) {\n if (!click) return;\n\n const { infobox } = click;\n\n clearHover();\n\n if (infobox) {\n showInfobox(infobox);\n } else {\n clearInfobox();\n }\n }\n\n function handleFocus({ focus }: MapState) {\n const { current, previous, options } = focus;\n const { setFeatureState, center } = mapboxHelpers;\n\n if (previous) {\n previous.forEach(({ id, variant }) => {\n if (hasHoverTheme()) setFeatureState(variant, id, 'focus', false);\n pointerFocusToggle(id, 'remove');\n });\n }\n\n if (current) {\n current.forEach((item) => {\n const { variant, id } = item;\n\n if (theme.polygon) {\n if (hasHoverTheme()) setFeatureState(variant, id, 'focus', true);\n }\n });\n\n if (options?.zoom) {\n let bounds = calculateMapDataBoundingBox(current);\n bounds = expandBoundingBox(bounds, 0.05);\n\n map.fitBounds(bounds);\n } else if (!options?.static) {\n center([[calculateMapDataCenter(current)]]);\n }\n }\n }\n\n function handleIsochrone({ isochroneSetting }: MapState) {\n const { removeIsochrone, addIsochrone } = mapboxHelpers;\n\n if (isochroneSetting) {\n addIsochrone(isochroneSetting);\n } else {\n removeIsochrone();\n }\n }\n\n function handleDirections({ directionsSetting }: MapState) {\n const { addDirections, removeDirections } = mapboxHelpers;\n\n if (directionsSetting) {\n addDirections(directionsSetting);\n } else {\n removeDirections();\n }\n }\n\n function pointerFocusToggle(id: string, action: 'add' \| 'remove') {\n const pointer = getPointerElementById(id);\n\n if (pointer) {\n pointer.classList[action](POINTER_FOCUS_CLASS);\n element.classList[action](MAP_HOVERING_CLASS);\n }\n }\n\n function showInfobox(infobox: MapInfobox) {\n clearInfobox();\n infoboxWrapper.current!.appendChild(\n <Infobox {...infobox} onClose={clearInfobox} openInTab={options.openInTab} />,\n );\n }\n\n function clearInfobox() {\n infoboxWrapper.current!.innerHTML = '';\n }\n\n function hasHoverTheme() {\n return theme.polygon && theme.polygon.settings[0].hover;\n }\n\n function createMapboxInstance() {\n mapboxgl.accessToken = environmentDetails.mapboxAccessToken \|\| '';\n\n const mapboxOptions: mapboxgl.MapboxOptions = {\n container: container.current!,\n style: `mapbox://styles/${environmentDetails.mapboxStyle}`,\n minZoom: 4,\n maxZoom: 30,\n dragPan: true,\n scrollZoom: false,\n };\n\n if (options.center) mapboxOptions.center = options.center;\n if (options.zoom) mapboxOptions.zoom = options.zoom;\n if (options.boundingBox) mapboxOptions.bounds = options.boundingBox;\n\n if (!options.zoom && !options.center && !options.boundingBox) {\n mapboxOptions.bounds = getCountryBoundingBox(['nl']);\n }\n\n return new mapboxgl.Map(mapboxOptions);\n }\n\n function getMapboxLanguageString(): string {\n let language: string \| undefined;\n\n // If language could be nl-NL etc., make sure to strip first two characters\n if (options.language) {\n language = options.language.substr(0, 2);\n }\n\n // nl is not supported, use multilanguage instead\n language = !language \|\| language === 'nl' ? 'mul' : language;\n\n return language;\n }\n\n async function setupMapbox() {\n const { raster, geojson, layer, interaction, setupPointers } = mapboxHelpers;\n\n await functionIsTrue(() => map.isStyleLoaded());\n\n // Setup Mapbox Language\n const languageControl = new MapboxLanguage({\n defaultLanguage: getMapboxLanguageString(),\n });\n map.addControl(languageControl);\n\n // Setup Layer Raster\n // Layer raster can be set via the store and options attribute\n const optionsLayerRaster = options.layerRaster\n ? { layerRaster: options.layerRaster }\n : undefined;\n const storeLayerRaster = mapStore.getState().layerRasterSettings;\n\n if (optionsLayerRaster) {\n raster(optionsLayerRaster);\n } else if (storeLayerRaster) {\n raster(storeLayerRaster);\n }\n\n // Setup in case of polygons\n if (theme.polygon) {\n theme.polygon.settings.forEach((setting) => {\n geojson(setting);\n layer(setting);\n interaction(setting);\n });\n }\n\n // Setup in case of pointers\n if (theme.pointer) {\n setupPointers(element);\n }\n\n map.resize();\n }\n\n function getPointerElementById(id: string) {\n return element.querySelector(`#pointer-${id}`);\n }\n\n function pointerExists(id: string) {\n return !!getPointerElementById(id);\n }\n\n return (\n <Fragment>\n <div class=\"c-map\">\n <div className=\"map__container\" js-hook-map-container>\n {options.zoomButtons && (\n <div class=\"map__navigation\">\n <button class=\"map__button\" onClick={() => map.zoomIn()}>\n <bpd-svg name=\"icons-plus\"></bpd-svg>\n </button>\n <button class=\"map__button\" onClick={() => map.zoomOut()}>\n <span class=\"map__minus\"></span>\n </button>\n </div>\n )}\n\n <div class=\"map__infobox-wrapper\" js-hook-infobox-wrapper></div>\n </div>\n </div>\n </Fragment>\n );\n};\n\nMap.props = {\n options: {\n type: Object,\n },\n theme: {\n type: Object,\n required: true,\n },\n zoomButtons: {\n type: Boolean,\n },\n};\n\ndefineElement('bpd-map', Map);\n"]}
1	+ {"version":3,"file":"map.js","sourceRoot":"","sources":["../../../src/molecules/map/map.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n defineElement,\n FC,\n onDidLoad,\n useBindMethod,\n useElement,\n useProp,\n} from '@atomify/hooks';\nimport { Fragment, h } from '@atomify/jsx';\nimport { MapInfobox, MapOptions, MapSearchOptions, MapTheme } from '@bpd-library/types';\nimport {\n calculateMapDataBoundingBox,\n calculateMapDataCenter,\n environmentDetails,\n expandBoundingBox,\n functionIsTrue,\n getCountryBoundingBox,\n} from '@bpd-library/utilities';\nimport MapboxLanguage from '@mapbox/mapbox-gl-language';\nimport mapboxgl from 'mapbox-gl';\n\nimport { Infobox } from '../infobox';\nimport { clearHover, MapState, mapStore, setMapInstance, setZoom } from './store';\nimport mapbox from './utilities/mapbox';\n\nconst MOBILE_TOGGLE_CLASS = 'map--mobile-toggle';\nconst MAP_HOVERING_CLASS = 'map--hovering';\nconst POINTER_FOCUS_CLASS = 'map__pointer--focus';\n\nexport interface MapProps extends Component {\n pointerExists: (id: string) => boolean;\n}\n\nconst Map: FC<MapProps> = ({ element }) => {\n const DEFAULT_OPTIONS: MapOptions = {\n zoomButtons: true,\n mobileToggle: false,\n openInTab: false,\n autoOpenUrl: true,\n language: environmentDetails.languageIsoCode \|\| 'nl',\n searchCountryIsoCodes: ['nl', 'de'],\n };\n\n let [options] = useProp<MapOptions>('options', {});\n const [theme] = useProp<MapTheme>('theme');\n const container = useElement<HTMLDivElement>('[js-hook-map-container]');\n const infoboxWrapper = useElement<HTMLDivElement>('[js-hook-infobox-wrapper]');\n\n let map: mapboxgl.Map;\n let mapboxHelpers: ReturnType<typeof mapbox>;\n\n useBindMethod('pointerExists', pointerExists);\n\n onDidLoad(async () => {\n if (options.mobileToggle) element.classList.add(MOBILE_TOGGLE_CLASS);\n options = { ...DEFAULT_OPTIONS, ...options };\n\n map = createMapboxInstance();\n mapboxHelpers = mapbox(map, options, theme);\n setMapInstance(map);\n\n await setupMapbox();\n\n subscribe();\n\n if (options.search)\n options.search.forEach((e: MapSearchOptions) => mapboxHelpers.search(e));\n });\n\n function subscribe() {\n const { filter, data } = mapStore.getState();\n const { addData } = mapboxHelpers;\n\n addData(filter ? filter : data);\n\n mapStore.subscribe(({ data }) => addData(data), ['data']);\n mapStore.subscribe(handleHover, ['hover']);\n mapStore.subscribe(handleClick, ['click']);\n mapStore.subscribe(handleFocus, ['focus']);\n mapStore.subscribe(handleIsochrone, ['isochroneSetting']);\n mapStore.subscribe(handleDirections, ['directionsSetting']);\n\n mapStore.subscribe(\n ({ layerRasterSettings }) =>\n layerRasterSettings && mapboxHelpers.raster(layerRasterSettings),\n ['layerRasterSettings'],\n );\n }\n\n function handleHover({ hover }: MapState) {\n const { current, previous } = hover;\n const canvasStyle = map.getCanvas().style;\n const { setFeatureState } = mapboxHelpers;\n\n /\n Set hover state\n /\n if (hasHoverTheme()) {\n if (current) setFeatureState(current.variant, current.id, 'hover', true);\n if (previous) setFeatureState(previous.variant, previous.id, 'hover', false);\n }\n\n canvasStyle.cursor = current ? 'pointer' : '';\n }\n\n function handleClick({ click }: MapState) {\n if (!click) return;\n\n const { infobox } = click;\n\n clearHover();\n\n if (infobox) {\n showInfobox(infobox);\n } else {\n clearInfobox();\n }\n }\n\n function handleFocus({ focus }: MapState) {\n const { current, previous, options } = focus;\n const { setFeatureState, center } = mapboxHelpers;\n\n if (previous) {\n previous.forEach(({ id, variant }) => {\n if (hasHoverTheme()) setFeatureState(variant, id, 'focus', false);\n pointerFocusToggle(id, 'remove');\n });\n }\n\n if (current) {\n current.forEach((item) => {\n const { variant, id } = item;\n\n if (theme.polygon) {\n if (hasHoverTheme()) setFeatureState(variant, id, 'focus', true);\n }\n });\n\n if (options?.zoom) {\n let bounds = calculateMapDataBoundingBox(current);\n bounds = expandBoundingBox(bounds, 0.05);\n\n map.fitBounds(bounds);\n } else if (!options?.static) {\n center([[calculateMapDataCenter(current)]]);\n }\n }\n }\n\n function handleIsochrone({ isochroneSetting }: MapState) {\n const { removeIsochrone, addIsochrone } = mapboxHelpers;\n\n if (isochroneSetting) {\n addIsochrone(isochroneSetting);\n } else {\n removeIsochrone();\n }\n }\n\n function handleDirections({ directionsSetting }: MapState) {\n const { addDirections, removeDirections } = mapboxHelpers;\n\n if (directionsSetting) {\n addDirections(directionsSetting);\n } else {\n removeDirections();\n }\n }\n\n function pointerFocusToggle(id: string, action: 'add' \| 'remove') {\n const pointer = getPointerElementById(id);\n\n if (pointer) {\n pointer.classList[action](POINTER_FOCUS_CLASS);\n element.classList[action](MAP_HOVERING_CLASS);\n }\n }\n\n function showInfobox(infobox: MapInfobox) {\n clearInfobox();\n infoboxWrapper.current!.appendChild(\n <Infobox {...infobox} onClose={clearInfobox} openInTab={options.openInTab} />,\n );\n }\n\n function clearInfobox() {\n infoboxWrapper.current!.innerHTML = '';\n }\n\n function hasHoverTheme() {\n return theme.polygon && theme.polygon.settings[0].hover;\n }\n\n function createMapboxInstance() {\n mapboxgl.accessToken = environmentDetails.mapboxAccessToken \|\| '';\n\n const mapboxOptions: mapboxgl.MapboxOptions = {\n container: container.current!,\n style: `mapbox://styles/${environmentDetails.mapboxStyle}`,\n minZoom: 4,\n maxZoom: 30,\n dragPan: true,\n scrollZoom: false,\n };\n\n if (options.center) mapboxOptions.center = options.center;\n if (options.zoom) mapboxOptions.zoom = options.zoom;\n if (options.boundingBox) mapboxOptions.bounds = options.boundingBox;\n\n if (!options.zoom && !options.center && !options.boundingBox) {\n mapboxOptions.bounds = getCountryBoundingBox(['nl']);\n }\n\n return new mapboxgl.Map(mapboxOptions);\n }\n\n function getMapboxLanguageString(): string {\n let language: string \| undefined;\n\n // If language could be nl-NL etc., make sure to strip first two characters\n if (options.language) {\n language = options.language.substr(0, 2);\n }\n\n // nl is not supported, use multilanguage instead\n language = !language \|\| language === 'nl' ? 'mul' : language;\n\n return language;\n }\n\n async function setupMapbox() {\n const { raster, geojson, layer, interaction, setupPointers } = mapboxHelpers;\n\n await functionIsTrue(() => map.isStyleLoaded());\n\n // Setup Mapbox Language\n const languageControl = new MapboxLanguage({\n defaultLanguage: getMapboxLanguageString(),\n });\n map.addControl(languageControl);\n\n // Setup Layer Raster\n // Layer raster can be set via the store and options attribute\n const optionsLayerRaster = options.layerRaster\n ? { layerRaster: options.layerRaster }\n : undefined;\n const storeLayerRaster = mapStore.getState().layerRasterSettings;\n\n if (optionsLayerRaster) {\n raster(optionsLayerRaster);\n } else if (storeLayerRaster) {\n raster(storeLayerRaster);\n }\n\n // Setup in case of polygons\n if (theme.polygon) {\n theme.polygon.settings.forEach((setting) => {\n geojson(setting);\n layer(setting);\n interaction(setting);\n });\n }\n\n // Setup in case of pointers\n if (theme.pointer) {\n setupPointers(element);\n }\n\n map.resize();\n }\n\n function getPointerElementById(id: string) {\n return element.querySelector(`#pointer-${id}`);\n }\n\n function pointerExists(id: string) {\n return !!getPointerElementById(id);\n }\n\n return (\n <Fragment>\n <div class=\"c-map\">\n <div className=\"map__container\" js-hook-map-container>\n {options.zoomButtons && (\n <div class=\"map__navigation\">\n <button\n class=\"map__button\"\n onClick={() => {\n map.zoomIn();\n setZoom(map.getZoom());\n }}>\n <bpd-svg name=\"icons-plus\"></bpd-svg>\n </button>\n <button\n class=\"map__button\"\n onClick={() => {\n map.zoomOut();\n setZoom(map.getZoom());\n }}>\n <span class=\"map__minus\"></span>\n </button>\n </div>\n )}\n\n <div class=\"map__infobox-wrapper\" js-hook-infobox-wrapper></div>\n </div>\n </div>\n </Fragment>\n );\n};\n\nMap.props = {\n options: {\n type: Object,\n },\n theme: {\n type: Object,\n required: true,\n },\n zoomButtons: {\n type: Boolean,\n },\n};\n\ndefineElement('bpd-map', Map);\n"]}

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

@@ -12,6 +12,7 @@ export declare type SearchResult = {
     place?: SearchResultPlace;
     originalBoundingBox?: BoundingBox;
     expandedBoundingBox?: BoundingBox;
+    kmPadding?: number;
 };
 interface MapFocusOptions {
     zoom?: boolean;
@@ -43,6 +44,7 @@ export interface MapState {
     layerRasterSettings?: MapLayerRasterSettings;
     isochroneSetting?: MapIsochroneSetting;
     directionsSetting?: MapDirectionsSetting;
+    currentZoom?: number;
 }
 export declare const mapStore: import("@atomify/kit/dist/utilities/store/store.types").Store<MapState>;
 export declare const updateMapData: (data: MapDataItem[]) => void;
@@ -63,6 +65,7 @@ export declare const setIsochrone: (isochroneSetting: MapIsochroneSetting) => vo
 export declare const clearIsochrone: () => void;
 export declare const setDirections: (directionsSetting: MapDirectionsSetting) => void;
 export declare const clearDirections: () => void;
+export declare const setZoom: (zoom: number) => void;
 export declare const getMapboxData: () => MapDataItem[];
 export declare const getHover: () => {
     current?: MapDataItem | undefined;

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

@@ -23,6 +23,7 @@ const SET_ISOCHRONE = 'setIsochrone';
 const CLEAR_ISOCHRONE = 'clearIsochrone';
 const SET_DIRECTIONS = 'setDirections';
 const CLEAR_DIRECTIONS = 'clearDirections';
+const SET_ZOOM = 'setZoom';
 const actions = {
     [UPDATE_MAP_DATA]: (state, data) => {
         state.data = data;
@@ -113,6 +114,10 @@ const actions = {
         state.directionsSetting = undefined;
         return state;
     },
+    [SET_ZOOM]: (state, zoom) => {
+        state.currentZoom = zoom;
+        return state;
+    },
 };
 export const mapStore = createStore({
     initialState,
@@ -172,6 +177,9 @@ export const setDirections = (directionsSetting) => {
 export const clearDirections = () => {
     mapStore.dispatch(CLEAR_DIRECTIONS);
 };
+export const setZoom = (zoom) => {
+    mapStore.dispatch(SET_ZOOM, zoom);
+};
 export const getMapboxData = () => mapStore.getState().data;
 export const getHover = () => mapStore.getState().hover;
 export const getMapInstance = () => mapStore.getState().mapInstance;

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

	@@ -1 +1 @@
1	- {"version":3,"file":"store.js","sourceRoot":"","sources":["../../../../src/molecules/map/store/store.ts"],"names":[],"mappings":"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","sourcesContent":["import { createStore } from '@atomify/kit';\nimport {\n BoundingBox,\n Coordinate,\n MapDataItem,\n MapDirectionsSetting,\n MapIsochroneSetting,\n} from '@bpd-library/types';\n\nexport type SearchResultPlace = {\n country?: string;\n province?: string;\n city?: string;\n district?: string;\n};\n\nexport type SearchResult = {\n items: MapDataItem[];\n result: any;\n place?: SearchResultPlace;\n originalBoundingBox?: BoundingBox;\n expandedBoundingBox?: BoundingBox;\n};\n\ninterface MapFocusOptions {\n zoom?: boolean;\n static?: boolean;\n}\n\nexport interface MapLayerRasterSettings {\n layerRaster: string;\n minzoom?: number;\n maxzoom?: number;\n}\n\nexport type MapManualSearch = string \| Coordinate;\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?: MapManualSearch;\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: MapManualSearch) => {\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: MapManualSearch) => {\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	+ {"version":3,"file":"store.js","sourceRoot":"","sources":["../../../../src/molecules/map/store/store.ts"],"names":[],"mappings":"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","sourcesContent":["import { createStore } from '@atomify/kit';\nimport {\n BoundingBox,\n Coordinate,\n MapDataItem,\n MapDirectionsSetting,\n MapIsochroneSetting,\n} from '@bpd-library/types';\n\nexport type SearchResultPlace = {\n country?: string;\n province?: string;\n city?: string;\n district?: string;\n};\n\nexport type SearchResult = {\n items: MapDataItem[];\n result: any;\n place?: SearchResultPlace;\n originalBoundingBox?: BoundingBox;\n expandedBoundingBox?: BoundingBox;\n kmPadding?: number;\n};\n\ninterface MapFocusOptions {\n zoom?: boolean;\n static?: boolean;\n}\n\nexport interface MapLayerRasterSettings {\n layerRaster: string;\n minzoom?: number;\n maxzoom?: number;\n}\n\nexport type MapManualSearch = string \| Coordinate;\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?: MapManualSearch;\n layerRasterSettings?: MapLayerRasterSettings;\n isochroneSetting?: MapIsochroneSetting;\n directionsSetting?: MapDirectionsSetting;\n currentZoom?: number;\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';\nconst SET_ZOOM = 'setZoom';\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: MapManualSearch) => {\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 [SET_ZOOM]: (state: MapState, zoom: number) => {\n state.currentZoom = zoom;\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: MapManualSearch) => {\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\nexport const setZoom = (zoom: number) => {\n mapStore.dispatch(SET_ZOOM, zoom);\n};\n\n/\n Getters\n/\nexport const getMapboxData = () => mapStore.getState().data;\nexport const getHover = () => mapStore.getState().hover;\nexport const getMapInstance = () => mapStore.getState().mapInstance;\nexport const getSearchIsMoving = () => mapStore.getState().searchIsMoving;\n"]}

package/dist/molecules/map/utilities/mapbox/pointers/setup-pointers.js CHANGED Viewed

@@ -44,6 +44,29 @@ const setupPointers = (map, theme, element) => {
     function bindEvents() {
         map.on('render', throttle(updateMarkers, 200));
     }
+    function setClusterChildrenData({ cluster, clusterSource, clusterId }) {
+        clusterSource === null || clusterSource === void 0 ? void 0 : clusterSource.getClusterChildren(clusterId, (_, features) => {
+            var _a;
+            const markersLength = (_a = features[0].properties) === null || _a === void 0 ? void 0 : _a.point_count;
+            const OFFSET = 0;
+            clusterSource.getClusterLeaves(clusterId, markersLength, OFFSET, (_, features) => {
+                const config = {
+                    cluster,
+                    features,
+                };
+                addMarkersToCluster(config);
+            });
+        });
+    }
+    function addMarkersToCluster({ cluster, features }) {
+        let clusterChildren;
+        clusterChildren = features.map((feature) => {
+            var _a;
+            return (_a = feature.properties) === null || _a === void 0 ? void 0 : _a.id;
+        });
+        clusterChildren = clusterChildren === null || clusterChildren === void 0 ? void 0 : clusterChildren.filter(Boolean);
+        cluster.getElement().dataset.children = String(clusterChildren);
+    }
     function addCluster(clus, variant) {
         const { properties, geometry } = clus;
         const { coordinates } = geometry;
@@ -53,7 +76,7 @@ const setupPointers = (map, theme, element) => {
             cluster = clusters.cache[id];
             if (!cluster) {
                 cluster = new Marker({
-                    element: (h("button", { class: "map__cluster", onMouseenter: () => {
+                    element: (h("button", { id: id, class: "map__cluster", onMouseenter: () => {
                             element.classList.add(MAP_HOVER_CLASS);
                         }, onMouseleave: () => {
                             element.classList.remove(MAP_HOVER_CLASS);
@@ -73,8 +96,15 @@ const setupPointers = (map, theme, element) => {
                 }).setLngLat(coordinates);
                 clusters.cache[id] = cluster;
             }
+            const clusterSource = map.getSource(variant);
+            const config = {
+                cluster,
+                clusterSource,
+                clusterId: id,
+            };
+            setClusterChildrenData(config);
             if (!clusters.onScreen[id])
-                cluster.addTo(map);
+                cluster === null || cluster === void 0 ? void 0 : cluster.addTo(map);
         }
         return [cluster, id];
     }

package/dist/molecules/map/utilities/mapbox/pointers/setup-pointers.js.map CHANGED Viewed

	@@ -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\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 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\n if (!cluster) {\n cluster = new Marker({\n element: (\n <button\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\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 } 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"]}

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

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

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

@@ -4,9 +4,12 @@ import mapboxgl from 'mapbox-gl';
 import { clearSearchResult, getMapboxData, mapStore, updateSearchIsMoving, updateSearchResult, } from '../../../store';
 import { fitBounds } from '../../fit-bounds';
 import getCityAlternativeSuggestions from './alternative-city-suggestions';
-const MIN_KM_PADDING = 10;
 const DEFAULT_TYPES = 'region,district,place,neighborhood';
-const search = async (map, { hook, kmPadding = MIN_KM_PADDING, onSearchSuggestion, noZoomAfterSearch, types = DEFAULT_TYPES, }, { searchCountryIsoCodes = ['nl', 'de'], language = 'nl' }) => {
+let defaultKmPadding = 10;
+export function setDefaultKmPadding(kmPadding) {
+    return (defaultKmPadding = kmPadding);
+}
+const search = async (map, { hook, onSearchSuggestion, noZoomAfterSearch, types = DEFAULT_TYPES }, { searchCountryIsoCodes = ['nl', 'de'], language = 'nl' }) => {
     const element = document.querySelector(hook);
     const bounds = getCountryBoundingBox(searchCountryIsoCodes);
     if (!element) {
@@ -15,9 +18,9 @@ const search = async (map, { hook, kmPadding = MIN_KM_PADDING, onSearchSuggestio
         return;
     }
     const inputElement = element.querySelector('[js-hook-map-search-input]');
+    const inputSelectDistanceElement = element.querySelector('[js-hook-map-search-distance-select-input]');
     const form = inputElement.closest('form');
     const suggestionsElement = element.querySelector('[js-hook-map-search-suggestions]');
-    const buttonElement = element.querySelector('[js-hook-map-search-button]');
     let geocoder;
     let suggestions;
     init();
@@ -40,7 +43,7 @@ const search = async (map, { hook, kmPadding = MIN_KM_PADDING, onSearchSuggestio
     function bindEvents() {
         const debouncedOnKeyDown = debounce(onKeyDown, 300);
         inputElement.addEventListener('keydown', debouncedOnKeyDown);
-        buttonElement.addEventListener('click', handleButtonClick);
+        form === null || form === void 0 ? void 0 : form.addEventListener('change', handleButtonClick);
         form === null || form === void 0 ? void 0 : form.addEventListener('submit', (e) => e.preventDefault());
         useClickOutside(inputElement, handleClickOutside);
         geocoder.on('results', (results) => {
@@ -158,6 +161,9 @@ const search = async (map, { hook, kmPadding = MIN_KM_PADDING, onSearchSuggestio
         return [...customSuggestions, ...cityAlternatives].slice(0, 4);
     }
     function updateStore(result) {
+        const kmPadding = !!Number(inputSelectDistanceElement === null || inputSelectDistanceElement === void 0 ? void 0 : inputSelectDistanceElement.value)
+            ? Number(inputSelectDistanceElement.value)
+            : defaultKmPadding;
         if (!result) {
             updateSearchResult({
                 items: [],
@@ -186,6 +192,7 @@ const search = async (map, { hook, kmPadding = MIN_KM_PADDING, onSearchSuggestio
             originalBoundingBox,
             expandedBoundingBox,
             place,
+            kmPadding,
         });
     }
     function handleSuggestionClick(feature) {

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

	@@ -1 +1 @@
1	- {"version":3,"file":"search.js","sourceRoot":"","sources":["../../../../../../src/molecules/map/utilities/mapbox/search/search.tsx"],"names":[],"mappings":"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","sourcesContent":["import { h } from '@atomify/jsx';\nimport { BoundingBox, MapOptions, MapSearchOptions, MapSearchSuggestion } from '@bpd-library/types';\nimport {\n calculateBoundingBoxCenter,\n debounce,\n 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 MIN_KM_PADDING = 10;\nconst DEFAULT_TYPES = 'region,district,place,neighborhood';\n\nconst search = async (\n map: mapboxgl.Map,\n {\n hook,\n kmPadding = MIN_KM_PADDING,\n onSearchSuggestion,\n noZoomAfterSearch,\n types = DEFAULT_TYPES,\n }: 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 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,\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 // 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 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 });\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"]}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
     "name": "@bpd-library/components",
-    "version": "1.3.2-beta.0",
+    "version": "1.3.2-beta.10",
     "description": "Description",
     "license": "MIT",
     "types": "dist/index.d.ts",
@@ -46,14 +46,14 @@
     "publishConfig": {
         "access": "public"
     },
-    "gitHead": "8f354363bc83eb618adfb3426065dbe2df6f1e2f",
+    "gitHead": "deb18c09e7403994530551bda682f6767d1c8b91",
     "dependencies": {
         "@atomify/core": "2.4.1",
         "@atomify/hooks": "1.1.11",
         "@atomify/jsx": "1.7.1",
         "@atomify/kit": "1.1.11",
-        "@bpd-library/types": "^1.3.2-beta.0",
-        "@bpd-library/utilities": "^1.3.2-beta.0",
+        "@bpd-library/types": "^1.3.2-beta.10",
+        "@bpd-library/utilities": "^1.3.2-beta.10",
         "@mapbox/mapbox-gl-geocoder": "^4.7.0",
         "@mapbox/mapbox-gl-language": "^0.10.1",
         "@turf/helpers": "^6.5.0",