@digdir/designsystemet 1.0.0-next.32 → 1.0.0-next.34

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 (48) hide show
  1. package/dist/bin/designsystemet.js +18 -12
  2. package/dist/src/colors/theme.js +1 -1
  3. package/dist/src/tokens/build/configs.js +19 -8
  4. package/dist/src/tokens/build/formats/css.js +17 -92
  5. package/dist/src/tokens/build/transformers.js +7 -7
  6. package/dist/src/tokens/{build/index.js → build.js} +3 -3
  7. package/dist/src/tokens/create.js +100 -0
  8. package/dist/src/tokens/design-tokens/default/Figma/components.json +22 -0
  9. package/dist/src/tokens/design-tokens/default/primitives/globals.json +161 -0
  10. package/dist/src/tokens/design-tokens/default/primitives/size/default.json +175 -0
  11. package/dist/src/tokens/design-tokens/default/semantic/color.json +572 -0
  12. package/dist/src/tokens/design-tokens/default/semantic/style.json +564 -0
  13. package/dist/src/tokens/design-tokens/template/$metadata.json +17 -0
  14. package/dist/src/tokens/design-tokens/template/$themes.json +1231 -0
  15. package/dist/src/tokens/design-tokens/template/themes/theme.json +334 -0
  16. package/dist/src/tokens/template.js +66 -0
  17. package/dist/src/tokens/types.js +0 -0
  18. package/dist/src/tokens/write/generate$metadata.js +21 -0
  19. package/dist/src/tokens/write/generate$themes.js +115 -0
  20. package/dist/src/tokens/write.js +79 -0
  21. package/dist/types/src/tokens/build/configs.d.ts +1 -1
  22. package/dist/types/src/tokens/build/configs.d.ts.map +1 -1
  23. package/dist/types/src/tokens/build/formats/css.d.ts.map +1 -1
  24. package/dist/types/src/tokens/build/transformers.d.ts +1 -1
  25. package/dist/types/src/tokens/build/transformers.d.ts.map +1 -1
  26. package/dist/types/src/tokens/{build/index.d.ts → build.d.ts} +1 -1
  27. package/dist/types/src/tokens/build.d.ts.map +1 -0
  28. package/dist/types/src/tokens/create.d.ts +8 -0
  29. package/dist/types/src/tokens/create.d.ts.map +1 -0
  30. package/dist/types/src/tokens/template.d.ts +2 -0
  31. package/dist/types/src/tokens/template.d.ts.map +1 -0
  32. package/dist/types/src/tokens/types.d.ts +37 -0
  33. package/dist/types/src/tokens/types.d.ts.map +1 -0
  34. package/dist/types/src/tokens/write/generate$metadata.d.ts +8 -0
  35. package/dist/types/src/tokens/write/generate$metadata.d.ts.map +1 -0
  36. package/dist/types/src/tokens/write/generate$themes.d.ts +10 -0
  37. package/dist/types/src/tokens/write/generate$themes.d.ts.map +1 -0
  38. package/dist/types/src/tokens/write.d.ts +10 -0
  39. package/dist/types/src/tokens/write.d.ts.map +1 -0
  40. package/package.json +6 -5
  41. package/dist/src/tokens/create/README.md +0 -3
  42. package/dist/src/tokens/create/index.js +0 -150
  43. package/dist/src/tokens/index.js +0 -4
  44. package/dist/types/src/tokens/build/index.d.ts.map +0 -1
  45. package/dist/types/src/tokens/create/index.d.ts +0 -64
  46. package/dist/types/src/tokens/create/index.d.ts.map +0 -1
  47. package/dist/types/src/tokens/index.d.ts +0 -2
  48. package/dist/types/src/tokens/index.d.ts.map +0 -1
@@ -0,0 +1,564 @@
1
+ {
2
+ "typography": {
3
+ "heading": {
4
+ "2xl": {
5
+ "$type": "typography",
6
+ "$value": {
7
+ "fontFamily": "{font.family}",
8
+ "fontWeight": "{font-weight.medium}",
9
+ "lineHeight": "{line-height.sm}",
10
+ "fontSize": "{font-size.11}",
11
+ "letterSpacing": "{letter-spacing.1}"
12
+ }
13
+ },
14
+ "xl": {
15
+ "$type": "typography",
16
+ "$value": {
17
+ "fontFamily": "{font.family}",
18
+ "fontWeight": "{font-weight.medium}",
19
+ "lineHeight": "{line-height.sm}",
20
+ "fontSize": "{font-size.10}",
21
+ "letterSpacing": "{letter-spacing.1}"
22
+ }
23
+ },
24
+ "lg": {
25
+ "$type": "typography",
26
+ "$value": {
27
+ "fontFamily": "{font.family}",
28
+ "fontWeight": "{font-weight.medium}",
29
+ "lineHeight": "{line-height.sm}",
30
+ "fontSize": "{font-size.9}",
31
+ "letterSpacing": "{letter-spacing.2}"
32
+ }
33
+ },
34
+ "md": {
35
+ "$type": "typography",
36
+ "$value": {
37
+ "fontFamily": "{font.family}",
38
+ "fontWeight": "{font-weight.medium}",
39
+ "lineHeight": "{line-height.sm}",
40
+ "fontSize": "{font-size.8}",
41
+ "letterSpacing": "{letter-spacing.3}"
42
+ }
43
+ },
44
+ "sm": {
45
+ "$type": "typography",
46
+ "$value": {
47
+ "fontFamily": "{font.family}",
48
+ "fontWeight": "{font-weight.medium}",
49
+ "lineHeight": "{line-height.sm}",
50
+ "fontSize": "{font-size.7}",
51
+ "letterSpacing": "{letter-spacing.5}"
52
+ }
53
+ },
54
+ "xs": {
55
+ "$type": "typography",
56
+ "$value": {
57
+ "fontFamily": "{font.family}",
58
+ "fontWeight": "{font-weight.medium}",
59
+ "lineHeight": "{line-height.sm}",
60
+ "fontSize": "{font-size.6}",
61
+ "letterSpacing": "{letter-spacing.6}"
62
+ }
63
+ },
64
+ "2xs": {
65
+ "$type": "typography",
66
+ "$value": {
67
+ "fontFamily": "{font.family}",
68
+ "fontWeight": "{font-weight.medium}",
69
+ "lineHeight": "{line-height.sm}",
70
+ "fontSize": "{font-size.5}",
71
+ "letterSpacing": "{letter-spacing.6}"
72
+ }
73
+ }
74
+ },
75
+ "ingress": {
76
+ "lg": {
77
+ "$type": "typography",
78
+ "$value": {
79
+ "fontFamily": "{font.family}",
80
+ "fontWeight": "{font-weight.regular}",
81
+ "lineHeight": "{line-height.lg}",
82
+ "fontSize": "{font-size.8}",
83
+ "letterSpacing": "{letter-spacing.8}"
84
+ }
85
+ },
86
+ "md": {
87
+ "$type": "typography",
88
+ "$value": {
89
+ "fontFamily": "{font.family}",
90
+ "fontWeight": "{font-weight.regular}",
91
+ "lineHeight": "{line-height.lg}",
92
+ "fontSize": "{font-size.7}",
93
+ "letterSpacing": "{letter-spacing.8}"
94
+ }
95
+ },
96
+ "sm": {
97
+ "$type": "typography",
98
+ "$value": {
99
+ "fontFamily": "{font.family}",
100
+ "fontWeight": "{font-weight.regular}",
101
+ "lineHeight": "{line-height.lg}",
102
+ "fontSize": "{font-size.6}",
103
+ "letterSpacing": "{letter-spacing.7}"
104
+ }
105
+ },
106
+ "xs": {
107
+ "$type": "typography",
108
+ "$value": {
109
+ "fontFamily": "{font.family}",
110
+ "fontWeight": "{font-weight.regular}",
111
+ "lineHeight": "{line-height.lg}",
112
+ "fontSize": "{font-size.5}",
113
+ "letterSpacing": "{letter-spacing.6}"
114
+ }
115
+ }
116
+ },
117
+ "paragraph": {
118
+ "lg": {
119
+ "$type": "typography",
120
+ "$value": {
121
+ "fontFamily": "{font.family}",
122
+ "fontWeight": "{font-weight.regular}",
123
+ "lineHeight": "{line-height.md}",
124
+ "fontSize": "{font-size.6}",
125
+ "letterSpacing": "{letter-spacing.8}"
126
+ }
127
+ },
128
+ "md": {
129
+ "$type": "typography",
130
+ "$value": {
131
+ "fontFamily": "{font.family}",
132
+ "fontWeight": "{font-weight.regular}",
133
+ "lineHeight": "{line-height.md}",
134
+ "fontSize": "{font-size.5}",
135
+ "letterSpacing": "{letter-spacing.8}"
136
+ }
137
+ },
138
+ "sm": {
139
+ "$type": "typography",
140
+ "$value": {
141
+ "fontFamily": "{font.family}",
142
+ "fontWeight": "{font-weight.regular}",
143
+ "lineHeight": "{line-height.md}",
144
+ "fontSize": "{font-size.4}",
145
+ "letterSpacing": "{letter-spacing.7}"
146
+ }
147
+ },
148
+ "xs": {
149
+ "$type": "typography",
150
+ "$value": {
151
+ "fontFamily": "{font.family}",
152
+ "fontWeight": "{font-weight.regular}",
153
+ "lineHeight": "{line-height.md}",
154
+ "fontSize": "{font-size.3}",
155
+ "letterSpacing": "{letter-spacing.6}"
156
+ }
157
+ },
158
+ "short": {
159
+ "lg": {
160
+ "$type": "typography",
161
+ "$value": {
162
+ "fontFamily": "{font.family}",
163
+ "fontWeight": "{font-weight.regular}",
164
+ "lineHeight": "{line-height.sm}",
165
+ "fontSize": "{font-size.6}",
166
+ "letterSpacing": "{letter-spacing.8}"
167
+ }
168
+ },
169
+ "md": {
170
+ "$type": "typography",
171
+ "$value": {
172
+ "fontFamily": "{font.family}",
173
+ "fontWeight": "{font-weight.regular}",
174
+ "lineHeight": "{line-height.sm}",
175
+ "fontSize": "{font-size.5}",
176
+ "letterSpacing": "{letter-spacing.8}"
177
+ }
178
+ },
179
+ "sm": {
180
+ "$type": "typography",
181
+ "$value": {
182
+ "fontFamily": "{font.family}",
183
+ "fontWeight": "{font-weight.regular}",
184
+ "lineHeight": "{line-height.sm}",
185
+ "fontSize": "{font-size.4}",
186
+ "letterSpacing": "{letter-spacing.7}"
187
+ }
188
+ },
189
+ "xs": {
190
+ "$type": "typography",
191
+ "$value": {
192
+ "fontFamily": "{font.family}",
193
+ "fontWeight": "{font-weight.regular}",
194
+ "lineHeight": "{line-height.sm}",
195
+ "fontSize": "{font-size.3}",
196
+ "letterSpacing": "{letter-spacing.6}"
197
+ }
198
+ }
199
+ },
200
+ "long": {
201
+ "lg": {
202
+ "$type": "typography",
203
+ "$value": {
204
+ "fontFamily": "{font.family}",
205
+ "fontWeight": "{font-weight.regular}",
206
+ "lineHeight": "{line-height.lg}",
207
+ "fontSize": "{font-size.6}",
208
+ "letterSpacing": "{letter-spacing.8}"
209
+ }
210
+ },
211
+ "md": {
212
+ "$type": "typography",
213
+ "$value": {
214
+ "fontFamily": "{font.family}",
215
+ "fontWeight": "{font-weight.regular}",
216
+ "lineHeight": "{line-height.lg}",
217
+ "fontSize": "{font-size.5}",
218
+ "letterSpacing": "{letter-spacing.8}"
219
+ }
220
+ },
221
+ "sm": {
222
+ "$type": "typography",
223
+ "$value": {
224
+ "fontFamily": "{font.family}",
225
+ "fontWeight": "{font-weight.regular}",
226
+ "lineHeight": "{line-height.lg}",
227
+ "fontSize": "{font-size.4}",
228
+ "letterSpacing": "{letter-spacing.7}"
229
+ }
230
+ },
231
+ "xs": {
232
+ "$type": "typography",
233
+ "$value": {
234
+ "fontFamily": "{font.family}",
235
+ "fontWeight": "{font-weight.regular}",
236
+ "lineHeight": "{line-height.lg}",
237
+ "fontSize": "{font-size.3}",
238
+ "letterSpacing": "{letter-spacing.6}"
239
+ }
240
+ }
241
+ }
242
+ },
243
+ "label": {
244
+ "lg": {
245
+ "$type": "typography",
246
+ "$value": {
247
+ "fontFamily": "{font.family}",
248
+ "fontWeight": "{font-weight.medium}",
249
+ "lineHeight": "{line-height.sm}",
250
+ "fontSize": "{font-size.6}",
251
+ "letterSpacing": "{letter-spacing.8}"
252
+ }
253
+ },
254
+ "md": {
255
+ "$type": "typography",
256
+ "$value": {
257
+ "fontFamily": "{font.family}",
258
+ "fontWeight": "{font-weight.medium}",
259
+ "lineHeight": "{line-height.sm}",
260
+ "fontSize": "{font-size.5}",
261
+ "letterSpacing": "{letter-spacing.8}"
262
+ }
263
+ },
264
+ "sm": {
265
+ "$type": "typography",
266
+ "$value": {
267
+ "fontFamily": "{font.family}",
268
+ "fontWeight": "{font-weight.medium}",
269
+ "lineHeight": "{line-height.sm}",
270
+ "fontSize": "{font-size.4}",
271
+ "letterSpacing": "{letter-spacing.7}"
272
+ }
273
+ },
274
+ "xs": {
275
+ "$type": "typography",
276
+ "$value": {
277
+ "fontFamily": "{font.family}",
278
+ "fontWeight": "{font-weight.medium}",
279
+ "lineHeight": "{line-height.sm}",
280
+ "fontSize": "{font-size.3}",
281
+ "letterSpacing": "{letter-spacing.6}"
282
+ }
283
+ }
284
+ },
285
+ "error_message": {
286
+ "lg": {
287
+ "$type": "typography",
288
+ "$value": {
289
+ "fontFamily": "{font.family}",
290
+ "fontWeight": "{font-weight.regular}",
291
+ "lineHeight": "{line-height.sm}",
292
+ "fontSize": "{font-size.6}",
293
+ "letterSpacing": "{letter-spacing.8}"
294
+ }
295
+ },
296
+ "md": {
297
+ "$type": "typography",
298
+ "$value": {
299
+ "fontFamily": "{font.family}",
300
+ "fontWeight": "{font-weight.regular}",
301
+ "lineHeight": "{line-height.sm}",
302
+ "fontSize": "{font-size.5}",
303
+ "letterSpacing": "{letter-spacing.8}"
304
+ }
305
+ },
306
+ "sm": {
307
+ "$type": "typography",
308
+ "$value": {
309
+ "fontFamily": "{font.family}",
310
+ "fontWeight": "{font-weight.regular}",
311
+ "lineHeight": "{line-height.sm}",
312
+ "fontSize": "{font-size.4}",
313
+ "letterSpacing": "{letter-spacing.7}"
314
+ }
315
+ },
316
+ "xs": {
317
+ "$type": "typography",
318
+ "$value": {
319
+ "fontFamily": "{font.family}",
320
+ "fontWeight": "{font-weight.regular}",
321
+ "lineHeight": "{line-height.sm}",
322
+ "fontSize": "{font-size.3}",
323
+ "letterSpacing": "{letter-spacing.6}"
324
+ }
325
+ }
326
+ }
327
+ },
328
+ "disabled": {
329
+ "opacity": {
330
+ "$type": "opacity",
331
+ "$value": "{opacity.30}"
332
+ }
333
+ },
334
+ "border-radius": {
335
+ "sm": {
336
+ "$type": "borderRadius",
337
+ "$value": "{border-radius.base}*0.5"
338
+ },
339
+ "md": {
340
+ "$type": "borderRadius",
341
+ "$value": "{border-radius.base}*1"
342
+ },
343
+ "lg": {
344
+ "$type": "borderRadius",
345
+ "$value": "{border-radius.base}*2"
346
+ },
347
+ "xl": {
348
+ "$type": "borderRadius",
349
+ "$value": "{border-radius.base}*3"
350
+ },
351
+ "2xl": {
352
+ "$type": "borderRadius",
353
+ "$value": "{border-radius.base}*4"
354
+ },
355
+ "3xl": {
356
+ "$type": "borderRadius",
357
+ "$value": "{border-radius.base}*6"
358
+ },
359
+ "4xl": {
360
+ "$type": "borderRadius",
361
+ "$value": "{border-radius.base}*8"
362
+ },
363
+ "full": {
364
+ "$type": "borderRadius",
365
+ "$value": "9999"
366
+ }
367
+ },
368
+ "spacing": {
369
+ "0": {
370
+ "$type": "spacing",
371
+ "$value": "{spacing.base}*0"
372
+ },
373
+ "1": {
374
+ "$type": "spacing",
375
+ "$value": "{spacing.base}*1"
376
+ },
377
+ "2": {
378
+ "$type": "spacing",
379
+ "$value": "{spacing.base}*2"
380
+ },
381
+ "3": {
382
+ "$type": "spacing",
383
+ "$value": "{spacing.base}*3"
384
+ },
385
+ "4": {
386
+ "$type": "spacing",
387
+ "$value": "{spacing.base}*4"
388
+ },
389
+ "5": {
390
+ "$type": "spacing",
391
+ "$value": "{spacing.base}*5"
392
+ },
393
+ "6": {
394
+ "$type": "spacing",
395
+ "$value": "{spacing.base}*6"
396
+ },
397
+ "7": {
398
+ "$type": "spacing",
399
+ "$value": "{spacing.base}*7"
400
+ },
401
+ "8": {
402
+ "$type": "spacing",
403
+ "$value": "{spacing.base}*8"
404
+ },
405
+ "9": {
406
+ "$type": "spacing",
407
+ "$value": "{spacing.base}*9"
408
+ },
409
+ "10": {
410
+ "$type": "spacing",
411
+ "$value": "{spacing.base}*10"
412
+ },
413
+ "11": {
414
+ "$type": "spacing",
415
+ "$value": "{spacing.base}*11"
416
+ },
417
+ "12": {
418
+ "$type": "spacing",
419
+ "$value": "{spacing.base}*12"
420
+ },
421
+ "13": {
422
+ "$type": "spacing",
423
+ "$value": "{spacing.base}*13"
424
+ },
425
+ "14": {
426
+ "$type": "spacing",
427
+ "$value": "{spacing.base}*14"
428
+ },
429
+ "15": {
430
+ "$type": "spacing",
431
+ "$value": "{spacing.base}*15"
432
+ },
433
+ "18": {
434
+ "$type": "spacing",
435
+ "$value": "{spacing.base}*18"
436
+ },
437
+ "22": {
438
+ "$type": "spacing",
439
+ "$value": "{spacing.base}*22"
440
+ },
441
+ "26": {
442
+ "$type": "spacing",
443
+ "$value": "{spacing.base}*26"
444
+ },
445
+ "30": {
446
+ "$type": "spacing",
447
+ "$value": "{spacing.base}*30"
448
+ }
449
+ },
450
+ "sizing": {
451
+ "0": {
452
+ "$type": "sizing",
453
+ "$value": "{sizing.base}*0"
454
+ },
455
+ "1": {
456
+ "$type": "sizing",
457
+ "$value": "{sizing.base}*1"
458
+ },
459
+ "2": {
460
+ "$type": "sizing",
461
+ "$value": "{sizing.base}*2"
462
+ },
463
+ "3": {
464
+ "$type": "sizing",
465
+ "$value": "{sizing.base}*3"
466
+ },
467
+ "4": {
468
+ "$type": "sizing",
469
+ "$value": "{sizing.base}*4"
470
+ },
471
+ "5": {
472
+ "$type": "sizing",
473
+ "$value": "{sizing.base}*5"
474
+ },
475
+ "6": {
476
+ "$type": "sizing",
477
+ "$value": "{sizing.base}*6"
478
+ },
479
+ "7": {
480
+ "$type": "sizing",
481
+ "$value": "{sizing.base}*7"
482
+ },
483
+ "8": {
484
+ "$type": "sizing",
485
+ "$value": "{sizing.base}*8"
486
+ },
487
+ "9": {
488
+ "$type": "sizing",
489
+ "$value": "{sizing.base}*9"
490
+ },
491
+ "10": {
492
+ "$type": "sizing",
493
+ "$value": "{sizing.base}*10"
494
+ },
495
+ "11": {
496
+ "$type": "sizing",
497
+ "$value": "{sizing.base}*11"
498
+ },
499
+ "12": {
500
+ "$type": "sizing",
501
+ "$value": "{sizing.base}*12"
502
+ },
503
+ "13": {
504
+ "$type": "sizing",
505
+ "$value": "{sizing.base}*13"
506
+ },
507
+ "14": {
508
+ "$type": "sizing",
509
+ "$value": "{sizing.base}*14"
510
+ },
511
+ "15": {
512
+ "$type": "sizing",
513
+ "$value": "{sizing.base}*15"
514
+ },
515
+ "18": {
516
+ "$type": "sizing",
517
+ "$value": "{sizing.base}*18"
518
+ },
519
+ "22": {
520
+ "$type": "sizing",
521
+ "$value": "{sizing.base}*22"
522
+ },
523
+ "26": {
524
+ "$type": "sizing",
525
+ "$value": "{sizing.base}*26"
526
+ },
527
+ "30": {
528
+ "$type": "sizing",
529
+ "$value": "{sizing.base}*30"
530
+ }
531
+ },
532
+ "border-width": {
533
+ "default": {
534
+ "$type": "borderWidth",
535
+ "$value": "{border-width.1}"
536
+ },
537
+ "highlight": {
538
+ "$type": "borderWidth",
539
+ "$value": "{border-width.2}"
540
+ }
541
+ },
542
+ "shadow": {
543
+ "xs": {
544
+ "$type": "boxShadow",
545
+ "$value": "{shadow.100}"
546
+ },
547
+ "sm": {
548
+ "$type": "boxShadow",
549
+ "$value": "{shadow.200}"
550
+ },
551
+ "md": {
552
+ "$type": "boxShadow",
553
+ "$value": "{shadow.300}"
554
+ },
555
+ "lg": {
556
+ "$type": "boxShadow",
557
+ "$value": "{shadow.400}"
558
+ },
559
+ "xl": {
560
+ "$type": "boxShadow",
561
+ "$value": "{shadow.500}"
562
+ }
563
+ }
564
+ }
@@ -0,0 +1,17 @@
1
+ {
2
+ "tokenSetOrder": [
3
+ "primitives/globals",
4
+ "primitives/size/default",
5
+ "primitives/size/compact",
6
+ "primitives/modes/typography/primary/<theme>",
7
+ "primitives/modes/typography/secondary/<theme>",
8
+ "primitives/modes/colors/dark/global",
9
+ "primitives/modes/colors/dark/<theme>",
10
+ "primitives/modes/colors/light/global",
11
+ "primitives/modes/colors/light/<theme>",
12
+ "themes/<theme>",
13
+ "semantic/color",
14
+ "semantic/style",
15
+ "Figma/components"
16
+ ]
17
+ }