@gravity-ui/page-constructor 3.1.2 → 3.3.0

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

@@ -1,6 +1,11 @@
 export declare const ContentBase: {
     title: {
         oneOf: ({
+            type: string;
+            contentType: string;
+            optionName: string;
+        } | {
+            optionName: string;
             type: string;
             additionalProperties: boolean;
             required: string[];
@@ -20,14 +25,13 @@ export declare const ContentBase: {
                     type: string;
                 };
             };
-        } | {
-            type: string;
-            contentType: string;
+            contentType?: undefined;
         })[];
     };
     text: {
         type: string;
         contentType: string;
+        inputType: string;
     };
     additionalInfo: {
         type: string;
@@ -74,6 +78,11 @@ export declare const ContentBlock: {
             };
             title: {
                 oneOf: ({
+                    type: string;
+                    contentType: string;
+                    optionName: string;
+                } | {
+                    optionName: string;
                     type: string;
                     additionalProperties: boolean;
                     required: string[];
@@ -93,14 +102,13 @@ export declare const ContentBlock: {
                             type: string;
                         };
                     };
-                } | {
-                    type: string;
-                    contentType: string;
+                    contentType?: undefined;
                 })[];
             };
             text: {
                 type: string;
                 contentType: string;
+                inputType: string;
             };
             additionalInfo: {
                 type: string;

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

@@ -2,11 +2,19 @@ import { ButtonBlock, LinkProps, TitleProps, containerSizesArray, contentSizes,
 import { filteredArray } from '../../schema/validators/utils';
 export const ContentBase = {
     title: {
-        oneOf: [{ type: 'string', contentType: 'text' }, TitleProps],
+        oneOf: [
+            {
+                type: 'string',
+                contentType: 'text',
+                optionName: 'text',
+            },
+            Object.assign(Object.assign({}, TitleProps), { optionName: 'options' }),
+        ],
     },
     text: {
         type: 'string',
         contentType: 'yfm',
+        inputType: 'textarea',
     },
     additionalInfo: {
         type: 'string',

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

@@ -8,7 +8,8 @@ export declare const LayoutItem: {
                 type: string;
             };
             image: {
-                anyOf: ({
+                oneOf: ({
+                    optionName: string;
                     oneOf: ({
                         type: string;
                         properties: {
@@ -19,7 +20,10 @@ export declare const LayoutItem: {
                     } | {
                         type: string;
                         pattern: string;
+                        optionName: string;
                     })[];
+                    type?: undefined;
+                    items?: undefined;
                 } | {
                     type: string;
                     items: {
@@ -33,8 +37,10 @@ export declare const LayoutItem: {
                         } | {
                             type: string;
                             pattern: string;
+                            optionName: string;
                         })[];
                     };
+                    optionName: string;
                 })[];
             };
             video: {
@@ -49,7 +55,8 @@ export declare const LayoutItem: {
                         };
                     };
                     loop: {
-                        anyOf: ({
+                        oneOf: ({
+                            optionName: string;
                             type: string;
                             additionalProperties: boolean;
                             required: string[];
@@ -63,6 +70,7 @@ export declare const LayoutItem: {
                             };
                         } | {
                             type: string;
+                            optionName: string;
                         })[];
                     };
                     type: {
@@ -72,13 +80,13 @@ export declare const LayoutItem: {
                     muted: {
                         type: string;
                     };
-                    playing: {
+                    autoplay: {
                         type: string;
                     };
                     elapsedTime: {
                         type: string;
                     };
-                    playIcon: {
+                    playButton: {
                         type: string;
                         additionalProperties: boolean;
                         properties: {
@@ -116,6 +124,10 @@ export declare const LayoutItem: {
             };
             dataLens: {
                 oneOf: ({
+                    type: string;
+                    optionName: string;
+                } | {
+                    optionName: string;
                     type: string;
                     additionalProperties: boolean;
                     required: string[];
@@ -128,8 +140,6 @@ export declare const LayoutItem: {
                             enum: string[];
                         };
                     };
-                } | {
-                    type: string;
                 })[];
             };
             fullscreen: {
@@ -217,6 +227,11 @@ export declare const LayoutItem: {
         content: Partial<{
             title: {
                 oneOf: ({
+                    type: string;
+                    contentType: string;
+                    optionName: string;
+                } | {
+                    optionName: string;
                     type: string;
                     additionalProperties: boolean;
                     required: string[];
@@ -236,14 +251,13 @@ export declare const LayoutItem: {
                             type: string;
                         };
                     };
-                } | {
-                    type: string;
-                    contentType: string;
+                    contentType?: undefined;
                 })[];
             };
             text: {
                 type: string;
                 contentType: string;
+                inputType: string;
             };
             additionalInfo: {
                 type: string;

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

@@ -10,7 +10,8 @@ export declare const MediaCardBlock: {
                 type: string;
             };
             image: {
-                anyOf: ({
+                oneOf: ({
+                    optionName: string;
                     oneOf: ({
                         type: string;
                         properties: {
@@ -21,7 +22,10 @@ export declare const MediaCardBlock: {
                     } | {
                         type: string;
                         pattern: string;
+                        optionName: string;
                     })[];
+                    type?: undefined;
+                    items?: undefined;
                 } | {
                     type: string;
                     items: {
@@ -35,8 +39,10 @@ export declare const MediaCardBlock: {
                         } | {
                             type: string;
                             pattern: string;
+                            optionName: string;
                         })[];
                     };
+                    optionName: string;
                 })[];
             };
             video: {
@@ -51,7 +57,8 @@ export declare const MediaCardBlock: {
                         };
                     };
                     loop: {
-                        anyOf: ({
+                        oneOf: ({
+                            optionName: string;
                             type: string;
                             additionalProperties: boolean;
                             required: string[];
@@ -65,6 +72,7 @@ export declare const MediaCardBlock: {
                             };
                         } | {
                             type: string;
+                            optionName: string;
                         })[];
                     };
                     type: {
@@ -74,13 +82,13 @@ export declare const MediaCardBlock: {
                     muted: {
                         type: string;
                     };
-                    playing: {
+                    autoplay: {
                         type: string;
                     };
                     elapsedTime: {
                         type: string;
                     };
-                    playIcon: {
+                    playButton: {
                         type: string;
                         additionalProperties: boolean;
                         properties: {
@@ -118,6 +126,10 @@ export declare const MediaCardBlock: {
             };
             dataLens: {
                 oneOf: ({
+                    type: string;
+                    optionName: string;
+                } | {
+                    optionName: string;
                     type: string;
                     additionalProperties: boolean;
                     required: string[];
@@ -130,8 +142,6 @@ export declare const MediaCardBlock: {
                             enum: string[];
                         };
                     };
-                } | {
-                    type: string;
                 })[];
             };
             fullscreen: {

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

@@ -49,6 +49,7 @@ export declare const PriceDetailedBlock: {
             priceType: {
                 type: string;
                 enum: string[];
+                default: string;
             };
             numberGroupItems: {
                 type: string;

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

@@ -124,7 +124,10 @@ const PriceDetailsListProps = {
 };
 const PriceDetailsProps = {
     items: {
-        anyOf: [filteredArray(PriceDetailsListProps), filteredArray(PriceDetailsSettingsProps)],
+        oneOf: [
+            Object.assign(Object.assign({}, filteredArray(Object.assign({}, PriceDetailsListProps))), { optionName: 'marked-list' }),
+            Object.assign(Object.assign({}, filteredArray(Object.assign({}, PriceDetailsSettingsProps))), { optionName: 'settings' }),
+        ],
     },
 };
 const PriceItem = {
@@ -140,6 +143,7 @@ export const PriceDetailedBlock = {
         properties: Object.assign(Object.assign(Object.assign({}, BaseProps), AnimatableProps), { items: filteredArray(PriceItem), description: PriceDetailedDescriptionProps, details: PriceDetailedDetailsProps, priceType: {
                 type: 'string',
                 enum: PriceDetailedDetailsType,
+                default: 'settings',
             }, numberGroupItems: {
                 type: 'number',
                 enum: [3, 4, 5],

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

@@ -8,7 +8,7 @@ export declare const Quote: {
                 contentType: string;
             };
             image: {
-                oneOf: ({
+                oneOf: (({
                     oneOf: ({
                         type: string;
                         properties: {
@@ -19,12 +19,16 @@ export declare const Quote: {
                     } | {
                         type: string;
                         pattern: string;
+                        optionName: string;
                     })[];
-                } | {
+                } & {
+                    optionName: string;
+                }) | {
                     type: string;
                     additionalProperties: boolean;
                     required: import("../..").Theme[];
                     properties: {};
+                    optionName: string;
                 })[];
             };
             logo: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gravity-ui/page-constructor",
-  "version": "3.1.2",
+  "version": "3.3.0",
   "description": "Gravity UI Page Constructor",
   "license": "MIT",
   "repository": {
@@ -48,8 +48,10 @@
   "dependencies": {
     "@gravity-ui/i18n": "^1.0.0",
     "bem-cn-lite": "^4.0.0",
+    "final-form": "^4.20.9",
     "github-buttons": "2.23.0",
     "lodash": "^4.17.21",
+    "react-final-form": "^6.5.9",
     "react-player": "^2.9.0",
     "react-slick": "^0.28.1",
     "react-spring": "^9.3.0",
@@ -69,6 +71,7 @@
     "@commitlint/cli": "^17.1.2",
     "@commitlint/config-conventional": "^17.1.0",
     "@doc-tools/transform": "2.12.0",
+    "@gravity-ui/dynamic-forms": "^1.7.1",
     "@gravity-ui/eslint-config": "^2.0.0",
     "@gravity-ui/icons": "^2.1.0",
     "@gravity-ui/prettier-config": "^1.0.1",
@@ -85,6 +88,7 @@
     "@testing-library/react": "^13.4.0",
     "@testing-library/user-event": "^14.4.3",
     "@types/jest": "^29.2.4",
+    "@types/json-schema": "^7.0.12",
     "@types/lodash": "^4.14.176",
     "@types/react": "^18.0.27",
     "@types/react-dom": "^18.0.10",

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

@@ -30,6 +30,7 @@ export interface Childable {
     children?: SubBlock[];
 }
 export interface BlockBaseProps {
+    type: BlockType;
     index?: number;
     anchor?: AnchorProps;
     visible?: GridColumnSize;
@@ -244,14 +245,18 @@ export interface IconsBlockProps {
         src: string;
     }[];
 }
-export interface ContentLayoutBlockProps {
-    properties?: {
-        size?: ContentSize;
-        background?: BackgroundImageProps;
-        centered?: boolean;
-        theme?: ContentTheme;
-        textWidth?: ContentTextSize;
-    };
+interface ContentLayoutBlockParams {
+    size?: ContentSize;
+    background?: BackgroundImageProps;
+    centered?: boolean;
+    theme?: ContentTheme;
+    textWidth?: ContentTextSize;
+}
+export interface ContentLayoutBlockProps extends ContentLayoutBlockParams {
+    /**
+     * @deprecated Use params on top level instead
+     */
+    properties?: ContentLayoutBlockParams;
     textContent: ContentBlockProps;
     fileContent?: FileLinkProps[];
 }

package/server/models/constructor.d.ts

@@ -1,5 +1,5 @@
 import React, { PropsWithChildren } from 'react';
-import { Animatable, Block, BlockDecoratorProps, ConstructorItem, ThemedMediaProps, WithChildren } from './';
+import { Animatable, Block, BlockDecorationProps, ConstructorItem, ThemedMediaProps, WithChildren } from './';
 export interface PageData {
     content: PageContent;
 }
@@ -41,7 +41,7 @@ export interface CustomConfig {
     headers?: CustomItems;
     loadable?: LoadableConfig;
     decorators?: {
-        block?: ((props: BlockDecoratorProps) => React.ReactElement)[];
+        block?: ((props: BlockDecorationProps) => React.ReactElement)[];
     };
 }
 export {};

package/server/models/customization.d.ts

@@ -1,9 +1,4 @@
 import { PropsWithChildren } from 'react';
-export interface BlockDecorationProps extends PropsWithChildren {
-    id: string | number;
-}
-export interface BlockDecoratorProps extends PropsWithChildren {
-    id: string | number;
-    isHeader?: boolean;
-}
-export type BlockDecorator = (props: BlockDecoratorProps) => React.ReactElement;
+import { BlockBaseProps } from './constructor-items';
+export type BlockDecorationProps = Pick<BlockBaseProps, 'index' | 'type'> & PropsWithChildren;
+export type BlockDecorator = (props: BlockDecorationProps) => React.ReactElement;

package/server/models/navigation.d.ts

@@ -63,6 +63,7 @@ export interface HeaderData {
     leftItems: NavigationItemModel[];
     rightItems?: NavigationItemModel[];
     iconSize?: number;
+    withBorder?: boolean;
 }
 export interface FooterColumn {
     title: string;

package/build/cjs/editor/Components/AddBlock/AddBlock.d.ts

@@ -1,7 +0,0 @@
-import { PropsWithChildren } from 'react';
-import { Block } from '../../../models';
-export interface AddBlockProps {
-    onAdd: (data: Block) => void;
-}
-declare const AddBlock: ({ onAdd }: PropsWithChildren<AddBlockProps>) => JSX.Element;
-export default AddBlock;

package/build/cjs/editor/Components/EditBlock/EditBlock.d.ts

@@ -1,4 +0,0 @@
-import React from 'react';
-import { EditBlockProps } from '../../../editor/types';
-declare const _default: React.MemoExoticComponent<({ id, isHeader, activeBlockId, onDelete, onSelect, onCopy, onOrderChange, children, orderedBlocksCount, }: EditBlockProps) => JSX.Element>;
-export default _default;

package/build/cjs/editor/Components/EditBlock/EditBlock.js

@@ -1,32 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-const react_1 = tslib_1.__importStar(require("react"));
-const icons_1 = require("@gravity-ui/icons");
-const utils_1 = require("../../../utils");
-const b = (0, utils_1.block)('edit-block');
-const EditBlock = ({ id, isHeader, activeBlockId, onDelete, onSelect, onCopy, onOrderChange, children, orderedBlocksCount, }) => {
-    const ref = (0, react_1.useRef)(null);
-    const controlsActive = activeBlockId === id;
-    (0, react_1.useEffect)(() => {
-        var _a;
-        if (controlsActive && ref.current) {
-            (_a = ref.current) === null || _a === void 0 ? void 0 : _a.scrollIntoView({ behavior: 'smooth', block: 'center' });
-        }
-    }, [controlsActive]);
-    return (react_1.default.createElement("div", { className: b(), onClick: () => {
-            onSelect(id);
-        }, ref: ref },
-        react_1.default.createElement("div", { className: b('controls', { active: controlsActive, isHeader }) }, controlsActive && (react_1.default.createElement("div", { className: b('controls-content'), onClick: (e) => e.stopPropagation() },
-            typeof id === 'number' && (react_1.default.createElement(react_1.Fragment, null,
-                id > 0 && (react_1.default.createElement("div", { className: b('control'), onClick: () => onOrderChange(id, id - 1) },
-                    react_1.default.createElement(icons_1.ChevronUp, null))),
-                id < orderedBlocksCount - 1 && (react_1.default.createElement("div", { className: b('control'), onClick: () => onOrderChange(id, id + 1) },
-                    react_1.default.createElement(icons_1.ChevronDown, null))),
-                react_1.default.createElement("div", { className: b('control'), onClick: () => onCopy(id) },
-                    react_1.default.createElement(icons_1.Copy, null)))),
-            react_1.default.createElement("div", { className: b('control'), onClick: () => onDelete(id) },
-                react_1.default.createElement(icons_1.TrashBin, null))))),
-        children));
-};
-exports.default = react_1.default.memo(EditBlock);

package/build/cjs/editor/Containers/Editor.d.ts

@@ -1,2 +0,0 @@
-import { EditorProps } from '../types';
-export declare const Editor: ({ children, ...rest }: EditorProps) => JSX.Element;

package/build/cjs/editor/Containers/Editor.js

@@ -1,24 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Editor = void 0;
-const tslib_1 = require("tslib");
-const react_1 = tslib_1.__importStar(require("react"));
-const AddBlock_1 = tslib_1.__importDefault(require("../Components/AddBlock/AddBlock"));
-const EditBlock_1 = tslib_1.__importDefault(require("../Components/EditBlock/EditBlock"));
-const store_1 = require("../store");
-const utils_1 = require("../utils");
-const Editor = (_a) => {
-    var { children } = _a, rest = tslib_1.__rest(_a, ["children"]);
-    const { content, onAdd, editControlsProps } = (0, store_1.useEditorState)(rest);
-    const constructorProps = (0, react_1.useMemo)(() => {
-        const editControlsDecorator = (props) => (react_1.default.createElement(EditBlock_1.default, Object.assign({}, props, editControlsProps)));
-        return {
-            content,
-            custom: (0, utils_1.addCustomDecorator)(editControlsDecorator, rest.custom),
-        };
-    }, [editControlsProps, content, rest.custom]);
-    return (react_1.default.createElement("div", null,
-        children(constructorProps),
-        react_1.default.createElement(AddBlock_1.default, { onAdd: onAdd })));
-};
-exports.Editor = Editor;

package/build/esm/editor/Components/AddBlock/AddBlock.d.ts

@@ -1,8 +0,0 @@
-import { PropsWithChildren } from 'react';
-import { Block } from '../../../models';
-import './AddBlock.css';
-export interface AddBlockProps {
-    onAdd: (data: Block) => void;
-}
-declare const AddBlock: ({ onAdd }: PropsWithChildren<AddBlockProps>) => JSX.Element;
-export default AddBlock;

package/build/esm/editor/Components/EditBlock/EditBlock.d.ts

@@ -1,5 +0,0 @@
-import React from 'react';
-import { EditBlockProps } from '../../../editor/types';
-import './EditBlock.css';
-declare const _default: React.MemoExoticComponent<({ id, isHeader, activeBlockId, onDelete, onSelect, onCopy, onOrderChange, children, orderedBlocksCount, }: EditBlockProps) => JSX.Element>;
-export default _default;

package/build/esm/editor/Components/EditBlock/EditBlock.js

@@ -1,30 +0,0 @@
-import React, { Fragment, useEffect, useRef } from 'react';
-import { ChevronDown, ChevronUp, Copy, TrashBin } from '@gravity-ui/icons';
-import { block } from '../../../utils';
-import './EditBlock.css';
-const b = block('edit-block');
-const EditBlock = ({ id, isHeader, activeBlockId, onDelete, onSelect, onCopy, onOrderChange, children, orderedBlocksCount, }) => {
-    const ref = useRef(null);
-    const controlsActive = activeBlockId === id;
-    useEffect(() => {
-        var _a;
-        if (controlsActive && ref.current) {
-            (_a = ref.current) === null || _a === void 0 ? void 0 : _a.scrollIntoView({ behavior: 'smooth', block: 'center' });
-        }
-    }, [controlsActive]);
-    return (React.createElement("div", { className: b(), onClick: () => {
-            onSelect(id);
-        }, ref: ref },
-        React.createElement("div", { className: b('controls', { active: controlsActive, isHeader }) }, controlsActive && (React.createElement("div", { className: b('controls-content'), onClick: (e) => e.stopPropagation() },
-            typeof id === 'number' && (React.createElement(Fragment, null,
-                id > 0 && (React.createElement("div", { className: b('control'), onClick: () => onOrderChange(id, id - 1) },
-                    React.createElement(ChevronUp, null))),
-                id < orderedBlocksCount - 1 && (React.createElement("div", { className: b('control'), onClick: () => onOrderChange(id, id + 1) },
-                    React.createElement(ChevronDown, null))),
-                React.createElement("div", { className: b('control'), onClick: () => onCopy(id) },
-                    React.createElement(Copy, null)))),
-            React.createElement("div", { className: b('control'), onClick: () => onDelete(id) },
-                React.createElement(TrashBin, null))))),
-        children));
-};
-export default React.memo(EditBlock);

package/build/esm/editor/Containers/Editor.d.ts

@@ -1,2 +0,0 @@
-import { EditorProps } from '../types';
-export declare const Editor: ({ children, ...rest }: EditorProps) => JSX.Element;

package/build/esm/editor/Containers/Editor.js

@@ -1,20 +0,0 @@
-import { __rest } from "tslib";
-import React, { useMemo } from 'react';
-import AddBlock from '../Components/AddBlock/AddBlock';
-import EditBlock from '../Components/EditBlock/EditBlock';
-import { useEditorState } from '../store';
-import { addCustomDecorator } from '../utils';
-export const Editor = (_a) => {
-    var { children } = _a, rest = __rest(_a, ["children"]);
-    const { content, onAdd, editControlsProps } = useEditorState(rest);
-    const constructorProps = useMemo(() => {
-        const editControlsDecorator = (props) => (React.createElement(EditBlock, Object.assign({}, props, editControlsProps)));
-        return {
-            content,
-            custom: addCustomDecorator(editControlsDecorator, rest.custom),
-        };
-    }, [editControlsProps, content, rest.custom]);
-    return (React.createElement("div", null,
-        children(constructorProps),
-        React.createElement(AddBlock, { onAdd: onAdd })));
-};