@gravity-ui/page-constructor 4.51.2-alpha.0 → 4.53.0

package/build/cjs/blocks/Share/Share.js

@@ -12,7 +12,7 @@ const Twitter_1 = require("../../icons/Twitter");
 const Vk_1 = require("../../icons/Vk");
 const models_1 = require("../../models");
 const utils_1 = require("../../utils");
-const i18n_1 = require("./i18n");
+const i18n_1 = tslib_1.__importDefault(require("./i18n"));
 const icons = {
     facebook: Facebook_1.Facebook,
     twitter: Twitter_1.Twitter,
@@ -26,13 +26,13 @@ const Share = ({ items, title }) => {
     const handleAnalytics = (0, hooks_1.useAnalytics)(models_1.DefaultEventNames.ShareButton);
     const handleButtonClick = (0, react_1.useCallback)(() => handleAnalytics(), [handleAnalytics]);
     return (react_1.default.createElement("div", { className: b() },
-        react_1.default.createElement("h5", { className: b('title') }, title || (0, i18n_1.i18n)('constructor-share')),
+        react_1.default.createElement("h5", { className: b('title') }, title || (0, i18n_1.default)('constructor-share')),
         react_1.default.createElement("div", { className: b('items') }, items.map((type) => {
             const url = (0, utils_1.getAbsolutePath)(hostname, pathname);
             const socialUrl = (0, utils_1.getShareLink)(url, type);
             const icon = icons[type];
-            const urlTitle = (0, i18n_1.i18n)(`${type}-title`);
-            const buttonLabel = (0, i18n_1.i18n)(`${type}-label`);
+            const urlTitle = (0, i18n_1.default)(`${type}-title`);
+            const buttonLabel = (0, i18n_1.default)(`${type}-label`);
             return (react_1.default.createElement(uikit_1.Button, { key: type, view: "flat", size: "l", target: "_blank", href: socialUrl, className: b('item', { type: type.toLowerCase() }), onClick: handleButtonClick, title: urlTitle, extraProps: {
                     'aria-label': buttonLabel,
                 } }, icon && react_1.default.createElement(uikit_1.Icon, { data: icon, size: 24, className: b('icon', { type }) })));

package/build/cjs/blocks/Share/i18n/index.d.ts

@@ -1 +1,2 @@
-export declare const i18n: (key: "constructor-share" | "facebook-title" | "twitter-title" | "linkedin-title" | "vk-title" | "telegram-title" | "facebook-label" | "twitter-label" | "linkedin-label" | "vk-label" | "telegram-label", params?: import("@gravity-ui/i18n").Params | undefined) => string;
+declare const _default: (key: string, params?: import("@gravity-ui/i18n").Params | undefined) => string;
+export default _default;

package/build/cjs/blocks/Share/i18n/index.js

@@ -1,9 +1,8 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.i18n = void 0;
 const tslib_1 = require("tslib");
-const i18n_1 = require("@gravity-ui/uikit/i18n");
-const cn_1 = require("../../../utils/cn");
+const registerKeyset_1 = require("../../../utils/registerKeyset");
 const en_json_1 = tslib_1.__importDefault(require("./en.json"));
 const ru_json_1 = tslib_1.__importDefault(require("./ru.json"));
-exports.i18n = (0, i18n_1.addComponentKeysets)({ en: en_json_1.default, ru: ru_json_1.default }, `${cn_1.NAMESPACE}Share`);
+const COMPONENT = 'Share';
+exports.default = (0, registerKeyset_1.registerKeyset)({ en: en_json_1.default, ru: ru_json_1.default }, COMPONENT);

package/build/cjs/blocks/Slider/Arrow/Arrow.js

@@ -4,10 +4,10 @@ const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
 const ToggleArrow_1 = tslib_1.__importDefault(require("../../../components/ToggleArrow/ToggleArrow"));
 const utils_1 = require("../../../utils");
-const i18n_1 = require("../i18n");
+const i18n_1 = tslib_1.__importDefault(require("../i18n"));
 const b = (0, utils_1.block)('slider-block-arrow');
 const Arrow = ({ type, handleClick, className, size = 16 }) => (react_1.default.createElement("div", { className: b({ type }, className) },
-    react_1.default.createElement("button", { className: b('button'), onClick: () => handleClick && handleClick(type), "aria-label": (0, i18n_1.i18n)(`arrow-${type}`) },
+    react_1.default.createElement("button", { className: b('button'), onClick: () => handleClick && handleClick(type), "aria-label": (0, i18n_1.default)(`arrow-${type}`) },
         react_1.default.createElement("span", { className: b('icon-wrapper') },
             react_1.default.createElement(ToggleArrow_1.default, { size: size, type: 'horizontal', iconType: "navigation", className: b('icon') })))));
 exports.default = Arrow;

package/build/cjs/blocks/Slider/i18n/index.d.ts

@@ -1 +1,2 @@
-export declare const i18n: (key: "arrow-right" | "arrow-left", params?: import("@gravity-ui/i18n").Params | undefined) => string;
+declare const _default: (key: string, params?: import("@gravity-ui/i18n").Params | undefined) => string;
+export default _default;

package/build/cjs/blocks/Slider/i18n/index.js

@@ -1,9 +1,8 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.i18n = void 0;
 const tslib_1 = require("tslib");
-const i18n_1 = require("@gravity-ui/uikit/i18n");
-const cn_1 = require("../../../utils/cn");
+const registerKeyset_1 = require("../../../utils/registerKeyset");
 const en_json_1 = tslib_1.__importDefault(require("./en.json"));
 const ru_json_1 = tslib_1.__importDefault(require("./ru.json"));
-exports.i18n = (0, i18n_1.addComponentKeysets)({ en: en_json_1.default, ru: ru_json_1.default }, `${cn_1.NAMESPACE}SliderBlock`);
+const COMPONENT = 'SliderBlock';
+exports.default = (0, registerKeyset_1.registerKeyset)({ en: en_json_1.default, ru: ru_json_1.default }, COMPONENT);

package/build/cjs/components/Button/Button.js

@@ -6,23 +6,26 @@ const components_1 = require("@gravity-ui/components");
 const uikit_1 = require("@gravity-ui/uikit");
 const localeContext_1 = require("../../context/localeContext/localeContext");
 const hooks_1 = require("../../hooks");
+const useMetrika_1 = require("../../hooks/useMetrika");
 const icons_1 = require("../../icons");
 const models_1 = require("../../models");
 const utils_1 = require("../../utils");
-const i18n_1 = require("./i18n");
+const i18n_1 = tslib_1.__importDefault(require("./i18n"));
 const utils_2 = require("./utils");
 const b = (0, utils_1.block)('button-block');
 const Button = (props) => {
+    const handleMetrika = (0, useMetrika_1.useMetrika)();
     const { tld } = (0, react_1.useContext)(localeContext_1.LocaleContext);
-    const { className, analyticsEvents, size = 'l', theme = 'normal', url, urlTitle, img, onClick: onClickOrigin, text, width } = props, rest = tslib_1.__rest(props, ["className", "analyticsEvents", "size", "theme", "url", "urlTitle", "img", "onClick", "text", "width"]);
+    const { className, metrikaGoals, pixelEvents, analyticsEvents, size = 'l', theme = 'normal', url, urlTitle, img, onClick: onClickOrigin, text, width } = props, rest = tslib_1.__rest(props, ["className", "metrikaGoals", "pixelEvents", "analyticsEvents", "size", "theme", "url", "urlTitle", "img", "onClick", "text", "width"]);
     const defaultImgPosition = 'left';
     const handleAnalytics = (0, hooks_1.useAnalytics)(models_1.DefaultEventNames.Button, url);
     const onClick = (0, react_1.useCallback)((e) => {
+        handleMetrika({ metrikaGoals, pixelEvents });
         handleAnalytics(analyticsEvents);
         if (onClickOrigin) {
             onClickOrigin(e);
         }
-    }, [handleAnalytics, analyticsEvents, onClickOrigin]);
+    }, [handleMetrika, metrikaGoals, pixelEvents, handleAnalytics, analyticsEvents, onClickOrigin]);
     const buttonModifiers = { size, theme, width };
     const buttonImg = img instanceof Object
         ? { url: img.url, position: img.position || defaultImgPosition, alt: img.alt }
@@ -36,7 +39,7 @@ const Button = (props) => {
         return react_1.default.createElement(components_1.StoreBadge, { className: buttonClass, platform: platform, href: url });
     }
     let icon;
-    let image = img && (react_1.default.createElement("img", { className: b('image'), src: buttonImg.url, alt: buttonImg.alt || (0, i18n_1.i18n)('image-alt') }));
+    let image = img && (react_1.default.createElement("img", { className: b('image'), src: buttonImg.url, alt: buttonImg.alt || (0, i18n_1.default)('image-alt') }));
     if (theme === 'github') {
         icon = react_1.default.createElement(uikit_1.Icon, { className: b('icon'), data: icons_1.Github, size: 24, qa: utils_2.ICON_QA });
         image = undefined;

package/build/cjs/components/Button/i18n/index.d.ts

@@ -1 +1,2 @@
-export declare const i18n: (key: "image-alt", params?: import("@gravity-ui/i18n").Params | undefined) => string;
+declare const _default: (key: string, params?: import("@gravity-ui/i18n").Params | undefined) => string;
+export default _default;

package/build/cjs/components/Button/i18n/index.js

@@ -1,9 +1,8 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.i18n = void 0;
 const tslib_1 = require("tslib");
-const i18n_1 = require("@gravity-ui/uikit/i18n");
-const cn_1 = require("../../../utils/cn");
+const registerKeyset_1 = require("../../../utils/registerKeyset");
 const en_json_1 = tslib_1.__importDefault(require("./en.json"));
 const ru_json_1 = tslib_1.__importDefault(require("./ru.json"));
-exports.i18n = (0, i18n_1.addComponentKeysets)({ en: en_json_1.default, ru: ru_json_1.default }, `${cn_1.NAMESPACE}Button`);
+const COMPONENT = 'Button';
+exports.default = (0, registerKeyset_1.registerKeyset)({ en: en_json_1.default, ru: ru_json_1.default }, COMPONENT);

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

@@ -1,5 +1,5 @@
 import React, { HTMLAttributeAnchorTarget, ReactElement } from 'react';
-import { AnalyticsEventsBase, CardBaseProps as CardBaseParams, ImageProps, WithChildren } from '../../models';
+import { AnalyticsEventsBase, ButtonPixel, CardBaseProps as CardBaseParams, ImageProps, MetrikaGoal, WithChildren } from '../../models';
 export interface CardBaseProps extends AnalyticsEventsBase, CardBaseParams {
     className?: string;
     bodyClassName?: string;
@@ -8,6 +8,8 @@ export interface CardBaseProps extends AnalyticsEventsBase, CardBaseParams {
     url?: string;
     urlTitle?: string;
     target?: HTMLAttributeAnchorTarget;
+    metrikaGoals?: MetrikaGoal;
+    pixelEvents?: ButtonPixel;
     qa?: string;
     extraProps?: React.HTMLAttributes<HTMLElement>;
 }

package/build/cjs/components/CardBase/CardBase.js

@@ -5,6 +5,7 @@ const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importStar(require("react"));
 const uikit_1 = require("@gravity-ui/uikit");
 const hooks_1 = require("../../hooks");
+const useMetrika_1 = require("../../hooks/useMetrika");
 const models_1 = require("../../models");
 const utils_1 = require("../../utils");
 const BackgroundImage_1 = tslib_1.__importDefault(require("../BackgroundImage/BackgroundImage"));
@@ -14,7 +15,8 @@ const Header = () => null;
 const Content = () => null;
 const Footer = () => null;
 const Layout = (props) => {
-    const { className, bodyClassName, analyticsEvents, contentClassName, children, url, target, border = 'shadow', urlTitle, qa, extraProps = {}, } = props;
+    const { className, bodyClassName, metrikaGoals, pixelEvents, analyticsEvents, contentClassName, children, url, target, border = 'shadow', urlTitle, qa, extraProps = {}, } = props;
+    const handleMetrika = (0, useMetrika_1.useMetrika)();
     const handleAnalytics = (0, hooks_1.useAnalytics)(models_1.DefaultEventNames.CardBase, url);
     let header, content, footer, image, headerClass, footerClass;
     const qaAttributes = (0, utils_1.getQaAttrubutes)(qa, 'header', 'footer', 'body', 'content');
@@ -48,6 +50,7 @@ const Layout = (props) => {
             footer && (react_1.default.createElement("div", { className: b('footer', footerClass), "data-qa": qaAttributes.footer }, footer)))));
     const fullClassName = b({ border }, className);
     const onClick = () => {
+        handleMetrika({ metrikaGoals, pixelEvents });
         handleAnalytics(analyticsEvents);
     };
     return url ? (react_1.default.createElement(RouterLink_1.default, { href: url },

package/build/cjs/components/Control/Control.js

@@ -5,12 +5,12 @@ const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
 const uikit_1 = require("@gravity-ui/uikit");
 const utils_1 = require("../../utils");
-const i18n_1 = require("./i18n");
+const i18n_1 = tslib_1.__importDefault(require("./i18n"));
 const b = (0, utils_1.block)('control');
 exports.defaultIconId = 'icon-test-id';
 const Control = (props) => {
     const { icon, theme = 'primary', size = 's', iconSize = 16, disabled = false, onClick, className, qa, } = props;
-    return (react_1.default.createElement("button", { type: "button", "aria-label": (0, i18n_1.i18n)('aria-label'), className: b({ size, theme, disabled }, className), onClick: disabled ? undefined : onClick, disabled: disabled, "data-qa": qa },
+    return (react_1.default.createElement("button", { type: "button", "aria-label": (0, i18n_1.default)('aria-label'), className: b({ size, theme, disabled }, className), onClick: disabled ? undefined : onClick, disabled: disabled, "data-qa": qa },
         react_1.default.createElement(uikit_1.Icon, { data: icon, size: iconSize, qa: exports.defaultIconId })));
 };
 exports.default = Control;

package/build/cjs/components/Control/i18n/index.d.ts

@@ -1 +1,2 @@
-export declare const i18n: (key: "aria-label", params?: import("@gravity-ui/i18n").Params | undefined) => string;
+declare const _default: (key: string, params?: import("@gravity-ui/i18n").Params | undefined) => string;
+export default _default;

package/build/cjs/components/Control/i18n/index.js

@@ -1,9 +1,8 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.i18n = void 0;
 const tslib_1 = require("tslib");
-const i18n_1 = require("@gravity-ui/uikit/i18n");
-const cn_1 = require("../../../utils/cn");
+const registerKeyset_1 = require("../../../utils/registerKeyset");
 const en_json_1 = tslib_1.__importDefault(require("./en.json"));
 const ru_json_1 = tslib_1.__importDefault(require("./ru.json"));
-exports.i18n = (0, i18n_1.addComponentKeysets)({ en: en_json_1.default, ru: ru_json_1.default }, `${cn_1.NAMESPACE}Control`);
+const COMPONENT = 'Control';
+exports.default = (0, registerKeyset_1.registerKeyset)({ en: en_json_1.default, ru: ru_json_1.default }, COMPONENT);

package/build/cjs/components/FullscreenImage/FullscreenImage.js

@@ -6,12 +6,12 @@ const uikit_1 = require("@gravity-ui/uikit");
 const icons_1 = require("../../icons");
 const utils_1 = require("../../utils");
 const Image_1 = tslib_1.__importDefault(require("../Image/Image"));
-const i18n_1 = require("./i18n");
+const i18n_1 = tslib_1.__importDefault(require("./i18n"));
 const b = (0, utils_1.block)('fullscreen-image');
 const FULL_SCREEN_ICON_SIZE = 18;
 const CLOSE_ICON_SIZE = 30;
 const FullscreenImage = (props) => {
-    const { imageClassName, modalImageClass, imageStyle, alt = (0, i18n_1.i18n)('img-alt'), extraProps } = props;
+    const { imageClassName, modalImageClass, imageStyle, alt = (0, i18n_1.default)('img-alt'), extraProps } = props;
     const [isOpened, setIsOpened] = (0, react_1.useState)(false);
     const openModal = () => setIsOpened(true);
     const closeModal = () => setIsOpened(false);
@@ -22,7 +22,7 @@ const FullscreenImage = (props) => {
                 react_1.default.createElement(uikit_1.Icon, { data: icons_1.Fullscreen, width: FULL_SCREEN_ICON_SIZE, height: FULL_SCREEN_ICON_SIZE, className: b('icon') }))),
         isOpened && (react_1.default.createElement(uikit_1.Modal, { open: isOpened, onClose: closeModal, className: b('modal') },
             react_1.default.createElement("div", { className: b('modal-content') },
-                react_1.default.createElement("button", { className: b('icon-wrapper', { visible: true }), onClick: closeModal, "aria-label": (0, i18n_1.i18n)('close') },
+                react_1.default.createElement("button", { className: b('icon-wrapper', { visible: true }), onClick: closeModal, "aria-label": (0, i18n_1.default)('close') },
                     react_1.default.createElement(uikit_1.Icon, { data: icons_1.PreviewClose, width: CLOSE_ICON_SIZE, height: CLOSE_ICON_SIZE, className: b('icon', { hover: true }) })),
                 react_1.default.createElement(Image_1.default, Object.assign({}, props, { className: b('modal-image', modalImageClass) })))))));
 };

package/build/cjs/components/FullscreenImage/i18n/index.d.ts

@@ -1 +1,2 @@
-export declare const i18n: (key: "close" | "img-alt", params?: import("@gravity-ui/i18n").Params | undefined) => string;
+declare const _default: (key: string, params?: import("@gravity-ui/i18n").Params | undefined) => string;
+export default _default;

package/build/cjs/components/FullscreenImage/i18n/index.js

@@ -1,9 +1,8 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.i18n = void 0;
 const tslib_1 = require("tslib");
-const i18n_1 = require("@gravity-ui/uikit/i18n");
-const cn_1 = require("../../../utils/cn");
+const registerKeyset_1 = require("../../../utils/registerKeyset");
 const en_json_1 = tslib_1.__importDefault(require("./en.json"));
 const ru_json_1 = tslib_1.__importDefault(require("./ru.json"));
-exports.i18n = (0, i18n_1.addComponentKeysets)({ en: en_json_1.default, ru: ru_json_1.default }, `${cn_1.NAMESPACE}FullscreenImage`);
+const COMPONENT = 'FullscreenImage';
+exports.default = (0, registerKeyset_1.registerKeyset)({ en: en_json_1.default, ru: ru_json_1.default }, COMPONENT);

package/build/cjs/components/HeaderBreadcrumbs/HeaderBreadcrumbs.js

@@ -3,15 +3,18 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importStar(require("react"));
 const hooks_1 = require("../../hooks");
+const useMetrika_1 = require("../../hooks/useMetrika");
 const models_1 = require("../../models");
 const utils_1 = require("../../utils");
 const b = (0, utils_1.block)('header-breadcrumbs');
 function HeaderBreadcrumbs(props) {
-    const { items, theme = 'light', className, analyticsEvents } = props;
+    const { items, metrikaGoals, pixelEvents, theme = 'light', className } = props;
+    const handleMetrika = (0, useMetrika_1.useMetrika)();
     const handleAnalytics = (0, hooks_1.useAnalytics)(models_1.DefaultEventNames.Breadcrumb);
     const onClick = (0, react_1.useCallback)(() => {
-        handleAnalytics(analyticsEvents);
-    }, [analyticsEvents, handleAnalytics]);
+        handleAnalytics();
+        handleMetrika({ metrikaGoals, pixelEvents });
+    }, [handleAnalytics, handleMetrika, metrikaGoals, pixelEvents]);
     return (react_1.default.createElement("div", { className: b({ theme }, className) }, items === null || items === void 0 ? void 0 : items.map((item) => (react_1.default.createElement("div", { className: b('item'), key: item.url },
         react_1.default.createElement("a", { href: item.url, className: b('text'), onClick: onClick }, item.text))))));
 }

package/build/cjs/components/Link/Link.js

@@ -6,6 +6,7 @@ const uikit_1 = require("@gravity-ui/uikit");
 const localeContext_1 = require("../../context/localeContext");
 const locationContext_1 = require("../../context/locationContext");
 const hooks_1 = require("../../hooks");
+const useMetrika_1 = require("../../hooks/useMetrika");
 const icons_1 = require("../../icons");
 const models_1 = require("../../models");
 const utils_1 = require("../../utils");
@@ -27,14 +28,16 @@ function getArrowSize(size) {
     }
 }
 const LinkBlock = (props) => {
-    const { text, url, arrow, analyticsEvents, theme = 'file-link', colorTheme = 'light', textSize = 'm', className, target, children, tabIndex, qa, urlTitle, extraProps, } = props;
+    const { text, url, arrow, metrikaGoals, pixelEvents, analyticsEvents, theme = 'file-link', colorTheme = 'light', textSize = 'm', className, target, children, tabIndex, qa, urlTitle, extraProps, } = props;
     const qaAttributes = (0, index_1.getQaAttrubutes)(qa, ['normal']);
+    const handleMetrika = (0, useMetrika_1.useMetrika)();
     const handleAnalytics = (0, hooks_1.useAnalytics)(models_1.DefaultEventNames.Link, url);
     const { hostname } = (0, react_1.useContext)(locationContext_1.LocationContext);
     const { tld } = (0, react_1.useContext)(localeContext_1.LocaleContext);
     const href = (0, utils_1.setUrlTld)(props.url, tld);
     const defaultTextSize = theme === 'back' ? 'l' : 'm';
     const onClick = () => {
+        handleMetrika({ metrikaGoals, pixelEvents });
         handleAnalytics(analyticsEvents);
     };
     const getLinkByType = () => {

package/build/cjs/components/Map/GoogleMap.js

@@ -2,12 +2,12 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importStar(require("react"));
-const uikit_1 = require("@gravity-ui/uikit");
 const debounce_1 = tslib_1.__importDefault(require("lodash/debounce"));
 const localeContext_1 = require("../../context/localeContext/localeContext");
 const mapsContext_1 = require("../../context/mapsContext/mapsContext");
 const mobileContext_1 = require("../../context/mobileContext");
 const utils_1 = require("../../utils");
+const configure_1 = require("../../utils/configure");
 const helpers_1 = require("./helpers");
 const b = (0, utils_1.block)('map');
 function getScriptSrc(params) {
@@ -17,7 +17,7 @@ function getScriptSrc(params) {
 const GoogleMap = (props) => {
     const { address, zoom, className } = props;
     const { apiKey, scriptSrc } = (0, react_1.useContext)(mapsContext_1.MapsContext);
-    const { lang = uikit_1.Lang.Ru } = (0, react_1.useContext)(localeContext_1.LocaleContext);
+    const { lang = configure_1.Lang.Ru } = (0, react_1.useContext)(localeContext_1.LocaleContext);
     const isMobile = (0, react_1.useContext)(mobileContext_1.MobileContext);
     const [height, setHeight] = (0, react_1.useState)(undefined);
     const ref = (0, react_1.useRef)(null);

package/build/cjs/components/Map/YMap/YandexMap.js

@@ -12,7 +12,7 @@ const ErrorWrapper_1 = tslib_1.__importDefault(require("../../ErrorWrapper/Error
 const helpers_1 = require("../helpers");
 const YMap_1 = require("./YMap");
 const YandexMapApiLoader_1 = require("./YandexMapApiLoader");
-const i18n_1 = require("./i18n");
+const i18n_1 = tslib_1.__importDefault(require("./i18n"));
 const b = (0, utils_1.block)('map');
 const DEFAULT_CONTAINER_ID = 'ymap';
 const DEFAULT_ZOOM = 9;
@@ -73,7 +73,7 @@ const YandexMap = (props) => {
     });
     if (!markers)
         return null;
-    return (react_1.default.createElement(ErrorWrapper_1.default, { isError: YandexMapApiLoader_1.YMapsApiLoader.status === YandexMapApiLoader_1.MapApiStatus.Error, text: (0, i18n_1.i18n)('map-load-error'), buttonText: (0, i18n_1.i18n)('map-try-again'), handler: onTryAgain, className: b('wrapper') },
+    return (react_1.default.createElement(ErrorWrapper_1.default, { isError: YandexMapApiLoader_1.YMapsApiLoader.status === YandexMapApiLoader_1.MapApiStatus.Error, text: (0, i18n_1.default)('map-load-error'), buttonText: (0, i18n_1.default)('map-try-again'), handler: onTryAgain, className: b('wrapper') },
         react_1.default.createElement("div", { className: b('wrapper') },
             react_1.default.createElement("div", { id: containerId, className: b({ hidden: !ready }, className), ref: ref, style: { height } }),
             loading ? react_1.default.createElement(uikit_1.Spin, { size: "xl", className: b('spinner') }) : null)));

package/build/cjs/components/Map/YMap/i18n/index.d.ts

@@ -1 +1,2 @@
-export declare const i18n: (key: "map-load-error" | "map-try-again", params?: import("@gravity-ui/i18n").Params | undefined) => string;
+declare const _default: (key: string, params?: import("@gravity-ui/i18n").Params | undefined) => string;
+export default _default;

package/build/cjs/components/Map/YMap/i18n/index.js

@@ -1,9 +1,8 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.i18n = void 0;
 const tslib_1 = require("tslib");
-const i18n_1 = require("@gravity-ui/uikit/i18n");
-const cn_1 = require("../../../../utils/cn");
+const registerKeyset_1 = require("../../../../utils/registerKeyset");
 const en_json_1 = tslib_1.__importDefault(require("./en.json"));
 const ru_json_1 = tslib_1.__importDefault(require("./ru.json"));
-exports.i18n = (0, i18n_1.addComponentKeysets)({ en: en_json_1.default, ru: ru_json_1.default }, `${cn_1.NAMESPACE}Map`);
+const COMPONENT = 'Map';
+exports.default = (0, registerKeyset_1.registerKeyset)({ en: en_json_1.default, ru: ru_json_1.default }, COMPONENT);

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

@@ -3,13 +3,13 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
 const utils_1 = require("../../../utils");
-const i18n_1 = require("./i18n");
+const i18n_1 = tslib_1.__importDefault(require("./i18n"));
 const utils_2 = require("./utils");
 const b = (0, utils_1.block)('media-component-data-lens');
 const DataLens = (props) => {
     const { dataLens } = props;
     const dataLensData = (0, utils_2.unifyDataLensToObject)(dataLens);
     return dataLens ? (react_1.default.createElement("div", { className: b('wrap') },
-        react_1.default.createElement("iframe", { src: `https://datalens.yandex/${dataLensData.id}?_embedded=1&_theme=${dataLensData.theme}`, className: b('iframe'), loading: "lazy", title: (0, i18n_1.i18n)('iframe-title'), frameBorder: 0 }))) : null;
+        react_1.default.createElement("iframe", { src: `https://datalens.yandex/${dataLensData.id}?_embedded=1&_theme=${dataLensData.theme}`, className: b('iframe'), loading: "lazy", title: (0, i18n_1.default)('iframe-title'), frameBorder: 0 }))) : null;
 };
 exports.default = DataLens;

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

@@ -1 +1,2 @@
-export declare const i18n: (key: "iframe-title", params?: import("@gravity-ui/i18n").Params | undefined) => string;
+declare const _default: (key: string, params?: import("@gravity-ui/i18n").Params | undefined) => string;
+export default _default;

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

@@ -1,9 +1,8 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.i18n = void 0;
 const tslib_1 = require("tslib");
-const i18n_1 = require("@gravity-ui/uikit/i18n");
-const cn_1 = require("../../../../utils/cn");
+const registerKeyset_1 = require("../../../../utils/registerKeyset");
 const en_json_1 = tslib_1.__importDefault(require("./en.json"));
 const ru_json_1 = tslib_1.__importDefault(require("./ru.json"));
-exports.i18n = (0, i18n_1.addComponentKeysets)({ en: en_json_1.default, ru: ru_json_1.default }, `${cn_1.NAMESPACE}DataLens`);
+const COMPONENT = 'DataLens';
+exports.default = (0, registerKeyset_1.registerKeyset)({ en: en_json_1.default, ru: ru_json_1.default }, COMPONENT);

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

@@ -3,12 +3,12 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
 const utils_1 = require("../../../utils");
-const i18n_1 = require("./i18n");
+const i18n_1 = tslib_1.__importDefault(require("./i18n"));
 const b = (0, utils_1.block)('media-component-iframe');
 const Iframe = (props) => {
     const { iframe, margins = true } = props;
     const { height = 400, src, width, name, title } = iframe;
     return iframe ? (react_1.default.createElement("div", { className: b({ margins }), style: { height } },
-        react_1.default.createElement("iframe", { className: b('item'), loading: "lazy", title: title || (0, i18n_1.i18n)('iframe-title'), frameBorder: 0, src: src, width: width, height: height, name: name }))) : null;
+        react_1.default.createElement("iframe", { className: b('item'), loading: "lazy", title: title || (0, i18n_1.default)('iframe-title'), frameBorder: 0, src: src, width: width, height: height, name: name }))) : null;
 };
 exports.default = Iframe;

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

@@ -1 +1,2 @@
-export declare const i18n: (key: "iframe-title", params?: import("@gravity-ui/i18n").Params | undefined) => string;
+declare const _default: (key: string, params?: import("@gravity-ui/i18n").Params | undefined) => string;
+export default _default;

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

@@ -1,9 +1,8 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.i18n = void 0;
 const tslib_1 = require("tslib");
-const i18n_1 = require("@gravity-ui/uikit/i18n");
-const cn_1 = require("../../../../utils/cn");
+const registerKeyset_1 = require("../../../../utils/registerKeyset");
 const en_json_1 = tslib_1.__importDefault(require("./en.json"));
 const ru_json_1 = tslib_1.__importDefault(require("./ru.json"));
-exports.i18n = (0, i18n_1.addComponentKeysets)({ en: en_json_1.default, ru: ru_json_1.default }, `${cn_1.NAMESPACE}Iframe`);
+const COMPONENT = 'Iframe';
+exports.default = (0, registerKeyset_1.registerKeyset)({ en: en_json_1.default, ru: ru_json_1.default }, COMPONENT);

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

@@ -12,7 +12,7 @@ const Image_1 = tslib_1.__importDefault(require("./Image/Image"));
 const Video_1 = tslib_1.__importDefault(require("./Video/Video"));
 const b = (0, utils_1.block)('Media');
 const Media = (props) => {
-    const { image, video, youtube, dataLens, color, height, previewImg, parallax = false, fullscreen, analyticsEvents, className, imageClassName, videoClassName, youtubeClassName, playVideo = true, isBackground, playButton, customBarControlsClassName, qa, ratio, autoplay, onImageLoad, iframe, margins, } = props;
+    const { image, video, youtube, dataLens, color, height, previewImg, parallax = false, metrika, fullscreen, analyticsEvents, className, imageClassName, videoClassName, youtubeClassName, playVideo = true, isBackground, playButton, customBarControlsClassName, qa, ratio, autoplay, onImageLoad, iframe, margins, } = props;
     const [hasVideoFallback, setHasVideoFallback] = (0, react_1.useState)(false);
     const qaAttributes = (0, utils_1.getQaAttrubutes)(qa, 'video');
     const content = (0, react_1.useMemo)(() => {
@@ -26,6 +26,7 @@ const Media = (props) => {
                 video,
                 videoClassName,
                 height,
+                metrika,
                 analyticsEvents,
                 playVideo,
                 previewImg,
@@ -68,6 +69,7 @@ const Media = (props) => {
         qaAttributes.video,
         onImageLoad,
         videoClassName,
+        metrika,
         analyticsEvents,
         playVideo,
         previewImg,

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

@@ -8,7 +8,7 @@ const DefaultVideo_1 = require("../../DefaultVideo/DefaultVideo");
 const ReactPlayer_1 = tslib_1.__importDefault(require("../../ReactPlayer/ReactPlayer"));
 const b = (0, utils_1.block)('media-component-video');
 const Video = (props) => {
-    const { video, height, analyticsEvents, previewImg, playButton: commonPlayButton, customBarControlsClassName, videoClassName, playVideo, setHasVideoFallback, hasVideoFallback, qa, ratio, } = props;
+    const { video, height, metrika, analyticsEvents, previewImg, playButton: commonPlayButton, customBarControlsClassName, videoClassName, playVideo, setHasVideoFallback, hasVideoFallback, qa, ratio, } = props;
     const qaAttributes = (0, utils_1.getQaAttrubutes)(qa, 'source');
     const ref = (0, react_1.useRef)(null);
     (0, react_1.useEffect)(() => {
@@ -32,7 +32,7 @@ const Video = (props) => {
     }, [playVideo, video, setHasVideoFallback]);
     const reactPlayerBlock = (0, react_1.useMemo)(() => {
         const { src, loop, controls, muted, autoplay = true, elapsedTime, playButton, ariaLabel, customControlsOptions, } = video;
-        return (react_1.default.createElement(ReactPlayer_1.default, { ref: ref, className: b('react-player', videoClassName), src: src, previewImgUrl: previewImg, loop: Boolean(loop), controls: controls, muted: muted, autoplay: autoplay && playVideo, elapsedTime: elapsedTime, playButton: playButton || commonPlayButton, customBarControlsClassName: customBarControlsClassName, analyticsEvents: analyticsEvents, height: height, ariaLabel: ariaLabel, customControlsOptions: customControlsOptions, ratio: ratio }));
+        return (react_1.default.createElement(ReactPlayer_1.default, { ref: ref, className: b('react-player', videoClassName), src: src, previewImgUrl: previewImg, loop: Boolean(loop), controls: controls, muted: muted, autoplay: autoplay && playVideo, elapsedTime: elapsedTime, playButton: playButton || commonPlayButton, customBarControlsClassName: customBarControlsClassName, metrika: metrika, analyticsEvents: analyticsEvents, height: height, ariaLabel: ariaLabel, customControlsOptions: customControlsOptions, ratio: ratio }));
     }, [
         video,
         height,
@@ -41,6 +41,7 @@ const Video = (props) => {
         playVideo,
         commonPlayButton,
         customBarControlsClassName,
+        metrika,
         analyticsEvents,
         ratio,
     ]);

package/build/cjs/components/OverflowScroller/OverflowScroller.js

@@ -5,7 +5,7 @@ const react_1 = tslib_1.__importStar(require("react"));
 const debounce_1 = tslib_1.__importDefault(require("lodash/debounce"));
 const __1 = require("..");
 const utils_1 = require("../../utils");
-const i18n_1 = require("./i18n");
+const i18n_1 = tslib_1.__importDefault(require("./i18n"));
 const b = (0, utils_1.block)('overflow-scroller');
 const TRANSITION_TIME = 300;
 const PADDING_SIZE = 24;
@@ -85,7 +85,7 @@ class OverflowScroller extends react_1.default.Component {
             }) },
             react_1.default.createElement("div", { className: b(null, className), ref: this.containerRef },
                 react_1.default.createElement("div", { className: b('wrapper'), style: wrapperStyle, ref: this.wrapperRef }, children)),
-            arrows.map((direction) => (react_1.default.createElement("button", { key: direction, className: b('arrow', { type: direction }, arrowClassName), onClick: (e) => this.handleScrollClick(e, direction), "aria-label": (0, i18n_1.i18n)(direction) },
+            arrows.map((direction) => (react_1.default.createElement("button", { key: direction, className: b('arrow', { type: direction }, arrowClassName), onClick: (e) => this.handleScrollClick(e, direction), "aria-label": (0, i18n_1.default)(direction) },
                 react_1.default.createElement(__1.ToggleArrow, { size: arrowSize, type: 'horizontal', iconType: "navigation" }))))));
     }
 }

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

@@ -1 +1,2 @@
-export declare const i18n: (key: "left" | "right", params?: import("@gravity-ui/i18n").Params | undefined) => string;
+declare const _default: (key: string, params?: import("@gravity-ui/i18n").Params | undefined) => string;
+export default _default;

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

@@ -1,9 +1,8 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.i18n = void 0;
 const tslib_1 = require("tslib");
-const i18n_1 = require("@gravity-ui/uikit/i18n");
-const cn_1 = require("../../../utils/cn");
+const registerKeyset_1 = require("../../../utils/registerKeyset");
 const en_json_1 = tslib_1.__importDefault(require("./en.json"));
 const ru_json_1 = tslib_1.__importDefault(require("./ru.json"));
-exports.i18n = (0, i18n_1.addComponentKeysets)({ en: en_json_1.default, ru: ru_json_1.default }, `${cn_1.NAMESPACE}OverflowScroller`);
+const COMPONENT = 'OverflowScroller';
+exports.default = (0, registerKeyset_1.registerKeyset)({ en: en_json_1.default, ru: ru_json_1.default }, COMPONENT);

package/build/cjs/components/ReactPlayer/CustomBarControls.js

@@ -9,7 +9,7 @@ const Unmute_1 = require("../../icons/Unmute");
 const models_1 = require("../../models");
 const utils_1 = require("../../utils");
 const CircleProgress_1 = tslib_1.__importDefault(require("./CircleProgress"));
-const i18n_1 = require("./i18n");
+const i18n_1 = tslib_1.__importDefault(require("./i18n"));
 const b = (0, utils_1.block)('CustomBarControls');
 const playIconsMap = {
     [models_1.CustomControlsType.WithMuteButton]: null,
@@ -38,7 +38,7 @@ const CustomBarControls = (props) => {
             return null;
         }
         const { isMuted, changeMute } = mute;
-        return (react_1.default.createElement("button", { className: b('button', { type }), onClick: changeMute, "aria-label": (0, i18n_1.i18n)(isMuted ? 'unmute' : 'mute') },
+        return (react_1.default.createElement("button", { className: b('button', { type }), onClick: changeMute, "aria-label": (0, i18n_1.default)(isMuted ? 'unmute' : 'mute') },
             react_1.default.createElement(uikit_1.Icon, { data: isMuted ? unmuteIcon : muteIcon, className: b('mute-icon', { type }) }),
             type === models_1.CustomControlsType.WithMuteButton && !isMuted && (react_1.default.createElement(CircleProgress_1.default, { elapsedTime: elapsedTimePercent, strokeWidth: 5 }))));
     }, [elapsedTimePercent, isMuteButtonShown, mute, muteIcon, type, unmuteIcon]);
@@ -47,7 +47,7 @@ const CustomBarControls = (props) => {
         if (type === models_1.CustomControlsType.WithMuteButton || !icon) {
             return null;
         }
-        return (react_1.default.createElement("button", { onClick: onPlayClick, className: b('button', { type }), "aria-label": (0, i18n_1.i18n)(isPaused ? 'play' : 'pause') },
+        return (react_1.default.createElement("button", { onClick: onPlayClick, className: b('button', { type }), "aria-label": (0, i18n_1.default)(isPaused ? 'play' : 'pause') },
             react_1.default.createElement(uikit_1.Icon, { data: icon, className: b('play-icon', { type }) })));
     }, [isPaused, onPlayClick, type, playIcon, pauseIcon]);
     return (react_1.default.createElement("div", { className: b('wrapper', { type, shown, positioning }, className) },