@utrecht/design-tokens 2.2.0 → 2.3.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 (18) hide show
  1. package/CHANGELOG.md +6 -0
  2. package/dist/dark/index.tokens.json +334 -2
  3. package/dist/dark/list.d.ts +14 -0
  4. package/dist/dark/list.mjs +30694 -0
  5. package/dist/dark/tokens.cjs +332 -0
  6. package/dist/dark/tokens.d.ts +178 -2
  7. package/dist/dark/tokens.json +332 -0
  8. package/dist/index.tokens.json +334 -2
  9. package/dist/list.d.ts +14 -0
  10. package/dist/list.mjs +31811 -0
  11. package/dist/tokens.cjs +332 -0
  12. package/dist/tokens.d.ts +178 -2
  13. package/dist/tokens.json +332 -0
  14. package/package.json +1 -1
  15. package/src/css-property-formatter.mjs +2 -1
  16. package/src/json-list-formatter.js +2 -1
  17. package/style-dictionary-build.mjs +3 -1
  18. package/style-dictionary-config.mjs +27 -0
package/dist/tokens.cjs CHANGED
@@ -2264,6 +2264,7 @@ module.exports = {
2264
2264
  }
2265
2265
  }
2266
2266
  },
2267
+ "alternate-lang-nav": {},
2267
2268
  "article": {
2268
2269
  "max-inline-size": {
2269
2270
  "$extensions": {
@@ -3596,6 +3597,51 @@ module.exports = {
3596
3597
  ]
3597
3598
  }
3598
3599
  },
3600
+ "body": {
3601
+ "font-family": {
3602
+ "$extensions": {
3603
+ "nl.nldesignsystem.css.property": {
3604
+ "syntax": "*",
3605
+ "inherits": true
3606
+ },
3607
+ "nl.nldesignsystem.figma.supports-token": true
3608
+ },
3609
+ "type": "fontFamilies"
3610
+ },
3611
+ "font-size": {
3612
+ "$extensions": {
3613
+ "nl.nldesignsystem.css.property": {
3614
+ "syntax": "<length>",
3615
+ "inherits": true
3616
+ },
3617
+ "nl.nldesignsystem.figma.supports-token": true
3618
+ },
3619
+ "type": "fontSizes"
3620
+ },
3621
+ "font-weight": {
3622
+ "$extensions": {
3623
+ "nl.nldesignsystem.css.property": {
3624
+ "syntax": "<number>",
3625
+ "inherits": true
3626
+ },
3627
+ "nl.nldesignsystem.figma.supports-token": true
3628
+ },
3629
+ "type": "fontWeights"
3630
+ },
3631
+ "line-height": {
3632
+ "$extensions": {
3633
+ "nl.nldesignsystem.css.property": {
3634
+ "syntax": [
3635
+ "<length>",
3636
+ "<number>"
3637
+ ],
3638
+ "inherits": true
3639
+ },
3640
+ "nl.nldesignsystem.figma.supports-token": true
3641
+ },
3642
+ "type": "lineHeights"
3643
+ }
3644
+ },
3599
3645
  "breadcrumb-nav": {
3600
3646
  "min-block-size": {
3601
3647
  "$extensions": {
@@ -11600,6 +11646,20 @@ module.exports = {
11600
11646
  }
11601
11647
  }
11602
11648
  },
11649
+ "combobox": {
11650
+ "popover": {
11651
+ "z-index": {
11652
+ "$extensions": {
11653
+ "nl.nldesignsystem.css.property": {
11654
+ "syntax": "<number>",
11655
+ "inherits": true
11656
+ },
11657
+ "nl.nldesignsystem.figma.supports-token": false
11658
+ },
11659
+ "type": "other"
11660
+ }
11661
+ }
11662
+ },
11603
11663
  "action": {
11604
11664
  "activate": {
11605
11665
  "cursor": {
@@ -20855,6 +20915,7 @@ module.exports = {
20855
20915
  ]
20856
20916
  }
20857
20917
  },
20918
+ "html-content": {},
20858
20919
  "iban-data": {},
20859
20920
  "icon": {
20860
20921
  "color": {
@@ -24301,6 +24362,26 @@ module.exports = {
24301
24362
  ]
24302
24363
  },
24303
24364
  "content": {
24365
+ "background-color": {
24366
+ "$extensions": {
24367
+ "nl.nldesignsystem.css.property": {
24368
+ "syntax": "<color>",
24369
+ "inherits": true
24370
+ },
24371
+ "nl.nldesignsystem.figma.supports-token": false
24372
+ },
24373
+ "type": "color"
24374
+ },
24375
+ "color": {
24376
+ "$extensions": {
24377
+ "nl.nldesignsystem.css.property": {
24378
+ "syntax": "<color>",
24379
+ "inherits": true
24380
+ },
24381
+ "nl.nldesignsystem.figma.supports-token": false
24382
+ },
24383
+ "type": "color"
24384
+ },
24304
24385
  "max-inline-size": {
24305
24386
  "$extensions": {
24306
24387
  "nl.nldesignsystem.css.property": {
@@ -25564,6 +25645,90 @@ module.exports = {
25564
25645
  }
25565
25646
  }
25566
25647
  },
25648
+ "page-body": {
25649
+ "background-color": {
25650
+ "$extensions": {
25651
+ "nl.nldesignsystem.css.property": {
25652
+ "syntax": "<color>",
25653
+ "inherits": true
25654
+ },
25655
+ "nl.nldesignsystem.figma.supports-token": false
25656
+ },
25657
+ "type": "color"
25658
+ },
25659
+ "color": {
25660
+ "$extensions": {
25661
+ "nl.nldesignsystem.css.property": {
25662
+ "syntax": "<color>",
25663
+ "inherits": true
25664
+ },
25665
+ "nl.nldesignsystem.figma.supports-token": false
25666
+ },
25667
+ "type": "color"
25668
+ },
25669
+ "content": {
25670
+ "background-color": {
25671
+ "$extensions": {
25672
+ "nl.nldesignsystem.css.property": {
25673
+ "syntax": "<color>",
25674
+ "inherits": true
25675
+ },
25676
+ "nl.nldesignsystem.figma.supports-token": false
25677
+ },
25678
+ "type": "color"
25679
+ },
25680
+ "color": {
25681
+ "$extensions": {
25682
+ "nl.nldesignsystem.css.property": {
25683
+ "syntax": "<color>",
25684
+ "inherits": true
25685
+ },
25686
+ "nl.nldesignsystem.figma.supports-token": false
25687
+ },
25688
+ "type": "color"
25689
+ },
25690
+ "padding-block-start": {
25691
+ "$extensions": {
25692
+ "nl.nldesignsystem.css.property": {
25693
+ "syntax": "<length>",
25694
+ "inherits": true
25695
+ },
25696
+ "nl.nldesignsystem.figma.supports-token": false
25697
+ },
25698
+ "type": "spacing"
25699
+ },
25700
+ "padding-block-end": {
25701
+ "$extensions": {
25702
+ "nl.nldesignsystem.css.property": {
25703
+ "syntax": "<length>",
25704
+ "inherits": true
25705
+ },
25706
+ "nl.nldesignsystem.figma.supports-token": false
25707
+ },
25708
+ "type": "spacing"
25709
+ },
25710
+ "padding-inline-start": {
25711
+ "$extensions": {
25712
+ "nl.nldesignsystem.css.property": {
25713
+ "syntax": "<length>",
25714
+ "inherits": true
25715
+ },
25716
+ "nl.nldesignsystem.figma.supports-token": false
25717
+ },
25718
+ "type": "spacing"
25719
+ },
25720
+ "padding-inine-end": {
25721
+ "$extensions": {
25722
+ "nl.nldesignsystem.css.property": {
25723
+ "syntax": "<length>",
25724
+ "inherits": true
25725
+ },
25726
+ "nl.nldesignsystem.figma.supports-token": false
25727
+ },
25728
+ "type": "spacing"
25729
+ }
25730
+ }
25731
+ },
25567
25732
  "page-content": {
25568
25733
  "padding-block-start": {
25569
25734
  "$extensions": {
@@ -25901,6 +26066,68 @@ module.exports = {
25901
26066
  "page-footer",
25902
26067
  "padding-block-start"
25903
26068
  ]
26069
+ },
26070
+ "content": {
26071
+ "color": {
26072
+ "$extensions": {
26073
+ "nl.nldesignsystem.css.property": {
26074
+ "syntax": "<color>",
26075
+ "inherits": true
26076
+ },
26077
+ "nl.nldesignsystem.figma.supports-token": false
26078
+ },
26079
+ "type": "color"
26080
+ },
26081
+ "background-color": {
26082
+ "$extensions": {
26083
+ "nl.nldesignsystem.css.property": {
26084
+ "syntax": "<color>",
26085
+ "inherits": true
26086
+ },
26087
+ "nl.nldesignsystem.figma.supports-token": false
26088
+ },
26089
+ "type": "color"
26090
+ },
26091
+ "padding-inline-end": {
26092
+ "$extensions": {
26093
+ "nl.nldesignsystem.css.property": {
26094
+ "syntax": "<length>",
26095
+ "inherits": true
26096
+ },
26097
+ "nl.nldesignsystem.figma.supports-token": false
26098
+ },
26099
+ "type": "spacing"
26100
+ },
26101
+ "padding-inline-start": {
26102
+ "$extensions": {
26103
+ "nl.nldesignsystem.css.property": {
26104
+ "syntax": "<length>",
26105
+ "inherits": true
26106
+ },
26107
+ "nl.nldesignsystem.figma.supports-token": false
26108
+ },
26109
+ "type": "spacing"
26110
+ },
26111
+ "padding-block-end": {
26112
+ "$extensions": {
26113
+ "nl.nldesignsystem.css.property": {
26114
+ "syntax": "<length>",
26115
+ "inherits": true
26116
+ },
26117
+ "nl.nldesignsystem.figma.supports-token": false
26118
+ },
26119
+ "type": "spacing"
26120
+ },
26121
+ "padding-block-start": {
26122
+ "$extensions": {
26123
+ "nl.nldesignsystem.css.property": {
26124
+ "syntax": "<length>",
26125
+ "inherits": true
26126
+ },
26127
+ "nl.nldesignsystem.figma.supports-token": false
26128
+ },
26129
+ "type": "spacing"
26130
+ }
25904
26131
  }
25905
26132
  },
25906
26133
  "page-header": {
@@ -25914,6 +26141,16 @@ module.exports = {
25914
26141
  },
25915
26142
  "type": "color"
25916
26143
  },
26144
+ "border-block-end-color": {
26145
+ "$extensions": {
26146
+ "nl.nldesignsystem.css.property": {
26147
+ "syntax": "<color>",
26148
+ "inherits": true
26149
+ },
26150
+ "nl.nldesignsystem.figma.supports-token": false
26151
+ },
26152
+ "type": "color"
26153
+ },
25917
26154
  "color": {
25918
26155
  "$extensions": {
25919
26156
  "nl.nldesignsystem.css.property": {
@@ -26071,8 +26308,71 @@ module.exports = {
26071
26308
  "page-header",
26072
26309
  "padding-inline-end"
26073
26310
  ]
26311
+ },
26312
+ "content": {
26313
+ "background-color": {
26314
+ "$extensions": {
26315
+ "nl.nldesignsystem.css.property": {
26316
+ "syntax": "<color>",
26317
+ "inherits": true
26318
+ },
26319
+ "nl.nldesignsystem.figma.supports-token": false
26320
+ },
26321
+ "type": "color"
26322
+ },
26323
+ "color": {
26324
+ "$extensions": {
26325
+ "nl.nldesignsystem.css.property": {
26326
+ "syntax": "<color>",
26327
+ "inherits": true
26328
+ },
26329
+ "nl.nldesignsystem.figma.supports-token": false
26330
+ },
26331
+ "type": "color"
26332
+ },
26333
+ "padding-block-start": {
26334
+ "$extensions": {
26335
+ "nl.nldesignsystem.css.property": {
26336
+ "syntax": "<length>",
26337
+ "inherits": true
26338
+ },
26339
+ "nl.nldesignsystem.figma.supports-token": false
26340
+ },
26341
+ "type": "spacing"
26342
+ },
26343
+ "padding-block-end": {
26344
+ "$extensions": {
26345
+ "nl.nldesignsystem.css.property": {
26346
+ "syntax": "<length>",
26347
+ "inherits": true
26348
+ },
26349
+ "nl.nldesignsystem.figma.supports-token": false
26350
+ },
26351
+ "type": "spacing"
26352
+ },
26353
+ "padding-inline-start": {
26354
+ "$extensions": {
26355
+ "nl.nldesignsystem.css.property": {
26356
+ "syntax": "<length>",
26357
+ "inherits": true
26358
+ },
26359
+ "nl.nldesignsystem.figma.supports-token": false
26360
+ },
26361
+ "type": "spacing"
26362
+ },
26363
+ "padding-inline-end": {
26364
+ "$extensions": {
26365
+ "nl.nldesignsystem.css.property": {
26366
+ "syntax": "<length>",
26367
+ "inherits": true
26368
+ },
26369
+ "nl.nldesignsystem.figma.supports-token": false
26370
+ },
26371
+ "type": "spacing"
26372
+ }
26074
26373
  }
26075
26374
  },
26375
+ "page-layout": {},
26076
26376
  "page": {
26077
26377
  "background-color": {
26078
26378
  "$extensions": {
@@ -29663,6 +29963,38 @@ module.exports = {
29663
29963
  }
29664
29964
  }
29665
29965
  },
29966
+ "root": {
29967
+ "background-color": {
29968
+ "$extensions": {
29969
+ "nl.nldesignsystem.css.property": {
29970
+ "syntax": "<color>",
29971
+ "inherits": true
29972
+ },
29973
+ "nl.nldesignsystem.figma.supports-token": false
29974
+ },
29975
+ "type": "color"
29976
+ },
29977
+ "color": {
29978
+ "$extensions": {
29979
+ "nl.nldesignsystem.css.property": {
29980
+ "syntax": "<color>",
29981
+ "inherits": true
29982
+ },
29983
+ "nl.nldesignsystem.figma.supports-token": false
29984
+ },
29985
+ "type": "color"
29986
+ },
29987
+ "font-family": {
29988
+ "$extensions": {
29989
+ "nl.nldesignsystem.css.property": {
29990
+ "syntax": "*",
29991
+ "inherits": true
29992
+ },
29993
+ "nl.nldesignsystem.figma.supports-token": false
29994
+ },
29995
+ "type": "fontFamilies"
29996
+ }
29997
+ },
29666
29998
  "search-bar": {
29667
29999
  "button": {
29668
30000
  "background-color": {
package/dist/tokens.d.ts CHANGED
@@ -261,6 +261,7 @@ declare const tokens: {
261
261
  }
262
262
  }
263
263
  },
264
+ "alternate-lang-nav": {},
264
265
  "article": {
265
266
  "max-inline-size": DesignToken
266
267
  },
@@ -516,6 +517,30 @@ declare const tokens: {
516
517
  "margin-block-start": DesignToken,
517
518
  "margin-block-end": DesignToken
518
519
  },
520
+ "body": {
521
+ "font-family": {
522
+ "$extensions": {
523
+ "nl.nldesignsystem.css.property": {}
524
+ }
525
+ },
526
+ "font-size": {
527
+ "$extensions": {
528
+ "nl.nldesignsystem.css.property": {}
529
+ }
530
+ },
531
+ "font-weight": {
532
+ "$extensions": {
533
+ "nl.nldesignsystem.css.property": {}
534
+ }
535
+ },
536
+ "line-height": {
537
+ "$extensions": {
538
+ "nl.nldesignsystem.css.property": {
539
+ "syntax": {}
540
+ }
541
+ }
542
+ }
543
+ },
519
544
  "breadcrumb-nav": {
520
545
  "min-block-size": DesignToken,
521
546
  "font-family": {
@@ -1496,6 +1521,15 @@ declare const tokens: {
1496
1521
  }
1497
1522
  }
1498
1523
  },
1524
+ "combobox": {
1525
+ "popover": {
1526
+ "z-index": {
1527
+ "$extensions": {
1528
+ "nl.nldesignsystem.css.property": {}
1529
+ }
1530
+ }
1531
+ }
1532
+ },
1499
1533
  "action": {
1500
1534
  "activate": {
1501
1535
  "cursor": DesignToken
@@ -2429,6 +2463,7 @@ declare const tokens: {
2429
2463
  },
2430
2464
  "font-weight": DesignToken
2431
2465
  },
2466
+ "html-content": {},
2432
2467
  "iban-data": {},
2433
2468
  "icon": {
2434
2469
  "color": {
@@ -2871,6 +2906,16 @@ declare const tokens: {
2871
2906
  "background-color": DesignToken,
2872
2907
  "color": DesignToken,
2873
2908
  "content": {
2909
+ "background-color": {
2910
+ "$extensions": {
2911
+ "nl.nldesignsystem.css.property": {}
2912
+ }
2913
+ },
2914
+ "color": {
2915
+ "$extensions": {
2916
+ "nl.nldesignsystem.css.property": {}
2917
+ }
2918
+ },
2874
2919
  "max-inline-size": DesignToken
2875
2920
  },
2876
2921
  "link": {
@@ -3005,6 +3050,50 @@ declare const tokens: {
3005
3050
  "padding-inline-start": DesignToken
3006
3051
  }
3007
3052
  },
3053
+ "page-body": {
3054
+ "background-color": {
3055
+ "$extensions": {
3056
+ "nl.nldesignsystem.css.property": {}
3057
+ }
3058
+ },
3059
+ "color": {
3060
+ "$extensions": {
3061
+ "nl.nldesignsystem.css.property": {}
3062
+ }
3063
+ },
3064
+ "content": {
3065
+ "background-color": {
3066
+ "$extensions": {
3067
+ "nl.nldesignsystem.css.property": {}
3068
+ }
3069
+ },
3070
+ "color": {
3071
+ "$extensions": {
3072
+ "nl.nldesignsystem.css.property": {}
3073
+ }
3074
+ },
3075
+ "padding-block-start": {
3076
+ "$extensions": {
3077
+ "nl.nldesignsystem.css.property": {}
3078
+ }
3079
+ },
3080
+ "padding-block-end": {
3081
+ "$extensions": {
3082
+ "nl.nldesignsystem.css.property": {}
3083
+ }
3084
+ },
3085
+ "padding-inline-start": {
3086
+ "$extensions": {
3087
+ "nl.nldesignsystem.css.property": {}
3088
+ }
3089
+ },
3090
+ "padding-inine-end": {
3091
+ "$extensions": {
3092
+ "nl.nldesignsystem.css.property": {}
3093
+ }
3094
+ }
3095
+ }
3096
+ },
3008
3097
  "page-content": {
3009
3098
  "padding-block-start": DesignToken,
3010
3099
  "padding-block-end": DesignToken,
@@ -3026,7 +3115,39 @@ declare const tokens: {
3026
3115
  "padding-inline-end": DesignToken,
3027
3116
  "padding-inline-start": DesignToken,
3028
3117
  "padding-block-end": DesignToken,
3029
- "padding-block-start": DesignToken
3118
+ "padding-block-start": DesignToken,
3119
+ "content": {
3120
+ "color": {
3121
+ "$extensions": {
3122
+ "nl.nldesignsystem.css.property": {}
3123
+ }
3124
+ },
3125
+ "background-color": {
3126
+ "$extensions": {
3127
+ "nl.nldesignsystem.css.property": {}
3128
+ }
3129
+ },
3130
+ "padding-inline-end": {
3131
+ "$extensions": {
3132
+ "nl.nldesignsystem.css.property": {}
3133
+ }
3134
+ },
3135
+ "padding-inline-start": {
3136
+ "$extensions": {
3137
+ "nl.nldesignsystem.css.property": {}
3138
+ }
3139
+ },
3140
+ "padding-block-end": {
3141
+ "$extensions": {
3142
+ "nl.nldesignsystem.css.property": {}
3143
+ }
3144
+ },
3145
+ "padding-block-start": {
3146
+ "$extensions": {
3147
+ "nl.nldesignsystem.css.property": {}
3148
+ }
3149
+ }
3150
+ }
3030
3151
  },
3031
3152
  "page-header": {
3032
3153
  "background-color": {
@@ -3034,6 +3155,11 @@ declare const tokens: {
3034
3155
  "nl.nldesignsystem.css.property": {}
3035
3156
  }
3036
3157
  },
3158
+ "border-block-end-color": {
3159
+ "$extensions": {
3160
+ "nl.nldesignsystem.css.property": {}
3161
+ }
3162
+ },
3037
3163
  "color": {
3038
3164
  "$extensions": {
3039
3165
  "nl.nldesignsystem.css.property": {}
@@ -3042,8 +3168,41 @@ declare const tokens: {
3042
3168
  "padding-block-start": DesignToken,
3043
3169
  "padding-block-end": DesignToken,
3044
3170
  "padding-inline-start": DesignToken,
3045
- "padding-inline-end": DesignToken
3171
+ "padding-inline-end": DesignToken,
3172
+ "content": {
3173
+ "background-color": {
3174
+ "$extensions": {
3175
+ "nl.nldesignsystem.css.property": {}
3176
+ }
3177
+ },
3178
+ "color": {
3179
+ "$extensions": {
3180
+ "nl.nldesignsystem.css.property": {}
3181
+ }
3182
+ },
3183
+ "padding-block-start": {
3184
+ "$extensions": {
3185
+ "nl.nldesignsystem.css.property": {}
3186
+ }
3187
+ },
3188
+ "padding-block-end": {
3189
+ "$extensions": {
3190
+ "nl.nldesignsystem.css.property": {}
3191
+ }
3192
+ },
3193
+ "padding-inline-start": {
3194
+ "$extensions": {
3195
+ "nl.nldesignsystem.css.property": {}
3196
+ }
3197
+ },
3198
+ "padding-inline-end": {
3199
+ "$extensions": {
3200
+ "nl.nldesignsystem.css.property": {}
3201
+ }
3202
+ }
3203
+ }
3046
3204
  },
3205
+ "page-layout": {},
3047
3206
  "page": {
3048
3207
  "background-color": DesignToken,
3049
3208
  "color": DesignToken,
@@ -3400,6 +3559,23 @@ declare const tokens: {
3400
3559
  "margin-block-end": DesignToken
3401
3560
  }
3402
3561
  },
3562
+ "root": {
3563
+ "background-color": {
3564
+ "$extensions": {
3565
+ "nl.nldesignsystem.css.property": {}
3566
+ }
3567
+ },
3568
+ "color": {
3569
+ "$extensions": {
3570
+ "nl.nldesignsystem.css.property": {}
3571
+ }
3572
+ },
3573
+ "font-family": {
3574
+ "$extensions": {
3575
+ "nl.nldesignsystem.css.property": {}
3576
+ }
3577
+ }
3578
+ },
3403
3579
  "search-bar": {
3404
3580
  "button": {
3405
3581
  "background-color": DesignToken,