npm - @gravity-ui/page-constructor - Versions diffs - 8.14.1 → 8.15.0 - Mend

@gravity-ui/page-constructor 8.14.1 → 8.15.0

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 (40) hide show

package/build/cjs/components/VideoButton/VideoButton.d.ts ADDED Viewed

@@ -0,0 +1,9 @@
+import * as React from 'react';
+import { PlayButtonProps } from "../../models/index.js";
+export interface VideoButtonProps extends PlayButtonProps {
+    customButton?: React.ReactNode;
+    ref?: React.LegacyRef<HTMLButtonElement>;
+    id?: string;
+}
+declare const VideoButton: ({ customButton, text, type, theme: initialTheme, className, ref, id, }: VideoButtonProps) => string | number | true | Iterable<React.ReactNode> | import("react/jsx-runtime").JSX.Element;
+export default VideoButton;

package/build/cjs/components/VideoButton/VideoButton.js ADDED Viewed

@@ -0,0 +1,50 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const jsx_runtime_1 = require("react/jsx-runtime");
+const React = tslib_1.__importStar(require("react"));
+const icons_1 = require("@gravity-ui/icons");
+const uikit_1 = require("@gravity-ui/uikit");
+const projectSettingsContext_1 = require("../../context/projectSettingsContext/index.js");
+const theme_1 = require("../../context/theme/index.js");
+const models_1 = require("../../models/index.js");
+const utils_1 = require("../../utils/index.js");
+const i18n_1 = require("../ReactPlayer/i18n/index.js");
+const b = (0, utils_1.block)('video-button');
+const VideoButton = ({ customButton, text, type, theme: initialTheme, className, ref, id, }) => {
+    const { defaultVideoButtonSettings } = React.useContext(projectSettingsContext_1.ProjectSettingsContext);
+    const currentTheme = (0, theme_1.useTheme)();
+    const playButtonContent = React.useMemo(() => {
+        switch (type) {
+            case models_1.PlayButtonType.Text:
+                return text;
+            case models_1.PlayButtonType.Default:
+            default:
+                return (0, jsx_runtime_1.jsx)(uikit_1.Icon, { className: b('icon'), data: icons_1.PlayFill, size: 24 });
+        }
+    }, [text, type]);
+    const theme = initialTheme || defaultVideoButtonSettings?.theme || models_1.PlayButtonThemes.Blue;
+    const style = React.useMemo(() => {
+        if (theme !== models_1.PlayButtonThemes.Custom) {
+            return undefined;
+        }
+        const themedColors = defaultVideoButtonSettings?.colors
+            ? (0, utils_1.getThemedValue)(defaultVideoButtonSettings.colors, currentTheme)
+            : undefined;
+        const resolveColor = (colorName) => {
+            return themedColors?.[colorName];
+        };
+        return {
+            '--pc-video-button-circle-color': resolveColor('circleColor'),
+            '--pc-video-button-circle-hover-color': resolveColor('circleHoverColor'),
+            '--pc-video-button-triangle-color': resolveColor('triangleColor'),
+            '--pc-video-button-triangle-hover-color': resolveColor('triangleHoverColor'),
+        };
+    }, [currentTheme, defaultVideoButtonSettings?.colors, theme]);
+    if (customButton) {
+        return customButton;
+    }
+    return ((0, jsx_runtime_1.jsx)("button", { className: b({ theme, text: Boolean(text) }, className), "aria-label": (0, i18n_1.i18n)('play'), ref: ref, id: id, style: style, children: playButtonContent }));
+};
+exports.default = VideoButton;
+//# sourceMappingURL=VideoButton.js.map

package/build/cjs/components/VideoButton/VideoButton.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"VideoButton.js","sourceRoot":"../../../../src","sources":["components/VideoButton/VideoButton.tsx"],"names":[],"mappings":";;;;AAAA,qDAA+B;AAE/B,6CAA2C;AAC3C,6CAAuC;AAEvC,0FAA4E;AAC5E,wDAA6C;AAC7C,kDAAiG;AACjG,gDAAkD;AAClD,uDAAyC;AAUzC,MAAM,CAAC,GAAG,IAAA,aAAK,EAAC,cAAc,CAAC,CAAC;AAEhC,MAAM,WAAW,GAAG,CAAC,EACjB,YAAY,EACZ,IAAI,EACJ,IAAI,EACJ,KAAK,EAAE,YAAY,EACnB,SAAS,EACT,GAAG,EACH,EAAE,GACa,EAAE,EAAE;IACnB,MAAM,EAAC,0BAA0B,EAAC,GAAG,KAAK,CAAC,UAAU,CAAC,+CAAsB,CAAC,CAAC;IAC9E,MAAM,YAAY,GAAG,IAAA,gBAAQ,GAAE,CAAC;IAEhC,MAAM,iBAAiB,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QACzC,QAAQ,IAAI,EAAE,CAAC;YACX,KAAK,uBAAc,CAAC,IAAI;gBACpB,OAAO,IAAI,CAAC;YAChB,KAAK,uBAAc,CAAC,OAAO,CAAC;YAC5B;gBACI,OAAO,uBAAC,YAAI,IAAC,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,EAAE,IAAI,EAAE,gBAAQ,EAAE,IAAI,EAAE,EAAE,GAAI,CAAC;QACxE,CAAC;IACL,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC,CAAC;IAEjB,MAAM,KAAK,GAAG,YAAY,IAAI,0BAA0B,EAAE,KAAK,IAAI,yBAAgB,CAAC,IAAI,CAAC;IAEzF,MAAM,KAAK,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QAC7B,IAAI,KAAK,KAAK,yBAAgB,CAAC,MAAM,EAAE,CAAC;YACpC,OAAO,SAAS,CAAC;QACrB,CAAC;QAED,MAAM,YAAY,GAAG,0BAA0B,EAAE,MAAM;YACnD,CAAC,CAAC,IAAA,sBAAc,EAAC,0BAA0B,CAAC,MAAM,EAAE,YAAY,CAAC;YACjE,CAAC,CAAC,SAAS,CAAC;QAEhB,MAAM,YAAY,GAAG,CAAC,SAAiC,EAAE,EAAE;YACvD,OAAO,YAAY,EAAE,CAAC,SAAS,CAAC,CAAC;QACrC,CAAC,CAAC;QAEF,OAAO;YACH,gCAAgC,EAAE,YAAY,CAAC,aAAa,CAAC;YAC7D,sCAAsC,EAAE,YAAY,CAAC,kBAAkB,CAAC;YACxE,kCAAkC,EAAE,YAAY,CAAC,eAAe,CAAC;YACjE,wCAAwC,EAAE,YAAY,CAAC,oBAAoB,CAAC;SACxD,CAAC;IAC7B,CAAC,EAAE,CAAC,YAAY,EAAE,0BAA0B,EAAE,MAAM,EAAE,KAAK,CAAC,CAAC,CAAC;IAE9D,IAAI,YAAY,EAAE,CAAC;QACf,OAAO,YAAY,CAAC;IACxB,CAAC;IAED,OAAO,CACH,mCACI,SAAS,EAAE,CAAC,CAAC,EAAC,KAAK,EAAE,IAAI,EAAE,OAAO,CAAC,IAAI,CAAC,EAAC,EAAE,SAAS,CAAC,gBACzC,IAAA,WAAI,EAAC,MAAM,CAAC,EACxB,GAAG,EAAE,GAAG,EACR,EAAE,EAAE,EAAE,EACN,KAAK,EAAE,KAAK,YAEX,iBAAiB,GACb,CACZ,CAAC;AACN,CAAC,CAAC;AAEF,kBAAe,WAAW,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {PlayFill} from '@gravity-ui/icons';\nimport {Icon} from '@gravity-ui/uikit';\n\nimport {ProjectSettingsContext} from '../../context/projectSettingsContext';\nimport {useTheme} from '../../context/theme';\nimport {PlayButtonColors, PlayButtonProps, PlayButtonThemes, PlayButtonType} from '../../models';\nimport {block, getThemedValue} from '../../utils';\nimport {i18n} from '../ReactPlayer/i18n';\n\nimport './VideoButton.scss';\n\nexport interface VideoButtonProps extends PlayButtonProps {\n customButton?: React.ReactNode;\n ref?: React.LegacyRef<HTMLButtonElement>;\n id?: string;\n}\n\nconst b = block('video-button');\n\nconst VideoButton = ({\n customButton,\n text,\n type,\n theme: initialTheme,\n className,\n ref,\n id,\n}: VideoButtonProps) => {\n const {defaultVideoButtonSettings} = React.useContext(ProjectSettingsContext);\n const currentTheme = useTheme();\n\n const playButtonContent = React.useMemo(() => {\n switch (type) {\n case PlayButtonType.Text:\n return text;\n case PlayButtonType.Default:\n default:\n return <Icon className={b('icon')} data={PlayFill} size={24} />;\n }\n }, [text, type]);\n\n const theme = initialTheme || defaultVideoButtonSettings?.theme || PlayButtonThemes.Blue;\n\n const style = React.useMemo(() => {\n if (theme !== PlayButtonThemes.Custom) {\n return undefined;\n }\n\n const themedColors = defaultVideoButtonSettings?.colors\n ? getThemedValue(defaultVideoButtonSettings.colors, currentTheme)\n : undefined;\n\n const resolveColor = (colorName: keyof PlayButtonColors) => {\n return themedColors?.[colorName];\n };\n\n return {\n '--pc-video-button-circle-color': resolveColor('circleColor'),\n '--pc-video-button-circle-hover-color': resolveColor('circleHoverColor'),\n '--pc-video-button-triangle-color': resolveColor('triangleColor'),\n '--pc-video-button-triangle-hover-color': resolveColor('triangleHoverColor'),\n } as React.CSSProperties;\n }, [currentTheme, defaultVideoButtonSettings?.colors, theme]);\n\n if (customButton) {\n return customButton;\n }\n\n return (\n <button\n className={b({theme, text: Boolean(text)}, className)}\n aria-label={i18n('play')}\n ref={ref}\n id={id}\n style={style}\n >\n {playButtonContent}\n </button>\n );\n};\n\nexport default VideoButton;\n"]}

package/build/cjs/context/projectSettingsContext/ProjectSettingsContext.d.ts CHANGED Viewed

@@ -1,8 +1,15 @@
 import * as React from 'react';
+import { PlayButtonColors, PlayButtonProps } from "../../models/index.js";
+import { ThemeSupporting } from "../../utils/index.js";
+type DefaultVideoButtonSettings = Pick<PlayButtonProps, 'theme'> & {
+    colors?: ThemeSupporting<PlayButtonColors>;
+};
 export interface ProjectSettingsContextProps {
     disableCompress?: boolean;
     isAnimationEnabled?: boolean;
     renderInvisibleBlocks?: boolean;
     defaultYandexFormTheme?: string;
+    defaultVideoButtonSettings?: DefaultVideoButtonSettings;
 }
 export declare const ProjectSettingsContext: React.Context<ProjectSettingsContextProps>;
+export {};

package/build/cjs/context/projectSettingsContext/ProjectSettingsContext.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ProjectSettingsContext.js","sourceRoot":"../../../../src","sources":["context/projectSettingsContext/ProjectSettingsContext.ts"],"names":[],"mappings":";;;;AAAA,qDAA+B;~~AAQlB~~,QAAA,sBAAsB,GAAG,KAAK,CAAC,aAAa,CAA8B,EAAE,CAAC,CAAC","sourcesContent":["import * as React from 'react';\nexport interface ProjectSettingsContextProps {\n disableCompress?: boolean;\n isAnimationEnabled?: boolean;\n renderInvisibleBlocks?: boolean;\n defaultYandexFormTheme?: string;\n}\n\nexport const ProjectSettingsContext = React.createContext<ProjectSettingsContextProps>({});\n"]}
1	+ {"version":3,"file":"ProjectSettingsContext.js","sourceRoot":"../../../../src","sources":["context/projectSettingsContext/ProjectSettingsContext.ts"],"names":[],"mappings":";;;;AAAA,qDAA+B;AAiBlB,QAAA,sBAAsB,GAAG,KAAK,CAAC,aAAa,CAA8B,EAAE,CAAC,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {PlayButtonColors, PlayButtonProps} from '../../models';\nimport {ThemeSupporting} from '../../utils';\n\ntype DefaultVideoButtonSettings = Pick<PlayButtonProps, 'theme'> & {\n colors?: ThemeSupporting<PlayButtonColors>;\n};\n\nexport interface ProjectSettingsContextProps {\n disableCompress?: boolean;\n isAnimationEnabled?: boolean;\n renderInvisibleBlocks?: boolean;\n defaultYandexFormTheme?: string;\n defaultVideoButtonSettings?: DefaultVideoButtonSettings;\n}\n\nexport const ProjectSettingsContext = React.createContext<ProjectSettingsContextProps>({});\n"]}

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

@@ -24,7 +24,8 @@ export declare enum PlayButtonType {
 }
 export declare enum PlayButtonThemes {
     Blue = "blue",
-    Grey = "grey"
+    Grey = "grey",
+    Custom = "custom"
 }
 export declare enum CustomControlsType {
     WithMuteButton = "with-mute-button",
@@ -195,6 +196,12 @@ export interface CustomControlsOptions {
     muteButtonShown?: boolean;
     positioning?: CustomControlsButtonPositioning;
 }
+export interface PlayButtonColors {
+    circleColor?: string;
+    circleHoverColor?: string;
+    triangleColor?: string;
+    triangleHoverColor?: string;
+}
 export interface PlayButtonProps extends ClassNameProps {
     type?: PlayButtonType;
     theme?: PlayButtonThemes;

package/build/cjs/models/constructor-items/common.js CHANGED Viewed

@@ -29,6 +29,7 @@ var PlayButtonThemes;
 (function (PlayButtonThemes) {
     PlayButtonThemes["Blue"] = "blue";
     PlayButtonThemes["Grey"] = "grey";
+    PlayButtonThemes["Custom"] = "custom";
 })(PlayButtonThemes || (exports.PlayButtonThemes = PlayButtonThemes = {}));
 var CustomControlsType;
 (function (CustomControlsType) {

package/build/cjs/models/constructor-items/common.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"common.js","sourceRoot":"../../../../src","sources":["models/constructor-items/common.ts"],"names":[],"mappings":";;;AAQA,QAAQ;AACR,IAAY,UAGX;AAHD,WAAY,UAAU;IAClB,+BAAiB,CAAA;IACjB,2BAAa,CAAA;AACjB,CAAC,EAHW,UAAU,0BAAV,UAAU,QAGrB;AAED,IAAY,gBAGX;AAHD,WAAY,gBAAgB;IACxB,+CAA2B,CAAA;IAC3B,yCAAqB,CAAA;AACzB,CAAC,EAHW,gBAAgB,gCAAhB,gBAAgB,QAG3B;AAED,IAAY,eAMX;AAND,WAAY,eAAe;IACvB,gCAAa,CAAA;IACb,kCAAe,CAAA;IACf,oCAAiB,CAAA;IACjB,oCAAiB,CAAA;IACjB,8BAAW,CAAA;AACf,CAAC,EANW,eAAe,+BAAf,eAAe,QAM1B;AAED,IAAY,cAGX;AAHD,WAAY,cAAc;IACtB,qCAAmB,CAAA;IACnB,+BAAa,CAAA;AACjB,CAAC,EAHW,cAAc,8BAAd,cAAc,QAGzB;AAED,IAAY,gBAGX;AAHD,WAAY,gBAAgB;IACxB,iCAAa,CAAA;IACb,iCAAa,CAAA;AACjB,CAAC,EAHW,gBAAgB,gCAAhB,gBAAgB,QAG3B;AAED,IAAY,kBAGX;AAHD,WAAY,kBAAkB;IAC1B,yDAAmC,CAAA;IACnC,oEAA8C,CAAA;AAClD,CAAC,EAHW,kBAAkB,kCAAlB,kBAAkB,QAG7B;AAED,IAAY,+BAIX;AAJD,WAAY,+BAA+B;IACvC,gDAAa,CAAA;IACb,kDAAe,CAAA;IACf,oDAAiB,CAAA;AACrB,CAAC,EAJW,+BAA+B,+CAA/B,+BAA+B,QAI1C;AAED,IAAY,cAGX;AAHD,WAAY,cAAc;IACtB,qCAAmB,CAAA;IACnB,mCAAiB,CAAA;AACrB,CAAC,EAHW,cAAc,8BAAd,cAAc,QAGzB;AAED,IAAY,sBAGX;AAHD,WAAY,sBAAsB;IAC9B,6CAAmB,CAAA;IACnB,2CAAiB,CAAA;AACrB,CAAC,EAHW,sBAAsB,sCAAtB,sBAAsB,QAGjC;AAED,IAAY,SAGX;AAHD,WAAY,SAAS;IACjB,gCAAmB,CAAA;IACnB,6CAAgC,CAAA;AACpC,CAAC,EAHW,SAAS,yBAAT,SAAS,QAGpB;AAuED,SAAS;AAET,IAAY,MAIX;AAJD,WAAY,MAAM;IACd,6BAAmB,CAAA;IACnB,2BAAiB,CAAA;IACjB,2BAAiB,CAAA;AACrB,CAAC,EAJW,MAAM,sBAAN,MAAM,QAIjB","sourcesContent":["import * as React from 'react';\n\nimport * as icons from '@gravity-ui/icons';\nimport {ButtonView, IconData, ButtonProps as UikitButtonProps} from '@gravity-ui/uikit';\n\nimport {ThemeSupporting} from '../../utils';\nimport {AnalyticsEventsBase, AnalyticsEventsProp, ClassNameProps, QAProps} from '../common';\n\n// enums\nexport enum AuthorType {\n Column = 'column',\n Line = 'line',\n}\n\nexport enum PriceDetailsType {\n MARKED_LIST = 'marked-list',\n SETTINGS = 'settings',\n}\n\nexport enum PriceLabelColor {\n BLUE = 'blue',\n GREEN = 'green',\n YELLOW = 'yellow',\n PURPLE = 'purple',\n RED = 'red',\n}\n\nexport enum PlayButtonType {\n Default = 'default',\n Text = 'text',\n}\n\nexport enum PlayButtonThemes {\n Blue = 'blue',\n Grey = 'grey',\n}\n\nexport enum CustomControlsType {\n WithMuteButton = 'with-mute-button',\n WithPlayPauseButton = 'with-play-pause-button',\n}\n\nexport enum CustomControlsButtonPositioning {\n Left = 'left',\n Right = 'right',\n Center = 'center',\n}\n\nexport enum MediaVideoType {\n Default = 'default',\n Player = 'player',\n}\n\nexport enum MediaVideoControlsType {\n Default = 'default',\n Custom = 'custom',\n}\n\nexport enum QuoteType {\n Chevron = 'chevron', // « »\n EnglishDouble = 'english-double', // “ ”\n}\n\n// types\nexport type TextTheme = 'light' \| 'dark';\nexport type TextSize = 'xs' \| 's' \| 'sm' \| 'm' \| 'l';\nexport type DividerSize = '0' \| 'xxs' \| 'xs' \| 's' \| 'm' \| 'l' \| 'xl' \| 'xxl' \| 'xxxl';\nexport type HeaderWidth = 's' \| 'm' \| 'l';\nexport type HeaderImageSize = 's' \| 'm';\nexport type HeaderOffset = 'default' \| 'large';\nexport type Justify = 'start' \| 'center' \| 'end';\nexport type ColumnsCount = 1 \| 2 \| 3 \| 4;\nexport type LegendTableMarkerType = 'disk' \| 'tick';\nexport type LinkTheme = 'file-link' \| 'normal' \| 'back' \| 'underline';\nexport type MediaDirection = 'media-content' \| 'content-media';\nexport type PriceDescriptionColor = 'cornflower' \| 'black';\nexport type ContentSize = 's' \| 'm' \| 'l' \| 'xl';\nexport type ContentTextSize = 's' \| 'm' \| 'l';\nexport type ContentTheme = 'default' \| 'dark' \| 'light';\nexport type FileLinkType = 'vertical' \| 'horizontal';\nexport type ImageCardMargins = 's' \| 'm';\nexport type LayoutItemContentMargin = 'm' \| 'l';\nexport type GravityIconProps = string \| {name: keyof typeof icons; color: 'brand' \| 'text-color'};\n\n// modifiers\nexport interface Themable {\n theme?: TextTheme;\n}\n\nexport interface Justifyable {\n justify?: Justify;\n}\n\nexport interface Stylable {\n className?: string;\n}\n\nexport interface Animatable {\n animated?: boolean;\n}\n\nexport interface Tabbable {\n tabIndex?: number;\n}\n\nexport interface Roleable {\n role?: React.AriaRole;\n}\n\nexport interface AriaProps {\n ariaProps?: React.AriaAttributes;\n}\n\n//common props\nexport interface Background {\n image?: string;\n color?: string;\n}\n\nexport interface AnchorProps {\n text: string;\n url: string;\n}\n\n/*\n @deprecated Component VideoBlock will be deleted, which uses this logic\n /\ninterface LoopProps {\n start: number;\n end?: number;\n}\n\n// images\n\nexport enum Device {\n Desktop = 'desktop',\n Mobile = 'mobile',\n Tablet = 'tablet',\n}\n\nexport interface ImageInfoProps\n extends Pick<\n React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>,\n 'aria-describedby' \| 'loading'\n >,\n ImageDevicesVisibleProps {\n alt?: string;\n fetchPriority?: 'high' \| 'low' \| 'auto';\n disableCompress?: boolean;\n}\n\nexport interface ImageObjectProps extends ImageInfoProps {\n src: string;\n}\n\nexport interface ImageDeviceProps extends ImageInfoProps {\n [Device.Desktop]: string;\n [Device.Mobile]: string;\n [Device.Tablet]?: string;\n}\n\nexport interface ImageDevicesVisibleProps {\n hide?: boolean \| Partial<Record<Device, boolean>>;\n}\n\nexport type ImageProps = string \| ImageObjectProps \| ImageDeviceProps;\nexport type ThemedImage = ThemeSupporting<ImageProps>;\n\nexport interface BackgroundImageProps\n extends React.HTMLProps<HTMLDivElement>,\n Partial<ImageDeviceProps>,\n Partial<ImageObjectProps>,\n QAProps,\n ImageDevicesVisibleProps {\n style?: React.CSSProperties;\n imageClassName?: string;\n}\n\n//components props\nexport interface MediaVideoProps extends AnalyticsEventsBase {\n src: string[];\n type?: MediaVideoType;\n loop?: LoopProps \| boolean;\n muted?: boolean;\n autoplay?: boolean;\n elapsedTime?: number;\n playButton?: PlayButtonProps;\n controls?: MediaVideoControlsType;\n customControlsOptions?: CustomControlsOptions;\n ariaLabel?: string;\n contain?: boolean;\n onVideoEnd?: () => void;\n ref?: React.Ref<HTMLVideoElement \| null>;\n}\n\n// links\nexport interface LinkProps extends AnalyticsEventsBase, Stylable, Tabbable {\n url: string;\n urlTitle?: string;\n text?: string;\n textSize?: TextSize;\n theme?: LinkTheme;\n colorTheme?: TextTheme;\n arrow?: boolean;\n target?: string;\n extraProps?: React.HTMLProps<HTMLAnchorElement>;\n}\n\nexport interface FileLinkProps extends ClassNameProps, Tabbable {\n href: string;\n text: React.ReactNode;\n type?: FileLinkType;\n textSize?: TextSize;\n theme?: ContentTheme;\n urlTitle?: string;\n onClick?: () => void;\n extraProps?: React.HTMLProps<HTMLAnchorElement>;\n}\n\n// buttons\nexport type ButtonTheme =\n \| ButtonView\n \| 'github'\n \| 'app-store'\n \| 'google-play'\n \| 'scale'\n \| 'monochrome';\n\nexport interface ButtonProps extends AnalyticsEventsBase {\n text: string;\n url: string;\n urlTitle?: string;\n primary?: boolean;\n theme?: ButtonTheme;\n img?: ButtonImageProps \| string;\n target?: string;\n size?: UikitButtonProps['size'];\n width?: UikitButtonProps['width'];\n extraProps?: UikitButtonProps['extraProps'];\n}\n\nexport type ButtonImagePosition = 'left' \| 'right';\n\nexport interface ButtonImageProps {\n url?: string;\n position?: ButtonImagePosition;\n alt?: string;\n iconData?: IconData;\n iconSize?: number;\n className?: string;\n}\n\nexport interface CustomControlsOptions {\n type?: CustomControlsType;\n muteButtonShown?: boolean;\n positioning?: CustomControlsButtonPositioning;\n}\n\nexport interface PlayButtonProps extends ClassNameProps {\n type?: PlayButtonType;\n theme?: PlayButtonThemes;\n text?: string;\n}\n\nexport type ThemedMediaVideoProps = ThemeSupporting<MediaVideoProps>;\n\nexport interface MediaComponentVideoProps extends AnalyticsEventsBase {\n video: MediaVideoProps;\n height?: number;\n ratio?: number \| 'auto';\n previewImg?: string;\n}\n\nexport interface MediaComponentVideoIframeProps {\n videoIframe: string;\n}\n\nexport interface MediaComponentYoutubeProps {\n youtube: string;\n previewImg?: string;\n fullscreen?: boolean;\n}\n\nexport interface MediaComponentImageProps {\n image: ImageProps \| ImageProps[] \| ImageDeviceProps;\n video?: MediaVideoProps;\n parallax?: boolean;\n height?: number;\n disableImageSliderForArrayInput?: boolean;\n}\n\nexport interface MediaComponentDataLensProps {\n dataLens: DataLensProps;\n}\n\nexport interface MediaComponentIframeProps {\n iframe: IframeProps;\n margins?: boolean;\n}\n\nexport interface MediaProps\n extends Animatable,\n Partial<MediaComponentDataLensProps>,\n Partial<MediaComponentYoutubeProps>,\n Partial<MediaComponentVideoIframeProps>,\n Partial<MediaComponentImageProps>,\n Partial<MediaComponentIframeProps>,\n Partial<MediaComponentVideoProps> {\n color?: string;\n videoMicrodata?: {\n name?: string;\n description?: string;\n duration?: string;\n uploadDate?: string;\n contentUrl?: string;\n thumbnailUrl?: string;\n };\n}\n\nexport interface BackgroundMediaProps extends MediaProps, Animatable, QAProps {\n fullWidthMedia?: boolean;\n className?: string;\n mediaClassName?: string;\n}\n\nexport type Coordinate = [number, number];\n\nexport interface MapBaseProps {\n zoom?: number;\n className?: string;\n forceAspectRatio?: boolean;\n}\n\nexport interface GMapProps extends MapBaseProps {\n address: string;\n}\n\nexport type YMapMargin =\n \| number\n \| [vertical: number, horizontal: number]\n \| [top: number, right: number, bottom: number, left: number];\n\nexport interface YMapCopyrightPosition {\n top?: number;\n right?: number;\n bottom?: number;\n left?: number;\n}\n\nexport interface YMapProps extends MapBaseProps {\n markers: YMapMarker[];\n disableControls?: boolean;\n disableBalloons?: boolean;\n areaMargin?: YMapMargin;\n copyrightPosition?: YMapCopyrightPosition;\n id: string;\n}\n\nexport interface YMapMarker {\n address?: string;\n coordinate?: Coordinate;\n label?: YMapMarkerLabel;\n}\n\nexport interface YMapMarkerLabel {\n iconCaption?: string;\n iconContent?: string;\n iconColor?: string;\n iconImageHref?: string;\n iconImageSize?: [number, number];\n iconImageOffset?: [number, number];\n iconImageClipRect?: [[number, number], [number, number]];\n iconLayout?: 'default#image';\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n iconShape?: Record<string, any>;\n preset?: string;\n}\n\nexport interface YMapMarkerPrivate extends YMapMarker {\n label?: YMapMarkerLabelPrivate;\n}\n\nexport interface YMapMarkerLabelPrivate extends YMapMarkerLabel {\n cursor?: string;\n interactivityModel?: string;\n}\n\nexport type MapProps = GMapProps \| YMapProps;\n\nexport type ThemedMediaProps = ThemeSupporting<MediaProps>;\n\nexport interface DataLensObjectProps {\n id: string;\n theme: 'dark' \| 'light';\n}\n\nexport interface IframeProps {\n src: string;\n width?: number;\n height?: number;\n title?: string;\n name?: string;\n}\n\nexport type DataLensProps = string \| DataLensObjectProps;\n\nexport interface AuthorItem {\n firstName: string;\n secondName: string;\n description?: string;\n avatar?: ThemeSupporting<ImageProps> \| JSX.Element;\n}\n\nexport interface HeaderBreadCrumbsProps extends ClassNameProps, QAProps {\n items: {\n url: string;\n text: React.ReactNode;\n }[];\n theme?: TextTheme;\n analyticsEvents?: AnalyticsEventsProp;\n}\n\nexport interface TitleItemProps extends Justifyable, TitleItemBaseProps, AnalyticsEventsBase {\n navTitle?: string;\n anchor?: string;\n}\n\nexport interface TitleItemBaseProps {\n text: string;\n textSize?: TextSize;\n url?: string;\n urlTitle?: string;\n custom?: string \| React.ReactNode;\n onClick?: () => void;\n}\n\nexport type MediaView = 'fit' \| 'full';\n\n// card\nexport type MediaBorder = 'shadow' \| 'line' \| 'none';\nexport type CardBorder = MediaBorder;\nexport type ControlPosition = 'content' \| 'footer';\n\nexport interface CardBaseProps {\n border?: CardBorder;\n}\n\nexport type CardLayoutProps = {\n controlPosition?: ControlPosition;\n};\n\n//price\nexport interface PriceDescriptionProps {\n title: string;\n detailedTitle?: string;\n description: string;\n label?: {\n color: PriceLabelColor;\n text?: string;\n size?: TextSize;\n };\n}\n\nexport interface PriceDetailsSettingsProps {\n title: string;\n description: string;\n}\n\nexport interface PriceDetailsListProps {\n text: string;\n}\n\nexport interface PriceDetailsProps {\n items?: PriceDetailsSettingsProps[] \| PriceDetailsListProps[];\n}\n\nexport interface PriceItemProps\n extends PriceDetailsProps,\n PriceDescriptionProps,\n AnalyticsEventsBase {}\n\nexport interface PriceFoldableDetailsProps {\n title: string;\n size?: TextSize;\n titleColor?: PriceDescriptionColor;\n}\n\n/* @deprecated /\nexport interface PriceDetailedProps extends CardBaseProps {\n items: PriceItemProps[];\n description?: {\n titleSize?: TextSize;\n descriptionSize?: TextSize;\n titleColor?: PriceDescriptionColor;\n };\n details?: {\n titleSize?: TextSize;\n descriptionSize?: TextSize;\n };\n priceType?: PriceDetailsType;\n numberGroupItems?: 3 \| 4 \| 5;\n isCombined?: boolean;\n useMixedView?: boolean;\n foldable?: PriceFoldableDetailsProps;\n labelsDefaultText?: Record<PriceLabelColor, string>;\n}\n\nexport interface AuthorProps extends QAProps {\n author: AuthorItem;\n className?: string;\n authorContainerClassName?: string;\n type?: AuthorType;\n theme?: ContentTheme;\n}\n\nexport interface TitleProps {\n title?: TitleItemProps \| string;\n subtitle?: string;\n}\n\nexport interface YandexFormProps extends AnalyticsEventsBase {\n id: number \| string;\n containerId?: string;\n theme?: string;\n className?: string;\n headerHeight?: number;\n customFormOrigin?: string;\n customFormSection?: string;\n params?: {[key: string]: string};\n\n onSubmit?: () => void;\n onLoad?: () => void;\n}\n\nexport interface WithBorder {\n border?: MediaBorder;\n /\n @deprecated use custom class for media-component\n */\n disableShadow?: boolean;\n}\n"]}
1	+ {"version":3,"file":"common.js","sourceRoot":"../../../../src","sources":["models/constructor-items/common.ts"],"names":[],"mappings":";;;AAQA,QAAQ;AACR,IAAY,UAGX;AAHD,WAAY,UAAU;IAClB,+BAAiB,CAAA;IACjB,2BAAa,CAAA;AACjB,CAAC,EAHW,UAAU,0BAAV,UAAU,QAGrB;AAED,IAAY,gBAGX;AAHD,WAAY,gBAAgB;IACxB,+CAA2B,CAAA;IAC3B,yCAAqB,CAAA;AACzB,CAAC,EAHW,gBAAgB,gCAAhB,gBAAgB,QAG3B;AAED,IAAY,eAMX;AAND,WAAY,eAAe;IACvB,gCAAa,CAAA;IACb,kCAAe,CAAA;IACf,oCAAiB,CAAA;IACjB,oCAAiB,CAAA;IACjB,8BAAW,CAAA;AACf,CAAC,EANW,eAAe,+BAAf,eAAe,QAM1B;AAED,IAAY,cAGX;AAHD,WAAY,cAAc;IACtB,qCAAmB,CAAA;IACnB,+BAAa,CAAA;AACjB,CAAC,EAHW,cAAc,8BAAd,cAAc,QAGzB;AAED,IAAY,gBAIX;AAJD,WAAY,gBAAgB;IACxB,iCAAa,CAAA;IACb,iCAAa,CAAA;IACb,qCAAiB,CAAA;AACrB,CAAC,EAJW,gBAAgB,gCAAhB,gBAAgB,QAI3B;AAED,IAAY,kBAGX;AAHD,WAAY,kBAAkB;IAC1B,yDAAmC,CAAA;IACnC,oEAA8C,CAAA;AAClD,CAAC,EAHW,kBAAkB,kCAAlB,kBAAkB,QAG7B;AAED,IAAY,+BAIX;AAJD,WAAY,+BAA+B;IACvC,gDAAa,CAAA;IACb,kDAAe,CAAA;IACf,oDAAiB,CAAA;AACrB,CAAC,EAJW,+BAA+B,+CAA/B,+BAA+B,QAI1C;AAED,IAAY,cAGX;AAHD,WAAY,cAAc;IACtB,qCAAmB,CAAA;IACnB,mCAAiB,CAAA;AACrB,CAAC,EAHW,cAAc,8BAAd,cAAc,QAGzB;AAED,IAAY,sBAGX;AAHD,WAAY,sBAAsB;IAC9B,6CAAmB,CAAA;IACnB,2CAAiB,CAAA;AACrB,CAAC,EAHW,sBAAsB,sCAAtB,sBAAsB,QAGjC;AAED,IAAY,SAGX;AAHD,WAAY,SAAS;IACjB,gCAAmB,CAAA;IACnB,6CAAgC,CAAA;AACpC,CAAC,EAHW,SAAS,yBAAT,SAAS,QAGpB;AAuED,SAAS;AAET,IAAY,MAIX;AAJD,WAAY,MAAM;IACd,6BAAmB,CAAA;IACnB,2BAAiB,CAAA;IACjB,2BAAiB,CAAA;AACrB,CAAC,EAJW,MAAM,sBAAN,MAAM,QAIjB","sourcesContent":["import * as React from 'react';\n\nimport * as icons from '@gravity-ui/icons';\nimport {ButtonView, IconData, ButtonProps as UikitButtonProps} from '@gravity-ui/uikit';\n\nimport {ThemeSupporting} from '../../utils';\nimport {AnalyticsEventsBase, AnalyticsEventsProp, ClassNameProps, QAProps} from '../common';\n\n// enums\nexport enum AuthorType {\n Column = 'column',\n Line = 'line',\n}\n\nexport enum PriceDetailsType {\n MARKED_LIST = 'marked-list',\n SETTINGS = 'settings',\n}\n\nexport enum PriceLabelColor {\n BLUE = 'blue',\n GREEN = 'green',\n YELLOW = 'yellow',\n PURPLE = 'purple',\n RED = 'red',\n}\n\nexport enum PlayButtonType {\n Default = 'default',\n Text = 'text',\n}\n\nexport enum PlayButtonThemes {\n Blue = 'blue',\n Grey = 'grey',\n Custom = 'custom',\n}\n\nexport enum CustomControlsType {\n WithMuteButton = 'with-mute-button',\n WithPlayPauseButton = 'with-play-pause-button',\n}\n\nexport enum CustomControlsButtonPositioning {\n Left = 'left',\n Right = 'right',\n Center = 'center',\n}\n\nexport enum MediaVideoType {\n Default = 'default',\n Player = 'player',\n}\n\nexport enum MediaVideoControlsType {\n Default = 'default',\n Custom = 'custom',\n}\n\nexport enum QuoteType {\n Chevron = 'chevron', // « »\n EnglishDouble = 'english-double', // “ ”\n}\n\n// types\nexport type TextTheme = 'light' \| 'dark';\nexport type TextSize = 'xs' \| 's' \| 'sm' \| 'm' \| 'l';\nexport type DividerSize = '0' \| 'xxs' \| 'xs' \| 's' \| 'm' \| 'l' \| 'xl' \| 'xxl' \| 'xxxl';\nexport type HeaderWidth = 's' \| 'm' \| 'l';\nexport type HeaderImageSize = 's' \| 'm';\nexport type HeaderOffset = 'default' \| 'large';\nexport type Justify = 'start' \| 'center' \| 'end';\nexport type ColumnsCount = 1 \| 2 \| 3 \| 4;\nexport type LegendTableMarkerType = 'disk' \| 'tick';\nexport type LinkTheme = 'file-link' \| 'normal' \| 'back' \| 'underline';\nexport type MediaDirection = 'media-content' \| 'content-media';\nexport type PriceDescriptionColor = 'cornflower' \| 'black';\nexport type ContentSize = 's' \| 'm' \| 'l' \| 'xl';\nexport type ContentTextSize = 's' \| 'm' \| 'l';\nexport type ContentTheme = 'default' \| 'dark' \| 'light';\nexport type FileLinkType = 'vertical' \| 'horizontal';\nexport type ImageCardMargins = 's' \| 'm';\nexport type LayoutItemContentMargin = 'm' \| 'l';\nexport type GravityIconProps = string \| {name: keyof typeof icons; color: 'brand' \| 'text-color'};\n\n// modifiers\nexport interface Themable {\n theme?: TextTheme;\n}\n\nexport interface Justifyable {\n justify?: Justify;\n}\n\nexport interface Stylable {\n className?: string;\n}\n\nexport interface Animatable {\n animated?: boolean;\n}\n\nexport interface Tabbable {\n tabIndex?: number;\n}\n\nexport interface Roleable {\n role?: React.AriaRole;\n}\n\nexport interface AriaProps {\n ariaProps?: React.AriaAttributes;\n}\n\n//common props\nexport interface Background {\n image?: string;\n color?: string;\n}\n\nexport interface AnchorProps {\n text: string;\n url: string;\n}\n\n/*\n @deprecated Component VideoBlock will be deleted, which uses this logic\n /\ninterface LoopProps {\n start: number;\n end?: number;\n}\n\n// images\n\nexport enum Device {\n Desktop = 'desktop',\n Mobile = 'mobile',\n Tablet = 'tablet',\n}\n\nexport interface ImageInfoProps\n extends Pick<\n React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>,\n 'aria-describedby' \| 'loading'\n >,\n ImageDevicesVisibleProps {\n alt?: string;\n fetchPriority?: 'high' \| 'low' \| 'auto';\n disableCompress?: boolean;\n}\n\nexport interface ImageObjectProps extends ImageInfoProps {\n src: string;\n}\n\nexport interface ImageDeviceProps extends ImageInfoProps {\n [Device.Desktop]: string;\n [Device.Mobile]: string;\n [Device.Tablet]?: string;\n}\n\nexport interface ImageDevicesVisibleProps {\n hide?: boolean \| Partial<Record<Device, boolean>>;\n}\n\nexport type ImageProps = string \| ImageObjectProps \| ImageDeviceProps;\nexport type ThemedImage = ThemeSupporting<ImageProps>;\n\nexport interface BackgroundImageProps\n extends React.HTMLProps<HTMLDivElement>,\n Partial<ImageDeviceProps>,\n Partial<ImageObjectProps>,\n QAProps,\n ImageDevicesVisibleProps {\n style?: React.CSSProperties;\n imageClassName?: string;\n}\n\n//components props\nexport interface MediaVideoProps extends AnalyticsEventsBase {\n src: string[];\n type?: MediaVideoType;\n loop?: LoopProps \| boolean;\n muted?: boolean;\n autoplay?: boolean;\n elapsedTime?: number;\n playButton?: PlayButtonProps;\n controls?: MediaVideoControlsType;\n customControlsOptions?: CustomControlsOptions;\n ariaLabel?: string;\n contain?: boolean;\n onVideoEnd?: () => void;\n ref?: React.Ref<HTMLVideoElement \| null>;\n}\n\n// links\nexport interface LinkProps extends AnalyticsEventsBase, Stylable, Tabbable {\n url: string;\n urlTitle?: string;\n text?: string;\n textSize?: TextSize;\n theme?: LinkTheme;\n colorTheme?: TextTheme;\n arrow?: boolean;\n target?: string;\n extraProps?: React.HTMLProps<HTMLAnchorElement>;\n}\n\nexport interface FileLinkProps extends ClassNameProps, Tabbable {\n href: string;\n text: React.ReactNode;\n type?: FileLinkType;\n textSize?: TextSize;\n theme?: ContentTheme;\n urlTitle?: string;\n onClick?: () => void;\n extraProps?: React.HTMLProps<HTMLAnchorElement>;\n}\n\n// buttons\nexport type ButtonTheme =\n \| ButtonView\n \| 'github'\n \| 'app-store'\n \| 'google-play'\n \| 'scale'\n \| 'monochrome';\n\nexport interface ButtonProps extends AnalyticsEventsBase {\n text: string;\n url: string;\n urlTitle?: string;\n primary?: boolean;\n theme?: ButtonTheme;\n img?: ButtonImageProps \| string;\n target?: string;\n size?: UikitButtonProps['size'];\n width?: UikitButtonProps['width'];\n extraProps?: UikitButtonProps['extraProps'];\n}\n\nexport type ButtonImagePosition = 'left' \| 'right';\n\nexport interface ButtonImageProps {\n url?: string;\n position?: ButtonImagePosition;\n alt?: string;\n iconData?: IconData;\n iconSize?: number;\n className?: string;\n}\n\nexport interface CustomControlsOptions {\n type?: CustomControlsType;\n muteButtonShown?: boolean;\n positioning?: CustomControlsButtonPositioning;\n}\n\nexport interface PlayButtonColors {\n circleColor?: string;\n circleHoverColor?: string;\n triangleColor?: string;\n triangleHoverColor?: string;\n}\n\nexport interface PlayButtonProps extends ClassNameProps {\n type?: PlayButtonType;\n theme?: PlayButtonThemes;\n text?: string;\n}\n\nexport type ThemedMediaVideoProps = ThemeSupporting<MediaVideoProps>;\n\nexport interface MediaComponentVideoProps extends AnalyticsEventsBase {\n video: MediaVideoProps;\n height?: number;\n ratio?: number \| 'auto';\n previewImg?: string;\n}\n\nexport interface MediaComponentVideoIframeProps {\n videoIframe: string;\n}\n\nexport interface MediaComponentYoutubeProps {\n youtube: string;\n previewImg?: string;\n fullscreen?: boolean;\n}\n\nexport interface MediaComponentImageProps {\n image: ImageProps \| ImageProps[] \| ImageDeviceProps;\n video?: MediaVideoProps;\n parallax?: boolean;\n height?: number;\n disableImageSliderForArrayInput?: boolean;\n}\n\nexport interface MediaComponentDataLensProps {\n dataLens: DataLensProps;\n}\n\nexport interface MediaComponentIframeProps {\n iframe: IframeProps;\n margins?: boolean;\n}\n\nexport interface MediaProps\n extends Animatable,\n Partial<MediaComponentDataLensProps>,\n Partial<MediaComponentYoutubeProps>,\n Partial<MediaComponentVideoIframeProps>,\n Partial<MediaComponentImageProps>,\n Partial<MediaComponentIframeProps>,\n Partial<MediaComponentVideoProps> {\n color?: string;\n videoMicrodata?: {\n name?: string;\n description?: string;\n duration?: string;\n uploadDate?: string;\n contentUrl?: string;\n thumbnailUrl?: string;\n };\n}\n\nexport interface BackgroundMediaProps extends MediaProps, Animatable, QAProps {\n fullWidthMedia?: boolean;\n className?: string;\n mediaClassName?: string;\n}\n\nexport type Coordinate = [number, number];\n\nexport interface MapBaseProps {\n zoom?: number;\n className?: string;\n forceAspectRatio?: boolean;\n}\n\nexport interface GMapProps extends MapBaseProps {\n address: string;\n}\n\nexport type YMapMargin =\n \| number\n \| [vertical: number, horizontal: number]\n \| [top: number, right: number, bottom: number, left: number];\n\nexport interface YMapCopyrightPosition {\n top?: number;\n right?: number;\n bottom?: number;\n left?: number;\n}\n\nexport interface YMapProps extends MapBaseProps {\n markers: YMapMarker[];\n disableControls?: boolean;\n disableBalloons?: boolean;\n areaMargin?: YMapMargin;\n copyrightPosition?: YMapCopyrightPosition;\n id: string;\n}\n\nexport interface YMapMarker {\n address?: string;\n coordinate?: Coordinate;\n label?: YMapMarkerLabel;\n}\n\nexport interface YMapMarkerLabel {\n iconCaption?: string;\n iconContent?: string;\n iconColor?: string;\n iconImageHref?: string;\n iconImageSize?: [number, number];\n iconImageOffset?: [number, number];\n iconImageClipRect?: [[number, number], [number, number]];\n iconLayout?: 'default#image';\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n iconShape?: Record<string, any>;\n preset?: string;\n}\n\nexport interface YMapMarkerPrivate extends YMapMarker {\n label?: YMapMarkerLabelPrivate;\n}\n\nexport interface YMapMarkerLabelPrivate extends YMapMarkerLabel {\n cursor?: string;\n interactivityModel?: string;\n}\n\nexport type MapProps = GMapProps \| YMapProps;\n\nexport type ThemedMediaProps = ThemeSupporting<MediaProps>;\n\nexport interface DataLensObjectProps {\n id: string;\n theme: 'dark' \| 'light';\n}\n\nexport interface IframeProps {\n src: string;\n width?: number;\n height?: number;\n title?: string;\n name?: string;\n}\n\nexport type DataLensProps = string \| DataLensObjectProps;\n\nexport interface AuthorItem {\n firstName: string;\n secondName: string;\n description?: string;\n avatar?: ThemeSupporting<ImageProps> \| JSX.Element;\n}\n\nexport interface HeaderBreadCrumbsProps extends ClassNameProps, QAProps {\n items: {\n url: string;\n text: React.ReactNode;\n }[];\n theme?: TextTheme;\n analyticsEvents?: AnalyticsEventsProp;\n}\n\nexport interface TitleItemProps extends Justifyable, TitleItemBaseProps, AnalyticsEventsBase {\n navTitle?: string;\n anchor?: string;\n}\n\nexport interface TitleItemBaseProps {\n text: string;\n textSize?: TextSize;\n url?: string;\n urlTitle?: string;\n custom?: string \| React.ReactNode;\n onClick?: () => void;\n}\n\nexport type MediaView = 'fit' \| 'full';\n\n// card\nexport type MediaBorder = 'shadow' \| 'line' \| 'none';\nexport type CardBorder = MediaBorder;\nexport type ControlPosition = 'content' \| 'footer';\n\nexport interface CardBaseProps {\n border?: CardBorder;\n}\n\nexport type CardLayoutProps = {\n controlPosition?: ControlPosition;\n};\n\n//price\nexport interface PriceDescriptionProps {\n title: string;\n detailedTitle?: string;\n description: string;\n label?: {\n color: PriceLabelColor;\n text?: string;\n size?: TextSize;\n };\n}\n\nexport interface PriceDetailsSettingsProps {\n title: string;\n description: string;\n}\n\nexport interface PriceDetailsListProps {\n text: string;\n}\n\nexport interface PriceDetailsProps {\n items?: PriceDetailsSettingsProps[] \| PriceDetailsListProps[];\n}\n\nexport interface PriceItemProps\n extends PriceDetailsProps,\n PriceDescriptionProps,\n AnalyticsEventsBase {}\n\nexport interface PriceFoldableDetailsProps {\n title: string;\n size?: TextSize;\n titleColor?: PriceDescriptionColor;\n}\n\n/* @deprecated /\nexport interface PriceDetailedProps extends CardBaseProps {\n items: PriceItemProps[];\n description?: {\n titleSize?: TextSize;\n descriptionSize?: TextSize;\n titleColor?: PriceDescriptionColor;\n };\n details?: {\n titleSize?: TextSize;\n descriptionSize?: TextSize;\n };\n priceType?: PriceDetailsType;\n numberGroupItems?: 3 \| 4 \| 5;\n isCombined?: boolean;\n useMixedView?: boolean;\n foldable?: PriceFoldableDetailsProps;\n labelsDefaultText?: Record<PriceLabelColor, string>;\n}\n\nexport interface AuthorProps extends QAProps {\n author: AuthorItem;\n className?: string;\n authorContainerClassName?: string;\n type?: AuthorType;\n theme?: ContentTheme;\n}\n\nexport interface TitleProps {\n title?: TitleItemProps \| string;\n subtitle?: string;\n}\n\nexport interface YandexFormProps extends AnalyticsEventsBase {\n id: number \| string;\n containerId?: string;\n theme?: string;\n className?: string;\n headerHeight?: number;\n customFormOrigin?: string;\n customFormSection?: string;\n params?: {[key: string]: string};\n\n onSubmit?: () => void;\n onLoad?: () => void;\n}\n\nexport interface WithBorder {\n border?: MediaBorder;\n /\n @deprecated use custom class for media-component\n */\n disableShadow?: boolean;\n}\n"]}

package/build/esm/blocks/Footer/components/CopyrightFloor/CopyrightFloor.js CHANGED Viewed

@@ -3,6 +3,7 @@ import * as React from 'react';
 import { DropdownMenu, Link, useResizeObserver } from '@gravity-ui/uikit';
 import { Image } from "../../../../components/index.js";
 import { BREAKPOINTS } from "../../../../constants.js";
+import { SSRContext } from "../../../../context/ssrContext/index.js";
 import { useTheme } from "../../../../context/theme/index.js";
 import { Col } from "../../../../grid/index.js";
 import { block, getThemedValue } from "../../../../utils/index.js";
@@ -68,20 +69,19 @@ const RightSide = ({ copyright, rightSideRef, style }) => {
     const theme = useTheme();
     return (_jsxs("div", { className: b('links-floor-right'), ref: rightSideRef, style: style, children: [copyright.languageSwitcher && (_jsx(LangSwitcher, { buttonText: copyright.languageSwitcher.buttonText, items: copyright.languageSwitcher.items, image: getThemedValue(copyright.languageSwitcher.image, theme) })), copyright.copyrightText && (_jsx("span", { className: b('links-floor-copyright'), children: copyright.copyrightText }))] }));
 };
-const DOCUMENT_ELEMENT_REF = {
-    current: document.documentElement,
-};
 export const CopyrightFloor = ({ copyright }) => {
     const theme = useTheme();
+    const { isServer } = React.useContext(SSRContext);
     const [isSmallWidth, setIsSmallWidth] = React.useState(() => {
-        return document.documentElement.clientWidth <= MOBILE_WIDTH;
+        return !isServer && document.documentElement.clientWidth <= MOBILE_WIDTH;
     });
     const [isThreeColumnStacked, setIsThreeColumnStacked] = React.useState(() => {
-        return document.documentElement.clientWidth <= THREE_COLUMN_DESKTOP_WIDTH;
+        return !isServer && document.documentElement.clientWidth <= THREE_COLUMN_DESKTOP_WIDTH;
     });
     const [sideColumnWidth, setSideColumnWidth] = React.useState();
     const logoRef = React.useRef(null);
     const rightSideRef = React.useRef(null);
+    const documentElementRef = React.useMemo(() => ({ current: isServer ? null : document.documentElement }), [isServer]);
     const updateSideColumnWidth = React.useCallback(() => {
         const logoWidth = Math.ceil(logoRef.current?.getBoundingClientRect().width ?? 0);
         const rightSideWidth = rightSideRef.current
@@ -96,7 +96,7 @@ export const CopyrightFloor = ({ copyright }) => {
         updateSideColumnWidth();
     }, [updateSideColumnWidth]);
     useResizeObserver({
-        ref: DOCUMENT_ELEMENT_REF,
+        ref: documentElementRef,
         onResize: updateFloorSize,
     });
     const menuContainerRef = React.useRef(null);

package/build/esm/blocks/Footer/components/CopyrightFloor/CopyrightFloor.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CopyrightFloor.js","sourceRoot":"../../../../../../src","sources":["blocks/Footer/components/CopyrightFloor/CopyrightFloor.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport {DropdownMenu, DropdownMenuItem, Link, useResizeObserver} from '@gravity-ui/uikit';\n\nimport {Image} from '../../../../components';\nimport {BREAKPOINTS} from '../../../../constants';\nimport {useTheme} from '../../../../context/theme';\nimport {Col} from '../../../../grid';\nimport type {FooterBlockProps} from '../../../../models';\nimport {block, getThemedValue} from '../../../../utils';\nimport {useLogoImageProps} from '../../hooks/useLogoImageProps';\nimport {LinkItem, useOverflowListItems} from '../../hooks/useOverflowListItems';\nimport {LangSwitcher} from '../LangSwitcher';\n\nimport './CopyrightFloor.scss';\n\nconst b = block('footer-block');\n\nconst MOBILE_WIDTH = BREAKPOINTS.sm;\nconst THREE_COLUMN_DESKTOP_WIDTH = BREAKPOINTS.md;\n\ntype CopyrightFloorProps = {\n copyright: NonNullable<FooterBlockProps['copyright']>;\n};\n\nfunction getElementFlexContentWidth(element: HTMLElement) {\n const children = Array.from(element.children) as HTMLElement[];\n\n if (!children.length) {\n return element.scrollWidth;\n }\n\n const elementStyles = window.getComputedStyle(element);\n const columnGap = parseFloat(elementStyles.columnGap);\n const gap = Number.isNaN(columnGap) ? 0 : columnGap;\n // extra 1px to prevent overflow\n const childrenWidths = children.map((child) => child.scrollWidth + 1);\n\n if (elementStyles.flexDirection.startsWith('column')) {\n return Math.ceil(Math.max(...childrenWidths));\n }\n\n return Math.ceil(\n childrenWidths.reduce((sum, width) => sum + width, 0) + gap * (children.length - 1),\n );\n}\n\nfunction useLinksAlignmentState(copyright: CopyrightFloorProps['copyright']) {\n const hasOnlyLinks = Boolean(\n copyright.links?.length &&\n !copyright.logo &&\n !copyright.languageSwitcher &&\n !copyright.copyrightText,\n );\n const areLinksInTheMiddle = Boolean(\n copyright.logo &&\n copyright.links?.length &&\n (copyright.languageSwitcher \|\| copyright.copyrightText),\n );\n\n return {\n shouldCenterLinks: areLinksInTheMiddle \|\| hasOnlyLinks,\n threeColumnLayout: areLinksInTheMiddle,\n hasOnlyLinks,\n };\n}\n\ntype CopyrightLogoProps = {\n logo: CopyrightFloorProps['copyright']['logo'];\n logoImageProps: Record<string, unknown> \| null;\n logoRef?: React.RefObject<HTMLDivElement>;\n};\n\nconst CopyrightLogo = ({logo, logoImageProps, logoRef}: CopyrightLogoProps) => {\n if (!logo \|\| !logoImageProps) {\n return null;\n }\n\n return (\n <div className={b('logo')} ref={logoRef}>\n {logo.url ? (\n <Link href={logo.url}>\n <Image {...logoImageProps} alt={logo.alt ?? ''} className={b('logo-image')} />\n </Link>\n ) : (\n <Image {...logoImageProps} alt={logo.alt ?? ''} className={b('logo-image')} />\n )}\n </div>\n );\n};\n\ntype VisibleLinksProps = {\n items: LinkItem[];\n isLinksOverflowDropdown: boolean;\n};\n\nconst VisibleLinks = ({items, isLinksOverflowDropdown}: VisibleLinksProps) => {\n if (!items?.length) {\n return null;\n }\n\n return (\n <ul\n className={b('links-floor-list', {\n wrap: !isLinksOverflowDropdown,\n })}\n >\n {items.map((item, index) => (\n <li key={index} className={b('links-floor-item')}>\n <a href={item.url}>{item.text}</a>\n </li>\n ))}\n </ul>\n );\n};\n\ntype OverflowDropdownProps = {\n isLinksOverflowDropdown: boolean;\n items: DropdownMenuItem[];\n};\n\nconst OverflowDropdown = ({isLinksOverflowDropdown, items}: OverflowDropdownProps) => {\n if (!isLinksOverflowDropdown \|\| !items.length) {\n return null;\n }\n\n return (\n <DropdownMenu\n items={items}\n switcherWrapperClassName={b('more-button', {\n visible: isLinksOverflowDropdown && items.length > 0,\n })}\n size=\"l\"\n />\n );\n};\n\ntype RightSideProps = {\n copyright: CopyrightFloorProps['copyright'];\n rightSideRef: React.RefObject<HTMLDivElement>;\n style?: React.CSSProperties;\n};\n\nconst RightSide = ({copyright, rightSideRef, style}: RightSideProps) => {\n const theme = useTheme();\n\n return (\n <div className={b('links-floor-right')} ref={rightSideRef} style={style}>\n {copyright.languageSwitcher && (\n <LangSwitcher\n buttonText={copyright.languageSwitcher.buttonText}\n items={copyright.languageSwitcher.items}\n image={getThemedValue(copyright.languageSwitcher.image, theme)}\n />\n )}\n {copyright.copyrightText && (\n <span className={b('links-floor-copyright')}>{copyright.copyrightText}</span>\n )}\n </div>\n );\n};\n\nconst DOCUMENT_ELEMENT_REF = {\n current: document.documentElement,\n};\n\nexport const CopyrightFloor = ({copyright}: CopyrightFloorProps) => {\n const theme = useTheme();\n const [isSmallWidth, setIsSmallWidth] = React.useState(() => {\n return document.documentElement.clientWidth <= MOBILE_WIDTH;\n });\n const [isThreeColumnStacked, setIsThreeColumnStacked] = React.useState(() => {\n return document.documentElement.clientWidth <= THREE_COLUMN_DESKTOP_WIDTH;\n });\n const [sideColumnWidth, setSideColumnWidth] = React.useState<number>();\n const logoRef = React.useRef<HTMLDivElement>(null);\n const rightSideRef = React.useRef<HTMLDivElement>(null);\n\n const updateSideColumnWidth = React.useCallback(() => {\n const logoWidth = Math.ceil(logoRef.current?.getBoundingClientRect().width ?? 0);\n const rightSideWidth = rightSideRef.current\n ? getElementFlexContentWidth(rightSideRef.current)\n : 0;\n const maxSideWidth = Math.max(logoWidth, rightSideWidth);\n\n setSideColumnWidth(maxSideWidth \|\| undefined);\n }, []);\n\n const updateFloorSize = React.useCallback(() => {\n setIsSmallWidth(document.documentElement.clientWidth <= MOBILE_WIDTH);\n setIsThreeColumnStacked(document.documentElement.clientWidth <= THREE_COLUMN_DESKTOP_WIDTH);\n updateSideColumnWidth();\n }, [updateSideColumnWidth]);\n\n useResizeObserver({\n ref: DOCUMENT_ELEMENT_REF,\n onResize: updateFloorSize,\n });\n\n const menuContainerRef = React.useRef<HTMLDivElement>(null);\n const linksOverflowStrategy = copyright.linksOverflowStrategy \|\| 'dropdown';\n const isLinksOverflowDropdown = linksOverflowStrategy === 'dropdown';\n const {visibleItems, hiddenItems, measured} = useOverflowListItems({\n isDropdown: isLinksOverflowDropdown && !isSmallWidth,\n containerRef: menuContainerRef,\n items: copyright.links,\n itemSelector: `.${b('links-floor-item')}`,\n moreButtonWidth: 52,\n });\n const {shouldCenterLinks, threeColumnLayout, hasOnlyLinks} = useLinksAlignmentState(copyright);\n const hasLanguageSwitcher = Boolean(copyright.languageSwitcher);\n const hasCopyrightText = Boolean(copyright.copyrightText);\n const hasRightSideContent = hasLanguageSwitcher \|\| hasCopyrightText;\n const copyrightLogoImage = copyright.logo && getThemedValue(copyright.logo.image, theme);\n const copyrightLogoImageProps = useLogoImageProps(copyrightLogoImage);\n\n React.useEffect(() => {\n if (isThreeColumnStacked) {\n updateSideColumnWidth();\n }\n }, [updateSideColumnWidth, copyrightLogoImageProps, hasRightSideContent, isThreeColumnStacked]);\n\n const linksContent = (\n <div className={b('links-floor-left', {measured})} ref={menuContainerRef}>\n <VisibleLinks items={visibleItems} isLinksOverflowDropdown={isLinksOverflowDropdown} />\n <OverflowDropdown\n isLinksOverflowDropdown={isLinksOverflowDropdown}\n items={hiddenItems}\n />\n </div>\n );\n\n const sideColumnStyle = React.useMemo<React.CSSProperties \| undefined>(() => {\n if (!threeColumnLayout \|\| isThreeColumnStacked \|\| sideColumnWidth === undefined) {\n return undefined;\n }\n\n return {width: sideColumnWidth};\n }, [isThreeColumnStacked, sideColumnWidth, threeColumnLayout]);\n\n return (\n <Col sizes={{all: 12}} className={b('floor', {copyright: true})}>\n <div\n className={b('links-floor-inner', {\n centered: shouldCenterLinks,\n threeColumn: threeColumnLayout,\n overflow: linksOverflowStrategy,\n withLanguageSwitcher: hasLanguageSwitcher,\n hasOnlyLinks,\n })}\n >\n {copyright.logo && (\n <div className={b('links-floor-side')} style={sideColumnStyle}>\n <CopyrightLogo\n logo={copyright.logo}\n logoImageProps={copyrightLogoImageProps}\n logoRef={logoRef}\n />\n </div>\n )}\n {threeColumnLayout ? (\n <div className={b('links-floor-center')}>{linksContent}</div>\n ) : (\n linksContent\n )}\n {hasRightSideContent && (\n <RightSide\n copyright={copyright}\n rightSideRef={rightSideRef}\n style={sideColumnStyle}\n />\n )}\n </div>\n </Col>\n );\n};\n"]}
1	+ {"version":3,"file":"CopyrightFloor.js","sourceRoot":"../../../../../../src","sources":["blocks/Footer/components/CopyrightFloor/CopyrightFloor.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport {DropdownMenu, DropdownMenuItem, Link, useResizeObserver} from '@gravity-ui/uikit';\n\nimport {Image} from '../../../../components';\nimport {BREAKPOINTS} from '../../../../constants';\nimport {SSRContext} from '../../../../context/ssrContext';\nimport {useTheme} from '../../../../context/theme';\nimport {Col} from '../../../../grid';\nimport type {FooterBlockProps} from '../../../../models';\nimport {block, getThemedValue} from '../../../../utils';\nimport {useLogoImageProps} from '../../hooks/useLogoImageProps';\nimport {LinkItem, useOverflowListItems} from '../../hooks/useOverflowListItems';\nimport {LangSwitcher} from '../LangSwitcher';\n\nimport './CopyrightFloor.scss';\n\nconst b = block('footer-block');\n\nconst MOBILE_WIDTH = BREAKPOINTS.sm;\nconst THREE_COLUMN_DESKTOP_WIDTH = BREAKPOINTS.md;\n\ntype CopyrightFloorProps = {\n copyright: NonNullable<FooterBlockProps['copyright']>;\n};\n\nfunction getElementFlexContentWidth(element: HTMLElement) {\n const children = Array.from(element.children) as HTMLElement[];\n\n if (!children.length) {\n return element.scrollWidth;\n }\n\n const elementStyles = window.getComputedStyle(element);\n const columnGap = parseFloat(elementStyles.columnGap);\n const gap = Number.isNaN(columnGap) ? 0 : columnGap;\n // extra 1px to prevent overflow\n const childrenWidths = children.map((child) => child.scrollWidth + 1);\n\n if (elementStyles.flexDirection.startsWith('column')) {\n return Math.ceil(Math.max(...childrenWidths));\n }\n\n return Math.ceil(\n childrenWidths.reduce((sum, width) => sum + width, 0) + gap * (children.length - 1),\n );\n}\n\nfunction useLinksAlignmentState(copyright: CopyrightFloorProps['copyright']) {\n const hasOnlyLinks = Boolean(\n copyright.links?.length &&\n !copyright.logo &&\n !copyright.languageSwitcher &&\n !copyright.copyrightText,\n );\n const areLinksInTheMiddle = Boolean(\n copyright.logo &&\n copyright.links?.length &&\n (copyright.languageSwitcher \|\| copyright.copyrightText),\n );\n\n return {\n shouldCenterLinks: areLinksInTheMiddle \|\| hasOnlyLinks,\n threeColumnLayout: areLinksInTheMiddle,\n hasOnlyLinks,\n };\n}\n\ntype CopyrightLogoProps = {\n logo: CopyrightFloorProps['copyright']['logo'];\n logoImageProps: Record<string, unknown> \| null;\n logoRef?: React.RefObject<HTMLDivElement>;\n};\n\nconst CopyrightLogo = ({logo, logoImageProps, logoRef}: CopyrightLogoProps) => {\n if (!logo \|\| !logoImageProps) {\n return null;\n }\n\n return (\n <div className={b('logo')} ref={logoRef}>\n {logo.url ? (\n <Link href={logo.url}>\n <Image {...logoImageProps} alt={logo.alt ?? ''} className={b('logo-image')} />\n </Link>\n ) : (\n <Image {...logoImageProps} alt={logo.alt ?? ''} className={b('logo-image')} />\n )}\n </div>\n );\n};\n\ntype VisibleLinksProps = {\n items: LinkItem[];\n isLinksOverflowDropdown: boolean;\n};\n\nconst VisibleLinks = ({items, isLinksOverflowDropdown}: VisibleLinksProps) => {\n if (!items?.length) {\n return null;\n }\n\n return (\n <ul\n className={b('links-floor-list', {\n wrap: !isLinksOverflowDropdown,\n })}\n >\n {items.map((item, index) => (\n <li key={index} className={b('links-floor-item')}>\n <a href={item.url}>{item.text}</a>\n </li>\n ))}\n </ul>\n );\n};\n\ntype OverflowDropdownProps = {\n isLinksOverflowDropdown: boolean;\n items: DropdownMenuItem[];\n};\n\nconst OverflowDropdown = ({isLinksOverflowDropdown, items}: OverflowDropdownProps) => {\n if (!isLinksOverflowDropdown \|\| !items.length) {\n return null;\n }\n\n return (\n <DropdownMenu\n items={items}\n switcherWrapperClassName={b('more-button', {\n visible: isLinksOverflowDropdown && items.length > 0,\n })}\n size=\"l\"\n />\n );\n};\n\ntype RightSideProps = {\n copyright: CopyrightFloorProps['copyright'];\n rightSideRef: React.RefObject<HTMLDivElement>;\n style?: React.CSSProperties;\n};\n\nconst RightSide = ({copyright, rightSideRef, style}: RightSideProps) => {\n const theme = useTheme();\n\n return (\n <div className={b('links-floor-right')} ref={rightSideRef} style={style}>\n {copyright.languageSwitcher && (\n <LangSwitcher\n buttonText={copyright.languageSwitcher.buttonText}\n items={copyright.languageSwitcher.items}\n image={getThemedValue(copyright.languageSwitcher.image, theme)}\n />\n )}\n {copyright.copyrightText && (\n <span className={b('links-floor-copyright')}>{copyright.copyrightText}</span>\n )}\n </div>\n );\n};\n\nexport const CopyrightFloor = ({copyright}: CopyrightFloorProps) => {\n const theme = useTheme();\n const {isServer} = React.useContext(SSRContext);\n const [isSmallWidth, setIsSmallWidth] = React.useState(() => {\n return !isServer && document.documentElement.clientWidth <= MOBILE_WIDTH;\n });\n const [isThreeColumnStacked, setIsThreeColumnStacked] = React.useState(() => {\n return !isServer && document.documentElement.clientWidth <= THREE_COLUMN_DESKTOP_WIDTH;\n });\n const [sideColumnWidth, setSideColumnWidth] = React.useState<number>();\n const logoRef = React.useRef<HTMLDivElement>(null);\n const rightSideRef = React.useRef<HTMLDivElement>(null);\n const documentElementRef = React.useMemo(\n () => ({current: isServer ? null : document.documentElement}),\n [isServer],\n );\n\n const updateSideColumnWidth = React.useCallback(() => {\n const logoWidth = Math.ceil(logoRef.current?.getBoundingClientRect().width ?? 0);\n const rightSideWidth = rightSideRef.current\n ? getElementFlexContentWidth(rightSideRef.current)\n : 0;\n const maxSideWidth = Math.max(logoWidth, rightSideWidth);\n\n setSideColumnWidth(maxSideWidth \|\| undefined);\n }, []);\n\n const updateFloorSize = React.useCallback(() => {\n setIsSmallWidth(document.documentElement.clientWidth <= MOBILE_WIDTH);\n setIsThreeColumnStacked(document.documentElement.clientWidth <= THREE_COLUMN_DESKTOP_WIDTH);\n updateSideColumnWidth();\n }, [updateSideColumnWidth]);\n\n useResizeObserver({\n ref: documentElementRef,\n onResize: updateFloorSize,\n });\n\n const menuContainerRef = React.useRef<HTMLDivElement>(null);\n const linksOverflowStrategy = copyright.linksOverflowStrategy \|\| 'dropdown';\n const isLinksOverflowDropdown = linksOverflowStrategy === 'dropdown';\n const {visibleItems, hiddenItems, measured} = useOverflowListItems({\n isDropdown: isLinksOverflowDropdown && !isSmallWidth,\n containerRef: menuContainerRef,\n items: copyright.links,\n itemSelector: `.${b('links-floor-item')}`,\n moreButtonWidth: 52,\n });\n const {shouldCenterLinks, threeColumnLayout, hasOnlyLinks} = useLinksAlignmentState(copyright);\n const hasLanguageSwitcher = Boolean(copyright.languageSwitcher);\n const hasCopyrightText = Boolean(copyright.copyrightText);\n const hasRightSideContent = hasLanguageSwitcher \|\| hasCopyrightText;\n const copyrightLogoImage = copyright.logo && getThemedValue(copyright.logo.image, theme);\n const copyrightLogoImageProps = useLogoImageProps(copyrightLogoImage);\n\n React.useEffect(() => {\n if (isThreeColumnStacked) {\n updateSideColumnWidth();\n }\n }, [updateSideColumnWidth, copyrightLogoImageProps, hasRightSideContent, isThreeColumnStacked]);\n\n const linksContent = (\n <div className={b('links-floor-left', {measured})} ref={menuContainerRef}>\n <VisibleLinks items={visibleItems} isLinksOverflowDropdown={isLinksOverflowDropdown} />\n <OverflowDropdown\n isLinksOverflowDropdown={isLinksOverflowDropdown}\n items={hiddenItems}\n />\n </div>\n );\n\n const sideColumnStyle = React.useMemo<React.CSSProperties \| undefined>(() => {\n if (!threeColumnLayout \|\| isThreeColumnStacked \|\| sideColumnWidth === undefined) {\n return undefined;\n }\n\n return {width: sideColumnWidth};\n }, [isThreeColumnStacked, sideColumnWidth, threeColumnLayout]);\n\n return (\n <Col sizes={{all: 12}} className={b('floor', {copyright: true})}>\n <div\n className={b('links-floor-inner', {\n centered: shouldCenterLinks,\n threeColumn: threeColumnLayout,\n overflow: linksOverflowStrategy,\n withLanguageSwitcher: hasLanguageSwitcher,\n hasOnlyLinks,\n })}\n >\n {copyright.logo && (\n <div className={b('links-floor-side')} style={sideColumnStyle}>\n <CopyrightLogo\n logo={copyright.logo}\n logoImageProps={copyrightLogoImageProps}\n logoRef={logoRef}\n />\n </div>\n )}\n {threeColumnLayout ? (\n <div className={b('links-floor-center')}>{linksContent}</div>\n ) : (\n linksContent\n )}\n {hasRightSideContent && (\n <RightSide\n copyright={copyright}\n rightSideRef={rightSideRef}\n style={sideColumnStyle}\n />\n )}\n </div>\n </Col>\n );\n};\n"]}

package/build/esm/components/ReactPlayer/ReactPlayer.css CHANGED Viewed

@@ -18,50 +18,6 @@ unpredictable css rules order in build */
   top: 0;
   left: 0;
 }
-.pc-ReactPlayer__button {
-  display: inline-block;
-  margin: 0;
-  padding: 0;
-  font: inherit;
-  border: none;
-  outline: none;
-  color: inherit;
-  background: none;
-  cursor: pointer;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  position: absolute;
-  width: 64px;
-  height: 64px;
-  border-radius: 166px;
-}
-.pc-ReactPlayer__button:focus {
-  outline: 2px solid var(--g-color-line-focus);
-  outline-offset: 0;
-}
-.pc-ReactPlayer__button:focus:not(:focus-visible) {
-  outline: 0;
-}
-.pc-ReactPlayer__button_theme_blue {
-  color: var(--g-color-base-background);
-  background-color: var(--g-color-base-brand);
-}
-.pc-ReactPlayer__button_theme_grey {
-  color: var(--pc-text-header-color);
-  background-color: #eff2f8;
-}
-.pc-ReactPlayer__button_text {
-  padding: 16px 32px;
-  font-weight: 400;
-  font-size: 24px;
-  line-height: 32px;
-  width: auto;
-  height: auto;
-}
-.pc-ReactPlayer__icon {
-  margin-left: 1px;
-}
 .pc-ReactPlayer_controls_custom::before {
   display: none;
   position: absolute;
@@ -77,10 +33,4 @@ unpredictable css rules order in build */
 }
 .pc-ReactPlayer_auto-ratio video {
   object-fit: cover;
-}
-@media only screen and (max-width: 577px) {
-  .pc-ReactPlayer__button_text {
-    font-size: 20px;
-    line-height: 24px;
-  }
 }

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

@@ -1,7 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from 'react';
-import { PlayFill } from '@gravity-ui/icons';
-import { Icon } from '@gravity-ui/uikit';
 import debounce from "lodash/debounce.js";
 import _ReactPlayer from 'react-player';
 import { MobileContext } from "../../context/mobileContext/index.js";
@@ -9,8 +7,8 @@ import { VideoContext } from "../../context/videoContext/index.js";
 import { useAnalytics, useImageSize, useMount } from "../../hooks/index.js";
 import { CustomControlsButtonPositioning, CustomControlsType, DefaultEventNames, MediaVideoControlsType, PlayButtonThemes, PlayButtonType, PredefinedEventTypes, } from "../../models/index.js";
 import { block } from "../../utils/index.js";
+import VideoButton from "../VideoButton/VideoButton.js";
 import CustomBarControls from "./CustomBarControls.js";
-import { i18n } from "./i18n/index.js";
 import { checkYoutubeVideos } from "./utils.js";
 import { isYoutubePlayerInstance } from "./utils/youtube.js";
 import './ReactPlayer.css';
@@ -23,7 +21,6 @@ const ReactPlayer = 'default' in _ReactPlayer && _ReactPlayer.default
 export const ReactPlayerBlock = React.forwardRef((props, originRef) => {
     const isMobile = React.useContext(MobileContext);
     const { src, previewImgUrl, loop = false, controls = MediaVideoControlsType.Default, customControlsOptions = {}, muted: initiallyMuted = false, elapsedTime, playButton, className, customBarControlsClassName, showPreview, onClickPreview, onIntrinsicSizeChange, disableAutoSizing, analyticsEvents, height, ariaLabel, ratio, autoRatio, contain = true, } = props;
-    const { type = PlayButtonType.Default, theme = PlayButtonThemes.Blue, text, className: buttonClassName, } = playButton || {};
     const { type: customControlsType = CustomControlsType.WithMuteButton, muteButtonShown, positioning = CustomControlsButtonPositioning.Center, } = customControlsOptions;
     const autoPlay = Boolean(!isMobile && !previewImgUrl && props.autoplay);
     const mute = initiallyMuted || autoPlay;
@@ -126,18 +123,9 @@ export const ReactPlayerBlock = React.forwardRef((props, originRef) => {
     const playEvents = React.useMemo(() => eventsArray?.filter((e) => e.type === PredefinedEventTypes.Play), [eventsArray]);
     const stopEvents = React.useMemo(() => eventsArray?.filter((e) => e.type === PredefinedEventTypes.Stop), [eventsArray]);
     const playIcon = React.useMemo(() => {
-        let playButtonContent;
-        switch (type) {
-            case PlayButtonType.Text:
-                playButtonContent = text;
-                break;
-            case PlayButtonType.Default:
-            default:
-                playButtonContent = _jsx(Icon, { className: b('icon'), data: PlayFill, size: 24 });
-                break;
-        }
-        return (_jsx("button", { className: b('button', { theme, text: Boolean(text) }, buttonClassName), "aria-label": i18n('play'), ref: buttonRef, children: playButtonContent }));
-    }, [type, theme, text, buttonClassName]);
+        const { theme, type } = playButton || {};
+        return (_jsx(VideoButton, { ...playButton, theme: theme || PlayButtonThemes.Blue, type: type || PlayButtonType.Default }));
+    }, [playButton]);
     const changeMute = React.useCallback((isMuted) => {
         if (isMuted &&
             playerRef &&

package/build/esm/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';\nimport type {ReactPlayerProps} from 'react-player';\n\nimport {MobileContext} from '../../context/mobileContext';\nimport {VideoContext} from '../../context/videoContext';\nimport {useAnalytics, useImageSize, 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, 'src' \| 'ref'>,\n ClassNameProps {\n src: string \| string[];\n previewImgUrl?: string;\n customBarControlsClassName?: string;\n showPreview?: boolean;\n onClickPreview?: () => void;\n height?: number;\n ratio?: number;\n autoRatio?: boolean;\n disableAutoSizing?: boolean;\n onIntrinsicSizeChange?: (size: {width: number; height: number}) => void;\n children?: React.ReactNode;\n}\n\ninterface PlayerPropgress {\n played: number;\n playedSeconds: 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 onIntrinsicSizeChange,\n disableAutoSizing,\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 [duration, setDuration] = React.useState<null \| number>(null);\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 {imageRef: previewImgRef, onLoad: onPreviewImgLoad} = useImageSize({\n onIntrinsicSizeChange,\n });\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 if (disableAutoSizing) {\n return;\n }\n\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 // eslint-disable-next-line consistent-return\n return () => {\n window.removeEventListener('resize', updateSize);\n };\n }, [actualRatio, autoRatio, disableAutoSizing, playerRef, 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(\n (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 onIntrinsicSizeChange?.({width: videoWidth, height: videoHeight});\n }\n },\n [onIntrinsicSizeChange],\n );\n\n const onProgress: ReactPlayerProps['onProgress'] = React.useCallback(\n ({played, playedSeconds}: PlayerPropgress) => {\n setPlayedPercent(played);\n\n if (loop) {\n const {start = 0, end = duration} = typeof loop === 'boolean' ? {} : loop;\n\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 (end !== null && playedSeconds >= end) {\n setIsPlaying(true);\n playerRef?.seekTo(start);\n }\n }\n\n if (played === 1) {\n setMuted(true);\n }\n },\n [duration, loop, playerRef],\n );\n\n const onDuration = React.useCallback((currentDuration: number) => {\n setDuration(currentDuration);\n }, []);\n\n const onEnded = React.useCallback(() => {\n setEnded(true);\n }, []);\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={\n previewImgUrl && (\n <img\n className={b('preview-img')}\n src={previewImgUrl}\n onLoad={onPreviewImgLoad}\n alt=\"\"\n aria-hidden={true}\n ref={previewImgRef}\n />\n )\n }\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 onDuration={onDuration}\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 debounce from 'lodash/debounce';\nimport _ReactPlayer from 'react-player';\nimport type {ReactPlayerProps} from 'react-player';\n\nimport {MobileContext} from '../../context/mobileContext';\nimport {VideoContext} from '../../context/videoContext';\nimport {useAnalytics, useImageSize, useMount} from '../../hooks';\nimport {\n AnalyticsEvent,\n ClassNameProps,\n CustomControlsButtonPositioning,\n CustomControlsType,\n DefaultEventNames,\n MediaVideoControlsType,\n MediaVideoProps,\n PlayButtonThemes,\n PlayButtonType,\n PredefinedEventTypes,\n ReactPlayerBlockHandler,\n} from '../../models';\nimport {block} from '../../utils';\nimport VideoButton from '../VideoButton/VideoButton';\n\nimport CustomBarControls from './CustomBarControls';\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, 'src' \| 'ref'>,\n ClassNameProps {\n src: string \| string[];\n previewImgUrl?: string;\n customBarControlsClassName?: string;\n showPreview?: boolean;\n onClickPreview?: () => void;\n height?: number;\n ratio?: number;\n autoRatio?: boolean;\n disableAutoSizing?: boolean;\n onIntrinsicSizeChange?: (size: {width: number; height: number}) => void;\n children?: React.ReactNode;\n}\n\ninterface PlayerPropgress {\n played: number;\n playedSeconds: 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 onIntrinsicSizeChange,\n disableAutoSizing,\n analyticsEvents,\n height,\n ariaLabel,\n ratio,\n autoRatio,\n contain = true,\n } = props;\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 [duration, setDuration] = React.useState<null \| number>(null);\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 {imageRef: previewImgRef, onLoad: onPreviewImgLoad} = useImageSize({\n onIntrinsicSizeChange,\n });\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 if (disableAutoSizing) {\n return;\n }\n\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 // eslint-disable-next-line consistent-return\n return () => {\n window.removeEventListener('resize', updateSize);\n };\n }, [actualRatio, autoRatio, disableAutoSizing, playerRef, 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 const {theme, type} = playButton \|\| {};\n return (\n <VideoButton\n {...playButton}\n theme={theme \|\| PlayButtonThemes.Blue}\n type={type \|\| PlayButtonType.Default}\n />\n );\n }, [playButton]);\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(\n (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 onIntrinsicSizeChange?.({width: videoWidth, height: videoHeight});\n }\n },\n [onIntrinsicSizeChange],\n );\n\n const onProgress: ReactPlayerProps['onProgress'] = React.useCallback(\n ({played, playedSeconds}: PlayerPropgress) => {\n setPlayedPercent(played);\n\n if (loop) {\n const {start = 0, end = duration} = typeof loop === 'boolean' ? {} : loop;\n\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 (end !== null && playedSeconds >= end) {\n setIsPlaying(true);\n playerRef?.seekTo(start);\n }\n }\n\n if (played === 1) {\n setMuted(true);\n }\n },\n [duration, loop, playerRef],\n );\n\n const onDuration = React.useCallback((currentDuration: number) => {\n setDuration(currentDuration);\n }, []);\n\n const onEnded = React.useCallback(() => {\n setEnded(true);\n }, []);\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={\n previewImgUrl && (\n <img\n className={b('preview-img')}\n src={previewImgUrl}\n onLoad={onPreviewImgLoad}\n alt=\"\"\n aria-hidden={true}\n ref={previewImgRef}\n />\n )\n }\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 onDuration={onDuration}\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"]}