@gravity-ui/page-constructor 5.14.3 → 5.14.4-alpha.1

package/build/cjs/sub-blocks/PriceDetailed/index.d.ts

@@ -0,0 +1,4 @@
+import { BlockData } from '../../constructor-items';
+/** @deprecated */
+declare const PriceDetailedConfig: BlockData;
+export default PriceDetailedConfig;

package/build/cjs/sub-blocks/PriceDetailed/index.js

@@ -0,0 +1,33 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const form_generator_1 = require("../../utils/form-generator");
+const PriceDetailed_1 = tslib_1.__importDefault(require("./PriceDetailed"));
+const schema_1 = require("./schema");
+/** @deprecated */
+const PriceDetailedConfig = {
+    component: PriceDetailed_1.default,
+    schema: {
+        name: 'Price Detailed',
+        inputs: (0, form_generator_1.generateFromAJV)(schema_1.PriceDetailedBlock['price-detailed']),
+        default: {
+            priceType: 'marked-list',
+            items: [
+                {
+                    title: '100$',
+                    description: 'Basic edition',
+                    detailedTitle: 'per year',
+                    items: [
+                        {
+                            text: 'First item',
+                        },
+                        {
+                            text: 'Second item',
+                        },
+                    ],
+                },
+            ],
+        },
+    },
+};
+exports.default = PriceDetailedConfig;

package/build/cjs/sub-blocks/Quote/index.d.ts

@@ -0,0 +1,3 @@
+import { BlockData } from '../../constructor-items';
+declare const QuoteConfig: BlockData;
+export default QuoteConfig;

package/build/cjs/sub-blocks/Quote/index.js

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const form_generator_1 = require("../../utils/form-generator");
+const Quote_1 = tslib_1.__importDefault(require("./Quote"));
+const schema_1 = require("./schema");
+const QuoteConfig = {
+    component: Quote_1.default,
+    schema: {
+        name: 'Quote',
+        inputs: (0, form_generator_1.generateFromAJV)(schema_1.Quote['quote']),
+        default: {
+            text: 'A good decision is based on knowledge and not on numbers.',
+            author: {
+                firstName: ' Plato',
+                description: 'Greek philosopher',
+            },
+        },
+    },
+};
+exports.default = QuoteConfig;

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

@@ -0,0 +1,2 @@
+import { MouseEvent } from 'react';
+export declare const getCursorPositionOverElement: (elementRect: DOMRect, mouseEvent: MouseEvent) => "left" | "right" | "bottom" | "top";

package/build/cjs/utils/editor.js

@@ -0,0 +1,24 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getCursorPositionOverElement = void 0;
+const getCursorPositionOverElement = (elementRect, mouseEvent) => {
+    const cursorPositionY = elementRect.height - (mouseEvent.clientY - elementRect.y);
+    const cursorPositionX = elementRect.width - (mouseEvent.clientX - elementRect.x);
+    const cursorRatioY = elementRect.height / 2 / cursorPositionY;
+    const cursorRatioX = elementRect.width / 2 / cursorPositionX;
+    if (cursorRatioY > cursorRatioX) {
+        if (cursorRatioY >= 1) {
+            return 'bottom';
+        }
+        else {
+            return 'left';
+        }
+    }
+    else if (cursorRatioX >= 1) {
+        return 'right';
+    }
+    else {
+        return 'top';
+    }
+};
+exports.getCursorPositionOverElement = getCursorPositionOverElement;

package/build/cjs/utils/form-generator.d.ts

@@ -0,0 +1,9 @@
+import { JSONSchemaType } from 'ajv';
+import { ArrayBaseInput, BooleanInput, ConfigInput, NumberInput, ObjectInput, SelectBaseInput, TextAreaInput, TextInput } from '../common/types';
+export declare const generateFromAJV: (schema: JSONSchemaType<{}>) => ConfigInput[];
+export declare const generateSingleEntity: (key: string, schema: JSONSchemaType<{}>) => TextInput | BooleanInput | NumberInput | TextAreaInput | SelectBaseInput | ObjectInput | ArrayBaseInput | {
+    type: string;
+    name: string;
+    title: string;
+    options: any;
+} | undefined;

package/build/cjs/utils/form-generator.js

@@ -0,0 +1,126 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.generateSingleEntity = exports.generateFromAJV = void 0;
+const generateFromAJV = (schema) => {
+    if (schema && schema.properties) {
+        const obj = Object.entries(schema.properties).map(([key, value]) => {
+            const innerSchema = value;
+            // eslint-disable-next-line @typescript-eslint/no-use-before-define
+            return (0, exports.generateSingleEntity)(key, innerSchema);
+        });
+        return obj.filter(Boolean);
+    }
+    return [];
+};
+exports.generateFromAJV = generateFromAJV;
+const generateSingleEntity = (key, schema) => {
+    const type = schema.type;
+    if (!type && schema.enum) {
+        return {
+            type: 'select',
+            view: 'select',
+            name: key,
+            title: key,
+            enum: schema.enum.map((enumValue) => ({
+                content: enumValue,
+                value: enumValue,
+            })),
+        };
+    }
+    if (schema.oneOf) {
+        return {
+            type: 'oneOf',
+            name: key,
+            title: key,
+            options: schema.oneOf.map((item) => {
+                let properties;
+                if (item.properties) {
+                    properties = (0, exports.generateFromAJV)(item);
+                }
+                else {
+                    properties = [
+                        (0, exports.generateSingleEntity)('', Object.assign(Object.assign({}, item), { name: '', title: item.optionName })),
+                    ];
+                }
+                return {
+                    value: item.optionName,
+                    title: item.optionName,
+                    properties: properties,
+                };
+            }),
+        };
+    }
+    switch (type) {
+        case 'string': {
+            if (schema.inputType === 'textarea') {
+                return {
+                    type: 'textarea',
+                    name: key,
+                    title: key,
+                };
+            }
+            if (schema.enum) {
+                return {
+                    type: 'select',
+                    view: 'select',
+                    name: key,
+                    title: key,
+                    enum: schema.enum.map((enumValue) => ({
+                        content: enumValue,
+                        value: enumValue,
+                    })),
+                };
+            }
+            return {
+                type: 'text',
+                name: key,
+                title: key,
+            };
+        }
+        case 'number': {
+            return {
+                type: 'number',
+                name: key,
+                title: key,
+            };
+        }
+        case 'object': {
+            return {
+                type: 'object',
+                name: key,
+                title: key,
+                properties: (0, exports.generateFromAJV)(schema),
+            };
+        }
+        case 'boolean': {
+            return {
+                type: 'boolean',
+                name: key,
+                title: key,
+                properties: (0, exports.generateFromAJV)(schema),
+            };
+        }
+        case 'array': {
+            if (schema.items.type === 'string') {
+                return {
+                    type: 'array',
+                    name: key,
+                    title: key,
+                    properties: (0, exports.generateFromAJV)(schema.items),
+                    buttonText: 'Add',
+                    arrayType: 'text',
+                };
+            }
+            return {
+                type: 'array',
+                name: key,
+                title: key,
+                properties: (0, exports.generateFromAJV)(schema.items),
+                buttonText: 'Add',
+                arrayType: 'object',
+            };
+        }
+    }
+    return undefined;
+};
+exports.generateSingleEntity = generateSingleEntity;

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

@@ -0,0 +1,16 @@
+import { StoreApi } from 'zustand';
+export declare function initializeStore<State, Methods>(initialState: State, methods: (set: StoreApi<State & Methods>['setState'], get: StoreApi<State & Methods>['getState']) => Methods): (overrideInitialState?: Partial<State>) => import("zustand").UseBoundStore<Omit<Omit<StoreApi<State & Methods>, "setState"> & {
+    setState<A extends string | {
+        type: string;
+    }>(partial: (State & Methods) | Partial<State & Methods> | ((state: State & Methods) => (State & Methods) | Partial<State & Methods>), replace?: boolean | undefined, action?: A | undefined): void;
+}, "persist"> & {
+    persist: {
+        setOptions: (options: Partial<import("zustand/middleware").PersistOptions<State & Methods, State & Methods>>) => void;
+        clearStorage: () => void;
+        rehydrate: () => void | Promise<void>;
+        hasHydrated: () => boolean;
+        onHydrate: (fn: (state: State & Methods) => void) => () => void;
+        onFinishHydration: (fn: (state: State & Methods) => void) => () => void;
+        getOptions: () => Partial<import("zustand/middleware").PersistOptions<State & Methods, State & Methods>>;
+    };
+}>;

package/build/cjs/utils/store.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.initializeStore = void 0;
+const zustand_1 = require("zustand");
+const middleware_1 = require("zustand/middleware");
+function initializeStore(initialState, methods) {
+    return (overrideInitialState) => (0, zustand_1.create)((0, middleware_1.devtools)((set, get) => (Object.assign(Object.assign(Object.assign({}, initialState), overrideInitialState), methods(set, get)))));
+}
+exports.initializeStore = initializeStore;

package/build/esm/blocks/Banner/Banner.js

@@ -1,6 +1,7 @@
 import { __rest } from "tslib";
 import React from 'react';
 import AnimateBlock from '../../components/AnimateBlock/AnimateBlock';
+import { Grid } from '../../grid';
 import { BannerCard } from '../../sub-blocks';
 import { block } from '../../utils';
 import './Banner.css';
@@ -8,6 +9,7 @@ const b = block('banner-block');
 export const BannerBlock = (props) => {
     const { animated } = props, bannerProps = __rest(props, ["animated"]);
     return (React.createElement(AnimateBlock, { className: b(), animate: animated },
-        React.createElement(BannerCard, Object.assign({}, bannerProps))));
+        React.createElement(Grid, null,
+            React.createElement(BannerCard, Object.assign({}, bannerProps)))));
 };
 export default BannerBlock;

package/build/esm/blocks/Banner/index.d.ts

@@ -0,0 +1,3 @@
+import { BlockData } from '../../constructor-items';
+declare const BannerBlockConfig: BlockData;
+export default BannerBlockConfig;

package/build/esm/blocks/Banner/index.js

@@ -0,0 +1,19 @@
+import { generateFromAJV } from '../../utils/form-generator';
+import BannerBlock from './Banner';
+import { BannerCardProps } from './schema';
+const BannerBlockConfig = {
+    component: BannerBlock,
+    schema: {
+        name: 'Banner Block',
+        inputs: generateFromAJV(BannerCardProps),
+        default: {
+            color: 'rgba(54, 151, 241, 0.4)',
+            title: 'Banner Block',
+            subtitle: 'Some sort of description.',
+            button: {
+                text: 'Read more',
+            },
+        },
+    },
+};
+export default BannerBlockConfig;

package/build/esm/blocks/CardLayout/CardLayout.css

@@ -21,6 +21,7 @@ unpredictable css rules order in build */
   width: 100%;
   height: 100%;
   border-radius: 32px;
+  pointer-events: none;
 }
 .pc-card-layout-block__image img {
   object-fit: cover;

package/build/esm/blocks/CardLayout/CardLayout.js

@@ -2,7 +2,9 @@ import { __rest } from "tslib";
 import React from 'react';
 import isEmpty from 'lodash/isEmpty';
 import { AnimateBlock, BackgroundImage, Title } from '../../components';
-import { Col, Row } from '../../grid';
+import ChildrenWrap from '../../components/editor/ChildrenWrap/ChildrenWrap';
+import ItemWrap from '../../components/editor/ItemWrap/ItemWrap';
+import { Col, Grid, Row } from '../../grid';
 import { block } from '../../utils';
 import './CardLayout.css';
 const DEFAULT_SIZES = {
@@ -14,11 +16,14 @@ const b = block('card-layout-block');
 const CardLayout = ({ title, description, animated, colSizes = DEFAULT_SIZES, children, className, titleClassName, background, }) => {
     const _a = background || {}, { border } = _a, backgroundImageProps = __rest(_a, ["border"]);
     return (React.createElement(AnimateBlock, { className: b(null, className), animate: animated },
-        (title || description) && (React.createElement(Title, { title: title, subtitle: description, className: titleClassName })),
-        React.createElement("div", { className: b('content', {
-                'with-background': !isEmpty(background),
-            }) },
-            React.createElement(BackgroundImage, Object.assign({ className: b('image', { border }) }, backgroundImageProps)),
-            React.createElement(Row, null, React.Children.map(children, (child, index) => (React.createElement(Col, { key: index, sizes: colSizes, className: b('item') }, child)))))));
+        React.createElement(Grid, null,
+            (title || description) && (React.createElement(Title, { title: title, subtitle: description, className: titleClassName })),
+            React.createElement("div", { className: b('content', {
+                    'with-background': !isEmpty(background),
+                }) },
+                React.createElement(BackgroundImage, Object.assign({ className: b('image', { border }) }, backgroundImageProps)),
+                React.createElement(ChildrenWrap, null,
+                    React.createElement(Row, null, React.Children.map(children, (child, index) => (React.createElement(Col, { key: index, sizes: colSizes, className: b('item') },
+                        React.createElement(ItemWrap, { index: index }, child))))))))));
 };
 export default CardLayout;

package/build/esm/blocks/CardLayout/index.d.ts

@@ -0,0 +1,5 @@
+import { ConfigInput } from '../../common/types';
+import { BlockData } from '../../constructor-items';
+export declare const blockConfig: ConfigInput[];
+declare const CardLayoutBlockConfig: BlockData;
+export default CardLayoutBlockConfig;

package/build/esm/blocks/CardLayout/index.js

@@ -0,0 +1,162 @@
+import { sliderSizesArray, textSize } from '../../schema/validators/common';
+import CardLayout from './CardLayout';
+const textSizeEnum = textSize.map((size) => ({ value: size, content: size }));
+export const blockConfig = [
+    {
+        type: 'oneOf',
+        name: 'title',
+        title: 'Title Object',
+        options: [
+            {
+                title: 'Simple',
+                value: 'simple',
+                properties: [
+                    {
+                        type: 'text',
+                        name: '',
+                        title: 'Title',
+                    },
+                ],
+            },
+            {
+                title: 'Complex',
+                value: 'complex',
+                properties: [
+                    {
+                        type: 'text',
+                        name: 'text',
+                        title: 'Title',
+                    },
+                    {
+                        type: 'select',
+                        name: 'textSize',
+                        title: 'Text Size',
+                        enum: textSizeEnum,
+                        view: 'select',
+                        mode: 'single',
+                    },
+                    {
+                        type: 'text',
+                        name: 'url',
+                        title: 'Url',
+                    },
+                    {
+                        type: 'text',
+                        name: 'urlTitle',
+                        title: 'Url',
+                    },
+                    {
+                        type: 'boolean',
+                        name: 'resetMargin',
+                        title: 'Reset Margin',
+                    },
+                ],
+            },
+        ],
+    },
+    {
+        type: 'textarea',
+        name: 'description',
+        title: 'Description',
+    },
+    {
+        type: 'boolean',
+        name: 'dots',
+        title: 'With dots',
+    },
+    {
+        type: 'boolean',
+        name: 'arrows',
+        title: 'With Arrows',
+    },
+    {
+        type: 'boolean',
+        name: 'randomOrder',
+        title: 'Random Order',
+    },
+    {
+        type: 'number',
+        name: 'autoplay',
+        title: 'Autoplay',
+    },
+    {
+        type: 'object',
+        name: 'disclaimer',
+        title: 'Disclaimer',
+        properties: [
+            {
+                type: 'text',
+                name: 'text',
+                title: 'Text',
+            },
+            {
+                type: 'select',
+                name: 'size',
+                title: 'Size',
+                enum: textSizeEnum,
+                view: 'select',
+                mode: 'single',
+            },
+        ],
+    },
+    {
+        type: 'oneOf',
+        name: 'slidesToShow',
+        title: 'Slides to Show',
+        options: [
+            {
+                title: 'Simple',
+                value: 'simple',
+                properties: [
+                    {
+                        type: 'number',
+                        name: '',
+                        title: 'Slides',
+                    },
+                ],
+            },
+            {
+                title: 'Complex',
+                value: 'complex',
+                properties: sliderSizesArray.reduce((acc, size) => {
+                    acc.push({ type: 'number', name: size, title: size });
+                    return acc;
+                }, []),
+            },
+        ],
+    },
+    {
+        type: 'array',
+        name: 'array',
+        title: 'Array Properties',
+        buttonText: 'Add new',
+        arrayType: 'object',
+        properties: [
+            {
+                type: 'text',
+                name: 'text',
+                title: 'Property',
+            },
+            {
+                type: 'boolean',
+                name: 'boolean',
+                title: 'Property',
+            },
+        ],
+    },
+];
+const CardLayoutBlockConfig = {
+    component: CardLayout,
+    schema: {
+        name: 'Card Layout Block',
+        inputs: blockConfig,
+        // inputs: generateFromAJV(CardLayoutProps as unknown as JSONSchemaType<{}>),
+        default: {
+            type: 'card-layout-block',
+            children: [],
+            title: 'Card Layout Block',
+            description: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',
+        },
+    },
+};
+export default CardLayoutBlockConfig;

package/build/esm/blocks/Companies/Companies.js

@@ -2,6 +2,7 @@ import React from 'react';
 import { Image, Title } from '../../components';
 import AnimateBlock from '../../components/AnimateBlock/AnimateBlock';
 import { useTheme } from '../../context/theme';
+import { Grid } from '../../grid';
 import { block, getThemedValue } from '../../utils';
 import './Companies.css';
 const b = block('companies-block');
@@ -9,9 +10,10 @@ export const CompaniesBlock = ({ title, description, images, animated }) => {
     const theme = useTheme();
     const themedImages = getThemedValue(images, theme) || {};
     return (React.createElement(AnimateBlock, { className: b(), offset: 150, animate: animated },
-        React.createElement("div", { className: b('content') },
-            React.createElement(Title, { title: title, subtitle: description, colSizes: { all: 12, sm: 12 } }),
-            React.createElement("div", { className: b('images') },
-                React.createElement(Image, Object.assign({}, themedImages, { className: b('image') }))))));
+        React.createElement(Grid, null,
+            React.createElement("div", { className: b('content') },
+                React.createElement(Title, { title: title, subtitle: description, colSizes: { all: 12, sm: 12 } }),
+                React.createElement("div", { className: b('images') },
+                    React.createElement(Image, Object.assign({}, themedImages, { className: b('image') })))))));
 };
 export default CompaniesBlock;

package/build/esm/blocks/Companies/index.d.ts

@@ -0,0 +1,3 @@
+import { BlockData } from '../../constructor-items';
+declare const CompaniesBlockConfig: BlockData;
+export default CompaniesBlockConfig;

package/build/esm/blocks/Companies/index.js

@@ -0,0 +1,15 @@
+import { generateFromAJV } from '../../utils/form-generator';
+import CompaniesBlock from './Companies';
+import { CompaniesBlock as CompaniesBlockSchema } from './schema';
+const CompaniesBlockConfig = {
+    component: CompaniesBlock,
+    schema: {
+        name: 'Companies Block',
+        inputs: generateFromAJV(CompaniesBlockSchema['companies-block']),
+        default: {
+            title: 'Companies Block',
+            description: 'Here is the list',
+        },
+    },
+};
+export default CompaniesBlockConfig;

package/build/esm/blocks/ContentLayout/ContentLayout.js

@@ -1,7 +1,7 @@
 import React, { useContext, useMemo } from 'react';
 import { BackgroundImage, FileLink } from '../../components';
 import { MobileContext } from '../../context/mobileContext';
-import { Col } from '../../grid';
+import { Col, Grid } from '../../grid';
 import { Content } from '../../sub-blocks';
 import { block } from '../../utils';
 import './ContentLayout.css';
@@ -30,10 +30,11 @@ export const ContentLayoutBlock = (props) => {
     const isMobile = useContext(MobileContext);
     const { textContent, fileContent, size = 'l', background, centered, theme = 'default', textWidth = 'm', } = props;
     const colSizes = useMemo(() => getTextWidth(textWidth), [textWidth]);
-    return (React.createElement("div", { className: b({ size, theme, background: Boolean(background) }) },
-        React.createElement(Content, Object.assign({ className: b('content') }, textContent, { size: size, centered: centered, colSizes: colSizes, theme: theme })),
-        fileContent && (React.createElement(Col, { className: b('files', { size, centered }), reset: true, sizes: colSizes }, fileContent.map((file) => (React.createElement(FileLink, Object.assign({ className: b('file') }, file, { key: file.href, type: "horizontal", textSize: getFileTextSize(size), theme: theme })))))),
-        background && (React.createElement("div", { className: b('background') },
-            React.createElement(BackgroundImage, Object.assign({ className: b('background-item') }, background, { hide: isMobile }))))));
+    return (React.createElement(Grid, null,
+        React.createElement("div", { className: b({ size, theme, background: Boolean(background) }) },
+            React.createElement(Content, Object.assign({ className: b('content') }, textContent, { size: size, centered: centered, colSizes: colSizes, theme: theme })),
+            fileContent && (React.createElement(Col, { className: b('files', { size, centered }), reset: true, sizes: colSizes }, fileContent.map((file) => (React.createElement(FileLink, Object.assign({ className: b('file') }, file, { key: file.href, type: "horizontal", textSize: getFileTextSize(size), theme: theme })))))),
+            background && (React.createElement("div", { className: b('background') },
+                React.createElement(BackgroundImage, Object.assign({ className: b('background-item') }, background, { hide: isMobile })))))));
 };
 export default ContentLayoutBlock;

package/build/esm/blocks/ContentLayout/index.d.ts

@@ -0,0 +1,11 @@
+declare const ContentLayoutBlockConfig: {
+    component: (props: import("../..").ContentLayoutBlockProps) => JSX.Element;
+    schema: {
+        name: string;
+        inputs: import("../../editor-v2").ConfigInput[];
+        default: {
+            title: string;
+        };
+    };
+};
+export default ContentLayoutBlockConfig;

package/build/esm/blocks/ContentLayout/index.js

@@ -0,0 +1,14 @@
+import { generateFromAJV } from '../../utils/form-generator';
+import ContentLayoutBlock from './ContentLayout';
+import { ContentLayoutBlock as ContentLayoutBlockSchema } from './schema';
+const ContentLayoutBlockConfig = {
+    component: ContentLayoutBlock,
+    schema: {
+        name: 'Content Layout Block',
+        inputs: generateFromAJV(ContentLayoutBlockSchema['content-layout-block']),
+        default: {
+            title: 'Content Layout Block',
+        },
+    },
+};
+export default ContentLayoutBlockConfig;

package/build/esm/blocks/ContentLayout/schema.d.ts

@@ -85,6 +85,7 @@ export declare const ContentLayoutBlock: {
                 enum: string[];
             };
             textContent: {
+                type: string;
                 additionalProperties: boolean;
                 properties: {
                     colSizes: {};