@utrecht/design-tokens 3.0.0 → 3.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 (54) hide show
  1. package/CHANGELOG.md +14 -0
  2. package/dist/_mixin-theme.scss +12 -0
  3. package/dist/_mixin.scss +12 -0
  4. package/dist/_variables.scss +12 -0
  5. package/dist/dark/_mixin-theme.scss +12 -0
  6. package/dist/dark/_mixin.scss +12 -0
  7. package/dist/dark/_variables.scss +12 -0
  8. package/dist/dark/index.cjs +12 -0
  9. package/dist/dark/index.css +12 -0
  10. package/dist/dark/index.d.ts +12 -0
  11. package/dist/dark/index.flat.json +12 -0
  12. package/dist/dark/index.json +396 -0
  13. package/dist/dark/index.mjs +12 -0
  14. package/dist/dark/index.tokens.json +77 -0
  15. package/dist/dark/list.json +396 -0
  16. package/dist/dark/list.mjs +396 -0
  17. package/dist/dark/property.css +12 -0
  18. package/dist/dark/root.css +12 -0
  19. package/dist/dark/theme-prince-xml.css +12 -0
  20. package/dist/dark/theme.css +12 -0
  21. package/dist/dark/tokens.cjs +461 -0
  22. package/dist/dark/tokens.d.ts +52 -0
  23. package/dist/dark/tokens.json +461 -0
  24. package/dist/dark/variables.cjs +12 -0
  25. package/dist/dark/variables.css +12 -0
  26. package/dist/dark/variables.d.ts +12 -0
  27. package/dist/dark/variables.json +12 -0
  28. package/dist/dark/variables.less +12 -0
  29. package/dist/dark/variables.mjs +12 -0
  30. package/dist/index.cjs +12 -0
  31. package/dist/index.css +24 -0
  32. package/dist/index.d.ts +12 -0
  33. package/dist/index.flat.json +12 -0
  34. package/dist/index.json +396 -0
  35. package/dist/index.mjs +12 -0
  36. package/dist/index.tokens.json +77 -0
  37. package/dist/list.json +396 -0
  38. package/dist/list.mjs +396 -0
  39. package/dist/property.css +12 -0
  40. package/dist/root.css +12 -0
  41. package/dist/theme-prince-xml.css +12 -0
  42. package/dist/theme.css +12 -0
  43. package/dist/tokens.cjs +461 -0
  44. package/dist/tokens.d.ts +52 -0
  45. package/dist/tokens.json +461 -0
  46. package/dist/variables.cjs +12 -0
  47. package/dist/variables.css +12 -0
  48. package/dist/variables.d.ts +12 -0
  49. package/dist/variables.json +12 -0
  50. package/dist/variables.less +12 -0
  51. package/dist/variables.mjs +12 -0
  52. package/package.json +1 -1
  53. package/src/component/utrecht/breadcrumb-nav.tokens.json +5 -0
  54. package/src/component/utrecht/card.tokens.json +54 -0
@@ -3814,6 +3814,47 @@ module.exports = {
3814
3814
  "type": "textCase"
3815
3815
  },
3816
3816
  "item": {
3817
+ "first": {
3818
+ "padding-inline-start": {
3819
+ "$extensions": {
3820
+ "nl.nldesignsystem.css.property": {
3821
+ "syntax": "<length>",
3822
+ "inherits": true
3823
+ },
3824
+ "nl.nldesignsystem.figma.supports-token": false,
3825
+ "studio.tokens": {
3826
+ "originalType": "spacing"
3827
+ }
3828
+ },
3829
+ "type": "dimension",
3830
+ "value": "0",
3831
+ "filePath": "src/component/utrecht/breadcrumb-nav.tokens.json",
3832
+ "isSource": true,
3833
+ "original": {
3834
+ "$extensions": {
3835
+ "nl.nldesignsystem.css.property": {
3836
+ "syntax": "<length>",
3837
+ "inherits": true
3838
+ },
3839
+ "nl.nldesignsystem.figma.supports-token": false,
3840
+ "studio.tokens": {
3841
+ "originalType": "spacing"
3842
+ }
3843
+ },
3844
+ "type": "dimension",
3845
+ "value": "0"
3846
+ },
3847
+ "name": "padding-inline-start",
3848
+ "attributes": {},
3849
+ "path": [
3850
+ "utrecht",
3851
+ "breadcrumb-nav",
3852
+ "item",
3853
+ "first",
3854
+ "padding-inline-start"
3855
+ ]
3856
+ }
3857
+ },
3817
3858
  "padding-block-start": {
3818
3859
  "$extensions": {
3819
3860
  "nl.nldesignsystem.css.property": {
@@ -9793,6 +9834,425 @@ module.exports = {
9793
9834
  }
9794
9835
  }
9795
9836
  },
9837
+ "card": {
9838
+ "background-color": {
9839
+ "$extensions": {
9840
+ "nl.nldesignsystem.css.property": {
9841
+ "syntax": "<color>",
9842
+ "inherits": true
9843
+ },
9844
+ "nl.nldesignsystem.figma.supports-token": false
9845
+ },
9846
+ "type": "color",
9847
+ "value": "hsl(211 60% 90%)",
9848
+ "filePath": "src/component/utrecht/card.tokens.json",
9849
+ "isSource": true,
9850
+ "original": {
9851
+ "$extensions": {
9852
+ "nl.nldesignsystem.css.property": {
9853
+ "syntax": "<color>",
9854
+ "inherits": true
9855
+ },
9856
+ "nl.nldesignsystem.figma.supports-token": false
9857
+ },
9858
+ "type": "color",
9859
+ "value": "{utrecht.color.blue.90}"
9860
+ },
9861
+ "name": "background-color",
9862
+ "attributes": {},
9863
+ "path": [
9864
+ "utrecht",
9865
+ "card",
9866
+ "background-color"
9867
+ ]
9868
+ },
9869
+ "color": {
9870
+ "$extensions": {
9871
+ "nl.nldesignsystem.css.property": {
9872
+ "syntax": "<color>",
9873
+ "inherits": true
9874
+ },
9875
+ "nl.nldesignsystem.figma.supports-token": false
9876
+ },
9877
+ "type": "color",
9878
+ "value": "hsl(0 0% 0%)",
9879
+ "filePath": "src/component/utrecht/card.tokens.json",
9880
+ "isSource": true,
9881
+ "original": {
9882
+ "$extensions": {
9883
+ "nl.nldesignsystem.css.property": {
9884
+ "syntax": "<color>",
9885
+ "inherits": true
9886
+ },
9887
+ "nl.nldesignsystem.figma.supports-token": false
9888
+ },
9889
+ "type": "color",
9890
+ "value": "{utrecht.color.black}"
9891
+ },
9892
+ "name": "color",
9893
+ "attributes": {},
9894
+ "path": [
9895
+ "utrecht",
9896
+ "card",
9897
+ "color"
9898
+ ]
9899
+ },
9900
+ "max-inline-size": {
9901
+ "$extensions": {
9902
+ "nl.nldesignsystem.css.property": {
9903
+ "syntax": "<length>",
9904
+ "inherits": true
9905
+ },
9906
+ "nl.nldesignsystem.figma.supports-token": false
9907
+ },
9908
+ "type": "dimension"
9909
+ },
9910
+ "border-radius": {
9911
+ "$extensions": {
9912
+ "nl.nldesignsystem.css.property": {
9913
+ "syntax": "<length>",
9914
+ "inherits": true
9915
+ },
9916
+ "nl.nldesignsystem.figma.supports-token": false
9917
+ },
9918
+ "type": "dimension"
9919
+ },
9920
+ "box-shadow": {
9921
+ "$extensions": {
9922
+ "nl.nldesignsystem.css.property": {
9923
+ "syntax": "<shadow>",
9924
+ "inherits": true
9925
+ },
9926
+ "nl.nldesignsystem.figma.supports-token": false
9927
+ },
9928
+ "type": "shadow"
9929
+ },
9930
+ "inline-size": {
9931
+ "$extensions": {
9932
+ "nl.nldesignsystem.css.property": {
9933
+ "syntax": "<length>",
9934
+ "inherits": true
9935
+ },
9936
+ "nl.nldesignsystem.figma.supports-token": false
9937
+ },
9938
+ "type": "dimension"
9939
+ },
9940
+ "row-gap": {
9941
+ "$extensions": {
9942
+ "nl.nldesignsystem.css.property": {
9943
+ "syntax": "<length>",
9944
+ "inherits": true
9945
+ },
9946
+ "nl.nldesignsystem.figma.supports-token": false
9947
+ },
9948
+ "type": "dimension"
9949
+ },
9950
+ "heading": {
9951
+ "color": {
9952
+ "$extensions": {
9953
+ "nl.nldesignsystem.css.property": {
9954
+ "syntax": "<color>",
9955
+ "inherits": true
9956
+ },
9957
+ "nl.nldesignsystem.figma.supports-token": false
9958
+ },
9959
+ "type": "color",
9960
+ "value": "hsl(211 60% 35%)",
9961
+ "filePath": "src/component/utrecht/card.tokens.json",
9962
+ "isSource": true,
9963
+ "original": {
9964
+ "$extensions": {
9965
+ "nl.nldesignsystem.css.property": {
9966
+ "syntax": "<color>",
9967
+ "inherits": true
9968
+ },
9969
+ "nl.nldesignsystem.figma.supports-token": false
9970
+ },
9971
+ "type": "color",
9972
+ "value": "{utrecht.color.blue.35}"
9973
+ },
9974
+ "name": "color",
9975
+ "attributes": {},
9976
+ "path": [
9977
+ "utrecht",
9978
+ "card",
9979
+ "heading",
9980
+ "color"
9981
+ ]
9982
+ },
9983
+ "padding-inline-start": {
9984
+ "$extensions": {
9985
+ "nl.nldesignsystem.css.property": {
9986
+ "syntax": "<length>",
9987
+ "inherits": true
9988
+ },
9989
+ "nl.nldesignsystem.figma.supports-token": false
9990
+ },
9991
+ "type": "dimension",
9992
+ "value": "16px",
9993
+ "filePath": "src/component/utrecht/card.tokens.json",
9994
+ "isSource": true,
9995
+ "original": {
9996
+ "$extensions": {
9997
+ "nl.nldesignsystem.css.property": {
9998
+ "syntax": "<length>",
9999
+ "inherits": true
10000
+ },
10001
+ "nl.nldesignsystem.figma.supports-token": false
10002
+ },
10003
+ "type": "dimension",
10004
+ "value": "{utrecht.space.inline.md}"
10005
+ },
10006
+ "name": "padding-inline-start",
10007
+ "attributes": {},
10008
+ "path": [
10009
+ "utrecht",
10010
+ "card",
10011
+ "heading",
10012
+ "padding-inline-start"
10013
+ ]
10014
+ },
10015
+ "padding-inline-end": {
10016
+ "$extensions": {
10017
+ "nl.nldesignsystem.css.property": {
10018
+ "syntax": "<length>",
10019
+ "inherits": true
10020
+ },
10021
+ "nl.nldesignsystem.figma.supports-token": false
10022
+ },
10023
+ "type": "dimension",
10024
+ "value": "16px",
10025
+ "filePath": "src/component/utrecht/card.tokens.json",
10026
+ "isSource": true,
10027
+ "original": {
10028
+ "$extensions": {
10029
+ "nl.nldesignsystem.css.property": {
10030
+ "syntax": "<length>",
10031
+ "inherits": true
10032
+ },
10033
+ "nl.nldesignsystem.figma.supports-token": false
10034
+ },
10035
+ "type": "dimension",
10036
+ "value": "{utrecht.space.inline.md}"
10037
+ },
10038
+ "name": "padding-inline-end",
10039
+ "attributes": {},
10040
+ "path": [
10041
+ "utrecht",
10042
+ "card",
10043
+ "heading",
10044
+ "padding-inline-end"
10045
+ ]
10046
+ }
10047
+ },
10048
+ "link": {
10049
+ "hover": {
10050
+ "text-decoration-thickness": {
10051
+ "$extensions": {
10052
+ "nl.nldesignsystem.css.property": {
10053
+ "syntax": "<length>",
10054
+ "inherits": true
10055
+ },
10056
+ "nl.nldesignsystem.figma.supports-token": false,
10057
+ "studio.tokens": {
10058
+ "originalType": "borderWidth"
10059
+ }
10060
+ },
10061
+ "type": "dimension",
10062
+ "value": "3px",
10063
+ "filePath": "src/component/utrecht/card.tokens.json",
10064
+ "isSource": true,
10065
+ "original": {
10066
+ "$extensions": {
10067
+ "nl.nldesignsystem.css.property": {
10068
+ "syntax": "<length>",
10069
+ "inherits": true
10070
+ },
10071
+ "nl.nldesignsystem.figma.supports-token": false,
10072
+ "studio.tokens": {
10073
+ "originalType": "borderWidth"
10074
+ }
10075
+ },
10076
+ "type": "dimension",
10077
+ "value": "3px"
10078
+ },
10079
+ "name": "text-decoration-thickness",
10080
+ "attributes": {},
10081
+ "path": [
10082
+ "utrecht",
10083
+ "card",
10084
+ "link",
10085
+ "hover",
10086
+ "text-decoration-thickness"
10087
+ ]
10088
+ }
10089
+ }
10090
+ },
10091
+ "content": {
10092
+ "row-gap": {
10093
+ "$extensions": {
10094
+ "nl.nldesignsystem.css.property": {
10095
+ "syntax": "<length>",
10096
+ "inherits": true
10097
+ },
10098
+ "nl.nldesignsystem.figma.supports-token": false
10099
+ },
10100
+ "type": "dimension",
10101
+ "value": "16px",
10102
+ "filePath": "src/component/utrecht/card.tokens.json",
10103
+ "isSource": true,
10104
+ "original": {
10105
+ "$extensions": {
10106
+ "nl.nldesignsystem.css.property": {
10107
+ "syntax": "<length>",
10108
+ "inherits": true
10109
+ },
10110
+ "nl.nldesignsystem.figma.supports-token": false
10111
+ },
10112
+ "type": "dimension",
10113
+ "value": "{utrecht.space.row.md}"
10114
+ },
10115
+ "name": "row-gap",
10116
+ "attributes": {},
10117
+ "path": [
10118
+ "utrecht",
10119
+ "card",
10120
+ "content",
10121
+ "row-gap"
10122
+ ]
10123
+ },
10124
+ "padding-block-start": {
10125
+ "$extensions": {
10126
+ "nl.nldesignsystem.css.property": {
10127
+ "syntax": "<length>",
10128
+ "inherits": true
10129
+ },
10130
+ "nl.nldesignsystem.figma.supports-token": false
10131
+ },
10132
+ "type": "dimension",
10133
+ "value": "16px",
10134
+ "filePath": "src/component/utrecht/card.tokens.json",
10135
+ "isSource": true,
10136
+ "original": {
10137
+ "$extensions": {
10138
+ "nl.nldesignsystem.css.property": {
10139
+ "syntax": "<length>",
10140
+ "inherits": true
10141
+ },
10142
+ "nl.nldesignsystem.figma.supports-token": false
10143
+ },
10144
+ "type": "dimension",
10145
+ "value": "{utrecht.space.block.md}"
10146
+ },
10147
+ "name": "padding-block-start",
10148
+ "attributes": {},
10149
+ "path": [
10150
+ "utrecht",
10151
+ "card",
10152
+ "content",
10153
+ "padding-block-start"
10154
+ ]
10155
+ },
10156
+ "padding-block-end": {
10157
+ "$extensions": {
10158
+ "nl.nldesignsystem.css.property": {
10159
+ "syntax": "<length>",
10160
+ "inherits": true
10161
+ },
10162
+ "nl.nldesignsystem.figma.supports-token": false
10163
+ },
10164
+ "type": "dimension",
10165
+ "value": "16px",
10166
+ "filePath": "src/component/utrecht/card.tokens.json",
10167
+ "isSource": true,
10168
+ "original": {
10169
+ "$extensions": {
10170
+ "nl.nldesignsystem.css.property": {
10171
+ "syntax": "<length>",
10172
+ "inherits": true
10173
+ },
10174
+ "nl.nldesignsystem.figma.supports-token": false
10175
+ },
10176
+ "type": "dimension",
10177
+ "value": "{utrecht.space.block.md}"
10178
+ },
10179
+ "name": "padding-block-end",
10180
+ "attributes": {},
10181
+ "path": [
10182
+ "utrecht",
10183
+ "card",
10184
+ "content",
10185
+ "padding-block-end"
10186
+ ]
10187
+ }
10188
+ },
10189
+ "body": {
10190
+ "padding-inline-start": {
10191
+ "$extensions": {
10192
+ "nl.nldesignsystem.css.property": {
10193
+ "syntax": "<length>",
10194
+ "inherits": true
10195
+ },
10196
+ "nl.nldesignsystem.figma.supports-token": false
10197
+ },
10198
+ "type": "dimension",
10199
+ "value": "16px",
10200
+ "filePath": "src/component/utrecht/card.tokens.json",
10201
+ "isSource": true,
10202
+ "original": {
10203
+ "$extensions": {
10204
+ "nl.nldesignsystem.css.property": {
10205
+ "syntax": "<length>",
10206
+ "inherits": true
10207
+ },
10208
+ "nl.nldesignsystem.figma.supports-token": false
10209
+ },
10210
+ "type": "dimension",
10211
+ "value": "{utrecht.space.inline.md}"
10212
+ },
10213
+ "name": "padding-inline-start",
10214
+ "attributes": {},
10215
+ "path": [
10216
+ "utrecht",
10217
+ "card",
10218
+ "body",
10219
+ "padding-inline-start"
10220
+ ]
10221
+ },
10222
+ "padding-inline-end": {
10223
+ "$extensions": {
10224
+ "nl.nldesignsystem.css.property": {
10225
+ "syntax": "<length>",
10226
+ "inherits": true
10227
+ },
10228
+ "nl.nldesignsystem.figma.supports-token": false
10229
+ },
10230
+ "type": "dimension",
10231
+ "value": "16px",
10232
+ "filePath": "src/component/utrecht/card.tokens.json",
10233
+ "isSource": true,
10234
+ "original": {
10235
+ "$extensions": {
10236
+ "nl.nldesignsystem.css.property": {
10237
+ "syntax": "<length>",
10238
+ "inherits": true
10239
+ },
10240
+ "nl.nldesignsystem.figma.supports-token": false
10241
+ },
10242
+ "type": "dimension",
10243
+ "value": "{utrecht.space.inline.md}"
10244
+ },
10245
+ "name": "padding-inline-end",
10246
+ "attributes": {},
10247
+ "path": [
10248
+ "utrecht",
10249
+ "card",
10250
+ "body",
10251
+ "padding-inline-end"
10252
+ ]
10253
+ }
10254
+ }
10255
+ },
9796
10256
  "checkbox": {
9797
10257
  "background-color": {
9798
10258
  "$extensions": {
@@ -35570,6 +36030,7 @@ module.exports = {
35570
36030
  }
35571
36031
  }
35572
36032
  },
36033
+ "youtube-video": {},
35573
36034
  "color": {
35574
36035
  "red": {
35575
36036
  "20": {
@@ -559,6 +559,9 @@ declare const tokens: {
559
559
  }
560
560
  },
561
561
  "item": {
562
+ "first": {
563
+ "padding-inline-start": DesignToken
564
+ },
562
565
  "padding-block-start": DesignToken,
563
566
  "padding-block-end": DesignToken,
564
567
  "padding-inline-end": DesignToken,
@@ -1230,6 +1233,54 @@ declare const tokens: {
1230
1233
  "size": DesignToken
1231
1234
  }
1232
1235
  },
1236
+ "card": {
1237
+ "background-color": DesignToken,
1238
+ "color": DesignToken,
1239
+ "max-inline-size": {
1240
+ "$extensions": {
1241
+ "nl.nldesignsystem.css.property": {}
1242
+ }
1243
+ },
1244
+ "border-radius": {
1245
+ "$extensions": {
1246
+ "nl.nldesignsystem.css.property": {}
1247
+ }
1248
+ },
1249
+ "box-shadow": {
1250
+ "$extensions": {
1251
+ "nl.nldesignsystem.css.property": {}
1252
+ }
1253
+ },
1254
+ "inline-size": {
1255
+ "$extensions": {
1256
+ "nl.nldesignsystem.css.property": {}
1257
+ }
1258
+ },
1259
+ "row-gap": {
1260
+ "$extensions": {
1261
+ "nl.nldesignsystem.css.property": {}
1262
+ }
1263
+ },
1264
+ "heading": {
1265
+ "color": DesignToken,
1266
+ "padding-inline-start": DesignToken,
1267
+ "padding-inline-end": DesignToken
1268
+ },
1269
+ "link": {
1270
+ "hover": {
1271
+ "text-decoration-thickness": DesignToken
1272
+ }
1273
+ },
1274
+ "content": {
1275
+ "row-gap": DesignToken,
1276
+ "padding-block-start": DesignToken,
1277
+ "padding-block-end": DesignToken
1278
+ },
1279
+ "body": {
1280
+ "padding-inline-start": DesignToken,
1281
+ "padding-inline-end": DesignToken
1282
+ }
1283
+ },
1233
1284
  "checkbox": {
1234
1285
  "background-color": DesignToken,
1235
1286
  "border-color": DesignToken,
@@ -4737,6 +4788,7 @@ declare const tokens: {
4737
4788
  }
4738
4789
  }
4739
4790
  },
4791
+ "youtube-video": {},
4740
4792
  "color": {
4741
4793
  "red": {
4742
4794
  "20": DesignToken,