@gravity-ui/page-constructor 1.0.0

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

@@ -0,0 +1,232 @@
+export declare const SliderProps: {
+    dots: {
+        type: string;
+    };
+    arrows: {
+        type: string;
+    };
+    description: {
+        type: string;
+    };
+    title: {
+        type: string;
+        additionalProperties: boolean;
+        required: string[];
+        properties: {
+            text: {
+                type: string;
+            };
+            textSize: {
+                type: string;
+                enum: string[];
+            };
+            url: {
+                type: string;
+            };
+            resetMargin: {
+                type: string;
+            };
+        };
+    };
+    randomOrder: {
+        type: string;
+    };
+    autoplay: {
+        type: string;
+    };
+    animated: {
+        animated: {
+            type: string;
+        };
+    };
+    slidesToShow: {
+        anyOf: ({
+            type: string;
+            additionalProperties: boolean;
+            properties: {};
+        } | {
+            type: string;
+            additionalProperties?: undefined;
+            properties?: undefined;
+        })[];
+    };
+    disclaimer: {
+        additionalProperties: boolean;
+        required: string[];
+        properties: {
+            text: {
+                type: string;
+            };
+            size: {
+                type: string;
+                enum: string[];
+            };
+        };
+    };
+    loadable: {
+        additionalProperties: boolean;
+        required: string[];
+        properties: {
+            source: {
+                type: string;
+                enum: string[];
+            };
+            /**
+             * @deprecated
+             */
+            minCount: {
+                type: string;
+            };
+            /**
+             * @deprecated Will be moved to params
+             */
+            serviceId: {
+                type: string;
+            };
+            params: {
+                type: string;
+                patternProperties: {
+                    '.*': {
+                        type: string[];
+                    };
+                };
+            };
+        };
+    };
+    children: {
+        type: string;
+        items: {
+            $ref: string;
+        };
+    };
+};
+export declare const SliderBlock: {
+    'slider-block': {
+        additionalProperties: boolean;
+        required: never[];
+        properties: {
+            dots: {
+                type: string;
+            };
+            arrows: {
+                type: string;
+            };
+            description: {
+                type: string;
+            };
+            title: {
+                type: string;
+                additionalProperties: boolean;
+                required: string[];
+                properties: {
+                    text: {
+                        type: string;
+                    };
+                    textSize: {
+                        type: string;
+                        enum: string[];
+                    };
+                    url: {
+                        type: string;
+                    };
+                    resetMargin: {
+                        type: string;
+                    };
+                };
+            };
+            randomOrder: {
+                type: string;
+            };
+            autoplay: {
+                type: string;
+            };
+            animated: {
+                animated: {
+                    type: string;
+                };
+            };
+            slidesToShow: {
+                anyOf: ({
+                    type: string;
+                    additionalProperties: boolean;
+                    properties: {};
+                } | {
+                    type: string;
+                    additionalProperties?: undefined;
+                    properties?: undefined;
+                })[];
+            };
+            disclaimer: {
+                additionalProperties: boolean;
+                required: string[];
+                properties: {
+                    text: {
+                        type: string;
+                    };
+                    size: {
+                        type: string;
+                        enum: string[];
+                    };
+                };
+            };
+            loadable: {
+                additionalProperties: boolean;
+                required: string[];
+                properties: {
+                    source: {
+                        type: string;
+                        enum: string[];
+                    };
+                    /**
+                     * @deprecated
+                     */
+                    minCount: {
+                        type: string;
+                    };
+                    /**
+                     * @deprecated Will be moved to params
+                     */
+                    serviceId: {
+                        type: string;
+                    };
+                    params: {
+                        type: string;
+                        patternProperties: {
+                            '.*': {
+                                type: string[];
+                            };
+                        };
+                    };
+                };
+            };
+            children: {
+                type: string;
+                items: {
+                    $ref: 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/Slider/schema.js

@@ -0,0 +1,75 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SliderBlock = exports.SliderProps = void 0;
+const common_1 = require("../../schema/validators/common");
+const LoadableProps = {
+    additionalProperties: false,
+    required: ['source'],
+    properties: {
+        source: {
+            type: 'string',
+            enum: ['events', 'blog', 'services'],
+        },
+        /**
+         * @deprecated
+         */
+        minCount: {
+            type: 'number',
+        },
+        /**
+         * @deprecated Will be moved to params
+         */
+        serviceId: { type: 'number' },
+        params: {
+            type: 'object',
+            patternProperties: {
+                '.*': {
+                    type: ['string', 'number', 'boolean'],
+                },
+            },
+        },
+    },
+};
+const DisclaimerProps = {
+    additionalProperties: false,
+    required: ['text'],
+    properties: {
+        text: {
+            type: 'string',
+        },
+        size: {
+            type: 'string',
+            enum: common_1.textSize,
+        },
+    },
+};
+exports.SliderProps = {
+    dots: {
+        type: 'boolean',
+    },
+    arrows: {
+        type: 'boolean',
+    },
+    description: {
+        type: 'string',
+    },
+    title: common_1.TitleProps,
+    randomOrder: {
+        type: 'boolean',
+    },
+    autoplay: {
+        type: 'number',
+    },
+    animated: common_1.AnimatableProps,
+    slidesToShow: common_1.sliderSizesObject,
+    disclaimer: DisclaimerProps,
+    loadable: LoadableProps,
+    children: common_1.ChildrenCardsProps,
+};
+exports.SliderBlock = {
+    'slider-block': {
+        additionalProperties: false,
+        required: [],
+        properties: Object.assign(Object.assign(Object.assign({}, common_1.BlockBaseProps), common_1.AnimatableProps), exports.SliderProps),
+    },
+};

package/build/cjs/blocks/Slider/slick.css

@@ -0,0 +1,87 @@
+.pc-slick-origin.slick-slider {
+  position: relative;
+  display: block;
+  box-sizing: border-box;
+  -webkit-touch-callout: none;
+  user-select: none;
+  touch-action: pan-y;
+  -webkit-tap-highlight-color: transparent;
+}
+.pc-slick-origin.slick-slider .slick-track,
+.pc-slick-origin.slick-slider .slick-list {
+  transform: translate3d(0, 0, 0);
+}
+.pc-slick-origin .slick-list {
+  position: relative;
+  overflow: hidden;
+  display: block;
+  margin: 0;
+  padding: 0;
+}
+.pc-slick-origin .slick-list:focus {
+  outline: none;
+}
+.pc-slick-origin .slick-list.dragging {
+  cursor: hand;
+}
+.pc-slick-origin .slick-track {
+  position: relative;
+  left: 0;
+  top: 0;
+  display: block;
+  margin-left: auto;
+  margin-right: auto;
+}
+.pc-slick-origin .slick-track::before, .pc-slick-origin .slick-track::after {
+  content: "";
+  display: table;
+}
+.pc-slick-origin .slick-track:after {
+  clear: both;
+}
+.slick-loading .pc-slick-origin .slick-track {
+  visibility: hidden;
+}
+.pc-slick-origin .slick-slide {
+  float: left;
+  height: 100%;
+  min-height: 1px;
+  display: none;
+}
+[dir=rtl] .pc-slick-origin .slick-slide {
+  float: right;
+}
+.pc-slick-origin .slick-slide img {
+  display: block;
+}
+.pc-slick-origin .slick-slide.slick-loading img {
+  display: none;
+}
+.pc-slick-origin .slick-slide.dragging img {
+  pointer-events: none;
+}
+.slick-initialized .pc-slick-origin .slick-slide {
+  display: block;
+}
+.slick-loading .pc-slick-origin .slick-slide {
+  visibility: hidden;
+}
+.slick-vertical .pc-slick-origin .slick-slide {
+  display: block;
+  height: auto;
+  border: 1px solid transparent;
+}
+.pc-slick-origin.slick-initialized .slick-slide {
+  display: block;
+}
+.pc-slick-origin.slick-loading .slick-slide {
+  visibility: hidden;
+}
+.pc-slick-origin.slick-vertical .slick-slide {
+  display: block;
+  height: auto;
+  border: 1px solid transparent;
+}
+.pc-slick-origin .slick-arrow.slick-hidden {
+  display: none;
+}

package/build/cjs/blocks/Slider/utils.d.ts

@@ -0,0 +1,26 @@
+import { SliderBreakpointParams, SlidesToShow } from './models';
+export declare const DEFAULT_SLIDE_BREAKPOINTS: {
+    xl: number;
+    lg: number;
+    md: number;
+    sm: number;
+};
+export interface GetSlidesToShowParams {
+    contentLength: number;
+    breakpoints?: SlidesToShow;
+    mobileFullscreen?: boolean;
+}
+export declare function getSlidesToShowWithDefaults({ contentLength, breakpoints, mobileFullscreen, }: GetSlidesToShowParams): {
+    sm: number;
+    md: number;
+    lg: number;
+    xl: number;
+};
+export declare function getSliderResponsiveParams(breakpoints: SliderBreakpointParams): {
+    breakpoint: number;
+    settings: {
+        slidesToShow: number;
+    };
+}[];
+export declare function getSlidesCountByBreakpoint(breakpoint: number, breakpoints: SliderBreakpointParams): number;
+export declare function getSlidesToShowCount(breakpoints: SliderBreakpointParams): number;

package/build/cjs/blocks/Slider/utils.js

@@ -0,0 +1,39 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getSlidesToShowCount = exports.getSlidesCountByBreakpoint = exports.getSliderResponsiveParams = exports.getSlidesToShowWithDefaults = exports.DEFAULT_SLIDE_BREAKPOINTS = void 0;
+const models_1 = require("./models");
+const constants_1 = require("../../constants");
+exports.DEFAULT_SLIDE_BREAKPOINTS = {
+    [models_1.SliderBreakpointNames.Xl]: 3,
+    [models_1.SliderBreakpointNames.Lg]: 2,
+    [models_1.SliderBreakpointNames.Md]: 2,
+    [models_1.SliderBreakpointNames.Sm]: 1.15,
+};
+const BREAKPOINT_NAMES_BY_VALUES = Object.entries(constants_1.BREAKPOINTS).reduce((acc, [key, value]) => (Object.assign(Object.assign({}, acc), { [value]: key })), {});
+function getSlidesToShowWithDefaults({ contentLength, breakpoints, mobileFullscreen, }) {
+    let result;
+    if (typeof breakpoints === 'number') {
+        result = Object.keys(exports.DEFAULT_SLIDE_BREAKPOINTS).reduce((acc, breakpointName) => (Object.assign(Object.assign({}, acc), { [breakpointName]: breakpoints })), {});
+    }
+    else {
+        result = breakpoints || exports.DEFAULT_SLIDE_BREAKPOINTS;
+    }
+    return Object.assign(Object.assign(Object.assign({}, exports.DEFAULT_SLIDE_BREAKPOINTS), result), { sm: !mobileFullscreen && contentLength > 1 ? exports.DEFAULT_SLIDE_BREAKPOINTS.sm : 1 });
+}
+exports.getSlidesToShowWithDefaults = getSlidesToShowWithDefaults;
+function getSliderResponsiveParams(breakpoints) {
+    return Object.entries(breakpoints).map(([breakpointName, slidesToShow]) => ({
+        breakpoint: constants_1.BREAKPOINTS[breakpointName],
+        settings: { slidesToShow },
+    }));
+}
+exports.getSliderResponsiveParams = getSliderResponsiveParams;
+function getSlidesCountByBreakpoint(breakpoint, breakpoints) {
+    const breakpointName = BREAKPOINT_NAMES_BY_VALUES[breakpoint];
+    return Math.floor(breakpoints[breakpointName]);
+}
+exports.getSlidesCountByBreakpoint = getSlidesCountByBreakpoint;
+function getSlidesToShowCount(breakpoints) {
+    return Math.floor(Math.max(...Object.values(breakpoints)));
+}
+exports.getSlidesToShowCount = getSlidesToShowCount;

package/build/cjs/blocks/Table/Table.css

@@ -0,0 +1,30 @@
+.pc-table-block__title {
+  margin: 0;
+}
+
+/* use this for style redefinitions to awoid problems with
+unpredictable css rules order in build */
+.pc-table-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);
+  top: calc(var(--header-height) + 32px);
+  position: sticky;
+  margin-right: 32px;
+}
+@media (max-width: 576px) {
+  .pc-table-block__title {
+    font-size: var(--yc-text-display-1-font-size);
+    line-height: var(--yc-text-display-1-line-height);
+  }
+}
+.pc-table-block__table {
+  margin-top: 0;
+}
+@media (max-width: 1081px) {
+  .pc-table-block__title {
+    margin-right: 0;
+    padding-bottom: 32px;
+  }
+}

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

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

package/build/cjs/blocks/Table/Table.js

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TableBlock = void 0;
+const tslib_1 = require("tslib");
+const react_1 = (0, tslib_1.__importDefault)(require("react"));
+const utils_1 = require("../../utils");
+const grid_1 = require("../../grid");
+const components_1 = require("../../components");
+const b = (0, utils_1.block)('table-block');
+const TableBlock = (props) => {
+    const { title, table } = props;
+    return (react_1.default.createElement("div", { className: b() },
+        react_1.default.createElement(grid_1.Grid, { className: b('content') },
+            react_1.default.createElement(grid_1.Row, { className: b('row') },
+                react_1.default.createElement(grid_1.Col, { sizes: { [grid_1.GridColumnSize.Md]: 4, [grid_1.GridColumnSize.All]: 12 } },
+                    react_1.default.createElement("h2", { className: b('title') }, title)),
+                react_1.default.createElement(grid_1.Col, { sizes: { [grid_1.GridColumnSize.Md]: 8, [grid_1.GridColumnSize.All]: 12 } },
+                    react_1.default.createElement(components_1.Table, Object.assign({ className: b('table') }, table)))))));
+};
+exports.TableBlock = TableBlock;
+exports.default = exports.TableBlock;

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

@@ -0,0 +1,67 @@
+export declare const TableBlock: {
+    'table-block': {
+        additionalProperties: boolean;
+        required: string[];
+        properties: {
+            title: {
+                type: string;
+            };
+            table: {
+                additionalProperties: boolean;
+                required: string[];
+                properties: {
+                    content: {
+                        type: string;
+                        items: {
+                            type: string;
+                            items: {
+                                type: string[];
+                            };
+                        };
+                    };
+                    legend: {
+                        type: string;
+                        items: {
+                            type: string;
+                        };
+                    };
+                    justify: {
+                        type: string;
+                        items: {
+                            type: string;
+                            enum: string[];
+                        };
+                    };
+                    marker: {
+                        type: string;
+                        enum: string[];
+                    };
+                    type: {};
+                    when: {};
+                };
+            };
+            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/Table/schema.js

@@ -0,0 +1,36 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TableBlock = void 0;
+const common_1 = require("../../schema/validators/common");
+exports.TableBlock = {
+    'table-block': {
+        additionalProperties: false,
+        required: ['title', 'table'],
+        properties: Object.assign(Object.assign({}, common_1.BlockBaseProps), { title: {
+                type: 'string',
+            }, table: {
+                additionalProperties: false,
+                required: ['content'],
+                properties: Object.assign(Object.assign({}, common_1.BaseProps), { content: {
+                        type: 'array',
+                        items: {
+                            type: 'array',
+                            items: {
+                                type: ['string', 'number'],
+                            },
+                        },
+                    }, legend: {
+                        type: 'array',
+                        items: {
+                            type: 'string',
+                        },
+                    }, justify: {
+                        type: 'array',
+                        items: common_1.JustifyProps,
+                    }, marker: {
+                        type: 'string',
+                        enum: ['disk'],
+                    } }),
+            } }),
+    },
+};

package/build/cjs/blocks/Tabs/Tabs.css

@@ -0,0 +1,83 @@
+.pc-TabsBlock__content-title.pc-TabsBlock__content-title > * {
+  margin: 0;
+}
+
+/* use this for style redefinitions to awoid problems with
+unpredictable css rules order in build */
+.pc-TabsBlock__block-title {
+  margin-bottom: 12px;
+}
+.pc-TabsBlock__tabs {
+  flex-wrap: nowrap;
+  overflow-x: auto;
+  margin-bottom: 32px;
+}
+.pc-TabsBlock__image {
+  width: 100%;
+  height: auto;
+  object-fit: cover;
+  display: block;
+}
+.pc-TabsBlock__image, .pc-TabsBlock__media {
+  box-shadow: 0 2px 8px var(--pc-color-sfx-shadow), 0 4px 24px var(--pc-color-sfx-shadow);
+  overflow-x: hidden;
+  border-radius: var(--pc-border-radius);
+}
+.pc-TabsBlock__caption {
+  font-size: var(--yc-text-body-2-font-size);
+  line-height: var(--yc-text-body-2-line-height);
+  margin: 12px 0 0;
+  color: var(--yc-color-text-secondary);
+}
+.pc-TabsBlock__content {
+  display: flex;
+  flex-direction: column;
+}
+.pc-TabsBlock__content-wrapper_margin {
+  margin: 24px 0 0 32px;
+}
+.pc-TabsBlock__content-title {
+  margin: 0 auto 12px;
+}
+.pc-TabsBlock__content-title.pc-TabsBlock__content-title > * {
+  font-size: var(--yc-text-header-1-font-size);
+  line-height: var(--yc-text-header-1-line-height);
+  color: var(--pc-text-header-color);
+  font-weight: var(--yc-text-accent-font-weight);
+}
+
+.pc-TabsBlock__tabs, .pc-TabsBlock__link {
+  font-size: var(--yc-text-body-2-font-size);
+  line-height: var(--yc-text-body-2-line-height);
+}
+@media (max-width: 769px) {
+  .pc-TabsBlock__content-wrapper_margin {
+    margin: 0 0 32px 0;
+  }
+}
+@media (min-width: 769px) {
+  .pc-TabsBlock.pc-AnimateBlock .pc-TabsBlock__media, .pc-AnimateBlock .pc-TabsBlock .pc-TabsBlock__media {
+    position: relative;
+    top: 100px;
+    opacity: 0;
+  }
+  .pc-TabsBlock.pc-AnimateBlock.animate .pc-TabsBlock__media, .pc-AnimateBlock .pc-TabsBlock.animate .pc-TabsBlock__media {
+    top: 0;
+    opacity: 1;
+    transition: top 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94), opacity 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
+    transition-delay: 0s;
+  }
+}
+@media (min-width: 769px) {
+  .pc-TabsBlock.pc-AnimateBlock .pc-TabsBlock__image, .pc-AnimateBlock .pc-TabsBlock .pc-TabsBlock__image {
+    position: relative;
+    top: 100px;
+    opacity: 0;
+  }
+  .pc-TabsBlock.pc-AnimateBlock.animate .pc-TabsBlock__image, .pc-AnimateBlock .pc-TabsBlock.animate .pc-TabsBlock__image {
+    top: 0;
+    opacity: 1;
+    transition: top 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94), opacity 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
+    transition-delay: 0s;
+  }
+}