@adobe/spectrum-tokens 12.0.0-beta.10 → 12.0.0-beta.11

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 (5) hide show
  1. package/CHANGELOG.md +17 -2
  2. package/dist/json/variables.json +928 -8
  3. package/package.json +1 -1
  4. package/tokens/color-alias.json +235 -6
  5. package/tokens/color-semantic.json +1 -1
package/CHANGELOG.md CHANGED
@@ -1,6 +1,21 @@
1
- # [12.0.0-beta.10](https://github.com/adobe/spectrum-tokens/compare/v12.0.0-beta.9...v12.0.0-beta.10) (2022-04-04)
1
+ # [12.0.0-beta.11](https://github.com/adobe/spectrum-tokens/compare/v12.0.0-beta.10...v12.0.0-beta.11) (2022-04-04)
2
+
3
+
4
+ ### Bug Fixes
5
+
6
+ * bad var name for negative-color-400 ([c5362ea](https://github.com/adobe/spectrum-tokens/commit/c5362eacd9b590a35708115cfea9a42b48df5668))
2
7
 
3
8
 
4
9
  ### Features
5
10
 
6
- * rename CJK line height tokens ([0b33d3a](https://github.com/adobe/spectrum-tokens/commit/0b33d3ae0e28eb5d19cfee1917dba0595a701026))
11
+ * add neutral background colors ([706c788](https://github.com/adobe/spectrum-tokens/commit/706c7888f9758491fb3d5adc50d4c0c32fa4186c))
12
+ * changes to static focus ring alias ([a641e62](https://github.com/adobe/spectrum-tokens/commit/a641e622c8dd3a20ca14e506df388ef16d9e3700))
13
+ * for DNA-1106 adds disabled-background-color ([ca88724](https://github.com/adobe/spectrum-tokens/commit/ca88724e12189192fb7578ed4ed1c5f9f8928b62))
14
+ * for DNA-1107 adds disabled-static-white-background-color ([15ad0aa](https://github.com/adobe/spectrum-tokens/commit/15ad0aa0250b93585b910fa15f2fee49faa2925c))
15
+ * for DNA-1108 adds disabled-static-black-background-color ([8d68297](https://github.com/adobe/spectrum-tokens/commit/8d6829719bc2e72931369890e47062b2e496fb26))
16
+ * for DNA-1109 adds disabled-static-white-content-color ([b1f7f81](https://github.com/adobe/spectrum-tokens/commit/b1f7f81a4b3c8b62642ec767da79eed8509211b0))
17
+ * for DNA-1110 adds disabled-static-black-content-color ([075ecad](https://github.com/adobe/spectrum-tokens/commit/075ecadfa4da354077e96554f5a9f5945b96d3c6))
18
+ * for DNA-1111 adds disabled-border-color ([1187246](https://github.com/adobe/spectrum-tokens/commit/1187246830847f16860a2e4c9da394463c21f006))
19
+ * for DNA-1112 adds disabled-static-white-border-color ([6ade919](https://github.com/adobe/spectrum-tokens/commit/6ade9195e6478d1705f8d5a304c0c7b2b28176f1))
20
+ * for DNA-1113 adds disabled-static-black-border-color ([c51898f](https://github.com/adobe/spectrum-tokens/commit/c51898f919c200694a0a6bfc1d0ee731e81ff8d3))
21
+ * for DNA-1145 adds negative background color ([60539c7](https://github.com/adobe/spectrum-tokens/commit/60539c724296ac28ee274e9c60e8b640b5731cd8))
package/dist/json/variables.json CHANGED
@@ -64,14 +64,14 @@
64
64
  }
65
65
  }
66
66
  },
67
- "focus-ring-static-white-color": {
68
- "ref": "{black}",
69
- "value": "rgb(0, 0, 0)"
70
- },
71
- "focus-ring-static-black-color": {
67
+ "static-white-focus-ring-color": {
72
68
  "ref": "{white}",
73
69
  "value": "rgb(255, 255, 255)"
74
70
  },
71
+ "static-black-focus-ring-color": {
72
+ "ref": "{black}",
73
+ "value": "rgb(0, 0, 0)"
74
+ },
75
75
  "neutral-content-color": {
76
76
  "ref": "{gray-800}",
77
77
  "sets": {
@@ -140,6 +140,586 @@
140
140
  }
141
141
  }
142
142
  },
143
+ "neutral-background-color": {
144
+ "default": {
145
+ "sets": {
146
+ "light": {
147
+ "ref": "{gray-800}",
148
+ "sets": {
149
+ "light": {
150
+ "value": "rgb(34, 34, 34)"
151
+ },
152
+ "dark": {
153
+ "value": "rgb(235, 235, 235)"
154
+ },
155
+ "darkest": {
156
+ "value": "rgb(235, 235, 235)"
157
+ },
158
+ "wireframe": {
159
+ "value": "rgb(73, 110, 194)"
160
+ }
161
+ }
162
+ },
163
+ "dark": {
164
+ "ref": "{gray-400}",
165
+ "sets": {
166
+ "light": {
167
+ "value": "rgb(177, 177, 177)"
168
+ },
169
+ "dark": {
170
+ "value": "rgb(112, 112, 112)"
171
+ },
172
+ "darkest": {
173
+ "value": "rgb(106, 106, 106)"
174
+ },
175
+ "wireframe": {
176
+ "value": "rgb(183, 200, 235)"
177
+ }
178
+ }
179
+ },
180
+ "darkest": {
181
+ "ref": "{gray-400}",
182
+ "sets": {
183
+ "light": {
184
+ "value": "rgb(177, 177, 177)"
185
+ },
186
+ "dark": {
187
+ "value": "rgb(112, 112, 112)"
188
+ },
189
+ "darkest": {
190
+ "value": "rgb(106, 106, 106)"
191
+ },
192
+ "wireframe": {
193
+ "value": "rgb(183, 200, 235)"
194
+ }
195
+ }
196
+ },
197
+ "wireframe": {
198
+ "ref": "{gray-800}",
199
+ "sets": {
200
+ "light": {
201
+ "value": "rgb(34, 34, 34)"
202
+ },
203
+ "dark": {
204
+ "value": "rgb(235, 235, 235)"
205
+ },
206
+ "darkest": {
207
+ "value": "rgb(235, 235, 235)"
208
+ },
209
+ "wireframe": {
210
+ "value": "rgb(73, 110, 194)"
211
+ }
212
+ }
213
+ }
214
+ }
215
+ },
216
+ "hover": {
217
+ "sets": {
218
+ "light": {
219
+ "ref": "{gray-900}",
220
+ "sets": {
221
+ "light": {
222
+ "value": "rgb(0, 0, 0)"
223
+ },
224
+ "dark": {
225
+ "value": "rgb(255, 255, 255)"
226
+ },
227
+ "darkest": {
228
+ "value": "rgb(255, 255, 255)"
229
+ },
230
+ "wireframe": {
231
+ "value": "rgb(72, 110, 194)"
232
+ }
233
+ }
234
+ },
235
+ "dark": {
236
+ "ref": "{gray-300}",
237
+ "sets": {
238
+ "light": {
239
+ "value": "rgb(213, 213, 213)"
240
+ },
241
+ "dark": {
242
+ "value": "rgb(84, 84, 84)"
243
+ },
244
+ "darkest": {
245
+ "value": "rgb(75, 75, 75)"
246
+ },
247
+ "wireframe": {
248
+ "value": "rgb(210, 220, 243)"
249
+ }
250
+ }
251
+ },
252
+ "darkest": {
253
+ "ref": "{gray-300}",
254
+ "sets": {
255
+ "light": {
256
+ "value": "rgb(213, 213, 213)"
257
+ },
258
+ "dark": {
259
+ "value": "rgb(84, 84, 84)"
260
+ },
261
+ "darkest": {
262
+ "value": "rgb(75, 75, 75)"
263
+ },
264
+ "wireframe": {
265
+ "value": "rgb(210, 220, 243)"
266
+ }
267
+ }
268
+ },
269
+ "wireframe": {
270
+ "ref": "{gray-900}",
271
+ "sets": {
272
+ "light": {
273
+ "value": "rgb(0, 0, 0)"
274
+ },
275
+ "dark": {
276
+ "value": "rgb(255, 255, 255)"
277
+ },
278
+ "darkest": {
279
+ "value": "rgb(255, 255, 255)"
280
+ },
281
+ "wireframe": {
282
+ "value": "rgb(72, 110, 194)"
283
+ }
284
+ }
285
+ }
286
+ }
287
+ },
288
+ "down": {
289
+ "sets": {
290
+ "light": {
291
+ "ref": "{gray-900}",
292
+ "sets": {
293
+ "light": {
294
+ "value": "rgb(0, 0, 0)"
295
+ },
296
+ "dark": {
297
+ "value": "rgb(255, 255, 255)"
298
+ },
299
+ "darkest": {
300
+ "value": "rgb(255, 255, 255)"
301
+ },
302
+ "wireframe": {
303
+ "value": "rgb(72, 110, 194)"
304
+ }
305
+ }
306
+ },
307
+ "dark": {
308
+ "ref": "{gray-200}",
309
+ "sets": {
310
+ "light": {
311
+ "value": "rgb(230, 230, 230)"
312
+ },
313
+ "dark": {
314
+ "value": "rgb(63, 63, 63)"
315
+ },
316
+ "darkest": {
317
+ "value": "rgb(48, 48, 48)"
318
+ },
319
+ "wireframe": {
320
+ "value": "rgb(230, 236, 248)"
321
+ }
322
+ }
323
+ },
324
+ "darkest": {
325
+ "ref": "{gray-200}",
326
+ "sets": {
327
+ "light": {
328
+ "value": "rgb(230, 230, 230)"
329
+ },
330
+ "dark": {
331
+ "value": "rgb(63, 63, 63)"
332
+ },
333
+ "darkest": {
334
+ "value": "rgb(48, 48, 48)"
335
+ },
336
+ "wireframe": {
337
+ "value": "rgb(230, 236, 248)"
338
+ }
339
+ }
340
+ },
341
+ "wireframe": {
342
+ "ref": "{gray-900}",
343
+ "sets": {
344
+ "light": {
345
+ "value": "rgb(0, 0, 0)"
346
+ },
347
+ "dark": {
348
+ "value": "rgb(255, 255, 255)"
349
+ },
350
+ "darkest": {
351
+ "value": "rgb(255, 255, 255)"
352
+ },
353
+ "wireframe": {
354
+ "value": "rgb(72, 110, 194)"
355
+ }
356
+ }
357
+ }
358
+ }
359
+ },
360
+ "key-focus": {
361
+ "sets": {
362
+ "light": {
363
+ "ref": "{gray-900}",
364
+ "sets": {
365
+ "light": {
366
+ "value": "rgb(0, 0, 0)"
367
+ },
368
+ "dark": {
369
+ "value": "rgb(255, 255, 255)"
370
+ },
371
+ "darkest": {
372
+ "value": "rgb(255, 255, 255)"
373
+ },
374
+ "wireframe": {
375
+ "value": "rgb(72, 110, 194)"
376
+ }
377
+ }
378
+ },
379
+ "dark": {
380
+ "ref": "{gray-300}",
381
+ "sets": {
382
+ "light": {
383
+ "value": "rgb(213, 213, 213)"
384
+ },
385
+ "dark": {
386
+ "value": "rgb(84, 84, 84)"
387
+ },
388
+ "darkest": {
389
+ "value": "rgb(75, 75, 75)"
390
+ },
391
+ "wireframe": {
392
+ "value": "rgb(210, 220, 243)"
393
+ }
394
+ }
395
+ },
396
+ "darkest": {
397
+ "ref": "{gray-300}",
398
+ "sets": {
399
+ "light": {
400
+ "value": "rgb(213, 213, 213)"
401
+ },
402
+ "dark": {
403
+ "value": "rgb(84, 84, 84)"
404
+ },
405
+ "darkest": {
406
+ "value": "rgb(75, 75, 75)"
407
+ },
408
+ "wireframe": {
409
+ "value": "rgb(210, 220, 243)"
410
+ }
411
+ }
412
+ },
413
+ "wireframe": {
414
+ "ref": "{gray-900}",
415
+ "sets": {
416
+ "light": {
417
+ "value": "rgb(0, 0, 0)"
418
+ },
419
+ "dark": {
420
+ "value": "rgb(255, 255, 255)"
421
+ },
422
+ "darkest": {
423
+ "value": "rgb(255, 255, 255)"
424
+ },
425
+ "wireframe": {
426
+ "value": "rgb(72, 110, 194)"
427
+ }
428
+ }
429
+ }
430
+ }
431
+ }
432
+ },
433
+ "neutral-subdued-background-color": {
434
+ "default": {
435
+ "sets": {
436
+ "light": {
437
+ "ref": "{gray-600}",
438
+ "sets": {
439
+ "light": {
440
+ "value": "rgb(109, 109, 109)"
441
+ },
442
+ "dark": {
443
+ "value": "rgb(178, 178, 178)"
444
+ },
445
+ "darkest": {
446
+ "value": "rgb(176, 176, 176)"
447
+ },
448
+ "wireframe": {
449
+ "value": "rgb(113, 144, 210)"
450
+ }
451
+ }
452
+ },
453
+ "dark": {
454
+ "ref": "{gray-400}",
455
+ "sets": {
456
+ "light": {
457
+ "value": "rgb(177, 177, 177)"
458
+ },
459
+ "dark": {
460
+ "value": "rgb(112, 112, 112)"
461
+ },
462
+ "darkest": {
463
+ "value": "rgb(106, 106, 106)"
464
+ },
465
+ "wireframe": {
466
+ "value": "rgb(183, 200, 235)"
467
+ }
468
+ }
469
+ },
470
+ "darkest": {
471
+ "ref": "{gray-400}",
472
+ "sets": {
473
+ "light": {
474
+ "value": "rgb(177, 177, 177)"
475
+ },
476
+ "dark": {
477
+ "value": "rgb(112, 112, 112)"
478
+ },
479
+ "darkest": {
480
+ "value": "rgb(106, 106, 106)"
481
+ },
482
+ "wireframe": {
483
+ "value": "rgb(183, 200, 235)"
484
+ }
485
+ }
486
+ },
487
+ "wireframe": {
488
+ "ref": "{gray-600}",
489
+ "sets": {
490
+ "light": {
491
+ "value": "rgb(109, 109, 109)"
492
+ },
493
+ "dark": {
494
+ "value": "rgb(178, 178, 178)"
495
+ },
496
+ "darkest": {
497
+ "value": "rgb(176, 176, 176)"
498
+ },
499
+ "wireframe": {
500
+ "value": "rgb(113, 144, 210)"
501
+ }
502
+ }
503
+ }
504
+ }
505
+ },
506
+ "hover": {
507
+ "sets": {
508
+ "light": {
509
+ "ref": "{gray-700}",
510
+ "sets": {
511
+ "light": {
512
+ "value": "rgb(70, 70, 70)"
513
+ },
514
+ "dark": {
515
+ "value": "rgb(209, 209, 209)"
516
+ },
517
+ "darkest": {
518
+ "value": "rgb(208, 208, 208)"
519
+ },
520
+ "wireframe": {
521
+ "value": "rgb(78, 112, 187)"
522
+ }
523
+ }
524
+ },
525
+ "dark": {
526
+ "ref": "{gray-300}",
527
+ "sets": {
528
+ "light": {
529
+ "value": "rgb(213, 213, 213)"
530
+ },
531
+ "dark": {
532
+ "value": "rgb(84, 84, 84)"
533
+ },
534
+ "darkest": {
535
+ "value": "rgb(75, 75, 75)"
536
+ },
537
+ "wireframe": {
538
+ "value": "rgb(210, 220, 243)"
539
+ }
540
+ }
541
+ },
542
+ "darkest": {
543
+ "ref": "{gray-300}",
544
+ "sets": {
545
+ "light": {
546
+ "value": "rgb(213, 213, 213)"
547
+ },
548
+ "dark": {
549
+ "value": "rgb(84, 84, 84)"
550
+ },
551
+ "darkest": {
552
+ "value": "rgb(75, 75, 75)"
553
+ },
554
+ "wireframe": {
555
+ "value": "rgb(210, 220, 243)"
556
+ }
557
+ }
558
+ },
559
+ "wireframe": {
560
+ "ref": "{gray-700}",
561
+ "sets": {
562
+ "light": {
563
+ "value": "rgb(70, 70, 70)"
564
+ },
565
+ "dark": {
566
+ "value": "rgb(209, 209, 209)"
567
+ },
568
+ "darkest": {
569
+ "value": "rgb(208, 208, 208)"
570
+ },
571
+ "wireframe": {
572
+ "value": "rgb(78, 112, 187)"
573
+ }
574
+ }
575
+ }
576
+ }
577
+ },
578
+ "down": {
579
+ "sets": {
580
+ "light": {
581
+ "ref": "{gray-800}",
582
+ "sets": {
583
+ "light": {
584
+ "value": "rgb(34, 34, 34)"
585
+ },
586
+ "dark": {
587
+ "value": "rgb(235, 235, 235)"
588
+ },
589
+ "darkest": {
590
+ "value": "rgb(235, 235, 235)"
591
+ },
592
+ "wireframe": {
593
+ "value": "rgb(73, 110, 194)"
594
+ }
595
+ }
596
+ },
597
+ "dark": {
598
+ "ref": "{gray-200}",
599
+ "sets": {
600
+ "light": {
601
+ "value": "rgb(230, 230, 230)"
602
+ },
603
+ "dark": {
604
+ "value": "rgb(63, 63, 63)"
605
+ },
606
+ "darkest": {
607
+ "value": "rgb(48, 48, 48)"
608
+ },
609
+ "wireframe": {
610
+ "value": "rgb(230, 236, 248)"
611
+ }
612
+ }
613
+ },
614
+ "darkest": {
615
+ "ref": "{gray-200}",
616
+ "sets": {
617
+ "light": {
618
+ "value": "rgb(230, 230, 230)"
619
+ },
620
+ "dark": {
621
+ "value": "rgb(63, 63, 63)"
622
+ },
623
+ "darkest": {
624
+ "value": "rgb(48, 48, 48)"
625
+ },
626
+ "wireframe": {
627
+ "value": "rgb(230, 236, 248)"
628
+ }
629
+ }
630
+ },
631
+ "wireframe": {
632
+ "ref": "{gray-800}",
633
+ "sets": {
634
+ "light": {
635
+ "value": "rgb(34, 34, 34)"
636
+ },
637
+ "dark": {
638
+ "value": "rgb(235, 235, 235)"
639
+ },
640
+ "darkest": {
641
+ "value": "rgb(235, 235, 235)"
642
+ },
643
+ "wireframe": {
644
+ "value": "rgb(73, 110, 194)"
645
+ }
646
+ }
647
+ }
648
+ }
649
+ },
650
+ "key-focus": {
651
+ "sets": {
652
+ "light": {
653
+ "ref": "{gray-700}",
654
+ "sets": {
655
+ "light": {
656
+ "value": "rgb(70, 70, 70)"
657
+ },
658
+ "dark": {
659
+ "value": "rgb(209, 209, 209)"
660
+ },
661
+ "darkest": {
662
+ "value": "rgb(208, 208, 208)"
663
+ },
664
+ "wireframe": {
665
+ "value": "rgb(78, 112, 187)"
666
+ }
667
+ }
668
+ },
669
+ "dark": {
670
+ "ref": "{gray-300}",
671
+ "sets": {
672
+ "light": {
673
+ "value": "rgb(213, 213, 213)"
674
+ },
675
+ "dark": {
676
+ "value": "rgb(84, 84, 84)"
677
+ },
678
+ "darkest": {
679
+ "value": "rgb(75, 75, 75)"
680
+ },
681
+ "wireframe": {
682
+ "value": "rgb(210, 220, 243)"
683
+ }
684
+ }
685
+ },
686
+ "darkest": {
687
+ "ref": "{gray-300}",
688
+ "sets": {
689
+ "light": {
690
+ "value": "rgb(213, 213, 213)"
691
+ },
692
+ "dark": {
693
+ "value": "rgb(84, 84, 84)"
694
+ },
695
+ "darkest": {
696
+ "value": "rgb(75, 75, 75)"
697
+ },
698
+ "wireframe": {
699
+ "value": "rgb(210, 220, 243)"
700
+ }
701
+ }
702
+ },
703
+ "wireframe": {
704
+ "ref": "{gray-700}",
705
+ "sets": {
706
+ "light": {
707
+ "value": "rgb(70, 70, 70)"
708
+ },
709
+ "dark": {
710
+ "value": "rgb(209, 209, 209)"
711
+ },
712
+ "darkest": {
713
+ "value": "rgb(208, 208, 208)"
714
+ },
715
+ "wireframe": {
716
+ "value": "rgb(78, 112, 187)"
717
+ }
718
+ }
719
+ }
720
+ }
721
+ }
722
+ },
143
723
  "neutral-subdued-content-color": {
144
724
  "default": {
145
725
  "ref": "{gray-700}",
@@ -434,6 +1014,296 @@
434
1014
  }
435
1015
  }
436
1016
  },
1017
+ "negative-background-color": {
1018
+ "default": {
1019
+ "sets": {
1020
+ "light": {
1021
+ "ref": "{negative-color-900}",
1022
+ "sets": {
1023
+ "light": {
1024
+ "value": "rgb(211, 21, 16)"
1025
+ },
1026
+ "dark": {
1027
+ "value": "rgb(255, 149, 129)"
1028
+ },
1029
+ "darkest": {
1030
+ "value": "rgb(255, 129, 107)"
1031
+ },
1032
+ "wireframe": {
1033
+ "value": "rgb(154, 177, 227)"
1034
+ }
1035
+ }
1036
+ },
1037
+ "dark": {
1038
+ "ref": "{negative-color-500}",
1039
+ "sets": {
1040
+ "light": {
1041
+ "value": "rgb(255, 155, 136)"
1042
+ },
1043
+ "dark": {
1044
+ "value": "rgb(215, 25, 19)"
1045
+ },
1046
+ "darkest": {
1047
+ "value": "rgb(196, 7, 6)"
1048
+ },
1049
+ "wireframe": {
1050
+ "value": "rgb(216, 225, 244)"
1051
+ }
1052
+ }
1053
+ },
1054
+ "darkest": {
1055
+ "ref": "{negative-color-600}",
1056
+ "sets": {
1057
+ "light": {
1058
+ "value": "rgb(255, 124, 101)"
1059
+ },
1060
+ "dark": {
1061
+ "value": "rgb(234, 56, 41)"
1062
+ },
1063
+ "darkest": {
1064
+ "value": "rgb(221, 33, 24)"
1065
+ },
1066
+ "wireframe": {
1067
+ "value": "rgb(203, 215, 241)"
1068
+ }
1069
+ }
1070
+ },
1071
+ "wireframe": {
1072
+ "ref": "{negative-color-900}",
1073
+ "sets": {
1074
+ "light": {
1075
+ "value": "rgb(211, 21, 16)"
1076
+ },
1077
+ "dark": {
1078
+ "value": "rgb(255, 149, 129)"
1079
+ },
1080
+ "darkest": {
1081
+ "value": "rgb(255, 129, 107)"
1082
+ },
1083
+ "wireframe": {
1084
+ "value": "rgb(154, 177, 227)"
1085
+ }
1086
+ }
1087
+ }
1088
+ }
1089
+ },
1090
+ "hover": {
1091
+ "sets": {
1092
+ "light": {
1093
+ "ref": "{negative-color-1000}",
1094
+ "sets": {
1095
+ "light": {
1096
+ "value": "rgb(180, 0, 0)"
1097
+ },
1098
+ "dark": {
1099
+ "value": "rgb(255, 176, 161)"
1100
+ },
1101
+ "darkest": {
1102
+ "value": "rgb(255, 158, 140)"
1103
+ },
1104
+ "wireframe": {
1105
+ "value": "rgb(133, 161, 219)"
1106
+ }
1107
+ }
1108
+ },
1109
+ "dark": {
1110
+ "ref": "{negative-color-400}",
1111
+ "sets": {
1112
+ "light": {
1113
+ "value": "rgb(255, 183, 169)"
1114
+ },
1115
+ "dark": {
1116
+ "value": "rgb(190, 4, 3)"
1117
+ },
1118
+ "darkest": {
1119
+ "value": "rgb(167, 0, 0)"
1120
+ },
1121
+ "wireframe": {
1122
+ "value": "rgb(226, 232, 247)"
1123
+ }
1124
+ }
1125
+ },
1126
+ "darkest": {
1127
+ "ref": "{negative-color-500}",
1128
+ "sets": {
1129
+ "light": {
1130
+ "value": "rgb(255, 155, 136)"
1131
+ },
1132
+ "dark": {
1133
+ "value": "rgb(215, 25, 19)"
1134
+ },
1135
+ "darkest": {
1136
+ "value": "rgb(196, 7, 6)"
1137
+ },
1138
+ "wireframe": {
1139
+ "value": "rgb(216, 225, 244)"
1140
+ }
1141
+ }
1142
+ },
1143
+ "wireframe": {
1144
+ "ref": "{negative-color-1000}",
1145
+ "sets": {
1146
+ "light": {
1147
+ "value": "rgb(180, 0, 0)"
1148
+ },
1149
+ "dark": {
1150
+ "value": "rgb(255, 176, 161)"
1151
+ },
1152
+ "darkest": {
1153
+ "value": "rgb(255, 158, 140)"
1154
+ },
1155
+ "wireframe": {
1156
+ "value": "rgb(133, 161, 219)"
1157
+ }
1158
+ }
1159
+ }
1160
+ }
1161
+ },
1162
+ "down": {
1163
+ "sets": {
1164
+ "light": {
1165
+ "ref": "{negative-color-1100}",
1166
+ "sets": {
1167
+ "light": {
1168
+ "value": "rgb(147, 0, 0)"
1169
+ },
1170
+ "dark": {
1171
+ "value": "rgb(255, 201, 189)"
1172
+ },
1173
+ "darkest": {
1174
+ "value": "rgb(255, 183, 169)"
1175
+ },
1176
+ "wireframe": {
1177
+ "value": "rgb(114, 145, 211)"
1178
+ }
1179
+ }
1180
+ },
1181
+ "dark": {
1182
+ "ref": "{negative-color-300}",
1183
+ "sets": {
1184
+ "light": {
1185
+ "value": "rgb(255, 205, 195)"
1186
+ },
1187
+ "dark": {
1188
+ "value": "rgb(165, 0, 0)"
1189
+ },
1190
+ "darkest": {
1191
+ "value": "rgb(138, 0, 0)"
1192
+ },
1193
+ "wireframe": {
1194
+ "value": "rgb(233, 238, 248)"
1195
+ }
1196
+ }
1197
+ },
1198
+ "darkest": {
1199
+ "ref": "{negative-color-400}",
1200
+ "sets": {
1201
+ "light": {
1202
+ "value": "rgb(255, 183, 169)"
1203
+ },
1204
+ "dark": {
1205
+ "value": "rgb(190, 4, 3)"
1206
+ },
1207
+ "darkest": {
1208
+ "value": "rgb(167, 0, 0)"
1209
+ },
1210
+ "wireframe": {
1211
+ "value": "rgb(226, 232, 247)"
1212
+ }
1213
+ }
1214
+ },
1215
+ "wireframe": {
1216
+ "ref": "{negative-color-1100}",
1217
+ "sets": {
1218
+ "light": {
1219
+ "value": "rgb(147, 0, 0)"
1220
+ },
1221
+ "dark": {
1222
+ "value": "rgb(255, 201, 189)"
1223
+ },
1224
+ "darkest": {
1225
+ "value": "rgb(255, 183, 169)"
1226
+ },
1227
+ "wireframe": {
1228
+ "value": "rgb(114, 145, 211)"
1229
+ }
1230
+ }
1231
+ }
1232
+ }
1233
+ },
1234
+ "key-focus": {
1235
+ "sets": {
1236
+ "light": {
1237
+ "ref": "{negative-color-1000}",
1238
+ "sets": {
1239
+ "light": {
1240
+ "value": "rgb(180, 0, 0)"
1241
+ },
1242
+ "dark": {
1243
+ "value": "rgb(255, 176, 161)"
1244
+ },
1245
+ "darkest": {
1246
+ "value": "rgb(255, 158, 140)"
1247
+ },
1248
+ "wireframe": {
1249
+ "value": "rgb(133, 161, 219)"
1250
+ }
1251
+ }
1252
+ },
1253
+ "dark": {
1254
+ "ref": "{negative-color-400}",
1255
+ "sets": {
1256
+ "light": {
1257
+ "value": "rgb(255, 183, 169)"
1258
+ },
1259
+ "dark": {
1260
+ "value": "rgb(190, 4, 3)"
1261
+ },
1262
+ "darkest": {
1263
+ "value": "rgb(167, 0, 0)"
1264
+ },
1265
+ "wireframe": {
1266
+ "value": "rgb(226, 232, 247)"
1267
+ }
1268
+ }
1269
+ },
1270
+ "darkest": {
1271
+ "ref": "{negative-color-500}",
1272
+ "sets": {
1273
+ "light": {
1274
+ "value": "rgb(255, 155, 136)"
1275
+ },
1276
+ "dark": {
1277
+ "value": "rgb(215, 25, 19)"
1278
+ },
1279
+ "darkest": {
1280
+ "value": "rgb(196, 7, 6)"
1281
+ },
1282
+ "wireframe": {
1283
+ "value": "rgb(216, 225, 244)"
1284
+ }
1285
+ }
1286
+ },
1287
+ "wireframe": {
1288
+ "ref": "{negative-color-1000}",
1289
+ "sets": {
1290
+ "light": {
1291
+ "value": "rgb(180, 0, 0)"
1292
+ },
1293
+ "dark": {
1294
+ "value": "rgb(255, 176, 161)"
1295
+ },
1296
+ "darkest": {
1297
+ "value": "rgb(255, 158, 140)"
1298
+ },
1299
+ "wireframe": {
1300
+ "value": "rgb(133, 161, 219)"
1301
+ }
1302
+ }
1303
+ }
1304
+ }
1305
+ }
1306
+ },
437
1307
  "disabled-content-color": {
438
1308
  "ref": "{gray-400}",
439
1309
  "sets": {
@@ -451,14 +1321,64 @@
451
1321
  }
452
1322
  }
453
1323
  },
454
- "disabled-content-static-white-color": {
1324
+ "disabled-static-white-content-color": {
455
1325
  "ref": "{transparent-white-500}",
456
1326
  "value": "rgba(255, 255, 255, 0.55)"
457
1327
  },
458
- "disabled-content-static-black-color": {
1328
+ "disabled-static-black-content-color": {
459
1329
  "ref": "{transparent-black-500}",
460
1330
  "value": "rgba(0, 0, 0, 0.55)"
461
1331
  },
1332
+ "disabled-background-color": {
1333
+ "ref": "{gray-200}",
1334
+ "sets": {
1335
+ "light": {
1336
+ "value": "rgb(230, 230, 230)"
1337
+ },
1338
+ "dark": {
1339
+ "value": "rgb(63, 63, 63)"
1340
+ },
1341
+ "darkest": {
1342
+ "value": "rgb(48, 48, 48)"
1343
+ },
1344
+ "wireframe": {
1345
+ "value": "rgb(230, 236, 248)"
1346
+ }
1347
+ }
1348
+ },
1349
+ "disabled-static-white-background-color": {
1350
+ "ref": "{transparent-white-200}",
1351
+ "value": "rgba(255, 255, 255, 0.10)"
1352
+ },
1353
+ "disabled-static-black-background-color": {
1354
+ "ref": "{transparent-black-200}",
1355
+ "value": "rgba(0, 0, 0, 0.10)"
1356
+ },
1357
+ "disabled-border-color": {
1358
+ "ref": "{gray-300}",
1359
+ "sets": {
1360
+ "light": {
1361
+ "value": "rgb(213, 213, 213)"
1362
+ },
1363
+ "dark": {
1364
+ "value": "rgb(84, 84, 84)"
1365
+ },
1366
+ "darkest": {
1367
+ "value": "rgb(75, 75, 75)"
1368
+ },
1369
+ "wireframe": {
1370
+ "value": "rgb(210, 220, 243)"
1371
+ }
1372
+ }
1373
+ },
1374
+ "disabled-static-white-border-color": {
1375
+ "ref": "{transparent-white-300}",
1376
+ "value": "rgba(255, 255, 255, 0.25)"
1377
+ },
1378
+ "disabled-static-black-border-color": {
1379
+ "ref": "{transparent-black-300}",
1380
+ "value": "rgba(0, 0, 0, 0.25)"
1381
+ },
462
1382
  "drop-shadow-color": {
463
1383
  "sets": {
464
1384
  "light": {
@@ -1293,7 +2213,7 @@
1293
2213
  }
1294
2214
  }
1295
2215
  },
1296
- "4negative-color-00": {
2216
+ "negative-color-400": {
1297
2217
  "ref": "{red-400}",
1298
2218
  "sets": {
1299
2219
  "light": {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@adobe/spectrum-tokens",
3
- "version": "12.0.0-beta.10",
3
+ "version": "12.0.0-beta.11",
4
4
  "description": "",
5
5
  "main": "config.js",
6
6
  "scripts": {
package/tokens/color-alias.json CHANGED
@@ -48,15 +48,18 @@
48
48
  "transparent-black-900": {
49
49
  "value": "rgb(0, 0, 0)"
50
50
  },
51
+
51
52
  "focus-ring-color": {
52
53
  "value": "{blue-800}"
53
54
  },
54
- "focus-ring-static-white-color": {
55
- "value": "{black}"
56
- },
57
- "focus-ring-static-black-color": {
55
+
56
+ "static-white-focus-ring-color": {
58
57
  "value": "{white}"
59
58
  },
59
+ "static-black-focus-ring-color": {
60
+ "value": "{black}"
61
+ },
62
+
60
63
  "neutral-content-color": {
61
64
  "value": "{gray-800}"
62
65
  },
@@ -69,6 +72,141 @@
69
72
  "neutral-content-color-key-focus": {
70
73
  "value": "{gray-900}"
71
74
  },
75
+
76
+ "neutral-background-color": {
77
+ "default": {
78
+ "sets": {
79
+ "light": {
80
+ "value": "{gray-800}"
81
+ },
82
+ "dark": {
83
+ "value": "{gray-400}"
84
+ },
85
+ "darkest": {
86
+ "value": "{gray-400}"
87
+ },
88
+ "wireframe": {
89
+ "value": "{gray-800}"
90
+ }
91
+ }
92
+ },
93
+ "hover": {
94
+ "sets": {
95
+ "light": {
96
+ "value": "{gray-900}"
97
+ },
98
+ "dark": {
99
+ "value": "{gray-300}"
100
+ },
101
+ "darkest": {
102
+ "value": "{gray-300}"
103
+ },
104
+ "wireframe": {
105
+ "value": "{gray-900}"
106
+ }
107
+ }
108
+ },
109
+ "down": {
110
+ "sets": {
111
+ "light": {
112
+ "value": "{gray-900}"
113
+ },
114
+ "dark": {
115
+ "value": "{gray-200}"
116
+ },
117
+ "darkest": {
118
+ "value": "{gray-200}"
119
+ },
120
+ "wireframe": {
121
+ "value": "{gray-900}"
122
+ }
123
+ }
124
+ },
125
+ "key-focus": {
126
+ "sets": {
127
+ "light": {
128
+ "value": "{gray-900}"
129
+ },
130
+ "dark": {
131
+ "value": "{gray-300}"
132
+ },
133
+ "darkest": {
134
+ "value": "{gray-300}"
135
+ },
136
+ "wireframe": {
137
+ "value": "{gray-900}"
138
+ }
139
+ }
140
+ }
141
+ },
142
+
143
+ "neutral-subdued-background-color": {
144
+ "default": {
145
+ "sets": {
146
+ "light": {
147
+ "value": "{gray-600}"
148
+ },
149
+ "dark": {
150
+ "value": "{gray-400}"
151
+ },
152
+ "darkest": {
153
+ "value": "{gray-400}"
154
+ },
155
+ "wireframe": {
156
+ "value": "{gray-600}"
157
+ }
158
+ }
159
+ },
160
+ "hover": {
161
+ "sets": {
162
+ "light": {
163
+ "value": "{gray-700}"
164
+ },
165
+ "dark": {
166
+ "value": "{gray-300}"
167
+ },
168
+ "darkest": {
169
+ "value": "{gray-300}"
170
+ },
171
+ "wireframe": {
172
+ "value": "{gray-700}"
173
+ }
174
+ }
175
+ },
176
+ "down": {
177
+ "sets": {
178
+ "light": {
179
+ "value": "{gray-800}"
180
+ },
181
+ "dark": {
182
+ "value": "{gray-200}"
183
+ },
184
+ "darkest": {
185
+ "value": "{gray-200}"
186
+ },
187
+ "wireframe": {
188
+ "value": "{gray-800}"
189
+ }
190
+ }
191
+ },
192
+ "key-focus": {
193
+ "sets": {
194
+ "light": {
195
+ "value": "{gray-700}"
196
+ },
197
+ "dark": {
198
+ "value": "{gray-300}"
199
+ },
200
+ "darkest": {
201
+ "value": "{gray-300}"
202
+ },
203
+ "wireframe": {
204
+ "value": "{gray-700}"
205
+ }
206
+ }
207
+ }
208
+ },
209
+
72
210
  "neutral-subdued-content-color": {
73
211
  "default": {
74
212
  "value": "{gray-700}"
@@ -83,6 +221,7 @@
83
221
  "value": "{gray-800}"
84
222
  }
85
223
  },
224
+
86
225
  "accent-content-color": {
87
226
  "value": "{accent-color-900}"
88
227
  },
@@ -95,6 +234,7 @@
95
234
  "accent-content-color-key-focus": {
96
235
  "value": "{accent-color-1000}"
97
236
  },
237
+
98
238
  "negative-content-color": {
99
239
  "value": "{negative-color-900}"
100
240
  },
@@ -107,15 +247,104 @@
107
247
  "negative-content-color-key-focus": {
108
248
  "value": "{negative-color-1000}"
109
249
  },
250
+
251
+ "negative-background-color": {
252
+ "default": {
253
+ "sets": {
254
+ "light": {
255
+ "value": "{negative-color-900}"
256
+ },
257
+ "dark": {
258
+ "value": "{negative-color-500}"
259
+ },
260
+ "darkest": {
261
+ "value": "{negative-color-600}"
262
+ },
263
+ "wireframe": {
264
+ "value": "{negative-color-900}"
265
+ }
266
+ }
267
+ },
268
+ "hover": {
269
+ "sets": {
270
+ "light": {
271
+ "value": "{negative-color-1000}"
272
+ },
273
+ "dark": {
274
+ "value": "{negative-color-400}"
275
+ },
276
+ "darkest": {
277
+ "value": "{negative-color-500}"
278
+ },
279
+ "wireframe": {
280
+ "value": "{negative-color-1000}"
281
+ }
282
+ }
283
+ },
284
+ "down": {
285
+ "sets": {
286
+ "light": {
287
+ "value": "{negative-color-1100}"
288
+ },
289
+ "dark": {
290
+ "value": "{negative-color-300}"
291
+ },
292
+ "darkest": {
293
+ "value": "{negative-color-400}"
294
+ },
295
+ "wireframe": {
296
+ "value": "{negative-color-1100}"
297
+ }
298
+ }
299
+ },
300
+ "key-focus": {
301
+ "sets": {
302
+ "light": {
303
+ "value": "{negative-color-1000}"
304
+ },
305
+ "dark": {
306
+ "value": "{negative-color-400}"
307
+ },
308
+ "darkest": {
309
+ "value": "{negative-color-500}"
310
+ },
311
+ "wireframe": {
312
+ "value": "{negative-color-1000}"
313
+ }
314
+ }
315
+ }
316
+ },
317
+
110
318
  "disabled-content-color": {
111
319
  "value": "{gray-400}"
112
320
  },
113
- "disabled-content-static-white-color": {
321
+ "disabled-static-white-content-color": {
114
322
  "value": "{transparent-white-500}"
115
323
  },
116
- "disabled-content-static-black-color": {
324
+ "disabled-static-black-content-color": {
117
325
  "value": "{transparent-black-500}"
118
326
  },
327
+
328
+ "disabled-background-color": {
329
+ "value": "{gray-200}"
330
+ },
331
+ "disabled-static-white-background-color": {
332
+ "value": "{transparent-white-200}"
333
+ },
334
+ "disabled-static-black-background-color": {
335
+ "value": "{transparent-black-200}"
336
+ },
337
+
338
+ "disabled-border-color": {
339
+ "value": "{gray-300}"
340
+ },
341
+ "disabled-static-white-border-color": {
342
+ "value": "{transparent-white-300}"
343
+ },
344
+ "disabled-static-black-border-color": {
345
+ "value": "{transparent-black-300}"
346
+ },
347
+
119
348
  "drop-shadow-color": {
120
349
  "sets": {
121
350
  "light": {
package/tokens/color-semantic.json CHANGED
@@ -190,7 +190,7 @@
190
190
  "negative-color-300": {
191
191
  "value": "{red-300}"
192
192
  },
193
- "4negative-color-00": {
193
+ "negative-color-400": {
194
194
  "value": "{red-400}"
195
195
  },
196
196
  "negative-color-500": {