npm - @gravity-ui/page-constructor - Versions diffs - 7.0.0-beta.1 → 7.0.0-beta.3 - Mend

@gravity-ui/page-constructor 7.0.0-beta.1 → 7.0.0-beta.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1133) hide show

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

@@ -6,7 +6,7 @@ const utils_1 = require("../../utils/index.js");
 const b = (0, utils_1.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;
+    const allButtons = button ? [{ ...button, size: 'xl' }, ...buttons] : buttons;
     return ((0, jsx_runtime_1.jsx)("div", { className: b(), children: (0, jsx_runtime_1.jsx)(sub_blocks_1.Content, { title: title, text: description, links: links, theme: "default", buttons: allButtons, list: list, additionalInfo: additionalInfo, size: size, colSizes: { all: 12, md: 12 } }) }));
 };
 exports.default = MediaContent;

package/build/cjs/components/MediaBase/MediaBaseContent.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MediaBaseContent.js","sourceRoot":"../../../../src","sources":["components/MediaBase/MediaBaseContent.tsx"],"names":[],"mappings":";;;AAGA,0DAAyC;AACzC,gDAAkC;AAIlC,MAAM,CAAC,GAAG,IAAA,aAAK,EAAC,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,gCAAK,SAAS,EAAE,CAAC,EAAE,YACf,uBAAC,oBAAO,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,kBAAe,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"]}
1	+ {"version":3,"file":"MediaBaseContent.js","sourceRoot":"../../../../src","sources":["components/MediaBase/MediaBaseContent.tsx"],"names":[],"mappings":";;;AAGA,0DAAyC;AACzC,gDAAkC;AAIlC,MAAM,CAAC,GAAG,IAAA,aAAK,EAAC,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,CAAC,EAAC,GAAG,MAAM,EAAE,IAAI,EAAE,IAAkB,EAAC,EAAE,GAAG,OAAO,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC;IAC1F,OAAO,CACH,gCAAK,SAAS,EAAE,CAAC,EAAE,YACf,uBAAC,oBAAO,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,kBAAe,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/cjs/components/OutsideClick/OutsideClick.js CHANGED Viewed

@@ -6,18 +6,7 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const React = tslib_1.__importStar(require("react"));
 const noop_1 = tslib_1.__importDefault(require("lodash/noop.js"));
 class OutsideClick extends React.Component {
-    constructor() {
-        super(...arguments);
-        this.ref = React.createRef();
-        this.handleOutsideClick = (e) => {
-            if (e.target &&
-                this.ref &&
-                this.ref.current &&
-                !this.ref.current.contains(e.target)) {
-                this.props.onOutsideClick();
-            }
-        };
-    }
+    ref = React.createRef();
     componentDidMount() {
         document.addEventListener('click', this.handleOutsideClick, { passive: true });
     }
@@ -28,6 +17,14 @@ class OutsideClick extends React.Component {
         const { children, className, onClick } = this.props;
         return ((0, jsx_runtime_1.jsx)("div", { className: className, ref: this.ref, onClick: onClick, onKeyDown: noop_1.default, role: onClick ? 'button' : 'group', tabIndex: onClick ? 0 : -1, children: children }));
     }
+    handleOutsideClick = (e) => {
+        if (e.target &&
+            this.ref &&
+            this.ref.current &&
+            !this.ref.current.contains(e.target)) {
+            this.props.onOutsideClick();
+        }
+    };
 }
 exports.default = OutsideClick;
 //# sourceMappingURL=OutsideClick.js.map

package/build/cjs/components/OutsideClick/OutsideClick.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"OutsideClick.js","sourceRoot":"../../../../src","sources":["components/OutsideClick/OutsideClick.tsx"],"names":[],"mappings":";;;;AAAA,kCAAkC;AAClC,qDAA+B;AAE/B,kEAA+B;AAQ/B,MAAqB,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,gCACI,SAAS,EAAE,SAAS,EACpB,GAAG,EAAE,IAAI,CAAC,GAAG,EACb,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,cAAI,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~~;AAxCD,+BAwCC","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"]}
1	+ {"version":3,"file":"OutsideClick.js","sourceRoot":"../../../../src","sources":["components/OutsideClick/OutsideClick.tsx"],"names":[],"mappings":";;;;AAAA,kCAAkC;AAClC,qDAA+B;AAE/B,kEAA+B;AAQ/B,MAAqB,YAAa,SAAQ,KAAK,CAAC,SAE/C;IACG,GAAG,GAAG,KAAK,CAAC,SAAS,EAAkB,CAAC;IAExC,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,gCACI,SAAS,EAAE,SAAS,EACpB,GAAG,EAAE,IAAI,CAAC,GAAG,EACb,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,cAAI,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;IAED,kBAAkB,GAAG,CAAC,CAAa,EAAE,EAAE;QACnC,IACI,CAAC,CAAC,MAAM;YACR,IAAI,CAAC,GAAG;YACR,IAAI,CAAC,GAAG,CAAC,OAAO;YAChB,CAAC,IAAI,CAAC,GAAG,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAc,CAAC,EAC9C,CAAC;YACC,IAAI,CAAC,KAAK,CAAC,cAAc,EAAE,CAAC;QAChC,CAAC;IACL,CAAC,CAAC;CACL;AAxCD,+BAwCC","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/cjs/components/OverflowScroller/OverflowScroller.js CHANGED Viewed

@@ -12,55 +12,12 @@ const TRANSITION_TIME = 300;
 const PADDING_SIZE = 24;
 const DEFAULT_ARROW_SIZE = 18;
 class OverflowScroller extends React.Component {
-    constructor() {
-        super(...arguments);
-        this.state = {
-            arrows: [],
-            scrollValue: 0,
-        };
-        this.containerRef = React.createRef();
-        this.wrapperRef = React.createRef();
-        // eslint-disable-next-line @typescript-eslint/member-ordering, react/sort-comp
-        this.checkOverflow = (0, debounce_1.default)(() => {
-            if (this.containerRef &&
-                this.containerRef.current &&
-                this.wrapperRef &&
-                this.wrapperRef.current) {
-                const containerWidth = this.containerRef.current.offsetWidth;
-                const wrapperWidth = this.wrapperRef.current.offsetWidth;
-                const scrollValue = 0;
-                const arrows = wrapperWidth < containerWidth ? [] : ['right'];
-                this.setState({ scrollValue, arrows });
-            }
-        }, 100);
-        this.handleScrollClick = (e, arrow) => {
-            const { scrollValue, arrows } = this.state;
-            const { onScrollStart } = this.props;
-            if (this.containerRef &&
-                this.containerRef.current &&
-                this.wrapperRef &&
-                this.wrapperRef.current) {
-                const containerWidth = this.containerRef.current.offsetWidth;
-                const wrapperWidth = this.wrapperRef.current.offsetWidth;
-                const hiddenWidth = arrow === 'right' ? wrapperWidth - (containerWidth + scrollValue) : scrollValue;
-                const padding = arrows.length > 1 && hiddenWidth + PADDING_SIZE > containerWidth ? PADDING_SIZE : 0;
-                const delta = containerWidth > hiddenWidth ? hiddenWidth : containerWidth;
-                const newScrollValue = arrow === 'right' ? scrollValue + delta + padding : scrollValue - delta - padding;
-                let newArrows = ['left', 'right'];
-                if (newScrollValue + containerWidth >= wrapperWidth) {
-                    newArrows = ['left'];
-                }
-                else if (!newScrollValue) {
-                    newArrows = ['right'];
-                }
-                this.setState({ arrows: newArrows, scrollValue: newScrollValue });
-                if (onScrollStart) {
-                    onScrollStart();
-                }
-                e.stopPropagation();
-            }
-        };
-    }
+    state = {
+        arrows: [],
+        scrollValue: 0,
+    };
+    containerRef = React.createRef();
+    wrapperRef = React.createRef();
     componentDidMount() {
         this.checkOverflow();
         window.addEventListener('resize', this.checkOverflow, { passive: true });
@@ -85,6 +42,46 @@ class OverflowScroller extends React.Component {
                 'padding-right': paddingRight,
             }), children: [(0, jsx_runtime_1.jsx)("div", { className: b(null, className), ref: this.containerRef, children: (0, jsx_runtime_1.jsx)("div", { className: b('wrapper'), style: wrapperStyle, ref: this.wrapperRef, children: children }) }), arrows.map((direction) => ((0, jsx_runtime_1.jsx)("button", { className: b('arrow', { type: direction }, arrowClassName), onClick: (e) => this.handleScrollClick(e, direction), "aria-label": (0, i18n_1.i18n)(direction), children: (0, jsx_runtime_1.jsx)(__1.ToggleArrow, { size: arrowSize, type: 'horizontal', iconType: "navigation" }) }, direction)))] }));
     }
+    // eslint-disable-next-line @typescript-eslint/member-ordering, react/sort-comp
+    checkOverflow = (0, debounce_1.default)(() => {
+        if (this.containerRef &&
+            this.containerRef.current &&
+            this.wrapperRef &&
+            this.wrapperRef.current) {
+            const containerWidth = this.containerRef.current.offsetWidth;
+            const wrapperWidth = this.wrapperRef.current.offsetWidth;
+            const scrollValue = 0;
+            const arrows = wrapperWidth < containerWidth ? [] : ['right'];
+            this.setState({ scrollValue, arrows });
+        }
+    }, 100);
+    handleScrollClick = (e, arrow) => {
+        const { scrollValue, arrows } = this.state;
+        const { onScrollStart } = this.props;
+        if (this.containerRef &&
+            this.containerRef.current &&
+            this.wrapperRef &&
+            this.wrapperRef.current) {
+            const containerWidth = this.containerRef.current.offsetWidth;
+            const wrapperWidth = this.wrapperRef.current.offsetWidth;
+            const hiddenWidth = arrow === 'right' ? wrapperWidth - (containerWidth + scrollValue) : scrollValue;
+            const padding = arrows.length > 1 && hiddenWidth + PADDING_SIZE > containerWidth ? PADDING_SIZE : 0;
+            const delta = containerWidth > hiddenWidth ? hiddenWidth : containerWidth;
+            const newScrollValue = arrow === 'right' ? scrollValue + delta + padding : scrollValue - delta - padding;
+            let newArrows = ['left', 'right'];
+            if (newScrollValue + containerWidth >= wrapperWidth) {
+                newArrows = ['left'];
+            }
+            else if (!newScrollValue) {
+                newArrows = ['right'];
+            }
+            this.setState({ arrows: newArrows, scrollValue: newScrollValue });
+            if (onScrollStart) {
+                onScrollStart();
+            }
+            e.stopPropagation();
+        }
+    };
 }
 exports.default = OverflowScroller;
 //# sourceMappingURL=OverflowScroller.js.map

package/build/cjs/components/OverflowScroller/OverflowScroller.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"OverflowScroller.js","sourceRoot":"../../../../src","sources":["components/OverflowScroller/OverflowScroller.tsx"],"names":[],"mappings":";;;;AAAA,qDAA+B;AAE/B,0EAAuC;AAEvC,mCAA+B;AAC/B,gDAAkC;AAElC,0CAA4B;AAI5B,MAAM,CAAC,GAAG,IAAA,aAAK,EAAC,mBAAmB,CAAC,CAAC;AACrC,MAAM,eAAe,GAAG,GAAG,CAAC;AAC5B,MAAM,YAAY,GAAG,EAAE,CAAC;AACxB,MAAM,kBAAkB,GAAG,EAAE,CAAC;AAiB9B,MAAqB,gBAAiB,SAAQ,KAAK,CAAC,SAGnD;~~IAHD;;QAII~~,~~UAAK~~,GAAG;~~YACJ~~,MAAM,EAAE,EAAa;~~YACrB~~,WAAW,EAAE,CAAC;~~SACjB~~,CAAC;~~QACF~~,~~iBAAY~~,GAAG,KAAK,CAAC,SAAS,EAAkB,CAAC;~~QACjD~~,~~eAAU~~,GAAG,KAAK,CAAC,SAAS,EAAkB,CAAC;~~QAuD~~/C~~,+EAA+E~~;~~QACvE~~,~~kBAAa~~,~~GAAG~~,~~IAAA~~,~~kBAAQ,EAAC,GAAG,~~EAAE~~;YAClC~~,~~IACI,IAAI,~~CAAC~~,YAAY~~;~~gBACjB~~,~~IAAI~~,CAAC,~~YAAY~~,CAAC,~~OAAO;gBACzB~~,IAAI,CAAC,~~UAAU;gBACf~~,~~IAAI~~,~~CAAC~~,~~UAAU~~,~~CAAC~~,~~OAAO~~,~~EACzB~~,CAAC;~~gBACC~~,~~MAAM~~,~~cAAc~~,~~GAAG~~,~~IAAI~~,~~CAAC~~,~~YAAY~~,~~CAAC~~,~~OAAO~~,~~CAAC~~,~~WAAW,CAAC~~;~~gBAC7D~~,MAAM,~~YAAY~~,GAAG,IAAI,CAAC,~~UAAU~~,CAAC~~,OAAO,CAAC,WAAW,CAAC~~;~~gBACzD~~,~~MAAM~~,~~WAAW~~,~~GAAG~~,~~CAAC~~,CAAC~~;gBACtB~~,~~MAAM~~,~~MAAM~~,~~GAAY~~,~~YAAY~~,~~GAAG~~,~~cAAc~~,CAAC,~~CAAC~~,CAAC,EAAE,~~CAAC~~,~~CAAC~~,CAAC,CAAC,~~OAAO,~~CAAC,CAAC;~~gBAEvE~~,~~IAAI~~,CAAC,~~QAAQ~~,CAAC,~~EAAC~~,~~WAAW,~~EAAE,~~MAAM~~,~~EAAC~~,CAAC,CAAC;~~YACzC~~,CAAC;~~QACL~~,~~CAAC,EAAE,GAAG,CAAC,CAAC~~;~~QAEA~~,~~sBAAiB~~,~~GAAG~~,~~CAAC~~,~~CAAmB,~~EAAE,~~KAAY~~,EAAE,EAAE~~;YAC9D~~,~~MAAM~~,~~EAAC~~,~~WAAW~~,~~EAAE,MAAM,~~EAAC,GAAG,IAAI,CAAC,KAAK,CAAC;~~YACzC~~,MAAM,EAAC,~~aAAa~~,EAAC,GAAG,IAAI,CAAC,KAAK,CAAC;~~YAEnC~~,~~IACI~~,~~IAAI~~,CAAC,~~YAAY;gBACjB~~,~~IAAI~~,CAAC,~~YAAY,~~CAAC,~~OAAO;gBACzB~~,IAAI,CAAC,~~UAAU;gBACf~~,~~IAAI~~,CAAC,~~UAAU~~,CAAC,~~OAAO~~,~~EACzB~~,CAAC;~~gBACC~~,MAAM,~~cAAc~~,GAAG,~~IAAI~~,CAAC,~~YAAY~~,CAAC,~~OAAO~~,CAAC,~~WAAW,~~CAAC;~~gBAC7D~~,MAAM,YAAY,GAAG,~~IAAI~~,CAAC,~~UAAU~~,CAAC,OAAO,CAAC,~~WAAW,~~CAAC;~~gBACzD~~,~~MAAM~~,~~WAAW~~,~~GACb~~,~~KAAK~~,~~KAAK~~,~~OAAO,~~CAAC,CAAC,~~CAAC~~,~~YAAY~~,~~GAAG,CAAC,~~cAAc,~~GAAG~~,WAAW,~~CAAC~~,~~CAAC~~,~~CAAC~~,CAAC,~~WAAW~~,CAAC~~;gBACpF~~,~~MAAM~~,~~OAAO~~,~~GACT~~,~~MAAM~~,CAAC,~~MAAM~~,GAAG,~~CAAC~~,IAAI,~~WAAW~~,~~GAAG,~~YAAY,~~GAAG~~,~~cAAc~~,~~CAAC~~,~~CAAC~~,CAAC,~~YAAY,~~CAAC,~~CAAC~~,CAAC,~~CAAC~~,~~CAAC;gBACxF~~,~~MAAM~~,~~KAAK~~,~~GAAG~~,~~cAAc,~~GAAG,~~WAAW~~,~~CAAC~~,CAAC,~~CAAC~~,~~WAAW~~,~~CAAC~~,~~CAAC~~,~~CAAC~~,~~cAAc~~,~~CAAC;gBAC1E,~~MAAM,~~cAAc~~,~~GAChB~~,~~KAAK~~,~~KAAK~~,~~OAAO~~,~~CAAC~~,~~CAAC~~,CAAC,~~WAAW~~,~~GAAG~~,~~KAAK~~,~~GAAG~~,~~OAAO,~~CAAC,CAAC,~~CAAC~~,~~WAAW~~,~~GAAG~~,~~KAAK~~,~~GAAG~~,~~OAAO~~,~~CAAC;gBACtF~~,~~IAAI~~,~~SAAS~~,~~GAAY,~~CAAC,~~MAAM~~,~~EAAE,~~OAAO,~~CAAC~~,CAAC~~;gBAE3C~~,~~IAAI~~,~~cAAc~~,~~GAAG,cAAc,IAAI,YAAY,~~EAAE,CAAC~~;oBAClD~~,~~SAAS~~,~~GAAG,~~CAAC,~~MAAM~~,CAAC,CAAC~~;gBACzB~~,~~CAAC;qBAAM~~,~~IAAI~~,CAAC,~~cAAc~~,~~EAAE~~,~~CAAC;oBACzB~~,SAAS,~~GAAG,~~CAAC,~~OAAO~~,~~CAAC~~,~~CAAC;gBAC1B~~,~~CAAC;gBAED~~,IAAI,~~CAAC~~,~~QAAQ~~,~~CAAC,EAAC,MAAM,~~EAAE,~~SAAS~~,EAAE,~~WAAW~~,EAAE,~~cAAc~~,EAAC,~~CAAC~~,~~CAAC;gBAEhE~~,~~IAAI~~,~~aAAa~~,~~EAAE~~,CAAC~~;oBAChB~~,~~aAAa~~,~~EAAE~~,CAAC;~~gBACpB~~,CAAC;~~gBAED~~,~~CAAC~~,~~CAAC~~,~~eAAe~~,EAAE,CAAC;~~YACxB~~,CAAC~~;QACL~~,CAAC,~~CAAC~~;~~IACN~~,CAAC~~;IA1GG~~,~~iBAAiB~~;~~QACb~~,IAAI,CAAC,~~aAAa~~,~~EAAE~~,CAAC;~~QACrB~~,MAAM,~~CAAC~~,~~gBAAgB~~,CAAC,~~QAAQ~~,~~EAAE~~,~~IAAI~~,CAAC,~~aAAa~~,~~EAAE~~,~~EAAC~~,~~OAAO~~,~~EAAE~~,IAAI,~~EAAC,~~CAAC,~~CAAC;IAC3E~~,CAAC~~;IAED~~,~~kBAAkB~~,~~CACd~~,~~WAAkC~~,~~EAClC~~,~~EAAC~~,WAAW,~~EAAE~~,~~eAAe~~,~~EAAwB~~;~~QAErD~~,MAAM,~~EAAC~~,~~WAAW~~,~~EAAC~~,GAAG,~~IAAI~~,CAAC,~~KAAK~~,CAAC~~;QAEjC~~,~~IAAI~~,~~eAAe~~,~~KAAK~~,~~IAAI~~,CAAC,~~KAAK~~,CAAC,~~WAAW~~,IAAI,~~WAAW~~,~~EAAE~~,CAAC~~;YAC5D~~,~~UAAU~~,~~CAAC,~~WAAW,EAAE,~~eAAe~~,~~GAAG~~,~~GAAG,~~CAAC,CAAC;~~QACnD~~,CAAC;IACL,CAAC~~;IAED~~,~~oBAAoB;QAChB~~,~~MAAM~~,CAAC,~~mBAAmB,~~CAAC,~~QAAQ~~,~~EAAE~~,~~IAAI,~~CAAC,~~aAAa~~,~~CAAC~~,~~CAAC;IAC7D~~,~~CAAC;IAED~~,~~MAAM~~;~~QACF~~,MAAM,EAAC,~~SAAS~~,EAAE,~~cAAc~~,~~EAAE,QAAQ,EAAE,SAAS,GAAG,kBAAkB,~~EAAC,GAAG,IAAI,CAAC,KAAK,CAAC;~~QACzF~~,MAAM,EAAC,~~MAAM~~,~~EAAE,WAAW,~~EAAC,GAAG,IAAI,CAAC,KAAK,CAAC;~~QACzC~~,~~MAAM~~,~~YAAY~~,~~GAAG,MAAM,~~CAAC,~~MAAM~~,~~CAAC~~,CAAC,CAAC,~~EAAC~~,IAAI,~~EAAE,~~CAAC,~~WAAW~~,~~EAAC~~,CAAC,~~CAAC~~,CAAC,~~EAAC~~,~~IAAI~~,~~EAAE,~~CAAC~~,EAAC,CAAC~~;~~QACtE~~,MAAM,~~WAAW~~,GAAG,~~MAAM~~,CAAC,~~QAAQ~~,CAAC,~~MAAM~~,CAAC,CAAC;~~QAC5C~~,MAAM,YAAY,GAAG,~~MAAM~~,CAAC,~~QAAQ~~,CAAC,OAAO,CAAC,CAAC;~~QAE9C~~,~~OAAO~~,~~CACH~~,~~iCACI~~,~~SAAS~~,~~EAAE~~,CAAC,CAAC,~~WAAW~~,~~EAAE;gBACtB~~,cAAc,~~EAAE~~,WAAW~~;gBAC3B~~,~~eAAe~~,~~EAAE~~,~~YAAY;aAChC~~,CAAC,~~aAEF~~,~~gCAAK,SAAS,EAAE,~~CAAC,~~CAAC~~,~~IAAI~~,~~EAAE~~,~~SAAS~~,CAAC,~~EAAE~~,GAAG,~~EAAE~~,IAAI,~~CAAC~~,YAAY,~~YACtD~~,~~gCAAK~~,~~SAAS~~,~~EAAE~~,CAAC,CAAC,~~SAAS~~,CAAC,~~EAAE~~,KAAK,~~EAAE~~,~~YAAY~~,~~EAAE,~~GAAG,~~EAAE~~,~~IAAI~~,CAAC,~~UAAU~~,~~YAClE~~,~~QAAQ~~,~~GACP~~,~~GACJ~~,~~EACL~~,MAAM,~~CAAC~~,~~GAAG~~,~~CAAC~~,~~CAAC~~,~~SAAgB~~,~~EAAE~~,~~EAAE~~,CAAC,~~CAC9B~~,~~mCAEI~~,~~SAAS~~,~~EAAE~~,CAAC,CAAC,~~OAAO~~,~~EAAE~~,~~EAAC~~,~~IAAI~~,~~EAAE~~,~~SAAS~~,~~EAAC~~,~~EAAE~~,~~cAAc~~,CAAC,~~EACxD~~,OAAO,~~EAAE~~,CAAC,~~CAAmB~~,~~EAAE~~,EAAE,CAAC,~~IAAI~~,CAAC,~~iBAAiB~~,CAAC,CAAC,~~EAAE~~,~~SAAS~~,CAAC,~~gBAC1D~~,~~IAAA~~,~~WAAI~~,~~EAAC,~~SAAS,CAAC,~~YAE3B~~,~~uBAAC~~,~~eAAW~~,~~IAAC~~,IAAI,~~EAAE~~,~~SAAS~~,EAAE,~~IAAI~~,EAAE,~~YAAY~~,EAAE,~~QAAQ~~,EAAC,~~YAAY~~,~~GAAG~~,~~IALrE~~,~~SAAS~~,~~CAMT~~,~~CACZ~~,CAAC,~~IACA~~,~~CACT~~,CAAC;~~IACN~~,CAAC;~~CAuDJ~~;AArHD,mCAqHC","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"]}
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/cjs/components/ReactPlayer/ReactPlayer.js CHANGED Viewed

@@ -19,6 +19,9 @@ const utils_2 = require("./utils.js");
 const youtube_1 = require("./utils/youtube.js");
 const b = (0, utils_1.block)('ReactPlayer');
 const FPS = 60;
+const ReactPlayer = 'default' in react_player_1.default && react_player_1.default.default
+    ? react_player_1.default.default
+    : react_player_1.default;
 // eslint-disable-next-line react/display-name
 exports.ReactPlayerBlock = React.forwardRef((props, originRef) => {
     const isMobile = React.useContext(mobileContext_1.MobileContext);
@@ -71,13 +74,13 @@ exports.ReactPlayerBlock = React.forwardRef((props, originRef) => {
         };
     }, [playerRef]);
     React.useEffect(() => {
-        if (ref.current && !(playingVideoRef === null || playingVideoRef === void 0 ? void 0 : playingVideoRef.contains(ref.current))) {
+        if (ref.current && !playingVideoRef?.contains(ref.current)) {
             setMuted(true);
         }
     }, [playingVideoRef]);
     React.useEffect(() => {
         if (showPreview) {
-            playerRef === null || playerRef === void 0 ? void 0 : playerRef.showPreview();
+            playerRef?.showPreview();
         }
     }, [showPreview, playerRef]);
     React.useEffect(() => {
@@ -93,7 +96,7 @@ exports.ReactPlayerBlock = React.forwardRef((props, originRef) => {
     }, [isPlaying, started]);
     React.useEffect(() => {
         if (started && !Number.isNaN(Number(elapsedTime))) {
-            playerRef === null || playerRef === void 0 ? void 0 : playerRef.seekTo(elapsedTime !== null && elapsedTime !== void 0 ? elapsedTime : 0, 'seconds');
+            playerRef?.seekTo(elapsedTime ?? 0, 'seconds');
         }
     }, [elapsedTime, playerRef, started]);
     React.useEffect(() => {
@@ -106,7 +109,7 @@ exports.ReactPlayerBlock = React.forwardRef((props, originRef) => {
                     parseFloat(paddingLeft) -
                     parseFloat(paddingRight);
                 setWidth(newWidth);
-                setCurrentHeight(Math.floor(getHeight(newWidth, ratio !== null && ratio !== void 0 ? ratio : (autoRatio ? actualRatio : undefined))));
+                setCurrentHeight(Math.floor(getHeight(newWidth, ratio ?? (autoRatio ? actualRatio : undefined))));
             }
         }, 200);
         updateSize();
@@ -115,8 +118,8 @@ exports.ReactPlayerBlock = React.forwardRef((props, originRef) => {
             window.removeEventListener('resize', updateSize);
         };
     }, [actualRatio, autoRatio, ratio]);
-    const playEvents = React.useMemo(() => eventsArray === null || eventsArray === void 0 ? void 0 : eventsArray.filter((e) => e.type === models_1.PredefinedEventTypes.Play), [eventsArray]);
-    const stopEvents = React.useMemo(() => eventsArray === null || eventsArray === void 0 ? void 0 : eventsArray.filter((e) => e.type === models_1.PredefinedEventTypes.Stop), [eventsArray]);
+    const playEvents = React.useMemo(() => eventsArray?.filter((e) => e.type === models_1.PredefinedEventTypes.Play), [eventsArray]);
+    const stopEvents = React.useMemo(() => eventsArray?.filter((e) => e.type === models_1.PredefinedEventTypes.Stop), [eventsArray]);
     const playIcon = React.useMemo(() => {
         let playButtonContent;
         switch (type) {
@@ -156,7 +159,7 @@ exports.ReactPlayerBlock = React.forwardRef((props, originRef) => {
     ]);
     const handleClickPreview = React.useCallback(() => {
         setIsPlaying(true);
-        onClickPreview === null || onClickPreview === void 0 ? void 0 : onClickPreview();
+        onClickPreview?.();
         handleAnalytics(playEvents);
     }, [onClickPreview, handleAnalytics, playEvents]);
     const onPause = React.useCallback(() => {
@@ -206,7 +209,7 @@ exports.ReactPlayerBlock = React.forwardRef((props, originRef) => {
         if (loop) {
             setPlayedPercent(0);
             setIsPlaying(true);
-            playerRef === null || playerRef === void 0 ? void 0 : playerRef.seekTo(0);
+            playerRef?.seekTo(0);
         }
         setEnded(true);
     }, [loop, playerRef]);
@@ -219,8 +222,7 @@ exports.ReactPlayerBlock = React.forwardRef((props, originRef) => {
         }
     }, [isPlaying, onPlay, onPause]);
     const handleClick = React.useCallback(() => {
-        var _a;
-        (_a = buttonRef.current) === null || _a === void 0 ? void 0 : _a.click();
+        buttonRef.current?.click();
         if (controls === models_1.MediaVideoControlsType.Custom) {
             if (customControlsType === models_1.CustomControlsType.WithMuteButton) {
                 changeMute(muted);
@@ -231,10 +233,9 @@ exports.ReactPlayerBlock = React.forwardRef((props, originRef) => {
         }
     }, [controls, customControlsType, changeMute, muted, onPlayClick]);
     const handleKeyDown = React.useCallback((e) => {
-        var _a;
         const key = e.key.toLowerCase();
         if (key === 'enter') {
-            (_a = buttonRef.current) === null || _a === void 0 ? void 0 : _a.click();
+            buttonRef.current?.click();
         }
     }, []);
     const onFocusIn = React.useCallback(() => setHovered(true), []);
@@ -244,7 +245,7 @@ exports.ReactPlayerBlock = React.forwardRef((props, originRef) => {
             controls,
             contain,
             'auto-ratio': autoRatio,
-        }, className), ref: ref, onClick: handleClick, onMouseEnter: onFocusIn, onMouseLeave: onFocusOut, onFocus: onFocusIn, onBlur: onFocusOut, onKeyDown: handleKeyDown, role: "button", tabIndex: 0, children: isMounted ? ((0, jsx_runtime_1.jsxs)(React.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_player_1.default, { className: b('player'), url: videoSrc, muted: muted, controls: controls === models_1.MediaVideoControlsType.Default, height: currentHeight || '100%', width: width || '100%', light: previewImgUrl, playing: isPlaying, playIcon: playIcon, progressInterval: FPS, onClickPreview: handleClickPreview, onStart: onStart, onReady: onReady, onPlay: onPlay, onPause: autoPlay && customControlsType !== models_1.CustomControlsType.WithMuteButton
+        }, className), ref: ref, onClick: handleClick, onMouseEnter: onFocusIn, onMouseLeave: onFocusOut, onFocus: onFocusIn, onBlur: onFocusOut, onKeyDown: handleKeyDown, role: "button", tabIndex: 0, children: isMounted ? ((0, jsx_runtime_1.jsxs)(React.Fragment, { children: [(0, jsx_runtime_1.jsx)(ReactPlayer, { className: b('player'), url: videoSrc, muted: muted, controls: controls === models_1.MediaVideoControlsType.Default, height: currentHeight || '100%', width: width || '100%', light: previewImgUrl, playing: isPlaying, playIcon: playIcon, progressInterval: FPS, onClickPreview: handleClickPreview, onStart: onStart, onReady: onReady, onPlay: onPlay, onPause: autoPlay && customControlsType !== models_1.CustomControlsType.WithMuteButton
                         ? undefined
                         : onPause, onProgress: onProgress, onEnded: onEnded, "aria-label": ariaLabel, previewTabIndex: -1, config: {
                         file: {

package/build/cjs/components/ReactPlayer/ReactPlayer.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ReactPlayer.js","sourceRoot":"../../../../src","sources":["components/ReactPlayer/ReactPlayer.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport {PlayFill} from '@gravity-ui/icons';\nimport {Icon} from '@gravity-ui/uikit';\nimport debounce from 'lodash/debounce';\nimport ReactPlayer from 'react-player';\n\nimport {MobileContext} from '../../context/mobileContext';\nimport {VideoContext} from '../../context/videoContext';\nimport {useAnalytics, useMount} from '../../hooks';\nimport {\n AnalyticsEvent,\n ClassNameProps,\n CustomControlsButtonPositioning,\n CustomControlsType,\n DefaultEventNames,\n MediaVideoControlsType,\n MediaVideoProps,\n PlayButtonProps,\n PlayButtonThemes,\n PlayButtonType,\n PredefinedEventTypes,\n ReactPlayerBlockHandler,\n} from '../../models';\nimport {block} from '../../utils';\n\nimport CustomBarControls from './CustomBarControls';\nimport {i18n} from './i18n';\nimport {checkYoutubeVideos} from './utils';\nimport {isYoutubePlayerInstance} from './utils/youtube';\n\nimport './ReactPlayer.scss';\n\nconst b = block('ReactPlayer');\n\nconst FPS = 60;\n\nexport interface ReactPlayerBlockProps\n extends Omit<MediaVideoProps, 'loop' \| 'src'>,\n ClassNameProps {\n src: string \| string[];\n previewImgUrl?: string;\n loop?: boolean;\n customBarControlsClassName?: string;\n showPreview?: boolean;\n onClickPreview?: () => void;\n height?: number;\n ratio?: number;\n autoRatio?: boolean;\n children?: React.ReactNode;\n}\n\ninterface PlayerPropgress {\n played: number;\n}\n\n// eslint-disable-next-line react/display-name\nexport const ReactPlayerBlock = React.forwardRef<ReactPlayerBlockHandler, ReactPlayerBlockProps>(\n (props, originRef) => {\n const isMobile = React.useContext(MobileContext);\n const {\n src,\n previewImgUrl,\n loop = false,\n controls = MediaVideoControlsType.Default,\n customControlsOptions = {},\n muted: initiallyMuted = false,\n elapsedTime,\n playButton,\n className,\n customBarControlsClassName,\n showPreview,\n onClickPreview,\n analyticsEvents,\n height,\n ariaLabel,\n ratio,\n autoRatio,\n contain = true,\n } = props;\n\n const {\n type = PlayButtonType.Default,\n theme = PlayButtonThemes.Blue,\n text,\n className: buttonClassName,\n } = playButton \|\| ({} as PlayButtonProps);\n const {\n type: customControlsType = CustomControlsType.WithMuteButton,\n muteButtonShown,\n positioning = CustomControlsButtonPositioning.Center,\n } = customControlsOptions;\n\n const autoPlay = Boolean(!isMobile && !previewImgUrl && props.autoplay);\n const mute = initiallyMuted \|\| autoPlay;\n\n const {playingVideoRef, setProps} = React.useContext(VideoContext);\n\n const ref = React.useRef<HTMLDivElement>(null);\n const buttonRef = React.useRef<HTMLButtonElement>(null);\n\n const [playerRef, setPlayerRef] = React.useState<ReactPlayer>();\n const [isPlaying, setIsPlaying] = React.useState(autoPlay);\n const [playedPercent, setPlayedPercent] = React.useState<number>(0);\n const [currentHeight, setCurrentHeight] = React.useState(height);\n const [width, setWidth] = React.useState<number>(0);\n const [actualRatio, setActualRatio] = React.useState<number>();\n const [muted, setMuted] = React.useState<boolean>(mute);\n const [started, setStarted] = React.useState(autoPlay);\n const [ended, setEnded] = React.useState<boolean>(false);\n const [isMounted, setIsMounted] = React.useState(false);\n const [hovered, setHovered] = React.useState(isMobile);\n\n useMount(() => setIsMounted(true));\n\n const videoSrc = React.useMemo(() => checkYoutubeVideos(src), [src]);\n\n const eventsArray = React.useMemo(() => {\n if (analyticsEvents) {\n return Array.isArray(analyticsEvents) ? analyticsEvents : [analyticsEvents];\n }\n\n return [];\n }, [analyticsEvents]);\n const handleAnalytics = useAnalytics(DefaultEventNames.ReactPlayerControls);\n\n React.useImperativeHandle(originRef, () => {\n if (!playerRef) {\n return;\n }\n\n let play, pause, addEventListener;\n const videoInstance = playerRef.getInternalPlayer();\n if (isYoutubePlayerInstance(videoInstance)) {\n ({pauseVideo: pause, playVideo: play, addEventListener} = videoInstance);\n } else {\n // it is assumed that `videoInstance` is HTMLVideoElement by default\n ({play, pause, addEventListener} = videoInstance);\n }\n\n // eslint-disable-next-line consistent-return\n return {\n play: play.bind(videoInstance),\n pause: pause.bind(videoInstance),\n addEventListener: addEventListener.bind(videoInstance),\n };\n }, [playerRef]);\n\n React.useEffect(() => {\n if (ref.current && !playingVideoRef?.contains(ref.current)) {\n setMuted(true);\n }\n }, [playingVideoRef]);\n\n React.useEffect(() => {\n if (showPreview) {\n playerRef?.showPreview();\n }\n }, [showPreview, playerRef]);\n\n React.useEffect(() => {\n if (playerRef && !started) {\n setIsPlaying(autoPlay);\n }\n }, [autoPlay, playerRef, started]);\n\n React.useEffect(() => setMuted(mute), [mute]);\n\n React.useEffect(() => {\n if (!started && isPlaying) {\n setStarted(true);\n }\n }, [isPlaying, started]);\n\n React.useEffect(() => {\n if (started && !Number.isNaN(Number(elapsedTime))) {\n playerRef?.seekTo(elapsedTime ?? 0, 'seconds');\n }\n }, [elapsedTime, playerRef, started]);\n\n React.useEffect(() => {\n const updateSize = debounce(() => {\n if (ref.current) {\n // We need to get parent's width does not equal 0\n const parentElement = getParentElement(ref.current);\n const {paddingLeft, paddingRight} = getComputedStyle(parentElement);\n const newWidth =\n parentElement.offsetWidth -\n parseFloat(paddingLeft) -\n parseFloat(paddingRight);\n\n setWidth(newWidth);\n setCurrentHeight(\n Math.floor(\n getHeight(newWidth, ratio ?? (autoRatio ? actualRatio : undefined)),\n ),\n );\n }\n }, 200);\n\n updateSize();\n window.addEventListener('resize', updateSize, {passive: true});\n return () => {\n window.removeEventListener('resize', updateSize);\n };\n }, [actualRatio, autoRatio, ratio]);\n\n const playEvents = React.useMemo(\n () => eventsArray?.filter((e: AnalyticsEvent) => e.type === PredefinedEventTypes.Play),\n [eventsArray],\n );\n const stopEvents = React.useMemo(\n () => eventsArray?.filter((e: AnalyticsEvent) => e.type === PredefinedEventTypes.Stop),\n [eventsArray],\n );\n\n const playIcon = React.useMemo(() => {\n let playButtonContent;\n\n switch (type) {\n case PlayButtonType.Text:\n playButtonContent = text;\n break;\n case PlayButtonType.Default:\n default:\n playButtonContent = <Icon className={b('icon')} data={PlayFill} size={24} />;\n break;\n }\n\n return (\n <button\n className={b('button', {theme, text: Boolean(text)}, buttonClassName)}\n aria-label={i18n('play')}\n ref={buttonRef}\n >\n {playButtonContent}\n </button>\n );\n }, [type, theme, text, buttonClassName]);\n\n const changeMute = React.useCallback(\n (isMuted: boolean) => {\n if (\n isMuted &&\n playerRef &&\n controls === MediaVideoControlsType.Custom &&\n customControlsType === CustomControlsType.WithMuteButton\n ) {\n playerRef.seekTo(0);\n setPlayedPercent(0);\n }\n\n const events = isMuted ? playEvents : stopEvents;\n handleAnalytics(events);\n\n if (isMuted) {\n setProps({playingVideoRef: ref.current});\n }\n\n // In order to the progress bar to update (equals 0) before displaying\n setTimeout(() => setMuted(!isMuted), 0);\n },\n [\n playerRef,\n customControlsType,\n playEvents,\n stopEvents,\n handleAnalytics,\n setProps,\n controls,\n ],\n );\n\n const handleClickPreview = React.useCallback(() => {\n setIsPlaying(true);\n onClickPreview?.();\n\n handleAnalytics(playEvents);\n }, [onClickPreview, handleAnalytics, playEvents]);\n\n const onPause = React.useCallback(() => {\n // For support correct state for youtube\n if (\n controls !== MediaVideoControlsType.Custom \|\|\n customControlsType !== CustomControlsType.WithMuteButton\n ) {\n setIsPlaying(false);\n }\n }, [controls, customControlsType]);\n\n const onStart = React.useCallback(() => {\n if (!autoPlay && !initiallyMuted) {\n setMuted(false);\n }\n }, [autoPlay, initiallyMuted]);\n\n const onPlay = React.useCallback(() => {\n setIsPlaying(true);\n\n if (\n controls === MediaVideoControlsType.Custom &&\n customControlsType === CustomControlsType.WithMuteButton\n ) {\n if (ended) {\n changeMute(false);\n } else if (!isPlaying) {\n changeMute(muted);\n }\n setEnded(false);\n }\n }, [changeMute, controls, customControlsType, ended, isPlaying, muted]);\n\n const onReady = React.useCallback((player: ReactPlayer) => {\n setPlayerRef(player);\n const videoElement = player.getInternalPlayer();\n const videoWidth = videoElement.videoWidth as number \| undefined;\n const videoHeight = videoElement.videoHeight as number \| undefined;\n if (videoWidth && videoHeight) {\n setActualRatio(videoHeight / videoWidth);\n }\n }, []);\n\n const onProgress = React.useCallback((progress: PlayerPropgress) => {\n setPlayedPercent(progress.played);\n\n if (progress.played === 1) {\n setMuted(true);\n }\n }, []);\n\n const onEnded = React.useCallback(() => {\n // Youtube videos not muted after finishing playing and start again.\n // 'onEnded' does not fire when 'loop' is set to true.\n // It is custom loop with muted sound after finishing playing and start again.\n if (loop) {\n setPlayedPercent(0);\n setIsPlaying(true);\n playerRef?.seekTo(0);\n }\n\n setEnded(true);\n }, [loop, playerRef]);\n\n const onPlayClick = React.useCallback(() => {\n if (isPlaying) {\n onPause();\n } else {\n onPlay();\n }\n }, [isPlaying, onPlay, onPause]);\n\n const handleClick = React.useCallback(() => {\n buttonRef.current?.click();\n\n if (controls === MediaVideoControlsType.Custom) {\n if (customControlsType === CustomControlsType.WithMuteButton) {\n changeMute(muted);\n } else {\n onPlayClick();\n }\n }\n }, [controls, customControlsType, changeMute, muted, onPlayClick]);\n\n const handleKeyDown = React.useCallback((e: React.KeyboardEvent) => {\n const key = e.key.toLowerCase();\n\n if (key === 'enter') {\n buttonRef.current?.click();\n }\n }, []);\n\n const onFocusIn = React.useCallback(() => setHovered(true), []);\n const onFocusOut = React.useCallback(() => setHovered(false), []);\n\n return (\n <div\n className={b(\n {\n wrapper: !currentHeight,\n controls,\n contain,\n 'auto-ratio': autoRatio,\n },\n className,\n )}\n ref={ref}\n onClick={handleClick}\n onMouseEnter={onFocusIn}\n onMouseLeave={onFocusOut}\n onFocus={onFocusIn}\n onBlur={onFocusOut}\n onKeyDown={handleKeyDown}\n role=\"button\"\n tabIndex={0}\n >\n {isMounted ? (\n <React.Fragment>\n <ReactPlayer\n className={b('player')}\n url={videoSrc}\n muted={muted}\n controls={controls === MediaVideoControlsType.Default}\n height={currentHeight \|\| '100%'}\n width={width \|\| '100%'}\n light={previewImgUrl}\n playing={isPlaying}\n playIcon={playIcon}\n progressInterval={FPS}\n onClickPreview={handleClickPreview}\n onStart={onStart}\n onReady={onReady}\n onPlay={onPlay}\n onPause={\n autoPlay && customControlsType !== CustomControlsType.WithMuteButton\n ? undefined\n : onPause\n } // to prevent pause icon flickering when autoplayed video ends\n onProgress={onProgress}\n onEnded={onEnded}\n aria-label={ariaLabel}\n previewTabIndex={-1}\n config={{\n file: {\n attributes: {\n pip: isMobile ? 'false' : undefined,\n playsinline: isMobile ? '' : undefined,\n disablepictureinpicture: isMobile ? '' : undefined,\n },\n },\n }}\n />\n {controls === MediaVideoControlsType.Custom && (\n <CustomBarControls\n className={customBarControlsClassName}\n mute={{\n isMuted: muted,\n changeMute: (event: React.MouseEvent) => {\n event.stopPropagation();\n changeMute(muted);\n },\n }}\n elapsedTimePercent={playedPercent}\n type={customControlsType}\n isPaused={!isPlaying}\n onPlayClick={onPlayClick}\n muteButtonShown={muteButtonShown}\n shown={hovered && ((!started && !previewImgUrl) \|\| started)}\n positioning={positioning}\n />\n )}\n </React.Fragment>\n ) : null}\n </div>\n );\n },\n);\n\nfunction getHeight(width: number, ratio: number = 9 / 16): number {\n return width * ratio;\n}\n\nfunction getParentElement(element: HTMLElement): HTMLElement {\n const parentElement = element.parentElement;\n\n if (!parentElement) {\n return element;\n }\n\n return parentElement.offsetWidth ? parentElement : getParentElement(parentElement);\n}\n\nexport default ReactPlayerBlock;\n"]}
1	+ {"version":3,"file":"ReactPlayer.js","sourceRoot":"../../../../src","sources":["components/ReactPlayer/ReactPlayer.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport {PlayFill} from '@gravity-ui/icons';\nimport {Icon} from '@gravity-ui/uikit';\nimport debounce from 'lodash/debounce';\nimport _ReactPlayer from 'react-player';\n\nimport {MobileContext} from '../../context/mobileContext';\nimport {VideoContext} from '../../context/videoContext';\nimport {useAnalytics, useMount} from '../../hooks';\nimport {\n AnalyticsEvent,\n ClassNameProps,\n CustomControlsButtonPositioning,\n CustomControlsType,\n DefaultEventNames,\n MediaVideoControlsType,\n MediaVideoProps,\n PlayButtonProps,\n PlayButtonThemes,\n PlayButtonType,\n PredefinedEventTypes,\n ReactPlayerBlockHandler,\n} from '../../models';\nimport {block} from '../../utils';\n\nimport CustomBarControls from './CustomBarControls';\nimport {i18n} from './i18n';\nimport {checkYoutubeVideos} from './utils';\nimport {isYoutubePlayerInstance} from './utils/youtube';\n\nimport './ReactPlayer.scss';\n\nconst b = block('ReactPlayer');\n\nconst FPS = 60;\n\nconst ReactPlayer =\n 'default' in _ReactPlayer && _ReactPlayer.default\n ? (_ReactPlayer.default as typeof _ReactPlayer)\n : _ReactPlayer;\n\nexport interface ReactPlayerBlockProps\n extends Omit<MediaVideoProps, 'loop' \| 'src'>,\n ClassNameProps {\n src: string \| string[];\n previewImgUrl?: string;\n loop?: boolean;\n customBarControlsClassName?: string;\n showPreview?: boolean;\n onClickPreview?: () => void;\n height?: number;\n ratio?: number;\n autoRatio?: boolean;\n children?: React.ReactNode;\n}\n\ninterface PlayerPropgress {\n played: number;\n}\n\n// eslint-disable-next-line react/display-name\nexport const ReactPlayerBlock = React.forwardRef<ReactPlayerBlockHandler, ReactPlayerBlockProps>(\n (props, originRef) => {\n const isMobile = React.useContext(MobileContext);\n const {\n src,\n previewImgUrl,\n loop = false,\n controls = MediaVideoControlsType.Default,\n customControlsOptions = {},\n muted: initiallyMuted = false,\n elapsedTime,\n playButton,\n className,\n customBarControlsClassName,\n showPreview,\n onClickPreview,\n analyticsEvents,\n height,\n ariaLabel,\n ratio,\n autoRatio,\n contain = true,\n } = props;\n\n const {\n type = PlayButtonType.Default,\n theme = PlayButtonThemes.Blue,\n text,\n className: buttonClassName,\n } = playButton \|\| ({} as PlayButtonProps);\n const {\n type: customControlsType = CustomControlsType.WithMuteButton,\n muteButtonShown,\n positioning = CustomControlsButtonPositioning.Center,\n } = customControlsOptions;\n\n const autoPlay = Boolean(!isMobile && !previewImgUrl && props.autoplay);\n const mute = initiallyMuted \|\| autoPlay;\n\n const {playingVideoRef, setProps} = React.useContext(VideoContext);\n\n const ref = React.useRef<HTMLDivElement>(null);\n const buttonRef = React.useRef<HTMLButtonElement>(null);\n\n const [playerRef, setPlayerRef] = React.useState<_ReactPlayer>();\n const [isPlaying, setIsPlaying] = React.useState(autoPlay);\n const [playedPercent, setPlayedPercent] = React.useState<number>(0);\n const [currentHeight, setCurrentHeight] = React.useState(height);\n const [width, setWidth] = React.useState<number>(0);\n const [actualRatio, setActualRatio] = React.useState<number>();\n const [muted, setMuted] = React.useState<boolean>(mute);\n const [started, setStarted] = React.useState(autoPlay);\n const [ended, setEnded] = React.useState<boolean>(false);\n const [isMounted, setIsMounted] = React.useState(false);\n const [hovered, setHovered] = React.useState(isMobile);\n\n useMount(() => setIsMounted(true));\n\n const videoSrc = React.useMemo(() => checkYoutubeVideos(src), [src]);\n\n const eventsArray = React.useMemo(() => {\n if (analyticsEvents) {\n return Array.isArray(analyticsEvents) ? analyticsEvents : [analyticsEvents];\n }\n\n return [];\n }, [analyticsEvents]);\n const handleAnalytics = useAnalytics(DefaultEventNames.ReactPlayerControls);\n\n React.useImperativeHandle(originRef, () => {\n if (!playerRef) {\n return;\n }\n\n let play, pause, addEventListener;\n const videoInstance = playerRef.getInternalPlayer();\n if (isYoutubePlayerInstance(videoInstance)) {\n ({pauseVideo: pause, playVideo: play, addEventListener} = videoInstance);\n } else {\n // it is assumed that `videoInstance` is HTMLVideoElement by default\n ({play, pause, addEventListener} = videoInstance);\n }\n\n // eslint-disable-next-line consistent-return\n return {\n play: play.bind(videoInstance),\n pause: pause.bind(videoInstance),\n addEventListener: addEventListener.bind(videoInstance),\n };\n }, [playerRef]);\n\n React.useEffect(() => {\n if (ref.current && !playingVideoRef?.contains(ref.current)) {\n setMuted(true);\n }\n }, [playingVideoRef]);\n\n React.useEffect(() => {\n if (showPreview) {\n playerRef?.showPreview();\n }\n }, [showPreview, playerRef]);\n\n React.useEffect(() => {\n if (playerRef && !started) {\n setIsPlaying(autoPlay);\n }\n }, [autoPlay, playerRef, started]);\n\n React.useEffect(() => setMuted(mute), [mute]);\n\n React.useEffect(() => {\n if (!started && isPlaying) {\n setStarted(true);\n }\n }, [isPlaying, started]);\n\n React.useEffect(() => {\n if (started && !Number.isNaN(Number(elapsedTime))) {\n playerRef?.seekTo(elapsedTime ?? 0, 'seconds');\n }\n }, [elapsedTime, playerRef, started]);\n\n React.useEffect(() => {\n const updateSize = debounce(() => {\n if (ref.current) {\n // We need to get parent's width does not equal 0\n const parentElement = getParentElement(ref.current);\n const {paddingLeft, paddingRight} = getComputedStyle(parentElement);\n const newWidth =\n parentElement.offsetWidth -\n parseFloat(paddingLeft) -\n parseFloat(paddingRight);\n\n setWidth(newWidth);\n setCurrentHeight(\n Math.floor(\n getHeight(newWidth, ratio ?? (autoRatio ? actualRatio : undefined)),\n ),\n );\n }\n }, 200);\n\n updateSize();\n window.addEventListener('resize', updateSize, {passive: true});\n return () => {\n window.removeEventListener('resize', updateSize);\n };\n }, [actualRatio, autoRatio, ratio]);\n\n const playEvents = React.useMemo(\n () => eventsArray?.filter((e: AnalyticsEvent) => e.type === PredefinedEventTypes.Play),\n [eventsArray],\n );\n const stopEvents = React.useMemo(\n () => eventsArray?.filter((e: AnalyticsEvent) => e.type === PredefinedEventTypes.Stop),\n [eventsArray],\n );\n\n const playIcon = React.useMemo(() => {\n let playButtonContent;\n\n switch (type) {\n case PlayButtonType.Text:\n playButtonContent = text;\n break;\n case PlayButtonType.Default:\n default:\n playButtonContent = <Icon className={b('icon')} data={PlayFill} size={24} />;\n break;\n }\n\n return (\n <button\n className={b('button', {theme, text: Boolean(text)}, buttonClassName)}\n aria-label={i18n('play')}\n ref={buttonRef}\n >\n {playButtonContent}\n </button>\n );\n }, [type, theme, text, buttonClassName]);\n\n const changeMute = React.useCallback(\n (isMuted: boolean) => {\n if (\n isMuted &&\n playerRef &&\n controls === MediaVideoControlsType.Custom &&\n customControlsType === CustomControlsType.WithMuteButton\n ) {\n playerRef.seekTo(0);\n setPlayedPercent(0);\n }\n\n const events = isMuted ? playEvents : stopEvents;\n handleAnalytics(events);\n\n if (isMuted) {\n setProps({playingVideoRef: ref.current});\n }\n\n // In order to the progress bar to update (equals 0) before displaying\n setTimeout(() => setMuted(!isMuted), 0);\n },\n [\n playerRef,\n customControlsType,\n playEvents,\n stopEvents,\n handleAnalytics,\n setProps,\n controls,\n ],\n );\n\n const handleClickPreview = React.useCallback(() => {\n setIsPlaying(true);\n onClickPreview?.();\n\n handleAnalytics(playEvents);\n }, [onClickPreview, handleAnalytics, playEvents]);\n\n const onPause = React.useCallback(() => {\n // For support correct state for youtube\n if (\n controls !== MediaVideoControlsType.Custom \|\|\n customControlsType !== CustomControlsType.WithMuteButton\n ) {\n setIsPlaying(false);\n }\n }, [controls, customControlsType]);\n\n const onStart = React.useCallback(() => {\n if (!autoPlay && !initiallyMuted) {\n setMuted(false);\n }\n }, [autoPlay, initiallyMuted]);\n\n const onPlay = React.useCallback(() => {\n setIsPlaying(true);\n\n if (\n controls === MediaVideoControlsType.Custom &&\n customControlsType === CustomControlsType.WithMuteButton\n ) {\n if (ended) {\n changeMute(false);\n } else if (!isPlaying) {\n changeMute(muted);\n }\n setEnded(false);\n }\n }, [changeMute, controls, customControlsType, ended, isPlaying, muted]);\n\n const onReady = React.useCallback((player: _ReactPlayer) => {\n setPlayerRef(player);\n const videoElement = player.getInternalPlayer();\n const videoWidth = videoElement.videoWidth as number \| undefined;\n const videoHeight = videoElement.videoHeight as number \| undefined;\n if (videoWidth && videoHeight) {\n setActualRatio(videoHeight / videoWidth);\n }\n }, []);\n\n const onProgress = React.useCallback((progress: PlayerPropgress) => {\n setPlayedPercent(progress.played);\n\n if (progress.played === 1) {\n setMuted(true);\n }\n }, []);\n\n const onEnded = React.useCallback(() => {\n // Youtube videos not muted after finishing playing and start again.\n // 'onEnded' does not fire when 'loop' is set to true.\n // It is custom loop with muted sound after finishing playing and start again.\n if (loop) {\n setPlayedPercent(0);\n setIsPlaying(true);\n playerRef?.seekTo(0);\n }\n\n setEnded(true);\n }, [loop, playerRef]);\n\n const onPlayClick = React.useCallback(() => {\n if (isPlaying) {\n onPause();\n } else {\n onPlay();\n }\n }, [isPlaying, onPlay, onPause]);\n\n const handleClick = React.useCallback(() => {\n buttonRef.current?.click();\n\n if (controls === MediaVideoControlsType.Custom) {\n if (customControlsType === CustomControlsType.WithMuteButton) {\n changeMute(muted);\n } else {\n onPlayClick();\n }\n }\n }, [controls, customControlsType, changeMute, muted, onPlayClick]);\n\n const handleKeyDown = React.useCallback((e: React.KeyboardEvent) => {\n const key = e.key.toLowerCase();\n\n if (key === 'enter') {\n buttonRef.current?.click();\n }\n }, []);\n\n const onFocusIn = React.useCallback(() => setHovered(true), []);\n const onFocusOut = React.useCallback(() => setHovered(false), []);\n\n return (\n <div\n className={b(\n {\n wrapper: !currentHeight,\n controls,\n contain,\n 'auto-ratio': autoRatio,\n },\n className,\n )}\n ref={ref}\n onClick={handleClick}\n onMouseEnter={onFocusIn}\n onMouseLeave={onFocusOut}\n onFocus={onFocusIn}\n onBlur={onFocusOut}\n onKeyDown={handleKeyDown}\n role=\"button\"\n tabIndex={0}\n >\n {isMounted ? (\n <React.Fragment>\n <ReactPlayer\n className={b('player')}\n url={videoSrc}\n muted={muted}\n controls={controls === MediaVideoControlsType.Default}\n height={currentHeight \|\| '100%'}\n width={width \|\| '100%'}\n light={previewImgUrl}\n playing={isPlaying}\n playIcon={playIcon}\n progressInterval={FPS}\n onClickPreview={handleClickPreview}\n onStart={onStart}\n onReady={onReady}\n onPlay={onPlay}\n onPause={\n autoPlay && customControlsType !== CustomControlsType.WithMuteButton\n ? undefined\n : onPause\n } // to prevent pause icon flickering when autoplayed video ends\n onProgress={onProgress}\n onEnded={onEnded}\n aria-label={ariaLabel}\n previewTabIndex={-1}\n config={{\n file: {\n attributes: {\n pip: isMobile ? 'false' : undefined,\n playsinline: isMobile ? '' : undefined,\n disablepictureinpicture: isMobile ? '' : undefined,\n },\n },\n }}\n />\n {controls === MediaVideoControlsType.Custom && (\n <CustomBarControls\n className={customBarControlsClassName}\n mute={{\n isMuted: muted,\n changeMute: (event: React.MouseEvent) => {\n event.stopPropagation();\n changeMute(muted);\n },\n }}\n elapsedTimePercent={playedPercent}\n type={customControlsType}\n isPaused={!isPlaying}\n onPlayClick={onPlayClick}\n muteButtonShown={muteButtonShown}\n shown={hovered && ((!started && !previewImgUrl) \|\| started)}\n positioning={positioning}\n />\n )}\n </React.Fragment>\n ) : null}\n </div>\n );\n },\n);\n\nfunction getHeight(width: number, ratio: number = 9 / 16): number {\n return width * ratio;\n}\n\nfunction getParentElement(element: HTMLElement): HTMLElement {\n const parentElement = element.parentElement;\n\n if (!parentElement) {\n return element;\n }\n\n return parentElement.offsetWidth ? parentElement : getParentElement(parentElement);\n}\n\nexport default ReactPlayerBlock;\n"]}

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

@@ -5,9 +5,8 @@ exports.checkYoutubeVideos = void 0;
 const LIVE_YUOTUBE_VIDEO_REGEX = /(?:youtu\.be\/live\/|youtube(?:-nocookie)?\.com\/(?:live\/))((\w|-){11})/;
 const YOUTUBE_VIDEO_TEMPLATE = 'https://www.youtube.com/watch?v=';
 const transformYoutubeUrl = (src) => {
-    var _a;
     if (LIVE_YUOTUBE_VIDEO_REGEX.test(src)) {
-        const youtubeLiveId = (_a = src.match(LIVE_YUOTUBE_VIDEO_REGEX)) === null || _a === void 0 ? void 0 : _a[1];
+        const youtubeLiveId = src.match(LIVE_YUOTUBE_VIDEO_REGEX)?.[1];
         if (!youtubeLiveId) {
             return src;
         }

package/build/cjs/components/ReactPlayer/utils.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"utils.js","sourceRoot":"../../../../src","sources":["components/ReactPlayer/utils.ts"],"names":[],"mappings":";;;AAAA,8DAA8D;AAC9D,MAAM,wBAAwB,GAC1B,0EAA0E,CAAC;AAC/E,MAAM,sBAAsB,GAAG,kCAAkC,CAAC;AAElE,MAAM,mBAAmB,GAAG,CAAC,GAAW,EAAE,EAAE;;IACxC,IAAI,wBAAwB,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC;QACrC,MAAM,aAAa,GAAG,~~MAAA,~~GAAG,CAAC,KAAK,CAAC,wBAAwB,CAAC,~~0CAAG~~,CAAC,CAAC,CAAC;QAC/D,IAAI,CAAC,aAAa,EAAE,CAAC;YACjB,OAAO,GAAG,CAAC;QACf,CAAC;QAED,OAAO,GAAG,sBAAsB,GAAG,aAAa,EAAE,CAAC;IACvD,CAAC;IAED,OAAO,GAAG,CAAC;AACf,CAAC,CAAC;AAEK,MAAM,kBAAkB,GAAG,CAAC,GAAsB,EAAE,EAAE;IACzD,IAAI,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,EAAE,CAAC;QACrB,OAAO,GAAG,CAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,EAAE,CAAC,mBAAmB,CAAC,QAAQ,CAAC,CAAC,CAAC;IAChE,CAAC;IAED,OAAO,mBAAmB,CAAC,GAAG,CAAC,CAAC;AACpC,CAAC,CAAC;AANW,QAAA,kBAAkB,sBAM7B","sourcesContent":["// the file serves to support live video with react-player@2.9\nconst LIVE_YUOTUBE_VIDEO_REGEX =\n /(?:youtu\\.be\\/live\\/\|youtube(?:-nocookie)?\\.com\\/(?:live\\/))((\\w\|-){11})/;\nconst YOUTUBE_VIDEO_TEMPLATE = 'https://www.youtube.com/watch?v=';\n\nconst transformYoutubeUrl = (src: string) => {\n if (LIVE_YUOTUBE_VIDEO_REGEX.test(src)) {\n const youtubeLiveId = src.match(LIVE_YUOTUBE_VIDEO_REGEX)?.[1];\n if (!youtubeLiveId) {\n return src;\n }\n\n return `${YOUTUBE_VIDEO_TEMPLATE}${youtubeLiveId}`;\n }\n\n return src;\n};\n\nexport const checkYoutubeVideos = (src: string \| string[]) => {\n if (Array.isArray(src)) {\n return src.map((videoUrl) => transformYoutubeUrl(videoUrl));\n }\n\n return transformYoutubeUrl(src);\n};\n"]}
1	+ {"version":3,"file":"utils.js","sourceRoot":"../../../../src","sources":["components/ReactPlayer/utils.ts"],"names":[],"mappings":";;;AAAA,8DAA8D;AAC9D,MAAM,wBAAwB,GAC1B,0EAA0E,CAAC;AAC/E,MAAM,sBAAsB,GAAG,kCAAkC,CAAC;AAElE,MAAM,mBAAmB,GAAG,CAAC,GAAW,EAAE,EAAE;IACxC,IAAI,wBAAwB,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC;QACrC,MAAM,aAAa,GAAG,GAAG,CAAC,KAAK,CAAC,wBAAwB,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC;QAC/D,IAAI,CAAC,aAAa,EAAE,CAAC;YACjB,OAAO,GAAG,CAAC;QACf,CAAC;QAED,OAAO,GAAG,sBAAsB,GAAG,aAAa,EAAE,CAAC;IACvD,CAAC;IAED,OAAO,GAAG,CAAC;AACf,CAAC,CAAC;AAEK,MAAM,kBAAkB,GAAG,CAAC,GAAsB,EAAE,EAAE;IACzD,IAAI,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,EAAE,CAAC;QACrB,OAAO,GAAG,CAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,EAAE,CAAC,mBAAmB,CAAC,QAAQ,CAAC,CAAC,CAAC;IAChE,CAAC;IAED,OAAO,mBAAmB,CAAC,GAAG,CAAC,CAAC;AACpC,CAAC,CAAC;AANW,QAAA,kBAAkB,sBAM7B","sourcesContent":["// the file serves to support live video with react-player@2.9\nconst LIVE_YUOTUBE_VIDEO_REGEX =\n /(?:youtu\\.be\\/live\\/\|youtube(?:-nocookie)?\\.com\\/(?:live\\/))((\\w\|-){11})/;\nconst YOUTUBE_VIDEO_TEMPLATE = 'https://www.youtube.com/watch?v=';\n\nconst transformYoutubeUrl = (src: string) => {\n if (LIVE_YUOTUBE_VIDEO_REGEX.test(src)) {\n const youtubeLiveId = src.match(LIVE_YUOTUBE_VIDEO_REGEX)?.[1];\n if (!youtubeLiveId) {\n return src;\n }\n\n return `${YOUTUBE_VIDEO_TEMPLATE}${youtubeLiveId}`;\n }\n\n return src;\n};\n\nexport const checkYoutubeVideos = (src: string \| string[]) => {\n if (Array.isArray(src)) {\n return src.map((videoUrl) => transformYoutubeUrl(videoUrl));\n }\n\n return transformYoutubeUrl(src);\n};\n"]}

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

@@ -11,8 +11,8 @@ const Title = ({ title, subtitle, className, colSizes = { all: 12, sm: 8 }, id,
     if (!title && !subtitle) {
         return null;
     }
-    const _a = !title || typeof title === 'string' ? { text: title } : title, { text } = _a, titleProps = tslib_1.__rest(_a, ["text"]);
-    return ((0, jsx_runtime_1.jsxs)("div", { className: b(null, className), id: id, children: [text && ((0, jsx_runtime_1.jsx)(grid_1.Col, { reset: true, sizes: colSizes, children: (0, jsx_runtime_1.jsx)(TitleItem_1.default, Object.assign({ text: text }, titleProps)) })), subtitle && ((0, jsx_runtime_1.jsx)(grid_1.Col, { reset: true, sizes: colSizes, children: (0, jsx_runtime_1.jsx)("div", { className: b('description', { titleSize: titleProps === null || titleProps === void 0 ? void 0 : titleProps.textSize }), children: (0, jsx_runtime_1.jsx)(YFMWrapper_1.default, { content: subtitle, modifiers: { constructor: true } }) }) }))] }));
+    const { text, ...titleProps } = !title || typeof title === 'string' ? { text: title } : title;
+    return ((0, jsx_runtime_1.jsxs)("div", { className: b(null, className), id: id, children: [text && ((0, jsx_runtime_1.jsx)(grid_1.Col, { reset: true, sizes: colSizes, children: (0, jsx_runtime_1.jsx)(TitleItem_1.default, { text: text, ...titleProps }) })), subtitle && ((0, jsx_runtime_1.jsx)(grid_1.Col, { reset: true, sizes: colSizes, children: (0, jsx_runtime_1.jsx)("div", { className: b('description', { titleSize: titleProps?.textSize }), children: (0, jsx_runtime_1.jsx)(YFMWrapper_1.default, { content: subtitle, modifiers: { constructor: true } }) }) }))] }));
 };
 exports.default = Title;
 //# sourceMappingURL=Title.js.map

package/build/cjs/components/Title/Title.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Title.js","sourceRoot":"../../../../src","sources":["components/Title/Title.tsx"],"names":[],"mappings":";;;;AAAA,8CAAoD;AAEpD,gDAAkC;AAClC,qFAAkD;AAElD,uEAAoC;AAIpC,MAAM,CAAC,GAAG,IAAA,aAAK,EAAC,OAAO,CAAC,CAAC;AAOzB,MAAM,KAAK,GAAG,CAAC,EACX,KAAK,EACL,QAAQ,EACR,SAAS,EACT,QAAQ,GAAG,EAAC,GAAG,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,EAAC,EAC3B,EAAE,GACwB,EAAE,EAAE;IAC9B,IAAI,CAAC,KAAK,IAAI,CAAC,QAAQ,EAAE,CAAC;QACtB,OAAO,IAAI,CAAC;IAChB,CAAC;IAED,MAAM,~~KACF~~,CAAC,KAAK,IAAI,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAE,EAAC,IAAI,EAAE,KAAK,EAAoB,CAAC,CAAC,CAAC,KAAK,~~EAD7E,EAAC,IAAI,OACwE,EADnE,UAAU,sBAApB,QAAqB,CACwD,~~CAAC;IAEpF,OAAO,CACH,iCAAK,SAAS,EAAE,CAAC,CAAC,IAAI,EAAE,SAAS,CAAC,EAAE,EAAE,EAAE,EAAE,aACrC,IAAI,IAAI,CACL,uBAAC,UAAG,IAAC,KAAK,QAAC,KAAK,EAAE,QAAQ,YACtB,uBAAC,mBAAS,~~kBAAC~~,IAAI,EAAE,IAAI,~~IAAM~~,UAAU,~~EAAI~~,GACvC,CACT,EACA,QAAQ,IAAI,CACT,uBAAC,UAAG,IAAC,KAAK,QAAC,KAAK,EAAE,QAAQ,YACtB,gCAAK,SAAS,EAAE,CAAC,CAAC,aAAa,EAAE,EAAC,SAAS,EAAE,UAAU,~~aAAV~~,~~UAAU,uBAAV,UAAU,CAAE,~~QAAQ,EAAC,CAAC,YAC/D,uBAAC,oBAAU,IAAC,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAC,WAAW,EAAE,IAAI,EAAC,GAAI,GAC/D,GACJ,CACT,IACC,CACT,CAAC;AACN,CAAC,CAAC;AAEF,kBAAe,KAAK,CAAC","sourcesContent":["import {Col, GridColumnSizesType} from '../../grid';\nimport {ClassNameProps, TitleItemProps, TitleProps as TitleParams} from '../../models';\nimport {block} from '../../utils';\nimport YFMWrapper from '../YFMWrapper/YFMWrapper';\n\nimport TitleItem from './TitleItem';\n\nimport './Title.scss';\n\nconst b = block('title');\n\nexport interface TitleProps extends TitleParams {\n colSizes?: GridColumnSizesType;\n id?: string;\n}\n\nconst Title = ({\n title,\n subtitle,\n className,\n colSizes = {all: 12, sm: 8},\n id,\n}: TitleProps & ClassNameProps) => {\n if (!title && !subtitle) {\n return null;\n }\n\n const {text, ...titleProps} =\n !title \|\| typeof title === 'string' ? ({text: title} as TitleItemProps) : title;\n\n return (\n <div className={b(null, className)} id={id}>\n {text && (\n <Col reset sizes={colSizes}>\n <TitleItem text={text} {...titleProps} />\n </Col>\n )}\n {subtitle && (\n <Col reset sizes={colSizes}>\n <div className={b('description', {titleSize: titleProps?.textSize})}>\n <YFMWrapper content={subtitle} modifiers={{constructor: true}} />\n </div>\n </Col>\n )}\n </div>\n );\n};\n\nexport default Title;\n"]}
1	+ {"version":3,"file":"Title.js","sourceRoot":"../../../../src","sources":["components/Title/Title.tsx"],"names":[],"mappings":";;;;AAAA,8CAAoD;AAEpD,gDAAkC;AAClC,qFAAkD;AAElD,uEAAoC;AAIpC,MAAM,CAAC,GAAG,IAAA,aAAK,EAAC,OAAO,CAAC,CAAC;AAOzB,MAAM,KAAK,GAAG,CAAC,EACX,KAAK,EACL,QAAQ,EACR,SAAS,EACT,QAAQ,GAAG,EAAC,GAAG,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,EAAC,EAC3B,EAAE,GACwB,EAAE,EAAE;IAC9B,IAAI,CAAC,KAAK,IAAI,CAAC,QAAQ,EAAE,CAAC;QACtB,OAAO,IAAI,CAAC;IAChB,CAAC;IAED,MAAM,EAAC,IAAI,EAAE,GAAG,UAAU,EAAC,GACvB,CAAC,KAAK,IAAI,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAE,EAAC,IAAI,EAAE,KAAK,EAAoB,CAAC,CAAC,CAAC,KAAK,CAAC;IAEpF,OAAO,CACH,iCAAK,SAAS,EAAE,CAAC,CAAC,IAAI,EAAE,SAAS,CAAC,EAAE,EAAE,EAAE,EAAE,aACrC,IAAI,IAAI,CACL,uBAAC,UAAG,IAAC,KAAK,QAAC,KAAK,EAAE,QAAQ,YACtB,uBAAC,mBAAS,IAAC,IAAI,EAAE,IAAI,KAAM,UAAU,GAAI,GACvC,CACT,EACA,QAAQ,IAAI,CACT,uBAAC,UAAG,IAAC,KAAK,QAAC,KAAK,EAAE,QAAQ,YACtB,gCAAK,SAAS,EAAE,CAAC,CAAC,aAAa,EAAE,EAAC,SAAS,EAAE,UAAU,EAAE,QAAQ,EAAC,CAAC,YAC/D,uBAAC,oBAAU,IAAC,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAC,WAAW,EAAE,IAAI,EAAC,GAAI,GAC/D,GACJ,CACT,IACC,CACT,CAAC;AACN,CAAC,CAAC;AAEF,kBAAe,KAAK,CAAC","sourcesContent":["import {Col, GridColumnSizesType} from '../../grid';\nimport {ClassNameProps, TitleItemProps, TitleProps as TitleParams} from '../../models';\nimport {block} from '../../utils';\nimport YFMWrapper from '../YFMWrapper/YFMWrapper';\n\nimport TitleItem from './TitleItem';\n\nimport './Title.scss';\n\nconst b = block('title');\n\nexport interface TitleProps extends TitleParams {\n colSizes?: GridColumnSizesType;\n id?: string;\n}\n\nconst Title = ({\n title,\n subtitle,\n className,\n colSizes = {all: 12, sm: 8},\n id,\n}: TitleProps & ClassNameProps) => {\n if (!title && !subtitle) {\n return null;\n }\n\n const {text, ...titleProps} =\n !title \|\| typeof title === 'string' ? ({text: title} as TitleItemProps) : title;\n\n return (\n <div className={b(null, className)} id={id}>\n {text && (\n <Col reset sizes={colSizes}>\n <TitleItem text={text} {...titleProps} />\n </Col>\n )}\n {subtitle && (\n <Col reset sizes={colSizes}>\n <div className={b('description', {titleSize: titleProps?.textSize})}>\n <YFMWrapper content={subtitle} modifiers={{constructor: true}} />\n </div>\n </Col>\n )}\n </div>\n );\n};\n\nexport default Title;\n"]}

package/build/cjs/components/Title/TitleItem.css CHANGED Viewed

@@ -123,6 +123,7 @@ unpredictable css rules order in build */
 }
 .pc-title-item__wrapper {
+  display: inline-flex;
   white-space: nowrap;
 }
 .pc-title-item_reset-margin {

package/build/cjs/components/Title/TitleItem.js CHANGED Viewed

@@ -38,7 +38,7 @@ const TitleItem = (props) => {
         content = textMarkup;
     }
     else if (url) {
-        content = ((0, jsx_runtime_1.jsx)("a", Object.assign({ className: b('link'), href: url }, (0, utils_1.getLinkProps)(url, hostname), { onClick: onClick, title: urlTitle, children: insideClickableContent })));
+        content = ((0, jsx_runtime_1.jsx)("a", { className: b('link'), href: url, ...(0, utils_1.getLinkProps)(url, hostname), onClick: onClick, title: urlTitle, children: insideClickableContent }));
     }
     else if (onClick) {
         content = ((0, jsx_runtime_1.jsx)("button", { className: b('link'), onClick: onClick, title: urlTitle, children: insideClickableContent }));

package/build/cjs/components/Title/TitleItem.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TitleItem.js","sourceRoot":"../../../../src","sources":["components/Title/TitleItem.tsx"],"names":[],"mappings":";;AAaA,oCAcC;;;AA3BD,qDAA+B;AAE/B,mCAA4C;AAC5C,4EAA8D;AAC9D,wEAA0D;AAE1D,gDAA8D;AAC9D,yEAAsC;AAItC,MAAM,CAAC,GAAG,IAAA,aAAK,EAAC,YAAY,CAAC,CAAC;AAE9B,SAAgB,YAAY,CAAC,IAAc,EAAE,QAAiB;IAC1D,QAAQ,IAAI,EAAE,CAAC;QACX,KAAK,IAAI;YACL,OAAO,EAAE,CAAC;QACd,KAAK,GAAG;YACJ,OAAO,EAAE,CAAC;QACd,KAAK,IAAI,CAAC;QACV,KAAK,GAAG;YACJ,OAAO,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;QAC9B,KAAK,GAAG;YACJ,OAAO,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;QAC9B;YACI,OAAO,EAAE,CAAC;IAClB,CAAC;AACL,CAAC;AAQD,MAAM,SAAS,GAAG,CAAC,KAAyB,EAAE,EAAE;IAC5C,MAAM,QAAQ,GAAG,KAAK,CAAC,UAAU,CAAC,6BAAa,CAAC,CAAC;IAEjD,MAAM,EACF,QAAQ,GAAG,GAAG,EACd,IAAI,EACJ,MAAM,EACN,OAAO,EACP,GAAG,EACH,OAAO,EACP,MAAM,EACN,SAAS,EACT,EAAE,EACF,WAAW,GAAG,IAAI,EAClB,QAAQ,GACX,GAAG,KAAK,CAAC;IAEV,MAAM,EAAC,QAAQ,EAAC,GAAG,KAAK,CAAC,UAAU,CAAC,iCAAe,CAAC,CAAC;IACrD,MAAM,UAAU,GAAG,CACf,wBAAC,KAAK,CAAC,QAAQ,eACX,uBAAC,cAAU,IACP,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,EACpB,gBAAgB,EAAE,CAAC,CAAC,MAAM,CAAC,EAC3B,OAAO,EAAE,IAAI,EACb,SAAS,EAAE;oBACP,WAAW,EAAE,IAAI;iBACpB,GACH,EACD,MAAM,IAAI,CACP,wBAAC,KAAK,CAAC,QAAQ,yBAEX,iCAAM,SAAS,EAAE,CAAC,CAAC,QAAQ,CAAC,YAAG,MAAM,GAAQ,IAChC,CACpB,IACY,CACpB,CAAC;IACF,IAAI,OAAwB,CAAC;IAE7B,MAAM,sBAAsB,GAAG,CAC3B,kCAAM,SAAS,EAAE,CAAC,CAAC,SAAS,CAAC,aACxB,UAAU,YAEX,uBAAC,eAAW,IACR,SAAS,EAAE,CAAC,CAAC,OAAO,EAAE,EAAC,IAAI,EAAE,QAAQ,EAAC,CAAC,EACvC,IAAI,EAAE,YAAY,CAAC,QAAQ,EAAE,QAAQ,CAAC,EACtC,IAAI,EAAE,YAAY,EAClB,QAAQ,EAAC,YAAY,EACrB,IAAI,EAAE,KAAK,GACb,IACC,CACV,CAAC;IAEF,IAAI,CAAC,GAAG,IAAI,CAAC,OAAO,EAAE,CAAC;QACnB,OAAO,GAAG,UAAU,CAAC;IACzB,CAAC;SAAM,IAAI,GAAG,EAAE,CAAC;QACb,OAAO,GAAG,CACN,~~4CACI~~,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,EACpB,IAAI,EAAE,GAAG,~~IACL~~,IAAA,oBAAY,EAAC,GAAG,EAAE,QAAQ,CAAC,~~IAC~~/B,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,QAAQ,YAEd,sBAAsB,~~IACvB~~,CACP,CAAC;IACN,CAAC;SAAM,IAAI,OAAO,EAAE,CAAC;QACjB,OAAO,GAAG,CACN,mCAAQ,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,YAC1D,sBAAsB,GAClB,CACZ,CAAC;IACN,CAAC;IAED,OAAO,CACH,wBAAC,KAAK,CAAC,QAAQ,eACV,MAAM,IAAI,uBAAC,gBAAM,IAAC,EAAE,EAAE,MAAM,EAAE,SAAS,EAAE,CAAC,CAAC,QAAQ,CAAC,GAAI,EACxD,KAAK,CAAC,aAAa,CAChB,IAAA,oBAAY,EAAC,QAAQ,CAAC,EACtB;gBACI,SAAS,EAAE,CAAC,CAAC,EAAC,IAAI,EAAE,QAAQ,EAAE,OAAO,EAAE,cAAc,EAAE,WAAW,EAAC,EAAE,SAAS,CAAC;gBAC/E,SAAS,EAAE,GAAG,EAAE,SAAS;aAC5B,EACD,OAAO,CACV,IACY,CACpB,CAAC;AACN,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {ToggleArrow, YFMWrapper} from '../';\nimport {LocationContext} from '../../context/locationContext';\nimport {MobileContext} from '../../context/mobileContext';\nimport {QAProps, TextSize, TitleItemProps} from '../../models';\nimport {block, getHeaderTag, getLinkProps} from '../../utils';\nimport Anchor from '../Anchor/Anchor';\n\nimport './TitleItem.scss';\n\nconst b = block('title-item');\n\nexport function getArrowSize(size: TextSize, isMobile: boolean) {\n switch (size) {\n case 'xs':\n return 13;\n case 's':\n return 16;\n case 'sm':\n case 'm':\n return isMobile ? 22 : 24;\n case 'l':\n return isMobile ? 26 : 38;\n default:\n return 20;\n }\n}\n\nexport interface TitleItemFullProps extends TitleItemProps, QAProps {\n className?: string;\n onClick?: () => void;\n resetMargin?: boolean;\n}\n\nconst TitleItem = (props: TitleItemFullProps) => {\n const isMobile = React.useContext(MobileContext);\n\n const {\n textSize = 'm',\n text,\n anchor,\n justify,\n url,\n onClick,\n custom,\n className,\n qa,\n resetMargin = true,\n urlTitle,\n } = props;\n\n const {hostname} = React.useContext(LocationContext);\n const textMarkup = (\n <React.Fragment>\n <YFMWrapper\n className={b('text')}\n contentClassName={b('text')}\n content={text}\n modifiers={{\n constructor: true,\n }}\n />\n {custom && (\n <React.Fragment>\n  \n <span className={b('custom')}>{custom}</span>\n </React.Fragment>\n )}\n </React.Fragment>\n );\n let content: React.ReactNode;\n\n const insideClickableContent = (\n <span className={b('wrapper')}>\n {textMarkup}\n  \n <ToggleArrow\n className={b('arrow', {size: textSize})}\n size={getArrowSize(textSize, isMobile)}\n type={'horizontal'}\n iconType=\"navigation\"\n open={false}\n />\n </span>\n );\n\n if (!url && !onClick) {\n content = textMarkup;\n } else if (url) {\n content = (\n <a\n className={b('link')}\n href={url}\n {...getLinkProps(url, hostname)}\n onClick={onClick}\n title={urlTitle}\n >\n {insideClickableContent}\n </a>\n );\n } else if (onClick) {\n content = (\n <button className={b('link')} onClick={onClick} title={urlTitle}>\n {insideClickableContent}\n </button>\n );\n }\n\n return (\n <React.Fragment>\n {anchor && <Anchor id={anchor} className={b('anchor')} />}\n {React.createElement(\n getHeaderTag(textSize),\n {\n className: b({size: textSize, justify, 'reset-margin': resetMargin}, className),\n 'data-qa': `${qa}-header`,\n },\n content,\n )}\n </React.Fragment>\n );\n};\n\nexport default TitleItem;\n"]}
1	+ {"version":3,"file":"TitleItem.js","sourceRoot":"../../../../src","sources":["components/Title/TitleItem.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport {ToggleArrow, YFMWrapper} from '../';\nimport {LocationContext} from '../../context/locationContext';\nimport {MobileContext} from '../../context/mobileContext';\nimport {QAProps, TextSize, TitleItemProps} from '../../models';\nimport {block, getHeaderTag, getLinkProps} from '../../utils';\nimport Anchor from '../Anchor/Anchor';\n\nimport './TitleItem.scss';\n\nconst b = block('title-item');\n\nexport function getArrowSize(size: TextSize, isMobile: boolean) {\n switch (size) {\n case 'xs':\n return 13;\n case 's':\n return 16;\n case 'sm':\n case 'm':\n return isMobile ? 22 : 24;\n case 'l':\n return isMobile ? 26 : 38;\n default:\n return 20;\n }\n}\n\nexport interface TitleItemFullProps extends TitleItemProps, QAProps {\n className?: string;\n onClick?: () => void;\n resetMargin?: boolean;\n}\n\nconst TitleItem = (props: TitleItemFullProps) => {\n const isMobile = React.useContext(MobileContext);\n\n const {\n textSize = 'm',\n text,\n anchor,\n justify,\n url,\n onClick,\n custom,\n className,\n qa,\n resetMargin = true,\n urlTitle,\n } = props;\n\n const {hostname} = React.useContext(LocationContext);\n const textMarkup = (\n <React.Fragment>\n <YFMWrapper\n className={b('text')}\n contentClassName={b('text')}\n content={text}\n modifiers={{\n constructor: true,\n }}\n />\n {custom && (\n <React.Fragment>\n  \n <span className={b('custom')}>{custom}</span>\n </React.Fragment>\n )}\n </React.Fragment>\n );\n let content: React.ReactNode;\n\n const insideClickableContent = (\n <span className={b('wrapper')}>\n {textMarkup}\n  \n <ToggleArrow\n className={b('arrow', {size: textSize})}\n size={getArrowSize(textSize, isMobile)}\n type={'horizontal'}\n iconType=\"navigation\"\n open={false}\n />\n </span>\n );\n\n if (!url && !onClick) {\n content = textMarkup;\n } else if (url) {\n content = (\n <a\n className={b('link')}\n href={url}\n {...getLinkProps(url, hostname)}\n onClick={onClick}\n title={urlTitle}\n >\n {insideClickableContent}\n </a>\n );\n } else if (onClick) {\n content = (\n <button className={b('link')} onClick={onClick} title={urlTitle}>\n {insideClickableContent}\n </button>\n );\n }\n\n return (\n <React.Fragment>\n {anchor && <Anchor id={anchor} className={b('anchor')} />}\n {React.createElement(\n getHeaderTag(textSize),\n {\n className: b({size: textSize, justify, 'reset-margin': resetMargin}, className),\n 'data-qa': `${qa}-header`,\n },\n content,\n )}\n </React.Fragment>\n );\n};\n\nexport default TitleItem;\n"]}