@atlaskit/tokens 0.8.2 → 0.9.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.
Files changed (86) hide show
  1. package/CHANGELOG.md +18 -0
  2. package/css/atlassian-dark.css +5 -1
  3. package/css/atlassian-light.css +5 -1
  4. package/dist/cjs/artifacts/rename-mapping.js +4 -0
  5. package/dist/cjs/artifacts/token-default-values.js +5 -1
  6. package/dist/cjs/artifacts/token-names.js +4 -0
  7. package/dist/cjs/artifacts/tokens-raw/atlassian-dark.js +638 -12
  8. package/dist/cjs/artifacts/tokens-raw/atlassian-light.js +636 -10
  9. package/dist/cjs/get-token.js +1 -1
  10. package/dist/cjs/tokens/atlassian-dark/color/background.js +14 -2
  11. package/dist/cjs/tokens/atlassian-dark/color/border.js +3 -0
  12. package/dist/cjs/tokens/atlassian-dark/deprecated/deprecated.js +6 -0
  13. package/dist/cjs/tokens/atlassian-light/color/background.js +14 -2
  14. package/dist/cjs/tokens/atlassian-light/color/border.js +3 -0
  15. package/dist/cjs/tokens/atlassian-light/deprecated/deprecated.js +6 -0
  16. package/dist/cjs/tokens/default/color/accent.js +65 -1
  17. package/dist/cjs/tokens/default/color/background.js +82 -6
  18. package/dist/cjs/tokens/default/color/border.js +19 -0
  19. package/dist/cjs/tokens/default/color/icon.js +13 -1
  20. package/dist/cjs/tokens/default/color/interaction.js +4 -0
  21. package/dist/cjs/tokens/default/color/skeleton.js +2 -0
  22. package/dist/cjs/tokens/default/color/text.js +15 -0
  23. package/dist/cjs/tokens/default/deprecated/deprecated.js +108 -0
  24. package/dist/cjs/tokens/default/elevation/shadow.js +3 -0
  25. package/dist/cjs/tokens/default/elevation/surface.js +4 -0
  26. package/dist/cjs/tokens/default/utility/utility.js +2 -0
  27. package/dist/cjs/version.json +1 -1
  28. package/dist/es2019/artifacts/rename-mapping.js +4 -0
  29. package/dist/es2019/artifacts/token-default-values.js +5 -1
  30. package/dist/es2019/artifacts/token-names.js +4 -0
  31. package/dist/es2019/artifacts/tokens-raw/atlassian-dark.js +638 -12
  32. package/dist/es2019/artifacts/tokens-raw/atlassian-light.js +636 -10
  33. package/dist/es2019/get-token.js +1 -1
  34. package/dist/es2019/tokens/atlassian-dark/color/background.js +14 -2
  35. package/dist/es2019/tokens/atlassian-dark/color/border.js +3 -0
  36. package/dist/es2019/tokens/atlassian-dark/deprecated/deprecated.js +6 -0
  37. package/dist/es2019/tokens/atlassian-light/color/background.js +14 -2
  38. package/dist/es2019/tokens/atlassian-light/color/border.js +3 -0
  39. package/dist/es2019/tokens/atlassian-light/deprecated/deprecated.js +6 -0
  40. package/dist/es2019/tokens/default/color/accent.js +65 -1
  41. package/dist/es2019/tokens/default/color/background.js +82 -6
  42. package/dist/es2019/tokens/default/color/border.js +19 -0
  43. package/dist/es2019/tokens/default/color/icon.js +13 -1
  44. package/dist/es2019/tokens/default/color/interaction.js +4 -0
  45. package/dist/es2019/tokens/default/color/skeleton.js +2 -0
  46. package/dist/es2019/tokens/default/color/text.js +15 -0
  47. package/dist/es2019/tokens/default/deprecated/deprecated.js +108 -0
  48. package/dist/es2019/tokens/default/elevation/shadow.js +3 -0
  49. package/dist/es2019/tokens/default/elevation/surface.js +4 -0
  50. package/dist/es2019/tokens/default/utility/utility.js +2 -0
  51. package/dist/es2019/version.json +1 -1
  52. package/dist/esm/artifacts/rename-mapping.js +4 -0
  53. package/dist/esm/artifacts/token-default-values.js +5 -1
  54. package/dist/esm/artifacts/token-names.js +4 -0
  55. package/dist/esm/artifacts/tokens-raw/atlassian-dark.js +638 -12
  56. package/dist/esm/artifacts/tokens-raw/atlassian-light.js +636 -10
  57. package/dist/esm/get-token.js +1 -1
  58. package/dist/esm/tokens/atlassian-dark/color/background.js +14 -2
  59. package/dist/esm/tokens/atlassian-dark/color/border.js +3 -0
  60. package/dist/esm/tokens/atlassian-dark/deprecated/deprecated.js +6 -0
  61. package/dist/esm/tokens/atlassian-light/color/background.js +14 -2
  62. package/dist/esm/tokens/atlassian-light/color/border.js +3 -0
  63. package/dist/esm/tokens/atlassian-light/deprecated/deprecated.js +6 -0
  64. package/dist/esm/tokens/default/color/accent.js +65 -1
  65. package/dist/esm/tokens/default/color/background.js +82 -6
  66. package/dist/esm/tokens/default/color/border.js +19 -0
  67. package/dist/esm/tokens/default/color/icon.js +13 -1
  68. package/dist/esm/tokens/default/color/interaction.js +4 -0
  69. package/dist/esm/tokens/default/color/skeleton.js +2 -0
  70. package/dist/esm/tokens/default/color/text.js +15 -0
  71. package/dist/esm/tokens/default/deprecated/deprecated.js +108 -0
  72. package/dist/esm/tokens/default/elevation/shadow.js +3 -0
  73. package/dist/esm/tokens/default/elevation/surface.js +4 -0
  74. package/dist/esm/tokens/default/utility/utility.js +2 -0
  75. package/dist/esm/version.json +1 -1
  76. package/dist/types/artifacts/token-default-values.d.ts +5 -1
  77. package/dist/types/artifacts/token-names.d.ts +8 -0
  78. package/dist/types/artifacts/tokens-raw/atlassian-dark.d.ts +8 -0
  79. package/dist/types/artifacts/tokens-raw/atlassian-light.d.ts +8 -0
  80. package/dist/types/artifacts/types-internal.d.ts +1 -1
  81. package/dist/types/artifacts/types.d.ts +1 -1
  82. package/dist/types/tokens/atlassian-dark/utility/utility.d.ts +2 -10
  83. package/dist/types/tokens/atlassian-light/utility/utility.d.ts +2 -10
  84. package/dist/types/tokens/default/utility/utility.d.ts +2 -138
  85. package/dist/types/types.d.ts +13 -1
  86. package/package.json +6 -2
@@ -5,6 +5,7 @@ var color = {
5
5
  attributes: {
6
6
  group: 'paint',
7
7
  state: 'deleted',
8
+ introduced: '0.1.1',
8
9
  replacement: 'color.background.accent.blue.bolder',
9
10
  description: 'Use for blue backgrounds of stronger emphasis when there is no meaning tied to the color, such as bold tags.'
10
11
  }
@@ -13,6 +14,7 @@ var color = {
13
14
  attributes: {
14
15
  group: 'paint',
15
16
  state: 'deleted',
17
+ introduced: '0.1.1',
16
18
  replacement: 'color.background.accent.green.bolder',
17
19
  description: 'Use for green backgrounds of stronger emphasis when there is no meaning tied to the color, such as bold tags.'
18
20
  }
@@ -21,6 +23,7 @@ var color = {
21
23
  attributes: {
22
24
  group: 'paint',
23
25
  state: 'deleted',
26
+ introduced: '0.1.1',
24
27
  replacement: 'color.background.accent.orange.bolder',
25
28
  description: 'Use for orange backgrounds of stronger emphasis when there is no meaning tied to the color, such as bold tags.'
26
29
  }
@@ -29,6 +32,7 @@ var color = {
29
32
  attributes: {
30
33
  group: 'paint',
31
34
  state: 'deleted',
35
+ introduced: '0.1.1',
32
36
  replacement: 'color.background.accent.purple.bolder',
33
37
  description: 'Use for purple backgrounds of stronger emphasis when there is no meaning tied to the color, such as bold tags.'
34
38
  }
@@ -37,6 +41,7 @@ var color = {
37
41
  attributes: {
38
42
  group: 'paint',
39
43
  state: 'deleted',
44
+ introduced: '0.1.1',
40
45
  replacement: 'color.background.accent.red.bolder',
41
46
  description: 'Use for red backgrounds of stronger emphasis when there is no meaning tied to the color, such as bold tags.'
42
47
  }
@@ -45,6 +50,7 @@ var color = {
45
50
  attributes: {
46
51
  group: 'paint',
47
52
  state: 'deleted',
53
+ introduced: '0.1.1',
48
54
  replacement: 'color.background.accent.teal.bolder',
49
55
  description: 'Use for teal backgrounds of stronger emphasis when there is no meaning tied to the color, such as bold tags.'
50
56
  }
@@ -53,6 +59,7 @@ var color = {
53
59
  attributes: {
54
60
  group: 'paint',
55
61
  state: 'deleted',
62
+ introduced: '0.1.0',
56
63
  replacement: 'color.background.accent.blue.subtler',
57
64
  description: 'Use for blue subdued backgrounds when there is no meaning tied to the color, such as colored tags.'
58
65
  }
@@ -61,6 +68,7 @@ var color = {
61
68
  attributes: {
62
69
  group: 'paint',
63
70
  state: 'deleted',
71
+ introduced: '0.1.0',
64
72
  replacement: 'color.background.accent.green.subtler',
65
73
  description: 'Use for green subdued backgrounds when there is no meaning tied to the color, such as colored tags.'
66
74
  }
@@ -69,6 +77,7 @@ var color = {
69
77
  attributes: {
70
78
  group: 'paint',
71
79
  state: 'deleted',
80
+ introduced: '0.1.0',
72
81
  replacement: 'color.background.accent.magenta.subtler',
73
82
  description: 'Use for magenta subdued backgrounds when there is no meaning tied to the color, such as colored tags.'
74
83
  }
@@ -77,6 +86,7 @@ var color = {
77
86
  attributes: {
78
87
  group: 'paint',
79
88
  state: 'deleted',
89
+ introduced: '0.1.0',
80
90
  replacement: 'color.background.accent.orange.subtler',
81
91
  description: 'Use for orange subdued backgrounds when there is no meaning tied to the color, such as colored tags.'
82
92
  }
@@ -85,6 +95,7 @@ var color = {
85
95
  attributes: {
86
96
  group: 'paint',
87
97
  state: 'deleted',
98
+ introduced: '0.1.0',
88
99
  replacement: 'color.background.accent.purple.subtler',
89
100
  description: 'Use for purple subdued backgrounds when there is no meaning tied to the color, such as colored tags.'
90
101
  }
@@ -93,6 +104,7 @@ var color = {
93
104
  attributes: {
94
105
  group: 'paint',
95
106
  state: 'deleted',
107
+ introduced: '0.1.0',
96
108
  replacement: 'color.background.accent.red.subtler',
97
109
  description: 'Use for red subdued backgrounds when there is no meaning tied to the color, such as colored tags.'
98
110
  }
@@ -101,6 +113,7 @@ var color = {
101
113
  attributes: {
102
114
  group: 'paint',
103
115
  state: 'deleted',
116
+ introduced: '0.1.0',
104
117
  replacement: 'color.background.accent.teal.subtler',
105
118
  description: 'Use for teal subdued backgrounds when there is no meaning tied to the color, such as colored tags.'
106
119
  }
@@ -113,6 +126,7 @@ var color = {
113
126
  attributes: {
114
127
  group: 'paint',
115
128
  state: 'deleted',
129
+ introduced: '0.6.0',
116
130
  replacement: 'color.background.accent.blue.subtler',
117
131
  description: 'Use for blue backgrounds when there is no meaning tied to the color, such as coloured tags.'
118
132
  }
@@ -121,6 +135,7 @@ var color = {
121
135
  attributes: {
122
136
  group: 'paint',
123
137
  state: 'deleted',
138
+ introduced: '0.6.0',
124
139
  replacement: 'color.background.accent.blue.subtle',
125
140
  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
141
  }
@@ -131,6 +146,7 @@ var color = {
131
146
  attributes: {
132
147
  group: 'paint',
133
148
  state: 'deleted',
149
+ introduced: '0.6.0',
134
150
  replacement: 'color.background.accent.red.subtler',
135
151
  description: 'Use for red backgrounds when there is no meaning tied to the color, such as colored tags.'
136
152
  }
@@ -139,6 +155,7 @@ var color = {
139
155
  attributes: {
140
156
  group: 'paint',
141
157
  state: 'deleted',
158
+ introduced: '0.6.0',
142
159
  replacement: 'color.background.accent.red.subtle',
143
160
  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
161
  }
@@ -149,6 +166,7 @@ var color = {
149
166
  attributes: {
150
167
  group: 'paint',
151
168
  state: 'deleted',
169
+ introduced: '0.6.0',
152
170
  replacement: 'color.background.accent.orange.subtler',
153
171
  description: 'Use for orange backgrounds when there is no meaning tied to the color, such as colored tags.'
154
172
  }
@@ -157,6 +175,7 @@ var color = {
157
175
  attributes: {
158
176
  group: 'paint',
159
177
  state: 'deleted',
178
+ introduced: '0.6.0',
160
179
  replacement: 'color.background.accent.orange.subtle',
161
180
  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
181
  }
@@ -167,6 +186,7 @@ var color = {
167
186
  attributes: {
168
187
  group: 'paint',
169
188
  state: 'deleted',
189
+ introduced: '0.6.0',
170
190
  replacement: 'color.background.accent.yellow.subtler',
171
191
  description: 'Use for yellow backgrounds when there is no meaning tied to the color, such as colored tags.'
172
192
  }
@@ -175,6 +195,7 @@ var color = {
175
195
  attributes: {
176
196
  group: 'paint',
177
197
  state: 'deleted',
198
+ introduced: '0.6.0',
178
199
  replacement: 'color.background.accent.yellow.subtle',
179
200
  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
201
  }
@@ -185,6 +206,7 @@ var color = {
185
206
  attributes: {
186
207
  group: 'paint',
187
208
  state: 'deleted',
209
+ introduced: '0.6.0',
188
210
  replacement: 'color.background.accent.green.subtler',
189
211
  description: 'Use for green backgrounds when there is no meaning tied to the color, such as colored tags.'
190
212
  }
@@ -193,6 +215,7 @@ var color = {
193
215
  attributes: {
194
216
  group: 'paint',
195
217
  state: 'deleted',
218
+ introduced: '0.6.0',
196
219
  replacement: 'color.background.accent.green.subtle',
197
220
  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
221
  }
@@ -203,6 +226,7 @@ var color = {
203
226
  attributes: {
204
227
  group: 'paint',
205
228
  state: 'deleted',
229
+ introduced: '0.6.0',
206
230
  replacement: 'color.background.accent.teal.subtler',
207
231
  description: 'Use for teal backgrounds when there is no meaning tied to the color, such as colored tags.'
208
232
  }
@@ -211,6 +235,7 @@ var color = {
211
235
  attributes: {
212
236
  group: 'paint',
213
237
  state: 'deleted',
238
+ introduced: '0.6.0',
214
239
  replacement: 'color.background.accent.teal.subtle',
215
240
  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
241
  }
@@ -221,6 +246,7 @@ var color = {
221
246
  attributes: {
222
247
  group: 'paint',
223
248
  state: 'deleted',
249
+ introduced: '0.6.0',
224
250
  replacement: 'color.background.accent.purple.subtler',
225
251
  description: 'Use for purple backgrounds when there is no meaning tied to the color, such as colored tags.'
226
252
  }
@@ -229,6 +255,7 @@ var color = {
229
255
  attributes: {
230
256
  group: 'paint',
231
257
  state: 'deleted',
258
+ introduced: '0.6.0',
232
259
  replacement: 'color.background.accent.purple.subtle',
233
260
  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
261
  }
@@ -239,6 +266,7 @@ var color = {
239
266
  attributes: {
240
267
  group: 'paint',
241
268
  state: 'deleted',
269
+ introduced: '0.6.0',
242
270
  replacement: 'color.background.accent.magenta.subtler',
243
271
  description: 'Use for magenta backgrounds when there is no meaning tied to the color, such as colored tags.'
244
272
  }
@@ -247,6 +275,7 @@ var color = {
247
275
  attributes: {
248
276
  group: 'paint',
249
277
  state: 'deleted',
278
+ introduced: '0.6.0',
250
279
  replacement: 'color.background.accent.magenta.subtle',
251
280
  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
281
  }
@@ -257,6 +286,7 @@ var color = {
257
286
  attributes: {
258
287
  group: 'paint',
259
288
  state: 'deleted',
289
+ introduced: '0.0.15',
260
290
  replacement: 'color.blanket.[default]',
261
291
  description: 'Use for the screen overlay that appears with modal dialogs'
262
292
  }
@@ -267,6 +297,7 @@ var color = {
267
297
  attributes: {
268
298
  group: 'paint',
269
299
  state: 'deprecated',
300
+ introduced: '0.6.0',
270
301
  replacement: 'color.background.selected.[default].[default]',
271
302
  description: 'Use for the background of elements used to reinforce our brand.'
272
303
  }
@@ -275,6 +306,7 @@ var color = {
275
306
  attributes: {
276
307
  group: 'paint',
277
308
  state: 'deprecated',
309
+ introduced: '0.6.0',
278
310
  replacement: 'color.background.selected.[default].hovered',
279
311
  description: 'Hovered state for color.background.brand'
280
312
  }
@@ -283,6 +315,7 @@ var color = {
283
315
  attributes: {
284
316
  group: 'paint',
285
317
  state: 'deprecated',
318
+ introduced: '0.6.0',
286
319
  replacement: 'color.background.selected.[default].pressed',
287
320
  description: 'Pressed state for color.background.brand'
288
321
  }
@@ -294,6 +327,7 @@ var color = {
294
327
  attributes: {
295
328
  group: 'paint',
296
329
  state: 'deleted',
330
+ introduced: '0.0.15',
297
331
  replacement: 'color.background.brand.bold.hovered',
298
332
  description: 'Hover state of background.boldBrand'
299
333
  }
@@ -302,6 +336,7 @@ var color = {
302
336
  attributes: {
303
337
  group: 'paint',
304
338
  state: 'deleted',
339
+ introduced: '0.0.15',
305
340
  replacement: 'color.background.brand.bold.pressed',
306
341
  description: 'Pressed state of background.boldBrand'
307
342
  }
@@ -310,6 +345,7 @@ var color = {
310
345
  attributes: {
311
346
  group: 'paint',
312
347
  state: 'deleted',
348
+ introduced: '0.0.15',
313
349
  replacement: 'color.background.brand.bold.[default]',
314
350
  description: 'A vibrant background for small UI elements like primary buttons and bold in progress lozenges.'
315
351
  }
@@ -320,6 +356,7 @@ var color = {
320
356
  attributes: {
321
357
  group: 'paint',
322
358
  state: 'deleted',
359
+ introduced: '0.0.15',
323
360
  replacement: 'color.background.danger.bold.hovered',
324
361
  description: 'Hover state of background.boldDanger'
325
362
  }
@@ -328,6 +365,7 @@ var color = {
328
365
  attributes: {
329
366
  group: 'paint',
330
367
  state: 'deleted',
368
+ introduced: '0.0.15',
331
369
  replacement: 'color.background.danger.bold.pressed',
332
370
  description: 'Pressed state of background.boldDanger'
333
371
  }
@@ -336,6 +374,7 @@ var color = {
336
374
  attributes: {
337
375
  group: 'paint',
338
376
  state: 'deleted',
377
+ introduced: '0.0.15',
339
378
  replacement: 'color.background.danger.bold.[default]',
340
379
  description: 'A vibrant background for small UI elements like danger buttons and bold removed lozenges.'
341
380
  }
@@ -346,6 +385,7 @@ var color = {
346
385
  attributes: {
347
386
  group: 'paint',
348
387
  state: 'deleted',
388
+ introduced: '0.0.15',
349
389
  replacement: 'color.background.discovery.bold.hovered',
350
390
  description: 'Hover state of background.boldDiscovery'
351
391
  }
@@ -354,6 +394,7 @@ var color = {
354
394
  attributes: {
355
395
  group: 'paint',
356
396
  state: 'deleted',
397
+ introduced: '0.0.15',
357
398
  replacement: 'color.background.discovery.bold.pressed',
358
399
  description: 'Pressed state of background.boldDiscovery'
359
400
  }
@@ -362,6 +403,7 @@ var color = {
362
403
  attributes: {
363
404
  group: 'paint',
364
405
  state: 'deleted',
406
+ introduced: '0.0.15',
365
407
  replacement: 'color.background.discovery.bold.[default]',
366
408
  description: 'A vibrant background for small UI elements like onboarding buttons and bold new lozenges.'
367
409
  }
@@ -372,6 +414,7 @@ var color = {
372
414
  attributes: {
373
415
  group: 'paint',
374
416
  state: 'deleted',
417
+ introduced: '0.0.15',
375
418
  replacement: 'color.background.neutral.bold.hovered',
376
419
  description: 'Hover state of background.boldNeutral'
377
420
  }
@@ -380,6 +423,7 @@ var color = {
380
423
  attributes: {
381
424
  group: 'paint',
382
425
  state: 'deleted',
426
+ introduced: '0.0.15',
383
427
  replacement: 'color.background.neutral.bold.pressed',
384
428
  description: 'Pressed state of background.boldNeutral'
385
429
  }
@@ -388,6 +432,7 @@ var color = {
388
432
  attributes: {
389
433
  group: 'paint',
390
434
  state: 'deleted',
435
+ introduced: '0.0.15',
391
436
  replacement: 'color.background.neutral.bold.[default]',
392
437
  description: 'A vibrant background for small UI elements like unchecked toggles and bold default lozenges.'
393
438
  }
@@ -398,6 +443,7 @@ var color = {
398
443
  attributes: {
399
444
  group: 'paint',
400
445
  state: 'deleted',
446
+ introduced: '0.0.15',
401
447
  replacement: 'color.background.success.bold.hovered',
402
448
  description: 'Hover state of background.boldSuccess'
403
449
  }
@@ -406,6 +452,7 @@ var color = {
406
452
  attributes: {
407
453
  group: 'paint',
408
454
  state: 'deleted',
455
+ introduced: '0.0.15',
409
456
  replacement: 'color.background.success.bold.pressed',
410
457
  description: 'Pressed state of background.boldSuccess'
411
458
  }
@@ -414,6 +461,7 @@ var color = {
414
461
  attributes: {
415
462
  group: 'paint',
416
463
  state: 'deleted',
464
+ introduced: '0.0.15',
417
465
  replacement: 'color.background.success.bold.[default]',
418
466
  description: 'A vibrant background for small UI elements like checked toggles and bold success lozenges.'
419
467
  }
@@ -424,6 +472,7 @@ var color = {
424
472
  attributes: {
425
473
  group: 'paint',
426
474
  state: 'deleted',
475
+ introduced: '0.0.15',
427
476
  replacement: 'color.background.warning.bold.hovered',
428
477
  description: 'Hover state of background.boldWarning'
429
478
  }
@@ -432,6 +481,7 @@ var color = {
432
481
  attributes: {
433
482
  group: 'paint',
434
483
  state: 'deleted',
484
+ introduced: '0.0.15',
435
485
  replacement: 'color.background.warning.bold.pressed',
436
486
  description: 'Pressed state of background.boldWarning'
437
487
  }
@@ -440,6 +490,7 @@ var color = {
440
490
  attributes: {
441
491
  group: 'paint',
442
492
  state: 'deleted',
493
+ introduced: '0.0.15',
443
494
  replacement: 'color.background.warning.bold.[default]',
444
495
  description: 'A vibrant background for small UI elements like warning buttons and bold moved lozenges.'
445
496
  }
@@ -449,6 +500,7 @@ var color = {
449
500
  attributes: {
450
501
  group: 'paint',
451
502
  state: 'deleted',
503
+ introduced: '0.0.15',
452
504
  replacement: 'elevation.surface.raised',
453
505
  description: 'Use for the background of raised cards, such as Jira cards on a Kanban board.\nCombine with shadow.card.'
454
506
  }
@@ -457,14 +509,27 @@ var color = {
457
509
  attributes: {
458
510
  group: 'paint',
459
511
  state: 'deleted',
512
+ introduced: '0.0.15',
460
513
  replacement: 'elevation.surface.[default]',
461
514
  description: 'Use as the primary background for the UI'
462
515
  }
463
516
  },
517
+ inverse: {
518
+ '[default]': {
519
+ attributes: {
520
+ group: 'paint',
521
+ state: 'deprecated',
522
+ introduced: '0.1.0',
523
+ replacement: 'color.background.inverse.subtle.[default]',
524
+ description: 'Use for backgrounds of elements on a bold background, such as in the buttons on spotlight cards.'
525
+ }
526
+ }
527
+ },
464
528
  overlay: {
465
529
  attributes: {
466
530
  group: 'paint',
467
531
  state: 'deleted',
532
+ introduced: '0.0.15',
468
533
  replacement: 'elevation.surface.overlay',
469
534
  description: "\nUse for the background of overlay elements, such as modals, dropdown menus, flags, and inline dialogs (i.e. elements that sit on top of the UI).\n\nAlso use for the background of raised cards in a dragged state.\n\nCombine with shadow.overlay."
470
535
  }
@@ -474,6 +539,7 @@ var color = {
474
539
  attributes: {
475
540
  group: 'paint',
476
541
  state: 'deprecated',
542
+ introduced: '0.1.0',
477
543
  replacement: 'color.background.selected.[default].[default]',
478
544
  description: 'Use for backgrounds of elements in a selected state'
479
545
  }
@@ -482,6 +548,7 @@ var color = {
482
548
  attributes: {
483
549
  group: 'paint',
484
550
  state: 'deprecated',
551
+ introduced: '0.1.0',
485
552
  replacement: 'color.background.selected.[default].hovered',
486
553
  description: 'Hover state for color.background.selected'
487
554
  }
@@ -492,6 +559,7 @@ var color = {
492
559
  attributes: {
493
560
  group: 'paint',
494
561
  state: 'deleted',
562
+ introduced: '0.0.15',
495
563
  replacement: 'color.background.input.pressed',
496
564
  description: 'Pressed state for background.subtleBorderedNeutral'
497
565
  }
@@ -500,6 +568,7 @@ var color = {
500
568
  attributes: {
501
569
  group: 'paint',
502
570
  state: 'deleted',
571
+ introduced: '0.0.15',
503
572
  replacement: 'color.background.input.[default]',
504
573
  description: 'Hover state for background.subtleBorderedNeutral'
505
574
  }
@@ -510,6 +579,7 @@ var color = {
510
579
  attributes: {
511
580
  group: 'paint',
512
581
  state: 'deprecated',
582
+ introduced: '0.0.15',
513
583
  replacement: 'color.background.selected.[default].hovered',
514
584
  description: 'Hover state for background.subtleBrand'
515
585
  }
@@ -518,6 +588,7 @@ var color = {
518
588
  attributes: {
519
589
  group: 'paint',
520
590
  state: 'deprecated',
591
+ introduced: '0.0.15',
521
592
  replacement: 'color.background.selected.[default].pressed',
522
593
  description: 'Pressed state for background.subtleBrand'
523
594
  }
@@ -526,6 +597,7 @@ var color = {
526
597
  attributes: {
527
598
  group: 'paint',
528
599
  state: 'deprecated',
600
+ introduced: '0.0.15',
529
601
  replacement: 'color.background.selected.[default].[default]',
530
602
  description: 'Use for subdued backgrounds of UI elements like information section messages and in progress lozenges.'
531
603
  }
@@ -536,6 +608,7 @@ var color = {
536
608
  attributes: {
537
609
  group: 'paint',
538
610
  state: 'deleted',
611
+ introduced: '0.0.15',
539
612
  replacement: 'color.background.danger.[default].hovered',
540
613
  description: 'Hover state for background.subtleDanger'
541
614
  }
@@ -544,6 +617,7 @@ var color = {
544
617
  attributes: {
545
618
  group: 'paint',
546
619
  state: 'deleted',
620
+ introduced: '0.0.15',
547
621
  replacement: 'color.background.danger.[default].pressed',
548
622
  description: 'Pressed state for background.subtleDanger'
549
623
  }
@@ -552,6 +626,7 @@ var color = {
552
626
  attributes: {
553
627
  group: 'paint',
554
628
  state: 'deleted',
629
+ introduced: '0.0.15',
555
630
  replacement: 'color.background.danger.[default].[default]',
556
631
  description: 'Use for subdued backgrounds of UI elements like error section messages and removed lozenges.'
557
632
  }
@@ -562,6 +637,7 @@ var color = {
562
637
  attributes: {
563
638
  group: 'paint',
564
639
  state: 'deleted',
640
+ introduced: '0.0.15',
565
641
  replacement: 'color.background.discovery.[default].hovered',
566
642
  description: 'Hover state for background.subtleDiscovery'
567
643
  }
@@ -570,6 +646,7 @@ var color = {
570
646
  attributes: {
571
647
  group: 'paint',
572
648
  state: 'deleted',
649
+ introduced: '0.0.15',
573
650
  replacement: 'color.background.discovery.[default].pressed',
574
651
  description: 'Pressed state for background.subtleDiscovery'
575
652
  }
@@ -578,6 +655,7 @@ var color = {
578
655
  attributes: {
579
656
  group: 'paint',
580
657
  state: 'deleted',
658
+ introduced: '0.0.15',
581
659
  replacement: 'color.background.discovery.[default].[default]',
582
660
  description: 'Use for subdued backgrounds of UI elements like discovery section messages and new lozenges.'
583
661
  }
@@ -588,6 +666,7 @@ var color = {
588
666
  attributes: {
589
667
  group: 'paint',
590
668
  state: 'deleted',
669
+ introduced: '0.0.15',
591
670
  replacement: 'color.background.neutral.[default].hovered',
592
671
  description: 'Hover state for background.subtleNeutral'
593
672
  }
@@ -596,6 +675,7 @@ var color = {
596
675
  attributes: {
597
676
  group: 'paint',
598
677
  state: 'deleted',
678
+ introduced: '0.0.15',
599
679
  replacement: 'color.background.neutral.[default].pressed',
600
680
  description: 'Pressed state for background.subtleNeutral'
601
681
  }
@@ -604,6 +684,7 @@ var color = {
604
684
  attributes: {
605
685
  group: 'paint',
606
686
  state: 'deleted',
687
+ introduced: '0.0.15',
607
688
  replacement: 'color.background.neutral.[default].[default]',
608
689
  description: 'Use as the default background of UI elements like buttons, lozenges, and tags.'
609
690
  }
@@ -614,6 +695,7 @@ var color = {
614
695
  attributes: {
615
696
  group: 'paint',
616
697
  state: 'deleted',
698
+ introduced: '0.0.15',
617
699
  replacement: 'color.background.success.[default].hovered',
618
700
  description: 'Hover state for background.subtleSuccess'
619
701
  }
@@ -622,6 +704,7 @@ var color = {
622
704
  attributes: {
623
705
  group: 'paint',
624
706
  state: 'deleted',
707
+ introduced: '0.0.15',
625
708
  replacement: 'color.background.success.[default].pressed',
626
709
  description: 'Pressed state for background.subtleSuccess'
627
710
  }
@@ -630,6 +713,7 @@ var color = {
630
713
  attributes: {
631
714
  group: 'paint',
632
715
  state: 'deleted',
716
+ introduced: '0.0.15',
633
717
  replacement: 'color.background.success.[default].[default]',
634
718
  description: 'Use for subdued backgrounds of UI elements like success section messages and success lozenges.'
635
719
  }
@@ -640,6 +724,7 @@ var color = {
640
724
  attributes: {
641
725
  group: 'paint',
642
726
  state: 'deleted',
727
+ introduced: '0.0.15',
643
728
  replacement: 'color.background.warning.[default].hovered',
644
729
  description: 'Hover state for background.subtleWarning'
645
730
  }
@@ -648,6 +733,7 @@ var color = {
648
733
  attributes: {
649
734
  group: 'paint',
650
735
  state: 'deleted',
736
+ introduced: '0.0.15',
651
737
  replacement: 'color.background.warning.[default].pressed',
652
738
  description: 'Pressed state for background.subtleWarning'
653
739
  }
@@ -656,6 +742,7 @@ var color = {
656
742
  attributes: {
657
743
  group: 'paint',
658
744
  state: 'deleted',
745
+ introduced: '0.0.15',
659
746
  replacement: 'color.background.warning.[default].[default]',
660
747
  description: 'Use for subdued backgrounds of UI elements like warning section messages and moved lozenges.'
661
748
  }
@@ -665,6 +752,7 @@ var color = {
665
752
  attributes: {
666
753
  group: 'paint',
667
754
  state: 'deleted',
755
+ introduced: '0.0.15',
668
756
  replacement: 'elevation.surface.sunken',
669
757
  description: 'Use as a secondary background for the UI'
670
758
  }
@@ -674,6 +762,7 @@ var color = {
674
762
  attributes: {
675
763
  group: 'paint',
676
764
  state: 'deleted',
765
+ introduced: '0.0.15',
677
766
  replacement: 'color.background.neutral.subtle.hovered',
678
767
  description: 'Hover state for UIs that do not have a default background, such as menu items or subtle buttons.'
679
768
  }
@@ -682,6 +771,7 @@ var color = {
682
771
  attributes: {
683
772
  group: 'paint',
684
773
  state: 'deleted',
774
+ introduced: '0.0.15',
685
775
  replacement: 'color.background.neutral.subtle.pressed',
686
776
  description: 'Pressed state for UIs that do not have a default background, such as menu items or subtle buttons.'
687
777
  }
@@ -693,6 +783,7 @@ var color = {
693
783
  attributes: {
694
784
  group: 'paint',
695
785
  state: 'deleted',
786
+ introduced: '0.0.15',
696
787
  replacement: 'color.text.[default]',
697
788
  description: 'Use for primary text, such as body copy, sentence case headers, and buttons'
698
789
  }
@@ -702,6 +793,7 @@ var color = {
702
793
  attributes: {
703
794
  group: 'paint',
704
795
  state: 'deleted',
796
+ introduced: '0.0.15',
705
797
  replacement: 'color.link.pressed',
706
798
  description: 'Use for links in a pressed state'
707
799
  }
@@ -710,6 +802,7 @@ var color = {
710
802
  attributes: {
711
803
  group: 'paint',
712
804
  state: 'deleted',
805
+ introduced: '0.0.15',
713
806
  replacement: 'color.link.[default]',
714
807
  description: 'Use for links in a resting or hover state. Add an underline for hover states'
715
808
  }
@@ -719,6 +812,7 @@ var color = {
719
812
  attributes: {
720
813
  group: 'paint',
721
814
  state: 'deleted',
815
+ introduced: '0.0.15',
722
816
  replacement: 'color.text.subtlest',
723
817
  description: "\nUse for tertiary text, such as meta-data, breadcrumbs, input field placeholder and helper text.\n\nUse for icons that are paired with text.medEmphasis text"
724
818
  }
@@ -727,6 +821,7 @@ var color = {
727
821
  attributes: {
728
822
  group: 'paint',
729
823
  state: 'deleted',
824
+ introduced: '0.0.15',
730
825
  replacement: 'color.text.subtle',
731
826
  description: "\nUse for secondary text, such navigation, subtle button links, input field labels, and all caps subheadings.\n\nUse for icon-only buttons, or icons paired with text.highEmphasis text\n "
732
827
  }
@@ -735,6 +830,7 @@ var color = {
735
830
  attributes: {
736
831
  group: 'paint',
737
832
  state: 'deleted',
833
+ introduced: '0.0.15',
738
834
  replacement: 'color.text.inverse',
739
835
  description: 'Use for text and icons when on bold backgrounds'
740
836
  }
@@ -743,6 +839,7 @@ var color = {
743
839
  attributes: {
744
840
  group: 'paint',
745
841
  state: 'deleted',
842
+ introduced: '0.0.15',
746
843
  replacement: 'color.text.warning.inverse',
747
844
  description: 'Use for text and icons when on bold warning backgrounds'
748
845
  }
@@ -753,6 +850,7 @@ var color = {
753
850
  attributes: {
754
851
  group: 'paint',
755
852
  state: 'deleted',
853
+ introduced: '0.0.15',
756
854
  replacement: 'color.border.focused',
757
855
  description: 'Use for focus rings of elements in a focus state'
758
856
  }
@@ -761,6 +859,7 @@ var color = {
761
859
  attributes: {
762
860
  group: 'paint',
763
861
  state: 'deleted',
862
+ introduced: '0.0.15',
764
863
  replacement: 'color.border.[default]',
765
864
  description: 'Use to create borders around UI elements such as text fields, checkboxes, and radio buttons, or to visually group or separate UI elements, such as flat cards or side panel dividers'
766
865
  }
@@ -771,6 +870,7 @@ var color = {
771
870
  attributes: {
772
871
  group: 'paint',
773
872
  state: 'deleted',
873
+ introduced: '0.0.15',
774
874
  replacement: 'color.icon.brand',
775
875
  description: "\nUse rarely for icons or borders representing brand, in-progress, or information, such as the icons in information sections messages.\n\nAlso use for blue icons or borders when there is no meaning tied to the color, such as file type icons."
776
876
  }
@@ -779,6 +879,7 @@ var color = {
779
879
  attributes: {
780
880
  group: 'paint',
781
881
  state: 'deleted',
882
+ introduced: '0.0.15',
782
883
  replacement: 'color.icon.danger',
783
884
  description: "\nUse rarely for icons and borders representing critical information, such the icons in error section messages or the borders on invalid text fields.\n\nAlso use for red icons or borders when there is no meaning tied to the color, such as file type icons."
784
885
  }
@@ -787,6 +888,7 @@ var color = {
787
888
  attributes: {
788
889
  group: 'paint',
789
890
  state: 'deleted',
891
+ introduced: '0.0.15',
790
892
  replacement: 'color.icon.discovery',
791
893
  description: "\nUse rarely for icons and borders representing new information, such as the icons in discovery section mesages or the borders in onboarding spotlights.\n\nAlso use for purple icons or borders when there is no meaning tied to the color, such as file type icons.\n"
792
894
  }
@@ -795,6 +897,7 @@ var color = {
795
897
  attributes: {
796
898
  group: 'paint',
797
899
  state: 'deleted',
900
+ introduced: '0.0.15',
798
901
  replacement: 'color.icon.success',
799
902
  description: "\nUse rarely for icons and borders representing positive information, such as the icons in success section messages or the borders on validated text fields.\n\nAlso use for green icons or borders when there is no meaning tied to the color, such as file type icons.\n"
800
903
  }
@@ -803,6 +906,7 @@ var color = {
803
906
  attributes: {
804
907
  group: 'paint',
805
908
  state: 'deleted',
909
+ introduced: '0.0.15',
806
910
  replacement: 'color.icon.warning.[default]',
807
911
  description: "\nUse rarely for icons and borders representing semi-urgent information, such as the icons in warning section messages.\n\nAlso use for yellow icons or borders when there is no meaning tied to the color, such as file type icons.\n"
808
912
  }
@@ -813,6 +917,7 @@ var color = {
813
917
  attributes: {
814
918
  group: 'paint',
815
919
  state: 'deleted',
920
+ introduced: '0.1.0',
816
921
  replacement: 'color.interaction.hovered',
817
922
  description: 'Use as a background overlay for elements in a hover state when their background color cannot change, such as avatars.'
818
923
  }
@@ -821,6 +926,7 @@ var color = {
821
926
  attributes: {
822
927
  group: 'paint',
823
928
  state: 'deleted',
929
+ introduced: '0.1.0',
824
930
  replacement: 'color.interaction.pressed',
825
931
  description: 'Use as a background overlay for elements in a pressed state when their background color cannot change, such as avatars.'
826
932
  }
@@ -832,6 +938,7 @@ var color = {
832
938
  attributes: {
833
939
  group: 'shadow',
834
940
  state: 'deleted',
941
+ introduced: '0.6.0',
835
942
  replacement: 'elevation.shadow.raised',
836
943
  description: "\nUse for the box shadow of raised card elements, such as Jira cards on a Kanban board.\n\nCombine with background.overlay"
837
944
  }
@@ -840,6 +947,7 @@ var color = {
840
947
  attributes: {
841
948
  group: 'shadow',
842
949
  state: 'deleted',
950
+ introduced: '0.6.0',
843
951
  replacement: 'elevation.shadow.overlay',
844
952
  description: "\nUse for the box shadow of overlay elements, such as modals, dropdown menus, flags, and inline dialogs (i.e. elements that sit on top of the UI).\n\nAlso use for the box shadow of raised cards in a dragged state.\n\nCombine with background.overlay"
845
953
  }