@mirohq/design-system-themes 1.3.4 → 1.3.6

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 (12) hide show
  1. package/base.css +34 -27
  2. package/dark.css +37 -30
  3. package/dist/main.js +123 -111
  4. package/dist/main.js.map +1 -1
  5. package/dist/module.js +123 -111
  6. package/dist/module.js.map +1 -1
  7. package/dist/types.d.ts +1 -1
  8. package/light.css +34 -27
  9. package/metadata.json +56 -47
  10. package/new-dark.css +38 -27
  11. package/new-light.css +38 -27
  12. package/package.json +2 -2
package/dist/main.js CHANGED
@@ -34,6 +34,7 @@ const colors$3 = {
34
34
  "background-interactive-primary": "$blue-500",
35
35
  "background-interactive-primary-hover": "$blue-550",
36
36
  "background-interactive-primary-pressed": "$blue-600",
37
+ "background-interactive-secondary-selected": "$blue-150",
37
38
  "background-interactive-selected": "$blue-500",
38
39
  "background-interactive-surface-hover": "$gray-100",
39
40
  "background-interactive-surface-secondary-hover": "$gray-150",
@@ -86,6 +87,8 @@ const colors$3 = {
86
87
  "border-disabled": "$gray-150",
87
88
  "border-inverted": "$white",
88
89
  "border-inverted-subtle": "$gray-700",
90
+ "border-option": "$gray-450",
91
+ "border-option-hover": "$blue-550",
89
92
  "border-static-dark": "$gray-450",
90
93
  "border-static-dark-subtle": "$gray-750",
91
94
  "border-strong": "$gray-400",
@@ -200,19 +203,18 @@ const colors$3 = {
200
203
  "format-icon-slides": "$coral-600",
201
204
  "format-icon-table": "$moss-600",
202
205
  "format-icon-timeline": "$moss-600",
203
- "input-background-active": "$white",
204
206
  "input-background-alt-active": "$gray-100",
205
207
  "input-background-alt-default": "$gray-100",
206
208
  "input-background-alt-hover": "$gray-100",
207
209
  "input-background-default": "$white",
208
210
  "input-background-disabled": "$gray-150",
211
+ "input-background-focused": "$white",
209
212
  "input-background-hover": "$white",
210
- "input-border-active": "$blue-550",
211
213
  "input-border-default": "$gray-200",
212
214
  "input-border-disabled": "$transparent",
213
215
  "input-border-error": "$red-500",
216
+ "input-border-focused": "$blue-550",
214
217
  "input-border-hover": "$blue-550",
215
- "input-border-selection-control": "$gray-450",
216
218
  "input-border-success": "$green-500",
217
219
  "notification-background": "$gray-850",
218
220
  "notification-border": "$gray-450",
@@ -222,6 +224,7 @@ const colors$3 = {
222
224
  "scrollbar-background": "$gray-300",
223
225
  "scrollbar-background-hover": "$gray-350",
224
226
  "slider-background": "$gray-300",
227
+ "slider-control-background": "$white",
225
228
  "slider-notch-background": "$gray-300",
226
229
  "switch-background-default": "$gray-300",
227
230
  "switch-background-hover": "$gray-350",
@@ -243,19 +246,19 @@ const colors$3 = {
243
246
  "icon-on-static-dark-subtle": "$gray-300",
244
247
  "icon-placeholder": "$gray-475",
245
248
  "icon-secondary": "$gray-500",
249
+ "icon-interactive-on-inverted": "$white",
250
+ "icon-interactive-on-inverted-hover": "$gray-50",
251
+ "icon-interactive-on-inverted-pressed": "$gray-100",
252
+ "icon-interactive-on-inverted-secondary": "$gray-150",
253
+ "icon-interactive-on-inverted-secondary-hover": "$gray-200",
254
+ "icon-interactive-on-inverted-secondary-pressed": "$gray-250",
255
+ "icon-interactive-primary": "$blue-500",
256
+ "icon-interactive-primary-hover": "$blue-550",
257
+ "icon-interactive-primary-pressed": "$blue-600",
258
+ "icon-interactive-secondary": "$gray-500",
259
+ "icon-interactive-secondary-hover": "$gray-550",
260
+ "icon-interactive-secondary-pressed": "$gray-600",
246
261
  "icon-interactive-selected": "$blue-550",
247
- "icon-link": "$blue-500",
248
- "icon-link-hover": "$blue-550",
249
- "icon-link-on-inverted": "$white",
250
- "icon-link-on-inverted-hover": "$gray-50",
251
- "icon-link-on-inverted-pressed": "$gray-100",
252
- "icon-link-on-inverted-secondary": "$gray-150",
253
- "icon-link-on-inverted-secondary-hover": "$gray-200",
254
- "icon-link-on-inverted-secondary-pressed": "$gray-250",
255
- "icon-link-pressed": "$blue-600",
256
- "icon-link-secondary": "$gray-500",
257
- "icon-link-secondary-hover": "$gray-550",
258
- "icon-link-secondary-pressed": "$gray-600",
259
262
  "icon-on-interactive-danger": "$white",
260
263
  "icon-on-interactive-primary": "$white",
261
264
  "icon-on-interactive-secondary": "$gray-900",
@@ -303,19 +306,19 @@ const colors$3 = {
303
306
  "text-danger-hover": "$red-550",
304
307
  "text-danger-inverted": "$red-50",
305
308
  "text-danger-pressed": "$red-600",
309
+ "text-interactive-on-inverted": "$white",
310
+ "text-interactive-on-inverted-hover": "$gray-50",
311
+ "text-interactive-on-inverted-pressed": "$gray-100",
312
+ "text-interactive-on-inverted-secondary": "$gray-150",
313
+ "text-interactive-on-inverted-secondary-hover": "$gray-200",
314
+ "text-interactive-on-inverted-secondary-pressed": "$gray-250",
315
+ "text-interactive-primary": "$blue-500",
316
+ "text-interactive-primary-hover": "$blue-550",
317
+ "text-interactive-primary-pressed": "$blue-600",
318
+ "text-interactive-secondary": "$gray-500",
319
+ "text-interactive-secondary-hover": "$gray-550",
320
+ "text-interactive-secondary-pressed": "$gray-600",
306
321
  "text-interactive-selected": "$blue-550",
307
- "text-link": "$blue-500",
308
- "text-link-hover": "$blue-550",
309
- "text-link-on-inverted": "$white",
310
- "text-link-on-inverted-hover": "$gray-50",
311
- "text-link-on-inverted-pressed": "$gray-100",
312
- "text-link-on-inverted-secondary": "$gray-150",
313
- "text-link-on-inverted-secondary-hover": "$gray-200",
314
- "text-link-on-inverted-secondary-pressed": "$gray-250",
315
- "text-link-pressed": "$blue-600",
316
- "text-link-secondary": "$gray-500",
317
- "text-link-secondary-hover": "$gray-550",
318
- "text-link-secondary-pressed": "$gray-600",
319
322
  "text-on-interactive-danger": "$white",
320
323
  "text-on-interactive-primary": "$white",
321
324
  "text-on-interactive-secondary": "$gray-900",
@@ -621,15 +624,16 @@ const colors$2 = {
621
624
  "background-danger-prominent-hover": "$red-450",
622
625
  "background-danger-prominent-pressed": "$red-400",
623
626
  "background-danger-subtle": "$red-900",
624
- "background-danger-subtle-active": "$red-500",
625
- "background-danger-subtle-hover": "$red-550",
626
- "background-danger-subtle-pressed": "$red-500",
627
+ "background-danger-subtle-active": "$red-900",
628
+ "background-danger-subtle-hover": "$red-800",
629
+ "background-danger-subtle-pressed": "$red-750",
627
630
  "background-interactive-danger": "$red-500",
628
631
  "background-interactive-danger-hover": "$red-450",
629
632
  "background-interactive-danger-pressed": "$red-400",
630
633
  "background-interactive-primary": "$blue-500",
631
634
  "background-interactive-primary-hover": "$blue-450",
632
635
  "background-interactive-primary-pressed": "$blue-400",
636
+ "background-interactive-secondary-selected": "$blue-700",
633
637
  "background-interactive-selected": "$blue-500",
634
638
  "background-interactive-surface-hover": "$gray-900",
635
639
  "background-interactive-surface-secondary-hover": "$gray-700",
@@ -682,6 +686,8 @@ const colors$2 = {
682
686
  "border-disabled": "$gray-750",
683
687
  "border-inverted": "$gray-700",
684
688
  "border-inverted-subtle": "$gray-600",
689
+ "border-option": "$gray-450",
690
+ "border-option-hover": "$blue-450",
685
691
  "border-static-dark": "$gray-450",
686
692
  "border-static-dark-subtle": "$gray-750",
687
693
  "border-strong": "$gray-500",
@@ -796,19 +802,18 @@ const colors$2 = {
796
802
  "format-icon-slides": "$coral-600",
797
803
  "format-icon-table": "$moss-600",
798
804
  "format-icon-timeline": "$moss-600",
799
- "input-background-active": "$gray-950",
800
805
  "input-background-alt-active": "$gray-750",
801
806
  "input-background-alt-default": "$gray-750",
802
807
  "input-background-alt-hover": "$gray-750",
803
808
  "input-background-default": "$gray-950",
804
809
  "input-background-disabled": "$gray-850",
810
+ "input-background-focused": "$gray-950",
805
811
  "input-background-hover": "$gray-950",
806
- "input-border-active": "$blue-350",
807
812
  "input-border-default": "$gray-650",
808
813
  "input-border-disabled": "$transparent",
809
814
  "input-border-error": "$red-400",
815
+ "input-border-focused": "$blue-350",
810
816
  "input-border-hover": "$blue-350",
811
- "input-border-selection-control": "$gray-450",
812
817
  "input-border-success": "$green-400",
813
818
  "notification-background": "$gray-150",
814
819
  "notification-border": "$gray-450",
@@ -818,6 +823,7 @@ const colors$2 = {
818
823
  "scrollbar-background": "$gray-700",
819
824
  "scrollbar-background-hover": "$gray-650",
820
825
  "slider-background": "$gray-700",
826
+ "slider-control-background": "$gray-950",
821
827
  "slider-notch-background": "$gray-700",
822
828
  "switch-background-default": "$gray-700",
823
829
  "switch-background-hover": "$gray-650",
@@ -839,19 +845,19 @@ const colors$2 = {
839
845
  "icon-on-static-dark-subtle": "$gray-300",
840
846
  "icon-placeholder": "$gray-450",
841
847
  "icon-secondary": "$gray-300",
848
+ "icon-interactive-on-inverted": "$gray-900",
849
+ "icon-interactive-on-inverted-hover": "$gray-850",
850
+ "icon-interactive-on-inverted-pressed": "$gray-800",
851
+ "icon-interactive-on-inverted-secondary": "$gray-700",
852
+ "icon-interactive-on-inverted-secondary-hover": "$gray-650",
853
+ "icon-interactive-on-inverted-secondary-pressed": "$gray-600",
854
+ "icon-interactive-primary": "$blue-400",
855
+ "icon-interactive-primary-hover": "$blue-350",
856
+ "icon-interactive-primary-pressed": "$blue-300",
857
+ "icon-interactive-secondary": "$gray-300",
858
+ "icon-interactive-secondary-hover": "$gray-250",
859
+ "icon-interactive-secondary-pressed": "$gray-200",
842
860
  "icon-interactive-selected": "$blue-400",
843
- "icon-link": "$blue-400",
844
- "icon-link-hover": "$blue-350",
845
- "icon-link-on-inverted": "$gray-900",
846
- "icon-link-on-inverted-hover": "$gray-850",
847
- "icon-link-on-inverted-pressed": "$gray-800",
848
- "icon-link-on-inverted-secondary": "$gray-700",
849
- "icon-link-on-inverted-secondary-hover": "$gray-650",
850
- "icon-link-on-inverted-secondary-pressed": "$gray-600",
851
- "icon-link-pressed": "$blue-300",
852
- "icon-link-secondary": "$gray-300",
853
- "icon-link-secondary-hover": "$gray-250",
854
- "icon-link-secondary-pressed": "$gray-200",
855
861
  "icon-on-interactive-danger": "$white",
856
862
  "icon-on-interactive-primary": "$white",
857
863
  "icon-on-interactive-secondary": "$gray-50",
@@ -899,19 +905,19 @@ const colors$2 = {
899
905
  "text-danger-hover": "$red-350",
900
906
  "text-danger-inverted": "$red-900",
901
907
  "text-danger-pressed": "$red-300",
908
+ "text-interactive-on-inverted": "$gray-900",
909
+ "text-interactive-on-inverted-hover": "$gray-850",
910
+ "text-interactive-on-inverted-pressed": "$gray-800",
911
+ "text-interactive-on-inverted-secondary": "$gray-700",
912
+ "text-interactive-on-inverted-secondary-hover": "$gray-650",
913
+ "text-interactive-on-inverted-secondary-pressed": "$gray-600",
914
+ "text-interactive-primary": "$blue-400",
915
+ "text-interactive-primary-hover": "$blue-350",
916
+ "text-interactive-primary-pressed": "$blue-300",
917
+ "text-interactive-secondary": "$gray-300",
918
+ "text-interactive-secondary-hover": "$gray-250",
919
+ "text-interactive-secondary-pressed": "$gray-200",
902
920
  "text-interactive-selected": "$blue-400",
903
- "text-link": "$blue-400",
904
- "text-link-hover": "$blue-350",
905
- "text-link-on-inverted": "$gray-900",
906
- "text-link-on-inverted-hover": "$gray-850",
907
- "text-link-on-inverted-pressed": "$gray-800",
908
- "text-link-on-inverted-secondary": "$gray-700",
909
- "text-link-on-inverted-secondary-hover": "$gray-650",
910
- "text-link-on-inverted-secondary-pressed": "$gray-600",
911
- "text-link-pressed": "$blue-300",
912
- "text-link-secondary": "$gray-300",
913
- "text-link-secondary-hover": "$gray-250",
914
- "text-link-secondary-pressed": "$gray-200",
915
921
  "text-on-interactive-danger": "$white",
916
922
  "text-on-interactive-primary": "$white",
917
923
  "text-on-interactive-secondary": "$gray-50",
@@ -1226,6 +1232,7 @@ const colors$1 = {
1226
1232
  "background-interactive-primary": "$blue-500",
1227
1233
  "background-interactive-primary-hover": "$blue-550",
1228
1234
  "background-interactive-primary-pressed": "$blue-600",
1235
+ "background-interactive-secondary-selected": "$blue-150",
1229
1236
  "background-interactive-selected": "$blue-500",
1230
1237
  "background-interactive-surface-hover": "$cloud-100",
1231
1238
  "background-interactive-surface-secondary-hover": "$cloud-150",
@@ -1278,6 +1285,8 @@ const colors$1 = {
1278
1285
  "border-disabled": "$cloud-150",
1279
1286
  "border-inverted": "$cloud-900",
1280
1287
  "border-inverted-subtle": "$cloud-700",
1288
+ "border-option": "$cloud-450",
1289
+ "border-option-hover": "$blue-550",
1281
1290
  "border-static-dark": "$cloud-450",
1282
1291
  "border-static-dark-subtle": "$cloud-750",
1283
1292
  "border-strong": "$cloud-300",
@@ -1392,19 +1401,18 @@ const colors$1 = {
1392
1401
  "format-icon-slides": "$coral-600",
1393
1402
  "format-icon-table": "$moss-600",
1394
1403
  "format-icon-timeline": "$moss-600",
1395
- "input-background-active": "$cloud-100",
1396
1404
  "input-background-alt-active": "$cloud-100",
1397
1405
  "input-background-alt-default": "$cloud-100",
1398
1406
  "input-background-alt-hover": "$cloud-100",
1399
1407
  "input-background-default": "$cloud-100",
1400
1408
  "input-background-disabled": "$cloud-150",
1409
+ "input-background-focused": "$cloud-100",
1401
1410
  "input-background-hover": "$cloud-100",
1402
- "input-border-active": "$transparent",
1403
1411
  "input-border-default": "$transparent",
1404
1412
  "input-border-disabled": "$transparent",
1405
1413
  "input-border-error": "$red-500",
1414
+ "input-border-focused": "$transparent",
1406
1415
  "input-border-hover": "$transparent",
1407
- "input-border-selection-control": "$cloud-450",
1408
1416
  "input-border-success": "$green-500",
1409
1417
  "notification-background": "$cloud-850",
1410
1418
  "notification-border": "$cloud-450",
@@ -1414,6 +1422,7 @@ const colors$1 = {
1414
1422
  "scrollbar-background": "$cloud-300",
1415
1423
  "scrollbar-background-hover": "$cloud-350",
1416
1424
  "slider-background": "$cloud-300",
1425
+ "slider-control-background": "$white",
1417
1426
  "slider-notch-background": "$cloud-300",
1418
1427
  "switch-background-default": "$cloud-300",
1419
1428
  "switch-background-hover": "$cloud-350",
@@ -1435,19 +1444,19 @@ const colors$1 = {
1435
1444
  "icon-on-static-dark-subtle": "$gray-300",
1436
1445
  "icon-placeholder": "$cloud-400",
1437
1446
  "icon-secondary": "$cloud-700",
1447
+ "icon-interactive-on-inverted": "$white",
1448
+ "icon-interactive-on-inverted-hover": "$cloud-50",
1449
+ "icon-interactive-on-inverted-pressed": "$cloud-100",
1450
+ "icon-interactive-on-inverted-secondary": "$cloud-300",
1451
+ "icon-interactive-on-inverted-secondary-hover": "$cloud-350",
1452
+ "icon-interactive-on-inverted-secondary-pressed": "$cloud-400",
1453
+ "icon-interactive-primary": "$blue-500",
1454
+ "icon-interactive-primary-hover": "$blue-550",
1455
+ "icon-interactive-primary-pressed": "$blue-600",
1456
+ "icon-interactive-secondary": "$cloud-700",
1457
+ "icon-interactive-secondary-hover": "$cloud-750",
1458
+ "icon-interactive-secondary-pressed": "$cloud-800",
1438
1459
  "icon-interactive-selected": "$blue-550",
1439
- "icon-link": "$blue-500",
1440
- "icon-link-hover": "$blue-550",
1441
- "icon-link-on-inverted": "$white",
1442
- "icon-link-on-inverted-hover": "$cloud-50",
1443
- "icon-link-on-inverted-pressed": "$cloud-100",
1444
- "icon-link-on-inverted-secondary": "$cloud-300",
1445
- "icon-link-on-inverted-secondary-hover": "$cloud-350",
1446
- "icon-link-on-inverted-secondary-pressed": "$cloud-400",
1447
- "icon-link-pressed": "$blue-600",
1448
- "icon-link-secondary": "$cloud-700",
1449
- "icon-link-secondary-hover": "$cloud-750",
1450
- "icon-link-secondary-pressed": "$cloud-800",
1451
1460
  "icon-on-interactive-danger": "$white",
1452
1461
  "icon-on-interactive-primary": "$white",
1453
1462
  "icon-on-interactive-secondary": "$cloud-900",
@@ -1495,19 +1504,19 @@ const colors$1 = {
1495
1504
  "text-danger-hover": "$red-550",
1496
1505
  "text-danger-inverted": "$red-50",
1497
1506
  "text-danger-pressed": "$red-600",
1507
+ "text-interactive-on-inverted": "$white",
1508
+ "text-interactive-on-inverted-hover": "$cloud-50",
1509
+ "text-interactive-on-inverted-pressed": "$cloud-100",
1510
+ "text-interactive-on-inverted-secondary": "$cloud-300",
1511
+ "text-interactive-on-inverted-secondary-hover": "$cloud-350",
1512
+ "text-interactive-on-inverted-secondary-pressed": "$cloud-400",
1513
+ "text-interactive-primary": "$blue-500",
1514
+ "text-interactive-primary-hover": "$blue-550",
1515
+ "text-interactive-primary-pressed": "$blue-600",
1516
+ "text-interactive-secondary": "$cloud-700",
1517
+ "text-interactive-secondary-hover": "$cloud-750",
1518
+ "text-interactive-secondary-pressed": "$cloud-800",
1498
1519
  "text-interactive-selected": "$blue-550",
1499
- "text-link": "$blue-500",
1500
- "text-link-hover": "$blue-550",
1501
- "text-link-on-inverted": "$white",
1502
- "text-link-on-inverted-hover": "$cloud-50",
1503
- "text-link-on-inverted-pressed": "$cloud-100",
1504
- "text-link-on-inverted-secondary": "$cloud-300",
1505
- "text-link-on-inverted-secondary-hover": "$cloud-350",
1506
- "text-link-on-inverted-secondary-pressed": "$cloud-400",
1507
- "text-link-pressed": "$blue-600",
1508
- "text-link-secondary": "$cloud-700",
1509
- "text-link-secondary-hover": "$cloud-750",
1510
- "text-link-secondary-pressed": "$cloud-800",
1511
1520
  "text-on-interactive-danger": "$white",
1512
1521
  "text-on-interactive-primary": "$white",
1513
1522
  "text-on-interactive-secondary": "$cloud-900",
@@ -1822,6 +1831,7 @@ const colors = {
1822
1831
  "background-interactive-primary": "$blue-500",
1823
1832
  "background-interactive-primary-hover": "$blue-450",
1824
1833
  "background-interactive-primary-pressed": "$blue-400",
1834
+ "background-interactive-secondary-selected": "$blue-700",
1825
1835
  "background-interactive-selected": "$blue-500",
1826
1836
  "background-interactive-surface-hover": "$cloud-850",
1827
1837
  "background-interactive-surface-secondary-hover": "$cloud-700",
@@ -1874,6 +1884,8 @@ const colors = {
1874
1884
  "border-disabled": "$cloud-750",
1875
1885
  "border-inverted": "$cloud-100",
1876
1886
  "border-inverted-subtle": "$cloud-500",
1887
+ "border-option": "$cloud-450",
1888
+ "border-option-hover": "$blue-450",
1877
1889
  "border-static-dark": "$cloud-450",
1878
1890
  "border-static-dark-subtle": "$cloud-750",
1879
1891
  "border-strong": "$cloud-450",
@@ -1988,19 +2000,18 @@ const colors = {
1988
2000
  "format-icon-slides": "$coral-600",
1989
2001
  "format-icon-table": "$moss-600",
1990
2002
  "format-icon-timeline": "$moss-600",
1991
- "input-background-active": "$cloud-850",
1992
2003
  "input-background-alt-active": "$cloud-950",
1993
2004
  "input-background-alt-default": "$cloud-950",
1994
2005
  "input-background-alt-hover": "$cloud-950",
1995
2006
  "input-background-default": "$cloud-850",
1996
2007
  "input-background-disabled": "$cloud-850",
2008
+ "input-background-focused": "$cloud-850",
1997
2009
  "input-background-hover": "$cloud-850",
1998
- "input-border-active": "$transparent",
1999
2010
  "input-border-default": "$transparent",
2000
2011
  "input-border-disabled": "$transparent",
2001
2012
  "input-border-error": "$red-400",
2013
+ "input-border-focused": "$transparent",
2002
2014
  "input-border-hover": "$transparent",
2003
- "input-border-selection-control": "$cloud-450",
2004
2015
  "input-border-success": "$green-400",
2005
2016
  "notification-background": "$cloud-150",
2006
2017
  "notification-border": "$cloud-450",
@@ -2010,6 +2021,7 @@ const colors = {
2010
2021
  "scrollbar-background": "$gray-700",
2011
2022
  "scrollbar-background-hover": "$gray-650",
2012
2023
  "slider-background": "$gray-700",
2024
+ "slider-control-background": "$cloud-900",
2013
2025
  "slider-notch-background": "$gray-700",
2014
2026
  "switch-background-default": "$gray-700",
2015
2027
  "switch-background-hover": "$gray-650",
@@ -2031,19 +2043,19 @@ const colors = {
2031
2043
  "icon-on-static-dark-subtle": "$gray-300",
2032
2044
  "icon-placeholder": "$cloud-400",
2033
2045
  "icon-secondary": "$cloud-300",
2046
+ "icon-interactive-on-inverted": "$cloud-900",
2047
+ "icon-interactive-on-inverted-hover": "$cloud-850",
2048
+ "icon-interactive-on-inverted-pressed": "$cloud-800",
2049
+ "icon-interactive-on-inverted-secondary": "$cloud-700",
2050
+ "icon-interactive-on-inverted-secondary-hover": "$cloud-650",
2051
+ "icon-interactive-on-inverted-secondary-pressed": "$cloud-600",
2052
+ "icon-interactive-primary": "$blue-500",
2053
+ "icon-interactive-primary-hover": "$blue-450",
2054
+ "icon-interactive-primary-pressed": "$blue-400",
2055
+ "icon-interactive-secondary": "$cloud-300",
2056
+ "icon-interactive-secondary-hover": "$cloud-250",
2057
+ "icon-interactive-secondary-pressed": "$cloud-200",
2034
2058
  "icon-interactive-selected": "$blue-400",
2035
- "icon-link": "$blue-500",
2036
- "icon-link-hover": "$blue-450",
2037
- "icon-link-on-inverted": "$cloud-900",
2038
- "icon-link-on-inverted-hover": "$cloud-850",
2039
- "icon-link-on-inverted-pressed": "$cloud-800",
2040
- "icon-link-on-inverted-secondary": "$cloud-700",
2041
- "icon-link-on-inverted-secondary-hover": "$cloud-650",
2042
- "icon-link-on-inverted-secondary-pressed": "$cloud-600",
2043
- "icon-link-pressed": "$blue-400",
2044
- "icon-link-secondary": "$cloud-300",
2045
- "icon-link-secondary-hover": "$cloud-250",
2046
- "icon-link-secondary-pressed": "$cloud-200",
2047
2059
  "icon-on-interactive-danger": "$white",
2048
2060
  "icon-on-interactive-primary": "$white",
2049
2061
  "icon-on-interactive-secondary": "$white",
@@ -2091,19 +2103,19 @@ const colors = {
2091
2103
  "text-danger-hover": "$red-350",
2092
2104
  "text-danger-inverted": "$red-900",
2093
2105
  "text-danger-pressed": "$red-300",
2106
+ "text-interactive-on-inverted": "$cloud-900",
2107
+ "text-interactive-on-inverted-hover": "$cloud-850",
2108
+ "text-interactive-on-inverted-pressed": "$cloud-800",
2109
+ "text-interactive-on-inverted-secondary": "$cloud-700",
2110
+ "text-interactive-on-inverted-secondary-hover": "$cloud-650",
2111
+ "text-interactive-on-inverted-secondary-pressed": "$cloud-600",
2112
+ "text-interactive-primary": "$blue-500",
2113
+ "text-interactive-primary-hover": "$blue-450",
2114
+ "text-interactive-primary-pressed": "$blue-400",
2115
+ "text-interactive-secondary": "$cloud-300",
2116
+ "text-interactive-secondary-hover": "$cloud-250",
2117
+ "text-interactive-secondary-pressed": "$cloud-200",
2094
2118
  "text-interactive-selected": "$blue-400",
2095
- "text-link": "$blue-500",
2096
- "text-link-hover": "$blue-450",
2097
- "text-link-on-inverted": "$cloud-900",
2098
- "text-link-on-inverted-hover": "$cloud-850",
2099
- "text-link-on-inverted-pressed": "$cloud-800",
2100
- "text-link-on-inverted-secondary": "$cloud-700",
2101
- "text-link-on-inverted-secondary-hover": "$cloud-650",
2102
- "text-link-on-inverted-secondary-pressed": "$cloud-600",
2103
- "text-link-pressed": "$blue-400",
2104
- "text-link-secondary": "$cloud-300",
2105
- "text-link-secondary-hover": "$cloud-250",
2106
- "text-link-secondary-pressed": "$cloud-200",
2107
2119
  "text-on-interactive-danger": "$white",
2108
2120
  "text-on-interactive-primary": "$white",
2109
2121
  "text-on-interactive-secondary": "$white",