@hpe-web/design-tokens 1.0.0 → 1.2.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 (77) hide show
  1. package/README.md +22 -13
  2. package/dist/css/fonts/de.css +0 -164
  3. package/dist/css/fonts/en.css +0 -164
  4. package/dist/css/fonts/es.css +0 -164
  5. package/dist/css/fonts/fr.css +0 -164
  6. package/dist/css/fonts/it.css +0 -164
  7. package/dist/css/fonts/zh.css +1 -1
  8. package/dist/css/tokens.css +343 -264
  9. package/dist/css/tokens.dark.css +46 -63
  10. package/dist/css/tokens.md-lg.css +113 -103
  11. package/dist/css/tokens.xl.css +109 -86
  12. package/package.json +4 -8
  13. package/src/breakpoints.json +14 -0
  14. package/src/component/button.json +1382 -0
  15. package/{static → src}/fonts.json +17 -17
  16. package/src/hpe.resolver.json +94 -0
  17. package/{static → src}/locales.json +6 -6
  18. package/{dtcg/foundation/color.tokens.json → src/primitive/primitives.json} +874 -1172
  19. package/src/semantic/color.dark.json +414 -0
  20. package/src/semantic/color.light.json +415 -0
  21. package/src/semantic/dimension.md-lg.json +764 -0
  22. package/src/semantic/dimension.xl.json +764 -0
  23. package/src/semantic/dimension.xs-sm.json +764 -0
  24. package/transforms.mjs +7 -7
  25. package/dist/css/locales/de.tokens.css +0 -65
  26. package/dist/css/locales/es.tokens.css +0 -65
  27. package/dist/css/locales/fr.tokens.css +0 -65
  28. package/dist/css/locales/it.tokens.css +0 -65
  29. package/dist/css/locales/ja.tokens.css +0 -84
  30. package/dist/css/locales/ko.tokens.css +0 -84
  31. package/dist/css/locales/zh.tokens.css +0 -11
  32. package/dtcg/foundation/border-radius.tokens.json +0 -239
  33. package/dtcg/foundation/border-width.tokens.json +0 -103
  34. package/dtcg/foundation/breakpoint.tokens.json +0 -27
  35. package/dtcg/foundation/dimension.tokens.json +0 -258
  36. package/dtcg/foundation/font-family.tokens.json +0 -53
  37. package/dtcg/foundation/font-size.tokens.json +0 -408
  38. package/dtcg/foundation/font-weight.tokens.json +0 -214
  39. package/dtcg/foundation/letter-spacing.tokens.json +0 -203
  40. package/dtcg/foundation/line-height.tokens.json +0 -408
  41. package/dtcg/foundation/size.tokens.json +0 -191
  42. package/dtcg/foundation/space.tokens.json +0 -431
  43. package/dtcg/foundation/typography.tokens.json +0 -625
  44. package/dtcg/hpe.resolver.json +0 -178
  45. package/dtcg/semantic/border-radius.tokens.json +0 -149
  46. package/dtcg/semantic/border-width.tokens.json +0 -50
  47. package/dtcg/semantic/font-family.tokens.json +0 -42
  48. package/dtcg/semantic/font-size.tokens.json +0 -285
  49. package/dtcg/semantic/font-weight.tokens.json +0 -134
  50. package/dtcg/semantic/letter-spacing.tokens.json +0 -203
  51. package/dtcg/semantic/line-height.tokens.json +0 -285
  52. package/dtcg/semantic/size.tokens.json +0 -120
  53. package/dtcg/semantic/space.tokens.json +0 -275
  54. package/dtcg/semantic/typography.tokens.json +0 -536
  55. package/dtcg/theme/dark/color.tokens.json +0 -698
  56. package/dtcg/theme/light/color.tokens.json +0 -722
  57. package/dtcg/viewport/md-lg/font-size.tokens.json +0 -189
  58. package/dtcg/viewport/md-lg/font-weight.tokens.json +0 -11
  59. package/dtcg/viewport/md-lg/letter-spacing.tokens.json +0 -88
  60. package/dtcg/viewport/md-lg/line-height.tokens.json +0 -125
  61. package/dtcg/viewport/md-lg/size.tokens.json +0 -20
  62. package/dtcg/viewport/md-lg/space.tokens.json +0 -36
  63. package/dtcg/viewport/sm-xs/border-radius.tokens.json +0 -48
  64. package/dtcg/viewport/sm-xs/border-width.tokens.json +0 -15
  65. package/dtcg/viewport/sm-xs/font-size.tokens.json +0 -236
  66. package/dtcg/viewport/sm-xs/font-weight.tokens.json +0 -18
  67. package/dtcg/viewport/sm-xs/letter-spacing.tokens.json +0 -130
  68. package/dtcg/viewport/sm-xs/line-height.tokens.json +0 -236
  69. package/dtcg/viewport/sm-xs/size.tokens.json +0 -39
  70. package/dtcg/viewport/sm-xs/space.tokens.json +0 -46
  71. package/dtcg/viewport/xl/border-radius.tokens.json +0 -48
  72. package/dtcg/viewport/xl/font-size.tokens.json +0 -236
  73. package/dtcg/viewport/xl/letter-spacing.tokens.json +0 -122
  74. package/dtcg/viewport/xl/line-height.tokens.json +0 -178
  75. package/dtcg/viewport/xl/size.tokens.json +0 -84
  76. package/dtcg/viewport/xl/space.tokens.json +0 -68
  77. package/static/breakpoints.json +0 -23
package/src/semantic/dimension.md-lg.json ADDED
@@ -0,0 +1,764 @@
1
+ {
2
+ "hpe-web": {
3
+ "borderWidth": {
4
+ "default": {
5
+ "$type": "dimension",
6
+ "$value": "{hpe-web.static.borderWidth.xsmall}",
7
+ "$description": "Default border-width for standard uses like border as visual separator."
8
+ },
9
+ "large": {
10
+ "$type": "dimension",
11
+ "$value": "{hpe-web.static.borderWidth.large}"
12
+ },
13
+ "medium": {
14
+ "$type": "dimension",
15
+ "$value": "{hpe-web.static.borderWidth.medium}"
16
+ },
17
+ "none": {
18
+ "$type": "dimension",
19
+ "$value": "{hpe-web.static.borderWidth.none}"
20
+ },
21
+ "small": {
22
+ "$type": "dimension",
23
+ "$value": "{hpe-web.static.borderWidth.small}"
24
+ },
25
+ "xsmall": {
26
+ "$type": "dimension",
27
+ "$value": "{hpe-web.static.borderWidth.xsmall}"
28
+ }
29
+ },
30
+ "heading": {
31
+ "h1": {
32
+ "condensed": {
33
+ "bold": {
34
+ "fontSize": {
35
+ "$type": "dimension",
36
+ "$value": {
37
+ "value": 80,
38
+ "unit": "px"
39
+ },
40
+ "$description": "Font size typically used on h1."
41
+ },
42
+ "fontWeight": {
43
+ "$type": "fontWeight",
44
+ "$value": 400
45
+ },
46
+ "letterSpacing": {
47
+ "$type": "dimension",
48
+ "$value": {
49
+ "value": 1.6,
50
+ "unit": "px"
51
+ }
52
+ },
53
+ "lineHeight": {
54
+ "$type": "number",
55
+ "$value": 80,
56
+ "$description": "Line height typically used on h1."
57
+ }
58
+ },
59
+ "light": {
60
+ "fontSize": {
61
+ "$type": "dimension",
62
+ "$value": {
63
+ "value": 80,
64
+ "unit": "px"
65
+ },
66
+ "$description": "Font size typically used on h1."
67
+ },
68
+ "fontWeight": {
69
+ "$type": "fontWeight",
70
+ "$value": 400
71
+ },
72
+ "letterSpacing": {
73
+ "$type": "dimension",
74
+ "$value": {
75
+ "value": 1.6,
76
+ "unit": "px"
77
+ }
78
+ },
79
+ "lineHeight": {
80
+ "$type": "number",
81
+ "$value": 80,
82
+ "$description": "Line height typically used on h1."
83
+ }
84
+ },
85
+ "medium": {
86
+ "fontSize": {
87
+ "$type": "dimension",
88
+ "$value": {
89
+ "value": 80,
90
+ "unit": "px"
91
+ },
92
+ "$description": "Font size typically used on h1."
93
+ },
94
+ "fontWeight": {
95
+ "$type": "fontWeight",
96
+ "$value": 400
97
+ },
98
+ "letterSpacing": {
99
+ "$type": "dimension",
100
+ "$value": {
101
+ "value": 1.6,
102
+ "unit": "px"
103
+ }
104
+ },
105
+ "lineHeight": {
106
+ "$type": "number",
107
+ "$value": 80,
108
+ "$description": "Line height typically used on h1."
109
+ }
110
+ }
111
+ },
112
+ "default": {
113
+ "fontSize": {
114
+ "$type": "dimension",
115
+ "$value": {
116
+ "value": 56,
117
+ "unit": "px"
118
+ },
119
+ "$description": "Font size typically used on h1."
120
+ },
121
+ "fontWeight": {
122
+ "$type": "fontWeight",
123
+ "$value": 400
124
+ },
125
+ "letterSpacing": {
126
+ "$type": "dimension",
127
+ "$value": {
128
+ "value": -1.68,
129
+ "unit": "px"
130
+ }
131
+ },
132
+ "lineHeight": {
133
+ "$type": "number",
134
+ "$value": 62,
135
+ "$description": "Line height typically used on h1."
136
+ }
137
+ }
138
+ },
139
+ "h1-large": {
140
+ "condensed": {
141
+ "bold": {
142
+ "fontSize": {
143
+ "$type": "dimension",
144
+ "$value": {
145
+ "value": 96,
146
+ "unit": "px"
147
+ },
148
+ "$description": "Font size typically used on h1."
149
+ },
150
+ "fontWeight": {
151
+ "$type": "fontWeight",
152
+ "$value": 400
153
+ },
154
+ "letterSpacing": {
155
+ "$type": "dimension",
156
+ "$value": {
157
+ "value": 2,
158
+ "unit": "px"
159
+ }
160
+ },
161
+ "lineHeight": {
162
+ "$type": "number",
163
+ "$value": 96,
164
+ "$description": "Line height typically used on h1."
165
+ }
166
+ },
167
+ "light": {
168
+ "fontSize": {
169
+ "$type": "dimension",
170
+ "$value": {
171
+ "value": 96,
172
+ "unit": "px"
173
+ },
174
+ "$description": "Font size typically used on h1."
175
+ },
176
+ "fontWeight": {
177
+ "$type": "fontWeight",
178
+ "$value": 400
179
+ },
180
+ "letterSpacing": {
181
+ "$type": "dimension",
182
+ "$value": {
183
+ "value": 2,
184
+ "unit": "px"
185
+ }
186
+ },
187
+ "lineHeight": {
188
+ "$type": "number",
189
+ "$value": 96,
190
+ "$description": "Line height typically used on h1."
191
+ }
192
+ },
193
+ "medium": {
194
+ "fontSize": {
195
+ "$type": "dimension",
196
+ "$value": {
197
+ "value": 96,
198
+ "unit": "px"
199
+ },
200
+ "$description": "Font size typically used on h1."
201
+ },
202
+ "fontWeight": {
203
+ "$type": "fontWeight",
204
+ "$value": 400
205
+ },
206
+ "letterSpacing": {
207
+ "$type": "dimension",
208
+ "$value": {
209
+ "value": 2,
210
+ "unit": "px"
211
+ }
212
+ },
213
+ "lineHeight": {
214
+ "$type": "number",
215
+ "$value": 96,
216
+ "$description": "Line height typically used on h1."
217
+ }
218
+ }
219
+ },
220
+ "default": {
221
+ "fontSize": {
222
+ "$type": "dimension",
223
+ "$value": {
224
+ "value": 68,
225
+ "unit": "px"
226
+ },
227
+ "$description": "Font size typically used on h1."
228
+ },
229
+ "fontWeight": {
230
+ "$type": "fontWeight",
231
+ "$value": 400
232
+ },
233
+ "letterSpacing": {
234
+ "$type": "dimension",
235
+ "$value": {
236
+ "value": -2.73,
237
+ "unit": "px"
238
+ }
239
+ },
240
+ "lineHeight": {
241
+ "$type": "number",
242
+ "$value": 74,
243
+ "$description": "Line height typically used on h1."
244
+ }
245
+ }
246
+ },
247
+ "h2": {
248
+ "default": {
249
+ "fontSize": {
250
+ "$type": "dimension",
251
+ "$value": {
252
+ "value": 40,
253
+ "unit": "px"
254
+ },
255
+ "$description": "Font size typically used on h1."
256
+ },
257
+ "fontWeight": {
258
+ "$type": "fontWeight",
259
+ "$value": 400
260
+ },
261
+ "letterSpacing": {
262
+ "$type": "dimension",
263
+ "$value": {
264
+ "value": -0.8,
265
+ "unit": "px"
266
+ }
267
+ },
268
+ "lineHeight": {
269
+ "$type": "number",
270
+ "$value": 46,
271
+ "$description": "Line height typically used on h1."
272
+ }
273
+ }
274
+ },
275
+ "h3": {
276
+ "default": {
277
+ "fontSize": {
278
+ "$type": "dimension",
279
+ "$value": {
280
+ "value": 32,
281
+ "unit": "px"
282
+ },
283
+ "$description": "Font size typically used on h1."
284
+ },
285
+ "fontWeight": {
286
+ "$type": "fontWeight",
287
+ "$value": 400
288
+ },
289
+ "letterSpacing": {
290
+ "$type": "dimension",
291
+ "$value": {
292
+ "value": -0.32,
293
+ "unit": "px"
294
+ }
295
+ },
296
+ "lineHeight": {
297
+ "$type": "number",
298
+ "$value": 38,
299
+ "$description": "Line height typically used on h1."
300
+ }
301
+ }
302
+ },
303
+ "h4": {
304
+ "default": {
305
+ "fontSize": {
306
+ "$type": "dimension",
307
+ "$value": {
308
+ "value": 24,
309
+ "unit": "px"
310
+ },
311
+ "$description": "Font size typically used on h1."
312
+ },
313
+ "fontWeight": {
314
+ "$type": "fontWeight",
315
+ "$value": 400
316
+ },
317
+ "letterSpacing": {
318
+ "$type": "dimension",
319
+ "$value": {
320
+ "value": 0,
321
+ "unit": "px"
322
+ }
323
+ },
324
+ "lineHeight": {
325
+ "$type": "number",
326
+ "$value": 30,
327
+ "$description": "Line height typically used on h1."
328
+ }
329
+ }
330
+ },
331
+ "h5": {
332
+ "default": {
333
+ "fontSize": {
334
+ "$type": "dimension",
335
+ "$value": {
336
+ "value": 18,
337
+ "unit": "px"
338
+ },
339
+ "$description": "Font size typically used on h1."
340
+ },
341
+ "fontWeight": {
342
+ "$type": "fontWeight",
343
+ "$value": 400
344
+ },
345
+ "letterSpacing": {
346
+ "$type": "dimension",
347
+ "$value": {
348
+ "value": 0,
349
+ "unit": "px"
350
+ }
351
+ },
352
+ "lineHeight": {
353
+ "$type": "number",
354
+ "$value": 24,
355
+ "$description": "Line height typically used on h1."
356
+ }
357
+ }
358
+ },
359
+ "h6": {
360
+ "default": {
361
+ "fontSize": {
362
+ "$type": "dimension",
363
+ "$value": {
364
+ "value": 16,
365
+ "unit": "px"
366
+ },
367
+ "$description": "Font size typically used on h1."
368
+ },
369
+ "fontWeight": {
370
+ "$type": "fontWeight",
371
+ "$value": 400
372
+ },
373
+ "letterSpacing": {
374
+ "$type": "dimension",
375
+ "$value": {
376
+ "value": 0,
377
+ "unit": "px"
378
+ }
379
+ },
380
+ "lineHeight": {
381
+ "$type": "number",
382
+ "$value": 22,
383
+ "$description": "Line height typically used on h1."
384
+ }
385
+ }
386
+ }
387
+ },
388
+ "icon": {
389
+ "large": {
390
+ "size": {
391
+ "$type": "dimension",
392
+ "$value": "{hpe-web.base.dimension.450}"
393
+ }
394
+ },
395
+ "medium": {
396
+ "size": {
397
+ "$type": "dimension",
398
+ "$value": "{hpe-web.base.dimension.400}"
399
+ }
400
+ },
401
+ "small": {
402
+ "size": {
403
+ "$type": "dimension",
404
+ "$value": "{hpe-web.base.dimension.350}"
405
+ }
406
+ },
407
+ "xlarge": {
408
+ "size": {
409
+ "$type": "dimension",
410
+ "$value": "{hpe-web.base.dimension.500}"
411
+ }
412
+ },
413
+ "xsmall": {
414
+ "size": {
415
+ "$type": "dimension",
416
+ "$value": "{hpe-web.base.dimension.300}"
417
+ }
418
+ },
419
+ "xxlarge": {
420
+ "size": {
421
+ "$type": "dimension",
422
+ "$value": "{hpe-web.base.dimension.800}"
423
+ }
424
+ }
425
+ },
426
+ "paragraph": {
427
+ "body copy": {
428
+ "fontSize": {
429
+ "$type": "dimension",
430
+ "$value": {
431
+ "value": 18,
432
+ "unit": "px"
433
+ }
434
+ },
435
+ "fontWeight": {
436
+ "$type": "fontWeight",
437
+ "$value": 400
438
+ },
439
+ "letterSpacing": {
440
+ "$type": "dimension",
441
+ "$value": {
442
+ "value": 0,
443
+ "unit": "px"
444
+ }
445
+ },
446
+ "lineHeight": {
447
+ "$type": "number",
448
+ "$value": 26
449
+ }
450
+ },
451
+ "disclaimer": {
452
+ "fontSize": {
453
+ "$type": "dimension",
454
+ "$value": {
455
+ "value": 14,
456
+ "unit": "px"
457
+ }
458
+ },
459
+ "fontWeight": {
460
+ "$type": "fontWeight",
461
+ "$value": 400
462
+ },
463
+ "letterSpacing": {
464
+ "$type": "dimension",
465
+ "$value": {
466
+ "value": 0,
467
+ "unit": "px"
468
+ }
469
+ },
470
+ "lineHeight": {
471
+ "$type": "number",
472
+ "$value": 20
473
+ }
474
+ },
475
+ "large body copy": {
476
+ "fontSize": {
477
+ "$type": "dimension",
478
+ "$value": {
479
+ "value": 24,
480
+ "unit": "px"
481
+ }
482
+ },
483
+ "fontWeight": {
484
+ "$type": "fontWeight",
485
+ "$value": 400
486
+ },
487
+ "letterSpacing": {
488
+ "$type": "dimension",
489
+ "$value": {
490
+ "value": -0.24,
491
+ "unit": "px"
492
+ }
493
+ },
494
+ "lineHeight": {
495
+ "$type": "number",
496
+ "$value": 34
497
+ }
498
+ },
499
+ "small body copy": {
500
+ "fontSize": {
501
+ "$type": "dimension",
502
+ "$value": {
503
+ "value": 16,
504
+ "unit": "px"
505
+ }
506
+ },
507
+ "fontWeight": {
508
+ "$type": "fontWeight",
509
+ "$value": 400
510
+ },
511
+ "letterSpacing": {
512
+ "$type": "dimension",
513
+ "$value": {
514
+ "value": 0,
515
+ "unit": "px"
516
+ }
517
+ },
518
+ "lineHeight": {
519
+ "$type": "number",
520
+ "$value": 24
521
+ }
522
+ }
523
+ },
524
+ "quote": {
525
+ "large": {
526
+ "fontSize": {
527
+ "$type": "dimension",
528
+ "$value": {
529
+ "value": 48,
530
+ "unit": "px"
531
+ }
532
+ },
533
+ "fontWeight": {
534
+ "$type": "fontWeight",
535
+ "$value": 400
536
+ },
537
+ "letterSpacing": {
538
+ "$type": "dimension",
539
+ "$value": {
540
+ "value": -1.92,
541
+ "unit": "px"
542
+ }
543
+ },
544
+ "lineHeight": {
545
+ "$type": "number",
546
+ "$value": 58
547
+ }
548
+ },
549
+ "medium": {
550
+ "fontSize": {
551
+ "$type": "dimension",
552
+ "$value": {
553
+ "value": 40,
554
+ "unit": "px"
555
+ }
556
+ },
557
+ "fontWeight": {
558
+ "$type": "fontWeight",
559
+ "$value": 400
560
+ },
561
+ "letterSpacing": {
562
+ "$type": "dimension",
563
+ "$value": {
564
+ "value": -1.2,
565
+ "unit": "px"
566
+ }
567
+ },
568
+ "lineHeight": {
569
+ "$type": "number",
570
+ "$value": 50
571
+ }
572
+ },
573
+ "small": {
574
+ "fontSize": {
575
+ "$type": "dimension",
576
+ "$value": {
577
+ "value": 32,
578
+ "unit": "px"
579
+ }
580
+ },
581
+ "fontWeight": {
582
+ "$type": "fontWeight",
583
+ "$value": 400
584
+ },
585
+ "letterSpacing": {
586
+ "$type": "dimension",
587
+ "$value": {
588
+ "value": -0.64,
589
+ "unit": "px"
590
+ }
591
+ },
592
+ "lineHeight": {
593
+ "$type": "number",
594
+ "$value": 42
595
+ }
596
+ }
597
+ },
598
+ "radius": {
599
+ "full": {
600
+ "$type": "dimension",
601
+ "$value": {
602
+ "value": 9999,
603
+ "unit": "px"
604
+ }
605
+ },
606
+ "hair": {
607
+ "$type": "dimension",
608
+ "$value": {
609
+ "value": 1,
610
+ "unit": "px"
611
+ }
612
+ },
613
+ "large": {
614
+ "$type": "dimension",
615
+ "$value": {
616
+ "value": 16,
617
+ "unit": "px"
618
+ }
619
+ },
620
+ "medium": {
621
+ "$type": "dimension",
622
+ "$value": {
623
+ "value": 12,
624
+ "unit": "px"
625
+ }
626
+ },
627
+ "none": {
628
+ "$type": "dimension",
629
+ "$value": {
630
+ "value": 0,
631
+ "unit": "px"
632
+ }
633
+ },
634
+ "small": {
635
+ "$type": "dimension",
636
+ "$value": {
637
+ "value": 8,
638
+ "unit": "px"
639
+ }
640
+ },
641
+ "xlarge": {
642
+ "$type": "dimension",
643
+ "$value": {
644
+ "value": 24,
645
+ "unit": "px"
646
+ }
647
+ },
648
+ "xsmall": {
649
+ "$type": "dimension",
650
+ "$value": {
651
+ "value": 6,
652
+ "unit": "px"
653
+ }
654
+ },
655
+ "xxlarge": {
656
+ "$type": "dimension",
657
+ "$value": {
658
+ "value": 32,
659
+ "unit": "px"
660
+ }
661
+ },
662
+ "xxsmall": {
663
+ "$type": "dimension",
664
+ "$value": {
665
+ "value": 4,
666
+ "unit": "px"
667
+ }
668
+ }
669
+ },
670
+ "spacing": {
671
+ "3xlarge": {
672
+ "$type": "dimension",
673
+ "$value": {
674
+ "value": 96,
675
+ "unit": "px"
676
+ }
677
+ },
678
+ "3xsmall": {
679
+ "$type": "dimension",
680
+ "$value": {
681
+ "value": 8,
682
+ "unit": "px"
683
+ }
684
+ },
685
+ "4xlarge": {
686
+ "$type": "dimension",
687
+ "$value": {
688
+ "value": 160,
689
+ "unit": "px"
690
+ }
691
+ },
692
+ "4xsmall": {
693
+ "$type": "dimension",
694
+ "$value": {
695
+ "value": 4,
696
+ "unit": "px"
697
+ }
698
+ },
699
+ "hair": {
700
+ "$type": "dimension",
701
+ "$value": {
702
+ "value": 1,
703
+ "unit": "px"
704
+ }
705
+ },
706
+ "large": {
707
+ "$type": "dimension",
708
+ "$value": {
709
+ "value": 40,
710
+ "unit": "px"
711
+ }
712
+ },
713
+ "medium": {
714
+ "$type": "dimension",
715
+ "$value": {
716
+ "value": 32,
717
+ "unit": "px"
718
+ }
719
+ },
720
+ "none": {
721
+ "$type": "dimension",
722
+ "$value": {
723
+ "value": 0,
724
+ "unit": "px"
725
+ }
726
+ },
727
+ "small": {
728
+ "$type": "dimension",
729
+ "$value": {
730
+ "value": 24,
731
+ "unit": "px"
732
+ }
733
+ },
734
+ "xlarge": {
735
+ "$type": "dimension",
736
+ "$value": {
737
+ "value": 48,
738
+ "unit": "px"
739
+ }
740
+ },
741
+ "xsmall": {
742
+ "$type": "dimension",
743
+ "$value": {
744
+ "value": 16,
745
+ "unit": "px"
746
+ }
747
+ },
748
+ "xxlarge": {
749
+ "$type": "dimension",
750
+ "$value": {
751
+ "value": 64,
752
+ "unit": "px"
753
+ }
754
+ },
755
+ "xxsmall": {
756
+ "$type": "dimension",
757
+ "$value": {
758
+ "value": 12,
759
+ "unit": "px"
760
+ }
761
+ }
762
+ }
763
+ }
764
+ }