@cloud-ru/uikit-product-site-header 0.6.5 → 1.0.1-preview-b95fca4e.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -3,6 +3,17 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ # 0.7.0 (2026-01-13)
7
+
8
+
9
+ ### Features
10
+
11
+ * **DOCDEV-2558:** added leftPartClassName prop to site header ([a1dc537](https://gitverse.ru/cloud-ru-tech/uikit-product/commits/a1dc537c2558b5f3e48c4a70aebbc54fd01208ef))
12
+
13
+
14
+
15
+
16
+
6
17
  ## 0.6.5 (2025-12-17)
7
18
 
8
19
  ### Only dependencies have been changed
@@ -44,5 +44,7 @@ export type HeaderProps = WithSupportProps<WithLayoutType<{
44
44
  mobileMenuContent?: ReactNode;
45
45
  /** Нижний контент кнопок мобильной версии меню */
46
46
  mobileConsultationButton?: ReactNode;
47
+ /** className для левой части хедера */
48
+ leftPartClassName?: string;
47
49
  }>>;
48
- export declare function SiteHeaderBasic({ className, maxWidth, additionalLogoText, middleContent, rightContent, mobileMenuContent, subHeader, fullWidthContent, layoutType, mobileConsultationButton, mobileMenuOpen, onSetMobileMenuOpen, mainHeaderClassName, appearance, logo, ...rest }: HeaderProps): import("react/jsx-runtime").JSX.Element;
50
+ export declare function SiteHeaderBasic({ className, maxWidth, additionalLogoText, middleContent, rightContent, mobileMenuContent, subHeader, fullWidthContent, layoutType, mobileConsultationButton, mobileMenuOpen, onSetMobileMenuOpen, mainHeaderClassName, appearance, logo, leftPartClassName, ...rest }: HeaderProps): import("react/jsx-runtime").JSX.Element;
@@ -25,7 +25,7 @@ const hooks_1 = require("../../hooks");
25
25
  const styles_module_scss_1 = __importDefault(require('./styles.module.css'));
26
26
  const HEIGHT_SUBHEADER = 25;
27
27
  function SiteHeaderBasic(_a) {
28
- var { className, maxWidth, additionalLogoText, middleContent, rightContent, mobileMenuContent, subHeader, fullWidthContent, layoutType, mobileConsultationButton, mobileMenuOpen, onSetMobileMenuOpen, mainHeaderClassName, appearance = 'none', logo } = _a, rest = __rest(_a, ["className", "maxWidth", "additionalLogoText", "middleContent", "rightContent", "mobileMenuContent", "subHeader", "fullWidthContent", "layoutType", "mobileConsultationButton", "mobileMenuOpen", "onSetMobileMenuOpen", "mainHeaderClassName", "appearance", "logo"]);
28
+ var { className, maxWidth, additionalLogoText, middleContent, rightContent, mobileMenuContent, subHeader, fullWidthContent, layoutType, mobileConsultationButton, mobileMenuOpen, onSetMobileMenuOpen, mainHeaderClassName, appearance = 'none', logo, leftPartClassName } = _a, rest = __rest(_a, ["className", "maxWidth", "additionalLogoText", "middleContent", "rightContent", "mobileMenuContent", "subHeader", "fullWidthContent", "layoutType", "mobileConsultationButton", "mobileMenuOpen", "onSetMobileMenuOpen", "mainHeaderClassName", "appearance", "logo", "leftPartClassName"]);
29
29
  const refHeader = (0, react_1.useRef)(null);
30
30
  const { showHeader, headerHeight } = (0, hooks_1.useHeaderPosition)(mobileMenuOpen, refHeader);
31
31
  const isMobileTabletView = layoutType === 'mobile' || layoutType === 'tablet';
@@ -34,5 +34,5 @@ function SiteHeaderBasic(_a) {
34
34
  transform: `translateY(-${!showHeader ? headerHeight + HEIGHT_SUBHEADER : 0}px)`,
35
35
  }, className: (0, classnames_1.default)(styles_module_scss_1.default.root, className), "data-attr": 'layout-header' }, (0, uikit_product_utils_1.extractSupportProps)(rest), { children: [subHeader, (0, jsx_runtime_1.jsx)("div", { ref: refHeader, className: (0, classnames_1.default)(styles_module_scss_1.default.headerMaster, styles_module_scss_1.default.dividerHeader, mainHeaderClassName), "data-layout-type": layoutType, "data-appearance": appearance, children: (0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.headerPartsContainer, style: {
36
36
  maxWidth,
37
- }, children: fullWidthContent !== null && fullWidthContent !== void 0 ? fullWidthContent : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.leftPart, "data-layout-type": layoutType, children: (0, jsx_runtime_1.jsx)(helperComponents_1.LogoContent, { additionalLogoText: additionalLogoText, isMobile: isMobile, logo: logo }) }), (0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.middlePart, children: middleContent }), (0, jsx_runtime_1.jsxs)("div", { className: styles_module_scss_1.default.rightPart, children: [rightContent, mobileMenuContent && isMobileTabletView && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(helperComponents_1.ButtonBurger, { appearance: appearance, mobileMenuOpen: mobileMenuOpen, onClick: () => onSetMobileMenuOpen(!mobileMenuOpen) }), (0, jsx_runtime_1.jsx)(helperComponents_1.MobileMenu, { mobileConsultationButton: mobileConsultationButton, mobileMenuContent: mobileMenuContent, mobileMenuOpen: mobileMenuOpen, onClickForCloseMobileMenu: () => onSetMobileMenuOpen(false) })] }))] })] })) }) })] })));
37
+ }, children: fullWidthContent !== null && fullWidthContent !== void 0 ? fullWidthContent : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)(styles_module_scss_1.default.leftPart, leftPartClassName), "data-layout-type": layoutType, children: (0, jsx_runtime_1.jsx)(helperComponents_1.LogoContent, { additionalLogoText: additionalLogoText, isMobile: isMobile, logo: logo }) }), (0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.middlePart, children: middleContent }), (0, jsx_runtime_1.jsxs)("div", { className: styles_module_scss_1.default.rightPart, children: [rightContent, mobileMenuContent && isMobileTabletView && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(helperComponents_1.ButtonBurger, { appearance: appearance, mobileMenuOpen: mobileMenuOpen, onClick: () => onSetMobileMenuOpen(!mobileMenuOpen) }), (0, jsx_runtime_1.jsx)(helperComponents_1.MobileMenu, { mobileConsultationButton: mobileConsultationButton, mobileMenuContent: mobileMenuContent, mobileMenuOpen: mobileMenuOpen, onClickForCloseMobileMenu: () => onSetMobileMenuOpen(false) })] }))] })] })) }) })] })));
38
38
  }
@@ -44,5 +44,7 @@ export type HeaderProps = WithSupportProps<WithLayoutType<{
44
44
  mobileMenuContent?: ReactNode;
45
45
  /** Нижний контент кнопок мобильной версии меню */
46
46
  mobileConsultationButton?: ReactNode;
47
+ /** className для левой части хедера */
48
+ leftPartClassName?: string;
47
49
  }>>;
48
- export declare function SiteHeaderBasic({ className, maxWidth, additionalLogoText, middleContent, rightContent, mobileMenuContent, subHeader, fullWidthContent, layoutType, mobileConsultationButton, mobileMenuOpen, onSetMobileMenuOpen, mainHeaderClassName, appearance, logo, ...rest }: HeaderProps): import("react/jsx-runtime").JSX.Element;
50
+ export declare function SiteHeaderBasic({ className, maxWidth, additionalLogoText, middleContent, rightContent, mobileMenuContent, subHeader, fullWidthContent, layoutType, mobileConsultationButton, mobileMenuOpen, onSetMobileMenuOpen, mainHeaderClassName, appearance, logo, leftPartClassName, ...rest }: HeaderProps): import("react/jsx-runtime").JSX.Element;
@@ -19,7 +19,7 @@ import { useHeaderPosition } from '../../hooks';
19
19
  import styles from './styles.module.css';
20
20
  const HEIGHT_SUBHEADER = 25;
21
21
  export function SiteHeaderBasic(_a) {
22
- var { className, maxWidth, additionalLogoText, middleContent, rightContent, mobileMenuContent, subHeader, fullWidthContent, layoutType, mobileConsultationButton, mobileMenuOpen, onSetMobileMenuOpen, mainHeaderClassName, appearance = 'none', logo } = _a, rest = __rest(_a, ["className", "maxWidth", "additionalLogoText", "middleContent", "rightContent", "mobileMenuContent", "subHeader", "fullWidthContent", "layoutType", "mobileConsultationButton", "mobileMenuOpen", "onSetMobileMenuOpen", "mainHeaderClassName", "appearance", "logo"]);
22
+ var { className, maxWidth, additionalLogoText, middleContent, rightContent, mobileMenuContent, subHeader, fullWidthContent, layoutType, mobileConsultationButton, mobileMenuOpen, onSetMobileMenuOpen, mainHeaderClassName, appearance = 'none', logo, leftPartClassName } = _a, rest = __rest(_a, ["className", "maxWidth", "additionalLogoText", "middleContent", "rightContent", "mobileMenuContent", "subHeader", "fullWidthContent", "layoutType", "mobileConsultationButton", "mobileMenuOpen", "onSetMobileMenuOpen", "mainHeaderClassName", "appearance", "logo", "leftPartClassName"]);
23
23
  const refHeader = useRef(null);
24
24
  const { showHeader, headerHeight } = useHeaderPosition(mobileMenuOpen, refHeader);
25
25
  const isMobileTabletView = layoutType === 'mobile' || layoutType === 'tablet';
@@ -28,5 +28,5 @@ export function SiteHeaderBasic(_a) {
28
28
  transform: `translateY(-${!showHeader ? headerHeight + HEIGHT_SUBHEADER : 0}px)`,
29
29
  }, className: cn(styles.root, className), "data-attr": 'layout-header' }, extractSupportProps(rest), { children: [subHeader, _jsx("div", { ref: refHeader, className: cn(styles.headerMaster, styles.dividerHeader, mainHeaderClassName), "data-layout-type": layoutType, "data-appearance": appearance, children: _jsx("div", { className: styles.headerPartsContainer, style: {
30
30
  maxWidth,
31
- }, children: fullWidthContent !== null && fullWidthContent !== void 0 ? fullWidthContent : (_jsxs(_Fragment, { children: [_jsx("div", { className: styles.leftPart, "data-layout-type": layoutType, children: _jsx(LogoContent, { additionalLogoText: additionalLogoText, isMobile: isMobile, logo: logo }) }), _jsx("div", { className: styles.middlePart, children: middleContent }), _jsxs("div", { className: styles.rightPart, children: [rightContent, mobileMenuContent && isMobileTabletView && (_jsxs(_Fragment, { children: [_jsx(ButtonBurger, { appearance: appearance, mobileMenuOpen: mobileMenuOpen, onClick: () => onSetMobileMenuOpen(!mobileMenuOpen) }), _jsx(MobileMenu, { mobileConsultationButton: mobileConsultationButton, mobileMenuContent: mobileMenuContent, mobileMenuOpen: mobileMenuOpen, onClickForCloseMobileMenu: () => onSetMobileMenuOpen(false) })] }))] })] })) }) })] })));
31
+ }, children: fullWidthContent !== null && fullWidthContent !== void 0 ? fullWidthContent : (_jsxs(_Fragment, { children: [_jsx("div", { className: cn(styles.leftPart, leftPartClassName), "data-layout-type": layoutType, children: _jsx(LogoContent, { additionalLogoText: additionalLogoText, isMobile: isMobile, logo: logo }) }), _jsx("div", { className: styles.middlePart, children: middleContent }), _jsxs("div", { className: styles.rightPart, children: [rightContent, mobileMenuContent && isMobileTabletView && (_jsxs(_Fragment, { children: [_jsx(ButtonBurger, { appearance: appearance, mobileMenuOpen: mobileMenuOpen, onClick: () => onSetMobileMenuOpen(!mobileMenuOpen) }), _jsx(MobileMenu, { mobileConsultationButton: mobileConsultationButton, mobileMenuContent: mobileMenuContent, mobileMenuOpen: mobileMenuOpen, onClickForCloseMobileMenu: () => onSetMobileMenuOpen(false) })] }))] })] })) }) })] })));
32
32
  }
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@cloud-ru/uikit-product-site-header",
3
3
  "title": "Siteheader",
4
- "version": "0.6.5",
4
+ "version": "1.0.1-preview-b95fca4e.0",
5
5
  "sideEffects": [
6
6
  "*.css",
7
7
  "*.woff",
@@ -36,11 +36,11 @@
36
36
  },
37
37
  "scripts": {},
38
38
  "dependencies": {
39
- "@cloud-ru/uikit-product-button-predefined": "0.7.10",
40
- "@cloud-ru/uikit-product-icons": "16.1.1",
41
- "@cloud-ru/uikit-product-mobile-modal": "0.9.28",
42
- "@cloud-ru/uikit-product-site-layout": "0.5.2",
43
- "@cloud-ru/uikit-product-utils": "8.1.0",
39
+ "@cloud-ru/uikit-product-button-predefined": "1.0.1-preview-b95fca4e.0",
40
+ "@cloud-ru/uikit-product-icons": "16.1.2-preview-b95fca4e.0",
41
+ "@cloud-ru/uikit-product-mobile-modal": "1.0.1-preview-b95fca4e.0",
42
+ "@cloud-ru/uikit-product-site-layout": "1.0.1-preview-b95fca4e.0",
43
+ "@cloud-ru/uikit-product-utils": "8.1.1-preview-b95fca4e.0",
44
44
  "@snack-uikit/alert": "0.16.17",
45
45
  "@snack-uikit/avatar": "0.8.15",
46
46
  "@snack-uikit/button": "0.19.16",
@@ -50,7 +50,7 @@
50
50
  "classnames": "2.3.2"
51
51
  },
52
52
  "peerDependencies": {
53
- "@sbercloud/figma-tokens-web": "*"
53
+ "@cloud-ru/figma-tokens-web": "*"
54
54
  },
55
- "gitHead": "1a98d6d9bff32edcbb3f9b0be0a14dce3f2abe5d"
55
+ "gitHead": "5e59d6341e92ce7320739df54ab7e6f6d0a7aa26"
56
56
  }
@@ -56,6 +56,8 @@ export type HeaderProps = WithSupportProps<
56
56
  mobileMenuContent?: ReactNode;
57
57
  /** Нижний контент кнопок мобильной версии меню */
58
58
  mobileConsultationButton?: ReactNode;
59
+ /** className для левой части хедера */
60
+ leftPartClassName?: string;
59
61
  }>
60
62
  >;
61
63
 
@@ -77,6 +79,7 @@ export function SiteHeaderBasic({
77
79
  mainHeaderClassName,
78
80
  appearance = 'none',
79
81
  logo,
82
+ leftPartClassName,
80
83
  ...rest
81
84
  }: HeaderProps) {
82
85
  const refHeader = useRef<HTMLDivElement>(null);
@@ -109,7 +112,7 @@ export function SiteHeaderBasic({
109
112
  >
110
113
  {fullWidthContent ?? (
111
114
  <>
112
- <div className={styles.leftPart} data-layout-type={layoutType}>
115
+ <div className={cn(styles.leftPart, leftPartClassName)} data-layout-type={layoutType}>
113
116
  <LogoContent additionalLogoText={additionalLogoText} isMobile={isMobile} logo={logo} />
114
117
  </div>
115
118
  <div className={styles.middlePart}>{middleContent}</div>
@@ -1,4 +1,4 @@
1
- @use '@sbercloud/figma-tokens-cloud-platform/build/scss/styles-theme-variables' as ste;
1
+ @use '@cloud-ru/figma-tokens-cloud-platform/build/scss/styles-theme-variables' as ste;
2
2
 
3
3
  .root {
4
4
  position: sticky;
@@ -1,4 +1,4 @@
1
- @use '@sbercloud/figma-tokens-web/build/scss/styles-theme-variables' as ste;
1
+ @use '@cloud-ru/figma-tokens-web/build/scss/styles-theme-variables' as ste;
2
2
 
3
3
  .root {
4
4
  background: ste.$sys-neutral-background1-level;
@@ -1,4 +1,4 @@
1
- @use '@sbercloud/figma-tokens-web/build/scss/components/styles-tokens-element'
1
+ @use '@cloud-ru/figma-tokens-web/build/scss/components/styles-tokens-element'
2
2
  as ste;
3
3
 
4
4
  .userAuthContent {
@@ -1,4 +1,4 @@
1
- @use '@sbercloud/figma-tokens-web/build/scss/components/styles-tokens-element' as ste;
1
+ @use '@cloud-ru/figma-tokens-web/build/scss/components/styles-tokens-element' as ste;
2
2
 
3
3
  .buttonBurger {
4
4
  background-color: transparent;
@@ -1,4 +1,4 @@
1
- @use '@sbercloud/figma-tokens-web/build/scss/components/styles-tokens-element' as ste;
1
+ @use '@cloud-ru/figma-tokens-web/build/scss/components/styles-tokens-element' as ste;
2
2
 
3
3
  .button {
4
4
  background-color: transparent;
@@ -1,4 +1,4 @@
1
- @use '@sbercloud/figma-tokens-web/build/scss/components/styles-tokens-element' as ste;
1
+ @use '@cloud-ru/figma-tokens-web/build/scss/components/styles-tokens-element' as ste;
2
2
 
3
3
  .logoContentContainer {
4
4
  display: flex;
@@ -1,4 +1,4 @@
1
- @use '@sbercloud/figma-tokens-web/build/scss/components/styles-tokens-element' as ste;
1
+ @use '@cloud-ru/figma-tokens-web/build/scss/components/styles-tokens-element' as ste;
2
2
 
3
3
  .tagRowDropListScroll {
4
4
  display: flex;
@@ -1,4 +1,4 @@
1
- @use '@sbercloud/figma-tokens-web/build/scss/components/styles-tokens-element'
1
+ @use '@cloud-ru/figma-tokens-web/build/scss/components/styles-tokens-element'
2
2
  as ste;
3
3
 
4
4
  .root {