@dartcom/ui-kit 10.2.8 → 10.2.10

package/dist/components/alert-dialog/alert-dialog.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"alert-dialog.d.ts","sourceRoot":"","sources":["../../../src/components/alert-dialog/alert-dialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAiB/B,OAAO,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;;AAiF3C,wBAAqC"}
+{"version":3,"file":"alert-dialog.d.ts","sourceRoot":"","sources":["../../../src/components/alert-dialog/alert-dialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAiB/B,OAAO,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;;AAqG3C,wBAAqC"}

package/dist/components/alert-dialog/alert-dialog.stories.d.ts

@@ -3,7 +3,11 @@ import type { Meta, StoryObj } from '@storybook/react-vite';
 type FormType = typeof AlertDialog;
 declare const meta: Meta<FormType>;
 type Story = StoryObj<FormType>;
-export declare const Base: Story;
+export declare const Info: Story;
 export declare const Delete: Story;
+export declare const Warning: Story;
+export declare const WithContent: Story;
+export declare const DisabledAgreeButton: Story;
+export declare const DisabledDisagreeButton: Story;
 export default meta;
 //# sourceMappingURL=alert-dialog.stories.d.ts.map

package/dist/components/alert-dialog/alert-dialog.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"alert-dialog.stories.d.ts","sourceRoot":"","sources":["../../../src/components/alert-dialog/alert-dialog.stories.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,WAAW,EAAE,MAAM,GAAG,CAAC;AAEhC,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAG5D,KAAK,QAAQ,GAAG,OAAO,WAAW,CAAC;AAInC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,QAAQ,CAgCxB,CAAC;AAEF,KAAK,KAAK,GAAG,QAAQ,CAAC,QAAQ,CAAC,CAAC;AAEhC,eAAO,MAAM,IAAI,EAAE,KAAU,CAAC;AAE9B,eAAO,MAAM,MAAM,EAAE,KAIpB,CAAC;AAEF,eAAe,IAAI,CAAC"}
+{"version":3,"file":"alert-dialog.stories.d.ts","sourceRoot":"","sources":["../../../src/components/alert-dialog/alert-dialog.stories.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAE,WAAW,EAAE,MAAM,GAAG,CAAC;AAEhC,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAG5D,KAAK,QAAQ,GAAG,OAAO,WAAW,CAAC;AAInC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,QAAQ,CAgCxB,CAAC;AAEF,KAAK,KAAK,GAAG,QAAQ,CAAC,QAAQ,CAAC,CAAC;AAEhC,eAAO,MAAM,IAAI,EAAE,KAAU,CAAC;AAE9B,eAAO,MAAM,MAAM,EAAE,KAIpB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAIrB,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAUzB,CAAC;AAEF,eAAO,MAAM,mBAAmB,EAAE,KAMjC,CAAC;AAEF,eAAO,MAAM,sBAAsB,EAAE,KAMpC,CAAC;AAEF,eAAe,IAAI,CAAC"}

package/dist/components/alert-dialog/types.d.ts

@@ -6,9 +6,14 @@ export type AlertDialogProps = {
     onSuccess: () => void;
     onOpen?: () => void;
     onClose?: () => void;
-    buttonsText?: {
-        agree?: string;
-        disagree?: string;
+    content?: React.JSX.Element;
+    agreeButton?: {
+        text?: string;
+        disabled?: boolean;
+    };
+    disagreeButton?: {
+        text?: string;
+        disabled?: boolean;
     };
 };
 //# sourceMappingURL=types.d.ts.map

package/dist/components/alert-dialog/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/alert-dialog/types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,gBAAgB,GAAG;IAC7B,IAAI,EAAE,MAAM,CAAC;IAEb,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;IAEpB,KAAK,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,SAAS,CAAC;IAErC,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IAErB,WAAW,CAAC,EAAE;QACZ,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,QAAQ,CAAC,EAAE,MAAM,CAAC;KACnB,CAAC;CACH,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/alert-dialog/types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,gBAAgB,GAAG;IAC7B,IAAI,EAAE,MAAM,CAAC;IAEb,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;IAEpB,KAAK,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,SAAS,CAAC;IAErC,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IAErB,OAAO,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC;IAE5B,WAAW,CAAC,EAAE;QACZ,IAAI,CAAC,EAAE,MAAM,CAAC;QACd,QAAQ,CAAC,EAAE,OAAO,CAAC;KACpB,CAAC;IAEF,cAAc,CAAC,EAAE;QACf,IAAI,CAAC,EAAE,MAAM,CAAC;QACd,QAAQ,CAAC,EAAE,OAAO,CAAC;KACpB,CAAC;CACH,CAAC"}

package/dist/components/layers/leaflet/layers/link/constants.d.ts

@@ -1,7 +1,17 @@
-export declare const zLvlOrders: number[];
+import { TangramLayerDraw } from '../../lib';
+import { SublayerConfig } from './types';
+export declare const zLvlOrders: string[];
 export declare const functionInterval: number[][];
+export declare const generalizationZoom = 16;
 export declare const colorFunction = "function() {\n  const { functional_class, tunnel, tollway } = feature;\n\n  const alpha = tunnel ? 0.89 : 1;\n\n  const getRGB = (hex, alpha) => {\n    const r = +(parseInt(hex.slice(1, 3), 16) / 255).toFixed(2);\n    const g = +(parseInt(hex.slice(3, 5), 16) / 255).toFixed(2);\n    const b = +(parseInt(hex.slice(5, 7), 16) / 255).toFixed(2);\n\n    return [r, g, b, alpha];\n  }\n\n  if (tollway) {\n    return '#D72740';\n  }\n\n  switch (functional_class) {\n    case 1:\n    case 2: {\n      const color = getRGB('#D1747F', alpha);\n\n      return color;\n    }\n\n    case 3:\n    case 4: {\n      const color = getRGB('#B1A7AA', alpha);\n\n      return color;\n    }\n\n    case 5: {\n      const color = getRGB('#D5CEC3', alpha);\n\n      return color;\n    }\n  }\n}";
 export declare const widthFunction = "function() {\n  const { functional_class, road_number } = feature;\n\n  const getScale = () => {\n    if ($zoom <= 15 && $zoom >= 14) { return 7; }\n\n    if ($zoom <= 13 && $zoom >= 12) { return 9; }\n\n    if ($zoom <= 5) { return 400; }\n\n    if ($zoom <= 7) { return 200; }\n\n    if ($zoom < 12) { return 50; }\n\n    return 1;\n  }\n\n  const scale = getScale();\n\n  switch(functional_class) {\n    case 1:\n    case 2: {\n      return 8 * scale;\n    }\n\n    case 3:\n    case 4: {\n      return 7 * scale;\n    }\n\n    case 5: {\n      if (Boolean(road_number)) {\n        return 7 * scale;\n      }\n\n      return 6;\n    }\n  }\n}";
 export declare const outlineColorFunction = "function() {\n  const { functional_class, access_id, tollway } = feature;\n\n  if (tollway) {\n    return '#B9263B';\n  }\n\n  switch(functional_class) {\n    case 5: {\n      return '#989898';\n    }\n\n    case 3:\n    case 4: {\n      return '#8F6E78';\n    }\n\n    case 1:\n    case 2: {\n      return '#9A414B';\n    }\n  }\n}";
 export declare const outlineWidthFunction = "function() {\n  const { functional_class, access_id } = feature;\n\n  switch(functional_class) {\n    case 5: {\n      switch (access_id) {\n        case 32: {\n          return 0;\n        }\n\n        default: {\n          return 1;\n        }\n      }\n    }\n\n    default: {\n      return 1;\n    }\n  }\n}";
+export declare const roadNumberLayerDraw: TangramLayerDraw;
+export declare const baseLayerDraw: TangramLayerDraw;
+export declare const borderLayerDraw: TangramLayerDraw;
+export declare const generalizationBaseLayerDraw: TangramLayerDraw;
+export declare const lowMobilityConfig: SublayerConfig;
+export declare const constructionConfig: SublayerConfig;
+export declare const functionalClassAccessId32Config: SublayerConfig;
 //# sourceMappingURL=constants.d.ts.map

package/dist/components/layers/leaflet/layers/link/constants.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../../../../../src/components/layers/leaflet/layers/link/constants.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,UAAU,UAAwD,CAAC;AAEhF,eAAO,MAAM,gBAAgB,YAAwB,CAAC;AAEtD,eAAO,MAAM,aAAa,6wBAsCxB,CAAC;AAEH,eAAO,MAAM,aAAa,0oBAsCxB,CAAC;AAEH,eAAO,MAAM,oBAAoB,iVAsB/B,CAAC;AAEH,eAAO,MAAM,oBAAoB,4TAoB/B,CAAC"}
+{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../../../../../src/components/layers/leaflet/layers/link/constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,gBAAgB,EAAE,MAAM,WAAW,CAAC;AAExD,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAEzC,eAAO,MAAM,UAAU,UAWtB,CAAC;AAEF,eAAO,MAAM,gBAAgB,YAAwB,CAAC;AAEtD,eAAO,MAAM,kBAAkB,KAAK,CAAC;AAErC,eAAO,MAAM,aAAa,6wBAsCxB,CAAC;AAEH,eAAO,MAAM,aAAa,0oBAsCxB,CAAC;AAEH,eAAO,MAAM,oBAAoB,iVAsB/B,CAAC;AAEH,eAAO,MAAM,oBAAoB,4TAoB/B,CAAC;AAcH,eAAO,MAAM,mBAAmB,EAAE,gBAejC,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,gBAU3B,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,gBAU7B,CAAC;AAEF,eAAO,MAAM,2BAA2B,EAAE,gBASzC,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,cAU/B,CAAC;AAEF,eAAO,MAAM,kBAAkB,EAAE,cAYhC,CAAC;AAEF,eAAO,MAAM,+BAA+B,EAAE,cAY7C,CAAC"}

package/dist/components/layers/leaflet/layers/link/types.d.ts

@@ -0,0 +1,6 @@
+import { TangramLayerDraw } from '../../lib';
+export type SublayerConfig = {
+    filter: string;
+    draw: TangramLayerDraw;
+};
+//# sourceMappingURL=types.d.ts.map

package/dist/components/layers/leaflet/layers/link/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../../src/components/layers/leaflet/layers/link/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAC;AAE7C,MAAM,MAAM,cAAc,GAAG;IAC3B,MAAM,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,gBAAgB,CAAC;CACxB,CAAC"}

package/dist/components/layers/leaflet/layers/link/utils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../../../src/components/layers/leaflet/layers/link/utils.ts"],"names":[],"mappings":"AAEA,OAAO,EAGL,kBAAkB,EAElB,kBAAkB,EACnB,MAAM,WAAW,CAAC;AAWnB,eAAO,MAAM,aAAa,GAAI,QAAQ,kBAAkB,yBAgOvD,CAAC"}
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../../../src/components/layers/leaflet/layers/link/utils.ts"],"names":[],"mappings":"AAEA,OAAO,EAEL,kBAAkB,EAClB,kBAAkB,EACnB,MAAM,WAAW,CAAC;AA2BnB,eAAO,MAAM,aAAa,GAAI,QAAQ,kBAAkB,yBAqKvD,CAAC"}

package/dist/index.cjs

@@ -14854,7 +14854,7 @@ const UploadButton = ({ children, accept, onFilesLoad, ...props }) => {
                 }, multiple: true })] }));
 };
 
-const AlertDialog = ({ name, title, description, onSuccess, onOpen, onClose, theme = 'info', buttonsText, }) => {
+const AlertDialog = ({ name, title, description, onSuccess, onOpen, onClose, theme = 'info', agreeButton, disagreeButton, content, }) => {
     const dialogId = React__namespace.useId();
     const titleId = React__namespace.useId();
     const descriptionId = React__namespace.useId();
@@ -14877,10 +14877,13 @@ const AlertDialog = ({ name, title, description, onSuccess, onOpen, onClose, the
                         background,
                         color,
                     };
-                }, children: title }), jsxRuntime.jsx(material.Divider, {}), jsxRuntime.jsx(material.DialogContent, { children: jsxRuntime.jsx(material.DialogContentText, { id: descriptionId, children: description }) }), jsxRuntime.jsx(material.Divider, {}), jsxRuntime.jsxs(material.DialogActions, { children: [jsxRuntime.jsx(Button, { color: "error", onClick: handleClose, children: buttonsText?.disagree ?? 'Закрыть' }), jsxRuntime.jsx(Button, { color: "success", onClick: () => {
+                }, children: title }), jsxRuntime.jsx(material.Divider, {}), jsxRuntime.jsxs(material.DialogContent, { sx: ({ spacing }) => ({
+                    display: 'grid',
+                    gap: spacing(2),
+                }), children: [jsxRuntime.jsx(material.DialogContentText, { id: descriptionId, children: description }), content ? (jsxRuntime.jsxs(React__namespace.Fragment, { children: [jsxRuntime.jsx(material.Divider, {}), content] })) : null] }), jsxRuntime.jsx(material.Divider, {}), jsxRuntime.jsxs(material.DialogActions, { children: [jsxRuntime.jsx(Button, { color: "error", onClick: handleClose, disabled: disagreeButton?.disabled, children: disagreeButton?.text ?? 'Закрыть' }), jsxRuntime.jsx(Button, { color: "success", onClick: () => {
                             onSuccess();
                             handleClose();
-                        }, children: buttonsText?.agree ?? 'Подтвердить' })] })] }));
+                        }, disabled: agreeButton?.disabled, children: agreeButton?.text ?? 'Подтвердить' })] })] }));
 };
 var alertDialog = observer(AlertDialog);
 
@@ -25874,8 +25877,20 @@ const getLanduseAreaLayers = (source) => {
     return layers;
 };
 
-const zLvlOrders = [-1, -0.5, -0.3, 0.0, 0.3, 0.5, 0.7, 1.0, 1.5, 2.0];
+const zLvlOrders = [
+    '-1.0',
+    '-0.5',
+    '-0.3',
+    '0.0',
+    '0.3',
+    '0.5',
+    '0.7',
+    '1.0',
+    '1.5',
+    '2.0',
+];
 const functionInterval = [[5], [4, 3], [2, 1]];
+const generalizationZoom = 16;
 const colorFunction = `function() {
   const { functional_class, tunnel, tollway } = feature;
 
@@ -25998,7 +26013,101 @@ const outlineWidthFunction = `function() {
     }
   }
 }`;
+const text = {
+    text_source: 'street_name',
+    font: {
+        fill: 'black',
+        size: '14px',
+        stroke: { color: 'white', width: '3px' },
+    },
+};
+const roadNumberLayerDraw = {
+    text: {
+        text_source: 'road_number',
+        font: {
+            fill: '#181bff',
+            size: '16px',
+            weight: 'bold',
+            underline: true,
+            background: {
+                color: 'black',
+            },
+        },
+    },
+};
+const baseLayerDraw = {
+    text,
+    lines: {
+        color: colorFunction,
+        width: widthFunction,
+        cap: 'round',
+        join: 'round',
+    },
+};
+const borderLayerDraw = {
+    lines: {
+        color: colorFunction,
+        width: widthFunction,
+        outline: {
+            color: outlineColorFunction,
+            width: outlineWidthFunction,
+        },
+    },
+};
+const generalizationBaseLayerDraw = {
+    text,
+    lines: {
+        color: '#BABCC2',
+        width: 30,
+        cap: 'round',
+        join: 'round',
+    },
+};
+const lowMobilityConfig = {
+    filter: `function() {
+    return global.links.getIsLowMobility(feature);
+  }`,
+    draw: {
+        lines: {
+            width: 4,
+        },
+    },
+};
+const constructionConfig = {
+    filter: `function() {
+    return global.links.getIsConstruction(feature);
+  }`,
+    draw: {
+        lines: {
+            width: 3,
+            color: '#9AA096',
+            dash: [2, 1],
+        },
+    },
+};
+const functionalClassAccessId32Config = {
+    filter: `function() {
+    return global.links.getIsFunctionalClass(feature);
+  }`,
+    draw: {
+        lines: {
+            width: 2,
+            color: '#9AA096',
+            dash: [2, 1],
+        },
+    },
+};
 
+const getFilter = (zLvl) => {
+    const filter = `function() {
+    const { z_lvl = '0.0' } = feature;
+
+    const isFilter = z_lvl === '${zLvl}' && $zoom > ${generalizationZoom};
+
+    return isFilter;
+  }`;
+    return filter;
+};
 const getLinkLayers = (source) => {
     const layers = [];
     const data = {
@@ -26008,64 +26117,14 @@ const getLinkLayers = (source) => {
     const roadNumberLayer = {
         id: getUniqueKey(),
         data,
-        draw: {
-            text: {
-                text_source: 'road_number',
-                font: {
-                    fill: '#181bff',
-                    size: '16px',
-                    weight: 'bold',
-                    underline: true,
-                    background: {
-                        color: 'black',
-                    },
-                },
-            },
-        },
+        draw: roadNumberLayerDraw,
     };
     layers.push(roadNumberLayer);
-    const text = {
-        text_source: 'street_name',
-        font: {
-            fill: 'black',
-            size: '14px',
-            stroke: { color: 'white', width: '3px' },
-        },
-    };
-    const getBaseLayerDraw = () => ({
-        text,
-        lines: {
-            color: colorFunction,
-            width: widthFunction,
-            cap: 'round',
-            join: 'round',
-        },
-    });
-    const getBorderLayerDraw = () => ({
-        lines: {
-            color: colorFunction,
-            width: widthFunction,
-            outline: {
-                color: outlineColorFunction,
-                width: outlineWidthFunction,
-            },
-        },
-    });
-    const getFilter = (zLvl) => {
-        const filter = `function() {
-      const { z_lvl = 0.0 } = feature;
-
-      const isFilter = +z_lvl === ${zLvl};
-
-      return isFilter;
-    }`;
-        return filter;
-    };
     zLvlOrders.forEach((zLvl) => {
         const baseLayers = [];
         const borderLayers = [];
         switch (zLvl) {
-            case 0.0: {
+            case '0.0': {
                 functionInterval.forEach((functionClasses) => {
                     const classBaseLayers = [];
                     const classBorderLayers = [];
@@ -26074,47 +26133,39 @@ const getLinkLayers = (source) => {
                             id: getUniqueKey(),
                             data,
                             filter: `function() {
-                const { functional_class, z_lvl = 0.0 } = feature;
+                const { functional_class, z_lvl = '0.0' } = feature;
 
-                const isFilter = +z_lvl === ${zLvl} && +functional_class === ${functionClass};
+                const isFilter = z_lvl === '${zLvl}' && +functional_class === ${functionClass} && $zoom > ${generalizationZoom};
 
                 return isFilter;
               }`,
-                            draw: getBaseLayerDraw(),
+                            draw: baseLayerDraw,
                             sublayers: {
                                 construction: {
-                                    filter: `function() {
-                    return global.links.getIsConstruction(feature);
-                  }`,
-                                    draw: {
-                                        lines: {
-                                            width: 3,
-                                            color: '#9AA096',
-                                            dash: [2, 1],
-                                        },
-                                    },
+                                    ...constructionConfig,
                                 },
                                 functionalClassAccessId32: {
-                                    filter: `function() {
-                    return global.links.getIsFunctionalClass(feature);
-                  }`,
-                                    draw: {
-                                        lines: {
-                                            width: 2,
-                                            color: '#9AA096',
-                                            dash: [2, 1],
-                                        },
-                                    },
+                                    ...functionalClassAccessId32Config,
                                 },
                                 lowMobility: {
-                                    filter: `function() {
-                    return global.links.getIsLowMobility(feature);
-                  }`,
-                                    draw: {
-                                        lines: {
-                                            width: 4,
-                                        },
-                                    },
+                                    ...lowMobilityConfig,
+                                },
+                            },
+                        };
+                        const generalizationLayer = {
+                            id: getUniqueKey(),
+                            data,
+                            filter: `function() {
+                const { functional_class, z_lvl = '0.0' } = feature;
+
+                const isFilter = z_lvl === '${zLvl}' && +functional_class === ${functionClass} && $zoom <= ${generalizationZoom};
+
+                return isFilter;
+              }`,
+                            draw: generalizationBaseLayerDraw,
+                            sublayers: {
+                                functionalClassAccessId32: {
+                                    ...functionalClassAccessId32Config,
                                 },
                             },
                         };
@@ -26122,27 +26173,21 @@ const getLinkLayers = (source) => {
                             id: getUniqueKey(),
                             data,
                             filter: `function() {
-                const { functional_class, z_lvl = 0.0 } = feature;
+                const { functional_class, z_lvl = '0.0' } = feature;
 
-                const isFilter = +z_lvl === ${zLvl} && +functional_class === ${functionClass} && !global.links.getIsConstruction(feature) && !global.links.getIsFunctionalClass(feature);
+                const isFilter = z_lvl === '${zLvl}' && +functional_class === ${functionClass} && !global.links.getIsConstruction(feature) && !global.links.getIsFunctionalClass(feature) && $zoom > ${generalizationZoom};
 
 
                 return isFilter;
               }`,
-                            draw: getBorderLayerDraw(),
+                            draw: borderLayerDraw,
                             sublayers: {
                                 lowMobility: {
-                                    filter: `function() {
-                    return global.links.getIsLowMobility(feature);
-                  }`,
-                                    draw: {
-                                        lines: {
-                                            width: 4,
-                                        },
-                                    },
+                                    ...lowMobilityConfig,
                                 },
                             },
                         };
+                        classBaseLayers.push(generalizationLayer);
                         classBaseLayers.push(baseLayer);
                         classBorderLayers.push(borderLayer);
                     });
@@ -26157,16 +26202,29 @@ const getLinkLayers = (source) => {
                     id: getUniqueKey(),
                     data,
                     filter,
-                    draw: getBaseLayerDraw(),
+                    draw: baseLayerDraw,
+                };
+                const generalizationLayer = {
+                    id: getUniqueKey(),
+                    data,
+                    filter: `function() {
+            const { z_lvl = '0.0' } = feature;
+
+            const isFilter = z_lvl === '${zLvl}' && $zoom <= ${generalizationZoom};
+
+            return isFilter;
+          }`,
+                    draw: generalizationBaseLayerDraw,
                 };
                 const borderLayer = {
                     id: getUniqueKey(),
                     data,
                     filter,
-                    draw: getBorderLayerDraw(),
+                    draw: borderLayerDraw,
                 };
                 baseLayers.push(baseLayer);
                 borderLayers.push(borderLayer);
+                baseLayers.push(generalizationLayer);
             }
         }
         layers.push(...borderLayers, ...baseLayers);