@gravity-ui/page-constructor 4.50.0 → 4.51.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 (15) hide show
  1. package/build/cjs/models/constructor-items/blocks.d.ts +2 -2
  2. package/build/cjs/models/constructor-items/common.d.ts +1 -0
  3. package/build/cjs/models/constructor-items/sub-blocks.d.ts +3 -2
  4. package/build/cjs/sub-blocks/BannerCard/BannerCard.css +3 -0
  5. package/build/cjs/sub-blocks/BannerCard/BannerCard.js +3 -3
  6. package/build/esm/models/constructor-items/blocks.d.ts +2 -2
  7. package/build/esm/models/constructor-items/common.d.ts +1 -0
  8. package/build/esm/models/constructor-items/sub-blocks.d.ts +3 -2
  9. package/build/esm/sub-blocks/BannerCard/BannerCard.css +3 -0
  10. package/build/esm/sub-blocks/BannerCard/BannerCard.js +3 -3
  11. package/package.json +1 -1
  12. package/server/models/constructor-items/blocks.d.ts +2 -2
  13. package/server/models/constructor-items/common.d.ts +1 -0
  14. package/server/models/constructor-items/sub-blocks.d.ts +3 -2
  15. package/widget/index.js +1 -1
package/build/cjs/models/constructor-items/blocks.d.ts CHANGED
@@ -3,7 +3,7 @@ import { ButtonSize } from '@gravity-ui/uikit';
3
3
  import { GridColumnSize, GridColumnSizesType, IndentValue } from '../../grid/types';
4
4
  import { ThemeSupporting } from '../../utils';
5
5
  import { AnalyticsEventsBase } from '../common';
6
- import { AnchorProps, Animatable, BackgroundImageProps, ButtonProps, CardBorder, ContentSize, ContentTextSize, ContentTheme, FileLinkProps, HeaderBreadCrumbsProps, HeaderImageSize, HeaderOffset, HeaderWidth, ImageDeviceProps, ImageProps, Justify, LegendTableMarkerType, LinkProps, MapProps, MediaDirection, MediaProps, TextSize, TextTheme, ThemedImage, ThemedMediaProps, ThemedMediaVideoProps, TitleItemBaseProps, TitleItemProps, WithBorder, YandexFormProps } from './common';
6
+ import { AnchorProps, Animatable, BackgroundImageProps, ButtonProps, CardBorder, ContentSize, ContentTextSize, ContentTheme, FileLinkProps, HeaderBreadCrumbsProps, HeaderImageSize, HeaderOffset, HeaderWidth, ImageDeviceProps, ImageProps, Justify, LegendTableMarkerType, LinkProps, MapProps, MediaDirection, MediaProps, MediaView, TextSize, TextTheme, ThemedImage, ThemedMediaProps, ThemedMediaVideoProps, TitleItemBaseProps, TitleItemProps, WithBorder, YandexFormProps } from './common';
7
7
  import { BannerCardProps, HubspotFormProps, SubBlock, SubBlockModels } from './sub-blocks';
8
8
  export declare enum BlockType {
9
9
  PromoFeaturesBlock = "promo-features-block",
@@ -108,7 +108,7 @@ export interface HeaderBlockProps {
108
108
  offset?: HeaderOffset;
109
109
  image?: ThemedImage;
110
110
  video?: ThemedMediaVideoProps;
111
- mediaView?: 'fit' | 'full';
111
+ mediaView?: MediaView;
112
112
  background?: ThemedHeaderBlockBackground;
113
113
  theme?: 'light' | 'dark';
114
114
  verticalOffset?: '0' | 's' | 'm' | 'l' | 'xl';
package/build/cjs/models/constructor-items/common.d.ts CHANGED
@@ -293,6 +293,7 @@ export interface TitleItemBaseProps {
293
293
  custom?: string | ReactNode;
294
294
  onClick?: () => void;
295
295
  }
296
+ export type MediaView = 'fit' | 'full';
296
297
  export type MediaBorder = 'shadow' | 'line' | 'none';
297
298
  export type CardBorder = MediaBorder;
298
299
  export interface CardBaseProps {
package/build/cjs/models/constructor-items/sub-blocks.d.ts CHANGED
@@ -3,7 +3,7 @@ import { ThemeSupporting } from '../../utils';
3
3
  import { HubspotEventData, HubspotEventHandlers } from '../../utils/hubspot';
4
4
  import { AnalyticsEventsBase, PixelEvent } from '../common';
5
5
  import { ContentBlockProps } from './blocks';
6
- import { AuthorItem, ButtonPixel, ButtonProps, CardBaseProps, ContentTheme, DividerSize, ImageObjectProps, ImageProps, LinkProps, MediaProps, PriceDetailedProps, TextTheme, Themable, ThemedImage } from './common';
6
+ import { AuthorItem, ButtonPixel, ButtonProps, CardBaseProps, ContentTheme, DividerSize, ImageObjectProps, ImageProps, LinkProps, MediaProps, MediaView, PriceDetailedProps, TextTheme, Themable, ThemedImage } from './common';
7
7
  export declare enum SubBlockType {
8
8
  Divider = "divider",
9
9
  Quote = "quote",
@@ -113,7 +113,8 @@ export interface BannerCardProps {
113
113
  disableCompress?: boolean;
114
114
  color?: ThemeSupporting<string>;
115
115
  theme?: TextTheme;
116
- button: Pick<ButtonProps, 'text' | 'url' | 'target'>;
116
+ button: Pick<ButtonProps, 'text' | 'url' | 'target' | 'theme'>;
117
+ mediaView?: MediaView;
117
118
  }
118
119
  export interface MediaCardProps extends MediaProps, AnalyticsEventsBase, CardBaseProps {
119
120
  }
package/build/cjs/sub-blocks/BannerCard/BannerCard.css CHANGED
@@ -87,6 +87,9 @@ unpredictable css rules order in build */
87
87
  object-fit: cover;
88
88
  object-position: left;
89
89
  }
90
+ .pc-banner-card_media-view_fit .pc-banner-card__image img {
91
+ object-fit: contain;
92
+ }
90
93
  @media (max-width: 576px) {
91
94
  .pc-banner-card__image {
92
95
  display: none;
package/build/cjs/sub-blocks/BannerCard/BannerCard.js CHANGED
@@ -8,13 +8,13 @@ const theme_1 = require("../../context/theme");
8
8
  const utils_1 = require("../../utils");
9
9
  const b = (0, utils_1.block)('banner-card');
10
10
  const BannerCard = (props) => {
11
- const { title, subtitle, button: { url, text, target }, color, theme: textTheme = 'light', image, disableCompress, } = props;
11
+ const { title, subtitle, button: { url, text, target, theme: buttonTheme = 'raised' }, color, theme: textTheme = 'light', image, disableCompress, mediaView = 'full', } = props;
12
12
  const theme = (0, theme_1.useTheme)();
13
13
  const contentStyle = {};
14
14
  if (color) {
15
15
  contentStyle.backgroundColor = (0, utils_1.getThemedValue)(color, theme);
16
16
  }
17
- return (react_1.default.createElement("div", { className: b({ theme: textTheme }) },
17
+ return (react_1.default.createElement("div", { className: b({ theme: textTheme, ['media-view']: mediaView }) },
18
18
  react_1.default.createElement("div", { className: b('content'), style: contentStyle },
19
19
  react_1.default.createElement("div", { className: b('info') },
20
20
  react_1.default.createElement("div", { className: b('text') },
@@ -22,7 +22,7 @@ const BannerCard = (props) => {
22
22
  react_1.default.createElement(components_1.HTML, null, title)),
23
23
  subtitle && (react_1.default.createElement(components_1.YFMWrapper, { className: b('subtitle'), content: subtitle, modifiers: { constructor: true } }))),
24
24
  react_1.default.createElement(components_1.RouterLink, { href: url },
25
- react_1.default.createElement(components_1.Button, { className: b('button'), theme: "raised", size: "xl", text: text, url: url, target: target }))),
25
+ react_1.default.createElement(components_1.Button, { className: b('button'), theme: buttonTheme, size: "xl", text: text, url: url, target: target }))),
26
26
  react_1.default.createElement(components_1.BackgroundImage, { className: b('image'), src: (0, utils_1.getThemedValue)(image, theme), disableCompress: disableCompress }))));
27
27
  };
28
28
  exports.BannerCard = BannerCard;
package/build/esm/models/constructor-items/blocks.d.ts CHANGED
@@ -3,7 +3,7 @@ import { ButtonSize } from '@gravity-ui/uikit';
3
3
  import { GridColumnSize, GridColumnSizesType, IndentValue } from '../../grid/types';
4
4
  import { ThemeSupporting } from '../../utils';
5
5
  import { AnalyticsEventsBase } from '../common';
6
- import { AnchorProps, Animatable, BackgroundImageProps, ButtonProps, CardBorder, ContentSize, ContentTextSize, ContentTheme, FileLinkProps, HeaderBreadCrumbsProps, HeaderImageSize, HeaderOffset, HeaderWidth, ImageDeviceProps, ImageProps, Justify, LegendTableMarkerType, LinkProps, MapProps, MediaDirection, MediaProps, TextSize, TextTheme, ThemedImage, ThemedMediaProps, ThemedMediaVideoProps, TitleItemBaseProps, TitleItemProps, WithBorder, YandexFormProps } from './common';
6
+ import { AnchorProps, Animatable, BackgroundImageProps, ButtonProps, CardBorder, ContentSize, ContentTextSize, ContentTheme, FileLinkProps, HeaderBreadCrumbsProps, HeaderImageSize, HeaderOffset, HeaderWidth, ImageDeviceProps, ImageProps, Justify, LegendTableMarkerType, LinkProps, MapProps, MediaDirection, MediaProps, MediaView, TextSize, TextTheme, ThemedImage, ThemedMediaProps, ThemedMediaVideoProps, TitleItemBaseProps, TitleItemProps, WithBorder, YandexFormProps } from './common';
7
7
  import { BannerCardProps, HubspotFormProps, SubBlock, SubBlockModels } from './sub-blocks';
8
8
  export declare enum BlockType {
9
9
  PromoFeaturesBlock = "promo-features-block",
@@ -108,7 +108,7 @@ export interface HeaderBlockProps {
108
108
  offset?: HeaderOffset;
109
109
  image?: ThemedImage;
110
110
  video?: ThemedMediaVideoProps;
111
- mediaView?: 'fit' | 'full';
111
+ mediaView?: MediaView;
112
112
  background?: ThemedHeaderBlockBackground;
113
113
  theme?: 'light' | 'dark';
114
114
  verticalOffset?: '0' | 's' | 'm' | 'l' | 'xl';
package/build/esm/models/constructor-items/common.d.ts CHANGED
@@ -293,6 +293,7 @@ export interface TitleItemBaseProps {
293
293
  custom?: string | ReactNode;
294
294
  onClick?: () => void;
295
295
  }
296
+ export type MediaView = 'fit' | 'full';
296
297
  export type MediaBorder = 'shadow' | 'line' | 'none';
297
298
  export type CardBorder = MediaBorder;
298
299
  export interface CardBaseProps {
package/build/esm/models/constructor-items/sub-blocks.d.ts CHANGED
@@ -3,7 +3,7 @@ import { ThemeSupporting } from '../../utils';
3
3
  import { HubspotEventData, HubspotEventHandlers } from '../../utils/hubspot';
4
4
  import { AnalyticsEventsBase, PixelEvent } from '../common';
5
5
  import { ContentBlockProps } from './blocks';
6
- import { AuthorItem, ButtonPixel, ButtonProps, CardBaseProps, ContentTheme, DividerSize, ImageObjectProps, ImageProps, LinkProps, MediaProps, PriceDetailedProps, TextTheme, Themable, ThemedImage } from './common';
6
+ import { AuthorItem, ButtonPixel, ButtonProps, CardBaseProps, ContentTheme, DividerSize, ImageObjectProps, ImageProps, LinkProps, MediaProps, MediaView, PriceDetailedProps, TextTheme, Themable, ThemedImage } from './common';
7
7
  export declare enum SubBlockType {
8
8
  Divider = "divider",
9
9
  Quote = "quote",
@@ -113,7 +113,8 @@ export interface BannerCardProps {
113
113
  disableCompress?: boolean;
114
114
  color?: ThemeSupporting<string>;
115
115
  theme?: TextTheme;
116
- button: Pick<ButtonProps, 'text' | 'url' | 'target'>;
116
+ button: Pick<ButtonProps, 'text' | 'url' | 'target' | 'theme'>;
117
+ mediaView?: MediaView;
117
118
  }
118
119
  export interface MediaCardProps extends MediaProps, AnalyticsEventsBase, CardBaseProps {
119
120
  }
package/build/esm/sub-blocks/BannerCard/BannerCard.css CHANGED
@@ -87,6 +87,9 @@ unpredictable css rules order in build */
87
87
  object-fit: cover;
88
88
  object-position: left;
89
89
  }
90
+ .pc-banner-card_media-view_fit .pc-banner-card__image img {
91
+ object-fit: contain;
92
+ }
90
93
  @media (max-width: 576px) {
91
94
  .pc-banner-card__image {
92
95
  display: none;
package/build/esm/sub-blocks/BannerCard/BannerCard.js CHANGED
@@ -5,13 +5,13 @@ import { block, getThemedValue } from '../../utils';
5
5
  import './BannerCard.css';
6
6
  const b = block('banner-card');
7
7
  export const BannerCard = (props) => {
8
- const { title, subtitle, button: { url, text, target }, color, theme: textTheme = 'light', image, disableCompress, } = props;
8
+ const { title, subtitle, button: { url, text, target, theme: buttonTheme = 'raised' }, color, theme: textTheme = 'light', image, disableCompress, mediaView = 'full', } = props;
9
9
  const theme = useTheme();
10
10
  const contentStyle = {};
11
11
  if (color) {
12
12
  contentStyle.backgroundColor = getThemedValue(color, theme);
13
13
  }
14
- return (React.createElement("div", { className: b({ theme: textTheme }) },
14
+ return (React.createElement("div", { className: b({ theme: textTheme, ['media-view']: mediaView }) },
15
15
  React.createElement("div", { className: b('content'), style: contentStyle },
16
16
  React.createElement("div", { className: b('info') },
17
17
  React.createElement("div", { className: b('text') },
@@ -19,7 +19,7 @@ export const BannerCard = (props) => {
19
19
  React.createElement(HTML, null, title)),
20
20
  subtitle && (React.createElement(YFMWrapper, { className: b('subtitle'), content: subtitle, modifiers: { constructor: true } }))),
21
21
  React.createElement(RouterLink, { href: url },
22
- React.createElement(Button, { className: b('button'), theme: "raised", size: "xl", text: text, url: url, target: target }))),
22
+ React.createElement(Button, { className: b('button'), theme: buttonTheme, size: "xl", text: text, url: url, target: target }))),
23
23
  React.createElement(BackgroundImage, { className: b('image'), src: getThemedValue(image, theme), disableCompress: disableCompress }))));
24
24
  };
25
25
  export default BannerCard;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gravity-ui/page-constructor",
3
- "version": "4.50.0",
3
+ "version": "4.51.0",
4
4
  "description": "Gravity UI Page Constructor",
5
5
  "license": "MIT",
6
6
  "repository": {
package/server/models/constructor-items/blocks.d.ts CHANGED
@@ -3,7 +3,7 @@ import { ButtonSize } from '@gravity-ui/uikit';
3
3
  import { GridColumnSize, GridColumnSizesType, IndentValue } from '../../grid/types';
4
4
  import { ThemeSupporting } from '../../utils';
5
5
  import { AnalyticsEventsBase } from '../common';
6
- import { AnchorProps, Animatable, BackgroundImageProps, ButtonProps, CardBorder, ContentSize, ContentTextSize, ContentTheme, FileLinkProps, HeaderBreadCrumbsProps, HeaderImageSize, HeaderOffset, HeaderWidth, ImageDeviceProps, ImageProps, Justify, LegendTableMarkerType, LinkProps, MapProps, MediaDirection, MediaProps, TextSize, TextTheme, ThemedImage, ThemedMediaProps, ThemedMediaVideoProps, TitleItemBaseProps, TitleItemProps, WithBorder, YandexFormProps } from './common';
6
+ import { AnchorProps, Animatable, BackgroundImageProps, ButtonProps, CardBorder, ContentSize, ContentTextSize, ContentTheme, FileLinkProps, HeaderBreadCrumbsProps, HeaderImageSize, HeaderOffset, HeaderWidth, ImageDeviceProps, ImageProps, Justify, LegendTableMarkerType, LinkProps, MapProps, MediaDirection, MediaProps, MediaView, TextSize, TextTheme, ThemedImage, ThemedMediaProps, ThemedMediaVideoProps, TitleItemBaseProps, TitleItemProps, WithBorder, YandexFormProps } from './common';
7
7
  import { BannerCardProps, HubspotFormProps, SubBlock, SubBlockModels } from './sub-blocks';
8
8
  export declare enum BlockType {
9
9
  PromoFeaturesBlock = "promo-features-block",
@@ -108,7 +108,7 @@ export interface HeaderBlockProps {
108
108
  offset?: HeaderOffset;
109
109
  image?: ThemedImage;
110
110
  video?: ThemedMediaVideoProps;
111
- mediaView?: 'fit' | 'full';
111
+ mediaView?: MediaView;
112
112
  background?: ThemedHeaderBlockBackground;
113
113
  theme?: 'light' | 'dark';
114
114
  verticalOffset?: '0' | 's' | 'm' | 'l' | 'xl';
package/server/models/constructor-items/common.d.ts CHANGED
@@ -293,6 +293,7 @@ export interface TitleItemBaseProps {
293
293
  custom?: string | ReactNode;
294
294
  onClick?: () => void;
295
295
  }
296
+ export type MediaView = 'fit' | 'full';
296
297
  export type MediaBorder = 'shadow' | 'line' | 'none';
297
298
  export type CardBorder = MediaBorder;
298
299
  export interface CardBaseProps {
package/server/models/constructor-items/sub-blocks.d.ts CHANGED
@@ -3,7 +3,7 @@ import { ThemeSupporting } from '../../utils';
3
3
  import { HubspotEventData, HubspotEventHandlers } from '../../utils/hubspot';
4
4
  import { AnalyticsEventsBase, PixelEvent } from '../common';
5
5
  import { ContentBlockProps } from './blocks';
6
- import { AuthorItem, ButtonPixel, ButtonProps, CardBaseProps, ContentTheme, DividerSize, ImageObjectProps, ImageProps, LinkProps, MediaProps, PriceDetailedProps, TextTheme, Themable, ThemedImage } from './common';
6
+ import { AuthorItem, ButtonPixel, ButtonProps, CardBaseProps, ContentTheme, DividerSize, ImageObjectProps, ImageProps, LinkProps, MediaProps, MediaView, PriceDetailedProps, TextTheme, Themable, ThemedImage } from './common';
7
7
  export declare enum SubBlockType {
8
8
  Divider = "divider",
9
9
  Quote = "quote",
@@ -113,7 +113,8 @@ export interface BannerCardProps {
113
113
  disableCompress?: boolean;
114
114
  color?: ThemeSupporting<string>;
115
115
  theme?: TextTheme;
116
- button: Pick<ButtonProps, 'text' | 'url' | 'target'>;
116
+ button: Pick<ButtonProps, 'text' | 'url' | 'target' | 'theme'>;
117
+ mediaView?: MediaView;
117
118
  }
118
119
  export interface MediaCardProps extends MediaProps, AnalyticsEventsBase, CardBaseProps {
119
120
  }