@gravity-ui/page-constructor 5.12.0 → 5.13.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (74) hide show
  1. package/build/cjs/blocks/ContentLayout/schema.d.ts +4 -0
  2. package/build/cjs/blocks/Form/schema.d.ts +4 -0
  3. package/build/cjs/blocks/Info/schema.d.ts +8 -0
  4. package/build/cjs/blocks/Map/schema.d.ts +4 -0
  5. package/build/cjs/blocks/Media/schema.d.ts +8 -0
  6. package/build/cjs/blocks/Questions/schema.d.ts +4 -0
  7. package/build/cjs/blocks/Tabs/schema.d.ts +4 -0
  8. package/build/cjs/components/IconWrapper/IconWrapper.css +4 -2
  9. package/build/cjs/components/IconWrapper/IconWrapper.d.ts +2 -2
  10. package/build/cjs/components/IconWrapper/IconWrapper.js +3 -3
  11. package/build/cjs/constructor-items.d.ts +1 -1
  12. package/build/cjs/models/constructor-items/blocks.d.ts +1 -0
  13. package/build/cjs/models/constructor-items/sub-blocks.d.ts +3 -3
  14. package/build/cjs/schema/constants.d.ts +4 -0
  15. package/build/cjs/schema/validators/common.d.ts +6 -0
  16. package/build/cjs/schema/validators/common.js +8 -1
  17. package/build/cjs/sub-blocks/BackgroundCard/BackgroundCard.css +3 -6
  18. package/build/cjs/sub-blocks/BackgroundCard/BackgroundCard.js +2 -5
  19. package/build/cjs/sub-blocks/BackgroundCard/schema.js +2 -2
  20. package/build/cjs/sub-blocks/BasicCard/BasicCard.css +4 -4
  21. package/build/cjs/sub-blocks/BasicCard/BasicCard.js +3 -6
  22. package/build/cjs/sub-blocks/BasicCard/schema.js +2 -2
  23. package/build/cjs/sub-blocks/Content/Content.css +11 -0
  24. package/build/cjs/sub-blocks/Content/Content.js +2 -2
  25. package/build/cjs/sub-blocks/Content/schema.d.ts +8 -0
  26. package/build/cjs/sub-blocks/Content/schema.js +4 -0
  27. package/build/cjs/sub-blocks/ImageCard/ImageCard.css +2 -0
  28. package/build/cjs/sub-blocks/ImageCard/ImageCard.js +4 -2
  29. package/build/cjs/sub-blocks/ImageCard/schema.d.ts +4 -0
  30. package/build/cjs/sub-blocks/ImageCard/schema.js +2 -2
  31. package/build/cjs/sub-blocks/LayoutItem/LayoutItem.css +3 -2
  32. package/build/cjs/sub-blocks/LayoutItem/LayoutItem.d.ts +1 -1
  33. package/build/cjs/sub-blocks/LayoutItem/LayoutItem.js +4 -6
  34. package/build/cjs/sub-blocks/LayoutItem/schema.d.ts +4 -0
  35. package/build/cjs/sub-blocks/LayoutItem/schema.js +1 -4
  36. package/build/esm/blocks/ContentLayout/schema.d.ts +4 -0
  37. package/build/esm/blocks/Form/schema.d.ts +4 -0
  38. package/build/esm/blocks/Info/schema.d.ts +8 -0
  39. package/build/esm/blocks/Map/schema.d.ts +4 -0
  40. package/build/esm/blocks/Media/schema.d.ts +8 -0
  41. package/build/esm/blocks/Questions/schema.d.ts +4 -0
  42. package/build/esm/blocks/Tabs/schema.d.ts +4 -0
  43. package/build/esm/components/IconWrapper/IconWrapper.css +4 -2
  44. package/build/esm/components/IconWrapper/IconWrapper.d.ts +2 -2
  45. package/build/esm/components/IconWrapper/IconWrapper.js +3 -3
  46. package/build/esm/constructor-items.d.ts +1 -1
  47. package/build/esm/models/constructor-items/blocks.d.ts +1 -0
  48. package/build/esm/models/constructor-items/sub-blocks.d.ts +3 -3
  49. package/build/esm/schema/constants.d.ts +4 -0
  50. package/build/esm/schema/validators/common.d.ts +6 -0
  51. package/build/esm/schema/validators/common.js +6 -0
  52. package/build/esm/sub-blocks/BackgroundCard/BackgroundCard.css +3 -6
  53. package/build/esm/sub-blocks/BackgroundCard/BackgroundCard.js +3 -6
  54. package/build/esm/sub-blocks/BackgroundCard/schema.js +3 -3
  55. package/build/esm/sub-blocks/BasicCard/BasicCard.css +4 -4
  56. package/build/esm/sub-blocks/BasicCard/BasicCard.js +4 -7
  57. package/build/esm/sub-blocks/BasicCard/schema.js +3 -3
  58. package/build/esm/sub-blocks/Content/Content.css +11 -0
  59. package/build/esm/sub-blocks/Content/Content.js +2 -2
  60. package/build/esm/sub-blocks/Content/schema.d.ts +8 -0
  61. package/build/esm/sub-blocks/Content/schema.js +4 -0
  62. package/build/esm/sub-blocks/ImageCard/ImageCard.css +2 -0
  63. package/build/esm/sub-blocks/ImageCard/ImageCard.js +4 -2
  64. package/build/esm/sub-blocks/ImageCard/schema.d.ts +4 -0
  65. package/build/esm/sub-blocks/ImageCard/schema.js +3 -3
  66. package/build/esm/sub-blocks/LayoutItem/LayoutItem.css +3 -2
  67. package/build/esm/sub-blocks/LayoutItem/LayoutItem.d.ts +1 -1
  68. package/build/esm/sub-blocks/LayoutItem/LayoutItem.js +5 -7
  69. package/build/esm/sub-blocks/LayoutItem/schema.d.ts +4 -0
  70. package/build/esm/sub-blocks/LayoutItem/schema.js +2 -5
  71. package/package.json +1 -1
  72. package/server/models/constructor-items/blocks.d.ts +1 -0
  73. package/server/models/constructor-items/sub-blocks.d.ts +3 -3
  74. package/widget/index.js +1 -1
@@ -173,6 +173,10 @@ export declare const ContentLayoutBlock: {
173
173
  };
174
174
  };
175
175
  };
176
+ controlPosition: {
177
+ type: string;
178
+ enum: string[];
179
+ };
176
180
  };
177
181
  };
178
182
  fileContent: {
@@ -164,6 +164,10 @@ export declare const FormBlock: {
164
164
  };
165
165
  };
166
166
  };
167
+ controlPosition: {
168
+ type: string;
169
+ enum: string[];
170
+ };
167
171
  }>;
168
172
  };
169
173
  direction: {
@@ -135,6 +135,10 @@ export declare const InfoBlock: {
135
135
  };
136
136
  };
137
137
  };
138
+ controlPosition: {
139
+ type: string;
140
+ enum: string[];
141
+ };
138
142
  }>;
139
143
  };
140
144
  rightContent: {
@@ -222,6 +226,10 @@ export declare const InfoBlock: {
222
226
  };
223
227
  };
224
228
  };
229
+ controlPosition: {
230
+ type: string;
231
+ enum: string[];
232
+ };
225
233
  }>;
226
234
  };
227
235
  type: {};
@@ -368,6 +368,10 @@ export declare const MapBlock: {
368
368
  };
369
369
  };
370
370
  };
371
+ controlPosition: {
372
+ type: string;
373
+ enum: string[];
374
+ };
371
375
  animated: {
372
376
  type: string;
373
377
  };
@@ -538,6 +538,10 @@ export declare const MediaBlockBaseProps: {
538
538
  };
539
539
  };
540
540
  };
541
+ controlPosition: {
542
+ type: string;
543
+ enum: string[];
544
+ };
541
545
  animated: {
542
546
  type: string;
543
547
  };
@@ -1139,6 +1143,10 @@ export declare const MediaBlock: {
1139
1143
  };
1140
1144
  };
1141
1145
  };
1146
+ controlPosition: {
1147
+ type: string;
1148
+ enum: string[];
1149
+ };
1142
1150
  animated: {
1143
1151
  type: string;
1144
1152
  };
@@ -88,6 +88,10 @@ export declare const QuestionsBlock: {
88
88
  };
89
89
  };
90
90
  };
91
+ controlPosition: {
92
+ type: string;
93
+ enum: string[];
94
+ };
91
95
  anchor: {
92
96
  type: string;
93
97
  additionalProperties: boolean;
@@ -522,6 +522,10 @@ export declare const tabsItem: {
522
522
  };
523
523
  };
524
524
  } | undefined;
525
+ controlPosition?: {
526
+ type: string;
527
+ enum: string[];
528
+ } | undefined;
525
529
  };
526
530
  };
527
531
  export declare const TabsBlock: {
@@ -22,6 +22,8 @@ unpredictable css rules order in build */
22
22
  width: 22px;
23
23
  margin: 1px 12px 1px 0px;
24
24
  }
25
- .pc-icon-wrapper_content_left.pc-icon-wrapper_content_left {
26
- flex: 1 0 0;
25
+ .pc-icon-wrapper__content {
26
+ display: flex;
27
+ flex-direction: column;
28
+ flex: 1 0 auto;
27
29
  }
@@ -1,4 +1,4 @@
1
1
  import { PropsWithChildren } from 'react';
2
- import { IconWrapperProps } from '../../models';
3
- declare const IconWrapper: (props: PropsWithChildren<IconWrapperProps>) => JSX.Element;
2
+ import type { ClassNameProps, IconWrapperProps } from '../../models';
3
+ declare const IconWrapper: (props: PropsWithChildren<IconWrapperProps> & ClassNameProps) => JSX.Element;
4
4
  export default IconWrapper;
@@ -7,14 +7,14 @@ const Image_1 = tslib_1.__importDefault(require("../Image/Image"));
7
7
  const utils_2 = require("../Media/Image/utils");
8
8
  const b = (0, utils_1.block)('icon-wrapper');
9
9
  const IconWrapper = (props) => {
10
- const { icon, children } = props;
10
+ const { icon, children, className } = props;
11
11
  if (!icon) {
12
12
  return react_1.default.createElement(react_1.Fragment, null, children);
13
13
  }
14
14
  const iconProps = (0, utils_2.getMediaImage)(icon.value);
15
15
  const iconPosition = icon === null || icon === void 0 ? void 0 : icon.position;
16
- return (react_1.default.createElement("div", { className: b({ ['icon-position']: iconPosition }) },
16
+ return (react_1.default.createElement("div", { className: b({ ['icon-position']: iconPosition }, className) },
17
17
  iconProps && (react_1.default.createElement(Image_1.default, Object.assign({}, iconProps, { containerClassName: b('icon-container'), className: b('icon', { ['icon-position']: iconPosition }) }))),
18
- react_1.default.createElement("div", { className: b({ ['content']: iconPosition }) }, children)));
18
+ react_1.default.createElement("div", { className: b('content') }, children)));
19
19
  };
20
20
  exports.default = IconWrapper;
@@ -24,7 +24,7 @@ export declare const subBlockMap: {
24
24
  "price-detailed": (props: import("./models").PriceDetailedProps) => JSX.Element;
25
25
  "media-card": ({ border, analyticsEvents, ...mediaProps }: import("./models").MediaCardProps) => JSX.Element;
26
26
  "banner-card": (props: import("./models").BannerCardProps) => JSX.Element;
27
- "layout-item": ({ content: { links, buttons, ...content }, metaInfo, media, border, fullscreen, icon, className, analyticsEvents, controlPosition, }: import("./models").LayoutItemProps) => JSX.Element;
27
+ "layout-item": ({ content: { links, ...content }, metaInfo, media, border, fullscreen, icon, className, analyticsEvents, controlPosition, }: import("./models").LayoutItemProps) => JSX.Element;
28
28
  "background-card": (props: import("./models").BackgroundCardProps) => JSX.Element;
29
29
  "basic-card": (props: import("./models").BasicCardProps) => JSX.Element;
30
30
  content: (props: import("./sub-blocks/Content/Content").ContentProps) => JSX.Element;
@@ -302,6 +302,7 @@ export interface ContentBlockProps {
302
302
  centered?: boolean;
303
303
  theme?: ContentTheme;
304
304
  list?: ContentItemProps[];
305
+ controlPosition?: 'default' | 'bottom';
305
306
  }
306
307
  export declare enum PCShareSocialNetwork {
307
308
  Vk = "vk",
@@ -96,14 +96,14 @@ export interface QuoteProps extends Themable, CardBaseProps {
96
96
  quoteType?: QuoteType;
97
97
  button?: ButtonProps;
98
98
  }
99
- export interface BackgroundCardProps extends CardBaseProps, AnalyticsEventsBase, CardLayoutProps, Omit<ContentBlockProps, 'colSizes' | 'centered'> {
99
+ export interface BackgroundCardProps extends CardBaseProps, AnalyticsEventsBase, CardLayoutProps, Omit<ContentBlockProps, 'colSizes' | 'centered' | 'controlPosition'> {
100
100
  url?: string;
101
101
  urlTitle?: string;
102
102
  background?: ThemeSupporting<ImageObjectProps>;
103
103
  paddingBottom?: 's' | 'm' | 'l' | 'xl';
104
104
  backgroundColor?: string;
105
105
  }
106
- export interface BasicCardProps extends CardBaseProps, AnalyticsEventsBase, CardLayoutProps, Omit<ContentBlockProps, 'colSizes' | 'centered' | 'size' | 'theme'> {
106
+ export interface BasicCardProps extends CardBaseProps, AnalyticsEventsBase, CardLayoutProps, Omit<ContentBlockProps, 'colSizes' | 'centered' | 'size' | 'theme' | 'controlPosition'> {
107
107
  url: string;
108
108
  urlTitle?: string;
109
109
  icon?: ImageProps;
@@ -141,7 +141,7 @@ export interface LayoutItemProps extends ClassNameProps, CardLayoutProps, Analyt
141
141
  fullscreen?: boolean;
142
142
  icon?: PositionedIcon;
143
143
  }
144
- export interface ImageCardProps extends CardBaseProps, CardLayoutProps, Omit<ContentBlockProps, 'colSizes' | 'centered'> {
144
+ export interface ImageCardProps extends CardBaseProps, CardLayoutProps, Omit<ContentBlockProps, 'colSizes' | 'centered' | 'controlPosition'> {
145
145
  image: ImageProps;
146
146
  enableImageBorderRadius?: boolean;
147
147
  margins?: ImageCardMargins;
@@ -118,6 +118,10 @@ export declare const cardSchemas: {
118
118
  };
119
119
  };
120
120
  } | undefined;
121
+ controlPosition: {
122
+ type: string; /** @deprecated */
123
+ enum: string[];
124
+ };
121
125
  border: {
122
126
  type: string;
123
127
  enum: string[];
@@ -29,6 +29,12 @@ export declare const BaseProps: {
29
29
  type: string;
30
30
  };
31
31
  };
32
+ export declare const CardLayoutProps: {
33
+ controlPosition: {
34
+ type: string;
35
+ enum: string[];
36
+ };
37
+ };
32
38
  export declare const containerSizesObject: {
33
39
  type: string;
34
40
  additionalProperties: boolean;
@@ -1,6 +1,7 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- 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;
3
+ 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;
4
+ exports.BlockHeaderProps = void 0;
4
5
  const schema_1 = require("../../components/Image/schema");
5
6
  const models_1 = require("../../models");
6
7
  const event_1 = require("./event");
@@ -35,6 +36,12 @@ exports.BaseProps = {
35
36
  type: 'string',
36
37
  },
37
38
  };
39
+ exports.CardLayoutProps = {
40
+ controlPosition: {
41
+ type: 'string',
42
+ enum: ['content', 'footer'],
43
+ },
44
+ };
38
45
  exports.containerSizesObject = {
39
46
  type: 'object',
40
47
  additionalProperties: false,
@@ -26,6 +26,9 @@ unpredictable css rules order in build */
26
26
  cursor: default;
27
27
  border: none;
28
28
  }
29
+ .pc-background-card__content {
30
+ display: flex;
31
+ }
29
32
  .pc-background-card__image {
30
33
  position: absolute;
31
34
  top: 0;
@@ -37,12 +40,6 @@ unpredictable css rules order in build */
37
40
  object-fit: cover;
38
41
  object-position: left;
39
42
  }
40
- .pc-background-card__footer {
41
- margin-top: 0px;
42
- }
43
- .pc-background-card__links, .pc-background-card__buttons {
44
- margin-top: 16px;
45
- }
46
43
 
47
44
  a.pc-background-card_theme_light {
48
45
  background-color: var(--pc-color-base-silver);
@@ -15,12 +15,9 @@ const BackgroundCard = (props) => {
15
15
  const hasBackgroundColor = backgroundColor || cardTheme !== 'default';
16
16
  const borderType = hasBackgroundColor ? 'none' : border;
17
17
  const areControlsInFooter = !paddingBottom && controlPosition === 'footer';
18
- return (react_1.default.createElement(components_1.CardBase, { className: b({ padding: paddingBottom, theme: cardTheme }), url: url, border: borderType, analyticsEvents: analyticsEvents, urlTitle: urlTitle },
18
+ 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 },
19
19
  react_1.default.createElement(components_1.CardBase.Content, null,
20
20
  react_1.default.createElement(components_1.BackgroundImage, Object.assign({ className: b('image') }, (0, utils_1.getThemedValue)(background, theme), { style: { backgroundColor } })),
21
- 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 } })),
22
- areControlsInFooter && (links || buttons) && (react_1.default.createElement(components_1.CardBase.Footer, null,
23
- react_1.default.createElement(components_1.Links, { className: b('links'), size: "s", links: links, titleId: titleId }),
24
- react_1.default.createElement(components_1.Buttons, { className: b('buttons'), size: "s", buttons: buttons, titleId: titleId })))));
21
+ 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' }))));
25
22
  };
26
23
  exports.default = BackgroundCard;
@@ -7,12 +7,12 @@ const schema_1 = require("../../components/Image/schema");
7
7
  const common_1 = require("../../schema/validators/common");
8
8
  const event_1 = require("../../schema/validators/event");
9
9
  const schema_2 = require("../Content/schema");
10
- const BackgroundCardContentProps = (0, omit_1.default)(schema_2.ContentBase, ['size']);
10
+ const BackgroundCardContentProps = (0, omit_1.default)(schema_2.ContentBase, ['size', 'controlPosition']);
11
11
  exports.BackgroundCard = {
12
12
  'background-card': {
13
13
  additionalProperties: false,
14
14
  required: ['title', 'text'],
15
- properties: Object.assign(Object.assign(Object.assign(Object.assign({}, common_1.BaseProps), common_1.CardBase), BackgroundCardContentProps), { url: {
15
+ properties: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, common_1.BaseProps), common_1.CardBase), common_1.CardLayoutProps), BackgroundCardContentProps), { url: {
16
16
  type: 'string',
17
17
  }, urlTitle: {
18
18
  type: 'string',
@@ -4,9 +4,9 @@ unpredictable css rules order in build */
4
4
  min-height: auto;
5
5
  }
6
6
 
7
- .pc-basic-card__footer {
8
- margin-top: 0px;
7
+ .pc-basic-card__content {
8
+ display: flex;
9
9
  }
10
- .pc-basic-card__links, .pc-basic-card__buttons {
11
- margin-top: 16px;
10
+ .pc-basic-card__wrapper {
11
+ flex: auto;
12
12
  }
@@ -13,12 +13,9 @@ const BasicCard = (props) => {
13
13
  const titleId = (0, uikit_1.useUniqId)();
14
14
  const descriptionId = (0, uikit_1.useUniqId)();
15
15
  const areControlsInFooter = controlPosition === 'footer';
16
- return (react_1.default.createElement(components_1.CardBase, Object.assign({ className: b() }, cardParams, { extraProps: { 'aria-describedby': descriptionId, 'aria-labelledby': titleId } }),
16
+ return (react_1.default.createElement(components_1.CardBase, Object.assign({ className: b(), contentClassName: b('content') }, cardParams, { extraProps: { 'aria-describedby': descriptionId, 'aria-labelledby': titleId } }),
17
17
  react_1.default.createElement(components_1.CardBase.Content, null,
18
- react_1.default.createElement(components_1.IconWrapper, { icon: icon ? { value: icon, position: iconPosition } : undefined },
19
- 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 } }))),
20
- areControlsInFooter && (buttons || links) && (react_1.default.createElement(components_1.CardBase.Footer, { className: b('footer') },
21
- react_1.default.createElement(components_1.Links, { className: b('links'), size: "s", links: links, titleId: titleId }),
22
- react_1.default.createElement(components_1.Buttons, { className: b('buttons'), size: "s", buttons: buttons, titleId: titleId })))));
18
+ react_1.default.createElement(components_1.IconWrapper, { icon: icon ? { value: icon, position: iconPosition } : undefined, className: b('wrapper') },
19
+ 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' })))));
23
20
  };
24
21
  exports.default = BasicCard;
@@ -6,12 +6,12 @@ const omit_1 = tslib_1.__importDefault(require("lodash/omit"));
6
6
  const schema_1 = require("../../components/Image/schema");
7
7
  const common_1 = require("../../schema/validators/common");
8
8
  const schema_2 = require("../Content/schema");
9
- const BasicCardContentProps = (0, omit_1.default)(schema_2.ContentBase, ['size', 'theme']);
9
+ const BasicCardContentProps = (0, omit_1.default)(schema_2.ContentBase, ['size', 'theme', 'controlPosition']);
10
10
  exports.BasicCard = {
11
11
  'basic-card': {
12
12
  additionalProperties: false,
13
13
  required: [],
14
- properties: Object.assign(Object.assign(Object.assign(Object.assign({}, common_1.BaseProps), common_1.CardBase), BasicCardContentProps), { url: {
14
+ properties: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, common_1.BaseProps), common_1.CardBase), common_1.CardLayoutProps), BasicCardContentProps), { url: {
15
15
  type: 'string',
16
16
  }, urlTitle: {
17
17
  type: 'string',
@@ -9,6 +9,8 @@ unpredictable css rules order in build */
9
9
  --pc-monochrome-button-background-color: #262626;
10
10
  --pc-monochrome-button-background-color-hover: #393939;
11
11
  --pc-monochrome-button-color: var(--g-color-text-light-primary);
12
+ display: flex;
13
+ flex-direction: column;
12
14
  }
13
15
  .pc-content__notice .yfm ol,
14
16
  .pc-content__notice .yfm ul, .pc-content__text .yfm ol,
@@ -145,4 +147,13 @@ unpredictable css rules order in build */
145
147
  }
146
148
  .pc-content_theme_light .pc-content__title a:hover {
147
149
  color: var(--g-color-text-dark-secondary);
150
+ }
151
+ .pc-content_control-position_bottom .pc-content__notice:has(+ .pc-content__buttons), .pc-content_control-position_bottom .pc-content__notice:has(+ .pc-content__link),
152
+ .pc-content_control-position_bottom .pc-content__list:has(+ .pc-content__buttons),
153
+ .pc-content_control-position_bottom .pc-content__list:has(+ .pc-content__link),
154
+ .pc-content_control-position_bottom .pc-content__text:has(+ .pc-content__buttons),
155
+ .pc-content_control-position_bottom .pc-content__text:has(+ .pc-content__link),
156
+ .pc-content_control-position_bottom .pc-content__title:has(+ .pc-content__buttons),
157
+ .pc-content_control-position_bottom .pc-content__title:has(+ .pc-content__link) {
158
+ margin-bottom: auto;
148
159
  }
@@ -18,7 +18,7 @@ function getTextSize(size) {
18
18
  }
19
19
  }
20
20
  const Content = (props) => {
21
- const { title, titleId: titleIdFromProps, text, textId, additionalInfo, size = 'l', links, buttons, colSizes = { all: 12, sm: 8 }, centered, theme, className, list, qa, } = props;
21
+ const { title, titleId: titleIdFromProps, text, textId, additionalInfo, size = 'l', links, buttons, colSizes = { all: 12, sm: 8 }, centered, theme, className, list, qa, controlPosition, } = props;
22
22
  const qaAttributes = (0, blocks_1.getQaAttrubutes)(qa, ['links', 'link', 'buttons', 'button', 'list']);
23
23
  const titleProps = !title || typeof title === 'string'
24
24
  ? { text: title, textSize: getTextSize(size) }
@@ -26,7 +26,7 @@ const Content = (props) => {
26
26
  const hasTitle = Boolean(title);
27
27
  const defaultTitleId = (0, uikit_1.useUniqId)();
28
28
  const titleId = titleIdFromProps || defaultTitleId;
29
- return (react_1.default.createElement(grid_1.Col, { className: b({ size, centered, theme }, className), reset: true, sizes: colSizes, qa: qaAttributes.container },
29
+ return (react_1.default.createElement(grid_1.Col, { className: b({ size, centered, theme, 'control-position': controlPosition }, className), reset: true, sizes: colSizes, qa: qaAttributes.container },
30
30
  title && (react_1.default.createElement(components_1.Title, { className: b('title'), title: titleProps, colSizes: { all: 12 }, id: titleId })),
31
31
  text && (react_1.default.createElement("div", { className: b('text', { ['without-title']: !hasTitle }) },
32
32
  react_1.default.createElement(components_1.YFMWrapper, { content: text, modifiers: { constructor: true, [`constructor-size-${size}`]: true }, id: textId }))),
@@ -119,6 +119,10 @@ export declare const ContentBase: {
119
119
  };
120
120
  };
121
121
  };
122
+ controlPosition: {
123
+ type: string;
124
+ enum: string[];
125
+ };
122
126
  };
123
127
  export declare const ContentBlock: {
124
128
  content: {
@@ -210,6 +214,10 @@ export declare const ContentBlock: {
210
214
  };
211
215
  };
212
216
  };
217
+ controlPosition: {
218
+ type: string;
219
+ enum: string[];
220
+ };
213
221
  };
214
222
  };
215
223
  };
@@ -50,6 +50,10 @@ exports.ContentBase = {
50
50
  enum: common_1.contentThemes,
51
51
  },
52
52
  list: (0, utils_1.filteredArray)(exports.ContentItem),
53
+ controlPosition: {
54
+ type: 'string',
55
+ enum: ['default', 'bottom'],
56
+ },
53
57
  };
54
58
  exports.ContentBlock = {
55
59
  content: {
@@ -17,7 +17,9 @@ unpredictable css rules order in build */
17
17
  border: 1px solid var(--g-color-line-generic);
18
18
  }
19
19
  .pc-image-card .pc-image-card__content {
20
+ display: flex;
20
21
  padding: 32px;
22
+ flex: auto;
21
23
  }
22
24
  .pc-image-card .pc-image-card__image_inner {
23
25
  width: 100%;
@@ -9,8 +9,10 @@ const models_1 = require("../../models");
9
9
  const utils_2 = require("../../utils");
10
10
  const Content_1 = tslib_1.__importDefault(require("../Content/Content"));
11
11
  const b = (0, utils_2.block)('image-card');
12
+ const CONTENT_COL_SIZES = { all: 12, md: 12 };
12
13
  const ImageCard = (props) => {
13
- 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;
14
+ 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;
15
+ const areControlsInFooter = controlPosition === 'footer';
14
16
  const hasContent = Boolean(text || title || buttons || links || list);
15
17
  const imageProps = (0, utils_1.getMediaImage)(image);
16
18
  const titleId = (0, uikit_1.useUniqId)();
@@ -18,7 +20,7 @@ const ImageCard = (props) => {
18
20
  react_1.default.createElement("div", { className: b('image', { margins }) },
19
21
  react_1.default.createElement(components_1.Image, Object.assign({ className: b('image_inner', { radius: enableImageBorderRadius }) }, imageProps))),
20
22
  hasContent && (react_1.default.createElement("div", { className: b('content') },
21
- 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 } })))));
23
+ 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' })))));
22
24
  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: {
23
25
  draggable: false,
24
26
  onDragStart: (e) => e.preventDefault(),
@@ -116,6 +116,10 @@ export declare const ImageCard: {
116
116
  };
117
117
  };
118
118
  } | undefined;
119
+ controlPosition: {
120
+ type: string;
121
+ enum: string[];
122
+ };
119
123
  border: {
120
124
  type: string;
121
125
  enum: string[];
@@ -6,12 +6,12 @@ const omit_1 = tslib_1.__importDefault(require("lodash/omit"));
6
6
  const common_1 = require("../../schema/validators/common");
7
7
  const components_1 = require("../../schema/validators/components");
8
8
  const schema_1 = require("../Content/schema");
9
- const ImageCardBlockContentProps = (0, omit_1.default)(schema_1.ContentBase, ['centered', 'colSizes']);
9
+ const ImageCardBlockContentProps = (0, omit_1.default)(schema_1.ContentBase, ['centered', 'colSizes', 'controlPosition']);
10
10
  exports.ImageCard = {
11
11
  'image-card': {
12
12
  additionalProperties: false,
13
13
  required: ['image'],
14
- properties: Object.assign(Object.assign(Object.assign(Object.assign({}, common_1.BaseProps), common_1.CardBase), ImageCardBlockContentProps), { image: components_1.ImageProps, direction: {
14
+ 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: {
15
15
  type: 'string',
16
16
  enum: ['direct', 'reverse'],
17
17
  }, margins: {
@@ -17,12 +17,13 @@ unpredictable css rules order in build */
17
17
  margin: 16px 0 -8px 0;
18
18
  }
19
19
  .pc-layout-item__content {
20
+ display: flex;
20
21
  flex: auto;
21
22
  margin: 16px 16px 0 0;
22
23
  }
23
24
  .pc-layout-item__content_no-media {
24
25
  margin: 0;
25
26
  }
26
- .pc-layout-item__links, .pc-layout-item__buttons {
27
- margin-top: 16px;
27
+ .pc-layout-item__wrapper {
28
+ flex: auto;
28
29
  }
@@ -1,3 +1,3 @@
1
1
  import { LayoutItemProps } from '../../models';
2
- declare const LayoutItem: ({ content: { links, buttons, ...content }, metaInfo, media, border, fullscreen, icon, className, analyticsEvents, controlPosition, }: LayoutItemProps) => JSX.Element;
2
+ declare const LayoutItem: ({ content: { links, ...content }, metaInfo, media, border, fullscreen, icon, className, analyticsEvents, controlPosition, }: LayoutItemProps) => JSX.Element;
3
3
  export default LayoutItem;
@@ -10,11 +10,11 @@ const Content_1 = tslib_1.__importDefault(require("../Content/Content"));
10
10
  const utils_2 = require("./utils");
11
11
  const b = (0, utils_1.block)('layout-item');
12
12
  const LayoutItem = (_a) => {
13
- var _b = _a.content, { links, buttons } = _b, content = tslib_1.__rest(_b, ["links", "buttons"]), { metaInfo, media, border, fullscreen, icon, className, analyticsEvents, controlPosition = 'content' } = _a;
13
+ var _b = _a.content, { links } = _b, content = tslib_1.__rest(_b, ["links"]), { metaInfo, media, border, fullscreen, icon, className, analyticsEvents, controlPosition = 'content' } = _a;
14
14
  const normalizedLinks = (0, react_1.useMemo)(() => (0, utils_2.getLayoutItemLinks)(links), [links]);
15
15
  const areControlsInFooter = controlPosition === 'footer';
16
16
  const theme = (0, theme_1.useTheme)();
17
- const contentProps = Object.assign(Object.assign(Object.assign({}, content), (areControlsInFooter ? {} : { links: normalizedLinks, buttons })), { size: 's', colSizes: { all: 12, md: 12 } });
17
+ const contentProps = Object.assign(Object.assign({ controlPosition: areControlsInFooter ? 'bottom' : 'default' }, content), { links: normalizedLinks, size: 's', colSizes: { all: 12, md: 12 } });
18
18
  const titleId = (0, uikit_1.useUniqId)();
19
19
  const renderMedia = () => {
20
20
  if (!media) {
@@ -30,9 +30,7 @@ const LayoutItem = (_a) => {
30
30
  renderMedia(),
31
31
  metaInfo && react_1.default.createElement(components_1.MetaInfo, { items: metaInfo, className: b('meta-info') }),
32
32
  react_1.default.createElement("div", { className: b('content', { 'no-media': !media }) },
33
- react_1.default.createElement(components_1.IconWrapper, { icon: icon },
34
- react_1.default.createElement(Content_1.default, Object.assign({}, contentProps, { titleId: titleId })))),
35
- areControlsInFooter && links && (react_1.default.createElement(components_1.Links, { className: b('links'), size: "s", links: links, titleId: titleId })),
36
- areControlsInFooter && buttons && (react_1.default.createElement(components_1.Buttons, { className: b('buttons'), size: "s", buttons: buttons, titleId: titleId }))));
33
+ react_1.default.createElement(components_1.IconWrapper, { icon: icon, className: b('wrapper') },
34
+ react_1.default.createElement(Content_1.default, Object.assign({}, contentProps, { titleId: titleId }))))));
37
35
  };
38
36
  exports.default = LayoutItem;
@@ -358,6 +358,10 @@ export declare const LayoutItem: {
358
358
  };
359
359
  };
360
360
  };
361
+ controlPosition: {
362
+ type: string;
363
+ enum: string[];
364
+ };
361
365
  }>;
362
366
  metaInfo: {
363
367
  type: string;
@@ -11,7 +11,7 @@ exports.LayoutItem = {
11
11
  type: 'object',
12
12
  additionalProperties: false,
13
13
  required: ['content', 'media'],
14
- 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: {
14
+ 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: {
15
15
  type: 'boolean',
16
16
  }, fullscreen: {
17
17
  type: 'boolean',
@@ -24,8 +24,5 @@ exports.LayoutItem = {
24
24
  optionName: 'list',
25
25
  },
26
26
  ],
27
- }, controlPosition: {
28
- type: 'string',
29
- enum: ['content', 'footer'],
30
27
  } }),
31
28
  };
@@ -173,6 +173,10 @@ export declare const ContentLayoutBlock: {
173
173
  };
174
174
  };
175
175
  };
176
+ controlPosition: {
177
+ type: string;
178
+ enum: string[];
179
+ };
176
180
  };
177
181
  };
178
182
  fileContent: {
@@ -164,6 +164,10 @@ export declare const FormBlock: {
164
164
  };
165
165
  };
166
166
  };
167
+ controlPosition: {
168
+ type: string;
169
+ enum: string[];
170
+ };
167
171
  }>;
168
172
  };
169
173
  direction: {
@@ -135,6 +135,10 @@ export declare const InfoBlock: {
135
135
  };
136
136
  };
137
137
  };
138
+ controlPosition: {
139
+ type: string;
140
+ enum: string[];
141
+ };
138
142
  }>;
139
143
  };
140
144
  rightContent: {
@@ -222,6 +226,10 @@ export declare const InfoBlock: {
222
226
  };
223
227
  };
224
228
  };
229
+ controlPosition: {
230
+ type: string;
231
+ enum: string[];
232
+ };
225
233
  }>;
226
234
  };
227
235
  type: {};
@@ -368,6 +368,10 @@ export declare const MapBlock: {
368
368
  };
369
369
  };
370
370
  };
371
+ controlPosition: {
372
+ type: string;
373
+ enum: string[];
374
+ };
371
375
  animated: {
372
376
  type: string;
373
377
  };