@gravity-ui/page-constructor 4.41.1-alpha.0 → 4.42.0

package/build/esm/navigation/components/NavigationItem/NavigationItem.js

@@ -2,12 +2,13 @@ import { __rest } from "tslib";
 import React, { useMemo } from 'react';
 import omit from 'lodash/omit';
 import { BlockIdContext } from '../../../context/blockIdContext';
-import { NavigationItemType } from '../../../models';
+import { NavigationItemType, NavigationItemTypes } from '../../../models';
 import { block } from '../../../utils';
 import { useNavigationItemMap } from './hooks/useNavigationItemMap';
 import './NavigationItem.css';
 const b = block('navigation-item');
 const ANALYTICS_ID = 'navigation';
+const nonComplexNavigationItemTypes = NavigationItemTypes.filter((type) => type !== NavigationItemType.Dropdown);
 const NavigationItem = (_a) => {
     var { data, className, menuLayout } = _a, props = __rest(_a, ["data", "className", "menuLayout"]);
     const { type = NavigationItemType.Link } = data;
@@ -15,11 +16,13 @@ const NavigationItem = (_a) => {
     const Component = navItemMap[type];
     const componentProps = useMemo(() => {
         const componentProperties = Object.assign(Object.assign({}, data), props);
-        if (type !== NavigationItemType.Dropdown) {
+        if (nonComplexNavigationItemTypes.includes(type)) {
             return omit(componentProperties, 'hidePopup', 'isActive');
         }
-        return componentProperties;
-    }, [data, props, type]);
+        return NavigationItemTypes.includes(type)
+            ? componentProperties
+            : Object.assign(Object.assign({}, componentProperties), { menuLayout });
+    }, [data, props, type, menuLayout]);
     return (React.createElement(BlockIdContext.Provider, { value: ANALYTICS_ID },
         React.createElement("li", { className: b({ 'menu-layout': menuLayout }, className) },
             React.createElement(Component, Object.assign({}, componentProps, { className: b('content', { type }) })))));

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

@@ -125,10 +125,6 @@ export declare const cardSchemas: {
                 type: string;
                 contentType: string;
             };
-            yfmText: {
-                type: string;
-                contentType: string;
-            };
             image: {
                 oneOf: (({
                     oneOf: ({

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

@@ -73,6 +73,9 @@ unpredictable css rules order in build */
 .pc-content_size_s .pc-content__button {
   margin-top: 8px;
 }
+.pc-content_size_s .pc-content__list {
+  margin-top: 16px;
+}
 .pc-content_size_l .pc-content__text,
 .pc-content_size_l .pc-content__notice {
   margin-top: 12px;
@@ -91,6 +94,9 @@ unpredictable css rules order in build */
 .pc-content_size_l .pc-content__button {
   margin-top: 12px;
 }
+.pc-content_size_l .pc-content__list {
+  margin-top: 24px;
+}
 .pc-content_theme_dark {
   --g-color-line-focus: var(--pc-color-line-focus-dark);
 }

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

@@ -46,7 +46,8 @@ const Content = (props) => {
         title && (React.createElement(Title, { className: b('title'), title: titleProps, colSizes: { all: 12 }, id: titleId })),
         text && (React.createElement("div", { className: b('text', { ['without-title']: !hasTitle }) },
             React.createElement(YFMWrapper, { content: text, modifiers: { constructor: true, [`constructor-size-${size}`]: true }, id: textId }))),
-        (list === null || list === void 0 ? void 0 : list.length) ? React.createElement(ContentList, { list: list, size: size, qa: qaAttributes.list }) : null,
+        (list === null || list === void 0 ? void 0 : list.length) ? (React.createElement("div", { className: b('list') },
+            React.createElement(ContentList, { list: list, size: size, qa: qaAttributes.list }))) : null,
         additionalInfo && (React.createElement("div", { className: b('notice') },
             React.createElement(YFMWrapper, { content: additionalInfo, modifiers: {
                     constructor: true,

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

@@ -3,6 +3,10 @@ unpredictable css rules order in build */
 .pc-price-card {
   position: relative;
 }
+.pc-price-card.pc-price-card {
+  min-height: auto;
+}
+
 .pc-price-card__background {
   position: absolute;
   top: 0;
@@ -59,7 +63,8 @@ unpredictable css rules order in build */
   margin-left: 4px;
 }
 .pc-price-card__price-details {
-  margin-bottom: 12px;
+  font-size: var(--g-text-body-2-font-size);
+  line-height: var(--g-text-body-2-line-height);
 }
 .pc-price-card__main {
   flex: 1;
@@ -69,12 +74,28 @@ unpredictable css rules order in build */
   position: relative;
 }
 .pc-price-card__info {
-  margin-bottom: 24px;
   flex: 1;
   min-height: 0;
   display: flex;
   flex-direction: column;
 }
+.pc-price-card__description:not(:last-child) {
+  margin-bottom: 12px;
+}
+.pc-price-card__links, .pc-price-card__buttons {
+  margin-top: 24px;
+}
 .pc-price-card__links > *:not(:last-child), .pc-price-card__buttons > *:not(:last-child) {
   margin-right: 16px;
+}
+.pc-price-card__link {
+  margin-top: 0;
+}
+@media (max-width: 769px) {
+  .pc-price-card__title, .pc-price-card__price {
+    margin-bottom: 16px;
+  }
+  .pc-price-card__links, .pc-price-card__buttons {
+    margin-top: 16px;
+  }
 }

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

@@ -19,13 +19,13 @@ const PriceCard = (props) => {
                                 "/ ",
                                 pricePeriod))),
                         priceDetails && (React.createElement("div", { className: b('price-details') }, priceDetails))),
-                    React.createElement("div", null, description),
+                    description && React.createElement("div", { className: b('description') }, description),
                     (list === null || list === void 0 ? void 0 : list.length) ? (React.createElement("div", { className: b('list') },
                         React.createElement(ContentList, { list: list.map((item) => ({
                                 icon: Check,
                                 text: item,
-                            })), size: "s" }))) : null),
+                            })), size: "l" }))) : null),
                 buttons && (React.createElement("div", { className: b('buttons') }, buttons.map((button) => (React.createElement(Button, Object.assign({ key: button.url }, button)))))),
-                links && (React.createElement("div", { className: b('links') }, links.map((link) => (React.createElement(LinkBlock, Object.assign({ key: link.url, textSize: "m" }, link))))))))));
+                links && (React.createElement("div", { className: b('links') }, links.map((link) => (React.createElement(LinkBlock, Object.assign({ className: b('link'), key: link.url, textSize: "m" }, link))))))))));
 };
 export default PriceCard;

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

@@ -76,17 +76,6 @@ unpredictable css rules order in build */
 .pc-quote__content_quote-type_english-double .pc-quote__text::after {
   content: "”";
 }
-.pc-quote__content .yfm {
-  font-size: var(--g-text-body-3-font-size);
-  line-height: var(--g-text-body-3-line-height);
-}
-.pc-quote__content .yfm > * {
-  display: inline;
-}
-.pc-quote__content .yfm:after {
-  position: relative;
-  left: -5px;
-}
 .pc-quote__image {
   width: 100%;
   height: 100%;
@@ -98,6 +87,24 @@ unpredictable css rules order in build */
   align-items: flex-end;
   margin-top: 20px;
 }
+.pc-quote__author_theme_dark, .pc-quote_theme_dark {
+  color: var(--g-color-text-light-primary);
+}
+.pc-quote__author_theme_dark h1,
+.pc-quote__author_theme_dark h2,
+.pc-quote__author_theme_dark h3,
+.pc-quote__author_theme_dark h4,
+.pc-quote__author_theme_dark h5,
+.pc-quote__author_theme_dark h6,
+.pc-quote__author_theme_dark .yfm, .pc-quote_theme_dark h1,
+.pc-quote_theme_dark h2,
+.pc-quote_theme_dark h3,
+.pc-quote_theme_dark h4,
+.pc-quote_theme_dark h5,
+.pc-quote_theme_dark h6,
+.pc-quote_theme_dark .yfm {
+  color: var(--g-color-text-light-primary);
+}
 .pc-quote__author {
   max-width: calc(60% - 20px);
   margin-right: 20px;

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

@@ -1,5 +1,6 @@
 import React, { useCallback } from 'react';
-import { Author, Button, HTML, Image, YFMWrapper } from '../../components';
+import { Button } from '@gravity-ui/uikit';
+import { Author, HTML, Image } from '../../components';
 import { getMediaImage } from '../../components/Media/Image/utils';
 import { useTheme } from '../../context/theme';
 import { useAnalytics } from '../../hooks';
@@ -8,25 +9,23 @@ import { block, getThemedValue } from '../../utils';
 import './Quote.css';
 const b = block('quote');
 const Quote = (props) => {
-    const { theme: textTheme = 'light', color, image, border = 'shadow', text, yfmText, logo, author, url, urlTitle, buttonText, quoteType = QuoteType.Chevron, button, } = props;
+    const { theme: textTheme = 'light', color, image, border = 'shadow', text, logo, author, url, urlTitle, buttonText, quoteType = QuoteType.Chevron, } = props;
     const theme = useTheme();
     const imageThemed = getThemedValue(image, theme);
     const imageData = getMediaImage(imageThemed);
     const handleAnalytics = useAnalytics(DefaultEventNames.QuoteButton, url);
     const handleButtonClick = useCallback(() => handleAnalytics(), [handleAnalytics]);
     const renderFooter = Boolean(author || url) && (React.createElement("div", { className: b('author-wrapper') },
-        author && (React.createElement(Author, { className: b('author', { theme: textTheme }), author: author, type: AuthorType.Line, theme: textTheme })),
-        url && buttonText && !button && (React.createElement(Button, { theme: "outlined", size: "xl", url: url, className: b('link-button', { theme: textTheme }), onClick: handleButtonClick, urlTitle: urlTitle, text: buttonText })),
-        button && React.createElement(Button, Object.assign({ size: "xl" }, button))));
+        author && (React.createElement(Author, { className: b('author', { theme: textTheme }), author: author, type: AuthorType.Line })),
+        url && buttonText && (React.createElement(Button, { view: "outlined", size: "xl", href: url, className: b('link-button', { theme: textTheme }), onClick: handleButtonClick, title: urlTitle }, buttonText))));
     const logoProps = getMediaImage(logo);
     return (React.createElement("div", { className: b({ theme: textTheme, border }), style: color ? { backgroundColor: color } : {} },
         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', { 'quote-type': quoteType }) },
-                    text && (React.createElement("span", { className: b('text') },
-                        React.createElement(HTML, null, text))),
-                    yfmText && (React.createElement(YFMWrapper, { className: b('text'), content: yfmText, modifiers: { constructor: true } })))),
+                    React.createElement("span", { className: b('text') },
+                        React.createElement(HTML, null, text)))),
             renderFooter),
         React.createElement("div", { className: b('image-wrapper') },
             React.createElement(Image, Object.assign({}, imageData, { className: b('image') })))));

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

@@ -7,10 +7,6 @@ export declare const Quote: {
                 type: string;
                 contentType: string;
             };
-            yfmText: {
-                type: string;
-                contentType: string;
-            };
             image: {
                 oneOf: (({
                     oneOf: ({

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

@@ -3,13 +3,10 @@ import { BaseProps, ThemeProps, authorItem, quoteTypes, withTheme, } from '../..
 export const Quote = {
     quote: {
         additionalProperties: false,
-        required: ['image', 'logo'],
+        required: ['text', 'image', 'logo'],
         properties: Object.assign(Object.assign({}, BaseProps), { text: {
                 type: 'string',
                 contentType: 'text',
-            }, yfmText: {
-                type: 'string',
-                contentType: 'text',
             }, image: withTheme(ImageProps), logo: ImageProps, color: {
                 type: 'string',
             }, url: {

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

@@ -127,16 +127,10 @@ export const config = {
             transformer: yfmTransformer,
         },
     ],
-    [SubBlockType.Quote]: [
-        {
-            fields: ['text'],
-            transformer: typografTransformer,
-        },
-        {
-            fields: ['yfmText'],
-            transformer: yfmTransformer,
-        },
-    ],
+    [SubBlockType.Quote]: {
+        fields: ['text'],
+        transformer: typografTransformer,
+    },
     [BlockType.ExtendedFeaturesBlock]: [
         ...blockHeaderTransformer,
         {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gravity-ui/page-constructor",
-  "version": "4.41.1-alpha.0",
+  "version": "4.42.0",
   "description": "Gravity UI Page Constructor",
   "license": "MIT",
   "repository": {

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

@@ -346,7 +346,6 @@ export interface AuthorProps extends QAProps {
     className?: string;
     authorContainerClassName?: string;
     type?: AuthorType;
-    theme?: ContentTheme;
 }
 export interface TitleProps {
     title?: TitleItemProps | string;

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

@@ -63,27 +63,16 @@ export interface HubspotFormProps extends HubspotEventHandlers, AnalyticsEventsB
     createDOMElement?: boolean;
 }
 export interface QuoteProps extends Themable, CardBaseProps {
-    text?: string;
-    yfmText?: string;
+    text: string;
     image: ThemedImage;
     logo: ImageProps;
     color?: string;
-    /**
-     * @deprecated use property button instead
-     */
     url?: string;
-    /**
-     * @deprecated use property button instead
-     */
     urlTitle?: string;
     author?: AuthorItem;
-    /**
-     * @deprecated use property button instead
-     */
     buttonText?: string;
     theme?: TextTheme;
     quoteType?: QuoteType;
-    button?: ButtonProps;
 }
 export interface BackgroundCardProps extends CardBaseProps, AnalyticsEventsBase, Omit<ContentBlockProps, 'colSizes' | 'centered'> {
     url?: string;

package/server/text-transform/config.js

@@ -140,16 +140,10 @@ exports.config = {
             transformer: common_1.yfmTransformer,
         },
     ],
-    [models_1.SubBlockType.Quote]: [
-        {
-            fields: ['text'],
-            transformer: common_1.typografTransformer,
-        },
-        {
-            fields: ['yfmText'],
-            transformer: common_1.yfmTransformer,
-        },
-    ],
+    [models_1.SubBlockType.Quote]: {
+        fields: ['text'],
+        transformer: common_1.typografTransformer,
+    },
     [models_1.BlockType.ExtendedFeaturesBlock]: [
         ...exports.blockHeaderTransformer,
         {

package/styles/variables.scss

@@ -36,8 +36,6 @@ $animationDuration: 300ms;
 
 //colors
 $videoPlayButtonGrey: #eff2f8;
-$secondary: var(--g-color-text-secondary);
-$lightSecondary: var(--g-color-text-light-secondary);
 
 //grid
 $newContentWidth: 1232px;