@cloud-ru/ds-uikit-product-header 2.1.8-preview-c09d42fe.0 → 2.2.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,16 @@
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
+ # 2.2.0 (2026-10-14)
7
+
8
+ ### Bug Fixes
9
+
10
+ - **FF-9250:** header hotfix ([6383ec5](https://github.com/cloud-ru-tech/snack-v2/commit/6383ec595c226abbbc328fa238dac5e2dd00f7ec))
11
+
12
+ ### Features
13
+
14
+ - **FF-9250:** list custom items for header ([eab31c6](https://github.com/cloud-ru-tech/snack-v2/commit/eab31c625c0ed05756df46d5fa5bed8e8f472479))
15
+
6
16
  ## 2.1.7 (2026-10-12)
7
17
 
8
18
  **Note:** Version bump only for package @ds/uikit-product-header
@@ -88,11 +88,23 @@
88
88
  width:var(--sn-density-icon-s, var(--sn-platform-comfort-icon-s, var(--sn-primitive-dimension-24, 24px)));
89
89
  height:var(--sn-list-anatomy-size-s-listItem-centeredWrapper-height, var(--sn-density-typography-roleBody-lineHeightS, var(--sn-platform-comfort-typography-roleBody-lineHeightS, var(--sn-primitive-font-lineHeight-20, 20px))));
90
90
  }
91
- .root[data-layout=item] .elementBeforeContent, .root[data-layout=item] .elementAfterContent{
91
+ .root[data-layout=item] .centeredWrapperAfter{
92
+ width:auto;
93
+ min-width:var(--sn-density-icon-s, var(--sn-platform-comfort-icon-s, var(--sn-primitive-dimension-24, 24px)));
94
+ min-height:var(--sn-list-anatomy-size-s-listItem-centeredWrapper-height, var(--sn-density-typography-roleBody-lineHeightS, var(--sn-platform-comfort-typography-roleBody-lineHeightS, var(--sn-primitive-font-lineHeight-20, 20px))));
95
+ }
96
+ .root[data-layout=item] .elementBeforeContent{
92
97
  flex-direction:column;
93
98
  align-items:flex-start;
99
+ width:var(--sn-density-icon-s, var(--sn-platform-comfort-icon-s, var(--sn-primitive-dimension-24, 24px)));
94
100
  height:24px;
95
101
  }
102
+ .root[data-layout=item] .elementAfterContent{
103
+ display:flex;
104
+ flex-direction:row;
105
+ align-items:center;
106
+ height:auto;
107
+ }
96
108
  .root[data-layout=item] .headline{
97
109
  gap:var(--sn-primitive-dimension-4, 4px);
98
110
  }
@@ -131,11 +131,23 @@
131
131
  width:var(--sn-density-icon-s, var(--sn-platform-comfort-icon-s, var(--sn-primitive-dimension-24, 24px)));
132
132
  height:var(--sn-list-anatomy-size-s-listItem-centeredWrapper-height, var(--sn-density-typography-roleBody-lineHeightS, var(--sn-platform-comfort-typography-roleBody-lineHeightS, var(--sn-primitive-font-lineHeight-20, 20px))));
133
133
  }
134
- .root[data-layout=item] .elementBeforeContent, .root[data-layout=item] .elementAfterContent{
134
+ .root[data-layout=item] .centeredWrapperAfter{
135
+ width:auto;
136
+ min-width:var(--sn-density-icon-s, var(--sn-platform-comfort-icon-s, var(--sn-primitive-dimension-24, 24px)));
137
+ min-height:var(--sn-list-anatomy-size-s-listItem-centeredWrapper-height, var(--sn-density-typography-roleBody-lineHeightS, var(--sn-platform-comfort-typography-roleBody-lineHeightS, var(--sn-primitive-font-lineHeight-20, 20px))));
138
+ }
139
+ .root[data-layout=item] .elementBeforeContent{
135
140
  flex-direction:column;
136
141
  align-items:flex-start;
142
+ width:var(--sn-density-icon-s, var(--sn-platform-comfort-icon-s, var(--sn-primitive-dimension-24, 24px)));
137
143
  height:24px;
138
144
  }
145
+ .root[data-layout=item] .elementAfterContent{
146
+ display:flex;
147
+ flex-direction:row;
148
+ align-items:center;
149
+ height:auto;
150
+ }
139
151
  .root[data-layout=item] .headline{
140
152
  gap:var(--sn-primitive-dimension-4, 4px);
141
153
  }
@@ -88,11 +88,23 @@
88
88
  width:var(--sn-density-icon-s, var(--sn-platform-comfort-icon-s, var(--sn-primitive-dimension-24, 24px)));
89
89
  height:var(--sn-list-anatomy-size-s-listItem-centeredWrapper-height, var(--sn-density-typography-roleBody-lineHeightS, var(--sn-platform-comfort-typography-roleBody-lineHeightS, var(--sn-primitive-font-lineHeight-20, 20px))));
90
90
  }
91
- .root[data-layout=item] .elementBeforeContent, .root[data-layout=item] .elementAfterContent{
91
+ .root[data-layout=item] .centeredWrapperAfter{
92
+ width:auto;
93
+ min-width:var(--sn-density-icon-s, var(--sn-platform-comfort-icon-s, var(--sn-primitive-dimension-24, 24px)));
94
+ min-height:var(--sn-list-anatomy-size-s-listItem-centeredWrapper-height, var(--sn-density-typography-roleBody-lineHeightS, var(--sn-platform-comfort-typography-roleBody-lineHeightS, var(--sn-primitive-font-lineHeight-20, 20px))));
95
+ }
96
+ .root[data-layout=item] .elementBeforeContent{
92
97
  flex-direction:column;
93
98
  align-items:flex-start;
99
+ width:var(--sn-density-icon-s, var(--sn-platform-comfort-icon-s, var(--sn-primitive-dimension-24, 24px)));
94
100
  height:24px;
95
101
  }
102
+ .root[data-layout=item] .elementAfterContent{
103
+ display:flex;
104
+ flex-direction:row;
105
+ align-items:center;
106
+ height:auto;
107
+ }
96
108
  .root[data-layout=item] .headline{
97
109
  gap:var(--sn-primitive-dimension-4, 4px);
98
110
  }
@@ -131,11 +131,23 @@
131
131
  width:var(--sn-density-icon-s, var(--sn-platform-comfort-icon-s, var(--sn-primitive-dimension-24, 24px)));
132
132
  height:var(--sn-list-anatomy-size-s-listItem-centeredWrapper-height, var(--sn-density-typography-roleBody-lineHeightS, var(--sn-platform-comfort-typography-roleBody-lineHeightS, var(--sn-primitive-font-lineHeight-20, 20px))));
133
133
  }
134
- .root[data-layout=item] .elementBeforeContent, .root[data-layout=item] .elementAfterContent{
134
+ .root[data-layout=item] .centeredWrapperAfter{
135
+ width:auto;
136
+ min-width:var(--sn-density-icon-s, var(--sn-platform-comfort-icon-s, var(--sn-primitive-dimension-24, 24px)));
137
+ min-height:var(--sn-list-anatomy-size-s-listItem-centeredWrapper-height, var(--sn-density-typography-roleBody-lineHeightS, var(--sn-platform-comfort-typography-roleBody-lineHeightS, var(--sn-primitive-font-lineHeight-20, 20px))));
138
+ }
139
+ .root[data-layout=item] .elementBeforeContent{
135
140
  flex-direction:column;
136
141
  align-items:flex-start;
142
+ width:var(--sn-density-icon-s, var(--sn-platform-comfort-icon-s, var(--sn-primitive-dimension-24, 24px)));
137
143
  height:24px;
138
144
  }
145
+ .root[data-layout=item] .elementAfterContent{
146
+ display:flex;
147
+ flex-direction:row;
148
+ align-items:center;
149
+ height:auto;
150
+ }
139
151
  .root[data-layout=item] .headline{
140
152
  gap:var(--sn-primitive-dimension-4, 4px);
141
153
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@cloud-ru/ds-uikit-product-header",
3
- "version": "2.1.8-preview-c09d42fe.0",
3
+ "version": "2.2.0",
4
4
  "description": "Продуктовая шапка консоли — HeaderLayout, MainMenu, UserMenu, Logo, PathBreadcrumbs и PlatformLogo.",
5
5
  "repository": {
6
6
  "type": "git",
@@ -45,36 +45,36 @@
45
45
  "@dnd-kit/utilities": "^3.2.2",
46
46
  "classnames": "^2.5.1",
47
47
  "fuse.js": "^7.1.0",
48
- "@cloud-ru/ds-accordion": "1.2.4",
49
- "@cloud-ru/ds-adaptive": "1.0.2",
50
- "@cloud-ru/ds-avatar": "1.0.13",
51
- "@cloud-ru/ds-button": "1.0.4",
52
- "@cloud-ru/ds-breadcrumbs": "1.0.34-preview-c09d42fe.0",
53
- "@cloud-ru/ds-divider": "1.0.2",
54
- "@cloud-ru/ds-drag-and-drop": "1.1.3",
55
- "@cloud-ru/ds-icons": "1.6.0",
56
- "@cloud-ru/ds-list": "2.3.7-preview-c09d42fe.0",
57
- "@cloud-ru/ds-card": "1.0.25",
58
- "@cloud-ru/ds-locale": "1.0.0",
59
- "@cloud-ru/ds-drawer": "2.1.2",
60
- "@cloud-ru/ds-info-block": "1.0.3",
61
- "@cloud-ru/ds-modal": "2.0.3",
62
- "@cloud-ru/ds-materials": "2.0.1",
63
- "@cloud-ru/ds-portal-context": "1.0.2",
64
- "@cloud-ru/ds-promo-tag": "1.0.3",
65
- "@cloud-ru/ds-scroll": "1.0.5",
66
- "@cloud-ru/ds-search": "1.0.16",
67
- "@cloud-ru/ds-segment-control": "1.0.15",
68
- "@cloud-ru/ds-skeleton": "1.0.2",
69
- "@cloud-ru/ds-theme": "2.1.0",
70
- "@cloud-ru/ds-toggles": "1.1.11",
71
- "@cloud-ru/ds-tooltip": "1.0.13",
72
- "@cloud-ru/ds-truncate-string": "1.0.14",
73
- "@cloud-ru/ds-typography": "1.0.2",
74
- "@cloud-ru/ds-uikit-product-card-predefined": "4.0.14-preview-c09d42fe.0",
75
- "@cloud-ru/ds-uikit-product-switch-row": "1.0.16",
76
- "@cloud-ru/ds-uikit-product-title-clickable": "1.0.19",
77
- "@cloud-ru/ds-utils": "1.2.0"
48
+ "@cloud-ru/ds-accordion": "^1.2.4",
49
+ "@cloud-ru/ds-adaptive": "^1.0.2",
50
+ "@cloud-ru/ds-avatar": "^1.0.13",
51
+ "@cloud-ru/ds-breadcrumbs": "^1.0.34",
52
+ "@cloud-ru/ds-button": "^1.0.4",
53
+ "@cloud-ru/ds-card": "^1.0.25",
54
+ "@cloud-ru/ds-divider": "^1.0.2",
55
+ "@cloud-ru/ds-drag-and-drop": "^1.1.3",
56
+ "@cloud-ru/ds-drawer": "^2.1.2",
57
+ "@cloud-ru/ds-icons": "^1.6.0",
58
+ "@cloud-ru/ds-info-block": "^1.0.3",
59
+ "@cloud-ru/ds-list": "^2.4.0",
60
+ "@cloud-ru/ds-locale": "^1.0.0",
61
+ "@cloud-ru/ds-modal": "^2.0.3",
62
+ "@cloud-ru/ds-materials": "^2.0.1",
63
+ "@cloud-ru/ds-portal-context": "^1.0.2",
64
+ "@cloud-ru/ds-promo-tag": "^1.0.3",
65
+ "@cloud-ru/ds-scroll": "^1.0.5",
66
+ "@cloud-ru/ds-search": "^1.0.16",
67
+ "@cloud-ru/ds-skeleton": "^1.0.2",
68
+ "@cloud-ru/ds-segment-control": "^1.0.15",
69
+ "@cloud-ru/ds-theme": "^2.1.0",
70
+ "@cloud-ru/ds-toggles": "^1.1.11",
71
+ "@cloud-ru/ds-truncate-string": "^1.0.14",
72
+ "@cloud-ru/ds-tooltip": "^1.0.13",
73
+ "@cloud-ru/ds-typography": "^1.0.2",
74
+ "@cloud-ru/ds-uikit-product-card-predefined": "^4.0.14",
75
+ "@cloud-ru/ds-uikit-product-switch-row": "^1.0.16",
76
+ "@cloud-ru/ds-uikit-product-title-clickable": "^1.0.19",
77
+ "@cloud-ru/ds-utils": "^1.2.0"
78
78
  },
79
79
  "publishConfig": {
80
80
  "access": "public"
@@ -98,17 +98,33 @@
98
98
  align-items: flex-start;
99
99
  padding: base.$sn-primitive-dimension-8 base.$sn-primitive-dimension-4;
100
100
 
101
+ // before — icon-сетка; after (badge + kebab) шире иконки — иначе слот
102
+ // width:icon-s и контент наезжает на truncate label.
101
103
  .centeredWrapper {
102
104
  width: base.$sn-density-icon-s;
103
105
  height: list.$sn-list-anatomy-size-s-listItem-centeredWrapper-height;
104
106
  }
105
107
 
106
- .elementBeforeContent, .elementAfterContent {
108
+ .centeredWrapperAfter {
109
+ width: auto;
110
+ min-width: base.$sn-density-icon-s;
111
+ min-height: list.$sn-list-anatomy-size-s-listItem-centeredWrapper-height;
112
+ }
113
+
114
+ .elementBeforeContent {
107
115
  flex-direction: column;
108
116
  align-items: flex-start;
117
+ width: base.$sn-density-icon-s;
109
118
  height: 24px; // TODO: raw value?
110
119
  }
111
120
 
121
+ .elementAfterContent {
122
+ display: flex;
123
+ flex-direction: row;
124
+ align-items: center;
125
+ height: auto;
126
+ }
127
+
112
128
  .headline {
113
129
  gap: base.$sn-primitive-dimension-4;
114
130
  }