@rijkshuisstijl-community/design-tokens 1.1.0 → 2.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 (95) hide show
  1. package/CHANGELOG.md +34 -0
  2. package/README.md +153 -12
  3. package/dist/_variables.scss +772 -743
  4. package/dist/index.css +772 -743
  5. package/dist/index.d.ts +545 -516
  6. package/dist/index.js +609 -580
  7. package/dist/index.json +608 -579
  8. package/dist/index.tokens.json +1664 -1613
  9. package/dist/root.css +772 -743
  10. package/dist/tokens.d.ts +1569 -1518
  11. package/dist/tokens.js +22875 -22078
  12. package/dist/uitvoerend-groen/_variables.scss +1337 -0
  13. package/dist/uitvoerend-groen/index.css +1340 -0
  14. package/dist/{uitvoerend-mintgroen-focus → uitvoerend-groen}/index.d.ts +442 -418
  15. package/dist/uitvoerend-groen/index.js +1338 -0
  16. package/dist/uitvoerend-groen/index.json +1335 -0
  17. package/dist/uitvoerend-groen/index.tokens.json +2049 -0
  18. package/dist/uitvoerend-groen/root.css +1340 -0
  19. package/dist/{uitvoerend-mintgroen-focus → uitvoerend-groen}/tokens.d.ts +646 -628
  20. package/dist/{uitvoerend-mintgroen-focus → uitvoerend-groen}/tokens.js +14276 -13624
  21. package/dist/uitvoerend-hemelblauw/_variables.scss +1337 -0
  22. package/dist/uitvoerend-hemelblauw/index.css +1340 -0
  23. package/dist/uitvoerend-hemelblauw/index.d.ts +1338 -0
  24. package/dist/uitvoerend-hemelblauw/index.js +1338 -0
  25. package/dist/uitvoerend-hemelblauw/index.json +1335 -0
  26. package/dist/uitvoerend-hemelblauw/index.tokens.json +2049 -0
  27. package/dist/uitvoerend-hemelblauw/root.css +1340 -0
  28. package/dist/uitvoerend-hemelblauw/tokens.d.ts +2072 -0
  29. package/dist/uitvoerend-hemelblauw/tokens.js +31258 -0
  30. package/dist/{uitvoerend-mintgroen-focus → uitvoerend-mintgroen}/_variables.scss +533 -509
  31. package/dist/{uitvoerend-mintgroen-focus → uitvoerend-mintgroen}/index.css +534 -510
  32. package/dist/uitvoerend-mintgroen/index.d.ts +1338 -0
  33. package/dist/{uitvoerend-mintgroen-focus → uitvoerend-mintgroen}/index.js +507 -483
  34. package/dist/{uitvoerend-mintgroen-focus → uitvoerend-mintgroen}/index.json +506 -482
  35. package/dist/{uitvoerend-mintgroen-focus → uitvoerend-mintgroen}/index.tokens.json +734 -716
  36. package/dist/{uitvoerend-mintgroen-focus → uitvoerend-mintgroen}/root.css +533 -509
  37. package/dist/uitvoerend-mintgroen/tokens.d.ts +2072 -0
  38. package/dist/uitvoerend-mintgroen/tokens.js +31258 -0
  39. package/dist/uitvoerend-oranje/_variables.scss +1337 -0
  40. package/dist/uitvoerend-oranje/index.css +1340 -0
  41. package/dist/uitvoerend-oranje/index.d.ts +1338 -0
  42. package/dist/uitvoerend-oranje/index.js +1338 -0
  43. package/dist/uitvoerend-oranje/index.json +1335 -0
  44. package/dist/uitvoerend-oranje/index.tokens.json +2049 -0
  45. package/dist/uitvoerend-oranje/root.css +1340 -0
  46. package/dist/uitvoerend-oranje/tokens.d.ts +2072 -0
  47. package/dist/uitvoerend-oranje/tokens.js +31258 -0
  48. package/dist/uitvoerend-paars/_variables.scss +1337 -0
  49. package/dist/uitvoerend-paars/index.css +1340 -0
  50. package/dist/uitvoerend-paars/index.d.ts +1338 -0
  51. package/dist/uitvoerend-paars/index.js +1338 -0
  52. package/dist/uitvoerend-paars/index.json +1335 -0
  53. package/dist/uitvoerend-paars/index.tokens.json +2049 -0
  54. package/dist/uitvoerend-paars/root.css +1340 -0
  55. package/dist/uitvoerend-paars/tokens.d.ts +2072 -0
  56. package/dist/uitvoerend-paars/tokens.js +31258 -0
  57. package/dist/uitvoerend-violet/_variables.scss +231 -202
  58. package/dist/uitvoerend-violet/index.css +231 -202
  59. package/dist/uitvoerend-violet/index.d.ts +102 -73
  60. package/dist/uitvoerend-violet/index.js +231 -202
  61. package/dist/uitvoerend-violet/index.json +230 -201
  62. package/dist/uitvoerend-violet/index.tokens.json +281 -230
  63. package/dist/uitvoerend-violet/root.css +231 -202
  64. package/dist/uitvoerend-violet/tokens.d.ts +151 -100
  65. package/dist/uitvoerend-violet/tokens.js +16369 -15572
  66. package/dist/uitvoerend-violet-oud/_variables.scss +231 -201
  67. package/dist/uitvoerend-violet-oud/index.css +231 -201
  68. package/dist/uitvoerend-violet-oud/index.d.ts +102 -72
  69. package/dist/uitvoerend-violet-oud/index.js +231 -201
  70. package/dist/uitvoerend-violet-oud/index.json +230 -200
  71. package/dist/uitvoerend-violet-oud/index.tokens.json +281 -229
  72. package/dist/uitvoerend-violet-oud/root.css +231 -201
  73. package/dist/uitvoerend-violet-oud/tokens.d.ts +151 -99
  74. package/dist/uitvoerend-violet-oud/tokens.js +12621 -11803
  75. package/dist/wetgevend/_variables.scss +171 -142
  76. package/dist/wetgevend/index.css +171 -142
  77. package/dist/wetgevend/index.d.ts +102 -73
  78. package/dist/wetgevend/index.js +171 -142
  79. package/dist/wetgevend/index.json +170 -141
  80. package/dist/wetgevend/index.tokens.json +221 -170
  81. package/dist/wetgevend/root.css +171 -142
  82. package/dist/wetgevend/tokens.d.ts +151 -100
  83. package/dist/wetgevend/tokens.js +12217 -11420
  84. package/figma/figma.tokens.json +2428 -556
  85. package/package.json +1 -1
  86. package/src/generated/base.tokens.json +4520 -4338
  87. package/src/generated/themes.json +28993 -3285
  88. package/src/generated/uitvoerend-groen/tokens.json +6252 -0
  89. package/src/generated/uitvoerend-hemelblauw/tokens.json +6252 -0
  90. package/src/generated/{uitvoerend-mintgroen-focus → uitvoerend-mintgroen}/tokens.json +2374 -2240
  91. package/src/generated/uitvoerend-oranje/tokens.json +6252 -0
  92. package/src/generated/uitvoerend-paars/tokens.json +6252 -0
  93. package/src/generated/uitvoerend-violet/tokens.json +640 -458
  94. package/src/generated/uitvoerend-violet-oud/tokens.json +643 -457
  95. package/src/generated/wetgevend/tokens.json +602 -420
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Wed, 19 Mar 2025 14:52:03 GMT
3
+ * Generated on Tue, 27 May 2025 13:07:14 GMT
4
4
  */
5
5
 
6
6
  export default tokens;
@@ -23,12 +23,82 @@ declare interface DesignToken {
23
23
 
24
24
  declare const tokens: {
25
25
  "utrecht": {
26
- "pre-heading": {
26
+ "blockquote": {
27
+ "background-color": DesignToken,
28
+ "border-inline-start-width": DesignToken,
29
+ "border-color": DesignToken,
30
+ "border-radius": DesignToken,
31
+ "border-width": DesignToken,
27
32
  "color": DesignToken,
33
+ "font-size": DesignToken,
28
34
  "font-family": DesignToken,
29
- "font-weight": DesignToken,
30
- "line-height": DesignToken,
31
- "font-size": DesignToken
35
+ "padding-block-end": DesignToken,
36
+ "padding-block-start": DesignToken,
37
+ "padding-inline-end": DesignToken,
38
+ "padding-inline-start": DesignToken,
39
+ "row-gap": DesignToken,
40
+ "attribution": {
41
+ "color": DesignToken,
42
+ "font-size": DesignToken
43
+ },
44
+ "content": {
45
+ "color": DesignToken,
46
+ "font-size": DesignToken,
47
+ "font-family": DesignToken,
48
+ "line-height": DesignToken,
49
+ "font-weight": DesignToken
50
+ },
51
+ "caption": {
52
+ "font-size": DesignToken,
53
+ "font-family": DesignToken,
54
+ "line-height": DesignToken,
55
+ "font-weight": DesignToken,
56
+ "padding-block-start": DesignToken,
57
+ "color": DesignToken
58
+ },
59
+ "margin-block-end": DesignToken,
60
+ "margin-block-start": DesignToken,
61
+ "margin-inline-end": DesignToken,
62
+ "margin-inline-start": DesignToken,
63
+ "border-block-start-width": DesignToken,
64
+ "border-block-end-width": DesignToken,
65
+ "border-inline-end-width": DesignToken,
66
+ "border-start-start-radius": DesignToken,
67
+ "border-start-end-radius": DesignToken,
68
+ "border-end-start-radius": DesignToken,
69
+ "border-end-end-radius": DesignToken,
70
+ "blue-corner-border-variation": {
71
+ "border-color": DesignToken,
72
+ "border-block-end-width": DesignToken,
73
+ "border-inline-end-width": DesignToken,
74
+ "border-end-end-radius": DesignToken
75
+ },
76
+ "pink-background-variation": {
77
+ "background-color": DesignToken,
78
+ "border-end-start-radius": DesignToken,
79
+ "padding": DesignToken
80
+ },
81
+ "pink-left-border-variation": {
82
+ "border-color": DesignToken,
83
+ "border-inline-start-width": DesignToken,
84
+ "padding-inline-start": DesignToken,
85
+ "padding-inline-end": DesignToken,
86
+ "padding-block-start": DesignToken,
87
+ "padding-block-end": DesignToken
88
+ },
89
+ "pink-corner-border-variation": {
90
+ "border-color": DesignToken,
91
+ "border-block-start-width": DesignToken,
92
+ "border-inline-start-width": DesignToken,
93
+ "border-start-start-radius": DesignToken,
94
+ "padding": DesignToken
95
+ }
96
+ },
97
+ "column-layout": {
98
+ "column-rule-color": DesignToken,
99
+ "column-rule-width": DesignToken,
100
+ "column-width": DesignToken,
101
+ "gap": DesignToken
32
102
  },
33
103
  "icon": {
34
104
  "color": DesignToken,
@@ -370,6 +440,13 @@ declare const tokens: {
370
440
  "border-radius": DesignToken,
371
441
  "border-width": DesignToken
372
442
  },
443
+ "pre-heading": {
444
+ "color": DesignToken,
445
+ "font-family": DesignToken,
446
+ "font-weight": DesignToken,
447
+ "line-height": DesignToken,
448
+ "font-size": DesignToken
449
+ },
373
450
  "paragraph": {
374
451
  "color": DesignToken,
375
452
  "font-family": DesignToken,
@@ -773,7 +850,12 @@ declare const tokens: {
773
850
  "color": DesignToken
774
851
  },
775
852
  "font-size": DesignToken,
776
- "line-height": DesignToken
853
+ "line-height": DesignToken,
854
+ "pressed": {
855
+ "background-color": DesignToken,
856
+ "border-color": DesignToken,
857
+ "color": DesignToken
858
+ }
777
859
  },
778
860
  "secondary-action": {
779
861
  "hover": {
@@ -801,7 +883,12 @@ declare const tokens: {
801
883
  "color": DesignToken
802
884
  },
803
885
  "font-size": DesignToken,
804
- "line-height": DesignToken
886
+ "line-height": DesignToken,
887
+ "pressed": {
888
+ "background-color": DesignToken,
889
+ "border-color": DesignToken,
890
+ "color": DesignToken
891
+ }
805
892
  },
806
893
  "subtle": {
807
894
  "font-size": DesignToken,
@@ -829,7 +916,17 @@ declare const tokens: {
829
916
  "border-color": DesignToken,
830
917
  "color": DesignToken
831
918
  },
832
- "line-height": DesignToken
919
+ "line-height": DesignToken,
920
+ "pressed": {
921
+ "background-color": DesignToken,
922
+ "border-color": DesignToken,
923
+ "color": DesignToken
924
+ }
925
+ },
926
+ "pressed": {
927
+ "background-color": DesignToken,
928
+ "border-color": DesignToken,
929
+ "color": DesignToken
833
930
  }
834
931
  },
835
932
  "breadcrumb-nav": {
@@ -873,69 +970,6 @@ declare const tokens: {
873
970
  "font-family": DesignToken,
874
971
  "font-weight": DesignToken
875
972
  },
876
- "blockquote": {
877
- "caption": {
878
- "font-size": DesignToken,
879
- "font-family": DesignToken,
880
- "line-height": DesignToken,
881
- "font-weight": DesignToken,
882
- "padding-block-start": DesignToken,
883
- "color": DesignToken
884
- },
885
- "content": {
886
- "font-family": DesignToken,
887
- "line-height": DesignToken,
888
- "font-weight": DesignToken,
889
- "font-size": DesignToken,
890
- "color": DesignToken
891
- },
892
- "margin-block-end": DesignToken,
893
- "margin-block-start": DesignToken,
894
- "margin-inline-end": DesignToken,
895
- "margin-inline-start": DesignToken,
896
- "padding-block-end": DesignToken,
897
- "padding-block-start": DesignToken,
898
- "padding-inline-end": DesignToken,
899
- "padding-inline-start": DesignToken,
900
- "row-gap": DesignToken,
901
- "background-color": DesignToken,
902
- "border-color": DesignToken,
903
- "border-block-start-width": DesignToken,
904
- "border-block-end-width": DesignToken,
905
- "border-inline-start-width": DesignToken,
906
- "border-inline-end-width": DesignToken,
907
- "border-start-start-radius": DesignToken,
908
- "border-start-end-radius": DesignToken,
909
- "border-end-start-radius": DesignToken,
910
- "border-end-end-radius": DesignToken,
911
- "border-width": DesignToken,
912
- "blue-corner-border-variation": {
913
- "border-color": DesignToken,
914
- "border-block-end-width": DesignToken,
915
- "border-inline-end-width": DesignToken,
916
- "border-end-end-radius": DesignToken
917
- },
918
- "pink-background-variation": {
919
- "background-color": DesignToken,
920
- "border-end-start-radius": DesignToken,
921
- "padding": DesignToken
922
- },
923
- "pink-left-border-variation": {
924
- "border-color": DesignToken,
925
- "border-inline-start-width": DesignToken,
926
- "padding-inline-start": DesignToken,
927
- "padding-inline-end": DesignToken,
928
- "padding-block-start": DesignToken,
929
- "padding-block-end": DesignToken
930
- },
931
- "pink-corner-border-variation": {
932
- "border-color": DesignToken,
933
- "border-block-start-width": DesignToken,
934
- "border-inline-start-width": DesignToken,
935
- "border-start-start-radius": DesignToken,
936
- "padding": DesignToken
937
- }
938
- },
939
973
  "article": {
940
974
  "max-inline-size": DesignToken
941
975
  },
@@ -1074,6 +1108,45 @@ declare const tokens: {
1074
1108
  }
1075
1109
  },
1076
1110
  "rhc": {
1111
+ "keep": {
1112
+ "_comment": DesignToken,
1113
+ "top-left": {
1114
+ "borderRadiusTopLeft": DesignToken,
1115
+ "borderRadiusTopRight": DesignToken,
1116
+ "borderRadiusBottomRight": DesignToken,
1117
+ "borderRadiusBottomLeft": DesignToken
1118
+ },
1119
+ "top-right": {
1120
+ "borderRadiusTopRight": DesignToken,
1121
+ "borderRadiusTopLeft": DesignToken,
1122
+ "borderRadiusBottomRight": DesignToken,
1123
+ "borderRadiusBottomLeft": DesignToken
1124
+ },
1125
+ "bottom-right": {
1126
+ "borderRadiusTopLeft": DesignToken,
1127
+ "borderRadiusTopRight": DesignToken,
1128
+ "borderRadiusBottomRight": DesignToken,
1129
+ "borderRadiusBottomLeft": DesignToken
1130
+ },
1131
+ "bottom-left": {
1132
+ "borderRadiusTopLeft": DesignToken,
1133
+ "borderRadiusTopRight": DesignToken,
1134
+ "borderRadiusBottomRight": DesignToken,
1135
+ "borderRadiusBottomLeft": DesignToken
1136
+ }
1137
+ },
1138
+ "rounded-corner": {
1139
+ "xs": {
1140
+ "border-radius": DesignToken
1141
+ },
1142
+ "md": {
1143
+ "border-radius": DesignToken
1144
+ },
1145
+ "xl": {
1146
+ "border-radius": DesignToken
1147
+ },
1148
+ "border-width": DesignToken
1149
+ },
1077
1150
  "color": {
1078
1151
  "primary": {
1079
1152
  "50": DesignToken,
@@ -1090,8 +1163,10 @@ declare const tokens: {
1090
1163
  "foreground": {
1091
1164
  "default": DesignToken,
1092
1165
  "subdued": DesignToken,
1093
- "onEmphasis": DesignToken,
1094
- "link": DesignToken
1166
+ "link": DesignToken,
1167
+ "on-dark-color": DesignToken,
1168
+ "on-light-color": DesignToken,
1169
+ "onEmphasis": DesignToken
1095
1170
  },
1096
1171
  "border": {
1097
1172
  "default": DesignToken,
@@ -1120,6 +1195,9 @@ declare const tokens: {
1120
1195
  "accent": {
1121
1196
  "500": DesignToken
1122
1197
  },
1198
+ "accent-2": {
1199
+ "500": DesignToken
1200
+ },
1123
1201
  "cool-grey": {
1124
1202
  "50": DesignToken,
1125
1203
  "100": DesignToken,
@@ -1753,32 +1831,6 @@ declare const tokens: {
1753
1831
  "border-radius": DesignToken,
1754
1832
  "color": DesignToken
1755
1833
  },
1756
- "keep": {
1757
- "top-left": {
1758
- "borderRadiusTopLeft": DesignToken,
1759
- "borderRadiusTopRight": DesignToken,
1760
- "borderRadiusBottomRight": DesignToken,
1761
- "borderRadiusBottomLeft": DesignToken
1762
- },
1763
- "top-right": {
1764
- "borderRadiusTopRight": DesignToken,
1765
- "borderRadiusTopLeft": DesignToken,
1766
- "borderRadiusBottomRight": DesignToken,
1767
- "borderRadiusBottomLeft": DesignToken
1768
- },
1769
- "bottom-right": {
1770
- "borderRadiusTopLeft": DesignToken,
1771
- "borderRadiusTopRight": DesignToken,
1772
- "borderRadiusBottomRight": DesignToken,
1773
- "borderRadiusBottomLeft": DesignToken
1774
- },
1775
- "bottom-left": {
1776
- "borderRadiusTopLeft": DesignToken,
1777
- "borderRadiusTopRight": DesignToken,
1778
- "borderRadiusBottomRight": DesignToken,
1779
- "borderRadiusBottomLeft": DesignToken
1780
- }
1781
- },
1782
1834
  "focus": {
1783
1835
  "outline-offset": DesignToken,
1784
1836
  "outline-style": DesignToken,