@gravity-ui/page-constructor 6.0.0-alpha.6 → 6.0.0-beta.1

package/build/esm/components/Media/Media.js

@@ -1,24 +1,25 @@
-import React, { useContext, useMemo, useState } 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';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from 'react';
+import { InnerContext } from "../../context/innerContext/index.js";
+import { block, getQaAttrubutes } from "../../utils/index.js";
+import { sanitizeMicrodata } from "../../utils/microdata.js";
+import IframeVideoBlock from "../VideoBlock/VideoBlock.js";
+import DataLens from "./DataLens/DataLens.js";
+import FullscreenVideo from "./FullscreenVideo/FullscreenVideo.js";
+import Iframe from "./Iframe/Iframe.js";
+import Image from "./Image/Image.js";
+import Video from "./Video/Video.js";
 import './Media.css';
 const b = block('Media');
 export const Media = (props) => {
-    const { image, video, youtube, videoIframe, dataLens, color, height, previewImg, parallax = false, fullscreen, isFullscreenImageCover, analyticsEvents, className, imageClassName, videoClassName, youtubeClassName, disableImageSliderForArrayInput, playVideo = true, isBackground, playButton, customBarControlsClassName, qa, ratio, autoplay, onImageLoad, iframe, margins, videoMicrodata, } = props;
-    const [hasVideoFallback, setHasVideoFallback] = useState(false);
-    const { microdata } = useContext(InnerContext);
+    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);
     const qaAttributes = getQaAttrubutes(qa, 'video');
-    const content = useMemo(() => {
+    const content = React.useMemo(() => {
         let result = [];
         if (image) {
-            result.push(React.createElement(Image, { key: "image", parallax: parallax, image: image, disableImageSliderForArrayInput: disableImageSliderForArrayInput, height: height, imageClassName: imageClassName, fullscreenClassName: isFullscreenImageCover ? b('fullscreen-image-cover') : undefined, isBackground: isBackground, video: video, hasVideoFallback: hasVideoFallback, fullscreen: fullscreen, qa: qaAttributes.image, onLoad: onImageLoad }));
+            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 = {
@@ -36,20 +37,20 @@ export const Media = (props) => {
                 ratio,
             };
             if (fullscreen) {
-                result.push(React.createElement(FullscreenVideo, Object.assign({}, videoProps, { qa: qaAttributes.video })));
+                result.push(_jsx(FullscreenVideo, Object.assign({}, videoProps, { qa: qaAttributes.video })));
             }
             else {
-                result.push(React.createElement(Video, Object.assign({}, videoProps, { qa: qaAttributes.video })));
+                result.push(_jsx(Video, Object.assign({}, videoProps, { qa: qaAttributes.video })));
             }
         }
         if (youtube || videoIframe) {
-            result = (React.createElement(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 }));
+            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 = React.createElement(DataLens, { dataLens: dataLens });
+            result = _jsx(DataLens, { dataLens: dataLens });
         }
         if (iframe) {
-            result = React.createElement(Iframe, { iframe: iframe, margins: margins });
+            result = _jsx(Iframe, { iframe: iframe, margins: margins });
         }
         return result;
     }, [
@@ -66,7 +67,6 @@ export const Media = (props) => {
         isBackground,
         hasVideoFallback,
         fullscreen,
-        isFullscreenImageCover,
         qaAttributes.image,
         qaAttributes.video,
         onImageLoad,
@@ -81,14 +81,13 @@ export const Media = (props) => {
         autoplay,
         margins,
     ]);
-    const videoMicrodataScript = useMemo(() => {
+    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 ? sanitizeMicrodata(name) : name, description: description ? sanitizeMicrodata(description) : description }));
-        return video || youtube || videoIframe ? (React.createElement("script", { type: "application/ld+json", dangerouslySetInnerHTML: { __html: json } })) : null;
+        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 (React.createElement("div", { className: b(null, className), style: { backgroundColor: color }, "data-qa": qa },
-        videoMicrodataScript,
-        content));
+    return (_jsxs("div", { className: b(null, className), style: { backgroundColor: color }, "data-qa": qa, children: [videoMicrodataScript, content] }));
 };
 export default Media;
+//# sourceMappingURL=Media.js.map

package/build/esm/components/Media/Media.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Media.js","sourceRoot":"../../../../src","sources":["components/Media/Media.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport {InnerContext} from '../../context/innerContext';\nimport {MediaProps, QAProps} from '../../models';\nimport {block, getQaAttrubutes} from '../../utils';\nimport {sanitizeMicrodata} from '../../utils/microdata';\nimport IframeVideoBlock from '../VideoBlock/VideoBlock';\n\nimport DataLens from './DataLens/DataLens';\nimport FullscreenVideo from './FullscreenVideo/FullscreenVideo';\nimport Iframe from './Iframe/Iframe';\nimport Image, {ImageAdditionProps} from './Image/Image';\nimport Video, {VideoAdditionProps} from './Video/Video';\n\nimport './Media.scss';\n\nconst b = block('Media');\n\nexport interface MediaAllProps extends MediaProps, VideoAdditionProps, ImageAdditionProps, QAProps {\n    className?: string;\n    youtubeClassName?: string;\n    autoplay?: boolean;\n    onImageLoad?: () => void;\n}\n\nexport const Media = (props: MediaAllProps) => {\n    const {\n        image,\n        video,\n        youtube,\n        videoIframe,\n        dataLens,\n        color,\n        height,\n        previewImg,\n        parallax = false,\n        fullscreen,\n        analyticsEvents,\n        className,\n        imageClassName,\n        videoClassName,\n        youtubeClassName,\n        disableImageSliderForArrayInput,\n        playVideo = true,\n        isBackground,\n        playButton,\n        customBarControlsClassName,\n        qa,\n        ratio,\n        autoplay,\n        onImageLoad,\n        iframe,\n        margins,\n        videoMicrodata,\n    } = props;\n\n    const [hasVideoFallback, setHasVideoFallback] = React.useState(false);\n    const {microdata} = React.useContext(InnerContext);\n\n    const qaAttributes = getQaAttrubutes(qa, 'video');\n\n    const content = React.useMemo(() => {\n        let result: React.ReactElement | React.ReactElement[] = [];\n\n        if (image) {\n            result.push(\n                <Image\n                    key=\"image\"\n                    parallax={parallax}\n                    image={image}\n                    disableImageSliderForArrayInput={disableImageSliderForArrayInput}\n                    height={height}\n                    imageClassName={imageClassName}\n                    isBackground={isBackground}\n                    video={video}\n                    hasVideoFallback={hasVideoFallback}\n                    fullscreen={fullscreen}\n                    qa={qaAttributes.image}\n                    onLoad={onImageLoad}\n                />,\n            );\n        }\n\n        if (video) {\n            const videoProps = {\n                key: 'video',\n                video,\n                videoClassName,\n                height,\n                analyticsEvents,\n                playVideo,\n                previewImg,\n                playButton,\n                customBarControlsClassName,\n                hasVideoFallback,\n                setHasVideoFallback,\n                ratio,\n            };\n\n            if (fullscreen) {\n                result.push(<FullscreenVideo {...videoProps} qa={qaAttributes.video} />);\n            } else {\n                result.push(<Video {...videoProps} qa={qaAttributes.video} />);\n            }\n        }\n\n        if (youtube || videoIframe) {\n            result = (\n                <IframeVideoBlock\n                    className={b('youtube', youtubeClassName)}\n                    record={youtube}\n                    videoIframe={videoIframe}\n                    attributes={{color: 'white', rel: '0'}}\n                    previewImg={previewImg}\n                    height={height}\n                    fullscreen={fullscreen}\n                    analyticsEvents={analyticsEvents}\n                    autoplay={autoplay}\n                    onImageLoad={onImageLoad}\n                />\n            );\n        }\n\n        if (dataLens) {\n            result = <DataLens dataLens={dataLens} />;\n        }\n\n        if (iframe) {\n            result = <Iframe iframe={iframe} margins={margins} />;\n        }\n\n        return result;\n    }, [\n        image,\n        video,\n        videoIframe,\n        youtube,\n        dataLens,\n        iframe,\n        parallax,\n        disableImageSliderForArrayInput,\n        height,\n        imageClassName,\n        isBackground,\n        hasVideoFallback,\n        fullscreen,\n        qaAttributes.image,\n        qaAttributes.video,\n        onImageLoad,\n        videoClassName,\n        analyticsEvents,\n        playVideo,\n        previewImg,\n        playButton,\n        customBarControlsClassName,\n        ratio,\n        youtubeClassName,\n        autoplay,\n        margins,\n    ]);\n\n    const videoMicrodataScript = React.useMemo(() => {\n        const {name, description} = videoMicrodata || {};\n        const json = JSON.stringify({\n            '@context': 'http://schema.org/',\n            '@type': 'VideoObject',\n            uploadDate: microdata?.contentUpdatedDate,\n            contentUrl: video?.src?.[0] || videoIframe || youtube,\n            thumbnailUrl: previewImg,\n            ...(videoMicrodata || {}),\n            name: name ? sanitizeMicrodata(name) : name,\n            description: description ? sanitizeMicrodata(description) : description,\n        });\n\n        return video || youtube || videoIframe ? (\n            <script type=\"application/ld+json\" dangerouslySetInnerHTML={{__html: json}} />\n        ) : null;\n    }, [microdata?.contentUpdatedDate, previewImg, video, videoIframe, videoMicrodata, youtube]);\n\n    return (\n        <div className={b(null, className)} style={{backgroundColor: color}} data-qa={qa}>\n            {videoMicrodataScript}\n            {content}\n        </div>\n    );\n};\n\nexport default Media;\n"]}

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

@@ -1,5 +1,5 @@
-import React from 'react';
-import { MediaComponentVideoProps, PlayButtonProps, QAProps } from '../../../models';
+import * as React from 'react';
+import { MediaComponentVideoProps, PlayButtonProps, QAProps } from "../../../models/index.js";
 import './Video.css';
 export interface VideoAdditionProps {
     playButton?: PlayButtonProps;
@@ -12,5 +12,5 @@ interface InnerVideoProps {
     hasVideoFallback: boolean;
 }
 export type VideoAllProps = VideoAdditionProps & MediaComponentVideoProps & InnerVideoProps & QAProps;
-declare const Video: (props: VideoAllProps) => JSX.Element | null;
+declare const Video: (props: VideoAllProps) => import("react/jsx-runtime").JSX.Element | null;
 export default Video;

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

@@ -1,15 +1,16 @@
-import React, { useEffect, useMemo, useRef } from 'react';
-import { MediaVideoType } from '../../../models';
-import { block, getQaAttrubutes } from '../../../utils';
-import { DefaultVideo } from '../../DefaultVideo/DefaultVideo';
-import ReactPlayerBlock from '../../ReactPlayer/ReactPlayer';
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from 'react';
+import { MediaVideoType } from "../../../models/index.js";
+import { block, getQaAttrubutes } from "../../../utils/index.js";
+import { DefaultVideo } from "../../DefaultVideo/DefaultVideo.js";
+import ReactPlayerBlock from "../../ReactPlayer/ReactPlayer.js";
 import './Video.css';
 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 = getQaAttrubutes(qa, 'source');
-    const ref = useRef(null);
-    useEffect(() => {
+    const ref = React.useRef(null);
+    React.useEffect(() => {
         if (ref && ref.current) {
             const { loop } = video;
             if (loop && typeof loop !== 'boolean') {
@@ -28,9 +29,9 @@ const Video = (props) => {
             }
         }
     }, [playVideo, video, setHasVideoFallback]);
-    const reactPlayerBlock = useMemo(() => {
+    const reactPlayerBlock = React.useMemo(() => {
         const { src, loop, controls, muted, autoplay = true, elapsedTime, playButton, ariaLabel, customControlsOptions, contain, } = video;
-        return (React.createElement(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 }));
+        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,
@@ -42,9 +43,8 @@ const Video = (props) => {
         analyticsEvents,
         ratio,
     ]);
-    const defaultVideoBlock = useMemo(() => {
-        return video.src.length && !hasVideoFallback ? (React.createElement("div", { className: b('wrap', videoClassName), style: { height }, "data-qa": qaAttributes.default },
-            React.createElement(DefaultVideo, { ref: ref, video: video, qa: qaAttributes.source }))) : null;
+    const defaultVideoBlock = React.useMemo(() => {
+        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,
@@ -62,3 +62,4 @@ const Video = (props) => {
     }
 };
 export default Video;
+//# sourceMappingURL=Video.js.map

package/build/esm/components/Media/Video/Video.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Video.js","sourceRoot":"../../../../../src","sources":["components/Media/Video/Video.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport {MediaComponentVideoProps, MediaVideoType, PlayButtonProps, QAProps} from '../../../models';\nimport {block, getQaAttrubutes} from '../../../utils';\nimport {DefaultVideo} from '../../DefaultVideo/DefaultVideo';\nimport ReactPlayerBlock from '../../ReactPlayer/ReactPlayer';\n\nimport './Video.scss';\n\nconst b = block('media-component-video');\n\nexport interface VideoAdditionProps {\n    playButton?: PlayButtonProps;\n    customBarControlsClassName?: string;\n    videoClassName?: string;\n    playVideo?: boolean;\n}\n\ninterface InnerVideoProps {\n    setHasVideoFallback: React.Dispatch<boolean>;\n    hasVideoFallback: boolean;\n}\n\nexport type VideoAllProps = VideoAdditionProps &\n    MediaComponentVideoProps &\n    InnerVideoProps &\n    QAProps;\n\nconst Video = (props: VideoAllProps) => {\n    const {\n        video,\n        height,\n        analyticsEvents,\n        previewImg,\n        playButton: commonPlayButton,\n        customBarControlsClassName,\n        videoClassName,\n        playVideo,\n        setHasVideoFallback,\n        hasVideoFallback,\n        qa,\n        ratio,\n    } = props;\n\n    const qaAttributes = getQaAttrubutes(qa, 'source');\n\n    const ref = React.useRef<HTMLVideoElement>(null);\n\n    React.useEffect(() => {\n        if (ref && ref.current) {\n            const {loop} = video;\n\n            if (loop && typeof loop !== 'boolean') {\n                const {start = 0, end} = loop;\n\n                ref.current.addEventListener(\n                    'timeupdate',\n                    () => {\n                        const videoRef = ref.current;\n                        const endTime = end || (videoRef && videoRef.duration);\n\n                        if (videoRef && videoRef.currentTime === endTime) {\n                            videoRef.currentTime = start;\n                            videoRef.play().catch(() => setHasVideoFallback(true));\n                        }\n                    },\n                    {passive: true},\n                );\n            }\n\n            if (playVideo) {\n                ref.current.play().catch(() => setHasVideoFallback(true));\n            }\n        }\n    }, [playVideo, video, setHasVideoFallback]);\n\n    const reactPlayerBlock = React.useMemo(() => {\n        const {\n            src,\n            loop,\n            controls,\n            muted,\n            autoplay = true,\n            elapsedTime,\n            playButton,\n            ariaLabel,\n            customControlsOptions,\n            contain,\n        } = video;\n\n        return (\n            <ReactPlayerBlock\n                ref={ref}\n                className={b('react-player', videoClassName)}\n                src={src}\n                previewImgUrl={previewImg}\n                loop={Boolean(loop)}\n                controls={controls}\n                muted={muted}\n                autoplay={autoplay && playVideo}\n                elapsedTime={elapsedTime}\n                playButton={playButton || commonPlayButton}\n                customBarControlsClassName={customBarControlsClassName}\n                analyticsEvents={analyticsEvents}\n                height={height}\n                ariaLabel={ariaLabel}\n                customControlsOptions={customControlsOptions}\n                ratio={ratio === 'auto' ? undefined : ratio}\n                autoRatio={ratio === 'auto'}\n                contain={contain}\n            />\n        );\n    }, [\n        video,\n        height,\n        videoClassName,\n        previewImg,\n        playVideo,\n        commonPlayButton,\n        customBarControlsClassName,\n        analyticsEvents,\n        ratio,\n    ]);\n\n    const defaultVideoBlock = React.useMemo(() => {\n        return video.src.length && !hasVideoFallback ? (\n            <div\n                className={b('wrap', videoClassName)}\n                style={{height}}\n                data-qa={qaAttributes.default}\n            >\n                <DefaultVideo ref={ref} video={video} qa={qaAttributes.source} />\n            </div>\n        ) : null;\n    }, [\n        video,\n        hasVideoFallback,\n        videoClassName,\n        height,\n        qaAttributes.default,\n        qaAttributes.source,\n    ]);\n\n    switch (video.type) {\n        case MediaVideoType.Player:\n            return reactPlayerBlock;\n        case MediaVideoType.Default:\n        default:\n            return defaultVideoBlock;\n    }\n};\n\nexport default Video;\n"]}

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

@@ -42,3 +42,4 @@ export const getVideoTypesWithPriority = (sources) => sources
     }
     return VideoTypePriority[typeA] - VideoTypePriority[typeB];
 });
+//# sourceMappingURL=utils.js.map

package/build/esm/components/Media/Video/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sourceRoot":"../../../../../src","sources":["components/Media/Video/utils.ts"],"names":[],"mappings":"AAAA,MAAM,CAAN,IAAY,QAKX;AALD,WAAY,QAAQ;IAChB,uBAAW,CAAA;IACX,yBAAa,CAAA;IACb,uBAAW,CAAA;IACX,uBAAW,CAAA;AACf,CAAC,EALW,QAAQ,KAAR,QAAQ,QAKnB;AAED,MAAM,CAAN,IAAY,SAIX;AAJD,WAAY,SAAS;IACjB,8BAAiB,CAAA;IACjB,gCAAmB,CAAA;IACnB,8BAAiB,CAAA;AACrB,CAAC,EAJW,SAAS,KAAT,SAAS,QAIpB;AAOD,MAAM,iBAAiB,GAAG;IACtB,CAAC,SAAS,CAAC,IAAI,CAAC,EAAE,CAAC;IACnB,CAAC,SAAS,CAAC,GAAG,CAAC,EAAE,CAAC;IAClB,CAAC,SAAS,CAAC,GAAG,CAAC,EAAE,CAAC;CACrB,CAAC;AAEF,SAAS,cAAc,CAAC,GAAW;IAC/B,MAAM,CAAC,IAAI,CAAC,GAAG,GAAG,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;IAC9B,MAAM,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,GAAG,EAAc,CAAC;IAElD,QAAQ,OAAO,EAAE,CAAC;QACd,KAAK,QAAQ,CAAC,GAAG;YACb,OAAO,SAAS,CAAC,GAAG,CAAC;QACzB,KAAK,QAAQ,CAAC,IAAI;YACd,OAAO,SAAS,CAAC,IAAI,CAAC;QAC1B,KAAK,QAAQ,CAAC,GAAG,CAAC;QAClB,KAAK,QAAQ,CAAC,GAAG;YACb,OAAO,SAAS,CAAC,GAAG,CAAC;QACzB;YACI,OAAO,SAAS,CAAC;IACzB,CAAC;AACL,CAAC;AAED,MAAM,CAAC,MAAM,yBAAyB,GAAG,CAAC,OAAiB,EAAiB,EAAE,CAC1E,OAAO;KACF,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC,EAAC,GAAG,EAAE,IAAI,EAAE,cAAc,CAAC,GAAG,CAAC,EAAC,CAAC,CAAC;KAChD,IAAI,CAAC,CAAC,EAAC,IAAI,EAAE,KAAK,EAAC,EAAE,EAAC,IAAI,EAAE,KAAK,EAAC,EAAE,EAAE;IACnC,IAAI,KAAK,KAAK,SAAS,EAAE,CAAC;QACtB,OAAO,CAAC,CAAC;IACb,CAAC;IACD,IAAI,KAAK,KAAK,SAAS,EAAE,CAAC;QACtB,OAAO,CAAC,CAAC,CAAC;IACd,CAAC;IACD,OAAO,iBAAiB,CAAC,KAAK,CAAC,GAAG,iBAAiB,CAAC,KAAK,CAAC,CAAC;AAC/D,CAAC,CAAC,CAAC","sourcesContent":["export enum VideoExt {\n    Mp4 = 'mp4',\n    Webm = 'webm',\n    Ogg = 'ogg',\n    Ogv = 'ogv',\n}\n\nexport enum VideoType {\n    Mp4 = 'video/mp4',\n    Webm = 'video/webm',\n    Ogg = 'video/ogg',\n}\n\nexport interface ParsedVideo {\n    src: string;\n    type: VideoType | undefined;\n}\n\nconst VideoTypePriority = {\n    [VideoType.Webm]: 1,\n    [VideoType.Ogg]: 2,\n    [VideoType.Mp4]: 3,\n};\n\nfunction parseVideoType(src: string): VideoType | undefined {\n    const [path] = src.split('?');\n    const fileExt = path.split('.').pop() as VideoExt;\n\n    switch (fileExt) {\n        case VideoExt.Mp4:\n            return VideoType.Mp4;\n        case VideoExt.Webm:\n            return VideoType.Webm;\n        case VideoExt.Ogg:\n        case VideoExt.Ogv:\n            return VideoType.Ogg;\n        default:\n            return undefined;\n    }\n}\n\nexport const getVideoTypesWithPriority = (sources: string[]): ParsedVideo[] =>\n    sources\n        .map((src) => ({src, type: parseVideoType(src)}))\n        .sort(({type: typeA}, {type: typeB}) => {\n            if (typeA === undefined) {\n                return 1;\n            }\n            if (typeB === undefined) {\n                return -1;\n            }\n            return VideoTypePriority[typeA] - VideoTypePriority[typeB];\n        });\n"]}

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

@@ -1,14 +1,14 @@
-import React, { ReactElement } from 'react';
-import { MediaBaseBlockProps } from '../../models';
+import * as React from 'react';
+import { MediaBaseBlockProps } from "../../models/index.js";
 import './MediaBase.css';
 interface MediaBaseProps extends MediaBaseBlockProps {
-    children: ReactElement;
+    children: React.ReactElement;
     onScroll?: () => void;
 }
 export declare const MediaBase: {
-    (props: MediaBaseProps): JSX.Element;
+    (props: MediaBaseProps): import("react/jsx-runtime").JSX.Element;
     Card: React.FC<{
-        children?: React.ReactNode;
+        children?: React.ReactNode | undefined;
     }>;
 };
 export default MediaBase;

package/build/esm/components/MediaBase/MediaBase.js

@@ -1,36 +1,32 @@
 import { __rest } from "tslib";
-import React, { useMemo } 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';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from 'react';
+import AnimateBlock from "../AnimateBlock/AnimateBlock.js";
+import { Col, Grid, GridColumnSize, Row } from "../../grid/index.js";
+import { block } from "../../utils/index.js";
+import Title from "../Title/Title.js";
+import MediaContent from "./MediaBaseContent.js";
 import './MediaBase.css';
 const b = block('media-base');
 const Card = () => null;
 export const MediaBase = (props) => {
     const { children, largeMedia, direction = 'content-media', mobileDirection = 'content-media', animated, mediaOnly, onScroll, mediaOnlyColSizes = { all: 12, md: 8 } } = props, mediaContentProps = __rest(props, ["children", "largeMedia", "direction", "mobileDirection", "animated", "mediaOnly", "onScroll", "mediaOnlyColSizes"]);
     const { title, description } = mediaContentProps;
-    const mediaSizes = useMemo(() => {
+    const mediaSizes = React.useMemo(() => {
         return mediaOnly
             ? { [GridColumnSize.All]: 12 }
             : { [GridColumnSize.Md]: largeMedia ? 8 : 6, [GridColumnSize.All]: 12 };
     }, [mediaOnly, largeMedia]);
-    const contentSizes = useMemo(() => {
+    const contentSizes = React.useMemo(() => {
         return { [GridColumnSize.Md]: largeMedia ? 4 : 6, [GridColumnSize.All]: 12 };
     }, [largeMedia]);
-    const mediaContent = !mediaOnly && React.createElement(MediaContent, 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 (React.createElement(AnimateBlock, { className: b(), onScroll: onScroll, animate: animated },
-        mediaOnly && (React.createElement(Title, { className: b('header'), title: title, subtitle: description, colSizes: mediaOnlyColSizes })),
-        React.createElement(Grid, null,
-            React.createElement(Row, { className: b('row', {
-                    reverse: direction === 'media-content',
-                    'mobile-reverse': mobileDirection === 'media-content',
-                }) },
-                React.createElement(Col, { className: b('content'), sizes: contentSizes }, mediaContent),
-                card ? (React.createElement(Col, { sizes: mediaSizes },
-                    React.createElement("div", { className: b('card') }, card))) : null))));
+    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: [_jsx(Col, { className: b('content'), sizes: contentSizes, children: mediaContent }), card ? (_jsx(Col, { sizes: mediaSizes, children: _jsx("div", { className: b('card'), children: card }) })) : null] }) })] }));
 };
 MediaBase.Card = Card;
 export default MediaBase;
+//# sourceMappingURL=MediaBase.js.map

package/build/esm/components/MediaBase/MediaBase.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MediaBase.js","sourceRoot":"../../../../src","sources":["components/MediaBase/MediaBase.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport AnimateBlock from '../../components/AnimateBlock/AnimateBlock';\nimport {Col, Grid, GridColumnSize, Row} from '../../grid';\nimport {MediaBaseBlockProps} from '../../models';\nimport {block} from '../../utils';\nimport Title from '../Title/Title';\n\nimport MediaContent from './MediaBaseContent';\n\nimport './MediaBase.scss';\n\nconst b = block('media-base');\n\nconst Card: React.FC<React.PropsWithChildren<{}>> = () => null;\n\ninterface MediaBaseProps extends MediaBaseBlockProps {\n    children: React.ReactElement;\n    onScroll?: () => void;\n}\n\nexport const MediaBase = (props: MediaBaseProps) => {\n    const {\n        children,\n        largeMedia,\n        direction = 'content-media',\n        mobileDirection = 'content-media',\n        animated,\n        mediaOnly,\n        onScroll,\n        mediaOnlyColSizes = {all: 12, md: 8},\n        ...mediaContentProps\n    } = props;\n    const {title, description} = mediaContentProps;\n\n    const mediaSizes = React.useMemo(() => {\n        return mediaOnly\n            ? {[GridColumnSize.All]: 12}\n            : {[GridColumnSize.Md]: largeMedia ? 8 : 6, [GridColumnSize.All]: 12};\n    }, [mediaOnly, largeMedia]);\n\n    const contentSizes = React.useMemo(() => {\n        return {[GridColumnSize.Md]: largeMedia ? 4 : 6, [GridColumnSize.All]: 12};\n    }, [largeMedia]);\n\n    const mediaContent = !mediaOnly && <MediaContent {...mediaContentProps} />;\n    const card = children.type === Card ? children?.props.children : null;\n\n    return (\n        <AnimateBlock className={b()} onScroll={onScroll} animate={animated}>\n            {mediaOnly && (\n                <Title\n                    className={b('header')}\n                    title={title}\n                    subtitle={description}\n                    colSizes={mediaOnlyColSizes}\n                />\n            )}\n            <Grid>\n                <Row\n                    className={b('row', {\n                        reverse: direction === 'media-content',\n                        'mobile-reverse': mobileDirection === 'media-content',\n                    })}\n                >\n                    <Col className={b('content')} sizes={contentSizes}>\n                        {mediaContent}\n                    </Col>\n                    {card ? (\n                        <Col sizes={mediaSizes}>\n                            <div className={b('card')}>{card}</div>\n                        </Col>\n                    ) : null}\n                </Row>\n            </Grid>\n        </AnimateBlock>\n    );\n};\n\nMediaBase.Card = Card;\n\nexport default MediaBase;\n"]}

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

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

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

@@ -1,12 +1,12 @@
-import React from 'react';
-import { Content } from '../../sub-blocks';
-import { block } from '../../utils';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Content } from "../../sub-blocks/index.js";
+import { block } from "../../utils/index.js";
 import './MediaBaseContent.css';
 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 (React.createElement("div", { className: b() },
-        React.createElement(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 } }) }));
 };
 export default MediaContent;
+//# sourceMappingURL=MediaBaseContent.js.map

package/build/esm/components/MediaBase/MediaBaseContent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MediaBaseContent.js","sourceRoot":"../../../../src","sources":["components/MediaBase/MediaBaseContent.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAC,OAAO,EAAC,kCAAyB;AACzC,OAAO,EAAC,KAAK,EAAC,6BAAoB;AAElC,OAAO,wBAAwB,CAAC;AAEhC,MAAM,CAAC,GAAG,KAAK,CAAC,oBAAoB,CAAC,CAAC;AAEtC,MAAM,YAAY,GAAG,CAAC,KAAwB,EAAE,EAAE;IAC9C,MAAM,EACF,KAAK,EACL,WAAW,EACX,MAAM,EACN,KAAK,EACL,OAAO,GAAG,EAAE,EACZ,cAAc,EACd,IAAI,GAAG,GAAG,EACV,IAAI,GACP,GAAG,KAAK,CAAC;IACV,MAAM,UAAU,GAAG,MAAM,CAAC,CAAC,CAAC,iCAAK,MAAM,KAAE,IAAI,EAAE,IAAkB,KAAG,GAAG,OAAO,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC;IAC1F,OAAO,CACH,cAAK,SAAS,EAAE,CAAC,EAAE,YACf,KAAC,OAAO,IACJ,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,WAAW,EACjB,KAAK,EAAE,KAAK,EACZ,KAAK,EAAC,SAAS,EACf,OAAO,EAAE,UAAU,EACnB,IAAI,EAAE,IAAI,EACV,cAAc,EAAE,cAAc,EAC9B,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,EAAC,GAAG,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAC,GAC7B,GACA,CACT,CAAC;AACN,CAAC,CAAC;AAEF,eAAe,YAAY,CAAC","sourcesContent":["import {ButtonSize} from '@gravity-ui/uikit';\n\nimport {MediaContentProps} from '../../models';\nimport {Content} from '../../sub-blocks';\nimport {block} from '../../utils';\n\nimport './MediaBaseContent.scss';\n\nconst b = block('media-base-content');\n\nconst MediaContent = (props: MediaContentProps) => {\n    const {\n        title,\n        description,\n        button,\n        links,\n        buttons = [],\n        additionalInfo,\n        size = 'l',\n        list,\n    } = props;\n    const allButtons = button ? [{...button, size: 'xl' as ButtonSize}, ...buttons] : buttons;\n    return (\n        <div className={b()}>\n            <Content\n                title={title}\n                text={description}\n                links={links}\n                theme=\"default\"\n                buttons={allButtons}\n                list={list}\n                additionalInfo={additionalInfo}\n                size={size}\n                colSizes={{all: 12, md: 12}}\n            />\n        </div>\n    );\n};\n\nexport default MediaContent;\n"]}

package/build/esm/components/MetaInfo/MetaInfo.css

@@ -6,6 +6,6 @@ unpredictable css rules order in build */
   display: flex;
   align-items: center;
 }
-.pc-meta-info__item.pc-meta-info__item:not(:first-child) {
+.pc-meta-info__item:not(:first-child) {
   margin-left: 16px;
 }

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

@@ -1,7 +1,7 @@
-import { ClassNameProps } from '../../models';
+import { ClassNameProps } from "../../models/index.js";
 import './MetaInfo.css';
 export interface MetaInfpoProps extends ClassNameProps {
     items: string[];
 }
-declare const MetaInfo: ({ items, className }: MetaInfpoProps) => JSX.Element;
+declare const MetaInfo: ({ items, className }: MetaInfpoProps) => import("react/jsx-runtime").JSX.Element;
 export default MetaInfo;

package/build/esm/components/MetaInfo/MetaInfo.js

@@ -1,7 +1,8 @@
-import React from 'react';
-import { block } from '../../utils';
-import { YFMWrapper } from '../index';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { block } from "../../utils/index.js";
+import { YFMWrapper } from "../index.js";
 import './MetaInfo.css';
 const b = block('meta-info');
-const MetaInfo = ({ items, className }) => (React.createElement("h4", { className: b(null, className) }, items.map((metaInfoItem) => (React.createElement(YFMWrapper, { content: metaInfoItem, key: metaInfoItem, contentClassName: b('item'), modifiers: { constructor: true, constructorMetaInfo: true } })))));
+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;
+//# sourceMappingURL=MetaInfo.js.map

package/build/esm/components/MetaInfo/MetaInfo.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MetaInfo.js","sourceRoot":"../../../../src","sources":["components/MetaInfo/MetaInfo.tsx"],"names":[],"mappings":";AACA,OAAO,EAAC,KAAK,EAAC,6BAAoB;AAClC,OAAO,EAAC,UAAU,EAAC,oBAAiB;AAEpC,OAAO,gBAAgB,CAAC;AAExB,MAAM,CAAC,GAAG,KAAK,CAAC,WAAW,CAAC,CAAC;AAM7B,MAAM,QAAQ,GAAG,CAAC,EAAC,KAAK,EAAE,SAAS,EAAiB,EAAE,EAAE,CAAC,CACrD,aAAI,SAAS,EAAE,CAAC,CAAC,IAAI,EAAE,SAAS,CAAC,YAC5B,KAAK,CAAC,GAAG,CAAC,CAAC,YAAY,EAAE,EAAE,CAAC,CACzB,KAAC,UAAU,IACP,OAAO,EAAE,YAAY,EAErB,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,EACpB,SAAS,EAAE,EAAC,WAAW,EAAE,IAAI,EAAE,mBAAmB,EAAE,IAAI,EAAC,IAFpD,YAAY,CAGnB,CACL,CAAC,GACD,CACR,CAAC;AACF,eAAe,QAAQ,CAAC","sourcesContent":["import {ClassNameProps} from '../../models';\nimport {block} from '../../utils';\nimport {YFMWrapper} from '../index';\n\nimport './MetaInfo.scss';\n\nconst b = block('meta-info');\n\nexport interface MetaInfpoProps extends ClassNameProps {\n    items: string[];\n}\n\nconst MetaInfo = ({items, className}: MetaInfpoProps) => (\n    <h4 className={b(null, className)}>\n        {items.map((metaInfoItem) => (\n            <YFMWrapper\n                content={metaInfoItem}\n                key={metaInfoItem}\n                className={b('item')}\n                modifiers={{constructor: true, constructorMetaInfo: true}}\n            />\n        ))}\n    </h4>\n);\nexport default MetaInfo;\n"]}

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

@@ -6,3 +6,4 @@ const metaInfo = {
     },
 };
 export default metaInfo;
+//# sourceMappingURL=schema.js.map

package/build/esm/components/MetaInfo/schema.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"schema.js","sourceRoot":"../../../../src","sources":["components/MetaInfo/schema.ts"],"names":[],"mappings":"AAAA,MAAM,QAAQ,GAAG;IACb,IAAI,EAAE,OAAO;IACb,KAAK,EAAE;QACH,IAAI,EAAE,QAAQ;QACd,WAAW,EAAE,MAAM;KACtB;CACJ,CAAC;AAEF,eAAe,QAAQ,CAAC","sourcesContent":["const metaInfo = {\n    type: 'array',\n    items: {\n        type: 'string',\n        contentType: 'text',\n    },\n};\n\nexport default metaInfo;\n"]}

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

@@ -1,13 +1,13 @@
-import React, { PropsWithChildren } from 'react';
+import * as React from 'react';
 export interface OutsideClickProps {
     onOutsideClick: () => void;
     className?: string;
     onClick?: () => void;
 }
-export default class OutsideClick extends React.Component<PropsWithChildren<OutsideClickProps>> {
+export default class OutsideClick extends React.Component<React.PropsWithChildren<OutsideClickProps>> {
     ref: React.RefObject<HTMLDivElement>;
     componentDidMount(): void;
     componentWillUnmount(): void;
-    render(): JSX.Element;
+    render(): import("react/jsx-runtime").JSX.Element;
     handleOutsideClick: (e: MouseEvent) => void;
 }

package/build/esm/components/OutsideClick/OutsideClick.js

@@ -1,10 +1,11 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 //TODO move into cloud components?
-import React, { createRef } from 'react';
+import * as React from 'react';
 import noop from 'lodash/noop';
 export default class OutsideClick extends React.Component {
     constructor() {
         super(...arguments);
-        this.ref = createRef();
+        this.ref = React.createRef();
         this.handleOutsideClick = (e) => {
             if (e.target &&
                 this.ref &&
@@ -22,6 +23,7 @@ export default class OutsideClick extends React.Component {
     }
     render() {
         const { children, className, onClick } = this.props;
-        return (React.createElement("div", { className: className, ref: this.ref, onClick: onClick, onKeyDown: noop, role: onClick ? 'button' : 'group', tabIndex: onClick ? 0 : -1 }, children));
+        return (_jsx("div", { className: className, ref: this.ref, onClick: onClick, onKeyDown: noop, role: onClick ? 'button' : 'group', tabIndex: onClick ? 0 : -1, children: children }));
     }
 }
+//# sourceMappingURL=OutsideClick.js.map

package/build/esm/components/OutsideClick/OutsideClick.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OutsideClick.js","sourceRoot":"../../../../src","sources":["components/OutsideClick/OutsideClick.tsx"],"names":[],"mappings":";AAAA,kCAAkC;AAClC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,IAAI,MAAM,aAAa,CAAC;AAQ/B,MAAM,CAAC,OAAO,OAAO,YAAa,SAAQ,KAAK,CAAC,SAE/C;IAFD;;QAGI,QAAG,GAAG,KAAK,CAAC,SAAS,EAAkB,CAAC;QA2BxC,uBAAkB,GAAG,CAAC,CAAa,EAAE,EAAE;YACnC,IACI,CAAC,CAAC,MAAM;gBACR,IAAI,CAAC,GAAG;gBACR,IAAI,CAAC,GAAG,CAAC,OAAO;gBAChB,CAAC,IAAI,CAAC,GAAG,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAc,CAAC,EAC9C,CAAC;gBACC,IAAI,CAAC,KAAK,CAAC,cAAc,EAAE,CAAC;YAChC,CAAC;QACL,CAAC,CAAC;IACN,CAAC;IAnCG,iBAAiB;QACb,QAAQ,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,kBAAkB,EAAE,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC,CAAC;IACjF,CAAC;IAED,oBAAoB;QAChB,QAAQ,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,kBAAkB,CAAC,CAAC;IACnE,CAAC;IAED,MAAM;QACF,MAAM,EAAC,QAAQ,EAAE,SAAS,EAAE,OAAO,EAAC,GAAG,IAAI,CAAC,KAAK,CAAC;QAElD,OAAO,CACH,cACI,SAAS,EAAE,SAAS,EACpB,GAAG,EAAE,IAAI,CAAC,GAAG,EACb,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,IAAI,EACf,IAAI,EAAE,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,EAClC,QAAQ,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,YAEzB,QAAQ,GACP,CACT,CAAC;IACN,CAAC;CAYJ","sourcesContent":["//TODO move into cloud components?\nimport * as React from 'react';\n\nimport noop from 'lodash/noop';\n\nexport interface OutsideClickProps {\n    onOutsideClick: () => void;\n    className?: string;\n    onClick?: () => void;\n}\n\nexport default class OutsideClick extends React.Component<\n    React.PropsWithChildren<OutsideClickProps>\n> {\n    ref = React.createRef<HTMLDivElement>();\n\n    componentDidMount() {\n        document.addEventListener('click', this.handleOutsideClick, {passive: true});\n    }\n\n    componentWillUnmount() {\n        document.removeEventListener('click', this.handleOutsideClick);\n    }\n\n    render() {\n        const {children, className, onClick} = this.props;\n\n        return (\n            <div\n                className={className}\n                ref={this.ref}\n                onClick={onClick}\n                onKeyDown={noop}\n                role={onClick ? 'button' : 'group'}\n                tabIndex={onClick ? 0 : -1}\n            >\n                {children}\n            </div>\n        );\n    }\n\n    handleOutsideClick = (e: MouseEvent) => {\n        if (\n            e.target &&\n            this.ref &&\n            this.ref.current &&\n            !this.ref.current.contains(e.target as Node)\n        ) {\n            this.props.onOutsideClick();\n        }\n    };\n}\n"]}

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

@@ -1,4 +1,4 @@
-import React, { PropsWithChildren } from 'react';
+import * as React from 'react';
 import './OverflowScroller.css';
 type Arrow = 'left' | 'right';
 export interface OverflowScrollerProps {
@@ -12,7 +12,7 @@ export interface OverflowScrollerState {
     arrows: Arrow[];
     scrollValue: number;
 }
-export default class OverflowScroller extends React.Component<PropsWithChildren<OverflowScrollerProps>, OverflowScrollerState> {
+export default class OverflowScroller extends React.Component<React.PropsWithChildren<OverflowScrollerProps>, OverflowScrollerState> {
     state: {
         arrows: Arrow[];
         scrollValue: number;
@@ -22,7 +22,7 @@ export default class OverflowScroller extends React.Component<PropsWithChildren<
     componentDidMount(): void;
     componentDidUpdate(_prepvProps: OverflowScrollerProps, { scrollValue: prevScrollValue }: OverflowScrollerState): void;
     componentWillUnmount(): void;
-    render(): JSX.Element;
+    render(): import("react/jsx-runtime").JSX.Element;
     private checkOverflow;
     private handleScrollClick;
 }

package/build/esm/components/OverflowScroller/OverflowScroller.js

@@ -1,8 +1,9 @@
-import React, { createRef } from 'react';
+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';
+import { ToggleArrow } from "../index.js";
+import { block } from "../../utils/index.js";
+import { i18n } from "./i18n/index.js";
 import './OverflowScroller.css';
 const b = block('overflow-scroller');
 const TRANSITION_TIME = 300;
@@ -15,8 +16,8 @@ export default class OverflowScroller extends React.Component {
             arrows: [],
             scrollValue: 0,
         };
-        this.containerRef = createRef();
-        this.wrapperRef = createRef();
+        this.containerRef = React.createRef();
+        this.wrapperRef = React.createRef();
         // eslint-disable-next-line @typescript-eslint/member-ordering, react/sort-comp
         this.checkOverflow = debounce(() => {
             if (this.containerRef &&
@@ -77,13 +78,10 @@ export default class OverflowScroller extends React.Component {
         const wrapperStyle = arrows.length ? { left: -scrollValue } : { left: 0 };
         const paddingLeft = arrows.includes('left');
         const paddingRight = arrows.includes('right');
-        return (React.createElement("div", { className: b('container', {
+        return (_jsxs("div", { className: b('container', {
                 'padding-left': paddingLeft,
                 'padding-right': paddingRight,
-            }) },
-            React.createElement("div", { className: b(null, className), ref: this.containerRef },
-                React.createElement("div", { className: b('wrapper'), style: wrapperStyle, ref: this.wrapperRef }, children)),
-            arrows.map((direction) => (React.createElement("button", { key: direction, className: b('arrow', { type: direction }, arrowClassName), onClick: (e) => this.handleScrollClick(e, direction), "aria-label": i18n(direction) },
-                React.createElement(ToggleArrow, { size: arrowSize, type: 'horizontal', iconType: "navigation" }))))));
+            }), 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)))] }));
     }
 }
+//# sourceMappingURL=OverflowScroller.js.map

package/build/esm/components/OverflowScroller/OverflowScroller.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OverflowScroller.js","sourceRoot":"../../../../src","sources":["components/OverflowScroller/OverflowScroller.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport debounce from 'lodash/debounce';\n\nimport {ToggleArrow} from '..';\nimport {block} from '../../utils';\n\nimport {i18n} from './i18n';\n\nimport './OverflowScroller.scss';\n\nconst b = block('overflow-scroller');\nconst TRANSITION_TIME = 300;\nconst PADDING_SIZE = 24;\nconst DEFAULT_ARROW_SIZE = 18;\n\ntype Arrow = 'left' | 'right';\n\nexport interface OverflowScrollerProps {\n    className?: string;\n    onScrollStart?: () => void;\n    onScrollEnd?: () => void;\n    arrowSize?: number;\n    arrowClassName?: string;\n}\n\nexport interface OverflowScrollerState {\n    arrows: Arrow[];\n    scrollValue: number;\n}\n\nexport default class OverflowScroller extends React.Component<\n    React.PropsWithChildren<OverflowScrollerProps>,\n    OverflowScrollerState\n> {\n    state = {\n        arrows: [] as Arrow[],\n        scrollValue: 0,\n    };\n    containerRef = React.createRef<HTMLDivElement>();\n    wrapperRef = React.createRef<HTMLDivElement>();\n\n    componentDidMount() {\n        this.checkOverflow();\n        window.addEventListener('resize', this.checkOverflow, {passive: true});\n    }\n\n    componentDidUpdate(\n        _prepvProps: OverflowScrollerProps,\n        {scrollValue: prevScrollValue}: OverflowScrollerState,\n    ) {\n        const {onScrollEnd} = this.props;\n\n        if (prevScrollValue !== this.state.scrollValue && onScrollEnd) {\n            setTimeout(onScrollEnd, TRANSITION_TIME + 100);\n        }\n    }\n\n    componentWillUnmount() {\n        window.removeEventListener('resize', this.checkOverflow);\n    }\n\n    render() {\n        const {className, arrowClassName, children, arrowSize = DEFAULT_ARROW_SIZE} = this.props;\n        const {arrows, scrollValue} = this.state;\n        const wrapperStyle = arrows.length ? {left: -scrollValue} : {left: 0};\n        const paddingLeft = arrows.includes('left');\n        const paddingRight = arrows.includes('right');\n\n        return (\n            <div\n                className={b('container', {\n                    'padding-left': paddingLeft,\n                    'padding-right': paddingRight,\n                })}\n            >\n                <div className={b(null, className)} ref={this.containerRef}>\n                    <div className={b('wrapper')} style={wrapperStyle} ref={this.wrapperRef}>\n                        {children}\n                    </div>\n                </div>\n                {arrows.map((direction: Arrow) => (\n                    <button\n                        key={direction}\n                        className={b('arrow', {type: direction}, arrowClassName)}\n                        onClick={(e: React.MouseEvent) => this.handleScrollClick(e, direction)}\n                        aria-label={i18n(direction)}\n                    >\n                        <ToggleArrow size={arrowSize} type={'horizontal'} iconType=\"navigation\" />\n                    </button>\n                ))}\n            </div>\n        );\n    }\n\n    // eslint-disable-next-line @typescript-eslint/member-ordering, react/sort-comp\n    private checkOverflow = debounce(() => {\n        if (\n            this.containerRef &&\n            this.containerRef.current &&\n            this.wrapperRef &&\n            this.wrapperRef.current\n        ) {\n            const containerWidth = this.containerRef.current.offsetWidth;\n            const wrapperWidth = this.wrapperRef.current.offsetWidth;\n            const scrollValue = 0;\n            const arrows: Arrow[] = wrapperWidth < containerWidth ? [] : ['right'];\n\n            this.setState({scrollValue, arrows});\n        }\n    }, 100);\n\n    private handleScrollClick = (e: React.MouseEvent, arrow: Arrow) => {\n        const {scrollValue, arrows} = this.state;\n        const {onScrollStart} = this.props;\n\n        if (\n            this.containerRef &&\n            this.containerRef.current &&\n            this.wrapperRef &&\n            this.wrapperRef.current\n        ) {\n            const containerWidth = this.containerRef.current.offsetWidth;\n            const wrapperWidth = this.wrapperRef.current.offsetWidth;\n            const hiddenWidth =\n                arrow === 'right' ? wrapperWidth - (containerWidth + scrollValue) : scrollValue;\n            const padding =\n                arrows.length > 1 && hiddenWidth + PADDING_SIZE > containerWidth ? PADDING_SIZE : 0;\n            const delta = containerWidth > hiddenWidth ? hiddenWidth : containerWidth;\n            const newScrollValue =\n                arrow === 'right' ? scrollValue + delta + padding : scrollValue - delta - padding;\n            let newArrows: Arrow[] = ['left', 'right'];\n\n            if (newScrollValue + containerWidth >= wrapperWidth) {\n                newArrows = ['left'];\n            } else if (!newScrollValue) {\n                newArrows = ['right'];\n            }\n\n            this.setState({arrows: newArrows, scrollValue: newScrollValue});\n\n            if (onScrollStart) {\n                onScrollStart();\n            }\n\n            e.stopPropagation();\n        }\n    };\n}\n"]}

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

@@ -1 +1,5 @@
-export declare const i18n: (key: "left" | "right", params?: import("@gravity-ui/i18n").Params | undefined) => string;
+export declare const i18n: ((key: "left" | "right", params?: import("@gravity-ui/i18n").Params) => string) & {
+    keysetData: {
+        "pc-OverflowScroller": Record<"left" | "right", import("@gravity-ui/i18n").KeyData>;
+    };
+};

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

@@ -1,5 +1,6 @@
 import { addComponentKeysets } from '@gravity-ui/uikit/i18n';
-import { NAMESPACE } from '../../../utils/cn';
-import en from './en.json';
-import ru from './ru.json';
+import { NAMESPACE } from "../../../utils/cn.js";
+import en from "./en.json";
+import ru from "./ru.json";
 export const i18n = addComponentKeysets({ en, ru }, `${NAMESPACE}OverflowScroller`);
+//# sourceMappingURL=index.js.map

package/build/esm/components/OverflowScroller/i18n/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"../../../../../src","sources":["components/OverflowScroller/i18n/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,mBAAmB,EAAC,MAAM,wBAAwB,CAAC;AAE3D,OAAO,EAAC,SAAS,EAAC,6BAA0B;AAE5C,OAAO,EAAE,kBAAkB;AAC3B,OAAO,EAAE,kBAAkB;AAE3B,MAAM,CAAC,MAAM,IAAI,GAAG,mBAAmB,CAAC,EAAC,EAAE,EAAE,EAAE,EAAC,EAAE,GAAG,SAAS,kBAAkB,CAAC,CAAC","sourcesContent":["import {addComponentKeysets} from '@gravity-ui/uikit/i18n';\n\nimport {NAMESPACE} from '../../../utils/cn';\n\nimport en from './en.json';\nimport ru from './ru.json';\n\nexport const i18n = addComponentKeysets({en, ru}, `${NAMESPACE}OverflowScroller`);\n"]}

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

@@ -1,4 +1,4 @@
-import { ClassNameProps } from '../../models';
+import { ClassNameProps } from "../../models/index.js";
 import './CircleProgress.css';
 export interface CircleProgressProps extends ClassNameProps {
     elapsedTime: number;
@@ -7,5 +7,5 @@ export interface CircleProgressProps extends ClassNameProps {
     strokeWidth?: number;
     radius?: number;
 }
-declare const CircleProgress: (props: CircleProgressProps) => JSX.Element;
+declare const CircleProgress: (props: CircleProgressProps) => import("react/jsx-runtime").JSX.Element;
 export default CircleProgress;