@gravity-ui/page-constructor 1.0.0

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

@@ -0,0 +1,140 @@
+export declare const CardLayoutProps: {
+    additionalProperties: boolean;
+    required: string[];
+    properties: {
+        title: {
+            oneOf: ({
+                type: string;
+                additionalProperties: boolean;
+                required: string[];
+                properties: {
+                    text: {
+                        type: string;
+                    };
+                    textSize: {
+                        type: string;
+                        enum: string[];
+                    };
+                    url: {
+                        type: string;
+                    };
+                    resetMargin: {
+                        type: string;
+                    };
+                };
+            } | {
+                type: string;
+            })[];
+        };
+        description: {
+            type: string;
+        };
+        colSizes: {
+            type: string;
+            additionalProperties: boolean;
+            properties: {};
+        };
+        children: {
+            type: string;
+            items: {
+                $ref: string;
+            };
+        };
+        animated: {
+            type: string;
+        };
+        anchor: {
+            type: string;
+            additionalProperties: boolean;
+            required: string[];
+            properties: {
+                text: {
+                    type: string;
+                };
+                url: {
+                    type: string;
+                };
+            };
+        };
+        visible: {
+            type: string;
+            enum: string[];
+        };
+        resetPaddings: {
+            type: string;
+        };
+        type: {};
+        when: {};
+    };
+};
+export declare const CardLayoutBlock: {
+    'card-layout-block': {
+        additionalProperties: boolean;
+        required: string[];
+        properties: {
+            title: {
+                oneOf: ({
+                    type: string;
+                    additionalProperties: boolean;
+                    required: string[];
+                    properties: {
+                        text: {
+                            type: string;
+                        };
+                        textSize: {
+                            type: string;
+                            enum: string[];
+                        };
+                        url: {
+                            type: string;
+                        };
+                        resetMargin: {
+                            type: string;
+                        };
+                    };
+                } | {
+                    type: string;
+                })[];
+            };
+            description: {
+                type: string;
+            };
+            colSizes: {
+                type: string;
+                additionalProperties: boolean;
+                properties: {};
+            };
+            children: {
+                type: string;
+                items: {
+                    $ref: string;
+                };
+            };
+            animated: {
+                type: string;
+            };
+            anchor: {
+                type: string;
+                additionalProperties: boolean;
+                required: string[];
+                properties: {
+                    text: {
+                        type: string;
+                    };
+                    url: {
+                        type: string;
+                    };
+                };
+            };
+            visible: {
+                type: string;
+                enum: string[];
+            };
+            resetPaddings: {
+                type: string;
+            };
+            type: {};
+            when: {};
+        };
+    };
+};

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

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CardLayoutBlock = exports.CardLayoutProps = void 0;
+const common_1 = require("../../schema/validators/common");
+exports.CardLayoutProps = {
+    additionalProperties: false,
+    required: ['title'],
+    properties: Object.assign(Object.assign(Object.assign({}, common_1.BlockBaseProps), common_1.AnimatableProps), { title: {
+            oneOf: [{ type: 'string' }, common_1.TitleProps],
+        }, description: {
+            type: 'string',
+        }, colSizes: common_1.containerSizesObject, children: common_1.ChildrenCardsProps }),
+};
+exports.CardLayoutBlock = {
+    'card-layout-block': exports.CardLayoutProps,
+};

package/build/cjs/blocks/Companies/Companies.css

@@ -0,0 +1,37 @@
+.pc-companies-block__title {
+  margin: 0;
+}
+
+/* use this for style redefinitions to awoid problems with
+unpredictable css rules order in build */
+.pc-companies-block {
+  text-align: center;
+}
+.pc-companies-block__title {
+  font-size: var(--yc-text-display-2-font-size);
+  line-height: var(--yc-text-display-2-line-height);
+  color: var(--pc-text-header-color);
+  font-weight: var(--yc-text-accent-font-weight);
+}
+@media (max-width: 576px) {
+  .pc-companies-block__title {
+    font-size: var(--yc-text-display-1-font-size);
+    line-height: var(--yc-text-display-1-line-height);
+  }
+}
+.pc-companies-block__images {
+  margin-top: 32px;
+}
+.pc-companies-block__image {
+  max-width: 100%;
+}
+@media (min-width: 769px) {
+  .pc-companies-block.pc-AnimateBlock .pc-companies-block__images, .pc-AnimateBlock .pc-companies-block .pc-companies-block__images {
+    opacity: 0;
+  }
+  .pc-companies-block.pc-AnimateBlock.animate .pc-companies-block__images, .pc-AnimateBlock .pc-companies-block.animate .pc-companies-block__images {
+    opacity: 1;
+    transition: opacity 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
+    transition-delay: 0s;
+  }
+}

package/build/cjs/blocks/Companies/Companies.d.ts

@@ -0,0 +1,3 @@
+import { CompaniesBlockProps } from '../../models';
+export declare const CompaniesBlock: ({ title, images, animated }: CompaniesBlockProps) => JSX.Element;
+export default CompaniesBlock;

package/build/cjs/blocks/Companies/Companies.js

@@ -0,0 +1,25 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CompaniesBlock = void 0;
+const tslib_1 = require("tslib");
+const react_1 = (0, tslib_1.__importStar)(require("react"));
+const utils_1 = require("../../utils");
+const AnimateBlock_1 = (0, tslib_1.__importDefault)(require("../../components/AnimateBlock/AnimateBlock"));
+const constants_1 = require("../../constants");
+const ThemeValueContext_1 = require("../../context/theme/ThemeValueContext");
+const b = (0, utils_1.block)('companies-block');
+const CompaniesBlock = ({ title, images, animated }) => {
+    const { themeValue: theme } = (0, react_1.useContext)(ThemeValueContext_1.ThemeValueContext);
+    const themedImages = (0, utils_1.getThemedValue)(images, theme) || {};
+    const { desktop, mobile, tablet, alt } = themedImages;
+    return (react_1.default.createElement(AnimateBlock_1.default, { className: b(), offset: 150, animate: animated },
+        react_1.default.createElement("div", { className: b('content') },
+            react_1.default.createElement("h2", { className: b('title') }, title),
+            react_1.default.createElement("div", { className: b('images') },
+                react_1.default.createElement("picture", null,
+                    react_1.default.createElement("source", { srcSet: desktop, media: `(min-width: ${constants_1.BREAKPOINTS.md}px)` }),
+                    react_1.default.createElement("source", { srcSet: tablet, media: `(min-width: ${constants_1.BREAKPOINTS.sm}px)` }),
+                    react_1.default.createElement("img", { className: b('image'), srcSet: mobile, alt: alt }))))));
+};
+exports.CompaniesBlock = CompaniesBlock;
+exports.default = exports.CompaniesBlock;

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

@@ -0,0 +1,41 @@
+export declare const CompaniesBlock: {
+    'companies-block': {
+        additionalProperties: boolean;
+        required: string[];
+        properties: {
+            title: {
+                type: string;
+            };
+            images: {
+                oneOf: ({
+                    type: string;
+                    required: string[];
+                    properties: {
+                        desktop: {
+                            type: string;
+                        };
+                        tablet: {
+                            type: string;
+                        };
+                        mobile: {
+                            type: string;
+                        };
+                        alt: {
+                            type: string;
+                        };
+                    };
+                } | {
+                    type: string;
+                    additionalProperties: boolean;
+                    required: import("../..").Theme[];
+                    properties: {};
+                })[];
+            };
+            animated: {
+                type: string;
+            };
+            type: {};
+            when: {};
+        };
+    };
+};

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

@@ -0,0 +1,30 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CompaniesBlock = void 0;
+const common_1 = require("../../schema/validators/common");
+exports.CompaniesBlock = {
+    'companies-block': {
+        additionalProperties: false,
+        required: ['title', 'images'],
+        properties: Object.assign(Object.assign(Object.assign({}, common_1.BaseProps), common_1.AnimatableProps), { title: {
+                type: 'string',
+            }, images: (0, common_1.withTheme)({
+                type: 'object',
+                required: ['desktop', 'tablet', 'mobile'],
+                properties: {
+                    desktop: {
+                        type: 'string',
+                    },
+                    tablet: {
+                        type: 'string',
+                    },
+                    mobile: {
+                        type: 'string',
+                    },
+                    alt: {
+                        type: 'string',
+                    },
+                },
+            }) }),
+    },
+};

package/build/cjs/blocks/ContentLayout/ContentLayout.css

@@ -0,0 +1,62 @@
+.pc-content-layout-block__files_size_l, .pc-content-layout-block__files_size_s {
+  margin: 0;
+}
+
+/* use this for style redefinitions to awoid problems with
+unpredictable css rules order in build */
+.pc-content-layout-block {
+  position: relative;
+}
+.pc-content-layout-block__content, .pc-content-layout-block__files {
+  z-index: 10;
+  position: relative;
+}
+.pc-content-layout-block__files {
+  margin-top: 24px;
+}
+.pc-content-layout-block__files_size_s {
+  font-size: var(--yc-text-body-2-font-size);
+  line-height: var(--yc-text-body-2-line-height);
+}
+.pc-content-layout-block__files_size_l {
+  font-size: var(--yc-text-body3-font-size);
+  line-height: var(--yc-text-body3-line-height);
+}
+.pc-content-layout-block__files_centered {
+  margin-left: auto;
+  margin-right: auto;
+}
+.pc-content-layout-block__files_centered .pc-content-layout-block__file {
+  justify-content: center;
+}
+.pc-content-layout-block__files a {
+  text-decoration: none;
+}
+.pc-content-layout-block__file {
+  margin-bottom: 12px;
+}
+.pc-content-layout-block__file:last-child {
+  margin-bottom: 0;
+}
+.pc-content-layout-block__background {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+}
+.pc-content-layout-block__background-item {
+  height: 100%;
+  border-radius: var(--pc-border-radius);
+}
+.pc-content-layout-block_background {
+  padding: 64px;
+}
+@media (max-width: 577px) {
+  .pc-content-layout-block_background {
+    padding: 32px;
+  }
+  .pc-content-layout-block_background picture {
+    display: none;
+  }
+}

package/build/cjs/blocks/ContentLayout/ContentLayout.d.ts

@@ -0,0 +1,3 @@
+import { ContentLayoutBlockProps } from '../../models';
+export declare const ContentLayoutBlock: (props: ContentLayoutBlockProps) => JSX.Element;
+export default ContentLayoutBlock;

package/build/cjs/blocks/ContentLayout/ContentLayout.js

@@ -0,0 +1,44 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ContentLayoutBlock = void 0;
+const tslib_1 = require("tslib");
+const react_1 = (0, tslib_1.__importStar)(require("react"));
+const utils_1 = require("../../utils");
+const sub_blocks_1 = require("../../sub-blocks");
+const components_1 = require("../../components");
+const grid_1 = require("../../grid");
+const mobileContext_1 = require("../../context/mobileContext");
+const b = (0, utils_1.block)('content-layout-block');
+function getFileTextSize(size) {
+    switch (size) {
+        case 's':
+            return 's';
+        case 'l':
+        default:
+            return 'l';
+    }
+}
+function getTextWidth(size) {
+    switch (size) {
+        case 's':
+            return { all: 12, md: 6 };
+        case 'l':
+            return { all: 12, md: 12 };
+        case 'm':
+        default:
+            return { all: 12, md: 8 };
+    }
+}
+const ContentLayoutBlock = (props) => {
+    const isMobile = (0, react_1.useContext)(mobileContext_1.MobileContext);
+    const { textContent, fileContent, properties: cardLayoutProperties = { size: 'l' } } = props;
+    const { size = 'l', background, centered, theme = 'default', textWidth = 'm', } = cardLayoutProperties;
+    const colSizes = (0, react_1.useMemo)(() => getTextWidth(textWidth), [textWidth]);
+    return (react_1.default.createElement("div", { className: b({ size, background: Boolean(background) }) },
+        react_1.default.createElement(sub_blocks_1.Content, Object.assign({ className: b('content') }, textContent, { size: size, centered: centered, colSizes: colSizes, theme: theme })),
+        fileContent && (react_1.default.createElement(grid_1.Col, { className: b('files', { size, centered }), reset: true, sizes: colSizes }, fileContent.map((file) => (react_1.default.createElement(components_1.FileLink, Object.assign({ className: b('file') }, file, { key: file.href, type: "horizontal", textSize: getFileTextSize(size), theme: theme })))))),
+        background && (react_1.default.createElement("div", { className: b('background') },
+            react_1.default.createElement(components_1.BackgroundImage, Object.assign({ className: b('background-item') }, background, { hide: isMobile }))))));
+};
+exports.ContentLayoutBlock = ContentLayoutBlock;
+exports.default = exports.ContentLayoutBlock;

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

@@ -0,0 +1,145 @@
+export declare const ContentLayoutBlock: {
+    'content-layout-block': {
+        additionalProperties: boolean;
+        properties: {
+            textContent: {
+                content: {
+                    additionalProperties: boolean;
+                    properties: {
+                        colSizes: {};
+                        centered: {
+                            type: string;
+                        };
+                        title: {
+                            oneOf: ({
+                                type: string;
+                                additionalProperties: boolean;
+                                required: string[];
+                                properties: {
+                                    text: {
+                                        type: string;
+                                    };
+                                    textSize: {
+                                        type: string;
+                                        enum: string[];
+                                    };
+                                    url: {
+                                        type: string;
+                                    };
+                                    resetMargin: {
+                                        type: string;
+                                    };
+                                };
+                            } | {
+                                type: string;
+                            })[];
+                        };
+                        text: {
+                            type: string;
+                        };
+                        additionalInfo: {
+                            type: string;
+                        };
+                        size: {
+                            type: string;
+                            enum: string[];
+                        };
+                        links: {
+                            type: string;
+                            items: {
+                                type: string;
+                                properties: {
+                                    when: {
+                                        type: string;
+                                    };
+                                };
+                            };
+                        };
+                        buttons: {
+                            type: string;
+                            items: {
+                                type: string;
+                                properties: {
+                                    when: {
+                                        type: string;
+                                    };
+                                };
+                            };
+                        };
+                        theme: {
+                            type: string;
+                            enum: string[];
+                        };
+                    };
+                };
+            };
+            fileContent: {
+                type: string;
+                items: {
+                    type: string;
+                    properties: {
+                        when: {
+                            type: string;
+                        };
+                    };
+                };
+            };
+            properties: {
+                size: {
+                    type: string;
+                    enum: string[];
+                };
+                background: {
+                    type: string;
+                    additionalProperties: boolean;
+                    required: string[];
+                    properties: {
+                        src: {
+                            type: string;
+                            pattern: string;
+                        };
+                        alt: {
+                            type: string;
+                        };
+                        disableCompress: {
+                            type: string;
+                        };
+                    };
+                };
+                centered: {
+                    type: string;
+                };
+                theme: {
+                    type: string;
+                    enum: string[];
+                };
+                textWidth: {
+                    type: string;
+                    enum: string[];
+                };
+            };
+            anchor: {
+                type: string;
+                additionalProperties: boolean;
+                required: string[];
+                properties: {
+                    text: {
+                        type: string;
+                    };
+                    url: {
+                        type: string;
+                    };
+                };
+            };
+            visible: {
+                type: string;
+                enum: string[];
+            };
+            resetPaddings: {
+                type: string;
+            };
+            type: {};
+            when: {};
+        };
+    };
+};

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

@@ -0,0 +1,29 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ContentLayoutBlock = void 0;
+const schema_1 = require("../../sub-blocks/Content/schema");
+const utils_1 = require("../../schema/validators/utils");
+const common_1 = require("../../schema/validators/common");
+exports.ContentLayoutBlock = {
+    'content-layout-block': {
+        additionalProperties: false,
+        properties: Object.assign(Object.assign({}, common_1.BlockBaseProps), { textContent: schema_1.ContentBlock, fileContent: (0, utils_1.filteredArray)(common_1.FileLinkProps), properties: {
+                size: {
+                    type: 'string',
+                    enum: common_1.contentSizes,
+                },
+                background: common_1.ImageObjectProps,
+                centered: {
+                    type: 'boolean',
+                },
+                theme: {
+                    type: 'string',
+                    enum: common_1.contentThemes,
+                },
+                textWidth: {
+                    type: 'string',
+                    enum: common_1.contentTextWidth,
+                },
+            } }),
+    },
+};