@vkontakte/vkui-tokens 4.22.0 → 4.24.0

package/build/themeProcessors/expandColors/expandColors.js

@@ -12,11 +12,21 @@ var toneValueHover = 0.04;
 var toneValueActive = 0.08;
 var getColorWithStates = function (_a) {
     var colorArg = _a.colorArg, colorState = _a.colorState, toneValueActive = _a.toneValueActive, toneValueHover = _a.toneValueHover;
-    return ({
+    // Исправляет hover и action цвета в темной теме для белого цвета
+    if (typeof colorArg === 'string' &&
+        colorArg.toLowerCase() === '#ffffff' &&
+        colorState === '#FFFFFF') {
+        return {
+            normal: '#FFFFFF',
+            hover: '#EBEDF0',
+            active: '#D7D8DB',
+        };
+    }
+    return {
         normal: colorArg,
         hover: (0, mixColors_1.mixColors)(colorArg, colorState, toneValueHover),
         active: (0, mixColors_1.mixColors)(colorArg, colorState, toneValueActive),
-    });
+    };
 };
 function expandCallableColor(color, theme) {
     if (!(0, cssHelpers_1.isColorDescriptionCallable)(color)) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vkontakte/vkui-tokens",
-  "version": "4.22.0",
+  "version": "4.24.0",
   "description": "Репозиторий, который содержит в себе дизайн-токены и другие инструменты объединенной дизайн-системы VKUI и Paradigm",
   "license": "MIT",
   "main": "utils/descriptions.js",
@@ -29,32 +29,32 @@
   },
   "repository": "https://github.com/VKCOM/vkui-tokens.git",
   "dependencies": {
-    "csstype": "3.1.1"
+    "csstype": "^3.1.1"
   },
   "devDependencies": {
-    "@babel/core": "7.19.3",
-    "@svgr/webpack": "6.4.0",
+    "@babel/core": "7.20.2",
+    "@svgr/webpack": "6.5.1",
     "@types/color": "3.0.3",
     "@types/common-tags": "1.8.1",
     "@types/fs-extra": "9.0.13",
     "@types/jest": "26.0.23",
     "@types/node": "15.0.1",
-    "@types/react": "18.0.21",
+    "@types/react": "18.0.25",
     "@types/react-dom": "18.0.8",
     "@typescript-eslint/eslint-plugin": "4.33.0",
     "@typescript-eslint/parser": "4.33.0",
     "@vkontakte/appearance": "https://github.com/VKCOM/Appearance#v9.51.4",
-    "@vkontakte/icons": "1.201.0",
+    "@vkontakte/icons": "1.203.0",
     "@vkontakte/vk-bridge": "2.7.0",
-    "@vkontakte/vkui": "4.38.0",
+    "@vkontakte/vkui": "4.39.0",
     "babel-jest": "26.0.0",
-    "babel-loader": "8.2.5",
+    "babel-loader": "9.1.0",
     "clean-webpack-plugin": "4.0.0",
     "clsx": "1.2.1",
     "color": "4.2.3",
     "common-tags": "1.8.2",
     "copy-webpack-plugin": "11.0.0",
-    "css-loader": "6.7.1",
+    "css-loader": "6.7.2",
     "css.escape": "1.5.1",
     "eslint": "7.32.0",
     "eslint-config-prettier": "8.5.0",
@@ -65,7 +65,7 @@
     "eslint-plugin-jasmine": "4.1.3",
     "eslint-plugin-prettier": "4.2.1",
     "eslint-plugin-simple-import-sort": "7.0.0",
-    "eslint-plugin-sonarjs": "0.15.0",
+    "eslint-plugin-sonarjs": "0.16.0",
     "fs-extra": "10.1.0",
     "html-webpack-plugin": "5.5.0",
     "jest": "26.6.3",
@@ -83,9 +83,9 @@
     "ts-node": "10.9.1",
     "tsconfig-paths": "4.1.0",
     "tscpaths": "0.0.9",
-    "type-fest": "3.1.0",
+    "type-fest": "3.2.0",
     "typescript": "4.8.4",
-    "webpack": "5.74.0",
+    "webpack": "5.75.0",
     "webpack-cli": "4.10.0",
     "webpack-dev-server": "4.11.1",
     "webpack-notifier": "1.15.0"

package/themes/calendarDark/cssVars/declarations/index.css

@@ -377,8 +377,8 @@
 	--vkui--color_background_accent--hover: #307BFC;
 	--vkui--color_background_accent--active: #3880FC;
 	--vkui--color_background_accent_themed: #FFFFFF;
-	--vkui--color_background_accent_themed--hover: #FFFFFF;
-	--vkui--color_background_accent_themed--active: #FFFFFF;
+	--vkui--color_background_accent_themed--hover: #EBEDF0;
+	--vkui--color_background_accent_themed--active: #D7D8DB;
 	--vkui--color_background_accent_alternative: #FF9E00;
 	--vkui--color_background_accent_alternative--hover: #FFA20A;
 	--vkui--color_background_accent_alternative--active: #FFA614;
@@ -395,8 +395,8 @@
 	--vkui--color_background--hover: #222223;
 	--vkui--color_background--active: #2B2B2C;
 	--vkui--color_background_contrast: #FFFFFF;
-	--vkui--color_background_contrast--hover: #FFFFFF;
-	--vkui--color_background_contrast--active: #FFFFFF;
+	--vkui--color_background_contrast--hover: #EBEDF0;
+	--vkui--color_background_contrast--active: #D7D8DB;
 	--vkui--color_background_contrast_secondary_alpha: rgba(255, 255, 255, 0.2);
 	--vkui--color_background_contrast_secondary_alpha--hover: rgba(255, 255, 255, 0.24);
 	--vkui--color_background_contrast_secondary_alpha--active: rgba(255, 255, 255, 0.28);
@@ -427,9 +427,9 @@
 	--vkui--color_field_background: #232324;
 	--vkui--color_field_background--hover: #2C2C2D;
 	--vkui--color_field_background--active: #353536;
-	--vkui--color_background_modal_inverse: #ffffff;
-	--vkui--color_background_modal_inverse--hover: #FFFFFF;
-	--vkui--color_background_modal_inverse--active: #FFFFFF;
+	--vkui--color_background_modal_inverse: #FFFFFF;
+	--vkui--color_background_modal_inverse--hover: #EBEDF0;
+	--vkui--color_background_modal_inverse--active: #D7D8DB;
 	--vkui--color_background_contrast_inverse: #303030;
 	--vkui--color_background_contrast_inverse--hover: #383838;
 	--vkui--color_background_contrast_inverse--active: #414141;
@@ -440,8 +440,8 @@
 	--vkui--color_text_accent--hover: #4487FD;
 	--vkui--color_text_accent--active: #4C8CFD;
 	--vkui--color_text_accent_themed: #FFFFFF;
-	--vkui--color_text_accent_themed--hover: #FFFFFF;
-	--vkui--color_text_accent_themed--active: #FFFFFF;
+	--vkui--color_text_accent_themed--hover: #EBEDF0;
+	--vkui--color_text_accent_themed--active: #D7D8DB;
 	--vkui--color_text_negative: #ED0A34;
 	--vkui--color_text_negative--hover: #EE143C;
 	--vkui--color_text_negative--active: #EE1E44;
@@ -449,8 +449,8 @@
 	--vkui--color_text_link--hover: #5F9FFF;
 	--vkui--color_text_link--active: #65A3FF;
 	--vkui--color_text_link_themed: #FFFFFF;
-	--vkui--color_text_link_themed--hover: #FFFFFF;
-	--vkui--color_text_link_themed--active: #FFFFFF;
+	--vkui--color_text_link_themed--hover: #EBEDF0;
+	--vkui--color_text_link_themed--active: #D7D8DB;
 	--vkui--color_text_muted: #E7E8EA;
 	--vkui--color_text_muted--hover: #E8E9EB;
 	--vkui--color_text_muted--active: #E9EAEC;
@@ -473,14 +473,14 @@
 	--vkui--color_text_link_visited--hover: #5993E0;
 	--vkui--color_text_link_visited--active: #6098E2;
 	--vkui--color_text_contrast: #FFFFFF;
-	--vkui--color_text_contrast--hover: #FFFFFF;
-	--vkui--color_text_contrast--active: #FFFFFF;
+	--vkui--color_text_contrast--hover: #EBEDF0;
+	--vkui--color_text_contrast--active: #D7D8DB;
 	--vkui--color_text_contrast_themed: #2C2D2E;
 	--vkui--color_text_contrast_themed--hover: #343536;
 	--vkui--color_text_contrast_themed--active: #3D3E3F;
 	--vkui--color_link_contrast: #FFFFFF;
-	--vkui--color_link_contrast--hover: #FFFFFF;
-	--vkui--color_link_contrast--active: #FFFFFF;
+	--vkui--color_link_contrast--hover: #EBEDF0;
+	--vkui--color_link_contrast--active: #D7D8DB;
 	--vkui--color_text_positive: #0DC268;
 	--vkui--color_text_positive--hover: #17C46E;
 	--vkui--color_text_positive--active: #20C774;
@@ -488,8 +488,8 @@
 	--vkui--color_icon_accent--hover: #4487FD;
 	--vkui--color_icon_accent--active: #4C8CFD;
 	--vkui--color_icon_accent_themed: #FFFFFF;
-	--vkui--color_icon_accent_themed--hover: #FFFFFF;
-	--vkui--color_icon_accent_themed--active: #FFFFFF;
+	--vkui--color_icon_accent_themed--hover: #EBEDF0;
+	--vkui--color_icon_accent_themed--active: #D7D8DB;
 	--vkui--color_icon_negative: #ED0A34;
 	--vkui--color_icon_negative--hover: #EE143C;
 	--vkui--color_icon_negative--active: #EE1E44;
@@ -518,8 +518,8 @@
 	--vkui--color_icon_tertiary_alpha--hover: rgba(245, 246, 255, 0.54);
 	--vkui--color_icon_tertiary_alpha--active: rgba(245, 246, 255, 0.58);
 	--vkui--color_icon_contrast: #FFFFFF;
-	--vkui--color_icon_contrast--hover: #FFFFFF;
-	--vkui--color_icon_contrast--active: #FFFFFF;
+	--vkui--color_icon_contrast--hover: #EBEDF0;
+	--vkui--color_icon_contrast--active: #D7D8DB;
 	--vkui--color_icon_contrast_themed: #2C2D2E;
 	--vkui--color_icon_contrast_themed--hover: #343536;
 	--vkui--color_icon_contrast_themed--active: #3D3E3F;
@@ -533,11 +533,11 @@
 	--vkui--color_stroke_accent--hover: #4487FD;
 	--vkui--color_stroke_accent--active: #4C8CFD;
 	--vkui--color_stroke_accent_themed: #FFFFFF;
-	--vkui--color_stroke_accent_themed--hover: #FFFFFF;
-	--vkui--color_stroke_accent_themed--active: #FFFFFF;
+	--vkui--color_stroke_accent_themed--hover: #EBEDF0;
+	--vkui--color_stroke_accent_themed--active: #D7D8DB;
 	--vkui--color_stroke_contrast: #FFFFFF;
-	--vkui--color_stroke_contrast--hover: #FFFFFF;
-	--vkui--color_stroke_contrast--active: #FFFFFF;
+	--vkui--color_stroke_contrast--hover: #EBEDF0;
+	--vkui--color_stroke_contrast--active: #D7D8DB;
 	--vkui--color_stroke_negative: #ED0A34;
 	--vkui--color_stroke_negative--hover: #EE143C;
 	--vkui--color_stroke_negative--active: #EE1E44;

package/themes/calendarDark/cssVars/declarations/noSizes.css

@@ -30,8 +30,8 @@
 	--vkui--color_background_accent--hover: #307BFC;
 	--vkui--color_background_accent--active: #3880FC;
 	--vkui--color_background_accent_themed: #FFFFFF;
-	--vkui--color_background_accent_themed--hover: #FFFFFF;
-	--vkui--color_background_accent_themed--active: #FFFFFF;
+	--vkui--color_background_accent_themed--hover: #EBEDF0;
+	--vkui--color_background_accent_themed--active: #D7D8DB;
 	--vkui--color_background_accent_alternative: #FF9E00;
 	--vkui--color_background_accent_alternative--hover: #FFA20A;
 	--vkui--color_background_accent_alternative--active: #FFA614;
@@ -48,8 +48,8 @@
 	--vkui--color_background--hover: #222223;
 	--vkui--color_background--active: #2B2B2C;
 	--vkui--color_background_contrast: #FFFFFF;
-	--vkui--color_background_contrast--hover: #FFFFFF;
-	--vkui--color_background_contrast--active: #FFFFFF;
+	--vkui--color_background_contrast--hover: #EBEDF0;
+	--vkui--color_background_contrast--active: #D7D8DB;
 	--vkui--color_background_contrast_secondary_alpha: rgba(255, 255, 255, 0.2);
 	--vkui--color_background_contrast_secondary_alpha--hover: rgba(255, 255, 255, 0.24);
 	--vkui--color_background_contrast_secondary_alpha--active: rgba(255, 255, 255, 0.28);
@@ -80,9 +80,9 @@
 	--vkui--color_field_background: #232324;
 	--vkui--color_field_background--hover: #2C2C2D;
 	--vkui--color_field_background--active: #353536;
-	--vkui--color_background_modal_inverse: #ffffff;
-	--vkui--color_background_modal_inverse--hover: #FFFFFF;
-	--vkui--color_background_modal_inverse--active: #FFFFFF;
+	--vkui--color_background_modal_inverse: #FFFFFF;
+	--vkui--color_background_modal_inverse--hover: #EBEDF0;
+	--vkui--color_background_modal_inverse--active: #D7D8DB;
 	--vkui--color_background_contrast_inverse: #303030;
 	--vkui--color_background_contrast_inverse--hover: #383838;
 	--vkui--color_background_contrast_inverse--active: #414141;
@@ -93,8 +93,8 @@
 	--vkui--color_text_accent--hover: #4487FD;
 	--vkui--color_text_accent--active: #4C8CFD;
 	--vkui--color_text_accent_themed: #FFFFFF;
-	--vkui--color_text_accent_themed--hover: #FFFFFF;
-	--vkui--color_text_accent_themed--active: #FFFFFF;
+	--vkui--color_text_accent_themed--hover: #EBEDF0;
+	--vkui--color_text_accent_themed--active: #D7D8DB;
 	--vkui--color_text_negative: #ED0A34;
 	--vkui--color_text_negative--hover: #EE143C;
 	--vkui--color_text_negative--active: #EE1E44;
@@ -102,8 +102,8 @@
 	--vkui--color_text_link--hover: #5F9FFF;
 	--vkui--color_text_link--active: #65A3FF;
 	--vkui--color_text_link_themed: #FFFFFF;
-	--vkui--color_text_link_themed--hover: #FFFFFF;
-	--vkui--color_text_link_themed--active: #FFFFFF;
+	--vkui--color_text_link_themed--hover: #EBEDF0;
+	--vkui--color_text_link_themed--active: #D7D8DB;
 	--vkui--color_text_muted: #E7E8EA;
 	--vkui--color_text_muted--hover: #E8E9EB;
 	--vkui--color_text_muted--active: #E9EAEC;
@@ -126,14 +126,14 @@
 	--vkui--color_text_link_visited--hover: #5993E0;
 	--vkui--color_text_link_visited--active: #6098E2;
 	--vkui--color_text_contrast: #FFFFFF;
-	--vkui--color_text_contrast--hover: #FFFFFF;
-	--vkui--color_text_contrast--active: #FFFFFF;
+	--vkui--color_text_contrast--hover: #EBEDF0;
+	--vkui--color_text_contrast--active: #D7D8DB;
 	--vkui--color_text_contrast_themed: #2C2D2E;
 	--vkui--color_text_contrast_themed--hover: #343536;
 	--vkui--color_text_contrast_themed--active: #3D3E3F;
 	--vkui--color_link_contrast: #FFFFFF;
-	--vkui--color_link_contrast--hover: #FFFFFF;
-	--vkui--color_link_contrast--active: #FFFFFF;
+	--vkui--color_link_contrast--hover: #EBEDF0;
+	--vkui--color_link_contrast--active: #D7D8DB;
 	--vkui--color_text_positive: #0DC268;
 	--vkui--color_text_positive--hover: #17C46E;
 	--vkui--color_text_positive--active: #20C774;
@@ -141,8 +141,8 @@
 	--vkui--color_icon_accent--hover: #4487FD;
 	--vkui--color_icon_accent--active: #4C8CFD;
 	--vkui--color_icon_accent_themed: #FFFFFF;
-	--vkui--color_icon_accent_themed--hover: #FFFFFF;
-	--vkui--color_icon_accent_themed--active: #FFFFFF;
+	--vkui--color_icon_accent_themed--hover: #EBEDF0;
+	--vkui--color_icon_accent_themed--active: #D7D8DB;
 	--vkui--color_icon_negative: #ED0A34;
 	--vkui--color_icon_negative--hover: #EE143C;
 	--vkui--color_icon_negative--active: #EE1E44;
@@ -171,8 +171,8 @@
 	--vkui--color_icon_tertiary_alpha--hover: rgba(245, 246, 255, 0.54);
 	--vkui--color_icon_tertiary_alpha--active: rgba(245, 246, 255, 0.58);
 	--vkui--color_icon_contrast: #FFFFFF;
-	--vkui--color_icon_contrast--hover: #FFFFFF;
-	--vkui--color_icon_contrast--active: #FFFFFF;
+	--vkui--color_icon_contrast--hover: #EBEDF0;
+	--vkui--color_icon_contrast--active: #D7D8DB;
 	--vkui--color_icon_contrast_themed: #2C2D2E;
 	--vkui--color_icon_contrast_themed--hover: #343536;
 	--vkui--color_icon_contrast_themed--active: #3D3E3F;
@@ -186,11 +186,11 @@
 	--vkui--color_stroke_accent--hover: #4487FD;
 	--vkui--color_stroke_accent--active: #4C8CFD;
 	--vkui--color_stroke_accent_themed: #FFFFFF;
-	--vkui--color_stroke_accent_themed--hover: #FFFFFF;
-	--vkui--color_stroke_accent_themed--active: #FFFFFF;
+	--vkui--color_stroke_accent_themed--hover: #EBEDF0;
+	--vkui--color_stroke_accent_themed--active: #D7D8DB;
 	--vkui--color_stroke_contrast: #FFFFFF;
-	--vkui--color_stroke_contrast--hover: #FFFFFF;
-	--vkui--color_stroke_contrast--active: #FFFFFF;
+	--vkui--color_stroke_contrast--hover: #EBEDF0;
+	--vkui--color_stroke_contrast--active: #D7D8DB;
 	--vkui--color_stroke_negative: #ED0A34;
 	--vkui--color_stroke_negative--hover: #EE143C;
 	--vkui--color_stroke_negative--active: #EE1E44;

package/themes/calendarDark/cssVars/declarations/onlyColors.css

@@ -3,8 +3,8 @@
 	--vkui--color_background_accent--hover: #307BFC;
 	--vkui--color_background_accent--active: #3880FC;
 	--vkui--color_background_accent_themed: #FFFFFF;
-	--vkui--color_background_accent_themed--hover: #FFFFFF;
-	--vkui--color_background_accent_themed--active: #FFFFFF;
+	--vkui--color_background_accent_themed--hover: #EBEDF0;
+	--vkui--color_background_accent_themed--active: #D7D8DB;
 	--vkui--color_background_accent_alternative: #FF9E00;
 	--vkui--color_background_accent_alternative--hover: #FFA20A;
 	--vkui--color_background_accent_alternative--active: #FFA614;
@@ -21,8 +21,8 @@
 	--vkui--color_background--hover: #222223;
 	--vkui--color_background--active: #2B2B2C;
 	--vkui--color_background_contrast: #FFFFFF;
-	--vkui--color_background_contrast--hover: #FFFFFF;
-	--vkui--color_background_contrast--active: #FFFFFF;
+	--vkui--color_background_contrast--hover: #EBEDF0;
+	--vkui--color_background_contrast--active: #D7D8DB;
 	--vkui--color_background_contrast_secondary_alpha: rgba(255, 255, 255, 0.2);
 	--vkui--color_background_contrast_secondary_alpha--hover: rgba(255, 255, 255, 0.24);
 	--vkui--color_background_contrast_secondary_alpha--active: rgba(255, 255, 255, 0.28);
@@ -53,9 +53,9 @@
 	--vkui--color_field_background: #232324;
 	--vkui--color_field_background--hover: #2C2C2D;
 	--vkui--color_field_background--active: #353536;
-	--vkui--color_background_modal_inverse: #ffffff;
-	--vkui--color_background_modal_inverse--hover: #FFFFFF;
-	--vkui--color_background_modal_inverse--active: #FFFFFF;
+	--vkui--color_background_modal_inverse: #FFFFFF;
+	--vkui--color_background_modal_inverse--hover: #EBEDF0;
+	--vkui--color_background_modal_inverse--active: #D7D8DB;
 	--vkui--color_background_contrast_inverse: #303030;
 	--vkui--color_background_contrast_inverse--hover: #383838;
 	--vkui--color_background_contrast_inverse--active: #414141;
@@ -66,8 +66,8 @@
 	--vkui--color_text_accent--hover: #4487FD;
 	--vkui--color_text_accent--active: #4C8CFD;
 	--vkui--color_text_accent_themed: #FFFFFF;
-	--vkui--color_text_accent_themed--hover: #FFFFFF;
-	--vkui--color_text_accent_themed--active: #FFFFFF;
+	--vkui--color_text_accent_themed--hover: #EBEDF0;
+	--vkui--color_text_accent_themed--active: #D7D8DB;
 	--vkui--color_text_negative: #ED0A34;
 	--vkui--color_text_negative--hover: #EE143C;
 	--vkui--color_text_negative--active: #EE1E44;
@@ -75,8 +75,8 @@
 	--vkui--color_text_link--hover: #5F9FFF;
 	--vkui--color_text_link--active: #65A3FF;
 	--vkui--color_text_link_themed: #FFFFFF;
-	--vkui--color_text_link_themed--hover: #FFFFFF;
-	--vkui--color_text_link_themed--active: #FFFFFF;
+	--vkui--color_text_link_themed--hover: #EBEDF0;
+	--vkui--color_text_link_themed--active: #D7D8DB;
 	--vkui--color_text_muted: #E7E8EA;
 	--vkui--color_text_muted--hover: #E8E9EB;
 	--vkui--color_text_muted--active: #E9EAEC;
@@ -99,14 +99,14 @@
 	--vkui--color_text_link_visited--hover: #5993E0;
 	--vkui--color_text_link_visited--active: #6098E2;
 	--vkui--color_text_contrast: #FFFFFF;
-	--vkui--color_text_contrast--hover: #FFFFFF;
-	--vkui--color_text_contrast--active: #FFFFFF;
+	--vkui--color_text_contrast--hover: #EBEDF0;
+	--vkui--color_text_contrast--active: #D7D8DB;
 	--vkui--color_text_contrast_themed: #2C2D2E;
 	--vkui--color_text_contrast_themed--hover: #343536;
 	--vkui--color_text_contrast_themed--active: #3D3E3F;
 	--vkui--color_link_contrast: #FFFFFF;
-	--vkui--color_link_contrast--hover: #FFFFFF;
-	--vkui--color_link_contrast--active: #FFFFFF;
+	--vkui--color_link_contrast--hover: #EBEDF0;
+	--vkui--color_link_contrast--active: #D7D8DB;
 	--vkui--color_text_positive: #0DC268;
 	--vkui--color_text_positive--hover: #17C46E;
 	--vkui--color_text_positive--active: #20C774;
@@ -114,8 +114,8 @@
 	--vkui--color_icon_accent--hover: #4487FD;
 	--vkui--color_icon_accent--active: #4C8CFD;
 	--vkui--color_icon_accent_themed: #FFFFFF;
-	--vkui--color_icon_accent_themed--hover: #FFFFFF;
-	--vkui--color_icon_accent_themed--active: #FFFFFF;
+	--vkui--color_icon_accent_themed--hover: #EBEDF0;
+	--vkui--color_icon_accent_themed--active: #D7D8DB;
 	--vkui--color_icon_negative: #ED0A34;
 	--vkui--color_icon_negative--hover: #EE143C;
 	--vkui--color_icon_negative--active: #EE1E44;
@@ -144,8 +144,8 @@
 	--vkui--color_icon_tertiary_alpha--hover: rgba(245, 246, 255, 0.54);
 	--vkui--color_icon_tertiary_alpha--active: rgba(245, 246, 255, 0.58);
 	--vkui--color_icon_contrast: #FFFFFF;
-	--vkui--color_icon_contrast--hover: #FFFFFF;
-	--vkui--color_icon_contrast--active: #FFFFFF;
+	--vkui--color_icon_contrast--hover: #EBEDF0;
+	--vkui--color_icon_contrast--active: #D7D8DB;
 	--vkui--color_icon_contrast_themed: #2C2D2E;
 	--vkui--color_icon_contrast_themed--hover: #343536;
 	--vkui--color_icon_contrast_themed--active: #3D3E3F;
@@ -159,11 +159,11 @@
 	--vkui--color_stroke_accent--hover: #4487FD;
 	--vkui--color_stroke_accent--active: #4C8CFD;
 	--vkui--color_stroke_accent_themed: #FFFFFF;
-	--vkui--color_stroke_accent_themed--hover: #FFFFFF;
-	--vkui--color_stroke_accent_themed--active: #FFFFFF;
+	--vkui--color_stroke_accent_themed--hover: #EBEDF0;
+	--vkui--color_stroke_accent_themed--active: #D7D8DB;
 	--vkui--color_stroke_contrast: #FFFFFF;
-	--vkui--color_stroke_contrast--hover: #FFFFFF;
-	--vkui--color_stroke_contrast--active: #FFFFFF;
+	--vkui--color_stroke_contrast--hover: #EBEDF0;
+	--vkui--color_stroke_contrast--active: #D7D8DB;
 	--vkui--color_stroke_negative: #ED0A34;
 	--vkui--color_stroke_negative--hover: #EE143C;
 	--vkui--color_stroke_negative--active: #EE1E44;