@gravity-ui/page-constructor 7.15.1 → 7.17.0

package/build/cjs/blocks/Map/Map.js.map

@@ -1 +1 @@
-{"version":3,"file":"Map.js","sourceRoot":"../../../../src","sources":["blocks/Map/Map.tsx"],"names":[],"mappings":";;;;;AAAA,8EAA2C;AAC3C,gGAA6D;AAE7D,gDAAkC;AAClC,kEAA0D;AAI1D,MAAM,CAAC,GAAG,IAAA,aAAK,EAAC,WAAW,CAAC,CAAC;AAEtB,MAAM,QAAQ,GAAG,CAAC,EAAC,GAAG,EAAE,MAAM,EAAE,aAAa,EAAE,GAAG,KAAK,EAAgB,EAAE,EAAE;IAC9E,MAAM,cAAc,GAAG,IAAA,+BAAc,EAAC;QAClC,MAAM;QACN,aAAa;KAChB,CAAC,CAAC;IAEH,OAAO,CACH,uBAAC,mBAAS,OAAK,KAAK,YAChB,uBAAC,mBAAS,CAAC,IAAI,cACX,uBAAC,aAAG,OAAK,GAAG,EAAE,SAAS,EAAE,CAAC,CAAC,EAAC,MAAM,EAAE,cAAc,EAAC,CAAC,GAAI,GAC3C,GACT,CACf,CAAC;AACN,CAAC,CAAC;AAbW,QAAA,QAAQ,YAanB;AAEF,kBAAe,gBAAQ,CAAC","sourcesContent":["import Map from '../../components/Map/Map';\nimport MediaBase from '../../components/MediaBase/MediaBase';\nimport {MapBlockProps} from '../../models';\nimport {block} from '../../utils';\nimport {getMediaBorder} from '../../utils/borderSelector';\n\nimport './Map.scss';\n\nconst b = block('map-block');\n\nexport const MapBlock = ({map, border, disableShadow, ...props}: MapBlockProps) => {\n    const borderSelected = getMediaBorder({\n        border,\n        disableShadow,\n    });\n\n    return (\n        <MediaBase {...props}>\n            <MediaBase.Card>\n                <Map {...map} className={b({border: borderSelected})} />\n            </MediaBase.Card>\n        </MediaBase>\n    );\n};\n\nexport default MapBlock;\n"]}
+{"version":3,"file":"Map.js","sourceRoot":"../../../../src","sources":["blocks/Map/Map.tsx"],"names":[],"mappings":";;;;;AAAA,8EAA2C;AAC3C,gGAA6D;AAE7D,gDAAkC;AAClC,kEAA0D;AAI1D,MAAM,CAAC,GAAG,IAAA,aAAK,EAAC,WAAW,CAAC,CAAC;AAEtB,MAAM,QAAQ,GAAG,CAAC,EAAC,GAAG,EAAE,MAAM,EAAE,aAAa,EAAE,GAAG,KAAK,EAAgB,EAAE,EAAE;IAC9E,MAAM,cAAc,GAAG,IAAA,+BAAc,EAAC;QAClC,MAAM;QACN,aAAa;KAChB,CAAC,CAAC;IAEH,OAAO,CACH,uBAAC,mBAAS,OAAK,KAAK,YAChB,uBAAC,mBAAS,CAAC,IAAI,cACX,uBAAC,aAAG,OAAM,GAAgB,EAAE,SAAS,EAAE,CAAC,CAAC,EAAC,MAAM,EAAE,cAAc,EAAC,CAAC,GAAI,GACzD,GACT,CACf,CAAC;AACN,CAAC,CAAC;AAbW,QAAA,QAAQ,YAanB;AAEF,kBAAe,gBAAQ,CAAC","sourcesContent":["import Map from '../../components/Map/Map';\nimport MediaBase from '../../components/MediaBase/MediaBase';\nimport {MapBlockProps, MapProps} from '../../models';\nimport {block} from '../../utils';\nimport {getMediaBorder} from '../../utils/borderSelector';\n\nimport './Map.scss';\n\nconst b = block('map-block');\n\nexport const MapBlock = ({map, border, disableShadow, ...props}: MapBlockProps) => {\n    const borderSelected = getMediaBorder({\n        border,\n        disableShadow,\n    });\n\n    return (\n        <MediaBase {...props}>\n            <MediaBase.Card>\n                <Map {...(map as MapProps)} className={b({border: borderSelected})} />\n            </MediaBase.Card>\n        </MediaBase>\n    );\n};\n\nexport default MapBlock;\n"]}

package/build/cjs/blocks/Map/schema.d.ts

@@ -41,6 +41,45 @@ export declare const Map: {
                             iconColor: {
                                 type: string;
                             };
+                            iconImageHref: {
+                                type: string;
+                            };
+                            iconImageSize: {
+                                type: string;
+                                items: {
+                                    type: string;
+                                };
+                                minItems: number;
+                                maxItems: number;
+                            };
+                            iconImageOffset: {
+                                type: string;
+                                items: {
+                                    type: string;
+                                };
+                                minItems: number;
+                                maxItems: number;
+                            };
+                            iconImageClipRect: {
+                                type: string;
+                                items: {
+                                    type: string;
+                                    items: {
+                                        type: string;
+                                    };
+                                    minItems: number;
+                                    maxItems: number;
+                                };
+                                minItems: number;
+                                maxItems: number;
+                            };
+                            iconLayout: {
+                                type: string;
+                            };
+                            iconShape: {
+                                type: string;
+                                additionalProperties: boolean;
+                            };
                             preset: {
                                 type: string;
                             };
@@ -49,6 +88,12 @@ export declare const Map: {
                 };
             };
         };
+        disableControls: {
+            type: string;
+        };
+        disableBalloons: {
+            type: string;
+        };
     };
 };
 export declare const MapBlock: {
@@ -99,6 +144,45 @@ export declare const MapBlock: {
                                         iconColor: {
                                             type: string;
                                         };
+                                        iconImageHref: {
+                                            type: string;
+                                        };
+                                        iconImageSize: {
+                                            type: string;
+                                            items: {
+                                                type: string;
+                                            };
+                                            minItems: number;
+                                            maxItems: number;
+                                        };
+                                        iconImageOffset: {
+                                            type: string;
+                                            items: {
+                                                type: string;
+                                            };
+                                            minItems: number;
+                                            maxItems: number;
+                                        };
+                                        iconImageClipRect: {
+                                            type: string;
+                                            items: {
+                                                type: string;
+                                                items: {
+                                                    type: string;
+                                                };
+                                                minItems: number;
+                                                maxItems: number;
+                                            };
+                                            minItems: number;
+                                            maxItems: number;
+                                        };
+                                        iconLayout: {
+                                            type: string;
+                                        };
+                                        iconShape: {
+                                            type: string;
+                                            additionalProperties: boolean;
+                                        };
                                         preset: {
                                             type: string;
                                         };
@@ -107,6 +191,12 @@ export declare const MapBlock: {
                             };
                         };
                     };
+                    disableControls: {
+                        type: string;
+                    };
+                    disableBalloons: {
+                        type: string;
+                    };
                 };
             };
             description: {

package/build/cjs/components/Map/GoogleMap.js

@@ -16,7 +16,7 @@ function getScriptSrc(params) {
     return `${scriptSrc}?key=${apiKey}&language=${lang}${zoom ? '&zoom=' + zoom : ''}&q=${encodeURI(address)}`;
 }
 const GoogleMap = (props) => {
-    const { address, zoom, className } = props;
+    const { address, zoom, className, forceAspectRatio = true } = props;
     const { apiKey, scriptSrc } = React.useContext(mapsContext_1.MapsContext);
     const { lang = uikit_1.Lang.Ru } = React.useContext(localeContext_1.LocaleContext);
     const isMobile = React.useContext(mobileContext_1.MobileContext);
@@ -24,6 +24,9 @@ const GoogleMap = (props) => {
     const ref = React.useRef(null);
     const src = React.useMemo(() => getScriptSrc({ apiKey, scriptSrc, address, lang, zoom }), [apiKey, scriptSrc, address, lang, zoom]);
     React.useEffect(() => {
+        if (!forceAspectRatio) {
+            return;
+        }
         const updateSize = (0, debounce_1.default)(() => {
             if (ref.current) {
                 setHeight(Math.round((0, helpers_1.getMapHeight)(ref.current.offsetWidth, isMobile)));
@@ -31,10 +34,11 @@ const GoogleMap = (props) => {
         }, 100);
         updateSize();
         window.addEventListener('resize', updateSize, { passive: true });
+        // eslint-disable-next-line consistent-return
         return () => {
             window.removeEventListener('resize', updateSize);
         };
-    }, [isMobile]);
+    }, [forceAspectRatio, isMobile]);
     if (!apiKey || !address) {
         return null;
     }

package/build/cjs/components/Map/GoogleMap.js.map

@@ -1 +1 @@
-{"version":3,"file":"GoogleMap.js","sourceRoot":"../../../../src","sources":["components/Map/GoogleMap.tsx"],"names":[],"mappings":";;;;AAAA,qDAA+B;AAE/B,6CAAuC;AACvC,0EAAuC;AAEvC,gFAAwE;AACxE,0EAAkE;AAClE,wEAA0D;AAE1D,gDAAkC;AAElC,0CAAuC;AAEvC,MAAM,CAAC,GAAG,IAAA,aAAK,EAAC,KAAK,CAAC,CAAC;AAUvB,SAAS,YAAY,CAAC,MAA2B;IAC7C,MAAM,EAAC,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAC,GAAG,MAAM,CAAC;IAExD,OAAO,GAAG,SAAS,QAAQ,MAAM,aAAa,IAAI,GAAG,IAAI,CAAC,CAAC,CAAC,QAAQ,GAAG,IAAI,CAAC,CAAC,CAAC,EAAE,MAAM,SAAS,CAC3F,OAAO,CACV,EAAE,CAAC;AACR,CAAC;AAED,MAAM,SAAS,GAAG,CAAC,KAAgB,EAAE,EAAE;IACnC,MAAM,EAAC,OAAO,EAAE,IAAI,EAAE,SAAS,EAAC,GAAG,KAAK,CAAC;IACzC,MAAM,EAAC,MAAM,EAAE,SAAS,EAAC,GAAG,KAAK,CAAC,UAAU,CAAC,yBAAW,CAAC,CAAC;IAC1D,MAAM,EAAC,IAAI,GAAG,YAAI,CAAC,EAAE,EAAC,GAAG,KAAK,CAAC,UAAU,CAAC,6BAAa,CAAC,CAAC;IACzD,MAAM,QAAQ,GAAG,KAAK,CAAC,UAAU,CAAC,6BAAa,CAAC,CAAC;IAEjD,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAqB,SAAS,CAAC,CAAC;IAC1E,MAAM,GAAG,GAAG,KAAK,CAAC,MAAM,CAAoB,IAAI,CAAC,CAAC;IAClD,MAAM,GAAG,GAAG,KAAK,CAAC,OAAO,CACrB,GAAG,EAAE,CAAC,YAAY,CAAC,EAAC,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAC,CAAC,EAC5D,CAAC,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,CAAC,CAC3C,CAAC;IAEF,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACjB,MAAM,UAAU,GAAG,IAAA,kBAAQ,EAAC,GAAG,EAAE;YAC7B,IAAI,GAAG,CAAC,OAAO,EAAE,CAAC;gBACd,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC,IAAA,sBAAY,EAAC,GAAG,CAAC,OAAO,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC;YAC3E,CAAC;QACL,CAAC,EAAE,GAAG,CAAC,CAAC;QAER,UAAU,EAAE,CAAC;QACb,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,UAAU,EAAE,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC,CAAC;QAE/D,OAAO,GAAG,EAAE;YACR,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE,UAAU,CAAC,CAAC;QACrD,CAAC,CAAC;IACN,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IAEf,IAAI,CAAC,MAAM,IAAI,CAAC,OAAO,EAAE,CAAC;QACtB,OAAO,IAAI,CAAC;IAChB,CAAC;IAED,OAAO,CACH,mCACI,SAAS,EAAE,CAAC,CAAC,IAAI,EAAE,SAAS,CAAC,EAC7B,GAAG,EAAE,GAAG,EACR,KAAK,EAAE;YACH,MAAM;SACT,EACD,KAAK,EAAC,YAAY,EAClB,OAAO,EAAC,MAAM,EACd,eAAe,QACf,cAAc,EAAC,4BAA4B,EAC3C,GAAG,EAAE,GAAG,GACV,CACL,CAAC;AACN,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {Lang} from '@gravity-ui/uikit';\nimport debounce from 'lodash/debounce';\n\nimport {LocaleContext} from '../../context/localeContext/localeContext';\nimport {MapsContext} from '../../context/mapsContext/mapsContext';\nimport {MobileContext} from '../../context/mobileContext';\nimport {GMapProps} from '../../models';\nimport {block} from '../../utils';\n\nimport {getMapHeight} from './helpers';\n\nconst b = block('map');\n\ninterface GoogleMapLinkParams {\n    apiKey: string;\n    scriptSrc: string;\n    address: string;\n    lang: `${Lang}`;\n    zoom?: number;\n}\n\nfunction getScriptSrc(params: GoogleMapLinkParams) {\n    const {apiKey, scriptSrc, address, lang, zoom} = params;\n\n    return `${scriptSrc}?key=${apiKey}&language=${lang}${zoom ? '&zoom=' + zoom : ''}&q=${encodeURI(\n        address,\n    )}`;\n}\n\nconst GoogleMap = (props: GMapProps) => {\n    const {address, zoom, className} = props;\n    const {apiKey, scriptSrc} = React.useContext(MapsContext);\n    const {lang = Lang.Ru} = React.useContext(LocaleContext);\n    const isMobile = React.useContext(MobileContext);\n\n    const [height, setHeight] = React.useState<number | undefined>(undefined);\n    const ref = React.useRef<HTMLIFrameElement>(null);\n    const src = React.useMemo(\n        () => getScriptSrc({apiKey, scriptSrc, address, lang, zoom}),\n        [apiKey, scriptSrc, address, lang, zoom],\n    );\n\n    React.useEffect(() => {\n        const updateSize = debounce(() => {\n            if (ref.current) {\n                setHeight(Math.round(getMapHeight(ref.current.offsetWidth, isMobile)));\n            }\n        }, 100);\n\n        updateSize();\n        window.addEventListener('resize', updateSize, {passive: true});\n\n        return () => {\n            window.removeEventListener('resize', updateSize);\n        };\n    }, [isMobile]);\n\n    if (!apiKey || !address) {\n        return null;\n    }\n\n    return (\n        <iframe\n            className={b(null, className)}\n            ref={ref}\n            style={{\n                height,\n            }}\n            title=\"Google Map\"\n            loading=\"lazy\"\n            allowFullScreen\n            referrerPolicy=\"no-referrer-when-downgrade\"\n            src={src}\n        />\n    );\n};\n\nexport default GoogleMap;\n"]}
+{"version":3,"file":"GoogleMap.js","sourceRoot":"../../../../src","sources":["components/Map/GoogleMap.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport {Lang} from '@gravity-ui/uikit';\nimport debounce from 'lodash/debounce';\n\nimport {LocaleContext} from '../../context/localeContext/localeContext';\nimport {MapsContext} from '../../context/mapsContext/mapsContext';\nimport {MobileContext} from '../../context/mobileContext';\nimport {GMapProps} from '../../models';\nimport {block} from '../../utils';\n\nimport {getMapHeight} from './helpers';\n\nconst b = block('map');\n\ninterface GoogleMapLinkParams {\n    apiKey: string;\n    scriptSrc: string;\n    address: string;\n    lang: `${Lang}`;\n    zoom?: number;\n}\n\nfunction getScriptSrc(params: GoogleMapLinkParams) {\n    const {apiKey, scriptSrc, address, lang, zoom} = params;\n\n    return `${scriptSrc}?key=${apiKey}&language=${lang}${zoom ? '&zoom=' + zoom : ''}&q=${encodeURI(\n        address,\n    )}`;\n}\n\nconst GoogleMap = (props: GMapProps) => {\n    const {address, zoom, className, forceAspectRatio = true} = props;\n    const {apiKey, scriptSrc} = React.useContext(MapsContext);\n    const {lang = Lang.Ru} = React.useContext(LocaleContext);\n    const isMobile = React.useContext(MobileContext);\n\n    const [height, setHeight] = React.useState<number | undefined>(undefined);\n    const ref = React.useRef<HTMLIFrameElement>(null);\n    const src = React.useMemo(\n        () => getScriptSrc({apiKey, scriptSrc, address, lang, zoom}),\n        [apiKey, scriptSrc, address, lang, zoom],\n    );\n\n    React.useEffect(() => {\n        if (!forceAspectRatio) {\n            return;\n        }\n\n        const updateSize = debounce(() => {\n            if (ref.current) {\n                setHeight(Math.round(getMapHeight(ref.current.offsetWidth, isMobile)));\n            }\n        }, 100);\n\n        updateSize();\n        window.addEventListener('resize', updateSize, {passive: true});\n\n        // eslint-disable-next-line consistent-return\n        return () => {\n            window.removeEventListener('resize', updateSize);\n        };\n    }, [forceAspectRatio, isMobile]);\n\n    if (!apiKey || !address) {\n        return null;\n    }\n\n    return (\n        <iframe\n            className={b(null, className)}\n            ref={ref}\n            style={{\n                height,\n            }}\n            title=\"Google Map\"\n            loading=\"lazy\"\n            allowFullScreen\n            referrerPolicy=\"no-referrer-when-downgrade\"\n            src={src}\n        />\n    );\n};\n\nexport default GoogleMap;\n"]}

package/build/cjs/components/Map/YMap/YMap.d.ts

@@ -1,13 +1,13 @@
-import { YMapMarker, YMapProps } from "../../../models/index.js";
-type PlacemarksProps = Pick<YMapProps, 'zoom' | 'markers'>;
+import { YMapMarkerPrivate, YMapProps } from "../../../models/index.js";
+type PlacemarksProps = Pick<YMapProps, 'zoom' | 'markers' | 'areaMargin'>;
 export declare class YMap {
     private ymap;
     private mapRef;
     private coords;
     constructor(ymap: Ymaps.Map, mapRef: HTMLDivElement | null);
     showPlacemarks(props: PlacemarksProps): Promise<void>;
-    findAddress(marker: YMapMarker): Promise<void>;
-    findCoordinate(marker: YMapMarker): void;
+    findAddress(marker: YMapMarkerPrivate): Promise<void>;
+    findCoordinate(marker: YMapMarkerPrivate): void;
     private drawPlaceMarkStyle;
     private recalcZoomAndCenter;
     private clearOldPlacemarks;

package/build/cjs/components/Map/YMap/YMap.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.YMap = void 0;
+const utils_1 = require("./utils.js");
 var GeoObjectTypes;
 (function (GeoObjectTypes) {
     GeoObjectTypes["Properties"] = "properties";
@@ -11,9 +12,17 @@ const DEFAULT_PLACEMARKS_COLOR = '#dc534b';
 const DEFAULT_PLACEMARKS_PRESET = 'islands#dotIcon';
 const DEFAULT_MAP_CONTROL_BUTTON_HEIGHT = 30;
 const geoObjectPropsAndOptions = {
+    cursor: GeoObjectTypes.Options,
     iconCaption: GeoObjectTypes.Properties,
     iconContent: GeoObjectTypes.Properties,
     iconColor: GeoObjectTypes.Options,
+    iconImageHref: GeoObjectTypes.Options,
+    iconImageSize: GeoObjectTypes.Options,
+    iconImageOffset: GeoObjectTypes.Options,
+    iconImageClipRect: GeoObjectTypes.Options,
+    iconLayout: GeoObjectTypes.Options,
+    iconShape: GeoObjectTypes.Options,
+    interactivityModel: GeoObjectTypes.Options,
     preset: GeoObjectTypes.Options,
 };
 class YMap {
@@ -60,40 +69,62 @@ class YMap {
         if (!preset.includes('Stretchy') && !iconColor) {
             localIconColor = DEFAULT_PLACEMARKS_COLOR;
         }
-        Object.entries({ ...marker.label, iconColor: localIconColor, preset }).forEach(([key, value]) => {
+        Object.entries({
+            ...marker.label,
+            iconColor: localIconColor,
+            preset,
+        }).forEach(([key, value]) => {
             const geoObjectParamType = geoObjectPropsAndOptions[key];
             if (value && geoObjectParamType) {
                 geoObject[geoObjectParamType].set(key, value);
             }
         });
     }
+    // eslint-disable-next-line complexity
     recalcZoomAndCenter(props) {
         const coordsLength = this.coords.length;
-        const { zoom = 0 } = props;
+        const { zoom = 0, areaMargin } = props;
         if (!coordsLength) {
             return;
         }
-        let leftBottom = [Infinity, Infinity], rightTop = [-Infinity, -Infinity];
-        this.coords.forEach((point) => {
-            leftBottom = [Math.min(leftBottom[0], point[0]), Math.min(leftBottom[1], point[1])];
-            rightTop = [Math.max(rightTop[0], point[0]), Math.max(rightTop[1], point[1])];
-        });
+        const utils = window.ymaps.util.bounds;
+        const [leftTop, rightBottom] = utils.fromPoints(this.coords);
         let newMapParams = {
             zoom,
             center: [],
         };
-        if (zoom) {
-            // compute only the center
-            newMapParams.center = window.ymaps.util.bounds.getCenter([leftBottom, rightTop]);
-        }
-        else {
-            newMapParams = window.ymaps.util.bounds.getCenterAndZoom([leftBottom, rightTop], [this.mapRef?.clientWidth, this.mapRef?.clientHeight], undefined, { margin: DEFAULT_MAP_CONTROL_BUTTON_HEIGHT });
+        const parsedAreaMargin = areaMargin
+            ? (0, utils_1.parseMargin)(areaMargin)
+            : [0, 0, 0, 0];
+        const hasZoom = Boolean(zoom);
+        const hasAreaMargin = parsedAreaMargin.some(Boolean);
+        const containerSize = [
+            this.mapRef?.clientWidth ?? 0,
+            this.mapRef?.clientHeight ?? 0,
+        ];
+        switch (true) {
+            case hasAreaMargin && hasZoom:
+                // calculate center and zoom in accordace with current zoom and margin
+                newMapParams = (0, utils_1.calculateMapParamsWithMarginAndZoom)([leftTop, rightBottom], zoom, parsedAreaMargin, containerSize);
+                break;
+            case hasAreaMargin:
+                // calculate center and zoom with custom margin
+                newMapParams = utils.getCenterAndZoom([leftTop, rightBottom], containerSize, undefined, { margin: areaMargin, preciseZoom: true });
+                break;
+            case hasZoom:
+                // calculate only center
+                newMapParams.center = utils.getCenter([leftTop, rightBottom]);
+                break;
+            default:
+                // calculate center and zoom with default margin
+                newMapParams = utils.getCenterAndZoom([leftTop, rightBottom], containerSize, undefined, { margin: DEFAULT_MAP_CONTROL_BUTTON_HEIGHT });
         }
         this.ymap.setCenter(newMapParams.center);
         // Use default zoom for one placemark
-        if (coordsLength > 1 && !zoom) {
-            this.ymap.setZoom(newMapParams.zoom);
+        if (coordsLength <= 1 && !hasAreaMargin && hasZoom) {
+            return;
         }
+        this.ymap.setZoom(newMapParams.zoom);
     }
     clearOldPlacemarks() {
         if (this.coords.length === 0) {

package/build/cjs/components/Map/YMap/YMap.js.map

@@ -1 +1 @@
-{"version":3,"file":"YMap.js","sourceRoot":"../../../../../src","sources":["components/Map/YMap/YMap.ts"],"names":[],"mappings":"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","sourcesContent":["import {YMapMarker, YMapMarkerLabel, YMapProps} from '../../../models';\nimport {Coordinate} from '../../../models/constructor-items/common';\n\nenum GeoObjectTypes {\n    Properties = 'properties',\n    Options = 'options',\n}\n\nconst DEFAULT_PLACEMARKS_COLOR = '#dc534b';\n// presetStorage: https://yandex.com/dev/maps/jsapi/doc/2.1/ref/reference/option.presetStorage.html\nconst DEFAULT_PLACEMARKS_PRESET = 'islands#dotIcon';\nconst DEFAULT_MAP_CONTROL_BUTTON_HEIGHT = 30;\n\nconst geoObjectPropsAndOptions = {\n    iconCaption: GeoObjectTypes.Properties,\n    iconContent: GeoObjectTypes.Properties,\n    iconColor: GeoObjectTypes.Options,\n    preset: GeoObjectTypes.Options,\n};\n\ntype PlacemarksProps = Pick<YMapProps, 'zoom' | 'markers'>;\n\nexport class YMap {\n    private ymap: Ymaps.Map;\n    private mapRef: HTMLDivElement | null;\n    private coords: Coordinate[] = [];\n\n    constructor(ymap: Ymaps.Map, mapRef: HTMLDivElement | null) {\n        this.ymap = ymap;\n        this.mapRef = mapRef;\n    }\n\n    async showPlacemarks(props: PlacemarksProps) {\n        this.clearOldPlacemarks();\n\n        for (const marker of props.markers) {\n            if (marker.address) {\n                await this.findAddress(marker);\n            } else if (marker.coordinate) {\n                this.findCoordinate(marker);\n            }\n        }\n\n        this.recalcZoomAndCenter(props);\n    }\n\n    async findAddress(marker: YMapMarker) {\n        try {\n            const res = await window.ymaps.geocode(marker.address, {results: 1});\n            const geoObject = res.geoObjects.get(0);\n            const coordinate = geoObject.geometry.getCoordinates();\n\n            this.coords.push(coordinate);\n\n            this.drawPlaceMarkStyle(geoObject, marker);\n\n            this.ymap.geoObjects.add(geoObject);\n        } catch {} // If error - placemark will not be displayed\n    }\n\n    findCoordinate(marker: YMapMarker) {\n        const geoObject = new window.ymaps.Placemark(marker.coordinate, {});\n\n        this.coords.push(marker.coordinate as Coordinate);\n        this.drawPlaceMarkStyle(geoObject, marker);\n        this.ymap.geoObjects.add(geoObject);\n    }\n\n    private drawPlaceMarkStyle(geoObject: Ymaps.GeoObject, marker: YMapMarker) {\n        const {iconColor, preset = DEFAULT_PLACEMARKS_PRESET} = marker.label || {};\n        let localIconColor: string | undefined = iconColor;\n\n        // You can set the preset option together with the iconColor option only if it not a 'Stretchy' preset\n        if (!preset.includes('Stretchy') && !iconColor) {\n            localIconColor = DEFAULT_PLACEMARKS_COLOR;\n        }\n\n        Object.entries({...marker.label, iconColor: localIconColor, preset}).forEach(\n            ([key, value]) => {\n                const geoObjectParamType: GeoObjectTypes | undefined =\n                    geoObjectPropsAndOptions[key as keyof YMapMarkerLabel];\n\n                if (value && geoObjectParamType) {\n                    geoObject[geoObjectParamType].set(key, value);\n                }\n            },\n        );\n    }\n\n    private recalcZoomAndCenter(props: PlacemarksProps) {\n        const coordsLength = this.coords.length;\n        const {zoom = 0} = props;\n\n        if (!coordsLength) {\n            return;\n        }\n\n        let leftBottom = [Infinity, Infinity],\n            rightTop = [-Infinity, -Infinity];\n\n        this.coords.forEach((point) => {\n            leftBottom = [Math.min(leftBottom[0], point[0]), Math.min(leftBottom[1], point[1])];\n            rightTop = [Math.max(rightTop[0], point[0]), Math.max(rightTop[1], point[1])];\n        });\n\n        let newMapParams = {\n            zoom,\n            center: [],\n        };\n\n        if (zoom) {\n            // compute only the center\n            newMapParams.center = window.ymaps.util.bounds.getCenter([leftBottom, rightTop]);\n        } else {\n            newMapParams = window.ymaps.util.bounds.getCenterAndZoom(\n                [leftBottom, rightTop],\n                [this.mapRef?.clientWidth, this.mapRef?.clientHeight],\n                undefined,\n                {margin: DEFAULT_MAP_CONTROL_BUTTON_HEIGHT},\n            );\n        }\n\n        this.ymap.setCenter(newMapParams.center);\n\n        // Use default zoom for one placemark\n        if (coordsLength > 1 && !zoom) {\n            this.ymap.setZoom(newMapParams.zoom);\n        }\n    }\n\n    private clearOldPlacemarks() {\n        if (this.coords.length === 0) {\n            return;\n        }\n\n        this.ymap.geoObjects.removeAll();\n        this.coords = [];\n    }\n}\n"]}
+{"version":3,"file":"YMap.js","sourceRoot":"../../../../../src","sources":["components/Map/YMap/YMap.ts"],"names":[],"mappings":"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","sourcesContent":["import {YMapMarkerLabelPrivate, YMapMarkerPrivate, YMapProps} from '../../../models';\nimport {Coordinate} from '../../../models/constructor-items/common';\n\nimport {ParsedMargin, calculateMapParamsWithMarginAndZoom, parseMargin} from './utils';\n\nenum GeoObjectTypes {\n    Properties = 'properties',\n    Options = 'options',\n}\n\nconst DEFAULT_PLACEMARKS_COLOR = '#dc534b';\n// presetStorage: https://yandex.com/dev/maps/jsapi/doc/2.1/ref/reference/option.presetStorage.html\nconst DEFAULT_PLACEMARKS_PRESET = 'islands#dotIcon';\nconst DEFAULT_MAP_CONTROL_BUTTON_HEIGHT = 30;\n\nconst geoObjectPropsAndOptions: Record<keyof YMapMarkerLabelPrivate, GeoObjectTypes> = {\n    cursor: GeoObjectTypes.Options,\n    iconCaption: GeoObjectTypes.Properties,\n    iconContent: GeoObjectTypes.Properties,\n    iconColor: GeoObjectTypes.Options,\n    iconImageHref: GeoObjectTypes.Options,\n    iconImageSize: GeoObjectTypes.Options,\n    iconImageOffset: GeoObjectTypes.Options,\n    iconImageClipRect: GeoObjectTypes.Options,\n    iconLayout: GeoObjectTypes.Options,\n    iconShape: GeoObjectTypes.Options,\n    interactivityModel: GeoObjectTypes.Options,\n    preset: GeoObjectTypes.Options,\n};\n\ntype PlacemarksProps = Pick<YMapProps, 'zoom' | 'markers' | 'areaMargin'>;\n\nexport class YMap {\n    private ymap: Ymaps.Map;\n    private mapRef: HTMLDivElement | null;\n    private coords: Coordinate[] = [];\n\n    constructor(ymap: Ymaps.Map, mapRef: HTMLDivElement | null) {\n        this.ymap = ymap;\n        this.mapRef = mapRef;\n    }\n\n    async showPlacemarks(props: PlacemarksProps) {\n        this.clearOldPlacemarks();\n\n        for (const marker of props.markers) {\n            if (marker.address) {\n                await this.findAddress(marker);\n            } else if (marker.coordinate) {\n                this.findCoordinate(marker);\n            }\n        }\n\n        this.recalcZoomAndCenter(props);\n    }\n\n    async findAddress(marker: YMapMarkerPrivate) {\n        try {\n            const res = await window.ymaps.geocode(marker.address, {results: 1});\n            const geoObject = res.geoObjects.get(0);\n            const coordinate = geoObject.geometry.getCoordinates();\n\n            this.coords.push(coordinate);\n\n            this.drawPlaceMarkStyle(geoObject, marker);\n\n            this.ymap.geoObjects.add(geoObject);\n        } catch {} // If error - placemark will not be displayed\n    }\n\n    findCoordinate(marker: YMapMarkerPrivate) {\n        const geoObject = new window.ymaps.Placemark(marker.coordinate, {});\n\n        this.coords.push(marker.coordinate as Coordinate);\n        this.drawPlaceMarkStyle(geoObject, marker);\n        this.ymap.geoObjects.add(geoObject);\n    }\n\n    private drawPlaceMarkStyle(geoObject: Ymaps.GeoObject, marker: YMapMarkerPrivate) {\n        const {iconColor, preset = DEFAULT_PLACEMARKS_PRESET} = marker.label || {};\n        let localIconColor: string | undefined = iconColor;\n\n        // You can set the preset option together with the iconColor option only if it not a 'Stretchy' preset\n        if (!preset.includes('Stretchy') && !iconColor) {\n            localIconColor = DEFAULT_PLACEMARKS_COLOR;\n        }\n\n        Object.entries({\n            ...marker.label,\n            iconColor: localIconColor,\n            preset,\n        }).forEach(([key, value]) => {\n            const geoObjectParamType: GeoObjectTypes | undefined =\n                geoObjectPropsAndOptions[key as keyof YMapMarkerLabelPrivate];\n\n            if (value && geoObjectParamType) {\n                geoObject[geoObjectParamType].set(key, value);\n            }\n        });\n    }\n\n    // eslint-disable-next-line complexity\n    private recalcZoomAndCenter(props: PlacemarksProps) {\n        const coordsLength = this.coords.length;\n        const {zoom = 0, areaMargin} = props;\n\n        if (!coordsLength) {\n            return;\n        }\n\n        const utils = window.ymaps.util.bounds;\n\n        const [leftTop, rightBottom] = utils.fromPoints(this.coords);\n\n        let newMapParams = {\n            zoom,\n            center: [],\n        };\n\n        const parsedAreaMargin = areaMargin\n            ? parseMargin(areaMargin)\n            : ([0, 0, 0, 0] as ParsedMargin);\n\n        const hasZoom = Boolean(zoom);\n        const hasAreaMargin = parsedAreaMargin.some(Boolean);\n        const containerSize = [\n            this.mapRef?.clientWidth ?? 0,\n            this.mapRef?.clientHeight ?? 0,\n        ] as Coordinate;\n\n        switch (true) {\n            case hasAreaMargin && hasZoom:\n                // calculate center and zoom in accordace with current zoom and margin\n                newMapParams = calculateMapParamsWithMarginAndZoom(\n                    [leftTop, rightBottom],\n                    zoom,\n                    parsedAreaMargin,\n                    containerSize,\n                );\n                break;\n            case hasAreaMargin:\n                // calculate center and zoom with custom margin\n                newMapParams = utils.getCenterAndZoom(\n                    [leftTop, rightBottom],\n                    containerSize,\n                    undefined,\n                    {margin: areaMargin, preciseZoom: true},\n                );\n                break;\n            case hasZoom:\n                // calculate only center\n                newMapParams.center = utils.getCenter([leftTop, rightBottom]);\n                break;\n            default:\n                // calculate center and zoom with default margin\n                newMapParams = utils.getCenterAndZoom(\n                    [leftTop, rightBottom],\n                    containerSize,\n                    undefined,\n                    {margin: DEFAULT_MAP_CONTROL_BUTTON_HEIGHT},\n                );\n        }\n\n        this.ymap.setCenter(newMapParams.center);\n\n        // Use default zoom for one placemark\n        if (coordsLength <= 1 && !hasAreaMargin && hasZoom) {\n            return;\n        }\n\n        this.ymap.setZoom(newMapParams.zoom);\n    }\n\n    private clearOldPlacemarks() {\n        if (this.coords.length === 0) {\n            return;\n        }\n\n        this.ymap.geoObjects.removeAll();\n        this.coords = [];\n    }\n}\n"]}

package/build/cjs/components/Map/YMap/YandexMap.js

@@ -21,8 +21,12 @@ const DEFAULT_ZOOM = 9;
 // We use this init center to create a map
 // The real center of the map will be calculated later, using the coordinates of the markers
 const INITIAL_CENTER = [0, 0];
+const BALLOON_DISABLING_MARKER_OPTIONS = {
+    cursor: 'drag',
+    interactivityModel: 'default#silent',
+};
 const YandexMap = (props) => {
-    const { markers, zoom, id, className } = props;
+    const { markers, zoom, id, disableControls = false, disableBalloons = false, areaMargin, className, forceAspectRatio = true, } = props;
     const { apiKey, scriptSrc, nonce } = React.useContext(mapsContext_1.MapsContext);
     const isMobile = React.useContext(mobileContext_1.MobileContext);
     const { lang = 'ru' } = React.useContext(localeContext_1.LocaleContext);
@@ -44,12 +48,30 @@ const YandexMap = (props) => {
                 setYmaps(new YMap_1.YMap(new window.ymaps.Map(containerId, {
                     center: INITIAL_CENTER,
                     zoom: zoom || DEFAULT_ZOOM,
-                }, { autoFitToViewport: 'always' }), ref.current));
+                    controls: disableControls ? [] : undefined,
+                }, {
+                    autoFitToViewport: 'always',
+                    suppressMapOpenBlock: disableControls,
+                    yandexMapDisablePoiInteractivity: disableControls,
+                }), ref.current));
             });
             setLoading(false);
         })();
-    }, [apiKey, lang, scriptSrc, containerId, zoom, nonce, attemptsIndex, setLoading]);
+    }, [
+        apiKey,
+        lang,
+        scriptSrc,
+        containerId,
+        zoom,
+        nonce,
+        attemptsIndex,
+        setLoading,
+        disableControls,
+    ]);
     React.useEffect(() => {
+        if (!forceAspectRatio) {
+            return;
+        }
         const updateSize = (0, debounce_1.default)(() => {
             if (ref.current) {
                 setHeight(Math.round((0, helpers_1.getMapHeight)(ref.current.offsetWidth, isMobile)));
@@ -57,20 +79,27 @@ const YandexMap = (props) => {
         }, 100);
         updateSize();
         window.addEventListener('resize', updateSize, { passive: true });
+        // eslint-disable-next-line consistent-return
         return () => {
             window.removeEventListener('resize', updateSize);
         };
-    }, [markers, ymap, setYmaps, isMobile]);
+    }, [isMobile, forceAspectRatio]);
     React.useEffect(() => {
         if (ymap) {
             // show with computed center and placemarks
             const showPlacemarks = async () => {
-                await ymap.showPlacemarks({ markers, zoom });
+                const privateMarkers = disableBalloons
+                    ? markers.map(({ label, ...marker }) => ({
+                        ...marker,
+                        label: { ...label, ...BALLOON_DISABLING_MARKER_OPTIONS },
+                    }))
+                    : markers;
+                await ymap.showPlacemarks({ markers: privateMarkers, zoom, areaMargin });
                 setReady(true);
             };
             showPlacemarks();
         }
-    });
+    }, [ymap, markers, zoom, disableBalloons, areaMargin]);
     if (!markers)
         return null;
     return ((0, jsx_runtime_1.jsx)(ErrorWrapper_1.default, { isError: YandexMapApiLoader_1.YMapsApiLoader.status === YandexMapApiLoader_1.MapApiStatus.Error, text: (0, i18n_1.i18n)('map-load-error'), buttonText: (0, i18n_1.i18n)('map-try-again'), handler: onTryAgain, className: b('wrapper'), children: (0, jsx_runtime_1.jsxs)("div", { className: b('wrapper'), children: [(0, jsx_runtime_1.jsx)("div", { id: containerId, className: b({ hidden: !ready }, className), ref: ref, style: { height } }), loading ? (0, jsx_runtime_1.jsx)(uikit_1.Spin, { size: "xl", className: b('spinner') }) : null] }) }));

package/build/cjs/components/Map/YMap/YandexMap.js.map

@@ -1 +1 @@
-{"version":3,"file":"YandexMap.js","sourceRoot":"../../../../../src","sources":["components/Map/YMap/YandexMap.tsx"],"names":[],"mappings":";;;;AAAA,qDAA+B;AAE/B,6CAAuC;AACvC,0EAAuC;AAEvC,mFAA2E;AAC3E,6EAAqE;AACrE,2EAA6D;AAE7D,mDAAqC;AACrC,8FAA2D;AAC3D,2CAAwC;AAExC,oCAA4B;AAC5B,gEAAkE;AAClE,0CAA4B;AAE5B,MAAM,CAAC,GAAG,IAAA,aAAK,EAAC,KAAK,CAAC,CAAC;AACvB,MAAM,oBAAoB,GAAG,MAAM,CAAC;AACpC,MAAM,YAAY,GAAG,CAAC,CAAC;AACvB,0DAA0D;AAC1D,0CAA0C;AAC1C,4FAA4F;AAC5F,MAAM,cAAc,GAAG,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;AAE9B,MAAM,SAAS,GAAG,CAAC,KAAgB,EAAE,EAAE;IACnC,MAAM,EAAC,OAAO,EAAE,IAAI,EAAE,EAAE,EAAE,SAAS,EAAC,GAAG,KAAK,CAAC;IAC7C,MAAM,EAAC,MAAM,EAAE,SAAS,EAAE,KAAK,EAAC,GAAG,KAAK,CAAC,UAAU,CAAC,yBAAW,CAAC,CAAC;IACjE,MAAM,QAAQ,GAAG,KAAK,CAAC,UAAU,CAAC,6BAAa,CAAC,CAAC;IAEjD,MAAM,EAAC,IAAI,GAAG,IAAI,EAAC,GAAG,KAAK,CAAC,UAAU,CAAC,6BAAa,CAAC,CAAC;IACtD,MAAM,WAAW,GAAG,GAAG,oBAAoB,IAAI,EAAE,EAAE,CAAC;IAEpD,MAAM,CAAC,IAAI,EAAE,QAAQ,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAc,IAAI,CAAC,CAAC;IAC3D,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAqB,SAAS,CAAC,CAAC;IAC1E,MAAM,GAAG,GAAG,KAAK,CAAC,MAAM,CAAiB,IAAI,CAAC,CAAC;IAE/C,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAU,KAAK,CAAC,CAAC;IAC7D,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAU,KAAK,CAAC,CAAC;IACzD,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAS,CAAC,CAAC,CAAC;IACpE,MAAM,UAAU,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE;QACtC,gBAAgB,CAAC,aAAa,GAAG,CAAC,CAAC,CAAC;IACxC,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;IAEpB,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACjB,CAAC,KAAK;YACF,UAAU,CAAC,IAAI,CAAC,CAAC;YAEjB,MAAM,mCAAc,CAAC,OAAO,CAAC,MAAM,EAAE,SAAS,EAAE,IAAI,EAAE,KAAK,CAAC,CAAC;YAE7D,MAAM,CAAC,KAAK,EAAE,KAAK,CAAC,GAAG,EAAE;gBACrB,QAAQ,CACJ,IAAI,WAAI,CACJ,IAAI,MAAM,CAAC,KAAK,CAAC,GAAG,CAChB,WAAW,EACX;oBACI,MAAM,EAAE,cAAc;oBACtB,IAAI,EAAE,IAAI,IAAI,YAAY;iBAC7B,EACD,EAAC,iBAAiB,EAAE,QAAQ,EAAC,CAChC,EACD,GAAG,CAAC,OAAO,CACd,CACJ,CAAC;YACN,CAAC,CAAC,CAAC;YAEH,UAAU,CAAC,KAAK,CAAC,CAAC;QACtB,CAAC,CAAC,EAAE,CAAC;IACT,CAAC,EAAE,CAAC,MAAM,EAAE,IAAI,EAAE,SAAS,EAAE,WAAW,EAAE,IAAI,EAAE,KAAK,EAAE,aAAa,EAAE,UAAU,CAAC,CAAC,CAAC;IAEnF,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACjB,MAAM,UAAU,GAAG,IAAA,kBAAQ,EAAC,GAAG,EAAE;YAC7B,IAAI,GAAG,CAAC,OAAO,EAAE,CAAC;gBACd,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC,IAAA,sBAAY,EAAC,GAAG,CAAC,OAAO,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC;YAC3E,CAAC;QACL,CAAC,EAAE,GAAG,CAAC,CAAC;QAER,UAAU,EAAE,CAAC;QACb,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,UAAU,EAAE,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC,CAAC;QAE/D,OAAO,GAAG,EAAE;YACR,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE,UAAU,CAAC,CAAC;QACrD,CAAC,CAAC;IACN,CAAC,EAAE,CAAC,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC;IAExC,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACjB,IAAI,IAAI,EAAE,CAAC;YACP,2CAA2C;YAC3C,MAAM,cAAc,GAAG,KAAK,IAAI,EAAE;gBAC9B,MAAM,IAAI,CAAC,cAAc,CAAC,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC,CAAC;gBAE3C,QAAQ,CAAC,IAAI,CAAC,CAAC;YACnB,CAAC,CAAC;YAEF,cAAc,EAAE,CAAC;QACrB,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,IAAI,CAAC,OAAO;QAAE,OAAO,IAAI,CAAC;IAE1B,OAAO,CACH,uBAAC,sBAAY,IACT,OAAO,EAAE,mCAAc,CAAC,MAAM,KAAK,iCAAY,CAAC,KAAK,EACrD,IAAI,EAAE,IAAA,WAAI,EAAC,gBAAgB,CAAC,EAC5B,UAAU,EAAE,IAAA,WAAI,EAAC,eAAe,CAAC,EACjC,OAAO,EAAE,UAAU,EACnB,SAAS,EAAE,CAAC,CAAC,SAAS,CAAC,YAEvB,iCAAK,SAAS,EAAE,CAAC,CAAC,SAAS,CAAC,aAExB,gCACI,EAAE,EAAE,WAAW,EACf,SAAS,EAAE,CAAC,CAAC,EAAC,MAAM,EAAE,CAAC,KAAK,EAAC,EAAE,SAAS,CAAC,EACzC,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,EAAC,MAAM,EAAC,GACjB,EACD,OAAO,CAAC,CAAC,CAAC,uBAAC,YAAI,IAAC,IAAI,EAAC,IAAI,EAAC,SAAS,EAAE,CAAC,CAAC,SAAS,CAAC,GAAI,CAAC,CAAC,CAAC,IAAI,IAC3D,GACK,CAClB,CAAC;AACN,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {Spin} from '@gravity-ui/uikit';\nimport debounce from 'lodash/debounce';\n\nimport {LocaleContext} from '../../../context/localeContext/localeContext';\nimport {MapsContext} from '../../../context/mapsContext/mapsContext';\nimport {MobileContext} from '../../../context/mobileContext';\nimport {YMapProps} from '../../../models';\nimport {block} from '../../../utils';\nimport ErrorWrapper from '../../ErrorWrapper/ErrorWrapper';\nimport {getMapHeight} from '../helpers';\n\nimport {YMap} from './YMap';\nimport {MapApiStatus, YMapsApiLoader} from './YandexMapApiLoader';\nimport {i18n} from './i18n';\n\nconst b = block('map');\nconst DEFAULT_CONTAINER_ID = 'ymap';\nconst DEFAULT_ZOOM = 9;\n// Center - is a required parameter for creating a new map\n// We use this init center to create a map\n// The real center of the map will be calculated later, using the coordinates of the markers\nconst INITIAL_CENTER = [0, 0];\n\nconst YandexMap = (props: YMapProps) => {\n    const {markers, zoom, id, className} = props;\n    const {apiKey, scriptSrc, nonce} = React.useContext(MapsContext);\n    const isMobile = React.useContext(MobileContext);\n\n    const {lang = 'ru'} = React.useContext(LocaleContext);\n    const containerId = `${DEFAULT_CONTAINER_ID}-${id}`;\n\n    const [ymap, setYmaps] = React.useState<YMap | null>(null);\n    const [height, setHeight] = React.useState<number | undefined>(undefined);\n    const ref = React.useRef<HTMLDivElement>(null);\n\n    const [loading, setLoading] = React.useState<boolean>(false);\n    const [ready, setReady] = React.useState<boolean>(false);\n    const [attemptsIndex, setAttemptsIndex] = React.useState<number>(0);\n    const onTryAgain = React.useCallback(() => {\n        setAttemptsIndex(attemptsIndex + 1);\n    }, [attemptsIndex]);\n\n    React.useEffect(() => {\n        (async function () {\n            setLoading(true);\n\n            await YMapsApiLoader.loadApi(apiKey, scriptSrc, lang, nonce);\n\n            window.ymaps?.ready(() => {\n                setYmaps(\n                    new YMap(\n                        new window.ymaps.Map(\n                            containerId,\n                            {\n                                center: INITIAL_CENTER,\n                                zoom: zoom || DEFAULT_ZOOM,\n                            },\n                            {autoFitToViewport: 'always'},\n                        ),\n                        ref.current,\n                    ),\n                );\n            });\n\n            setLoading(false);\n        })();\n    }, [apiKey, lang, scriptSrc, containerId, zoom, nonce, attemptsIndex, setLoading]);\n\n    React.useEffect(() => {\n        const updateSize = debounce(() => {\n            if (ref.current) {\n                setHeight(Math.round(getMapHeight(ref.current.offsetWidth, isMobile)));\n            }\n        }, 100);\n\n        updateSize();\n        window.addEventListener('resize', updateSize, {passive: true});\n\n        return () => {\n            window.removeEventListener('resize', updateSize);\n        };\n    }, [markers, ymap, setYmaps, isMobile]);\n\n    React.useEffect(() => {\n        if (ymap) {\n            // show with computed center and placemarks\n            const showPlacemarks = async () => {\n                await ymap.showPlacemarks({markers, zoom});\n\n                setReady(true);\n            };\n\n            showPlacemarks();\n        }\n    });\n\n    if (!markers) return null;\n\n    return (\n        <ErrorWrapper\n            isError={YMapsApiLoader.status === MapApiStatus.Error}\n            text={i18n('map-load-error')}\n            buttonText={i18n('map-try-again')}\n            handler={onTryAgain}\n            className={b('wrapper')}\n        >\n            <div className={b('wrapper')}>\n                {/* hidden - to show the map after calculating the center */}\n                <div\n                    id={containerId}\n                    className={b({hidden: !ready}, className)}\n                    ref={ref}\n                    style={{height}}\n                />\n                {loading ? <Spin size=\"xl\" className={b('spinner')} /> : null}\n            </div>\n        </ErrorWrapper>\n    );\n};\n\nexport default YandexMap;\n"]}
+{"version":3,"file":"YandexMap.js","sourceRoot":"../../../../../src","sources":["components/Map/YMap/YandexMap.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport {Spin} from '@gravity-ui/uikit';\nimport debounce from 'lodash/debounce';\n\nimport {LocaleContext} from '../../../context/localeContext/localeContext';\nimport {MapsContext} from '../../../context/mapsContext/mapsContext';\nimport {MobileContext} from '../../../context/mobileContext';\nimport {YMapMarkerLabelPrivate, YMapMarkerPrivate, YMapProps} from '../../../models';\nimport {block} from '../../../utils';\nimport ErrorWrapper from '../../ErrorWrapper/ErrorWrapper';\nimport {getMapHeight} from '../helpers';\n\nimport {YMap} from './YMap';\nimport {MapApiStatus, YMapsApiLoader} from './YandexMapApiLoader';\nimport {i18n} from './i18n';\n\nconst b = block('map');\nconst DEFAULT_CONTAINER_ID = 'ymap';\nconst DEFAULT_ZOOM = 9;\n// Center - is a required parameter for creating a new map\n// We use this init center to create a map\n// The real center of the map will be calculated later, using the coordinates of the markers\nconst INITIAL_CENTER = [0, 0];\n\nconst BALLOON_DISABLING_MARKER_OPTIONS: YMapMarkerLabelPrivate = {\n    cursor: 'drag',\n    interactivityModel: 'default#silent',\n};\n\nconst YandexMap = (props: YMapProps) => {\n    const {\n        markers,\n        zoom,\n        id,\n        disableControls = false,\n        disableBalloons = false,\n        areaMargin,\n        className,\n        forceAspectRatio = true,\n    } = props;\n    const {apiKey, scriptSrc, nonce} = React.useContext(MapsContext);\n    const isMobile = React.useContext(MobileContext);\n\n    const {lang = 'ru'} = React.useContext(LocaleContext);\n    const containerId = `${DEFAULT_CONTAINER_ID}-${id}`;\n\n    const [ymap, setYmaps] = React.useState<YMap | null>(null);\n    const [height, setHeight] = React.useState<number | undefined>(undefined);\n    const ref = React.useRef<HTMLDivElement>(null);\n\n    const [loading, setLoading] = React.useState<boolean>(false);\n    const [ready, setReady] = React.useState<boolean>(false);\n    const [attemptsIndex, setAttemptsIndex] = React.useState<number>(0);\n    const onTryAgain = React.useCallback(() => {\n        setAttemptsIndex(attemptsIndex + 1);\n    }, [attemptsIndex]);\n\n    React.useEffect(() => {\n        (async function () {\n            setLoading(true);\n\n            await YMapsApiLoader.loadApi(apiKey, scriptSrc, lang, nonce);\n\n            window.ymaps?.ready(() => {\n                setYmaps(\n                    new YMap(\n                        new window.ymaps.Map(\n                            containerId,\n                            {\n                                center: INITIAL_CENTER,\n                                zoom: zoom || DEFAULT_ZOOM,\n                                controls: disableControls ? [] : undefined,\n                            },\n                            {\n                                autoFitToViewport: 'always',\n                                suppressMapOpenBlock: disableControls,\n                                yandexMapDisablePoiInteractivity: disableControls,\n                            },\n                        ),\n                        ref.current,\n                    ),\n                );\n            });\n\n            setLoading(false);\n        })();\n    }, [\n        apiKey,\n        lang,\n        scriptSrc,\n        containerId,\n        zoom,\n        nonce,\n        attemptsIndex,\n        setLoading,\n        disableControls,\n    ]);\n\n    React.useEffect(() => {\n        if (!forceAspectRatio) {\n            return;\n        }\n\n        const updateSize = debounce(() => {\n            if (ref.current) {\n                setHeight(Math.round(getMapHeight(ref.current.offsetWidth, isMobile)));\n            }\n        }, 100);\n\n        updateSize();\n        window.addEventListener('resize', updateSize, {passive: true});\n\n        // eslint-disable-next-line consistent-return\n        return () => {\n            window.removeEventListener('resize', updateSize);\n        };\n    }, [isMobile, forceAspectRatio]);\n\n    React.useEffect(() => {\n        if (ymap) {\n            // show with computed center and placemarks\n            const showPlacemarks = async () => {\n                const privateMarkers: YMapMarkerPrivate[] = disableBalloons\n                    ? markers.map(({label, ...marker}) => ({\n                          ...marker,\n                          label: {...label, ...BALLOON_DISABLING_MARKER_OPTIONS},\n                      }))\n                    : markers;\n\n                await ymap.showPlacemarks({markers: privateMarkers, zoom, areaMargin});\n\n                setReady(true);\n            };\n\n            showPlacemarks();\n        }\n    }, [ymap, markers, zoom, disableBalloons, areaMargin]);\n\n    if (!markers) return null;\n\n    return (\n        <ErrorWrapper\n            isError={YMapsApiLoader.status === MapApiStatus.Error}\n            text={i18n('map-load-error')}\n            buttonText={i18n('map-try-again')}\n            handler={onTryAgain}\n            className={b('wrapper')}\n        >\n            <div className={b('wrapper')}>\n                {/* hidden - to show the map after calculating the center */}\n                <div\n                    id={containerId}\n                    className={b({hidden: !ready}, className)}\n                    ref={ref}\n                    style={{height}}\n                />\n                {loading ? <Spin size=\"xl\" className={b('spinner')} /> : null}\n            </div>\n        </ErrorWrapper>\n    );\n};\n\nexport default YandexMap;\n"]}

package/build/cjs/components/Map/YMap/utils.d.ts

@@ -0,0 +1,8 @@
+import { Coordinate, YMapMargin } from "../../../models/index.js";
+export type ParsedMargin = [top: number, right: number, bottom: number, left: number];
+export declare const parseMargin: (margin: YMapMargin) => ParsedMargin;
+export declare const calcPixelBounds: ([leftTop, rightBottom]: [Coordinate, Coordinate], zoom: number, containerSize: Coordinate) => number[][];
+export declare const calculateMapParamsWithMarginAndZoom: ([leftTop, rightBottom]: [Coordinate, Coordinate], zoom: number, areaMargin: ParsedMargin, containerSize: Coordinate) => {
+    center: any;
+    zoom: number;
+};

package/build/cjs/components/Map/YMap/utils.js

@@ -0,0 +1,96 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.calculateMapParamsWithMarginAndZoom = exports.calcPixelBounds = exports.parseMargin = void 0;
+const parseMargin = (margin) => {
+    if (!Array.isArray(margin)) {
+        return [margin, margin, margin, margin];
+    }
+    if (margin.length === 2) {
+        return [margin[0], margin[1], margin[0], margin[1]];
+    }
+    return margin;
+};
+exports.parseMargin = parseMargin;
+const calcPixelBounds = ([leftTop, rightBottom], zoom, containerSize) => {
+    const utils = window.ymaps.util.bounds;
+    let [[leftPx, topPx], [rightPx, bottomPx]] = utils.toGlobalPixelBounds([leftTop, rightBottom], zoom);
+    // fall back to container size in case there is only one marker and area is 0
+    if (rightPx - leftPx <= 0) {
+        const halfX = containerSize[0] / 2;
+        leftPx -= halfX;
+        rightPx += halfX;
+    }
+    if (bottomPx - topPx <= 0) {
+        const halfY = containerSize[1] / 2;
+        topPx -= halfY;
+        bottomPx += halfY;
+    }
+    return [
+        [leftPx, topPx],
+        [rightPx, bottomPx],
+    ];
+};
+exports.calcPixelBounds = calcPixelBounds;
+const calcNewZoom = (l, zoom, marginSum) => {
+    return Math.log2((Math.pow(2, zoom) * (l - marginSum)) / l);
+};
+const calculateMapParamsWithMarginAndZoom = ([leftTop, rightBottom], zoom, areaMargin, containerSize) => {
+    const utils = window.ymaps.util.bounds;
+    // calculate pixel bounds with current zoom
+    let [[leftPx, topPx], [rightPx, bottomPx]] = (0, exports.calcPixelBounds)([leftTop, rightBottom], zoom, containerSize);
+    const [topMargin, rightMargin, bottomMargin, leftMargin] = areaMargin;
+    let zoomV;
+    let zoomH;
+    // calculate new zoom value after margins are applied
+    if (leftMargin && rightMargin) {
+        zoomH = calcNewZoom(rightPx - leftPx, zoom, leftMargin + rightMargin);
+    }
+    else {
+        zoomH = zoom;
+    }
+    if (topMargin && bottomMargin) {
+        zoomV = calcNewZoom(bottomPx - topPx, zoom, topMargin + bottomMargin);
+    }
+    else {
+        zoomV = zoom;
+    }
+    const newZoom = Math.min(zoomV, zoomH);
+    // calculate pixel bounds with new zoom
+    [[leftPx, topPx], [rightPx, bottomPx]] = (0, exports.calcPixelBounds)([leftTop, rightBottom], newZoom, containerSize);
+    // calculate new bounds (scale if both size are present, otherwise shift the map)
+    if (leftMargin && rightMargin) {
+        leftPx -= leftMargin;
+        rightPx += rightMargin;
+    }
+    else if (leftMargin) {
+        leftPx -= leftMargin;
+        rightPx -= leftMargin;
+    }
+    else if (rightMargin) {
+        leftPx += rightMargin;
+        rightPx += rightMargin;
+    }
+    if (topMargin && bottomMargin) {
+        topPx -= topMargin;
+        bottomPx += bottomMargin;
+    }
+    else if (topMargin) {
+        topPx -= topMargin;
+        bottomPx -= topMargin;
+    }
+    else if (bottomMargin) {
+        topPx += bottomMargin;
+        bottomPx += bottomMargin;
+    }
+    // transform new bounds into coordinates
+    const [newLeftTop, newRightBottom] = utils.fromGlobalPixelBounds([
+        [leftPx, topPx],
+        [rightPx, bottomPx],
+    ], newZoom);
+    return {
+        center: utils.getCenter([newLeftTop, newRightBottom]),
+        zoom: newZoom,
+    };
+};
+exports.calculateMapParamsWithMarginAndZoom = calculateMapParamsWithMarginAndZoom;
+//# sourceMappingURL=utils.js.map

package/build/cjs/components/Map/YMap/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sourceRoot":"../../../../../src","sources":["components/Map/YMap/utils.ts"],"names":[],"mappings":"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","sourcesContent":["import {Coordinate, YMapMargin} from '../../../models';\n\nexport type ParsedMargin = [top: number, right: number, bottom: number, left: number];\n\nexport const parseMargin = (margin: YMapMargin): ParsedMargin => {\n    if (!Array.isArray(margin)) {\n        return [margin, margin, margin, margin];\n    }\n\n    if (margin.length === 2) {\n        return [margin[0], margin[1], margin[0], margin[1]];\n    }\n\n    return margin;\n};\n\nexport const calcPixelBounds = (\n    [leftTop, rightBottom]: [Coordinate, Coordinate],\n    zoom: number,\n    containerSize: Coordinate,\n) => {\n    const utils = window.ymaps.util.bounds;\n\n    let [[leftPx, topPx], [rightPx, bottomPx]] = utils.toGlobalPixelBounds(\n        [leftTop, rightBottom],\n        zoom,\n    ) as [Coordinate, Coordinate];\n\n    // fall back to container size in case there is only one marker and area is 0\n    if (rightPx - leftPx <= 0) {\n        const halfX = containerSize[0] / 2;\n        leftPx -= halfX;\n        rightPx += halfX;\n    }\n\n    if (bottomPx - topPx <= 0) {\n        const halfY = containerSize[1] / 2;\n        topPx -= halfY;\n        bottomPx += halfY;\n    }\n\n    return [\n        [leftPx, topPx],\n        [rightPx, bottomPx],\n    ];\n};\n\nconst calcNewZoom = (l: number, zoom: number, marginSum: number) => {\n    return Math.log2((Math.pow(2, zoom) * (l - marginSum)) / l);\n};\n\nexport const calculateMapParamsWithMarginAndZoom = (\n    [leftTop, rightBottom]: [Coordinate, Coordinate],\n    zoom: number,\n    areaMargin: ParsedMargin,\n    containerSize: Coordinate,\n) => {\n    const utils = window.ymaps.util.bounds;\n\n    // calculate pixel bounds with current zoom\n    let [[leftPx, topPx], [rightPx, bottomPx]] = calcPixelBounds(\n        [leftTop, rightBottom],\n        zoom,\n        containerSize,\n    );\n\n    const [topMargin, rightMargin, bottomMargin, leftMargin] = areaMargin;\n\n    let zoomV: number;\n    let zoomH: number;\n\n    // calculate new zoom value after margins are applied\n    if (leftMargin && rightMargin) {\n        zoomH = calcNewZoom(rightPx - leftPx, zoom, leftMargin + rightMargin);\n    } else {\n        zoomH = zoom;\n    }\n\n    if (topMargin && bottomMargin) {\n        zoomV = calcNewZoom(bottomPx - topPx, zoom, topMargin + bottomMargin);\n    } else {\n        zoomV = zoom;\n    }\n\n    const newZoom = Math.min(zoomV, zoomH);\n\n    // calculate pixel bounds with new zoom\n    [[leftPx, topPx], [rightPx, bottomPx]] = calcPixelBounds(\n        [leftTop, rightBottom],\n        newZoom,\n        containerSize,\n    );\n\n    // calculate new bounds (scale if both size are present, otherwise shift the map)\n    if (leftMargin && rightMargin) {\n        leftPx -= leftMargin;\n        rightPx += rightMargin;\n    } else if (leftMargin) {\n        leftPx -= leftMargin;\n        rightPx -= leftMargin;\n    } else if (rightMargin) {\n        leftPx += rightMargin;\n        rightPx += rightMargin;\n    }\n\n    if (topMargin && bottomMargin) {\n        topPx -= topMargin;\n        bottomPx += bottomMargin;\n    } else if (topMargin) {\n        topPx -= topMargin;\n        bottomPx -= topMargin;\n    } else if (bottomMargin) {\n        topPx += bottomMargin;\n        bottomPx += bottomMargin;\n    }\n\n    // transform new bounds into coordinates\n    const [newLeftTop, newRightBottom] = utils.fromGlobalPixelBounds(\n        [\n            [leftPx, topPx],\n            [rightPx, bottomPx],\n        ],\n        newZoom,\n    );\n\n    return {\n        center: utils.getCenter([newLeftTop, newRightBottom]),\n        zoom: newZoom,\n    };\n};\n"]}

package/build/cjs/components/index.d.ts

@@ -26,6 +26,7 @@ export { default as ImageBase } from "./ImageBase/ImageBase.js";
 export { default as InnerForm } from "./InnerForm/InnerForm.js";
 export { default as Link } from "./Link/Link.js";
 export { default as Links } from "./Links/Links.js";
+export { default as Map } from "./Map/Map.js";
 export { default as Media } from "./Media/Media.js";
 export { default as MetaInfo } from "./MetaInfo/MetaInfo.js";
 export { default as OutsideClick } from "./OutsideClick/OutsideClick.js";

package/build/cjs/components/index.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.YandexForm = exports.YFMWrapper = exports.VideoBlock = exports.UnpublishedLabel = exports.ToggleArrow = exports.Title = exports.ButtonTabs = exports.Table = exports.RouterLink = exports.ReactPlayer = exports.OverflowScroller = exports.OutsideClick = exports.MetaInfo = exports.Media = exports.Links = exports.Link = exports.InnerForm = exports.ImageBase = exports.Image = exports.IconWrapper = exports.HTML = exports.HeaderBreadcrumbs = exports.FullWidthBackground = exports.FullscreenMedia = exports.FullscreenImage = exports.Foldable = exports.FileLink = exports.ErrorWrapper = exports.Control = exports.ContentList = exports.CardBase = exports.BrandFooter = exports.Buttons = exports.Button = exports.BlockBase = exports.BalancedMasonry = exports.BackLink = exports.BackgroundMedia = exports.BackgroundImage = exports.Author = exports.AnimateBlock = exports.Anchor = void 0;
+exports.YandexForm = exports.YFMWrapper = exports.VideoBlock = exports.UnpublishedLabel = exports.ToggleArrow = exports.Title = exports.ButtonTabs = exports.Table = exports.RouterLink = exports.ReactPlayer = exports.OverflowScroller = exports.OutsideClick = exports.MetaInfo = exports.Media = exports.Map = exports.Links = exports.Link = exports.InnerForm = exports.ImageBase = exports.Image = exports.IconWrapper = exports.HTML = exports.HeaderBreadcrumbs = exports.FullWidthBackground = exports.FullscreenMedia = exports.FullscreenImage = exports.Foldable = exports.FileLink = exports.ErrorWrapper = exports.Control = exports.ContentList = exports.CardBase = exports.BrandFooter = exports.Buttons = exports.Button = exports.BlockBase = exports.BalancedMasonry = exports.BackLink = exports.BackgroundMedia = exports.BackgroundImage = exports.Author = exports.AnimateBlock = exports.Anchor = void 0;
 const tslib_1 = require("tslib");
 var Anchor_1 = require("./Anchor/Anchor.js");
 Object.defineProperty(exports, "Anchor", { enumerable: true, get: function () { return tslib_1.__importDefault(Anchor_1).default; } });
@@ -58,6 +58,8 @@ var Link_1 = require("./Link/Link.js");
 Object.defineProperty(exports, "Link", { enumerable: true, get: function () { return tslib_1.__importDefault(Link_1).default; } });
 var Links_1 = require("./Links/Links.js");
 Object.defineProperty(exports, "Links", { enumerable: true, get: function () { return tslib_1.__importDefault(Links_1).default; } });
+var Map_1 = require("./Map/Map.js");
+Object.defineProperty(exports, "Map", { enumerable: true, get: function () { return tslib_1.__importDefault(Map_1).default; } });
 var Media_1 = require("./Media/Media.js");
 Object.defineProperty(exports, "Media", { enumerable: true, get: function () { return tslib_1.__importDefault(Media_1).default; } });
 var MetaInfo_1 = require("./MetaInfo/MetaInfo.js");