@doyourjob/gravity-ui-page-constructor 5.31.18 → 5.31.20

package/build/cjs/blocks/EventsFeed/EventsFeedRecent/EventsFeedRecent.js

@@ -21,7 +21,7 @@ const EventsFeedRecent = () => {
     const { recent, page, pageSize, onLoadMore } = (0, react_1.useContext)(eventsContext_1.EventsRecentContext);
     const itemsToShow = recent.slice(0, page * pageSize);
     const hasMore = page < Math.ceil(recent.length / pageSize);
-    if (recent.length === 0) {
+    if (!recent || recent.length === 0) {
         return null;
     }
     return (react_1.default.createElement("div", { className: b() },

package/build/cjs/blocks/EventsFeed/EventsFeedUpcoming/EventsFeedUpcoming.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
-export declare const EventsFeedUpcoming: () => JSX.Element;
-declare const _default: React.MemoExoticComponent<() => JSX.Element>;
+export declare const EventsFeedUpcoming: () => JSX.Element | null;
+declare const _default: React.MemoExoticComponent<() => JSX.Element | null>;
 export default _default;

package/build/cjs/blocks/EventsFeed/EventsFeedUpcoming/EventsFeedUpcoming.js

@@ -18,6 +18,9 @@ const colSizes = {
 };
 const EventsFeedUpcoming = () => {
     const { upcoming } = (0, react_1.useContext)(eventsContext_1.EventsUpcomingContext);
+    if (!upcoming || upcoming.length === 0) {
+        return null;
+    }
     return (react_1.default.createElement("div", { className: b() },
         react_1.default.createElement(components_1.Anchor, { id: "upcoming" }),
         react_1.default.createElement(__1.CardLayoutBlock, { colSizes: colSizes }, upcoming.map((item) => (react_1.default.createElement(sub_blocks_1.FeedCard, Object.assign({ key: item.slug }, item)))))));

package/build/cjs/blocks/HighlightTable/HighlightTable.css

@@ -0,0 +1,86 @@
+.pc-highlight-table-block__title {
+  margin: 0;
+}
+
+/* use this for style redefinitions to awoid problems with
+unpredictable css rules order in build */
+.pc-highlight-table-block__description {
+  margin-bottom: 16px;
+}
+.pc-highlight-table-block__title {
+  font-size: var(--g-text-display-2-font-size, var(--pc-text-display-2-font-size));
+  line-height: var(--g-text-display-2-line-height, var(--pc-text-display-2-line-height));
+  color: var(--pc-text-header-color);
+  font-weight: var(--g-text-accent-font-weight);
+  position: sticky;
+  display: block;
+  margin-bottom: 16px;
+}
+@media (max-width: 576px) {
+  .pc-highlight-table-block__title {
+    font-size: var(--g-text-display-1-font-size, var(--pc-text-display-1-font-size));
+    line-height: var(--g-text-display-1-line-height, var(--pc-text-display-1-line-height));
+  }
+}
+.pc-highlight-table-block__content {
+  padding: 0 8px;
+}
+@media (max-width: 769px) {
+  .pc-highlight-table-block__content {
+    min-width: 1024px;
+  }
+}
+.pc-highlight-table-block__table {
+  overflow: auto;
+}
+@media (max-width: 769px) {
+  .pc-highlight-table-block__table {
+    margin-right: -48px;
+    margin-left: -48px;
+    padding: 0 48px 12px;
+    scrollbar-width: none;
+  }
+  .pc-highlight-table-block__table::-webkit-scrollbar {
+    display: none;
+  }
+}
+.pc-highlight-table-block__head {
+  color: rgba(0, 0, 0, 0.5);
+}
+.pc-highlight-table-block__body {
+  border: 1px solid var(--g-color-private-black-100);
+}
+.pc-highlight-table-block__head, .pc-highlight-table-block__body {
+  border-radius: 10px;
+  padding: 0 20px;
+  margin: 0 -8px;
+  overflow: hidden;
+}
+.pc-highlight-table-block__row.pc-highlight-table-block__row.pc-highlight-table-block__row.pc-highlight-table-block__row {
+  margin: 0 -20px;
+  padding: 0 12px;
+}
+
+.pc-highlight-table-block__row + .pc-highlight-table-block__row {
+  border-top: 1px solid var(--g-color-private-black-100);
+}
+.pc-highlight-table-block__scrollbar {
+  visibility: hidden;
+  overflow: hidden;
+  height: 5px;
+  width: 100%;
+  margin-top: -5px;
+  border-radius: 2px;
+  background-color: var(--g-color-private-black-150);
+}
+@media (max-width: 769px) {
+  .pc-highlight-table-block__scrollbar {
+    visibility: visible;
+  }
+  .pc-highlight-table-block__scrollbar > div {
+    height: 100%;
+    border-radius: 2px;
+    background-color: var(--g-color-private-black-400);
+    transition: transform ease 50ms;
+  }
+}

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

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

package/build/cjs/blocks/HighlightTable/HighlightTable.js

@@ -0,0 +1,74 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.HighlightTableBlock = void 0;
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importStar(require("react"));
+const uikit_1 = require("@gravity-ui/uikit");
+const components_1 = require("../../components");
+const grid_1 = require("../../grid");
+const utils_1 = require("../../utils");
+const b = (0, utils_1.block)('highlight-table-block');
+function getColSize(value) {
+    switch (value) {
+        case 'xxl':
+            return 12;
+        case 'xl':
+            return 6;
+        case 'l':
+            return 4;
+        case 'm':
+            return 3;
+        case 's':
+            return 2;
+        case 'xs':
+            return 1;
+        default:
+            return undefined;
+    }
+}
+const HighlightTableBlock = (props) => {
+    const { title, description, table } = props;
+    const firstRow = table.content[0] || [];
+    const otherRows = table.content.slice(1);
+    const tableRef = (0, react_1.useRef)(null);
+    const scrollBarRef = (0, react_1.useRef)(null);
+    const scrollThumbRef = (0, react_1.useRef)(null);
+    (0, react_1.useEffect)(() => {
+        const tableElem = tableRef.current;
+        const scrollBar = scrollBarRef.current;
+        const scrollThumb = scrollThumbRef.current;
+        if (!tableElem || !scrollBar || !scrollThumb)
+            return () => { };
+        const updateProgress = () => {
+            const scrollWidth = Math.round(scrollBar.clientWidth * (tableElem.clientWidth / tableElem.scrollWidth));
+            const scrollLeft = Math.round(scrollBar.clientWidth * (tableElem.scrollLeft / tableElem.scrollWidth));
+            scrollThumb.style.setProperty('transform', `translateX(${scrollLeft}px)`);
+            scrollThumb.style.setProperty('width', `${scrollWidth}px`);
+        };
+        updateProgress();
+        tableElem.addEventListener('scroll', updateProgress);
+        return () => {
+            tableElem.removeEventListener('scroll', updateProgress);
+        };
+    }, []);
+    const renderRow = (0, react_1.useCallback)((row, index) => {
+        var _a, _b;
+        return (react_1.default.createElement(grid_1.Row, { key: index, className: b('row'), style: { backgroundColor: (_b = (_a = table.highlighter) === null || _a === void 0 ? void 0 : _a[index]) !== null && _b !== void 0 ? _b : '' } }, row.map((cell, cellIndex) => {
+            var _a, _b, _c;
+            return (react_1.default.createElement(grid_1.Col, { sizes: getColSize((_a = table.customColumnWidth) === null || _a === void 0 ? void 0 : _a[cellIndex]), key: cellIndex, className: b('cell'), style: { textAlign: (_c = (_b = table.justify) === null || _b === void 0 ? void 0 : _b[cellIndex]) !== null && _c !== void 0 ? _c : 'left' } },
+                react_1.default.createElement(components_1.HTML, null, cell)));
+        })));
+    }, [table.customColumnWidth, table.highlighter, table.justify]);
+    return (react_1.default.createElement("div", { className: b() },
+        react_1.default.createElement(uikit_1.Text, { className: b('title'), variant: "header-2" }, title),
+        description && (react_1.default.createElement("div", { className: b('description') },
+            react_1.default.createElement(components_1.YFMWrapper, { content: description, modifiers: { constructor: true } }))),
+        react_1.default.createElement("div", { ref: tableRef, className: b('table') },
+            react_1.default.createElement(grid_1.Grid, { className: b('content') },
+                react_1.default.createElement("div", { className: b('head') }, renderRow(firstRow, 0)),
+                react_1.default.createElement("div", { className: b('body') }, otherRows.map(renderRow)))),
+        react_1.default.createElement("div", { ref: scrollBarRef, className: b('scrollbar') },
+            react_1.default.createElement("div", { ref: scrollThumbRef }))));
+};
+exports.HighlightTableBlock = HighlightTableBlock;
+exports.default = exports.HighlightTableBlock;

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

@@ -0,0 +1,135 @@
+export declare const HighlightTableBlock: {
+    'highlight-table-block': {
+        additionalProperties: boolean;
+        required: string[];
+        properties: {
+            title: {
+                type: string;
+            };
+            description: {
+                type: string;
+            };
+            table: {
+                additionalProperties: boolean;
+                required: string[];
+                properties: {
+                    content: {
+                        type: string;
+                        items: {
+                            type: string;
+                            items: {
+                                type: string;
+                            };
+                        };
+                    };
+                    justify: {
+                        type: string;
+                        items: {
+                            type: string;
+                            enum: string[];
+                        };
+                    };
+                    highlighter: {
+                        type: string;
+                        items: {
+                            type: string;
+                        };
+                    };
+                    customColumnWidth: {
+                        type: string;
+                        items: {
+                            type: string;
+                            enum: string[];
+                        };
+                    };
+                    type: {};
+                    when: {
+                        type: string;
+                    };
+                };
+            };
+            anchor: {
+                type: string;
+                additionalProperties: boolean;
+                required: string[];
+                properties: {
+                    text: {
+                        type: string;
+                        contentType: string;
+                    };
+                    url: {
+                        type: string;
+                    };
+                    urlTitle: {
+                        type: string;
+                    };
+                };
+            };
+            visibility: {
+                oneOf: ({
+                    type: string;
+                    enum: string[];
+                    additionalProperties?: undefined;
+                    properties?: undefined;
+                } | {
+                    type: string;
+                    additionalProperties: boolean;
+                    properties: {
+                        xs: {
+                            type: string;
+                        };
+                        sm: {
+                            type: string;
+                        };
+                        md: {
+                            type: string;
+                        };
+                        lg: {
+                            type: string;
+                        };
+                        xl: {
+                            type: string;
+                        };
+                        xxl: {
+                            type: string;
+                        };
+                    };
+                    enum?: undefined;
+                })[];
+            };
+            visible: {
+                type: string;
+                enum: string[];
+            };
+            hidden: {
+                type: string;
+                enum: string[];
+            };
+            resetPaddings: {
+                type: string;
+            };
+            context: {
+                type: string;
+            };
+            indent: {
+                type: string;
+                additionalProperties: boolean;
+                properties: {
+                    top: {
+                        enum: string[];
+                    };
+                    bottom: {
+                        enum: string[];
+                    };
+                };
+            };
+            backgroundFull: {
+                type: string;
+            };
+            type: {};
+            when: {
+                type: string;
+            };
+        };
+    };
+};

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

@@ -0,0 +1,44 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.HighlightTableBlock = void 0;
+const common_1 = require("../../schema/validators/common");
+exports.HighlightTableBlock = {
+    'highlight-table-block': {
+        additionalProperties: false,
+        required: ['table'],
+        properties: Object.assign(Object.assign({}, common_1.BlockBaseProps), { title: {
+                type: 'string',
+            }, description: {
+                type: 'string',
+            }, table: {
+                additionalProperties: false,
+                required: ['content'],
+                properties: Object.assign(Object.assign({}, common_1.BaseProps), { content: {
+                        type: 'array',
+                        items: {
+                            type: 'array',
+                            items: {
+                                type: 'string',
+                            },
+                        },
+                    }, justify: {
+                        type: 'array',
+                        items: {
+                            type: 'string',
+                            enum: ['left', 'center', 'right'],
+                        },
+                    }, highlighter: {
+                        type: 'array',
+                        items: {
+                            type: 'string',
+                        },
+                    }, customColumnWidth: {
+                        type: 'array',
+                        items: {
+                            type: 'string',
+                            enum: ['xxl', 'xl', 'l', 'm', 's', 'xs'],
+                        },
+                    } }),
+            } }),
+    },
+};

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

@@ -25,3 +25,4 @@ export { default as LinkTableBlock } from './LinkTable/LinkTable';
 export { default as EventsFeedBlock } from './EventsFeed/EventsFeed';
 export { default as BlogFeedBlock } from './BlogFeed/BlogFeed';
 export { default as PressReleasesBlock } from './PressReleases/PressReleases';
+export { default as HighlightTableBlock } from './HighlightTable/HighlightTable';

package/build/cjs/blocks/index.js

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.PressReleasesBlock = exports.BlogFeedBlock = exports.EventsFeedBlock = exports.LinkTableBlock = exports.QuotesBlock = exports.ServicesBlock = exports.SolutionsBlock = exports.MarqueeLinksBlock = exports.FormBlock = exports.FilterBlock = exports.ShareBlock = exports.ContentLayoutBlock = exports.CardLayoutBlock = exports.HeaderSliderBlock = exports.IconsBlock = exports.HeaderBlock = exports.TabsBlock = exports.TableBlock = exports.QuestionsBlock = exports.PromoFeaturesBlock = exports.ExtendedFeaturesBlock = exports.SliderBlock = exports.MapBlock = exports.MediaBlock = exports.InfoBlock = exports.CompaniesBlock = exports.BannerBlock = void 0;
+exports.HighlightTableBlock = exports.PressReleasesBlock = exports.BlogFeedBlock = exports.EventsFeedBlock = exports.LinkTableBlock = exports.QuotesBlock = exports.ServicesBlock = exports.SolutionsBlock = exports.MarqueeLinksBlock = exports.FormBlock = exports.FilterBlock = exports.ShareBlock = exports.ContentLayoutBlock = exports.CardLayoutBlock = exports.HeaderSliderBlock = exports.IconsBlock = exports.HeaderBlock = exports.TabsBlock = exports.TableBlock = exports.QuestionsBlock = exports.PromoFeaturesBlock = exports.ExtendedFeaturesBlock = exports.SliderBlock = exports.MapBlock = exports.MediaBlock = exports.InfoBlock = exports.CompaniesBlock = exports.BannerBlock = void 0;
 var Banner_1 = require("./Banner/Banner");
 Object.defineProperty(exports, "BannerBlock", { enumerable: true, get: function () { return __importDefault(Banner_1).default; } });
 var Companies_1 = require("./Companies/Companies");
@@ -58,3 +58,5 @@ var BlogFeed_1 = require("./BlogFeed/BlogFeed");
 Object.defineProperty(exports, "BlogFeedBlock", { enumerable: true, get: function () { return __importDefault(BlogFeed_1).default; } });
 var PressReleases_1 = require("./PressReleases/PressReleases");
 Object.defineProperty(exports, "PressReleasesBlock", { enumerable: true, get: function () { return __importDefault(PressReleases_1).default; } });
+var HighlightTable_1 = require("./HighlightTable/HighlightTable");
+Object.defineProperty(exports, "HighlightTableBlock", { enumerable: true, get: function () { return __importDefault(HighlightTable_1).default; } });

package/build/cjs/constructor-items.d.ts

@@ -23,6 +23,7 @@ export declare const blockMap: {
     "events-feed-block": ({ image, title }: import("./models").EventsFeedBlockProps) => JSX.Element;
     "blog-feed-block": ({ image, title }: import("./models").BlogFeedBlockProps) => JSX.Element;
     "press-releases-block": ({ title }: import("./models").PressReleasesBlockProps) => JSX.Element;
+    "highlight-table-block": (props: import("./models").HighlightTableBlockProps) => JSX.Element;
     "link-table-block": ({ title, items }: import("./models").LinkTableBlockProps) => JSX.Element;
     "services-block": ({ title, serviceLinkType }: import("./models").ServicesBlockProps) => JSX.Element;
     "quotes-block": ({ theme: localTheme, items, background, backgroundColor, }: import("./models").QuotesBlockProps) => JSX.Element;

package/build/cjs/constructor-items.js

@@ -33,6 +33,7 @@ exports.blockMap = {
     [models_1.BlockType.EventsFeedBlock]: blocks_1.EventsFeedBlock,
     [models_1.BlockType.BlogFeedBlock]: blocks_1.BlogFeedBlock,
     [models_1.BlockType.PressReleasesBlock]: blocks_1.PressReleasesBlock,
+    [models_1.BlockType.HighlightTableBlock]: blocks_1.HighlightTableBlock,
     [models_1.BlockType.LinkTableBlock]: blocks_1.LinkTableBlock,
     [models_1.BlockType.ServicesBlock]: blocks_1.ServicesBlock,
     [models_1.BlockType.QuotesBlock]: blocks_1.QuotesBlock,

package/build/cjs/containers/PageConstructor/components/ConstructorBlock/ConstructorBlock.css

@@ -35,4 +35,8 @@ unpredictable css rules order in build */
 }
 .pc-constructor-block.pc-constructor-block.pc-constructor-block.pc-constructor-block_indentBottom_xl {
   padding-bottom: 64px;
+}
+
+.pc-constructor-block_type_blog-feed-block, .pc-constructor-block_type_events-feed-block {
+  z-index: 2;
 }

package/build/cjs/models/constructor-items/blocks.d.ts

@@ -33,7 +33,8 @@ export declare enum BlockType {
     EventsFeedBlock = "events-feed-block",
     BlogFeedBlock = "blog-feed-block",
     PressReleasesBlock = "press-releases-block",
-    SliderNewBlock = "slider-new-block"
+    SliderNewBlock = "slider-new-block",
+    HighlightTableBlock = "highlight-table-block"
 }
 export declare const BlockTypes: BlockType[];
 export declare const HeaderBlockTypes: BlockType[];
@@ -264,6 +265,17 @@ export interface TableBlockProps {
     links?: LinkProps[];
     buttons?: ButtonProps[];
 }
+export interface HighlightTableData {
+    content: string[][];
+    customColumnWidth?: ('xxl' | 'xl' | 'l' | 'm' | 's' | 'xs')[];
+    justify?: ('left' | 'right' | 'center')[];
+    highlighter?: string[];
+}
+export interface HighlightTableBlockProps {
+    title?: string;
+    description?: string;
+    table: HighlightTableData;
+}
 export interface TabsBlockItem extends Omit<ContentBlockProps, 'size' | 'colSizes' | 'centered' | 'theme'>, WithBorder {
     tabName: string;
     /**
@@ -468,6 +480,9 @@ export type InfoBlockModel = {
 export type TableBlockModel = {
     type: BlockType.TableBlock;
 } & TableBlockProps;
+export type HighlightTableBlockModel = {
+    type: BlockType.HighlightTableBlock;
+} & HighlightTableBlockProps;
 export type TabsBlockModel = {
     type: BlockType.TabsBlock;
 } & TabsBlockProps;
@@ -519,7 +534,7 @@ export type PressReleasesBlockModel = {
 export type SliderNewBlockModel = {
     type: BlockType.SliderNewBlock;
 } & SliderNewProps;
-type BlockModels = SliderBlockModel | ExtendedFeaturesBlockModel | PromoFeaturesBlockModel | QuestionsBlockModel | BannerBlockModel | CompaniesBlockModel | MediaBlockModel | MapBlockModel | InfoBlockModel | TableBlockModel | TabsBlockModel | HeaderBlockModel | IconsBlockModel | HeaderSliderBlockModel | CardLayoutBlockModel | ContentLayoutBlockModel | ShareBLockModel | FilterBlockModel | FormBlockModel | MarqueeLinksBlockModel | SolutionsBlockModel | ServicesBlockModel | QuotesBlockModel | LinkTableBlockModel | EventsFeedBlockModel | BlogFeedBlockModel | PressReleasesBlockModel;
+type BlockModels = SliderBlockModel | ExtendedFeaturesBlockModel | PromoFeaturesBlockModel | QuestionsBlockModel | BannerBlockModel | CompaniesBlockModel | MediaBlockModel | MapBlockModel | InfoBlockModel | TableBlockModel | HighlightTableBlockModel | TabsBlockModel | HeaderBlockModel | IconsBlockModel | HeaderSliderBlockModel | CardLayoutBlockModel | ContentLayoutBlockModel | ShareBLockModel | FilterBlockModel | FormBlockModel | MarqueeLinksBlockModel | SolutionsBlockModel | ServicesBlockModel | QuotesBlockModel | LinkTableBlockModel | EventsFeedBlockModel | BlogFeedBlockModel | PressReleasesBlockModel;
 type UnstableBlockModels = SliderNewBlockModel;
 export type Block = (BlockModels | UnstableBlockModels) & BlockBaseProps;
 export {};

package/build/cjs/models/constructor-items/blocks.js

@@ -32,6 +32,7 @@ var BlockType;
     BlockType["PressReleasesBlock"] = "press-releases-block";
     // unstable
     BlockType["SliderNewBlock"] = "slider-new-block";
+    BlockType["HighlightTableBlock"] = "highlight-table-block";
 })(BlockType = exports.BlockType || (exports.BlockType = {}));
 exports.BlockTypes = Object.values(BlockType);
 exports.HeaderBlockTypes = [BlockType.HeaderBlock, BlockType.HeaderSliderBlock];

package/build/cjs/schema/constants.js

@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.constructorCardSchemaNames = exports.constructorBlockSchemaNames = exports.cardSchemas = exports.blockSchemas = void 0;
 const blocks_1 = require("./validators/blocks");
 const sub_blocks_1 = require("./validators/sub-blocks");
-exports.blockSchemas = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, sub_blocks_1.Divider), blocks_1.ExtendedFeaturesBlock), blocks_1.PromoFeaturesBlock), blocks_1.SliderBlock), blocks_1.QuestionsBlock), blocks_1.HeaderBlock), blocks_1.BannerBlock), blocks_1.CompaniesBlock), blocks_1.MediaBlock), blocks_1.MapBlock), blocks_1.InfoBlock), blocks_1.TableBlock), blocks_1.TabsBlock), blocks_1.HeaderSliderBlock), blocks_1.IconsBlock), blocks_1.CardLayoutBlock), blocks_1.ContentLayoutBlock), blocks_1.ShareBlock), blocks_1.FilterBlock), blocks_1.FormBlock), blocks_1.SliderNewBlock), blocks_1.MarqueeLinksBlock), blocks_1.SolutionsBlock), blocks_1.ServicesBlock), blocks_1.QuotesBlock), blocks_1.LinkTableBlock), blocks_1.EventsFeedBlock), blocks_1.BlogFeedBlock), blocks_1.PressReleasesBlock);
+exports.blockSchemas = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, sub_blocks_1.Divider), blocks_1.ExtendedFeaturesBlock), blocks_1.PromoFeaturesBlock), blocks_1.SliderBlock), blocks_1.QuestionsBlock), blocks_1.HeaderBlock), blocks_1.BannerBlock), blocks_1.CompaniesBlock), blocks_1.MediaBlock), blocks_1.MapBlock), blocks_1.InfoBlock), blocks_1.TableBlock), blocks_1.HighlightTableBlock), blocks_1.TabsBlock), blocks_1.HeaderSliderBlock), blocks_1.IconsBlock), blocks_1.CardLayoutBlock), blocks_1.ContentLayoutBlock), blocks_1.ShareBlock), blocks_1.FilterBlock), blocks_1.FormBlock), blocks_1.SliderNewBlock), blocks_1.MarqueeLinksBlock), blocks_1.SolutionsBlock), blocks_1.ServicesBlock), blocks_1.QuotesBlock), blocks_1.LinkTableBlock), blocks_1.EventsFeedBlock), blocks_1.BlogFeedBlock), blocks_1.PressReleasesBlock);
 exports.cardSchemas = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, sub_blocks_1.MediaCardBlock), blocks_1.BannerCard), sub_blocks_1.PriceDetailedBlock), sub_blocks_1.BackgroundCard), sub_blocks_1.Quote), sub_blocks_1.BasicCard), sub_blocks_1.PriceCardBlock), sub_blocks_1.ImageCard), sub_blocks_1.ContentLayoutCard), sub_blocks_1.Card), sub_blocks_1.PostCard), sub_blocks_1.FeedCard);
 exports.constructorBlockSchemaNames = [
     'divider',
@@ -39,6 +39,7 @@ exports.constructorBlockSchemaNames = [
     'link-table-block',
     'events-feed-block',
     'blog-feed-block',
+    'highlight-table-block',
 ];
 exports.constructorCardSchemaNames = [
     'media-card',

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

@@ -26,3 +26,4 @@ export * from '../../blocks/LinkTable/schema';
 export * from '../../blocks/EventsFeed/schema';
 export * from '../../blocks/BlogFeed/schema';
 export * from '../../blocks/PressReleases/schema';
+export * from '../../blocks/HighlightTable/schema';

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

@@ -29,3 +29,4 @@ tslib_1.__exportStar(require("../../blocks/LinkTable/schema"), exports);
 tslib_1.__exportStar(require("../../blocks/EventsFeed/schema"), exports);
 tslib_1.__exportStar(require("../../blocks/BlogFeed/schema"), exports);
 tslib_1.__exportStar(require("../../blocks/PressReleases/schema"), exports);
+tslib_1.__exportStar(require("../../blocks/HighlightTable/schema"), exports);

package/build/cjs/text-transform/config.js

@@ -10,6 +10,10 @@ function parseTableBlock(transformer, content) {
     const legend = content === null || content === void 0 ? void 0 : content.legend;
     return Object.assign(Object.assign({}, (content || {})), { legend: legend && legend.map((string) => transformer(string)) });
 }
+function parseHighlightTableBlock(transformer, content) {
+    const rows = (content === null || content === void 0 ? void 0 : content.content) || [];
+    return Object.assign(Object.assign({}, (content || {})), { content: rows.map((row) => row.map((col) => transformer(col))) });
+}
 function parseFeatures(transformer, items) {
     return items.map((_a) => {
         var { title, text } = _a, rest = tslib_1.__rest(_a, ["title", "text"]);
@@ -257,6 +261,17 @@ exports.config = {
             parser: parseTableBlock,
         },
     ],
+    [models_1.BlockType.HighlightTableBlock]: [
+        {
+            fields: ['description'],
+            transformer: common_1.yfmTransformer,
+        },
+        {
+            fields: ['table'],
+            transformer: common_1.yfmTransformer,
+            parser: parseHighlightTableBlock,
+        },
+    ],
     [models_1.BlockType.HeaderSliderBlock]: [
         {
             fields: ['items'],

package/build/esm/blocks/EventsFeed/EventsFeedRecent/EventsFeedRecent.js

@@ -18,7 +18,7 @@ export const EventsFeedRecent = () => {
     const { recent, page, pageSize, onLoadMore } = useContext(EventsRecentContext);
     const itemsToShow = recent.slice(0, page * pageSize);
     const hasMore = page < Math.ceil(recent.length / pageSize);
-    if (recent.length === 0) {
+    if (!recent || recent.length === 0) {
         return null;
     }
     return (React.createElement("div", { className: b() },

package/build/esm/blocks/EventsFeed/EventsFeedUpcoming/EventsFeedUpcoming.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
 import './EventsFeedUpcoming.css';
-export declare const EventsFeedUpcoming: () => JSX.Element;
-declare const _default: React.MemoExoticComponent<() => JSX.Element>;
+export declare const EventsFeedUpcoming: () => JSX.Element | null;
+declare const _default: React.MemoExoticComponent<() => JSX.Element | null>;
 export default _default;

package/build/esm/blocks/EventsFeed/EventsFeedUpcoming/EventsFeedUpcoming.js

@@ -15,6 +15,9 @@ const colSizes = {
 };
 export const EventsFeedUpcoming = () => {
     const { upcoming } = useContext(EventsUpcomingContext);
+    if (!upcoming || upcoming.length === 0) {
+        return null;
+    }
     return (React.createElement("div", { className: b() },
         React.createElement(Anchor, { id: "upcoming" }),
         React.createElement(CardLayoutBlock, { colSizes: colSizes }, upcoming.map((item) => (React.createElement(FeedCard, Object.assign({ key: item.slug }, item)))))));

package/build/esm/blocks/HighlightTable/HighlightTable.css

@@ -0,0 +1,86 @@
+.pc-highlight-table-block__title {
+  margin: 0;
+}
+
+/* use this for style redefinitions to awoid problems with
+unpredictable css rules order in build */
+.pc-highlight-table-block__description {
+  margin-bottom: 16px;
+}
+.pc-highlight-table-block__title {
+  font-size: var(--g-text-display-2-font-size, var(--pc-text-display-2-font-size));
+  line-height: var(--g-text-display-2-line-height, var(--pc-text-display-2-line-height));
+  color: var(--pc-text-header-color);
+  font-weight: var(--g-text-accent-font-weight);
+  position: sticky;
+  display: block;
+  margin-bottom: 16px;
+}
+@media (max-width: 576px) {
+  .pc-highlight-table-block__title {
+    font-size: var(--g-text-display-1-font-size, var(--pc-text-display-1-font-size));
+    line-height: var(--g-text-display-1-line-height, var(--pc-text-display-1-line-height));
+  }
+}
+.pc-highlight-table-block__content {
+  padding: 0 8px;
+}
+@media (max-width: 769px) {
+  .pc-highlight-table-block__content {
+    min-width: 1024px;
+  }
+}
+.pc-highlight-table-block__table {
+  overflow: auto;
+}
+@media (max-width: 769px) {
+  .pc-highlight-table-block__table {
+    margin-right: -48px;
+    margin-left: -48px;
+    padding: 0 48px 12px;
+    scrollbar-width: none;
+  }
+  .pc-highlight-table-block__table::-webkit-scrollbar {
+    display: none;
+  }
+}
+.pc-highlight-table-block__head {
+  color: rgba(0, 0, 0, 0.5);
+}
+.pc-highlight-table-block__body {
+  border: 1px solid var(--g-color-private-black-100);
+}
+.pc-highlight-table-block__head, .pc-highlight-table-block__body {
+  border-radius: 10px;
+  padding: 0 20px;
+  margin: 0 -8px;
+  overflow: hidden;
+}
+.pc-highlight-table-block__row.pc-highlight-table-block__row.pc-highlight-table-block__row.pc-highlight-table-block__row {
+  margin: 0 -20px;
+  padding: 0 12px;
+}
+
+.pc-highlight-table-block__row + .pc-highlight-table-block__row {
+  border-top: 1px solid var(--g-color-private-black-100);
+}
+.pc-highlight-table-block__scrollbar {
+  visibility: hidden;
+  overflow: hidden;
+  height: 5px;
+  width: 100%;
+  margin-top: -5px;
+  border-radius: 2px;
+  background-color: var(--g-color-private-black-150);
+}
+@media (max-width: 769px) {
+  .pc-highlight-table-block__scrollbar {
+    visibility: visible;
+  }
+  .pc-highlight-table-block__scrollbar > div {
+    height: 100%;
+    border-radius: 2px;
+    background-color: var(--g-color-private-black-400);
+    transition: transform ease 50ms;
+  }
+}