@gravity-ui/page-constructor 5.12.0 → 5.13.0

package/build/esm/blocks/Media/schema.d.ts

@@ -538,6 +538,10 @@ export declare const MediaBlockBaseProps: {
             };
         };
     };
+    controlPosition: {
+        type: string;
+        enum: string[];
+    };
     animated: {
         type: string;
     };
@@ -1139,6 +1143,10 @@ export declare const MediaBlock: {
                     };
                 };
             };
+            controlPosition: {
+                type: string;
+                enum: string[];
+            };
             animated: {
                 type: string;
             };

package/build/esm/blocks/Questions/schema.d.ts

@@ -88,6 +88,10 @@ export declare const QuestionsBlock: {
                     };
                 };
             };
+            controlPosition: {
+                type: string;
+                enum: string[];
+            };
             anchor: {
                 type: string;
                 additionalProperties: boolean;

package/build/esm/blocks/Tabs/schema.d.ts

@@ -522,6 +522,10 @@ export declare const tabsItem: {
                 };
             };
         } | undefined;
+        controlPosition?: {
+            type: string;
+            enum: string[];
+        } | undefined;
     };
 };
 export declare const TabsBlock: {

package/build/esm/components/IconWrapper/IconWrapper.css

@@ -22,6 +22,8 @@ unpredictable css rules order in build */
   width: 22px;
   margin: 1px 12px 1px 0px;
 }
-.pc-icon-wrapper_content_left.pc-icon-wrapper_content_left {
-  flex: 1 0 0;
+.pc-icon-wrapper__content {
+  display: flex;
+  flex-direction: column;
+  flex: 1 0 auto;
 }

package/build/esm/components/IconWrapper/IconWrapper.d.ts

@@ -1,5 +1,5 @@
 import { PropsWithChildren } from 'react';
-import { IconWrapperProps } from '../../models';
+import type { ClassNameProps, IconWrapperProps } from '../../models';
 import './IconWrapper.css';
-declare const IconWrapper: (props: PropsWithChildren<IconWrapperProps>) => JSX.Element;
+declare const IconWrapper: (props: PropsWithChildren<IconWrapperProps> & ClassNameProps) => JSX.Element;
 export default IconWrapper;

package/build/esm/components/IconWrapper/IconWrapper.js

@@ -5,14 +5,14 @@ import { getMediaImage } from '../Media/Image/utils';
 import './IconWrapper.css';
 const b = block('icon-wrapper');
 const IconWrapper = (props) => {
-    const { icon, children } = props;
+    const { icon, children, className } = props;
     if (!icon) {
         return React.createElement(Fragment, null, children);
     }
     const iconProps = getMediaImage(icon.value);
     const iconPosition = icon === null || icon === void 0 ? void 0 : icon.position;
-    return (React.createElement("div", { className: b({ ['icon-position']: iconPosition }) },
+    return (React.createElement("div", { className: b({ ['icon-position']: iconPosition }, className) },
         iconProps && (React.createElement(Image, Object.assign({}, iconProps, { containerClassName: b('icon-container'), className: b('icon', { ['icon-position']: iconPosition }) }))),
-        React.createElement("div", { className: b({ ['content']: iconPosition }) }, children)));
+        React.createElement("div", { className: b('content') }, children)));
 };
 export default IconWrapper;

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

@@ -24,7 +24,7 @@ export declare const subBlockMap: {
     "price-detailed": (props: import("./models").PriceDetailedProps) => JSX.Element;
     "media-card": ({ border, analyticsEvents, ...mediaProps }: import("./models").MediaCardProps) => JSX.Element;
     "banner-card": (props: import("./models").BannerCardProps) => JSX.Element;
-    "layout-item": ({ content: { links, buttons, ...content }, metaInfo, media, border, fullscreen, icon, className, analyticsEvents, controlPosition, }: import("./models").LayoutItemProps) => JSX.Element;
+    "layout-item": ({ content: { links, ...content }, metaInfo, media, border, fullscreen, icon, className, analyticsEvents, controlPosition, }: import("./models").LayoutItemProps) => JSX.Element;
     "background-card": (props: import("./models").BackgroundCardProps) => JSX.Element;
     "basic-card": (props: import("./models").BasicCardProps) => JSX.Element;
     content: (props: import("./sub-blocks/Content/Content").ContentProps) => JSX.Element;

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.13.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;