@gravity-ui/page-constructor 3.0.0-alpha.5 → 4.0.0-beta.0

package/server/models/customization.d.ts

@@ -0,0 +1,9 @@
+import { PropsWithChildren } from 'react';
+export interface BlockDecorationProps extends PropsWithChildren {
+    id?: string;
+}
+export interface BlockDecoratorProps extends PropsWithChildren {
+    id: string | number;
+    isHeader?: boolean;
+}
+export type BlockDecorator = (props: BlockDecoratorProps) => React.ReactElement;

package/server/models/customization.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/server/models/index.d.ts

@@ -5,3 +5,4 @@ export * from './components';
 export * from './guards';
 export * from './react';
 export * from './navigation';
+export * from './customization';

package/server/models/index.js

@@ -21,3 +21,4 @@ __exportStar(require("./components"), exports);
 __exportStar(require("./guards"), exports);
 __exportStar(require("./react"), exports);
 __exportStar(require("./navigation"), exports);
+__exportStar(require("./customization"), exports);

package/server/text-transform/transformers.js

@@ -4,6 +4,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.contentTransformer = void 0;
+/* eslint-disable no-param-reassign */
+/* eslint-disable no-not-accumulator-reassign/no-not-accumulator-reassign */
 const lodash_1 = __importDefault(require("lodash"));
 const config_1 = require("./config");
 function transformBlocks(blocks, lang, customConfig = {}) {
@@ -15,7 +17,6 @@ function transformBlock(lang, blocksConfig, block) {
     const blockConfig = blocksConfig[block.type];
     if (block) {
         if ('randomOrder' in block && block.randomOrder && 'children' in block && block.children) {
-            // eslint-disable-next-line no-not-accumulator-reassign/no-not-accumulator-reassign, no-param-reassign
             block.children = lodash_1.default.shuffle(block.children);
         }
     }
@@ -28,11 +29,9 @@ function transformBlock(lang, blocksConfig, block) {
                 fields.forEach((field) => {
                     if (block[field]) {
                         if (parser) {
-                            // eslint-disable-next-line no-not-accumulator-reassign/no-not-accumulator-reassign, no-param-reassign
                             block[field] = parser(transformer, block[field]);
                         }
                         else if (typeof block[field] === 'string') {
-                            // eslint-disable-next-line no-not-accumulator-reassign/no-not-accumulator-reassign, no-param-reassign
                             block[field] = transformer(block[field]);
                         }
                     }
@@ -44,7 +43,6 @@ function transformBlock(lang, blocksConfig, block) {
         });
     }
     if ('children' in block && block.children) {
-        // eslint-disable-next-line no-not-accumulator-reassign/no-not-accumulator-reassign, no-param-reassign
         block.children = transformBlocks(block.children, lang, blocksConfig);
     }
     return block;

package/server/utils/blocks.d.ts

@@ -1,4 +1,4 @@
-import { CustomConfig, PCShareSocialNetwork, TextSize } from '../models';
+import { Block, CustomConfig, PCShareSocialNetwork, TextSize } from '../models';
 import { ConstructorBlock } from '../models/constructor';
 export declare function getHeaderTag(size: TextSize): "h1" | "h2" | "h4" | "h5";
 export declare function getBlockKey(block: ConstructorBlock, index: number): string;
@@ -8,4 +8,7 @@ export declare const getCustomItems: ({ blocks, headers, subBlocks }?: CustomCon
 };
 export declare const getCustomSubBlockTypes: (customBlocks?: CustomConfig) => string[];
 export declare const getCustomHeaderTypes: (customBlocks?: CustomConfig) => string[];
+export declare const getOrderedBlocks: (blocks: Block[], headerBlockTypes?: string[]) => Block[];
+export declare const getHeaderBlock: (blocks: Block[], headerBlockTypes?: string[]) => Block | undefined;
 export declare const getShareLink: (url: string, type: PCShareSocialNetwork, title?: string, text?: string) => string | undefined;
+export declare const getBlockIndexFromId: (blockId?: string) => number;

package/server/utils/blocks.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getShareLink = exports.getCustomHeaderTypes = exports.getCustomSubBlockTypes = exports.getCustomItems = exports.getCustomBlockTypes = exports.getBlockKey = exports.getHeaderTag = void 0;
+exports.getBlockIndexFromId = exports.getShareLink = exports.getHeaderBlock = exports.getOrderedBlocks = exports.getCustomHeaderTypes = exports.getCustomSubBlockTypes = exports.getCustomItems = exports.getCustomBlockTypes = exports.getBlockKey = exports.getHeaderTag = void 0;
 const models_1 = require("../models");
 function getHeaderTag(size) {
     switch (size) {
@@ -46,6 +46,14 @@ const getShareUrlWithParams = (url, params = {}) => {
     });
     return result.toString();
 };
+const getOrderedBlocks = (blocks, headerBlockTypes = []) => {
+    return blocks.filter(({ type }) => !headerBlockTypes.includes(type));
+};
+exports.getOrderedBlocks = getOrderedBlocks;
+const getHeaderBlock = (blocks, headerBlockTypes = []) => {
+    return blocks.find(({ type }) => headerBlockTypes.includes(type));
+};
+exports.getHeaderBlock = getHeaderBlock;
 const getShareLink = (url, type, title, text) => {
     // https://github.com/bradvin/social-share-urls
     switch (type) {
@@ -75,3 +83,5 @@ const getShareLink = (url, type, title, text) => {
     }
 };
 exports.getShareLink = getShareLink;
+const getBlockIndexFromId = (blockId) => { var _a; return Number((_a = blockId === null || blockId === void 0 ? void 0 : blockId.split('-')) === null || _a === void 0 ? void 0 : _a.slice(-1).pop()); };
+exports.getBlockIndexFromId = getBlockIndexFromId;

package/styles/styles.css

@@ -1,202 +1,6 @@
 @charset "UTF-8";
 @import '~@gravity-ui/uikit/styles/styles.css';
 @import '~@doc-tools/transform/dist/css/yfm.css';
-@font-face {
-  font-family: "YS Display";
-  src: url("https://yastatic.net/s3/home/fonts/ys/1/display-thin.woff2") format("woff2"), url("https://yastatic.net/s3/home/fonts/ys/1/display-thin.woff") format("woff");
-  font-weight: 100;
-  font-style: normal;
-  font-display: swap;
-}
-@font-face {
-  font-family: "YS Display";
-  src: url("https://yastatic.net/s3/home/fonts/ys/1/display-light.woff2") format("woff2"), url("https://yastatic.net/s3/home/fonts/ys/1/display-light.woff") format("woff");
-  font-weight: 300;
-  font-style: normal;
-  font-display: swap;
-}
-@font-face {
-  font-family: "YS Display";
-  src: url("https://yastatic.net/s3/home/fonts/ys/1/display-regular.woff2") format("woff2"), url("https://yastatic.net/s3/home/fonts/ys/1/display-regular.woff") format("woff");
-  font-weight: 400;
-  font-style: normal;
-  font-display: swap;
-}
-@font-face {
-  font-family: "YS Display";
-  src: url("https://yastatic.net/s3/home/fonts/ys/1/display-medium.woff2") format("woff2"), url("https://yastatic.net/s3/home/fonts/ys/1/display-medium.woff") format("woff");
-  font-weight: 500;
-  font-style: normal;
-  font-display: swap;
-}
-@font-face {
-  font-family: "YS Display";
-  src: url("https://yastatic.net/s3/home/fonts/ys/1/display-bold.woff2") format("woff2"), url("https://yastatic.net/s3/home/fonts/ys/1/display-bold.woff") format("woff");
-  font-weight: 700;
-  font-style: normal;
-  font-display: swap;
-}
-@font-face {
-  font-family: "YS Display";
-  src: url("https://yastatic.net/s3/home/fonts/ys/1/display-heavy.woff2") format("woff2"), url("https://yastatic.net/s3/home/fonts/ys/1/display-heavy.woff") format("woff");
-  font-weight: 900;
-  font-style: normal;
-  font-display: swap;
-}
-@font-face {
-  font-family: "YS Text";
-  src: url("https://yastatic.net/s3/home/fonts/ys/1/text-light.woff2") format("woff2"), url("https://yastatic.net/s3/home/fonts/ys/1/text-light.woff") format("woff");
-  font-weight: 300;
-  font-style: normal;
-  font-display: swap;
-}
-@font-face {
-  font-family: "YS Text";
-  src: url("https://yastatic.net/s3/home/fonts/ys/1/text-light-italic.woff2") format("woff2"), url("https://yastatic.net/s3/home/fonts/ys/1/text-light-italic.woff") format("woff");
-  font-weight: 300;
-  font-style: italic;
-  font-display: swap;
-}
-@font-face {
-  font-family: "YS Text";
-  src: url("https://yastatic.net/s3/home/fonts/ys/1/text-regular.woff2") format("woff2"), url("https://yastatic.net/s3/home/fonts/ys/1/text-regular.woff") format("woff");
-  font-weight: 400;
-  font-style: normal;
-  font-display: swap;
-}
-@font-face {
-  font-family: "YS Text";
-  src: url("https://yastatic.net/s3/home/fonts/ys/1/text-regular-italic.woff2") format("woff2"), url("https://yastatic.net/s3/home/fonts/ys/1/text-regular-italic.woff") format("woff");
-  font-weight: 400;
-  font-style: italic;
-  font-display: swap;
-}
-@font-face {
-  font-family: "YS Text";
-  src: url("https://yastatic.net/s3/home/fonts/ys/1/text-medium.woff2") format("woff2"), url("https://yastatic.net/s3/home/fonts/ys/1/text-medium.woff") format("woff");
-  font-weight: 500;
-  font-style: normal;
-  font-display: swap;
-}
-@font-face {
-  font-family: "YS Text";
-  src: url("https://yastatic.net/s3/home/fonts/ys/1/text-medium-italic.woff2") format("woff2"), url("https://yastatic.net/s3/home/fonts/ys/1/text-medium-italic.woff") format("woff");
-  font-weight: 500;
-  font-style: italic;
-  font-display: swap;
-}
-@font-face {
-  font-family: "YS Text";
-  src: url("https://yastatic.net/s3/home/fonts/ys/1/text-bold.woff2") format("woff2"), url("https://yastatic.net/s3/home/fonts/ys/1/text-bold.woff") format("woff");
-  font-weight: 700;
-  font-style: normal;
-  font-display: swap;
-}
-@font-face {
-  font-family: "YS Text";
-  src: url("https://yastatic.net/s3/home/fonts/ys/1/text-bold-italic.woff2") format("woff2"), url("https://yastatic.net/s3/home/fonts/ys/1/text-bold-italic.woff") format("woff");
-  font-weight: 700;
-  font-style: italic;
-  font-display: swap;
-}
-.YSDisplay-Thin {
-  font-family: "YS Display", sans-serif;
-  font-weight: 100;
-  font-style: normal;
-  font-stretch: normal;
-}
-
-.YSDisplay-Light {
-  font-family: "YS Display", sans-serif;
-  font-weight: 300;
-  font-style: normal;
-  font-stretch: normal;
-}
-
-.YSDisplay-Regular {
-  font-family: "YS Display", sans-serif;
-  font-weight: 400;
-  font-style: normal;
-  font-stretch: normal;
-}
-
-.YSDisplay-Medium {
-  font-family: "YS Display", sans-serif;
-  font-weight: 500;
-  font-style: normal;
-  font-stretch: normal;
-}
-
-.YSDisplay-Bold {
-  font-family: "YS Display", sans-serif;
-  font-weight: 700;
-  font-style: normal;
-  font-stretch: normal;
-}
-
-.YSDisplay-Heavy {
-  font-family: "YS Display", sans-serif;
-  font-weight: 900;
-  font-style: normal;
-  font-stretch: normal;
-}
-
-.YSText-Light {
-  font-family: "YS Text", sans-serif;
-  font-weight: 300;
-  font-style: normal;
-  font-stretch: normal;
-}
-
-.YSText-LightItalic {
-  font-family: "YS Text", sans-serif;
-  font-weight: 300;
-  font-style: italic;
-  font-stretch: normal;
-}
-
-.YSText-Regular {
-  font-family: "YS Text", sans-serif;
-  font-weight: 400;
-  font-style: normal;
-  font-stretch: normal;
-}
-
-.YSText-RegularItalic {
-  font-family: "YS Text", sans-serif;
-  font-weight: 400;
-  font-style: italic;
-  font-stretch: normal;
-}
-
-.YSText-Medium {
-  font-family: "YS Text", sans-serif;
-  font-weight: 500;
-  font-style: normal;
-  font-stretch: normal;
-}
-
-.YSText-MediumItalic {
-  font-family: "YS Text", sans-serif;
-  font-weight: 500;
-  font-style: italic;
-  font-stretch: normal;
-}
-
-.YSText-Bold {
-  font-family: "YS Text", sans-serif;
-  font-weight: 700;
-  font-style: normal;
-  font-stretch: normal;
-}
-
-.YSText-BoldItalic {
-  font-family: "YS Text", sans-serif;
-  font-weight: 700;
-  font-style: italic;
-  font-stretch: normal;
-}
-
 /* use this for style redefinitions to awoid problems with
 unpredictable css rules order in build */
 /* use this for style redefinitions to awoid problems with

package/styles/styles.scss

@@ -1,5 +1,4 @@
 @import '~@gravity-ui/uikit/styles/styles.css';
-@import './fonts.scss';
 @import './mixins.scss';
 @import './variables.scss';
 @import './yfm.scss';

package/build/cjs/components/FullscreenMedia/FullScreenMedia.d.ts

@@ -1,9 +0,0 @@
-/// <reference types="react" />
-import { MediaAllProps } from '../Media/Media';
-export type ChildMediaRenderProps = Pick<MediaAllProps, 'fullScreen' | 'imageClassName' | 'videoClassName' | 'youtubeClassName' | 'className'>;
-export interface FullScreenMediaProps {
-    showFullScreenIcon?: boolean;
-    children: (props?: ChildMediaRenderProps) => JSX.Element;
-}
-declare const FullScreenMedia: ({ children, showFullScreenIcon }: FullScreenMediaProps) => JSX.Element;
-export default FullScreenMedia;

package/build/cjs/icons/FullScreen.d.ts

@@ -1,2 +0,0 @@
-import React from 'react';
-export declare const FullScreen: React.FC<React.SVGProps<SVGSVGElement>>;

package/build/esm/components/FullscreenMedia/FullScreenMedia.d.ts

@@ -1,10 +0,0 @@
-/// <reference types="react" />
-import { MediaAllProps } from '../Media/Media';
-import './FullScreenMedia.css';
-export type ChildMediaRenderProps = Pick<MediaAllProps, 'fullScreen' | 'imageClassName' | 'videoClassName' | 'youtubeClassName' | 'className'>;
-export interface FullScreenMediaProps {
-    showFullScreenIcon?: boolean;
-    children: (props?: ChildMediaRenderProps) => JSX.Element;
-}
-declare const FullScreenMedia: ({ children, showFullScreenIcon }: FullScreenMediaProps) => JSX.Element;
-export default FullScreenMedia;

package/build/esm/icons/FullScreen.d.ts

@@ -1,2 +0,0 @@
-import React from 'react';
-export declare const FullScreen: React.FC<React.SVGProps<SVGSVGElement>>;

package/styles/fonts.scss

@@ -1,223 +0,0 @@
-@font-face {
-    font-family: 'YS Display';
-    src: url('https://yastatic.net/s3/home/fonts/ys/1/display-thin.woff2') format('woff2'),
-        url('https://yastatic.net/s3/home/fonts/ys/1/display-thin.woff') format('woff');
-    font-weight: 100;
-    font-style: normal;
-    font-display: swap;
-}
-
-@font-face {
-    font-family: 'YS Display';
-    src: url('https://yastatic.net/s3/home/fonts/ys/1/display-light.woff2') format('woff2'),
-        url('https://yastatic.net/s3/home/fonts/ys/1/display-light.woff') format('woff');
-    font-weight: 300;
-    font-style: normal;
-    font-display: swap;
-}
-
-@font-face {
-    font-family: 'YS Display';
-    src: url('https://yastatic.net/s3/home/fonts/ys/1/display-regular.woff2') format('woff2'),
-        url('https://yastatic.net/s3/home/fonts/ys/1/display-regular.woff') format('woff');
-    font-weight: 400;
-    font-style: normal;
-    font-display: swap;
-}
-
-@font-face {
-    font-family: 'YS Display';
-    src: url('https://yastatic.net/s3/home/fonts/ys/1/display-medium.woff2') format('woff2'),
-        url('https://yastatic.net/s3/home/fonts/ys/1/display-medium.woff') format('woff');
-    font-weight: 500;
-    font-style: normal;
-    font-display: swap;
-}
-
-@font-face {
-    font-family: 'YS Display';
-    src: url('https://yastatic.net/s3/home/fonts/ys/1/display-bold.woff2') format('woff2'),
-        url('https://yastatic.net/s3/home/fonts/ys/1/display-bold.woff') format('woff');
-    font-weight: 700;
-    font-style: normal;
-    font-display: swap;
-}
-
-@font-face {
-    font-family: 'YS Display';
-    src: url('https://yastatic.net/s3/home/fonts/ys/1/display-heavy.woff2') format('woff2'),
-        url('https://yastatic.net/s3/home/fonts/ys/1/display-heavy.woff') format('woff');
-    font-weight: 900;
-    font-style: normal;
-    font-display: swap;
-}
-
-@font-face {
-    font-family: 'YS Text';
-    src: url('https://yastatic.net/s3/home/fonts/ys/1/text-light.woff2') format('woff2'),
-        url('https://yastatic.net/s3/home/fonts/ys/1/text-light.woff') format('woff');
-    font-weight: 300;
-    font-style: normal;
-    font-display: swap;
-}
-
-@font-face {
-    font-family: 'YS Text';
-    src: url('https://yastatic.net/s3/home/fonts/ys/1/text-light-italic.woff2') format('woff2'),
-        url('https://yastatic.net/s3/home/fonts/ys/1/text-light-italic.woff') format('woff');
-    font-weight: 300;
-    font-style: italic;
-    font-display: swap;
-}
-
-@font-face {
-    font-family: 'YS Text';
-    src: url('https://yastatic.net/s3/home/fonts/ys/1/text-regular.woff2') format('woff2'),
-        url('https://yastatic.net/s3/home/fonts/ys/1/text-regular.woff') format('woff');
-    font-weight: 400;
-    font-style: normal;
-    font-display: swap;
-}
-
-@font-face {
-    font-family: 'YS Text';
-    src: url('https://yastatic.net/s3/home/fonts/ys/1/text-regular-italic.woff2') format('woff2'),
-        url('https://yastatic.net/s3/home/fonts/ys/1/text-regular-italic.woff') format('woff');
-    font-weight: 400;
-    font-style: italic;
-    font-display: swap;
-}
-
-@font-face {
-    font-family: 'YS Text';
-    src: url('https://yastatic.net/s3/home/fonts/ys/1/text-medium.woff2') format('woff2'),
-        url('https://yastatic.net/s3/home/fonts/ys/1/text-medium.woff') format('woff');
-    font-weight: 500;
-    font-style: normal;
-    font-display: swap;
-}
-
-@font-face {
-    font-family: 'YS Text';
-    src: url('https://yastatic.net/s3/home/fonts/ys/1/text-medium-italic.woff2') format('woff2'),
-        url('https://yastatic.net/s3/home/fonts/ys/1/text-medium-italic.woff') format('woff');
-    font-weight: 500;
-    font-style: italic;
-    font-display: swap;
-}
-
-@font-face {
-    font-family: 'YS Text';
-    src: url('https://yastatic.net/s3/home/fonts/ys/1/text-bold.woff2') format('woff2'),
-        url('https://yastatic.net/s3/home/fonts/ys/1/text-bold.woff') format('woff');
-    font-weight: 700;
-    font-style: normal;
-    font-display: swap;
-}
-
-@font-face {
-    font-family: 'YS Text';
-    src: url('https://yastatic.net/s3/home/fonts/ys/1/text-bold-italic.woff2') format('woff2'),
-        url('https://yastatic.net/s3/home/fonts/ys/1/text-bold-italic.woff') format('woff');
-    font-weight: 700;
-    font-style: italic;
-    font-display: swap;
-}
-
-.YSDisplay-Thin {
-    font-family: 'YS Display', sans-serif;
-    font-weight: 100;
-    font-style: normal;
-    font-stretch: normal;
-}
-
-.YSDisplay-Light {
-    font-family: 'YS Display', sans-serif;
-    font-weight: 300;
-    font-style: normal;
-    font-stretch: normal;
-}
-
-.YSDisplay-Regular {
-    font-family: 'YS Display', sans-serif;
-    font-weight: 400;
-    font-style: normal;
-    font-stretch: normal;
-}
-
-.YSDisplay-Medium {
-    font-family: 'YS Display', sans-serif;
-    font-weight: 500;
-    font-style: normal;
-    font-stretch: normal;
-}
-
-.YSDisplay-Bold {
-    font-family: 'YS Display', sans-serif;
-    font-weight: 700;
-    font-style: normal;
-    font-stretch: normal;
-}
-
-.YSDisplay-Heavy {
-    font-family: 'YS Display', sans-serif;
-    font-weight: 900;
-    font-style: normal;
-    font-stretch: normal;
-}
-
-.YSText-Light {
-    font-family: 'YS Text', sans-serif;
-    font-weight: 300;
-    font-style: normal;
-    font-stretch: normal;
-}
-
-.YSText-LightItalic {
-    font-family: 'YS Text', sans-serif;
-    font-weight: 300;
-    font-style: italic;
-    font-stretch: normal;
-}
-
-.YSText-Regular {
-    font-family: 'YS Text', sans-serif;
-    font-weight: 400;
-    font-style: normal;
-    font-stretch: normal;
-}
-
-.YSText-RegularItalic {
-    font-family: 'YS Text', sans-serif;
-    font-weight: 400;
-    font-style: italic;
-    font-stretch: normal;
-}
-
-.YSText-Medium {
-    font-family: 'YS Text', sans-serif;
-    font-weight: 500;
-    font-style: normal;
-    font-stretch: normal;
-}
-
-.YSText-MediumItalic {
-    font-family: 'YS Text', sans-serif;
-    font-weight: 500;
-    font-style: italic;
-    font-stretch: normal;
-}
-
-.YSText-Bold {
-    font-family: 'YS Text', sans-serif;
-    font-weight: 700;
-    font-style: normal;
-    font-stretch: normal;
-}
-
-.YSText-BoldItalic {
-    font-family: 'YS Text', sans-serif;
-    font-weight: 700;
-    font-style: italic;
-    font-stretch: normal;
-}