@vkontakte/vkui-tokens 4.24.1 → 4.25.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/compilers/cssVars/declarations/compileBreakpointsCssVarsDeclaration.d.ts +1 -1
- package/build/compilers/cssVars/helpers/accumulateValues.d.ts +2 -2
- package/build/compilers/cssVars/helpers/findViewportByAdaptivityState.d.ts +1 -1
- package/build/compilers/cssVars/jsUtils/compileGetDeclarationString.d.ts +1 -1
- package/build/compilers/docs/compileDocsJSON.d.ts +1 -1
- package/build/compilers/index.d.ts +1 -1
- package/build/compilers/structJSON/compileStructJSON.d.ts +1 -1
- package/build/compilers/styles/compileStyles.d.ts +1 -1
- package/build/compilers/styles/helpers/tokenProcessors.d.ts +1 -1
- package/build/helpers/getStateFunctions.d.ts +1 -1
- package/build/helpers/replacePropDeep.d.ts +1 -1
- package/interfaces/general/colors/index.d.ts +4 -4
- package/interfaces/general/elevation/index.d.ts +17 -0
- package/interfaces/general/geometry/index.d.ts +280 -1
- package/interfaces/general/gradients/index.d.ts +9 -1
- package/interfaces/general/index.d.ts +22 -11
- package/interfaces/general/toneValues/index.d.ts +4 -0
- package/interfaces/general/tools/cssVars.d.ts +2 -2
- package/interfaces/general/tools/customMedia.d.ts +2 -2
- package/interfaces/general/tools/index.d.ts +2 -2
- package/interfaces/general/tools/tokenValue.d.ts +4 -4
- package/interfaces/general/tools/utils.d.ts +5 -5
- package/interfaces/general/tools/viewports.d.ts +5 -5
- package/interfaces/general/typography/index.d.ts +2 -2
- package/interfaces/namespaces/paradigm/index.d.ts +367 -7
- package/interfaces/themes/calendar/index.d.ts +1 -1
- package/interfaces/themes/cloudDark/index.d.ts +3 -3
- package/interfaces/themes/home/index.d.ts +2 -2
- package/interfaces/themes/homeDark/index.d.ts +3 -3
- package/interfaces/themes/media/index.d.ts +3 -3
- package/interfaces/themes/mediaDark/index.d.ts +3 -3
- package/interfaces/themes/octavius/index.d.ts +2 -2
- package/interfaces/themes/octaviusDark/index.d.ts +3 -3
- package/interfaces/themes/octaviusVK/index.d.ts +3 -3
- package/interfaces/themes/octaviusVKDark/index.d.ts +3 -3
- package/interfaces/themes/octaviusWhite/index.d.ts +3 -3
- package/interfaces/themes/otvet/index.d.ts +1 -1
- package/interfaces/themes/otvetDark/index.d.ts +3 -3
- package/interfaces/themes/promo/index.d.ts +2 -2
- package/interfaces/themes/pulse/index.d.ts +69 -0
- package/interfaces/themes/pulse/index.js +2 -0
- package/interfaces/themes/pulseDark/index.d.ts +7 -0
- package/interfaces/themes/pulseDark/index.js +2 -0
- package/interfaces/themes/search/index.d.ts +5 -5
- package/package.json +14 -14
- package/themes/calendar/docs.json +713 -297
- package/themes/calendarDark/docs.json +713 -297
- package/themes/calls/docs.json +713 -297
- package/themes/cloud/docs.json +713 -297
- package/themes/cloudDark/docs.json +713 -297
- package/themes/home/docs.json +713 -297
- package/themes/homeDark/docs.json +713 -297
- package/themes/media/docs.json +713 -297
- package/themes/mediaDark/docs.json +713 -297
- package/themes/mycom/docs.json +714 -298
- package/themes/octavius/docs.json +713 -297
- package/themes/octaviusCompact/docs.json +713 -297
- package/themes/octaviusCompactDark/docs.json +713 -297
- package/themes/octaviusDark/docs.json +713 -297
- package/themes/octaviusVK/docs.json +713 -297
- package/themes/octaviusVKDark/cssVars/declarations/index.css +6 -6
- package/themes/octaviusVKDark/cssVars/declarations/noSizes.css +6 -6
- package/themes/octaviusVKDark/cssVars/declarations/onlyColors.css +6 -6
- package/themes/octaviusVKDark/cssVars/declarations/onlyColors.js +2 -2
- package/themes/octaviusVKDark/cssVars/declarations/onlyVariables.css +6 -6
- package/themes/octaviusVKDark/cssVars/declarations/onlyVariables.js +2 -2
- package/themes/octaviusVKDark/cssVars/declarations/onlyVariablesLocal.css +6 -6
- package/themes/octaviusVKDark/cssVars/declarations/onlyVariablesLocalIncremental.css +6 -6
- package/themes/octaviusVKDark/cssVars/theme/fallbacks/index.css +6 -6
- package/themes/octaviusVKDark/cssVars/theme/fallbacks/index.less +6 -6
- package/themes/octaviusVKDark/cssVars/theme/fallbacks/index.pcss +6 -6
- package/themes/octaviusVKDark/cssVars/theme/fallbacks/index.scss +6 -6
- package/themes/octaviusVKDark/cssVars/theme/fallbacks/index.styl +6 -6
- package/themes/octaviusVKDark/cssVars/theme/index.js +6 -6
- package/themes/octaviusVKDark/cssVars/theme/index.json +6 -6
- package/themes/octaviusVKDark/docs.json +713 -297
- package/themes/octaviusVKDark/index.css +6 -6
- package/themes/octaviusVKDark/index.js +6 -6
- package/themes/octaviusVKDark/index.json +6 -6
- package/themes/octaviusVKDark/index.less +6 -6
- package/themes/octaviusVKDark/index.pcss +6 -6
- package/themes/octaviusVKDark/index.scss +6 -6
- package/themes/octaviusVKDark/index.styl +6 -6
- package/themes/octaviusVKDark/struct.json +6 -6
- package/themes/octaviusWhite/docs.json +713 -297
- package/themes/otvet/docs.json +713 -297
- package/themes/otvetDark/docs.json +713 -297
- package/themes/paradigmBase/docs.json +713 -297
- package/themes/paradigmBaseDark/docs.json +713 -297
- package/themes/pharma/docs.json +713 -297
- package/themes/promo/docs.json +713 -297
- package/themes/pulse/cssVars/declarations/index.css +902 -0
- package/themes/pulse/cssVars/declarations/noColors.css +493 -0
- package/themes/pulse/cssVars/declarations/noSizes.css +285 -0
- package/themes/pulse/cssVars/declarations/onlyAdaptiveGroups.css +143 -0
- package/themes/pulse/cssVars/declarations/onlyColors.css +266 -0
- package/themes/pulse/cssVars/declarations/onlyColors.d.ts +3 -0
- package/themes/pulse/cssVars/declarations/onlyColors.js +11 -0
- package/themes/pulse/cssVars/declarations/onlyVariables.css +439 -0
- package/themes/pulse/cssVars/declarations/onlyVariables.d.ts +3 -0
- package/themes/pulse/cssVars/declarations/onlyVariables.js +11 -0
- package/themes/pulse/cssVars/declarations/onlyVariablesLocal.css +439 -0
- package/themes/pulse/cssVars/declarations/onlyVariablesLocalIncremental.css +439 -0
- package/themes/pulse/cssVars/theme/fallbacks/index.css +758 -0
- package/themes/pulse/cssVars/theme/fallbacks/index.less +509 -0
- package/themes/pulse/cssVars/theme/fallbacks/index.pcss +510 -0
- package/themes/pulse/cssVars/theme/fallbacks/index.scss +742 -0
- package/themes/pulse/cssVars/theme/fallbacks/index.styl +509 -0
- package/themes/pulse/cssVars/theme/index.d.ts +4 -0
- package/themes/pulse/cssVars/theme/index.js +2650 -0
- package/themes/pulse/cssVars/theme/index.json +2647 -0
- package/themes/pulse/docs.json +1055 -0
- package/themes/pulse/index.css +758 -0
- package/themes/pulse/index.d.ts +4 -0
- package/themes/pulse/index.js +780 -0
- package/themes/pulse/index.json +777 -0
- package/themes/pulse/index.less +509 -0
- package/themes/pulse/index.pcss +510 -0
- package/themes/pulse/index.scss +742 -0
- package/themes/pulse/index.styl +509 -0
- package/themes/pulse/struct.json +801 -0
- package/themes/pulseDark/cssVars/declarations/index.css +902 -0
- package/themes/pulseDark/cssVars/declarations/noColors.css +493 -0
- package/themes/pulseDark/cssVars/declarations/noSizes.css +285 -0
- package/themes/pulseDark/cssVars/declarations/onlyAdaptiveGroups.css +143 -0
- package/themes/pulseDark/cssVars/declarations/onlyColors.css +266 -0
- package/themes/pulseDark/cssVars/declarations/onlyColors.d.ts +3 -0
- package/themes/pulseDark/cssVars/declarations/onlyColors.js +11 -0
- package/themes/pulseDark/cssVars/declarations/onlyVariables.css +439 -0
- package/themes/pulseDark/cssVars/declarations/onlyVariables.d.ts +3 -0
- package/themes/pulseDark/cssVars/declarations/onlyVariables.js +11 -0
- package/themes/pulseDark/cssVars/declarations/onlyVariablesLocal.css +439 -0
- package/themes/pulseDark/cssVars/declarations/onlyVariablesLocalIncremental.css +439 -0
- package/themes/pulseDark/cssVars/theme/fallbacks/index.css +758 -0
- package/themes/pulseDark/cssVars/theme/fallbacks/index.less +509 -0
- package/themes/pulseDark/cssVars/theme/fallbacks/index.pcss +510 -0
- package/themes/pulseDark/cssVars/theme/fallbacks/index.scss +742 -0
- package/themes/pulseDark/cssVars/theme/fallbacks/index.styl +509 -0
- package/themes/pulseDark/cssVars/theme/index.d.ts +4 -0
- package/themes/pulseDark/cssVars/theme/index.js +2650 -0
- package/themes/pulseDark/cssVars/theme/index.json +2647 -0
- package/themes/pulseDark/docs.json +1055 -0
- package/themes/pulseDark/index.css +758 -0
- package/themes/pulseDark/index.d.ts +4 -0
- package/themes/pulseDark/index.js +780 -0
- package/themes/pulseDark/index.json +777 -0
- package/themes/pulseDark/index.less +509 -0
- package/themes/pulseDark/index.pcss +510 -0
- package/themes/pulseDark/index.scss +742 -0
- package/themes/pulseDark/index.styl +509 -0
- package/themes/pulseDark/struct.json +801 -0
- package/themes/search/docs.json +713 -297
- package/themes/todo/docs.json +713 -297
- package/themes/vkBase/docs.json +359 -153
- package/themes/vkBaseDark/docs.json +359 -153
- package/themes/vkCom/docs.json +359 -153
- package/themes/vkComDark/docs.json +359 -153
- package/themes/vkIOS/docs.json +359 -153
- package/themes/vkIOSDark/docs.json +359 -153
- package/utils/common/colors/projectColors.d.ts +1 -1
- package/utils/common/colors/socialColors.d.ts +1 -1
- package/utils/descriptions.d.ts +2 -2
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { Theme, ThemeCssVarsWide } from '../../../../interfaces/general';
|
|
2
|
-
export
|
|
2
|
+
export type DeclarationType = 'default' | 'onlyRoot' | 'modern' | 'onlyColors';
|
|
3
3
|
/**
|
|
4
4
|
* Компилирует медиаквери переходы между переменными
|
|
5
5
|
* @param sourceTheme
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { Theme } from '../../../../interfaces/general';
|
|
2
2
|
import { Adaptive } from '../../../../interfaces/general/tools';
|
|
3
|
-
export
|
|
3
|
+
export type FlatValuesObject = {
|
|
4
4
|
[key: string]: string | number;
|
|
5
5
|
};
|
|
6
|
-
export
|
|
6
|
+
export type AdaptiveValuesObject = {
|
|
7
7
|
auto: FlatValuesObject;
|
|
8
8
|
regular: FlatValuesObject;
|
|
9
9
|
} & {
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import { Adaptive, Breakpoints } from '../../../../interfaces/general/tools';
|
|
2
2
|
import { DefaultViewports, Viewports, ViewportsTuple } from '../../../../interfaces/general/tools/viewports';
|
|
3
|
-
export declare function findViewportByAdaptivityState<Vt extends ViewportsTuple = DefaultViewports>(breakpoints: Breakpoints<Vt>['breakpoints']
|
|
3
|
+
export declare function findViewportByAdaptivityState<Vt extends ViewportsTuple = DefaultViewports>(breakpoints: Partial<Breakpoints<Vt>['breakpoints']>, adaptivityState: keyof Adaptive<any>): Viewports;
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import { Theme, ThemeCssVarsWide } from '../../../../interfaces/general';
|
|
2
|
-
export
|
|
2
|
+
export type DeclarationType = 'default' | 'onlyColors';
|
|
3
3
|
export declare function compileGetDeclarationString<T = Theme>(sourceTheme: ThemeCssVarsWide<T>, type?: DeclarationType): string;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { PixelifyTheme, SpecialTokens, Theme, ThemeCssVarsWide } from '../../interfaces/general';
|
|
2
|
-
|
|
2
|
+
type ThemeBuildType = 'root' | 'subtheme' | 'flat' | 'cssVars' | 'cssVarsPseudoRoot';
|
|
3
3
|
declare function writeStructJsonFile<T = Theme>(themePath: string, theme: T, _?: ThemeBuildType): void;
|
|
4
4
|
declare function writeJsonFile<T = Theme>(themePath: string, theme: T, _?: ThemeBuildType): void;
|
|
5
5
|
declare function writeTsFile<T extends SpecialTokens = Theme>(themePath: string, theme: T, type: ThemeBuildType, themeName?: string): void;
|
|
@@ -2,7 +2,7 @@ import 'css.escape';
|
|
|
2
2
|
import { PixelifyTheme } from '../../../interfaces/general';
|
|
3
3
|
import { Formats } from './helpers/tokenProcessors';
|
|
4
4
|
export declare const serviceKeys: string[];
|
|
5
|
-
export
|
|
5
|
+
export type CompileStylesMode = 'default' | 'onlyVariables' | 'onlyVariablesLocal' | 'onlyVariablesLocalIncremental' | 'onlyColors' | 'withAdaptiveGroups' | 'onlyAdaptiveGroups' | 'noSizes' | 'noColors';
|
|
6
6
|
export declare function getPrefix<PT extends PixelifyTheme>(format: Formats, theme: PT): string;
|
|
7
7
|
export declare function getRootSelector<PT extends PixelifyTheme>(theme: PT, mode: CompileStylesMode): string;
|
|
8
8
|
/**
|
|
@@ -6,7 +6,7 @@ export declare const EStyleTypes: {
|
|
|
6
6
|
readonly LESS: "less";
|
|
7
7
|
readonly STYL: "styl";
|
|
8
8
|
};
|
|
9
|
-
export
|
|
9
|
+
export type Formats = typeof EStyleTypes[keyof typeof EStyleTypes];
|
|
10
10
|
export declare const varDeclarations: {
|
|
11
11
|
readonly css: (prop: any, prefix?: string) => string;
|
|
12
12
|
readonly pcss: (prop: any, prefix?: string) => string;
|
|
@@ -8,11 +8,11 @@ export interface ColorWithStates {
|
|
|
8
8
|
hover: Property.Color;
|
|
9
9
|
active: Property.Color;
|
|
10
10
|
}
|
|
11
|
-
export
|
|
12
|
-
export
|
|
11
|
+
export type ColorDescriptionStatic = Property.Color | ColorWithStates;
|
|
12
|
+
export type ColorDescriptionCallable<T extends {
|
|
13
13
|
[key in keyof T]: ColorDescription;
|
|
14
14
|
} = ColorsDescriptionStruct> = (theme: Partial<ColorsScheme & ColorsDescription<T>>) => ColorDescription;
|
|
15
|
-
export
|
|
15
|
+
export type ColorDescription<T extends {
|
|
16
16
|
[key in keyof T]: ColorDescription;
|
|
17
17
|
} = ColorsDescriptionStruct> = ColorDescriptionStatic | ColorDescriptionCallable<T>;
|
|
18
18
|
/**
|
|
@@ -472,6 +472,6 @@ export interface ColorsDescriptionStruct {
|
|
|
472
472
|
*/
|
|
473
473
|
colorSegmentedControl: ColorDescription;
|
|
474
474
|
}
|
|
475
|
-
export
|
|
475
|
+
export type Colors = {
|
|
476
476
|
[key in keyof ColorsDescriptionStruct]: ColorWithStates;
|
|
477
477
|
};
|
|
@@ -5,8 +5,25 @@ export interface Elevation {
|
|
|
5
5
|
* @tags elevation
|
|
6
6
|
*/
|
|
7
7
|
elevation4: Property.BoxShadow;
|
|
8
|
+
/**
|
|
9
|
+
* @desc Параметры тени уровень 3
|
|
10
|
+
* @tags elevation
|
|
11
|
+
*/
|
|
8
12
|
elevation3: Property.BoxShadow;
|
|
13
|
+
/**
|
|
14
|
+
* @desc Параметры тени уровень 2
|
|
15
|
+
* @tags elevation
|
|
16
|
+
*/
|
|
9
17
|
elevation2: Property.BoxShadow;
|
|
18
|
+
/**
|
|
19
|
+
* @desc Параметры тени уровень 1. Самая маленькая
|
|
20
|
+
* @tags elevation
|
|
21
|
+
*/
|
|
10
22
|
elevation1: Property.BoxShadow;
|
|
23
|
+
/**
|
|
24
|
+
* @desc Параметры тени уровень 1. Самая маленькая. Инвертированная.
|
|
25
|
+
* Для элементов появляющихся в нижней части окна
|
|
26
|
+
* @tags elevation
|
|
27
|
+
*/
|
|
11
28
|
elevation1InvertY: Property.BoxShadow;
|
|
12
29
|
}
|
|
@@ -1,70 +1,349 @@
|
|
|
1
1
|
export interface Sizes {
|
|
2
|
+
/**
|
|
3
|
+
* @desc Legacy
|
|
4
|
+
* @tags size, legacy
|
|
5
|
+
* @deprecated
|
|
6
|
+
*/
|
|
2
7
|
sizeSelectIconPadding: number;
|
|
8
|
+
/**
|
|
9
|
+
* @desc Legacy
|
|
10
|
+
* @tags size, legacy
|
|
11
|
+
* @deprecated
|
|
12
|
+
*/
|
|
3
13
|
sizePopupBasePadding: number;
|
|
14
|
+
/**
|
|
15
|
+
* @desc Legacy
|
|
16
|
+
* @tags size, legacy
|
|
17
|
+
* @deprecated
|
|
18
|
+
*/
|
|
4
19
|
sizePopupHeaderPadding: number;
|
|
20
|
+
/**
|
|
21
|
+
* @desc Legacy
|
|
22
|
+
* @tags size, legacy
|
|
23
|
+
* @deprecated
|
|
24
|
+
*/
|
|
5
25
|
sizeFieldHorizontalPadding: number;
|
|
26
|
+
/**
|
|
27
|
+
* @desc Legacy
|
|
28
|
+
* @tags size, legacy
|
|
29
|
+
* @deprecated
|
|
30
|
+
*/
|
|
6
31
|
sizeButtonPaddingHorizontal: number;
|
|
32
|
+
/**
|
|
33
|
+
* @desc Legacy
|
|
34
|
+
* @tags size, legacy
|
|
35
|
+
* @deprecated
|
|
36
|
+
*/
|
|
7
37
|
sizeArrowPadding: number;
|
|
38
|
+
/**
|
|
39
|
+
* @desc Значение основного радиуса закругления
|
|
40
|
+
* @tags size, stroke
|
|
41
|
+
*/
|
|
8
42
|
sizeBorderRadius: number;
|
|
43
|
+
/**
|
|
44
|
+
* @desc Legacy
|
|
45
|
+
* @tags size, legacy
|
|
46
|
+
* @deprecated
|
|
47
|
+
*/
|
|
9
48
|
sizeCheckBorderRadius: number;
|
|
49
|
+
/**
|
|
50
|
+
* @desc Значение основного радиуса закругления
|
|
51
|
+
* @tags size, stroke
|
|
52
|
+
*/
|
|
10
53
|
sizeBorderRadiusPaper: number;
|
|
54
|
+
/**
|
|
55
|
+
* @desc Значение радиуса закругления всплывающих окон и промо плашек
|
|
56
|
+
* @tags size, stroke
|
|
57
|
+
*/
|
|
11
58
|
sizeBorderRadiusPromo: number;
|
|
59
|
+
/**
|
|
60
|
+
* @desc Высота полей ввода, селектов и других похожих компонентов
|
|
61
|
+
* @tags size, component
|
|
62
|
+
*/
|
|
12
63
|
sizeFieldHeight: number;
|
|
64
|
+
/**
|
|
65
|
+
* @desc Высота маленьких кнопок
|
|
66
|
+
* @tags size, component
|
|
67
|
+
*/
|
|
13
68
|
sizeButtonSmallHeight: number;
|
|
69
|
+
/**
|
|
70
|
+
* @desc Высота больших кнопок
|
|
71
|
+
* @tags size, component
|
|
72
|
+
*/
|
|
14
73
|
sizeButtonLargeHeight: number;
|
|
74
|
+
/**
|
|
75
|
+
* @desc Высота средних кнопок
|
|
76
|
+
* @tags size, component
|
|
77
|
+
*/
|
|
15
78
|
sizeButtonMediumHeight: number;
|
|
79
|
+
/**
|
|
80
|
+
* @desc Legacy
|
|
81
|
+
* @tags size, legacy
|
|
82
|
+
* @deprecated
|
|
83
|
+
*/
|
|
16
84
|
sizeCheckbox: number;
|
|
85
|
+
/**
|
|
86
|
+
* @desc Legacy
|
|
87
|
+
* @tags size, legacy
|
|
88
|
+
* @deprecated
|
|
89
|
+
*/
|
|
17
90
|
sizeArrow: number;
|
|
91
|
+
/**
|
|
92
|
+
* @desc Legacy
|
|
93
|
+
* @tags size, legacy
|
|
94
|
+
* @deprecated
|
|
95
|
+
*/
|
|
18
96
|
sizeArrowPromo: number;
|
|
97
|
+
/**
|
|
98
|
+
* @desc Legacy
|
|
99
|
+
* @tags size, legacy
|
|
100
|
+
* @deprecated
|
|
101
|
+
*/
|
|
19
102
|
sizePopupSmall: number;
|
|
103
|
+
/**
|
|
104
|
+
* @desc Legacy
|
|
105
|
+
* @tags size, legacy
|
|
106
|
+
* @deprecated
|
|
107
|
+
*/
|
|
20
108
|
sizePopupMedium: number;
|
|
109
|
+
/**
|
|
110
|
+
* @desc Legacy
|
|
111
|
+
* @tags size, legacy
|
|
112
|
+
* @deprecated
|
|
113
|
+
*/
|
|
21
114
|
sizePopupLarge: number;
|
|
115
|
+
/**
|
|
116
|
+
* @desc Legacy
|
|
117
|
+
* @tags size, legacy
|
|
118
|
+
* @deprecated
|
|
119
|
+
*/
|
|
22
120
|
sizeLabelHorizontalMargin: number;
|
|
121
|
+
/**
|
|
122
|
+
* @desc Legacy
|
|
123
|
+
* @tags size, legacy
|
|
124
|
+
* @deprecated
|
|
125
|
+
*/
|
|
23
126
|
sizeTooltipMargin: number;
|
|
127
|
+
/**
|
|
128
|
+
* @desc Legacy
|
|
129
|
+
* @tags size, legacy
|
|
130
|
+
* @deprecated
|
|
131
|
+
*/
|
|
24
132
|
sizeIconUI: number;
|
|
133
|
+
/**
|
|
134
|
+
* @desc Legacy. Размер аватара. В компоненте VKUI задается вручную, токен не используется
|
|
135
|
+
* @tags size, legacy
|
|
136
|
+
* @deprecated
|
|
137
|
+
*/
|
|
25
138
|
sizeAvatarXS: number;
|
|
139
|
+
/**
|
|
140
|
+
* @desc Legacy. Размер аватара. В компоненте VKUI задается вручную, токен не используется
|
|
141
|
+
* @tags size, legacy
|
|
142
|
+
* @deprecated
|
|
143
|
+
*/
|
|
26
144
|
sizeAvatarS: number;
|
|
145
|
+
/**
|
|
146
|
+
* @desc Legacy. Размер аватара. В компоненте VKUI задается вручную, токен не используется
|
|
147
|
+
* @tags size, legacy
|
|
148
|
+
* @deprecated
|
|
149
|
+
*/
|
|
27
150
|
sizeAvatarM: number;
|
|
151
|
+
/**
|
|
152
|
+
* @desc Legacy. Размер аватара. В компоненте VKUI задается вручную, токен не используется
|
|
153
|
+
* @tags size, legacy
|
|
154
|
+
* @deprecated
|
|
155
|
+
*/
|
|
28
156
|
sizeAvatarL: number;
|
|
157
|
+
/**
|
|
158
|
+
* @desc Legacy. Размер аватара. В компоненте VKUI задается вручную, токен не используется
|
|
159
|
+
* @tags size, legacy
|
|
160
|
+
* @deprecated
|
|
161
|
+
*/
|
|
29
162
|
sizeAvatarXL: number;
|
|
163
|
+
/**
|
|
164
|
+
* @desc Legacy. Размер беджа. В компоненте VKUI задается вручную, токен не используется
|
|
165
|
+
* @tags size, legacy
|
|
166
|
+
* @deprecated
|
|
167
|
+
*/
|
|
30
168
|
sizeBadgeXS: number;
|
|
169
|
+
/**
|
|
170
|
+
* @desc Legacy. Размер беджа. В компоненте VKUI задается вручную, токен не используется
|
|
171
|
+
* @tags size, legacy
|
|
172
|
+
* @deprecated
|
|
173
|
+
*/
|
|
31
174
|
sizeBadgeS: number;
|
|
175
|
+
/**
|
|
176
|
+
* @desc Legacy. Размер беджа. В компоненте VKUI задается вручную, токен не используется
|
|
177
|
+
* @tags size, legacy
|
|
178
|
+
* @deprecated
|
|
179
|
+
*/
|
|
32
180
|
sizeBadgeM: number;
|
|
181
|
+
/**
|
|
182
|
+
* @desc Legacy. Размер беджа. В компоненте VKUI задается вручную, токен не используется
|
|
183
|
+
* @tags size, legacy
|
|
184
|
+
* @deprecated
|
|
185
|
+
*/
|
|
33
186
|
sizeBadgeL: number;
|
|
187
|
+
/**
|
|
188
|
+
* @desc Legacy. Размер беджа. В компоненте VKUI задается вручную, токен не используется
|
|
189
|
+
* @tags size, legacy
|
|
190
|
+
* @deprecated
|
|
191
|
+
*/
|
|
34
192
|
sizeBadgeXL: number;
|
|
193
|
+
/**
|
|
194
|
+
* @desc Основной отступ между карточками в компоненте Card
|
|
195
|
+
* @tags size, component
|
|
196
|
+
*/
|
|
35
197
|
sizeCardgridPadding: number;
|
|
198
|
+
/**
|
|
199
|
+
* @desc Радиус закругления в компоненте Card
|
|
200
|
+
* @tags size, component
|
|
201
|
+
*/
|
|
36
202
|
sizeCardBorderRadius: number;
|
|
203
|
+
/**
|
|
204
|
+
* @desc Вертикальный отступ в компоненте Card
|
|
205
|
+
* @tags size, component
|
|
206
|
+
*/
|
|
37
207
|
sizeCardgridPaddingVertical: number;
|
|
208
|
+
/**
|
|
209
|
+
* @desc Основной горизонтальный отступ
|
|
210
|
+
* @tags size
|
|
211
|
+
*/
|
|
38
212
|
sizeBasePaddingHorizontal: number;
|
|
213
|
+
/**
|
|
214
|
+
* @desc Основной вертикальный отступ
|
|
215
|
+
* @tags size
|
|
216
|
+
*/
|
|
39
217
|
sizeBasePaddingVertical: number;
|
|
218
|
+
/**
|
|
219
|
+
* @desc Отступ между кнопками в компоненте ButtonGroup заданный вручную
|
|
220
|
+
* @tags size, component
|
|
221
|
+
*/
|
|
40
222
|
sizeButtonGroupGapSpace: number;
|
|
223
|
+
/**
|
|
224
|
+
* @desc Отступ между кнопками в компоненте ButtonGroup маленький
|
|
225
|
+
* @tags size, component
|
|
226
|
+
*/
|
|
41
227
|
sizeButtonGroupGapSmall: number;
|
|
228
|
+
/**
|
|
229
|
+
* @desc Отступ между кнопками в компоненте ButtonGroup средний
|
|
230
|
+
* @tags size, component
|
|
231
|
+
*/
|
|
42
232
|
sizeButtonGroupGapMedium: number;
|
|
233
|
+
/**
|
|
234
|
+
* @desc Размер отступа в выпадающих списках для создания иерархии
|
|
235
|
+
* @tags size, component
|
|
236
|
+
*/
|
|
43
237
|
sizeOptionHierarchy: number;
|
|
238
|
+
/**
|
|
239
|
+
* @desc Высота компонента Switch
|
|
240
|
+
* @tags size, component
|
|
241
|
+
*/
|
|
44
242
|
sizeSwitchHeight: number;
|
|
243
|
+
/**
|
|
244
|
+
* @desc Ширина компонента Switch
|
|
245
|
+
* @tags size, component
|
|
246
|
+
*/
|
|
45
247
|
sizeSwitchWidth: number;
|
|
248
|
+
/**
|
|
249
|
+
* @desc Размер пина компонента Switch
|
|
250
|
+
* @tags size, component
|
|
251
|
+
*/
|
|
46
252
|
sizeSwitchPin: number;
|
|
253
|
+
/**
|
|
254
|
+
* @desc Высота компонента PanelHeader
|
|
255
|
+
* @tags size, component
|
|
256
|
+
*/
|
|
47
257
|
sizePanelHeaderHeight: number;
|
|
258
|
+
/**
|
|
259
|
+
* @desc Legacy
|
|
260
|
+
* @tags size, legacy
|
|
261
|
+
* @deprecated
|
|
262
|
+
*/
|
|
48
263
|
sizeSearchHeight: number;
|
|
264
|
+
/**
|
|
265
|
+
* @desc Горизонтальный отступ для маленьких кнопок до текста
|
|
266
|
+
* @tags size, component
|
|
267
|
+
*/
|
|
49
268
|
sizeButtonBaseSmallPaddingHorizontal: number;
|
|
269
|
+
/**
|
|
270
|
+
* @desc Горизонтальный отступ для средних кнопок до текста
|
|
271
|
+
* @tags size, component
|
|
272
|
+
*/
|
|
50
273
|
sizeButtonBaseMediumPaddingHorizontal: number;
|
|
274
|
+
/**
|
|
275
|
+
* @desc Горизонтальный отступ для больших кнопок до текста
|
|
276
|
+
* @tags size, component
|
|
277
|
+
*/
|
|
51
278
|
sizeButtonBaseLargePaddingHorizontal: number;
|
|
279
|
+
/**
|
|
280
|
+
* @desc Горизонтальный отступ для маленьких кнопок до иконок
|
|
281
|
+
* @tags size, component
|
|
282
|
+
*/
|
|
52
283
|
sizeButtonBaseSmallPaddingHorizontalIcon: number;
|
|
284
|
+
/**
|
|
285
|
+
* @desc Горизонтальный отступ для средних кнопок до иконок
|
|
286
|
+
* @tags size, component
|
|
287
|
+
*/
|
|
53
288
|
sizeButtonBaseMediumPaddingHorizontalIcon: number;
|
|
289
|
+
/**
|
|
290
|
+
* @desc Горизонтальный отступ для больших кнопок до иконок
|
|
291
|
+
* @tags size, component
|
|
292
|
+
*/
|
|
54
293
|
sizeButtonBaseLargePaddingHorizontalIcon: number;
|
|
294
|
+
/**
|
|
295
|
+
* @desc Горизонтальный отступ в третичных маленьких кнопках
|
|
296
|
+
* @tags size, component
|
|
297
|
+
*/
|
|
55
298
|
sizeButtonTertiarySmallPaddingHorizontal: number;
|
|
299
|
+
/**
|
|
300
|
+
* @desc Горизонтальный отступ в третичных средних кнопках
|
|
301
|
+
* @tags size, component
|
|
302
|
+
*/
|
|
56
303
|
sizeButtonTertiaryMediumPaddingHorizontal: number;
|
|
304
|
+
/**
|
|
305
|
+
* @desc Горизонтальный отступ в третичных больших кнопках
|
|
306
|
+
* @tags size, component
|
|
307
|
+
*/
|
|
57
308
|
sizeButtonTertiaryLargePaddingHorizontal: number;
|
|
309
|
+
/**
|
|
310
|
+
* @desc Горизонтальный отступ в третичных маленьких кнопках до иконок
|
|
311
|
+
* @tags size, component
|
|
312
|
+
*/
|
|
58
313
|
sizeButtonTertiarySmallPaddingHorizontalIcon: number;
|
|
314
|
+
/**
|
|
315
|
+
* @desc Горизонтальный отступ в третичных средних кнопках до иконок
|
|
316
|
+
* @tags size, component
|
|
317
|
+
*/
|
|
59
318
|
sizeButtonTertiaryMediumPaddingHorizontalIcon: number;
|
|
319
|
+
/**
|
|
320
|
+
* @desc Горизонтальный отступ в третичных больших кнопках до иконок
|
|
321
|
+
* @tags size, component
|
|
322
|
+
*/
|
|
60
323
|
sizeButtonTertiaryLargePaddingHorizontalIcon: number;
|
|
324
|
+
/**
|
|
325
|
+
* @desc Минимальная ширина в компоненте Button
|
|
326
|
+
* @tags size, component
|
|
327
|
+
*/
|
|
61
328
|
sizeButtonMinimumWidth: number;
|
|
329
|
+
/**
|
|
330
|
+
* @desc Вертикальный отступ в компоненте FormItem
|
|
331
|
+
* @tags size, component
|
|
332
|
+
*/
|
|
62
333
|
sizeFormItemPaddingVertical: number;
|
|
63
334
|
/**
|
|
64
335
|
* @desc Отступ для компонента SplitCol
|
|
65
|
-
* @tags size,component
|
|
336
|
+
* @tags size, component
|
|
66
337
|
*/
|
|
67
338
|
sizeSplitColPaddingHorizontal: number;
|
|
339
|
+
/**
|
|
340
|
+
* @desc Расстояние между элементами в компоненте SubnavigationBar
|
|
341
|
+
* @tags size, component
|
|
342
|
+
*/
|
|
68
343
|
sizeSubnavigationBarGap: number;
|
|
344
|
+
/**
|
|
345
|
+
* @desc Вертикальный отступ в компоненте SubnavigationBar
|
|
346
|
+
* @tags size, component
|
|
347
|
+
*/
|
|
69
348
|
sizeSubnavigationBarPaddingVertical: number;
|
|
70
349
|
}
|
|
@@ -1,10 +1,18 @@
|
|
|
1
|
-
export
|
|
1
|
+
export type GradientPoints = string;
|
|
2
2
|
export interface Gradients {
|
|
3
3
|
/**
|
|
4
4
|
* @desc Параметры градиента черного цвета
|
|
5
5
|
* @tags gradient
|
|
6
6
|
*/
|
|
7
7
|
gradientBlack: GradientPoints;
|
|
8
|
+
/**
|
|
9
|
+
* @desc Параметры градиента белого цвета
|
|
10
|
+
* @tags gradient
|
|
11
|
+
*/
|
|
8
12
|
gradientWhite: GradientPoints;
|
|
13
|
+
/**
|
|
14
|
+
* @desc Параметры градиента нейтрального цвета
|
|
15
|
+
* @tags gradient
|
|
16
|
+
*/
|
|
9
17
|
gradientTint: GradientPoints;
|
|
10
18
|
}
|
|
@@ -13,13 +13,13 @@ import ColorScheme = Property.ColorScheme;
|
|
|
13
13
|
import { StaticTokens, Tokens } from './tools/tokenValue';
|
|
14
14
|
interface AdaptiveInterfaceValues extends Sizes, Fonts {
|
|
15
15
|
}
|
|
16
|
-
|
|
16
|
+
type AdaptiveTokens = {
|
|
17
17
|
[key in keyof AdaptiveInterfaceValues]: Adaptive<AdaptiveInterfaceValues[key]>;
|
|
18
18
|
};
|
|
19
19
|
export interface ColorsScheme {
|
|
20
20
|
/**
|
|
21
|
-
* @desc
|
|
22
|
-
* @tags
|
|
21
|
+
* @desc Цветовая схема темы
|
|
22
|
+
* @tags service
|
|
23
23
|
* @deprecated
|
|
24
24
|
*/
|
|
25
25
|
colorsScheme: 'light' | 'dark';
|
|
@@ -33,12 +33,24 @@ export interface ColorsFinal extends Colors, ColorsScheme {
|
|
|
33
33
|
}
|
|
34
34
|
export interface SpecialTokens {
|
|
35
35
|
/**
|
|
36
|
-
* @desc
|
|
37
|
-
* @tags
|
|
36
|
+
* @desc Имя темы
|
|
37
|
+
* @tags service
|
|
38
38
|
*/
|
|
39
39
|
themeName: string;
|
|
40
|
+
/**
|
|
41
|
+
* @desc Имя темы, от которой наследуется текущая
|
|
42
|
+
* @tags service
|
|
43
|
+
*/
|
|
40
44
|
themeNameBase?: string;
|
|
45
|
+
/**
|
|
46
|
+
* @desc Имя темы, от которой наследуются значения при инкрементальной сборке
|
|
47
|
+
* @tags service
|
|
48
|
+
*/
|
|
41
49
|
themeInheritsFrom?: string;
|
|
50
|
+
/**
|
|
51
|
+
* @desc Префикс токенов
|
|
52
|
+
* @tags service
|
|
53
|
+
*/
|
|
42
54
|
prefix?: string;
|
|
43
55
|
}
|
|
44
56
|
export interface WithThemeType {
|
|
@@ -59,16 +71,15 @@ export interface ThemeDescription extends Tokens<ThemeGeneral>, ColorsDescriptio
|
|
|
59
71
|
*/
|
|
60
72
|
export interface Theme extends ThemeGeneral, ColorsFinal {
|
|
61
73
|
/**
|
|
62
|
-
* @desc
|
|
63
|
-
* @tags
|
|
64
|
-
* @deprecated
|
|
74
|
+
* @desc Тип темы. Используется только при компиляции
|
|
75
|
+
* @tags service
|
|
65
76
|
*/
|
|
66
77
|
themeType: 'root';
|
|
67
78
|
}
|
|
68
79
|
/**
|
|
69
80
|
* Тема, в коротой все значения пикселизированы. Т.е. 16 -> '16px'
|
|
70
81
|
*/
|
|
71
|
-
export
|
|
82
|
+
export type PixelifyTheme<T extends Partial<Record<keyof T, any>> = StaticTokens<Theme>> = StringifyObject<Omit<T, 'breakpoints' | 'themeType'>> & Pick<T, Extract<'breakpoints', keyof T>> & {
|
|
72
83
|
themeType: 'pixelify';
|
|
73
84
|
themeName: string;
|
|
74
85
|
colorScheme: ColorScheme;
|
|
@@ -77,7 +88,7 @@ export declare type PixelifyTheme<T extends Partial<Record<keyof T, any>> = Stat
|
|
|
77
88
|
* Тема, которая каждой переменной даёт name и value в виде названия
|
|
78
89
|
* соответствующей css-переменной и ссылки на неё
|
|
79
90
|
*/
|
|
80
|
-
export
|
|
91
|
+
export type ThemeCssVars<T = Theme, Ex extends keyof T = never> = {
|
|
81
92
|
[K in keyof Omit<T, Ex | 'themeType'>]: NamifyObject<StringifyObject<T>[K], true>;
|
|
82
93
|
} & Pick<T, Ex> & {
|
|
83
94
|
themeType: 'cssVars';
|
|
@@ -86,7 +97,7 @@ export declare type ThemeCssVars<T = Theme, Ex extends keyof T = never> = {
|
|
|
86
97
|
* Тоже самое, что и ThemeCssVars, только у переменных есть ещё originValue
|
|
87
98
|
* используется для генерации источников CSS-переменных
|
|
88
99
|
*/
|
|
89
|
-
export
|
|
100
|
+
export type ThemeCssVarsWide<T = Theme, Ex extends keyof T = never> = {
|
|
90
101
|
[K in keyof Omit<T, Ex | 'themeType'>]: NamifyObject<StringifyObject<T>[K]>;
|
|
91
102
|
} & Pick<T, Ex> & {
|
|
92
103
|
themeType: 'cssVarsWide';
|
|
@@ -16,8 +16,8 @@ export interface CssVarValue {
|
|
|
16
16
|
export interface WideCssVarValue<T> extends CssVarValue {
|
|
17
17
|
originalValue: T;
|
|
18
18
|
}
|
|
19
|
-
|
|
20
|
-
export
|
|
19
|
+
type Valuefy<T, WithoutValue extends boolean = false> = WithoutValue extends true ? CssVarValue : WideCssVarValue<T>;
|
|
20
|
+
export type NamifyObject<T, W extends boolean = false> = T extends Adaptive<T[keyof T]> ? {
|
|
21
21
|
auto: NamifyObject<T['regular'], true>;
|
|
22
22
|
regular: NamifyObject<T['regular'], W>;
|
|
23
23
|
} & {
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { GetLast, GetLength } from './utils';
|
|
2
2
|
import { ViewportsTuple } from './viewports';
|
|
3
|
-
export
|
|
4
|
-
export
|
|
3
|
+
export type CustomMediaByViewportUnion<Vt extends ViewportsTuple> = `width${Capitalize<GetLength<Vt> extends 1 ? never : Vt[number]>}` | `widthFrom${Capitalize<Exclude<Vt[number], Vt[0]>>}` | `widthTo${Capitalize<Exclude<Vt[number], GetLast<Vt>>>}`;
|
|
4
|
+
export type CustomMediaByViewport<Vt extends ViewportsTuple> = {
|
|
5
5
|
[key in CustomMediaByViewportUnion<Vt>]: string;
|
|
6
6
|
};
|
|
@@ -5,7 +5,7 @@ import { DefaultViewports, ViewportsTuple } from './viewports';
|
|
|
5
5
|
* остальные состояния могут переопределять переменную полностью или
|
|
6
6
|
* частично, если это объект
|
|
7
7
|
*/
|
|
8
|
-
export
|
|
8
|
+
export type Adaptive<T> = {
|
|
9
9
|
/**
|
|
10
10
|
* основной параметр
|
|
11
11
|
*/
|
|
@@ -24,7 +24,7 @@ export declare const adaptiveKeys: (keyof Adaptive<any>)[];
|
|
|
24
24
|
/**
|
|
25
25
|
* Брейкпоинты используемые в теме (можно не указывать), тогда тема будет как-бы flat
|
|
26
26
|
*/
|
|
27
|
-
export
|
|
27
|
+
export type Breakpoints<Vt extends ViewportsTuple = DefaultViewports> = {
|
|
28
28
|
breakpoints?: {
|
|
29
29
|
[key in Vt[number]]: {
|
|
30
30
|
breakpoint: key extends Vt[0] ? 0 : number;
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
export
|
|
2
|
-
export
|
|
3
|
-
export
|
|
1
|
+
export type Token<T, Theme> = T | ((theme: Theme) => T);
|
|
2
|
+
export type MakeStaticToken<T> = T extends (...args: any[]) => any ? MakeStaticToken<ReturnType<T>> : T;
|
|
3
|
+
export type Tokens<T> = {
|
|
4
4
|
[K in keyof T]: Token<T[K], T>;
|
|
5
5
|
};
|
|
6
|
-
export
|
|
6
|
+
export type StaticTokens<T> = {
|
|
7
7
|
[K in keyof T]: MakeStaticToken<T[K]>;
|
|
8
8
|
};
|