@doyourjob/gravity-ui-page-constructor 5.31.259 → 5.31.261

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.
@@ -204,6 +204,20 @@ unpredictable css rules order in build */
204
204
  width: 100%;
205
205
  object-fit: cover;
206
206
  }
207
+ .pc-header-block__background.pc-header-block__background_unicorn, .pc-header-block__background.pc-header-block__background_media.pc-header-block__background_unicorn {
208
+ z-index: 5;
209
+ }
210
+ @media (max-width: 769px) {
211
+ .pc-header-block_has-background .pc-header-block__background.pc-header-block__background_unicorn, .pc-header-block_has-background .pc-header-block__background.pc-header-block__background_media.pc-header-block__background_unicorn {
212
+ display: none;
213
+ }
214
+ }
215
+ .pc-header-block_full-width .pc-header-block__background.pc-header-block__background_unicorn, .pc-header-block_full-width .pc-header-block__background.pc-header-block__background_media.pc-header-block__background_unicorn {
216
+ width: 100%;
217
+ left: 0;
218
+ transform: none;
219
+ max-width: none;
220
+ }
207
221
  .pc-header-block__background_full-width {
208
222
  left: 0;
209
223
  transform: none;
@@ -30,7 +30,7 @@ const Background = ({ background, isMobile }) => {
30
30
  const FullWidthBackground = ({ background }) => (react_1.default.createElement("div", { className: b('background', { ['full-width']: true }), style: { backgroundColor: background === null || background === void 0 ? void 0 : background.color } }));
31
31
  // eslint-disable-next-line complexity
32
32
  const HeaderBlock = (props) => {
33
- const { title, switchingTitle, topTags, bottomTags, overtitle, description, buttons, stock, stockPrice, stockShares, image, video, width = 's', imageSize, offset = 'default', background, theme: textTheme = 'light', verticalOffset = 'm', verticalOffsetTop, verticalOffsetBottom, className, breadcrumbs, status, renderTitle, children, mediaView = 'full', backgroundEffect, headerSpace, backLink, } = props;
33
+ const { title, switchingTitle, topTags, bottomTags, overtitle, description, buttons, stock, stockPrice, stockShares, image, video, width = 's', imageSize, offset = 'default', background, theme: textTheme = 'light', verticalOffset = 'm', verticalOffsetTop, verticalOffsetBottom, className, breadcrumbs, status, renderTitle, children, mediaView = 'full', backgroundEffect, headerSpace, backLink, unicorn, unicornSdkUrl, } = props;
34
34
  const isMobile = (0, react_1.useContext)(mobileContext_1.MobileContext);
35
35
  const { backButton, blockTag } = (0, react_1.useContext)(headerContext_1.HeaderContext);
36
36
  const theme = (0, theme_1.useTheme)();
@@ -44,6 +44,7 @@ const HeaderBlock = (props) => {
44
44
  const fullWidth = (backgroundThemed === null || backgroundThemed === void 0 ? void 0 : backgroundThemed.fullWidth) || (backgroundThemed === null || backgroundThemed === void 0 ? void 0 : backgroundThemed.fullWidthMedia);
45
45
  const titleId = (0, uikit_1.useUniqId)();
46
46
  const headerRef = (0, react_1.useRef)(null);
47
+ const hasBackground = Boolean(backgroundThemed || backgroundEffect);
47
48
  const backButtonItem = (0, react_1.useMemo)(() => {
48
49
  if (backLink) {
49
50
  return { link: backLink.url, text: backLink.title };
@@ -55,6 +56,7 @@ const HeaderBlock = (props) => {
55
56
  }, [backButton, backLink, breadcrumbs, verticalOffset]);
56
57
  return (react_1.default.createElement("header", { ref: headerRef, className: b({
57
58
  ['has-media']: hasRightSideImage,
59
+ ['has-background']: hasBackground,
58
60
  ['full-width']: fullWidth,
59
61
  ['media-view']: mediaView,
60
62
  ['controls-view']: textTheme,
@@ -63,6 +65,8 @@ const HeaderBlock = (props) => {
63
65
  backgroundThemed && fullWidth && react_1.default.createElement(FullWidthBackground, { background: backgroundThemed }),
64
66
  backgroundThemed && react_1.default.createElement(Background, { background: backgroundThemed, isMobile: isMobile }),
65
67
  backgroundEffect && backgroundEffect.firstSrc && backgroundEffect.secondSrc && (react_1.default.createElement(components_1.BackgroundEffect, Object.assign({}, backgroundEffect, { attachRef: headerRef }))),
68
+ unicorn && (react_1.default.createElement("div", { className: b('background', { unicorn: true }) },
69
+ react_1.default.createElement(components_1.UnicornScene, { jsonFilePath: unicorn, sdkUrl: unicornSdkUrl }))),
66
70
  react_1.default.createElement(grid_1.Grid, { containerClass: b('container-fluid') },
67
71
  react_1.default.createElement(Breadcrumbs_1.default, { breadcrumbs: breadcrumbs, theme: textTheme }),
68
72
  react_1.default.createElement(BackButton_1.default, { backButton: backButtonItem, theme: textTheme }),
@@ -920,6 +920,12 @@ export declare const HeaderProperties: {
920
920
  type: string;
921
921
  enum: string[];
922
922
  };
923
+ unicorn: {
924
+ type: string;
925
+ };
926
+ unicornSdkUrl: {
927
+ type: string;
928
+ };
923
929
  breadcrumbs: {
924
930
  type: string;
925
931
  additionalProperties: boolean;
@@ -1632,6 +1638,12 @@ export declare const HeaderBlock: {
1632
1638
  type: string;
1633
1639
  enum: string[];
1634
1640
  };
1641
+ unicorn: {
1642
+ type: string;
1643
+ };
1644
+ unicornSdkUrl: {
1645
+ type: string;
1646
+ };
1635
1647
  breadcrumbs: {
1636
1648
  type: string;
1637
1649
  additionalProperties: boolean;
@@ -140,6 +140,8 @@ exports.HeaderProperties = {
140
140
  type: 'string',
141
141
  enum: ['default', 'dark'],
142
142
  },
143
+ unicorn: { type: 'string' },
144
+ unicornSdkUrl: { type: 'string' },
143
145
  breadcrumbs: {
144
146
  type: 'object',
145
147
  additionalProperties: false,
@@ -611,6 +611,12 @@ export declare const HeaderSliderBlock: {
611
611
  type: string;
612
612
  enum: string[];
613
613
  };
614
+ unicorn: {
615
+ type: string;
616
+ };
617
+ unicornSdkUrl: {
618
+ type: string;
619
+ };
614
620
  breadcrumbs: {
615
621
  type: string;
616
622
  additionalProperties: boolean;
@@ -226,6 +226,8 @@ export interface HeaderBlockProps {
226
226
  mediaView?: MediaView;
227
227
  background?: ThemedHeaderBlockBackground;
228
228
  theme?: 'light' | 'dark';
229
+ unicorn?: string;
230
+ unicornSdkUrl?: string;
229
231
  verticalOffset?: '0' | 's' | 'm' | 'l' | 'xl';
230
232
  verticalOffsetTop?: 's' | 'm' | 'l' | 'xl';
231
233
  verticalOffsetBottom?: 's' | 'm' | 'l' | 'xl';
@@ -72,6 +72,7 @@ unpredictable css rules order in build */
72
72
  .pc-mini-case-card__title {
73
73
  font-size: var(--g-text-display-3-font-size, var(--pc-text-display-3-font-size));
74
74
  line-height: var(--g-text-display-3-line-height, var(--pc-text-display-3-line-height));
75
+ margin: 0;
75
76
  font-weight: var(--g-text-accent-font-weight);
76
77
  }
77
78
  @media (max-width: 769px) {
@@ -110,6 +111,14 @@ unpredictable css rules order in build */
110
111
  min-width: 100%;
111
112
  }
112
113
  }
114
+ .pc-mini-case-card__inner-container {
115
+ min-height: 80px;
116
+ display: flex;
117
+ flex-direction: column;
118
+ justify-content: center;
119
+ align-items: center;
120
+ text-align: center;
121
+ }
113
122
  .pc-mini-case-card__value {
114
123
  font-size: 40px;
115
124
  line-height: 48px;
@@ -33,7 +33,7 @@ const MiniCaseCardHead = ({ title, shouldShowStory, showQuote, text, quote, avat
33
33
  return null;
34
34
  }
35
35
  return (react_1.default.createElement("div", { className: b('head') },
36
- title && (react_1.default.createElement("div", { className: b('title') },
36
+ title && (react_1.default.createElement("h2", { className: `${b('title')} title-font-family` },
37
37
  react_1.default.createElement(components_1.HTML, null, title))),
38
38
  shouldShowStory && react_1.default.createElement(components_1.HTML, { className: b('text') }, text),
39
39
  showQuote && quote && react_1.default.createElement(components_1.HTML, { className: b('quote') }, quote),
@@ -49,7 +49,8 @@ const MiniCaseCard = ({ title, showStory = true, showQuote = true, text, quote,
49
49
  react_1.default.createElement(MiniCaseCardHead, { title: title, shouldShowStory: shouldShowStory, showQuote: showQuote, text: text, quote: quote, avatar: avatar, author: author, position: position })),
50
50
  react_1.default.createElement(MiniCaseCardTags, { tagUsecase: tagUsecase, tagIndustry: tagIndustry })),
51
51
  react_1.default.createElement("div", { className: b('rhs') }, data === null || data === void 0 ? void 0 : data.map((item, index) => (react_1.default.createElement("div", { key: index, className: b('box'), style: backgroundData ? { background: backgroundData } : undefined },
52
- react_1.default.createElement("div", { className: `${b('value')} title-font-family` }, item.value),
53
- react_1.default.createElement("div", { className: b('label') }, item.label)))))));
52
+ react_1.default.createElement("div", { className: b('inner-container') },
53
+ react_1.default.createElement("div", { className: `${b('value')} title-font-family` }, item.value),
54
+ react_1.default.createElement("div", { className: b('label') }, item.label))))))));
54
55
  };
55
56
  exports.default = MiniCaseCard;
@@ -204,6 +204,20 @@ unpredictable css rules order in build */
204
204
  width: 100%;
205
205
  object-fit: cover;
206
206
  }
207
+ .pc-header-block__background.pc-header-block__background_unicorn, .pc-header-block__background.pc-header-block__background_media.pc-header-block__background_unicorn {
208
+ z-index: 5;
209
+ }
210
+ @media (max-width: 769px) {
211
+ .pc-header-block_has-background .pc-header-block__background.pc-header-block__background_unicorn, .pc-header-block_has-background .pc-header-block__background.pc-header-block__background_media.pc-header-block__background_unicorn {
212
+ display: none;
213
+ }
214
+ }
215
+ .pc-header-block_full-width .pc-header-block__background.pc-header-block__background_unicorn, .pc-header-block_full-width .pc-header-block__background.pc-header-block__background_media.pc-header-block__background_unicorn {
216
+ width: 100%;
217
+ left: 0;
218
+ transform: none;
219
+ max-width: none;
220
+ }
207
221
  .pc-header-block__background_full-width {
208
222
  left: 0;
209
223
  transform: none;
@@ -1,6 +1,6 @@
1
1
  import React, { useContext, useMemo, useRef } from 'react';
2
2
  import { useUniqId } from '@gravity-ui/uikit';
3
- import { BackgroundEffect, HTML, Media } from '../../components';
3
+ import { BackgroundEffect, HTML, Media, UnicornScene } from '../../components';
4
4
  import { getMediaImage } from '../../components/Media/Image/utils';
5
5
  import { HeaderContext } from '../../context/headerContext';
6
6
  import { MobileContext } from '../../context/mobileContext';
@@ -27,7 +27,7 @@ const Background = ({ background, isMobile }) => {
27
27
  const FullWidthBackground = ({ background }) => (React.createElement("div", { className: b('background', { ['full-width']: true }), style: { backgroundColor: background === null || background === void 0 ? void 0 : background.color } }));
28
28
  // eslint-disable-next-line complexity
29
29
  export const HeaderBlock = (props) => {
30
- const { title, switchingTitle, topTags, bottomTags, overtitle, description, buttons, stock, stockPrice, stockShares, image, video, width = 's', imageSize, offset = 'default', background, theme: textTheme = 'light', verticalOffset = 'm', verticalOffsetTop, verticalOffsetBottom, className, breadcrumbs, status, renderTitle, children, mediaView = 'full', backgroundEffect, headerSpace, backLink, } = props;
30
+ const { title, switchingTitle, topTags, bottomTags, overtitle, description, buttons, stock, stockPrice, stockShares, image, video, width = 's', imageSize, offset = 'default', background, theme: textTheme = 'light', verticalOffset = 'm', verticalOffsetTop, verticalOffsetBottom, className, breadcrumbs, status, renderTitle, children, mediaView = 'full', backgroundEffect, headerSpace, backLink, unicorn, unicornSdkUrl, } = props;
31
31
  const isMobile = useContext(MobileContext);
32
32
  const { backButton, blockTag } = useContext(HeaderContext);
33
33
  const theme = useTheme();
@@ -41,6 +41,7 @@ export const HeaderBlock = (props) => {
41
41
  const fullWidth = (backgroundThemed === null || backgroundThemed === void 0 ? void 0 : backgroundThemed.fullWidth) || (backgroundThemed === null || backgroundThemed === void 0 ? void 0 : backgroundThemed.fullWidthMedia);
42
42
  const titleId = useUniqId();
43
43
  const headerRef = useRef(null);
44
+ const hasBackground = Boolean(backgroundThemed || backgroundEffect);
44
45
  const backButtonItem = useMemo(() => {
45
46
  if (backLink) {
46
47
  return { link: backLink.url, text: backLink.title };
@@ -52,6 +53,7 @@ export const HeaderBlock = (props) => {
52
53
  }, [backButton, backLink, breadcrumbs, verticalOffset]);
53
54
  return (React.createElement("header", { ref: headerRef, className: b({
54
55
  ['has-media']: hasRightSideImage,
56
+ ['has-background']: hasBackground,
55
57
  ['full-width']: fullWidth,
56
58
  ['media-view']: mediaView,
57
59
  ['controls-view']: textTheme,
@@ -60,6 +62,8 @@ export const HeaderBlock = (props) => {
60
62
  backgroundThemed && fullWidth && React.createElement(FullWidthBackground, { background: backgroundThemed }),
61
63
  backgroundThemed && React.createElement(Background, { background: backgroundThemed, isMobile: isMobile }),
62
64
  backgroundEffect && backgroundEffect.firstSrc && backgroundEffect.secondSrc && (React.createElement(BackgroundEffect, Object.assign({}, backgroundEffect, { attachRef: headerRef }))),
65
+ unicorn && (React.createElement("div", { className: b('background', { unicorn: true }) },
66
+ React.createElement(UnicornScene, { jsonFilePath: unicorn, sdkUrl: unicornSdkUrl }))),
63
67
  React.createElement(Grid, { containerClass: b('container-fluid') },
64
68
  React.createElement(Breadcrumbs, { breadcrumbs: breadcrumbs, theme: textTheme }),
65
69
  React.createElement(BackButton, { backButton: backButtonItem, theme: textTheme }),
@@ -920,6 +920,12 @@ export declare const HeaderProperties: {
920
920
  type: string;
921
921
  enum: string[];
922
922
  };
923
+ unicorn: {
924
+ type: string;
925
+ };
926
+ unicornSdkUrl: {
927
+ type: string;
928
+ };
923
929
  breadcrumbs: {
924
930
  type: string;
925
931
  additionalProperties: boolean;
@@ -1632,6 +1638,12 @@ export declare const HeaderBlock: {
1632
1638
  type: string;
1633
1639
  enum: string[];
1634
1640
  };
1641
+ unicorn: {
1642
+ type: string;
1643
+ };
1644
+ unicornSdkUrl: {
1645
+ type: string;
1646
+ };
1635
1647
  breadcrumbs: {
1636
1648
  type: string;
1637
1649
  additionalProperties: boolean;
@@ -137,6 +137,8 @@ export const HeaderProperties = {
137
137
  type: 'string',
138
138
  enum: ['default', 'dark'],
139
139
  },
140
+ unicorn: { type: 'string' },
141
+ unicornSdkUrl: { type: 'string' },
140
142
  breadcrumbs: {
141
143
  type: 'object',
142
144
  additionalProperties: false,
@@ -611,6 +611,12 @@ export declare const HeaderSliderBlock: {
611
611
  type: string;
612
612
  enum: string[];
613
613
  };
614
+ unicorn: {
615
+ type: string;
616
+ };
617
+ unicornSdkUrl: {
618
+ type: string;
619
+ };
614
620
  breadcrumbs: {
615
621
  type: string;
616
622
  additionalProperties: boolean;
@@ -226,6 +226,8 @@ export interface HeaderBlockProps {
226
226
  mediaView?: MediaView;
227
227
  background?: ThemedHeaderBlockBackground;
228
228
  theme?: 'light' | 'dark';
229
+ unicorn?: string;
230
+ unicornSdkUrl?: string;
229
231
  verticalOffset?: '0' | 's' | 'm' | 'l' | 'xl';
230
232
  verticalOffsetTop?: 's' | 'm' | 'l' | 'xl';
231
233
  verticalOffsetBottom?: 's' | 'm' | 'l' | 'xl';
@@ -72,6 +72,7 @@ unpredictable css rules order in build */
72
72
  .pc-mini-case-card__title {
73
73
  font-size: var(--g-text-display-3-font-size, var(--pc-text-display-3-font-size));
74
74
  line-height: var(--g-text-display-3-line-height, var(--pc-text-display-3-line-height));
75
+ margin: 0;
75
76
  font-weight: var(--g-text-accent-font-weight);
76
77
  }
77
78
  @media (max-width: 769px) {
@@ -110,6 +111,14 @@ unpredictable css rules order in build */
110
111
  min-width: 100%;
111
112
  }
112
113
  }
114
+ .pc-mini-case-card__inner-container {
115
+ min-height: 80px;
116
+ display: flex;
117
+ flex-direction: column;
118
+ justify-content: center;
119
+ align-items: center;
120
+ text-align: center;
121
+ }
113
122
  .pc-mini-case-card__value {
114
123
  font-size: 40px;
115
124
  line-height: 48px;
@@ -31,7 +31,7 @@ const MiniCaseCardHead = ({ title, shouldShowStory, showQuote, text, quote, avat
31
31
  return null;
32
32
  }
33
33
  return (React.createElement("div", { className: b('head') },
34
- title && (React.createElement("div", { className: b('title') },
34
+ title && (React.createElement("h2", { className: `${b('title')} title-font-family` },
35
35
  React.createElement(HTML, null, title))),
36
36
  shouldShowStory && React.createElement(HTML, { className: b('text') }, text),
37
37
  showQuote && quote && React.createElement(HTML, { className: b('quote') }, quote),
@@ -47,7 +47,8 @@ const MiniCaseCard = ({ title, showStory = true, showQuote = true, text, quote,
47
47
  React.createElement(MiniCaseCardHead, { title: title, shouldShowStory: shouldShowStory, showQuote: showQuote, text: text, quote: quote, avatar: avatar, author: author, position: position })),
48
48
  React.createElement(MiniCaseCardTags, { tagUsecase: tagUsecase, tagIndustry: tagIndustry })),
49
49
  React.createElement("div", { className: b('rhs') }, data === null || data === void 0 ? void 0 : data.map((item, index) => (React.createElement("div", { key: index, className: b('box'), style: backgroundData ? { background: backgroundData } : undefined },
50
- React.createElement("div", { className: `${b('value')} title-font-family` }, item.value),
51
- React.createElement("div", { className: b('label') }, item.label)))))));
50
+ React.createElement("div", { className: b('inner-container') },
51
+ React.createElement("div", { className: `${b('value')} title-font-family` }, item.value),
52
+ React.createElement("div", { className: b('label') }, item.label))))))));
52
53
  };
53
54
  export default MiniCaseCard;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@doyourjob/gravity-ui-page-constructor",
3
- "version": "5.31.259",
3
+ "version": "5.31.261",
4
4
  "description": "Gravity UI Page Constructor",
5
5
  "license": "MIT",
6
6
  "repository": {