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

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

@@ -1,10 +1,11 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
-const react_1 = tslib_1.__importDefault(require("react"));
-const FullscreenMedia_1 = tslib_1.__importDefault(require("../../FullscreenMedia/FullscreenMedia"));
-const Video_1 = tslib_1.__importDefault(require("../Video/Video"));
+const jsx_runtime_1 = require("react/jsx-runtime");
+const FullscreenMedia_1 = tslib_1.__importDefault(require("../../FullscreenMedia/FullscreenMedia.js"));
+const Video_1 = tslib_1.__importDefault(require("../Video/Video.js"));
 const FullscreenVideo = (props) => {
-    return (react_1.default.createElement(FullscreenMedia_1.default, null, (classNames) => react_1.default.createElement(Video_1.default, Object.assign({}, props, classNames))));
+    return ((0, jsx_runtime_1.jsx)(FullscreenMedia_1.default, { children: (classNames) => (0, jsx_runtime_1.jsx)(Video_1.default, Object.assign({}, props, classNames)) }));
 };
 exports.default = FullscreenVideo;
+//# sourceMappingURL=FullscreenVideo.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"FullscreenVideo.js","sourceRoot":"../../../../../src","sources":["components/Media/FullscreenVideo/FullscreenVideo.tsx"],"names":[],"mappings":";;;;AAEA,uGAAoE;AACpE,sEAAoD;AAEpD,MAAM,eAAe,GAA4B,CAAC,KAAK,EAAE,EAAE;IACvD,OAAO,CACH,uBAAC,yBAAe,cAAE,CAAC,UAAU,EAAE,EAAE,CAAC,uBAAC,eAAK,oBAAK,KAAK,EAAM,UAAU,EAAI,GAAmB,CAC5F,CAAC;AACN,CAAC,CAAC;AAEF,kBAAe,eAAe,CAAC","sourcesContent":["import * as React from 'react';\n\nimport FullscreenMedia from '../../FullscreenMedia/FullscreenMedia';\nimport Video, {VideoAllProps} from '../Video/Video';\n\nconst FullscreenVideo: React.FC<VideoAllProps> = (props) => {\n    return (\n        <FullscreenMedia>{(classNames) => <Video {...props} {...classNames} />}</FullscreenMedia>\n    );\n};\n\nexport default FullscreenVideo;\n"]}

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

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

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

@@ -1,14 +1,13 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-const react_1 = tslib_1.__importDefault(require("react"));
-const utils_1 = require("../../../utils");
-const i18n_1 = require("./i18n");
+const jsx_runtime_1 = require("react/jsx-runtime");
+const utils_1 = require("../../../utils/index.js");
+const i18n_1 = require("./i18n/index.js");
 const b = (0, utils_1.block)('media-component-iframe');
 const Iframe = (props) => {
     const { iframe, margins = true } = props;
     const { height = 400, src, width, name, title } = iframe;
-    return iframe ? (react_1.default.createElement("div", { className: b({ margins }), style: { height } },
-        react_1.default.createElement("iframe", { className: b('item'), loading: "lazy", title: title || (0, i18n_1.i18n)('iframe-title'), frameBorder: 0, src: src, width: width, height: height, name: name }))) : null;
+    return iframe ? ((0, jsx_runtime_1.jsx)("div", { className: b({ margins }), style: { height }, children: (0, jsx_runtime_1.jsx)("iframe", { className: b('item'), loading: "lazy", title: title || (0, i18n_1.i18n)('iframe-title'), frameBorder: 0, src: src, width: width, height: height, name: name }) })) : null;
 };
 exports.default = Iframe;
+//# sourceMappingURL=Iframe.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Iframe.js","sourceRoot":"../../../../../src","sources":["components/Media/Iframe/Iframe.tsx"],"names":[],"mappings":";;;AACA,mDAAqC;AAErC,0CAA4B;AAI5B,MAAM,CAAC,GAAG,IAAA,aAAK,EAAC,wBAAwB,CAAC,CAAC;AAE1C,MAAM,MAAM,GAAG,CAAC,KAAgC,EAAE,EAAE;IAChD,MAAM,EAAC,MAAM,EAAE,OAAO,GAAG,IAAI,EAAC,GAAG,KAAK,CAAC;IACvC,MAAM,EAAC,MAAM,GAAG,GAAG,EAAE,GAAG,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAC,GAAG,MAAM,CAAC;IAEvD,OAAO,MAAM,CAAC,CAAC,CAAC,CACZ,gCAAK,SAAS,EAAE,CAAC,CAAC,EAAC,OAAO,EAAC,CAAC,EAAE,KAAK,EAAE,EAAC,MAAM,EAAC,YACzC,mCACI,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,EACpB,OAAO,EAAC,MAAM,EACd,KAAK,EAAE,KAAK,IAAI,IAAA,WAAI,EAAC,cAAc,CAAC,EACpC,WAAW,EAAE,CAAC,EACd,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,MAAM,EACd,IAAI,EAAE,IAAI,GACZ,GACA,CACT,CAAC,CAAC,CAAC,IAAI,CAAC;AACb,CAAC,CAAC;AAEF,kBAAe,MAAM,CAAC","sourcesContent":["import {MediaComponentIframeProps} from '../../../models';\nimport {block} from '../../../utils';\n\nimport {i18n} from './i18n';\n\nimport './Iframe.scss';\n\nconst b = block('media-component-iframe');\n\nconst Iframe = (props: MediaComponentIframeProps) => {\n    const {iframe, margins = true} = props;\n    const {height = 400, src, width, name, title} = iframe;\n\n    return iframe ? (\n        <div className={b({margins})} style={{height}}>\n            <iframe\n                className={b('item')}\n                loading=\"lazy\"\n                title={title || i18n('iframe-title')}\n                frameBorder={0}\n                src={src}\n                width={width}\n                height={height}\n                name={name}\n            />\n        </div>\n    ) : null;\n};\n\nexport default Iframe;\n"]}

package/build/cjs/components/Media/Iframe/i18n/index.d.ts

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

package/build/cjs/components/Media/Iframe/i18n/index.js

@@ -3,7 +3,8 @@ 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");
+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}Iframe`);
+//# sourceMappingURL=index.js.map

package/build/cjs/components/Media/Iframe/i18n/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"../../../../../../src","sources":["components/Media/Iframe/i18n/index.ts"],"names":[],"mappings":";;;;AAAA,iDAA2D;AAE3D,gDAA+C;AAE/C,gEAA2B;AAC3B,gEAA2B;AAEd,QAAA,IAAI,GAAG,IAAA,0BAAmB,EAAC,EAAC,EAAE,EAAF,iBAAE,EAAE,EAAE,EAAF,iBAAE,EAAC,EAAE,GAAG,cAAS,QAAQ,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}Iframe`);\n"]}

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

@@ -1,9 +1,8 @@
-import { MediaComponentImageProps, QAProps } from '../../../models';
+import { MediaComponentImageProps, QAProps } from "../../../models/index.js";
 export interface ImageAdditionProps {
     imageClassName?: string;
     isBackground?: boolean;
     fullscreen?: boolean;
-    fullscreenClassName?: string;
     onLoad?: () => void;
 }
 interface InnerImageProps {
@@ -11,5 +10,5 @@ interface InnerImageProps {
 }
 type ImageAllProps = ImageAdditionProps & MediaComponentImageProps & InnerImageProps & QAProps;
 export declare const defaultAnimatedDivQa = "animated-div";
-declare const Image: (props: ImageAllProps) => JSX.Element;
+declare const Image: (props: ImageAllProps) => import("react/jsx-runtime").JSX.Element;
 export default Image;

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

@@ -2,31 +2,32 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.defaultAnimatedDivQa = void 0;
 const tslib_1 = require("tslib");
-const react_1 = tslib_1.__importStar(require("react"));
+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 blocks_1 = require("../../../blocks");
-const models_1 = require("../../../models");
-const utils_1 = require("../../../utils");
-const BackgroundImage_1 = tslib_1.__importDefault(require("../../BackgroundImage/BackgroundImage"));
-const FullscreenImage_1 = tslib_1.__importDefault(require("../../FullscreenImage/FullscreenImage"));
-const Image_1 = tslib_1.__importDefault(require("../../Image/Image"));
-const utils_2 = require("./utils");
+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';
 const Image = (props) => {
-    const { parallax, height, imageClassName, fullscreenClassName, isBackground, hasVideoFallback, video, fullscreen, disableImageSliderForArrayInput, qa, onLoad, } = 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 [scrollY, setScrollY] = (0, react_1.useState)(0);
+    const [scrollY, setScrollY] = React.useState(0);
     const [{ springScrollY }, springSetScrollY] = (0, web_1.useSpring)(() => ({
         springScrollY: 0,
         config: web_1.config.molasses,
     }));
     let parallaxInterpolate = '';
-    (0, react_1.useEffect)(() => {
+    React.useEffect(() => {
         if (parallax) {
             const handleScroll = () => setScrollY(window.scrollY);
             const debouncedHandler = (0, debounce_1.default)(handleScroll, 5);
@@ -41,24 +42,21 @@ const Image = (props) => {
         parallaxInterpolate = springScrollY.to((value) => `translateY(-${Number(value) / parallaxLevel}px)`);
     }
     const imageClass = b('item', { withVideo: Boolean(video) && !hasVideoFallback }, imageClassName);
-    const renderFullscreenImage = (item, sliderData) => {
+    const renderFullscreenImage = (item) => {
         const itemData = (0, utils_2.getMediaImage)(item);
-        return (react_1.default.createElement(FullscreenImage_1.default, Object.assign({ key: itemData.alt }, itemData, { imageClassName: imageClass, modalImageClass: fullscreenClassName, imageStyle: { height }, qa: qaAttributes.fullscreenImage, sliderData: sliderData })));
+        return ((0, jsx_runtime_1.jsx)(FullscreenImage_1.default, Object.assign({}, itemData, { imageClassName: imageClass, imageStyle: { height }, qa: qaAttributes.fullscreenImage }), itemData.alt));
     };
     const imageBackground = (oneImage) => {
         const imageData = (0, utils_2.getMediaImage)(oneImage);
-        return (react_1.default.createElement(web_1.animated.div, { style: { transform: parallaxInterpolate }, "data-qa": qaAttributes.animate },
-            react_1.default.createElement(BackgroundImage_1.default, Object.assign({}, imageData, { className: imageClass, style: { height }, qa: qaAttributes.backgroundImage }))));
+        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 imageOnly = (oneImage) => {
         const imageData = (0, utils_2.getMediaImage)(oneImage);
-        return (react_1.default.createElement(Image_1.default, Object.assign({}, imageData, { className: imageClass, style: { height }, qa: qaAttributes.imageView, onLoad: onLoad })));
+        return ((0, jsx_runtime_1.jsx)(Image_1.default, Object.assign({}, imageData, { className: imageClass, style: { height }, qa: qaAttributes.imageView, onLoad: onLoad })));
     };
     const imageSlider = (imageArray) => {
         const fullscreenItem = fullscreen === undefined || fullscreen;
-        return (react_1.default.createElement(blocks_1.SliderBlock, { slidesToShow: 1, type: models_1.SliderType.MediaCard }, imageArray.map((item, index) => (react_1.default.createElement(react_1.Fragment, { key: index }, fullscreenItem
-            ? renderFullscreenImage(item, { items: imageArray, initialIndex: index })
-            : imageOnly(item))))));
+        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))) }));
     };
     if (Array.isArray(image)) {
         return imageSlider(image);
@@ -69,3 +67,4 @@ const Image = (props) => {
     return isBackground ? imageBackground(image) : imageOnly(image);
 };
 exports.default = Image;
+//# sourceMappingURL=Image.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Image.js","sourceRoot":"../../../../../src","sources":["components/Media/Image/Image.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport {Interpolation, animated, config, useSpring} from '@react-spring/web';\nimport debounce from 'lodash/debounce';\n\nimport SliderBlock from '../../../blocks/Slider/Slider';\nimport {ImageProps, MediaComponentImageProps, QAProps, SliderType} from '../../../models';\nimport {block, getQaAttrubutes} from '../../../utils';\nimport BackgroundImage from '../../BackgroundImage/BackgroundImage';\nimport FullscreenImage from '../../FullscreenImage/FullscreenImage';\nimport ImageView from '../../Image/Image';\n\nimport {getMediaImage} from './utils';\n\nimport './Image.scss';\n\nconst b = block('media-component-image');\n\nexport interface ImageAdditionProps {\n    imageClassName?: string;\n    isBackground?: boolean;\n    fullscreen?: boolean;\n    onLoad?: () => void;\n}\n\ninterface InnerImageProps {\n    hasVideoFallback: boolean;\n}\n\ntype ImageAllProps = ImageAdditionProps & MediaComponentImageProps & InnerImageProps & QAProps;\n\nexport const defaultAnimatedDivQa = 'animated-div';\n\nconst Image = (props: ImageAllProps) => {\n    const {\n        parallax,\n        height,\n        imageClassName,\n        isBackground,\n        hasVideoFallback,\n        video,\n        fullscreen,\n        disableImageSliderForArrayInput,\n        qa,\n        onLoad,\n    } = props;\n    const image =\n        Array.isArray(props.image) && disableImageSliderForArrayInput\n            ? props.image[0]\n            : props.image;\n\n    const qaAttributes = getQaAttrubutes(\n        qa,\n        'fullscreen-image',\n        'animate',\n        'background-image',\n        'image-view',\n        'slider-block',\n    );\n    const [scrollY, setScrollY] = React.useState(0);\n    const [{springScrollY}, springSetScrollY] = useSpring(() => ({\n        springScrollY: 0,\n        config: config.molasses,\n    }));\n\n    let parallaxInterpolate: Interpolation<number, string> | string = '';\n\n    React.useEffect(() => {\n        if (parallax) {\n            const handleScroll = () => setScrollY(window.scrollY);\n            const debouncedHandler = debounce(handleScroll, 5);\n\n            window.addEventListener('scroll', debouncedHandler, {passive: true});\n            return () => window.removeEventListener('scroll', debouncedHandler);\n        }\n\n        return () => {};\n    });\n\n    if (parallax) {\n        const parallaxLevel = 2;\n        springSetScrollY.start({springScrollY: height && scrollY > height ? height : scrollY});\n        parallaxInterpolate = springScrollY.to(\n            (value) => `translateY(-${Number(value) / parallaxLevel}px)`,\n        );\n    }\n\n    const imageClass = b('item', {withVideo: Boolean(video) && !hasVideoFallback}, imageClassName);\n\n    const renderFullscreenImage = (item: ImageProps) => {\n        const itemData = getMediaImage(item);\n\n        return (\n            <FullscreenImage\n                key={itemData.alt}\n                {...itemData}\n                imageClassName={imageClass}\n                imageStyle={{height}}\n                qa={qaAttributes.fullscreenImage}\n            />\n        );\n    };\n\n    const imageBackground = (oneImage: ImageProps) => {\n        const imageData = getMediaImage(oneImage);\n        return (\n            <animated.div style={{transform: parallaxInterpolate}} data-qa={qaAttributes.animate}>\n                <BackgroundImage\n                    {...imageData}\n                    className={imageClass}\n                    style={{height}}\n                    qa={qaAttributes.backgroundImage}\n                />\n            </animated.div>\n        );\n    };\n\n    const imageOnly = (oneImage: ImageProps) => {\n        const imageData = getMediaImage(oneImage);\n        return (\n            <ImageView\n                {...imageData}\n                className={imageClass}\n                style={{height}}\n                qa={qaAttributes.imageView}\n                onLoad={onLoad}\n            />\n        );\n    };\n\n    const imageSlider = (imageArray: ImageProps[]) => {\n        const fullscreenItem = fullscreen === undefined || fullscreen;\n\n        return (\n            <SliderBlock slidesToShow={1} type={SliderType.MediaCard}>\n                {imageArray.map((item, index) => (\n                    <React.Fragment key={index}>\n                        {fullscreenItem ? renderFullscreenImage(item) : imageOnly(item)}\n                    </React.Fragment>\n                ))}\n            </SliderBlock>\n        );\n    };\n\n    if (Array.isArray(image)) {\n        return imageSlider(image);\n    }\n\n    if (fullscreen) {\n        return renderFullscreenImage(image);\n    }\n\n    return isBackground ? imageBackground(image) : imageOnly(image);\n};\n\nexport default Image;\n"]}

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

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

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sourceRoot":"../../../../../src","sources":["components/Media/Image/utils.ts"],"names":[],"mappings":";;AAEA,sCAEC;AAFD,SAAgB,aAAa,CAAC,KAAiB;IAC3C,OAAO,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,EAAC,GAAG,EAAE,KAAK,EAAC,CAAC,CAAC,CAAC,KAAK,CAAC;AAC5D,CAAC","sourcesContent":["import {ImageProps} from '../../../models';\n\nexport function getMediaImage(image: ImageProps) {\n    return typeof image === 'string' ? {src: image} : image;\n}\n"]}

package/build/cjs/components/Media/Media.css

@@ -8,8 +8,4 @@ unpredictable css rules order in build */
   overflow: hidden;
   display: flex;
   align-items: center;
-}
-.pc-Media__fullscreen-image-cover {
-  object-fit: cover;
-  object-position: top;
 }

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

@@ -1,12 +1,11 @@
-import { MediaProps, QAProps } from '../../models';
-import { ImageAdditionProps } from './Image/Image';
-import { VideoAdditionProps } from './Video/Video';
+import { MediaProps, QAProps } from "../../models/index.js";
+import { ImageAdditionProps } from "./Image/Image.js";
+import { VideoAdditionProps } from "./Video/Video.js";
 export interface MediaAllProps extends MediaProps, VideoAdditionProps, ImageAdditionProps, QAProps {
     className?: string;
-    isFullscreenImageCover?: boolean;
     youtubeClassName?: string;
     autoplay?: boolean;
     onImageLoad?: () => void;
 }
-export declare const Media: (props: MediaAllProps) => JSX.Element;
+export declare const Media: (props: MediaAllProps) => import("react/jsx-runtime").JSX.Element;
 export default Media;

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

@@ -2,26 +2,27 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Media = void 0;
 const tslib_1 = require("tslib");
-const react_1 = tslib_1.__importStar(require("react"));
-const innerContext_1 = require("../../context/innerContext");
-const utils_1 = require("../../utils");
-const microdata_1 = require("../../utils/microdata");
-const VideoBlock_1 = tslib_1.__importDefault(require("../VideoBlock/VideoBlock"));
-const DataLens_1 = tslib_1.__importDefault(require("./DataLens/DataLens"));
-const FullscreenVideo_1 = tslib_1.__importDefault(require("./FullscreenVideo/FullscreenVideo"));
-const Iframe_1 = tslib_1.__importDefault(require("./Iframe/Iframe"));
-const Image_1 = tslib_1.__importDefault(require("./Image/Image"));
-const Video_1 = tslib_1.__importDefault(require("./Video/Video"));
+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) => {
-    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] = (0, react_1.useState)(false);
-    const { microdata } = (0, react_1.useContext)(innerContext_1.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_1.InnerContext);
     const qaAttributes = (0, utils_1.getQaAttrubutes)(qa, 'video');
-    const content = (0, react_1.useMemo)(() => {
+    const content = React.useMemo(() => {
         let result = [];
         if (image) {
-            result.push(react_1.default.createElement(Image_1.default, { 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((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"));
         }
         if (video) {
             const videoProps = {
@@ -39,20 +40,20 @@ const Media = (props) => {
                 ratio,
             };
             if (fullscreen) {
-                result.push(react_1.default.createElement(FullscreenVideo_1.default, Object.assign({}, videoProps, { qa: qaAttributes.video })));
+                result.push((0, jsx_runtime_1.jsx)(FullscreenVideo_1.default, Object.assign({}, videoProps, { qa: qaAttributes.video })));
             }
             else {
-                result.push(react_1.default.createElement(Video_1.default, Object.assign({}, videoProps, { qa: qaAttributes.video })));
+                result.push((0, jsx_runtime_1.jsx)(Video_1.default, Object.assign({}, videoProps, { qa: qaAttributes.video })));
             }
         }
         if (youtube || videoIframe) {
-            result = (react_1.default.createElement(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 = ((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 }));
         }
         if (dataLens) {
-            result = react_1.default.createElement(DataLens_1.default, { dataLens: dataLens });
+            result = (0, jsx_runtime_1.jsx)(DataLens_1.default, { dataLens: dataLens });
         }
         if (iframe) {
-            result = react_1.default.createElement(Iframe_1.default, { iframe: iframe, margins: margins });
+            result = (0, jsx_runtime_1.jsx)(Iframe_1.default, { iframe: iframe, margins: margins });
         }
         return result;
     }, [
@@ -69,7 +70,6 @@ const Media = (props) => {
         isBackground,
         hasVideoFallback,
         fullscreen,
-        isFullscreenImageCover,
         qaAttributes.image,
         qaAttributes.video,
         onImageLoad,
@@ -84,15 +84,14 @@ const Media = (props) => {
         autoplay,
         margins,
     ]);
-    const videoMicrodataScript = (0, react_1.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 ? (0, microdata_1.sanitizeMicrodata)(name) : name, description: description ? (0, microdata_1.sanitizeMicrodata)(description) : description }));
-        return video || youtube || videoIframe ? (react_1.default.createElement("script", { type: "application/ld+json", dangerouslySetInnerHTML: { __html: json } })) : null;
+        return video || youtube || videoIframe ? ((0, jsx_runtime_1.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_1.default.createElement("div", { className: b(null, className), style: { backgroundColor: color }, "data-qa": qa },
-        videoMicrodataScript,
-        content));
+    return ((0, jsx_runtime_1.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

package/build/cjs/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/cjs/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";
 export interface VideoAdditionProps {
     playButton?: PlayButtonProps;
     customBarControlsClassName?: string;
@@ -11,5 +11,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/cjs/components/Media/Video/Video.js

@@ -1,17 +1,18 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
-const react_1 = tslib_1.__importStar(require("react"));
-const models_1 = require("../../../models");
-const utils_1 = require("../../../utils");
-const DefaultVideo_1 = require("../../DefaultVideo/DefaultVideo");
-const ReactPlayer_1 = tslib_1.__importDefault(require("../../ReactPlayer/ReactPlayer"));
+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');
 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 ref = (0, react_1.useRef)(null);
-    (0, react_1.useEffect)(() => {
+    const ref = React.useRef(null);
+    React.useEffect(() => {
         if (ref && ref.current) {
             const { loop } = video;
             if (loop && typeof loop !== 'boolean') {
@@ -30,9 +31,9 @@ const Video = (props) => {
             }
         }
     }, [playVideo, video, setHasVideoFallback]);
-    const reactPlayerBlock = (0, react_1.useMemo)(() => {
+    const reactPlayerBlock = React.useMemo(() => {
         const { src, loop, controls, muted, autoplay = true, elapsedTime, playButton, ariaLabel, customControlsOptions, contain, } = video;
-        return (react_1.default.createElement(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 ((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 }));
     }, [
         video,
         height,
@@ -44,9 +45,8 @@ const Video = (props) => {
         analyticsEvents,
         ratio,
     ]);
-    const defaultVideoBlock = (0, react_1.useMemo)(() => {
-        return video.src.length && !hasVideoFallback ? (react_1.default.createElement("div", { className: b('wrap', videoClassName), style: { height }, "data-qa": qaAttributes.default },
-            react_1.default.createElement(DefaultVideo_1.DefaultVideo, { ref: ref, video: video, qa: qaAttributes.source }))) : null;
+    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;
     }, [
         video,
         hasVideoFallback,
@@ -64,3 +64,4 @@ const Video = (props) => {
     }
 };
 exports.default = Video;
+//# sourceMappingURL=Video.js.map

package/build/cjs/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/cjs/components/Media/Video/utils.js

@@ -7,13 +7,13 @@ var VideoExt;
     VideoExt["Webm"] = "webm";
     VideoExt["Ogg"] = "ogg";
     VideoExt["Ogv"] = "ogv";
-})(VideoExt = exports.VideoExt || (exports.VideoExt = {}));
+})(VideoExt || (exports.VideoExt = VideoExt = {}));
 var VideoType;
 (function (VideoType) {
     VideoType["Mp4"] = "video/mp4";
     VideoType["Webm"] = "video/webm";
     VideoType["Ogg"] = "video/ogg";
-})(VideoType = exports.VideoType || (exports.VideoType = {}));
+})(VideoType || (exports.VideoType = VideoType = {}));
 const VideoTypePriority = {
     [VideoType.Webm]: 1,
     [VideoType.Ogg]: 2,
@@ -46,3 +46,4 @@ const getVideoTypesWithPriority = (sources) => sources
     return VideoTypePriority[typeA] - VideoTypePriority[typeB];
 });
 exports.getVideoTypesWithPriority = getVideoTypesWithPriority;
+//# sourceMappingURL=utils.js.map

package/build/cjs/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,IAAY,QAKX;AALD,WAAY,QAAQ;IAChB,uBAAW,CAAA;IACX,yBAAa,CAAA;IACb,uBAAW,CAAA;IACX,uBAAW,CAAA;AACf,CAAC,EALW,QAAQ,wBAAR,QAAQ,QAKnB;AAED,IAAY,SAIX;AAJD,WAAY,SAAS;IACjB,8BAAiB,CAAA;IACjB,gCAAmB,CAAA;IACnB,8BAAiB,CAAA;AACrB,CAAC,EAJW,SAAS,yBAAT,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;AAEM,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;AAXE,QAAA,yBAAyB,6BAW3B","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/cjs/components/MediaBase/MediaBase.d.ts

@@ -1,13 +1,13 @@
-import React, { ReactElement } from 'react';
-import { MediaBaseBlockProps } from '../../models';
+import * as React from 'react';
+import { MediaBaseBlockProps } from "../../models/index.js";
 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/cjs/components/MediaBase/MediaBase.js

@@ -2,38 +2,34 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.MediaBase = void 0;
 const tslib_1 = require("tslib");
-const react_1 = tslib_1.__importStar(require("react"));
-const AnimateBlock_1 = tslib_1.__importDefault(require("../../components/AnimateBlock/AnimateBlock"));
-const grid_1 = require("../../grid");
-const utils_1 = require("../../utils");
-const Title_1 = tslib_1.__importDefault(require("../Title/Title"));
-const MediaBaseContent_1 = tslib_1.__importDefault(require("./MediaBaseContent"));
+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');
 const Card = () => null;
 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 = (0, react_1.useMemo)(() => {
+    const mediaSizes = React.useMemo(() => {
         return mediaOnly
             ? { [grid_1.GridColumnSize.All]: 12 }
             : { [grid_1.GridColumnSize.Md]: largeMedia ? 8 : 6, [grid_1.GridColumnSize.All]: 12 };
     }, [mediaOnly, largeMedia]);
-    const contentSizes = (0, react_1.useMemo)(() => {
+    const contentSizes = React.useMemo(() => {
         return { [grid_1.GridColumnSize.Md]: largeMedia ? 4 : 6, [grid_1.GridColumnSize.All]: 12 };
     }, [largeMedia]);
-    const mediaContent = !mediaOnly && react_1.default.createElement(MediaBaseContent_1.default, Object.assign({}, mediaContentProps));
+    const mediaContent = !mediaOnly && (0, jsx_runtime_1.jsx)(MediaBaseContent_1.default, Object.assign({}, mediaContentProps));
     const card = children.type === Card ? children === null || children === void 0 ? void 0 : children.props.children : null;
-    return (react_1.default.createElement(AnimateBlock_1.default, { className: b(), onScroll: onScroll, animate: animated },
-        mediaOnly && (react_1.default.createElement(Title_1.default, { className: b('header'), title: title, subtitle: description, colSizes: mediaOnlyColSizes })),
-        react_1.default.createElement(grid_1.Grid, null,
-            react_1.default.createElement(grid_1.Row, { className: b('row', {
-                    reverse: direction === 'media-content',
-                    'mobile-reverse': mobileDirection === 'media-content',
-                }) },
-                react_1.default.createElement(grid_1.Col, { className: b('content'), sizes: contentSizes }, mediaContent),
-                card ? (react_1.default.createElement(grid_1.Col, { sizes: mediaSizes },
-                    react_1.default.createElement("div", { className: b('card') }, card))) : 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', {
+                        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] }) })] }));
 };
 exports.MediaBase = MediaBase;
 exports.MediaBase.Card = Card;
 exports.default = exports.MediaBase;
+//# sourceMappingURL=MediaBase.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"MediaBase.js","sourceRoot":"../../../../src","sources":["components/MediaBase/MediaBase.tsx"],"names":[],"mappings":";;;;;AAAA,qDAA+B;AAE/B,2FAAsE;AACtE,8CAA0D;AAE1D,gDAAkC;AAClC,sEAAmC;AAEnC,qFAA8C;AAI9C,MAAM,CAAC,GAAG,IAAA,aAAK,EAAC,YAAY,CAAC,CAAC;AAE9B,MAAM,IAAI,GAA0C,GAAG,EAAE,CAAC,IAAI,CAAC;AAOxD,MAAM,SAAS,GAAG,CAAC,KAAqB,EAAE,EAAE;IAC/C,MAAM,EACF,QAAQ,EACR,UAAU,EACV,SAAS,GAAG,eAAe,EAC3B,eAAe,GAAG,eAAe,EACjC,QAAQ,EACR,SAAS,EACT,QAAQ,EACR,iBAAiB,GAAG,EAAC,GAAG,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,EAAC,KAEpC,KAAK,EADF,iBAAiB,kBACpB,KAAK,EAVH,oHAUL,CAAQ,CAAC;IACV,MAAM,EAAC,KAAK,EAAE,WAAW,EAAC,GAAG,iBAAiB,CAAC;IAE/C,MAAM,UAAU,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QAClC,OAAO,SAAS;YACZ,CAAC,CAAC,EAAC,CAAC,qBAAc,CAAC,GAAG,CAAC,EAAE,EAAE,EAAC;YAC5B,CAAC,CAAC,EAAC,CAAC,qBAAc,CAAC,EAAE,CAAC,EAAE,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,qBAAc,CAAC,GAAG,CAAC,EAAE,EAAE,EAAC,CAAC;IAC9E,CAAC,EAAE,CAAC,SAAS,EAAE,UAAU,CAAC,CAAC,CAAC;IAE5B,MAAM,YAAY,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QACpC,OAAO,EAAC,CAAC,qBAAc,CAAC,EAAE,CAAC,EAAE,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,qBAAc,CAAC,GAAG,CAAC,EAAE,EAAE,EAAC,CAAC;IAC/E,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAC;IAEjB,MAAM,YAAY,GAAG,CAAC,SAAS,IAAI,uBAAC,0BAAY,oBAAK,iBAAiB,EAAI,CAAC;IAC3E,MAAM,IAAI,GAAG,QAAQ,CAAC,IAAI,KAAK,IAAI,CAAC,CAAC,CAAC,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC;IAEtE,OAAO,CACH,wBAAC,sBAAY,IAAC,SAAS,EAAE,CAAC,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,OAAO,EAAE,QAAQ,aAC9D,SAAS,IAAI,CACV,uBAAC,eAAK,IACF,SAAS,EAAE,CAAC,CAAC,QAAQ,CAAC,EACtB,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,WAAW,EACrB,QAAQ,EAAE,iBAAiB,GAC7B,CACL,EACD,uBAAC,WAAI,cACD,wBAAC,UAAG,IACA,SAAS,EAAE,CAAC,CAAC,KAAK,EAAE;wBAChB,OAAO,EAAE,SAAS,KAAK,eAAe;wBACtC,gBAAgB,EAAE,eAAe,KAAK,eAAe;qBACxD,CAAC,aAEF,uBAAC,UAAG,IAAC,SAAS,EAAE,CAAC,CAAC,SAAS,CAAC,EAAE,KAAK,EAAE,YAAY,YAC5C,YAAY,GACX,EACL,IAAI,CAAC,CAAC,CAAC,CACJ,uBAAC,UAAG,IAAC,KAAK,EAAE,UAAU,YAClB,gCAAK,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,YAAG,IAAI,GAAO,GACrC,CACT,CAAC,CAAC,CAAC,IAAI,IACN,GACH,IACI,CAClB,CAAC;AACN,CAAC,CAAC;AAxDW,QAAA,SAAS,aAwDpB;AAEF,iBAAS,CAAC,IAAI,GAAG,IAAI,CAAC;AAEtB,kBAAe,iBAAS,CAAC","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"]}