@primer/primitives 9.1.0-rc.e0e1c4b6 → 9.1.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.
Files changed (53) hide show
  1. package/dist/build/PrimerStyleDictionary.js +1 -0
  2. package/dist/build/formats/cssAdvanced.js +9 -10
  3. package/dist/build/transformers/index.d.ts +1 -0
  4. package/dist/build/transformers/index.js +3 -1
  5. package/dist/css/functional/motion/motion.css +3 -3
  6. package/dist/css/functional/size/border.css +2 -2
  7. package/dist/css/functional/typography/typography.css +11 -11
  8. package/dist/css/primitives.css +16 -16
  9. package/package.json +5 -3
  10. package/src/tokens/base/color/dark/dark.dimmed.json5 +1164 -0
  11. package/src/tokens/base/color/dark/dark.high-contrast.json5 +764 -0
  12. package/src/tokens/base/color/dark/dark.json5 +911 -0
  13. package/src/tokens/base/color/dark/display-dark.json5 +1774 -0
  14. package/src/tokens/base/color/light/display-light.json5 +1774 -0
  15. package/src/tokens/base/color/light/light.high-contrast.json5 +755 -0
  16. package/src/tokens/base/color/light/light.json5 +911 -0
  17. package/src/tokens/base/size/size.json +196 -0
  18. package/src/tokens/base/typography/typography.json +48 -0
  19. package/src/tokens/fallback/color-fallbacks.json +270 -0
  20. package/src/tokens/functional/border/dark.json5 +12 -0
  21. package/src/tokens/functional/border/light.json5 +12 -0
  22. package/src/tokens/functional/color/dark/app-dark.json5 +554 -0
  23. package/src/tokens/functional/color/dark/data-vis-dark.json5 +284 -0
  24. package/src/tokens/functional/color/dark/display-dark.json5 +1258 -0
  25. package/src/tokens/functional/color/dark/overrides/dark.dimmed.json5 +194 -0
  26. package/src/tokens/functional/color/dark/overrides/dark.high-contrast.json5 +935 -0
  27. package/src/tokens/functional/color/dark/overrides/dark.protanopia-deuteranopia.json5 +310 -0
  28. package/src/tokens/functional/color/dark/overrides/dark.tritanopia.json5 +224 -0
  29. package/src/tokens/functional/color/dark/patterns-dark.json5 +3097 -0
  30. package/src/tokens/functional/color/dark/primitives-dark.json5 +1200 -0
  31. package/src/tokens/functional/color/dark/syntax-dark.json5 +559 -0
  32. package/src/tokens/functional/color/light/app-light.json5 +551 -0
  33. package/src/tokens/functional/color/light/data-vis-light.json5 +284 -0
  34. package/src/tokens/functional/color/light/display-light.json5 +1258 -0
  35. package/src/tokens/functional/color/light/overrides/light.high-contrast.json5 +819 -0
  36. package/src/tokens/functional/color/light/overrides/light.protanopia-deuteranopia.json5 +327 -0
  37. package/src/tokens/functional/color/light/overrides/light.tritanopia.json5 +237 -0
  38. package/src/tokens/functional/color/light/patterns-light.json5 +3091 -0
  39. package/src/tokens/functional/color/light/primitives-light.json5 +1193 -0
  40. package/src/tokens/functional/color/light/syntax-light.json5 +559 -0
  41. package/src/tokens/functional/motion/loading.json5 +17 -0
  42. package/src/tokens/functional/motion/patterns.json5 +28 -0
  43. package/src/tokens/functional/shadow/dark.json5 +383 -0
  44. package/src/tokens/functional/shadow/light.json5 +376 -0
  45. package/src/tokens/functional/size/border.json +111 -0
  46. package/src/tokens/functional/size/breakpoints.json +64 -0
  47. package/src/tokens/functional/size/size-coarse.json +28 -0
  48. package/src/tokens/functional/size/size-fine.json +28 -0
  49. package/src/tokens/functional/size/size.json +740 -0
  50. package/src/tokens/functional/size/viewport.json +28 -0
  51. package/src/tokens/functional/typography/typography.json +527 -0
  52. package/src/tokens/removed/color.json +421 -0
  53. package/src/tokens/removed/testing.json5 +4 -0
package/src/tokens/functional/shadow/dark.json5 ADDED
@@ -0,0 +1,383 @@
1
+ {
2
+ avatar: {
3
+ shadow: {
4
+ $value: [
5
+ {
6
+ color: '{base.color.neutral.1}',
7
+ alpha: 1,
8
+ offsetX: '0px',
9
+ offsetY: '0px',
10
+ blur: '0px',
11
+ spread: '2px',
12
+ },
13
+ ],
14
+ $type: 'shadow',
15
+ $extensions: {
16
+ 'org.primer.figma': {
17
+ collection: 'mode',
18
+ mode: 'light',
19
+ group: 'component shadow',
20
+ },
21
+ },
22
+ },
23
+ },
24
+ button: {
25
+ default: {
26
+ shadow: {
27
+ resting: {
28
+ $value: [
29
+ {
30
+ color: '{base.color.transparent}',
31
+ alpha: 0,
32
+ offsetX: '0px',
33
+ offsetY: '0px',
34
+ blur: '0px',
35
+ spread: '0px',
36
+ inset: false,
37
+ },
38
+ ],
39
+ $type: 'shadow',
40
+ $extensions: {
41
+ 'org.primer.figma': {
42
+ collection: 'mode',
43
+ mode: 'light',
44
+ group: 'component shadow',
45
+ },
46
+ },
47
+ },
48
+ },
49
+ },
50
+ primary: {
51
+ shadow: {
52
+ selected: {
53
+ $value: [
54
+ {
55
+ color: '{base.color.transparent}',
56
+ alpha: 0,
57
+ offsetX: '0px',
58
+ offsetY: '0px',
59
+ blur: '0px',
60
+ spread: '0px',
61
+ inset: false,
62
+ },
63
+ ],
64
+ $type: 'shadow',
65
+ $extensions: {
66
+ 'org.primer.figma': {
67
+ collection: 'mode',
68
+ mode: 'light',
69
+ group: 'component shadow',
70
+ },
71
+ },
72
+ },
73
+ },
74
+ },
75
+ outline: {
76
+ shadow: {
77
+ selected: {
78
+ $value: [
79
+ {
80
+ color: '{base.color.transparent}',
81
+ alpha: 0,
82
+ offsetX: '0px',
83
+ offsetY: '0px',
84
+ blur: '0px',
85
+ spread: '0px',
86
+ inset: false,
87
+ },
88
+ ],
89
+ $type: 'shadow',
90
+ $extensions: {
91
+ 'org.primer.figma': {
92
+ collection: 'mode',
93
+ mode: 'light',
94
+ group: 'component shadow',
95
+ },
96
+ },
97
+ },
98
+ },
99
+ },
100
+ danger: {
101
+ shadow: {
102
+ selected: {
103
+ $value: [
104
+ {
105
+ color: '{base.color.transparent}',
106
+ alpha: 0,
107
+ offsetX: '0px',
108
+ offsetY: '0px',
109
+ blur: '0px',
110
+ spread: '0px',
111
+ inset: false,
112
+ },
113
+ ],
114
+ $type: 'shadow',
115
+ $extensions: {
116
+ 'org.primer.figma': {
117
+ collection: 'mode',
118
+ mode: 'light',
119
+ group: 'component shadow',
120
+ },
121
+ },
122
+ },
123
+ },
124
+ },
125
+ },
126
+ shadow: {
127
+ inset: {
128
+ $value: {
129
+ color: '{base.color.neutral.0}',
130
+ alpha: 0.24,
131
+ offsetX: '0px',
132
+ offsetY: '1px',
133
+ blur: '0px',
134
+ spread: '0px',
135
+ inset: true,
136
+ },
137
+ $type: 'shadow',
138
+ $extensions: {
139
+ 'org.primer.figma': {
140
+ collection: 'mode',
141
+ mode: 'light',
142
+ group: 'shadow',
143
+ },
144
+ },
145
+ },
146
+ resting: {
147
+ xsmall: {
148
+ $value: {
149
+ color: '{base.color.neutral.0}',
150
+ alpha: 0.8,
151
+ offsetX: '0px',
152
+ offsetY: '1px',
153
+ blur: '0px',
154
+ spread: '0px',
155
+ inset: false,
156
+ },
157
+ $type: 'shadow',
158
+ $extensions: {
159
+ 'org.primer.figma': {
160
+ collection: 'mode',
161
+ mode: 'light',
162
+ group: 'shadow',
163
+ },
164
+ },
165
+ },
166
+ small: {
167
+ $value: [
168
+ {
169
+ color: '{base.color.neutral.0}',
170
+ alpha: 0.4,
171
+ offsetX: '0px',
172
+ offsetY: '1px',
173
+ blur: '0px',
174
+ spread: '0px',
175
+ inset: false,
176
+ },
177
+ ],
178
+ $type: 'shadow',
179
+ $extensions: {
180
+ 'org.primer.figma': {
181
+ collection: 'mode',
182
+ mode: 'light',
183
+ group: 'shadow',
184
+ },
185
+ },
186
+ },
187
+ medium: {
188
+ $value: [
189
+ {
190
+ color: '{base.color.neutral.0}',
191
+ alpha: 0.8,
192
+ offsetX: '0px',
193
+ offsetY: '3px',
194
+ blur: '6px',
195
+ spread: '0px',
196
+ },
197
+ ],
198
+ $type: 'shadow',
199
+ $extensions: {
200
+ 'org.primer.figma': {
201
+ collection: 'mode',
202
+ mode: 'light',
203
+ group: 'shadow',
204
+ },
205
+ },
206
+ },
207
+ },
208
+ floating: {
209
+ small: {
210
+ $value: [
211
+ {
212
+ color: '{overlay.borderColor}',
213
+ alpha: 1,
214
+ offsetX: '0px',
215
+ offsetY: '0px',
216
+ blur: '0px',
217
+ spread: '1px',
218
+ },
219
+ {
220
+ color: '{base.color.neutral.0}',
221
+ alpha: 0.4,
222
+ offsetX: '0px',
223
+ offsetY: '6px',
224
+ blur: '12px',
225
+ spread: '-3px',
226
+ },
227
+ {
228
+ color: '{base.color.neutral.0}',
229
+ alpha: 0.4,
230
+ offsetX: '0px',
231
+ offsetY: '6px',
232
+ blur: '18px',
233
+ spread: '0px',
234
+ },
235
+ ],
236
+ $type: 'shadow',
237
+ $extensions: {
238
+ 'org.primer.figma': {
239
+ collection: 'mode',
240
+ mode: 'light',
241
+ group: 'shadow',
242
+ },
243
+ },
244
+ },
245
+ medium: {
246
+ $value: [
247
+ {
248
+ color: '{overlay.borderColor}',
249
+ alpha: 1,
250
+ offsetX: '0px',
251
+ offsetY: '0px',
252
+ blur: '0px',
253
+ spread: '1px',
254
+ },
255
+ {
256
+ color: '{base.color.neutral.0}',
257
+ alpha: 0.4,
258
+ offsetX: '0px',
259
+ offsetY: '8px',
260
+ blur: '16px',
261
+ spread: '-4px',
262
+ },
263
+ {
264
+ color: '{base.color.neutral.0}',
265
+ alpha: 0.4,
266
+ offsetX: '0px',
267
+ offsetY: '4px',
268
+ blur: '32px',
269
+ spread: '-4px',
270
+ },
271
+ {
272
+ color: '{base.color.neutral.0}',
273
+ alpha: 0.4,
274
+ offsetX: '0px',
275
+ offsetY: '24px',
276
+ blur: '48px',
277
+ spread: '-12px',
278
+ },
279
+ {
280
+ color: '{base.color.neutral.0}',
281
+ alpha: 0.4,
282
+ offsetX: '0px',
283
+ offsetY: '48px',
284
+ blur: '96px',
285
+ spread: '-24px',
286
+ },
287
+ ],
288
+ $type: 'shadow',
289
+ $extensions: {
290
+ 'org.primer.figma': {
291
+ collection: 'mode',
292
+ mode: 'light',
293
+ group: 'shadow',
294
+ },
295
+ },
296
+ },
297
+ large: {
298
+ $value: [
299
+ {
300
+ color: '{overlay.borderColor}',
301
+ alpha: 1,
302
+ offsetX: '0px',
303
+ offsetY: '0px',
304
+ blur: '0px',
305
+ spread: '1px',
306
+ },
307
+ {
308
+ color: '{base.color.neutral.0}',
309
+ alpha: 1,
310
+ offsetX: '0px',
311
+ offsetY: '24px',
312
+ blur: '48px',
313
+ spread: '0px',
314
+ },
315
+ ],
316
+ $type: 'shadow',
317
+ $extensions: {
318
+ 'org.primer.figma': {
319
+ collection: 'mode',
320
+ mode: 'light',
321
+ group: 'shadow',
322
+ },
323
+ },
324
+ },
325
+ xlarge: {
326
+ $value: [
327
+ {
328
+ color: '{overlay.borderColor}',
329
+ alpha: 1,
330
+ offsetX: '0px',
331
+ offsetY: '0px',
332
+ blur: '0px',
333
+ spread: '1px',
334
+ },
335
+ {
336
+ color: '{base.color.neutral.0}',
337
+ alpha: 1,
338
+ offsetX: '0px',
339
+ offsetY: '32px',
340
+ blur: '64px',
341
+ spread: '0px',
342
+ },
343
+ ],
344
+ $type: 'shadow',
345
+ $extensions: {
346
+ 'org.primer.figma': {
347
+ collection: 'mode',
348
+ mode: 'light',
349
+ group: 'shadow',
350
+ },
351
+ },
352
+ },
353
+ legacy: {
354
+ $value: [
355
+ {
356
+ color: '{base.color.neutral.0}',
357
+ alpha: 0.4,
358
+ offsetX: '0px',
359
+ offsetY: '6px',
360
+ blur: '12px',
361
+ spread: '-3px',
362
+ },
363
+ {
364
+ color: '{base.color.neutral.0}',
365
+ alpha: 0.4,
366
+ offsetX: '0px',
367
+ offsetY: '6px',
368
+ blur: '18px',
369
+ spread: '0px',
370
+ },
371
+ ],
372
+ $type: 'shadow',
373
+ $extensions: {
374
+ 'org.primer.figma': {
375
+ collection: 'mode',
376
+ mode: 'light',
377
+ group: 'shadow',
378
+ },
379
+ },
380
+ },
381
+ },
382
+ },
383
+ }