diff --git a/src/blocks/Map/__snapshots__/Map.visual.test.tsx-snapshots/Map-render-stories-Default-light-chromium-linux.png b/src/blocks/Map/__snapshots__/Map.visual.test.tsx-snapshots/Map-render-stories-Default-light-chromium-linux.png
index 2e9eccf6c..96ca325cd 100644
Binary files a/src/blocks/Map/__snapshots__/Map.visual.test.tsx-snapshots/Map-render-stories-Default-light-chromium-linux.png and b/src/blocks/Map/__snapshots__/Map.visual.test.tsx-snapshots/Map-render-stories-Default-light-chromium-linux.png differ
diff --git a/src/blocks/Map/__snapshots__/Map.visual.test.tsx-snapshots/Map-render-stories-Default-light-webkit-linux.png b/src/blocks/Map/__snapshots__/Map.visual.test.tsx-snapshots/Map-render-stories-Default-light-webkit-linux.png
index c37c6eb6c..b18b2dda8 100644
Binary files a/src/blocks/Map/__snapshots__/Map.visual.test.tsx-snapshots/Map-render-stories-Default-light-webkit-linux.png and b/src/blocks/Map/__snapshots__/Map.visual.test.tsx-snapshots/Map-render-stories-Default-light-webkit-linux.png differ
diff --git a/src/blocks/Map/__snapshots__/Map.visual.test.tsx-snapshots/Map-render-stories-Direction-light-chromium-linux.png b/src/blocks/Map/__snapshots__/Map.visual.test.tsx-snapshots/Map-render-stories-Direction-light-chromium-linux.png
index 7e8095d58..ab9503eb0 100644
Binary files a/src/blocks/Map/__snapshots__/Map.visual.test.tsx-snapshots/Map-render-stories-Direction-light-chromium-linux.png and b/src/blocks/Map/__snapshots__/Map.visual.test.tsx-snapshots/Map-render-stories-Direction-light-chromium-linux.png differ
diff --git a/src/blocks/Map/__snapshots__/Map.visual.test.tsx-snapshots/Map-render-stories-Direction-light-webkit-linux.png b/src/blocks/Map/__snapshots__/Map.visual.test.tsx-snapshots/Map-render-stories-Direction-light-webkit-linux.png
index 781657640..887f209db 100644
Binary files a/src/blocks/Map/__snapshots__/Map.visual.test.tsx-snapshots/Map-render-stories-Direction-light-webkit-linux.png and b/src/blocks/Map/__snapshots__/Map.visual.test.tsx-snapshots/Map-render-stories-Direction-light-webkit-linux.png differ
diff --git a/src/blocks/Map/__snapshots__/Map.visual.test.tsx-snapshots/Map-render-stories-MapsTypes-light-chromium-linux.png b/src/blocks/Map/__snapshots__/Map.visual.test.tsx-snapshots/Map-render-stories-MapsTypes-light-chromium-linux.png
index 867ac95f4..c60f468c3 100644
Binary files a/src/blocks/Map/__snapshots__/Map.visual.test.tsx-snapshots/Map-render-stories-MapsTypes-light-chromium-linux.png and b/src/blocks/Map/__snapshots__/Map.visual.test.tsx-snapshots/Map-render-stories-MapsTypes-light-chromium-linux.png differ
diff --git a/src/blocks/Map/__snapshots__/Map.visual.test.tsx-snapshots/Map-render-stories-MapsTypes-light-webkit-linux.png b/src/blocks/Map/__snapshots__/Map.visual.test.tsx-snapshots/Map-render-stories-MapsTypes-light-webkit-linux.png
index 7282bfaee..c928483f0 100644
Binary files a/src/blocks/Map/__snapshots__/Map.visual.test.tsx-snapshots/Map-render-stories-MapsTypes-light-webkit-linux.png and b/src/blocks/Map/__snapshots__/Map.visual.test.tsx-snapshots/Map-render-stories-MapsTypes-light-webkit-linux.png differ
diff --git a/src/blocks/Map/__snapshots__/Map.visual.test.tsx-snapshots/Map-render-stories-Size-light-chromium-linux.png b/src/blocks/Map/__snapshots__/Map.visual.test.tsx-snapshots/Map-render-stories-Size-light-chromium-linux.png
index 592f2b4b5..1e872e897 100644
Binary files a/src/blocks/Map/__snapshots__/Map.visual.test.tsx-snapshots/Map-render-stories-Size-light-chromium-linux.png and b/src/blocks/Map/__snapshots__/Map.visual.test.tsx-snapshots/Map-render-stories-Size-light-chromium-linux.png differ
diff --git a/src/blocks/Map/__snapshots__/Map.visual.test.tsx-snapshots/Map-render-stories-Size-light-webkit-linux.png b/src/blocks/Map/__snapshots__/Map.visual.test.tsx-snapshots/Map-render-stories-Size-light-webkit-linux.png
index 3d1cf03a0..05d335bd9 100644
Binary files a/src/blocks/Map/__snapshots__/Map.visual.test.tsx-snapshots/Map-render-stories-Size-light-webkit-linux.png and b/src/blocks/Map/__snapshots__/Map.visual.test.tsx-snapshots/Map-render-stories-Size-light-webkit-linux.png differ
diff --git a/src/blocks/Map/__snapshots__/Map.visual.test.tsx-snapshots/Map-render-stories-WithControls-light-chromium-linux.png b/src/blocks/Map/__snapshots__/Map.visual.test.tsx-snapshots/Map-render-stories-WithControls-light-chromium-linux.png
new file mode 100644
index 000000000..4439bb92d
Binary files /dev/null and b/src/blocks/Map/__snapshots__/Map.visual.test.tsx-snapshots/Map-render-stories-WithControls-light-chromium-linux.png differ
diff --git a/src/blocks/Map/__snapshots__/Map.visual.test.tsx-snapshots/Map-render-stories-WithControls-light-webkit-linux.png b/src/blocks/Map/__snapshots__/Map.visual.test.tsx-snapshots/Map-render-stories-WithControls-light-webkit-linux.png
new file mode 100644
index 000000000..cc475e0be
Binary files /dev/null and b/src/blocks/Map/__snapshots__/Map.visual.test.tsx-snapshots/Map-render-stories-WithControls-light-webkit-linux.png differ
diff --git a/src/blocks/Map/__stories__/Map.stories.tsx b/src/blocks/Map/__stories__/Map.stories.tsx
index 64941bd0f..55ea7d8b0 100644
--- a/src/blocks/Map/__stories__/Map.stories.tsx
+++ b/src/blocks/Map/__stories__/Map.stories.tsx
@@ -3,12 +3,11 @@ import * as React from 'react';
 import {Meta, StoryFn} from '@storybook/react';
 
 import {scriptsSrc, ymapApiKeyForStorybook} from '../../../../.storybook/maps';
-import {yfmTransform} from '../../../../.storybook/utils';
+import {blockTransform} from '../../../../.storybook/utils';
 import {ApiKeyInput} from '../../../components/Map/__stories__/ApiKeyInput';
-import {PageConstructor} from '../../../containers/PageConstructor';
 import {MapType} from '../../../context/mapsContext/mapsContext';
 import {MapProvider, gmapApiKeyIdInLS} from '../../../context/mapsContext/mapsProvider';
-import {ButtonProps, LinkProps, MapBlockModel, MapBlockProps} from '../../../models';
+import {MapBlockModel, MapBlockProps} from '../../../models';
 import MapBlock from '../Map';
 
 import data from './data.json';
@@ -16,11 +15,6 @@ import data from './data.json';
 export default {
     title: 'Blocks/Map',
     component: MapBlock,
-    args: {
-        largeMedia: false,
-        mediaOnly: false,
-        size: 'l',
-    },
 } as Meta;
 
 const DefaultTemplate: StoryFn<MapBlockModel> = (args) => (
@@ -29,213 +23,309 @@ const DefaultTemplate: StoryFn<MapBlockModel> = (args) => (
         apiKey={ymapApiKeyForStorybook}
         type={MapType.Yandex}
     >
-        <PageConstructor
-            content={{
-                blocks: [
-                    {
-                        ...args,
-                        additionalInfo: yfmTransform(data.common.additionalInfo),
-                        map: data.ymap,
-                    },
-                    {
-                        ...args,
-                        links: data.common.links as LinkProps[],
-                        map: {
-                            ...data.ymap,
-                            id: 'common-places-2',
-                        },
-                    },
-                    {
-                        ...args,
-                        buttons: data.common.buttons as ButtonProps[],
-                        map: {
-                            ...data.ymap,
-                            id: 'common-places-3',
-                        },
-                    },
-                ],
-            }}
-        />
+        <div style={{padding: '64px'}}>
+            <MapBlock {...(blockTransform(args) as MapBlockProps)} />
+        </div>
+    </MapProvider>
+);
+
+const ControlsTemplate: StoryFn<Record<string, MapBlockModel>> = (args) => (
+    <MapProvider
+        scriptSrc={scriptsSrc[MapType.Yandex]}
+        apiKey={ymapApiKeyForStorybook}
+        type={MapType.Yandex}
+    >
+        <div style={{padding: '64px', display: 'flex', gap: 20, flexDirection: 'column'}}>
+            {Object.entries(args)
+                .map(([key, item]) => {
+                    if (typeof item !== 'object' || item === null) {
+                        return null;
+                    }
+                    return <MapBlock key={key} {...(blockTransform(item) as MapBlockProps)} />;
+                })
+                .filter(Boolean)}
+        </div>
     </MapProvider>
 );
 
-const SizeTemplate: StoryFn<MapBlockModel> = (args) => (
+const SizeTemplate: StoryFn<Record<string, MapBlockModel>> = (args) => (
     <MapProvider
         scriptSrc={scriptsSrc[MapType.Yandex]}
         apiKey={ymapApiKeyForStorybook}
         type={MapType.Yandex}
     >
-        <PageConstructor
-            content={{
-                blocks: [
-                    {
-                        ...args,
-                        title: data.size.defaultMediaTitle,
-                        map: data.ymap,
-                    },
-                    {
-                        ...args,
-                        largeMedia: true,
-                        title: data.size.largeMediaTitle,
-                        map: {
-                            ...data.ymap,
-                            id: 'common-places-2',
-                        },
-                    },
-                    {
-                        ...args,
-                        mediaOnly: true,
-                        description: undefined,
-                        title: data.size.mediaOnlyTitle,
-                        map: {
-                            ...data.ymap,
-                            id: 'common-places-3',
-                        },
-                    },
-                ],
-            }}
-        />
+        <div style={{padding: '64px', display: 'flex', gap: 20, flexDirection: 'column'}}>
+            {Object.entries(args)
+                .map(([key, item]) => {
+                    if (typeof item !== 'object' || item === null) {
+                        return null;
+                    }
+                    return <MapBlock key={key} {...(blockTransform(item) as MapBlockProps)} />;
+                })
+                .filter(Boolean)}
+        </div>
     </MapProvider>
 );
 
-const DirectionTemplate: StoryFn<MapBlockModel> = (args) => (
+const DirectionTemplate: StoryFn<Record<string, MapBlockModel>> = (args) => (
     <MapProvider
         scriptSrc={scriptsSrc[MapType.Yandex]}
         apiKey={ymapApiKeyForStorybook}
         type={MapType.Yandex}
     >
-        <PageConstructor
-            content={{
-                blocks: [
-                    {
-                        ...args,
-                        title: data.direction.defaultDirectionTitle,
-                        map: data.ymap,
-                    },
-                    {
-                        ...args,
-                        title: data.direction.ReverseDirectionTitle,
-                        direction: 'media-content',
-                        map: {
-                            ...data.ymap,
-                            id: 'common-places-2',
-                        },
-                    },
-                    {
-                        ...args,
-                        title: data.direction.ReverseDirectionTitle,
-                        mobileDirection: 'media-content',
-                        map: {
-                            ...data.ymap,
-                            id: 'common-places-3',
-                        },
-                    },
-                ],
-            }}
-        />
+        <div style={{padding: '64px', display: 'flex', gap: 20, flexDirection: 'column'}}>
+            {Object.entries(args)
+                .map(([key, item]) => {
+                    if (typeof item !== 'object' || item === null) {
+                        return null;
+                    }
+                    return <MapBlock key={key} {...(blockTransform(item) as MapBlockProps)} />;
+                })
+                .filter(Boolean)}
+        </div>
     </MapProvider>
 );
 
 const GMAP_API_KEY = process.env.STORYBOOK_GMAP_API_KEY;
 
-const MapsTypesTemplate: StoryFn<MapBlockModel> = (args) => (
-    <React.Fragment>
-        <MapProvider
-            scriptSrc={scriptsSrc[MapType.Yandex]}
-            apiKey={ymapApiKeyForStorybook}
-            type={MapType.Yandex}
-        >
-            <PageConstructor
-                content={{
-                    blocks: [
-                        {
-                            ...args,
-                            title: data.direction.defaultDirectionTitle,
-                            map: data.ymap,
-                        },
-                    ],
-                }}
-            />
-        </MapProvider>
-        <MapProvider
-            scriptSrc={scriptsSrc[MapType.Google]}
-            type={MapType.Google}
-            apiKey={GMAP_API_KEY}
-        >
-            {!GMAP_API_KEY && (
-                <div style={{maxWidth: '500px', marginLeft: '40px'}}>
-                    <ApiKeyInput id={gmapApiKeyIdInLS} />
-                </div>
+const MapsTypesTemplate: StoryFn<Record<string, MapBlockModel>> = (args) => {
+    const entries = Object.entries(args);
+    const yandexMap = entries[0];
+    const googleMap = entries[1];
+
+    return (
+        <React.Fragment>
+            {yandexMap && (
+                <MapProvider
+                    scriptSrc={scriptsSrc[MapType.Yandex]}
+                    apiKey={ymapApiKeyForStorybook}
+                    type={MapType.Yandex}
+                >
+                    <MapBlock {...(blockTransform(yandexMap[1]) as MapBlockProps)} />
+                </MapProvider>
             )}
-            <PageConstructor
-                content={{
-                    blocks: [
-                        {
-                            ...args,
-                            title: data.direction.ReverseDirectionTitle,
-                            direction: 'media-content',
-                            map: data.gmap,
-                        },
-                    ],
-                }}
-            />
-        </MapProvider>
-    </React.Fragment>
-);
+            {googleMap && (
+                <MapProvider
+                    scriptSrc={scriptsSrc[MapType.Google]}
+                    type={MapType.Google}
+                    apiKey={GMAP_API_KEY}
+                >
+                    {!GMAP_API_KEY && (
+                        <div style={{maxWidth: '500px', marginLeft: '40px'}}>
+                            <ApiKeyInput id={gmapApiKeyIdInLS} />
+                        </div>
+                    )}
+                    <MapBlock {...(blockTransform(googleMap[1]) as MapBlockProps)} />
+                </MapProvider>
+            )}
+        </React.Fragment>
+    );
+};
 
-const EnhancedTitleTemplate: StoryFn<MapBlockModel> = (args) => (
+const EnhancedTitleTemplate: StoryFn<Record<string, MapBlockModel>> = (args) => (
     <MapProvider
         scriptSrc={scriptsSrc[MapType.Yandex]}
         apiKey={ymapApiKeyForStorybook}
         type={MapType.Yandex}
     >
-        <PageConstructor
-            content={{
-                blocks: [
-                    {
-                        ...args,
-                        ...data.enhancedTitle.largeClickable,
-                        map: data.ymap,
-                    },
-                    {
-                        ...args,
-                        ...data.enhancedTitle.interactiveWithIcon,
-                        title: {
-                            ...data.enhancedTitle.interactiveWithIcon.title,
-                            onClick: () => alert('Map title clicked!'),
-                        },
-                        map: {
-                            ...data.ymap,
-                            id: 'interactive-title-map',
-                        },
-                    },
-                ],
-            }}
-        />
+        <div style={{padding: '64px', display: 'flex', gap: 20, flexDirection: 'column'}}>
+            {Object.entries(args)
+                .map(([key, item]) => {
+                    if (typeof item !== 'object' || item === null) {
+                        return null;
+                    }
+                    const transformedItem =
+                        key === 'interactive'
+                            ? {
+                                  ...item,
+                                  title: {
+                                      ...(typeof item.title === 'object' && item.title !== null
+                                          ? item.title
+                                          : {}),
+                                      onClick: () => alert('Map title clicked!'),
+                                  },
+                              }
+                            : item;
+
+                    return (
+                        <MapBlock
+                            key={key}
+                            {...(blockTransform(transformedItem) as MapBlockProps)}
+                        />
+                    );
+                })
+                .filter(Boolean)}
+        </div>
     </MapProvider>
 );
 
 export const Default = DefaultTemplate.bind({});
+export const WithControls = ControlsTemplate.bind({});
 export const Size = SizeTemplate.bind({});
 export const Direction = DirectionTemplate.bind({});
 export const MapsTypes = MapsTypesTemplate.bind({});
 export const EnhancedTitle = EnhancedTitleTemplate.bind({});
 
-const DefaultArgs = {
+Default.args = {
     ...data.default.content,
     title: data.common.title,
-    description: yfmTransform(data.common.description),
+    description: data.common.description,
     map: data.ymap,
+} as MapBlockModel;
+
+const CONTROLS_MAPS: Record<string, MapBlockModel> = {
+    with_additional_info: {
+        ...data.default.content,
+        title: data.common.title,
+        description: data.common.description,
+        additionalInfo: data.common.additionalInfo,
+        map: data.ymap,
+    } as MapBlockModel,
+    with_links: {
+        ...data.default.content,
+        title: data.common.title,
+        description: data.common.description,
+        links: data.common.links,
+        map: {
+            ...data.ymap,
+            id: 'common-places-2',
+        },
+    } as MapBlockModel,
+    with_buttons: {
+        ...data.default.content,
+        title: data.common.title,
+        description: data.common.description,
+        buttons: data.common.buttons,
+        map: {
+            ...data.ymap,
+            id: 'common-places-3',
+        },
+    } as MapBlockModel,
+};
+
+WithControls.args = CONTROLS_MAPS;
+WithControls.parameters = {
+    controls: {
+        include: Object.keys(CONTROLS_MAPS),
+    },
 };
 
-Default.args = DefaultArgs as MapBlockProps;
+const SIZE_MAPS: Record<string, MapBlockModel> = {
+    default_media: {
+        ...data.default.content,
+        title: data.size.defaultMediaTitle,
+        description: data.common.description,
+        map: data.ymap,
+    } as MapBlockModel,
+    large_media: {
+        ...data.default.content,
+        largeMedia: true,
+        title: data.size.largeMediaTitle,
+        description: data.common.description,
+        map: {
+            ...data.ymap,
+            id: 'common-places-2',
+        },
+    } as MapBlockModel,
+    media_only: {
+        ...data.default.content,
+        mediaOnly: true,
+        description: undefined,
+        title: data.size.mediaOnlyTitle,
+        map: {
+            ...data.ymap,
+            id: 'common-places-3',
+        },
+    } as MapBlockModel,
+};
 
-Size.args = DefaultArgs as MapBlockProps;
-Direction.args = DefaultArgs as MapBlockProps;
+Size.args = SIZE_MAPS;
+Size.parameters = {
+    controls: {
+        include: Object.keys(SIZE_MAPS),
+    },
+};
 
-MapsTypes.args = DefaultArgs as MapBlockProps;
+const DIRECTION_MAPS: Record<string, MapBlockModel> = {
+    default_direction: {
+        ...data.default.content,
+        title: data.direction.defaultDirectionTitle,
+        description: data.common.description,
+        map: data.ymap,
+    } as MapBlockModel,
+    reverse_direction: {
+        ...data.default.content,
+        title: data.direction.ReverseDirectionTitle,
+        description: data.common.description,
+        direction: 'media-content',
+        map: {
+            ...data.ymap,
+            id: 'common-places-2',
+        },
+    } as MapBlockModel,
+    mobile_reverse_direction: {
+        ...data.default.content,
+        title: data.direction.ReverseDirectionTitle,
+        description: data.common.description,
+        mobileDirection: 'media-content',
+        map: {
+            ...data.ymap,
+            id: 'common-places-3',
+        },
+    } as MapBlockModel,
+};
 
-EnhancedTitle.args = {
-    ...DefaultArgs,
-    ...data.enhancedTitle.largeClickable,
-} as MapBlockProps;
+Direction.args = DIRECTION_MAPS;
+Direction.parameters = {
+    controls: {
+        include: Object.keys(DIRECTION_MAPS),
+    },
+};
+
+const MAPS_TYPES: Record<string, MapBlockModel> = {
+    yandex_map: {
+        ...data.default.content,
+        title: data.direction.defaultDirectionTitle,
+        description: data.common.description,
+        map: data.ymap,
+    } as MapBlockModel,
+    google_map: {
+        ...data.default.content,
+        title: data.direction.ReverseDirectionTitle,
+        description: data.common.description,
+        direction: 'media-content',
+        map: data.gmap,
+    } as MapBlockModel,
+};
+
+MapsTypes.args = MAPS_TYPES;
+MapsTypes.parameters = {
+    controls: {
+        include: Object.keys(MAPS_TYPES),
+    },
+};
+
+const ENHANCED_TITLE_MAPS: Record<string, MapBlockModel> = {
+    large_clickable: {
+        ...data.default.content,
+        ...data.enhancedTitle.largeClickable,
+        description: data.common.description,
+        map: data.ymap,
+    } as MapBlockModel,
+    interactive: {
+        ...data.default.content,
+        ...data.enhancedTitle.interactiveWithIcon,
+        description: data.common.description,
+        map: {
+            ...data.ymap,
+            id: 'interactive-title-map',
+        },
+    } as MapBlockModel,
+};
+
+EnhancedTitle.args = ENHANCED_TITLE_MAPS;
+EnhancedTitle.parameters = {
+    controls: {
+        include: Object.keys(ENHANCED_TITLE_MAPS),
+    },
+};
diff --git a/src/blocks/Map/__tests__/Map.visual.test.tsx b/src/blocks/Map/__tests__/Map.visual.test.tsx
index 11f983a30..09556a2d9 100644
--- a/src/blocks/Map/__tests__/Map.visual.test.tsx
+++ b/src/blocks/Map/__tests__/Map.visual.test.tsx
@@ -1,6 +1,6 @@
 import {test} from '../../../../playwright/core/index';
 
-import {Default, Direction, MapsTypes, Size} from './helpers';
+import {Default, Direction, MapsTypes, Size, WithControls} from './helpers';
 
 const DEFAULT_MAP_DELAY = 10 * 1000;
 
@@ -11,6 +11,12 @@ test.describe('Map', () => {
         await expectScreenshot({skipTheme: 'dark', mask: [page.locator('.pc-map')]});
     });
 
+    test('render stories <WithControls>', async ({mount, expectScreenshot, delay, page}) => {
+        await mount(<WithControls />);
+        await delay(DEFAULT_MAP_DELAY);
+        await expectScreenshot({skipTheme: 'dark', mask: [page.locator('.pc-map')]});
+    });
+
     test('render stories <Size>', async ({mount, expectScreenshot, delay, page}) => {
         await mount(<Size />);
         await delay(DEFAULT_MAP_DELAY);
diff --git a/src/blocks/Map/__tests__/helpers.tsx b/src/blocks/Map/__tests__/helpers.tsx
index 273ec57ce..b885c1539 100644
--- a/src/blocks/Map/__tests__/helpers.tsx
+++ b/src/blocks/Map/__tests__/helpers.tsx
@@ -2,4 +2,4 @@ import {composeStories} from '@storybook/react';
 
 import * as MapStories from '../__stories__/Map.stories';
 
-export const {Default, Size, Direction, MapsTypes} = composeStories(MapStories);
+export const {Default, WithControls, Size, Direction, MapsTypes} = composeStories(MapStories);