@vkontakte/vkui-tokens 4.29.3 → 4.30.0

package/build/compilers/docs/__test__/testLinks.d.ts

@@ -0,0 +1,7 @@
+export interface BaseTheme {
+    /**
+     * @desc Link with text {@link https://google.com Google}.
+     *       Link without text {@link https://google.com}
+     */
+    importedBaseProp: string;
+}

package/build/compilers/docs/__test__/testLinks.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/build/compilers/docs/compileDocsJSON.d.ts

@@ -1,7 +1,15 @@
 import { SpecialTokens, Theme } from '../../../interfaces/general';
+export type Description = {
+    type: 'text';
+    text: string;
+} | {
+    type: 'link';
+    url: string;
+    text: string;
+};
 export interface ThemePropertyDoc {
     tags: string[];
-    desc: string;
+    desc: Description[];
 }
 export type ThemeDocs = {
     [name: string]: ThemePropertyDoc;

package/build/compilers/docs/compileDocsJSON.js

@@ -18,6 +18,34 @@ exports.compileDocsJSON = exports.getTypeDocs = void 0;
 var path_1 = __importDefault(require("path"));
 var ts_morph_1 = require("ts-morph");
 var capitalize_1 = require("../../helpers/capitalize");
+function getTagDescription(tag) {
+    return tag
+        .getText()
+        .map(function (part) {
+        switch (part.kind) {
+            case 'text':
+                return {
+                    type: 'text',
+                    text: part.text,
+                };
+            case 'linkText': {
+                var _a = part.text.split(' '), url = _a[0], urlText = _a[1];
+                if (!url) {
+                    throw new Error('[desc] Ожидаемый формат ссылки в JSDoc `{@link url urlText}` или `{@link url}`');
+                }
+                return {
+                    url: url,
+                    type: 'link',
+                    text: urlText || url,
+                };
+            }
+            case 'link':
+            default:
+                return null;
+        }
+    })
+        .filter(function (i) { return i !== null; });
+}
 function getTagText(tag) {
     return tag
         .getText()
@@ -47,19 +75,20 @@ function getExportedTypeDeclarations(file, typeName) {
 function mapJsDocTagsToThemePropertyDoc(tags) {
     var doc = {
         tags: [],
-        desc: '',
+        desc: [],
     };
     tags.forEach(function (tag) {
         var tagName = tag.getName();
-        var tagText = getTagText(tag);
         if (tagName === 'desc' || tagName === 'description') {
-            doc.desc = tagText;
+            doc.desc = getTagDescription(tag);
         }
         else if (tagName === 'tags') {
-            doc.tags = tagText.split(',').map(function (tag) { return tag.trim(); });
+            var docTags = getTagText(tag);
+            doc.tags = docTags.split(',').map(function (tag) { return tag.trim(); });
         }
         else if (tagName === 'tag') {
-            doc.tags.push(tagText);
+            var docTag = getTagText(tag);
+            doc.tags.push(docTag);
         }
     });
     return doc;
@@ -71,13 +100,24 @@ function getTypeDocs(filePath, name) {
     });
     var file = project.addSourceFileAtPath(filePath);
     var declarations = getExportedTypeDeclarations(file, name);
-    return declarations.reduce(function (all, declaration) {
-        var properties = declaration.getType().getApparentProperties();
-        var docs = properties.reduce(function (all, prop) {
-            all[prop.getName()] = mapJsDocTagsToThemePropertyDoc(prop.getJsDocTags());
-            return all;
+    return declarations.reduce(function (prevDocs, declaration) {
+        var rawProperties = declaration.getType().getApparentProperties();
+        var parsedProperties = rawProperties
+            .reduce(function (acc, prop) {
+            acc.push([prop.getName(), mapJsDocTagsToThemePropertyDoc(prop.getJsDocTags())]);
+            return acc;
+        }, [])
+            .sort(function (_a, _b) {
+            var a = _a[0];
+            var b = _b[0];
+            return a.localeCompare(b);
+        });
+        var docs = parsedProperties.reduce(function (acc, _a) {
+            var key = _a[0], value = _a[1];
+            acc[key] = value;
+            return acc;
         }, {});
-        return __assign(__assign({}, all), docs);
+        return __assign(__assign({}, prevDocs), docs);
     }, {});
 }
 exports.getTypeDocs = getTypeDocs;

package/build/compilers/docs/compileDocsJSON.test.js

@@ -6,32 +6,65 @@ describe('compileDocsJSON', function () {
         var docs = (0, compileDocsJSON_1.getTypeDocs)('src/build/compilers/docs/__test__/testRecursiveReexport.ts', 'BaseTheme');
         expect(docs).toEqual({
             importedBaseProp: {
-                desc: 'Short desc tag',
+                desc: [
+                    {
+                        type: 'text',
+                        text: 'Short desc tag',
+                    },
+                ],
                 tags: ['tag1', 'tag2'],
             },
         });
     });
+    it('should correct compile documentation with jsdoc link', function () {
+        var docs = (0, compileDocsJSON_1.getTypeDocs)('src/build/compilers/docs/__test__/testLinks.ts', 'BaseTheme');
+        expect(docs).toEqual({
+            importedBaseProp: {
+                desc: [
+                    {
+                        type: 'text',
+                        text: 'Link with text ',
+                    },
+                    {
+                        type: 'link',
+                        url: 'https://google.com',
+                        text: 'Google',
+                    },
+                    {
+                        type: 'text',
+                        text: '.\nLink without text ',
+                    },
+                    {
+                        type: 'link',
+                        url: 'https://google.com',
+                        text: 'https://google.com',
+                    },
+                ],
+                tags: [],
+            },
+        });
+    });
     it('should correct compile documentation with imports', function () {
         var docs = (0, compileDocsJSON_1.getTypeDocs)('src/build/compilers/docs/__test__/testTheme.ts', 'ThemeTest');
         expect(docs).toEqual({
             prop: {
-                desc: '',
+                desc: [],
                 tags: ['empty description'],
             },
             propWithoutDoc: {
-                desc: '',
+                desc: [],
                 tags: [],
             },
             localBaseProp: {
-                desc: 'Empty tags',
+                desc: [{ type: 'text', text: 'Empty tags' }],
                 tags: [],
             },
             importedBaseProp: {
-                desc: 'Short desc tag',
+                desc: [{ type: 'text', text: 'Short desc tag' }],
                 tags: ['tag1', 'tag2'],
             },
             derivedProp: {
-                desc: 'Long description tag',
+                desc: [{ type: 'text', text: 'Long description tag' }],
                 tags: ['tagListItem1', 'tagListItem2', 'tagListItem3'],
             },
         });

package/build/compilers/styles/helpers/tokenProcessors.d.ts

@@ -6,7 +6,7 @@ export declare const EStyleTypes: {
     readonly LESS: "less";
     readonly STYL: "styl";
 };
-export type Formats = typeof EStyleTypes[keyof typeof EStyleTypes];
+export type Formats = (typeof EStyleTypes)[keyof typeof EStyleTypes];
 export declare const varDeclarations: {
     readonly css: (prop: any, prefix?: string) => string;
     readonly pcss: (prop: any, prefix?: string) => string;

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

@@ -12,6 +12,8 @@ export interface ThemeCalendarOverValues {
     calendarSizeBorderRadiusSmall: number;
     calendarSizeBorderRadiusMedium: number;
     calendarSizeBorderRadiusLarge: number;
+    calendarImageOverlayBackground: string;
+    calendarElevationEventForm: string;
 }
 export interface LocalCalendarColorDescriptionStruct {
     calendarColorBackgroundPositiveTintAlpha4: ColorDescription;
@@ -34,6 +36,11 @@ export interface LocalCalendarColorDescriptionStruct {
     calendarColorSidebarComposeButtonIcon: ColorDescription;
     calendarColorSidebarComposeButtonText: ColorDescription;
     calendarColorSidebarScrollbar: ColorDescription;
+    calendarColorHeaderBackground: ColorDescription;
+    calendarColorHeaderSecondaryAlpha: ColorDescription;
+    calendarColorHeaderonSecondary: ColorDescription;
+    calendarColorHeaderonWidgetAlpha: ColorDescription;
+    calendarColorHeaderWidgetBackgroundAlpha: ColorDescription;
     calendarColorHeaderIcon: ColorDescription;
     calendarColorHeaderTextSecondary: ColorDescription;
     calendarColorHeaderButtonText: ColorDescription;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vkontakte/vkui-tokens",
-  "version": "4.29.3",
+  "version": "4.30.0",
   "description": "Репозиторий, который содержит в себе дизайн-токены и другие инструменты объединенной дизайн-системы VKUI и Paradigm",
   "license": "MIT",
   "main": "utils/descriptions.js",
@@ -43,7 +43,7 @@
     "@types/react-dom": "18.0.10",
     "@typescript-eslint/eslint-plugin": "4.33.0",
     "@typescript-eslint/parser": "4.33.0",
-    "@vkontakte/appearance": "https://github.com/VKCOM/Appearance#v9.51.4",
+    "@vkontakte/appearance": "https://github.com/VKCOM/Appearance#v10.1.0",
     "@vkontakte/icons": "2.14.0",
     "@vkontakte/prettier-config": "0.1.0",
     "@vkontakte/vk-bridge": "2.7.2",
@@ -59,10 +59,10 @@
     "css-loader": "6.7.3",
     "css.escape": "1.5.1",
     "eslint": "7.32.0",
-    "eslint-config-prettier": "8.5.0",
+    "eslint-config-prettier": "8.7.0",
     "eslint-config-silence": "1.0.0",
     "eslint-import-resolver-alias": "1.1.2",
-    "eslint-plugin-compat": "4.0.2",
+    "eslint-plugin-compat": "4.1.2",
     "eslint-plugin-import": "2.27.5",
     "eslint-plugin-jasmine": "4.1.3",
     "eslint-plugin-prettier": "4.2.1",
@@ -73,7 +73,7 @@
     "jest": "29.4.1",
     "jest-junit": "15.0.0",
     "lodash": "4.17.21",
-    "prettier": "2.8.0",
+    "prettier": "2.8.4",
     "react": "18.2.0",
     "react-dom": "18.2.0",
     "rimraf": "4.4.0",
@@ -87,13 +87,13 @@
     "tscpaths": "0.0.9",
     "type-fest": "3.6.1",
     "typescript": "4.9.5",
-    "webpack": "5.75.0",
+    "webpack": "5.76.1",
     "webpack-cli": "5.0.1",
     "webpack-dev-server": "4.11.1",
     "webpack-notifier": "1.15.0"
   },
   "engines": {
-    "npm": "^8.5.5",
+    "npm": "^9.3.1",
     "yarn": "^1.21.1"
   }
 }

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

@@ -347,9 +347,11 @@
 	--vkui--type_border_position: inset;
 	--vkui--theme_name_base: 'calendar';
 	--vkui--calendar_elevation_header: 0 0 16px 0 rgba(2, 13, 41, 0.12);
+	--vkui--calendar_elevation_event_form: 0px 4px 64px 0px rgba(0, 16, 61, 0.2);
 	--vkui--calendar_size_border_radius_small: 4px;
 	--vkui--calendar_size_border_radius_medium: 6px;
 	--vkui--calendar_size_border_radius_large: 8px;
+	--vkui--calendar_image_overlay_background: none;
 	--vkui--calendar_font_text_event--font_size--regular: 17px;
 	--vkui--calendar_font_text_event--line_height--regular: 24px;
 	--vkui--calendar_font_text_event--font_weight--regular: 400;
@@ -732,12 +734,12 @@
 	--vkui--calendar_color_overlay_background: transparent;
 	--vkui--calendar_color_overlay_background--hover: rgba(0, 16, 61, 0.04);
 	--vkui--calendar_color_overlay_background--active: rgba(0, 16, 61, 0.08);
-	--vkui--calendar_color_sidebar_item_icon_primary: #333333;
-	--vkui--calendar_color_sidebar_item_icon_primary--hover: #313233;
-	--vkui--calendar_color_sidebar_item_icon_primary--active: #2F3034;
-	--vkui--calendar_color_sidebar_item_text_primary: #333333;
-	--vkui--calendar_color_sidebar_item_text_primary--hover: #313233;
-	--vkui--calendar_color_sidebar_item_text_primary--active: #2F3034;
+	--vkui--calendar_color_sidebar_item_icon_primary: #2C2D2E;
+	--vkui--calendar_color_sidebar_item_icon_primary--hover: #2A2C2F;
+	--vkui--calendar_color_sidebar_item_icon_primary--active: #282B2F;
+	--vkui--calendar_color_sidebar_item_text_primary: #2C2D2E;
+	--vkui--calendar_color_sidebar_item_text_primary--hover: #2A2C2F;
+	--vkui--calendar_color_sidebar_item_text_primary--active: #282B2F;
 	--vkui--calendar_color_sidebar_item_icon_secondary: #87898F;
 	--vkui--calendar_color_sidebar_item_icon_secondary--hover: #82848C;
 	--vkui--calendar_color_sidebar_item_icon_secondary--active: #7C7F88;
@@ -756,6 +758,21 @@
 	--vkui--calendar_color_sidebar_scrollbar: #C7C7C7;
 	--vkui--calendar_color_sidebar_scrollbar--hover: #BFC0C1;
 	--vkui--calendar_color_sidebar_scrollbar--active: #B7B8BC;
+	--vkui--calendar_color_header_background: #FFFFFF;
+	--vkui--calendar_color_header_background--hover: #F5F5F7;
+	--vkui--calendar_color_header_background--active: #EBECEF;
+	--vkui--calendar_color_header_secondary_alpha: rgba(0, 95, 249, 0.1);
+	--vkui--calendar_color_header_secondary_alpha--hover: rgba(0, 95, 249, 0.14);
+	--vkui--calendar_color_header_secondary_alpha--active: rgba(0, 95, 249, 0.18);
+	--vkui--calendar_color_headeron_secondary: #005FF9;
+	--vkui--calendar_color_headeron_secondary--hover: #005CF1;
+	--vkui--calendar_color_headeron_secondary--active: #0059EA;
+	--vkui--calendar_color_headeron_widget_alpha: rgba(0, 95, 249, 1);
+	--vkui--calendar_color_headeron_widget_alpha--hover: #005CF1;
+	--vkui--calendar_color_headeron_widget_alpha--active: #0059EA;
+	--vkui--calendar_color_header_widget_background_alpha: rgba(255, 255, 255, 1);
+	--vkui--calendar_color_header_widget_background_alpha--hover: #F5F5F7;
+	--vkui--calendar_color_header_widget_background_alpha--active: #EBECEF;
 	--vkui--calendar_color_header_icon: #2C2D2E;
 	--vkui--calendar_color_header_icon--hover: #2A2C2F;
 	--vkui--calendar_color_header_icon--active: #282B2F;
@@ -771,9 +788,9 @@
 	--vkui--calendar_color_header_search_icon: #B6B8BE;
 	--vkui--calendar_color_header_search_icon--hover: #AFB1B9;
 	--vkui--calendar_color_header_search_icon--active: #A7ABB4;
-	--vkui--calendar_color_header_search_text_collapsed: #87898F;
-	--vkui--calendar_color_header_search_text_collapsed--hover: #82848C;
-	--vkui--calendar_color_header_search_text_collapsed--active: #7C7F88;
+	--vkui--calendar_color_header_search_text_collapsed: #2C2D2E;
+	--vkui--calendar_color_header_search_text_collapsed--hover: #2A2C2F;
+	--vkui--calendar_color_header_search_text_collapsed--active: #282B2F;
 	--vkui--calendar_color_header_search_background: #F0F1F3;
 	--vkui--calendar_color_header_search_background--hover: #E6E8EC;
 	--vkui--calendar_color_header_search_background--active: #DDDFE4;

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

@@ -347,9 +347,11 @@
 	--vkui--type_border_position: inset;
 	--vkui--theme_name_base: 'calendar';
 	--vkui--calendar_elevation_header: 0 0 16px 0 rgba(2, 13, 41, 0.12);
+	--vkui--calendar_elevation_event_form: 0px 4px 64px 0px rgba(0, 16, 61, 0.2);
 	--vkui--calendar_size_border_radius_small: 4px;
 	--vkui--calendar_size_border_radius_medium: 6px;
 	--vkui--calendar_size_border_radius_large: 8px;
+	--vkui--calendar_image_overlay_background: none;
 	--vkui--calendar_font_text_event--font_size--regular: 17px;
 	--vkui--calendar_font_text_event--line_height--regular: 24px;
 	--vkui--calendar_font_text_event--font_weight--regular: 400;

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

@@ -27,6 +27,8 @@
 	--vkui--type_border_position: inset;
 	--vkui--theme_name_base: 'calendar';
 	--vkui--calendar_elevation_header: 0 0 16px 0 rgba(2, 13, 41, 0.12);
+	--vkui--calendar_elevation_event_form: 0px 4px 64px 0px rgba(0, 16, 61, 0.2);
+	--vkui--calendar_image_overlay_background: none;
 	--vkui--colors_scheme: light;
 	--vkui--color_background_accent: #005FF9;
 	--vkui--color_background_accent--hover: #005CF1;
@@ -385,12 +387,12 @@
 	--vkui--calendar_color_overlay_background: transparent;
 	--vkui--calendar_color_overlay_background--hover: rgba(0, 16, 61, 0.04);
 	--vkui--calendar_color_overlay_background--active: rgba(0, 16, 61, 0.08);
-	--vkui--calendar_color_sidebar_item_icon_primary: #333333;
-	--vkui--calendar_color_sidebar_item_icon_primary--hover: #313233;
-	--vkui--calendar_color_sidebar_item_icon_primary--active: #2F3034;
-	--vkui--calendar_color_sidebar_item_text_primary: #333333;
-	--vkui--calendar_color_sidebar_item_text_primary--hover: #313233;
-	--vkui--calendar_color_sidebar_item_text_primary--active: #2F3034;
+	--vkui--calendar_color_sidebar_item_icon_primary: #2C2D2E;
+	--vkui--calendar_color_sidebar_item_icon_primary--hover: #2A2C2F;
+	--vkui--calendar_color_sidebar_item_icon_primary--active: #282B2F;
+	--vkui--calendar_color_sidebar_item_text_primary: #2C2D2E;
+	--vkui--calendar_color_sidebar_item_text_primary--hover: #2A2C2F;
+	--vkui--calendar_color_sidebar_item_text_primary--active: #282B2F;
 	--vkui--calendar_color_sidebar_item_icon_secondary: #87898F;
 	--vkui--calendar_color_sidebar_item_icon_secondary--hover: #82848C;
 	--vkui--calendar_color_sidebar_item_icon_secondary--active: #7C7F88;
@@ -409,6 +411,21 @@
 	--vkui--calendar_color_sidebar_scrollbar: #C7C7C7;
 	--vkui--calendar_color_sidebar_scrollbar--hover: #BFC0C1;
 	--vkui--calendar_color_sidebar_scrollbar--active: #B7B8BC;
+	--vkui--calendar_color_header_background: #FFFFFF;
+	--vkui--calendar_color_header_background--hover: #F5F5F7;
+	--vkui--calendar_color_header_background--active: #EBECEF;
+	--vkui--calendar_color_header_secondary_alpha: rgba(0, 95, 249, 0.1);
+	--vkui--calendar_color_header_secondary_alpha--hover: rgba(0, 95, 249, 0.14);
+	--vkui--calendar_color_header_secondary_alpha--active: rgba(0, 95, 249, 0.18);
+	--vkui--calendar_color_headeron_secondary: #005FF9;
+	--vkui--calendar_color_headeron_secondary--hover: #005CF1;
+	--vkui--calendar_color_headeron_secondary--active: #0059EA;
+	--vkui--calendar_color_headeron_widget_alpha: rgba(0, 95, 249, 1);
+	--vkui--calendar_color_headeron_widget_alpha--hover: #005CF1;
+	--vkui--calendar_color_headeron_widget_alpha--active: #0059EA;
+	--vkui--calendar_color_header_widget_background_alpha: rgba(255, 255, 255, 1);
+	--vkui--calendar_color_header_widget_background_alpha--hover: #F5F5F7;
+	--vkui--calendar_color_header_widget_background_alpha--active: #EBECEF;
 	--vkui--calendar_color_header_icon: #2C2D2E;
 	--vkui--calendar_color_header_icon--hover: #2A2C2F;
 	--vkui--calendar_color_header_icon--active: #282B2F;
@@ -424,9 +441,9 @@
 	--vkui--calendar_color_header_search_icon: #B6B8BE;
 	--vkui--calendar_color_header_search_icon--hover: #AFB1B9;
 	--vkui--calendar_color_header_search_icon--active: #A7ABB4;
-	--vkui--calendar_color_header_search_text_collapsed: #87898F;
-	--vkui--calendar_color_header_search_text_collapsed--hover: #82848C;
-	--vkui--calendar_color_header_search_text_collapsed--active: #7C7F88;
+	--vkui--calendar_color_header_search_text_collapsed: #2C2D2E;
+	--vkui--calendar_color_header_search_text_collapsed--hover: #2A2C2F;
+	--vkui--calendar_color_header_search_text_collapsed--active: #282B2F;
 	--vkui--calendar_color_header_search_background: #F0F1F3;
 	--vkui--calendar_color_header_search_background--hover: #E6E8EC;
 	--vkui--calendar_color_header_search_background--active: #DDDFE4;

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

@@ -356,12 +356,12 @@
 	--vkui--calendar_color_overlay_background: transparent;
 	--vkui--calendar_color_overlay_background--hover: rgba(0, 16, 61, 0.04);
 	--vkui--calendar_color_overlay_background--active: rgba(0, 16, 61, 0.08);
-	--vkui--calendar_color_sidebar_item_icon_primary: #333333;
-	--vkui--calendar_color_sidebar_item_icon_primary--hover: #313233;
-	--vkui--calendar_color_sidebar_item_icon_primary--active: #2F3034;
-	--vkui--calendar_color_sidebar_item_text_primary: #333333;
-	--vkui--calendar_color_sidebar_item_text_primary--hover: #313233;
-	--vkui--calendar_color_sidebar_item_text_primary--active: #2F3034;
+	--vkui--calendar_color_sidebar_item_icon_primary: #2C2D2E;
+	--vkui--calendar_color_sidebar_item_icon_primary--hover: #2A2C2F;
+	--vkui--calendar_color_sidebar_item_icon_primary--active: #282B2F;
+	--vkui--calendar_color_sidebar_item_text_primary: #2C2D2E;
+	--vkui--calendar_color_sidebar_item_text_primary--hover: #2A2C2F;
+	--vkui--calendar_color_sidebar_item_text_primary--active: #282B2F;
 	--vkui--calendar_color_sidebar_item_icon_secondary: #87898F;
 	--vkui--calendar_color_sidebar_item_icon_secondary--hover: #82848C;
 	--vkui--calendar_color_sidebar_item_icon_secondary--active: #7C7F88;
@@ -380,6 +380,21 @@
 	--vkui--calendar_color_sidebar_scrollbar: #C7C7C7;
 	--vkui--calendar_color_sidebar_scrollbar--hover: #BFC0C1;
 	--vkui--calendar_color_sidebar_scrollbar--active: #B7B8BC;
+	--vkui--calendar_color_header_background: #FFFFFF;
+	--vkui--calendar_color_header_background--hover: #F5F5F7;
+	--vkui--calendar_color_header_background--active: #EBECEF;
+	--vkui--calendar_color_header_secondary_alpha: rgba(0, 95, 249, 0.1);
+	--vkui--calendar_color_header_secondary_alpha--hover: rgba(0, 95, 249, 0.14);
+	--vkui--calendar_color_header_secondary_alpha--active: rgba(0, 95, 249, 0.18);
+	--vkui--calendar_color_headeron_secondary: #005FF9;
+	--vkui--calendar_color_headeron_secondary--hover: #005CF1;
+	--vkui--calendar_color_headeron_secondary--active: #0059EA;
+	--vkui--calendar_color_headeron_widget_alpha: rgba(0, 95, 249, 1);
+	--vkui--calendar_color_headeron_widget_alpha--hover: #005CF1;
+	--vkui--calendar_color_headeron_widget_alpha--active: #0059EA;
+	--vkui--calendar_color_header_widget_background_alpha: rgba(255, 255, 255, 1);
+	--vkui--calendar_color_header_widget_background_alpha--hover: #F5F5F7;
+	--vkui--calendar_color_header_widget_background_alpha--active: #EBECEF;
 	--vkui--calendar_color_header_icon: #2C2D2E;
 	--vkui--calendar_color_header_icon--hover: #2A2C2F;
 	--vkui--calendar_color_header_icon--active: #282B2F;
@@ -395,9 +410,9 @@
 	--vkui--calendar_color_header_search_icon: #B6B8BE;
 	--vkui--calendar_color_header_search_icon--hover: #AFB1B9;
 	--vkui--calendar_color_header_search_icon--active: #A7ABB4;
-	--vkui--calendar_color_header_search_text_collapsed: #87898F;
-	--vkui--calendar_color_header_search_text_collapsed--hover: #82848C;
-	--vkui--calendar_color_header_search_text_collapsed--active: #7C7F88;
+	--vkui--calendar_color_header_search_text_collapsed: #2C2D2E;
+	--vkui--calendar_color_header_search_text_collapsed--hover: #2A2C2F;
+	--vkui--calendar_color_header_search_text_collapsed--active: #282B2F;
 	--vkui--calendar_color_header_search_background: #F0F1F3;
 	--vkui--calendar_color_header_search_background--hover: #E6E8EC;
 	--vkui--calendar_color_header_search_background--active: #DDDFE4;