@primer/primitives 9.0.0-rc.fa8264ac → 9.0.0
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.
- package/dist/css/functional/themes/dark-colorblind.css +12 -8
- package/dist/css/functional/themes/dark-dimmed.css +10 -6
- package/dist/css/functional/themes/dark-high-contrast.css +54 -50
- package/dist/css/functional/themes/dark-tritanopia.css +12 -8
- package/dist/css/functional/themes/dark.css +10 -6
- package/dist/css/functional/themes/light-colorblind.css +16 -12
- package/dist/css/functional/themes/light-high-contrast.css +22 -18
- package/dist/css/functional/themes/light-tritanopia.css +16 -12
- package/dist/css/functional/themes/light.css +14 -10
- package/dist/docs/functional/themes/dark-colorblind.json +153 -97
- package/dist/docs/functional/themes/dark-dimmed.json +155 -99
- package/dist/docs/functional/themes/dark-high-contrast.json +243 -161
- package/dist/docs/functional/themes/dark-tritanopia.json +153 -97
- package/dist/docs/functional/themes/dark.json +152 -96
- package/dist/docs/functional/themes/light-colorblind.json +159 -101
- package/dist/docs/functional/themes/light-high-contrast.json +177 -117
- package/dist/docs/functional/themes/light-tritanopia.json +159 -101
- package/dist/docs/functional/themes/light.json +158 -100
- package/dist/figma/figma.json +3 -3
- package/dist/figma/scales/dark-dimmed.json +56 -24
- package/dist/figma/scales/dark-high-constrast.json +56 -24
- package/dist/figma/scales/dark.json +56 -24
- package/dist/figma/scales/light-high-constrast.json +59 -27
- package/dist/figma/scales/light.json +59 -27
- package/dist/figma/shadows/dark-colorblind.json +167 -167
- package/dist/figma/shadows/dark-dimmed.json +167 -167
- package/dist/figma/shadows/dark-high-contrast.json +167 -167
- package/dist/figma/shadows/dark-tritanopia.json +167 -167
- package/dist/figma/shadows/dark.json +167 -167
- package/dist/figma/shadows/light-colorblind.json +84 -84
- package/dist/figma/shadows/light-high-contrast.json +84 -84
- package/dist/figma/shadows/light-tritanopia.json +84 -84
- package/dist/figma/shadows/light.json +84 -84
- package/dist/figma/themes/dark-colorblind.json +1023 -992
- package/dist/figma/themes/dark-dimmed.json +1943 -1912
- package/dist/figma/themes/dark-high-contrast.json +2865 -2830
- package/dist/figma/themes/dark-tritanopia.json +1022 -991
- package/dist/figma/themes/dark.json +1019 -988
- package/dist/figma/themes/light-colorblind.json +1419 -1387
- package/dist/figma/themes/light-high-contrast.json +1254 -1221
- package/dist/figma/themes/light-tritanopia.json +1419 -1387
- package/dist/figma/themes/light.json +1357 -1325
- package/dist/internalCss/dark-colorblind.css +40 -32
- package/dist/internalCss/dark-dimmed.css +38 -30
- package/dist/internalCss/dark-high-contrast.css +82 -74
- package/dist/internalCss/dark-tritanopia.css +40 -32
- package/dist/internalCss/dark.css +38 -30
- package/dist/internalCss/light-colorblind.css +46 -38
- package/dist/internalCss/light-high-contrast.css +52 -44
- package/dist/internalCss/light-tritanopia.css +46 -38
- package/dist/internalCss/light.css +44 -36
- package/dist/styleLint/functional/themes/dark-colorblind.json +153 -97
- package/dist/styleLint/functional/themes/dark-dimmed.json +155 -99
- package/dist/styleLint/functional/themes/dark-high-contrast.json +243 -161
- package/dist/styleLint/functional/themes/dark-tritanopia.json +153 -97
- package/dist/styleLint/functional/themes/dark.json +152 -96
- package/dist/styleLint/functional/themes/light-colorblind.json +159 -101
- package/dist/styleLint/functional/themes/light-high-contrast.json +177 -117
- package/dist/styleLint/functional/themes/light-tritanopia.json +159 -101
- package/dist/styleLint/functional/themes/light.json +158 -100
- package/package.json +1 -1
- package/src/schemas/colorToken.ts +1 -1
- package/src/schemas/dimensionToken.ts +1 -0
- package/src/schemas/scopes.ts +10 -21
- package/src/tokens/base/color/dark/dark.dimmed.json5 +0 -20
- package/src/tokens/base/color/dark/dark.json5 +29 -11
- package/src/tokens/base/color/light/light.json5 +29 -11
- package/src/tokens/functional/color/dark/app-dark.json5 +5 -5
- package/src/tokens/functional/color/dark/overrides/dark.dimmed.json5 +24 -24
- package/src/tokens/functional/color/dark/overrides/dark.high-contrast.json5 +82 -83
- package/src/tokens/functional/color/dark/patterns-dark.json5 +62 -37
- package/src/tokens/functional/color/dark/primitives-dark.json5 +23 -23
- package/src/tokens/functional/color/dark/syntax-dark.json5 +14 -14
- package/src/tokens/functional/color/light/app-light.json5 +5 -5
- package/src/tokens/functional/color/light/overrides/light.high-contrast.json5 +73 -25
- package/src/tokens/functional/color/light/patterns-light.json5 +65 -39
- package/src/tokens/functional/color/light/primitives-light.json5 +23 -23
- package/src/tokens/functional/color/light/syntax-light.json5 +14 -14
- package/src/tokens/functional/shadow/dark.json5 +15 -15
- package/src/tokens/functional/shadow/light.json5 +16 -16
- package/src/transformers/figmaAttributes.ts +6 -0
|
@@ -50,304 +50,304 @@
|
|
|
50
50
|
"group": "shadow"
|
|
51
51
|
},
|
|
52
52
|
{
|
|
53
|
-
"name": "shadow/
|
|
53
|
+
"name": "button/danger/shadow/selected/offsetX",
|
|
54
54
|
"value": 0,
|
|
55
55
|
"type": "FLOAT",
|
|
56
56
|
"scopes": ["EFFECT_FLOAT"],
|
|
57
57
|
"mode": "light colorblind",
|
|
58
58
|
"collection": "mode",
|
|
59
|
-
"group": "shadow"
|
|
59
|
+
"group": "component shadow"
|
|
60
60
|
},
|
|
61
61
|
{
|
|
62
|
-
"name": "shadow/
|
|
62
|
+
"name": "button/danger/shadow/selected/offsetY",
|
|
63
63
|
"value": 1,
|
|
64
64
|
"type": "FLOAT",
|
|
65
65
|
"scopes": ["EFFECT_FLOAT"],
|
|
66
66
|
"mode": "light colorblind",
|
|
67
67
|
"collection": "mode",
|
|
68
|
-
"group": "shadow"
|
|
68
|
+
"group": "component shadow"
|
|
69
69
|
},
|
|
70
70
|
{
|
|
71
|
-
"name": "shadow/
|
|
71
|
+
"name": "button/danger/shadow/selected/blur",
|
|
72
72
|
"value": 0,
|
|
73
73
|
"type": "FLOAT",
|
|
74
74
|
"scopes": ["EFFECT_FLOAT"],
|
|
75
75
|
"mode": "light colorblind",
|
|
76
76
|
"collection": "mode",
|
|
77
|
-
"group": "shadow"
|
|
77
|
+
"group": "component shadow"
|
|
78
78
|
},
|
|
79
79
|
{
|
|
80
|
-
"name": "shadow/
|
|
80
|
+
"name": "button/danger/shadow/selected/spread",
|
|
81
81
|
"value": 0,
|
|
82
82
|
"type": "FLOAT",
|
|
83
83
|
"scopes": ["EFFECT_FLOAT"],
|
|
84
84
|
"mode": "light colorblind",
|
|
85
85
|
"collection": "mode",
|
|
86
|
-
"group": "shadow"
|
|
86
|
+
"group": "component shadow"
|
|
87
87
|
},
|
|
88
88
|
{
|
|
89
|
-
"name": "shadow/
|
|
89
|
+
"name": "button/danger/shadow/selected/color",
|
|
90
90
|
"value": {
|
|
91
|
-
"r": 0.
|
|
92
|
-
"g": 0
|
|
93
|
-
"b": 0.
|
|
94
|
-
"a": 0.
|
|
91
|
+
"r": 0.2980392156862745,
|
|
92
|
+
"g": 0,
|
|
93
|
+
"b": 0.0784313725490196,
|
|
94
|
+
"a": 0.2
|
|
95
95
|
},
|
|
96
96
|
"type": "COLOR",
|
|
97
97
|
"scopes": ["EFFECT_COLOR"],
|
|
98
98
|
"mode": "light colorblind",
|
|
99
99
|
"collection": "mode",
|
|
100
|
-
"group": "shadow"
|
|
100
|
+
"group": "component shadow"
|
|
101
101
|
},
|
|
102
102
|
{
|
|
103
|
-
"name": "shadow/
|
|
103
|
+
"name": "button/outline/shadow/selected/offsetX",
|
|
104
104
|
"value": 0,
|
|
105
105
|
"type": "FLOAT",
|
|
106
106
|
"scopes": ["EFFECT_FLOAT"],
|
|
107
107
|
"mode": "light colorblind",
|
|
108
108
|
"collection": "mode",
|
|
109
|
-
"group": "shadow"
|
|
109
|
+
"group": "component shadow"
|
|
110
110
|
},
|
|
111
111
|
{
|
|
112
|
-
"name": "shadow/
|
|
112
|
+
"name": "button/outline/shadow/selected/offsetY",
|
|
113
113
|
"value": 1,
|
|
114
114
|
"type": "FLOAT",
|
|
115
115
|
"scopes": ["EFFECT_FLOAT"],
|
|
116
116
|
"mode": "light colorblind",
|
|
117
117
|
"collection": "mode",
|
|
118
|
-
"group": "shadow"
|
|
118
|
+
"group": "component shadow"
|
|
119
119
|
},
|
|
120
120
|
{
|
|
121
|
-
"name": "shadow/
|
|
121
|
+
"name": "button/outline/shadow/selected/blur",
|
|
122
122
|
"value": 0,
|
|
123
123
|
"type": "FLOAT",
|
|
124
124
|
"scopes": ["EFFECT_FLOAT"],
|
|
125
125
|
"mode": "light colorblind",
|
|
126
126
|
"collection": "mode",
|
|
127
|
-
"group": "shadow"
|
|
127
|
+
"group": "component shadow"
|
|
128
128
|
},
|
|
129
129
|
{
|
|
130
|
-
"name": "shadow/
|
|
130
|
+
"name": "button/outline/shadow/selected/spread",
|
|
131
131
|
"value": 0,
|
|
132
132
|
"type": "FLOAT",
|
|
133
133
|
"scopes": ["EFFECT_FLOAT"],
|
|
134
134
|
"mode": "light colorblind",
|
|
135
135
|
"collection": "mode",
|
|
136
|
-
"group": "shadow"
|
|
136
|
+
"group": "component shadow"
|
|
137
137
|
},
|
|
138
138
|
{
|
|
139
|
-
"name": "shadow/
|
|
139
|
+
"name": "button/outline/shadow/selected/color",
|
|
140
140
|
"value": {
|
|
141
|
-
"r": 0
|
|
142
|
-
"g": 0.
|
|
143
|
-
"b": 0.
|
|
144
|
-
"a": 0.
|
|
141
|
+
"r": 0,
|
|
142
|
+
"g": 0.12941176470588237,
|
|
143
|
+
"b": 0.3333333333333333,
|
|
144
|
+
"a": 0.2
|
|
145
145
|
},
|
|
146
146
|
"type": "COLOR",
|
|
147
147
|
"scopes": ["EFFECT_COLOR"],
|
|
148
148
|
"mode": "light colorblind",
|
|
149
149
|
"collection": "mode",
|
|
150
|
-
"group": "shadow"
|
|
150
|
+
"group": "component shadow"
|
|
151
151
|
},
|
|
152
152
|
{
|
|
153
|
-
"name": "shadow/
|
|
153
|
+
"name": "button/primary/shadow/selected/offsetX",
|
|
154
154
|
"value": 0,
|
|
155
155
|
"type": "FLOAT",
|
|
156
156
|
"scopes": ["EFFECT_FLOAT"],
|
|
157
157
|
"mode": "light colorblind",
|
|
158
158
|
"collection": "mode",
|
|
159
|
-
"group": "shadow"
|
|
159
|
+
"group": "component shadow"
|
|
160
160
|
},
|
|
161
161
|
{
|
|
162
|
-
"name": "shadow/
|
|
162
|
+
"name": "button/primary/shadow/selected/offsetY",
|
|
163
163
|
"value": 1,
|
|
164
164
|
"type": "FLOAT",
|
|
165
165
|
"scopes": ["EFFECT_FLOAT"],
|
|
166
166
|
"mode": "light colorblind",
|
|
167
167
|
"collection": "mode",
|
|
168
|
-
"group": "shadow"
|
|
168
|
+
"group": "component shadow"
|
|
169
169
|
},
|
|
170
170
|
{
|
|
171
|
-
"name": "shadow/
|
|
171
|
+
"name": "button/primary/shadow/selected/blur",
|
|
172
172
|
"value": 0,
|
|
173
173
|
"type": "FLOAT",
|
|
174
174
|
"scopes": ["EFFECT_FLOAT"],
|
|
175
175
|
"mode": "light colorblind",
|
|
176
176
|
"collection": "mode",
|
|
177
|
-
"group": "shadow"
|
|
177
|
+
"group": "component shadow"
|
|
178
178
|
},
|
|
179
179
|
{
|
|
180
|
-
"name": "shadow/
|
|
180
|
+
"name": "button/primary/shadow/selected/spread",
|
|
181
181
|
"value": 0,
|
|
182
182
|
"type": "FLOAT",
|
|
183
183
|
"scopes": ["EFFECT_FLOAT"],
|
|
184
184
|
"mode": "light colorblind",
|
|
185
185
|
"collection": "mode",
|
|
186
|
-
"group": "shadow"
|
|
186
|
+
"group": "component shadow"
|
|
187
187
|
},
|
|
188
188
|
{
|
|
189
|
-
"name": "shadow/
|
|
189
|
+
"name": "button/primary/shadow/selected/color",
|
|
190
190
|
"value": {
|
|
191
|
-
"r": 0
|
|
192
|
-
"g": 0.
|
|
193
|
-
"b": 0.
|
|
194
|
-
"a": 0.
|
|
191
|
+
"r": 0,
|
|
192
|
+
"g": 0.17647058823529413,
|
|
193
|
+
"b": 0.06666666666666667,
|
|
194
|
+
"a": 0.3
|
|
195
195
|
},
|
|
196
196
|
"type": "COLOR",
|
|
197
197
|
"scopes": ["EFFECT_COLOR"],
|
|
198
198
|
"mode": "light colorblind",
|
|
199
199
|
"collection": "mode",
|
|
200
|
-
"group": "shadow"
|
|
200
|
+
"group": "component shadow"
|
|
201
201
|
},
|
|
202
202
|
{
|
|
203
|
-
"name": "
|
|
203
|
+
"name": "shadow/resting/small/offsetX",
|
|
204
204
|
"value": 0,
|
|
205
205
|
"type": "FLOAT",
|
|
206
206
|
"scopes": ["EFFECT_FLOAT"],
|
|
207
207
|
"mode": "light colorblind",
|
|
208
208
|
"collection": "mode",
|
|
209
|
-
"group": "
|
|
209
|
+
"group": "shadow"
|
|
210
210
|
},
|
|
211
211
|
{
|
|
212
|
-
"name": "
|
|
212
|
+
"name": "shadow/resting/small/offsetY",
|
|
213
213
|
"value": 1,
|
|
214
214
|
"type": "FLOAT",
|
|
215
215
|
"scopes": ["EFFECT_FLOAT"],
|
|
216
216
|
"mode": "light colorblind",
|
|
217
217
|
"collection": "mode",
|
|
218
|
-
"group": "
|
|
218
|
+
"group": "shadow"
|
|
219
219
|
},
|
|
220
220
|
{
|
|
221
|
-
"name": "
|
|
221
|
+
"name": "shadow/resting/small/blur",
|
|
222
222
|
"value": 0,
|
|
223
223
|
"type": "FLOAT",
|
|
224
224
|
"scopes": ["EFFECT_FLOAT"],
|
|
225
225
|
"mode": "light colorblind",
|
|
226
226
|
"collection": "mode",
|
|
227
|
-
"group": "
|
|
227
|
+
"group": "shadow"
|
|
228
228
|
},
|
|
229
229
|
{
|
|
230
|
-
"name": "
|
|
230
|
+
"name": "shadow/resting/small/spread",
|
|
231
231
|
"value": 0,
|
|
232
232
|
"type": "FLOAT",
|
|
233
233
|
"scopes": ["EFFECT_FLOAT"],
|
|
234
234
|
"mode": "light colorblind",
|
|
235
235
|
"collection": "mode",
|
|
236
|
-
"group": "
|
|
236
|
+
"group": "shadow"
|
|
237
237
|
},
|
|
238
238
|
{
|
|
239
|
-
"name": "
|
|
239
|
+
"name": "shadow/resting/small/color",
|
|
240
240
|
"value": {
|
|
241
|
-
"r": 0.
|
|
242
|
-
"g": 0,
|
|
243
|
-
"b": 0.
|
|
244
|
-
"a": 0.
|
|
241
|
+
"r": 0.12156862745098039,
|
|
242
|
+
"g": 0.13725490196078433,
|
|
243
|
+
"b": 0.1568627450980392,
|
|
244
|
+
"a": 0.04
|
|
245
245
|
},
|
|
246
246
|
"type": "COLOR",
|
|
247
247
|
"scopes": ["EFFECT_COLOR"],
|
|
248
248
|
"mode": "light colorblind",
|
|
249
249
|
"collection": "mode",
|
|
250
|
-
"group": "
|
|
250
|
+
"group": "shadow"
|
|
251
251
|
},
|
|
252
252
|
{
|
|
253
|
-
"name": "
|
|
253
|
+
"name": "shadow/resting/xsmall/offsetX",
|
|
254
254
|
"value": 0,
|
|
255
255
|
"type": "FLOAT",
|
|
256
256
|
"scopes": ["EFFECT_FLOAT"],
|
|
257
257
|
"mode": "light colorblind",
|
|
258
258
|
"collection": "mode",
|
|
259
|
-
"group": "
|
|
259
|
+
"group": "shadow"
|
|
260
260
|
},
|
|
261
261
|
{
|
|
262
|
-
"name": "
|
|
262
|
+
"name": "shadow/resting/xsmall/offsetY",
|
|
263
263
|
"value": 1,
|
|
264
264
|
"type": "FLOAT",
|
|
265
265
|
"scopes": ["EFFECT_FLOAT"],
|
|
266
266
|
"mode": "light colorblind",
|
|
267
267
|
"collection": "mode",
|
|
268
|
-
"group": "
|
|
268
|
+
"group": "shadow"
|
|
269
269
|
},
|
|
270
270
|
{
|
|
271
|
-
"name": "
|
|
271
|
+
"name": "shadow/resting/xsmall/blur",
|
|
272
272
|
"value": 0,
|
|
273
273
|
"type": "FLOAT",
|
|
274
274
|
"scopes": ["EFFECT_FLOAT"],
|
|
275
275
|
"mode": "light colorblind",
|
|
276
276
|
"collection": "mode",
|
|
277
|
-
"group": "
|
|
277
|
+
"group": "shadow"
|
|
278
278
|
},
|
|
279
279
|
{
|
|
280
|
-
"name": "
|
|
280
|
+
"name": "shadow/resting/xsmall/spread",
|
|
281
281
|
"value": 0,
|
|
282
282
|
"type": "FLOAT",
|
|
283
283
|
"scopes": ["EFFECT_FLOAT"],
|
|
284
284
|
"mode": "light colorblind",
|
|
285
285
|
"collection": "mode",
|
|
286
|
-
"group": "
|
|
286
|
+
"group": "shadow"
|
|
287
287
|
},
|
|
288
288
|
{
|
|
289
|
-
"name": "
|
|
289
|
+
"name": "shadow/resting/xsmall/color",
|
|
290
290
|
"value": {
|
|
291
|
-
"r": 0,
|
|
292
|
-
"g": 0.
|
|
293
|
-
"b": 0.
|
|
294
|
-
"a": 0.
|
|
291
|
+
"r": 0.12156862745098039,
|
|
292
|
+
"g": 0.13725490196078433,
|
|
293
|
+
"b": 0.1568627450980392,
|
|
294
|
+
"a": 0.1
|
|
295
295
|
},
|
|
296
296
|
"type": "COLOR",
|
|
297
297
|
"scopes": ["EFFECT_COLOR"],
|
|
298
298
|
"mode": "light colorblind",
|
|
299
299
|
"collection": "mode",
|
|
300
|
-
"group": "
|
|
300
|
+
"group": "shadow"
|
|
301
301
|
},
|
|
302
302
|
{
|
|
303
|
-
"name": "
|
|
303
|
+
"name": "shadow/inset/offsetX",
|
|
304
304
|
"value": 0,
|
|
305
305
|
"type": "FLOAT",
|
|
306
306
|
"scopes": ["EFFECT_FLOAT"],
|
|
307
307
|
"mode": "light colorblind",
|
|
308
308
|
"collection": "mode",
|
|
309
|
-
"group": "
|
|
309
|
+
"group": "shadow"
|
|
310
310
|
},
|
|
311
311
|
{
|
|
312
|
-
"name": "
|
|
312
|
+
"name": "shadow/inset/offsetY",
|
|
313
313
|
"value": 1,
|
|
314
314
|
"type": "FLOAT",
|
|
315
315
|
"scopes": ["EFFECT_FLOAT"],
|
|
316
316
|
"mode": "light colorblind",
|
|
317
317
|
"collection": "mode",
|
|
318
|
-
"group": "
|
|
318
|
+
"group": "shadow"
|
|
319
319
|
},
|
|
320
320
|
{
|
|
321
|
-
"name": "
|
|
321
|
+
"name": "shadow/inset/blur",
|
|
322
322
|
"value": 0,
|
|
323
323
|
"type": "FLOAT",
|
|
324
324
|
"scopes": ["EFFECT_FLOAT"],
|
|
325
325
|
"mode": "light colorblind",
|
|
326
326
|
"collection": "mode",
|
|
327
|
-
"group": "
|
|
327
|
+
"group": "shadow"
|
|
328
328
|
},
|
|
329
329
|
{
|
|
330
|
-
"name": "
|
|
330
|
+
"name": "shadow/inset/spread",
|
|
331
331
|
"value": 0,
|
|
332
332
|
"type": "FLOAT",
|
|
333
333
|
"scopes": ["EFFECT_FLOAT"],
|
|
334
334
|
"mode": "light colorblind",
|
|
335
335
|
"collection": "mode",
|
|
336
|
-
"group": "
|
|
336
|
+
"group": "shadow"
|
|
337
337
|
},
|
|
338
338
|
{
|
|
339
|
-
"name": "
|
|
339
|
+
"name": "shadow/inset/color",
|
|
340
340
|
"value": {
|
|
341
|
-
"r": 0,
|
|
342
|
-
"g": 0.
|
|
343
|
-
"b": 0.
|
|
344
|
-
"a": 0.
|
|
341
|
+
"r": 0.12156862745098039,
|
|
342
|
+
"g": 0.13725490196078433,
|
|
343
|
+
"b": 0.1568627450980392,
|
|
344
|
+
"a": 0.04
|
|
345
345
|
},
|
|
346
346
|
"type": "COLOR",
|
|
347
347
|
"scopes": ["EFFECT_COLOR"],
|
|
348
348
|
"mode": "light colorblind",
|
|
349
349
|
"collection": "mode",
|
|
350
|
-
"group": "
|
|
350
|
+
"group": "shadow"
|
|
351
351
|
},
|
|
352
352
|
{
|
|
353
353
|
"name": "button/default/shadow/resting/offsetX",
|