diff --git a/packages/codemods/src/transforms/v7/__testfixtures__/header/basic.input.tsx b/packages/codemods/src/transforms/v7/__testfixtures__/header/basic.input.tsx
index bd0516560d..89de681f87 100644
--- a/packages/codemods/src/transforms/v7/__testfixtures__/header/basic.input.tsx
+++ b/packages/codemods/src/transforms/v7/__testfixtures__/header/basic.input.tsx
@@ -1,15 +1,42 @@
-import { Header } from '@vkontakte/vkui';
+import { Header, Icon12ChevronOutline, Link } from '@vkontakte/vkui';
import React from 'react';
const App = () => {
+ const aside = (
+
+ Показать все
+ {}
+
+ )
+
return (
+ {/* Проверка изменения size */}
Кто может писать мне личные сообщения
Кто может писать мне личные сообщения
+
+ {/* Проверка замены aside на after */}
+
+ Показать все
+ {}
+
+ }
+ />
+
);
};
diff --git a/packages/codemods/src/transforms/v7/__tests__/__snapshots__/header.ts.snap b/packages/codemods/src/transforms/v7/__tests__/__snapshots__/header.ts.snap
index b71cd4eab9..77b774efcd 100644
--- a/packages/codemods/src/transforms/v7/__tests__/__snapshots__/header.ts.snap
+++ b/packages/codemods/src/transforms/v7/__tests__/__snapshots__/header.ts.snap
@@ -1,18 +1,44 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`header transforms correctly 1`] = `
-"import { Header } from '@vkontakte/vkui';
+"import { Header, Icon12ChevronOutline, Link } from '@vkontakte/vkui';
import React from 'react';
const App = () => {
+ const aside = (
+
+ Показать все
+ {}
+
+ )
+
return (
(
+ {/* Проверка изменения size */}
Кто может писать мне личные сообщения
Кто может писать мне личные сообщения
+ {/* Проверка замены aside на after */}
+
+ Показать все
+ {}
+
+ }
+ />
+
)
);
};"
diff --git a/packages/codemods/src/transforms/v7/header.ts b/packages/codemods/src/transforms/v7/header.ts
index f397688acc..bb89e39ad0 100644
--- a/packages/codemods/src/transforms/v7/header.ts
+++ b/packages/codemods/src/transforms/v7/header.ts
@@ -1,6 +1,6 @@
import { API, FileInfo } from 'jscodeshift';
import { remapSizePropValue } from './common/remapSizePropValue';
-import { getImportInfo } from '../../codemod-helpers';
+import { getImportInfo, renameProp } from '../../codemod-helpers';
import { JSCodeShiftOptions } from '../../types';
export const parser = 'tsx';
@@ -25,5 +25,7 @@ export default function transformer(file: FileInfo, api: API, options: JSCodeShi
},
});
+ renameProp(j, source, localName, { aside: 'after' });
+
return source.toSource();
}
diff --git a/packages/vkui/src/components/Header/Header.e2e-playground.tsx b/packages/vkui/src/components/Header/Header.e2e-playground.tsx
index e4fc7ad701..1c390e8d2d 100644
--- a/packages/vkui/src/components/Header/Header.e2e-playground.tsx
+++ b/packages/vkui/src/components/Header/Header.e2e-playground.tsx
@@ -22,7 +22,7 @@ export const HeaderPlayground = (props: ComponentPlaygroundProps) => {
},
{
mode: ['primary'],
- aside: [Показать все],
+ after: [Показать все],
},
{
mode: ['primary', 'secondary'],
@@ -40,7 +40,7 @@ export const HeaderPlayground = (props: ComponentPlaygroundProps) => {
{
mode: ['primary'],
subtitle: ['SOHN — Conrad'],
- aside: [Показать все],
+ after: [Показать все],
indicator: [12],
},
{
diff --git a/packages/vkui/src/components/Header/Header.module.css b/packages/vkui/src/components/Header/Header.module.css
index b554e71232..8db401f919 100644
--- a/packages/vkui/src/components/Header/Header.module.css
+++ b/packages/vkui/src/components/Header/Header.module.css
@@ -98,30 +98,30 @@
margin-inline-start: 8px;
}
-.aside {
+.after {
display: flex;
white-space: nowrap;
}
/* stylelint-disable selector-max-universal */
-.aside.aside > * {
+.after.after > * {
margin-block: 13px 7px;
margin-inline-start: 12px;
}
/* stylelint-disable-next-line selector-pseudo-class-disallowed-list */
-.aside > :global(.vkuiIcon) {
+.after > :global(.vkuiIcon) {
position: relative;
color: var(--vkui--color_icon_secondary);
}
/* stylelint-disable-next-line selector-pseudo-class-disallowed-list */
-.aside > :global(.vkuiIcon--24) {
+.after > :global(.vkuiIcon--24) {
margin-block: 11px 5px;
}
/* stylelint-disable-next-line selector-pseudo-class-disallowed-list */
-.aside > :global(.vkuiIcon--16) {
+.after > :global(.vkuiIcon--16) {
margin-block: 15px 9px;
}
@@ -206,6 +206,6 @@
* Impact:
* Link
*/
-.aside {
+.after {
--vkui_internal--link-color: var(--vkui--color_text_accent);
}
diff --git a/packages/vkui/src/components/Header/Header.stories.tsx b/packages/vkui/src/components/Header/Header.stories.tsx
index b78e607e4c..9e13e0efbd 100644
--- a/packages/vkui/src/components/Header/Header.stories.tsx
+++ b/packages/vkui/src/components/Header/Header.stories.tsx
@@ -32,7 +32,7 @@ const story: Meta = {
iconSizes: ['12'],
requiredIcons: ['Icon12Fire'],
}),
- aside: createFieldWithPresets({
+ after: createFieldWithPresets({
iconSizes: [],
additionalPresets: {
Link: Показать все,
@@ -75,7 +75,7 @@ export const WithAside: Story = {
...Playground,
args: {
...Playground.args,
- aside: 'Link',
+ after: 'Link',
},
};
@@ -114,6 +114,6 @@ export const WithAllFeatures: Story = {
beforeSubtitle: 'Icon12Tag',
afterSubtitle: 'Icon12Fire',
subtitle: 'SOHN — Conrad',
- aside: Показать все,
+ after: Показать все,
},
};
diff --git a/packages/vkui/src/components/Header/Header.test.tsx b/packages/vkui/src/components/Header/Header.test.tsx
index a28d95d518..4cc8a9cfb7 100644
--- a/packages/vkui/src/components/Header/Header.test.tsx
+++ b/packages/vkui/src/components/Header/Header.test.tsx
@@ -114,13 +114,13 @@ describe('Header', () => {
render(
-
+
-
+
-
+
,
);
diff --git a/packages/vkui/src/components/Header/Header.tsx b/packages/vkui/src/components/Header/Header.tsx
index 2a67f3779b..bbf73c2a03 100644
--- a/packages/vkui/src/components/Header/Header.tsx
+++ b/packages/vkui/src/components/Header/Header.tsx
@@ -21,7 +21,7 @@ export interface HeaderProps extends HTMLAttributesWithRootRef, Has
/**
* Допускаются иконки, текст, Link
*/
- aside?: React.ReactNode;
+ after?: React.ReactNode;
/**
* Допускаются текст, Indicator
*/
@@ -103,7 +103,7 @@ export const Header = ({
subtitle,
subtitleComponent = 'span',
indicator,
- aside,
+ after,
multiline,
before,
beforeTitle,
@@ -155,9 +155,9 @@ export const Header = ({
)}
- {hasReactNode(aside) && (
-
- {aside}
+ {hasReactNode(after) && (
+
+ {after}
)}
diff --git a/packages/vkui/src/components/Header/Readme.md b/packages/vkui/src/components/Header/Readme.md
index 15ea0765cd..6100a43b40 100644
--- a/packages/vkui/src/components/Header/Readme.md
+++ b/packages/vkui/src/components/Header/Readme.md
@@ -9,7 +9,7 @@ const Example = () => {
Показать все
{platform === 'vkcom' && }
@@ -20,7 +20,7 @@ const Example = () => {
Показать все
{platform === 'vkcom' && }
@@ -33,7 +33,7 @@ const Example = () => {
Показать все
{platform === 'vkcom' && }
@@ -45,7 +45,7 @@ const Example = () => {
Показать все
{platform === 'vkcom' && }
@@ -63,7 +63,7 @@ const Example = () => {
Показать все
{platform === 'vkcom' && }
@@ -74,7 +74,7 @@ const Example = () => {
Показать все
{platform === 'vkcom' && }
@@ -86,7 +86,7 @@ const Example = () => {
Показать все
{platform === 'vkcom' && }
@@ -135,7 +135,7 @@ const Example = () => {
3
}
- aside={
+ after={
Показать все
{platform === 'vkcom' && }
@@ -159,7 +159,7 @@ const Example = () => {
3
}
- aside={
+ after={
Показать все
{platform === 'vkcom' && }
diff --git a/packages/vkui/src/components/Header/__image_snapshots__/header-android-chromium-dark-1-snap.png b/packages/vkui/src/components/Header/__image_snapshots__/header-android-chromium-dark-1-snap.png
index d8b9a05788..5c660976b0 100644
--- a/packages/vkui/src/components/Header/__image_snapshots__/header-android-chromium-dark-1-snap.png
+++ b/packages/vkui/src/components/Header/__image_snapshots__/header-android-chromium-dark-1-snap.png
@@ -1,3 +1,3 @@
version https://git-lfs.github.com/spec/v1
-oid sha256:e74653bf49a4e8b656c055a1c891bd47ed850178a7ae1ba9208187ccd4fe90bf
-size 284588
+oid sha256:7666611c5e1ed49bf707a02f2bf706c9658951b1f4f7ca58049fb011683bd3e6
+size 284775
diff --git a/packages/vkui/src/components/Header/__image_snapshots__/header-android-chromium-light-1-snap.png b/packages/vkui/src/components/Header/__image_snapshots__/header-android-chromium-light-1-snap.png
index d6a009ea9c..01ad7d4cf8 100644
--- a/packages/vkui/src/components/Header/__image_snapshots__/header-android-chromium-light-1-snap.png
+++ b/packages/vkui/src/components/Header/__image_snapshots__/header-android-chromium-light-1-snap.png
@@ -1,3 +1,3 @@
version https://git-lfs.github.com/spec/v1
-oid sha256:1be509953d7d10e13953a7e26635c4a22e6c8d44663b068deb21b54a11cc86c9
-size 284313
+oid sha256:eb5335a42e781e3a86417aec2d384533f3918743c814dfbb30ab6b26b8d0f836
+size 284521
diff --git a/packages/vkui/src/components/Header/__image_snapshots__/header-ios-webkit-dark-1-snap.png b/packages/vkui/src/components/Header/__image_snapshots__/header-ios-webkit-dark-1-snap.png
index 95c0d414c8..77af64cfdb 100644
--- a/packages/vkui/src/components/Header/__image_snapshots__/header-ios-webkit-dark-1-snap.png
+++ b/packages/vkui/src/components/Header/__image_snapshots__/header-ios-webkit-dark-1-snap.png
@@ -1,3 +1,3 @@
version https://git-lfs.github.com/spec/v1
-oid sha256:e942fc61fb0944e23f3bcd0e14d20ff29f16be84c7c3bad691e262947f9d23dd
-size 293309
+oid sha256:e3307493705844b7b913476e68efcc08e6b1f3e61fd1f2414d194d1b445a6bd4
+size 293619
diff --git a/packages/vkui/src/components/Header/__image_snapshots__/header-ios-webkit-light-1-snap.png b/packages/vkui/src/components/Header/__image_snapshots__/header-ios-webkit-light-1-snap.png
index 4a9f60eda4..7948125cc0 100644
--- a/packages/vkui/src/components/Header/__image_snapshots__/header-ios-webkit-light-1-snap.png
+++ b/packages/vkui/src/components/Header/__image_snapshots__/header-ios-webkit-light-1-snap.png
@@ -1,3 +1,3 @@
version https://git-lfs.github.com/spec/v1
-oid sha256:5125dfaef12ee2c8401a93b3efd508665d35310be1598b4181c79b44170f4e3b
-size 289341
+oid sha256:9bd28b3b341ccef41702330979df36e95fb9beab2a1f59555906db8ebbf12d8f
+size 289627
diff --git a/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-chromium-dark-1-snap.png b/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-chromium-dark-1-snap.png
index 2c8ce776fc..7d05155744 100644
--- a/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-chromium-dark-1-snap.png
+++ b/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-chromium-dark-1-snap.png
@@ -1,3 +1,3 @@
version https://git-lfs.github.com/spec/v1
-oid sha256:6050ee85c5794c28cf24866f1f97fdaef169629adc63d0aa87e92f27017c2347
-size 283920
+oid sha256:67567d1fe5fe4eb126416104d6c75948b6d1e65a42e40f8e9497494e72924905
+size 284171
diff --git a/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-chromium-light-1-snap.png b/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-chromium-light-1-snap.png
index d786d5eb78..2e5418fd88 100644
--- a/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-chromium-light-1-snap.png
+++ b/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-chromium-light-1-snap.png
@@ -1,3 +1,3 @@
version https://git-lfs.github.com/spec/v1
-oid sha256:6bc93004d843488885556690704edc030e5c1f12f43312d343dd7f3fdc9e471a
-size 285100
+oid sha256:25cbae3283fd68a7462557fa2094e9e160a73d48403230dd817e119b33e60757
+size 285365
diff --git a/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-firefox-dark-1-snap.png b/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-firefox-dark-1-snap.png
index 42a79e6fab..6e8f3a7365 100644
--- a/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-firefox-dark-1-snap.png
+++ b/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-firefox-dark-1-snap.png
@@ -1,3 +1,3 @@
version https://git-lfs.github.com/spec/v1
-oid sha256:fae60183c8ae9ad81937e597c4a1a5e0fb415180371ae947145027c6456b55c0
-size 430444
+oid sha256:efa4bd21a6c016bf8a1c3e81047a00d00bef01c07e600416f344a8f2de0d644d
+size 430643
diff --git a/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-firefox-light-1-snap.png b/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-firefox-light-1-snap.png
index 0c9c580986..1ed7b35fc0 100644
--- a/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-firefox-light-1-snap.png
+++ b/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-firefox-light-1-snap.png
@@ -1,3 +1,3 @@
version https://git-lfs.github.com/spec/v1
-oid sha256:2a98f21a4dafb23143f21de73f4c4bbb65a121871f353950ebf3392918816599
-size 421488
+oid sha256:3004589e0249214126cf18400e889b34d4d45ef728435df0ac91b9820f489393
+size 421708
diff --git a/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-webkit-dark-1-snap.png b/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-webkit-dark-1-snap.png
index 26bc82a0ec..6d0358445a 100644
--- a/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-webkit-dark-1-snap.png
+++ b/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-webkit-dark-1-snap.png
@@ -1,3 +1,3 @@
version https://git-lfs.github.com/spec/v1
-oid sha256:f73109e1970ab6a459d965dc42f755f00cd5e7ff46ad27ab001d283e89768ec1
-size 288350
+oid sha256:43c36d15d38833955b9ef890cf045d41c476a20666c8b7c659cb6a3b6821c35a
+size 288625
diff --git a/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-webkit-light-1-snap.png b/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-webkit-light-1-snap.png
index eadf9305e3..3afb8541de 100644
--- a/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-webkit-light-1-snap.png
+++ b/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-webkit-light-1-snap.png
@@ -1,3 +1,3 @@
version https://git-lfs.github.com/spec/v1
-oid sha256:b1ddf00669c026933fda37bbaadececc2a56f57411785e56333e64712cf6970b
-size 290069
+oid sha256:d0661f223011437cf3a7254c5202c23d5fe10a4659ad2f96f2f218d3d2a12bb3
+size 290380