@gravity-ui/page-constructor 5.33.4-beta.0 → 5.34.0

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

@@ -1,53 +1,52 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import * as React from 'react';
+import React, { Fragment, useCallback, useContext, useEffect, useImperativeHandle, useMemo, useRef, useState, } from 'react';
 import { PlayFill } from '@gravity-ui/icons';
 import { Icon } from '@gravity-ui/uikit';
 import debounce from 'lodash/debounce';
 import ReactPlayer from 'react-player';
-import { MobileContext } from "../../context/mobileContext/index.js";
-import { VideoContext } from "../../context/videoContext/index.js";
-import { useAnalytics, useMount } from "../../hooks/index.js";
-import { CustomControlsButtonPositioning, CustomControlsType, DefaultEventNames, MediaVideoControlsType, PlayButtonThemes, PlayButtonType, PredefinedEventTypes, } from "../../models/index.js";
-import { block } from "../../utils/index.js";
-import CustomBarControls from "./CustomBarControls.js";
-import { i18n } from "./i18n/index.js";
-import { checkYoutubeVideos } from "./utils.js";
-import { isYoutubePlayerInstance } from "./utils/youtube.js";
+import { MobileContext } from '../../context/mobileContext';
+import { VideoContext } from '../../context/videoContext';
+import { useAnalytics, useMount } from '../../hooks';
+import { CustomControlsButtonPositioning, CustomControlsType, DefaultEventNames, MediaVideoControlsType, PlayButtonThemes, PlayButtonType, PredefinedEventTypes, } from '../../models';
+import { block } from '../../utils';
+import CustomBarControls from './CustomBarControls';
+import { i18n } from './i18n';
+import { checkYoutubeVideos } from './utils';
+import { isYoutubePlayerInstance } from './utils/youtube';
 import './ReactPlayer.css';
 const b = block('ReactPlayer');
 const FPS = 60;
 // eslint-disable-next-line react/display-name
 export const ReactPlayerBlock = React.forwardRef((props, originRef) => {
-    const isMobile = React.useContext(MobileContext);
+    const isMobile = useContext(MobileContext);
     const { src, previewImgUrl, loop = false, controls = MediaVideoControlsType.Default, customControlsOptions = {}, muted: initiallyMuted = false, elapsedTime, playButton, className, customBarControlsClassName, showPreview, onClickPreview, 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;
-    const { playingVideoRef, setProps } = React.useContext(VideoContext);
-    const ref = React.useRef(null);
-    const buttonRef = React.useRef(null);
-    const [playerRef, setPlayerRef] = React.useState();
-    const [isPlaying, setIsPlaying] = React.useState(autoPlay);
-    const [playedPercent, setPlayedPercent] = React.useState(0);
-    const [currentHeight, setCurrentHeight] = React.useState(height);
-    const [width, setWidth] = React.useState(0);
-    const [actualRatio, setActualRatio] = React.useState();
-    const [muted, setMuted] = React.useState(mute);
-    const [started, setStarted] = React.useState(autoPlay);
-    const [ended, setEnded] = React.useState(false);
-    const [isMounted, setIsMounted] = React.useState(false);
-    const [hovered, setHovered] = React.useState(isMobile);
+    const { playingVideoRef, setProps } = useContext(VideoContext);
+    const ref = useRef(null);
+    const buttonRef = useRef(null);
+    const [playerRef, setPlayerRef] = useState();
+    const [isPlaying, setIsPlaying] = useState(autoPlay);
+    const [playedPercent, setPlayedPercent] = useState(0);
+    const [currentHeight, setCurrentHeight] = useState(height);
+    const [width, setWidth] = useState(0);
+    const [actualRatio, setActualRatio] = useState();
+    const [muted, setMuted] = useState(mute);
+    const [started, setStarted] = useState(autoPlay);
+    const [ended, setEnded] = useState(false);
+    const [isMounted, setIsMounted] = useState(false);
+    const [hovered, setHovered] = useState(isMobile);
     useMount(() => setIsMounted(true));
-    const videoSrc = React.useMemo(() => checkYoutubeVideos(src), [src]);
-    const eventsArray = React.useMemo(() => {
+    const videoSrc = useMemo(() => checkYoutubeVideos(src), [src]);
+    const eventsArray = useMemo(() => {
         if (analyticsEvents) {
             return Array.isArray(analyticsEvents) ? analyticsEvents : [analyticsEvents];
         }
         return [];
     }, [analyticsEvents]);
     const handleAnalytics = useAnalytics(DefaultEventNames.ReactPlayerControls);
-    React.useImperativeHandle(originRef, () => {
+    useImperativeHandle(originRef, () => {
         if (!playerRef) {
             return;
         }
@@ -67,33 +66,33 @@ export const ReactPlayerBlock = React.forwardRef((props, originRef) => {
             addEventListener: addEventListener.bind(videoInstance),
         };
     }, [playerRef]);
-    React.useEffect(() => {
+    useEffect(() => {
         if (ref.current && !(playingVideoRef === null || playingVideoRef === void 0 ? void 0 : playingVideoRef.contains(ref.current))) {
             setMuted(true);
         }
     }, [playingVideoRef]);
-    React.useEffect(() => {
+    useEffect(() => {
         if (showPreview) {
             playerRef === null || playerRef === void 0 ? void 0 : playerRef.showPreview();
         }
     }, [showPreview, playerRef]);
-    React.useEffect(() => {
+    useEffect(() => {
         if (playerRef && !started) {
             setIsPlaying(autoPlay);
         }
     }, [autoPlay, playerRef, started]);
-    React.useEffect(() => setMuted(mute), [mute]);
-    React.useEffect(() => {
+    useEffect(() => setMuted(mute), [mute]);
+    useEffect(() => {
         if (!started && isPlaying) {
             setStarted(true);
         }
     }, [isPlaying, started]);
-    React.useEffect(() => {
+    useEffect(() => {
         if (started && !Number.isNaN(Number(elapsedTime))) {
             playerRef === null || playerRef === void 0 ? void 0 : playerRef.seekTo(elapsedTime !== null && elapsedTime !== void 0 ? elapsedTime : 0, 'seconds');
         }
     }, [elapsedTime, playerRef, started]);
-    React.useEffect(() => {
+    useEffect(() => {
         const updateSize = debounce(() => {
             if (ref.current) {
                 // We need to get parent's width does not equal 0
@@ -112,9 +111,9 @@ export const 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 === PredefinedEventTypes.Play), [eventsArray]);
-    const stopEvents = React.useMemo(() => eventsArray === null || eventsArray === void 0 ? void 0 : eventsArray.filter((e) => e.type === PredefinedEventTypes.Stop), [eventsArray]);
-    const playIcon = React.useMemo(() => {
+    const playEvents = useMemo(() => eventsArray === null || eventsArray === void 0 ? void 0 : eventsArray.filter((e) => e.type === PredefinedEventTypes.Play), [eventsArray]);
+    const stopEvents = useMemo(() => eventsArray === null || eventsArray === void 0 ? void 0 : eventsArray.filter((e) => e.type === PredefinedEventTypes.Stop), [eventsArray]);
+    const playIcon = useMemo(() => {
         let playButtonContent;
         switch (type) {
             case PlayButtonType.Text:
@@ -122,12 +121,12 @@ export const ReactPlayerBlock = React.forwardRef((props, originRef) => {
                 break;
             case PlayButtonType.Default:
             default:
-                playButtonContent = _jsx(Icon, { className: b('icon'), data: PlayFill, size: 24 });
+                playButtonContent = React.createElement(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 }));
+        return (React.createElement("button", { className: b('button', { theme, text: Boolean(text) }, buttonClassName), "aria-label": i18n('play'), ref: buttonRef }, playButtonContent));
     }, [type, theme, text, buttonClassName]);
-    const changeMute = React.useCallback((isMuted) => {
+    const changeMute = useCallback((isMuted) => {
         if (isMuted &&
             playerRef &&
             controls === MediaVideoControlsType.Custom &&
@@ -151,24 +150,24 @@ export const ReactPlayerBlock = React.forwardRef((props, originRef) => {
         setProps,
         controls,
     ]);
-    const handleClickPreview = React.useCallback(() => {
+    const handleClickPreview = useCallback(() => {
         setIsPlaying(true);
         onClickPreview === null || onClickPreview === void 0 ? void 0 : onClickPreview();
         handleAnalytics(playEvents);
     }, [onClickPreview, handleAnalytics, playEvents]);
-    const onPause = React.useCallback(() => {
+    const onPause = useCallback(() => {
         // For support correct state for youtube
         if (controls !== MediaVideoControlsType.Custom ||
             customControlsType !== CustomControlsType.WithMuteButton) {
             setIsPlaying(false);
         }
     }, [controls, customControlsType]);
-    const onStart = React.useCallback(() => {
+    const onStart = useCallback(() => {
         if (!autoPlay && !initiallyMuted) {
             setMuted(false);
         }
     }, [autoPlay, initiallyMuted]);
-    const onPlay = React.useCallback(() => {
+    const onPlay = useCallback(() => {
         setIsPlaying(true);
         if (controls === MediaVideoControlsType.Custom &&
             customControlsType === CustomControlsType.WithMuteButton) {
@@ -181,7 +180,7 @@ export const ReactPlayerBlock = React.forwardRef((props, originRef) => {
             setEnded(false);
         }
     }, [changeMute, controls, customControlsType, ended, isPlaying, muted]);
-    const onReady = React.useCallback((player) => {
+    const onReady = useCallback((player) => {
         setPlayerRef(player);
         const videoElement = player.getInternalPlayer();
         const videoWidth = videoElement.videoWidth;
@@ -190,13 +189,13 @@ export const ReactPlayerBlock = React.forwardRef((props, originRef) => {
             setActualRatio(videoHeight / videoWidth);
         }
     }, []);
-    const onProgress = React.useCallback((progress) => {
+    const onProgress = useCallback((progress) => {
         setPlayedPercent(progress.played);
         if (progress.played === 1) {
             setMuted(true);
         }
     }, []);
-    const onEnded = React.useCallback(() => {
+    const onEnded = useCallback(() => {
         // Youtube videos not muted after finishing playing and start again.
         // 'onEnded' does not fire when 'loop' is set to true.
         // It is custom loop with muted sound after finishing playing and start again.
@@ -207,7 +206,7 @@ export const ReactPlayerBlock = React.forwardRef((props, originRef) => {
         }
         setEnded(true);
     }, [loop, playerRef]);
-    const onPlayClick = React.useCallback(() => {
+    const onPlayClick = useCallback(() => {
         if (isPlaying) {
             onPause();
         }
@@ -215,7 +214,7 @@ export const ReactPlayerBlock = React.forwardRef((props, originRef) => {
             onPlay();
         }
     }, [isPlaying, onPlay, onPause]);
-    const handleClick = React.useCallback(() => {
+    const handleClick = useCallback(() => {
         var _a;
         (_a = buttonRef.current) === null || _a === void 0 ? void 0 : _a.click();
         if (controls === MediaVideoControlsType.Custom) {
@@ -227,37 +226,39 @@ export const ReactPlayerBlock = React.forwardRef((props, originRef) => {
             }
         }
     }, [controls, customControlsType, changeMute, muted, onPlayClick]);
-    const handleKeyDown = React.useCallback((e) => {
+    const handleKeyDown = useCallback((e) => {
         var _a;
         const key = e.key.toLowerCase();
         if (key === 'enter') {
             (_a = buttonRef.current) === null || _a === void 0 ? void 0 : _a.click();
         }
     }, []);
-    const onFocusIn = React.useCallback(() => setHovered(true), []);
-    const onFocusOut = React.useCallback(() => setHovered(false), []);
-    return (_jsx("div", { className: b({
+    const onFocusIn = useCallback(() => setHovered(true), []);
+    const onFocusOut = useCallback(() => setHovered(false), []);
+    return (React.createElement("div", { className: b({
             wrapper: !currentHeight,
             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 ? (_jsxs(React.Fragment, { children: [_jsx(ReactPlayer, { className: b('player'), url: videoSrc, muted: muted, controls: controls === 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 !== CustomControlsType.WithMuteButton
-                        ? undefined
-                        : onPause, onProgress: onProgress, onEnded: onEnded, "aria-label": ariaLabel, previewTabIndex: -1, config: {
-                        file: {
-                            attributes: {
-                                pip: isMobile ? 'false' : undefined,
-                                playsinline: isMobile ? '' : undefined,
-                                disablepictureinpicture: isMobile ? '' : undefined,
-                            },
-                        },
-                    } }), controls === MediaVideoControlsType.Custom && (_jsx(CustomBarControls, { className: customBarControlsClassName, mute: {
-                        isMuted: muted,
-                        changeMute: (event) => {
-                            event.stopPropagation();
-                            changeMute(muted);
-                        },
-                    }, elapsedTimePercent: playedPercent, type: customControlsType, isPaused: !isPlaying, onPlayClick: onPlayClick, muteButtonShown: muteButtonShown, shown: hovered && ((!started && !previewImgUrl) || started), positioning: positioning }))] })) : null }));
+        }, className), ref: ref, onClick: handleClick, onMouseEnter: onFocusIn, onMouseLeave: onFocusOut, onFocus: onFocusIn, onBlur: onFocusOut, onKeyDown: handleKeyDown, role: "button", tabIndex: 0 }, isMounted ? (React.createElement(Fragment, null,
+        React.createElement(ReactPlayer, { className: b('player'), url: videoSrc, muted: muted, controls: controls === 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 !== CustomControlsType.WithMuteButton
+                ? undefined
+                : onPause, onProgress: onProgress, onEnded: onEnded, "aria-label": ariaLabel, previewTabIndex: -1, config: {
+                file: {
+                    attributes: {
+                        pip: isMobile ? 'false' : undefined,
+                        playsinline: isMobile ? '' : undefined,
+                        disablepictureinpicture: isMobile ? '' : undefined,
+                    },
+                },
+            } }),
+        controls === MediaVideoControlsType.Custom && (React.createElement(CustomBarControls, { className: customBarControlsClassName, mute: {
+                isMuted: muted,
+                changeMute: (event) => {
+                    event.stopPropagation();
+                    changeMute(muted);
+                },
+            }, elapsedTimePercent: playedPercent, type: customControlsType, isPaused: !isPlaying, onPlayClick: onPlayClick, muteButtonShown: muteButtonShown, shown: hovered && ((!started && !previewImgUrl) || started), positioning: positioning })))) : null));
 });
 function getHeight(width, ratio = 9 / 16) {
     return width * ratio;
@@ -270,4 +271,3 @@ function getParentElement(element) {
     return parentElement.offsetWidth ? parentElement : getParentElement(parentElement);
 }
 export default ReactPlayerBlock;
-//# sourceMappingURL=ReactPlayer.js.map

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

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

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

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

package/build/esm/components/ReactPlayer/utils/youtube.js

@@ -1,4 +1,3 @@
 export const isYoutubePlayerInstance = (playerInstance) => {
     return Boolean(playerInstance['pauseVideo'] && playerInstance['playVideo']);
 };
-//# sourceMappingURL=youtube.js.map

package/build/esm/components/ReactPlayer/utils.js

@@ -18,4 +18,3 @@ export const checkYoutubeVideos = (src) => {
     }
     return transformYoutubeUrl(src);
 };
-//# sourceMappingURL=utils.js.map

package/build/esm/components/RootCn/index.d.ts

@@ -1,4 +1,4 @@
-import * as React from 'react';
-import { ClassNameProps } from "../../models/index.js";
-declare const RootCn: ({ className, children }: React.PropsWithChildren<ClassNameProps>) => import("react/jsx-runtime").JSX.Element;
+import { PropsWithChildren } from 'react';
+import { ClassNameProps } from '../../models';
+declare const RootCn: ({ className, children }: PropsWithChildren<ClassNameProps>) => JSX.Element;
 export default RootCn;

package/build/esm/components/RootCn/index.js

@@ -1,9 +1,8 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useTheme } from "../../context/theme/index.js";
-import { rootCn } from "../../utils/index.js";
+import React from 'react';
+import { useTheme } from '../../context/theme';
+import { rootCn } from '../../utils';
 const RootCn = ({ className, children }) => {
     const theme = useTheme();
-    return _jsx("div", { className: rootCn({ theme }, className), children: children });
+    return React.createElement("div", { className: rootCn({ theme }, className) }, children);
 };
 export default RootCn;
-//# sourceMappingURL=index.js.map

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

@@ -1,7 +1,7 @@
-import * as React from 'react';
+import React from 'react';
 export interface RouterLinkProps {
     href: string;
     [key: string]: unknown;
 }
-declare const RouterLink: ({ href, children }: React.PropsWithChildren<RouterLinkProps>) => import("react/jsx-runtime").JSX.Element;
+declare const RouterLink: ({ href, children }: React.PropsWithChildren<RouterLinkProps>) => JSX.Element;
 export default RouterLink;

package/build/esm/components/RouterLink/RouterLink.js

@@ -1,9 +1,7 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import * as React from 'react';
-import { LocationContext } from "../../context/locationContext/index.js";
+import React, { Fragment, useContext } from 'react';
+import { LocationContext } from '../../context/locationContext';
 const RouterLink = ({ href, children }) => {
-    const { Link } = React.useContext(LocationContext);
-    return Link ? _jsx(Link, { href: href, children: children }) : _jsx(React.Fragment, { children: children });
+    const { Link } = useContext(LocationContext);
+    return Link ? React.createElement(Link, { href: href }, children) : React.createElement(Fragment, null, children);
 };
 export default RouterLink;
-//# sourceMappingURL=RouterLink.js.map

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

@@ -1,8 +1,8 @@
-import * as React from 'react';
-import { ClassNameProps, TableProps } from "../../models/index.js";
+import React from 'react';
+import { ClassNameProps, TableProps } from '../../models';
 import './Table.css';
 export default class Table extends React.Component<TableProps & ClassNameProps> {
-    render(): import("react/jsx-runtime").JSX.Element | null;
+    render(): JSX.Element | null;
     private renderTable;
     private renderMarker;
     private renderLegend;

package/build/esm/components/Table/Table.js

@@ -1,9 +1,8 @@
-import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
-import * as React from 'react';
+import React from 'react';
 import { Check, Minus } from '@gravity-ui/icons';
 import { Icon } from '@gravity-ui/uikit';
-import { HTML, YFMWrapper } from "../index.js";
-import { block } from "../../utils/index.js";
+import { HTML, YFMWrapper } from '../';
+import { block } from '../../utils';
 import './Table.css';
 function getMarkerId(index) {
     if (isNaN(index)) {
@@ -18,20 +17,23 @@ export default class Table extends React.Component {
         if (!content || !content.length || !content[0].length) {
             return null;
         }
-        return (_jsxs("div", { className: b(null, className), role: 'table', "aria-label": caption, children: [this.renderTable(content, marker, legend), legend && !hideLegend && this.renderLegend(legend, marker)] }));
+        return (React.createElement("div", { className: b(null, className), role: 'table', "aria-label": caption },
+            this.renderTable(content, marker, legend),
+            legend && !hideLegend && this.renderLegend(legend, marker)));
     }
     renderTable(content, marker, legend) {
         const justify = this.getDefaultJustify(content, this.props.justify);
-        return (_jsx("div", { className: b('table'), role: 'rowgroup', children: content.map((row, i) => (_jsx("div", { className: b('row'), role: 'row', children: row.map((cell, j) => (_jsx("div", { className: b('cell', { justify: justify[j] }), role: 'cell', children: legend && i && j ? (this.renderMarker(marker, cell)) : (_jsx(HTML, { children: cell })) }, j))) }, i))) }));
+        return (React.createElement("div", { className: b('table'), role: 'rowgroup' }, content.map((row, i) => (React.createElement("div", { key: i, className: b('row'), role: 'row' }, row.map((cell, j) => (React.createElement("div", { key: j, className: b('cell', { justify: justify[j] }), role: 'cell' }, legend && i && j ? (this.renderMarker(marker, cell)) : (React.createElement(HTML, null, cell))))))))));
     }
     renderMarker(type, cell) {
-        return (_jsx("div", { "aria-labelledby": getMarkerId(Number(cell)), className: b('marker', { type, index: String(cell) }), children: type === 'tick' ? (_jsx(Icon, { size: 20, className: b('marker_tick', { check: Number(cell) === 1 }), data: Number(cell) === 1 ? Check : Minus })) : null }));
+        return (React.createElement("div", { "aria-labelledby": getMarkerId(Number(cell)), className: b('marker', { type, index: String(cell) }) }, type === 'tick' ? (React.createElement(Icon, { size: 20, className: b('marker_tick', { check: Number(cell) === 1 }), data: Number(cell) === 1 ? Check : Minus })) : null));
     }
     renderLegend(legend, marker) {
-        return (_jsx("div", { className: b('legend'), children: legend.map((item, index) => (_jsxs("div", { className: b('legend-item'), children: [this.renderMarker(marker, String(index)), _jsx(YFMWrapper, { className: b('legent-item-text'), content: item, modifiers: { constructor: true }, id: getMarkerId(index) })] }, item))) }));
+        return (React.createElement("div", { className: b('legend') }, legend.map((item, index) => (React.createElement("div", { key: item, className: b('legend-item') },
+            this.renderMarker(marker, String(index)),
+            React.createElement(YFMWrapper, { className: b('legent-item-text'), content: item, modifiers: { constructor: true }, id: getMarkerId(index) }))))));
     }
     getDefaultJustify(content, justify) {
         return justify || new Array(content[0].length).fill('center');
     }
 }
-//# sourceMappingURL=Table.js.map

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

@@ -1,9 +1,9 @@
-import { GridColumnSizesType } from "../../grid/index.js";
-import { ClassNameProps, TitleProps as TitleParams } from "../../models/index.js";
+import { GridColumnSizesType } from '../../grid';
+import { ClassNameProps, TitleProps as TitleParams } from '../../models';
 import './Title.css';
 export interface TitleProps extends TitleParams {
     colSizes?: GridColumnSizesType;
     id?: string;
 }
-declare const Title: ({ title, subtitle, className, colSizes, id, }: TitleProps & ClassNameProps) => import("react/jsx-runtime").JSX.Element | null;
+declare const Title: ({ title, subtitle, className, colSizes, id, }: TitleProps & ClassNameProps) => JSX.Element | null;
 export default Title;

package/build/esm/components/Title/Title.js

@@ -1,9 +1,9 @@
 import { __rest } from "tslib";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Col } from "../../grid/index.js";
-import { block } from "../../utils/index.js";
-import YFMWrapper from "../YFMWrapper/YFMWrapper.js";
-import TitleItem from "./TitleItem.js";
+import React from 'react';
+import { Col } from '../../grid';
+import { block } from '../../utils';
+import YFMWrapper from '../YFMWrapper/YFMWrapper';
+import TitleItem from './TitleItem';
 import './Title.css';
 const b = block('title');
 const Title = ({ title, subtitle, className, colSizes = { all: 12, sm: 8 }, id, }) => {
@@ -11,7 +11,11 @@ const Title = ({ title, subtitle, className, colSizes = { all: 12, sm: 8 }, id,
         return null;
     }
     const _a = !title || typeof title === 'string' ? { text: title } : title, { text } = _a, titleProps = __rest(_a, ["text"]);
-    return (_jsxs("div", { className: b(null, className), id: id, children: [text && (_jsx(Col, { reset: true, sizes: colSizes, children: _jsx(TitleItem, Object.assign({ text: text }, titleProps)) })), subtitle && (_jsx(Col, { reset: true, sizes: colSizes, children: _jsx("div", { className: b('description', { titleSize: titleProps === null || titleProps === void 0 ? void 0 : titleProps.textSize }), children: _jsx(YFMWrapper, { content: subtitle, modifiers: { constructor: true } }) }) }))] }));
+    return (React.createElement("div", { className: b(null, className), id: id },
+        text && (React.createElement(Col, { reset: true, sizes: colSizes },
+            React.createElement(TitleItem, Object.assign({ text: text }, titleProps)))),
+        subtitle && (React.createElement(Col, { reset: true, sizes: colSizes },
+            React.createElement("div", { className: b('description', { titleSize: titleProps === null || titleProps === void 0 ? void 0 : titleProps.textSize }) },
+                React.createElement(YFMWrapper, { content: subtitle, modifiers: { constructor: true } }))))));
 };
 export default Title;
-//# sourceMappingURL=Title.js.map

package/build/esm/components/Title/TitleItem.d.ts

@@ -1,4 +1,4 @@
-import { QAProps, TextSize, TitleItemProps } from "../../models/index.js";
+import { QAProps, TextSize, TitleItemProps } from '../../models';
 import './TitleItem.css';
 export declare function getArrowSize(size: TextSize, isMobile: boolean): 16 | 20 | 24 | 13 | 22 | 26 | 38;
 export interface TitleItemFullProps extends TitleItemProps, QAProps {
@@ -6,5 +6,5 @@ export interface TitleItemFullProps extends TitleItemProps, QAProps {
     onClick?: () => void;
     resetMargin?: boolean;
 }
-declare const TitleItem: (props: TitleItemFullProps) => import("react/jsx-runtime").JSX.Element;
+declare const TitleItem: (props: TitleItemFullProps) => JSX.Element;
 export default TitleItem;

package/build/esm/components/Title/TitleItem.js

@@ -1,10 +1,9 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import * as React from 'react';
-import { HTML, ToggleArrow } from "../index.js";
-import { LocationContext } from "../../context/locationContext/index.js";
-import { MobileContext } from "../../context/mobileContext/index.js";
-import { block, getHeaderTag, getLinkProps } from "../../utils/index.js";
-import Anchor from "../Anchor/Anchor.js";
+import React, { Fragment, useContext } from 'react';
+import { HTML, ToggleArrow } from '../';
+import { LocationContext } from '../../context/locationContext';
+import { MobileContext } from '../../context/mobileContext';
+import { block, getHeaderTag, getLinkProps } from '../../utils';
+import Anchor from '../Anchor/Anchor';
 import './TitleItem.css';
 const b = block('title-item');
 export function getArrowSize(size, isMobile) {
@@ -22,25 +21,33 @@ export function getArrowSize(size, isMobile) {
     }
 }
 const TitleItem = (props) => {
-    const isMobile = React.useContext(MobileContext);
+    const isMobile = useContext(MobileContext);
     const { textSize = 'm', text, anchor, justify, url, onClick, custom, className, qa, resetMargin = true, urlTitle, } = props;
-    const { hostname } = React.useContext(LocationContext);
-    const textMarkup = (_jsxs(React.Fragment, { children: [_jsx(HTML, { className: b('text'), children: text }), custom && (_jsxs(React.Fragment, { children: ["\u00A0", _jsx("span", { className: b('custom'), children: custom })] }))] }));
+    const { hostname } = useContext(LocationContext);
+    const textMarkup = (React.createElement(React.Fragment, null,
+        React.createElement(HTML, { className: b('text') }, text),
+        custom && (React.createElement(React.Fragment, null,
+            "\u00A0",
+            React.createElement("span", { className: b('custom') }, custom)))));
     let content;
-    const insideClickableContent = (_jsxs("span", { className: b('wrapper'), children: [textMarkup, "\u00A0", _jsx(ToggleArrow, { className: b('arrow', { size: textSize }), size: getArrowSize(textSize, isMobile), type: 'horizontal', iconType: "navigation", open: false })] }));
+    const insideClickableContent = (React.createElement("span", { className: b('wrapper') },
+        textMarkup,
+        "\u00A0",
+        React.createElement(ToggleArrow, { className: b('arrow', { size: textSize }), size: getArrowSize(textSize, isMobile), type: 'horizontal', iconType: "navigation", open: false })));
     if (!url && !onClick) {
         content = textMarkup;
     }
     else if (url) {
-        content = (_jsx("a", Object.assign({ className: b('link'), href: url }, getLinkProps(url, hostname), { onClick: onClick, title: urlTitle, children: insideClickableContent })));
+        content = (React.createElement("a", Object.assign({ className: b('link'), href: url }, getLinkProps(url, hostname), { onClick: onClick, title: urlTitle }), insideClickableContent));
     }
     else if (onClick) {
-        content = (_jsx("button", { className: b('link'), onClick: onClick, title: urlTitle, children: insideClickableContent }));
+        content = (React.createElement("button", { className: b('link'), onClick: onClick, title: urlTitle }, insideClickableContent));
     }
-    return (_jsxs(React.Fragment, { children: [anchor && _jsx(Anchor, { id: anchor, className: b('anchor') }), React.createElement(getHeaderTag(textSize), {
-                className: b({ size: textSize, justify, 'reset-margin': resetMargin }, className),
-                'data-qa': `${qa}-header`,
-            }, content)] }));
+    return (React.createElement(Fragment, null,
+        anchor && React.createElement(Anchor, { id: anchor, className: b('anchor') }),
+        React.createElement(getHeaderTag(textSize), {
+            className: b({ size: textSize, justify, 'reset-margin': resetMargin }, className),
+            'data-qa': `${qa}-header`,
+        }, content)));
 };
 export default TitleItem;
-//# sourceMappingURL=TitleItem.js.map

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

@@ -8,5 +8,5 @@ export interface ToggleArrowProps {
     slow?: boolean;
     className?: string;
 }
-declare const ToggleArrow: ({ type, iconType, open, size, thin, slow, className, }: ToggleArrowProps) => import("react/jsx-runtime").JSX.Element;
+declare const ToggleArrow: ({ type, iconType, open, size, thin, slow, className, }: ToggleArrowProps) => JSX.Element;
 export default ToggleArrow;

package/build/esm/components/ToggleArrow/ToggleArrow.js

@@ -1,9 +1,8 @@
-import { jsx as _jsx } from "react/jsx-runtime";
+import React from 'react';
 import { Icon } from '@gravity-ui/uikit';
-import { Chevron, NavigationChevron } from "../../icons/index.js";
-import { block } from "../../utils/index.js";
+import { Chevron, NavigationChevron } from '../../icons';
+import { block } from '../../utils';
 import './ToggleArrow.css';
 const b = block('ToggleArrow');
-const ToggleArrow = ({ type = 'horizontal', iconType = 'default', open = false, size = 16, thin = false, slow = false, className, }) => (_jsx(Icon, { className: b({ type, open, thin, slow }, className), data: iconType === 'navigation' ? NavigationChevron : Chevron, size: size }));
+const ToggleArrow = ({ type = 'horizontal', iconType = 'default', open = false, size = 16, thin = false, slow = false, className, }) => (React.createElement(Icon, { className: b({ type, open, thin, slow }, className), data: iconType === 'navigation' ? NavigationChevron : Chevron, size: size }));
 export default ToggleArrow;
-//# sourceMappingURL=ToggleArrow.js.map

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

@@ -1,9 +1,9 @@
-import * as React from 'react';
+import React from 'react';
 import './UnpublishedLabel.css';
 export type LabeLType = 'label' | 'line';
 export interface UnpublishedLabelProps {
     type?: LabeLType;
     className?: string;
 }
-declare const UnpublishedLabel: ({ className, children, type, }: React.PropsWithChildren<UnpublishedLabelProps>) => import("react/jsx-runtime").JSX.Element;
+declare const UnpublishedLabel: ({ className, children, type, }: React.PropsWithChildren<UnpublishedLabelProps>) => JSX.Element;
 export default UnpublishedLabel;

package/build/esm/components/UnpublishedLabel/UnpublishedLabel.js

@@ -1,8 +1,7 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { block } from "../../utils/index.js";
-import { i18n } from "./i18n/index.js";
+import React from 'react';
+import { block } from '../../utils';
+import { i18n } from './i18n';
 import './UnpublishedLabel.css';
 const b = block('unpublished-label');
-const UnpublishedLabel = ({ className, children, type = 'line', }) => (_jsx("div", { className: b({ type }, className), children: children || i18n('label_non_published') }));
+const UnpublishedLabel = ({ className, children, type = 'line', }) => (React.createElement("div", { className: b({ type }, className) }, children || i18n('label_non_published')));
 export default UnpublishedLabel;
-//# sourceMappingURL=UnpublishedLabel.js.map

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

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