@cloud-ru/uikit-product-site-header 0.4.10 → 0.5.0

package/CHANGELOG.md

@@ -3,6 +3,28 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# 0.5.0 (2025-11-13)
+
+
+### Features
+
+* **SITE-10174:** update headerItems for a/b test ([fee9eb7](https://gitverse.ru/cloud-ru-tech/uikit-product/commits/fee9eb73144a9c68b8d109ee386fe97752aec9b2))
+
+
+
+
+
+## 0.4.11 (2025-11-13)
+
+
+### Bug Fixes
+
+* **PD-3377:** removed contributors ([121640f](https://gitverse.ru/cloud-ru-tech/uikit-product/commits/121640f7b88b20a728a6ad2c39de8841532bb308))
+
+
+
+
+
 ## 0.4.10 (2025-11-13)
 
 ### Only dependencies have been changed

package/dist/cjs/components/HeaderItems/HeaderItem.js

@@ -68,7 +68,7 @@ function HeaderItems({ linkItems, isMobileTabletView, activeLinkItemId }) {
     if (!linkItems || isMobileTabletView)
         return null;
     const isVisibleEmpty = visibleItems.length === 0;
-    return ((0, jsx_runtime_1.jsxs)("div", { className: styles_module_scss_1.default.wrapper, children: [(0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)(styles_module_scss_1.default.linkItemsContainer, styles_module_scss_1.default.hiddenRow), ref: hiddenRowElementRef, children: linkItems.map((linkItem, index) => ((0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.lastItemContainer, ref: setItemElement(linkItem, index), children: (0, jsx_runtime_1.jsx)(helperComponents_1.LinkItemHeader, { label: linkItem.label, target: linkItem.target, href: linkItem.href, onClick: linkItem.onClick }) }, linkItem.id))) }), (0, jsx_runtime_1.jsxs)("div", { className: (0, classnames_1.default)(styles_module_scss_1.default.linkItemsContainer, {
+    return ((0, jsx_runtime_1.jsxs)("div", { className: styles_module_scss_1.default.wrapper, children: [(0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)(styles_module_scss_1.default.linkItemsContainer, styles_module_scss_1.default.hiddenRow), ref: hiddenRowElementRef, children: linkItems.map((linkItem, index) => ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: (0, classnames_1.default)(styles_module_scss_1.default.lastItemContainer, linkItem.className), ref: setItemElement(linkItem, index) }, linkItem.dataAttributes, { children: (0, jsx_runtime_1.jsx)(helperComponents_1.LinkItemHeader, { label: linkItem.label, target: linkItem.target, href: linkItem.href, onClick: linkItem.onClick }) }), linkItem.id))) }), (0, jsx_runtime_1.jsxs)("div", { className: (0, classnames_1.default)(styles_module_scss_1.default.linkItemsContainer, {
                     [styles_module_scss_1.default.linkItemsFirstViewContainer]: isVisibleEmpty,
-                }), children: [(isVisibleEmpty ? linkItems : visibleItems).map(linkItem => ((0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.lastItemContainer, children: (0, jsx_runtime_1.jsx)(helperComponents_1.LinkItemHeader, { label: linkItem.label, href: linkItem.href, onClick: linkItem.onClick, active: activeLinkItemId === linkItem.id }) }, linkItem.id))), hiddenItems.length > 0 && (0, jsx_runtime_1.jsx)(helperComponents_1.MoreButton, { linkItemsArray: hiddenItems, activeItemId: activeLinkItemId })] })] }));
+                }), children: [(isVisibleEmpty ? linkItems : visibleItems).map(linkItem => ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: (0, classnames_1.default)(styles_module_scss_1.default.lastItemContainer, linkItem.className) }, linkItem.dataAttributes, { children: (0, jsx_runtime_1.jsx)(helperComponents_1.LinkItemHeader, { label: linkItem.label, href: linkItem.href, onClick: linkItem.onClick, active: activeLinkItemId === linkItem.id }) }), linkItem.id))), hiddenItems.length > 0 && (0, jsx_runtime_1.jsx)(helperComponents_1.MoreButton, { linkItemsArray: hiddenItems, activeItemId: activeLinkItemId })] })] }));
 }

package/dist/cjs/components/HeaderItems/types.d.ts

@@ -9,4 +9,10 @@ export type LinkItem = {
     href?: string;
     /** target для ссылки элемента */
     target?: string;
+    /** className для элемента списка */
+    className?: string;
+    /** Кастомные data-атрибуты для a/b теста и тд */
+    dataAttributes?: {
+        [key: string]: string;
+    };
 };

package/dist/cjs/components/SiteHeaderBasic/SiteHeaderBasic.d.ts

@@ -1,5 +1,5 @@
 import { MouseEvent, ReactNode } from 'react';
-import { WithLayoutType, WithSupportProps } from '@sbercloud/uikit-product-utils';
+import { WithLayoutType, WithSupportProps } from '@cloud-ru/uikit-product-utils';
 export type AdditionalLogoText = {
     /** Дополнительный текст Логотипа */
     text?: string;

package/dist/cjs/components/SiteHeaderBasic/SiteHeaderBasic.js

@@ -18,8 +18,8 @@ exports.SiteHeaderBasic = SiteHeaderBasic;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const classnames_1 = __importDefault(require("classnames"));
 const react_1 = require("react");
-const uikit_product_site_layout_1 = require("@sbercloud/uikit-product-site-layout");
-const uikit_product_utils_1 = require("@sbercloud/uikit-product-utils");
+const uikit_product_site_layout_1 = require("@cloud-ru/uikit-product-site-layout");
+const uikit_product_utils_1 = require("@cloud-ru/uikit-product-utils");
 const helperComponents_1 = require("../../helperComponents");
 const hooks_1 = require("../../hooks");
 const styles_module_scss_1 = __importDefault(require('./styles.module.css'));

package/dist/cjs/components/SubHeader/SubHeader.d.ts

@@ -1,4 +1,4 @@
-import { WithLayoutType } from '@sbercloud/uikit-product-utils';
+import { WithLayoutType } from '@cloud-ru/uikit-product-utils';
 type BannerInfo = {
     /** Цвет фона SubHeader */
     color: 'yellow' | 'blue' | 'green';

package/dist/cjs/components/UserDetailsInline/UserDetailsInline.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.UserDetailsInline = UserDetailsInline;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const classnames_1 = __importDefault(require("classnames"));
-const uikit_product_icons_1 = require("@sbercloud/uikit-product-icons");
+const uikit_product_icons_1 = require("@cloud-ru/uikit-product-icons");
 const button_1 = require("@snack-uikit/button");
 const divider_1 = require("@snack-uikit/divider");
 const UserInfo_1 = require("../../helperComponents/UserInfo");

package/dist/cjs/helperComponents/ButtonBurger/ButtonBurger.js

@@ -5,7 +5,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ButtonBurger = ButtonBurger;
 const jsx_runtime_1 = require("react/jsx-runtime");
-const uikit_product_icons_1 = require("@sbercloud/uikit-product-icons");
+const uikit_product_icons_1 = require("@cloud-ru/uikit-product-icons");
 const styles_module_scss_1 = __importDefault(require('./styles.module.css'));
 function ButtonBurger({ mobileMenuOpen, onClick }) {
     return ((0, jsx_runtime_1.jsx)("button", { className: styles_module_scss_1.default.buttonBurger, onClick: onClick, children: mobileMenuOpen ? (0, jsx_runtime_1.jsx)(uikit_product_icons_1.CloseSVG, {}) : (0, jsx_runtime_1.jsx)(uikit_product_icons_1.BurgerSVG, {}) }));

package/dist/cjs/helperComponents/LogoContent/LogoContent.js

@@ -5,7 +5,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.LogoContent = LogoContent;
 const jsx_runtime_1 = require("react/jsx-runtime");
-const uikit_product_icons_1 = require("@sbercloud/uikit-product-icons");
+const uikit_product_icons_1 = require("@cloud-ru/uikit-product-icons");
 const typography_1 = require("@snack-uikit/typography");
 const styles_module_scss_1 = __importDefault(require('./styles.module.css'));
 function LogoContent({ additionalLogoText, isMobile, logo }) {

package/dist/cjs/helperComponents/MobileMenu/MobileMenu.js

@@ -5,7 +5,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.MobileMenu = MobileMenu;
 const jsx_runtime_1 = require("react/jsx-runtime");
-const uikit_product_mobile_modal_1 = require("@sbercloud/uikit-product-mobile-modal");
+const uikit_product_mobile_modal_1 = require("@cloud-ru/uikit-product-mobile-modal");
 const styles_module_scss_1 = __importDefault(require('./styles.module.css'));
 function MobileMenu({ mobileMenuOpen, onClickForCloseMobileMenu, mobileMenuContent, mobileConsultationButton, }) {
     return ((0, jsx_runtime_1.jsxs)(uikit_product_mobile_modal_1.MobileModalCustom, { open: mobileMenuOpen, onClose: onClickForCloseMobileMenu, className: styles_module_scss_1.default.mobileMenu, children: [(0, jsx_runtime_1.jsx)(uikit_product_mobile_modal_1.MobileModalCustom.Header, { title: '\u041C\u0435\u043D\u044E', align: 'center' }), (0, jsx_runtime_1.jsx)(uikit_product_mobile_modal_1.MobileModalCustom.Body, { content: mobileMenuContent }), mobileConsultationButton && (0, jsx_runtime_1.jsx)(uikit_product_mobile_modal_1.MobileModalCustom.Footer, { actions: mobileConsultationButton })] }));

package/dist/cjs/helperComponents/MoreButton/MoreButton.js

@@ -7,7 +7,7 @@ exports.MoreButton = MoreButton;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const classnames_1 = __importDefault(require("classnames"));
 const react_1 = require("react");
-const uikit_product_icons_1 = require("@sbercloud/uikit-product-icons");
+const uikit_product_icons_1 = require("@cloud-ru/uikit-product-icons");
 const dropdown_1 = require("@snack-uikit/dropdown");
 const LinkItemHeader_1 = require("../LinkItemHeader");
 const styles_module_scss_1 = __importDefault(require('./styles.module.css'));
@@ -19,11 +19,11 @@ function MoreButton({ linkItemsArray, activeItemId }) {
     return ((0, jsx_runtime_1.jsx)(dropdown_1.Dropdown, { placement: 'bottom-start', open: open, outsideClick: () => {
             onClickOpen();
             return false;
-        }, content: (0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.tagRowDropListScroll, children: linkItemsArray.map(item => ((0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)(styles_module_scss_1.default.rowLinkMore, {
+        }, content: (0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.tagRowDropListScroll, children: linkItemsArray.map(item => ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: (0, classnames_1.default)(styles_module_scss_1.default.rowLinkMore, {
                     [styles_module_scss_1.default.hovered]: !item.href,
                     [styles_module_scss_1.default.active]: item.id === activeItemId && !item.href,
-                }), children: (0, jsx_runtime_1.jsx)(LinkItemHeader_1.LinkItemHeader, { label: item.label, onClick: () => {
+                }, item.className) }, item.dataAttributes, { children: (0, jsx_runtime_1.jsx)(LinkItemHeader_1.LinkItemHeader, { label: item.label, onClick: () => {
                         item.onClick && item.onClick();
                         onClickOpen();
-                    }, href: item.href, withoutHover: true }) }, item.id))) }), children: (0, jsx_runtime_1.jsx)("button", { className: styles_module_scss_1.default.button, onClick: onClickOpen, children: (0, jsx_runtime_1.jsx)(uikit_product_icons_1.MoreSVG, {}) }) }));
+                    }, href: item.href, withoutHover: true }) }), item.id))) }), children: (0, jsx_runtime_1.jsx)("button", { className: styles_module_scss_1.default.button, onClick: onClickOpen, children: (0, jsx_runtime_1.jsx)(uikit_product_icons_1.MoreSVG, {}) }) }));
 }

package/dist/esm/components/HeaderItems/HeaderItem.js

@@ -62,7 +62,7 @@ export function HeaderItems({ linkItems, isMobileTabletView, activeLinkItemId })
     if (!linkItems || isMobileTabletView)
         return null;
     const isVisibleEmpty = visibleItems.length === 0;
-    return (_jsxs("div", { className: styles.wrapper, children: [_jsx("div", { className: cn(styles.linkItemsContainer, styles.hiddenRow), ref: hiddenRowElementRef, children: linkItems.map((linkItem, index) => (_jsx("div", { className: styles.lastItemContainer, ref: setItemElement(linkItem, index), children: _jsx(LinkItemHeader, { label: linkItem.label, target: linkItem.target, href: linkItem.href, onClick: linkItem.onClick }) }, linkItem.id))) }), _jsxs("div", { className: cn(styles.linkItemsContainer, {
+    return (_jsxs("div", { className: styles.wrapper, children: [_jsx("div", { className: cn(styles.linkItemsContainer, styles.hiddenRow), ref: hiddenRowElementRef, children: linkItems.map((linkItem, index) => (_jsx("div", Object.assign({ className: cn(styles.lastItemContainer, linkItem.className), ref: setItemElement(linkItem, index) }, linkItem.dataAttributes, { children: _jsx(LinkItemHeader, { label: linkItem.label, target: linkItem.target, href: linkItem.href, onClick: linkItem.onClick }) }), linkItem.id))) }), _jsxs("div", { className: cn(styles.linkItemsContainer, {
                     [styles.linkItemsFirstViewContainer]: isVisibleEmpty,
-                }), children: [(isVisibleEmpty ? linkItems : visibleItems).map(linkItem => (_jsx("div", { className: styles.lastItemContainer, children: _jsx(LinkItemHeader, { label: linkItem.label, href: linkItem.href, onClick: linkItem.onClick, active: activeLinkItemId === linkItem.id }) }, linkItem.id))), hiddenItems.length > 0 && _jsx(MoreButton, { linkItemsArray: hiddenItems, activeItemId: activeLinkItemId })] })] }));
+                }), children: [(isVisibleEmpty ? linkItems : visibleItems).map(linkItem => (_jsx("div", Object.assign({ className: cn(styles.lastItemContainer, linkItem.className) }, linkItem.dataAttributes, { children: _jsx(LinkItemHeader, { label: linkItem.label, href: linkItem.href, onClick: linkItem.onClick, active: activeLinkItemId === linkItem.id }) }), linkItem.id))), hiddenItems.length > 0 && _jsx(MoreButton, { linkItemsArray: hiddenItems, activeItemId: activeLinkItemId })] })] }));
 }

package/dist/esm/components/HeaderItems/types.d.ts

@@ -9,4 +9,10 @@ export type LinkItem = {
     href?: string;
     /** target для ссылки элемента */
     target?: string;
+    /** className для элемента списка */
+    className?: string;
+    /** Кастомные data-атрибуты для a/b теста и тд */
+    dataAttributes?: {
+        [key: string]: string;
+    };
 };

package/dist/esm/components/SiteHeaderBasic/SiteHeaderBasic.d.ts

@@ -1,5 +1,5 @@
 import { MouseEvent, ReactNode } from 'react';
-import { WithLayoutType, WithSupportProps } from '@sbercloud/uikit-product-utils';
+import { WithLayoutType, WithSupportProps } from '@cloud-ru/uikit-product-utils';
 export type AdditionalLogoText = {
     /** Дополнительный текст Логотипа */
     text?: string;

package/dist/esm/components/SiteHeaderBasic/SiteHeaderBasic.js

@@ -12,8 +12,8 @@ var __rest = (this && this.__rest) || function (s, e) {
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import cn from 'classnames';
 import { useRef } from 'react';
-import { Layout } from '@sbercloud/uikit-product-site-layout';
-import { extractSupportProps } from '@sbercloud/uikit-product-utils';
+import { Layout } from '@cloud-ru/uikit-product-site-layout';
+import { extractSupportProps } from '@cloud-ru/uikit-product-utils';
 import { ButtonBurger, LogoContent, MobileMenu } from '../../helperComponents';
 import { useHeaderPosition } from '../../hooks';
 import styles from './styles.module.css';

package/dist/esm/components/SubHeader/SubHeader.d.ts

@@ -1,4 +1,4 @@
-import { WithLayoutType } from '@sbercloud/uikit-product-utils';
+import { WithLayoutType } from '@cloud-ru/uikit-product-utils';
 type BannerInfo = {
     /** Цвет фона SubHeader */
     color: 'yellow' | 'blue' | 'green';

package/dist/esm/components/UserDetailsInline/UserDetailsInline.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import cn from 'classnames';
-import { ExitSVG } from '@sbercloud/uikit-product-icons';
+import { ExitSVG } from '@cloud-ru/uikit-product-icons';
 import { ButtonFunction } from '@snack-uikit/button';
 import { Divider } from '@snack-uikit/divider';
 import { UserInfo } from '../../helperComponents/UserInfo';

package/dist/esm/helperComponents/ButtonBurger/ButtonBurger.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { BurgerSVG, CloseSVG } from '@sbercloud/uikit-product-icons';
+import { BurgerSVG, CloseSVG } from '@cloud-ru/uikit-product-icons';
 import styles from './styles.module.css';
 export function ButtonBurger({ mobileMenuOpen, onClick }) {
     return (_jsx("button", { className: styles.buttonBurger, onClick: onClick, children: mobileMenuOpen ? _jsx(CloseSVG, {}) : _jsx(BurgerSVG, {}) }));

package/dist/esm/helperComponents/LogoContent/LogoContent.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { CloudFullLogoSVG } from '@sbercloud/uikit-product-icons';
+import { CloudFullLogoSVG } from '@cloud-ru/uikit-product-icons';
 import { Typography } from '@snack-uikit/typography';
 import styles from './styles.module.css';
 export function LogoContent({ additionalLogoText, isMobile, logo }) {

package/dist/esm/helperComponents/MobileMenu/MobileMenu.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { MobileModalCustom } from '@sbercloud/uikit-product-mobile-modal';
+import { MobileModalCustom } from '@cloud-ru/uikit-product-mobile-modal';
 import styles from './styles.module.css';
 export function MobileMenu({ mobileMenuOpen, onClickForCloseMobileMenu, mobileMenuContent, mobileConsultationButton, }) {
     return (_jsxs(MobileModalCustom, { open: mobileMenuOpen, onClose: onClickForCloseMobileMenu, className: styles.mobileMenu, children: [_jsx(MobileModalCustom.Header, { title: '\u041C\u0435\u043D\u044E', align: 'center' }), _jsx(MobileModalCustom.Body, { content: mobileMenuContent }), mobileConsultationButton && _jsx(MobileModalCustom.Footer, { actions: mobileConsultationButton })] }));

package/dist/esm/helperComponents/MoreButton/MoreButton.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import cn from 'classnames';
 import { useState } from 'react';
-import { MoreSVG } from '@sbercloud/uikit-product-icons';
+import { MoreSVG } from '@cloud-ru/uikit-product-icons';
 import { Dropdown } from '@snack-uikit/dropdown';
 import { LinkItemHeader } from '../LinkItemHeader';
 import styles from './styles.module.css';
@@ -13,11 +13,11 @@ export function MoreButton({ linkItemsArray, activeItemId }) {
     return (_jsx(Dropdown, { placement: 'bottom-start', open: open, outsideClick: () => {
             onClickOpen();
             return false;
-        }, content: _jsx("div", { className: styles.tagRowDropListScroll, children: linkItemsArray.map(item => (_jsx("div", { className: cn(styles.rowLinkMore, {
+        }, content: _jsx("div", { className: styles.tagRowDropListScroll, children: linkItemsArray.map(item => (_jsx("div", Object.assign({ className: cn(styles.rowLinkMore, {
                     [styles.hovered]: !item.href,
                     [styles.active]: item.id === activeItemId && !item.href,
-                }), children: _jsx(LinkItemHeader, { label: item.label, onClick: () => {
+                }, item.className) }, item.dataAttributes, { children: _jsx(LinkItemHeader, { label: item.label, onClick: () => {
                         item.onClick && item.onClick();
                         onClickOpen();
-                    }, href: item.href, withoutHover: true }) }, item.id))) }), children: _jsx("button", { className: styles.button, onClick: onClickOpen, children: _jsx(MoreSVG, {}) }) }));
+                    }, href: item.href, withoutHover: true }) }), item.id))) }), children: _jsx("button", { className: styles.button, onClick: onClickOpen, children: _jsx(MoreSVG, {}) }) }));
 }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@cloud-ru/uikit-product-site-header",
   "title": "Siteheader",
-  "version": "0.4.10",
+  "version": "0.5.0",
   "sideEffects": [
     "*.css",
     "*.woff",
@@ -30,17 +30,16 @@
     "name": "Akhremenko Grigorii",
     "url": "https://github.com/AGrigorii"
   },
-  "contributors": [],
   "license": "Apache-2.0",
   "publishConfig": {
     "access": "public"
   },
   "scripts": {},
   "dependencies": {
-    "@cloud-ru/uikit-product-icons": "15.1.3",
-    "@cloud-ru/uikit-product-mobile-modal": "0.9.20",
-    "@cloud-ru/uikit-product-site-layout": "0.2.4",
-    "@cloud-ru/uikit-product-utils": "7.0.2",
+    "@cloud-ru/uikit-product-icons": "15.1.4",
+    "@cloud-ru/uikit-product-mobile-modal": "0.9.21",
+    "@cloud-ru/uikit-product-site-layout": "0.2.5",
+    "@cloud-ru/uikit-product-utils": "7.0.3",
     "@snack-uikit/alert": "0.16.17",
     "@snack-uikit/avatar": "0.8.15",
     "@snack-uikit/button": "0.19.16",
@@ -52,5 +51,5 @@
   "peerDependencies": {
     "@sbercloud/figma-tokens-web": "*"
   },
-  "gitHead": "bf479ecf7238ef20b78f20acaef439efa535d1a1"
+  "gitHead": "bf902e38f3b6e267402a675b7640b5a62f1c4f71"
 }

package/src/components/HeaderItems/HeaderItem.tsx

@@ -90,7 +90,12 @@ export function HeaderItems({ linkItems, isMobileTabletView, activeLinkItemId }:
     <div className={styles.wrapper}>
       <div className={cn(styles.linkItemsContainer, styles.hiddenRow)} ref={hiddenRowElementRef}>
         {linkItems.map((linkItem, index) => (
-          <div key={linkItem.id} className={styles.lastItemContainer} ref={setItemElement(linkItem, index)}>
+          <div
+            key={linkItem.id}
+            className={cn(styles.lastItemContainer, linkItem.className)}
+            ref={setItemElement(linkItem, index)}
+            {...linkItem.dataAttributes}
+          >
             <LinkItemHeader
               label={linkItem.label}
               target={linkItem.target}
@@ -107,7 +112,11 @@ export function HeaderItems({ linkItems, isMobileTabletView, activeLinkItemId }:
       >
         {/*Добавлено для сайта, так как используется next и приходит html без расчета js*/}
         {(isVisibleEmpty ? linkItems : visibleItems).map(linkItem => (
-          <div key={linkItem.id} className={styles.lastItemContainer}>
+          <div
+            key={linkItem.id}
+            className={cn(styles.lastItemContainer, linkItem.className)}
+            {...linkItem.dataAttributes}
+          >
             <LinkItemHeader
               label={linkItem.label}
               href={linkItem.href}

package/src/components/HeaderItems/types.ts

@@ -9,4 +9,10 @@ export type LinkItem = {
   href?: string;
   /** target для ссылки элемента */
   target?: string;
+  /** className для элемента списка */
+  className?: string;
+  /** Кастомные data-атрибуты для a/b теста и тд */
+  dataAttributes?: {
+    [key: string]: string;
+  };
 };

package/src/helperComponents/MoreButton/MoreButton.tsx

@@ -32,10 +32,15 @@ export function MoreButton({ linkItemsArray, activeItemId }: MoreButtonProps) {
           {linkItemsArray.map(item => (
             <div
               key={item.id}
-              className={cn(styles.rowLinkMore, {
-                [styles.hovered]: !item.href,
-                [styles.active]: item.id === activeItemId && !item.href,
-              })}
+              className={cn(
+                styles.rowLinkMore,
+                {
+                  [styles.hovered]: !item.href,
+                  [styles.active]: item.id === activeItemId && !item.href,
+                },
+                item.className,
+              )}
+              {...item.dataAttributes}
             >
               <LinkItemHeader
                 label={item.label}