@gravity-ui/page-constructor 1.26.0-alpha.2 → 1.26.0

package/CHANGELOG.md

@@ -1,5 +1,27 @@
 # Changelog
 
+## [1.26.0](https://github.com/gravity-ui/page-constructor/compare/v1.25.2...v1.26.0) (2023-03-29)
+
+
+### Features
+
+* dropdown a ReactPlayer version ([#254](https://github.com/gravity-ui/page-constructor/issues/254)) ([#257](https://github.com/gravity-ui/page-constructor/issues/257)) ([4fffe1b](https://github.com/gravity-ui/page-constructor/commit/4fffe1b6c88f8bd3d8583606d4d2edf1ab18eafb))
+
+
+### Bug Fixes
+
+* add tag untagged ([ce9efcf](https://github.com/gravity-ui/page-constructor/commit/ce9efcfc74eaad2cbcf3cf79494f577b0eda09b3))
+* **package:** up version ([#241](https://github.com/gravity-ui/page-constructor/issues/241)) ([9b6d3f2](https://github.com/gravity-ui/page-constructor/commit/9b6d3f2ecace4e1e51c52a4c422aa44850bbefec))
+* remove description and inputs ([000a85e](https://github.com/gravity-ui/page-constructor/commit/000a85ee6d1d9fedb0cef74d990be4065a750efb))
+* try to release version ([6fc35f2](https://github.com/gravity-ui/page-constructor/commit/6fc35f2043097f883b9ad87bb348f73cc138be1e))
+
+## [1.25.3](https://github.com/gravity-ui/page-constructor/compare/v1.25.2...v1.25.3) (2023-03-27)
+
+
+### Bug Fixes
+
+* **Tabs:** wrap tabs on desktop ([#237](https://github.com/gravity-ui/page-constructor/issues/237)) ([ac7dd3d](https://github.com/gravity-ui/page-constructor/commit/ac7dd3d3573c6d633d39f88507e2bfeeb41b4f8c))
+
 ## [1.25.2](https://github.com/gravity-ui/page-constructor/compare/v1.25.1...v1.25.2) (2023-03-21)
 
 

package/build/cjs/blocks/FilterBlock/FilterBlock.css

@@ -16,18 +16,14 @@ unpredictable css rules order in build */
 .pc-filter-block__tabs {
   margin-bottom: 0;
   display: flex;
-  flex-wrap: nowrap;
+  flex-wrap: wrap;
   justify-content: flex-start;
-  overflow: auto;
 }
 .pc-filter-block__tabs_centered {
-  display: flex;
   justify-content: center;
-  flex-wrap: wrap;
 }
 @media (max-width: 769px) {
   .pc-filter-block__tabs {
-    display: flex;
     flex-wrap: nowrap;
     justify-content: flex-start;
     overflow: auto;

package/build/cjs/blocks/Header/Header.js

@@ -59,11 +59,8 @@ const HeaderBlock = (props) => {
                                 description && (react_1.default.createElement("h5", { className: b('description') },
                                     react_1.default.createElement(YFMWrapper_1.default, { content: description, modifiers: { constructor: true } }))),
                                 buttons && (react_1.default.createElement("div", { className: b('buttons'), "data-qa": "header-buttons" }, buttons &&
-                                    buttons.map((button, index) => (
-                                    // <RouterLink href={button.url} key={index}>
-                                    react_1.default.createElement(components_1.Button, Object.assign({ key: index, className: b('button'), size: "xl" }, button))
-                                    // </RouterLink>
-                                    )))),
+                                    buttons.map((button, index) => (react_1.default.createElement(components_1.RouterLink, { href: button.url, key: index },
+                                        react_1.default.createElement(components_1.Button, Object.assign({ key: index, className: b('button'), size: "xl" }, button))))))),
                                 children))),
                     hasRightSideImage && (react_1.default.createElement(components_1.Media, { className: b('media', { [curImageSize]: true }), videoClassName: b('video'), imageClassName: b('image'), video: videoThemed, image: imageThemed })))))));
 };

package/build/cjs/blocks/Icons/Icons.js

@@ -10,7 +10,7 @@ const Icons = ({ title, size = 's', items }) => {
     const { hostname } = (0, react_1.useContext)(locationContext_1.LocationContext);
     return (react_1.default.createElement("div", { className: b({ size }) },
         title && react_1.default.createElement(components_1.BlockHeader, { className: b('header'), title: title, colSizes: { all: 12 } }),
-        items.map((item) => (react_1.default.createElement(components_1.LinkBase, Object.assign({ className: b('item'), key: item.url, href: item.url }, (0, utils_1.getLinkProps)(item.url, hostname)),
+        items.map((item) => (react_1.default.createElement("a", Object.assign({ className: b('item'), key: item.url, href: item.url }, (0, utils_1.getLinkProps)(item.url, hostname)),
             react_1.default.createElement(components_1.Image, { className: b('image'), src: item.src }),
             react_1.default.createElement("p", { className: b('text') }, item.text))))));
 };

package/build/cjs/blocks/Share/Share.js

@@ -13,7 +13,6 @@ const Twitter_1 = require("../../icons/Twitter");
 const Linkedin_1 = require("../../icons/Linkedin");
 const Vk_1 = require("../../icons/Vk");
 const Telegram_1 = require("../../icons/Telegram");
-const components_1 = require("../../components");
 const icons = {
     facebook: Facebook_1.Facebook,
     twitter: Twitter_1.Twitter,
@@ -32,7 +31,7 @@ const Share = ({ items, title }) => {
             const url = (0, utils_1.getAbsolutePath)(hostname, pathname);
             const socialUrl = (0, utils_1.getShareLink)(url, type);
             const icon = icons[type];
-            return (react_1.default.createElement(uikit_1.Button, { key: type, view: "flat", size: "l", target: "_blank", href: socialUrl, component: components_1.RouterLink, className: b('item', { type: type.toLowerCase() }), onClick: handleButtonClick }, icon && react_1.default.createElement(uikit_1.Icon, { data: icon, size: 24, className: b('icon', { type }) })));
+            return (react_1.default.createElement(uikit_1.Button, { key: type, view: "flat", size: "l", target: "_blank", href: socialUrl, className: b('item', { type: type.toLowerCase() }), onClick: handleButtonClick }, icon && react_1.default.createElement(uikit_1.Icon, { data: icon, size: 24, className: b('icon', { type }) })));
         }))));
 };
 exports.default = Share;

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

@@ -16,18 +16,14 @@ unpredictable css rules order in build */
 .pc-tabs-block__tabs {
   margin-bottom: 20px;
   display: flex;
-  flex-wrap: nowrap;
+  flex-wrap: wrap;
   justify-content: flex-start;
-  overflow: auto;
 }
 .pc-tabs-block__tabs_centered {
-  display: flex;
   justify-content: center;
-  flex-wrap: wrap;
 }
 @media (max-width: 769px) {
   .pc-tabs-block__tabs {
-    display: flex;
     flex-wrap: nowrap;
     justify-content: flex-start;
     overflow: auto;

package/build/cjs/components/BackLink/BackLink.js

@@ -7,7 +7,6 @@ const icons_1 = require("../../icons");
 const locationContext_1 = require("../../context/locationContext");
 const hooks_1 = require("../../hooks");
 const models_1 = require("../../models");
-const RouterLink_1 = tslib_1.__importDefault(require("../RouterLink/RouterLink"));
 function BackLink(props) {
     const { history } = (0, react_1.useContext)(locationContext_1.LocationContext);
     const { url, title, theme = 'default', size = 'l', className, shouldHandleBackAction = false, onClick, } = props;
@@ -27,7 +26,7 @@ function BackLink(props) {
             history.push({ pathname: url });
         }
     }, [handleAnalytics, history, onClick, url]);
-    return (react_1.default.createElement(uikit_1.Button, { component: RouterLink_1.default, className: className, view: theme === 'special' ? 'flat-contrast' : 'flat-secondary', size: size, href: shouldHandleBackAction ? undefined : url, onClick: shouldHandleBackAction ? backActionHandler : undefined },
+    return (react_1.default.createElement(uikit_1.Button, { className: className, view: theme === 'special' ? 'flat-contrast' : 'flat-secondary', size: size, href: shouldHandleBackAction ? undefined : url, onClick: shouldHandleBackAction ? backActionHandler : undefined },
         react_1.default.createElement(uikit_1.Icon, { data: icons_1.ArrowSidebar, size: 24 }),
         react_1.default.createElement("span", null, title)));
 }

package/build/cjs/components/Button/Button.js

@@ -10,7 +10,6 @@ const localeContext_1 = require("../../context/localeContext/localeContext");
 const useMetrika_1 = require("../../hooks/useMetrika");
 const hooks_1 = require("../../hooks");
 const icons_1 = require("../../icons");
-const RouterLink_1 = tslib_1.__importDefault(require("../RouterLink/RouterLink"));
 const b = (0, utils_1.block)('button-block');
 const Button = (props) => {
     const handleMetrika = (0, useMetrika_1.useMetrika)();
@@ -43,7 +42,7 @@ const Button = (props) => {
         image = undefined;
     }
     const buttonTheme = theme === 'scale' ? 'accent' : theme;
-    return (react_1.default.createElement(uikit_1.Button, Object.assign({ className: buttonClass, view: (0, utils_2.toCommonView)(buttonTheme), size: (0, utils_2.toCommonSize)(size), href: url ? (0, utils_1.setUrlTld)(url, tld) : undefined, component: RouterLink_1.default }, buttonProps),
+    return (react_1.default.createElement(uikit_1.Button, Object.assign({ className: buttonClass, view: (0, utils_2.toCommonView)(buttonTheme), size: (0, utils_2.toCommonSize)(size), href: url ? (0, utils_1.setUrlTld)(url, tld) : undefined }, buttonProps),
         icon && buttonImg.position === 'left' ? icon : null,
         react_1.default.createElement("span", { className: b('content') },
             image && buttonImg.position === 'left' ? image : null,

package/build/cjs/components/FileLink/FileLink.js

@@ -5,7 +5,6 @@ const tslib_1 = require("tslib");
 const utils_1 = require("../../utils");
 const react_1 = tslib_1.__importStar(require("react"));
 const locationContext_1 = require("../../context/locationContext");
-const LinkBase_1 = tslib_1.__importDefault(require("../LinkBase/LinkBase"));
 const b = (0, utils_1.block)('file-link');
 const FIGMA_URL = 'https://www.figma.com';
 var FileExtension;
@@ -32,6 +31,6 @@ const FileLink = (props) => {
     return (react_1.default.createElement("div", { className: b({ ext: fileExt, type, size: textSize, theme }, className) },
         Object.values(FileExtension).includes(fileExt) && (react_1.default.createElement("div", { className: b('file-label') }, fileExt)),
         react_1.default.createElement("div", { className: b('link') },
-            react_1.default.createElement(LinkBase_1.default, Object.assign({ href: href }, (0, utils_1.getLinkProps)(href, hostname), { onClick: onClick }), text))));
+            react_1.default.createElement("a", Object.assign({ href: href }, (0, utils_1.getLinkProps)(href, hostname), { onClick: onClick }), text))));
 };
 exports.default = FileLink;

package/build/cjs/components/HeaderBreadcrumbs/HeaderBreadcrumbs.js

@@ -4,7 +4,6 @@ const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
 const utils_1 = require("../../utils");
 const useMetrika_1 = require("../../hooks/useMetrika");
-const LinkBase_1 = tslib_1.__importDefault(require("../LinkBase/LinkBase"));
 const b = (0, utils_1.block)('header-breadcrumbs');
 function HeaderBreadcrumbs(props) {
     const { items, metrikaGoals, pixelEvents, theme = 'light', className } = props;
@@ -13,6 +12,6 @@ function HeaderBreadcrumbs(props) {
         handleMetrika({ metrikaGoals, pixelEvents });
     };
     return (react_1.default.createElement("div", { className: b({ theme }, className) }, items.map((item) => (react_1.default.createElement("div", { className: b('item'), key: item.url },
-        react_1.default.createElement(LinkBase_1.default, { href: item.url, className: b('text'), onClick: onClick }, item.text))))));
+        react_1.default.createElement("a", { href: item.url, className: b('text'), onClick: onClick }, item.text))))));
 }
 exports.default = HeaderBreadcrumbs;

package/build/cjs/components/Link/Link.js

@@ -6,7 +6,6 @@ const uikit_1 = require("@gravity-ui/uikit");
 const utils_1 = require("../../utils");
 const models_1 = require("../../models");
 const icons_1 = require("../../icons");
-const LinkBase_1 = tslib_1.__importDefault(require("../LinkBase/LinkBase"));
 const FileLink_1 = tslib_1.__importDefault(require("../FileLink/FileLink"));
 const BackLink_1 = tslib_1.__importDefault(require("../BackLink/BackLink"));
 const localeContext_1 = require("../../context/localeContext/localeContext");
@@ -49,7 +48,7 @@ const LinkBlock = (props) => {
             case 'normal': {
                 const linkProps = (0, utils_1.getLinkProps)(url, hostname, target);
                 const content = children || text;
-                return (react_1.default.createElement(LinkBase_1.default, Object.assign({ className: b('link', { theme: colorTheme, 'has-arrow': arrow }), href: href, onClick: onClick }, linkProps), arrow ? (react_1.default.createElement(react_1.Fragment, null,
+                return (react_1.default.createElement("a", Object.assign({ className: b('link', { theme: colorTheme, 'has-arrow': arrow }), href: href, onClick: onClick }, linkProps), arrow ? (react_1.default.createElement(react_1.Fragment, null,
                     react_1.default.createElement("span", { className: b('content') }, content),
                     WORD_JOINER_SYM,
                     react_1.default.createElement(uikit_1.Icon, { className: b('arrow'), data: icons_1.Chevron, size: getArrowSize(textSize) }))) : (content)));

package/build/cjs/components/ReactPlayer/ReactPlayer.js

@@ -14,6 +14,7 @@ const metrikaContext_1 = require("../../context/metrikaContext");
 const mobileContext_1 = require("../../context/mobileContext");
 const hooks_1 = require("../../hooks");
 const icons_1 = require("../../icons");
+const utils_2 = require("./utils");
 const b = (0, utils_1.block)('ReactPlayer');
 const FPS = 60;
 // eslint-disable-next-line react/display-name
@@ -35,6 +36,7 @@ exports.ReactPlayerBlock = react_1.default.forwardRef((props, originRef) => {
     const [started, setStarted] = (0, react_1.useState)(autoPlay);
     const [paused, setPaused] = (0, react_1.useState)(false);
     const [ended, setEnded] = (0, react_1.useState)(false);
+    const videoSrc = (0, react_1.useMemo)(() => (0, utils_2.checkYoutubeVideos)(src), [src]);
     const eventsArray = (0, react_1.useMemo)(() => {
         if (analyticsEvents) {
             return Array.isArray(analyticsEvents) ? analyticsEvents : [analyticsEvents];
@@ -193,7 +195,7 @@ exports.ReactPlayerBlock = react_1.default.forwardRef((props, originRef) => {
             }, elapsedTimePercent: elapsedTimePercent }));
     }, [controls, isPlaying, customBarControlsClassName, changeMute]);
     return (react_1.default.createElement("div", { className: b({ wrapper: !currentHeight }, className), ref: ref, onClick: handleClick },
-        react_1.default.createElement(react_player_1.default, { className: b('player'), url: src, muted: muted, controls: controls === models_1.MediaVideoControlsType.Default, height: currentHeight || '100%', width: width || '100%', light: previewImgUrl, playing: isPlaying, playIcon: playIcon, progressInterval: FPS, onClickPreview: handleClickPreview, onStart: onStart, onReady: setPlayerRef, onPlay: onPlay, onPause: onPause, onProgress: onProgress, onEnded: onEnded }),
+        react_1.default.createElement(react_player_1.default, { className: b('player'), url: videoSrc, muted: muted, controls: controls === models_1.MediaVideoControlsType.Default, height: currentHeight || '100%', width: width || '100%', light: previewImgUrl, playing: isPlaying, playIcon: playIcon, progressInterval: FPS, onClickPreview: handleClickPreview, onStart: onStart, onReady: setPlayerRef, onPlay: onPlay, onPause: onPause, onProgress: onProgress, onEnded: onEnded }),
         renderCustomBarControls(muted, playedPercent)));
 });
 function getHeight(width) {

package/build/cjs/components/ReactPlayer/utils.d.ts

@@ -0,0 +1 @@
+export declare const checkYoutubeVideos: (src: string | string[]) => string | string[];

package/build/cjs/components/ReactPlayer/utils.js

@@ -0,0 +1,23 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.checkYoutubeVideos = void 0;
+// the file serves to support live video with react-player@2.9
+const LIVE_YUOTUBE_VIDEO_REGEX = /(?:youtu\.be\/live\/|youtube(?:-nocookie)?\.com\/(?:live\/))((\w|-){11})/;
+const YOUTUBE_VIDEO_TEMPLATE = 'https://www.youtube.com/watch?v=';
+const checkYoutubeVideos = (src) => {
+    if (Array.isArray(src)) {
+        return src.map((videoUrl) => {
+            var _a;
+            if (LIVE_YUOTUBE_VIDEO_REGEX.test(videoUrl)) {
+                const youtubeLiveId = (_a = videoUrl.match(LIVE_YUOTUBE_VIDEO_REGEX)) === null || _a === void 0 ? void 0 : _a[1];
+                if (!youtubeLiveId) {
+                    return videoUrl;
+                }
+                return `${YOUTUBE_VIDEO_TEMPLATE}${youtubeLiveId}`;
+            }
+            return videoUrl;
+        });
+    }
+    return src;
+};
+exports.checkYoutubeVideos = checkYoutubeVideos;

package/build/cjs/components/Title/Title.js

@@ -5,7 +5,6 @@ const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importStar(require("react"));
 const utils_1 = require("../../utils");
 const Anchor_1 = tslib_1.__importDefault(require("../Anchor/Anchor"));
-const LinkBase_1 = tslib_1.__importDefault(require("../LinkBase/LinkBase"));
 const __1 = require("../");
 const locationContext_1 = require("../../context/locationContext");
 const mobileContext_1 = require("../../context/mobileContext");
@@ -41,7 +40,7 @@ const Title = (props) => {
         content = textMarkup;
     }
     else if (url) {
-        content = (react_1.default.createElement(LinkBase_1.default, Object.assign({ className: b('link'), href: url }, (0, utils_1.getLinkProps)(url, hostname), { onClick: onClick }), insideClickableContent));
+        content = (react_1.default.createElement("a", Object.assign({ className: b('link'), href: url }, (0, utils_1.getLinkProps)(url, hostname), { onClick: onClick }), insideClickableContent));
     }
     else if (onClick) {
         content = (react_1.default.createElement("span", { className: b('link'), onClick: onClick }, insideClickableContent));

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

@@ -17,7 +17,6 @@ export { default as HeaderBreadcrumbs } from './HeaderBreadcrumbs/HeaderBreadcru
 export { default as HeightCalculator } from './HeightCalculator/HeightCalculator';
 export { default as Image } from './Image/Image';
 export { default as Link } from './Link/Link';
-export { default as LinkBase } from './LinkBase/LinkBase';
 export { default as Links } from './Link/Links';
 export { default as Media } from './Media/Media';
 export { default as OutsideClick } from './OutsideClick/OutsideClick';

package/build/cjs/components/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.FullScreenMedia = exports.MetaInfo = exports.HTML = exports.RouterLink = exports.Author = exports.OverflowScroller = exports.Control = exports.YandexForm = exports.YFMWrapper = exports.VideoBlock = exports.UnpublishedLabel = exports.ToggleArrow = exports.Title = exports.Table = exports.ReactPlayer = exports.OutsideClick = exports.Media = exports.Links = exports.LinkBase = exports.Link = exports.Image = exports.HeightCalculator = exports.HeaderBreadcrumbs = exports.FullWidthBackground = exports.FullscreenImage = exports.Foldable = exports.FileLink = exports.ErrorWrapper = exports.CardBase = exports.Button = exports.BlockHeader = exports.BlockBase = exports.BalancedMasonry = exports.BackLink = exports.BackgroundMedia = exports.BackgroundImage = exports.AnimateBlock = exports.Anchor = void 0;
+exports.FullScreenMedia = exports.MetaInfo = exports.HTML = exports.RouterLink = exports.Author = exports.OverflowScroller = exports.Control = exports.YandexForm = exports.YFMWrapper = exports.VideoBlock = exports.UnpublishedLabel = exports.ToggleArrow = exports.Title = exports.Table = exports.ReactPlayer = exports.OutsideClick = exports.Media = exports.Links = exports.Link = exports.Image = exports.HeightCalculator = exports.HeaderBreadcrumbs = exports.FullWidthBackground = exports.FullscreenImage = exports.Foldable = exports.FileLink = exports.ErrorWrapper = exports.CardBase = exports.Button = exports.BlockHeader = exports.BlockBase = exports.BalancedMasonry = exports.BackLink = exports.BackgroundMedia = exports.BackgroundImage = exports.AnimateBlock = exports.Anchor = void 0;
 var Anchor_1 = require("./Anchor/Anchor");
 Object.defineProperty(exports, "Anchor", { enumerable: true, get: function () { return __importDefault(Anchor_1).default; } });
 var AnimateBlock_1 = require("./AnimateBlock/AnimateBlock");
@@ -42,8 +42,6 @@ var Image_1 = require("./Image/Image");
 Object.defineProperty(exports, "Image", { enumerable: true, get: function () { return __importDefault(Image_1).default; } });
 var Link_1 = require("./Link/Link");
 Object.defineProperty(exports, "Link", { enumerable: true, get: function () { return __importDefault(Link_1).default; } });
-var LinkBase_1 = require("./LinkBase/LinkBase");
-Object.defineProperty(exports, "LinkBase", { enumerable: true, get: function () { return __importDefault(LinkBase_1).default; } });
 var Links_1 = require("./Link/Links");
 Object.defineProperty(exports, "Links", { enumerable: true, get: function () { return __importDefault(Links_1).default; } });
 var Media_1 = require("./Media/Media");

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

@@ -111,8 +111,6 @@ export interface MediaVideoProps extends AnalyticsEventsBase {
     controls?: MediaVideoControlsType;
     metrika?: MetrikaVideo;
 }
-export interface LinkBaseProps extends React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement> {
-}
 export interface LinkProps extends AnalyticsEventsBase, Stylable {
     url: string;
     text?: string;

package/build/cjs/navigation/components/NavigationItem/components/GithubButton/GithubButton.js

@@ -5,7 +5,6 @@ const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importStar(require("react"));
 const utils_1 = require("../../../../../utils");
 const models_1 = require("../../../../../models");
-const components_1 = require("../../../../../components");
 const b = (0, utils_1.block)('github-button');
 const DEFAULT_LABEL = 'Stars on GitHub';
 /* More information about github-buttons in https://buttons.github.io/ */
@@ -43,6 +42,6 @@ const GithubButton = ({ text, url, className, label, size, icon, }) => {
     }, []);
     return (react_1.default.createElement("div", { className: b(null, className) },
         react_1.default.createElement("span", { ref: containerRef },
-            react_1.default.createElement(components_1.LinkBase, Object.assign({ href: url, ref: linkRef, "data-show-count": "true", "aria-label": label || DEFAULT_LABEL }, (icon && { 'data-icon': models_1.NavigationGithubButtonIcon[icon] }), (size && { 'data-size': size })), text))));
+            react_1.default.createElement("a", Object.assign({ href: url, ref: linkRef, "data-show-count": "true", "aria-label": label || DEFAULT_LABEL }, (icon && { 'data-icon': models_1.NavigationGithubButtonIcon[icon] }), (size && { 'data-size': size })), text))));
 };
 exports.GithubButton = GithubButton;

package/build/cjs/navigation/components/SocialIcon/SocialIcon.js

@@ -8,7 +8,7 @@ const utils_2 = require("../../../components/Media/Image/utils");
 const b = (0, utils_1.block)('social-icon');
 const SocialIcon = ({ icon, url, className }) => {
     const iconData = (0, utils_2.getMediaImage)(icon);
-    return (react_1.default.createElement(components_1.LinkBase, { href: url, target: "_blank", rel: "noopener noreferrer", className: b(null, className) },
+    return (react_1.default.createElement("a", { href: url, target: "_blank", rel: "noopener noreferrer", className: b(null, className) },
         react_1.default.createElement(components_1.Image, Object.assign({ className: b('icon') }, iconData))));
 };
 exports.default = SocialIcon;

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

@@ -19,7 +19,7 @@ const Quote = (props) => {
     const handleButtonClick = (0, react_1.useCallback)(() => handleAnalytics(), [handleAnalytics]);
     const renderFooter = Boolean(author || url) && (react_1.default.createElement("div", { className: b('author-wrapper') },
         author && (react_1.default.createElement(components_1.Author, { className: b('author', { theme: textTheme }), author: author, type: models_1.AuthorType.Line })),
-        url && buttonText && (react_1.default.createElement(uikit_1.Button, { view: "outlined", size: "xl", href: url, component: components_1.RouterLink, className: b('link-button', { theme: textTheme }), onClick: handleButtonClick }, buttonText))));
+        url && buttonText && (react_1.default.createElement(uikit_1.Button, { view: "outlined", size: "xl", href: url, className: b('link-button', { theme: textTheme }), onClick: handleButtonClick }, buttonText))));
     return (react_1.default.createElement("div", { className: b({ theme: textTheme, border }), style: color ? { backgroundColor: color } : {} },
         react_1.default.createElement("div", { key: text, className: b('content-wrapper') },
             react_1.default.createElement("div", null,

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

@@ -38,6 +38,9 @@ export declare const Quote: {
                 type: string;
                 pattern: string;
             };
+            buttonText: {
+                type: string;
+            };
             theme: {
                 type: string;
                 enum: string[];

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

@@ -18,6 +18,8 @@ exports.Quote = {
             }, url: {
                 type: 'string',
                 pattern: schema_1.urlPattern,
+            }, buttonText: {
+                type: 'string',
             }, theme: common_1.ThemeProps, author: common_1.authorItem }),
     },
 };

package/build/esm/blocks/FilterBlock/FilterBlock.css

@@ -16,18 +16,14 @@ unpredictable css rules order in build */
 .pc-filter-block__tabs {
   margin-bottom: 0;
   display: flex;
-  flex-wrap: nowrap;
+  flex-wrap: wrap;
   justify-content: flex-start;
-  overflow: auto;
 }
 .pc-filter-block__tabs_centered {
-  display: flex;
   justify-content: center;
-  flex-wrap: wrap;
 }
 @media (max-width: 769px) {
   .pc-filter-block__tabs {
-    display: flex;
     flex-wrap: nowrap;
     justify-content: flex-start;
     overflow: auto;

package/build/esm/blocks/Header/Header.js

@@ -1,6 +1,6 @@
 import React, { useContext } from 'react';
 import { block, getThemedValue } from '../../utils';
-import { Button, Media, HTML } from '../../components';
+import { Button, Media, RouterLink, HTML } from '../../components';
 import { Grid, Row, Col } from '../../grid';
 import { getImageSize, getTitleSizes, titleWithImageSizes } from './utils';
 import { MobileContext } from '../../context/mobileContext';
@@ -56,11 +56,8 @@ export const HeaderBlock = (props) => {
                                 description && (React.createElement("h5", { className: b('description') },
                                     React.createElement(YFMWrapper, { content: description, modifiers: { constructor: true } }))),
                                 buttons && (React.createElement("div", { className: b('buttons'), "data-qa": "header-buttons" }, buttons &&
-                                    buttons.map((button, index) => (
-                                    // <RouterLink href={button.url} key={index}>
-                                    React.createElement(Button, Object.assign({ key: index, className: b('button'), size: "xl" }, button))
-                                    // </RouterLink>
-                                    )))),
+                                    buttons.map((button, index) => (React.createElement(RouterLink, { href: button.url, key: index },
+                                        React.createElement(Button, Object.assign({ key: index, className: b('button'), size: "xl" }, button))))))),
                                 children))),
                     hasRightSideImage && (React.createElement(Media, { className: b('media', { [curImageSize]: true }), videoClassName: b('video'), imageClassName: b('image'), video: videoThemed, image: imageThemed })))))));
 };

package/build/esm/blocks/Icons/Icons.js

@@ -1,6 +1,6 @@
 import React, { useContext } from 'react';
 import { block, getLinkProps } from '../../utils';
-import { BlockHeader, Image, LinkBase } from '../../components';
+import { BlockHeader, Image } from '../../components';
 import { LocationContext } from '../../context/locationContext';
 import './Icons.css';
 const b = block('icons-block');
@@ -8,7 +8,7 @@ const Icons = ({ title, size = 's', items }) => {
     const { hostname } = useContext(LocationContext);
     return (React.createElement("div", { className: b({ size }) },
         title && React.createElement(BlockHeader, { className: b('header'), title: title, colSizes: { all: 12 } }),
-        items.map((item) => (React.createElement(LinkBase, Object.assign({ className: b('item'), key: item.url, href: item.url }, getLinkProps(item.url, hostname)),
+        items.map((item) => (React.createElement("a", Object.assign({ className: b('item'), key: item.url, href: item.url }, getLinkProps(item.url, hostname)),
             React.createElement(Image, { className: b('image'), src: item.src }),
             React.createElement("p", { className: b('text') }, item.text))))));
 };

package/build/esm/blocks/Share/Share.js

@@ -10,7 +10,6 @@ import { Twitter } from '../../icons/Twitter';
 import { Linkedin } from '../../icons/Linkedin';
 import { Vk } from '../../icons/Vk';
 import { Telegram } from '../../icons/Telegram';
-import { RouterLink } from '../../components';
 import './Share.css';
 const icons = {
     facebook: Facebook,
@@ -30,7 +29,7 @@ const Share = ({ items, title }) => {
             const url = getAbsolutePath(hostname, pathname);
             const socialUrl = getShareLink(url, type);
             const icon = icons[type];
-            return (React.createElement(Button, { key: type, view: "flat", size: "l", target: "_blank", href: socialUrl, component: RouterLink, className: b('item', { type: type.toLowerCase() }), onClick: handleButtonClick }, icon && React.createElement(Icon, { data: icon, size: 24, className: b('icon', { type }) })));
+            return (React.createElement(Button, { key: type, view: "flat", size: "l", target: "_blank", href: socialUrl, className: b('item', { type: type.toLowerCase() }), onClick: handleButtonClick }, icon && React.createElement(Icon, { data: icon, size: 24, className: b('icon', { type }) })));
         }))));
 };
 export default Share;

package/build/esm/blocks/Tabs/Tabs.css

@@ -16,18 +16,14 @@ unpredictable css rules order in build */
 .pc-tabs-block__tabs {
   margin-bottom: 20px;
   display: flex;
-  flex-wrap: nowrap;
+  flex-wrap: wrap;
   justify-content: flex-start;
-  overflow: auto;
 }
 .pc-tabs-block__tabs_centered {
-  display: flex;
   justify-content: center;
-  flex-wrap: wrap;
 }
 @media (max-width: 769px) {
   .pc-tabs-block__tabs {
-    display: flex;
     flex-wrap: nowrap;
     justify-content: flex-start;
     overflow: auto;

package/build/esm/components/BackLink/BackLink.js

@@ -4,7 +4,6 @@ import { ArrowSidebar } from '../../icons';
 import { LocationContext } from '../../context/locationContext';
 import { useAnalytics } from '../../hooks';
 import { DefaultEventNames } from '../../models';
-import RouterLink from '../RouterLink/RouterLink';
 export default function BackLink(props) {
     const { history } = useContext(LocationContext);
     const { url, title, theme = 'default', size = 'l', className, shouldHandleBackAction = false, onClick, } = props;
@@ -24,7 +23,7 @@ export default function BackLink(props) {
             history.push({ pathname: url });
         }
     }, [handleAnalytics, history, onClick, url]);
-    return (React.createElement(Button, { component: RouterLink, className: className, view: theme === 'special' ? 'flat-contrast' : 'flat-secondary', size: size, href: shouldHandleBackAction ? undefined : url, onClick: shouldHandleBackAction ? backActionHandler : undefined },
+    return (React.createElement(Button, { className: className, view: theme === 'special' ? 'flat-contrast' : 'flat-secondary', size: size, href: shouldHandleBackAction ? undefined : url, onClick: shouldHandleBackAction ? backActionHandler : undefined },
         React.createElement(Icon, { data: ArrowSidebar, size: 24 }),
         React.createElement("span", null, title)));
 }

package/build/esm/components/Button/Button.js

@@ -8,7 +8,6 @@ import { LocaleContext } from '../../context/localeContext/localeContext';
 import { useMetrika } from '../../hooks/useMetrika';
 import { useAnalytics } from '../../hooks';
 import { Github } from '../../icons';
-import RouterLink from '../RouterLink/RouterLink';
 import './Button.css';
 const b = block('button-block');
 const Button = (props) => {
@@ -42,7 +41,7 @@ const Button = (props) => {
         image = undefined;
     }
     const buttonTheme = theme === 'scale' ? 'accent' : theme;
-    return (React.createElement(CommonButton, Object.assign({ className: buttonClass, view: toCommonView(buttonTheme), size: toCommonSize(size), href: url ? setUrlTld(url, tld) : undefined, component: RouterLink }, buttonProps),
+    return (React.createElement(CommonButton, Object.assign({ className: buttonClass, view: toCommonView(buttonTheme), size: toCommonSize(size), href: url ? setUrlTld(url, tld) : undefined }, buttonProps),
         icon && buttonImg.position === 'left' ? icon : null,
         React.createElement("span", { className: b('content') },
             image && buttonImg.position === 'left' ? image : null,

package/build/esm/components/FileLink/FileLink.js

@@ -1,7 +1,6 @@
 import { block, getLinkProps } from '../../utils';
 import React, { useContext } from 'react';
 import { LocationContext } from '../../context/locationContext';
-import LinkBase from '../LinkBase/LinkBase';
 import './FileLink.css';
 const b = block('file-link');
 const FIGMA_URL = 'https://www.figma.com';
@@ -28,6 +27,6 @@ const FileLink = (props) => {
     return (React.createElement("div", { className: b({ ext: fileExt, type, size: textSize, theme }, className) },
         Object.values(FileExtension).includes(fileExt) && (React.createElement("div", { className: b('file-label') }, fileExt)),
         React.createElement("div", { className: b('link') },
-            React.createElement(LinkBase, Object.assign({ href: href }, getLinkProps(href, hostname), { onClick: onClick }), text))));
+            React.createElement("a", Object.assign({ href: href }, getLinkProps(href, hostname), { onClick: onClick }), text))));
 };
 export default FileLink;

package/build/esm/components/HeaderBreadcrumbs/HeaderBreadcrumbs.js

@@ -1,7 +1,6 @@
 import React from 'react';
 import { block } from '../../utils';
 import { useMetrika } from '../../hooks/useMetrika';
-import LinkBase from '../LinkBase/LinkBase';
 import './HeaderBreadcrumbs.css';
 const b = block('header-breadcrumbs');
 export default function HeaderBreadcrumbs(props) {
@@ -11,5 +10,5 @@ export default function HeaderBreadcrumbs(props) {
         handleMetrika({ metrikaGoals, pixelEvents });
     };
     return (React.createElement("div", { className: b({ theme }, className) }, items.map((item) => (React.createElement("div", { className: b('item'), key: item.url },
-        React.createElement(LinkBase, { href: item.url, className: b('text'), onClick: onClick }, item.text))))));
+        React.createElement("a", { href: item.url, className: b('text'), onClick: onClick }, item.text))))));
 }

package/build/esm/components/Link/Link.js

@@ -3,7 +3,6 @@ import { Icon } from '@gravity-ui/uikit';
 import { block, getLinkProps, setUrlTld } from '../../utils';
 import { DefaultEventNames } from '../../models';
 import { Chevron } from '../../icons';
-import LinkBase from '../LinkBase/LinkBase';
 import FileLink from '../FileLink/FileLink';
 import BackLink from '../BackLink/BackLink';
 import { LocaleContext } from '../../context/localeContext/localeContext';
@@ -47,7 +46,7 @@ const LinkBlock = (props) => {
             case 'normal': {
                 const linkProps = getLinkProps(url, hostname, target);
                 const content = children || text;
-                return (React.createElement(LinkBase, Object.assign({ className: b('link', { theme: colorTheme, 'has-arrow': arrow }), href: href, onClick: onClick }, linkProps), arrow ? (React.createElement(Fragment, null,
+                return (React.createElement("a", Object.assign({ className: b('link', { theme: colorTheme, 'has-arrow': arrow }), href: href, onClick: onClick }, linkProps), arrow ? (React.createElement(Fragment, null,
                     React.createElement("span", { className: b('content') }, content),
                     WORD_JOINER_SYM,
                     React.createElement(Icon, { className: b('arrow'), data: Chevron, size: getArrowSize(textSize) }))) : (content)));

package/build/esm/components/ReactPlayer/ReactPlayer.js

@@ -10,6 +10,7 @@ import { MetrikaContext } from '../../context/metrikaContext';
 import { MobileContext } from '../../context/mobileContext';
 import { useAnalytics } from '../../hooks';
 import { PlayVideo } from '../../icons';
+import { checkYoutubeVideos } from './utils';
 import './ReactPlayer.css';
 const b = block('ReactPlayer');
 const FPS = 60;
@@ -32,6 +33,7 @@ export const ReactPlayerBlock = React.forwardRef((props, originRef) => {
     const [started, setStarted] = useState(autoPlay);
     const [paused, setPaused] = useState(false);
     const [ended, setEnded] = useState(false);
+    const videoSrc = useMemo(() => checkYoutubeVideos(src), [src]);
     const eventsArray = useMemo(() => {
         if (analyticsEvents) {
             return Array.isArray(analyticsEvents) ? analyticsEvents : [analyticsEvents];
@@ -190,7 +192,7 @@ export const ReactPlayerBlock = React.forwardRef((props, originRef) => {
             }, elapsedTimePercent: elapsedTimePercent }));
     }, [controls, isPlaying, customBarControlsClassName, changeMute]);
     return (React.createElement("div", { className: b({ wrapper: !currentHeight }, className), ref: ref, onClick: handleClick },
-        React.createElement(ReactPlayer, { className: b('player'), url: src, muted: muted, controls: controls === MediaVideoControlsType.Default, height: currentHeight || '100%', width: width || '100%', light: previewImgUrl, playing: isPlaying, playIcon: playIcon, progressInterval: FPS, onClickPreview: handleClickPreview, onStart: onStart, onReady: setPlayerRef, onPlay: onPlay, onPause: onPause, onProgress: onProgress, onEnded: onEnded }),
+        React.createElement(ReactPlayer, { className: b('player'), url: videoSrc, muted: muted, controls: controls === MediaVideoControlsType.Default, height: currentHeight || '100%', width: width || '100%', light: previewImgUrl, playing: isPlaying, playIcon: playIcon, progressInterval: FPS, onClickPreview: handleClickPreview, onStart: onStart, onReady: setPlayerRef, onPlay: onPlay, onPause: onPause, onProgress: onProgress, onEnded: onEnded }),
         renderCustomBarControls(muted, playedPercent)));
 });
 function getHeight(width) {

package/build/esm/components/ReactPlayer/utils.d.ts

@@ -0,0 +1 @@
+export declare const checkYoutubeVideos: (src: string | string[]) => string | string[];

package/build/esm/components/ReactPlayer/utils.js

@@ -0,0 +1,19 @@
+// the file serves to support live video with react-player@2.9
+const LIVE_YUOTUBE_VIDEO_REGEX = /(?:youtu\.be\/live\/|youtube(?:-nocookie)?\.com\/(?:live\/))((\w|-){11})/;
+const YOUTUBE_VIDEO_TEMPLATE = 'https://www.youtube.com/watch?v=';
+export const checkYoutubeVideos = (src) => {
+    if (Array.isArray(src)) {
+        return src.map((videoUrl) => {
+            var _a;
+            if (LIVE_YUOTUBE_VIDEO_REGEX.test(videoUrl)) {
+                const youtubeLiveId = (_a = videoUrl.match(LIVE_YUOTUBE_VIDEO_REGEX)) === null || _a === void 0 ? void 0 : _a[1];
+                if (!youtubeLiveId) {
+                    return videoUrl;
+                }
+                return `${YOUTUBE_VIDEO_TEMPLATE}${youtubeLiveId}`;
+            }
+            return videoUrl;
+        });
+    }
+    return src;
+};

package/build/esm/components/Title/Title.js

@@ -1,7 +1,6 @@
 import React, { Fragment, useContext } from 'react';
 import { block, getHeaderTag, getLinkProps } from '../../utils';
 import Anchor from '../Anchor/Anchor';
-import LinkBase from '../LinkBase/LinkBase';
 import { ToggleArrow, HTML } from '../';
 import { LocationContext } from '../../context/locationContext';
 import { MobileContext } from '../../context/mobileContext';
@@ -37,7 +36,7 @@ const Title = (props) => {
         content = textMarkup;
     }
     else if (url) {
-        content = (React.createElement(LinkBase, Object.assign({ className: b('link'), href: url }, getLinkProps(url, hostname), { onClick: onClick }), insideClickableContent));
+        content = (React.createElement("a", Object.assign({ className: b('link'), href: url }, getLinkProps(url, hostname), { onClick: onClick }), insideClickableContent));
     }
     else if (onClick) {
         content = (React.createElement("span", { className: b('link'), onClick: onClick }, insideClickableContent));

package/build/esm/components/index.d.ts

@@ -17,7 +17,6 @@ export { default as HeaderBreadcrumbs } from './HeaderBreadcrumbs/HeaderBreadcru
 export { default as HeightCalculator } from './HeightCalculator/HeightCalculator';
 export { default as Image } from './Image/Image';
 export { default as Link } from './Link/Link';
-export { default as LinkBase } from './LinkBase/LinkBase';
 export { default as Links } from './Link/Links';
 export { default as Media } from './Media/Media';
 export { default as OutsideClick } from './OutsideClick/OutsideClick';

package/build/esm/components/index.js

@@ -17,7 +17,6 @@ export { default as HeaderBreadcrumbs } from './HeaderBreadcrumbs/HeaderBreadcru
 export { default as HeightCalculator } from './HeightCalculator/HeightCalculator';
 export { default as Image } from './Image/Image';
 export { default as Link } from './Link/Link';
-export { default as LinkBase } from './LinkBase/LinkBase';
 export { default as Links } from './Link/Links';
 export { default as Media } from './Media/Media';
 export { default as OutsideClick } from './OutsideClick/OutsideClick';

package/build/esm/models/constructor-items/common.d.ts

@@ -111,8 +111,6 @@ export interface MediaVideoProps extends AnalyticsEventsBase {
     controls?: MediaVideoControlsType;
     metrika?: MetrikaVideo;
 }
-export interface LinkBaseProps extends React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement> {
-}
 export interface LinkProps extends AnalyticsEventsBase, Stylable {
     url: string;
     text?: string;

package/build/esm/navigation/components/NavigationItem/components/GithubButton/GithubButton.js

@@ -1,7 +1,6 @@
 import React, { useRef, useEffect } from 'react';
 import { block } from '../../../../../utils';
 import { NavigationGithubButtonIcon } from '../../../../../models';
-import { LinkBase } from '../../../../../components';
 import './GithubButton.css';
 const b = block('github-button');
 const DEFAULT_LABEL = 'Stars on GitHub';
@@ -40,5 +39,5 @@ export const GithubButton = ({ text, url, className, label, size, icon, }) => {
     }, []);
     return (React.createElement("div", { className: b(null, className) },
         React.createElement("span", { ref: containerRef },
-            React.createElement(LinkBase, Object.assign({ href: url, ref: linkRef, "data-show-count": "true", "aria-label": label || DEFAULT_LABEL }, (icon && { 'data-icon': NavigationGithubButtonIcon[icon] }), (size && { 'data-size': size })), text))));
+            React.createElement("a", Object.assign({ href: url, ref: linkRef, "data-show-count": "true", "aria-label": label || DEFAULT_LABEL }, (icon && { 'data-icon': NavigationGithubButtonIcon[icon] }), (size && { 'data-size': size })), text))));
 };

package/build/esm/navigation/components/SocialIcon/SocialIcon.js

@@ -1,12 +1,12 @@
 import React from 'react';
 import { block } from '../../../utils';
-import { Image, LinkBase } from '../../../components';
+import { Image } from '../../../components';
 import { getMediaImage } from '../../../components/Media/Image/utils';
 import './SocialIcon.css';
 const b = block('social-icon');
 const SocialIcon = ({ icon, url, className }) => {
     const iconData = getMediaImage(icon);
-    return (React.createElement(LinkBase, { href: url, target: "_blank", rel: "noopener noreferrer", className: b(null, className) },
+    return (React.createElement("a", { href: url, target: "_blank", rel: "noopener noreferrer", className: b(null, className) },
         React.createElement(Image, Object.assign({ className: b('icon') }, iconData))));
 };
 export default SocialIcon;

package/build/esm/sub-blocks/Quote/Quote.js

@@ -2,7 +2,7 @@ import React, { useCallback, useContext } from 'react';
 import { Button } from '@gravity-ui/uikit';
 import { block, getThemedValue } from '../../utils';
 import { AuthorType, DefaultEventNames } from '../../models';
-import { Author, Image, HTML, RouterLink } from '../../components';
+import { Author, Image, HTML } from '../../components';
 import { ThemeValueContext } from '../../context/theme/ThemeValueContext';
 import { getMediaImage } from '../../components/Media/Image/utils';
 import { useAnalytics } from '../../hooks';
@@ -17,7 +17,7 @@ const Quote = (props) => {
     const handleButtonClick = useCallback(() => handleAnalytics(), [handleAnalytics]);
     const renderFooter = Boolean(author || url) && (React.createElement("div", { className: b('author-wrapper') },
         author && (React.createElement(Author, { className: b('author', { theme: textTheme }), author: author, type: AuthorType.Line })),
-        url && buttonText && (React.createElement(Button, { view: "outlined", size: "xl", href: url, component: RouterLink, className: b('link-button', { theme: textTheme }), onClick: handleButtonClick }, buttonText))));
+        url && buttonText && (React.createElement(Button, { view: "outlined", size: "xl", href: url, className: b('link-button', { theme: textTheme }), onClick: handleButtonClick }, buttonText))));
     return (React.createElement("div", { className: b({ theme: textTheme, border }), style: color ? { backgroundColor: color } : {} },
         React.createElement("div", { key: text, className: b('content-wrapper') },
             React.createElement("div", null,

package/build/esm/sub-blocks/Quote/schema.d.ts

@@ -38,6 +38,9 @@ export declare const Quote: {
                 type: string;
                 pattern: string;
             };
+            buttonText: {
+                type: string;
+            };
             theme: {
                 type: string;
                 enum: string[];

package/build/esm/sub-blocks/Quote/schema.js

@@ -15,6 +15,8 @@ export const Quote = {
             }, url: {
                 type: 'string',
                 pattern: urlPattern,
+            }, buttonText: {
+                type: 'string',
             }, theme: ThemeProps, author: authorItem }),
     },
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gravity-ui/page-constructor",
-  "version": "1.26.0-alpha.2",
+  "version": "1.26.0",
   "description": "Gravity UI Page Constructor",
   "license": "MIT",
   "repository": {
@@ -50,7 +50,7 @@
     "bem-cn-lite": "^4.0.0",
     "github-buttons": "2.23.0",
     "lodash": "^4.17.21",
-    "react-player": "^2.12.0",
+    "react-player": "^2.9.0",
     "react-slick": "^0.28.1",
     "react-spring": "^9.3.0",
     "react-transition-group": "^4.4.2",

package/server/models/constructor-items/common.d.ts

@@ -111,8 +111,6 @@ export interface MediaVideoProps extends AnalyticsEventsBase {
     controls?: MediaVideoControlsType;
     metrika?: MetrikaVideo;
 }
-export interface LinkBaseProps extends React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement> {
-}
 export interface LinkProps extends AnalyticsEventsBase, Stylable {
     url: string;
     text?: string;

package/styles/mixins.scss

@@ -518,18 +518,14 @@ unpredictable css rules order in build */
 
 @mixin tab-panel() {
     display: flex;
-    flex-wrap: nowrap;
+    flex-wrap: wrap;
     justify-content: flex-start;
-    overflow: auto;
 
     &_centered {
-        display: flex;
         justify-content: center;
-        flex-wrap: wrap;
     }
 
     @media (max-width: map-get($gridBreakpoints, 'md')) {
-        display: flex;
         flex-wrap: nowrap;
         justify-content: flex-start;
         overflow: auto;

package/build/cjs/components/LinkBase/LinkBase.d.ts

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

package/build/cjs/components/LinkBase/LinkBase.js

@@ -1,18 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-const react_1 = tslib_1.__importStar(require("react"));
-const lodash_1 = require("lodash");
-const locationContext_1 = require("../../context/locationContext");
-const RouterLink_1 = tslib_1.__importDefault(require("../RouterLink/RouterLink"));
-const LinkBase = (props) => {
-    const { href, children } = props, linkProps = tslib_1.__rest(props, ["href", "children"]);
-    const { Link } = (0, react_1.useContext)(locationContext_1.LocationContext);
-    if (Link && href && !(linkProps === null || linkProps === void 0 ? void 0 : linkProps.target)) {
-        const extractedProps = (0, lodash_1.omit)(linkProps, ['rel', 'ref']);
-        return (react_1.default.createElement(RouterLink_1.default, { href: href },
-            react_1.default.createElement("a", Object.assign({}, extractedProps), children)));
-    }
-    return (react_1.default.createElement("a", Object.assign({ href: href }, linkProps), children));
-};
-exports.default = LinkBase;

package/build/esm/components/LinkBase/LinkBase.d.ts

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

package/build/esm/components/LinkBase/LinkBase.js

@@ -1,16 +0,0 @@
-import { __rest } from "tslib";
-import React, { useContext } from 'react';
-import { omit } from 'lodash';
-import { LocationContext } from '../../context/locationContext';
-import RouterLink from '../RouterLink/RouterLink';
-const LinkBase = (props) => {
-    const { href, children } = props, linkProps = __rest(props, ["href", "children"]);
-    const { Link } = useContext(LocationContext);
-    if (Link && href && !(linkProps === null || linkProps === void 0 ? void 0 : linkProps.target)) {
-        const extractedProps = omit(linkProps, ['rel', 'ref']);
-        return (React.createElement(RouterLink, { href: href },
-            React.createElement("a", Object.assign({}, extractedProps), children)));
-    }
-    return (React.createElement("a", Object.assign({ href: href }, linkProps), children));
-};
-export default LinkBase;