@vkontakte/vkui-tokens 4.35.0 → 4.35.2-dev-cfbf64.0

package/interfaces/general/colors/index.d.ts

@@ -216,6 +216,11 @@ export interface ColorsDescriptionStruct {
      * @tags color
      */
     colorLinkContrast: ColorDescription;
+    /**
+     * @desc Цвет текста для кнопок
+     * @tags color
+     */
+    colorTextButton: ColorDescription;
     /**
      * @desc Акцентный цвет иконок
      * @tags color, icon
@@ -291,6 +296,11 @@ export interface ColorsDescriptionStruct {
      * @tags color, icon
      */
     colorIconNegative: ColorDescription;
+    /**
+     * @desc Цвет иконок для кнопок
+     * @tags color, icon
+     */
+    colorIconButton: ColorDescription;
     /**
      * @desc Цвет акцентной обводки
      * @tags color,stroke
@@ -351,6 +361,11 @@ export interface ColorsDescriptionStruct {
      * @tags color, stroke
      */
     colorSeparatorPrimary3x: ColorDescription;
+    /**
+     * @desc Цвет обводки для кнопок
+     * @tags color, stroke
+     */
+    colorStrokeButton: ColorDescription;
     /**
      * @desc Палитра цветов. Голубой цвет
      * @tags color, palette

package/interfaces/themes/vkontakteAndroid/index.d.ts

@@ -177,10 +177,57 @@ export interface VkontakteAndroidGradients {
 }
 export interface LocalVkontakteAndroidColorsDescriptionStruct {
     vkontakteColorSnippetBorderAlpha: ColorDescription;
+    vkontakteColorSnippetBackground?: ColorDescription;
     vkontakteColorModalCardBorderAlpha: ColorDescription;
     vkontakteColorLandingSnippetBorderAlpha: ColorDescription;
     vkontakteColorActionSheetSeparatorAlpha: ColorDescription;
     vkontakteColorInputBorder: ColorDescription;
+    vkontakteColorSearchBarBackground?: ColorDescription;
+    vkontakteBackgroundHoverAlpha?: ColorDescription;
+    vkontakteColorBackgroundSuggestions?: ColorDescription;
+    vkontakteColorTextName?: ColorDescription;
+    vkontakteColorAccentAlternate?: ColorDescription;
+    vkontakteColorBackgroundKeyboard?: ColorDescription;
+    vkontakteColorContentPlaceholderIcon?: ColorDescription;
+    vkontakteColorContentTintForeground?: ColorDescription;
+    vkontakteColorControlBackground?: ColorDescription;
+    vkontakteColorControlForeground?: ColorDescription;
+    vkontakteColorControlTintMuted?: ColorDescription;
+    vkontakteColorHeaderSearchFieldBackground?: ColorDescription;
+    vkontakteColorHeaderSearchFieldTint?: ColorDescription;
+    vkontakteColorHeaderTabActiveIndicator?: ColorDescription;
+    vkontakteColorIconOutlineMedium?: ColorDescription;
+    vkontakteColorIconOutlineSecondary?: ColorDescription;
+    vkontakteColorSkeletonShimmerFrom?: ColorDescription;
+    vkontakteColorAlphaSkeletonShimmerTo?: ColorDescription;
+    vkontakteColorLoaderBackground?: ColorDescription;
+    vkontakteColorLoaderTint?: ColorDescription;
+    vkontakteColorMusicPlaybackIcon?: ColorDescription;
+    vkontakteColorStatusBackground?: ColorDescription;
+    vkontakteColorPlaceholderIconForegroundPrimary?: ColorDescription;
+    vkontakteColorPlaceholderIconForegroundSecondary?: ColorDescription;
+    vkontakteColorPlaceholderIconTint?: ColorDescription;
+    vkontakteColorPollOptionBackground?: ColorDescription;
+    vkontakteColorSearchBarFieldTint?: ColorDescription;
+    vkontakteColorTabbarActiveIcon?: ColorDescription;
+    vkontakteColorTabbarBackground?: ColorDescription;
+    vkontakteColorTabbarInactiveIcon?: ColorDescription;
+    vkontakteColorTabbarTabletTextSecondary?: ColorDescription;
+    vkontakteColorToolbarAttachBackgroundFrom?: ColorDescription;
+    vkontakteColorSplashScreenIcon?: ColorDescription;
+    vkontakteColorIconName?: ColorDescription;
+    vkontakteColorPanelTabActiveText?: ColorDescription;
+    vkontakteColorBackgroundTextAlpha?: ColorDescription;
+    vkontakteImReplySeparator?: ColorDescription;
+    vkontakteImToolbarVoiceMsgBackground?: ColorDescription;
+    vkontakteColorModalCardHeaderClose?: ColorDescription;
+    vkontakteImBubbleButtonOutgoingBackgroundAlpha?: ColorDescription;
+    vkontakteImBubbleButtonForeground?: ColorDescription;
+    vkontakteImBubbleIncomingHighlighted?: ColorDescription;
+    vkontakteImBubbleGiftBackground?: ColorDescription;
+    vkontakteImBubbleGiftBackgroundHighlighted?: ColorDescription;
+    vkontakteImBubbleOutgoingAlternate?: ColorDescription;
+    vkontakteImAttachTint?: ColorDescription;
     vkontakteColorImForwardLineAlpha: ColorDescription;
     vkontakteColorImBubbleBorderAlternateHighlightedAlpha: ColorDescription;
     vkontakteColorImBubbleIncoming: ColorDescription;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vkontakte/vkui-tokens",
-  "version": "4.35.0",
+  "version": "4.35.2-dev-cfbf64.0",
   "description": "Репозиторий, который содержит в себе дизайн-токены и другие инструменты объединенной дизайн-системы VKUI и Paradigm",
   "license": "MIT",
   "main": "utils/descriptions.js",
@@ -33,7 +33,7 @@
   },
   "devDependencies": {
     "@babel/core": "7.21.8",
-    "@svgr/webpack": "7.0.0",
+    "@svgr/webpack": "8.0.1",
     "@types/color": "3.0.3",
     "@types/common-tags": "1.8.1",
     "@types/fs-extra": "11.0.1",
@@ -68,16 +68,16 @@
     "eslint-plugin-simple-import-sort": "10.0.0",
     "eslint-plugin-sonarjs": "0.19.0",
     "fs-extra": "11.1.1",
-    "html-webpack-plugin": "5.5.0",
+    "html-webpack-plugin": "5.5.1",
     "jest": "29.5.0",
     "jest-junit": "16.0.0",
     "lodash": "4.17.21",
     "prettier": "2.8.8",
     "react": "18.2.0",
     "react-dom": "18.2.0",
-    "rimraf": "5.0.0",
+    "rimraf": "5.0.1",
     "style-loader": "3.3.2",
-    "terser-webpack-plugin": "5.3.7",
+    "terser-webpack-plugin": "5.3.9",
     "ts-jest": "29.1.0",
     "ts-loader": "9.4.2",
     "ts-morph": "18.0.0",

package/themeDescriptions/base/paradigm.js

@@ -82,6 +82,7 @@ exports.lightColors = {
         colorTextContrastThemed: '#FFFFFF',
         colorLinkContrast: '#FFFFFF',
         colorTextPositive: '#0DC268',
+        colorTextButton: '#005FF9',
         // Icons
         colorIconAccent: '#005FF9',
         colorIconAccentThemed: '#005FF9',
@@ -98,6 +99,7 @@ exports.lightColors = {
         colorIconContrastThemed: '#FFFFFF',
         colorIconPositive: '#0DC268',
         colorIconContrastSecondary: '#F2F3F5',
+        colorIconButton: '#005FF9',
         // Stroke
         colorStrokeAccent: '#005FF9',
         colorStrokeAccentThemed: '#005FF9',
@@ -111,6 +113,7 @@ exports.lightColors = {
         colorStrokePositive: '#0DC268',
         colorSeparatorPrimary2x: '#CDD0D5',
         colorSeparatorPrimary3x: '#BFC3CA',
+        colorStrokeButton: '#005FF9',
         // Palette
         colorAccentBlue: '#005FF9',
         colorAccentGray: '#A5A7AD',
@@ -199,6 +202,7 @@ exports.darkColors = {
         colorTextContrastThemed: '#2C2D2E',
         colorLinkContrast: '#FFFFFF',
         colorTextPositive: '#0DC268',
+        colorTextButton: '#FFFFFF',
         // Icons
         colorIconAccent: '#3C82FD',
         colorIconAccentThemed: '#FFFFFF',
@@ -215,6 +219,7 @@ exports.darkColors = {
         colorIconContrastThemed: '#2C2D2E',
         colorIconPositive: '#0DC268',
         colorIconContrastSecondary: '#F2F3F5',
+        colorIconButton: '#FFFFFF',
         // Stroke
         colorStrokeAccent: '#3C82FD',
         colorStrokeAccentThemed: '#FFFFFF',
@@ -228,6 +233,7 @@ exports.darkColors = {
         colorSeparatorPrimary2x: '#202022',
         colorSeparatorPrimary3x: '#2d2d2f',
         colorStrokePositive: '#0DC268',
+        colorStrokeButton: '#FFFFFF',
         // Palette
         colorAccentBlue: '#2775FC',
         colorAccentGray: '#9C9DA2',

package/themeDescriptions/base/vk.js

@@ -81,6 +81,7 @@ exports.lightColors = {
         colorTextLinkVisited: '#4986CC',
         colorTextMuted: '#2C2D2E',
         colorLinkContrast: '#FFFFFF',
+        colorTextButton: '#2688EB',
         // Icons
         colorIconAccent: '#2688EB',
         colorIconAccentThemed: '#2688EB',
@@ -97,6 +98,7 @@ exports.lightColors = {
         colorIconContrastSecondary: '#F2F3F5',
         colorIconPositive: '#4BB34B',
         colorIconNegative: '#E64646',
+        colorIconButton: '#2688EB',
         // Stroke
         colorStrokeAccent: '#2688EB',
         colorStrokeAccentThemed: '#2688EB',
@@ -114,6 +116,7 @@ exports.lightColors = {
             hover: 'rgba(0, 0, 0, 0.24)',
             active: 'rgba(0, 0, 0, 0.36)',
         },
+        colorStrokeButton: '#2688EB',
         // Palette
         colorAccentBlue: '#3F8AE0',
         colorAccentGray: '#A3ADB8',
@@ -214,6 +217,7 @@ exports.darkColors = {
         colorTextLinkVisited: '#4986CC',
         colorTextMuted: '#E1E3E6',
         colorLinkContrast: '#FFFFFF',
+        colorTextButton: '#FFFFFF',
         // Icons
         colorIconAccent: '#529EF4',
         colorIconAccentThemed: '#FFFFFF',
@@ -230,6 +234,7 @@ exports.darkColors = {
         colorIconContrastSecondary: '#F2F3F5',
         colorIconPositive: '#4BB34B',
         colorIconNegative: '#FF5C5C',
+        colorIconButton: '#FFFFFF',
         // Stroke
         colorStrokeAccent: '#529EF4',
         colorStrokeAccentThemed: '#FFFFFF',
@@ -243,6 +248,7 @@ exports.darkColors = {
         colorStrokeContrast: '#FFFFFF',
         colorImageBorderAlpha: 'rgba(255, 255, 255, 0.08)',
         colorFieldBorderAlpha: 'rgba(255, 255, 255, 0.12)',
+        colorStrokeButton: '#FFFFFF',
         // Palette
         colorAccentBlue: '#529EF4',
         colorAccentGray: '#A3ADB8',

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

@@ -498,6 +498,9 @@
 	--vkui--color_text_positive: #0DC268;
 	--vkui--color_text_positive--hover: #0CBB66;
 	--vkui--color_text_positive--active: #0CB465;
+	--vkui--color_text_button: #005FF9;
+	--vkui--color_text_button--hover: #005CF1;
+	--vkui--color_text_button--active: #0059EA;
 	--vkui--color_icon_accent: #005FF9;
 	--vkui--color_icon_accent--hover: #005CF1;
 	--vkui--color_icon_accent--active: #0059EA;
@@ -543,6 +546,9 @@
 	--vkui--color_icon_contrast_secondary: #F2F3F5;
 	--vkui--color_icon_contrast_secondary--hover: #E8EAEE;
 	--vkui--color_icon_contrast_secondary--active: #DFE1E6;
+	--vkui--color_icon_button: #005FF9;
+	--vkui--color_icon_button--hover: #005CF1;
+	--vkui--color_icon_button--active: #0059EA;
 	--vkui--color_stroke_accent: #005FF9;
 	--vkui--color_stroke_accent--hover: #005CF1;
 	--vkui--color_stroke_accent--active: #0059EA;
@@ -579,6 +585,9 @@
 	--vkui--color_separator_primary3x: #BFC3CA;
 	--vkui--color_separator_primary3x--hover: #B7BCC4;
 	--vkui--color_separator_primary3x--active: #B0B5BF;
+	--vkui--color_stroke_button: #005FF9;
+	--vkui--color_stroke_button--hover: #005CF1;
+	--vkui--color_stroke_button--active: #0059EA;
 	--vkui--color_accent_blue: #005FF9;
 	--vkui--color_accent_blue--hover: #005CF1;
 	--vkui--color_accent_blue--active: #0059EA;

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

@@ -150,6 +150,9 @@
 	--vkui--color_text_positive: #0DC268;
 	--vkui--color_text_positive--hover: #0CBB66;
 	--vkui--color_text_positive--active: #0CB465;
+	--vkui--color_text_button: #005FF9;
+	--vkui--color_text_button--hover: #005CF1;
+	--vkui--color_text_button--active: #0059EA;
 	--vkui--color_icon_accent: #005FF9;
 	--vkui--color_icon_accent--hover: #005CF1;
 	--vkui--color_icon_accent--active: #0059EA;
@@ -195,6 +198,9 @@
 	--vkui--color_icon_contrast_secondary: #F2F3F5;
 	--vkui--color_icon_contrast_secondary--hover: #E8EAEE;
 	--vkui--color_icon_contrast_secondary--active: #DFE1E6;
+	--vkui--color_icon_button: #005FF9;
+	--vkui--color_icon_button--hover: #005CF1;
+	--vkui--color_icon_button--active: #0059EA;
 	--vkui--color_stroke_accent: #005FF9;
 	--vkui--color_stroke_accent--hover: #005CF1;
 	--vkui--color_stroke_accent--active: #0059EA;
@@ -231,6 +237,9 @@
 	--vkui--color_separator_primary3x: #BFC3CA;
 	--vkui--color_separator_primary3x--hover: #B7BCC4;
 	--vkui--color_separator_primary3x--active: #B0B5BF;
+	--vkui--color_stroke_button: #005FF9;
+	--vkui--color_stroke_button--hover: #005CF1;
+	--vkui--color_stroke_button--active: #0059EA;
 	--vkui--color_accent_blue: #005FF9;
 	--vkui--color_accent_blue--hover: #005CF1;
 	--vkui--color_accent_blue--active: #0059EA;

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

@@ -113,6 +113,9 @@
 	--vkui--color_text_positive: #0DC268;
 	--vkui--color_text_positive--hover: #0CBB66;
 	--vkui--color_text_positive--active: #0CB465;
+	--vkui--color_text_button: #005FF9;
+	--vkui--color_text_button--hover: #005CF1;
+	--vkui--color_text_button--active: #0059EA;
 	--vkui--color_icon_accent: #005FF9;
 	--vkui--color_icon_accent--hover: #005CF1;
 	--vkui--color_icon_accent--active: #0059EA;
@@ -158,6 +161,9 @@
 	--vkui--color_icon_contrast_secondary: #F2F3F5;
 	--vkui--color_icon_contrast_secondary--hover: #E8EAEE;
 	--vkui--color_icon_contrast_secondary--active: #DFE1E6;
+	--vkui--color_icon_button: #005FF9;
+	--vkui--color_icon_button--hover: #005CF1;
+	--vkui--color_icon_button--active: #0059EA;
 	--vkui--color_stroke_accent: #005FF9;
 	--vkui--color_stroke_accent--hover: #005CF1;
 	--vkui--color_stroke_accent--active: #0059EA;
@@ -194,6 +200,9 @@
 	--vkui--color_separator_primary3x: #BFC3CA;
 	--vkui--color_separator_primary3x--hover: #B7BCC4;
 	--vkui--color_separator_primary3x--active: #B0B5BF;
+	--vkui--color_stroke_button: #005FF9;
+	--vkui--color_stroke_button--hover: #005CF1;
+	--vkui--color_stroke_button--active: #0059EA;
 	--vkui--color_accent_blue: #005FF9;
 	--vkui--color_accent_blue--hover: #005CF1;
 	--vkui--color_accent_blue--active: #0059EA;