@gravity-ui/page-constructor 3.5.0-alpha.0 → 3.6.0

package/build/cjs/editor/dynamic-forms-custom/parser/index.js

@@ -0,0 +1,188 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+/* eslint-disable no-param-reassign */
+/* eslint-disable no-not-accumulator-reassign/no-not-accumulator-reassign */
+const dynamic_forms_1 = require("@gravity-ui/dynamic-forms");
+const models_1 = require("../../../models");
+const detect_1 = require("./detect");
+const views_1 = require("./views");
+class FormSpecParser {
+    constructor() {
+        this.schema = {};
+        this.definitions = {};
+        this.getChildrenSpec = (data) => {
+            var _a, _b, _c;
+            const childrenType = (_c = (_b = (_a = data.items) === null || _a === void 0 ? void 0 : _a.$ref) === null || _b === void 0 ? void 0 : _b.split('/')) === null || _c === void 0 ? void 0 : _c.pop();
+            return this.definitions[childrenType];
+        };
+        this.getRequiredProperties = (data) => Array.isArray(data.required) ? data.required : [];
+        this.childrenParser = ({ data, name, required }) => {
+            const childSpec = this.getChildrenSpec(data);
+            const properties = childSpec &&
+                Object.entries(childSpec).reduce((parsedChildSpecProperties, [childName, childSchema]) => {
+                    const childRequiredProperties = this.getRequiredProperties(childSchema);
+                    const childProperies = childSchema.properties &&
+                        Object.entries(childSchema.properties).reduce((parsedChildProperties, [childPropertyName, childPropertyData]) => {
+                            parsedChildProperties[childPropertyName] = this.parseSchemaProperty({
+                                data: childPropertyData,
+                                name: childPropertyName,
+                                required: childRequiredProperties.includes(childPropertyName),
+                            });
+                            return parsedChildProperties;
+                        }, {});
+                    const childJsonSchema = Object.assign(Object.assign({}, childSchema), { properties: Object.assign(Object.assign({}, childSchema.properties), { type: {
+                                type: dynamic_forms_1.SpecTypes.String,
+                                enum: [childName],
+                            } }) });
+                    parsedChildSpecProperties[childName] = {
+                        type: dynamic_forms_1.SpecTypes.Array,
+                        items: Object.assign(Object.assign({}, childSchema), { type: dynamic_forms_1.SpecTypes.Object, properties: Object.assign(Object.assign({}, childProperies), { type: {
+                                    type: dynamic_forms_1.SpecTypes.String,
+                                    defaultValue: childName,
+                                    viewSpec: {
+                                        type: 'hidden',
+                                    },
+                                } }), viewSpec: childProperies &&
+                                (0, views_1.getObjectViewSpec)({
+                                    properties: childProperies,
+                                    layoutTitle: childName,
+                                }), __schema: childJsonSchema }),
+                        required: false,
+                        viewSpec: (0, views_1.getArrayViewSpec)({ layoutTitle: childName }),
+                        __schema: {
+                            type: dynamic_forms_1.SpecTypes.Array,
+                            items: childJsonSchema,
+                        },
+                    };
+                    return parsedChildSpecProperties;
+                }, {});
+            return {
+                type: dynamic_forms_1.SpecTypes.Object,
+                properties,
+                viewSpec: {
+                    type: 'oneof_custom',
+                    layout: 'row',
+                    layoutTitle: name,
+                    oneOfParams: {
+                        toggler: 'select',
+                    },
+                },
+                required,
+            };
+        };
+        this.oneOfParser = ({ data, name, required }) => {
+            const requiredProperties = this.getRequiredProperties(data);
+            const properties = data.oneOf &&
+                data.oneOf.reduce((result, propertyData, index) => {
+                    const propertyName = (propertyData === null || propertyData === void 0 ? void 0 : propertyData.optionName)
+                        ? propertyData === null || propertyData === void 0 ? void 0 : propertyData.optionName
+                        : `${name}_${index}`;
+                    result[propertyName] = this.parseSchemaProperty({
+                        data: propertyData,
+                        name: propertyName,
+                        required: requiredProperties.includes(propertyName),
+                    });
+                    return result;
+                }, {});
+            return {
+                type: dynamic_forms_1.SpecTypes.Object,
+                properties,
+                required,
+                viewSpec: (0, views_1.getOneOfViewSpec)({ layoutTitle: name }),
+            };
+        };
+        this.arrayParser = ({ data, name }) => {
+            const items = data.items && this.parseSchemaProperty({ data: data.items, name });
+            return Object.assign(Object.assign({}, data), { type: dynamic_forms_1.SpecTypes.Array, items, viewSpec: (0, views_1.getArrayViewSpec)({ layoutTitle: name }) });
+        };
+        this.objectParser = ({ data, name, required }) => {
+            const requiredProperties = this.getRequiredProperties(data);
+            const properties = data.properties &&
+                Object.entries(data.properties).reduce((result, [propertyName, propertyData]) => {
+                    result[propertyName] = this.parseSchemaProperty({
+                        data: propertyData,
+                        name: propertyName,
+                        required: requiredProperties.includes(propertyName),
+                    });
+                    return result;
+                }, {});
+            return Object.assign(Object.assign({}, data), { type: dynamic_forms_1.SpecTypes.Object, properties, viewSpec: (0, views_1.getObjectViewSpec)({ properties, layoutTitle: name }), required });
+        };
+        this.primitiveParser = ({ data, name, required }) => {
+            return Object.assign(Object.assign({}, data), { type: data.type, required, defaultValue: data.default, viewSpec: (0, views_1.getPrimitiveViewSpec)({ layoutTitle: name, data }), validator: 'base' });
+        };
+        //eslint-disable-next-line @typescript-eslint/member-ordering
+        this.schemaParserMap = {
+            [detect_1.ParserType.Object]: this.objectParser,
+            [detect_1.ParserType.Array]: this.arrayParser,
+            [detect_1.ParserType.Primitive]: this.primitiveParser,
+            [detect_1.ParserType.OneOf]: this.oneOfParser,
+            [detect_1.ParserType.Children]: this.childrenParser,
+        };
+    }
+    /**
+     * Transforms page-constructor json schema into dynamic-forms specs for each block
+     *
+     * @param schema {Schema} - page-constructor json schema
+     * @returns {FormSpecs} - object containig dynamic-forms specs for each constructor block
+     */
+    parse(schema) {
+        this.init(schema);
+        return this.getFormSpec();
+    }
+    parseSchemaProperty({ data, name, required }) {
+        const parserType = (0, detect_1.detectParserType)(data);
+        const parser = this.schemaParserMap[parserType];
+        return Object.assign(Object.assign({}, parser({ data, name, required })), { 
+            //save json schema from constructor to compare with incoming intial data inside oneOf form fields
+            __schema: data });
+    }
+    getBlocksSpec() {
+        const blocks = this.definitions.children;
+        return Object.values(models_1.BlockType).reduce((result, blockName) => {
+            result[blockName] = this.parseSchemaProperty({
+                name: blockName,
+                data: Object.assign({}, blocks[blockName]),
+                required: true,
+            });
+            return result;
+        }, {});
+    }
+    getPageSpec() {
+        var _a;
+        // eslint-disable-next-line @typescript-eslint/no-unused-vars
+        const _b = ((_a = this.schema) === null || _a === void 0 ? void 0 : _a.properties) || {}, { blocks } = _b, pageSchema = tslib_1.__rest(_b, ["blocks"]);
+        const requiredProperties = this.getRequiredProperties(this.schema);
+        const properties = Object.entries(pageSchema).reduce((result, [propertyName, propertyData]) => {
+            result[propertyName] = this.parseSchemaProperty({
+                name: propertyName,
+                data: propertyData,
+                required: requiredProperties.includes(propertyName),
+            });
+            return result;
+        }, {});
+        return {
+            type: dynamic_forms_1.SpecTypes.Object,
+            properties,
+            viewSpec: (0, views_1.getObjectViewSpec)({ properties, layout: 'section' }),
+            required: true,
+        };
+    }
+    getFormSpec() {
+        return {
+            blocks: this.getBlocksSpec(),
+            page: this.getPageSpec(),
+        };
+    }
+    init(schema) {
+        this.schema = schema;
+        if (schema.definitions) {
+            this.definitions = Object.entries(schema.definitions).reduce((result, [childType, childSpec]) => {
+                result[childType] = childSpec === null || childSpec === void 0 ? void 0 : childSpec.selectCases;
+                return result;
+            }, {});
+        }
+    }
+}
+exports.default = new FormSpecParser();

package/build/cjs/editor/dynamic-forms-custom/parser/types.d.ts

@@ -0,0 +1,29 @@
+import { Spec as DynamicFormSpec, ObjectSpec } from '@gravity-ui/dynamic-forms';
+import { BlockType } from '../../../models';
+import { Schema } from '../../../schema';
+export type OneOfSpec = {
+    oneOf: DynamicFormSpec[];
+    viewSpec: ObjectSpec['viewSpec'];
+};
+export type CustomObjectSpec = Omit<ObjectSpec, 'properties'> & {
+    properties: Record<string, CustomSpec>;
+};
+export interface SpecCustomProps {
+    disabled?: boolean;
+    inputType?: string;
+    __schema?: Schema;
+}
+export type Spec = Exclude<DynamicFormSpec, 'ObjectSpec'> | CustomObjectSpec | OneOfSpec;
+export type CustomSpec = Spec & SpecCustomProps;
+export type BlocksSpec = Record<BlockType, CustomSpec>;
+export type PageSpec = CustomSpec;
+export interface FormSpecs {
+    blocks: BlocksSpec;
+    page: PageSpec;
+}
+export interface SchemaParserParams {
+    data: Schema;
+    name: string;
+    required?: Schema['required'];
+}
+export type SchemaParser = (params: SchemaParserParams) => CustomSpec;

package/build/cjs/editor/dynamic-forms-custom/parser/types.js

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

package/build/cjs/editor/dynamic-forms-custom/parser/views.d.ts

@@ -0,0 +1,37 @@
+import { Schema } from '../../../schema';
+import { CustomObjectSpec, CustomSpec } from './types';
+interface BaseParams {
+    layoutTitle?: string;
+}
+interface GetObjectViewSpecParams extends BaseParams, Partial<Extract<CustomSpec, CustomObjectSpec>> {
+    layout?: string;
+}
+type GetPrimitiveViewSpecParams = BaseParams & Schema;
+export declare const getOneOfViewSpec: ({ layoutTitle }: BaseParams) => {
+    type: string;
+    layout: string;
+    layoutTitle: string | undefined;
+    oneOfParams: {
+        toggler: "select";
+    };
+};
+export declare const getObjectViewSpec: ({ properties, disabled, layoutTitle, layout, }: GetObjectViewSpecParams) => {
+    layoutTitle: string | undefined;
+    type: string;
+    layout: string;
+    order: string[] | undefined;
+    disabled: boolean | undefined;
+};
+export declare const getArrayViewSpec: ({ layoutTitle }: BaseParams) => {
+    layoutTitle: string | undefined;
+    type: string;
+    layout: string;
+    layoutOpen: boolean;
+    itemLabel: string;
+};
+export declare const getPrimitiveViewSpec: ({ layoutTitle, ...data }: GetPrimitiveViewSpecParams) => {
+    layout: string;
+    type: any;
+    layoutTitle: string | undefined;
+};
+export {};

package/build/cjs/editor/dynamic-forms-custom/parser/views.js

@@ -0,0 +1,46 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getPrimitiveViewSpec = exports.getArrayViewSpec = exports.getObjectViewSpec = exports.getOneOfViewSpec = void 0;
+const tslib_1 = require("tslib");
+const getOneOfViewSpec = ({ layoutTitle }) => {
+    return {
+        type: 'oneof_custom',
+        layout: 'row',
+        layoutTitle,
+        oneOfParams: {
+            toggler: 'select',
+        },
+    };
+};
+exports.getOneOfViewSpec = getOneOfViewSpec;
+const getObjectViewSpec = ({ properties, disabled, layoutTitle, layout = 'accordeon', }) => {
+    return {
+        layoutTitle,
+        type: 'base',
+        layout,
+        order: properties && Object.keys(properties).sort(),
+        disabled,
+    };
+};
+exports.getObjectViewSpec = getObjectViewSpec;
+const getArrayViewSpec = ({ layoutTitle }) => ({
+    layoutTitle,
+    type: 'base',
+    layout: 'accordeon',
+    layoutOpen: true,
+    itemLabel: 'Add Item',
+});
+exports.getArrayViewSpec = getArrayViewSpec;
+const getPrimitiveViewSpec = (_a) => {
+    var { layoutTitle } = _a, data = tslib_1.__rest(_a, ["layoutTitle"]);
+    let type = (data === null || data === void 0 ? void 0 : data.inputType) || 'base';
+    if (data && 'enum' in data && data.enum) {
+        type = 'select';
+    }
+    return {
+        layout: 'row',
+        type,
+        layoutTitle,
+    };
+};
+exports.getPrimitiveViewSpec = getPrimitiveViewSpec;

package/build/cjs/editor/hooks/useFormSpec.d.ts

@@ -0,0 +1,2 @@
+import { SchemaCustomConfig } from '../../schema';
+export default function useFormSpec(customSchema?: SchemaCustomConfig): import("../dynamic-forms-custom/parser/types").FormSpecs;

package/build/cjs/editor/hooks/useFormSpec.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const react_1 = require("react");
+const schema_1 = require("../../schema");
+const parser_1 = tslib_1.__importDefault(require("../dynamic-forms-custom/parser"));
+function useFormSpec(customSchema) {
+    return (0, react_1.useMemo)(() => {
+        const schema = (0, schema_1.generateDefaultSchema)(customSchema);
+        return parser_1.default.parse(schema);
+    }, [customSchema]);
+}
+exports.default = useFormSpec;

package/build/cjs/editor/hooks/usePreviousValue.d.ts

@@ -0,0 +1 @@
+export default function usePreviousValue<T>(value: T): T | undefined;

package/build/cjs/editor/hooks/usePreviousValue.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = require("react");
+function usePreviousValue(value) {
+    const ref = (0, react_1.useRef)();
+    (0, react_1.useEffect)(() => {
+        ref.current = value;
+    }, [value]);
+    return ref.current;
+}
+exports.default = usePreviousValue;

package/build/cjs/editor/index.d.ts

@@ -1,2 +1,2 @@
-export { Editor } from './Containers/Editor';
+export { Editor } from './containers/Editor/Editor';
 export * from './types';

package/build/cjs/editor/index.js

@@ -2,6 +2,6 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Editor = void 0;
 const tslib_1 = require("tslib");
-var Editor_1 = require("./Containers/Editor");
+var Editor_1 = require("./containers/Editor/Editor");
 Object.defineProperty(exports, "Editor", { enumerable: true, get: function () { return Editor_1.Editor; } });
 tslib_1.__exportStar(require("./types"), exports);

package/build/cjs/editor/store/index.d.ts

@@ -1,15 +1,14 @@
-import { Block } from '../../models';
-import { EditorProps } from '../types';
+import { Block, BlockDecorationProps, PageContent } from '../../models';
+import { EditBlockProps, EditorProps, ViewModeItem } from '../types';
 export type EditorBlockId = number | string;
 export declare function useEditorState({ content: intialContent, custom }: Omit<EditorProps, 'children'>): {
-    content: import("../../models").PageContent;
-    editControlsProps: {
-        activeBlockId: import("./reducer").EditorBlockId;
-        orderedBlocksCount: number;
-        onDelete: (id: EditorBlockId) => void;
-        onSelect: (id: EditorBlockId) => void;
-        onCopy: (index: number) => void;
-        onOrderChange: (oldIndex: number, newIndex: number) => void;
-    };
+    activeBlockIndex: number;
+    content: PageContent;
+    errorBoundaryState: number;
+    viewMode: ViewModeItem;
+    injectEditBlockProps: ({ type, index: relativeIndex, children, }: BlockDecorationProps) => EditBlockProps;
     onAdd: (block: Block) => void;
+    onSelect: (index: number) => void;
+    onContentUpdate: (newContent: PageContent) => void;
+    onViewModeUpdate: (newViewMode: ViewModeItem) => void;
 };

package/build/cjs/editor/store/index.js

@@ -4,29 +4,80 @@ exports.useEditorState = void 0;
 const react_1 = require("react");
 const models_1 = require("../../models");
 const utils_1 = require("../../utils");
+const EditBlock_1 = require("../components/EditBlock/EditBlock");
+const types_1 = require("../types");
 const reducer_1 = require("./reducer");
 const utils_2 = require("./utils");
 function useEditorState({ content: intialContent, custom }) {
-    const headerBlockTypes = (0, react_1.useMemo)(() => [...models_1.HeaderBlockTypes, ...(0, utils_1.getCustomHeaderTypes)(custom)], [custom]);
-    const reducer = (0, react_1.useMemo)(() => (0, reducer_1.getReducer)(headerBlockTypes), [headerBlockTypes]);
-    const [{ activeBlockId, content, orderedBlocksCount }, dispatch] = (0, react_1.useReducer)(reducer, {
-        activeBlockId: 0,
-        orderedBlocksCount: (0, utils_1.getOrderedBlocks)(intialContent.blocks, headerBlockTypes).length,
+    const [{ activeBlockIndex, content, errorBoundaryState, viewMode }, dispatch] = (0, react_1.useReducer)(reducer_1.reducer, {
+        activeBlockIndex: 0,
+        errorBoundaryState: 0,
         content: (0, utils_2.addEditorProps)(intialContent),
+        viewMode: types_1.ViewModeItem.Edititng,
     });
     return (0, react_1.useMemo)(() => {
+        const headerBlockTypes = [...models_1.HeaderBlockTypes, ...(0, utils_1.getCustomHeaderTypes)(custom)];
+        const contentHasHeader = Boolean((0, utils_1.getHeaderBlock)(content.blocks, headerBlockTypes));
+        const checkIsHeader = (type) => headerBlockTypes.includes(type);
+        const onAdd = (block) => {
+            const isHeader = checkIsHeader(block.type);
+            if (contentHasHeader && isHeader) {
+                //TODO: add warning that it should be only one header block
+                return;
+            }
+            // eslint-disable-next-line no-nested-ternary
+            const index = isHeader
+                ? 0
+                : activeBlockIndex === -1
+                    ? content.blocks.length
+                    : activeBlockIndex + 1;
+            dispatch({ type: reducer_1.ADD_BLOCK, payload: { block, index } });
+        };
+        const onSelect = (index) => dispatch({ type: reducer_1.SELECT_BLOCK, payload: index });
+        const onContentUpdate = (newContent) => dispatch({ type: reducer_1.UPDATE_CONTENT, payload: newContent });
+        const onViewModeUpdate = (newViewMode) => dispatch({ type: reducer_1.UPDATE_VIEW_MODE, payload: newViewMode });
+        const injectEditBlockProps = ({ type, index: relativeIndex = 0, children, }) => {
+            const orderedBlocksStartIndex = contentHasHeader ? 1 : 0;
+            const isHeader = checkIsHeader(type);
+            const index = isHeader ? 0 : relativeIndex + orderedBlocksStartIndex;
+            const isActive = activeBlockIndex === index;
+            const actions = {
+                [EditBlock_1.EditBlockControls.Delete]: () => dispatch({ type: reducer_1.DELETE_BLOCK, payload: index }),
+            };
+            if (!isHeader) {
+                actions[EditBlock_1.EditBlockControls.Copy] = () => dispatch({ type: reducer_1.COPY_BLOCK, payload: index });
+                if (index > orderedBlocksStartIndex) {
+                    actions[EditBlock_1.EditBlockControls.Up] = () => dispatch({
+                        type: reducer_1.ORDER_BLOCK,
+                        payload: { oldIndex: index, newIndex: index - 1 },
+                    });
+                }
+                if (index < content.blocks.length - 1) {
+                    actions[EditBlock_1.EditBlockControls.Down] = () => dispatch({
+                        type: reducer_1.ORDER_BLOCK,
+                        payload: { oldIndex: index, newIndex: index + 1 },
+                    });
+                }
+            }
+            return {
+                children,
+                isHeader,
+                isActive,
+                actions,
+                onSelect: () => onSelect(index),
+            };
+        };
         return {
+            activeBlockIndex,
             content,
-            editControlsProps: {
-                activeBlockId,
-                orderedBlocksCount,
-                onDelete: (id) => dispatch({ type: reducer_1.DELETE_BLOCK, payload: id }),
-                onSelect: (id) => dispatch({ type: reducer_1.SELECT_BLOCK, payload: id }),
-                onCopy: (index) => dispatch({ type: reducer_1.COPY_BLOCK, payload: index }),
-                onOrderChange: (oldIndex, newIndex) => dispatch({ type: reducer_1.ORDER_BLOCK, payload: { oldIndex, newIndex } }),
-            },
-            onAdd: (block) => dispatch({ type: reducer_1.ADD_BLOCK, payload: block }),
+            errorBoundaryState,
+            viewMode,
+            injectEditBlockProps,
+            onAdd,
+            onSelect,
+            onContentUpdate,
+            onViewModeUpdate,
         };
-    }, [content, activeBlockId, orderedBlocksCount]);
+    }, [content, activeBlockIndex, errorBoundaryState, custom, viewMode]);
 }
 exports.useEditorState = useEditorState;

package/build/cjs/editor/store/reducer.d.ts

@@ -1,28 +1,35 @@
-import { Block, CustomConfig, PageContent } from '../../models';
+import { Block, PageContent } from '../../models';
+import { ViewModeItem } from '../types';
 export type EditorBlockId = number | string;
 interface EditorState {
     content: PageContent;
-    activeBlockId: EditorBlockId;
-    orderedBlocksCount: number;
-    custom?: CustomConfig;
+    activeBlockIndex: number;
+    errorBoundaryState: number;
+    viewMode: ViewModeItem;
 }
 interface OrderBlockParams {
     oldIndex: number;
     newIndex: number;
 }
+interface AddBlockParams {
+    block: Block;
+    index: number;
+}
 export declare const SELECT_BLOCK = "SELECT_BLOCK";
 export declare const DELETE_BLOCK = "DELETE_BLOCK";
 export declare const COPY_BLOCK = "COPY_BLOCK";
 export declare const ADD_BLOCK = "ADD_BLOCK";
 export declare const SET_REGION = "SET_REGION";
 export declare const ORDER_BLOCK = "ORDER_BLOCK";
+export declare const UPDATE_CONTENT = "UPDATE_CONTENT";
+export declare const UPDATE_VIEW_MODE = "UPDATE_VIEW_MODE";
 interface SelectBlock {
     type: typeof SELECT_BLOCK;
-    payload: EditorBlockId;
+    payload: number;
 }
 interface DeleteBlock {
     type: typeof DELETE_BLOCK;
-    payload: EditorBlockId;
+    payload: number;
 }
 interface CopyBlock {
     type: typeof COPY_BLOCK;
@@ -30,12 +37,20 @@ interface CopyBlock {
 }
 interface AddBlock {
     type: typeof ADD_BLOCK;
-    payload: Block;
+    payload: AddBlockParams;
 }
 interface OrderBlock {
     type: typeof ORDER_BLOCK;
     payload: OrderBlockParams;
 }
-export type EditorAction = SelectBlock | DeleteBlock | CopyBlock | AddBlock | OrderBlock;
-export declare const getReducer: (headerBlockTypes: string[]) => (state: EditorState, action: EditorAction) => EditorState;
+interface UpdateContent {
+    type: typeof UPDATE_CONTENT;
+    payload: PageContent;
+}
+interface UpdateViewMode {
+    type: typeof UPDATE_VIEW_MODE;
+    payload: ViewModeItem;
+}
+export type EditorAction = SelectBlock | DeleteBlock | CopyBlock | AddBlock | OrderBlock | UpdateContent | UpdateViewMode;
+export declare const reducer: (state: EditorState, action: EditorAction) => EditorState;
 export {};

package/build/cjs/editor/store/reducer.js

@@ -1,8 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getReducer = exports.ORDER_BLOCK = exports.SET_REGION = exports.ADD_BLOCK = exports.COPY_BLOCK = exports.DELETE_BLOCK = exports.SELECT_BLOCK = void 0;
-const utils_1 = require("../../utils");
-const utils_2 = require("./utils");
+exports.reducer = exports.UPDATE_VIEW_MODE = exports.UPDATE_CONTENT = exports.ORDER_BLOCK = exports.SET_REGION = exports.ADD_BLOCK = exports.COPY_BLOCK = exports.DELETE_BLOCK = exports.SELECT_BLOCK = void 0;
+const utils_1 = require("./utils");
 // actions
 exports.SELECT_BLOCK = 'SELECT_BLOCK';
 exports.DELETE_BLOCK = 'DELETE_BLOCK';
@@ -10,50 +9,37 @@ exports.COPY_BLOCK = 'COPY_BLOCK';
 exports.ADD_BLOCK = 'ADD_BLOCK';
 exports.SET_REGION = 'SET_REGION';
 exports.ORDER_BLOCK = 'ORDER_BLOCK';
+exports.UPDATE_CONTENT = 'UPDATE_CONTENT';
+exports.UPDATE_VIEW_MODE = 'UPDATE_VIEW_MODE';
 // reducer
-const getReducer = (headerBlockTypes) => (state, action) => {
+const reducer = (state, action) => {
     const { content } = state;
-    const header = (0, utils_1.getHeaderBlock)(content.blocks, headerBlockTypes);
-    const orderedBlocks = (0, utils_1.getOrderedBlocks)(content.blocks, headerBlockTypes);
-    const withHeader = (blocks) => [header, ...blocks].filter(Boolean);
-    const getNewState = (blocks, activeBlockId) => (Object.assign(Object.assign({}, state), { content: Object.assign(Object.assign({}, content), { blocks }), activeBlockId, orderedBlocksCount: orderedBlocks.length }));
+    const getNewState = (blocks, activeBlockIndex) => (Object.assign(Object.assign({}, state), { content: Object.assign(Object.assign({}, content), { blocks }), activeBlockIndex }));
     switch (action.type) {
+        case exports.UPDATE_CONTENT:
+            return Object.assign(Object.assign({}, state), { content: action.payload, errorBoundaryState: (0, utils_1.getErrorBoundaryState)(state.errorBoundaryState) });
         case exports.SELECT_BLOCK:
-            return getNewState(content.blocks, action.payload);
+            return Object.assign(Object.assign({}, state), { activeBlockIndex: action.payload });
         case exports.DELETE_BLOCK: {
             const blockId = action.payload;
-            return getNewState(typeof blockId === 'string'
-                ? content.blocks.filter(({ type }) => type !== blockId)
-                : withHeader(orderedBlocks.filter((_block, index) => index !== blockId)), -1);
+            return getNewState(content.blocks.filter((_block, index) => index !== blockId), -1);
         }
         case exports.COPY_BLOCK: {
             const index = action.payload;
-            return getNewState(withHeader((0, utils_2.duplicateBlock)(orderedBlocks, index)), index + 1);
+            return getNewState((0, utils_1.duplicateBlock)(content.blocks, index), index + 1);
         }
         case exports.ADD_BLOCK: {
-            let blocks;
-            let activeBlockId;
-            const block = action.payload;
-            if (headerBlockTypes.includes(block.type)) {
-                blocks = header ? blocks : [block, ...orderedBlocks];
-                activeBlockId = block.type;
-            }
-            else {
-                const newBlockIndex = (0, utils_2.getNewBlockIndex)(state.activeBlockId, orderedBlocks.length);
-                blocks = withHeader((0, utils_2.addBlock)(orderedBlocks, block, newBlockIndex));
-                activeBlockId = newBlockIndex;
-            }
-            if (blocks) {
-                return getNewState(blocks, activeBlockId);
-            }
-            return state;
+            const { block, index } = action.payload;
+            return getNewState((0, utils_1.addBlock)(content.blocks, block, index), index);
         }
         case exports.ORDER_BLOCK: {
             const { oldIndex, newIndex } = action.payload;
-            return getNewState(withHeader((0, utils_2.changeBlocksOrder)(orderedBlocks, oldIndex, newIndex)), newIndex);
+            return getNewState((0, utils_1.changeBlocksOrder)(content.blocks, oldIndex, newIndex), newIndex);
         }
+        case exports.UPDATE_VIEW_MODE:
+            return Object.assign(Object.assign({}, state), { viewMode: action.payload });
         default:
             return state;
     }
 };
-exports.getReducer = getReducer;
+exports.reducer = reducer;

package/build/cjs/editor/store/utils.d.ts

@@ -10,3 +10,4 @@ export declare const addEditorProps: (content: PageContent) => {
     menu?: import("../../models").Menu | undefined;
     background?: import("../../models").ThemedMediaProps | undefined;
 };
+export declare const getErrorBoundaryState: (prevState: number) => number;

package/build/cjs/editor/store/utils.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.addEditorProps = exports.addBlock = exports.getNewBlockIndex = exports.duplicateBlock = exports.changeBlocksOrder = void 0;
+exports.getErrorBoundaryState = exports.addEditorProps = exports.addBlock = exports.getNewBlockIndex = exports.duplicateBlock = exports.changeBlocksOrder = void 0;
 const changeBlocksOrder = (array, oldIndex, newIndex) => {
     const result = [...array];
     const element = result.splice(oldIndex, 1)[0];
@@ -32,3 +32,5 @@ const addEditorProps = (content) => {
     return Object.assign(Object.assign({}, content), { animated: false });
 };
 exports.addEditorProps = addEditorProps;
+const getErrorBoundaryState = (prevState) => prevState === Number.MAX_SAFE_INTEGER ? 0 : prevState + 1;
+exports.getErrorBoundaryState = getErrorBoundaryState;

package/build/cjs/editor/styles/root.css

@@ -0,0 +1,5 @@
+:root {
+  --editor-header-height: 48px;
+  --editor-divider-width: 12px;
+  --editor-left-column-width: calc(400px + var(--editor-divider-width));
+}