@atlaskit/tokens 0.6.3 → 0.7.2
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/CHANGELOG.md +38 -0
- package/css/atlassian-dark.css +45 -3
- package/css/atlassian-light.css +43 -1
- package/dist/cjs/artifacts/rename-mapping.js +78 -14
- package/dist/cjs/artifacts/token-default-values.js +43 -1
- package/dist/cjs/artifacts/token-names.js +42 -0
- package/dist/cjs/artifacts/tokens-raw/atlassian-dark.js +1009 -179
- package/dist/cjs/artifacts/tokens-raw/atlassian-light.js +1007 -177
- package/dist/cjs/figma/synchronize-figma-tokens.js +34 -9
- package/dist/cjs/get-token.js +1 -1
- package/dist/cjs/tokens/atlassian-dark/color/accent.js +120 -32
- package/dist/cjs/tokens/atlassian-dark/color/background.js +11 -1
- package/dist/cjs/tokens/atlassian-dark/deprecated/deprecated.js +69 -3
- package/dist/cjs/tokens/atlassian-light/color/accent.js +112 -24
- package/dist/cjs/tokens/atlassian-light/color/background.js +11 -1
- package/dist/cjs/tokens/atlassian-light/deprecated/deprecated.js +66 -0
- package/dist/cjs/tokens/atlassian-light/elevation/surface.js +1 -1
- package/dist/cjs/tokens/default/color/accent.js +234 -50
- package/dist/cjs/tokens/default/color/background.js +20 -4
- package/dist/cjs/tokens/default/deprecated/deprecated.js +160 -14
- package/dist/cjs/version.json +1 -1
- package/dist/es2019/artifacts/rename-mapping.js +78 -14
- package/dist/es2019/artifacts/token-default-values.js +43 -1
- package/dist/es2019/artifacts/token-names.js +42 -0
- package/dist/es2019/artifacts/tokens-raw/atlassian-dark.js +1009 -179
- package/dist/es2019/artifacts/tokens-raw/atlassian-light.js +1007 -177
- package/dist/es2019/figma/synchronize-figma-tokens.js +32 -9
- package/dist/es2019/get-token.js +1 -1
- package/dist/es2019/tokens/atlassian-dark/color/accent.js +120 -32
- package/dist/es2019/tokens/atlassian-dark/color/background.js +11 -1
- package/dist/es2019/tokens/atlassian-dark/deprecated/deprecated.js +69 -3
- package/dist/es2019/tokens/atlassian-light/color/accent.js +112 -24
- package/dist/es2019/tokens/atlassian-light/color/background.js +11 -1
- package/dist/es2019/tokens/atlassian-light/deprecated/deprecated.js +66 -0
- package/dist/es2019/tokens/atlassian-light/elevation/surface.js +1 -1
- package/dist/es2019/tokens/default/color/accent.js +234 -50
- package/dist/es2019/tokens/default/color/background.js +20 -4
- package/dist/es2019/tokens/default/deprecated/deprecated.js +160 -14
- package/dist/es2019/version.json +1 -1
- package/dist/esm/artifacts/rename-mapping.js +78 -14
- package/dist/esm/artifacts/token-default-values.js +43 -1
- package/dist/esm/artifacts/token-names.js +42 -0
- package/dist/esm/artifacts/tokens-raw/atlassian-dark.js +1009 -179
- package/dist/esm/artifacts/tokens-raw/atlassian-light.js +1007 -177
- package/dist/esm/figma/synchronize-figma-tokens.js +34 -9
- package/dist/esm/get-token.js +1 -1
- package/dist/esm/tokens/atlassian-dark/color/accent.js +120 -32
- package/dist/esm/tokens/atlassian-dark/color/background.js +11 -1
- package/dist/esm/tokens/atlassian-dark/deprecated/deprecated.js +69 -3
- package/dist/esm/tokens/atlassian-light/color/accent.js +112 -24
- package/dist/esm/tokens/atlassian-light/color/background.js +11 -1
- package/dist/esm/tokens/atlassian-light/deprecated/deprecated.js +66 -0
- package/dist/esm/tokens/atlassian-light/elevation/surface.js +1 -1
- package/dist/esm/tokens/default/color/accent.js +234 -50
- package/dist/esm/tokens/default/color/background.js +20 -4
- package/dist/esm/tokens/default/deprecated/deprecated.js +160 -14
- package/dist/esm/version.json +1 -1
- package/dist/types/artifacts/token-default-values.d.ts +43 -1
- package/dist/types/artifacts/token-names.d.ts +84 -0
- package/dist/types/artifacts/types-internal.d.ts +1 -1
- package/dist/types/artifacts/types.d.ts +1 -1
- package/dist/types/figma/synchronize-figma-tokens.d.ts +9 -1
- package/dist/types/tokens/default/utility/utility.d.ts +10 -10
- package/dist/types/types.d.ts +103 -25
- package/package.json +1 -1
|
@@ -5,7 +5,7 @@ const color = {
|
|
|
5
5
|
attributes: {
|
|
6
6
|
group: 'paint',
|
|
7
7
|
state: 'deprecated',
|
|
8
|
-
replacement: 'color.background.accent.blue.
|
|
8
|
+
replacement: 'color.background.accent.blue.bolder',
|
|
9
9
|
description: 'Use for blue backgrounds of stronger emphasis when there is no meaning tied to the color, such as bold tags.'
|
|
10
10
|
}
|
|
11
11
|
},
|
|
@@ -13,7 +13,7 @@ const color = {
|
|
|
13
13
|
attributes: {
|
|
14
14
|
group: 'paint',
|
|
15
15
|
state: 'deprecated',
|
|
16
|
-
replacement: 'color.background.accent.green.
|
|
16
|
+
replacement: 'color.background.accent.green.bolder',
|
|
17
17
|
description: 'Use for green backgrounds of stronger emphasis when there is no meaning tied to the color, such as bold tags.'
|
|
18
18
|
}
|
|
19
19
|
},
|
|
@@ -21,7 +21,7 @@ const color = {
|
|
|
21
21
|
attributes: {
|
|
22
22
|
group: 'paint',
|
|
23
23
|
state: 'deprecated',
|
|
24
|
-
replacement: 'color.background.accent.orange.
|
|
24
|
+
replacement: 'color.background.accent.orange.bolder',
|
|
25
25
|
description: 'Use for orange backgrounds of stronger emphasis when there is no meaning tied to the color, such as bold tags.'
|
|
26
26
|
}
|
|
27
27
|
},
|
|
@@ -29,7 +29,7 @@ const color = {
|
|
|
29
29
|
attributes: {
|
|
30
30
|
group: 'paint',
|
|
31
31
|
state: 'deprecated',
|
|
32
|
-
replacement: 'color.background.accent.purple.
|
|
32
|
+
replacement: 'color.background.accent.purple.bolder',
|
|
33
33
|
description: 'Use for purple backgrounds of stronger emphasis when there is no meaning tied to the color, such as bold tags.'
|
|
34
34
|
}
|
|
35
35
|
},
|
|
@@ -37,7 +37,7 @@ const color = {
|
|
|
37
37
|
attributes: {
|
|
38
38
|
group: 'paint',
|
|
39
39
|
state: 'deprecated',
|
|
40
|
-
replacement: 'color.background.accent.red.
|
|
40
|
+
replacement: 'color.background.accent.red.bolder',
|
|
41
41
|
description: 'Use for red backgrounds of stronger emphasis when there is no meaning tied to the color, such as bold tags.'
|
|
42
42
|
}
|
|
43
43
|
},
|
|
@@ -45,7 +45,7 @@ const color = {
|
|
|
45
45
|
attributes: {
|
|
46
46
|
group: 'paint',
|
|
47
47
|
state: 'deprecated',
|
|
48
|
-
replacement: 'color.background.accent.teal.
|
|
48
|
+
replacement: 'color.background.accent.teal.bolder',
|
|
49
49
|
description: 'Use for teal backgrounds of stronger emphasis when there is no meaning tied to the color, such as bold tags.'
|
|
50
50
|
}
|
|
51
51
|
},
|
|
@@ -53,7 +53,7 @@ const color = {
|
|
|
53
53
|
attributes: {
|
|
54
54
|
group: 'paint',
|
|
55
55
|
state: 'deprecated',
|
|
56
|
-
replacement: 'color.background.accent.blue.
|
|
56
|
+
replacement: 'color.background.accent.blue.subtler',
|
|
57
57
|
description: 'Use for blue subdued backgrounds when there is no meaning tied to the color, such as colored tags.'
|
|
58
58
|
}
|
|
59
59
|
},
|
|
@@ -61,7 +61,7 @@ const color = {
|
|
|
61
61
|
attributes: {
|
|
62
62
|
group: 'paint',
|
|
63
63
|
state: 'deprecated',
|
|
64
|
-
replacement: 'color.background.accent.green.
|
|
64
|
+
replacement: 'color.background.accent.green.subtler',
|
|
65
65
|
description: 'Use for green subdued backgrounds when there is no meaning tied to the color, such as colored tags.'
|
|
66
66
|
}
|
|
67
67
|
},
|
|
@@ -69,7 +69,7 @@ const color = {
|
|
|
69
69
|
attributes: {
|
|
70
70
|
group: 'paint',
|
|
71
71
|
state: 'deprecated',
|
|
72
|
-
replacement: 'color.background.accent.magenta.
|
|
72
|
+
replacement: 'color.background.accent.magenta.subtler',
|
|
73
73
|
description: 'Use for magenta subdued backgrounds when there is no meaning tied to the color, such as colored tags.'
|
|
74
74
|
}
|
|
75
75
|
},
|
|
@@ -77,7 +77,7 @@ const color = {
|
|
|
77
77
|
attributes: {
|
|
78
78
|
group: 'paint',
|
|
79
79
|
state: 'deprecated',
|
|
80
|
-
replacement: 'color.background.accent.orange.
|
|
80
|
+
replacement: 'color.background.accent.orange.subtler',
|
|
81
81
|
description: 'Use for orange subdued backgrounds when there is no meaning tied to the color, such as colored tags.'
|
|
82
82
|
}
|
|
83
83
|
},
|
|
@@ -85,7 +85,7 @@ const color = {
|
|
|
85
85
|
attributes: {
|
|
86
86
|
group: 'paint',
|
|
87
87
|
state: 'deprecated',
|
|
88
|
-
replacement: 'color.background.accent.purple.
|
|
88
|
+
replacement: 'color.background.accent.purple.subtler',
|
|
89
89
|
description: 'Use for purple subdued backgrounds when there is no meaning tied to the color, such as colored tags.'
|
|
90
90
|
}
|
|
91
91
|
},
|
|
@@ -93,7 +93,7 @@ const color = {
|
|
|
93
93
|
attributes: {
|
|
94
94
|
group: 'paint',
|
|
95
95
|
state: 'deprecated',
|
|
96
|
-
replacement: 'color.background.accent.red.
|
|
96
|
+
replacement: 'color.background.accent.red.subtler',
|
|
97
97
|
description: 'Use for red subdued backgrounds when there is no meaning tied to the color, such as colored tags.'
|
|
98
98
|
}
|
|
99
99
|
},
|
|
@@ -101,17 +101,163 @@ const color = {
|
|
|
101
101
|
attributes: {
|
|
102
102
|
group: 'paint',
|
|
103
103
|
state: 'deprecated',
|
|
104
|
-
replacement: 'color.background.accent.teal.
|
|
104
|
+
replacement: 'color.background.accent.teal.subtler',
|
|
105
105
|
description: 'Use for teal subdued backgrounds when there is no meaning tied to the color, such as colored tags.'
|
|
106
106
|
}
|
|
107
107
|
}
|
|
108
108
|
},
|
|
109
109
|
background: {
|
|
110
|
+
accent: {
|
|
111
|
+
blue: {
|
|
112
|
+
'[default]': {
|
|
113
|
+
attributes: {
|
|
114
|
+
group: 'paint',
|
|
115
|
+
state: 'deprecated',
|
|
116
|
+
replacement: 'color.background.accent.blue.subtler',
|
|
117
|
+
description: 'Use for blue backgrounds when there is no meaning tied to the color, such as coloured tags.'
|
|
118
|
+
}
|
|
119
|
+
},
|
|
120
|
+
bold: {
|
|
121
|
+
attributes: {
|
|
122
|
+
group: 'paint',
|
|
123
|
+
state: 'deprecated',
|
|
124
|
+
replacement: 'color.background.accent.blue.subtle',
|
|
125
|
+
description: 'Use for blue backgrounds when there is no meaning tied to the color, and the background needs to pass min 3:1 contrast requirements.'
|
|
126
|
+
}
|
|
127
|
+
}
|
|
128
|
+
},
|
|
129
|
+
red: {
|
|
130
|
+
'[default]': {
|
|
131
|
+
attributes: {
|
|
132
|
+
group: 'paint',
|
|
133
|
+
state: 'deprecated',
|
|
134
|
+
replacement: 'color.background.accent.red.subtler',
|
|
135
|
+
description: 'Use for red backgrounds when there is no meaning tied to the color, such as colored tags.'
|
|
136
|
+
}
|
|
137
|
+
},
|
|
138
|
+
bold: {
|
|
139
|
+
attributes: {
|
|
140
|
+
group: 'paint',
|
|
141
|
+
state: 'deprecated',
|
|
142
|
+
replacement: 'color.background.accent.red.subtle',
|
|
143
|
+
description: 'Use for red backgrounds when there is no meaning tied to the color, and the background needs to pass min 3:1 contrast requirements.'
|
|
144
|
+
}
|
|
145
|
+
}
|
|
146
|
+
},
|
|
147
|
+
orange: {
|
|
148
|
+
'[default]': {
|
|
149
|
+
attributes: {
|
|
150
|
+
group: 'paint',
|
|
151
|
+
state: 'deprecated',
|
|
152
|
+
replacement: 'color.background.accent.orange.subtler',
|
|
153
|
+
description: 'Use for orange backgrounds when there is no meaning tied to the color, such as colored tags.'
|
|
154
|
+
}
|
|
155
|
+
},
|
|
156
|
+
bold: {
|
|
157
|
+
attributes: {
|
|
158
|
+
group: 'paint',
|
|
159
|
+
state: 'deprecated',
|
|
160
|
+
replacement: 'color.background.accent.orange.subtle',
|
|
161
|
+
description: 'Use for orange backgrounds when there is no meaning tied to the color, and the background needs to pass min 3:1 contrast requirements.'
|
|
162
|
+
}
|
|
163
|
+
}
|
|
164
|
+
},
|
|
165
|
+
yellow: {
|
|
166
|
+
'[default]': {
|
|
167
|
+
attributes: {
|
|
168
|
+
group: 'paint',
|
|
169
|
+
state: 'deprecated',
|
|
170
|
+
replacement: 'color.background.accent.yellow.subtler',
|
|
171
|
+
description: 'Use for yellow backgrounds when there is no meaning tied to the color, such as colored tags.'
|
|
172
|
+
}
|
|
173
|
+
},
|
|
174
|
+
bold: {
|
|
175
|
+
attributes: {
|
|
176
|
+
group: 'paint',
|
|
177
|
+
state: 'deprecated',
|
|
178
|
+
replacement: 'color.background.accent.yellow.subtle',
|
|
179
|
+
description: 'Use for yellow backgrounds when there is no meaning tied to the color, and the background needs to pass min 3:1 contrast requirements.'
|
|
180
|
+
}
|
|
181
|
+
}
|
|
182
|
+
},
|
|
183
|
+
green: {
|
|
184
|
+
'[default]': {
|
|
185
|
+
attributes: {
|
|
186
|
+
group: 'paint',
|
|
187
|
+
state: 'deprecated',
|
|
188
|
+
replacement: 'color.background.accent.green.subtler',
|
|
189
|
+
description: 'Use for green backgrounds when there is no meaning tied to the color, such as colored tags.'
|
|
190
|
+
}
|
|
191
|
+
},
|
|
192
|
+
bold: {
|
|
193
|
+
attributes: {
|
|
194
|
+
group: 'paint',
|
|
195
|
+
state: 'deprecated',
|
|
196
|
+
replacement: 'color.background.accent.green.subtle',
|
|
197
|
+
description: 'Use for green backgrounds when there is no meaning tied to the color, and the background needs to pass min 3:1 contrast requirements.'
|
|
198
|
+
}
|
|
199
|
+
}
|
|
200
|
+
},
|
|
201
|
+
teal: {
|
|
202
|
+
'[default]': {
|
|
203
|
+
attributes: {
|
|
204
|
+
group: 'paint',
|
|
205
|
+
state: 'deprecated',
|
|
206
|
+
replacement: 'color.background.accent.teal.subtler',
|
|
207
|
+
description: 'Use for teal backgrounds when there is no meaning tied to the color, such as colored tags.'
|
|
208
|
+
}
|
|
209
|
+
},
|
|
210
|
+
bold: {
|
|
211
|
+
attributes: {
|
|
212
|
+
group: 'paint',
|
|
213
|
+
state: 'deprecated',
|
|
214
|
+
replacement: 'color.background.accent.teal.subtle',
|
|
215
|
+
description: 'Use for teal backgrounds when there is no meaning tied to the color, and the background needs to pass min 3:1 contrast requirements.'
|
|
216
|
+
}
|
|
217
|
+
}
|
|
218
|
+
},
|
|
219
|
+
purple: {
|
|
220
|
+
'[default]': {
|
|
221
|
+
attributes: {
|
|
222
|
+
group: 'paint',
|
|
223
|
+
state: 'deprecated',
|
|
224
|
+
replacement: 'color.background.accent.purple.subtler',
|
|
225
|
+
description: 'Use for purple backgrounds when there is no meaning tied to the color, such as colored tags.'
|
|
226
|
+
}
|
|
227
|
+
},
|
|
228
|
+
bold: {
|
|
229
|
+
attributes: {
|
|
230
|
+
group: 'paint',
|
|
231
|
+
state: 'deprecated',
|
|
232
|
+
replacement: 'color.background.accent.purple.subtle',
|
|
233
|
+
description: 'Use for purple backgrounds when there is no meaning tied to the color, and the background needs to pass min 3:1 contrast requirements.'
|
|
234
|
+
}
|
|
235
|
+
}
|
|
236
|
+
},
|
|
237
|
+
magenta: {
|
|
238
|
+
'[default]': {
|
|
239
|
+
attributes: {
|
|
240
|
+
group: 'paint',
|
|
241
|
+
state: 'deprecated',
|
|
242
|
+
replacement: 'color.background.accent.magenta.subtler',
|
|
243
|
+
description: 'Use for magenta backgrounds when there is no meaning tied to the color, such as colored tags.'
|
|
244
|
+
}
|
|
245
|
+
},
|
|
246
|
+
bold: {
|
|
247
|
+
attributes: {
|
|
248
|
+
group: 'paint',
|
|
249
|
+
state: 'deprecated',
|
|
250
|
+
replacement: 'color.background.accent.magenta.subtle',
|
|
251
|
+
description: 'Use for magenta backgrounds when there is no meaning tied to the color, and the background needs to pass min 3:1 contrast requirements.'
|
|
252
|
+
}
|
|
253
|
+
}
|
|
254
|
+
}
|
|
255
|
+
},
|
|
110
256
|
blanket: {
|
|
111
257
|
attributes: {
|
|
112
258
|
group: 'paint',
|
|
113
259
|
state: 'deprecated',
|
|
114
|
-
replacement: 'color.blanket',
|
|
260
|
+
replacement: 'color.blanket.[default]',
|
|
115
261
|
description: 'Use for the screen overlay that appears with modal dialogs'
|
|
116
262
|
}
|
|
117
263
|
},
|
package/dist/es2019/version.json
CHANGED
|
@@ -48,6 +48,70 @@ var renameMapper = [{
|
|
|
48
48
|
"path": "color.border.neutral",
|
|
49
49
|
"state": "deprecated",
|
|
50
50
|
"replacement": "color.border.[default]"
|
|
51
|
+
}, {
|
|
52
|
+
"path": "color.background.accent.blue.[default]",
|
|
53
|
+
"state": "deprecated",
|
|
54
|
+
"replacement": "color.background.accent.blue.subtler"
|
|
55
|
+
}, {
|
|
56
|
+
"path": "color.background.accent.blue.bold",
|
|
57
|
+
"state": "deprecated",
|
|
58
|
+
"replacement": "color.background.accent.blue.subtle"
|
|
59
|
+
}, {
|
|
60
|
+
"path": "color.background.accent.red.[default]",
|
|
61
|
+
"state": "deprecated",
|
|
62
|
+
"replacement": "color.background.accent.red.subtler"
|
|
63
|
+
}, {
|
|
64
|
+
"path": "color.background.accent.red.bold",
|
|
65
|
+
"state": "deprecated",
|
|
66
|
+
"replacement": "color.background.accent.red.subtle"
|
|
67
|
+
}, {
|
|
68
|
+
"path": "color.background.accent.orange.[default]",
|
|
69
|
+
"state": "deprecated",
|
|
70
|
+
"replacement": "color.background.accent.orange.subtler"
|
|
71
|
+
}, {
|
|
72
|
+
"path": "color.background.accent.orange.bold",
|
|
73
|
+
"state": "deprecated",
|
|
74
|
+
"replacement": "color.background.accent.orange.subtle"
|
|
75
|
+
}, {
|
|
76
|
+
"path": "color.background.accent.yellow.[default]",
|
|
77
|
+
"state": "deprecated",
|
|
78
|
+
"replacement": "color.background.accent.yellow.subtler"
|
|
79
|
+
}, {
|
|
80
|
+
"path": "color.background.accent.yellow.bold",
|
|
81
|
+
"state": "deprecated",
|
|
82
|
+
"replacement": "color.background.accent.yellow.subtle"
|
|
83
|
+
}, {
|
|
84
|
+
"path": "color.background.accent.green.[default]",
|
|
85
|
+
"state": "deprecated",
|
|
86
|
+
"replacement": "color.background.accent.green.subtler"
|
|
87
|
+
}, {
|
|
88
|
+
"path": "color.background.accent.green.bold",
|
|
89
|
+
"state": "deprecated",
|
|
90
|
+
"replacement": "color.background.accent.green.subtle"
|
|
91
|
+
}, {
|
|
92
|
+
"path": "color.background.accent.teal.[default]",
|
|
93
|
+
"state": "deprecated",
|
|
94
|
+
"replacement": "color.background.accent.teal.subtler"
|
|
95
|
+
}, {
|
|
96
|
+
"path": "color.background.accent.teal.bold",
|
|
97
|
+
"state": "deprecated",
|
|
98
|
+
"replacement": "color.background.accent.teal.subtle"
|
|
99
|
+
}, {
|
|
100
|
+
"path": "color.background.accent.purple.[default]",
|
|
101
|
+
"state": "deprecated",
|
|
102
|
+
"replacement": "color.background.accent.purple.subtler"
|
|
103
|
+
}, {
|
|
104
|
+
"path": "color.background.accent.purple.bold",
|
|
105
|
+
"state": "deprecated",
|
|
106
|
+
"replacement": "color.background.accent.purple.subtle"
|
|
107
|
+
}, {
|
|
108
|
+
"path": "color.background.accent.magenta.[default]",
|
|
109
|
+
"state": "deprecated",
|
|
110
|
+
"replacement": "color.background.accent.magenta.subtler"
|
|
111
|
+
}, {
|
|
112
|
+
"path": "color.background.accent.magenta.bold",
|
|
113
|
+
"state": "deprecated",
|
|
114
|
+
"replacement": "color.background.accent.magenta.subtle"
|
|
51
115
|
}, {
|
|
52
116
|
"path": "color.background.brand.[default].[default]",
|
|
53
117
|
"state": "deprecated",
|
|
@@ -71,7 +135,7 @@ var renameMapper = [{
|
|
|
71
135
|
}, {
|
|
72
136
|
"path": "color.background.blanket",
|
|
73
137
|
"state": "deprecated",
|
|
74
|
-
"replacement": "color.blanket"
|
|
138
|
+
"replacement": "color.blanket.[default]"
|
|
75
139
|
}, {
|
|
76
140
|
"path": "color.background.boldBrand.hover",
|
|
77
141
|
"state": "deprecated",
|
|
@@ -251,55 +315,55 @@ var renameMapper = [{
|
|
|
251
315
|
}, {
|
|
252
316
|
"path": "color.accent.boldBlue",
|
|
253
317
|
"state": "deprecated",
|
|
254
|
-
"replacement": "color.background.accent.blue.
|
|
318
|
+
"replacement": "color.background.accent.blue.bolder"
|
|
255
319
|
}, {
|
|
256
320
|
"path": "color.accent.boldGreen",
|
|
257
321
|
"state": "deprecated",
|
|
258
|
-
"replacement": "color.background.accent.green.
|
|
322
|
+
"replacement": "color.background.accent.green.bolder"
|
|
259
323
|
}, {
|
|
260
324
|
"path": "color.accent.boldOrange",
|
|
261
325
|
"state": "deprecated",
|
|
262
|
-
"replacement": "color.background.accent.orange.
|
|
326
|
+
"replacement": "color.background.accent.orange.bolder"
|
|
263
327
|
}, {
|
|
264
328
|
"path": "color.accent.boldPurple",
|
|
265
329
|
"state": "deprecated",
|
|
266
|
-
"replacement": "color.background.accent.purple.
|
|
330
|
+
"replacement": "color.background.accent.purple.bolder"
|
|
267
331
|
}, {
|
|
268
332
|
"path": "color.accent.boldRed",
|
|
269
333
|
"state": "deprecated",
|
|
270
|
-
"replacement": "color.background.accent.red.
|
|
334
|
+
"replacement": "color.background.accent.red.bolder"
|
|
271
335
|
}, {
|
|
272
336
|
"path": "color.accent.boldTeal",
|
|
273
337
|
"state": "deprecated",
|
|
274
|
-
"replacement": "color.background.accent.teal.
|
|
338
|
+
"replacement": "color.background.accent.teal.bolder"
|
|
275
339
|
}, {
|
|
276
340
|
"path": "color.accent.subtleBlue",
|
|
277
341
|
"state": "deprecated",
|
|
278
|
-
"replacement": "color.background.accent.blue.
|
|
342
|
+
"replacement": "color.background.accent.blue.subtler"
|
|
279
343
|
}, {
|
|
280
344
|
"path": "color.accent.subtleGreen",
|
|
281
345
|
"state": "deprecated",
|
|
282
|
-
"replacement": "color.background.accent.green.
|
|
346
|
+
"replacement": "color.background.accent.green.subtler"
|
|
283
347
|
}, {
|
|
284
348
|
"path": "color.accent.subtleMagenta",
|
|
285
349
|
"state": "deprecated",
|
|
286
|
-
"replacement": "color.background.accent.magenta.
|
|
350
|
+
"replacement": "color.background.accent.magenta.subtler"
|
|
287
351
|
}, {
|
|
288
352
|
"path": "color.accent.subtleOrange",
|
|
289
353
|
"state": "deprecated",
|
|
290
|
-
"replacement": "color.background.accent.orange.
|
|
354
|
+
"replacement": "color.background.accent.orange.subtler"
|
|
291
355
|
}, {
|
|
292
356
|
"path": "color.accent.subtlePurple",
|
|
293
357
|
"state": "deprecated",
|
|
294
|
-
"replacement": "color.background.accent.purple.
|
|
358
|
+
"replacement": "color.background.accent.purple.subtler"
|
|
295
359
|
}, {
|
|
296
360
|
"path": "color.accent.subtleRed",
|
|
297
361
|
"state": "deprecated",
|
|
298
|
-
"replacement": "color.background.accent.red.
|
|
362
|
+
"replacement": "color.background.accent.red.subtler"
|
|
299
363
|
}, {
|
|
300
364
|
"path": "color.accent.subtleTeal",
|
|
301
365
|
"state": "deprecated",
|
|
302
|
-
"replacement": "color.background.accent.teal.
|
|
366
|
+
"replacement": "color.background.accent.teal.subtler"
|
|
303
367
|
}, {
|
|
304
368
|
"path": "color.iconBorder.brand",
|
|
305
369
|
"state": "deprecated",
|
|
@@ -6,13 +6,21 @@
|
|
|
6
6
|
*/
|
|
7
7
|
var defaultTokenValues = {
|
|
8
8
|
'color.text.accent.blue': '#0055CC',
|
|
9
|
+
'color.text.accent.blue.bolder': '#09326C',
|
|
9
10
|
'color.text.accent.red': '#AE2A19',
|
|
11
|
+
'color.text.accent.red.bolder': '#601E16',
|
|
10
12
|
'color.text.accent.orange': '#974F0C',
|
|
13
|
+
'color.text.accent.orange.bolder': '#5F3811',
|
|
11
14
|
'color.text.accent.yellow': '#7F5F01',
|
|
15
|
+
'color.text.accent.yellow.bolder': '#533F04',
|
|
12
16
|
'color.text.accent.green': '#216E4E',
|
|
17
|
+
'color.text.accent.green.bolder': '#164B35',
|
|
13
18
|
'color.text.accent.purple': '#5E4DB2',
|
|
19
|
+
'color.text.accent.purple.bolder': '#352C63',
|
|
14
20
|
'color.text.accent.teal': '#206B74',
|
|
21
|
+
'color.text.accent.teal.bolder': '#1D474C',
|
|
15
22
|
'color.text.accent.magenta': '#943D73',
|
|
23
|
+
'color.text.accent.magenta.bolder': '#50253F',
|
|
16
24
|
'color.text': '#172B4D',
|
|
17
25
|
'color.text.subtle': '#44546F',
|
|
18
26
|
'color.text.subtlest': '#626F86',
|
|
@@ -74,20 +82,52 @@ var defaultTokenValues = {
|
|
|
74
82
|
'color.border.information': '#1D7AFC',
|
|
75
83
|
'color.border.focus': '#388BFF',
|
|
76
84
|
'color.border.neutral': '#091E4224',
|
|
85
|
+
'color.background.accent.blue.subtlest': '#E9F2FF',
|
|
86
|
+
'color.background.accent.blue.subtler': '#CCE0FF',
|
|
87
|
+
'color.background.accent.blue.subtle': '#579DFF',
|
|
88
|
+
'color.background.accent.blue.bolder': '#0C66E4',
|
|
77
89
|
'color.background.accent.blue': '#CCE0FF',
|
|
78
90
|
'color.background.accent.blue.bold': '#579DFF',
|
|
91
|
+
'color.background.accent.red.subtlest': '#FFEDEB',
|
|
92
|
+
'color.background.accent.red.subtler': '#FFD2CC',
|
|
93
|
+
'color.background.accent.red.subtle': '#F87462',
|
|
94
|
+
'color.background.accent.red.bolder': '#CA3521',
|
|
79
95
|
'color.background.accent.red': '#FFD2CC',
|
|
80
96
|
'color.background.accent.red.bold': '#F87462',
|
|
97
|
+
'color.background.accent.orange.subtlest': '#FFF4E5',
|
|
98
|
+
'color.background.accent.orange.subtler': '#FFE2BD',
|
|
99
|
+
'color.background.accent.orange.subtle': '#FAA53D',
|
|
100
|
+
'color.background.accent.orange.bolder': '#B65C02',
|
|
81
101
|
'color.background.accent.orange': '#FFE2BD',
|
|
82
102
|
'color.background.accent.orange.bold': '#FAA53D',
|
|
103
|
+
'color.background.accent.yellow.subtlest': '#FFF7D6',
|
|
104
|
+
'color.background.accent.yellow.subtler': '#F8E6A0',
|
|
105
|
+
'color.background.accent.yellow.subtle': '#E2B203',
|
|
106
|
+
'color.background.accent.yellow.bolder': '#946F00',
|
|
83
107
|
'color.background.accent.yellow': '#F8E6A0',
|
|
84
108
|
'color.background.accent.yellow.bold': '#E2B203',
|
|
109
|
+
'color.background.accent.green.subtlest': '#DFFCF0',
|
|
110
|
+
'color.background.accent.green.subtler': '#BAF3DB',
|
|
111
|
+
'color.background.accent.green.subtle': '#4BCE97',
|
|
112
|
+
'color.background.accent.green.bolder': '#1F845A',
|
|
85
113
|
'color.background.accent.green': '#BAF3DB',
|
|
86
114
|
'color.background.accent.green.bold': '#4BCE97',
|
|
115
|
+
'color.background.accent.teal.subtlest': '#E3FAFC',
|
|
116
|
+
'color.background.accent.teal.subtler': '#C1F0F5',
|
|
117
|
+
'color.background.accent.teal.subtle': '#60C6D2',
|
|
118
|
+
'color.background.accent.teal.bolder': '#1D7F8C',
|
|
87
119
|
'color.background.accent.teal': '#C1F0F5',
|
|
88
120
|
'color.background.accent.teal.bold': '#60C6D2',
|
|
121
|
+
'color.background.accent.purple.subtlest': '#F3F0FF',
|
|
122
|
+
'color.background.accent.purple.subtler': '#DFD8FD',
|
|
123
|
+
'color.background.accent.purple.subtle': '#9F8FEF',
|
|
124
|
+
'color.background.accent.purple.bolder': '#6E5DC6',
|
|
89
125
|
'color.background.accent.purple': '#DFD8FD',
|
|
90
126
|
'color.background.accent.purple.bold': '#9F8FEF',
|
|
127
|
+
'color.background.accent.magenta.subtlest': '#FFECF8',
|
|
128
|
+
'color.background.accent.magenta.subtler': '#FDD0EC',
|
|
129
|
+
'color.background.accent.magenta.subtle': '#E774BB',
|
|
130
|
+
'color.background.accent.magenta.bolder': '#AE4787',
|
|
91
131
|
'color.background.accent.magenta': '#FDD0EC',
|
|
92
132
|
'color.background.accent.magenta.bold': '#E774BB',
|
|
93
133
|
'color.background.disabled': '#091E420F',
|
|
@@ -194,6 +234,8 @@ var defaultTokenValues = {
|
|
|
194
234
|
'color.background.transparentNeutral.hover': '#091E420F',
|
|
195
235
|
'color.background.transparentNeutral.pressed': '#091E4224',
|
|
196
236
|
'color.blanket': '#091E427A',
|
|
237
|
+
'color.blanket.selected': '#388BFFCC',
|
|
238
|
+
'color.blanket.danger': '#EF5C48CC',
|
|
197
239
|
'color.interaction.hovered': '#ffffff33',
|
|
198
240
|
'color.interaction.pressed': '#ffffff5c',
|
|
199
241
|
'color.interaction.inverse.hovered': '#00000029',
|
|
@@ -225,7 +267,7 @@ var defaultTokenValues = {
|
|
|
225
267
|
'elevation.shadow.raised': '0px 1px 1px #091E4240, 0px 0px 1px #091E424F',
|
|
226
268
|
'elevation.shadow.overlay': '0px 8px 12px #091E4226, 0px 0px 1px #091E424F',
|
|
227
269
|
'elevation.surface': '#FFFFFF',
|
|
228
|
-
'elevation.surface.sunken': '#
|
|
270
|
+
'elevation.surface.sunken': '#F7F8F9',
|
|
229
271
|
'elevation.surface.raised': '#FFFFFF',
|
|
230
272
|
'elevation.surface.overlay': '#FFFFFF',
|
|
231
273
|
'utility.UNSAFE_util.transparent': 'transparent',
|
|
@@ -2,13 +2,21 @@
|
|
|
2
2
|
// Re-generate by running `yarn build tokens`.
|
|
3
3
|
var tokens = {
|
|
4
4
|
'color.text.accent.blue': '--ds-text-accent-blue',
|
|
5
|
+
'color.text.accent.blue.bolder': '--ds-text-accent-blue-bolder',
|
|
5
6
|
'color.text.accent.red': '--ds-text-accent-red',
|
|
7
|
+
'color.text.accent.red.bolder': '--ds-text-accent-red-bolder',
|
|
6
8
|
'color.text.accent.orange': '--ds-text-accent-orange',
|
|
9
|
+
'color.text.accent.orange.bolder': '--ds-text-accent-orange-bolder',
|
|
7
10
|
'color.text.accent.yellow': '--ds-text-accent-yellow',
|
|
11
|
+
'color.text.accent.yellow.bolder': '--ds-text-accent-yellow-bolder',
|
|
8
12
|
'color.text.accent.green': '--ds-text-accent-green',
|
|
13
|
+
'color.text.accent.green.bolder': '--ds-text-accent-green-bolder',
|
|
9
14
|
'color.text.accent.purple': '--ds-text-accent-purple',
|
|
15
|
+
'color.text.accent.purple.bolder': '--ds-text-accent-purple-bolder',
|
|
10
16
|
'color.text.accent.teal': '--ds-text-accent-teal',
|
|
17
|
+
'color.text.accent.teal.bolder': '--ds-text-accent-teal-bolder',
|
|
11
18
|
'color.text.accent.magenta': '--ds-text-accent-magenta',
|
|
19
|
+
'color.text.accent.magenta.bolder': '--ds-text-accent-magenta-bolder',
|
|
12
20
|
'color.text': '--ds-text',
|
|
13
21
|
'color.text.subtle': '--ds-text-subtle',
|
|
14
22
|
'color.text.subtlest': '--ds-text-subtlest',
|
|
@@ -70,20 +78,52 @@ var tokens = {
|
|
|
70
78
|
'color.border.information': '--ds-border-information',
|
|
71
79
|
'color.border.focus': '--ds-border-focus',
|
|
72
80
|
'color.border.neutral': '--ds-border-neutral',
|
|
81
|
+
'color.background.accent.blue.subtlest': '--ds-background-accent-blue-subtlest',
|
|
82
|
+
'color.background.accent.blue.subtler': '--ds-background-accent-blue-subtler',
|
|
83
|
+
'color.background.accent.blue.subtle': '--ds-background-accent-blue-subtle',
|
|
84
|
+
'color.background.accent.blue.bolder': '--ds-background-accent-blue-bolder',
|
|
73
85
|
'color.background.accent.blue': '--ds-background-accent-blue',
|
|
74
86
|
'color.background.accent.blue.bold': '--ds-background-accent-blue-bold',
|
|
87
|
+
'color.background.accent.red.subtlest': '--ds-background-accent-red-subtlest',
|
|
88
|
+
'color.background.accent.red.subtler': '--ds-background-accent-red-subtler',
|
|
89
|
+
'color.background.accent.red.subtle': '--ds-background-accent-red-subtle',
|
|
90
|
+
'color.background.accent.red.bolder': '--ds-background-accent-red-bolder',
|
|
75
91
|
'color.background.accent.red': '--ds-background-accent-red',
|
|
76
92
|
'color.background.accent.red.bold': '--ds-background-accent-red-bold',
|
|
93
|
+
'color.background.accent.orange.subtlest': '--ds-background-accent-orange-subtlest',
|
|
94
|
+
'color.background.accent.orange.subtler': '--ds-background-accent-orange-subtler',
|
|
95
|
+
'color.background.accent.orange.subtle': '--ds-background-accent-orange-subtle',
|
|
96
|
+
'color.background.accent.orange.bolder': '--ds-background-accent-orange-bolder',
|
|
77
97
|
'color.background.accent.orange': '--ds-background-accent-orange',
|
|
78
98
|
'color.background.accent.orange.bold': '--ds-background-accent-orange-bold',
|
|
99
|
+
'color.background.accent.yellow.subtlest': '--ds-background-accent-yellow-subtlest',
|
|
100
|
+
'color.background.accent.yellow.subtler': '--ds-background-accent-yellow-subtler',
|
|
101
|
+
'color.background.accent.yellow.subtle': '--ds-background-accent-yellow-subtle',
|
|
102
|
+
'color.background.accent.yellow.bolder': '--ds-background-accent-yellow-bolder',
|
|
79
103
|
'color.background.accent.yellow': '--ds-background-accent-yellow',
|
|
80
104
|
'color.background.accent.yellow.bold': '--ds-background-accent-yellow-bold',
|
|
105
|
+
'color.background.accent.green.subtlest': '--ds-background-accent-green-subtlest',
|
|
106
|
+
'color.background.accent.green.subtler': '--ds-background-accent-green-subtler',
|
|
107
|
+
'color.background.accent.green.subtle': '--ds-background-accent-green-subtle',
|
|
108
|
+
'color.background.accent.green.bolder': '--ds-background-accent-green-bolder',
|
|
81
109
|
'color.background.accent.green': '--ds-background-accent-green',
|
|
82
110
|
'color.background.accent.green.bold': '--ds-background-accent-green-bold',
|
|
111
|
+
'color.background.accent.teal.subtlest': '--ds-background-accent-teal-subtlest',
|
|
112
|
+
'color.background.accent.teal.subtler': '--ds-background-accent-teal-subtler',
|
|
113
|
+
'color.background.accent.teal.subtle': '--ds-background-accent-teal-subtle',
|
|
114
|
+
'color.background.accent.teal.bolder': '--ds-background-accent-teal-bolder',
|
|
83
115
|
'color.background.accent.teal': '--ds-background-accent-teal',
|
|
84
116
|
'color.background.accent.teal.bold': '--ds-background-accent-teal-bold',
|
|
117
|
+
'color.background.accent.purple.subtlest': '--ds-background-accent-purple-subtlest',
|
|
118
|
+
'color.background.accent.purple.subtler': '--ds-background-accent-purple-subtler',
|
|
119
|
+
'color.background.accent.purple.subtle': '--ds-background-accent-purple-subtle',
|
|
120
|
+
'color.background.accent.purple.bolder': '--ds-background-accent-purple-bolder',
|
|
85
121
|
'color.background.accent.purple': '--ds-background-accent-purple',
|
|
86
122
|
'color.background.accent.purple.bold': '--ds-background-accent-purple-bold',
|
|
123
|
+
'color.background.accent.magenta.subtlest': '--ds-background-accent-magenta-subtlest',
|
|
124
|
+
'color.background.accent.magenta.subtler': '--ds-background-accent-magenta-subtler',
|
|
125
|
+
'color.background.accent.magenta.subtle': '--ds-background-accent-magenta-subtle',
|
|
126
|
+
'color.background.accent.magenta.bolder': '--ds-background-accent-magenta-bolder',
|
|
87
127
|
'color.background.accent.magenta': '--ds-background-accent-magenta',
|
|
88
128
|
'color.background.accent.magenta.bold': '--ds-background-accent-magenta-bold',
|
|
89
129
|
'color.background.disabled': '--ds-background-disabled',
|
|
@@ -190,6 +230,8 @@ var tokens = {
|
|
|
190
230
|
'color.background.transparentNeutral.hover': '--ds-background-transparentNeutral-hover',
|
|
191
231
|
'color.background.transparentNeutral.pressed': '--ds-background-transparentNeutral-pressed',
|
|
192
232
|
'color.blanket': '--ds-blanket',
|
|
233
|
+
'color.blanket.selected': '--ds-blanket-selected',
|
|
234
|
+
'color.blanket.danger': '--ds-blanket-danger',
|
|
193
235
|
'color.interaction.hovered': '--ds-interaction-hovered',
|
|
194
236
|
'color.interaction.pressed': '--ds-interaction-pressed',
|
|
195
237
|
'color.interaction.inverse.hovered': '--ds-interaction-inverse-hovered',
|