@gravity-ui/page-constructor 6.0.0-alpha.3 → 6.0.0-alpha.5

package/README.md

@@ -146,6 +146,10 @@ const post = {
 
 You can find more utilities in this [section](https://github.com/gravity-ui/page-constructor/tree/main/src/text-transform)
 
+### Detailed Documentation on Server Utilities and Transformers
+
+For a comprehensive guide on using server utilities, including detailed explanations and advanced use cases, visit the [additional chapter on server utils usage](./docs/data-preparation.md).
+
 ### Custom blocks
 
 The page constructor lets you use blocks that are user-defined in their app. Blocks are regular React components.

package/build/cjs/blocks/Share/Share.js

@@ -3,6 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importStar(require("react"));
 const uikit_1 = require("@gravity-ui/uikit");
+const components_1 = require("../../components");
 const locationContext_1 = require("../../context/locationContext");
 const hooks_1 = require("../../hooks");
 const Facebook_1 = require("../../icons/Facebook");
@@ -26,7 +27,10 @@ const Share = ({ items, title }) => {
     const handleAnalytics = (0, hooks_1.useAnalytics)(models_1.DefaultEventNames.ShareButton);
     const handleButtonClick = (0, react_1.useCallback)(() => handleAnalytics(), [handleAnalytics]);
     return (react_1.default.createElement("div", { className: b() },
-        react_1.default.createElement("h5", { className: b('title') }, title || (0, i18n_1.i18n)('constructor-share')),
+        react_1.default.createElement("h5", { className: b('title') }, title ? (react_1.default.createElement(components_1.YFMWrapper, { content: title, modifiers: {
+                constructor: true,
+                // constructorTheme: textTheme,
+            } })) : ((0, i18n_1.i18n)('constructor-share'))),
         react_1.default.createElement("div", { className: b('items') }, items.map((type) => {
             const url = (0, utils_1.getAbsolutePath)(hostname, pathname);
             const socialUrl = (0, utils_1.getShareLink)(url, type);

package/build/cjs/blocks/Slider/schema.d.ts

@@ -69,7 +69,16 @@ export declare const SliderProps: {
                 type: string;
                 patternProperties: {
                     '.*': {
-                        type: string[];
+                        oneOf: ({
+                            type: string[];
+                            additionalProperties?: undefined;
+                        } | {
+                            type: string;
+                            additionalProperties: boolean;
+                        } | {
+                            type: string;
+                            additionalProperties?: undefined;
+                        })[];
                     };
                 };
             };
@@ -193,7 +202,16 @@ export declare const SliderBlock: {
                         type: string;
                         patternProperties: {
                             '.*': {
-                                type: string[];
+                                oneOf: ({
+                                    type: string[];
+                                    additionalProperties?: undefined;
+                                } | {
+                                    type: string;
+                                    additionalProperties: boolean;
+                                } | {
+                                    type: string;
+                                    additionalProperties?: undefined;
+                                })[];
                             };
                         };
                     };

package/build/cjs/blocks/Slider/schema.js

@@ -21,7 +21,18 @@ const LoadableProps = {
             type: 'object',
             patternProperties: {
                 '.*': {
-                    type: ['string', 'number', 'boolean'],
+                    oneOf: [
+                        {
+                            type: ['string', 'number', 'boolean'],
+                        },
+                        {
+                            type: 'object',
+                            additionalProperties: true,
+                        },
+                        {
+                            type: 'array',
+                        },
+                    ],
                 },
             },
         },

package/build/cjs/blocks/SliderOld/schema.d.ts

@@ -60,7 +60,16 @@ export declare const SliderOldProps: {
                 type: string;
                 patternProperties: {
                     '.*': {
-                        type: string[];
+                        oneOf: ({
+                            type: string[];
+                            additionalProperties?: undefined;
+                        } | {
+                            type: string;
+                            additionalProperties: boolean;
+                        } | {
+                            type: string;
+                            additionalProperties?: undefined;
+                        })[];
                     };
                 };
             };
@@ -176,7 +185,16 @@ export declare const SliderOldBlock: {
                         type: string;
                         patternProperties: {
                             '.*': {
-                                type: string[];
+                                oneOf: ({
+                                    type: string[];
+                                    additionalProperties?: undefined;
+                                } | {
+                                    type: string;
+                                    additionalProperties: boolean;
+                                } | {
+                                    type: string;
+                                    additionalProperties?: undefined;
+                                })[];
                             };
                         };
                     };

package/build/cjs/blocks/SliderOld/schema.js

@@ -21,7 +21,18 @@ const LoadableProps = {
             type: 'object',
             patternProperties: {
                 '.*': {
-                    type: ['string', 'number', 'boolean'],
+                    oneOf: [
+                        {
+                            type: ['string', 'number', 'boolean'],
+                        },
+                        {
+                            type: 'object',
+                            additionalProperties: true,
+                        },
+                        {
+                            type: 'array',
+                        },
+                    ],
                 },
             },
         },

package/build/cjs/blocks/Table/Table.css

@@ -1,10 +1,10 @@
-.pc-table-block__title {
+.pc-table-block__title.pc-table-block__title {
   margin: 0;
 }
 
 /* use this for style redefinitions to awoid problems with
 unpredictable css rules order in build */
-.pc-table-block__title {
+.pc-table-block__title.pc-table-block__title {
   font-size: var(--g-text-display-2-font-size);
   line-height: var(--g-text-display-2-line-height);
   color: var(--pc-text-header-color);
@@ -14,11 +14,12 @@ unpredictable css rules order in build */
   margin-right: 32px;
 }
 @media (max-width: 576px) {
-  .pc-table-block__title {
+  .pc-table-block__title.pc-table-block__title {
     font-size: var(--g-text-display-1-font-size);
     line-height: var(--g-text-display-1-line-height);
   }
 }
+
 .pc-table-block__table {
   margin-top: 0;
 }

package/build/cjs/blocks/Table/Table.js

@@ -13,7 +13,9 @@ const TableBlock = (props) => {
         react_1.default.createElement(grid_1.Grid, { className: b('content') },
             react_1.default.createElement(grid_1.Row, { className: b('row') },
                 react_1.default.createElement(grid_1.Col, { sizes: { [grid_1.GridColumnSize.Md]: 4, [grid_1.GridColumnSize.All]: 12 } },
-                    react_1.default.createElement("h2", { className: b('title') }, title)),
+                    react_1.default.createElement(components_1.YFMWrapper, { tagName: "h2", contentClassName: b('title'), content: title, modifiers: {
+                            constructor: true,
+                        } })),
                 react_1.default.createElement(grid_1.Col, { sizes: { [grid_1.GridColumnSize.Md]: 8, [grid_1.GridColumnSize.All]: 12 } },
                     react_1.default.createElement(components_1.Table, Object.assign({ className: b('table') }, table)))))));
 };

package/build/cjs/components/Title/TitleItem.css

@@ -99,6 +99,7 @@ unpredictable css rules order in build */
 .pc-title-item__text.pc-title-item__text {
   white-space: normal;
   font-size: inherit;
+  line-height: inherit;
 }
 .pc-title-item__text.pc-title-item__text a {
   outline: none;

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

@@ -50,7 +50,7 @@ export interface LoadableProps {
      * @deprecated Will be moved to params
      */
     serviceId?: number;
-    params?: Record<string, string | number | boolean>;
+    params?: Record<string, string | number | boolean | object>;
 }
 export interface LoadableChildren {
     loadable?: LoadableProps;

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

@@ -16,6 +16,9 @@ unpredictable css rules order in build */
   color: var(--g-color-text-light-primary);
 }
 
+.pc-banner-card__text {
+  max-width: 100%;
+}
 .pc-banner-card__title.pc-banner-card__title {
   font-size: var(--g-text-display-2-font-size);
   line-height: var(--g-text-display-2-line-height);
@@ -57,6 +60,7 @@ unpredictable css rules order in build */
   justify-content: space-between;
   flex-direction: column;
   align-items: baseline;
+  max-width: 100%;
 }
 .pc-banner-card__subtitle.pc-banner-card__subtitle {
   display: inline-block;

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

@@ -81,73 +81,75 @@ unpredictable css rules order in build */
 .pc-content_size_l .pc-content__buttons {
   margin-top: 24px;
 }
-.pc-content_theme_dark {
+.pc-content_theme_dark.pc-content_theme_dark {
   --g-color-line-focus: var(--pc-color-line-focus-dark);
 }
-.pc-content_theme_dark .pc-content__title *,
-.pc-content_theme_dark .pc-content__text .yfm,
-.pc-content_theme_dark .pc-content__text .yfm *,
-.pc-content_theme_dark .pc-content__links a {
+.pc-content_theme_dark.pc-content_theme_dark .pc-content__title *,
+.pc-content_theme_dark.pc-content_theme_dark .pc-content__text .yfm,
+.pc-content_theme_dark.pc-content_theme_dark .pc-content__text .yfm *,
+.pc-content_theme_dark.pc-content_theme_dark .pc-content__links a {
   color: var(--g-color-text-light-primary);
 }
-.pc-content_theme_dark .pc-content__notice .yfm,
-.pc-content_theme_dark .pc-content__notice .yfm * {
+.pc-content_theme_dark.pc-content_theme_dark .pc-content__notice .yfm,
+.pc-content_theme_dark.pc-content_theme_dark .pc-content__notice .yfm * {
   color: var(--g-color-text-light-secondary);
 }
-.pc-content_theme_dark .pc-content__notice .yfm a {
+.pc-content_theme_dark.pc-content_theme_dark .pc-content__notice .yfm a {
   color: var(--g-color-text-light-secondary);
   text-decoration: underline;
 }
-.pc-content_theme_dark .pc-content__notice .yfm a:hover {
+.pc-content_theme_dark.pc-content_theme_dark .pc-content__notice .yfm a:hover {
   color: var(--g-color-text-light-primary);
 }
-.pc-content_theme_dark .pc-content__text .yfm a {
+.pc-content_theme_dark.pc-content_theme_dark .pc-content__text .yfm a {
   color: var(--g-color-text-light-primary);
   text-decoration: underline;
 }
-.pc-content_theme_dark .pc-content__text .yfm a:hover {
+.pc-content_theme_dark.pc-content_theme_dark .pc-content__text .yfm a:hover {
   color: var(--g-color-text-light-secondary);
 }
-.pc-content_theme_dark .pc-content__title a {
+.pc-content_theme_dark.pc-content_theme_dark .pc-content__title a {
   color: var(--g-color-text-light-primary);
   text-decoration: underline;
   text-decoration: none;
 }
-.pc-content_theme_dark .pc-content__title a:hover {
+.pc-content_theme_dark.pc-content_theme_dark .pc-content__title a:hover {
   color: var(--g-color-text-light-secondary);
 }
-.pc-content_theme_light .pc-content__title *,
-.pc-content_theme_light .pc-content__text .yfm,
-.pc-content_theme_light .pc-content__text .yfm *,
-.pc-content_theme_light .pc-content__links a {
+
+.pc-content_theme_light.pc-content_theme_light .pc-content__title *,
+.pc-content_theme_light.pc-content_theme_light .pc-content__text .yfm,
+.pc-content_theme_light.pc-content_theme_light .pc-content__text .yfm *,
+.pc-content_theme_light.pc-content_theme_light .pc-content__links a {
   color: var(--g-color-text-dark-primary);
 }
-.pc-content_theme_light .pc-content__notice .yfm,
-.pc-content_theme_light .pc-content__notice .yfm * {
+.pc-content_theme_light.pc-content_theme_light .pc-content__notice .yfm,
+.pc-content_theme_light.pc-content_theme_light .pc-content__notice .yfm * {
   color: var(--g-color-text-dark-secondary);
 }
-.pc-content_theme_light .pc-content__notice .yfm a {
+.pc-content_theme_light.pc-content_theme_light .pc-content__notice .yfm a {
   color: var(--g-color-text-dark-secondary);
   text-decoration: underline;
 }
-.pc-content_theme_light .pc-content__notice .yfm a:hover {
+.pc-content_theme_light.pc-content_theme_light .pc-content__notice .yfm a:hover {
   color: var(--g-color-text-dark-primary);
 }
-.pc-content_theme_light .pc-content__text .yfm a {
+.pc-content_theme_light.pc-content_theme_light .pc-content__text .yfm a {
   color: var(--g-color-text-dark-primary);
   text-decoration: underline;
 }
-.pc-content_theme_light .pc-content__text .yfm a:hover {
+.pc-content_theme_light.pc-content_theme_light .pc-content__text .yfm a:hover {
   color: var(--g-color-text-dark-secondary);
 }
-.pc-content_theme_light .pc-content__title a {
+.pc-content_theme_light.pc-content_theme_light .pc-content__title a {
   color: var(--g-color-text-dark-primary);
   text-decoration: underline;
   text-decoration: none;
 }
-.pc-content_theme_light .pc-content__title a:hover {
+.pc-content_theme_light.pc-content_theme_light .pc-content__title a:hover {
   color: var(--g-color-text-dark-secondary);
 }
+
 .pc-content_control-position_bottom .pc-content__notice:has(+ .pc-content__buttons), .pc-content_control-position_bottom .pc-content__notice:has(+ .pc-content__links),
 .pc-content_control-position_bottom .pc-content__list:has(+ .pc-content__buttons),
 .pc-content_control-position_bottom .pc-content__list:has(+ .pc-content__links),

package/build/cjs/text-transform/common.d.ts

@@ -1,18 +1,19 @@
 import { MarkdownItPluginCb } from '@diplodoc/transform/lib/plugins/typings';
 import { Lang } from './types';
 export type ComplexItem = {
-    [key: string]: string;
+    [key: string]: string | object;
 };
 export type Item = string | null | ComplexItem;
 export type Transformer = (text: string) => string;
 export type TransformerRaw = (lang: Lang, content: string, options: {
     plugins: MarkdownItPluginCb[];
+    renderInline?: boolean;
 }) => string;
 export type Parser<T = any> = (transformer: Transformer, block: T) => T;
 export declare const createItemsParser: (fields: string[]) => (transformer: Transformer, items: Item[]) => (string | {
-    [x: string]: string;
+    [x: string]: string | object;
 } | null)[];
 export declare function yfmTransformer(lang: Lang, content: string, options?: {
     plugins?: MarkdownItPluginCb[];
-}): string;
+}, renderInline?: boolean): string;
 export declare function typografTransformer(lang: Lang, content: string): string;

package/build/cjs/text-transform/common.js

@@ -4,29 +4,52 @@ exports.typografTransformer = exports.yfmTransformer = exports.createItemsParser
 const tslib_1 = require("tslib");
 const plugins_1 = tslib_1.__importDefault(require("@diplodoc/transform/lib/plugins"));
 const utils_1 = require("./utils");
-const createItemsParser = (fields) => (transformer, items) => items.map((item) => {
-    if (!item) {
-        return item;
-    }
-    else if (typeof item === 'string') {
-        return transformer(item);
-    }
-    else {
-        return Object.assign(Object.assign({}, item), fields.reduce((acc, fieldName) => {
-            if (item[fieldName]) {
-                // eslint-disable-next-line no-param-reassign
-                acc[fieldName] = transformer(item[fieldName]);
-            }
-            return acc;
-        }, {}));
-    }
-});
+const createItemsParser = (fields) => (transformer, items) => {
+    const applyTransform = (itemLocal) => typeof itemLocal === 'string' ? transformer(itemLocal) : itemLocal;
+    return items.map((item) => {
+        if (!item) {
+            return item;
+        }
+        else if (typeof item === 'string') {
+            return transformer(item);
+        }
+        else {
+            return Object.assign(Object.assign({}, item), fields.reduce((acc, fieldName) => {
+                if (fieldName.includes('.')) {
+                    const [firstProperty, secondProperty] = fieldName.split('.');
+                    const root = item[firstProperty];
+                    if (!root || typeof root !== 'object') {
+                        return acc;
+                    }
+                    if (Array.isArray(root)) {
+                        if (!acc[firstProperty]) {
+                            // eslint-disable-next-line no-param-reassign
+                            acc[firstProperty] = [];
+                        }
+                        // eslint-disable-next-line no-param-reassign
+                        acc[firstProperty] = root.map((subItem) => (Object.assign(Object.assign({}, subItem), { [secondProperty]: applyTransform(subItem[secondProperty]) })));
+                    }
+                    else {
+                        // eslint-disable-next-line no-param-reassign
+                        acc[firstProperty] = Object.assign(Object.assign({}, root), { [secondProperty]: applyTransform(root[secondProperty]) });
+                    }
+                }
+                else if (item[fieldName]) {
+                    // eslint-disable-next-line no-param-reassign
+                    acc[fieldName] = applyTransform(item[fieldName]);
+                }
+                return acc;
+            }, {}));
+        }
+    });
+};
 exports.createItemsParser = createItemsParser;
-function yfmTransformer(lang, content, options = {}) {
+function yfmTransformer(lang, content, options = {}, renderInline = false) {
     const { plugins = [] } = options;
     const { html } = (0, utils_1.fullTransform)(content, {
         lang,
         plugins: [...plugins_1.default, ...plugins],
+        renderInline,
     });
     return html;
 }

package/build/cjs/text-transform/config.d.ts

@@ -1,8 +1,8 @@
 import { TitleItemProps } from '../models';
-import { Parser, Transformer, TransformerRaw, typografTransformer, yfmTransformer } from './common';
+import { Parser, Transformer, TransformerRaw, yfmTransformer } from './common';
 export declare const blockHeaderTransformer: ({
     fields: string[];
-    transformer: typeof typografTransformer;
+    transformer: typeof yfmTransformer;
     parser: (transformer: Transformer, title: TitleItemProps | string) => string | {
         text: string;
         navTitle?: string | undefined;
@@ -14,15 +14,18 @@ export declare const blockHeaderTransformer: ({
         custom?: import("react").ReactNode;
         onClick?: (() => void) | undefined;
     };
+    renderInline: boolean;
 } | {
     fields: string[];
     transformer: typeof yfmTransformer;
     parser?: undefined;
+    renderInline?: undefined;
 })[];
 interface BlockConfig {
     transformer: TransformerRaw;
     fields?: string[];
     parser?: Parser;
+    renderInline?: boolean;
 }
 export type BlocksConfig = Record<string, BlockConfig | BlockConfig[]>;
 export declare const config: BlocksConfig;