@cloud-ru/uikit-product-site-header 0.4.11 → 0.5.1

package/CHANGELOG.md

@@ -3,6 +3,29 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## 0.5.1 (2025-11-24)
+
+### Only dependencies have been changed
+* [@cloud-ru/uikit-product-icons@15.1.5](https://gitverse.ru/cloud-ru-tech/uikit-product/-/blob/master/packages/icons/CHANGELOG.md)
+* [@cloud-ru/uikit-product-mobile-modal@0.9.22](https://gitverse.ru/cloud-ru-tech/uikit-product/-/blob/master/packages/mobile-modal/CHANGELOG.md)
+* [@cloud-ru/uikit-product-site-layout@0.2.6](https://gitverse.ru/cloud-ru-tech/uikit-product/-/blob/master/packages/site-layout/CHANGELOG.md)
+* [@cloud-ru/uikit-product-utils@8.0.0](https://gitverse.ru/cloud-ru-tech/uikit-product/-/blob/master/packages/utils/CHANGELOG.md)
+
+
+
+
+
+# 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)
 
 

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/helperComponents/MoreButton/MoreButton.js

@@ -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/helperComponents/MoreButton/MoreButton.js

@@ -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.11",
+  "version": "0.5.1",
   "sideEffects": [
     "*.css",
     "*.woff",
@@ -36,10 +36,10 @@
   },
   "scripts": {},
   "dependencies": {
-    "@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",
+    "@cloud-ru/uikit-product-icons": "15.1.5",
+    "@cloud-ru/uikit-product-mobile-modal": "0.9.22",
+    "@cloud-ru/uikit-product-site-layout": "0.2.6",
+    "@cloud-ru/uikit-product-utils": "8.0.0",
     "@snack-uikit/alert": "0.16.17",
     "@snack-uikit/avatar": "0.8.15",
     "@snack-uikit/button": "0.19.16",
@@ -51,5 +51,5 @@
   "peerDependencies": {
     "@sbercloud/figma-tokens-web": "*"
   },
-  "gitHead": "ce69097516055b330a0b05da5e29ac5b66e56284"
+  "gitHead": "46b285728ff0dfe51d89b375469a6c05d6f2dba9"
 }

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}