@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/dark/tokens.cjs CHANGED
@@ -2090,6 +2090,7 @@ module.exports = {
2090
2090
  }
2091
2091
  }
2092
2092
  },
2093
+ "alternate-lang-nav": {},
2093
2094
  "article": {
2094
2095
  "max-inline-size": {
2095
2096
  "$extensions": {
@@ -3390,6 +3391,51 @@ module.exports = {
3390
3391
  ]
3391
3392
  }
3392
3393
  },
3394
+ "body": {
3395
+ "font-family": {
3396
+ "$extensions": {
3397
+ "nl.nldesignsystem.css.property": {
3398
+ "syntax": "*",
3399
+ "inherits": true
3400
+ },
3401
+ "nl.nldesignsystem.figma.supports-token": true
3402
+ },
3403
+ "type": "fontFamilies"
3404
+ },
3405
+ "font-size": {
3406
+ "$extensions": {
3407
+ "nl.nldesignsystem.css.property": {
3408
+ "syntax": "<length>",
3409
+ "inherits": true
3410
+ },
3411
+ "nl.nldesignsystem.figma.supports-token": true
3412
+ },
3413
+ "type": "fontSizes"
3414
+ },
3415
+ "font-weight": {
3416
+ "$extensions": {
3417
+ "nl.nldesignsystem.css.property": {
3418
+ "syntax": "<number>",
3419
+ "inherits": true
3420
+ },
3421
+ "nl.nldesignsystem.figma.supports-token": true
3422
+ },
3423
+ "type": "fontWeights"
3424
+ },
3425
+ "line-height": {
3426
+ "$extensions": {
3427
+ "nl.nldesignsystem.css.property": {
3428
+ "syntax": [
3429
+ "<length>",
3430
+ "<number>"
3431
+ ],
3432
+ "inherits": true
3433
+ },
3434
+ "nl.nldesignsystem.figma.supports-token": true
3435
+ },
3436
+ "type": "lineHeights"
3437
+ }
3438
+ },
3393
3439
  "breadcrumb-nav": {
3394
3440
  "min-block-size": {
3395
3441
  "$extensions": {
@@ -10978,6 +11024,20 @@ module.exports = {
10978
11024
  }
10979
11025
  }
10980
11026
  },
11027
+ "combobox": {
11028
+ "popover": {
11029
+ "z-index": {
11030
+ "$extensions": {
11031
+ "nl.nldesignsystem.css.property": {
11032
+ "syntax": "<number>",
11033
+ "inherits": true
11034
+ },
11035
+ "nl.nldesignsystem.figma.supports-token": false
11036
+ },
11037
+ "type": "other"
11038
+ }
11039
+ }
11040
+ },
10981
11041
  "action": {
10982
11042
  "activate": {
10983
11043
  "cursor": {
@@ -19901,6 +19961,7 @@ module.exports = {
19901
19961
  ]
19902
19962
  }
19903
19963
  },
19964
+ "html-content": {},
19904
19965
  "iban-data": {},
19905
19966
  "icon": {
19906
19967
  "color": {
@@ -23243,6 +23304,26 @@ module.exports = {
23243
23304
  ]
23244
23305
  },
23245
23306
  "content": {
23307
+ "background-color": {
23308
+ "$extensions": {
23309
+ "nl.nldesignsystem.css.property": {
23310
+ "syntax": "<color>",
23311
+ "inherits": true
23312
+ },
23313
+ "nl.nldesignsystem.figma.supports-token": false
23314
+ },
23315
+ "type": "color"
23316
+ },
23317
+ "color": {
23318
+ "$extensions": {
23319
+ "nl.nldesignsystem.css.property": {
23320
+ "syntax": "<color>",
23321
+ "inherits": true
23322
+ },
23323
+ "nl.nldesignsystem.figma.supports-token": false
23324
+ },
23325
+ "type": "color"
23326
+ },
23246
23327
  "max-inline-size": {
23247
23328
  "$extensions": {
23248
23329
  "nl.nldesignsystem.css.property": {
@@ -24506,6 +24587,90 @@ module.exports = {
24506
24587
  }
24507
24588
  }
24508
24589
  },
24590
+ "page-body": {
24591
+ "background-color": {
24592
+ "$extensions": {
24593
+ "nl.nldesignsystem.css.property": {
24594
+ "syntax": "<color>",
24595
+ "inherits": true
24596
+ },
24597
+ "nl.nldesignsystem.figma.supports-token": false
24598
+ },
24599
+ "type": "color"
24600
+ },
24601
+ "color": {
24602
+ "$extensions": {
24603
+ "nl.nldesignsystem.css.property": {
24604
+ "syntax": "<color>",
24605
+ "inherits": true
24606
+ },
24607
+ "nl.nldesignsystem.figma.supports-token": false
24608
+ },
24609
+ "type": "color"
24610
+ },
24611
+ "content": {
24612
+ "background-color": {
24613
+ "$extensions": {
24614
+ "nl.nldesignsystem.css.property": {
24615
+ "syntax": "<color>",
24616
+ "inherits": true
24617
+ },
24618
+ "nl.nldesignsystem.figma.supports-token": false
24619
+ },
24620
+ "type": "color"
24621
+ },
24622
+ "color": {
24623
+ "$extensions": {
24624
+ "nl.nldesignsystem.css.property": {
24625
+ "syntax": "<color>",
24626
+ "inherits": true
24627
+ },
24628
+ "nl.nldesignsystem.figma.supports-token": false
24629
+ },
24630
+ "type": "color"
24631
+ },
24632
+ "padding-block-start": {
24633
+ "$extensions": {
24634
+ "nl.nldesignsystem.css.property": {
24635
+ "syntax": "<length>",
24636
+ "inherits": true
24637
+ },
24638
+ "nl.nldesignsystem.figma.supports-token": false
24639
+ },
24640
+ "type": "spacing"
24641
+ },
24642
+ "padding-block-end": {
24643
+ "$extensions": {
24644
+ "nl.nldesignsystem.css.property": {
24645
+ "syntax": "<length>",
24646
+ "inherits": true
24647
+ },
24648
+ "nl.nldesignsystem.figma.supports-token": false
24649
+ },
24650
+ "type": "spacing"
24651
+ },
24652
+ "padding-inline-start": {
24653
+ "$extensions": {
24654
+ "nl.nldesignsystem.css.property": {
24655
+ "syntax": "<length>",
24656
+ "inherits": true
24657
+ },
24658
+ "nl.nldesignsystem.figma.supports-token": false
24659
+ },
24660
+ "type": "spacing"
24661
+ },
24662
+ "padding-inine-end": {
24663
+ "$extensions": {
24664
+ "nl.nldesignsystem.css.property": {
24665
+ "syntax": "<length>",
24666
+ "inherits": true
24667
+ },
24668
+ "nl.nldesignsystem.figma.supports-token": false
24669
+ },
24670
+ "type": "spacing"
24671
+ }
24672
+ }
24673
+ },
24509
24674
  "page-content": {
24510
24675
  "padding-block-start": {
24511
24676
  "$extensions": {
@@ -24843,6 +25008,68 @@ module.exports = {
24843
25008
  "page-footer",
24844
25009
  "padding-block-start"
24845
25010
  ]
25011
+ },
25012
+ "content": {
25013
+ "color": {
25014
+ "$extensions": {
25015
+ "nl.nldesignsystem.css.property": {
25016
+ "syntax": "<color>",
25017
+ "inherits": true
25018
+ },
25019
+ "nl.nldesignsystem.figma.supports-token": false
25020
+ },
25021
+ "type": "color"
25022
+ },
25023
+ "background-color": {
25024
+ "$extensions": {
25025
+ "nl.nldesignsystem.css.property": {
25026
+ "syntax": "<color>",
25027
+ "inherits": true
25028
+ },
25029
+ "nl.nldesignsystem.figma.supports-token": false
25030
+ },
25031
+ "type": "color"
25032
+ },
25033
+ "padding-inline-end": {
25034
+ "$extensions": {
25035
+ "nl.nldesignsystem.css.property": {
25036
+ "syntax": "<length>",
25037
+ "inherits": true
25038
+ },
25039
+ "nl.nldesignsystem.figma.supports-token": false
25040
+ },
25041
+ "type": "spacing"
25042
+ },
25043
+ "padding-inline-start": {
25044
+ "$extensions": {
25045
+ "nl.nldesignsystem.css.property": {
25046
+ "syntax": "<length>",
25047
+ "inherits": true
25048
+ },
25049
+ "nl.nldesignsystem.figma.supports-token": false
25050
+ },
25051
+ "type": "spacing"
25052
+ },
25053
+ "padding-block-end": {
25054
+ "$extensions": {
25055
+ "nl.nldesignsystem.css.property": {
25056
+ "syntax": "<length>",
25057
+ "inherits": true
25058
+ },
25059
+ "nl.nldesignsystem.figma.supports-token": false
25060
+ },
25061
+ "type": "spacing"
25062
+ },
25063
+ "padding-block-start": {
25064
+ "$extensions": {
25065
+ "nl.nldesignsystem.css.property": {
25066
+ "syntax": "<length>",
25067
+ "inherits": true
25068
+ },
25069
+ "nl.nldesignsystem.figma.supports-token": false
25070
+ },
25071
+ "type": "spacing"
25072
+ }
24846
25073
  }
24847
25074
  },
24848
25075
  "page-header": {
@@ -24856,6 +25083,16 @@ module.exports = {
24856
25083
  },
24857
25084
  "type": "color"
24858
25085
  },
25086
+ "border-block-end-color": {
25087
+ "$extensions": {
25088
+ "nl.nldesignsystem.css.property": {
25089
+ "syntax": "<color>",
25090
+ "inherits": true
25091
+ },
25092
+ "nl.nldesignsystem.figma.supports-token": false
25093
+ },
25094
+ "type": "color"
25095
+ },
24859
25096
  "color": {
24860
25097
  "$extensions": {
24861
25098
  "nl.nldesignsystem.css.property": {
@@ -25013,8 +25250,71 @@ module.exports = {
25013
25250
  "page-header",
25014
25251
  "padding-inline-end"
25015
25252
  ]
25253
+ },
25254
+ "content": {
25255
+ "background-color": {
25256
+ "$extensions": {
25257
+ "nl.nldesignsystem.css.property": {
25258
+ "syntax": "<color>",
25259
+ "inherits": true
25260
+ },
25261
+ "nl.nldesignsystem.figma.supports-token": false
25262
+ },
25263
+ "type": "color"
25264
+ },
25265
+ "color": {
25266
+ "$extensions": {
25267
+ "nl.nldesignsystem.css.property": {
25268
+ "syntax": "<color>",
25269
+ "inherits": true
25270
+ },
25271
+ "nl.nldesignsystem.figma.supports-token": false
25272
+ },
25273
+ "type": "color"
25274
+ },
25275
+ "padding-block-start": {
25276
+ "$extensions": {
25277
+ "nl.nldesignsystem.css.property": {
25278
+ "syntax": "<length>",
25279
+ "inherits": true
25280
+ },
25281
+ "nl.nldesignsystem.figma.supports-token": false
25282
+ },
25283
+ "type": "spacing"
25284
+ },
25285
+ "padding-block-end": {
25286
+ "$extensions": {
25287
+ "nl.nldesignsystem.css.property": {
25288
+ "syntax": "<length>",
25289
+ "inherits": true
25290
+ },
25291
+ "nl.nldesignsystem.figma.supports-token": false
25292
+ },
25293
+ "type": "spacing"
25294
+ },
25295
+ "padding-inline-start": {
25296
+ "$extensions": {
25297
+ "nl.nldesignsystem.css.property": {
25298
+ "syntax": "<length>",
25299
+ "inherits": true
25300
+ },
25301
+ "nl.nldesignsystem.figma.supports-token": false
25302
+ },
25303
+ "type": "spacing"
25304
+ },
25305
+ "padding-inline-end": {
25306
+ "$extensions": {
25307
+ "nl.nldesignsystem.css.property": {
25308
+ "syntax": "<length>",
25309
+ "inherits": true
25310
+ },
25311
+ "nl.nldesignsystem.figma.supports-token": false
25312
+ },
25313
+ "type": "spacing"
25314
+ }
25016
25315
  }
25017
25316
  },
25317
+ "page-layout": {},
25018
25318
  "page": {
25019
25319
  "background-color": {
25020
25320
  "value": "hsl(0 0% 15%)",
@@ -28573,6 +28873,38 @@ module.exports = {
28573
28873
  }
28574
28874
  }
28575
28875
  },
28876
+ "root": {
28877
+ "background-color": {
28878
+ "$extensions": {
28879
+ "nl.nldesignsystem.css.property": {
28880
+ "syntax": "<color>",
28881
+ "inherits": true
28882
+ },
28883
+ "nl.nldesignsystem.figma.supports-token": false
28884
+ },
28885
+ "type": "color"
28886
+ },
28887
+ "color": {
28888
+ "$extensions": {
28889
+ "nl.nldesignsystem.css.property": {
28890
+ "syntax": "<color>",
28891
+ "inherits": true
28892
+ },
28893
+ "nl.nldesignsystem.figma.supports-token": false
28894
+ },
28895
+ "type": "color"
28896
+ },
28897
+ "font-family": {
28898
+ "$extensions": {
28899
+ "nl.nldesignsystem.css.property": {
28900
+ "syntax": "*",
28901
+ "inherits": true
28902
+ },
28903
+ "nl.nldesignsystem.figma.supports-token": false
28904
+ },
28905
+ "type": "fontFamilies"
28906
+ }
28907
+ },
28576
28908
  "search-bar": {
28577
28909
  "button": {
28578
28910
  "background-color": {
package/dist/dark/tokens.d.ts CHANGED
@@ -265,6 +265,7 @@ declare const tokens: {
265
265
  "color": DesignToken
266
266
  }
267
267
  },
268
+ "alternate-lang-nav": {},
268
269
  "article": {
269
270
  "max-inline-size": DesignToken
270
271
  },
@@ -520,6 +521,30 @@ declare const tokens: {
520
521
  "margin-block-start": DesignToken,
521
522
  "margin-block-end": DesignToken
522
523
  },
524
+ "body": {
525
+ "font-family": {
526
+ "$extensions": {
527
+ "nl.nldesignsystem.css.property": {}
528
+ }
529
+ },
530
+ "font-size": {
531
+ "$extensions": {
532
+ "nl.nldesignsystem.css.property": {}
533
+ }
534
+ },
535
+ "font-weight": {
536
+ "$extensions": {
537
+ "nl.nldesignsystem.css.property": {}
538
+ }
539
+ },
540
+ "line-height": {
541
+ "$extensions": {
542
+ "nl.nldesignsystem.css.property": {
543
+ "syntax": {}
544
+ }
545
+ }
546
+ }
547
+ },
523
548
  "breadcrumb-nav": {
524
549
  "min-block-size": DesignToken,
525
550
  "font-family": {
@@ -1500,6 +1525,15 @@ declare const tokens: {
1500
1525
  }
1501
1526
  }
1502
1527
  },
1528
+ "combobox": {
1529
+ "popover": {
1530
+ "z-index": {
1531
+ "$extensions": {
1532
+ "nl.nldesignsystem.css.property": {}
1533
+ }
1534
+ }
1535
+ }
1536
+ },
1503
1537
  "action": {
1504
1538
  "activate": {
1505
1539
  "cursor": DesignToken
@@ -2433,6 +2467,7 @@ declare const tokens: {
2433
2467
  },
2434
2468
  "font-weight": DesignToken
2435
2469
  },
2470
+ "html-content": {},
2436
2471
  "iban-data": {},
2437
2472
  "icon": {
2438
2473
  "color": {
@@ -2875,6 +2910,16 @@ declare const tokens: {
2875
2910
  "background-color": DesignToken,
2876
2911
  "color": DesignToken,
2877
2912
  "content": {
2913
+ "background-color": {
2914
+ "$extensions": {
2915
+ "nl.nldesignsystem.css.property": {}
2916
+ }
2917
+ },
2918
+ "color": {
2919
+ "$extensions": {
2920
+ "nl.nldesignsystem.css.property": {}
2921
+ }
2922
+ },
2878
2923
  "max-inline-size": DesignToken
2879
2924
  },
2880
2925
  "link": {
@@ -3009,6 +3054,50 @@ declare const tokens: {
3009
3054
  "padding-inline-start": DesignToken
3010
3055
  }
3011
3056
  },
3057
+ "page-body": {
3058
+ "background-color": {
3059
+ "$extensions": {
3060
+ "nl.nldesignsystem.css.property": {}
3061
+ }
3062
+ },
3063
+ "color": {
3064
+ "$extensions": {
3065
+ "nl.nldesignsystem.css.property": {}
3066
+ }
3067
+ },
3068
+ "content": {
3069
+ "background-color": {
3070
+ "$extensions": {
3071
+ "nl.nldesignsystem.css.property": {}
3072
+ }
3073
+ },
3074
+ "color": {
3075
+ "$extensions": {
3076
+ "nl.nldesignsystem.css.property": {}
3077
+ }
3078
+ },
3079
+ "padding-block-start": {
3080
+ "$extensions": {
3081
+ "nl.nldesignsystem.css.property": {}
3082
+ }
3083
+ },
3084
+ "padding-block-end": {
3085
+ "$extensions": {
3086
+ "nl.nldesignsystem.css.property": {}
3087
+ }
3088
+ },
3089
+ "padding-inline-start": {
3090
+ "$extensions": {
3091
+ "nl.nldesignsystem.css.property": {}
3092
+ }
3093
+ },
3094
+ "padding-inine-end": {
3095
+ "$extensions": {
3096
+ "nl.nldesignsystem.css.property": {}
3097
+ }
3098
+ }
3099
+ }
3100
+ },
3012
3101
  "page-content": {
3013
3102
  "padding-block-start": DesignToken,
3014
3103
  "padding-block-end": DesignToken,
@@ -3030,7 +3119,39 @@ declare const tokens: {
3030
3119
  "padding-inline-end": DesignToken,
3031
3120
  "padding-inline-start": DesignToken,
3032
3121
  "padding-block-end": DesignToken,
3033
- "padding-block-start": DesignToken
3122
+ "padding-block-start": DesignToken,
3123
+ "content": {
3124
+ "color": {
3125
+ "$extensions": {
3126
+ "nl.nldesignsystem.css.property": {}
3127
+ }
3128
+ },
3129
+ "background-color": {
3130
+ "$extensions": {
3131
+ "nl.nldesignsystem.css.property": {}
3132
+ }
3133
+ },
3134
+ "padding-inline-end": {
3135
+ "$extensions": {
3136
+ "nl.nldesignsystem.css.property": {}
3137
+ }
3138
+ },
3139
+ "padding-inline-start": {
3140
+ "$extensions": {
3141
+ "nl.nldesignsystem.css.property": {}
3142
+ }
3143
+ },
3144
+ "padding-block-end": {
3145
+ "$extensions": {
3146
+ "nl.nldesignsystem.css.property": {}
3147
+ }
3148
+ },
3149
+ "padding-block-start": {
3150
+ "$extensions": {
3151
+ "nl.nldesignsystem.css.property": {}
3152
+ }
3153
+ }
3154
+ }
3034
3155
  },
3035
3156
  "page-header": {
3036
3157
  "background-color": {
@@ -3038,6 +3159,11 @@ declare const tokens: {
3038
3159
  "nl.nldesignsystem.css.property": {}
3039
3160
  }
3040
3161
  },
3162
+ "border-block-end-color": {
3163
+ "$extensions": {
3164
+ "nl.nldesignsystem.css.property": {}
3165
+ }
3166
+ },
3041
3167
  "color": {
3042
3168
  "$extensions": {
3043
3169
  "nl.nldesignsystem.css.property": {}
@@ -3046,8 +3172,41 @@ declare const tokens: {
3046
3172
  "padding-block-start": DesignToken,
3047
3173
  "padding-block-end": DesignToken,
3048
3174
  "padding-inline-start": DesignToken,
3049
- "padding-inline-end": DesignToken
3175
+ "padding-inline-end": DesignToken,
3176
+ "content": {
3177
+ "background-color": {
3178
+ "$extensions": {
3179
+ "nl.nldesignsystem.css.property": {}
3180
+ }
3181
+ },
3182
+ "color": {
3183
+ "$extensions": {
3184
+ "nl.nldesignsystem.css.property": {}
3185
+ }
3186
+ },
3187
+ "padding-block-start": {
3188
+ "$extensions": {
3189
+ "nl.nldesignsystem.css.property": {}
3190
+ }
3191
+ },
3192
+ "padding-block-end": {
3193
+ "$extensions": {
3194
+ "nl.nldesignsystem.css.property": {}
3195
+ }
3196
+ },
3197
+ "padding-inline-start": {
3198
+ "$extensions": {
3199
+ "nl.nldesignsystem.css.property": {}
3200
+ }
3201
+ },
3202
+ "padding-inline-end": {
3203
+ "$extensions": {
3204
+ "nl.nldesignsystem.css.property": {}
3205
+ }
3206
+ }
3207
+ }
3050
3208
  },
3209
+ "page-layout": {},
3051
3210
  "page": {
3052
3211
  "background-color": DesignToken,
3053
3212
  "color": DesignToken,
@@ -3404,6 +3563,23 @@ declare const tokens: {
3404
3563
  "margin-block-end": DesignToken
3405
3564
  }
3406
3565
  },
3566
+ "root": {
3567
+ "background-color": {
3568
+ "$extensions": {
3569
+ "nl.nldesignsystem.css.property": {}
3570
+ }
3571
+ },
3572
+ "color": {
3573
+ "$extensions": {
3574
+ "nl.nldesignsystem.css.property": {}
3575
+ }
3576
+ },
3577
+ "font-family": {
3578
+ "$extensions": {
3579
+ "nl.nldesignsystem.css.property": {}
3580
+ }
3581
+ }
3582
+ },
3407
3583
  "search-bar": {
3408
3584
  "button": {
3409
3585
  "background-color": DesignToken,