Skip to content

Commit 086fd63

Browse files
lukasoppermannlukasoppermann
authored
move overrides for diffBlob to component file (#1137)
* move overrides for diffBlob to component file * fix for mode override * fix * fixes
1 parent 3e281b1 commit 086fd63

File tree

7 files changed

+105
-179
lines changed

7 files changed

+105
-179
lines changed

‎scripts/buildFigma.ts

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -134,7 +134,7 @@ const buildFigma = async (buildOptions: ConfigGeneratorOptions): Promise<void> =
134134
`src/tokens/functional/color/light/primitives-light.json5`,
135135
`src/tokens/functional/color/light/patterns-light.json5`,
136136
],
137-
theme: 'light high contrast',
137+
theme: 'light-high-contrast',
138138
},
139139
{
140140
name: 'light-colorblind',
@@ -146,7 +146,7 @@ const buildFigma = async (buildOptions: ConfigGeneratorOptions): Promise<void> =
146146
`src/tokens/functional/color/light/primitives-light.json5`,
147147
`src/tokens/functional/color/light/patterns-light.json5`,
148148
],
149-
theme: 'light protanopia deuteranopia',
149+
theme: 'light-protanopia-deuteranopia',
150150
},
151151
{
152152
name: 'light-tritanopia',
@@ -158,7 +158,7 @@ const buildFigma = async (buildOptions: ConfigGeneratorOptions): Promise<void> =
158158
`src/tokens/functional/color/light/primitives-light.json5`,
159159
`src/tokens/functional/color/light/patterns-light.json5`,
160160
],
161-
theme: 'light tritanopia',
161+
theme: 'light-tritanopia',
162162
},
163163
{
164164
name: 'dark',
@@ -181,7 +181,7 @@ const buildFigma = async (buildOptions: ConfigGeneratorOptions): Promise<void> =
181181
`src/tokens/functional/color/dark/primitives-dark.json5`,
182182
`src/tokens/functional/color/dark/patterns-dark.json5`,
183183
],
184-
theme: 'dark high contrast',
184+
theme: 'dark-high-contrast',
185185
},
186186
{
187187
name: 'dark-dimmed',
@@ -193,7 +193,7 @@ const buildFigma = async (buildOptions: ConfigGeneratorOptions): Promise<void> =
193193
`src/tokens/functional/color/dark/primitives-dark.json5`,
194194
`src/tokens/functional/color/dark/patterns-dark.json5`,
195195
],
196-
theme: 'dark dimmed',
196+
theme: 'dark-dimmed',
197197
},
198198
{
199199
name: 'dark-colorblind',
@@ -205,7 +205,7 @@ const buildFigma = async (buildOptions: ConfigGeneratorOptions): Promise<void> =
205205
`src/tokens/functional/color/dark/primitives-dark.json5`,
206206
`src/tokens/functional/color/dark/patterns-dark.json5`,
207207
],
208-
theme: 'dark protanopia deuteranopia',
208+
theme: 'dark-protanopia-deuteranopia',
209209
},
210210
{
211211
name: 'dark-tritanopia',
@@ -217,7 +217,7 @@ const buildFigma = async (buildOptions: ConfigGeneratorOptions): Promise<void> =
217217
`src/tokens/functional/color/dark/primitives-dark.json5`,
218218
`src/tokens/functional/color/dark/patterns-dark.json5`,
219219
],
220-
theme: 'dark tritanopia',
220+
theme: 'dark-tritanopia',
221221
},
222222
]
223223
//

‎scripts/buildTokens.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -40,10 +40,10 @@ const getStyleDictionaryConfig: StyleDictionaryConfigGenerator = (
4040
Object.entries({
4141
css: css(`css/${filename}.css`, options.prefix, options.buildPath, {
4242
themed: options.themed,
43-
theme: [options.theme, getFallbackTheme(options.theme)],
43+
theme: options.theme,
4444
}),
4545
docJson: docJson(`docs/${filename}.json`, options.prefix, options.buildPath, {
46-
theme: [options.theme, getFallbackTheme(options.theme)],
46+
theme: options.theme,
4747
}),
4848
styleLint: styleLint(`styleLint/${filename}.json`, options.prefix, options.buildPath, {
4949
theme: options.theme,

‎src/platforms/figma.ts

Lines changed: 46 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -20,47 +20,52 @@ const validFigmaToken = async (token: TransformedToken, options: Config) => {
2020
return validTypes.includes(token.$type)
2121
}
2222

23-
export const figma: PlatformInitializer = (outputFile, prefix, buildPath, options): PlatformConfig => ({
24-
prefix,
25-
buildPath,
26-
preprocessors: ['themeOverrides'],
27-
transforms: [
28-
'color/rgbaFloat',
29-
'fontFamily/figma',
30-
'float/pixelUnitless',
31-
'dimension/pixelUnitless',
32-
// 'border/figma',
33-
// 'typography/figma',
34-
'fontWeight/number',
35-
'figma/attributes',
36-
'name/pathToFigma',
37-
],
38-
options: {
39-
basePxFontSize: 16,
40-
fontFamilies: {
41-
'fontStack/system': 'SF Pro Text',
42-
'fontStack/sansSerif': 'SF Pro Text',
43-
'fontStack/sansSerifDisplay': 'SF Pro Display',
44-
'fontStack/monospace': 'SF Mono',
45-
},
46-
// should this object be spread here?
47-
...options,
48-
theme: options?.theme[0].replaceAll('-', ' '),
49-
themeOverrides: {
50-
theme: options?.theme,
51-
},
52-
},
53-
files: [
54-
{
55-
destination: outputFile,
56-
filter: (token: TransformedToken, config: Config) => {
57-
return validFigmaToken(token, config)
23+
export const figma: PlatformInitializer = (outputFile, prefix, buildPath, options = {}): PlatformConfig => {
24+
const {theme} = options
25+
const figmaTheme = (theme?.[0] || '').replaceAll('-', ' ')
26+
27+
return {
28+
prefix,
29+
buildPath,
30+
preprocessors: ['themeOverrides'],
31+
transforms: [
32+
'color/rgbaFloat',
33+
'fontFamily/figma',
34+
'float/pixelUnitless',
35+
'dimension/pixelUnitless',
36+
// 'border/figma',
37+
// 'typography/figma',
38+
'fontWeight/number',
39+
'figma/attributes',
40+
'name/pathToFigma',
41+
],
42+
options: {
43+
basePxFontSize: 16,
44+
fontFamilies: {
45+
'fontStack/system': 'SF Pro Text',
46+
'fontStack/sansSerif': 'SF Pro Text',
47+
'fontStack/sansSerifDisplay': 'SF Pro Display',
48+
'fontStack/monospace': 'SF Mono',
5849
},
59-
format: `json/figma`,
60-
options: {
61-
outputReferences: true,
62-
theme: options?.theme[0].replaceAll('-', ' '),
50+
// should this object be spread here?
51+
...options,
52+
theme: figmaTheme,
53+
themeOverrides: {
54+
theme: options.theme,
6355
},
6456
},
65-
],
66-
})
57+
files: [
58+
{
59+
destination: outputFile,
60+
filter: (token: TransformedToken, config: Config) => {
61+
return validFigmaToken(token, config)
62+
},
63+
format: `json/figma`,
64+
options: {
65+
outputReferences: true,
66+
theme: figmaTheme,
67+
},
68+
},
69+
],
70+
}
71+
}

‎src/tokens/component/diffBlob.json5

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -55,6 +55,11 @@
5555
$value: '{base.color.green.4}',
5656
alpha: 0.4,
5757
},
58+
'light-protanopia-deuteranopia': '{base.color.blue.1}',
59+
'dark-protanopia-deuteranopia': {
60+
$value: '{base.color.blue.4}',
61+
alpha: 0.4,
62+
},
5863
},
5964
},
6065
},
@@ -85,6 +90,11 @@
8590
$value: '{base.color.green.3}',
8691
alpha: 0.3,
8792
},
93+
'light-protanopia-deuteranopia': '{base.color.blue.1}',
94+
'dark-protanopia-deuteranopia': {
95+
$value: '{base.color.blue.3}',
96+
alpha: 0.3,
97+
},
8898
},
8999
},
90100
},
@@ -110,6 +120,12 @@
110120
group: 'component',
111121
scopes: ['bgColor'],
112122
},
123+
'org.primer.overrides': {
124+
'dark-protanopia-deuteranopia': {
125+
$value: '{base.color.orange.4}',
126+
alpha: 0.15,
127+
},
128+
},
113129
},
114130
},
115131
},
@@ -139,6 +155,11 @@
139155
$value: '{base.color.red.4}',
140156
alpha: 0.4,
141157
},
158+
'light-protanopia-deuteranopia': '{base.color.orange.1}',
159+
'dark-protanopia-deuteranopia': {
160+
$value: '{base.color.orange.4}',
161+
alpha: 0.4,
162+
},
142163
},
143164
},
144165
},
@@ -169,6 +190,11 @@
169190
$value: '{base.color.red.4}',
170191
alpha: 0.3,
171192
},
193+
'light-protanopia-deuteranopia': '{base.color.orange.1}',
194+
'dark-protanopia-deuteranopia': {
195+
$value: '{base.color.orange.4}',
196+
alpha: 0.3,
197+
},
172198
},
173199
},
174200
},
@@ -183,6 +209,10 @@
183209
group: 'component',
184210
scopes: ['bgColor'],
185211
},
212+
'org.primer.overrides': {
213+
'light-protanopia-deuteranopia': '{base.color.neutral.1}',
214+
'dark-protanopia-deuteranopia': '{base.color.neutral.3}',
215+
},
186216
},
187217
},
188218
fgColor: {
@@ -219,6 +249,9 @@
219249
group: 'component',
220250
scopes: ['fgColor'],
221251
},
252+
'org.primer.overrides': {
253+
'light-protanopia-deuteranopia': '{fgColor.default}',
254+
},
222255
},
223256
},
224257
},
@@ -234,6 +267,8 @@
234267
},
235268
'org.primer.overrides': {
236269
dark: '{base.color.blue.8}',
270+
'light-protanopia-deuteranopia': '{base.color.neutral.3}',
271+
'dark-protanopia-deuteranopia': '{base.color.neutral.6}',
237272
},
238273
},
239274
},
@@ -246,6 +281,10 @@
246281
group: 'component',
247282
scopes: ['bgColor'],
248283
},
284+
'org.primer.overrides': {
285+
'light-protanopia-deuteranopia': '{base.color.neutral.7}',
286+
'dark-protanopia-deuteranopia': '{base.color.neutral.8}',
287+
},
249288
},
250289
},
251290
},

‎src/tokens/functional/color/dark/overrides/dark.protanopia-deuteranopia.json5

Lines changed: 0 additions & 58 deletions
Original file line numberDiff line numberDiff line change
@@ -186,64 +186,6 @@
186186
},
187187
},
188188
},
189-
diffBlob: {
190-
additionNum: {
191-
bgColor: {
192-
$value: '{base.color.blue.3}',
193-
$type: 'color',
194-
alpha: 0.3,
195-
},
196-
},
197-
additionWord: {
198-
bgColor: {
199-
$value: '{base.color.blue.4}',
200-
$type: 'color',
201-
alpha: 0.4,
202-
},
203-
},
204-
deletionNum: {
205-
bgColor: {
206-
$value: '{base.color.orange.4}',
207-
$type: 'color',
208-
alpha: 0.3,
209-
},
210-
},
211-
deletionLine: {
212-
bgColor: {
213-
$value: '{base.color.orange.4}',
214-
$type: 'color',
215-
alpha: 0.15,
216-
},
217-
},
218-
deletionWord: {
219-
bgColor: {
220-
$value: '{base.color.orange.4}',
221-
$type: 'color',
222-
alpha: 0.4,
223-
},
224-
},
225-
hunkNum: {
226-
bgColor: {
227-
rest: {
228-
$value: '{base.color.neutral.6}',
229-
$type: 'color',
230-
alpha: 1,
231-
},
232-
hover: {
233-
$value: '{base.color.neutral.8}',
234-
$type: 'color',
235-
alpha: 1,
236-
},
237-
},
238-
},
239-
hunkLine: {
240-
bgColor: {
241-
$value: '{base.color.neutral.3}',
242-
$type: 'color',
243-
alpha: 1,
244-
},
245-
},
246-
},
247189
color: {
248190
ansi: {
249191
green: {

0 commit comments

Comments
 (0)