From cdbc022b9bb2275ffa5a96d46bdb206af88b618b Mon Sep 17 00:00:00 2001
From: Evgeniy Telegin <telegin.zhenya@gmail.com>
Date: Wed, 17 Apr 2024 22:14:13 +0500
Subject: [PATCH] feat: support button changes in uikit 6.11.0 (#227)

* feat: support button changes in uikit 6.11.0

* chore: apply lint rules
---
 package-lock.json                              | 18 +++++++++---------
 package.json                                   |  4 ++--
 src/bundle/YfmEditorView.scss                  |  3 ++-
 .../toolbar/ToolbarButtonWithPopupMenu.scss    | 17 ++---------------
 src/toolbar/ToolbarListButton.scss             | 14 ++------------
 5 files changed, 17 insertions(+), 39 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index ee17d9e4..883acac5 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -52,7 +52,7 @@
         "@gravity-ui/prettier-config": "1.1.0",
         "@gravity-ui/stylelint-config": "4.0.1",
         "@gravity-ui/tsconfig": "1.0.0",
-        "@gravity-ui/uikit": "6.1.1",
+        "@gravity-ui/uikit": "6.11.0",
         "@storybook/addon-essentials": "^7.1.1",
         "@storybook/cli": "^7.1.1",
         "@storybook/preset-scss": "1.0.3",
@@ -100,7 +100,7 @@
         "@diplodoc/mermaid-extension": "^1.0.0",
         "@diplodoc/transform": "^4.5.0",
         "@gravity-ui/components": "^3.0.0",
-        "@gravity-ui/uikit": "^6.0.0",
+        "@gravity-ui/uikit": "^6.11.0",
         "highlight.js": "^11.8.0",
         "katex": "^0.16.9",
         "lodash": "^4.17.20",
@@ -3143,9 +3143,9 @@
       }
     },
     "node_modules/@gravity-ui/i18n": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/@gravity-ui/i18n/-/i18n-1.2.0.tgz",
-      "integrity": "sha512-1FNZmbxeT3arwU2bv1p77u/K7rYoX4pGrXf0SNwg45HbbgI0XV0WapXbWr/GIB7EXdjiOvQ7kzXCfVIFV4ifYw=="
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/@gravity-ui/i18n/-/i18n-1.4.0.tgz",
+      "integrity": "sha512-zeszlWxzZuqzX509Vnc3KujGqq9Ln5NKYRaIpgkF2/ODvZMsWToGtNV3MibtljN8moiCQCtVrmW50/oKiF2+qA=="
     },
     "node_modules/@gravity-ui/icons": {
       "version": "2.9.1",
@@ -3198,13 +3198,13 @@
       "dev": true
     },
     "node_modules/@gravity-ui/uikit": {
-      "version": "6.1.1",
-      "resolved": "https://registry.npmjs.org/@gravity-ui/uikit/-/uikit-6.1.1.tgz",
-      "integrity": "sha512-Z8Zcte9B5oc9ZDz/6XqOF+CGGRXe4Wg9oxvBsV360KBkHlrxAoYwf4NKi/R9WDUgUmg2U1FFw/+xl2NGQqztzQ==",
+      "version": "6.11.0",
+      "resolved": "https://registry.npmjs.org/@gravity-ui/uikit/-/uikit-6.11.0.tgz",
+      "integrity": "sha512-btnVVCsY2YC4JnrYwkSK6GxTr1LgCQi4pYS5lfOOlUz05F6smM/RfK8UGI7vqbZkrXUFcrz/rwdnEnN6VM3Uxg==",
       "dev": true,
       "dependencies": {
         "@bem-react/classname": "^1.6.0",
-        "@gravity-ui/i18n": "^1.2.0",
+        "@gravity-ui/i18n": "^1.3.0",
         "@gravity-ui/icons": "^2.8.1",
         "@popperjs/core": "^2.11.8",
         "blueimp-md5": "^2.19.0",
diff --git a/package.json b/package.json
index cf92f402..a7a0f338 100644
--- a/package.json
+++ b/package.json
@@ -184,7 +184,7 @@
     "@gravity-ui/prettier-config": "1.1.0",
     "@gravity-ui/stylelint-config": "4.0.1",
     "@gravity-ui/tsconfig": "1.0.0",
-    "@gravity-ui/uikit": "6.1.1",
+    "@gravity-ui/uikit": "6.11.0",
     "@storybook/addon-essentials": "^7.1.1",
     "@storybook/cli": "^7.1.1",
     "@storybook/preset-scss": "1.0.3",
@@ -246,7 +246,7 @@
     "@diplodoc/mermaid-extension": "^1.0.0",
     "@diplodoc/transform": "^4.5.0",
     "@gravity-ui/components": "^3.0.0",
-    "@gravity-ui/uikit": "^6.0.0",
+    "@gravity-ui/uikit": "^6.11.0",
     "highlight.js": "^11.8.0",
     "katex": "^0.16.9",
     "lodash": "^4.17.20",
diff --git a/src/bundle/YfmEditorView.scss b/src/bundle/YfmEditorView.scss
index c1b56a74..a6dea289 100644
--- a/src/bundle/YfmEditorView.scss
+++ b/src/bundle/YfmEditorView.scss
@@ -57,8 +57,9 @@
         background: var(--g-color-line-generic);
     }
 
-    // TODO: fixme
     .ye-toolbar-list-button_arrow {
+        --g-button-icon-offset: 0px;
+        --g-button-padding: 2px;
         width: 42px;
     }
 
diff --git a/src/bundle/toolbar/ToolbarButtonWithPopupMenu.scss b/src/bundle/toolbar/ToolbarButtonWithPopupMenu.scss
index fb946479..c9eed3cc 100644
--- a/src/bundle/toolbar/ToolbarButtonWithPopupMenu.scss
+++ b/src/bundle/toolbar/ToolbarButtonWithPopupMenu.scss
@@ -1,23 +1,10 @@
 @import '~@gravity-ui/uikit/styles/mixins';
 
 .ye-toolbar-button-with-popup-menu {
-    // TODO: FIXME
-    // button with 2 icons
-    // 42px width
+    --g-button-icon-offset: 0px;
+    --g-button-padding: 2px;
     width: 42px;
 
-    .g-button__text.g-button__text.g-button__text {
-        margin: 0px 21px;
-    }
-
-    .g-button__icon_side_start {
-        left: -1px;
-    }
-
-    .g-button__icon_side_end {
-        right: -1px;
-    }
-
     &__menu-group {
         .g-menu__group-label {
             color: var(--g-color-text-hint);
diff --git a/src/toolbar/ToolbarListButton.scss b/src/toolbar/ToolbarListButton.scss
index 74884281..5cdbdf0a 100644
--- a/src/toolbar/ToolbarListButton.scss
+++ b/src/toolbar/ToolbarListButton.scss
@@ -1,18 +1,8 @@
 .ye-toolbar-list-button {
     &_arrow {
+        --g-button-icon-offset: 0px;
+        --g-button-padding: 2px;
         width: 42px;
-
-        .g-button__text.g-button__text.g-button__text {
-            margin: 0px 21px;
-        }
-
-        .g-button__icon_side_start {
-            left: -1px;
-        }
-
-        .g-button__icon_side_end {
-            right: -1px;
-        }
     }
 
     &__item {