@skbkontur/colors 1.1.2-b2742.0 → 1.1.2-bdb5e.0
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/dist/cjs/get-base-tokens.d.ts +9 -7
- package/dist/cjs/get-base-tokens.js +69 -101
- package/dist/cjs/get-default-tokens.d.ts +130 -92
- package/dist/cjs/get-default-tokens.js +257 -219
- package/dist/cjs/helpers/get-palette.js +59 -65
- package/dist/cjs/helpers/get-promo.js +21 -27
- package/dist/cjs/types/base-tokens.d.ts +5 -4
- package/dist/cjs/utils/format-variable.d.ts +2 -0
- package/dist/cjs/utils/format-variable.js +11 -0
- package/dist/esm/get-base-tokens.d.ts +9 -7
- package/dist/esm/get-base-tokens.js +67 -95
- package/dist/esm/get-default-tokens.d.ts +130 -92
- package/dist/esm/get-default-tokens.js +257 -219
- package/dist/esm/helpers/get-palette.js +59 -65
- package/dist/esm/helpers/get-promo.js +21 -27
- package/dist/esm/types/base-tokens.d.ts +5 -4
- package/dist/esm/utils/format-variable.d.ts +2 -0
- package/dist/esm/utils/format-variable.js +6 -0
- package/dist/tokens/base/css/brand-green_accent-brand.css +444 -0
- package/dist/tokens/base/css/brand-green_accent-gray.css +354 -0
- package/dist/tokens/base/css/brand-orange_accent-brand.css +444 -0
- package/dist/tokens/base/css/brand-orange_accent-gray.css +354 -0
- package/dist/tokens/base/css/brand-red_accent-brand.css +444 -0
- package/dist/tokens/base/css/brand-red_accent-gray.css +354 -0
- package/dist/tokens/base/js/brand-green_accent-brand.js +444 -0
- package/dist/tokens/base/js/brand-green_accent-gray.js +352 -0
- package/dist/tokens/base/js/brand-orange_accent-brand.js +444 -0
- package/dist/tokens/base/js/brand-orange_accent-gray.js +352 -0
- package/dist/tokens/base/js/brand-red_accent-brand.js +444 -0
- package/dist/tokens/base/js/brand-red_accent-gray.js +352 -0
- package/dist/tokens/base/js-tree/brand-green_accent-brand.tree.js +515 -0
- package/dist/tokens/base/js-tree/brand-green_accent-gray.tree.js +403 -0
- package/dist/tokens/base/js-tree/brand-orange_accent-brand.tree.js +515 -0
- package/dist/tokens/base/js-tree/brand-orange_accent-gray.tree.js +403 -0
- package/dist/tokens/base/js-tree/brand-red_accent-brand.tree.js +515 -0
- package/dist/tokens/base/js-tree/brand-red_accent-gray.tree.js +403 -0
- package/dist/tokens/base/json/brand-green_accent-brand.json +444 -0
- package/dist/tokens/base/json/brand-green_accent-gray.json +352 -0
- package/dist/tokens/base/json/brand-orange_accent-brand.json +444 -0
- package/dist/tokens/base/json/brand-orange_accent-gray.json +352 -0
- package/dist/tokens/base/json/brand-red_accent-brand.json +444 -0
- package/dist/tokens/base/json/brand-red_accent-gray.json +352 -0
- package/dist/tokens/base/json-tree/brand-green_accent-brand.tree.json +515 -0
- package/dist/tokens/base/json-tree/brand-green_accent-gray.tree.json +403 -0
- package/dist/tokens/base/json-tree/brand-orange_accent-brand.tree.json +515 -0
- package/dist/tokens/base/json-tree/brand-orange_accent-gray.tree.json +403 -0
- package/dist/tokens/base/json-tree/brand-red_accent-brand.tree.json +515 -0
- package/dist/tokens/base/json-tree/brand-red_accent-gray.tree.json +403 -0
- package/dist/tokens/base/less/brand-green_accent-brand.less +442 -0
- package/dist/tokens/base/less/brand-green_accent-gray.less +352 -0
- package/dist/tokens/base/less/brand-orange_accent-brand.less +442 -0
- package/dist/tokens/base/less/brand-orange_accent-gray.less +352 -0
- package/dist/tokens/base/less/brand-red_accent-brand.less +442 -0
- package/dist/tokens/base/less/brand-red_accent-gray.less +352 -0
- package/dist/tokens/base/scss/brand-green_accent-brand.scss +442 -0
- package/dist/tokens/base/scss/brand-green_accent-gray.scss +352 -0
- package/dist/tokens/base/scss/brand-orange_accent-brand.scss +442 -0
- package/dist/tokens/base/scss/brand-orange_accent-gray.scss +352 -0
- package/dist/tokens/base/scss/brand-red_accent-brand.scss +442 -0
- package/dist/tokens/base/scss/brand-red_accent-gray.scss +352 -0
- package/package.json +4 -4
|
@@ -1,17 +1,19 @@
|
|
|
1
1
|
import * as DEFAULT_SWATCH from './constants/default-swatch';
|
|
2
2
|
import type { BaseTokens } from './types/base-tokens';
|
|
3
3
|
type PresetOrCustom<T extends string> = T | (string & Record<never, never>);
|
|
4
|
+
declare const ACCENT_PARAMS: string[];
|
|
5
|
+
export interface ColorObject {
|
|
6
|
+
[key: string]: ColorValue;
|
|
7
|
+
}
|
|
8
|
+
export type ColorValue = string | ColorObject | ColorValue[];
|
|
9
|
+
type ColorStructure = ColorObject | ColorValue[];
|
|
4
10
|
export interface ConfigOptions {
|
|
5
11
|
brand: PresetOrCustom<keyof typeof DEFAULT_SWATCH.brand>;
|
|
6
|
-
accent: PresetOrCustom<
|
|
12
|
+
accent: PresetOrCustom<(typeof ACCENT_PARAMS)[number]>;
|
|
7
13
|
system?: typeof DEFAULT_SWATCH.system;
|
|
8
14
|
}
|
|
9
15
|
export declare function getBaseTokens({ brand, accent, system }: ConfigOptions): BaseTokens;
|
|
10
|
-
export declare
|
|
11
|
-
export declare const camelCaseToKebabCase: (str: string) => string;
|
|
12
|
-
export declare const kebabCaseToCamelCase: (str: string) => string;
|
|
13
|
-
export declare function convertOklchToHex(obj: any): any;
|
|
16
|
+
export declare function convertOklchToHex(obj: ColorStructure): ColorStructure;
|
|
14
17
|
export declare const convertOklchToRgba: (oklchString: string) => string;
|
|
15
|
-
export declare function convertAlphaOklchToRgba(obj:
|
|
16
|
-
export declare function flattenObject(obj: any, prefix?: string): any;
|
|
18
|
+
export declare function convertAlphaOklchToRgba(obj: ColorStructure): ColorStructure;
|
|
17
19
|
export {};
|
|
@@ -1,15 +1,4 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __assign = (this && this.__assign) || function () {
|
|
3
|
-
__assign = Object.assign || function(t) {
|
|
4
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
-
s = arguments[i];
|
|
6
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
-
t[p] = s[p];
|
|
8
|
-
}
|
|
9
|
-
return t;
|
|
10
|
-
};
|
|
11
|
-
return __assign.apply(this, arguments);
|
|
12
|
-
};
|
|
13
2
|
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
14
3
|
if (k2 === undefined) k2 = k;
|
|
15
4
|
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
@@ -34,40 +23,40 @@ var __importStar = (this && this.__importStar) || function (mod) {
|
|
|
34
23
|
return result;
|
|
35
24
|
};
|
|
36
25
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
37
|
-
exports.
|
|
26
|
+
exports.convertAlphaOklchToRgba = exports.convertOklchToRgba = exports.convertOklchToHex = exports.getBaseTokens = void 0;
|
|
38
27
|
var culori_1 = require("culori");
|
|
39
28
|
var get_palette_1 = require("./helpers/get-palette");
|
|
40
29
|
var get_promo_1 = require("./helpers/get-promo");
|
|
41
30
|
var DEFAULT_SWATCH = __importStar(require("./constants/default-swatch"));
|
|
42
31
|
var get_logo_1 = require("./helpers/get-logo");
|
|
43
32
|
var get_interactions_1 = require("./helpers/get-interactions");
|
|
33
|
+
var ACCENT_PARAMS = ['brand', 'gray'];
|
|
44
34
|
function getBaseTokens(_a) {
|
|
45
35
|
var brand = _a.brand, _b = _a.accent, accent = _b === void 0 ? 'gray' : _b, _c = _a.system, system = _c === void 0 ? DEFAULT_SWATCH.system : _c;
|
|
46
|
-
var brandColor
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
break;
|
|
53
|
-
case 'gray':
|
|
54
|
-
default:
|
|
55
|
-
accentPalette = undefined;
|
|
36
|
+
var brandColor;
|
|
37
|
+
if (brand in DEFAULT_SWATCH) {
|
|
38
|
+
brandColor = DEFAULT_SWATCH.brand[brand];
|
|
39
|
+
}
|
|
40
|
+
else {
|
|
41
|
+
brandColor = brand;
|
|
56
42
|
}
|
|
57
|
-
var
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
}
|
|
43
|
+
var accentColor;
|
|
44
|
+
if (accent === 'brand') {
|
|
45
|
+
accentColor = brandColor;
|
|
46
|
+
}
|
|
47
|
+
else if (accent !== 'gray') {
|
|
48
|
+
accentColor = accent;
|
|
49
|
+
}
|
|
50
|
+
var brandPalette = (0, get_palette_1.getPalette)({ color: brandColor });
|
|
51
|
+
var accentPalette = accent === 'brand' ? brandPalette : undefined;
|
|
64
52
|
var customizable = {};
|
|
65
53
|
for (var colorKey in DEFAULT_SWATCH.customizable) {
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
54
|
+
var key = colorKey;
|
|
55
|
+
if (key && brand && brand in DEFAULT_SWATCH) {
|
|
56
|
+
customizable[key] = (0, get_palette_1.getPalette)({
|
|
57
|
+
color: DEFAULT_SWATCH.customizable[key],
|
|
58
|
+
});
|
|
59
|
+
}
|
|
71
60
|
}
|
|
72
61
|
return {
|
|
73
62
|
brand: {
|
|
@@ -80,80 +69,71 @@ function getBaseTokens(_a) {
|
|
|
80
69
|
},
|
|
81
70
|
palette: brandPalette,
|
|
82
71
|
},
|
|
83
|
-
accent:
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
72
|
+
accent: accentColor
|
|
73
|
+
? {
|
|
74
|
+
original: {
|
|
75
|
+
light: accentColor,
|
|
76
|
+
dark: accentColor,
|
|
77
|
+
},
|
|
78
|
+
interactions: {
|
|
79
|
+
hover: (0, get_interactions_1.getHover)(accentColor),
|
|
80
|
+
pressed: (0, get_interactions_1.getPressed)(accentColor),
|
|
81
|
+
},
|
|
82
|
+
palette: accentPalette,
|
|
83
|
+
}
|
|
84
|
+
: undefined,
|
|
85
|
+
warning: (0, get_palette_1.getPalette)({ color: system.warning }),
|
|
86
|
+
error: (0, get_palette_1.getPalette)({ color: system.error }),
|
|
87
|
+
success: (0, get_palette_1.getPalette)({ color: system.success }),
|
|
98
88
|
gray: DEFAULT_SWATCH.gray,
|
|
99
89
|
whiteAlpha: DEFAULT_SWATCH.whiteAlpha,
|
|
100
90
|
blackAlpha: DEFAULT_SWATCH.blackAlpha,
|
|
101
91
|
onBrand: (0, get_palette_1.calcOnBrand)(brandColor),
|
|
92
|
+
onAccent: accentColor ? (0, get_palette_1.calcOnBrand)(accentColor) : undefined,
|
|
102
93
|
customizable: customizable,
|
|
103
94
|
};
|
|
104
95
|
}
|
|
105
96
|
exports.getBaseTokens = getBaseTokens;
|
|
106
|
-
var colorToHex = function (color) {
|
|
107
|
-
if (DEFAULT_SWATCH.brand[color]) {
|
|
108
|
-
return DEFAULT_SWATCH.brand[color];
|
|
109
|
-
}
|
|
110
|
-
return color;
|
|
111
|
-
};
|
|
112
|
-
exports.colorToHex = colorToHex;
|
|
113
|
-
var camelCaseToKebabCase = function (str) {
|
|
114
|
-
return str.replace(/[A-Z]/g, function (match) { return "-".concat(match.toLowerCase()); });
|
|
115
|
-
};
|
|
116
|
-
exports.camelCaseToKebabCase = camelCaseToKebabCase;
|
|
117
|
-
var kebabCaseToCamelCase = function (str) {
|
|
118
|
-
return str.replace(/-(\w)/g, function (_, c) { return c.toUpperCase(); });
|
|
119
|
-
};
|
|
120
|
-
exports.kebabCaseToCamelCase = kebabCaseToCamelCase;
|
|
121
97
|
function convertOklchToHex(obj) {
|
|
122
98
|
if (typeof obj !== 'object' || obj === null) {
|
|
123
99
|
return obj;
|
|
124
100
|
}
|
|
125
101
|
if (Array.isArray(obj)) {
|
|
126
|
-
return obj.map(function (item) {
|
|
102
|
+
return obj.map(function (item) {
|
|
103
|
+
if (typeof item === 'object' && item !== null) {
|
|
104
|
+
return convertOklchToHex(item);
|
|
105
|
+
}
|
|
106
|
+
return item;
|
|
107
|
+
});
|
|
127
108
|
}
|
|
128
109
|
var newObj = {};
|
|
129
110
|
for (var key in obj) {
|
|
130
111
|
if (Object.prototype.hasOwnProperty.call(obj, key)) {
|
|
131
112
|
var value = obj[key];
|
|
132
113
|
if (typeof value === 'string' && value.startsWith('oklch(') && !value.includes('/')) {
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
114
|
+
var oklchColor = (0, culori_1.converter)('oklch')(value);
|
|
115
|
+
var rgbColor = (0, culori_1.converter)('rgb')(oklchColor);
|
|
116
|
+
value = (0, culori_1.formatHex)(rgbColor);
|
|
117
|
+
}
|
|
118
|
+
if (typeof value === 'object' && value !== null) {
|
|
119
|
+
newObj[key] = convertOklchToHex(value);
|
|
120
|
+
}
|
|
121
|
+
else {
|
|
122
|
+
newObj[key] = value;
|
|
140
123
|
}
|
|
141
|
-
newObj[key] = convertOklchToHex(value);
|
|
142
124
|
}
|
|
143
125
|
}
|
|
144
126
|
return newObj;
|
|
145
127
|
}
|
|
146
128
|
exports.convertOklchToHex = convertOklchToHex;
|
|
147
129
|
var convertOklchToRgba = function (oklchString) {
|
|
130
|
+
var _a;
|
|
148
131
|
var oklch = (0, culori_1.converter)('oklch')(oklchString);
|
|
149
132
|
var rgb = (0, culori_1.converter)('rgb')(oklch);
|
|
150
|
-
if (!rgb) {
|
|
151
|
-
throw new Error("Invalid color format: ".concat(oklchString));
|
|
152
|
-
}
|
|
153
133
|
var r = Math.round(rgb.r * 255);
|
|
154
134
|
var g = Math.round(rgb.g * 255);
|
|
155
135
|
var b = Math.round(rgb.b * 255);
|
|
156
|
-
var alpha = oklch.alpha;
|
|
136
|
+
var alpha = (_a = oklch.alpha) !== null && _a !== void 0 ? _a : 1;
|
|
157
137
|
return "rgba(".concat(r, ", ").concat(g, ", ").concat(b, ", ").concat(alpha, ")");
|
|
158
138
|
};
|
|
159
139
|
exports.convertOklchToRgba = convertOklchToRgba;
|
|
@@ -162,40 +142,28 @@ function convertAlphaOklchToRgba(obj) {
|
|
|
162
142
|
return obj;
|
|
163
143
|
}
|
|
164
144
|
if (Array.isArray(obj)) {
|
|
165
|
-
return obj.map(function (item) {
|
|
145
|
+
return obj.map(function (item) {
|
|
146
|
+
if (typeof item === 'object' && item !== null) {
|
|
147
|
+
return convertAlphaOklchToRgba(item);
|
|
148
|
+
}
|
|
149
|
+
return item;
|
|
150
|
+
});
|
|
166
151
|
}
|
|
167
152
|
var newObj = {};
|
|
168
153
|
for (var key in obj) {
|
|
169
154
|
if (Object.prototype.hasOwnProperty.call(obj, key)) {
|
|
170
155
|
var value = obj[key];
|
|
171
156
|
if (typeof value === 'string' && value.includes('oklch(')) {
|
|
172
|
-
|
|
173
|
-
value = (0, exports.convertOklchToRgba)(value);
|
|
174
|
-
}
|
|
175
|
-
catch (e) {
|
|
176
|
-
console.error("Failed to convert OKLCH with alpha to rgba: ".concat(value), e);
|
|
177
|
-
}
|
|
157
|
+
value = (0, exports.convertOklchToRgba)(value);
|
|
178
158
|
}
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
}
|
|
182
|
-
return newObj;
|
|
183
|
-
}
|
|
184
|
-
exports.convertAlphaOklchToRgba = convertAlphaOklchToRgba;
|
|
185
|
-
function flattenObject(obj, prefix) {
|
|
186
|
-
if (prefix === void 0) { prefix = ''; }
|
|
187
|
-
var result = {};
|
|
188
|
-
for (var key in obj) {
|
|
189
|
-
if (Object.prototype.hasOwnProperty.call(obj, key)) {
|
|
190
|
-
var newKey = prefix ? "".concat(prefix, "-").concat((0, exports.camelCaseToKebabCase)(key)) : key;
|
|
191
|
-
if (typeof obj[key] === 'object' && !Array.isArray(obj[key])) {
|
|
192
|
-
result = __assign(__assign({}, result), flattenObject(obj[key], newKey));
|
|
159
|
+
if (typeof value === 'object' && value !== null) {
|
|
160
|
+
newObj[key] = convertAlphaOklchToRgba(value);
|
|
193
161
|
}
|
|
194
162
|
else {
|
|
195
|
-
|
|
163
|
+
newObj[key] = value;
|
|
196
164
|
}
|
|
197
165
|
}
|
|
198
166
|
}
|
|
199
|
-
return
|
|
167
|
+
return newObj;
|
|
200
168
|
}
|
|
201
|
-
exports.
|
|
169
|
+
exports.convertAlphaOklchToRgba = convertAlphaOklchToRgba;
|
|
@@ -1,55 +1,61 @@
|
|
|
1
1
|
import type { BaseTokens } from './types/base-tokens';
|
|
2
2
|
export declare const getDefaultTokens: (base: BaseTokens) => {
|
|
3
3
|
light: {
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
4
|
+
textAccentHeavy: string;
|
|
5
|
+
textAccentHeavyHover: string;
|
|
6
|
+
textAccentHeavyPressed: string;
|
|
7
7
|
textDisabled: string;
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
8
|
+
textErrorHeavy: string;
|
|
9
|
+
textErrorHeavyHover: string;
|
|
10
|
+
textErrorHeavyPressed: string;
|
|
11
|
+
textInvertedAccentHeavy: string;
|
|
12
|
+
textInvertedAccentHeavyHover: string;
|
|
13
|
+
textInvertedAccentHeavyPressed: string;
|
|
14
14
|
textInvertedDisabled: string;
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
15
|
+
textInvertedErrorHeavy: string;
|
|
16
|
+
textInvertedErrorHeavyHover: string;
|
|
17
|
+
textInvertedErrorHeavyPressed: string;
|
|
18
|
+
textInvertedNeutralHeavy: string;
|
|
19
|
+
textInvertedNeutralPale: string;
|
|
20
|
+
textInvertedNeutralSoft: string;
|
|
21
|
+
textInvertedSuccessHeavy: string;
|
|
22
|
+
textInvertedSuccessHeavyHover: string;
|
|
23
|
+
textInvertedSuccessHeavyPressed: string;
|
|
24
|
+
textInvertedWarningHeavy: string;
|
|
25
|
+
textInvertedWarningHeavyHover: string;
|
|
26
|
+
textInvertedWarningHeavyPressed: string;
|
|
26
27
|
textLogo: string;
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
textSuccessPrimaryHover: string;
|
|
37
|
-
textSuccessPrimaryPressed: string;
|
|
38
|
-
textWarningPrimary: string;
|
|
39
|
-
textWarningPrimaryHover: string;
|
|
40
|
-
textWarningPrimaryPressed: string;
|
|
28
|
+
textNeutralHeavy: string;
|
|
29
|
+
textNeutralPale: string;
|
|
30
|
+
textNeutralSoft: string;
|
|
31
|
+
textSuccessHeavy: string;
|
|
32
|
+
textSuccessHeavyHover: string;
|
|
33
|
+
textSuccessHeavyPressed: string;
|
|
34
|
+
textWarningHeavy: string;
|
|
35
|
+
textWarningHeavyHover: string;
|
|
36
|
+
textWarningHeavyPressed: string;
|
|
41
37
|
textConstDisabledBlack: string;
|
|
42
38
|
textConstDisabledWhite: string;
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
39
|
+
textConstHeavyBlack: string;
|
|
40
|
+
textConstHeavyWhite: string;
|
|
41
|
+
textConstPaleBlack: string;
|
|
42
|
+
textConstPaleWhite: string;
|
|
43
|
+
textConstSoftBlack: string;
|
|
44
|
+
textConstSoftWhite: string;
|
|
45
|
+
textOnAccentBoldDisabled: string;
|
|
46
|
+
textOnAccentBoldHeavy: string;
|
|
47
|
+
textOnAccentBoldPale: string;
|
|
48
|
+
textOnAccentBoldSoft: string;
|
|
49
|
+
textOnBrandOriginalDisabled: string;
|
|
50
|
+
textOnBrandOriginalHeavy: string;
|
|
51
|
+
textOnBrandOriginalPale: string;
|
|
52
|
+
textOnBrandOriginalSoft: string;
|
|
47
53
|
shapeBoldAccent: string;
|
|
48
54
|
shapeBoldAccentHover: string;
|
|
49
55
|
shapeBoldAccentPressed: string;
|
|
50
|
-
shapeBoldBrandOriginal: string;
|
|
51
|
-
shapeBoldBrandOriginalHover: string;
|
|
52
|
-
shapeBoldBrandOriginalPressed: string;
|
|
56
|
+
shapeBoldBrandOriginal: string | undefined;
|
|
57
|
+
shapeBoldBrandOriginalHover: string | undefined;
|
|
58
|
+
shapeBoldBrandOriginalPressed: string | undefined;
|
|
53
59
|
shapeBoldError: string;
|
|
54
60
|
shapeBoldErrorHover: string;
|
|
55
61
|
shapeBoldErrorPressed: string;
|
|
@@ -92,6 +98,8 @@ export declare const getDefaultTokens: (base: BaseTokens) => {
|
|
|
92
98
|
shapeOtherBasePressed: string;
|
|
93
99
|
shapeOtherDisabled: string;
|
|
94
100
|
shapeOtherField: string;
|
|
101
|
+
shapeOtherFieldHover: string;
|
|
102
|
+
shapeOtherFieldPressed: string;
|
|
95
103
|
shapeOtherLow: string;
|
|
96
104
|
shapeOtherLowHover: string;
|
|
97
105
|
shapeOtherLowPressed: string;
|
|
@@ -143,6 +151,9 @@ export declare const getDefaultTokens: (base: BaseTokens) => {
|
|
|
143
151
|
shapeInvertedBacklessHover: string;
|
|
144
152
|
shapeInvertedBacklessPressed: string;
|
|
145
153
|
shapeInvertedDisabled: string;
|
|
154
|
+
shapeInvertedNeutralFaintAlpha: string;
|
|
155
|
+
shapeInvertedNeutralFaintAlphaHover: string;
|
|
156
|
+
shapeInvertedNeutralFaintAlphaPressed: string;
|
|
146
157
|
shapeInvertedNeutralHeavy: string;
|
|
147
158
|
shapeInvertedNeutralHeavyHover: string;
|
|
148
159
|
shapeInvertedNeutralHeavyPressed: string;
|
|
@@ -158,6 +169,12 @@ export declare const getDefaultTokens: (base: BaseTokens) => {
|
|
|
158
169
|
shapeConstBacklessWhitePressed: string;
|
|
159
170
|
shapeConstDisabledBlack: string;
|
|
160
171
|
shapeConstDisabledWhite: string;
|
|
172
|
+
shapeConstFaintBlack: string;
|
|
173
|
+
shapeConstFaintBlackHover: string;
|
|
174
|
+
shapeConstFaintBlackPressed: string;
|
|
175
|
+
shapeConstFaintWhite: string;
|
|
176
|
+
shapeConstFaintWhiteHover: string;
|
|
177
|
+
shapeConstFaintWhitePressed: string;
|
|
161
178
|
shapeConstHeavyBlack: string;
|
|
162
179
|
shapeConstHeavyBlackHover: string;
|
|
163
180
|
shapeConstHeavyBlackPressed: string;
|
|
@@ -194,10 +211,10 @@ export declare const getDefaultTokens: (base: BaseTokens) => {
|
|
|
194
211
|
lineNeutralPale: string;
|
|
195
212
|
lineNeutralPaleHover: string;
|
|
196
213
|
lineNeutralPalePressed: string;
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
214
|
+
lineOnAccentBoldFaint: string;
|
|
215
|
+
lineOnAccentBoldPale: string;
|
|
216
|
+
lineOnBrandOriginalFaint: string;
|
|
217
|
+
lineOnBrandOriginalPale: string;
|
|
201
218
|
lineSuccessBold: string;
|
|
202
219
|
lineSuccessBoldHover: string;
|
|
203
220
|
lineSuccessBoldPressed: string;
|
|
@@ -241,8 +258,10 @@ export declare const getDefaultTokens: (base: BaseTokens) => {
|
|
|
241
258
|
illustrationBlack: string;
|
|
242
259
|
illustrationBrand: string;
|
|
243
260
|
illustrationComplement: string;
|
|
261
|
+
illustrationInvertedNeutral: string;
|
|
262
|
+
illustrationNeutral: string;
|
|
244
263
|
illustrationOnBrand: string;
|
|
245
|
-
|
|
264
|
+
illustrationOnComplement: string;
|
|
246
265
|
illustrationPromo: string;
|
|
247
266
|
illustrationSymbol: string;
|
|
248
267
|
illustrationWhite: string;
|
|
@@ -303,55 +322,61 @@ export declare const getDefaultTokens: (base: BaseTokens) => {
|
|
|
303
322
|
customizableSoftYellow: string;
|
|
304
323
|
};
|
|
305
324
|
dark: {
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
325
|
+
textAccentHeavy: string;
|
|
326
|
+
textAccentHeavyHover: string;
|
|
327
|
+
textAccentHeavyPressed: string;
|
|
309
328
|
textDisabled: string;
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
|
|
314
|
-
|
|
315
|
-
|
|
329
|
+
textErrorHeavy: string;
|
|
330
|
+
textErrorHeavyHover: string;
|
|
331
|
+
textErrorHeavyPressed: string;
|
|
332
|
+
textInvertedAccentHeavy: string;
|
|
333
|
+
textInvertedAccentHeavyHover: string;
|
|
334
|
+
textInvertedAccentHeavyPressed: string;
|
|
316
335
|
textInvertedDisabled: string;
|
|
317
|
-
|
|
318
|
-
|
|
319
|
-
|
|
320
|
-
|
|
321
|
-
|
|
322
|
-
|
|
323
|
-
|
|
324
|
-
|
|
325
|
-
|
|
326
|
-
|
|
327
|
-
|
|
336
|
+
textInvertedErrorHeavy: string;
|
|
337
|
+
textInvertedErrorHeavyHover: string;
|
|
338
|
+
textInvertedErrorHeavyPressed: string;
|
|
339
|
+
textInvertedNeutralHeavy: string;
|
|
340
|
+
textInvertedNeutralPale: string;
|
|
341
|
+
textInvertedNeutralSoft: string;
|
|
342
|
+
textInvertedSuccessHeavy: string;
|
|
343
|
+
textInvertedSuccessHeavyHover: string;
|
|
344
|
+
textInvertedSuccessHeavyPressed: string;
|
|
345
|
+
textInvertedWarningHeavy: string;
|
|
346
|
+
textInvertedWarningHeavyHover: string;
|
|
347
|
+
textInvertedWarningHeavyPressed: string;
|
|
328
348
|
textLogo: string;
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
|
|
338
|
-
textSuccessPrimaryHover: string;
|
|
339
|
-
textSuccessPrimaryPressed: string;
|
|
340
|
-
textWarningPrimary: string;
|
|
341
|
-
textWarningPrimaryHover: string;
|
|
342
|
-
textWarningPrimaryPressed: string;
|
|
349
|
+
textNeutralHeavy: string;
|
|
350
|
+
textNeutralPale: string;
|
|
351
|
+
textNeutralSoft: string;
|
|
352
|
+
textSuccessHeavy: string;
|
|
353
|
+
textSuccessHeavyHover: string;
|
|
354
|
+
textSuccessHeavyPressed: string;
|
|
355
|
+
textWarningHeavy: string;
|
|
356
|
+
textWarningHeavyHover: string;
|
|
357
|
+
textWarningHeavyPressed: string;
|
|
343
358
|
textConstDisabledBlack: string;
|
|
344
359
|
textConstDisabledWhite: string;
|
|
345
|
-
|
|
346
|
-
|
|
347
|
-
|
|
348
|
-
|
|
360
|
+
textConstHeavyBlack: string;
|
|
361
|
+
textConstHeavyWhite: string;
|
|
362
|
+
textConstPaleBlack: string;
|
|
363
|
+
textConstPaleWhite: string;
|
|
364
|
+
textConstSoftBlack: string;
|
|
365
|
+
textConstSoftWhite: string;
|
|
366
|
+
textOnAccentBoldDisabled: string;
|
|
367
|
+
textOnAccentBoldHeavy: string;
|
|
368
|
+
textOnAccentBoldPale: string;
|
|
369
|
+
textOnAccentBoldSoft: string;
|
|
370
|
+
textOnBrandOriginalDisabled: string;
|
|
371
|
+
textOnBrandOriginalHeavy: string;
|
|
372
|
+
textOnBrandOriginalPale: string;
|
|
373
|
+
textOnBrandOriginalSoft: string;
|
|
349
374
|
shapeBoldAccent: string;
|
|
350
375
|
shapeBoldAccentHover: string;
|
|
351
376
|
shapeBoldAccentPressed: string;
|
|
352
|
-
shapeBoldBrandOriginal: string;
|
|
353
|
-
shapeBoldBrandOriginalHover: string;
|
|
354
|
-
shapeBoldBrandOriginalPressed: string;
|
|
377
|
+
shapeBoldBrandOriginal: string | undefined;
|
|
378
|
+
shapeBoldBrandOriginalHover: string | undefined;
|
|
379
|
+
shapeBoldBrandOriginalPressed: string | undefined;
|
|
355
380
|
shapeBoldError: string;
|
|
356
381
|
shapeBoldErrorHover: string;
|
|
357
382
|
shapeBoldErrorPressed: string;
|
|
@@ -394,6 +419,8 @@ export declare const getDefaultTokens: (base: BaseTokens) => {
|
|
|
394
419
|
shapeOtherBasePressed: string;
|
|
395
420
|
shapeOtherDisabled: string;
|
|
396
421
|
shapeOtherField: string;
|
|
422
|
+
shapeOtherFieldHover: string;
|
|
423
|
+
shapeOtherFieldPressed: string;
|
|
397
424
|
shapeOtherLow: string;
|
|
398
425
|
shapeOtherLowHover: string;
|
|
399
426
|
shapeOtherLowPressed: string;
|
|
@@ -445,6 +472,9 @@ export declare const getDefaultTokens: (base: BaseTokens) => {
|
|
|
445
472
|
shapeInvertedBacklessHover: string;
|
|
446
473
|
shapeInvertedBacklessPressed: string;
|
|
447
474
|
shapeInvertedDisabled: string;
|
|
475
|
+
shapeInvertedNeutralFaintAlpha: string;
|
|
476
|
+
shapeInvertedNeutralFaintAlphaHover: string;
|
|
477
|
+
shapeInvertedNeutralFaintAlphaPressed: string;
|
|
448
478
|
shapeInvertedNeutralHeavy: string;
|
|
449
479
|
shapeInvertedNeutralHeavyHover: string;
|
|
450
480
|
shapeInvertedNeutralHeavyPressed: string;
|
|
@@ -460,6 +490,12 @@ export declare const getDefaultTokens: (base: BaseTokens) => {
|
|
|
460
490
|
shapeConstBacklessWhitePressed: string;
|
|
461
491
|
shapeConstDisabledBlack: string;
|
|
462
492
|
shapeConstDisabledWhite: string;
|
|
493
|
+
shapeConstFaintBlack: string;
|
|
494
|
+
shapeConstFaintBlackHover: string;
|
|
495
|
+
shapeConstFaintBlackPressed: string;
|
|
496
|
+
shapeConstFaintWhite: string;
|
|
497
|
+
shapeConstFaintWhiteHover: string;
|
|
498
|
+
shapeConstFaintWhitePressed: string;
|
|
463
499
|
shapeConstHeavyBlack: string;
|
|
464
500
|
shapeConstHeavyBlackHover: string;
|
|
465
501
|
shapeConstHeavyBlackPressed: string;
|
|
@@ -496,10 +532,10 @@ export declare const getDefaultTokens: (base: BaseTokens) => {
|
|
|
496
532
|
lineNeutralPale: string;
|
|
497
533
|
lineNeutralPaleHover: string;
|
|
498
534
|
lineNeutralPalePressed: string;
|
|
499
|
-
|
|
500
|
-
|
|
501
|
-
|
|
502
|
-
|
|
535
|
+
lineOnAccentBoldFaint: string;
|
|
536
|
+
lineOnAccentBoldPale: string;
|
|
537
|
+
lineOnBrandOriginalFaint: string;
|
|
538
|
+
lineOnBrandOriginalPale: string;
|
|
503
539
|
lineSuccessBold: string;
|
|
504
540
|
lineSuccessBoldHover: string;
|
|
505
541
|
lineSuccessBoldPressed: string;
|
|
@@ -543,8 +579,10 @@ export declare const getDefaultTokens: (base: BaseTokens) => {
|
|
|
543
579
|
illustrationBlack: string;
|
|
544
580
|
illustrationBrand: string;
|
|
545
581
|
illustrationComplement: string;
|
|
582
|
+
illustrationInvertedNeutral: string;
|
|
583
|
+
illustrationNeutral: string;
|
|
546
584
|
illustrationOnBrand: string;
|
|
547
|
-
|
|
585
|
+
illustrationOnComplement: string;
|
|
548
586
|
illustrationPromo: string;
|
|
549
587
|
illustrationSymbol: string;
|
|
550
588
|
illustrationWhite: string;
|