@gravity-ui/page-constructor 6.0.0-beta.0 → 6.0.0-beta.10

package/build/cjs/components/Media/Image/Image.js

@@ -1,36 +1,32 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.defaultAnimatedDivQa = void 0;
-const tslib_1 = require("tslib");
-const jsx_runtime_1 = require("react/jsx-runtime");
-const React = tslib_1.__importStar(require("react"));
-const web_1 = require("@react-spring/web");
-const debounce_1 = tslib_1.__importDefault(require("lodash/debounce"));
-const Slider_1 = tslib_1.__importDefault(require("../../../blocks/Slider/Slider.js"));
-const models_1 = require("../../../models/index.js");
-const utils_1 = require("../../../utils/index.js");
-const BackgroundImage_1 = tslib_1.__importDefault(require("../../BackgroundImage/BackgroundImage.js"));
-const FullscreenImage_1 = tslib_1.__importDefault(require("../../FullscreenImage/FullscreenImage.js"));
-const Image_1 = tslib_1.__importDefault(require("../../Image/Image.js"));
-const utils_2 = require("./utils.js");
-const b = (0, utils_1.block)('media-component-image');
-exports.defaultAnimatedDivQa = 'animated-div';
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from 'react';
+import { animated, config, useSpring } from '@react-spring/web';
+import debounce from 'lodash/debounce';
+import SliderBlock from '../../../blocks/Slider/Slider';
+import { SliderType } from '../../../models';
+import { block, getQaAttrubutes } from '../../../utils';
+import BackgroundImage from '../../BackgroundImage/BackgroundImage';
+import FullscreenImage from '../../FullscreenImage/FullscreenImage';
+import ImageView from '../../Image/Image';
+import { getMediaImage } from './utils';
+const b = block('media-component-image');
+export const defaultAnimatedDivQa = 'animated-div';
 const Image = (props) => {
     const { parallax, height, imageClassName, isBackground, hasVideoFallback, video, fullscreen, disableImageSliderForArrayInput, qa, onLoad, } = props;
     const image = Array.isArray(props.image) && disableImageSliderForArrayInput
         ? props.image[0]
         : props.image;
-    const qaAttributes = (0, utils_1.getQaAttrubutes)(qa, 'fullscreen-image', 'animate', 'background-image', 'image-view', 'slider-block');
+    const qaAttributes = getQaAttrubutes(qa, 'fullscreen-image', 'animate', 'background-image', 'image-view', 'slider-block');
     const [scrollY, setScrollY] = React.useState(0);
-    const [{ springScrollY }, springSetScrollY] = (0, web_1.useSpring)(() => ({
+    const [{ springScrollY }, springSetScrollY] = useSpring(() => ({
         springScrollY: 0,
-        config: web_1.config.molasses,
+        config: config.molasses,
     }));
     let parallaxInterpolate = '';
     React.useEffect(() => {
         if (parallax) {
             const handleScroll = () => setScrollY(window.scrollY);
-            const debouncedHandler = (0, debounce_1.default)(handleScroll, 5);
+            const debouncedHandler = debounce(handleScroll, 5);
             window.addEventListener('scroll', debouncedHandler, { passive: true });
             return () => window.removeEventListener('scroll', debouncedHandler);
         }
@@ -43,20 +39,20 @@ const Image = (props) => {
     }
     const imageClass = b('item', { withVideo: Boolean(video) && !hasVideoFallback }, imageClassName);
     const renderFullscreenImage = (item) => {
-        const itemData = (0, utils_2.getMediaImage)(item);
-        return ((0, jsx_runtime_1.jsx)(FullscreenImage_1.default, Object.assign({}, itemData, { imageClassName: imageClass, imageStyle: { height }, qa: qaAttributes.fullscreenImage }), itemData.alt));
+        const itemData = getMediaImage(item);
+        return (_jsx(FullscreenImage, Object.assign({}, itemData, { imageClassName: imageClass, imageStyle: { height }, qa: qaAttributes.fullscreenImage }), itemData.alt));
     };
     const imageBackground = (oneImage) => {
-        const imageData = (0, utils_2.getMediaImage)(oneImage);
-        return ((0, jsx_runtime_1.jsx)(web_1.animated.div, { style: { transform: parallaxInterpolate }, "data-qa": qaAttributes.animate, children: (0, jsx_runtime_1.jsx)(BackgroundImage_1.default, Object.assign({}, imageData, { className: imageClass, style: { height }, qa: qaAttributes.backgroundImage })) }));
+        const imageData = getMediaImage(oneImage);
+        return (_jsx(animated.div, { style: { transform: parallaxInterpolate }, "data-qa": qaAttributes.animate, children: _jsx(BackgroundImage, Object.assign({}, imageData, { className: imageClass, style: { height }, qa: qaAttributes.backgroundImage })) }));
     };
     const imageOnly = (oneImage) => {
-        const imageData = (0, utils_2.getMediaImage)(oneImage);
-        return ((0, jsx_runtime_1.jsx)(Image_1.default, Object.assign({}, imageData, { className: imageClass, style: { height }, qa: qaAttributes.imageView, onLoad: onLoad })));
+        const imageData = getMediaImage(oneImage);
+        return (_jsx(ImageView, Object.assign({}, imageData, { className: imageClass, style: { height }, qa: qaAttributes.imageView, onLoad: onLoad })));
     };
     const imageSlider = (imageArray) => {
         const fullscreenItem = fullscreen === undefined || fullscreen;
-        return ((0, jsx_runtime_1.jsx)(Slider_1.default, { slidesToShow: 1, type: models_1.SliderType.MediaCard, children: imageArray.map((item, index) => ((0, jsx_runtime_1.jsx)(React.Fragment, { children: fullscreenItem ? renderFullscreenImage(item) : imageOnly(item) }, index))) }));
+        return (_jsx(SliderBlock, { slidesToShow: 1, type: SliderType.MediaCard, children: imageArray.map((item, index) => (_jsx(React.Fragment, { children: fullscreenItem ? renderFullscreenImage(item) : imageOnly(item) }, index))) }));
     };
     if (Array.isArray(image)) {
         return imageSlider(image);
@@ -66,5 +62,4 @@ const Image = (props) => {
     }
     return isBackground ? imageBackground(image) : imageOnly(image);
 };
-exports.default = Image;
-//# sourceMappingURL=Image.js.map
+export default Image;

package/build/cjs/components/Media/Image/utils.d.ts

@@ -1,2 +1,2 @@
-import { ImageProps } from "../../../models/index.js";
-export declare function getMediaImage(image: ImageProps): import("../../../models/index.js").ImageObjectProps | import("../../../models/index.js").ImageDeviceProps;
+import { ImageProps } from '../../../models';
+export declare function getMediaImage(image: ImageProps): import("../../../models").ImageObjectProps | import("../../../models").ImageDeviceProps;

package/build/cjs/components/Media/Image/utils.js

@@ -1,7 +1,3 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.getMediaImage = getMediaImage;
-function getMediaImage(image) {
+export function getMediaImage(image) {
     return typeof image === 'string' ? { src: image } : image;
 }
-//# sourceMappingURL=utils.js.map

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

@@ -1,6 +1,6 @@
-import { MediaProps, QAProps } from "../../models/index.js";
-import { ImageAdditionProps } from "./Image/Image.js";
-import { VideoAdditionProps } from "./Video/Video.js";
+import { MediaProps, QAProps } from '../../models';
+import { ImageAdditionProps } from './Image/Image';
+import { VideoAdditionProps } from './Video/Video';
 export interface MediaAllProps extends MediaProps, VideoAdditionProps, ImageAdditionProps, QAProps {
     className?: string;
     youtubeClassName?: string;

package/build/cjs/components/Media/Media.js

@@ -1,28 +1,24 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Media = void 0;
-const tslib_1 = require("tslib");
-const jsx_runtime_1 = require("react/jsx-runtime");
-const React = tslib_1.__importStar(require("react"));
-const innerContext_1 = require("../../context/innerContext/index.js");
-const utils_1 = require("../../utils/index.js");
-const microdata_1 = require("../../utils/microdata.js");
-const VideoBlock_1 = tslib_1.__importDefault(require("../VideoBlock/VideoBlock.js"));
-const DataLens_1 = tslib_1.__importDefault(require("./DataLens/DataLens.js"));
-const FullscreenVideo_1 = tslib_1.__importDefault(require("./FullscreenVideo/FullscreenVideo.js"));
-const Iframe_1 = tslib_1.__importDefault(require("./Iframe/Iframe.js"));
-const Image_1 = tslib_1.__importDefault(require("./Image/Image.js"));
-const Video_1 = tslib_1.__importDefault(require("./Video/Video.js"));
-const b = (0, utils_1.block)('Media');
-const Media = (props) => {
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from 'react';
+import { InnerContext } from '../../context/innerContext';
+import { block, getQaAttrubutes } from '../../utils';
+import { sanitizeMicrodata } from '../../utils/microdata';
+import IframeVideoBlock from '../VideoBlock/VideoBlock';
+import DataLens from './DataLens/DataLens';
+import FullscreenVideo from './FullscreenVideo/FullscreenVideo';
+import Iframe from './Iframe/Iframe';
+import Image from './Image/Image';
+import Video from './Video/Video';
+const b = block('Media');
+export const Media = (props) => {
     const { image, video, youtube, videoIframe, dataLens, color, height, previewImg, parallax = false, fullscreen, analyticsEvents, className, imageClassName, videoClassName, youtubeClassName, disableImageSliderForArrayInput, playVideo = true, isBackground, playButton, customBarControlsClassName, qa, ratio, autoplay, onImageLoad, iframe, margins, videoMicrodata, } = props;
     const [hasVideoFallback, setHasVideoFallback] = React.useState(false);
-    const { microdata } = React.useContext(innerContext_1.InnerContext);
-    const qaAttributes = (0, utils_1.getQaAttrubutes)(qa, 'video');
+    const { microdata } = React.useContext(InnerContext);
+    const qaAttributes = getQaAttrubutes(qa, 'video');
     const content = React.useMemo(() => {
         let result = [];
         if (image) {
-            result.push((0, jsx_runtime_1.jsx)(Image_1.default, { parallax: parallax, image: image, disableImageSliderForArrayInput: disableImageSliderForArrayInput, height: height, imageClassName: imageClassName, isBackground: isBackground, video: video, hasVideoFallback: hasVideoFallback, fullscreen: fullscreen, qa: qaAttributes.image, onLoad: onImageLoad }, "image"));
+            result.push(_jsx(Image, { parallax: parallax, image: image, disableImageSliderForArrayInput: disableImageSliderForArrayInput, height: height, imageClassName: imageClassName, isBackground: isBackground, video: video, hasVideoFallback: hasVideoFallback, fullscreen: fullscreen, qa: qaAttributes.image, onLoad: onImageLoad }, "image"));
         }
         if (video) {
             const videoProps = {
@@ -40,20 +36,20 @@ const Media = (props) => {
                 ratio,
             };
             if (fullscreen) {
-                result.push((0, jsx_runtime_1.jsx)(FullscreenVideo_1.default, Object.assign({}, videoProps, { qa: qaAttributes.video })));
+                result.push(_jsx(FullscreenVideo, Object.assign({}, videoProps, { qa: qaAttributes.video })));
             }
             else {
-                result.push((0, jsx_runtime_1.jsx)(Video_1.default, Object.assign({}, videoProps, { qa: qaAttributes.video })));
+                result.push(_jsx(Video, Object.assign({}, videoProps, { qa: qaAttributes.video })));
             }
         }
         if (youtube || videoIframe) {
-            result = ((0, jsx_runtime_1.jsx)(VideoBlock_1.default, { className: b('youtube', youtubeClassName), record: youtube, videoIframe: videoIframe, attributes: { color: 'white', rel: '0' }, previewImg: previewImg, height: height, fullscreen: fullscreen, analyticsEvents: analyticsEvents, autoplay: autoplay, onImageLoad: onImageLoad }));
+            result = (_jsx(IframeVideoBlock, { className: b('youtube', youtubeClassName), record: youtube, videoIframe: videoIframe, attributes: { color: 'white', rel: '0' }, previewImg: previewImg, height: height, fullscreen: fullscreen, analyticsEvents: analyticsEvents, autoplay: autoplay, onImageLoad: onImageLoad }));
         }
         if (dataLens) {
-            result = (0, jsx_runtime_1.jsx)(DataLens_1.default, { dataLens: dataLens });
+            result = _jsx(DataLens, { dataLens: dataLens });
         }
         if (iframe) {
-            result = (0, jsx_runtime_1.jsx)(Iframe_1.default, { iframe: iframe, margins: margins });
+            result = _jsx(Iframe, { iframe: iframe, margins: margins });
         }
         return result;
     }, [
@@ -87,11 +83,9 @@ const Media = (props) => {
     const videoMicrodataScript = React.useMemo(() => {
         var _a;
         const { name, description } = videoMicrodata || {};
-        const json = JSON.stringify(Object.assign(Object.assign({ '@context': 'http://schema.org/', '@type': 'VideoObject', uploadDate: microdata === null || microdata === void 0 ? void 0 : microdata.contentUpdatedDate, contentUrl: ((_a = video === null || video === void 0 ? void 0 : video.src) === null || _a === void 0 ? void 0 : _a[0]) || videoIframe || youtube, thumbnailUrl: previewImg }, (videoMicrodata || {})), { name: name ? (0, microdata_1.sanitizeMicrodata)(name) : name, description: description ? (0, microdata_1.sanitizeMicrodata)(description) : description }));
-        return video || youtube || videoIframe ? ((0, jsx_runtime_1.jsx)("script", { type: "application/ld+json", dangerouslySetInnerHTML: { __html: json } })) : null;
+        const json = JSON.stringify(Object.assign(Object.assign({ '@context': 'http://schema.org/', '@type': 'VideoObject', uploadDate: microdata === null || microdata === void 0 ? void 0 : microdata.contentUpdatedDate, contentUrl: ((_a = video === null || video === void 0 ? void 0 : video.src) === null || _a === void 0 ? void 0 : _a[0]) || videoIframe || youtube, thumbnailUrl: previewImg }, (videoMicrodata || {})), { name: name ? sanitizeMicrodata(name) : name, description: description ? sanitizeMicrodata(description) : description }));
+        return video || youtube || videoIframe ? (_jsx("script", { type: "application/ld+json", dangerouslySetInnerHTML: { __html: json } })) : null;
     }, [microdata === null || microdata === void 0 ? void 0 : microdata.contentUpdatedDate, previewImg, video, videoIframe, videoMicrodata, youtube]);
-    return ((0, jsx_runtime_1.jsxs)("div", { className: b(null, className), style: { backgroundColor: color }, "data-qa": qa, children: [videoMicrodataScript, content] }));
+    return (_jsxs("div", { className: b(null, className), style: { backgroundColor: color }, "data-qa": qa, children: [videoMicrodataScript, content] }));
 };
-exports.Media = Media;
-exports.default = exports.Media;
-//# sourceMappingURL=Media.js.map
+export default Media;

package/build/cjs/components/Media/Video/Video.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { MediaComponentVideoProps, PlayButtonProps, QAProps } from "../../../models/index.js";
+import { MediaComponentVideoProps, PlayButtonProps, QAProps } from '../../../models';
 export interface VideoAdditionProps {
     playButton?: PlayButtonProps;
     customBarControlsClassName?: string;

package/build/cjs/components/Media/Video/Video.js

@@ -1,16 +1,13 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-const jsx_runtime_1 = require("react/jsx-runtime");
-const React = tslib_1.__importStar(require("react"));
-const models_1 = require("../../../models/index.js");
-const utils_1 = require("../../../utils/index.js");
-const DefaultVideo_1 = require("../../DefaultVideo/DefaultVideo.js");
-const ReactPlayer_1 = tslib_1.__importDefault(require("../../ReactPlayer/ReactPlayer.js"));
-const b = (0, utils_1.block)('media-component-video');
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from 'react';
+import { MediaVideoType } from '../../../models';
+import { block, getQaAttrubutes } from '../../../utils';
+import { DefaultVideo } from '../../DefaultVideo/DefaultVideo';
+import ReactPlayerBlock from '../../ReactPlayer/ReactPlayer';
+const b = block('media-component-video');
 const Video = (props) => {
     const { video, height, analyticsEvents, previewImg, playButton: commonPlayButton, customBarControlsClassName, videoClassName, playVideo, setHasVideoFallback, hasVideoFallback, qa, ratio, } = props;
-    const qaAttributes = (0, utils_1.getQaAttrubutes)(qa, 'source');
+    const qaAttributes = getQaAttrubutes(qa, 'source');
     const ref = React.useRef(null);
     React.useEffect(() => {
         if (ref && ref.current) {
@@ -33,7 +30,7 @@ const Video = (props) => {
     }, [playVideo, video, setHasVideoFallback]);
     const reactPlayerBlock = React.useMemo(() => {
         const { src, loop, controls, muted, autoplay = true, elapsedTime, playButton, ariaLabel, customControlsOptions, contain, } = video;
-        return ((0, jsx_runtime_1.jsx)(ReactPlayer_1.default, { ref: ref, className: b('react-player', videoClassName), src: src, previewImgUrl: previewImg, loop: Boolean(loop), controls: controls, muted: muted, autoplay: autoplay && playVideo, elapsedTime: elapsedTime, playButton: playButton || commonPlayButton, customBarControlsClassName: customBarControlsClassName, analyticsEvents: analyticsEvents, height: height, ariaLabel: ariaLabel, customControlsOptions: customControlsOptions, ratio: ratio === 'auto' ? undefined : ratio, autoRatio: ratio === 'auto', contain: contain }));
+        return (_jsx(ReactPlayerBlock, { ref: ref, className: b('react-player', videoClassName), src: src, previewImgUrl: previewImg, loop: Boolean(loop), controls: controls, muted: muted, autoplay: autoplay && playVideo, elapsedTime: elapsedTime, playButton: playButton || commonPlayButton, customBarControlsClassName: customBarControlsClassName, analyticsEvents: analyticsEvents, height: height, ariaLabel: ariaLabel, customControlsOptions: customControlsOptions, ratio: ratio === 'auto' ? undefined : ratio, autoRatio: ratio === 'auto', contain: contain }));
     }, [
         video,
         height,
@@ -46,7 +43,7 @@ const Video = (props) => {
         ratio,
     ]);
     const defaultVideoBlock = React.useMemo(() => {
-        return video.src.length && !hasVideoFallback ? ((0, jsx_runtime_1.jsx)("div", { className: b('wrap', videoClassName), style: { height }, "data-qa": qaAttributes.default, children: (0, jsx_runtime_1.jsx)(DefaultVideo_1.DefaultVideo, { ref: ref, video: video, qa: qaAttributes.source }) })) : null;
+        return video.src.length && !hasVideoFallback ? (_jsx("div", { className: b('wrap', videoClassName), style: { height }, "data-qa": qaAttributes.default, children: _jsx(DefaultVideo, { ref: ref, video: video, qa: qaAttributes.source }) })) : null;
     }, [
         video,
         hasVideoFallback,
@@ -56,12 +53,11 @@ const Video = (props) => {
         qaAttributes.source,
     ]);
     switch (video.type) {
-        case models_1.MediaVideoType.Player:
+        case MediaVideoType.Player:
             return reactPlayerBlock;
-        case models_1.MediaVideoType.Default:
+        case MediaVideoType.Default:
         default:
             return defaultVideoBlock;
     }
 };
-exports.default = Video;
-//# sourceMappingURL=Video.js.map
+export default Video;

package/build/cjs/components/Media/Video/utils.js

@@ -1,19 +1,16 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.getVideoTypesWithPriority = exports.VideoType = exports.VideoExt = void 0;
-var VideoExt;
+export var VideoExt;
 (function (VideoExt) {
     VideoExt["Mp4"] = "mp4";
     VideoExt["Webm"] = "webm";
     VideoExt["Ogg"] = "ogg";
     VideoExt["Ogv"] = "ogv";
-})(VideoExt || (exports.VideoExt = VideoExt = {}));
-var VideoType;
+})(VideoExt || (VideoExt = {}));
+export var VideoType;
 (function (VideoType) {
     VideoType["Mp4"] = "video/mp4";
     VideoType["Webm"] = "video/webm";
     VideoType["Ogg"] = "video/ogg";
-})(VideoType || (exports.VideoType = VideoType = {}));
+})(VideoType || (VideoType = {}));
 const VideoTypePriority = {
     [VideoType.Webm]: 1,
     [VideoType.Ogg]: 2,
@@ -34,7 +31,7 @@ function parseVideoType(src) {
             return undefined;
     }
 }
-const getVideoTypesWithPriority = (sources) => sources
+export const getVideoTypesWithPriority = (sources) => sources
     .map((src) => ({ src, type: parseVideoType(src) }))
     .sort(({ type: typeA }, { type: typeB }) => {
     if (typeA === undefined) {
@@ -45,5 +42,3 @@ const getVideoTypesWithPriority = (sources) => sources
     }
     return VideoTypePriority[typeA] - VideoTypePriority[typeB];
 });
-exports.getVideoTypesWithPriority = getVideoTypesWithPriority;
-//# sourceMappingURL=utils.js.map

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

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { MediaBaseBlockProps } from "../../models/index.js";
+import { MediaBaseBlockProps } from '../../models';
 interface MediaBaseProps extends MediaBaseBlockProps {
     children: React.ReactElement;
     onScroll?: () => void;

package/build/cjs/components/MediaBase/MediaBase.js

@@ -1,35 +1,32 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.MediaBase = void 0;
-const tslib_1 = require("tslib");
-const jsx_runtime_1 = require("react/jsx-runtime");
-const React = tslib_1.__importStar(require("react"));
-const AnimateBlock_1 = tslib_1.__importDefault(require("../AnimateBlock/AnimateBlock.js"));
-const grid_1 = require("../../grid/index.js");
-const utils_1 = require("../../utils/index.js");
-const Title_1 = tslib_1.__importDefault(require("../Title/Title.js"));
-const MediaBaseContent_1 = tslib_1.__importDefault(require("./MediaBaseContent.js"));
-const b = (0, utils_1.block)('media-base');
+import { createRequire as _createRequire } from "module";
+const __require = _createRequire(import.meta.url);
+const tslib_1 = __require("tslib");
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from 'react';
+import AnimateBlock from '../../components/AnimateBlock/AnimateBlock';
+import { Col, Grid, GridColumnSize, Row } from '../../grid';
+import { block } from '../../utils';
+import Title from '../Title/Title';
+import MediaContent from './MediaBaseContent';
+const b = block('media-base');
 const Card = () => null;
-const MediaBase = (props) => {
+export const MediaBase = (props) => {
     const { children, largeMedia, direction = 'content-media', mobileDirection = 'content-media', animated, mediaOnly, onScroll, mediaOnlyColSizes = { all: 12, md: 8 } } = props, mediaContentProps = tslib_1.__rest(props, ["children", "largeMedia", "direction", "mobileDirection", "animated", "mediaOnly", "onScroll", "mediaOnlyColSizes"]);
     const { title, description } = mediaContentProps;
     const mediaSizes = React.useMemo(() => {
         return mediaOnly
-            ? { [grid_1.GridColumnSize.All]: 12 }
-            : { [grid_1.GridColumnSize.Md]: largeMedia ? 8 : 6, [grid_1.GridColumnSize.All]: 12 };
+            ? { [GridColumnSize.All]: 12 }
+            : { [GridColumnSize.Md]: largeMedia ? 8 : 6, [GridColumnSize.All]: 12 };
     }, [mediaOnly, largeMedia]);
     const contentSizes = React.useMemo(() => {
-        return { [grid_1.GridColumnSize.Md]: largeMedia ? 4 : 6, [grid_1.GridColumnSize.All]: 12 };
+        return { [GridColumnSize.Md]: largeMedia ? 4 : 6, [GridColumnSize.All]: 12 };
     }, [largeMedia]);
-    const mediaContent = !mediaOnly && (0, jsx_runtime_1.jsx)(MediaBaseContent_1.default, Object.assign({}, mediaContentProps));
+    const mediaContent = !mediaOnly && _jsx(MediaContent, Object.assign({}, mediaContentProps));
     const card = children.type === Card ? children === null || children === void 0 ? void 0 : children.props.children : null;
-    return ((0, jsx_runtime_1.jsxs)(AnimateBlock_1.default, { className: b(), onScroll: onScroll, animate: animated, children: [mediaOnly && ((0, jsx_runtime_1.jsx)(Title_1.default, { className: b('header'), title: title, subtitle: description, colSizes: mediaOnlyColSizes })), (0, jsx_runtime_1.jsx)(grid_1.Grid, { children: (0, jsx_runtime_1.jsxs)(grid_1.Row, { className: b('row', {
+    return (_jsxs(AnimateBlock, { className: b(), onScroll: onScroll, animate: animated, children: [mediaOnly && (_jsx(Title, { className: b('header'), title: title, subtitle: description, colSizes: mediaOnlyColSizes })), _jsx(Grid, { children: _jsxs(Row, { className: b('row', {
                         reverse: direction === 'media-content',
                         'mobile-reverse': mobileDirection === 'media-content',
-                    }), children: [(0, jsx_runtime_1.jsx)(grid_1.Col, { className: b('content'), sizes: contentSizes, children: mediaContent }), card ? ((0, jsx_runtime_1.jsx)(grid_1.Col, { sizes: mediaSizes, children: (0, jsx_runtime_1.jsx)("div", { className: b('card'), children: card }) })) : null] }) })] }));
+                    }), children: [_jsx(Col, { className: b('content'), sizes: contentSizes, children: mediaContent }), card ? (_jsx(Col, { sizes: mediaSizes, children: _jsx("div", { className: b('card'), children: card }) })) : null] }) })] }));
 };
-exports.MediaBase = MediaBase;
-exports.MediaBase.Card = Card;
-exports.default = exports.MediaBase;
-//# sourceMappingURL=MediaBase.js.map
+MediaBase.Card = Card;
+export default MediaBase;

package/build/cjs/components/MediaBase/MediaBaseContent.d.ts

@@ -1,3 +1,3 @@
-import { MediaContentProps } from "../../models/index.js";
+import { MediaContentProps } from '../../models';
 declare const MediaContent: (props: MediaContentProps) => import("react/jsx-runtime").JSX.Element;
 export default MediaContent;

package/build/cjs/components/MediaBase/MediaBaseContent.js

@@ -1,13 +1,10 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const jsx_runtime_1 = require("react/jsx-runtime");
-const sub_blocks_1 = require("../../sub-blocks/index.js");
-const utils_1 = require("../../utils/index.js");
-const b = (0, utils_1.block)('media-base-content');
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Content } from '../../sub-blocks';
+import { block } from '../../utils';
+const b = block('media-base-content');
 const MediaContent = (props) => {
     const { title, description, button, links, buttons = [], additionalInfo, size = 'l', list, } = props;
     const allButtons = button ? [Object.assign(Object.assign({}, button), { size: 'xl' }), ...buttons] : buttons;
-    return ((0, jsx_runtime_1.jsx)("div", { className: b(), children: (0, jsx_runtime_1.jsx)(sub_blocks_1.Content, { title: title, text: description, links: links, theme: "default", buttons: allButtons, list: list, additionalInfo: additionalInfo, size: size, colSizes: { all: 12, md: 12 } }) }));
+    return (_jsx("div", { className: b(), children: _jsx(Content, { title: title, text: description, links: links, theme: "default", buttons: allButtons, list: list, additionalInfo: additionalInfo, size: size, colSizes: { all: 12, md: 12 } }) }));
 };
-exports.default = MediaContent;
-//# sourceMappingURL=MediaBaseContent.js.map
+export default MediaContent;

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

@@ -1,4 +1,4 @@
-import { ClassNameProps } from "../../models/index.js";
+import { ClassNameProps } from '../../models';
 export interface MetaInfpoProps extends ClassNameProps {
     items: string[];
 }

package/build/cjs/components/MetaInfo/MetaInfo.js

@@ -1,9 +1,6 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const jsx_runtime_1 = require("react/jsx-runtime");
-const utils_1 = require("../../utils/index.js");
-const index_1 = require("../index.js");
-const b = (0, utils_1.block)('meta-info');
-const MetaInfo = ({ items, className }) => ((0, jsx_runtime_1.jsx)("h4", { className: b(null, className), children: items.map((metaInfoItem) => ((0, jsx_runtime_1.jsx)(index_1.YFMWrapper, { content: metaInfoItem, className: b('item'), modifiers: { constructor: true, constructorMetaInfo: true } }, metaInfoItem))) }));
-exports.default = MetaInfo;
-//# sourceMappingURL=MetaInfo.js.map
+import { jsx as _jsx } from "react/jsx-runtime";
+import { block } from '../../utils';
+import { YFMWrapper } from '../index';
+const b = block('meta-info');
+const MetaInfo = ({ items, className }) => (_jsx("h4", { className: b(null, className), children: items.map((metaInfoItem) => (_jsx(YFMWrapper, { content: metaInfoItem, className: b('item'), modifiers: { constructor: true, constructorMetaInfo: true } }, metaInfoItem))) }));
+export default MetaInfo;

package/build/cjs/components/MetaInfo/schema.js

@@ -1,5 +1,3 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
 const metaInfo = {
     type: 'array',
     items: {
@@ -7,5 +5,4 @@ const metaInfo = {
         contentType: 'text',
     },
 };
-exports.default = metaInfo;
-//# sourceMappingURL=schema.js.map
+export default metaInfo;

package/build/cjs/components/OutsideClick/OutsideClick.js

@@ -1,11 +1,8 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-const jsx_runtime_1 = require("react/jsx-runtime");
+import { jsx as _jsx } from "react/jsx-runtime";
 //TODO move into cloud components?
-const React = tslib_1.__importStar(require("react"));
-const noop_1 = tslib_1.__importDefault(require("lodash/noop"));
-class OutsideClick extends React.Component {
+import * as React from 'react';
+import noop from 'lodash/noop';
+export default class OutsideClick extends React.Component {
     constructor() {
         super(...arguments);
         this.ref = React.createRef();
@@ -26,8 +23,6 @@ class OutsideClick extends React.Component {
     }
     render() {
         const { children, className, onClick } = this.props;
-        return ((0, jsx_runtime_1.jsx)("div", { className: className, ref: this.ref, onClick: onClick, onKeyDown: noop_1.default, role: onClick ? 'button' : 'group', tabIndex: onClick ? 0 : -1, children: children }));
+        return (_jsx("div", { className: className, ref: this.ref, onClick: onClick, onKeyDown: noop, role: onClick ? 'button' : 'group', tabIndex: onClick ? 0 : -1, children: children }));
     }
 }
-exports.default = OutsideClick;
-//# sourceMappingURL=OutsideClick.js.map

package/build/cjs/components/OverflowScroller/OverflowScroller.js

@@ -1,17 +1,14 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-const jsx_runtime_1 = require("react/jsx-runtime");
-const React = tslib_1.__importStar(require("react"));
-const debounce_1 = tslib_1.__importDefault(require("lodash/debounce"));
-const __1 = require("../index.js");
-const utils_1 = require("../../utils/index.js");
-const i18n_1 = require("./i18n/index.js");
-const b = (0, utils_1.block)('overflow-scroller');
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from 'react';
+import debounce from 'lodash/debounce';
+import { ToggleArrow } from '..';
+import { block } from '../../utils';
+import { i18n } from './i18n';
+const b = block('overflow-scroller');
 const TRANSITION_TIME = 300;
 const PADDING_SIZE = 24;
 const DEFAULT_ARROW_SIZE = 18;
-class OverflowScroller extends React.Component {
+export default class OverflowScroller extends React.Component {
     constructor() {
         super(...arguments);
         this.state = {
@@ -21,7 +18,7 @@ class OverflowScroller extends React.Component {
         this.containerRef = React.createRef();
         this.wrapperRef = React.createRef();
         // eslint-disable-next-line @typescript-eslint/member-ordering, react/sort-comp
-        this.checkOverflow = (0, debounce_1.default)(() => {
+        this.checkOverflow = debounce(() => {
             if (this.containerRef &&
                 this.containerRef.current &&
                 this.wrapperRef &&
@@ -80,11 +77,9 @@ class OverflowScroller extends React.Component {
         const wrapperStyle = arrows.length ? { left: -scrollValue } : { left: 0 };
         const paddingLeft = arrows.includes('left');
         const paddingRight = arrows.includes('right');
-        return ((0, jsx_runtime_1.jsxs)("div", { className: b('container', {
+        return (_jsxs("div", { className: b('container', {
                 'padding-left': paddingLeft,
                 'padding-right': paddingRight,
-            }), children: [(0, jsx_runtime_1.jsx)("div", { className: b(null, className), ref: this.containerRef, children: (0, jsx_runtime_1.jsx)("div", { className: b('wrapper'), style: wrapperStyle, ref: this.wrapperRef, children: children }) }), arrows.map((direction) => ((0, jsx_runtime_1.jsx)("button", { className: b('arrow', { type: direction }, arrowClassName), onClick: (e) => this.handleScrollClick(e, direction), "aria-label": (0, i18n_1.i18n)(direction), children: (0, jsx_runtime_1.jsx)(__1.ToggleArrow, { size: arrowSize, type: 'horizontal', iconType: "navigation" }) }, direction)))] }));
+            }), children: [_jsx("div", { className: b(null, className), ref: this.containerRef, children: _jsx("div", { className: b('wrapper'), style: wrapperStyle, ref: this.wrapperRef, children: children }) }), arrows.map((direction) => (_jsx("button", { className: b('arrow', { type: direction }, arrowClassName), onClick: (e) => this.handleScrollClick(e, direction), "aria-label": i18n(direction), children: _jsx(ToggleArrow, { size: arrowSize, type: 'horizontal', iconType: "navigation" }) }, direction)))] }));
     }
 }
-exports.default = OverflowScroller;
-//# sourceMappingURL=OverflowScroller.js.map

package/build/cjs/components/OverflowScroller/i18n/index.js

@@ -1,10 +1,5 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.i18n = void 0;
-const tslib_1 = require("tslib");
-const i18n_1 = require("@gravity-ui/uikit/i18n");
-const cn_1 = require("../../../utils/cn.js");
-const en_json_1 = tslib_1.__importDefault(require("./en.json"));
-const ru_json_1 = tslib_1.__importDefault(require("./ru.json"));
-exports.i18n = (0, i18n_1.addComponentKeysets)({ en: en_json_1.default, ru: ru_json_1.default }, `${cn_1.NAMESPACE}OverflowScroller`);
-//# sourceMappingURL=index.js.map
+import { addComponentKeysets } from '@gravity-ui/uikit/i18n';
+import { NAMESPACE } from '../../../utils/cn';
+import en from './en.json';
+import ru from './ru.json';
+export const i18n = addComponentKeysets({ en, ru }, `${NAMESPACE}OverflowScroller`);

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

@@ -1,4 +1,4 @@
-import { ClassNameProps } from "../../models/index.js";
+import { ClassNameProps } from '../../models';
 export interface CircleProgressProps extends ClassNameProps {
     elapsedTime: number;
     baseColor?: string;

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

@@ -1,10 +1,7 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-const jsx_runtime_1 = require("react/jsx-runtime");
-const React = tslib_1.__importStar(require("react"));
-const utils_1 = require("../../utils/index.js");
-const b = (0, utils_1.block)('CircleProgress');
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from 'react';
+import { block } from '../../utils';
+const b = block('CircleProgress');
 const CircleProgress = (props) => {
     const { baseColor, elapsedTime, circleColor = '#262626', strokeWidth = 10, radius = 50, className, } = props;
     const circumference = React.useMemo(() => 2 * Math.PI * radius, [radius]);
@@ -12,9 +9,8 @@ const CircleProgress = (props) => {
         if (!baseColor) {
             return null;
         }
-        return ((0, jsx_runtime_1.jsx)("circle", { cx: "60", cy: "60", r: radius, fill: "none", stroke: baseColor, strokeWidth: strokeWidth }));
+        return (_jsx("circle", { cx: "60", cy: "60", r: radius, fill: "none", stroke: baseColor, strokeWidth: strokeWidth }));
     }, [baseColor, radius, strokeWidth]);
-    return ((0, jsx_runtime_1.jsxs)("svg", { className: b(null, className), xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 120 120", children: [baseCircle, (0, jsx_runtime_1.jsx)("circle", { cx: "60", cy: "60", r: radius, transform: "rotate(-90 60 60)", fill: "none", strokeDashoffset: circumference - elapsedTime * circumference, strokeDasharray: circumference, stroke: circleColor, strokeWidth: strokeWidth })] }));
+    return (_jsxs("svg", { className: b(null, className), xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 120 120", children: [baseCircle, _jsx("circle", { cx: "60", cy: "60", r: radius, transform: "rotate(-90 60 60)", fill: "none", strokeDashoffset: circumference - elapsedTime * circumference, strokeDasharray: circumference, stroke: circleColor, strokeWidth: strokeWidth })] }));
 };
-exports.default = CircleProgress;
-//# sourceMappingURL=CircleProgress.js.map
+export default CircleProgress;

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

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { ClassNameProps, CustomControlsOptions, CustomControlsType } from "../../models/index.js";
+import { ClassNameProps, CustomControlsOptions, CustomControlsType } from '../../models';
 interface MuteConfigProps {
     isMuted: boolean;
     changeMute: (event: React.MouseEvent) => void;