Skip to content

Commit 2e71a9b

Browse files
avinashbotavinashbot
authored
chore: Make color-background-button-link-* tokens public and themeable (#3507)
1 parent ed8b9fc commit 2e71a9b

File tree

2 files changed

+234
-0
lines changed

2 files changed

+234
-0
lines changed

‎src/__tests__/snapshot-tests/__snapshots__/design-tokens.test.ts.snap

Lines changed: 224 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -111,6 +111,20 @@ exports[`Design tokens artifacts Design tokens JSON for classic matches the snap
111111
"light": "radial-gradient(circle farthest-corner at top right, #b8e7ff 0%, #0099ff 25%, #5c7fff 40% , #8575ff 60%, #962eff 80%)",
112112
},
113113
},
114+
"color-background-button-link-active": {
115+
"$description": "The background color of link buttons in active state.",
116+
"$value": {
117+
"dark": "#16191f",
118+
"light": "#eaeded",
119+
},
120+
},
121+
"color-background-button-link-hover": {
122+
"$description": "The background color of link buttons in hover state.",
123+
"$value": {
124+
"dark": "#21252c",
125+
"light": "#fafafa",
126+
},
127+
},
114128
"color-background-button-normal-active": {
115129
"$description": "The background color of normal buttons in active state.",
116130
"$value": {
@@ -2669,6 +2683,20 @@ exports[`Design tokens artifacts Design tokens JSON for classic matches the snap
26692683
"light": "radial-gradient(circle farthest-corner at top right, #b8e7ff 0%, #0099ff 25%, #5c7fff 40% , #8575ff 60%, #962eff 80%)",
26702684
},
26712685
},
2686+
"color-background-button-link-active": {
2687+
"$description": "The background color of link buttons in active state.",
2688+
"$value": {
2689+
"dark": "#16191f",
2690+
"light": "#eaeded",
2691+
},
2692+
},
2693+
"color-background-button-link-hover": {
2694+
"$description": "The background color of link buttons in hover state.",
2695+
"$value": {
2696+
"dark": "#21252c",
2697+
"light": "#fafafa",
2698+
},
2699+
},
26722700
"color-background-button-normal-active": {
26732701
"$description": "The background color of normal buttons in active state.",
26742702
"$value": {
@@ -5227,6 +5255,20 @@ exports[`Design tokens artifacts Design tokens JSON for classic matches the snap
52275255
"light": "radial-gradient(circle farthest-corner at top right, #b8e7ff 0%, #0099ff 25%, #5c7fff 40% , #8575ff 60%, #962eff 80%)",
52285256
},
52295257
},
5258+
"color-background-button-link-active": {
5259+
"$description": "The background color of link buttons in active state.",
5260+
"$value": {
5261+
"dark": "#16191f",
5262+
"light": "#eaeded",
5263+
},
5264+
},
5265+
"color-background-button-link-hover": {
5266+
"$description": "The background color of link buttons in hover state.",
5267+
"$value": {
5268+
"dark": "#21252c",
5269+
"light": "#fafafa",
5270+
},
5271+
},
52305272
"color-background-button-normal-active": {
52315273
"$description": "The background color of normal buttons in active state.",
52325274
"$value": {
@@ -7785,6 +7827,20 @@ exports[`Design tokens artifacts Design tokens JSON for classic matches the snap
77857827
"light": "radial-gradient(circle farthest-corner at top right, #b8e7ff 0%, #0099ff 25%, #5c7fff 40% , #8575ff 60%, #962eff 80%)",
77867828
},
77877829
},
7830+
"color-background-button-link-active": {
7831+
"$description": "The background color of link buttons in active state.",
7832+
"$value": {
7833+
"dark": "#16191f",
7834+
"light": "#eaeded",
7835+
},
7836+
},
7837+
"color-background-button-link-hover": {
7838+
"$description": "The background color of link buttons in hover state.",
7839+
"$value": {
7840+
"dark": "#21252c",
7841+
"light": "#fafafa",
7842+
},
7843+
},
77887844
"color-background-button-normal-active": {
77897845
"$description": "The background color of normal buttons in active state.",
77907846
"$value": {
@@ -10343,6 +10399,20 @@ exports[`Design tokens artifacts Design tokens JSON for classic matches the snap
1034310399
"light": "radial-gradient(circle farthest-corner at top right, #b8e7ff 0%, #0099ff 25%, #5c7fff 40% , #8575ff 60%, #962eff 80%)",
1034410400
},
1034510401
},
10402+
"color-background-button-link-active": {
10403+
"$description": "The background color of link buttons in active state.",
10404+
"$value": {
10405+
"dark": "#16191f",
10406+
"light": "#eaeded",
10407+
},
10408+
},
10409+
"color-background-button-link-hover": {
10410+
"$description": "The background color of link buttons in hover state.",
10411+
"$value": {
10412+
"dark": "#21252c",
10413+
"light": "#fafafa",
10414+
},
10415+
},
1034610416
"color-background-button-normal-active": {
1034710417
"$description": "The background color of normal buttons in active state.",
1034810418
"$value": {
@@ -12901,6 +12971,20 @@ exports[`Design tokens artifacts Design tokens JSON for classic matches the snap
1290112971
"light": "radial-gradient(circle farthest-corner at top right, #b8e7ff 0%, #0099ff 25%, #5c7fff 40% , #8575ff 60%, #962eff 80%)",
1290212972
},
1290312973
},
12974+
"color-background-button-link-active": {
12975+
"$description": "The background color of link buttons in active state.",
12976+
"$value": {
12977+
"dark": "#16191f",
12978+
"light": "#16191f",
12979+
},
12980+
},
12981+
"color-background-button-link-hover": {
12982+
"$description": "The background color of link buttons in hover state.",
12983+
"$value": {
12984+
"dark": "#21252c",
12985+
"light": "#21252c",
12986+
},
12987+
},
1290412988
"color-background-button-normal-active": {
1290512989
"$description": "The background color of normal buttons in active state.",
1290612990
"$value": {
@@ -15459,6 +15543,20 @@ exports[`Design tokens artifacts Design tokens JSON for classic matches the snap
1545915543
"light": "radial-gradient(circle farthest-corner at top right, #b8e7ff 0%, #0099ff 25%, #5c7fff 40% , #8575ff 60%, #962eff 80%)",
1546015544
},
1546115545
},
15546+
"color-background-button-link-active": {
15547+
"$description": "The background color of link buttons in active state.",
15548+
"$value": {
15549+
"dark": "#16191f",
15550+
"light": "#eaeded",
15551+
},
15552+
},
15553+
"color-background-button-link-hover": {
15554+
"$description": "The background color of link buttons in hover state.",
15555+
"$value": {
15556+
"dark": "#21252c",
15557+
"light": "#fafafa",
15558+
},
15559+
},
1546215560
"color-background-button-normal-active": {
1546315561
"$description": "The background color of normal buttons in active state.",
1546415562
"$value": {
@@ -18022,6 +18120,20 @@ exports[`Design tokens artifacts Design tokens JSON for visual-refresh matches t
1802218120
"light": "radial-gradient(circle farthest-corner at top right, #b8e7ff 0%, #0099ff 25%, #5c7fff 40% , #8575ff 60%, #962eff 80%)",
1802318121
},
1802418122
},
18123+
"color-background-button-link-active": {
18124+
"$description": "The background color of link buttons in active state.",
18125+
"$value": {
18126+
"dark": "#333843",
18127+
"light": "#d1f1ff",
18128+
},
18129+
},
18130+
"color-background-button-link-hover": {
18131+
"$description": "The background color of link buttons in hover state.",
18132+
"$value": {
18133+
"dark": "#1b232d",
18134+
"light": "#f0fbff",
18135+
},
18136+
},
1802518137
"color-background-button-normal-active": {
1802618138
"$description": "The background color of normal buttons in active state.",
1802718139
"$value": {
@@ -20580,6 +20692,20 @@ exports[`Design tokens artifacts Design tokens JSON for visual-refresh matches t
2058020692
"light": "radial-gradient(circle farthest-corner at top right, #b8e7ff 0%, #0099ff 25%, #5c7fff 40% , #8575ff 60%, #962eff 80%)",
2058120693
},
2058220694
},
20695+
"color-background-button-link-active": {
20696+
"$description": "The background color of link buttons in active state.",
20697+
"$value": {
20698+
"dark": "#333843",
20699+
"light": "#333843",
20700+
},
20701+
},
20702+
"color-background-button-link-hover": {
20703+
"$description": "The background color of link buttons in hover state.",
20704+
"$value": {
20705+
"dark": "#1b232d",
20706+
"light": "#1b232d",
20707+
},
20708+
},
2058320709
"color-background-button-normal-active": {
2058420710
"$description": "The background color of normal buttons in active state.",
2058520711
"$value": {
@@ -23138,6 +23264,20 @@ exports[`Design tokens artifacts Design tokens JSON for visual-refresh matches t
2313823264
"light": "radial-gradient(circle farthest-corner at top right, #b8e7ff 0%, #0099ff 25%, #5c7fff 40% , #8575ff 60%, #962eff 80%)",
2313923265
},
2314023266
},
23267+
"color-background-button-link-active": {
23268+
"$description": "The background color of link buttons in active state.",
23269+
"$value": {
23270+
"dark": "#333843",
23271+
"light": "#d1f1ff",
23272+
},
23273+
},
23274+
"color-background-button-link-hover": {
23275+
"$description": "The background color of link buttons in hover state.",
23276+
"$value": {
23277+
"dark": "#1b232d",
23278+
"light": "#f0fbff",
23279+
},
23280+
},
2314123281
"color-background-button-normal-active": {
2314223282
"$description": "The background color of normal buttons in active state.",
2314323283
"$value": {
@@ -25696,6 +25836,20 @@ exports[`Design tokens artifacts Design tokens JSON for visual-refresh matches t
2569625836
"light": "radial-gradient(circle farthest-corner at top right, #b8e7ff 0%, #0099ff 25%, #5c7fff 40% , #8575ff 60%, #962eff 80%)",
2569725837
},
2569825838
},
25839+
"color-background-button-link-active": {
25840+
"$description": "The background color of link buttons in active state.",
25841+
"$value": {
25842+
"dark": "#333843",
25843+
"light": "#d1f1ff",
25844+
},
25845+
},
25846+
"color-background-button-link-hover": {
25847+
"$description": "The background color of link buttons in hover state.",
25848+
"$value": {
25849+
"dark": "#1b232d",
25850+
"light": "#f0fbff",
25851+
},
25852+
},
2569925853
"color-background-button-normal-active": {
2570025854
"$description": "The background color of normal buttons in active state.",
2570125855
"$value": {
@@ -28254,6 +28408,20 @@ exports[`Design tokens artifacts Design tokens JSON for visual-refresh matches t
2825428408
"light": "radial-gradient(circle farthest-corner at top right, #b8e7ff 0%, #0099ff 25%, #5c7fff 40% , #8575ff 60%, #962eff 80%)",
2825528409
},
2825628410
},
28411+
"color-background-button-link-active": {
28412+
"$description": "The background color of link buttons in active state.",
28413+
"$value": {
28414+
"dark": "#333843",
28415+
"light": "#d1f1ff",
28416+
},
28417+
},
28418+
"color-background-button-link-hover": {
28419+
"$description": "The background color of link buttons in hover state.",
28420+
"$value": {
28421+
"dark": "#1b232d",
28422+
"light": "#f0fbff",
28423+
},
28424+
},
2825728425
"color-background-button-normal-active": {
2825828426
"$description": "The background color of normal buttons in active state.",
2825928427
"$value": {
@@ -30812,6 +30980,20 @@ exports[`Design tokens artifacts Design tokens JSON for visual-refresh matches t
3081230980
"light": "radial-gradient(circle farthest-corner at top right, #b8e7ff 0%, #0099ff 25%, #5c7fff 40% , #8575ff 60%, #962eff 80%)",
3081330981
},
3081430982
},
30983+
"color-background-button-link-active": {
30984+
"$description": "The background color of link buttons in active state.",
30985+
"$value": {
30986+
"dark": "#333843",
30987+
"light": "#d1f1ff",
30988+
},
30989+
},
30990+
"color-background-button-link-hover": {
30991+
"$description": "The background color of link buttons in hover state.",
30992+
"$value": {
30993+
"dark": "#1b232d",
30994+
"light": "#f0fbff",
30995+
},
30996+
},
3081530997
"color-background-button-normal-active": {
3081630998
"$description": "The background color of normal buttons in active state.",
3081730999
"$value": {
@@ -33370,6 +33552,20 @@ exports[`Design tokens artifacts Design tokens JSON for visual-refresh matches t
3337033552
"light": "radial-gradient(circle farthest-corner at top right, #b8e7ff 0%, #0099ff 25%, #5c7fff 40% , #8575ff 60%, #962eff 80%)",
3337133553
},
3337233554
},
33555+
"color-background-button-link-active": {
33556+
"$description": "The background color of link buttons in active state.",
33557+
"$value": {
33558+
"dark": "#333843",
33559+
"light": "#333843",
33560+
},
33561+
},
33562+
"color-background-button-link-hover": {
33563+
"$description": "The background color of link buttons in hover state.",
33564+
"$value": {
33565+
"dark": "#1b232d",
33566+
"light": "#1b232d",
33567+
},
33568+
},
3337333569
"color-background-button-normal-active": {
3337433570
"$description": "The background color of normal buttons in active state.",
3337533571
"$value": {
@@ -35928,6 +36124,20 @@ exports[`Design tokens artifacts Design tokens JSON for visual-refresh matches t
3592836124
"light": "radial-gradient(circle farthest-corner at top right, #b8e7ff 0%, #0099ff 25%, #5c7fff 40% , #8575ff 60%, #962eff 80%)",
3592936125
},
3593036126
},
36127+
"color-background-button-link-active": {
36128+
"$description": "The background color of link buttons in active state.",
36129+
"$value": {
36130+
"dark": "#333843",
36131+
"light": "#333843",
36132+
},
36133+
},
36134+
"color-background-button-link-hover": {
36135+
"$description": "The background color of link buttons in hover state.",
36136+
"$value": {
36137+
"dark": "#1b232d",
36138+
"light": "#1b232d",
36139+
},
36140+
},
3593136141
"color-background-button-normal-active": {
3593236142
"$description": "The background color of normal buttons in active state.",
3593336143
"$value": {
@@ -38486,6 +38696,20 @@ exports[`Design tokens artifacts Design tokens JSON for visual-refresh matches t
3848638696
"light": "radial-gradient(circle farthest-corner at top right, #b8e7ff 0%, #0099ff 25%, #5c7fff 40% , #8575ff 60%, #962eff 80%)",
3848738697
},
3848838698
},
38699+
"color-background-button-link-active": {
38700+
"$description": "The background color of link buttons in active state.",
38701+
"$value": {
38702+
"dark": "#333843",
38703+
"light": "#d1f1ff",
38704+
},
38705+
},
38706+
"color-background-button-link-hover": {
38707+
"$description": "The background color of link buttons in hover state.",
38708+
"$value": {
38709+
"dark": "#1b232d",
38710+
"light": "#f0fbff",
38711+
},
38712+
},
3848938713
"color-background-button-normal-active": {
3849038714
"$description": "The background color of normal buttons in active state.",
3849138715
"$value": {

‎style-dictionary/visual-refresh/metadata/colors.ts

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,16 @@ const metadata: StyleDictionary.MetadataIndex = {
2323
themeable: true,
2424
public: true,
2525
},
26+
colorBackgroundButtonLinkActive: {
27+
description: 'The background color of link buttons in active state.',
28+
themeable: true,
29+
public: true,
30+
},
31+
colorBackgroundButtonLinkHover: {
32+
description: 'The background color of link buttons in hover state.',
33+
themeable: true,
34+
public: true,
35+
},
2636
colorBackgroundToggleButtonNormalPressed: {
2737
description: 'The background color of normal toggle buttons in pressed state.',
2838
themeable: true,

0 commit comments

Comments
 (0)