@gravity-ui/page-constructor 5.11.1 → 5.13.0

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

@@ -173,6 +173,10 @@ export declare const ContentLayoutBlock: {
                             };
                         };
                     };
+                    controlPosition: {
+                        type: string;
+                        enum: string[];
+                    };
                 };
             };
             fileContent: {

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

@@ -164,6 +164,10 @@ export declare const FormBlock: {
                             };
                         };
                     };
+                    controlPosition: {
+                        type: string;
+                        enum: string[];
+                    };
                 }>;
             };
             direction: {

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

@@ -135,6 +135,10 @@ export declare const InfoBlock: {
                             };
                         };
                     };
+                    controlPosition: {
+                        type: string;
+                        enum: string[];
+                    };
                 }>;
             };
             rightContent: {
@@ -222,6 +226,10 @@ export declare const InfoBlock: {
                             };
                         };
                     };
+                    controlPosition: {
+                        type: string;
+                        enum: string[];
+                    };
                 }>;
             };
             type: {};

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

@@ -368,6 +368,10 @@ export declare const MapBlock: {
                     };
                 };
             };
+            controlPosition: {
+                type: string;
+                enum: string[];
+            };
             animated: {
                 type: string;
             };

package/build/cjs/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/cjs/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/cjs/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/cjs/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/cjs/components/IconWrapper/IconWrapper.d.ts

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

package/build/cjs/components/IconWrapper/IconWrapper.js

@@ -7,14 +7,14 @@ const Image_1 = tslib_1.__importDefault(require("../Image/Image"));
 const utils_2 = require("../Media/Image/utils");
 const b = (0, utils_1.block)('icon-wrapper');
 const IconWrapper = (props) => {
-    const { icon, children } = props;
+    const { icon, children, className } = props;
     if (!icon) {
         return react_1.default.createElement(react_1.Fragment, null, children);
     }
     const iconProps = (0, utils_2.getMediaImage)(icon.value);
     const iconPosition = icon === null || icon === void 0 ? void 0 : icon.position;
-    return (react_1.default.createElement("div", { className: b({ ['icon-position']: iconPosition }) },
+    return (react_1.default.createElement("div", { className: b({ ['icon-position']: iconPosition }, className) },
         iconProps && (react_1.default.createElement(Image_1.default, Object.assign({}, iconProps, { containerClassName: b('icon-container'), className: b('icon', { ['icon-position']: iconPosition }) }))),
-        react_1.default.createElement("div", { className: b({ ['content']: iconPosition }) }, children)));
+        react_1.default.createElement("div", { className: b('content') }, children)));
 };
 exports.default = IconWrapper;

package/build/cjs/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/cjs/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/cjs/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/cjs/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/cjs/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/cjs/schema/validators/common.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.BlockHeaderProps = exports.CardBase = exports.BorderProps = exports.MapProps = exports.YMapMarker = exports.YMapMarkerLabel = exports.MediaProps = exports.ButtonBlock = exports.TitleProps = exports.BlockBaseProps = exports.AnchorProps = exports.withTheme = exports.MenuProps = exports.ButtonProps = exports.authorItem = exports.FileLinkProps = exports.LinkProps = exports.BackgroundProps = exports.DataLensProps = exports.DataLensObjectProps = exports.JustifyProps = exports.ThemeProps = exports.VideoProps = exports.CustomControlsOptionsProps = exports.PlayButtonProps = exports.LoopProps = exports.ChildrenCardsProps = exports.ChildrenProps = exports.AnimatableProps = exports.sliderSizesObject = exports.containerSizesObject = exports.BaseProps = exports.customControlsButtonPositioning = exports.customControlsType = exports.mediaView = exports.quoteTypes = exports.contentThemes = exports.sizeNumber = exports.dividerEnum = exports.fileLinkTypes = exports.videoControlsTypes = exports.playIconThemes = exports.playIconTypes = exports.videoTypes = exports.contentTextWidth = exports.contentSizes = exports.sliderSizesArray = exports.containerSizesArray = exports.textSize = exports.mediaDirection = void 0;
+exports.CardBase = exports.BorderProps = exports.MapProps = exports.YMapMarker = exports.YMapMarkerLabel = exports.MediaProps = exports.ButtonBlock = exports.TitleProps = exports.BlockBaseProps = exports.AnchorProps = exports.withTheme = exports.MenuProps = exports.ButtonProps = exports.authorItem = exports.FileLinkProps = exports.LinkProps = exports.BackgroundProps = exports.DataLensProps = exports.DataLensObjectProps = exports.JustifyProps = exports.ThemeProps = exports.VideoProps = exports.CustomControlsOptionsProps = exports.PlayButtonProps = exports.LoopProps = exports.ChildrenCardsProps = exports.ChildrenProps = exports.AnimatableProps = exports.sliderSizesObject = exports.containerSizesObject = exports.CardLayoutProps = exports.BaseProps = exports.customControlsButtonPositioning = exports.customControlsType = exports.mediaView = exports.quoteTypes = exports.contentThemes = exports.sizeNumber = exports.dividerEnum = exports.fileLinkTypes = exports.videoControlsTypes = exports.playIconThemes = exports.playIconTypes = exports.videoTypes = exports.contentTextWidth = exports.contentSizes = exports.sliderSizesArray = exports.containerSizesArray = exports.textSize = exports.mediaDirection = void 0;
+exports.BlockHeaderProps = void 0;
 const schema_1 = require("../../components/Image/schema");
 const models_1 = require("../../models");
 const event_1 = require("./event");
@@ -35,6 +36,12 @@ exports.BaseProps = {
         type: 'string',
     },
 };
+exports.CardLayoutProps = {
+    controlPosition: {
+        type: 'string',
+        enum: ['content', 'footer'],
+    },
+};
 exports.containerSizesObject = {
     type: 'object',
     additionalProperties: false,

package/build/cjs/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/cjs/sub-blocks/BackgroundCard/BackgroundCard.js

@@ -15,12 +15,9 @@ const BackgroundCard = (props) => {
     const hasBackgroundColor = backgroundColor || cardTheme !== 'default';
     const borderType = hasBackgroundColor ? 'none' : border;
     const areControlsInFooter = !paddingBottom && controlPosition === 'footer';
-    return (react_1.default.createElement(components_1.CardBase, { className: b({ padding: paddingBottom, theme: cardTheme }), url: url, border: borderType, analyticsEvents: analyticsEvents, urlTitle: urlTitle },
+    return (react_1.default.createElement(components_1.CardBase, { className: b({ padding: paddingBottom, theme: cardTheme }), contentClassName: b('content'), url: url, border: borderType, analyticsEvents: analyticsEvents, urlTitle: urlTitle },
         react_1.default.createElement(components_1.CardBase.Content, null,
             react_1.default.createElement(components_1.BackgroundImage, Object.assign({ className: b('image') }, (0, utils_1.getThemedValue)(background, theme), { style: { backgroundColor } })),
-            react_1.default.createElement(Content_1.default, { 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_1.default.createElement(components_1.CardBase.Footer, null,
-            react_1.default.createElement(components_1.Links, { className: b('links'), size: "s", links: links, titleId: titleId }),
-            react_1.default.createElement(components_1.Buttons, { className: b('buttons'), size: "s", buttons: buttons, titleId: titleId })))));
+            react_1.default.createElement(Content_1.default, { 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' }))));
 };
 exports.default = BackgroundCard;

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

@@ -7,12 +7,12 @@ const schema_1 = require("../../components/Image/schema");
 const common_1 = require("../../schema/validators/common");
 const event_1 = require("../../schema/validators/event");
 const schema_2 = require("../Content/schema");
-const BackgroundCardContentProps = (0, omit_1.default)(schema_2.ContentBase, ['size']);
+const BackgroundCardContentProps = (0, omit_1.default)(schema_2.ContentBase, ['size', 'controlPosition']);
 exports.BackgroundCard = {
     'background-card': {
         additionalProperties: false,
         required: ['title', 'text'],
-        properties: Object.assign(Object.assign(Object.assign(Object.assign({}, common_1.BaseProps), common_1.CardBase), BackgroundCardContentProps), { url: {
+        properties: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, common_1.BaseProps), common_1.CardBase), common_1.CardLayoutProps), BackgroundCardContentProps), { url: {
                 type: 'string',
             }, urlTitle: {
                 type: 'string',

package/build/cjs/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/cjs/sub-blocks/BasicCard/BasicCard.js

@@ -13,12 +13,9 @@ const BasicCard = (props) => {
     const titleId = (0, uikit_1.useUniqId)();
     const descriptionId = (0, uikit_1.useUniqId)();
     const areControlsInFooter = controlPosition === 'footer';
-    return (react_1.default.createElement(components_1.CardBase, Object.assign({ className: b() }, cardParams, { extraProps: { 'aria-describedby': descriptionId, 'aria-labelledby': titleId } }),
+    return (react_1.default.createElement(components_1.CardBase, Object.assign({ className: b(), contentClassName: b('content') }, cardParams, { extraProps: { 'aria-describedby': descriptionId, 'aria-labelledby': titleId } }),
         react_1.default.createElement(components_1.CardBase.Content, null,
-            react_1.default.createElement(components_1.IconWrapper, { icon: icon ? { value: icon, position: iconPosition } : undefined },
-                react_1.default.createElement(Content_1.default, { 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_1.default.createElement(components_1.CardBase.Footer, { className: b('footer') },
-            react_1.default.createElement(components_1.Links, { className: b('links'), size: "s", links: links, titleId: titleId }),
-            react_1.default.createElement(components_1.Buttons, { className: b('buttons'), size: "s", buttons: buttons, titleId: titleId })))));
+            react_1.default.createElement(components_1.IconWrapper, { icon: icon ? { value: icon, position: iconPosition } : undefined, className: b('wrapper') },
+                react_1.default.createElement(Content_1.default, { 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' })))));
 };
 exports.default = BasicCard;

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

@@ -6,12 +6,12 @@ const omit_1 = tslib_1.__importDefault(require("lodash/omit"));
 const schema_1 = require("../../components/Image/schema");
 const common_1 = require("../../schema/validators/common");
 const schema_2 = require("../Content/schema");
-const BasicCardContentProps = (0, omit_1.default)(schema_2.ContentBase, ['size', 'theme']);
+const BasicCardContentProps = (0, omit_1.default)(schema_2.ContentBase, ['size', 'theme', 'controlPosition']);
 exports.BasicCard = {
     'basic-card': {
         additionalProperties: false,
         required: [],
-        properties: Object.assign(Object.assign(Object.assign(Object.assign({}, common_1.BaseProps), common_1.CardBase), BasicCardContentProps), { url: {
+        properties: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, common_1.BaseProps), common_1.CardBase), common_1.CardLayoutProps), BasicCardContentProps), { url: {
                 type: 'string',
             }, urlTitle: {
                 type: 'string',

package/build/cjs/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/cjs/sub-blocks/Content/Content.js

@@ -18,7 +18,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 = (0, blocks_1.getQaAttrubutes)(qa, ['links', 'link', 'buttons', 'button', 'list']);
     const titleProps = !title || typeof title === 'string'
         ? { text: title, textSize: getTextSize(size) }
@@ -26,7 +26,7 @@ const Content = (props) => {
     const hasTitle = Boolean(title);
     const defaultTitleId = (0, uikit_1.useUniqId)();
     const titleId = titleIdFromProps || defaultTitleId;
-    return (react_1.default.createElement(grid_1.Col, { className: b({ size, centered, theme }, className), reset: true, sizes: colSizes, qa: qaAttributes.container },
+    return (react_1.default.createElement(grid_1.Col, { className: b({ size, centered, theme, 'control-position': controlPosition }, className), reset: true, sizes: colSizes, qa: qaAttributes.container },
         title && (react_1.default.createElement(components_1.Title, { className: b('title'), title: titleProps, colSizes: { all: 12 }, id: titleId })),
         text && (react_1.default.createElement("div", { className: b('text', { ['without-title']: !hasTitle }) },
             react_1.default.createElement(components_1.YFMWrapper, { content: text, modifiers: { constructor: true, [`constructor-size-${size}`]: true }, id: textId }))),

package/build/cjs/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/cjs/sub-blocks/Content/schema.js

@@ -50,6 +50,10 @@ exports.ContentBase = {
         enum: common_1.contentThemes,
     },
     list: (0, utils_1.filteredArray)(exports.ContentItem),
+    controlPosition: {
+        type: 'string',
+        enum: ['default', 'bottom'],
+    },
 };
 exports.ContentBlock = {
     content: {

package/build/cjs/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/cjs/sub-blocks/ImageCard/ImageCard.js

@@ -9,8 +9,10 @@ const models_1 = require("../../models");
 const utils_2 = require("../../utils");
 const Content_1 = tslib_1.__importDefault(require("../Content/Content"));
 const b = (0, utils_2.block)('image-card');
+const CONTENT_COL_SIZES = { all: 12, md: 12 };
 const ImageCard = (props) => {
-    const { border = 'shadow', title, text, image, enableImageBorderRadius = false, direction = models_1.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 = models_1.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 = (0, utils_1.getMediaImage)(image);
     const titleId = (0, uikit_1.useUniqId)();
@@ -18,7 +20,7 @@ const ImageCard = (props) => {
         react_1.default.createElement("div", { className: b('image', { margins }) },
             react_1.default.createElement(components_1.Image, Object.assign({ className: b('image_inner', { radius: enableImageBorderRadius }) }, imageProps))),
         hasContent && (react_1.default.createElement("div", { className: b('content') },
-            react_1.default.createElement(Content_1.default, { titleId: titleId, title: title, text: text, links: links, buttons: buttons, list: list, theme: cardTheme, additionalInfo: additionalInfo, size: size, colSizes: { all: 12, md: 12 } })))));
+            react_1.default.createElement(Content_1.default, { 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_1.default.createElement(uikit_1.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/cjs/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/cjs/sub-blocks/ImageCard/schema.js

@@ -6,12 +6,12 @@ const omit_1 = tslib_1.__importDefault(require("lodash/omit"));
 const common_1 = require("../../schema/validators/common");
 const components_1 = require("../../schema/validators/components");
 const schema_1 = require("../Content/schema");
-const ImageCardBlockContentProps = (0, omit_1.default)(schema_1.ContentBase, ['centered', 'colSizes']);
+const ImageCardBlockContentProps = (0, omit_1.default)(schema_1.ContentBase, ['centered', 'colSizes', 'controlPosition']);
 exports.ImageCard = {
     'image-card': {
         additionalProperties: false,
         required: ['image'],
-        properties: Object.assign(Object.assign(Object.assign(Object.assign({}, common_1.BaseProps), common_1.CardBase), ImageCardBlockContentProps), { image: components_1.ImageProps, direction: {
+        properties: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, common_1.BaseProps), common_1.CardBase), common_1.CardLayoutProps), ImageCardBlockContentProps), { image: components_1.ImageProps, direction: {
                 type: 'string',
                 enum: ['direct', 'reverse'],
             }, margins: {

package/build/cjs/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/cjs/sub-blocks/LayoutItem/LayoutItem.d.ts

@@ -1,3 +1,3 @@
 import { LayoutItemProps } from '../../models';
-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/cjs/sub-blocks/LayoutItem/LayoutItem.js

@@ -10,11 +10,11 @@ const Content_1 = tslib_1.__importDefault(require("../Content/Content"));
 const utils_2 = require("./utils");
 const b = (0, utils_1.block)('layout-item');
 const LayoutItem = (_a) => {
-    var _b = _a.content, { links, buttons } = _b, content = tslib_1.__rest(_b, ["links", "buttons"]), { metaInfo, media, border, fullscreen, icon, className, analyticsEvents, controlPosition = 'content' } = _a;
+    var _b = _a.content, { links } = _b, content = tslib_1.__rest(_b, ["links"]), { metaInfo, media, border, fullscreen, icon, className, analyticsEvents, controlPosition = 'content' } = _a;
     const normalizedLinks = (0, react_1.useMemo)(() => (0, utils_2.getLayoutItemLinks)(links), [links]);
     const areControlsInFooter = controlPosition === 'footer';
     const theme = (0, theme_1.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 = (0, uikit_1.useUniqId)();
     const renderMedia = () => {
         if (!media) {
@@ -30,9 +30,7 @@ const LayoutItem = (_a) => {
         renderMedia(),
         metaInfo && react_1.default.createElement(components_1.MetaInfo, { items: metaInfo, className: b('meta-info') }),
         react_1.default.createElement("div", { className: b('content', { 'no-media': !media }) },
-            react_1.default.createElement(components_1.IconWrapper, { icon: icon },
-                react_1.default.createElement(Content_1.default, Object.assign({}, contentProps, { titleId: titleId })))),
-        areControlsInFooter && links && (react_1.default.createElement(components_1.Links, { className: b('links'), size: "s", links: links, titleId: titleId })),
-        areControlsInFooter && buttons && (react_1.default.createElement(components_1.Buttons, { className: b('buttons'), size: "s", buttons: buttons, titleId: titleId }))));
+            react_1.default.createElement(components_1.IconWrapper, { icon: icon, className: b('wrapper') },
+                react_1.default.createElement(Content_1.default, Object.assign({}, contentProps, { titleId: titleId }))))));
 };
 exports.default = LayoutItem;

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

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

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

@@ -11,7 +11,7 @@ exports.LayoutItem = {
     type: 'object',
     additionalProperties: false,
     required: ['content', 'media'],
-    properties: Object.assign(Object.assign({}, common_1.BaseProps), { media: common_1.MediaProps, content: (0, omit_1.default)(schema_2.ContentBase, ['colSize', 'size', 'centered']), metaInfo: schema_1.default, border: {
+    properties: Object.assign(Object.assign(Object.assign({}, common_1.BaseProps), common_1.CardLayoutProps), { media: common_1.MediaProps, content: (0, omit_1.default)(schema_2.ContentBase, ['colSize', 'size', 'centered']), metaInfo: schema_1.default, border: {
             type: 'boolean',
         }, fullscreen: {
             type: 'boolean',
@@ -24,8 +24,5 @@ exports.LayoutItem = {
                     optionName: 'list',
                 },
             ],
-        }, controlPosition: {
-            type: 'string',
-            enum: ['content', 'footer'],
         } }),
 };

package/build/cjs/text-transform/config.js

@@ -113,6 +113,16 @@ exports.config = {
             transformer: common_1.typografTransformer,
         },
     ],
+    [models_1.SubBlockType.ImageCard]: [
+        {
+            fields: ['text', 'additionalInfo'],
+            transformer: common_1.yfmTransformer,
+        },
+        {
+            fields: ['title'],
+            transformer: common_1.typografTransformer,
+        },
+    ],
     [models_1.SubBlockType.LayoutItem]: [
         {
             fields: ['content'],

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

@@ -173,6 +173,10 @@ export declare const ContentLayoutBlock: {
                             };
                         };
                     };
+                    controlPosition: {
+                        type: string;
+                        enum: string[];
+                    };
                 };
             };
             fileContent: {

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

@@ -164,6 +164,10 @@ export declare const FormBlock: {
                             };
                         };
                     };
+                    controlPosition: {
+                        type: string;
+                        enum: string[];
+                    };
                 }>;
             };
             direction: {