@gravity-ui/page-constructor 5.12.0 → 5.14.0

package/build/esm/editor/store/settings/reducer.d.ts

@@ -1,19 +1,23 @@
 import { Theme } from '../../../models';
-import { FormTab, ViewModeItem } from '../../types';
-export declare const UPDATE_FORM_TAB = "UPDATE_FORM_TAB";
+import { EditModeItem, ViewModeItem } from '../../types';
 export declare const UPDATE_CODE_FULLSCREEN_MODE_ON = "UPDATE_CODE_FULLSCREEN_MODE_ON";
 export declare const UPDATE_VIEW_MODE = "UPDATE_VIEW_MODE";
+export declare const UPDATE_EDIT_MODE = "UPDATE_EDIT_MODE";
 export declare const UPDATE_THEME = "UPDATE_THEME";
 interface EditorSettingsState {
     theme: Theme;
     viewMode: ViewModeItem;
+    editMode: EditModeItem;
     codeFullscreeModeOn: boolean;
-    formTab: FormTab;
 }
 interface UpdateViewMode {
     type: typeof UPDATE_VIEW_MODE;
     payload: ViewModeItem;
 }
+interface UpdateEditMode {
+    type: typeof UPDATE_EDIT_MODE;
+    payload: EditModeItem;
+}
 interface UpdateTheme {
     type: typeof UPDATE_THEME;
     payload: Theme;
@@ -22,16 +26,12 @@ interface UpdateCodeFullscreenModeOn {
     type: typeof UPDATE_CODE_FULLSCREEN_MODE_ON;
     payload: boolean;
 }
-interface UpdateFormTab {
-    type: typeof UPDATE_FORM_TAB;
-    payload: FormTab;
-}
-export type EditorSettingsAction = UpdateViewMode | UpdateTheme | UpdateCodeFullscreenModeOn | UpdateFormTab;
+export type EditorSettingsAction = UpdateViewMode | UpdateEditMode | UpdateTheme | UpdateCodeFullscreenModeOn;
 export declare const reducer: (state: EditorSettingsState, action: EditorSettingsAction) => EditorSettingsState;
 export declare const initialState: {
     viewMode: ViewModeItem;
+    editMode: EditModeItem;
     theme: Theme;
     codeFullscreeModeOn: boolean;
-    formTab: FormTab;
 };
 export {};

package/build/esm/editor/store/settings/reducer.js

@@ -1,28 +1,28 @@
 import { DEFAULT_THEME } from '../../../components/constants';
-import { FormTab, ViewModeItem } from '../../types';
+import { EditModeItem, ViewModeItem } from '../../types';
 // actions
-export const UPDATE_FORM_TAB = 'UPDATE_FORM_TAB';
 export const UPDATE_CODE_FULLSCREEN_MODE_ON = 'UPDATE_CODE_FULLSCREEN_MODE_ON';
 export const UPDATE_VIEW_MODE = 'UPDATE_VIEW_MODE';
+export const UPDATE_EDIT_MODE = 'UPDATE_EDIT_MODE';
 export const UPDATE_THEME = 'UPDATE_THEME';
 // reducer
 export const reducer = (state, action) => {
     switch (action.type) {
         case UPDATE_VIEW_MODE:
             return Object.assign(Object.assign({}, state), { viewMode: action.payload });
+        case UPDATE_EDIT_MODE:
+            return Object.assign(Object.assign({}, state), { editMode: action.payload });
         case UPDATE_THEME:
             return Object.assign(Object.assign({}, state), { theme: action.payload });
         case UPDATE_CODE_FULLSCREEN_MODE_ON:
             return Object.assign(Object.assign({}, state), { codeFullscreeModeOn: action.payload });
-        case UPDATE_FORM_TAB:
-            return Object.assign(Object.assign({}, state), { formTab: action.payload });
         default:
             return state;
     }
 };
 export const initialState = {
-    viewMode: ViewModeItem.Edititng,
+    viewMode: ViewModeItem.Desktop,
+    editMode: EditModeItem.Form,
     theme: DEFAULT_THEME,
     codeFullscreeModeOn: false,
-    formTab: FormTab.Blocks,
 };

package/build/esm/editor/types/index.d.ts

@@ -29,14 +29,13 @@ export interface EditBlockProps extends EditBlockEditorProps, BlockDecorationPro
     isHeader?: boolean;
 }
 export declare enum ViewModeItem {
-    Edititng = "editing",
     Desktop = "desktop",
     Tablet = "tablet",
     Mobile = "mobile"
 }
-export declare enum FormTab {
-    Blocks = "blocks",
-    Page = "page",
+export declare enum EditModeItem {
+    View = "view",
+    Form = "form",
     Code = "code"
 }
 export {};

package/build/esm/editor/types/index.js

@@ -1,13 +1,12 @@
 export var ViewModeItem;
 (function (ViewModeItem) {
-    ViewModeItem["Edititng"] = "editing";
     ViewModeItem["Desktop"] = "desktop";
     ViewModeItem["Tablet"] = "tablet";
     ViewModeItem["Mobile"] = "mobile";
 })(ViewModeItem || (ViewModeItem = {}));
-export var FormTab;
-(function (FormTab) {
-    FormTab["Blocks"] = "blocks";
-    FormTab["Page"] = "page";
-    FormTab["Code"] = "code";
-})(FormTab || (FormTab = {}));
+export var EditModeItem;
+(function (EditModeItem) {
+    EditModeItem["View"] = "view";
+    EditModeItem["Form"] = "form";
+    EditModeItem["Code"] = "code";
+})(EditModeItem || (EditModeItem = {}));

package/build/esm/models/constructor-items/blocks.d.ts

@@ -302,6 +302,7 @@ export interface ContentBlockProps {
     centered?: boolean;
     theme?: ContentTheme;
     list?: ContentItemProps[];
+    controlPosition?: 'default' | 'bottom';
 }
 export declare enum PCShareSocialNetwork {
     Vk = "vk",

package/build/esm/models/constructor-items/sub-blocks.d.ts

@@ -96,14 +96,14 @@ export interface QuoteProps extends Themable, CardBaseProps {
     quoteType?: QuoteType;
     button?: ButtonProps;
 }
-export interface BackgroundCardProps extends CardBaseProps, AnalyticsEventsBase, CardLayoutProps, Omit<ContentBlockProps, 'colSizes' | 'centered'> {
+export interface BackgroundCardProps extends CardBaseProps, AnalyticsEventsBase, CardLayoutProps, Omit<ContentBlockProps, 'colSizes' | 'centered' | 'controlPosition'> {
     url?: string;
     urlTitle?: string;
     background?: ThemeSupporting<ImageObjectProps>;
     paddingBottom?: 's' | 'm' | 'l' | 'xl';
     backgroundColor?: string;
 }
-export interface BasicCardProps extends CardBaseProps, AnalyticsEventsBase, CardLayoutProps, Omit<ContentBlockProps, 'colSizes' | 'centered' | 'size' | 'theme'> {
+export interface BasicCardProps extends CardBaseProps, AnalyticsEventsBase, CardLayoutProps, Omit<ContentBlockProps, 'colSizes' | 'centered' | 'size' | 'theme' | 'controlPosition'> {
     url: string;
     urlTitle?: string;
     icon?: ImageProps;
@@ -141,7 +141,7 @@ export interface LayoutItemProps extends ClassNameProps, CardLayoutProps, Analyt
     fullscreen?: boolean;
     icon?: PositionedIcon;
 }
-export interface ImageCardProps extends CardBaseProps, CardLayoutProps, Omit<ContentBlockProps, 'colSizes' | 'centered'> {
+export interface ImageCardProps extends CardBaseProps, CardLayoutProps, Omit<ContentBlockProps, 'colSizes' | 'centered' | 'controlPosition'> {
     image: ImageProps;
     enableImageBorderRadius?: boolean;
     margins?: ImageCardMargins;

package/build/esm/schema/constants.d.ts

@@ -118,6 +118,10 @@ export declare const cardSchemas: {
                     };
                 };
             } | undefined;
+            controlPosition: {
+                type: string; /** @deprecated */
+                enum: string[];
+            };
             border: {
                 type: string;
                 enum: string[];

package/build/esm/schema/validators/common.d.ts

@@ -29,6 +29,12 @@ export declare const BaseProps: {
         type: string;
     };
 };
+export declare const CardLayoutProps: {
+    controlPosition: {
+        type: string;
+        enum: string[];
+    };
+};
 export declare const containerSizesObject: {
     type: string;
     additionalProperties: boolean;

package/build/esm/schema/validators/common.js

@@ -32,6 +32,12 @@ export const BaseProps = {
         type: 'string',
     },
 };
+export const CardLayoutProps = {
+    controlPosition: {
+        type: 'string',
+        enum: ['content', 'footer'],
+    },
+};
 export const containerSizesObject = {
     type: 'object',
     additionalProperties: false,

package/build/esm/sub-blocks/BackgroundCard/BackgroundCard.css

@@ -26,6 +26,9 @@ unpredictable css rules order in build */
   cursor: default;
   border: none;
 }
+.pc-background-card__content {
+  display: flex;
+}
 .pc-background-card__image {
   position: absolute;
   top: 0;
@@ -37,12 +40,6 @@ unpredictable css rules order in build */
   object-fit: cover;
   object-position: left;
 }
-.pc-background-card__footer {
-  margin-top: 0px;
-}
-.pc-background-card__links, .pc-background-card__buttons {
-  margin-top: 16px;
-}
 
 a.pc-background-card_theme_light {
   background-color: var(--pc-color-base-silver);

package/build/esm/sub-blocks/BackgroundCard/BackgroundCard.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { useUniqId } from '@gravity-ui/uikit';
-import { BackgroundImage, Buttons, CardBase, Links } from '../../components/';
+import { BackgroundImage, CardBase } from '../../components/';
 import { useTheme } from '../../context/theme';
 import { block, getThemedValue } from '../../utils';
 import Content from '../Content/Content';
@@ -13,12 +13,9 @@ const BackgroundCard = (props) => {
     const hasBackgroundColor = backgroundColor || cardTheme !== 'default';
     const borderType = hasBackgroundColor ? 'none' : border;
     const areControlsInFooter = !paddingBottom && controlPosition === 'footer';
-    return (React.createElement(CardBase, { className: b({ padding: paddingBottom, theme: cardTheme }), url: url, border: borderType, analyticsEvents: analyticsEvents, urlTitle: urlTitle },
+    return (React.createElement(CardBase, { className: b({ padding: paddingBottom, theme: cardTheme }), contentClassName: b('content'), url: url, border: borderType, analyticsEvents: analyticsEvents, urlTitle: urlTitle },
         React.createElement(CardBase.Content, null,
             React.createElement(BackgroundImage, Object.assign({ className: b('image') }, getThemedValue(background, theme), { style: { backgroundColor } })),
-            React.createElement(Content, { titleId: titleId, title: title, text: text, additionalInfo: additionalInfo, size: "s", theme: cardTheme, links: areControlsInFooter ? undefined : links, buttons: areControlsInFooter ? undefined : buttons, list: list, colSizes: { all: 12, md: 12 } })),
-        areControlsInFooter && (links || buttons) && (React.createElement(CardBase.Footer, null,
-            React.createElement(Links, { className: b('links'), size: "s", links: links, titleId: titleId }),
-            React.createElement(Buttons, { className: b('buttons'), size: "s", buttons: buttons, titleId: titleId })))));
+            React.createElement(Content, { titleId: titleId, title: title, text: text, additionalInfo: additionalInfo, size: "s", theme: cardTheme, links: links, buttons: buttons, list: list, colSizes: { all: 12, md: 12 }, controlPosition: areControlsInFooter ? 'bottom' : 'default' }))));
 };
 export default BackgroundCard;

package/build/esm/sub-blocks/BackgroundCard/schema.js

@@ -1,14 +1,14 @@
 import omit from 'lodash/omit';
 import { ImageObjectProps } from '../../components/Image/schema';
-import { BaseProps, CardBase, withTheme } from '../../schema/validators/common';
+import { BaseProps, CardBase, CardLayoutProps, withTheme } from '../../schema/validators/common';
 import { AnalyticsEventSchema } from '../../schema/validators/event';
 import { ContentBase } from '../Content/schema';
-const BackgroundCardContentProps = omit(ContentBase, ['size']);
+const BackgroundCardContentProps = omit(ContentBase, ['size', 'controlPosition']);
 export const BackgroundCard = {
     'background-card': {
         additionalProperties: false,
         required: ['title', 'text'],
-        properties: Object.assign(Object.assign(Object.assign(Object.assign({}, BaseProps), CardBase), BackgroundCardContentProps), { url: {
+        properties: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, BaseProps), CardBase), CardLayoutProps), BackgroundCardContentProps), { url: {
                 type: 'string',
             }, urlTitle: {
                 type: 'string',

package/build/esm/sub-blocks/BasicCard/BasicCard.css

@@ -4,9 +4,9 @@ unpredictable css rules order in build */
   min-height: auto;
 }
 
-.pc-basic-card__footer {
-  margin-top: 0px;
+.pc-basic-card__content {
+  display: flex;
 }
-.pc-basic-card__links, .pc-basic-card__buttons {
-  margin-top: 16px;
+.pc-basic-card__wrapper {
+  flex: auto;
 }

package/build/esm/sub-blocks/BasicCard/BasicCard.js

@@ -1,7 +1,7 @@
 import { __rest } from "tslib";
 import React from 'react';
 import { useUniqId } from '@gravity-ui/uikit';
-import { Buttons, CardBase, IconWrapper, Links } from '../../components';
+import { CardBase, IconWrapper } from '../../components';
 import { IconPosition } from '../../models/constructor-items/sub-blocks';
 import { block } from '../../utils';
 import Content from '../Content/Content';
@@ -12,12 +12,9 @@ const BasicCard = (props) => {
     const titleId = useUniqId();
     const descriptionId = useUniqId();
     const areControlsInFooter = controlPosition === 'footer';
-    return (React.createElement(CardBase, Object.assign({ className: b() }, cardParams, { extraProps: { 'aria-describedby': descriptionId, 'aria-labelledby': titleId } }),
+    return (React.createElement(CardBase, Object.assign({ className: b(), contentClassName: b('content') }, cardParams, { extraProps: { 'aria-describedby': descriptionId, 'aria-labelledby': titleId } }),
         React.createElement(CardBase.Content, null,
-            React.createElement(IconWrapper, { icon: icon ? { value: icon, position: iconPosition } : undefined },
-                React.createElement(Content, { title: title, titleId: titleId, text: text, textId: descriptionId, additionalInfo: additionalInfo, links: areControlsInFooter ? undefined : links, list: list, buttons: areControlsInFooter ? undefined : buttons, size: "s", colSizes: { all: 12, md: 12 } }))),
-        areControlsInFooter && (buttons || links) && (React.createElement(CardBase.Footer, { className: b('footer') },
-            React.createElement(Links, { className: b('links'), size: "s", links: links, titleId: titleId }),
-            React.createElement(Buttons, { className: b('buttons'), size: "s", buttons: buttons, titleId: titleId })))));
+            React.createElement(IconWrapper, { icon: icon ? { value: icon, position: iconPosition } : undefined, className: b('wrapper') },
+                React.createElement(Content, { title: title, titleId: titleId, text: text, textId: descriptionId, additionalInfo: additionalInfo, links: links, list: list, buttons: buttons, size: "s", colSizes: { all: 12, md: 12 }, controlPosition: areControlsInFooter ? 'bottom' : 'default' })))));
 };
 export default BasicCard;

package/build/esm/sub-blocks/BasicCard/schema.js

@@ -1,13 +1,13 @@
 import omit from 'lodash/omit';
 import { ImageProps } from '../../components/Image/schema';
-import { BaseProps, CardBase } from '../../schema/validators/common';
+import { BaseProps, CardBase, CardLayoutProps } from '../../schema/validators/common';
 import { ContentBase } from '../Content/schema';
-const BasicCardContentProps = omit(ContentBase, ['size', 'theme']);
+const BasicCardContentProps = omit(ContentBase, ['size', 'theme', 'controlPosition']);
 export const BasicCard = {
     'basic-card': {
         additionalProperties: false,
         required: [],
-        properties: Object.assign(Object.assign(Object.assign(Object.assign({}, BaseProps), CardBase), BasicCardContentProps), { url: {
+        properties: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, BaseProps), CardBase), CardLayoutProps), BasicCardContentProps), { url: {
                 type: 'string',
             }, urlTitle: {
                 type: 'string',

package/build/esm/sub-blocks/Content/Content.css

@@ -9,6 +9,8 @@ unpredictable css rules order in build */
   --pc-monochrome-button-background-color: #262626;
   --pc-monochrome-button-background-color-hover: #393939;
   --pc-monochrome-button-color: var(--g-color-text-light-primary);
+  display: flex;
+  flex-direction: column;
 }
 .pc-content__notice .yfm ol,
 .pc-content__notice .yfm ul, .pc-content__text .yfm ol,
@@ -145,4 +147,13 @@ unpredictable css rules order in build */
 }
 .pc-content_theme_light .pc-content__title a:hover {
   color: var(--g-color-text-dark-secondary);
+}
+.pc-content_control-position_bottom .pc-content__notice:has(+ .pc-content__buttons), .pc-content_control-position_bottom .pc-content__notice:has(+ .pc-content__link),
+.pc-content_control-position_bottom .pc-content__list:has(+ .pc-content__buttons),
+.pc-content_control-position_bottom .pc-content__list:has(+ .pc-content__link),
+.pc-content_control-position_bottom .pc-content__text:has(+ .pc-content__buttons),
+.pc-content_control-position_bottom .pc-content__text:has(+ .pc-content__link),
+.pc-content_control-position_bottom .pc-content__title:has(+ .pc-content__buttons),
+.pc-content_control-position_bottom .pc-content__title:has(+ .pc-content__link) {
+  margin-bottom: auto;
 }

package/build/esm/sub-blocks/Content/Content.js

@@ -16,7 +16,7 @@ function getTextSize(size) {
     }
 }
 const Content = (props) => {
-    const { title, titleId: titleIdFromProps, text, textId, additionalInfo, size = 'l', links, buttons, colSizes = { all: 12, sm: 8 }, centered, theme, className, list, qa, } = props;
+    const { title, titleId: titleIdFromProps, text, textId, additionalInfo, size = 'l', links, buttons, colSizes = { all: 12, sm: 8 }, centered, theme, className, list, qa, controlPosition, } = props;
     const qaAttributes = getQaAttrubutes(qa, ['links', 'link', 'buttons', 'button', 'list']);
     const titleProps = !title || typeof title === 'string'
         ? { text: title, textSize: getTextSize(size) }
@@ -24,7 +24,7 @@ const Content = (props) => {
     const hasTitle = Boolean(title);
     const defaultTitleId = useUniqId();
     const titleId = titleIdFromProps || defaultTitleId;
-    return (React.createElement(Col, { className: b({ size, centered, theme }, className), reset: true, sizes: colSizes, qa: qaAttributes.container },
+    return (React.createElement(Col, { className: b({ size, centered, theme, 'control-position': controlPosition }, className), reset: true, sizes: colSizes, qa: qaAttributes.container },
         title && (React.createElement(Title, { className: b('title'), title: titleProps, colSizes: { all: 12 }, id: titleId })),
         text && (React.createElement("div", { className: b('text', { ['without-title']: !hasTitle }) },
             React.createElement(YFMWrapper, { content: text, modifiers: { constructor: true, [`constructor-size-${size}`]: true }, id: textId }))),

package/build/esm/sub-blocks/Content/schema.d.ts

@@ -119,6 +119,10 @@ export declare const ContentBase: {
             };
         };
     };
+    controlPosition: {
+        type: string;
+        enum: string[];
+    };
 };
 export declare const ContentBlock: {
     content: {
@@ -210,6 +214,10 @@ export declare const ContentBlock: {
                     };
                 };
             };
+            controlPosition: {
+                type: string;
+                enum: string[];
+            };
         };
     };
 };

package/build/esm/sub-blocks/Content/schema.js

@@ -47,6 +47,10 @@ export const ContentBase = {
         enum: contentThemes,
     },
     list: filteredArray(ContentItem),
+    controlPosition: {
+        type: 'string',
+        enum: ['default', 'bottom'],
+    },
 };
 export const ContentBlock = {
     content: {

package/build/esm/sub-blocks/ImageCard/ImageCard.css

@@ -17,7 +17,9 @@ unpredictable css rules order in build */
   border: 1px solid var(--g-color-line-generic);
 }
 .pc-image-card .pc-image-card__content {
+  display: flex;
   padding: 32px;
+  flex: auto;
 }
 .pc-image-card .pc-image-card__image_inner {
   width: 100%;

package/build/esm/sub-blocks/ImageCard/ImageCard.js

@@ -7,8 +7,10 @@ import { block } from '../../utils';
 import Content from '../Content/Content';
 import './ImageCard.css';
 const b = block('image-card');
+const CONTENT_COL_SIZES = { all: 12, md: 12 };
 const ImageCard = (props) => {
-    const { border = 'shadow', title, text, image, enableImageBorderRadius = false, direction = ImageCardDirection.Direct, margins, backgroundColor, url, target, urlTitle, additionalInfo, links, buttons, list, theme: cardTheme = 'default', size = 's', } = props;
+    const { border = 'shadow', title, text, image, enableImageBorderRadius = false, direction = ImageCardDirection.Direct, margins, backgroundColor, url, target, urlTitle, additionalInfo, links, buttons, list, theme: cardTheme = 'default', size = 's', controlPosition = 'content', } = props;
+    const areControlsInFooter = controlPosition === 'footer';
     const hasContent = Boolean(text || title || buttons || links || list);
     const imageProps = getMediaImage(image);
     const titleId = useUniqId();
@@ -16,7 +18,7 @@ const ImageCard = (props) => {
         React.createElement("div", { className: b('image', { margins }) },
             React.createElement(Image, Object.assign({ className: b('image_inner', { radius: enableImageBorderRadius }) }, imageProps))),
         hasContent && (React.createElement("div", { className: b('content') },
-            React.createElement(Content, { titleId: titleId, title: title, text: text, links: links, buttons: buttons, list: list, theme: cardTheme, additionalInfo: additionalInfo, size: size, colSizes: { all: 12, md: 12 } })))));
+            React.createElement(Content, { titleId: titleId, title: title, text: text, links: links, buttons: buttons, list: list, theme: cardTheme, additionalInfo: additionalInfo, size: size, colSizes: CONTENT_COL_SIZES, controlPosition: areControlsInFooter ? 'bottom' : 'default' })))));
     return url ? (React.createElement(Link, { href: url, target: target, rel: target === '_blank' ? 'noopener noreferrer' : undefined, className: b({ border, 'with-content': hasContent, direction }), title: urlTitle, extraProps: {
             draggable: false,
             onDragStart: (e) => e.preventDefault(),

package/build/esm/sub-blocks/ImageCard/schema.d.ts

@@ -116,6 +116,10 @@ export declare const ImageCard: {
                     };
                 };
             } | undefined;
+            controlPosition: {
+                type: string;
+                enum: string[];
+            };
             border: {
                 type: string;
                 enum: string[];

package/build/esm/sub-blocks/ImageCard/schema.js

@@ -1,13 +1,13 @@
 import omit from 'lodash/omit';
-import { BaseProps, CardBase } from '../../schema/validators/common';
+import { BaseProps, CardBase, CardLayoutProps } from '../../schema/validators/common';
 import { ImageProps } from '../../schema/validators/components';
 import { ContentBase } from '../Content/schema';
-const ImageCardBlockContentProps = omit(ContentBase, ['centered', 'colSizes']);
+const ImageCardBlockContentProps = omit(ContentBase, ['centered', 'colSizes', 'controlPosition']);
 export const ImageCard = {
     'image-card': {
         additionalProperties: false,
         required: ['image'],
-        properties: Object.assign(Object.assign(Object.assign(Object.assign({}, BaseProps), CardBase), ImageCardBlockContentProps), { image: ImageProps, direction: {
+        properties: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, BaseProps), CardBase), CardLayoutProps), ImageCardBlockContentProps), { image: ImageProps, direction: {
                 type: 'string',
                 enum: ['direct', 'reverse'],
             }, margins: {

package/build/esm/sub-blocks/LayoutItem/LayoutItem.css

@@ -17,12 +17,13 @@ unpredictable css rules order in build */
   margin: 16px 0 -8px 0;
 }
 .pc-layout-item__content {
+  display: flex;
   flex: auto;
   margin: 16px 16px 0 0;
 }
 .pc-layout-item__content_no-media {
   margin: 0;
 }
-.pc-layout-item__links, .pc-layout-item__buttons {
-  margin-top: 16px;
+.pc-layout-item__wrapper {
+  flex: auto;
 }

package/build/esm/sub-blocks/LayoutItem/LayoutItem.d.ts

@@ -1,4 +1,4 @@
 import { LayoutItemProps } from '../../models';
 import './LayoutItem.css';
-declare const LayoutItem: ({ content: { links, buttons, ...content }, metaInfo, media, border, fullscreen, icon, className, analyticsEvents, controlPosition, }: LayoutItemProps) => JSX.Element;
+declare const LayoutItem: ({ content: { links, ...content }, metaInfo, media, border, fullscreen, icon, className, analyticsEvents, controlPosition, }: LayoutItemProps) => JSX.Element;
 export default LayoutItem;

package/build/esm/sub-blocks/LayoutItem/LayoutItem.js

@@ -1,7 +1,7 @@
 import { __rest } from "tslib";
 import React, { useMemo } from 'react';
 import { useUniqId } from '@gravity-ui/uikit';
-import { Buttons, FullscreenMedia, IconWrapper, Links, Media, MetaInfo } from '../../components';
+import { FullscreenMedia, IconWrapper, Media, MetaInfo } from '../../components';
 import { useTheme } from '../../context/theme';
 import { block, getThemedValue } from '../../utils';
 import Content from '../Content/Content';
@@ -9,11 +9,11 @@ import { getLayoutItemLinks, hasFullscreen, showFullscreenIcon } from './utils';
 import './LayoutItem.css';
 const b = block('layout-item');
 const LayoutItem = (_a) => {
-    var _b = _a.content, { links, buttons } = _b, content = __rest(_b, ["links", "buttons"]), { metaInfo, media, border, fullscreen, icon, className, analyticsEvents, controlPosition = 'content' } = _a;
+    var _b = _a.content, { links } = _b, content = __rest(_b, ["links"]), { metaInfo, media, border, fullscreen, icon, className, analyticsEvents, controlPosition = 'content' } = _a;
     const normalizedLinks = useMemo(() => getLayoutItemLinks(links), [links]);
     const areControlsInFooter = controlPosition === 'footer';
     const theme = useTheme();
-    const contentProps = Object.assign(Object.assign(Object.assign({}, content), (areControlsInFooter ? {} : { links: normalizedLinks, buttons })), { size: 's', colSizes: { all: 12, md: 12 } });
+    const contentProps = Object.assign(Object.assign({ controlPosition: areControlsInFooter ? 'bottom' : 'default' }, content), { links: normalizedLinks, size: 's', colSizes: { all: 12, md: 12 } });
     const titleId = useUniqId();
     const renderMedia = () => {
         if (!media) {
@@ -29,9 +29,7 @@ const LayoutItem = (_a) => {
         renderMedia(),
         metaInfo && React.createElement(MetaInfo, { items: metaInfo, className: b('meta-info') }),
         React.createElement("div", { className: b('content', { 'no-media': !media }) },
-            React.createElement(IconWrapper, { icon: icon },
-                React.createElement(Content, Object.assign({}, contentProps, { titleId: titleId })))),
-        areControlsInFooter && links && (React.createElement(Links, { className: b('links'), size: "s", links: links, titleId: titleId })),
-        areControlsInFooter && buttons && (React.createElement(Buttons, { className: b('buttons'), size: "s", buttons: buttons, titleId: titleId }))));
+            React.createElement(IconWrapper, { icon: icon, className: b('wrapper') },
+                React.createElement(Content, Object.assign({}, contentProps, { titleId: titleId }))))));
 };
 export default LayoutItem;

package/build/esm/sub-blocks/LayoutItem/schema.d.ts

@@ -358,6 +358,10 @@ export declare const LayoutItem: {
                     };
                 };
             };
+            controlPosition: {
+                type: string;
+                enum: string[];
+            };
         }>;
         metaInfo: {
             type: string;

package/build/esm/sub-blocks/LayoutItem/schema.js

@@ -1,13 +1,13 @@
 import omit from 'lodash/omit';
 import metaInfo from '../../components/MetaInfo/schema';
-import { BaseProps, MediaProps } from '../../schema/validators/common';
+import { BaseProps, CardLayoutProps, MediaProps } from '../../schema/validators/common';
 import { AnalyticsEventSchema } from '../../schema/validators/event';
 import { ContentBase } from '../../sub-blocks/Content/schema';
 export const LayoutItem = {
     type: 'object',
     additionalProperties: false,
     required: ['content', 'media'],
-    properties: Object.assign(Object.assign({}, BaseProps), { media: MediaProps, content: omit(ContentBase, ['colSize', 'size', 'centered']), metaInfo: metaInfo, border: {
+    properties: Object.assign(Object.assign(Object.assign({}, BaseProps), CardLayoutProps), { media: MediaProps, content: omit(ContentBase, ['colSize', 'size', 'centered']), metaInfo: metaInfo, border: {
             type: 'boolean',
         }, fullscreen: {
             type: 'boolean',
@@ -20,8 +20,5 @@ export const LayoutItem = {
                     optionName: 'list',
                 },
             ],
-        }, controlPosition: {
-            type: 'string',
-            enum: ['content', 'footer'],
         } }),
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gravity-ui/page-constructor",
-  "version": "5.12.0",
+  "version": "5.14.0",
   "description": "Gravity UI Page Constructor",
   "license": "MIT",
   "repository": {

package/server/models/constructor-items/blocks.d.ts

@@ -302,6 +302,7 @@ export interface ContentBlockProps {
     centered?: boolean;
     theme?: ContentTheme;
     list?: ContentItemProps[];
+    controlPosition?: 'default' | 'bottom';
 }
 export declare enum PCShareSocialNetwork {
     Vk = "vk",

package/server/models/constructor-items/sub-blocks.d.ts

@@ -96,14 +96,14 @@ export interface QuoteProps extends Themable, CardBaseProps {
     quoteType?: QuoteType;
     button?: ButtonProps;
 }
-export interface BackgroundCardProps extends CardBaseProps, AnalyticsEventsBase, CardLayoutProps, Omit<ContentBlockProps, 'colSizes' | 'centered'> {
+export interface BackgroundCardProps extends CardBaseProps, AnalyticsEventsBase, CardLayoutProps, Omit<ContentBlockProps, 'colSizes' | 'centered' | 'controlPosition'> {
     url?: string;
     urlTitle?: string;
     background?: ThemeSupporting<ImageObjectProps>;
     paddingBottom?: 's' | 'm' | 'l' | 'xl';
     backgroundColor?: string;
 }
-export interface BasicCardProps extends CardBaseProps, AnalyticsEventsBase, CardLayoutProps, Omit<ContentBlockProps, 'colSizes' | 'centered' | 'size' | 'theme'> {
+export interface BasicCardProps extends CardBaseProps, AnalyticsEventsBase, CardLayoutProps, Omit<ContentBlockProps, 'colSizes' | 'centered' | 'size' | 'theme' | 'controlPosition'> {
     url: string;
     urlTitle?: string;
     icon?: ImageProps;
@@ -141,7 +141,7 @@ export interface LayoutItemProps extends ClassNameProps, CardLayoutProps, Analyt
     fullscreen?: boolean;
     icon?: PositionedIcon;
 }
-export interface ImageCardProps extends CardBaseProps, CardLayoutProps, Omit<ContentBlockProps, 'colSizes' | 'centered'> {
+export interface ImageCardProps extends CardBaseProps, CardLayoutProps, Omit<ContentBlockProps, 'colSizes' | 'centered' | 'controlPosition'> {
     image: ImageProps;
     enableImageBorderRadius?: boolean;
     margins?: ImageCardMargins;