@rijkshuisstijl-community/design-tokens 4.0.1 → 5.0.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 (105) hide show
  1. package/CHANGELOG.md +51 -5
  2. package/README.md +2 -2
  3. package/dist/_variables.scss +77 -126
  4. package/dist/index.css +77 -126
  5. package/dist/index.d.ts +76 -125
  6. package/dist/index.js +77 -126
  7. package/dist/index.json +76 -125
  8. package/dist/index.tokens.json +148 -175
  9. package/dist/koop/_variables.scss +50 -145
  10. package/dist/koop/index.css +50 -145
  11. package/dist/koop/index.d.ts +48 -143
  12. package/dist/koop/index.js +50 -145
  13. package/dist/koop/index.json +50 -145
  14. package/dist/koop/index.tokens.json +99 -202
  15. package/dist/koop/root.css +50 -145
  16. package/dist/koop/tokens.d.ts +94 -197
  17. package/dist/koop/tokens.js +1543 -3636
  18. package/dist/root.css +77 -126
  19. package/dist/tokens.d.ts +146 -173
  20. package/dist/tokens.js +6238 -7259
  21. package/dist/uitvoerend-groen/_variables.scss +56 -153
  22. package/dist/uitvoerend-groen/index.css +56 -153
  23. package/dist/uitvoerend-groen/index.d.ts +55 -152
  24. package/dist/uitvoerend-groen/index.js +56 -153
  25. package/dist/uitvoerend-groen/index.json +56 -153
  26. package/dist/uitvoerend-groen/index.tokens.json +103 -212
  27. package/dist/uitvoerend-groen/root.css +56 -153
  28. package/dist/uitvoerend-groen/tokens.d.ts +99 -208
  29. package/dist/uitvoerend-groen/tokens.js +1507 -3650
  30. package/dist/uitvoerend-hemelblauw/_variables.scss +56 -153
  31. package/dist/uitvoerend-hemelblauw/index.css +56 -153
  32. package/dist/uitvoerend-hemelblauw/index.d.ts +55 -152
  33. package/dist/uitvoerend-hemelblauw/index.js +56 -153
  34. package/dist/uitvoerend-hemelblauw/index.json +56 -153
  35. package/dist/uitvoerend-hemelblauw/index.tokens.json +103 -212
  36. package/dist/uitvoerend-hemelblauw/root.css +56 -153
  37. package/dist/uitvoerend-hemelblauw/tokens.d.ts +99 -208
  38. package/dist/uitvoerend-hemelblauw/tokens.js +1507 -3650
  39. package/dist/uitvoerend-mintgroen/_variables.scss +56 -153
  40. package/dist/uitvoerend-mintgroen/index.css +56 -153
  41. package/dist/uitvoerend-mintgroen/index.d.ts +55 -152
  42. package/dist/uitvoerend-mintgroen/index.js +56 -153
  43. package/dist/uitvoerend-mintgroen/index.json +56 -153
  44. package/dist/uitvoerend-mintgroen/index.tokens.json +103 -212
  45. package/dist/uitvoerend-mintgroen/root.css +56 -153
  46. package/dist/uitvoerend-mintgroen/tokens.d.ts +99 -208
  47. package/dist/uitvoerend-mintgroen/tokens.js +1507 -3650
  48. package/dist/uitvoerend-oranje/_variables.scss +56 -153
  49. package/dist/uitvoerend-oranje/index.css +56 -153
  50. package/dist/uitvoerend-oranje/index.d.ts +55 -152
  51. package/dist/uitvoerend-oranje/index.js +56 -153
  52. package/dist/uitvoerend-oranje/index.json +56 -153
  53. package/dist/uitvoerend-oranje/index.tokens.json +103 -212
  54. package/dist/uitvoerend-oranje/root.css +56 -153
  55. package/dist/uitvoerend-oranje/tokens.d.ts +99 -208
  56. package/dist/uitvoerend-oranje/tokens.js +1507 -3650
  57. package/dist/uitvoerend-paars/_variables.scss +56 -153
  58. package/dist/uitvoerend-paars/index.css +56 -153
  59. package/dist/uitvoerend-paars/index.d.ts +55 -152
  60. package/dist/uitvoerend-paars/index.js +56 -153
  61. package/dist/uitvoerend-paars/index.json +56 -153
  62. package/dist/uitvoerend-paars/index.tokens.json +103 -212
  63. package/dist/uitvoerend-paars/root.css +56 -153
  64. package/dist/uitvoerend-paars/tokens.d.ts +99 -208
  65. package/dist/uitvoerend-paars/tokens.js +1507 -3650
  66. package/dist/uitvoerend-violet/_variables.scss +56 -153
  67. package/dist/uitvoerend-violet/index.css +56 -153
  68. package/dist/uitvoerend-violet/index.d.ts +55 -152
  69. package/dist/uitvoerend-violet/index.js +56 -153
  70. package/dist/uitvoerend-violet/index.json +56 -153
  71. package/dist/uitvoerend-violet/index.tokens.json +103 -212
  72. package/dist/uitvoerend-violet/root.css +56 -153
  73. package/dist/uitvoerend-violet/tokens.d.ts +99 -208
  74. package/dist/uitvoerend-violet/tokens.js +1507 -3650
  75. package/dist/uitvoerend-violet-oud/_variables.scss +56 -153
  76. package/dist/uitvoerend-violet-oud/index.css +56 -153
  77. package/dist/uitvoerend-violet-oud/index.d.ts +55 -152
  78. package/dist/uitvoerend-violet-oud/index.js +56 -153
  79. package/dist/uitvoerend-violet-oud/index.json +56 -153
  80. package/dist/uitvoerend-violet-oud/index.tokens.json +103 -212
  81. package/dist/uitvoerend-violet-oud/root.css +56 -153
  82. package/dist/uitvoerend-violet-oud/tokens.d.ts +99 -208
  83. package/dist/uitvoerend-violet-oud/tokens.js +1507 -3650
  84. package/dist/wetgevend/_variables.scss +56 -153
  85. package/dist/wetgevend/index.css +56 -153
  86. package/dist/wetgevend/index.d.ts +55 -152
  87. package/dist/wetgevend/index.js +56 -153
  88. package/dist/wetgevend/index.json +56 -153
  89. package/dist/wetgevend/index.tokens.json +103 -212
  90. package/dist/wetgevend/root.css +56 -153
  91. package/dist/wetgevend/tokens.d.ts +99 -208
  92. package/dist/wetgevend/tokens.js +1507 -3650
  93. package/figma/figma.tokens.json +319 -638
  94. package/package.json +2 -2
  95. package/src/generated/base.tokens.json +473 -661
  96. package/src/generated/koop/tokens.json +235 -637
  97. package/src/generated/themes.json +2161 -5875
  98. package/src/generated/uitvoerend-groen/tokens.json +246 -660
  99. package/src/generated/uitvoerend-hemelblauw/tokens.json +246 -660
  100. package/src/generated/uitvoerend-mintgroen/tokens.json +246 -660
  101. package/src/generated/uitvoerend-oranje/tokens.json +246 -660
  102. package/src/generated/uitvoerend-paars/tokens.json +246 -660
  103. package/src/generated/uitvoerend-violet/tokens.json +246 -660
  104. package/src/generated/uitvoerend-violet-oud/tokens.json +246 -660
  105. package/src/generated/wetgevend/tokens.json +246 -660
package/dist/koop/tokens.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Mon, 28 Jul 2025 08:31:50 GMT
3
+ * Generated on Fri, 22 Aug 2025 10:20:31 GMT
4
4
  */
5
5
 
6
6
  export default tokens;
@@ -658,62 +658,6 @@ declare const tokens: {
658
658
  "padding-inline-start": DesignToken,
659
659
  "text-decoration": DesignToken
660
660
  },
661
- "link-list": {
662
- "item": {
663
- "text-decoration": DesignToken,
664
- "column-gap": DesignToken
665
- },
666
- "margin-block-end": DesignToken,
667
- "margin-block-start": DesignToken,
668
- "row-gap": DesignToken,
669
- "icon": {
670
- "inset-block-start": DesignToken,
671
- "size": DesignToken
672
- },
673
- "link": {
674
- "column-gap": DesignToken,
675
- "text-decoration": DesignToken
676
- },
677
- "font-weight": DesignToken
678
- },
679
- "link": {
680
- "font-family": DesignToken,
681
- "font-weight": DesignToken,
682
- "line-height": DesignToken,
683
- "font-size": DesignToken,
684
- "active": {
685
- "text-decoration": DesignToken,
686
- "color": DesignToken
687
- },
688
- "focus": {
689
- "text-decoration": DesignToken,
690
- "text-decoration-thickness": DesignToken,
691
- "background-color": DesignToken,
692
- "color": DesignToken
693
- },
694
- "icon": {
695
- "inset-block-start": DesignToken,
696
- "size": DesignToken
697
- },
698
- "color": DesignToken,
699
- "text-decoration-color": DesignToken,
700
- "column-gap": DesignToken,
701
- "text-decoration": DesignToken,
702
- "text-decoration-thickness": DesignToken,
703
- "text-underline-offset": DesignToken,
704
- "hover": {
705
- "color": DesignToken,
706
- "text-decoration": DesignToken,
707
- "text-decoration-thickness": DesignToken
708
- },
709
- "focus-visible": {
710
- "text-decoration": DesignToken,
711
- "text-decoration-thickness": DesignToken
712
- },
713
- "visited": {
714
- "color": DesignToken
715
- }
716
- },
717
661
  "data-badge": {
718
662
  "background-color": DesignToken,
719
663
  "border-radius": DesignToken,
@@ -876,27 +820,31 @@ declare const tokens: {
876
820
  "row-gap": DesignToken
877
821
  },
878
822
  "breadcrumb-nav": {
879
- "divider": {
880
- "color": DesignToken,
881
- "inset-block-start": DesignToken,
882
- "size": DesignToken
883
- },
884
- "link": {
823
+ "font-family": DesignToken,
824
+ "font-size": DesignToken,
825
+ "line-height": DesignToken,
826
+ "min-block-size": DesignToken,
827
+ "item": {
885
828
  "padding-block-end": DesignToken,
886
829
  "padding-block-start": DesignToken,
887
830
  "padding-inline-end": DesignToken,
888
831
  "padding-inline-start": DesignToken,
889
- "current": {
890
- "color": DesignToken,
891
- "font-weight": DesignToken
892
- },
832
+ "first": {
833
+ "padding-inline-start": DesignToken
834
+ }
835
+ },
836
+ "separator": {
837
+ "color": DesignToken,
893
838
  "icon": {
894
- "inset-block-start": DesignToken,
895
- "margin-inline": DesignToken,
896
839
  "size": DesignToken
897
- },
840
+ }
841
+ },
842
+ "link": {
898
843
  "color": DesignToken,
899
844
  "text-decoration": DesignToken,
845
+ "current": {
846
+ "font-weight": DesignToken
847
+ },
900
848
  "active": {
901
849
  "color": DesignToken,
902
850
  "text-decoration": DesignToken
@@ -912,28 +860,26 @@ declare const tokens: {
912
860
  "hover": {
913
861
  "text-decoration": DesignToken,
914
862
  "color": DesignToken
915
- }
916
- },
917
- "font-family": DesignToken,
918
- "font-size": DesignToken,
919
- "line-height": DesignToken,
920
- "min-block-size": DesignToken,
921
- "item": {
922
- "padding-block-end": DesignToken,
923
- "padding-block-start": DesignToken,
924
- "padding-inline-end": DesignToken,
925
- "padding-inline-start": DesignToken,
926
- "first": {
927
- "padding-inline-start": DesignToken
928
- }
929
- },
930
- "separator": {
931
- "color": DesignToken,
863
+ },
932
864
  "icon": {
933
865
  "size": DesignToken
934
866
  }
935
867
  }
936
868
  },
869
+ "link-list": {
870
+ "margin-block-end": DesignToken,
871
+ "margin-block-start": DesignToken,
872
+ "row-gap": DesignToken,
873
+ "icon": {
874
+ "inset-block-start": DesignToken,
875
+ "size": DesignToken
876
+ },
877
+ "link": {
878
+ "column-gap": DesignToken,
879
+ "text-decoration": DesignToken
880
+ },
881
+ "font-weight": DesignToken
882
+ },
937
883
  "action": {
938
884
  "activate": {
939
885
  "cursor": DesignToken
@@ -955,13 +901,6 @@ declare const tokens: {
955
901
  }
956
902
  },
957
903
  "unordered-list": {
958
- "color": DesignToken,
959
- "marker": {
960
- "border-color": DesignToken,
961
- "color": DesignToken
962
- },
963
- "font-family": DesignToken,
964
- "font-weight": DesignToken,
965
904
  "font-size": DesignToken,
966
905
  "line-height": DesignToken,
967
906
  "margin-block-end": DesignToken,
@@ -971,13 +910,12 @@ declare const tokens: {
971
910
  "margin-block-end": DesignToken,
972
911
  "margin-block-start": DesignToken,
973
912
  "padding-inline-start": DesignToken
913
+ },
914
+ "marker": {
915
+ "color": DesignToken
974
916
  }
975
917
  },
976
918
  "ordered-list": {
977
- "color": DesignToken,
978
- "font-family": DesignToken,
979
- "font-weight": DesignToken,
980
- "margin-inline-start": DesignToken,
981
919
  "font-size": DesignToken,
982
920
  "line-height": DesignToken,
983
921
  "margin-block-end": DesignToken,
@@ -1086,86 +1024,41 @@ declare const tokens: {
1086
1024
  "line-height": DesignToken,
1087
1025
  "font-size": DesignToken
1088
1026
  },
1089
- "paragraph": {
1027
+ "link": {
1090
1028
  "color": DesignToken,
1091
- "font-family": DesignToken,
1092
- "font-size": DesignToken,
1093
- "font-weight": DesignToken,
1094
- "line-height": DesignToken,
1095
- "lead": {
1096
- "color": DesignToken,
1097
- "font-size": DesignToken,
1098
- "font-weight": DesignToken,
1099
- "line-height": DesignToken
1029
+ "text-decoration-color": DesignToken,
1030
+ "column-gap": DesignToken,
1031
+ "text-decoration": DesignToken,
1032
+ "text-decoration-thickness": DesignToken,
1033
+ "text-underline-offset": DesignToken,
1034
+ "icon": {
1035
+ "size": DesignToken
1100
1036
  },
1101
- "small": {
1102
- "font-size": DesignToken,
1037
+ "active": {
1038
+ "color": DesignToken
1039
+ },
1040
+ "hover": {
1103
1041
  "color": DesignToken,
1104
- "font-weight": DesignToken,
1105
- "line-height": DesignToken
1042
+ "text-decoration": DesignToken,
1043
+ "text-decoration-thickness": DesignToken
1106
1044
  },
1107
- "margin-block-end": DesignToken,
1108
- "margin-block-start": DesignToken
1045
+ "focus": {
1046
+ "background-color": DesignToken,
1047
+ "color": DesignToken
1048
+ },
1049
+ "focus-visible": {
1050
+ "text-decoration": DesignToken,
1051
+ "text-decoration-thickness": DesignToken
1052
+ },
1053
+ "visited": {
1054
+ "color": DesignToken
1055
+ }
1109
1056
  },
1110
1057
  "icon": {
1111
1058
  "color": DesignToken,
1112
1059
  "size": DesignToken,
1113
1060
  "inset-block-start": DesignToken
1114
1061
  },
1115
- "heading-1": {
1116
- "color": DesignToken,
1117
- "font-family": DesignToken,
1118
- "font-size": DesignToken,
1119
- "font-weight": DesignToken,
1120
- "line-height": DesignToken,
1121
- "margin-block-end": DesignToken,
1122
- "margin-block-start": DesignToken
1123
- },
1124
- "heading-2": {
1125
- "color": DesignToken,
1126
- "font-family": DesignToken,
1127
- "font-size": DesignToken,
1128
- "font-weight": DesignToken,
1129
- "line-height": DesignToken,
1130
- "margin-block-end": DesignToken,
1131
- "margin-block-start": DesignToken
1132
- },
1133
- "heading-3": {
1134
- "color": DesignToken,
1135
- "font-family": DesignToken,
1136
- "font-size": DesignToken,
1137
- "font-weight": DesignToken,
1138
- "line-height": DesignToken,
1139
- "margin-block-end": DesignToken,
1140
- "margin-block-start": DesignToken
1141
- },
1142
- "heading-4": {
1143
- "color": DesignToken,
1144
- "font-family": DesignToken,
1145
- "font-size": DesignToken,
1146
- "font-weight": DesignToken,
1147
- "line-height": DesignToken,
1148
- "margin-block-end": DesignToken,
1149
- "margin-block-start": DesignToken
1150
- },
1151
- "heading-5": {
1152
- "color": DesignToken,
1153
- "font-family": DesignToken,
1154
- "font-size": DesignToken,
1155
- "font-weight": DesignToken,
1156
- "line-height": DesignToken,
1157
- "margin-block-end": DesignToken,
1158
- "margin-block-start": DesignToken
1159
- },
1160
- "heading-6": {
1161
- "color": DesignToken,
1162
- "font-family": DesignToken,
1163
- "font-size": DesignToken,
1164
- "font-weight": DesignToken,
1165
- "line-height": DesignToken,
1166
- "margin-block-end": DesignToken,
1167
- "margin-block-start": DesignToken
1168
- },
1169
1062
  "form-fieldset": {
1170
1063
  "legend": {
1171
1064
  "color": DesignToken,
@@ -1398,28 +1291,12 @@ declare const tokens: {
1398
1291
  "font-size": DesignToken
1399
1292
  },
1400
1293
  "link": {
1401
- "column-gap": DesignToken,
1402
- "font-family": DesignToken,
1403
- "font-size": DesignToken,
1404
- "font-weight": DesignToken,
1405
- "line-height": DesignToken,
1406
- "icon": {
1407
- "inset-block-start": DesignToken,
1408
- "size": DesignToken
1409
- },
1410
1294
  "active": {
1411
- "text-decoration": DesignToken,
1412
1295
  "color": DesignToken
1413
1296
  },
1414
1297
  "focus": {
1415
- "background-color": DesignToken,
1416
- "color": DesignToken,
1417
- "text-decoration": DesignToken,
1418
1298
  "text-decoration-thickness": DesignToken
1419
1299
  },
1420
- "visited": {
1421
- "color": DesignToken
1422
- },
1423
1300
  "hover": {
1424
1301
  "text-decoration-line": DesignToken,
1425
1302
  "text-decoration-thickness": DesignToken,
@@ -1427,6 +1304,9 @@ declare const tokens: {
1427
1304
  },
1428
1305
  "text-decoration-line": DesignToken,
1429
1306
  "text-decoration-thickness": DesignToken,
1307
+ "visited": {
1308
+ "color": DesignToken
1309
+ },
1430
1310
  "color": DesignToken,
1431
1311
  "text-decoration-color": DesignToken,
1432
1312
  "text-underline-offset": DesignToken,
@@ -1439,21 +1319,20 @@ declare const tokens: {
1439
1319
  }
1440
1320
  },
1441
1321
  "paragraph": {
1442
- "lead": {
1443
- "color": DesignToken,
1444
- "font-size": DesignToken,
1445
- "font-weight": DesignToken,
1446
- "line-height": DesignToken,
1447
- "margin-block-end": DesignToken,
1448
- "margin-block-start": DesignToken
1449
- },
1450
1322
  "color": DesignToken,
1451
1323
  "font-family": DesignToken,
1452
1324
  "font-size": DesignToken,
1453
1325
  "font-weight": DesignToken,
1454
1326
  "line-height": DesignToken,
1455
1327
  "margin-block-end": DesignToken,
1456
- "margin-block-start": DesignToken
1328
+ "margin-block-start": DesignToken,
1329
+ "lead": {
1330
+ "font-size": DesignToken,
1331
+ "font-weight": DesignToken,
1332
+ "line-height": DesignToken,
1333
+ "margin-block-end": DesignToken,
1334
+ "margin-block-start": DesignToken
1335
+ }
1457
1336
  },
1458
1337
  "heading": {
1459
1338
  "level-1": {
@@ -1569,9 +1448,6 @@ declare const tokens: {
1569
1448
  "line-height": DesignToken
1570
1449
  }
1571
1450
  },
1572
- "link-list": {
1573
- "text-decoration": DesignToken
1574
- },
1575
1451
  "data-badge-button": {
1576
1452
  "column-gap": DesignToken,
1577
1453
  "hover": {
@@ -1579,6 +1455,13 @@ declare const tokens: {
1579
1455
  "color": DesignToken
1580
1456
  }
1581
1457
  },
1458
+ "breadcrumb-nav": {
1459
+ "link": {
1460
+ "current": {
1461
+ "color": DesignToken
1462
+ }
1463
+ }
1464
+ },
1582
1465
  "rounded-corner": {
1583
1466
  "xs": {
1584
1467
  "border-radius": DesignToken
@@ -1591,6 +1474,11 @@ declare const tokens: {
1591
1474
  },
1592
1475
  "border-width": DesignToken
1593
1476
  },
1477
+ "unordered-list": {
1478
+ "nested": {
1479
+ "margin-inline-start": DesignToken
1480
+ }
1481
+ },
1594
1482
  "font-family": {
1595
1483
  "primary": DesignToken,
1596
1484
  "secondary": DesignToken
@@ -1859,6 +1747,9 @@ declare const tokens: {
1859
1747
  "padding-inline-start": DesignToken,
1860
1748
  "padding-inline-end": DesignToken
1861
1749
  },
1750
+ "link": {
1751
+ "column-gap": DesignToken
1752
+ },
1862
1753
  "icon-only-button": {
1863
1754
  "padding-block-end": DesignToken,
1864
1755
  "padding-block-start": DesignToken,
@@ -2006,7 +1897,6 @@ declare const tokens: {
2006
1897
  "border-width": DesignToken,
2007
1898
  "color": DesignToken,
2008
1899
  "column-gap": DesignToken,
2009
- "inline-size": DesignToken,
2010
1900
  "icon": {
2011
1901
  "color": DesignToken,
2012
1902
  "size": DesignToken
@@ -2373,5 +2263,12 @@ declare const tokens: {
2373
2263
  "600": DesignToken,
2374
2264
  "700": DesignToken
2375
2265
  }
2266
+ },
2267
+ "figma": {
2268
+ "link": {
2269
+ "icon": {
2270
+ "size": DesignToken
2271
+ }
2272
+ }
2376
2273
  }
2377
2274
  }