feat!: update @gravity-ui/uikit v6

gravity-ui · Mar 4, 2024 · 82689df · 82689df
1 parent afd11c2
commit 82689df
Show file tree

Hide file tree

Showing 8 changed files with 212 additions and 87 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -61,7 +61,7 @@
     "@gravity-ui/prettier-config": "^1.0.1",
     "@gravity-ui/stylelint-config": "^2.0.0",
     "@gravity-ui/tsconfig": "^1.0.0",
-    "@gravity-ui/uikit": "^5.9.1",
+    "@gravity-ui/uikit": "^6.1.0",
     "@storybook/addon-actions": "^7.1.1",
     "@storybook/addon-essentials": "^7.1.1",
     "@storybook/addon-interactions": "^7.1.1",
@@ -89,7 +89,7 @@
   "peerDependencies": {
     "@bem-react/classname": "^1.6.0",
     "@gravity-ui/icons": "^2.0.0",
-    "@gravity-ui/uikit": "^5.0.0",
+    "@gravity-ui/uikit": "^6.1.0",
     "react": "^16.0.0 || ^17.0.0 || ^18.0.0",
     "react-dom": "^16.0.0 || ^17.0.0 || ^18.0.0"
   },

diff --git a/src/dialog/Dialog/Dialog.scss b/src/dialog/Dialog/Dialog.scss
@@ -25,7 +25,8 @@
         &_with_vertical_tabs {
             border-top: 1px solid var(--g-color-line-generic);
             border-bottom: 1px solid var(--g-color-line-generic);
-            --yc-dialog-body-padding: 0px;
+
+            padding: 0px;
         }
     }
 
@@ -56,8 +57,7 @@
         padding-bottom: 1ex;
     }
 
-    .yc-tabs {
-        margin-bottom: 10px;
+    .g-tabs {
         position: relative;
 
         &__tab {
@@ -66,14 +66,6 @@
         }
     }
 
-    .yc-field-wrapper {
-        position: relative;
-
-        &__error-text {
-            position: absolute;
-        }
-    }
-
     &__error-message {
         color: var(--g-color-text-danger);
         margin-top: 2px;
@@ -193,7 +185,7 @@
         padding-bottom: 8px;
         border-radius: 5px;
 
-        .yc-icon {
+        .g-icon {
             margin-right: 8px;
         }
     }
@@ -217,14 +209,15 @@
 .df-page-dialog {
     width: 720px;
 
+    --_--side-padding: 32px;
+
     &__wrapper {
         width: 100%;
         display: flex;
         justify-content: center;
     }
 
     &__title {
-        padding: var(--yc-dialog-header-padding);
         line-height: 24px;
         display: flex;
         align-items: center;
@@ -235,7 +228,11 @@
     }
 
     &__body {
-        padding: var(--yc-dialog-body-padding);
         flex: 1 1 100%;
     }
+
+    .g-dialog-header {
+        padding-left: 32px;
+        padding-right: 32px;
+    }
 }
diff --git a/src/dialog/Dialog/Dialog.tsx b/src/dialog/Dialog/Dialog.tsx
@@ -624,7 +624,7 @@ class Dialog<
 
     componentDidUpdate(_prevProps: unknown, prevState: State<FormValues>) {
         if (prevState.tabsCount !== this.state.tabsCount) {
-            setTimeout(() => document.querySelector('.yc-dialog__modal')?.scrollTo(0, 0), 0); // setTimeout for safari
+            setTimeout(() => document.querySelector('.g-dialog__modal')?.scrollTo(0, 0), 0); // setTimeout for safari
         }
     }
 

diff --git a/src/dialog/MultiTextControl/LabelsGroup/LabelsGroup.tsx b/src/dialog/MultiTextControl/LabelsGroup/LabelsGroup.tsx
@@ -54,7 +54,7 @@ class LabelsGroup extends Component<Props> {
                 className={block('label')}
                 type={onRemove && !isDefault ? 'close' : 'default'}
                 onClick={onLabelClick}
-                onClose={onRemoveClick}
+                onCloseClick={onRemoveClick}
                 size="s"
                 disabled={disabled}
             >

diff --git a/src/dialog/TabField/TabField.scss b/src/dialog/TabField/TabField.scss
@@ -1,4 +1,8 @@
 .df-dialog-tab {
+    &__control {
+        margin-bottom: 10px;
+    }
+
     &__wrapper {
         display: flex;
         align-items: center;

diff --git a/src/dialog/TabField/TabField.tsx b/src/dialog/TabField/TabField.tsx
@@ -91,7 +91,7 @@ class TabField extends Component<TabFieldProps> {
 
         return (
             <Tabs
-                className={className}
+                className={block('control', className)}
                 items={tabItems}
                 activeTab={activeTab}
                 onSelectTab={setActiveTab}

diff --git a/src/dialog/TabField/TabFieldVertical.scss b/src/dialog/TabField/TabFieldVertical.scss
@@ -15,7 +15,7 @@
         font-size: 18px;
     }
 
-    .yc-list__item {
+    .g-list__item {
         line-height: 100%;
         padding-left: 1em;
         border-left: 4px solid rgba(0, 0, 0, 0);