From bff0fab08ae7ae7f63fbe7665b9850335783403b Mon Sep 17 00:00:00 2001
From: Inomdzhon Mirdzhamolov <i.mirdzhamolov@vk.team>
Date: Fri, 30 Aug 2024 16:27:06 +0300
Subject: [PATCH 1/2] feat(ToolButton): apply design fixes

---
 .../ToolButton/ToolButton.module.css          | 15 ++++++++----
 .../components/ToolButton/ToolButton.test.tsx | 24 ++++++++++++++++---
 .../src/components/ToolButton/ToolButton.tsx  | 18 ++++++++++++--
 ...oolbutton-android-chromium-dark-1-snap.png |  4 ++--
 ...olbutton-android-chromium-light-1-snap.png |  4 ++--
 .../toolbutton-ios-webkit-dark-1-snap.png     |  4 ++--
 .../toolbutton-ios-webkit-light-1-snap.png    |  4 ++--
 .../toolbutton-vkcom-chromium-dark-1-snap.png |  4 ++--
 ...toolbutton-vkcom-chromium-light-1-snap.png |  4 ++--
 .../toolbutton-vkcom-firefox-dark-1-snap.png  |  4 ++--
 .../toolbutton-vkcom-firefox-light-1-snap.png |  4 ++--
 .../toolbutton-vkcom-webkit-dark-1-snap.png   |  4 ++--
 .../toolbutton-vkcom-webkit-light-1-snap.png  |  4 ++--
 13 files changed, 67 insertions(+), 30 deletions(-)

diff --git a/packages/vkui/src/components/ToolButton/ToolButton.module.css b/packages/vkui/src/components/ToolButton/ToolButton.module.css
index b8917f3459..23e605a0fa 100644
--- a/packages/vkui/src/components/ToolButton/ToolButton.module.css
+++ b/packages/vkui/src/components/ToolButton/ToolButton.module.css
@@ -5,7 +5,7 @@
   text-decoration: none;
   border: 0;
   margin: 0;
-  padding: 10px;
+  padding: var(--vkui--spacing_size_m);
   border-radius: var(--vkui--size_border_radius_paper--regular);
   inline-size: 100%;
   flex-grow: 1;
@@ -17,6 +17,10 @@
   line-height: var(--vkui--font_caption1--line_height--regular);
 }
 
+.ToolButton--padding-size-xl {
+  padding: var(--vkui--spacing_size_xl);
+}
+
 .ToolButton--rounded {
   border-radius: var(--vkui--size_border_radius_rounded--regular);
 }
@@ -71,15 +75,15 @@
 }
 
 .ToolButton--mode-primary.ToolButton--appearance-neutral {
-  background-color: var(--vkui--color_background_secondary);
+  background-color: var(--vkui--color_background_modal_inverse);
 }
 
 .ToolButton--mode-primary.ToolButton--appearance-neutral.ToolButton--hover {
-  background-color: var(--vkui--color_background_secondary--hover);
+  background-color: var(--vkui--color_background_modal_inverse--hover);
 }
 
 .ToolButton--mode-primary.ToolButton--appearance-neutral.ToolButton--active {
-  background-color: var(--vkui--color_background_secondary--active);
+  background-color: var(--vkui--color_background_modal_inverse--active);
 }
 
 /* Mode = Secondary */
@@ -122,7 +126,8 @@
   color: var(--vkui--color_text_primary);
 }
 
-.ToolButton--mode-primary.ToolButton--appearance-accent {
+.ToolButton--mode-primary.ToolButton--appearance-accent,
+.ToolButton--mode-primary.ToolButton--appearance-neutral {
   color: var(--vkui--color_text_contrast_themed);
 }
 
diff --git a/packages/vkui/src/components/ToolButton/ToolButton.test.tsx b/packages/vkui/src/components/ToolButton/ToolButton.test.tsx
index f67f53fe31..f72eaefa41 100644
--- a/packages/vkui/src/components/ToolButton/ToolButton.test.tsx
+++ b/packages/vkui/src/components/ToolButton/ToolButton.test.tsx
@@ -1,14 +1,20 @@
 import { render, screen } from '@testing-library/react';
 import { Icon20Add, Icon24Add } from '@vkontakte/icons';
 import { baselineComponent } from '../../testing/utils';
-import { ToolButton, type ToolButtonProps } from './ToolButton';
+import { getRoundedClassName, ToolButton, type ToolButtonProps } from './ToolButton';
 
 const ToolButtonTest = (props: Omit<ToolButtonProps, 'IconCompact' | 'IconRegular'>) => (
-  <ToolButton data-testid="custom-btn" IconCompact={Icon20Add} IconRegular={Icon24Add} {...props} />
+  <ToolButton
+    data-testid="custom-btn"
+    IconCompact={Icon20Add}
+    IconRegular={Icon24Add}
+    rounded
+    {...props}
+  />
 );
 const button = () => screen.getByTestId('custom-btn');
 
-describe('ToolButton', () => {
+describe(ToolButton, () => {
   baselineComponent((props) => <ToolButtonTest {...props}>ToolButton</ToolButtonTest>);
 
   it('Component: ToolButton is handled as a native button', () => {
@@ -21,3 +27,15 @@ describe('ToolButton', () => {
     expect(button().tagName.toLowerCase()).toMatch('a');
   });
 });
+
+describe(getRoundedClassName, () => {
+  it('should return class name', () => {
+    expect(getRoundedClassName('row', true)).not.toBeUndefined();
+    expect(getRoundedClassName('row', false)).not.toBeUndefined();
+    expect(getRoundedClassName('column', false)).not.toBeUndefined();
+  });
+
+  it('should return undefined', () => {
+    expect(getRoundedClassName('column', true)).toBeUndefined();
+  });
+});
diff --git a/packages/vkui/src/components/ToolButton/ToolButton.tsx b/packages/vkui/src/components/ToolButton/ToolButton.tsx
index c87ed81d93..8db98c2c49 100644
--- a/packages/vkui/src/components/ToolButton/ToolButton.tsx
+++ b/packages/vkui/src/components/ToolButton/ToolButton.tsx
@@ -36,7 +36,7 @@ export interface ToolButtonProps extends TappableProps, AdaptiveIconRendererProp
   /**
    * Задаёт `50%` закругления для контейнера.
    *
-   * > Note: игнорируется при передаче `children`.
+   * > Note: игнорируется при `direction="column"` если передан `children`.
    */
   rounded?: boolean;
 }
@@ -71,7 +71,7 @@ export const ToolButton = ({
       className={classNames(
         className,
         styles['ToolButton'],
-        rounded && !hasChildren && styles['ToolButton--rounded'],
+        rounded && getRoundedClassName(direction, hasChildren),
         stylesMode[mode],
         stylesAppearance[appearance],
         stylesDirection[direction],
@@ -84,3 +84,17 @@ export const ToolButton = ({
     </Tappable>
   );
 };
+
+export function getRoundedClassName(
+  direction: 'row' | 'column',
+  hasChildren: boolean,
+): string | undefined {
+  switch (direction) {
+    case 'row':
+      return hasChildren
+        ? classNames(styles['ToolButton--rounded'], styles['ToolButton--padding-size-xl'])
+        : styles['ToolButton--rounded'];
+    case 'column':
+      return hasChildren ? undefined : styles['ToolButton--rounded'];
+  }
+}
diff --git a/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-android-chromium-dark-1-snap.png b/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-android-chromium-dark-1-snap.png
index 839484c68b..3cb686fb98 100644
--- a/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-android-chromium-dark-1-snap.png
+++ b/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-android-chromium-dark-1-snap.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:7b6b2d4607858f5c9ca2d31e68a57bda2ba10c7fff3ddf00bd3c52028b12e8af
-size 120361
+oid sha256:ab50b41b7b03bbf3bb5c6e279e77cf8a604218a2ab0f003b93d098b3c1f44b8d
+size 106706
diff --git a/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-android-chromium-light-1-snap.png b/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-android-chromium-light-1-snap.png
index 87bf18e046..54d3469189 100644
--- a/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-android-chromium-light-1-snap.png
+++ b/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-android-chromium-light-1-snap.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:a921919d7382bd785fa30c498dd9617c7a07f37d5210da748c353cab85fc3f2c
-size 119192
+oid sha256:e896ae6cdbadcacde61e54c0737e30bb1aec2288b3ee61251be7487ec46db489
+size 107011
diff --git a/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-ios-webkit-dark-1-snap.png b/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-ios-webkit-dark-1-snap.png
index d5d3269064..cbfac95c3a 100644
--- a/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-ios-webkit-dark-1-snap.png
+++ b/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-ios-webkit-dark-1-snap.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:87a327efe1b22a05abe65407022ea7bcc13474cdeeb920df546c60f6cadea30d
-size 111648
+oid sha256:57fce899c0c61ce846a2be5e6046a191957ba5f1255aa2a193fddb85282ddd9b
+size 110449
diff --git a/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-ios-webkit-light-1-snap.png b/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-ios-webkit-light-1-snap.png
index 9d97e32ae3..57b4fc5cda 100644
--- a/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-ios-webkit-light-1-snap.png
+++ b/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-ios-webkit-light-1-snap.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:993c7e291be001df966ba4b039bb5a092e7bfd544d169c19930a91bcad252274
-size 110954
+oid sha256:7259a430255ab8da95b23c9c84a9625feb2b0f6198e6ef69f655b34ee614a06a
+size 110007
diff --git a/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-chromium-dark-1-snap.png b/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-chromium-dark-1-snap.png
index ec0b725d27..b93404e9ad 100644
--- a/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-chromium-dark-1-snap.png
+++ b/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-chromium-dark-1-snap.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:450a140c1f04e87a42b42fa53d8138dc155ef16ebe5b1bdf1b0d61058a036263
-size 84393
+oid sha256:6324d92ab4ffcb5a23fed18e8836f7d726df7cea6d62859897f18df16a7cab60
+size 75414
diff --git a/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-chromium-light-1-snap.png b/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-chromium-light-1-snap.png
index 9aa988f016..afbcb97324 100644
--- a/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-chromium-light-1-snap.png
+++ b/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-chromium-light-1-snap.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:2df90246e6c5a5315c28bc4c5d4e7cbe9538ce16aa304eca124decc7ce54d86c
-size 84233
+oid sha256:42254a9fbb79a4f4b02a730f3057b63be0e460a988a8cb061b8da17f4436f6c6
+size 76180
diff --git a/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-firefox-dark-1-snap.png b/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-firefox-dark-1-snap.png
index 85d66d6fde..5b4a257cb7 100644
--- a/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-firefox-dark-1-snap.png
+++ b/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-firefox-dark-1-snap.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:55ec3aebfdd65af270a1ae7b67015ef51e47b540ea8830b68641b8e03ef494ea
-size 101157
+oid sha256:004afb39c7f271d0cc860b1fbbe37ef89270f05722f4bcfbb04cd78c20ac0f5e
+size 98849
diff --git a/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-firefox-light-1-snap.png b/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-firefox-light-1-snap.png
index a160abde73..d6488bf625 100644
--- a/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-firefox-light-1-snap.png
+++ b/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-firefox-light-1-snap.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:d47d22d9b6d186bc9cf4386aea2aa37fc77660201b9c3e6f880725f778699325
-size 103634
+oid sha256:202e5bc5510233d2188b4a905c6259c08dc47a4a0ff793f3e74d01bddd97c238
+size 101003
diff --git a/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-webkit-dark-1-snap.png b/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-webkit-dark-1-snap.png
index db096b6eed..6c055cecdf 100644
--- a/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-webkit-dark-1-snap.png
+++ b/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-webkit-dark-1-snap.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:5769a072cb51d621ec2514203c4c3fe7456035c56a4be60fef739fe1d138196e
-size 78089
+oid sha256:c5e17a5ab410e9386035c79d028ac103d36b4edcdc21b6849daa6466046ab785
+size 77489
diff --git a/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-webkit-light-1-snap.png b/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-webkit-light-1-snap.png
index 39ec98311d..2a21ba69a8 100644
--- a/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-webkit-light-1-snap.png
+++ b/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-webkit-light-1-snap.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:b12c605d9753fa4384c537ad1e87fb973be43e756d1eb93d499fcee2cb9a86ce
-size 78510
+oid sha256:b37c081d58807e57af917bf11ab57bc3f6e51df1569f0c85dccc984e7ee8a57c
+size 77689

From 9e669eeafc01cff2d83fc524594b3f7fe5cbc364 Mon Sep 17 00:00:00 2001
From: Inomdzhon Mirdzhamolov <i.mirdzhamolov@vk.team>
Date: Wed, 11 Sep 2024 12:20:08 +0300
Subject: [PATCH 2/2] review(design): update styles

---
 .../vkui/src/components/ToolButton/ToolButton.module.css   | 7 ++++---
 .../vkui/src/components/ToolButton/ToolButton.stories.tsx  | 7 +++++++
 packages/vkui/src/components/ToolButton/ToolButton.tsx     | 5 ++---
 .../toolbutton-android-chromium-dark-1-snap.png            | 4 ++--
 .../toolbutton-android-chromium-light-1-snap.png           | 4 ++--
 .../toolbutton-ios-webkit-dark-1-snap.png                  | 4 ++--
 .../toolbutton-ios-webkit-light-1-snap.png                 | 4 ++--
 .../toolbutton-vkcom-chromium-dark-1-snap.png              | 4 ++--
 .../toolbutton-vkcom-chromium-light-1-snap.png             | 4 ++--
 .../toolbutton-vkcom-firefox-dark-1-snap.png               | 4 ++--
 .../toolbutton-vkcom-firefox-light-1-snap.png              | 4 ++--
 .../toolbutton-vkcom-webkit-dark-1-snap.png                | 4 ++--
 .../toolbutton-vkcom-webkit-light-1-snap.png               | 4 ++--
 13 files changed, 33 insertions(+), 26 deletions(-)

diff --git a/packages/vkui/src/components/ToolButton/ToolButton.module.css b/packages/vkui/src/components/ToolButton/ToolButton.module.css
index 23e605a0fa..3c6ac65006 100644
--- a/packages/vkui/src/components/ToolButton/ToolButton.module.css
+++ b/packages/vkui/src/components/ToolButton/ToolButton.module.css
@@ -11,14 +11,13 @@
   flex-grow: 1;
   flex-basis: 0;
   align-items: center;
-  justify-content: center;
   font-family: var(--vkui--font_caption1--font_family--regular);
   font-size: var(--vkui--font_caption1--font_size--regular);
   line-height: var(--vkui--font_caption1--line_height--regular);
 }
 
-.ToolButton--padding-size-xl {
-  padding: var(--vkui--spacing_size_xl);
+.ToolButton--withFakeEndIcon {
+  padding-inline-end: var(--vkui--spacing_size_xl);
 }
 
 .ToolButton--rounded {
@@ -46,10 +45,12 @@
 /* ToolButton's directions */
 .ToolButton--direction-row {
   flex-direction: row;
+  justify-content: flex-start;
 }
 
 .ToolButton--direction-column {
   flex-direction: column;
+  justify-content: center;
 }
 
 .ToolButton--direction-row .ToolButton__text {
diff --git a/packages/vkui/src/components/ToolButton/ToolButton.stories.tsx b/packages/vkui/src/components/ToolButton/ToolButton.stories.tsx
index a5f457fb0b..e7f855ddc5 100644
--- a/packages/vkui/src/components/ToolButton/ToolButton.stories.tsx
+++ b/packages/vkui/src/components/ToolButton/ToolButton.stories.tsx
@@ -21,4 +21,11 @@ export const Playground: Story = {
     IconCompact: Icon20Add,
     IconRegular: Icon24Add,
   },
+  decorators: [
+    (Component, context) => (
+      <div>
+        <Component {...context.args} />
+      </div>
+    ),
+  ],
 };
diff --git a/packages/vkui/src/components/ToolButton/ToolButton.tsx b/packages/vkui/src/components/ToolButton/ToolButton.tsx
index 8db98c2c49..db8c53314a 100644
--- a/packages/vkui/src/components/ToolButton/ToolButton.tsx
+++ b/packages/vkui/src/components/ToolButton/ToolButton.tsx
@@ -72,6 +72,7 @@ export const ToolButton = ({
         className,
         styles['ToolButton'],
         rounded && getRoundedClassName(direction, hasChildren),
+        hasChildren && direction === 'row' && styles['ToolButton--withFakeEndIcon'],
         stylesMode[mode],
         stylesAppearance[appearance],
         stylesDirection[direction],
@@ -91,9 +92,7 @@ export function getRoundedClassName(
 ): string | undefined {
   switch (direction) {
     case 'row':
-      return hasChildren
-        ? classNames(styles['ToolButton--rounded'], styles['ToolButton--padding-size-xl'])
-        : styles['ToolButton--rounded'];
+      return styles['ToolButton--rounded'];
     case 'column':
       return hasChildren ? undefined : styles['ToolButton--rounded'];
   }
diff --git a/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-android-chromium-dark-1-snap.png b/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-android-chromium-dark-1-snap.png
index 3cb686fb98..02b531faf9 100644
--- a/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-android-chromium-dark-1-snap.png
+++ b/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-android-chromium-dark-1-snap.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:ab50b41b7b03bbf3bb5c6e279e77cf8a604218a2ab0f003b93d098b3c1f44b8d
-size 106706
+oid sha256:ea5c8416d10a64bec940ed7f3368255e63540a69a3d71dfa7201c83af1c9d363
+size 106697
diff --git a/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-android-chromium-light-1-snap.png b/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-android-chromium-light-1-snap.png
index 54d3469189..7b88e3a3f1 100644
--- a/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-android-chromium-light-1-snap.png
+++ b/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-android-chromium-light-1-snap.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:e896ae6cdbadcacde61e54c0737e30bb1aec2288b3ee61251be7487ec46db489
-size 107011
+oid sha256:732b9987851af7231b3f2e194d8b512cda040a835690cf93e474a7cd92618f39
+size 107019
diff --git a/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-ios-webkit-dark-1-snap.png b/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-ios-webkit-dark-1-snap.png
index cbfac95c3a..2f3d5c9908 100644
--- a/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-ios-webkit-dark-1-snap.png
+++ b/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-ios-webkit-dark-1-snap.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:57fce899c0c61ce846a2be5e6046a191957ba5f1255aa2a193fddb85282ddd9b
-size 110449
+oid sha256:44c7c6460f288e9665c2822518b7c267047ee34671497cbf6c656361e070309d
+size 110434
diff --git a/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-ios-webkit-light-1-snap.png b/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-ios-webkit-light-1-snap.png
index 57b4fc5cda..105104e9e8 100644
--- a/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-ios-webkit-light-1-snap.png
+++ b/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-ios-webkit-light-1-snap.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:7259a430255ab8da95b23c9c84a9625feb2b0f6198e6ef69f655b34ee614a06a
-size 110007
+oid sha256:bc88c67d27414a968d8eed0853382f00496b1ea2c4793baa8c62a22c7a78d98f
+size 110011
diff --git a/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-chromium-dark-1-snap.png b/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-chromium-dark-1-snap.png
index b93404e9ad..650391cd59 100644
--- a/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-chromium-dark-1-snap.png
+++ b/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-chromium-dark-1-snap.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:6324d92ab4ffcb5a23fed18e8836f7d726df7cea6d62859897f18df16a7cab60
-size 75414
+oid sha256:156ac49ba7f4da39689e0a9a436d0d29989227eff335a23e0aa8564d3333236b
+size 75424
diff --git a/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-chromium-light-1-snap.png b/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-chromium-light-1-snap.png
index afbcb97324..c52f2756bf 100644
--- a/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-chromium-light-1-snap.png
+++ b/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-chromium-light-1-snap.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:42254a9fbb79a4f4b02a730f3057b63be0e460a988a8cb061b8da17f4436f6c6
-size 76180
+oid sha256:bafd22d1415b9f0f6b88fb2928445e81796e3a5ef40efe4c630dddd26a78ebdd
+size 76197
diff --git a/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-firefox-dark-1-snap.png b/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-firefox-dark-1-snap.png
index 5b4a257cb7..cf3e955c07 100644
--- a/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-firefox-dark-1-snap.png
+++ b/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-firefox-dark-1-snap.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:004afb39c7f271d0cc860b1fbbe37ef89270f05722f4bcfbb04cd78c20ac0f5e
-size 98849
+oid sha256:270e3718116b815c92f38fbe2b5b810631d11e764ab0cd42958338c38b54eccc
+size 99149
diff --git a/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-firefox-light-1-snap.png b/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-firefox-light-1-snap.png
index d6488bf625..cc3a09274f 100644
--- a/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-firefox-light-1-snap.png
+++ b/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-firefox-light-1-snap.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:202e5bc5510233d2188b4a905c6259c08dc47a4a0ff793f3e74d01bddd97c238
-size 101003
+oid sha256:11a55f3b48dc2db82c0265f8ed3d3c045adda22eea98aba106344f8894280702
+size 101178
diff --git a/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-webkit-dark-1-snap.png b/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-webkit-dark-1-snap.png
index 6c055cecdf..d0b4e61cd7 100644
--- a/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-webkit-dark-1-snap.png
+++ b/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-webkit-dark-1-snap.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:c5e17a5ab410e9386035c79d028ac103d36b4edcdc21b6849daa6466046ab785
-size 77489
+oid sha256:845123caca5ee005a59ae1ff291a3890e3edefe037bdb63b2a1bbff9114745b9
+size 77530
diff --git a/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-webkit-light-1-snap.png b/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-webkit-light-1-snap.png
index 2a21ba69a8..d9a177fc55 100644
--- a/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-webkit-light-1-snap.png
+++ b/packages/vkui/src/components/ToolButton/__image_snapshots__/toolbutton-vkcom-webkit-light-1-snap.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:b37c081d58807e57af917bf11ab57bc3f6e51df1569f0c85dccc984e7ee8a57c
-size 77689
+oid sha256:86add310f1c3fba0dbdc0026c612b07f6ca4df9974fe1beb0aa23ae10a0c2a88
+size 77707