@doyourjob/gravity-ui-page-constructor-addons 2.1.25-dev.0 → 2.1.25-dev.1

package/build/esm/components/NewHeader/components/{LoginPopup/LoginPopup.css → NHLoginPopup/NHLoginPopup.css}

@@ -1,6 +1,6 @@
 /* use this for style redefinitions to awoid problems with
 unpredictable css rules order in build */
-.pc-addons-login-popup {
+.pc-addons-nh-login-popup {
   border-radius: 16px;
   background: var(--g-color-base-float);
   box-shadow: 0 4px 24px var(--g-color-base-generic), 0 2px 8px var(--g-color-base-generic);
@@ -12,18 +12,18 @@ unpredictable css rules order in build */
   scrollbar-width: none;
 }
 
-.pc-addons-login-popup::-webkit-scrollbar {
+.pc-addons-nh-login-popup::-webkit-scrollbar {
   display: none;
 }
 
-.pc-addons-login-popup__container {
+.pc-addons-nh-login-popup__container {
   padding: 8px;
   gap: 8px;
   display: flex;
   flex-direction: column;
 }
 
-.pc-addons-login-popup__item {
+.pc-addons-nh-login-popup__item {
   padding: 8px;
   display: flex;
   flex-direction: column;
@@ -31,13 +31,13 @@ unpredictable css rules order in build */
   width: 100%;
 }
 
-.pc-addons-login-popup__title {
+.pc-addons-nh-login-popup__title {
   font-size: var(--g-text-body-2-font-size, var(--pc-text-body-2-font-size));
   line-height: var(--g-text-body-2-line-height, var(--pc-text-body-2-line-height));
   font-weight: 500;
 }
 
-.pc-addons-login-popup__subtitle {
+.pc-addons-nh-login-popup__subtitle {
   font-size: var(--g-text-body-2-font-size, var(--pc-text-body-2-font-size));
   line-height: var(--g-text-body-2-line-height, var(--pc-text-body-2-line-height));
   font-weight: 500;

package/build/esm/components/NewHeader/components/NHLoginPopup/NHLoginPopup.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { NHLoginPopupData } from '../../models';
+import './NHLoginPopup.css';
+export declare const NHLoginPopup: ({ items }: NHLoginPopupData) => React.JSX.Element;

package/build/esm/components/NewHeader/components/NHLoginPopup/NHLoginPopup.js

@@ -0,0 +1,8 @@
+import React from 'react';
+import { Grid, getLinkProps } from '@doyourjob/gravity-ui-page-constructor';
+import { block } from '../../../../utils/cn';
+import './NHLoginPopup.css';
+const b = block('nh-login-popup');
+export const NHLoginPopup = ({ items }) => (React.createElement(Grid, { className: b(), containerClass: b('container') }, items.map((item) => (React.createElement("a", Object.assign({ href: item.url, className: b('item'), key: item.title }, getLinkProps(item.url || '')),
+    React.createElement("div", { className: b('title') }, item.title),
+    React.createElement("div", { className: b('subtitle') }, item.subtitle))))));

package/build/esm/components/NewHeader/components/{MediumPopup/MediumPopup.css → NHMediumPopup/NHMediumPopup.css}

@@ -1,6 +1,6 @@
 /* use this for style redefinitions to awoid problems with
 unpredictable css rules order in build */
-.pc-addons-medium-popup {
+.pc-addons-nh-medium-popup {
   max-height: calc(100vh - 64px - 64px);
   overflow: auto;
   display: flex;

package/build/esm/components/NewHeader/components/NHMediumPopup/NHMediumPopup.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { NHMediumPopupData } from '../../models';
+import './NHMediumPopup.css';
+export declare const NHMediumPopup: ({ groups }: NHMediumPopupData) => React.JSX.Element;

package/build/esm/components/NewHeader/components/{MediumPopup/MediumPopup.js → NHMediumPopup/NHMediumPopup.js}

@@ -1,12 +1,12 @@
 import React from 'react';
 import { Col, Grid, GridColumnSize, Row } from '@doyourjob/gravity-ui-page-constructor';
 import { block } from '../../../../utils/cn';
-import { PopupItem } from '../PopupItem/PopupItem';
-import './MediumPopup.css';
-const b = block('medium-popup');
-export const MediumPopup = ({ groups }) => (React.createElement(Grid, null,
+import { NHPopupItem } from '../NHPopupItem/NHPopupItem';
+import './NHMediumPopup.css';
+const b = block('nh-medium-popup');
+export const NHMediumPopup = ({ groups }) => (React.createElement(Grid, null,
     React.createElement(Row, null,
-        React.createElement(Col, { className: b() }, groups.map((dataItem) => dataItem.items.map((item) => (React.createElement(PopupItem, Object.assign({}, item, { key: item.title, hover: true, imageSize: dataItem.imageSize, sizes: {
+        React.createElement(Col, { className: b() }, groups.map((dataItem) => dataItem.items.map((item) => (React.createElement(NHPopupItem, Object.assign({}, item, { key: item.title, hover: true, imageSize: dataItem.imageSize, sizes: {
                 [GridColumnSize.Xl]: 3,
                 [GridColumnSize.Md]: 4,
                 [GridColumnSize.All]: 12,

package/build/{cjs/components/NewHeader/components/MobileNavigation/MobileNavigation.css → esm/components/NewHeader/components/NHMobileNavigation/NHMobileNavigation.css}

@@ -1,6 +1,6 @@
 /* use this for style redefinitions to awoid problems with
 unpredictable css rules order in build */
-.pc-addons-mobile-navigation {
+.pc-addons-nh-mobile-navigation {
   margin: 0;
   padding: 0;
   list-style: none;
@@ -8,40 +8,40 @@ unpredictable css rules order in build */
   line-height: var(--g-text-body-2-line-height, var(--pc-text-body-2-line-height));
 }
 
-.pc-addons-mobile-navigation__icon {
+.pc-addons-nh-mobile-navigation__icon {
   display: none;
 }
 
-.pc-addons-mobile-navigation__icon:hover:before {
+.pc-addons-nh-mobile-navigation__icon:hover:before {
   background: none;
 }
 
-.pc-addons-mobile-navigation__icon:hover .pc-addons-mobile-navigation__icon {
+.pc-addons-nh-mobile-navigation__icon:hover .pc-addons-nh-mobile-navigation__icon {
   color: var(--g-color-text-complementary);
 }
 
-.pc-addons-mobile-navigation__icon-icon {
+.pc-addons-nh-mobile-navigation__icon-icon {
   position: relative;
   top: 3px;
 }
 
-.pc-addons-mobile-navigation__icon_hidden {
+.pc-addons-nh-mobile-navigation__icon_hidden {
   display: none;
 }
 
-.pc-addons-mobile-navigation__user {
+.pc-addons-nh-mobile-navigation__user {
   margin-top: 24px;
 }
 
-.pc-addons-mobile-navigation__buttons {
+.pc-addons-nh-mobile-navigation__buttons {
   margin-top: 8px;
 }
 
 @media (max-width: 769px) {
-  .pc-addons-mobile-navigation__icon {
+  .pc-addons-nh-mobile-navigation__icon {
     display: block;
   }
-  .pc-addons-mobile-navigation__icon_hidden {
+  .pc-addons-nh-mobile-navigation__icon_hidden {
     display: none;
   }
 }

package/build/esm/components/NewHeader/components/{MobileNavigation/MobileNavigation.d.ts → NHMobileNavigation/NHMobileNavigation.d.ts}

@@ -1,15 +1,15 @@
 import React from 'react';
 import type { ButtonProps } from '@doyourjob/gravity-ui-page-constructor';
-import { MobileNavigationItemData } from '../../models';
-import './MobileNavigation.css';
+import { NHMobileNavigationItemData } from '../../models';
+import './NHMobileNavigation.css';
 interface MobileNavigationProps {
     isOpened: boolean;
     toogleOpen: (isOpened: boolean) => void;
     isSearchOpen: boolean;
-    data: MobileNavigationItemData[];
+    data: NHMobileNavigationItemData[];
     onMenuScroll: (scrollTop: number) => void;
     popupClassName?: string;
     buttons?: ButtonProps[];
 }
-export declare const MobileNavigation: ({ isOpened, toogleOpen, isSearchOpen, data, buttons, onMenuScroll, }: MobileNavigationProps) => React.JSX.Element;
+export declare const NHMobileNavigation: ({ isOpened, toogleOpen, isSearchOpen, data, buttons, onMenuScroll, }: MobileNavigationProps) => React.JSX.Element;
 export {};

package/build/esm/components/NewHeader/components/{MobileNavigation/MobileNavigation.js → NHMobileNavigation/NHMobileNavigation.js}

@@ -3,19 +3,19 @@ import { Button as PCButton } from '@doyourjob/gravity-ui-page-constructor';
 import { Bars, Xmark } from '@gravity-ui/icons';
 import { Button, Icon } from '@gravity-ui/uikit';
 import { block } from '../../../../utils/cn';
-import { MobileNavigationItem } from '../MobileNavigationItem/MobileNavigationItem';
-import { MobileNavigationPopup } from '../MobileNavigationPopup/MobileNavigationPopup';
-import './MobileNavigation.css';
-const b = block('mobile-navigation');
-export const MobileNavigation = ({ isOpened, toogleOpen, isSearchOpen, data, buttons, onMenuScroll, }) => (React.createElement("div", { className: b() },
+import { NHMobileNavigationItem } from '../NHMobileNavigationItem/NHMobileNavigationItem';
+import { NHMobileNavigationPopup } from '../NHMobileNavigationPopup/NHMobileNavigationPopup';
+import './NHMobileNavigation.css';
+const b = block('nh-mobile-navigation');
+export const NHMobileNavigation = ({ isOpened, toogleOpen, isSearchOpen, data, buttons, onMenuScroll, }) => (React.createElement("div", { className: b() },
     React.createElement(Button, { view: "flat", size: "l", className: b('icon', { hidden: isSearchOpen }), onClick: (e) => {
             e.stopPropagation();
             toogleOpen(!isOpened);
         } },
         React.createElement(Icon, { data: isOpened ? Xmark : Bars, size: 24 })),
-    React.createElement(MobileNavigationPopup, { isOpened: isOpened, onClose: () => toogleOpen(false), onMenuScroll: onMenuScroll },
+    React.createElement(NHMobileNavigationPopup, { isOpened: isOpened, onClose: () => toogleOpen(false), onMenuScroll: onMenuScroll },
         React.createElement("nav", null,
             React.createElement("ul", { className: b() }, data.map((item) => (React.createElement("li", { className: b(), key: item.title },
-                React.createElement(MobileNavigationItem, Object.assign({}, item)))))),
+                React.createElement(NHMobileNavigationItem, Object.assign({}, item)))))),
             buttons &&
                 (buttons === null || buttons === void 0 ? void 0 : buttons.map((button) => React.createElement(PCButton, Object.assign({}, button, { size: "l", key: button.text }))))))));

package/build/esm/components/NewHeader/components/{MobileNavigationItem/MobileNavigationItem.css → NHMobileNavigationItem/NHMobileNavigationItem.css}

@@ -1,20 +1,20 @@
 /* use this for style redefinitions to awoid problems with
 unpredictable css rules order in build */
-.pc-addons-mobile-navigation-item {
+.pc-addons-nh-mobile-navigation-item {
   display: flex;
   justify-content: space-between;
   position: relative;
   padding: 12px 0;
 }
 
-.pc-addons-mobile-navigation-item_type_link {
+.pc-addons-nh-mobile-navigation-item_type_link {
   color: inherit;
   text-decoration: none;
   display: block;
   color: var(--g-color-text-primary);
 }
 
-.pc-addons-mobile-navigation-item__arrow {
+.pc-addons-nh-mobile-navigation-item__arrow {
   display: flex;
   justify-content: center;
   align-items: center;
@@ -23,34 +23,34 @@ unpredictable css rules order in build */
   min-width: 20px;
 }
 
-.pc-addons-mobile-navigation-item__text {
+.pc-addons-nh-mobile-navigation-item__text {
   padding-right: 20px;
 }
 
-.pc-addons-mobile-navigation-item__list {
+.pc-addons-nh-mobile-navigation-item__list {
   padding: 10px 20px;
   background-color: var(--g-color-base-generic);
   border-radius: var(--g-border-radius-l);
 }
 
-.pc-addons-mobile-navigation-item__list:not(:first-child) {
+.pc-addons-nh-mobile-navigation-item__list:not(:first-child) {
   margin-top: 12px;
 }
 
-.pc-addons-mobile-navigation-item__list-items {
+.pc-addons-nh-mobile-navigation-item__list-items {
   margin: 0;
   padding: 0;
   list-style: none;
 }
 
-.pc-addons-mobile-navigation-item__list-title {
+.pc-addons-nh-mobile-navigation-item__list-title {
   font-size: var(--g-text-body-2-font-size, var(--pc-text-body-2-font-size));
   line-height: var(--g-text-body-2-line-height, var(--pc-text-body-2-line-height));
   margin: 0;
   padding: 10px 0;
 }
 
-.pc-addons-mobile-navigation-item__list-item {
+.pc-addons-nh-mobile-navigation-item__list-item {
   color: inherit;
   text-decoration: none;
   display: block;
@@ -58,12 +58,12 @@ unpredictable css rules order in build */
   padding: 10px 0;
 }
 
-.pc-addons-mobile-navigation-item__list-item:hover, .pc-addons-mobile-navigation-item__list-item:active {
+.pc-addons-nh-mobile-navigation-item__list-item:hover, .pc-addons-nh-mobile-navigation-item__list-item:active {
   --pc-text-header-color: inherit;
   color: inherit;
 }
 
-.pc-addons-mobile-navigation-item__list-link {
+.pc-addons-nh-mobile-navigation-item__list-link {
   color: inherit;
   text-decoration: none;
   outline: none;

package/build/esm/components/NewHeader/components/NHMobileNavigationItem/NHMobileNavigationItem.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { NHMobileNavigationItemData } from '../../models';
+import './NHMobileNavigationItem.css';
+export declare const NHMobileNavigationItem: (props: NHMobileNavigationItemData) => React.JSX.Element | null;

package/build/esm/components/NewHeader/components/{MobileNavigationItem/MobileNavigationItem.js → NHMobileNavigationItem/NHMobileNavigationItem.js}

@@ -1,9 +1,9 @@
 import React, { Fragment, useCallback, useState } from 'react';
 import { Foldable, ToggleArrow, getLinkProps } from '@doyourjob/gravity-ui-page-constructor';
 import { block } from '../../../../utils/cn';
-import './MobileNavigationItem.css';
-const b = block('mobile-navigation-item');
-export const MobileNavigationItem = (props) => {
+import './NHMobileNavigationItem.css';
+const b = block('nh-mobile-navigation-item');
+export const NHMobileNavigationItem = (props) => {
     const [isOpened, setIsOpened] = useState(false);
     const toggleOpen = useCallback(() => {
         setIsOpened(!isOpened);
@@ -17,7 +17,7 @@ export const MobileNavigationItem = (props) => {
                 React.createElement("div", { className: b('text') }, props.title),
                 React.createElement("div", { className: b('arrow') },
                     React.createElement(ToggleArrow, { size: 12, type: "vertical", open: isOpened, iconType: "navigation" }))),
-            React.createElement(Foldable, { isOpened: isOpened }, props.data.map(({ title: itemTitle, items }) => (React.createElement("div", { className: b('list'), key: items[0].title },
+            React.createElement(Foldable, { isOpened: isOpened }, props.data.map(({ title: itemTitle, items, }) => (React.createElement("div", { className: b('list'), key: items[0].title },
                 itemTitle && React.createElement("h5", { className: b('list-title') }, itemTitle),
                 React.createElement("ul", { className: b('list-items') }, items.map((linkItem) => (React.createElement("li", { className: b('li'), key: linkItem.title },
                     React.createElement("a", Object.assign({ href: linkItem.url, className: b('list-item') }, getLinkProps(linkItem.url || '')), linkItem.title)))))))))));

package/build/{cjs/components/NewHeader/components/MobileNavigationPopup/MobileNavigationPopup.css → esm/components/NewHeader/components/NHMobileNavigationPopup/NHMobileNavigationPopup.css}

@@ -1,6 +1,6 @@
 /* use this for style redefinitions to awoid problems with
 unpredictable css rules order in build */
-.pc-addons-mobile-navigation-popup {
+.pc-addons-nh-mobile-navigation-popup {
   width: 100%;
   position: fixed;
   top: 0;
@@ -11,44 +11,44 @@ unpredictable css rules order in build */
   box-shadow: 0 3px 10px var(--g-color-base-generic);
 }
 
-.pc-addons-mobile-navigation-popup__transition-enter {
+.pc-addons-nh-mobile-navigation-popup__transition-enter {
   transform: translateY(-30px);
   opacity: 0;
 }
 
-.pc-addons-mobile-navigation-popup__transition-enter-active {
+.pc-addons-nh-mobile-navigation-popup__transition-enter-active {
   transform: translateY(0);
   opacity: 1;
   transition: transform 0.4s, opacity 0.4s;
 }
 
-.pc-addons-mobile-navigation-popup__transition-exit {
+.pc-addons-nh-mobile-navigation-popup__transition-exit {
   transform: translateY(0);
   opacity: 1;
 }
 
-.pc-addons-mobile-navigation-popup__transition-exit .pc-addons-mobile-navigation-popup__container {
+.pc-addons-nh-mobile-navigation-popup__transition-exit .pc-addons-nh-mobile-navigation-popup__container {
   opacity: 0;
 }
 
-.pc-addons-mobile-navigation-popup__transition-exit-active {
+.pc-addons-nh-mobile-navigation-popup__transition-exit-active {
   transform: translateY(-30px);
   opacity: 0;
   transition: transform 0.4s, opacity 0.4s;
 }
 
-.pc-addons-mobile-navigation-popup__no-scroll {
+.pc-addons-nh-mobile-navigation-popup__no-scroll {
   overflow: hidden;
 }
 
-.pc-addons-mobile-navigation-popup__container {
+.pc-addons-nh-mobile-navigation-popup__container {
   padding: 4px 48px 0;
   overflow: scroll;
   height: 100%;
 }
 
 @media (max-width: 576px) {
-  .pc-addons-mobile-navigation-popup__container {
+  .pc-addons-nh-mobile-navigation-popup__container {
     padding-left: 24px;
     padding-right: 24px;
   }

package/build/esm/components/NewHeader/components/{MobileNavigationPopup/MobileNavigationPopup.d.ts → NHMobileNavigationPopup/NHMobileNavigationPopup.d.ts}

@@ -1,10 +1,10 @@
 import React from 'react';
-import './MobileNavigationPopup.css';
+import './NHMobileNavigationPopup.css';
 interface MobileNavigationPopupProps {
     isOpened: boolean;
     onClose: () => void;
     children: React.ReactNode;
     onMenuScroll: (scrollTop: number) => void;
 }
-export declare const MobileNavigationPopup: ({ isOpened, onClose, children, onMenuScroll, }: MobileNavigationPopupProps) => React.ReactPortal | null;
+export declare const NHMobileNavigationPopup: ({ isOpened, onClose, children, onMenuScroll, }: MobileNavigationPopupProps) => React.ReactPortal | null;
 export {};

package/build/esm/components/NewHeader/components/{MobileNavigationPopup/MobileNavigationPopup.js → NHMobileNavigationPopup/NHMobileNavigationPopup.js}

@@ -4,12 +4,12 @@ import { useBodyScrollLock } from '@gravity-ui/uikit';
 import ReactDOM from 'react-dom';
 import { CSSTransition } from 'react-transition-group';
 import { block } from '../../../../utils/cn';
-import './MobileNavigationPopup.css';
-const b = block('mobile-navigation-popup');
+import './NHMobileNavigationPopup.css';
+const b = block('nh-mobile-navigation-popup');
 const TRANSITION_TIME = 400;
 const POPUP_MARGIN = 80;
 const HEADER_HEIGHT = 68;
-export const MobileNavigationPopup = ({ isOpened, onClose, children, onMenuScroll, }) => {
+export const NHMobileNavigationPopup = ({ isOpened, onClose, children, onMenuScroll, }) => {
     const [body, setBody] = useState();
     const ref = useRef(null);
     const [containerHeight, setContainerHeight] = useState(0);

package/build/esm/components/NewHeader/components/{Navigation/Navigation.css → NHNavigation/NHNavigation.css}

@@ -1,6 +1,6 @@
 /* use this for style redefinitions to awoid problems with
 unpredictable css rules order in build */
-.pc-addons-navigation {
+.pc-addons-nh-navigation {
   margin: 0;
   padding: 0;
   list-style: none;
@@ -12,12 +12,12 @@ unpredictable css rules order in build */
 }
 
 @media (max-width: 768px) {
-  .pc-addons-navigation {
+  .pc-addons-nh-navigation {
     display: none;
   }
 }
 @media (max-width: 769px) {
-  .pc-addons-navigation {
+  .pc-addons-nh-navigation {
     display: none;
   }
 }

package/build/esm/components/NewHeader/components/NHNavigation/NHNavigation.d.ts

@@ -0,0 +1,11 @@
+import type { RefObject } from 'react';
+import React from 'react';
+import { NHNavigationItemData, SetupRouteChangeHandler } from '../../models';
+import './NHNavigation.css';
+interface NavigationProps {
+    data: NHNavigationItemData[];
+    headerRef?: RefObject<HTMLDivElement>;
+    setupRouteChangeHandler?: SetupRouteChangeHandler;
+}
+export declare const NHNavigation: ({ data, headerRef, setupRouteChangeHandler }: NavigationProps) => React.JSX.Element;
+export {};

package/build/esm/components/NewHeader/components/NHNavigation/NHNavigation.js

@@ -0,0 +1,70 @@
+import React, { useCallback, useEffect, useState } from 'react';
+import { block } from '../../../../utils/cn';
+import { NO_MENU_TAB_SELECTED, SWITCH_MENU_TAB_TIMEOUT } from '../../constants';
+import { NHNavigationItemType, } from '../../models';
+import { NHCompanyPopup } from '../NHCompanyPopup/NHCompanyPopup';
+import { NHInvestorPopup } from '../NHInvestorPopup/NHInvestorPopup';
+import { NHMediumPopup } from '../NHMediumPopup/NHMediumPopup';
+import { NHNavigationItem } from '../NHNavigationItem/NHNavigationItem';
+import { NHNavigationPopup } from '../NHNavigationPopup/NHNavigationPopup';
+import { NHProductsPopup } from '../NHProductsPopup/NHProductsPopup';
+import { NHResourcesPopup } from '../NHResourcesPopup/NHResourcesPopup';
+import { NHSolutionsPopup } from '../NHSolutionsPopup/NHSolutionsPopup';
+import { NHWhyPopup } from '../NHWhyPopup/NHWhyPopup';
+import './NHNavigation.css';
+const b = block('nh-navigation');
+const tooltipPrefixId = 'navigation-item-key';
+const getPopupContent = (sectionData) => {
+    const { type, data } = sectionData;
+    switch (type) {
+        case NHNavigationItemType.NHMediumPopup:
+            return React.createElement(NHMediumPopup, Object.assign({}, data));
+        case NHNavigationItemType.NHProductsPopup:
+            return React.createElement(NHProductsPopup, Object.assign({}, data));
+        case NHNavigationItemType.NHSolutionsPopup:
+            return React.createElement(NHSolutionsPopup, Object.assign({}, data));
+        case NHNavigationItemType.NHWhyPopup:
+            return React.createElement(NHWhyPopup, Object.assign({}, data));
+        case NHNavigationItemType.NHResourcesPopup:
+            return React.createElement(NHResourcesPopup, Object.assign({}, data));
+        case NHNavigationItemType.NHCompanyPopup:
+            return React.createElement(NHCompanyPopup, Object.assign({}, data));
+        case NHNavigationItemType.NHInvestorPopup:
+            return React.createElement(NHInvestorPopup, Object.assign({}, data));
+        default:
+            return null;
+    }
+};
+export const NHNavigation = ({ data, headerRef, setupRouteChangeHandler }) => {
+    const [activeTab, setActiveTab] = useState(NO_MENU_TAB_SELECTED);
+    const [pretendentActiveTab, setPretendentAciveTab] = useState(NO_MENU_TAB_SELECTED);
+    const [previouslyFocusedElement, setPreviouslyFocusedElement] = useState(null);
+    const handleActiveTab = useCallback((currentIndex) => {
+        setPreviouslyFocusedElement(document.activeElement);
+        setPretendentAciveTab(currentIndex);
+    }, []);
+    const onEscapeKeyDown = useCallback((event) => {
+        if (event.key === 'Escape') {
+            setActiveTab(NO_MENU_TAB_SELECTED);
+            setPretendentAciveTab(NO_MENU_TAB_SELECTED);
+            previouslyFocusedElement === null || previouslyFocusedElement === void 0 ? void 0 : previouslyFocusedElement.focus({ preventScroll: true });
+        }
+    }, [previouslyFocusedElement]);
+    useEffect(() => setupRouteChangeHandler === null || setupRouteChangeHandler === void 0 ? void 0 : setupRouteChangeHandler(() => {
+        handleActiveTab(NO_MENU_TAB_SELECTED);
+    }), [setupRouteChangeHandler, handleActiveTab]);
+    useEffect(() => {
+        const timerId = setTimeout(() => {
+            setActiveTab(pretendentActiveTab);
+        }, SWITCH_MENU_TAB_TIMEOUT);
+        return () => clearTimeout(timerId);
+    }, [activeTab, pretendentActiveTab]);
+    useEffect(() => {
+        document.addEventListener('keydown', onEscapeKeyDown);
+        return () => {
+            document.removeEventListener('keydown', onEscapeKeyDown);
+        };
+    }, [onEscapeKeyDown]);
+    return (React.createElement("nav", null,
+        React.createElement("ul", { className: b() }, data.map((item, i) => (React.createElement(NHNavigationItem, { key: item.title, item: item, handleActiveTab: handleActiveTab, index: i, isActive: activeTab === i, tooltipId: `${tooltipPrefixId}-${i}` }, activeTab === i && item.type !== NHNavigationItemType.Link && (React.createElement(NHNavigationPopup, { headerRef: headerRef, id: `${tooltipPrefixId}-${i}` }, getPopupContent(item)))))))));
+};

package/build/esm/components/NewHeader/components/{NavigationItem/NavigationItem.css → NHNavigationItem/NHNavigationItem.css}

@@ -1,19 +1,19 @@
 /* use this for style redefinitions to awoid problems with
 unpredictable css rules order in build */
-.pc-addons-navigation-item {
+.pc-addons-nh-navigation-item {
   white-space: nowrap;
   color: var(--g-color-text-primary);
 }
 
-.pc-addons-navigation-item:hover .pc-addons-navigation-item__text {
+.pc-addons-nh-navigation-item:hover .pc-addons-nh-navigation-item__text {
   color: var(--g-color-text-link);
 }
 
-.pc-addons-navigation-item_disable {
+.pc-addons-nh-navigation-item_disable {
   pointer-events: none;
 }
 
-.pc-addons-navigation-item__popup {
+.pc-addons-nh-navigation-item__popup {
   --yc-popup-border-width: 0;
   --yc-popup-border-color: none;
   border-radius: var(--pc-border-radius, 24px);
@@ -25,7 +25,7 @@ unpredictable css rules order in build */
   box-shadow: 0 4px 24px var(--g-color-base-generic-hover), 0 2px 8px var(--g-color-base-generic-hover);
 }
 
-.pc-addons-navigation-item__text {
+.pc-addons-nh-navigation-item__text {
   display: inline-block;
   margin: 0;
   padding: 0;
@@ -45,7 +45,7 @@ unpredictable css rules order in build */
   position: relative;
 }
 
-.pc-addons-navigation-item__text:focus::before {
+.pc-addons-nh-navigation-item__text:focus::before {
   content: "";
   width: 100%;
   height: calc(100% - 12px - 2px);
@@ -57,25 +57,25 @@ unpredictable css rules order in build */
   top: 2px;
 }
 
-.pc-addons-navigation-item__text:focus:not(:focus-visible)::before {
+.pc-addons-nh-navigation-item__text:focus:not(:focus-visible)::before {
   display: none;
 }
 
-.pc-addons-navigation-item__text_active {
+.pc-addons-nh-navigation-item__text_active {
   color: var(--g-color-text-link);
   border-color: var(--g-color-text-link);
 }
 
-.pc-addons-navigation-item__text_cursor_default {
+.pc-addons-nh-navigation-item__text_cursor_default {
   cursor: default;
 }
 
-.pc-addons-navigation-item:first-child .pc-addons-navigation-item__text {
+.pc-addons-nh-navigation-item:first-child .pc-addons-nh-navigation-item__text {
   margin-left: 0;
 }
 
 @media (max-width: 1296px) {
-  .pc-addons-navigation-item__popup {
+  .pc-addons-nh-navigation-item__popup {
     --yc-popover-max-width: calc(100% - 32px);
   }
 }

package/build/esm/components/NewHeader/components/{NavigationItem/NavigationItem.d.ts → NHNavigationItem/NHNavigationItem.d.ts}

@@ -1,13 +1,13 @@
 import type { FC, ReactNode } from 'react';
-import { NavigationItemData } from '../../models';
-import './NavigationItem.css';
+import { NHNavigationItemData } from '../../models';
+import './NHNavigationItem.css';
 interface NavigationItemOwnProps {
     index: number;
-    item: NavigationItemData;
+    item: NHNavigationItemData;
     isActive: boolean;
     handleActiveTab: (currentIndex: number) => void;
     children?: ReactNode;
     tooltipId?: string;
 }
-export declare const NavigationItem: FC<NavigationItemOwnProps>;
+export declare const NHNavigationItem: FC<NavigationItemOwnProps>;
 export {};

package/build/esm/components/NewHeader/components/{NavigationItem/NavigationItem.js → NHNavigationItem/NHNavigationItem.js}

@@ -3,10 +3,10 @@ import { getLinkProps } from '@doyourjob/gravity-ui-page-constructor';
 import { block } from '../../../../utils/cn';
 import { NO_MENU_TAB_SELECTED } from '../../constants';
 import { RouteChangeHandlerContext } from '../../contexts/route-change';
-import { NavigationItemType } from '../../models';
-import './NavigationItem.css';
-const b = block('navigation-item');
-export const NavigationItem = ({ item, isActive, handleActiveTab, index, children, tooltipId, }) => {
+import { NHNavigationItemType } from '../../models';
+import './NHNavigationItem.css';
+const b = block('nh-navigation-item');
+export const NHNavigationItem = ({ item, isActive, handleActiveTab, index, children, tooltipId, }) => {
     var _a, _b, _c, _d;
     const setupRouteChangeHandler = useContext(RouteChangeHandlerContext);
     const handleMouseEnter = useCallback(() => handleActiveTab(index), [handleActiveTab, index]);
@@ -14,7 +14,7 @@ export const NavigationItem = ({ item, isActive, handleActiveTab, index, childre
     useEffect(() => setupRouteChangeHandler === null || setupRouteChangeHandler === void 0 ? void 0 : setupRouteChangeHandler(() => {
         handleMouseLeave();
     }), [handleMouseLeave, setupRouteChangeHandler]);
-    if (item.type === NavigationItemType.Link) {
+    if (item.type === NHNavigationItemType.Link) {
         return (React.createElement("li", { key: item.title, className: b({ disable: !((_a = item.data) === null || _a === void 0 ? void 0 : _a.url) }), onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave },
             React.createElement("a", Object.assign({ className: b('text', { active: isActive }), href: (_b = item.data) === null || _b === void 0 ? void 0 : _b.url }, getLinkProps(((_c = item.data) === null || _c === void 0 ? void 0 : _c.url) || '', undefined, (_d = item.data) === null || _d === void 0 ? void 0 : _d.target)), item.title),
             children));

package/build/esm/components/NewHeader/components/{NavigationPopup/NavigationPopup.css → NHNavigationPopup/NHNavigationPopup.css}

@@ -1,10 +1,10 @@
-.pc-addons-navigation-popup {
+.pc-addons-nh-navigation-popup {
   position: absolute;
   margin: 0 32px;
   width: calc(100% - 64px);
   z-index: 10;
 }
 
-.pc-addons-navigation-popup:focus {
+.pc-addons-nh-navigation-popup:focus {
   outline: 0;
 }