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

package/build/cjs/components/NewHeader/NewHeader.css

@@ -30,6 +30,7 @@ unpredictable css rules order in build */
 .pc-addons-new-header__left, .pc-addons-new-header__right {
   display: flex;
   align-items: center;
+  gap: 40px;
 }
 
 .pc-addons-new-header__left {
@@ -41,6 +42,12 @@ unpredictable css rules order in build */
   width: 100%;
 }
 
+.pc-addons-new-header__wrap {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
 .pc-addons-new-header__icons-container {
   display: flex;
   align-items: center;

package/build/cjs/components/NewHeader/NewHeader.js

@@ -70,10 +70,11 @@ const NewHeader = ({ data, setupRouteChangeHandler, renderSearch, className, scr
                 react_1.default.createElement("div", { className: b('right') },
                     right ? (react_1.default.createElement("div", { className: b('navigation') },
                         react_1.default.createElement(NHNavigation_1.NHNavigation, { data: right, headerRef: headerRef }))) : null,
-                    react_1.default.createElement("div", { className: b('icons-container') }, renderSearch && renderSearch({ onActiveToggle: toggleSearch })),
-                    showButtonsContainer &&
-                        (buttons === null || buttons === void 0 ? void 0 : buttons.map((button) => (react_1.default.createElement(gravity_ui_page_constructor_1.Button, Object.assign({}, button, { size: "l", key: button.text }))))),
-                    login && react_1.default.createElement(NHLoginButton_1.NHLoginButton, { data: login, headerRef: headerRef }),
-                    mobile ? (react_1.default.createElement(NHMobileNavigation_1.NHMobileNavigation, { toogleOpen: toggleMobileNavigationPopup, isOpened: isMobileNavigationOpen, isSearchOpen: isSearchMode, data: mobile, buttons: buttons, onMenuScroll: onMenuScroll, popupClassName: b('user-popup') })) : null)))));
+                    react_1.default.createElement("div", { className: b('wrap') },
+                        react_1.default.createElement("div", { className: b('icons-container') }, renderSearch && renderSearch({ onActiveToggle: toggleSearch })),
+                        showButtonsContainer &&
+                            (buttons === null || buttons === void 0 ? void 0 : buttons.map((button) => (react_1.default.createElement(gravity_ui_page_constructor_1.Button, Object.assign({}, button, { size: "l", key: button.text }))))),
+                        login && react_1.default.createElement(NHLoginButton_1.NHLoginButton, { data: login, headerRef: headerRef }),
+                        mobile ? (react_1.default.createElement(NHMobileNavigation_1.NHMobileNavigation, { toogleOpen: toggleMobileNavigationPopup, isOpened: isMobileNavigationOpen, isSearchOpen: isSearchMode, data: mobile, buttons: buttons, onMenuScroll: onMenuScroll, popupClassName: b('user-popup') })) : null))))));
 };
 exports.NewHeader = NewHeader;

package/build/cjs/components/NewHeader/components/NHCompanyPopup/NHCompanyPopup.js

@@ -14,7 +14,7 @@ const NHCompanyPopup = ({ sections }) => (react_1.default.createElement(gravity_
         react_1.default.createElement(gravity_ui_page_constructor_1.Row, null,
             react_1.default.createElement(gravity_ui_page_constructor_1.Col, null,
                 react_1.default.createElement("div", { className: b('title') }, section.title))),
-        react_1.default.createElement(gravity_ui_page_constructor_1.Row, null, section.items.map((item) => (react_1.default.createElement(NHPopupItem_1.NHPopupItem, Object.assign({ key: item.title }, item, { sizes: index === 0
+        react_1.default.createElement(gravity_ui_page_constructor_1.Row, null, section.items.map((item) => (react_1.default.createElement(NHPopupItem_1.NHPopupItem, Object.assign({ key: item.title, hover: true }, item, { sizes: index === 0
                 ? { [gravity_ui_page_constructor_1.GridColumnSize.All]: 12 }
                 : { [gravity_ui_page_constructor_1.GridColumnSize.All]: 12, [gravity_ui_page_constructor_1.GridColumnSize.Md]: 6 } })))))))))));
 exports.NHCompanyPopup = NHCompanyPopup;

package/build/cjs/components/NewHeader/components/NHInvestorPopup/NHInvestorPopup.css

@@ -32,10 +32,17 @@ unpredictable css rules order in build */
 .pc-addons-nh-investor-popup__title {
   font-size: var(--g-text-header-1-font-size, var(--pc-text-header-1-font-size));
   line-height: var(--g-text-header-1-line-height, var(--pc-text-header-1-line-height));
+  color: inherit;
+  text-decoration: none;
+  display: flex;
   font-weight: 600;
   margin-bottom: 8px;
 }
 
+.pc-addons-nh-investor-popup__title:hover {
+  color: var(--g-color-text-link-hover);
+}
+
 .pc-addons-nh-investor-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));

package/build/cjs/components/NewHeader/components/NHInvestorPopup/NHInvestorPopup.js

@@ -13,7 +13,7 @@ const NHInvestorPopup = ({ title, subtitle, url, items, stock }) => (react_1.def
             react_1.default.createElement(gravity_ui_page_constructor_1.Col, null,
                 react_1.default.createElement("a", Object.assign({ href: url, className: b('title') }, (0, gravity_ui_page_constructor_1.getLinkProps)(url)), title),
                 react_1.default.createElement("div", { className: b('subtitle') }, subtitle))),
-        react_1.default.createElement(gravity_ui_page_constructor_1.Row, null, items.map((item) => (react_1.default.createElement(NHPopupItem_1.NHPopupItem, Object.assign({ key: item.title }, item, { sizes: { [gravity_ui_page_constructor_1.GridColumnSize.All]: 12, [gravity_ui_page_constructor_1.GridColumnSize.Md]: 6 } })))))),
+        react_1.default.createElement(gravity_ui_page_constructor_1.Row, null, items.map((item) => (react_1.default.createElement(NHPopupItem_1.NHPopupItem, Object.assign({ key: item.title, hover: true }, item, { sizes: { [gravity_ui_page_constructor_1.GridColumnSize.All]: 12, [gravity_ui_page_constructor_1.GridColumnSize.Md]: 6 } })))))),
     stock && (react_1.default.createElement("div", { className: b('card') },
         react_1.default.createElement("div", { className: b('card-title') }, stock.title),
         react_1.default.createElement("div", { className: b('card-wrap') },

package/build/cjs/components/NewHeader/components/NHLoginButton/NHLoginButton.css

@@ -0,0 +1,16 @@
+/* use this for style redefinitions to awoid problems with
+unpredictable css rules order in build */
+.pc-addons-nh-login-button {
+  display: flex;
+  align-items: center;
+  height: 36px;
+  gap: 4px;
+  padding: 0 8px 0 12px;
+  border-radius: 8px;
+  background: var(--g-color-base-brand);
+  color: var(--g-color-text-brand-contrast);
+}
+
+.pc-addons-nh-login-button:hover {
+  background: var(--g-color-base-brand-hover);
+}

package/build/cjs/components/NewHeader/components/NHLoginButton/NHLoginButton.js

@@ -3,9 +3,13 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.NHLoginButton = void 0;
 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 cn_1 = require("../../../../utils/cn");
 const constants_1 = require("../../constants");
 const NHLoginPopup_1 = require("../NHLoginPopup/NHLoginPopup");
 const NHNavigationPopup_1 = require("../NHNavigationPopup/NHNavigationPopup");
+const b = (0, cn_1.block)('nh-login-button');
 const NHLoginButton = ({ data, headerRef, setupRouteChangeHandler }) => {
     const [isActive, setIsActive] = (0, react_1.useState)(false);
     const [pretendentActiveTab, setPretendentAciveTab] = (0, react_1.useState)(false);
@@ -38,8 +42,9 @@ const NHLoginButton = ({ data, headerRef, setupRouteChangeHandler }) => {
     (0, react_1.useEffect)(() => setupRouteChangeHandler === null || setupRouteChangeHandler === void 0 ? void 0 : setupRouteChangeHandler(() => {
         handleMouseLeave();
     }), [handleMouseLeave, setupRouteChangeHandler]);
-    return (react_1.default.createElement("div", { onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave },
+    return (react_1.default.createElement("div", { className: b(), onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave },
         data.text,
+        react_1.default.createElement(uikit_1.Icon, { data: isActive ? icons_1.ChevronUp : icons_1.ChevronDown, size: 14 }),
         isActive && (react_1.default.createElement(NHNavigationPopup_1.NHNavigationPopup, { headerRef: headerRef },
             react_1.default.createElement(NHLoginPopup_1.NHLoginPopup, Object.assign({}, data))))));
 };

package/build/cjs/components/NewHeader/components/NHLoginPopup/NHLoginPopup.css

@@ -29,6 +29,12 @@ unpredictable css rules order in build */
   flex-direction: column;
   gap: 4px;
   width: 100%;
+  border-radius: 8px;
+  cursor: pointer;
+}
+
+.pc-addons-nh-login-popup__item:hover {
+  background: var(--g-color-private-black-50);
 }
 
 .pc-addons-nh-login-popup__title {

package/build/cjs/components/NewHeader/components/NHNavigation/NHNavigation.css

@@ -8,7 +8,7 @@ unpredictable css rules order in build */
   line-height: var(--g-text-body-2-line-height, var(--pc-text-body-2-line-height));
   display: flex;
   align-items: center;
-  margin-left: 2px;
+  gap: 20px;
 }
 
 @media (max-width: 768px) {

package/build/cjs/components/NewHeader/components/NHNavigationItem/NHNavigationItem.css

@@ -37,33 +37,15 @@ unpredictable css rules order in build */
   cursor: pointer;
   color: inherit;
   text-decoration: none;
-  display: block;
-  margin: 0 12px;
-  padding-bottom: 12px;
-  border-bottom: 2px solid transparent;
+  display: flex;
+  align-items: center;
+  gap: 4px;
   color: var(--g-color-text-primary);
   position: relative;
 }
 
-.pc-addons-nh-navigation-item__text:focus::before {
-  content: "";
-  width: 100%;
-  height: calc(100% - 12px - 2px);
-  position: absolute;
-  outline: 2px solid var(--g-color-line-focus);
-  border-radius: var(--g-focus-border-radius);
-  left: 0;
-  right: 0;
-  top: 2px;
-}
-
-.pc-addons-nh-navigation-item__text:focus:not(:focus-visible)::before {
-  display: none;
-}
-
 .pc-addons-nh-navigation-item__text_active {
   color: var(--g-color-text-link);
-  border-color: var(--g-color-text-link);
 }
 
 .pc-addons-nh-navigation-item__text_cursor_default {

package/build/cjs/components/NewHeader/components/NHNavigationItem/NHNavigationItem.js

@@ -4,6 +4,8 @@ exports.NHNavigationItem = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importStar(require("react"));
 const gravity_ui_page_constructor_1 = require("@doyourjob/gravity-ui-page-constructor");
+const icons_1 = require("@gravity-ui/icons");
+const uikit_1 = require("@gravity-ui/uikit");
 const cn_1 = require("../../../../utils/cn");
 const constants_1 = require("../../constants");
 const route_change_1 = require("../../contexts/route-change");
@@ -23,7 +25,9 @@ const NHNavigationItem = ({ item, isActive, handleActiveTab, index, children, to
             children));
     }
     return (react_1.default.createElement("li", { key: item.title, className: b({}), onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave },
-        react_1.default.createElement("button", { className: b('text', { active: isActive, cursor: 'default' }), onClick: handleMouseEnter, "aria-expanded": isActive, "aria-controls": tooltipId }, item.title),
+        react_1.default.createElement("button", { className: b('text', { active: isActive, cursor: 'default' }), onClick: handleMouseEnter, "aria-expanded": isActive, "aria-controls": tooltipId },
+            item.title,
+            react_1.default.createElement(uikit_1.Icon, { data: isActive ? icons_1.ChevronUp : icons_1.ChevronDown, size: 14 })),
         children));
 };
 exports.NHNavigationItem = NHNavigationItem;

package/build/cjs/components/NewHeader/components/NHPopupItem/NHPopupItem.css

@@ -36,10 +36,6 @@ unpredictable css rules order in build */
   padding: 6px 12px;
 }
 
-.pc-addons-nh-navigation-popup-item__content:hover, .pc-addons-nh-navigation-popup-item__content:active {
-  color: var(--g-color-base-brand);
-}
-
 .pc-addons-nh-navigation-popup-item__content_hover:hover, .pc-addons-nh-navigation-popup-item__content_hover:active {
   color: inherit;
 }

package/build/cjs/components/NewHeader/components/NHProductsPopup/NHProductsPopup.css

@@ -47,6 +47,8 @@ unpredictable css rules order in build */
 }
 
 .pc-addons-nh-products-popup__powered-card {
+  color: inherit;
+  text-decoration: none;
   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;
@@ -79,7 +81,13 @@ unpredictable css rules order in build */
   aspect-ratio: 1;
 }
 
+.pc-addons-nh-products-popup__powered-card:hover {
+  background-color: var(--g-color-base-simple-hover);
+}
+
 .pc-addons-nh-products-popup__run-card {
+  color: inherit;
+  text-decoration: none;
   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;
@@ -110,4 +118,8 @@ unpredictable css rules order in build */
 
 .pc-addons-nh-products-popup__run-card-image {
   height: 40px;
+}
+
+.pc-addons-nh-products-popup__run-card:hover {
+  background-color: var(--g-color-base-simple-hover);
 }

package/build/cjs/components/NewHeader/components/NHProductsPopup/NHProductsPopup.js

@@ -7,15 +7,15 @@ const gravity_ui_page_constructor_1 = require("@doyourjob/gravity-ui-page-constr
 const cn_1 = require("../../../../utils/cn");
 const NHPopupItem_1 = require("../NHPopupItem/NHPopupItem");
 const b = (0, cn_1.block)('nh-products-popup');
-const PoweredCard = ({ title, description, image }) => {
-    return (react_1.default.createElement("div", { className: b('powered-card') },
+const PoweredCard = ({ title, description, image, url }) => {
+    return (react_1.default.createElement("a", Object.assign({ href: url, className: b('powered-card') }, (0, gravity_ui_page_constructor_1.getLinkProps)(url)),
         react_1.default.createElement("div", { className: b('powered-card-wrap') },
             react_1.default.createElement("div", { className: b('powered-card-title') }, title),
             react_1.default.createElement("div", { className: b('powered-card-description') }, description)),
         react_1.default.createElement(gravity_ui_page_constructor_1.Image, { className: b('powered-card-image'), containerClassName: b('powered-card-container-image'), src: image })));
 };
-const RunCard = ({ title, description, image, border }) => {
-    return (react_1.default.createElement("div", { className: b('run-card', { border: border }) },
+const RunCard = ({ title, description, image, border, url }) => {
+    return (react_1.default.createElement("a", Object.assign({ href: url, className: b('run-card', { border: border }) }, (0, gravity_ui_page_constructor_1.getLinkProps)(url)),
         react_1.default.createElement(gravity_ui_page_constructor_1.Image, { className: b('run-card-image'), src: image }),
         react_1.default.createElement("div", { className: b('run-card-wrap') },
             react_1.default.createElement("div", { className: b('run-card-title') }, title),

package/build/cjs/components/NewHeader/components/NHResourcesPopup/NHResourcesPopup.css

@@ -41,10 +41,17 @@ unpredictable css rules order in build */
 .pc-addons-nh-resources-popup__title {
   font-size: var(--g-text-header-1-font-size, var(--pc-text-header-1-font-size));
   line-height: var(--g-text-header-1-line-height, var(--pc-text-header-1-line-height));
+  color: inherit;
+  text-decoration: none;
+  display: flex;
   font-weight: 600;
   margin-bottom: 8px;
 }
 
+.pc-addons-nh-resources-popup__title:hover {
+  color: var(--g-color-text-link-hover);
+}
+
 .pc-addons-nh-resources-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));
@@ -70,6 +77,8 @@ unpredictable css rules order in build */
 }
 
 .pc-addons-nh-resources-popup__banner {
+  color: inherit;
+  text-decoration: none;
   background-color: #f2f6f9;
   border-radius: 16px;
   display: flex;
@@ -125,7 +134,13 @@ unpredictable css rules order in build */
   color: #9fb1bd;
 }
 
+.pc-addons-nh-resources-popup__banner:hover {
+  background-color: var(--g-color-base-simple-hover);
+}
+
 .pc-addons-nh-resources-popup__event-card {
+  color: inherit;
+  text-decoration: none;
   position: relative;
   display: flex;
   flex-direction: column;
@@ -188,4 +203,8 @@ unpredictable css rules order in build */
   line-height: var(--g-text-body-2-line-height, var(--pc-text-body-2-line-height));
   font-weight: 500;
   color: #9fb1bd;
+}
+
+.pc-addons-nh-resources-popup__event-card:hover {
+  background-color: var(--g-color-base-simple-hover);
 }

package/build/cjs/components/NewHeader/components/NHResourcesPopup/NHResourcesPopup.js

@@ -7,8 +7,8 @@ const gravity_ui_page_constructor_1 = require("@doyourjob/gravity-ui-page-constr
 const cn_1 = require("../../../../utils/cn");
 const NHPopupItem_1 = require("../NHPopupItem/NHPopupItem");
 const b = (0, cn_1.block)('nh-resources-popup');
-const EventCard = ({ tag, image, date, title, location }) => {
-    return (react_1.default.createElement("div", { className: b('event-card') },
+const EventCard = ({ url, tag, image, date, title, location }) => {
+    return (react_1.default.createElement("a", Object.assign({ href: url, className: b('event-card') }, (0, gravity_ui_page_constructor_1.getLinkProps)(url)),
         react_1.default.createElement("div", { className: b('event-card-tag') }, tag),
         react_1.default.createElement(gravity_ui_page_constructor_1.Image, { className: b('event-card-image'), containerClassName: b('event-card-container-image'), src: image }),
         react_1.default.createElement("div", { className: b('event-card-content') },
@@ -25,7 +25,7 @@ const NHResourcesPopup = ({ groups, banner, events }) => (react_1.default.create
                     react_1.default.createElement("a", Object.assign({ href: group.url, className: b('title') }, (0, gravity_ui_page_constructor_1.getLinkProps)(group.url)), group.title),
                     react_1.default.createElement("div", { className: b('subtitle') }, group.subtitle)),
                 react_1.default.createElement(gravity_ui_page_constructor_1.Col, { sizes: { [gravity_ui_page_constructor_1.GridColumnSize.Md]: 4, [gravity_ui_page_constructor_1.GridColumnSize.All]: 12 } })),
-            react_1.default.createElement(gravity_ui_page_constructor_1.Row, null, group.items.map((item) => (react_1.default.createElement(NHPopupItem_1.NHPopupItem, Object.assign({ key: item.title }, item)))))))),
+            react_1.default.createElement(gravity_ui_page_constructor_1.Row, null, group.items.map((item) => (react_1.default.createElement(NHPopupItem_1.NHPopupItem, Object.assign({ key: item.title, hover: true }, item)))))))),
         banner && (react_1.default.createElement("div", { className: b('group') },
             react_1.default.createElement(gravity_ui_page_constructor_1.Row, null,
                 react_1.default.createElement(gravity_ui_page_constructor_1.Col, null,

package/build/cjs/components/NewHeader/components/NHWhyPopup/NHWhyPopup.js

@@ -12,7 +12,7 @@ const NHWhyPopup = ({ groups, card }) => (react_1.default.createElement(gravity_
         react_1.default.createElement(gravity_ui_page_constructor_1.Row, null,
             react_1.default.createElement(gravity_ui_page_constructor_1.Col, null,
                 react_1.default.createElement("div", { className: b('title') }, group.title))),
-        react_1.default.createElement(gravity_ui_page_constructor_1.Row, null, group.items.map((item) => (react_1.default.createElement(NHPopupItem_1.NHPopupItem, Object.assign({ key: item.title }, item, { sizes: { [gravity_ui_page_constructor_1.GridColumnSize.All]: 12 } }))))))))),
+        react_1.default.createElement(gravity_ui_page_constructor_1.Row, null, group.items.map((item) => (react_1.default.createElement(NHPopupItem_1.NHPopupItem, Object.assign({ key: item.title }, item, { hover: true, sizes: { [gravity_ui_page_constructor_1.GridColumnSize.All]: 12 } }))))))))),
     card && (react_1.default.createElement("div", { className: b('card') },
         react_1.default.createElement(gravity_ui_page_constructor_1.Image, { className: b('card-image'), containerClassName: b('card-container-image'), src: card.image }),
         react_1.default.createElement("div", { className: b('card-wrap') },

package/build/cjs/components/NewHeader/models.d.ts

@@ -47,12 +47,14 @@ export interface NHSpecialCardData {
     title: string;
     description: string;
     image: string;
+    url: string;
 }
 export interface NHRunCardData {
     title: string;
     description: string;
     image: string;
     border?: boolean;
+    url: string;
 }
 export interface NHProductsPopupSection {
     title: string;
@@ -88,6 +90,7 @@ export interface NHBannerData {
     url: string;
 }
 export interface NHEventCardData {
+    url: string;
     tag: string;
     title: string;
     date: string;

package/build/esm/components/NewHeader/NewHeader.css

@@ -30,6 +30,7 @@ unpredictable css rules order in build */
 .pc-addons-new-header__left, .pc-addons-new-header__right {
   display: flex;
   align-items: center;
+  gap: 40px;
 }
 
 .pc-addons-new-header__left {
@@ -41,6 +42,12 @@ unpredictable css rules order in build */
   width: 100%;
 }
 
+.pc-addons-new-header__wrap {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
 .pc-addons-new-header__icons-container {
   display: flex;
   align-items: center;

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

@@ -67,9 +67,10 @@ export const NewHeader = ({ data, setupRouteChangeHandler, renderSearch, classNa
                 React.createElement("div", { className: b('right') },
                     right ? (React.createElement("div", { className: b('navigation') },
                         React.createElement(NHNavigation, { data: right, headerRef: headerRef }))) : null,
-                    React.createElement("div", { className: b('icons-container') }, renderSearch && renderSearch({ onActiveToggle: toggleSearch })),
-                    showButtonsContainer &&
-                        (buttons === null || buttons === void 0 ? void 0 : buttons.map((button) => (React.createElement(PCButton, Object.assign({}, button, { size: "l", key: button.text }))))),
-                    login && React.createElement(NHLoginButton, { data: login, headerRef: headerRef }),
-                    mobile ? (React.createElement(NHMobileNavigation, { toogleOpen: toggleMobileNavigationPopup, isOpened: isMobileNavigationOpen, isSearchOpen: isSearchMode, data: mobile, buttons: buttons, onMenuScroll: onMenuScroll, popupClassName: b('user-popup') })) : null)))));
+                    React.createElement("div", { className: b('wrap') },
+                        React.createElement("div", { className: b('icons-container') }, renderSearch && renderSearch({ onActiveToggle: toggleSearch })),
+                        showButtonsContainer &&
+                            (buttons === null || buttons === void 0 ? void 0 : buttons.map((button) => (React.createElement(PCButton, Object.assign({}, button, { size: "l", key: button.text }))))),
+                        login && React.createElement(NHLoginButton, { data: login, headerRef: headerRef }),
+                        mobile ? (React.createElement(NHMobileNavigation, { toogleOpen: toggleMobileNavigationPopup, isOpened: isMobileNavigationOpen, isSearchOpen: isSearchMode, data: mobile, buttons: buttons, onMenuScroll: onMenuScroll, popupClassName: b('user-popup') })) : null))))));
 };

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

@@ -11,6 +11,6 @@ export const NHCompanyPopup = ({ sections }) => (React.createElement(Grid, { cla
         React.createElement(Row, null,
             React.createElement(Col, null,
                 React.createElement("div", { className: b('title') }, section.title))),
-        React.createElement(Row, null, section.items.map((item) => (React.createElement(NHPopupItem, Object.assign({ key: item.title }, item, { sizes: index === 0
+        React.createElement(Row, null, section.items.map((item) => (React.createElement(NHPopupItem, Object.assign({ key: item.title, hover: true }, item, { sizes: index === 0
                 ? { [GridColumnSize.All]: 12 }
                 : { [GridColumnSize.All]: 12, [GridColumnSize.Md]: 6 } })))))))))));

package/build/esm/components/NewHeader/components/NHInvestorPopup/NHInvestorPopup.css

@@ -32,10 +32,17 @@ unpredictable css rules order in build */
 .pc-addons-nh-investor-popup__title {
   font-size: var(--g-text-header-1-font-size, var(--pc-text-header-1-font-size));
   line-height: var(--g-text-header-1-line-height, var(--pc-text-header-1-line-height));
+  color: inherit;
+  text-decoration: none;
+  display: flex;
   font-weight: 600;
   margin-bottom: 8px;
 }
 
+.pc-addons-nh-investor-popup__title:hover {
+  color: var(--g-color-text-link-hover);
+}
+
 .pc-addons-nh-investor-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));

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

@@ -10,7 +10,7 @@ export const NHInvestorPopup = ({ title, subtitle, url, items, stock }) => (Reac
             React.createElement(Col, null,
                 React.createElement("a", Object.assign({ href: url, className: b('title') }, getLinkProps(url)), title),
                 React.createElement("div", { className: b('subtitle') }, subtitle))),
-        React.createElement(Row, null, items.map((item) => (React.createElement(NHPopupItem, Object.assign({ key: item.title }, item, { sizes: { [GridColumnSize.All]: 12, [GridColumnSize.Md]: 6 } })))))),
+        React.createElement(Row, null, items.map((item) => (React.createElement(NHPopupItem, Object.assign({ key: item.title, hover: true }, item, { sizes: { [GridColumnSize.All]: 12, [GridColumnSize.Md]: 6 } })))))),
     stock && (React.createElement("div", { className: b('card') },
         React.createElement("div", { className: b('card-title') }, stock.title),
         React.createElement("div", { className: b('card-wrap') },

package/build/esm/components/NewHeader/components/NHLoginButton/NHLoginButton.css

@@ -0,0 +1,16 @@
+/* use this for style redefinitions to awoid problems with
+unpredictable css rules order in build */
+.pc-addons-nh-login-button {
+  display: flex;
+  align-items: center;
+  height: 36px;
+  gap: 4px;
+  padding: 0 8px 0 12px;
+  border-radius: 8px;
+  background: var(--g-color-base-brand);
+  color: var(--g-color-text-brand-contrast);
+}
+
+.pc-addons-nh-login-button:hover {
+  background: var(--g-color-base-brand-hover);
+}

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

@@ -1,6 +1,7 @@
 import type { RefObject } from 'react';
 import React from 'react';
 import { NHLoginPopupData, SetupRouteChangeHandler } from '../../models';
+import './NHLoginButton.css';
 interface LoginButtonProps {
     data: NHLoginPopupData;
     headerRef?: RefObject<HTMLDivElement>;

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

@@ -1,7 +1,12 @@
 import React, { useCallback, useEffect, useState } from 'react';
+import { ChevronDown, ChevronUp } from '@gravity-ui/icons';
+import { Icon } from '@gravity-ui/uikit';
+import { block } from '../../../../utils/cn';
 import { SWITCH_MENU_TAB_TIMEOUT } from '../../constants';
 import { NHLoginPopup } from '../NHLoginPopup/NHLoginPopup';
 import { NHNavigationPopup } from '../NHNavigationPopup/NHNavigationPopup';
+import './NHLoginButton.css';
+const b = block('nh-login-button');
 export const NHLoginButton = ({ data, headerRef, setupRouteChangeHandler }) => {
     const [isActive, setIsActive] = useState(false);
     const [pretendentActiveTab, setPretendentAciveTab] = useState(false);
@@ -34,8 +39,9 @@ export const NHLoginButton = ({ data, headerRef, setupRouteChangeHandler }) => {
     useEffect(() => setupRouteChangeHandler === null || setupRouteChangeHandler === void 0 ? void 0 : setupRouteChangeHandler(() => {
         handleMouseLeave();
     }), [handleMouseLeave, setupRouteChangeHandler]);
-    return (React.createElement("div", { onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave },
+    return (React.createElement("div", { className: b(), onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave },
         data.text,
+        React.createElement(Icon, { data: isActive ? ChevronUp : ChevronDown, size: 14 }),
         isActive && (React.createElement(NHNavigationPopup, { headerRef: headerRef },
             React.createElement(NHLoginPopup, Object.assign({}, data))))));
 };

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

@@ -29,6 +29,12 @@ unpredictable css rules order in build */
   flex-direction: column;
   gap: 4px;
   width: 100%;
+  border-radius: 8px;
+  cursor: pointer;
+}
+
+.pc-addons-nh-login-popup__item:hover {
+  background: var(--g-color-private-black-50);
 }
 
 .pc-addons-nh-login-popup__title {

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

@@ -8,7 +8,7 @@ unpredictable css rules order in build */
   line-height: var(--g-text-body-2-line-height, var(--pc-text-body-2-line-height));
   display: flex;
   align-items: center;
-  margin-left: 2px;
+  gap: 20px;
 }
 
 @media (max-width: 768px) {

package/build/esm/components/NewHeader/components/NHNavigationItem/NHNavigationItem.css

@@ -37,33 +37,15 @@ unpredictable css rules order in build */
   cursor: pointer;
   color: inherit;
   text-decoration: none;
-  display: block;
-  margin: 0 12px;
-  padding-bottom: 12px;
-  border-bottom: 2px solid transparent;
+  display: flex;
+  align-items: center;
+  gap: 4px;
   color: var(--g-color-text-primary);
   position: relative;
 }
 
-.pc-addons-nh-navigation-item__text:focus::before {
-  content: "";
-  width: 100%;
-  height: calc(100% - 12px - 2px);
-  position: absolute;
-  outline: 2px solid var(--g-color-line-focus);
-  border-radius: var(--g-focus-border-radius);
-  left: 0;
-  right: 0;
-  top: 2px;
-}
-
-.pc-addons-nh-navigation-item__text:focus:not(:focus-visible)::before {
-  display: none;
-}
-
 .pc-addons-nh-navigation-item__text_active {
   color: var(--g-color-text-link);
-  border-color: var(--g-color-text-link);
 }
 
 .pc-addons-nh-navigation-item__text_cursor_default {

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

@@ -1,5 +1,7 @@
 import React, { useCallback, useContext, useEffect } from 'react';
 import { getLinkProps } from '@doyourjob/gravity-ui-page-constructor';
+import { ChevronDown, ChevronUp } from '@gravity-ui/icons';
+import { Icon } from '@gravity-ui/uikit';
 import { block } from '../../../../utils/cn';
 import { NO_MENU_TAB_SELECTED } from '../../constants';
 import { RouteChangeHandlerContext } from '../../contexts/route-change';
@@ -20,6 +22,8 @@ export const NHNavigationItem = ({ item, isActive, handleActiveTab, index, child
             children));
     }
     return (React.createElement("li", { key: item.title, className: b({}), onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave },
-        React.createElement("button", { className: b('text', { active: isActive, cursor: 'default' }), onClick: handleMouseEnter, "aria-expanded": isActive, "aria-controls": tooltipId }, item.title),
+        React.createElement("button", { className: b('text', { active: isActive, cursor: 'default' }), onClick: handleMouseEnter, "aria-expanded": isActive, "aria-controls": tooltipId },
+            item.title,
+            React.createElement(Icon, { data: isActive ? ChevronUp : ChevronDown, size: 14 })),
         children));
 };

package/build/esm/components/NewHeader/components/NHPopupItem/NHPopupItem.css

@@ -36,10 +36,6 @@ unpredictable css rules order in build */
   padding: 6px 12px;
 }
 
-.pc-addons-nh-navigation-popup-item__content:hover, .pc-addons-nh-navigation-popup-item__content:active {
-  color: var(--g-color-base-brand);
-}
-
 .pc-addons-nh-navigation-popup-item__content_hover:hover, .pc-addons-nh-navigation-popup-item__content_hover:active {
   color: inherit;
 }

package/build/esm/components/NewHeader/components/NHProductsPopup/NHProductsPopup.css

@@ -47,6 +47,8 @@ unpredictable css rules order in build */
 }
 
 .pc-addons-nh-products-popup__powered-card {
+  color: inherit;
+  text-decoration: none;
   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;
@@ -79,7 +81,13 @@ unpredictable css rules order in build */
   aspect-ratio: 1;
 }
 
+.pc-addons-nh-products-popup__powered-card:hover {
+  background-color: var(--g-color-base-simple-hover);
+}
+
 .pc-addons-nh-products-popup__run-card {
+  color: inherit;
+  text-decoration: none;
   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;
@@ -110,4 +118,8 @@ unpredictable css rules order in build */
 
 .pc-addons-nh-products-popup__run-card-image {
   height: 40px;
+}
+
+.pc-addons-nh-products-popup__run-card:hover {
+  background-color: var(--g-color-base-simple-hover);
 }

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

@@ -1,18 +1,18 @@
 import React from 'react';
-import { Col, Grid, GridColumnSize, Image, Row } from '@doyourjob/gravity-ui-page-constructor';
+import { Col, Grid, GridColumnSize, Image, Row, getLinkProps, } from '@doyourjob/gravity-ui-page-constructor';
 import { block } from '../../../../utils/cn';
 import { NHPopupItem } from '../NHPopupItem/NHPopupItem';
 import './NHProductsPopup.css';
 const b = block('nh-products-popup');
-const PoweredCard = ({ title, description, image }) => {
-    return (React.createElement("div", { className: b('powered-card') },
+const PoweredCard = ({ title, description, image, url }) => {
+    return (React.createElement("a", Object.assign({ href: url, className: b('powered-card') }, getLinkProps(url)),
         React.createElement("div", { className: b('powered-card-wrap') },
             React.createElement("div", { className: b('powered-card-title') }, title),
             React.createElement("div", { className: b('powered-card-description') }, description)),
         React.createElement(Image, { className: b('powered-card-image'), containerClassName: b('powered-card-container-image'), src: image })));
 };
-const RunCard = ({ title, description, image, border }) => {
-    return (React.createElement("div", { className: b('run-card', { border: border }) },
+const RunCard = ({ title, description, image, border, url }) => {
+    return (React.createElement("a", Object.assign({ href: url, className: b('run-card', { border: border }) }, getLinkProps(url)),
         React.createElement(Image, { className: b('run-card-image'), src: image }),
         React.createElement("div", { className: b('run-card-wrap') },
             React.createElement("div", { className: b('run-card-title') }, title),

package/build/esm/components/NewHeader/components/NHResourcesPopup/NHResourcesPopup.css

@@ -41,10 +41,17 @@ unpredictable css rules order in build */
 .pc-addons-nh-resources-popup__title {
   font-size: var(--g-text-header-1-font-size, var(--pc-text-header-1-font-size));
   line-height: var(--g-text-header-1-line-height, var(--pc-text-header-1-line-height));
+  color: inherit;
+  text-decoration: none;
+  display: flex;
   font-weight: 600;
   margin-bottom: 8px;
 }
 
+.pc-addons-nh-resources-popup__title:hover {
+  color: var(--g-color-text-link-hover);
+}
+
 .pc-addons-nh-resources-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));
@@ -70,6 +77,8 @@ unpredictable css rules order in build */
 }
 
 .pc-addons-nh-resources-popup__banner {
+  color: inherit;
+  text-decoration: none;
   background-color: #f2f6f9;
   border-radius: 16px;
   display: flex;
@@ -125,7 +134,13 @@ unpredictable css rules order in build */
   color: #9fb1bd;
 }
 
+.pc-addons-nh-resources-popup__banner:hover {
+  background-color: var(--g-color-base-simple-hover);
+}
+
 .pc-addons-nh-resources-popup__event-card {
+  color: inherit;
+  text-decoration: none;
   position: relative;
   display: flex;
   flex-direction: column;
@@ -188,4 +203,8 @@ unpredictable css rules order in build */
   line-height: var(--g-text-body-2-line-height, var(--pc-text-body-2-line-height));
   font-weight: 500;
   color: #9fb1bd;
+}
+
+.pc-addons-nh-resources-popup__event-card:hover {
+  background-color: var(--g-color-base-simple-hover);
 }

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

@@ -4,8 +4,8 @@ import { block } from '../../../../utils/cn';
 import { NHPopupItem } from '../NHPopupItem/NHPopupItem';
 import './NHResourcesPopup.css';
 const b = block('nh-resources-popup');
-const EventCard = ({ tag, image, date, title, location }) => {
-    return (React.createElement("div", { className: b('event-card') },
+const EventCard = ({ url, tag, image, date, title, location }) => {
+    return (React.createElement("a", Object.assign({ href: url, className: b('event-card') }, getLinkProps(url)),
         React.createElement("div", { className: b('event-card-tag') }, tag),
         React.createElement(Image, { className: b('event-card-image'), containerClassName: b('event-card-container-image'), src: image }),
         React.createElement("div", { className: b('event-card-content') },
@@ -22,7 +22,7 @@ export const NHResourcesPopup = ({ groups, banner, events }) => (React.createEle
                     React.createElement("a", Object.assign({ href: group.url, className: b('title') }, getLinkProps(group.url)), group.title),
                     React.createElement("div", { className: b('subtitle') }, group.subtitle)),
                 React.createElement(Col, { sizes: { [GridColumnSize.Md]: 4, [GridColumnSize.All]: 12 } })),
-            React.createElement(Row, null, group.items.map((item) => (React.createElement(NHPopupItem, Object.assign({ key: item.title }, item)))))))),
+            React.createElement(Row, null, group.items.map((item) => (React.createElement(NHPopupItem, Object.assign({ key: item.title, hover: true }, item)))))))),
         banner && (React.createElement("div", { className: b('group') },
             React.createElement(Row, null,
                 React.createElement(Col, null,

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

@@ -9,7 +9,7 @@ export const NHWhyPopup = ({ groups, card }) => (React.createElement(Grid, { cla
         React.createElement(Row, null,
             React.createElement(Col, null,
                 React.createElement("div", { className: b('title') }, group.title))),
-        React.createElement(Row, null, group.items.map((item) => (React.createElement(NHPopupItem, Object.assign({ key: item.title }, item, { sizes: { [GridColumnSize.All]: 12 } }))))))))),
+        React.createElement(Row, null, group.items.map((item) => (React.createElement(NHPopupItem, Object.assign({ key: item.title }, item, { hover: true, sizes: { [GridColumnSize.All]: 12 } }))))))))),
     card && (React.createElement("div", { className: b('card') },
         React.createElement(Image, { className: b('card-image'), containerClassName: b('card-container-image'), src: card.image }),
         React.createElement("div", { className: b('card-wrap') },

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

@@ -47,12 +47,14 @@ export interface NHSpecialCardData {
     title: string;
     description: string;
     image: string;
+    url: string;
 }
 export interface NHRunCardData {
     title: string;
     description: string;
     image: string;
     border?: boolean;
+    url: string;
 }
 export interface NHProductsPopupSection {
     title: string;
@@ -88,6 +90,7 @@ export interface NHBannerData {
     url: string;
 }
 export interface NHEventCardData {
+    url: string;
     tag: string;
     title: string;
     date: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@doyourjob/gravity-ui-page-constructor-addons",
-  "version": "2.1.25-dev.1",
+  "version": "2.1.25-dev.2",
   "description": "Components and plugins for @doyourjob/gravity-ui-page-constructor",
   "license": "MIT",
   "repository": {