@gravity-ui/page-constructor 4.29.1 → 4.30.0

package/build/cjs/blocks/Header/Header.js

@@ -21,7 +21,7 @@ const Background = ({ background, isMobile }) => {
 };
 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 } }));
 const HeaderBlock = (props) => {
-    const { title, overtitle, description, buttons, image, video, width = 'm', imageSize, offset = 'default', background, theme: textTheme = 'light', verticalOffset = 'm', className, breadcrumbs, status, children, mediaView = 'full', } = props;
+    const { title, overtitle, description, buttons, image, video, width = 'm', imageSize, offset = 'default', background, theme: textTheme = 'light', verticalOffset = 'm', className, breadcrumbs, status, renderTitle, children, mediaView = 'full', } = props;
     const isMobile = (0, react_1.useContext)(mobileContext_1.MobileContext);
     const theme = (0, theme_1.useTheme)();
     const hasRightSideImage = Boolean(image || video);
@@ -59,7 +59,7 @@ const HeaderBlock = (props) => {
                                     react_1.default.createElement(components_1.HTML, null, overtitle))),
                                 react_1.default.createElement("h1", { className: b('title') },
                                     status,
-                                    react_1.default.createElement(components_1.HTML, null, title)),
+                                    renderTitle ? renderTitle(title) : react_1.default.createElement(components_1.HTML, null, title)),
                                 description && (react_1.default.createElement("div", { className: b('description') },
                                     react_1.default.createElement(YFMWrapper_1.default, { content: description, modifiers: {
                                             constructor: true,

package/build/cjs/components/Media/Image/Image.js

@@ -3,8 +3,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.defaultAnimatedDivQa = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importStar(require("react"));
+const web_1 = require("@react-spring/web");
 const debounce_1 = tslib_1.__importDefault(require("lodash/debounce"));
-const react_spring_1 = require("react-spring");
 const Slider_1 = tslib_1.__importDefault(require("../../../blocks/Slider/Slider"));
 const models_1 = require("../../../models");
 const utils_1 = require("../../../utils");
@@ -18,9 +18,9 @@ const Image = (props) => {
     const { parallax, image, height, imageClassName, isBackground, hasVideoFallback, video, fullscreen, qa, } = props;
     const qaAttributes = (0, utils_1.getQaAttrubutes)(qa, 'fullscreen-image', 'animate', 'background-image', 'image-view', 'slider-block');
     const [scrollY, setScrollY] = (0, react_1.useState)(0);
-    const [{ springScrollY }, springSetScrollY] = (0, react_spring_1.useSpring)(() => ({
+    const [{ springScrollY }, springSetScrollY] = (0, web_1.useSpring)(() => ({
         springScrollY: 0,
-        config: react_spring_1.config.molasses,
+        config: web_1.config.molasses,
     }));
     let parallaxInterpolate = '';
     (0, react_1.useEffect)(() => {
@@ -44,7 +44,7 @@ const Image = (props) => {
     };
     const imageBackground = (oneImage) => {
         const imageData = (0, utils_2.getMediaImage)(oneImage);
-        return (react_1.default.createElement(react_spring_1.animated.div, { style: { transform: parallaxInterpolate }, "data-qa": qaAttributes.animate },
+        return (react_1.default.createElement(web_1.animated.div, { style: { transform: parallaxInterpolate }, "data-qa": qaAttributes.animate },
             react_1.default.createElement(BackgroundImage_1.default, Object.assign({}, imageData, { className: imageClass, style: { height }, qa: qaAttributes.backgroundImage }))));
     };
     const imageOnly = (oneImage) => {

package/build/cjs/models/constructor-items/blocks.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from 'react';
 import { ButtonSize } from '@gravity-ui/uikit';
 import { GridColumnSize, GridColumnSizesType } from '../../grid/types';
 import { ThemeSupporting } from '../../utils';
@@ -109,6 +109,7 @@ export interface HeaderBlockProps {
     verticalOffset?: 's' | 'm' | 'l' | 'xl';
     breadcrumbs?: HeaderBreadCrumbsProps;
     status?: JSX.Element;
+    renderTitle?: (title: string) => React.ReactNode;
 }
 export interface ExtendedFeaturesItem extends Omit<ContentBlockProps, 'theme' | 'centered' | 'colSizes' | 'size' | 'title'> {
     title: string;

package/build/cjs/models/constructor-items/common.d.ts

@@ -42,6 +42,10 @@ export declare enum MediaVideoControlsType {
     Default = "default",
     Custom = "custom"
 }
+export declare enum QuoteType {
+    Chevron = "chevron",
+    EnglishDouble = "english-double"
+}
 export type TextTheme = 'light' | 'dark';
 export type TextSize = 'xs' | 's' | 'm' | 'l';
 export type DividerSize = '0' | 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl' | 'xxxl';

package/build/cjs/models/constructor-items/common.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.MediaVideoControlsType = exports.MediaVideoType = exports.CustomControlsButtonPositioning = exports.CustomControlsType = exports.PlayButtonThemes = exports.PlayButtonType = exports.PriceLabelColor = exports.PriceDetailsType = exports.AuthorType = void 0;
+exports.QuoteType = exports.MediaVideoControlsType = exports.MediaVideoType = exports.CustomControlsButtonPositioning = exports.CustomControlsType = exports.PlayButtonThemes = exports.PlayButtonType = exports.PriceLabelColor = exports.PriceDetailsType = exports.AuthorType = void 0;
 // enums
 var AuthorType;
 (function (AuthorType) {
@@ -51,3 +51,8 @@ var MediaVideoControlsType;
     MediaVideoControlsType["Default"] = "default";
     MediaVideoControlsType["Custom"] = "custom";
 })(MediaVideoControlsType = exports.MediaVideoControlsType || (exports.MediaVideoControlsType = {}));
+var QuoteType;
+(function (QuoteType) {
+    QuoteType["Chevron"] = "chevron";
+    QuoteType["EnglishDouble"] = "english-double";
+})(QuoteType = exports.QuoteType || (exports.QuoteType = {}));

package/build/cjs/models/constructor-items/sub-blocks.d.ts

@@ -1,4 +1,4 @@
-import { ClassNameProps } from '../../models';
+import { ClassNameProps, QuoteType } from '../../models';
 import { ThemeSupporting } from '../../utils';
 import { HubspotEventData, HubspotEventHandlers } from '../../utils/hubspot';
 import { AnalyticsEventsBase, PixelEvent } from '../common';
@@ -70,6 +70,7 @@ export interface QuoteProps extends Themable, CardBaseProps {
     author?: AuthorItem;
     buttonText?: string;
     theme?: TextTheme;
+    quoteType?: QuoteType;
 }
 export interface BackgroundCardProps extends CardBaseProps, AnalyticsEventsBase, Omit<ContentBlockProps, 'colSizes' | 'centered'> {
     url?: string;

package/build/cjs/schema/constants.d.ts

@@ -202,6 +202,10 @@ export declare const cardSchemas: {
                     };
                 };
             };
+            quoteType: {
+                type: string;
+                enum: import("../models").QuoteType[];
+            };
             type: {};
             when: {
                 type: string;

package/build/cjs/schema/validators/common.d.ts

@@ -1,4 +1,4 @@
-import { CustomControlsButtonPositioning, CustomControlsType, MediaVideoControlsType, Theme } from '../../models';
+import { CustomControlsButtonPositioning, CustomControlsType, MediaVideoControlsType, QuoteType, Theme } from '../../models';
 export declare const mediaDirection: string[];
 export declare const textSize: string[];
 export declare const containerSizesArray: string[];
@@ -19,6 +19,7 @@ export declare const sizeNumber: {
     minimum: number;
 };
 export declare const contentThemes: string[];
+export declare const quoteTypes: QuoteType[];
 export declare const customControlsType: CustomControlsType[];
 export declare const customControlsButtonPositioning: CustomControlsButtonPositioning[];
 export declare const BaseProps: {

package/build/cjs/schema/validators/common.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.BlockHeaderProps = exports.CardBase = 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.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 = exports.CardBase = 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.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;
 const schema_1 = require("../../components/Image/schema");
 const models_1 = require("../../models");
 const event_1 = require("./event");
@@ -19,6 +19,7 @@ exports.fileLinkTypes = ['vertical', 'horizontal'];
 exports.dividerEnum = { enum: [0, 'xxs', 'xs', 's', 'm', 'l', 'xl', 'xxl', 'xxxl'] };
 exports.sizeNumber = { type: 'number', maximum: 12, minimum: 1 };
 exports.contentThemes = ['default', 'dark', 'light'];
+exports.quoteTypes = Object.values(models_1.QuoteType);
 exports.customControlsType = [
     models_1.CustomControlsType.WithMuteButton,
     models_1.CustomControlsType.WithPlayPauseButton,

package/build/cjs/sub-blocks/Quote/Quote.css

@@ -60,14 +60,23 @@ unpredictable css rules order in build */
   font-size: var(--g-text-body-3-font-size);
   line-height: var(--g-text-body-3-line-height);
 }
-.pc-quote__content::before {
+.pc-quote__content_quote-type_chevron::before {
   position: absolute;
   top: -1px;
   left: -10px;
   content: "«";
 }
-.pc-quote__text::after {
-  content: "».";
+.pc-quote__content_quote-type_chevron .pc-quote__text::after {
+  content: "»";
+}
+.pc-quote__content_quote-type_english-double::before {
+  position: absolute;
+  top: -1px;
+  left: -8px;
+  content: "“";
+}
+.pc-quote__content_quote-type_english-double .pc-quote__text::after {
+  content: "”";
 }
 .pc-quote__image {
   width: 100%;

package/build/cjs/sub-blocks/Quote/Quote.js

@@ -11,7 +11,7 @@ const models_1 = require("../../models");
 const utils_2 = require("../../utils");
 const b = (0, utils_2.block)('quote');
 const Quote = (props) => {
-    const { theme: textTheme = 'light', color, image, border = 'shadow', text, logo, author, url, buttonText, } = props;
+    const { theme: textTheme = 'light', color, image, border = 'shadow', text, logo, author, url, buttonText, quoteType = models_1.QuoteType.Chevron, } = props;
     const theme = (0, theme_1.useTheme)();
     const imageThemed = (0, utils_2.getThemedValue)(image, theme);
     const imageData = (0, utils_1.getMediaImage)(imageThemed);
@@ -25,7 +25,7 @@ const Quote = (props) => {
         react_1.default.createElement("div", { key: text, className: b('content-wrapper') },
             react_1.default.createElement("div", null,
                 react_1.default.createElement(components_1.Image, Object.assign({ className: b('logo') }, logoProps)),
-                react_1.default.createElement("div", { className: b('content') },
+                react_1.default.createElement("div", { className: b('content', { 'quote-type': quoteType }) },
                     react_1.default.createElement("span", { className: b('text') },
                         react_1.default.createElement(components_1.HTML, null, text)))),
             renderFooter),

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

@@ -90,6 +90,10 @@ export declare const Quote: {
                     };
                 };
             };
+            quoteType: {
+                type: string;
+                enum: import("../..").QuoteType[];
+            };
             type: {};
             when: {
                 type: string;

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

@@ -16,6 +16,9 @@ exports.Quote = {
                 type: 'string',
             }, buttonText: {
                 type: 'string',
-            }, theme: common_1.ThemeProps, author: common_1.authorItem }),
+            }, theme: common_1.ThemeProps, author: common_1.authorItem, quoteType: {
+                type: 'string',
+                enum: common_1.quoteTypes,
+            } }),
     },
 };

package/build/esm/blocks/Header/Header.js

@@ -18,7 +18,7 @@ const Background = ({ background, isMobile }) => {
 };
 const FullWidthBackground = ({ background }) => (React.createElement("div", { className: b('background', { ['full-width']: true }), style: { backgroundColor: background === null || background === void 0 ? void 0 : background.color } }));
 export const HeaderBlock = (props) => {
-    const { title, overtitle, description, buttons, image, video, width = 'm', imageSize, offset = 'default', background, theme: textTheme = 'light', verticalOffset = 'm', className, breadcrumbs, status, children, mediaView = 'full', } = props;
+    const { title, overtitle, description, buttons, image, video, width = 'm', imageSize, offset = 'default', background, theme: textTheme = 'light', verticalOffset = 'm', className, breadcrumbs, status, renderTitle, children, mediaView = 'full', } = props;
     const isMobile = useContext(MobileContext);
     const theme = useTheme();
     const hasRightSideImage = Boolean(image || video);
@@ -56,7 +56,7 @@ export const HeaderBlock = (props) => {
                                     React.createElement(HTML, null, overtitle))),
                                 React.createElement("h1", { className: b('title') },
                                     status,
-                                    React.createElement(HTML, null, title)),
+                                    renderTitle ? renderTitle(title) : React.createElement(HTML, null, title)),
                                 description && (React.createElement("div", { className: b('description') },
                                     React.createElement(YFMWrapper, { content: description, modifiers: {
                                             constructor: true,

package/build/esm/components/Media/Image/Image.js

@@ -1,6 +1,6 @@
 import React, { Fragment, useEffect, useState } from 'react';
+import { animated, config, useSpring } from '@react-spring/web';
 import debounce from 'lodash/debounce';
-import { animated, config, useSpring } from 'react-spring';
 import SliderBlock from '../../../blocks/Slider/Slider';
 import { SliderType } from '../../../models';
 import { block, getQaAttrubutes } from '../../../utils';

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

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from 'react';
 import { ButtonSize } from '@gravity-ui/uikit';
 import { GridColumnSize, GridColumnSizesType } from '../../grid/types';
 import { ThemeSupporting } from '../../utils';
@@ -109,6 +109,7 @@ export interface HeaderBlockProps {
     verticalOffset?: 's' | 'm' | 'l' | 'xl';
     breadcrumbs?: HeaderBreadCrumbsProps;
     status?: JSX.Element;
+    renderTitle?: (title: string) => React.ReactNode;
 }
 export interface ExtendedFeaturesItem extends Omit<ContentBlockProps, 'theme' | 'centered' | 'colSizes' | 'size' | 'title'> {
     title: string;

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

@@ -42,6 +42,10 @@ export declare enum MediaVideoControlsType {
     Default = "default",
     Custom = "custom"
 }
+export declare enum QuoteType {
+    Chevron = "chevron",
+    EnglishDouble = "english-double"
+}
 export type TextTheme = 'light' | 'dark';
 export type TextSize = 'xs' | 's' | 'm' | 'l';
 export type DividerSize = '0' | 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl' | 'xxxl';

package/build/esm/models/constructor-items/common.js

@@ -48,3 +48,8 @@ export var MediaVideoControlsType;
     MediaVideoControlsType["Default"] = "default";
     MediaVideoControlsType["Custom"] = "custom";
 })(MediaVideoControlsType || (MediaVideoControlsType = {}));
+export var QuoteType;
+(function (QuoteType) {
+    QuoteType["Chevron"] = "chevron";
+    QuoteType["EnglishDouble"] = "english-double";
+})(QuoteType || (QuoteType = {}));

package/build/esm/models/constructor-items/sub-blocks.d.ts

@@ -1,4 +1,4 @@
-import { ClassNameProps } from '../../models';
+import { ClassNameProps, QuoteType } from '../../models';
 import { ThemeSupporting } from '../../utils';
 import { HubspotEventData, HubspotEventHandlers } from '../../utils/hubspot';
 import { AnalyticsEventsBase, PixelEvent } from '../common';
@@ -70,6 +70,7 @@ export interface QuoteProps extends Themable, CardBaseProps {
     author?: AuthorItem;
     buttonText?: string;
     theme?: TextTheme;
+    quoteType?: QuoteType;
 }
 export interface BackgroundCardProps extends CardBaseProps, AnalyticsEventsBase, Omit<ContentBlockProps, 'colSizes' | 'centered'> {
     url?: string;

package/build/esm/schema/constants.d.ts

@@ -202,6 +202,10 @@ export declare const cardSchemas: {
                     };
                 };
             };
+            quoteType: {
+                type: string;
+                enum: import("../models").QuoteType[];
+            };
             type: {};
             when: {
                 type: string;

package/build/esm/schema/validators/common.d.ts

@@ -1,4 +1,4 @@
-import { CustomControlsButtonPositioning, CustomControlsType, MediaVideoControlsType, Theme } from '../../models';
+import { CustomControlsButtonPositioning, CustomControlsType, MediaVideoControlsType, QuoteType, Theme } from '../../models';
 export declare const mediaDirection: string[];
 export declare const textSize: string[];
 export declare const containerSizesArray: string[];
@@ -19,6 +19,7 @@ export declare const sizeNumber: {
     minimum: number;
 };
 export declare const contentThemes: string[];
+export declare const quoteTypes: QuoteType[];
 export declare const customControlsType: CustomControlsType[];
 export declare const customControlsButtonPositioning: CustomControlsButtonPositioning[];
 export declare const BaseProps: {

package/build/esm/schema/validators/common.js

@@ -1,5 +1,5 @@
 import { ImageProps } from '../../components/Image/schema';
-import { CustomControlsButtonPositioning, CustomControlsType, MediaVideoControlsType, Theme, } from '../../models';
+import { CustomControlsButtonPositioning, CustomControlsType, MediaVideoControlsType, QuoteType, Theme, } from '../../models';
 import { AnalyticsEventSchema } from './event';
 import { pixelEvents } from './pixel';
 export const mediaDirection = ['media-content', 'content-media'];
@@ -16,6 +16,7 @@ export const fileLinkTypes = ['vertical', 'horizontal'];
 export const dividerEnum = { enum: [0, 'xxs', 'xs', 's', 'm', 'l', 'xl', 'xxl', 'xxxl'] };
 export const sizeNumber = { type: 'number', maximum: 12, minimum: 1 };
 export const contentThemes = ['default', 'dark', 'light'];
+export const quoteTypes = Object.values(QuoteType);
 export const customControlsType = [
     CustomControlsType.WithMuteButton,
     CustomControlsType.WithPlayPauseButton,

package/build/esm/sub-blocks/Quote/Quote.css

@@ -60,14 +60,23 @@ unpredictable css rules order in build */
   font-size: var(--g-text-body-3-font-size);
   line-height: var(--g-text-body-3-line-height);
 }
-.pc-quote__content::before {
+.pc-quote__content_quote-type_chevron::before {
   position: absolute;
   top: -1px;
   left: -10px;
   content: "«";
 }
-.pc-quote__text::after {
-  content: "».";
+.pc-quote__content_quote-type_chevron .pc-quote__text::after {
+  content: "»";
+}
+.pc-quote__content_quote-type_english-double::before {
+  position: absolute;
+  top: -1px;
+  left: -8px;
+  content: "“";
+}
+.pc-quote__content_quote-type_english-double .pc-quote__text::after {
+  content: "”";
 }
 .pc-quote__image {
   width: 100%;

package/build/esm/sub-blocks/Quote/Quote.js

@@ -4,12 +4,12 @@ import { Author, HTML, Image } from '../../components';
 import { getMediaImage } from '../../components/Media/Image/utils';
 import { useTheme } from '../../context/theme';
 import { useAnalytics } from '../../hooks';
-import { AuthorType, DefaultEventNames } from '../../models';
+import { AuthorType, DefaultEventNames, QuoteType } from '../../models';
 import { block, getThemedValue } from '../../utils';
 import './Quote.css';
 const b = block('quote');
 const Quote = (props) => {
-    const { theme: textTheme = 'light', color, image, border = 'shadow', text, logo, author, url, buttonText, } = props;
+    const { theme: textTheme = 'light', color, image, border = 'shadow', text, logo, author, url, buttonText, quoteType = QuoteType.Chevron, } = props;
     const theme = useTheme();
     const imageThemed = getThemedValue(image, theme);
     const imageData = getMediaImage(imageThemed);
@@ -23,7 +23,7 @@ const Quote = (props) => {
         React.createElement("div", { key: text, className: b('content-wrapper') },
             React.createElement("div", null,
                 React.createElement(Image, Object.assign({ className: b('logo') }, logoProps)),
-                React.createElement("div", { className: b('content') },
+                React.createElement("div", { className: b('content', { 'quote-type': quoteType }) },
                     React.createElement("span", { className: b('text') },
                         React.createElement(HTML, null, text)))),
             renderFooter),

package/build/esm/sub-blocks/Quote/schema.d.ts

@@ -90,6 +90,10 @@ export declare const Quote: {
                     };
                 };
             };
+            quoteType: {
+                type: string;
+                enum: import("../..").QuoteType[];
+            };
             type: {};
             when: {
                 type: string;

package/build/esm/sub-blocks/Quote/schema.js

@@ -1,5 +1,5 @@
 import { ImageProps } from '../../components/Image/schema';
-import { BaseProps, ThemeProps, authorItem, withTheme } from '../../schema/validators/common';
+import { BaseProps, ThemeProps, authorItem, quoteTypes, withTheme, } from '../../schema/validators/common';
 export const Quote = {
     quote: {
         additionalProperties: false,
@@ -13,6 +13,9 @@ export const Quote = {
                 type: 'string',
             }, buttonText: {
                 type: 'string',
-            }, theme: ThemeProps, author: authorItem }),
+            }, theme: ThemeProps, author: authorItem, quoteType: {
+                type: 'string',
+                enum: quoteTypes,
+            } }),
     },
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gravity-ui/page-constructor",
-  "version": "4.29.1",
+  "version": "4.30.0",
   "description": "Gravity UI Page Constructor",
   "license": "MIT",
   "repository": {
@@ -84,6 +84,7 @@
     "@gravity-ui/components": "^2.4.0",
     "@gravity-ui/dynamic-forms": "^2.3.0",
     "@gravity-ui/i18n": "^1.0.0",
+    "@react-spring/web": "^9.7.3",
     "ajv": "^8.12.0",
     "final-form": "^4.20.9",
     "github-buttons": "2.23.0",
@@ -93,7 +94,6 @@
     "react-monaco-editor": "^0.53.0",
     "react-player": "^2.9.0",
     "react-slick": "^0.29.0",
-    "react-spring": "^9.7.2",
     "react-transition-group": "^4.4.2",
     "react-waypoint": "^10.1.0",
     "sanitize-html": "2.6.1",

package/server/models/constructor-items/blocks.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from 'react';
 import { ButtonSize } from '@gravity-ui/uikit';
 import { GridColumnSize, GridColumnSizesType } from '../../grid/types';
 import { ThemeSupporting } from '../../utils';
@@ -109,6 +109,7 @@ export interface HeaderBlockProps {
     verticalOffset?: 's' | 'm' | 'l' | 'xl';
     breadcrumbs?: HeaderBreadCrumbsProps;
     status?: JSX.Element;
+    renderTitle?: (title: string) => React.ReactNode;
 }
 export interface ExtendedFeaturesItem extends Omit<ContentBlockProps, 'theme' | 'centered' | 'colSizes' | 'size' | 'title'> {
     title: string;

package/server/models/constructor-items/common.d.ts

@@ -42,6 +42,10 @@ export declare enum MediaVideoControlsType {
     Default = "default",
     Custom = "custom"
 }
+export declare enum QuoteType {
+    Chevron = "chevron",
+    EnglishDouble = "english-double"
+}
 export type TextTheme = 'light' | 'dark';
 export type TextSize = 'xs' | 's' | 'm' | 'l';
 export type DividerSize = '0' | 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl' | 'xxxl';

package/server/models/constructor-items/common.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.MediaVideoControlsType = exports.MediaVideoType = exports.CustomControlsButtonPositioning = exports.CustomControlsType = exports.PlayButtonThemes = exports.PlayButtonType = exports.PriceLabelColor = exports.PriceDetailsType = exports.AuthorType = void 0;
+exports.QuoteType = exports.MediaVideoControlsType = exports.MediaVideoType = exports.CustomControlsButtonPositioning = exports.CustomControlsType = exports.PlayButtonThemes = exports.PlayButtonType = exports.PriceLabelColor = exports.PriceDetailsType = exports.AuthorType = void 0;
 // enums
 var AuthorType;
 (function (AuthorType) {
@@ -51,3 +51,8 @@ var MediaVideoControlsType;
     MediaVideoControlsType["Default"] = "default";
     MediaVideoControlsType["Custom"] = "custom";
 })(MediaVideoControlsType = exports.MediaVideoControlsType || (exports.MediaVideoControlsType = {}));
+var QuoteType;
+(function (QuoteType) {
+    QuoteType["Chevron"] = "chevron";
+    QuoteType["EnglishDouble"] = "english-double";
+})(QuoteType = exports.QuoteType || (exports.QuoteType = {}));

package/server/models/constructor-items/sub-blocks.d.ts

@@ -1,4 +1,4 @@
-import { ClassNameProps } from '../../models';
+import { ClassNameProps, QuoteType } from '../../models';
 import { ThemeSupporting } from '../../utils';
 import { HubspotEventData, HubspotEventHandlers } from '../../utils/hubspot';
 import { AnalyticsEventsBase, PixelEvent } from '../common';
@@ -70,6 +70,7 @@ export interface QuoteProps extends Themable, CardBaseProps {
     author?: AuthorItem;
     buttonText?: string;
     theme?: TextTheme;
+    quoteType?: QuoteType;
 }
 export interface BackgroundCardProps extends CardBaseProps, AnalyticsEventsBase, Omit<ContentBlockProps, 'colSizes' | 'centered'> {
     url?: string;