@amsterdam/design-system-tokens 3.4.0 → 4.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 +50 -3
  2. package/README.md +131 -22
  3. package/build.js +11 -1
  4. package/dist/compact.css +7 -2
  5. package/dist/compact.d.ts +17 -6
  6. package/dist/compact.json +28 -17
  7. package/dist/compact.mjs +19 -13
  8. package/dist/compact.scss +7 -2
  9. package/dist/compact.theme.css +7 -2
  10. package/dist/index.css +108 -110
  11. package/dist/index.d.ts +112 -110
  12. package/dist/index.json +218 -216
  13. package/dist/index.mjs +218 -208
  14. package/dist/index.scss +108 -110
  15. package/dist/index.theme.css +108 -110
  16. package/package.json +1 -1
  17. package/src/brand/ams/aspect-ratio.tokens.json +24 -6
  18. package/src/brand/ams/border.tokens.json +5 -0
  19. package/src/brand/ams/color.compact.tokens.json +15 -0
  20. package/src/brand/ams/color.tokens.json +37 -54
  21. package/src/brand/ams/cursor.tokens.json +9 -2
  22. package/src/brand/ams/focus.tokens.json +1 -0
  23. package/src/brand/ams/space.compact.tokens.json +16 -4
  24. package/src/brand/ams/space.tokens.json +31 -6
  25. package/src/brand/ams/typography.compact.tokens.json +36 -45
  26. package/src/brand/ams/typography.tokens.json +59 -63
  27. package/src/common/ams/inputs.tokens.json +41 -19
  28. package/src/common/ams/links.tokens.json +35 -10
  29. package/src/components/ams/accordion.tokens.json +17 -48
  30. package/src/components/ams/action-group.tokens.json +2 -2
  31. package/src/components/ams/alert.tokens.json +38 -20
  32. package/src/components/ams/avatar.tokens.json +79 -29
  33. package/src/components/ams/badge.tokens.json +60 -23
  34. package/src/components/ams/blockquote.tokens.json +14 -5
  35. package/src/components/ams/body.compact.tokens.json +12 -0
  36. package/src/components/ams/body.tokens.json +12 -0
  37. package/src/components/ams/breadcrumb.tokens.json +36 -15
  38. package/src/components/ams/button.tokens.json +74 -33
  39. package/src/components/ams/call-to-action-link.tokens.json +29 -16
  40. package/src/components/ams/card.tokens.json +30 -17
  41. package/src/components/ams/character-count.tokens.json +14 -5
  42. package/src/components/ams/checkbox.tokens.json +101 -74
  43. package/src/components/ams/column.tokens.json +10 -10
  44. package/src/components/ams/date-input.tokens.json +55 -50
  45. package/src/components/ams/description-list.tokens.json +85 -24
  46. package/src/components/ams/dialog.tokens.json +104 -28
  47. package/src/components/ams/error-message.tokens.json +13 -6
  48. package/src/components/ams/field-set.tokens.json +35 -20
  49. package/src/components/ams/field.tokens.json +13 -10
  50. package/src/components/ams/figure.tokens.json +16 -7
  51. package/src/components/ams/file-input.tokens.json +69 -31
  52. package/src/components/ams/file-list.tokens.json +20 -11
  53. package/src/components/ams/grid.compact.tokens.json +24 -2
  54. package/src/components/ams/grid.tokens.json +77 -24
  55. package/src/components/ams/heading.tokens.json +38 -36
  56. package/src/components/ams/hint.tokens.json +6 -2
  57. package/src/components/ams/icon-button.tokens.json +46 -16
  58. package/src/components/ams/icon.tokens.json +19 -39
  59. package/src/components/ams/image-slider.tokens.json +28 -16
  60. package/src/components/ams/image.tokens.json +4 -1
  61. package/src/components/ams/invalid-form-alert.tokens.json +2 -2
  62. package/src/components/ams/label.tokens.json +18 -6
  63. package/src/components/ams/link-list.tokens.json +50 -22
  64. package/src/components/ams/link.tokens.json +38 -25
  65. package/src/components/ams/logo.tokens.json +6 -2
  66. package/src/components/ams/mark.tokens.json +3 -1
  67. package/src/components/ams/menu.tokens.json +80 -55
  68. package/src/components/ams/ordered-list.tokens.json +39 -25
  69. package/src/components/ams/page-footer.tokens.json +70 -26
  70. package/src/components/ams/page-header.compact.tokens.json +2 -1
  71. package/src/components/ams/page-header.tokens.json +128 -59
  72. package/src/components/ams/page.compact.tokens.json +12 -0
  73. package/src/components/ams/page.tokens.json +5 -3
  74. package/src/components/ams/pagination.tokens.json +37 -17
  75. package/src/components/ams/paragraph.tokens.json +22 -8
  76. package/src/components/ams/password-input.tokens.json +47 -21
  77. package/src/components/ams/progress-list.tokens.json +152 -61
  78. package/src/components/ams/radio.tokens.json +97 -36
  79. package/src/components/ams/row.tokens.json +10 -10
  80. package/src/components/ams/search-field.tokens.json +57 -24
  81. package/src/components/ams/select.tokens.json +63 -25
  82. package/src/components/ams/skip-link.tokens.json +23 -12
  83. package/src/components/ams/spotlight.tokens.json +21 -7
  84. package/src/components/ams/standalone-link.tokens.json +42 -46
  85. package/src/components/ams/switch.tokens.json +23 -9
  86. package/src/components/ams/tab-navigation.tokens.json +205 -0
  87. package/src/components/ams/table-of-contents.tokens.json +38 -41
  88. package/src/components/ams/table.tokens.json +29 -10
  89. package/src/components/ams/tabs.tokens.json +36 -17
  90. package/src/components/ams/text-area.tokens.json +49 -23
  91. package/src/components/ams/text-input.tokens.json +47 -21
  92. package/src/components/ams/time-input.tokens.json +55 -50
  93. package/src/components/ams/unordered-list.tokens.json +37 -25
  94. package/style-dictionary/transforms/dtcg-font-family.js +32 -0
  95. package/src/components/ams/page-heading.tokens.json +0 -46
package/src/components/ams/breadcrumb.tokens.json CHANGED
@@ -3,7 +3,9 @@
3
3
  "breadcrumb": {
4
4
  "font-family": {
5
5
  "$value": "{ams.typography.font-family}",
6
- "$type": "fontFamily"
6
+ "$extensions": {
7
+ "nl.amsterdam.type": "fontFamily"
8
+ }
7
9
  },
8
10
  "font-size": {
9
11
  "$value": "{ams.typography.body-text.font-size}",
@@ -13,17 +15,23 @@
13
15
  },
14
16
  "font-weight": {
15
17
  "$value": "{ams.typography.body-text.font-weight}",
16
- "$type": "fontWeight"
18
+ "$extensions": {
19
+ "nl.amsterdam.type": "fontWeight"
20
+ }
17
21
  },
18
22
  "line-height": {
19
23
  "$value": "{ams.typography.body-text.line-height}",
20
24
  "$extensions": {
21
- "nl.amsterdam.type": "lineHeight"
25
+ "nl.amsterdam.subtype": "lineHeight",
26
+ "nl.amsterdam.type": "number"
22
27
  }
23
28
  },
24
29
  "separator": {
25
30
  "background-image": {
26
- "$value": "url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><path fill='%23000000' fill-rule='evenodd' d='m9.757 32-2.9-2.91L19.937 16 6.857 2.91 9.757 0l16 16z'/></svg>\")"
31
+ "$value": "url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><path fill='%23000000' fill-rule='evenodd' d='m9.757 32-2.9-2.91L19.937 16 6.857 2.91 9.757 0l16 16z'/></svg>\")",
32
+ "$extensions": {
33
+ "nl.amsterdam.type": "backgroundImage"
34
+ }
27
35
  },
28
36
  "block-size": {
29
37
  "$value": "1ex",
@@ -35,45 +43,58 @@
35
43
  },
36
44
  "margin-inline": {
37
45
  "$value": "{ams.space.s}",
38
- "$type": "dimension",
39
46
  "$extensions": {
40
- "nl.amsterdam.subtype": "space"
47
+ "nl.amsterdam.subtype": "space",
48
+ "nl.amsterdam.type": "dimension"
41
49
  }
42
50
  }
43
51
  },
44
52
  "link": {
45
53
  "color": {
46
54
  "$value": "{ams.links.color}",
47
- "$type": "color"
55
+ "$extensions": {
56
+ "nl.amsterdam.type": "color"
57
+ }
48
58
  },
49
59
  "outline-offset": {
50
60
  "$value": "{ams.focus.outline-offset}",
51
- "$type": "dimension",
52
61
  "$extensions": {
53
- "nl.amsterdam.subtype": "space"
62
+ "nl.amsterdam.subtype": "space",
63
+ "nl.amsterdam.type": "dimension"
54
64
  }
55
65
  },
56
66
  "text-decoration-line": {
57
- "$value": "{ams.links.subtle.text-decoration-line}"
67
+ "$value": "{ams.links.subtle.text-decoration-line}",
68
+ "$extensions": {
69
+ "nl.amsterdam.type": "textDecorationLine"
70
+ }
58
71
  },
59
72
  "text-decoration-thickness": {
60
73
  "$value": "{ams.links.text-decoration-thickness}",
61
- "$type": "dimension"
74
+ "$extensions": {
75
+ "nl.amsterdam.subtype": "space",
76
+ "nl.amsterdam.type": "dimension"
77
+ }
62
78
  },
63
79
  "text-underline-offset": {
64
80
  "$value": "{ams.links.text-underline-offset}",
65
- "$type": "dimension",
66
81
  "$extensions": {
67
- "nl.amsterdam.subtype": "space"
82
+ "nl.amsterdam.subtype": "space",
83
+ "nl.amsterdam.type": "dimension"
68
84
  }
69
85
  },
70
86
  "hover": {
71
87
  "color": {
72
88
  "$value": "{ams.links.hover.color}",
73
- "$type": "color"
89
+ "$extensions": {
90
+ "nl.amsterdam.type": "color"
91
+ }
74
92
  },
75
93
  "text-decoration-line": {
76
- "$value": "{ams.links.subtle.hover.text-decoration-line}"
94
+ "$value": "{ams.links.subtle.hover.text-decoration-line}",
95
+ "$extensions": {
96
+ "nl.amsterdam.type": "textDecorationLine"
97
+ }
77
98
  }
78
99
  }
79
100
  }
package/src/components/ams/button.tokens.json CHANGED
@@ -14,11 +14,16 @@
14
14
  }
15
15
  },
16
16
  "cursor": {
17
- "$value": "{ams.cursor.interactive}"
17
+ "$value": "{ams.cursor.interactive}",
18
+ "$extensions": {
19
+ "nl.amsterdam.type": "cursor"
20
+ }
18
21
  },
19
22
  "font-family": {
20
23
  "$value": "{ams.typography.font-family}",
21
- "$type": "fontFamily"
24
+ "$extensions": {
25
+ "nl.amsterdam.type": "fontFamily"
26
+ }
22
27
  },
23
28
  "font-size": {
24
29
  "$value": "{ams.typography.body-text.font-size}",
@@ -28,101 +33,123 @@
28
33
  },
29
34
  "font-weight": {
30
35
  "$value": "{ams.typography.body-text.font-weight}",
31
- "$type": "fontWeight"
36
+ "$extensions": {
37
+ "nl.amsterdam.type": "fontWeight"
38
+ }
32
39
  },
33
40
  "line-height": {
34
41
  "$value": "{ams.inputs.line-height}",
35
42
  "$extensions": {
36
- "nl.amsterdam.type": "lineHeight"
43
+ "nl.amsterdam.subtype": "lineHeight",
44
+ "nl.amsterdam.type": "number"
37
45
  }
38
46
  },
39
47
  "gap": {
40
48
  "$value": "{ams.space.s}",
41
- "$type": "dimension",
42
49
  "$extensions": {
43
- "nl.amsterdam.subtype": "space"
50
+ "nl.amsterdam.subtype": "space",
51
+ "nl.amsterdam.type": "dimension"
44
52
  }
45
53
  },
46
54
  "outline-offset": {
47
55
  "$value": "{ams.focus.outline-offset}",
48
- "$type": "dimension",
49
56
  "$extensions": {
50
- "nl.amsterdam.subtype": "space"
57
+ "nl.amsterdam.subtype": "space",
58
+ "nl.amsterdam.type": "dimension"
51
59
  }
52
60
  },
53
61
  "padding-block": {
54
62
  "$value": "{ams.space.s}",
55
- "$type": "dimension",
56
63
  "$extensions": {
57
- "nl.amsterdam.subtype": "space"
64
+ "nl.amsterdam.subtype": "space",
65
+ "nl.amsterdam.type": "dimension"
58
66
  }
59
67
  },
60
68
  "padding-inline": {
61
69
  "$value": "{ams.space.m}",
62
- "$type": "dimension",
63
70
  "$extensions": {
64
- "nl.amsterdam.subtype": "space"
71
+ "nl.amsterdam.subtype": "space",
72
+ "nl.amsterdam.type": "dimension"
65
73
  }
66
74
  },
67
75
  "disabled": {
68
76
  "cursor": {
69
- "$value": "{ams.cursor.disabled}"
77
+ "$value": "{ams.cursor.disabled}",
78
+ "$extensions": {
79
+ "nl.amsterdam.type": "cursor"
80
+ }
70
81
  }
71
82
  },
72
83
  "icon-only": {
73
84
  "padding-block": {
74
85
  "$value": "{ams.space.s}",
75
- "$type": "dimension",
76
86
  "$extensions": {
77
- "nl.amsterdam.subtype": "space"
87
+ "nl.amsterdam.subtype": "space",
88
+ "nl.amsterdam.type": "dimension"
78
89
  }
79
90
  },
80
91
  "padding-inline": {
81
92
  "$value": "{ams.space.s}",
82
- "$type": "dimension",
83
93
  "$extensions": {
84
- "nl.amsterdam.subtype": "space"
94
+ "nl.amsterdam.subtype": "space",
95
+ "nl.amsterdam.type": "dimension"
85
96
  }
86
97
  }
87
98
  },
88
99
  "primary": {
89
100
  "background-color": {
90
101
  "$value": "{ams.color.interactive.default}",
91
- "$type": "color"
102
+ "$extensions": {
103
+ "nl.amsterdam.type": "color"
104
+ }
92
105
  },
93
106
  "border-color": {
94
107
  "$value": "{ams.color.interactive.default}",
95
- "$type": "color"
108
+ "$extensions": {
109
+ "nl.amsterdam.type": "color"
110
+ }
96
111
  },
97
112
  "color": {
98
113
  "$value": "{ams.color.text.inverse}",
99
- "$type": "color"
114
+ "$extensions": {
115
+ "nl.amsterdam.type": "color"
116
+ }
100
117
  },
101
118
  "disabled": {
102
119
  "background-color": {
103
120
  "$value": "{ams.color.interactive.disabled}",
104
- "$type": "color"
121
+ "$extensions": {
122
+ "nl.amsterdam.type": "color"
123
+ }
105
124
  },
106
125
  "border-color": {
107
126
  "$value": "{ams.color.interactive.disabled}",
108
- "$type": "color"
127
+ "$extensions": {
128
+ "nl.amsterdam.type": "color"
129
+ }
109
130
  }
110
131
  },
111
132
  "hover": {
112
133
  "background-color": {
113
134
  "$value": "{ams.color.interactive.hover}",
114
- "$type": "color"
135
+ "$extensions": {
136
+ "nl.amsterdam.type": "color"
137
+ }
115
138
  },
116
139
  "border-color": {
117
140
  "$value": "{ams.color.interactive.hover}",
118
- "$type": "color"
141
+ "$extensions": {
142
+ "nl.amsterdam.type": "color"
143
+ }
119
144
  }
120
145
  }
121
146
  },
122
147
  "secondary": {
123
148
  "background-color": {
124
- "$value": "{ams.color.background}",
125
- "$type": "color"
149
+ "$value": "{ams.color.background.default}",
150
+ "$extensions": {
151
+ "nl.amsterdam.type": "color"
152
+ }
126
153
  },
127
154
  "border-color": {
128
155
  "$value": "currentColor",
@@ -130,16 +157,22 @@
130
157
  },
131
158
  "color": {
132
159
  "$value": "{ams.color.interactive.default}",
133
- "$type": "color"
160
+ "$extensions": {
161
+ "nl.amsterdam.type": "color"
162
+ }
134
163
  },
135
164
  "disabled": {
136
165
  "border-color": {
137
166
  "$value": "{ams.color.interactive.disabled}",
138
- "$type": "color"
167
+ "$extensions": {
168
+ "nl.amsterdam.type": "color"
169
+ }
139
170
  },
140
171
  "color": {
141
172
  "$value": "{ams.color.interactive.disabled}",
142
- "$type": "color"
173
+ "$extensions": {
174
+ "nl.amsterdam.type": "color"
175
+ }
143
176
  }
144
177
  },
145
178
  "hover": {
@@ -165,7 +198,9 @@
165
198
  },
166
199
  "color": {
167
200
  "$value": "{ams.color.interactive.hover}",
168
- "$type": "color"
201
+ "$extensions": {
202
+ "nl.amsterdam.type": "color"
203
+ }
169
204
  }
170
205
  }
171
206
  },
@@ -180,12 +215,16 @@
180
215
  },
181
216
  "color": {
182
217
  "$value": "{ams.color.interactive.default}",
183
- "$type": "color"
218
+ "$extensions": {
219
+ "nl.amsterdam.type": "color"
220
+ }
184
221
  },
185
222
  "disabled": {
186
223
  "color": {
187
224
  "$value": "{ams.color.interactive.disabled}",
188
- "$type": "color"
225
+ "$extensions": {
226
+ "nl.amsterdam.type": "color"
227
+ }
189
228
  }
190
229
  },
191
230
  "hover": {
@@ -195,7 +234,9 @@
195
234
  },
196
235
  "color": {
197
236
  "$value": "{ams.color.interactive.hover}",
198
- "$type": "color"
237
+ "$extensions": {
238
+ "nl.amsterdam.type": "color"
239
+ }
199
240
  }
200
241
  }
201
242
  }
package/src/components/ams/call-to-action-link.tokens.json CHANGED
@@ -7,11 +7,15 @@
7
7
  },
8
8
  "color": {
9
9
  "$value": "{ams.color.text.inverse}",
10
- "$type": "color"
10
+ "$extensions": {
11
+ "nl.amsterdam.type": "color"
12
+ }
11
13
  },
12
14
  "font-family": {
13
15
  "$value": "{ams.typography.font-family}",
14
- "$type": "fontFamily"
16
+ "$extensions": {
17
+ "nl.amsterdam.type": "fontFamily"
18
+ }
15
19
  },
16
20
  "font-size": {
17
21
  "$value": "{ams.typography.body-text.font-size}",
@@ -21,44 +25,50 @@
21
25
  },
22
26
  "font-weight": {
23
27
  "$value": "{ams.typography.body-text.font-weight}",
24
- "$type": "fontWeight"
28
+ "$extensions": {
29
+ "nl.amsterdam.type": "fontWeight"
30
+ }
25
31
  },
26
32
  "line-height": {
27
33
  "$value": "{ams.typography.body-text.line-height}",
28
34
  "$extensions": {
29
- "nl.amsterdam.type": "lineHeight"
35
+ "nl.amsterdam.subtype": "lineHeight",
36
+ "nl.amsterdam.type": "number"
30
37
  }
31
38
  },
32
39
  "outline-offset": {
33
40
  "$value": "{ams.focus.outline-offset}",
34
- "$type": "dimension",
35
41
  "$extensions": {
36
- "nl.amsterdam.subtype": "space"
42
+ "nl.amsterdam.subtype": "space",
43
+ "nl.amsterdam.type": "dimension"
37
44
  }
38
45
  },
39
46
  "padding-block": {
40
47
  "$value": "{ams.space.xs}",
41
- "$type": "dimension",
42
48
  "$extensions": {
43
- "nl.amsterdam.subtype": "space"
49
+ "nl.amsterdam.subtype": "space",
50
+ "nl.amsterdam.type": "dimension"
44
51
  }
45
52
  },
46
53
  "padding-inline": {
47
54
  "$value": "{ams.space.m}",
48
- "$type": "dimension",
49
55
  "$extensions": {
50
- "nl.amsterdam.subtype": "space"
56
+ "nl.amsterdam.subtype": "space",
57
+ "nl.amsterdam.type": "dimension"
51
58
  }
52
59
  },
53
60
  "text-decoration-thickness": {
54
61
  "$value": "{ams.links.text-decoration-thickness}",
55
- "$type": "dimension"
62
+ "$extensions": {
63
+ "nl.amsterdam.subtype": "space",
64
+ "nl.amsterdam.type": "dimension"
65
+ }
56
66
  },
57
67
  "text-underline-offset": {
58
68
  "$value": "{ams.links.text-underline-offset}",
59
- "$type": "dimension",
60
69
  "$extensions": {
61
- "nl.amsterdam.subtype": "space"
70
+ "nl.amsterdam.subtype": "space",
71
+ "nl.amsterdam.type": "dimension"
62
72
  }
63
73
  },
64
74
  "hover": {
@@ -68,13 +78,16 @@
68
78
  },
69
79
  "text-decoration-thickness": {
70
80
  "$value": "{ams.links.hover.text-decoration-thickness}",
71
- "$type": "dimension"
81
+ "$extensions": {
82
+ "nl.amsterdam.subtype": "space",
83
+ "nl.amsterdam.type": "dimension"
84
+ }
72
85
  },
73
86
  "text-underline-offset": {
74
87
  "$value": "{ams.links.hover.text-underline-offset}",
75
- "$type": "dimension",
76
88
  "$extensions": {
77
- "nl.amsterdam.subtype": "space"
89
+ "nl.amsterdam.subtype": "space",
90
+ "nl.amsterdam.type": "dimension"
78
91
  }
79
92
  }
80
93
  }
package/src/components/ams/card.tokens.json CHANGED
@@ -4,71 +4,84 @@
4
4
  "heading": {
5
5
  "margin-block-end": {
6
6
  "$value": "{ams.space.xs}",
7
- "$type": "dimension",
8
7
  "$extensions": {
9
- "nl.amsterdam.subtype": "space"
8
+ "nl.amsterdam.subtype": "space",
9
+ "nl.amsterdam.type": "dimension"
10
10
  }
11
11
  }
12
12
  },
13
13
  "heading-group": {
14
14
  "gap": {
15
15
  "$value": "{ams.space.xs}",
16
- "$type": "dimension",
17
16
  "$extensions": {
18
- "nl.amsterdam.subtype": "space"
17
+ "nl.amsterdam.subtype": "space",
18
+ "nl.amsterdam.type": "dimension"
19
19
  }
20
20
  },
21
21
  "margin-block-end": {
22
22
  "$value": "{ams.space.xs}",
23
- "$type": "dimension",
24
23
  "$extensions": {
25
- "nl.amsterdam.subtype": "space"
24
+ "nl.amsterdam.subtype": "space",
25
+ "nl.amsterdam.type": "dimension"
26
26
  }
27
27
  }
28
28
  },
29
29
  "image": {
30
30
  "margin-block-end": {
31
31
  "$value": "{ams.space.s}",
32
- "$type": "dimension",
33
32
  "$extensions": {
34
- "nl.amsterdam.subtype": "space"
33
+ "nl.amsterdam.subtype": "space",
34
+ "nl.amsterdam.type": "dimension"
35
35
  }
36
36
  }
37
37
  },
38
38
  "link": {
39
39
  "color": {
40
40
  "$value": "{ams.links.color}",
41
- "$type": "color"
41
+ "$extensions": {
42
+ "nl.amsterdam.type": "color"
43
+ }
42
44
  },
43
45
  "text-decoration-line": {
44
- "$value": "{ams.links.subtle.text-decoration-line}"
46
+ "$value": "{ams.links.subtle.text-decoration-line}",
47
+ "$extensions": {
48
+ "nl.amsterdam.type": "textDecorationLine"
49
+ }
45
50
  },
46
51
  "text-decoration-thickness": {
47
52
  "$value": "{ams.links.text-decoration-thickness}",
48
- "$type": "dimension"
53
+ "$extensions": {
54
+ "nl.amsterdam.subtype": "space",
55
+ "nl.amsterdam.type": "dimension"
56
+ }
49
57
  },
50
58
  "text-underline-offset": {
51
59
  "$value": "{ams.links.text-underline-offset}",
52
- "$type": "dimension",
53
60
  "$extensions": {
54
- "nl.amsterdam.subtype": "space"
61
+ "nl.amsterdam.subtype": "space",
62
+ "nl.amsterdam.type": "dimension"
55
63
  }
56
64
  },
57
65
  "hover": {
58
66
  "color": {
59
67
  "$value": "{ams.links.hover.color}",
60
- "$type": "color"
68
+ "$extensions": {
69
+ "nl.amsterdam.type": "color"
70
+ }
61
71
  },
62
72
  "text-decoration-line": {
63
- "$value": "{ams.links.subtle.hover.text-decoration-line}"
73
+ "$value": "{ams.links.subtle.hover.text-decoration-line}",
74
+ "$extensions": {
75
+ "nl.amsterdam.type": "textDecorationLine"
76
+ }
64
77
  }
65
78
  }
66
79
  },
67
80
  "outline-offset": {
68
81
  "$value": "{ams.focus.outline-offset}",
69
- "$type": "dimension",
70
82
  "$extensions": {
71
- "nl.amsterdam.subtype": "space"
83
+ "nl.amsterdam.subtype": "space",
84
+ "nl.amsterdam.type": "dimension"
72
85
  }
73
86
  }
74
87
  }
package/src/components/ams/character-count.tokens.json CHANGED
@@ -3,11 +3,15 @@
3
3
  "character-count": {
4
4
  "color": {
5
5
  "$value": "{ams.color.text.default}",
6
- "$type": "color"
6
+ "$extensions": {
7
+ "nl.amsterdam.type": "color"
8
+ }
7
9
  },
8
10
  "font-family": {
9
11
  "$value": "{ams.typography.font-family}",
10
- "$type": "fontFamily"
12
+ "$extensions": {
13
+ "nl.amsterdam.type": "fontFamily"
14
+ }
11
15
  },
12
16
  "font-size": {
13
17
  "$value": "{ams.typography.body-text.small.font-size}",
@@ -17,18 +21,23 @@
17
21
  },
18
22
  "font-weight": {
19
23
  "$value": "{ams.typography.body-text.font-weight}",
20
- "$type": "fontWeight"
24
+ "$extensions": {
25
+ "nl.amsterdam.type": "fontWeight"
26
+ }
21
27
  },
22
28
  "line-height": {
23
29
  "$value": "{ams.typography.body-text.small.line-height}",
24
30
  "$extensions": {
25
- "nl.amsterdam.type": "lineHeight"
31
+ "nl.amsterdam.subtype": "lineHeight",
32
+ "nl.amsterdam.type": "number"
26
33
  }
27
34
  },
28
35
  "error": {
29
36
  "color": {
30
37
  "$value": "{ams.color.feedback.error}",
31
- "$type": "color"
38
+ "$extensions": {
39
+ "nl.amsterdam.type": "color"
40
+ }
32
41
  }
33
42
  }
34
43
  }