@gravity-ui/page-constructor 4.55.0 → 5.0.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 = tslib_1.__importDefault(require("./i18n"));
+const i18n_1 = 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.default)('constructor-share')),
+        react_1.default.createElement("h5", { className: b('title') }, title || (0, i18n_1.i18n)('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.default)(`${type}-title`);
-            const buttonLabel = (0, i18n_1.default)(`${type}-label`);
+            const urlTitle = (0, i18n_1.i18n)(`${type}-title`);
+            const buttonLabel = (0, i18n_1.i18n)(`${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,2 +1 @@
-declare const _default: (key: string, params?: import("@gravity-ui/i18n").Params | undefined) => string;
-export default _default;
+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;

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

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

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 = tslib_1.__importDefault(require("../i18n"));
+const i18n_1 = 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.default)(`arrow-${type}`) },
+    react_1.default.createElement("button", { className: b('button'), onClick: () => handleClick && handleClick(type), "aria-label": (0, i18n_1.i18n)(`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,2 +1 @@
-declare const _default: (key: string, params?: import("@gravity-ui/i18n").Params | undefined) => string;
-export default _default;
+export declare const i18n: (key: "arrow-right" | "arrow-left", params?: import("@gravity-ui/i18n").Params | undefined) => string;

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

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

package/build/cjs/components/BackLink/BackLink.js

@@ -2,10 +2,10 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importStar(require("react"));
+const icons_1 = require("@gravity-ui/icons");
 const uikit_1 = require("@gravity-ui/uikit");
 const locationContext_1 = require("../../context/locationContext");
 const hooks_1 = require("../../hooks");
-const icons_1 = require("../../icons");
 const models_1 = require("../../models");
 function BackLink(props) {
     const { history } = (0, react_1.useContext)(locationContext_1.LocationContext);
@@ -27,7 +27,7 @@ function BackLink(props) {
         }
     }, [handleAnalytics, history, onClick, url]);
     return (react_1.default.createElement(uikit_1.Button, { className: className, view: theme === 'special' ? 'flat-contrast' : 'flat-secondary', size: size, href: shouldHandleBackAction ? undefined : url, onClick: shouldHandleBackAction ? backActionHandler : undefined, tabIndex: tabIndex, extraProps: extraProps },
-        react_1.default.createElement(uikit_1.Icon, { data: icons_1.ArrowSidebar, size: 24 }),
+        react_1.default.createElement(uikit_1.Icon, { data: icons_1.ArrowLeft, size: 20 }),
         react_1.default.createElement("span", null, title)));
 }
 exports.default = BackLink;

package/build/cjs/components/Button/Button.css

@@ -1,7 +1,7 @@
 /* use this for style redefinitions to awoid problems with
 unpredictable css rules order in build */
 .pc-button-block {
-  --yc-button-outline-color: var(--g-color-line-focus);
+  --g-button-focus-outline-color: var(--g-color-line-focus);
 }
 .pc-button-block__content {
   display: flex;
@@ -17,8 +17,6 @@ unpredictable css rules order in build */
 .pc-button-block_theme_github.pc-button-block_theme_github.pc-button-block_theme_github.pc-button-block_theme_github {
   --g-button-background-color: var(--pc-monochrome-button-background-color);
   --g-button-background-color-hover: var(--pc-monochrome-button-background-color-hover);
-  --yc-button-background-color: var(--pc-monochrome-button-background-color);
-  --yc-button-background-color-hover: var(--pc-monochrome-button-background-color-hover);
 }
 .pc-button-block_theme_github.pc-button-block_theme_github.pc-button-block_theme_github.pc-button-block_theme_github, .pc-button-block_theme_github.pc-button-block_theme_github.pc-button-block_theme_github.pc-button-block_theme_github:link, .pc-button-block_theme_github.pc-button-block_theme_github.pc-button-block_theme_github.pc-button-block_theme_github:visited, .pc-button-block_theme_github.pc-button-block_theme_github.pc-button-block_theme_github.pc-button-block_theme_github:active, .pc-button-block_theme_github.pc-button-block_theme_github.pc-button-block_theme_github.pc-button-block_theme_github:focus {
   color: var(--pc-monochrome-button-color);
@@ -33,8 +31,6 @@ unpredictable css rules order in build */
 .pc-button-block_theme_monochrome.pc-button-block_theme_monochrome {
   --g-button-background-color: var(--pc-monochrome-button-background-color);
   --g-button-background-color-hover: var(--pc-monochrome-button-background-color-hover);
-  --yc-button-background-color: var(--pc-monochrome-button-background-color);
-  --yc-button-background-color-hover: var(--pc-monochrome-button-background-color-hover);
 }
 .pc-button-block_theme_monochrome.pc-button-block_theme_monochrome, .pc-button-block_theme_monochrome.pc-button-block_theme_monochrome:link, .pc-button-block_theme_monochrome.pc-button-block_theme_monochrome:visited, .pc-button-block_theme_monochrome.pc-button-block_theme_monochrome:active, .pc-button-block_theme_monochrome.pc-button-block_theme_monochrome:focus {
   color: var(--pc-monochrome-button-color);

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

@@ -6,26 +6,23 @@ 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 = tslib_1.__importDefault(require("./i18n"));
+const i18n_1 = 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, 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 { 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 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);
         }
-    }, [handleMetrika, metrikaGoals, pixelEvents, handleAnalytics, analyticsEvents, onClickOrigin]);
+    }, [handleAnalytics, analyticsEvents, onClickOrigin]);
     const buttonModifiers = { size, theme, width };
     const buttonImg = img instanceof Object
         ? { url: img.url, position: img.position || defaultImgPosition, alt: img.alt }
@@ -39,7 +36,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.default)('image-alt') }));
+    let image = img && (react_1.default.createElement("img", { className: b('image'), src: buttonImg.url, alt: buttonImg.alt || (0, i18n_1.i18n)('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,2 +1 @@
-declare const _default: (key: string, params?: import("@gravity-ui/i18n").Params | undefined) => string;
-export default _default;
+export declare const i18n: (key: "image-alt", params?: import("@gravity-ui/i18n").Params | undefined) => string;

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

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

package/build/cjs/components/ButtonTabs/ButtonTabs.css

@@ -5,8 +5,6 @@ unpredictable css rules order in build */
   margin-bottom: 12px;
   --g-button-background-color: var(--pc-tab-item-background-color);
   --g-button-background-color-hover: var(--pc-tab-item-background-color-hover);
-  --yc-button-background-color: var(--pc-tab-item-background-color);
-  --yc-button-background-color-hover: var(--pc-tab-item-background-color-hover);
 }
 .pc-button-tabs__item.pc-button-tabs__item, .pc-button-tabs__item.pc-button-tabs__item:link, .pc-button-tabs__item.pc-button-tabs__item:visited, .pc-button-tabs__item.pc-button-tabs__item:active, .pc-button-tabs__item.pc-button-tabs__item:focus {
   color: var(--pc-tab-item-color);
@@ -18,8 +16,6 @@ unpredictable css rules order in build */
   pointer-events: none;
   --g-button-background-color: var(--pc-selected-tab-item-background-color);
   --g-button-background-color-hover: var(--pc-selected-tab-item-background-color-hover);
-  --yc-button-background-color: var(--pc-selected-tab-item-background-color);
-  --yc-button-background-color-hover: var(--pc-selected-tab-item-background-color-hover);
 }
 .pc-button-tabs__item.pc-button-tabs__item_active, .pc-button-tabs__item.pc-button-tabs__item_active:link, .pc-button-tabs__item.pc-button-tabs__item_active:visited, .pc-button-tabs__item.pc-button-tabs__item_active:active, .pc-button-tabs__item.pc-button-tabs__item_active:focus {
   color: var(--pc-selected-tab-item-color);

package/build/cjs/components/Buttons/Buttons.css

@@ -0,0 +1,11 @@
+.pc-buttons {
+  display: flex;
+  flex-wrap: wrap;
+  column-gap: 12px;
+}
+.pc-buttons_size_s {
+  row-gap: 8px;
+}
+.pc-buttons_size_l {
+  row-gap: 12px;
+}

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

@@ -0,0 +1,12 @@
+import React from 'react';
+import { ButtonProps, ContentSize } from '../../models';
+type ButtonsProps = {
+    className?: string;
+    buttons?: ButtonProps[];
+    size?: ContentSize;
+    titleId?: string;
+    qa?: string;
+    buttonQa?: string;
+};
+declare const Buttons: React.FC<ButtonsProps>;
+export default Buttons;

package/build/cjs/components/Buttons/Buttons.js

@@ -0,0 +1,18 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importDefault(require("react"));
+const utils_1 = require("../../utils");
+const Button_1 = tslib_1.__importDefault(require("../Button/Button"));
+const b = (0, utils_1.block)('buttons');
+function getButtonSize(size) {
+    switch (size) {
+        case 's':
+            return 'm';
+        case 'l':
+        default:
+            return 'xl';
+    }
+}
+const Buttons = ({ className, titleId, buttons, size = 's', qa, buttonQa }) => buttons ? (react_1.default.createElement("div", { className: b({ size }, className), "data-qa": qa }, buttons.map((item) => (react_1.default.createElement(Button_1.default, Object.assign({ className: b('button') }, item, { key: item.url, size: getButtonSize(size), qa: buttonQa, extraProps: Object.assign({ 'aria-describedby': item.urlTitle ? undefined : titleId }, item.extraProps) })))))) : null;
+exports.default = Buttons;

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

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

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

@@ -5,7 +5,6 @@ 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"));
@@ -15,8 +14,7 @@ const Header = () => null;
 const Content = () => null;
 const Footer = () => null;
 const Layout = (props) => {
-    const { className, bodyClassName, metrikaGoals, pixelEvents, analyticsEvents, contentClassName, children, url, target, border = 'shadow', urlTitle, qa, extraProps = {}, } = props;
-    const handleMetrika = (0, useMetrika_1.useMetrika)();
+    const { className, bodyClassName, analyticsEvents, contentClassName, children, url, target, border = 'shadow', urlTitle, qa, extraProps = {}, } = props;
     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');
@@ -36,12 +34,11 @@ const Layout = (props) => {
                 break;
         }
     }
-    if (react_1.Children.count(children) === 1) {
-        handleChild(children);
-    }
-    else {
-        react_1.Children.forEach(children, handleChild);
-    }
+    react_1.Children.toArray(children).forEach((child) => {
+        if ((0, react_1.isValidElement)(child)) {
+            handleChild(child);
+        }
+    });
     const cardContent = (react_1.default.createElement(react_1.Fragment, null,
         (header || image) && (react_1.default.createElement(BackgroundImage_1.default, Object.assign({ className: b('header', headerClass) }, (typeof image === 'string' ? { src: image } : image), { qa: qaAttributes.header }),
             react_1.default.createElement("div", { className: b('header-content') }, header))),
@@ -50,7 +47,6 @@ 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 = tslib_1.__importDefault(require("./i18n"));
+const i18n_1 = 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.default)('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.i18n)('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,2 +1 @@
-declare const _default: (key: string, params?: import("@gravity-ui/i18n").Params | undefined) => string;
-export default _default;
+export declare const i18n: (key: "aria-label", params?: import("@gravity-ui/i18n").Params | undefined) => string;

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

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

package/build/cjs/components/FileLink/FileLink.css

@@ -13,8 +13,9 @@ unpredictable css rules order in build */
   display: flex;
   justify-content: center;
   text-transform: uppercase;
+  width: 52px;
 }
-.pc-file-link__file-label .yc-label__text {
+.pc-file-link__file-label .g-label__text {
   width: initial;
 }
 .pc-file-link__link > a {
@@ -31,15 +32,13 @@ unpredictable css rules order in build */
 .pc-file-link__link > a:hover {
   color: var(--g-color-text-secondary);
 }
-.pc-file-link_size_l .pc-file-link__file-label {
+.pc-file-link_size_l .pc-file-link__file-label, .pc-file-link_size_m .pc-file-link__file-label {
   font-size: var(--g-text-body-2-font-size);
   line-height: var(--g-text-body-2-line-height);
-  width: 52px;
 }
-.pc-file-link_size_m .pc-file-link__file-label, .pc-file-link_size_s .pc-file-link__file-label {
+.pc-file-link_size_xs .pc-file-link__file-label, .pc-file-link_size_s .pc-file-link__file-label {
   font-size: var(--g-text-body-1-font-size);
   line-height: var(--g-text-body-1-line-height);
-  width: 44px;
 }
 .pc-file-link_theme_dark .pc-file-link__link > a {
   color: var(--g-color-text-light-primary);

package/build/cjs/components/FullscreenImage/FullscreenImage.css

@@ -11,6 +11,7 @@ unpredictable css rules order in build */
 }
 .pc-fullscreen-image__modal-content {
   position: relative;
+  border-radius: var(--pc-border-radius);
 }
 .pc-fullscreen-image__modal-image {
   display: block;

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

@@ -2,16 +2,16 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importStar(require("react"));
+const icons_1 = require("@gravity-ui/icons");
 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 = tslib_1.__importDefault(require("./i18n"));
+const i18n_1 = require("./i18n");
 const b = (0, utils_1.block)('fullscreen-image');
 const FULL_SCREEN_ICON_SIZE = 18;
-const CLOSE_ICON_SIZE = 30;
+const CLOSE_ICON_SIZE = 24;
 const FullscreenImage = (props) => {
-    const { imageClassName, modalImageClass, imageStyle, alt = (0, i18n_1.default)('img-alt'), extraProps } = props;
+    const { imageClassName, modalImageClass, imageStyle, alt = (0, i18n_1.i18n)('img-alt'), extraProps } = props;
     const [isOpened, setIsOpened] = (0, react_1.useState)(false);
     const openModal = () => setIsOpened(true);
     const closeModal = () => setIsOpened(false);
@@ -19,11 +19,10 @@ const FullscreenImage = (props) => {
         react_1.default.createElement("div", { className: b('image-wrapper') },
             react_1.default.createElement(Image_1.default, Object.assign({}, props, { alt: alt, className: b('image', imageClassName), onClick: openModal, style: imageStyle })),
             react_1.default.createElement("button", { className: b('icon-wrapper'), onClick: openModal },
-                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.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) })))))));
+                react_1.default.createElement(uikit_1.Icon, { data: icons_1.ChevronsExpandUpRight, 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'), contentClassName: 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(uikit_1.Icon, { data: icons_1.Xmark, 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) }))))));
 };
 exports.default = FullscreenImage;

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

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

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

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

package/build/cjs/components/FullscreenMedia/FullscreenMedia.css

@@ -17,6 +17,7 @@ unpredictable css rules order in build */
 }
 .pc-full-screen-media__modal-content {
   position: relative;
+  border-radius: var(--pc-border-radius);
 }
 .pc-full-screen-media__inline-media {
   transform: translateZ(0);

package/build/cjs/components/FullscreenMedia/FullscreenMedia.js

@@ -2,13 +2,13 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importStar(require("react"));
+const icons_1 = require("@gravity-ui/icons");
 const uikit_1 = require("@gravity-ui/uikit");
 const mobileContext_1 = require("../../context/mobileContext");
-const icons_1 = require("../../icons");
 const utils_1 = require("../../utils");
 const b = (0, utils_1.block)('full-screen-media');
 const FULL_SCREEN_ICON_SIZE = 18;
-const CLOSE_ICON_SIZE = 30;
+const CLOSE_ICON_SIZE = 24;
 const getMediaClass = (type) => b('modal-media', { type });
 const FullscreenMedia = ({ children, showFullscreenIcon = true }) => {
     const [isOpened, setIsOpened] = (0, react_1.useState)(false);
@@ -25,18 +25,17 @@ const FullscreenMedia = ({ children, showFullscreenIcon = true }) => {
         react_1.default.createElement("div", { className: b('media-wrapper'), onClickCapture: openModal },
             children({ className: b('inline-media') }),
             showFullscreenIcon && (react_1.default.createElement(uikit_1.Button, { className: b('icon-wrapper'), extraProps: { onClickCapture: openModal }, size: 'l' },
-                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(uikit_1.Button, { className: b('icon-wrapper', { visible: true }), onClick: closeModal, size: 'l' },
-                    react_1.default.createElement(uikit_1.Icon, { data: icons_1.PreviewClose, width: CLOSE_ICON_SIZE, height: CLOSE_ICON_SIZE, className: b('icon', { hover: true }) })),
-                children({
-                    imageClassName: getMediaClass('image'),
-                    videoClassName: getMediaClass('video'),
-                    youtubeClassName: getMediaClass('youtube'),
-                    fullscreen: true,
-                    previewImg: undefined,
-                    autoplay: true,
-                }))))));
+                react_1.default.createElement(uikit_1.Icon, { data: icons_1.ChevronsExpandUpRight, 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'), contentClassName: b('modal-content') },
+            react_1.default.createElement(uikit_1.Button, { className: b('icon-wrapper', { visible: true }), onClick: closeModal, size: 'l' },
+                react_1.default.createElement(uikit_1.Icon, { data: icons_1.Xmark, width: CLOSE_ICON_SIZE, height: CLOSE_ICON_SIZE, className: b('icon', { hover: true }) })),
+            children({
+                imageClassName: getMediaClass('image'),
+                videoClassName: getMediaClass('video'),
+                youtubeClassName: getMediaClass('youtube'),
+                fullscreen: true,
+                previewImg: undefined,
+                autoplay: true,
+            })))));
 };
 exports.default = FullscreenMedia;

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

@@ -3,18 +3,15 @@ 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, metrikaGoals, pixelEvents, theme = 'light', className } = props;
-    const handleMetrika = (0, useMetrika_1.useMetrika)();
+    const { items, theme = 'light', className, analyticsEvents } = props;
     const handleAnalytics = (0, hooks_1.useAnalytics)(models_1.DefaultEventNames.Breadcrumb);
     const onClick = (0, react_1.useCallback)(() => {
-        handleAnalytics();
-        handleMetrika({ metrikaGoals, pixelEvents });
-    }, [handleAnalytics, handleMetrika, metrikaGoals, pixelEvents]);
+        handleAnalytics(analyticsEvents);
+    }, [analyticsEvents, handleAnalytics]);
     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.css

@@ -44,7 +44,7 @@ unpredictable css rules order in build */
   white-space: normal;
 }
 .pc-link-block__link:hover .pc-link-block__arrow {
-  transform: translateX(5px) rotate(-90deg);
+  transform: translateX(5px);
 }
 .pc-link-block__link.pc-link-block__link_has-arrow.pc-link-block__link_theme_dark:hover {
   color: var(--g-color-text-light-primary);
@@ -53,7 +53,6 @@ unpredictable css rules order in build */
   position: relative;
   top: 2px;
   transition: transform 0.3s cubic-bezier(0.22, 0.61, 0.36, 1);
-  transform: rotate(-90deg);
 }
 .pc-link-block_size_l {
   font-size: var(--g-text-body-3-font-size);

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

@@ -2,12 +2,11 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importStar(require("react"));
+const icons_1 = require("@gravity-ui/icons");
 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");
 const index_1 = require("../../utils/index");
@@ -28,16 +27,14 @@ function getArrowSize(size) {
     }
 }
 const LinkBlock = (props) => {
-    const { text, url, arrow, metrikaGoals, pixelEvents, analyticsEvents, theme = 'file-link', colorTheme = 'light', textSize = 'm', className, target, children, tabIndex, qa, urlTitle, extraProps, } = props;
+    const { text, url, arrow, 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 = () => {
@@ -53,7 +50,7 @@ const LinkBlock = (props) => {
                 return (react_1.default.createElement("a", Object.assign({ className: b('link', { theme: colorTheme, 'has-arrow': arrow }), href: href, onClick: onClick, tabIndex: tabIndex, title: urlTitle }, linkProps, { "data-qa": qaAttributes.normal }, extraProps), arrow ? (react_1.default.createElement(react_1.Fragment, null,
                     react_1.default.createElement("span", { className: b('content') }, content),
                     WORD_JOINER_SYM,
-                    react_1.default.createElement(uikit_1.Icon, { className: b('arrow'), data: icons_1.Chevron, size: getArrowSize(textSize) }))) : (content)));
+                    react_1.default.createElement(uikit_1.Icon, { className: b('arrow'), data: icons_1.ChevronRight, size: getArrowSize(textSize) }))) : (content)));
             }
             default:
                 return null;

package/build/cjs/components/Links/Links.css

@@ -0,0 +1,14 @@
+.pc-links {
+  display: flex;
+  flex-direction: column;
+  align-items: baseline;
+}
+.pc-links__link {
+  margin-top: 0px;
+}
+.pc-links_size_s {
+  gap: 8px;
+}
+.pc-links_size_l {
+  gap: 12px;
+}