@amsterdam/design-system-tokens 3.3.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 (109) hide show
  1. package/CHANGELOG.md +61 -3
  2. package/README.md +131 -22
  3. package/build.js +11 -1
  4. package/dist/compact.css +9 -2
  5. package/dist/compact.d.ts +21 -6
  6. package/dist/compact.json +33 -18
  7. package/dist/compact.mjs +21 -13
  8. package/dist/compact.scss +9 -2
  9. package/dist/compact.theme.css +9 -2
  10. package/dist/index.css +177 -165
  11. package/dist/index.d.ts +250 -226
  12. package/dist/index.json +345 -321
  13. package/dist/index.mjs +285 -267
  14. package/dist/index.scss +177 -165
  15. package/dist/index.theme.css +177 -165
  16. package/package.json +2 -2
  17. package/src/brand/ams/aspect-ratio.tokens.json +24 -6
  18. package/src/brand/ams/border.compact.tokens.json +20 -0
  19. package/src/brand/ams/border.tokens.json +25 -0
  20. package/src/brand/ams/color.compact.tokens.json +15 -0
  21. package/src/brand/ams/color.tokens.json +37 -49
  22. package/src/brand/ams/cursor.tokens.json +9 -2
  23. package/src/brand/ams/focus.tokens.json +1 -0
  24. package/src/brand/ams/space.compact.tokens.json +16 -4
  25. package/src/brand/ams/space.tokens.json +31 -6
  26. package/src/brand/ams/typography.compact.tokens.json +36 -27
  27. package/src/brand/ams/typography.tokens.json +60 -32
  28. package/src/common/ams/inputs.tokens.json +41 -19
  29. package/src/common/ams/links.tokens.json +35 -10
  30. package/src/components/ams/accordion.tokens.json +18 -11
  31. package/src/components/ams/action-group.tokens.json +2 -2
  32. package/src/components/ams/alert.tokens.json +38 -20
  33. package/src/components/ams/avatar.tokens.json +79 -29
  34. package/src/components/ams/badge.tokens.json +60 -23
  35. package/src/components/ams/blockquote.tokens.json +14 -5
  36. package/src/components/ams/body.compact.tokens.json +12 -0
  37. package/src/components/ams/body.tokens.json +12 -0
  38. package/src/components/ams/breadcrumb.tokens.json +36 -15
  39. package/src/components/ams/button.tokens.json +74 -33
  40. package/src/components/ams/call-to-action-link.tokens.json +29 -16
  41. package/src/components/ams/card.tokens.json +30 -17
  42. package/src/components/ams/character-count.tokens.json +14 -5
  43. package/src/components/ams/checkbox.tokens.json +106 -39
  44. package/src/components/ams/column.tokens.json +10 -10
  45. package/src/components/ams/date-input.tokens.json +56 -23
  46. package/src/components/ams/description-list.tokens.json +101 -23
  47. package/src/components/ams/dialog.tokens.json +104 -28
  48. package/src/components/ams/error-message.tokens.json +13 -6
  49. package/src/components/ams/field-set.tokens.json +40 -17
  50. package/src/components/ams/field.tokens.json +18 -7
  51. package/src/components/ams/figure.tokens.json +16 -7
  52. package/src/components/ams/file-input.tokens.json +69 -30
  53. package/src/components/ams/file-list.tokens.json +20 -11
  54. package/src/components/ams/grid.compact.tokens.json +24 -2
  55. package/src/components/ams/grid.tokens.json +77 -24
  56. package/src/components/ams/heading.tokens.json +38 -36
  57. package/src/components/ams/hint.tokens.json +6 -2
  58. package/src/components/ams/icon-button.tokens.json +46 -16
  59. package/src/components/ams/icon.tokens.json +19 -23
  60. package/src/components/ams/image-slider.tokens.json +28 -16
  61. package/src/components/ams/image.tokens.json +4 -1
  62. package/src/components/ams/invalid-form-alert.tokens.json +2 -2
  63. package/src/components/ams/label.tokens.json +18 -6
  64. package/src/components/ams/link-list.tokens.json +50 -22
  65. package/src/components/ams/link.tokens.json +38 -25
  66. package/src/components/ams/logo.tokens.json +6 -2
  67. package/src/components/ams/mark.tokens.json +3 -1
  68. package/src/components/ams/menu.tokens.json +81 -28
  69. package/src/components/ams/ordered-list.tokens.json +39 -25
  70. package/src/components/ams/page-footer.tokens.json +70 -26
  71. package/src/components/ams/page-header.compact.tokens.json +2 -1
  72. package/src/components/ams/page-header.tokens.json +128 -59
  73. package/src/components/ams/page.compact.tokens.json +12 -0
  74. package/src/components/ams/page.tokens.json +5 -3
  75. package/src/components/ams/pagination.tokens.json +37 -17
  76. package/src/components/ams/paragraph.tokens.json +22 -8
  77. package/src/components/ams/password-input.tokens.json +47 -21
  78. package/src/components/ams/progress-list.tokens.json +194 -52
  79. package/src/components/ams/radio.tokens.json +97 -36
  80. package/src/components/ams/row.tokens.json +10 -10
  81. package/src/components/ams/search-field.tokens.json +57 -24
  82. package/src/components/ams/select.tokens.json +63 -23
  83. package/src/components/ams/skip-link.tokens.json +23 -12
  84. package/src/components/ams/spotlight.tokens.json +21 -7
  85. package/src/components/ams/standalone-link.tokens.json +44 -18
  86. package/src/components/ams/switch.tokens.json +40 -10
  87. package/src/components/ams/tab-navigation.tokens.json +205 -0
  88. package/src/components/ams/table-of-contents.tokens.json +38 -20
  89. package/src/components/ams/table.tokens.json +29 -10
  90. package/src/components/ams/tabs.tokens.json +39 -20
  91. package/src/components/ams/text-area.tokens.json +49 -23
  92. package/src/components/ams/text-input.tokens.json +47 -19
  93. package/src/components/ams/time-input.tokens.json +56 -21
  94. package/src/components/ams/unordered-list.tokens.json +37 -25
  95. package/style-dictionary/transforms/dtcg-font-family.js +32 -0
  96. package/src/brand/ams/color.deprecated.tokens.json +0 -13
  97. package/src/brand/ams/typography.deprecated.compact.tokens.json +0 -26
  98. package/src/brand/ams/typography.deprecated.tokens.json +0 -40
  99. package/src/components/ams/accordion.deprecated.tokens.json +0 -39
  100. package/src/components/ams/checkbox.deprecated.tokens.json +0 -59
  101. package/src/components/ams/date-input.deprecated.tokens.json +0 -38
  102. package/src/components/ams/field-set.deprecated.tokens.json +0 -16
  103. package/src/components/ams/field.deprecated.tokens.json +0 -14
  104. package/src/components/ams/icon.deprecated.tokens.json +0 -22
  105. package/src/components/ams/menu.deprecated.tokens.json +0 -36
  106. package/src/components/ams/page-heading.deprecated.tokens.json +0 -46
  107. package/src/components/ams/standalone-link.deprecated.tokens.json +0 -38
  108. package/src/components/ams/table-of-contents.deprecated.tokens.json +0 -24
  109. package/src/components/ams/time-input.deprecated.tokens.json +0 -38
@@ -3,14 +3,21 @@
3
3
  "checkbox": {
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
  "cursor": {
9
- "$value": "{ams.cursor.interactive}"
11
+ "$value": "{ams.cursor.interactive}",
12
+ "$extensions": {
13
+ "nl.amsterdam.type": "cursor"
14
+ }
10
15
  },
11
16
  "font-family": {
12
17
  "$value": "{ams.typography.font-family}",
13
- "$type": "fontFamily"
18
+ "$extensions": {
19
+ "nl.amsterdam.type": "fontFamily"
20
+ }
14
21
  },
15
22
  "font-size": {
16
23
  "$value": "{ams.typography.body-text.font-size}",
@@ -20,75 +27,97 @@
20
27
  },
21
28
  "font-weight": {
22
29
  "$value": "{ams.typography.body-text.font-weight}",
23
- "$type": "fontWeight"
30
+ "$extensions": {
31
+ "nl.amsterdam.type": "fontWeight"
32
+ }
24
33
  },
25
34
  "gap": {
26
35
  "$value": "{ams.space.s}",
27
- "$type": "dimension",
28
36
  "$extensions": {
29
- "nl.amsterdam.subtype": "space"
37
+ "nl.amsterdam.subtype": "space",
38
+ "nl.amsterdam.type": "dimension"
30
39
  }
31
40
  },
32
41
  "line-height": {
33
42
  "$value": "{ams.typography.body-text.line-height}",
34
43
  "$extensions": {
35
- "nl.amsterdam.type": "lineHeight"
44
+ "nl.amsterdam.subtype": "lineHeight",
45
+ "nl.amsterdam.type": "number"
36
46
  }
37
47
  },
38
48
  "outline-offset": {
39
49
  "$value": "{ams.focus.outline-offset}",
40
- "$type": "dimension",
41
50
  "$extensions": {
42
- "nl.amsterdam.subtype": "space"
51
+ "nl.amsterdam.subtype": "space",
52
+ "nl.amsterdam.type": "dimension"
43
53
  }
44
54
  },
45
55
  "text-decoration-thickness": {
46
56
  "$value": "{ams.links.text-decoration-thickness}",
47
- "$type": "dimension"
57
+ "$extensions": {
58
+ "nl.amsterdam.subtype": "space",
59
+ "nl.amsterdam.type": "dimension"
60
+ }
48
61
  },
49
62
  "text-underline-offset": {
50
63
  "$value": "{ams.links.text-underline-offset}",
51
- "$type": "dimension",
52
64
  "$extensions": {
53
- "nl.amsterdam.subtype": "space"
65
+ "nl.amsterdam.subtype": "space",
66
+ "nl.amsterdam.type": "dimension"
54
67
  }
55
68
  },
56
69
  "disabled": {
57
70
  "cursor": {
58
- "$value": "{ams.cursor.disabled}"
71
+ "$value": "{ams.cursor.disabled}",
72
+ "$extensions": {
73
+ "nl.amsterdam.type": "cursor"
74
+ }
59
75
  },
60
76
  "color": {
61
77
  "$value": "{ams.color.interactive.disabled}",
62
- "$type": "color"
78
+ "$extensions": {
79
+ "nl.amsterdam.type": "color"
80
+ }
63
81
  }
64
82
  },
65
83
  "hover": {
66
84
  "color": {
67
85
  "$value": "{ams.color.interactive.hover}",
68
- "$type": "color"
86
+ "$extensions": {
87
+ "nl.amsterdam.type": "color"
88
+ }
69
89
  },
70
90
  "text-decoration-line": {
71
- "$value": "{ams.links.subtle.hover.text-decoration-line}"
91
+ "$value": "{ams.links.subtle.hover.text-decoration-line}",
92
+ "$extensions": {
93
+ "nl.amsterdam.type": "textDecorationLine"
94
+ }
72
95
  }
73
96
  },
74
97
  "checked-indicator": {
75
98
  "stroke": {
76
99
  "$value": "{ams.color.interactive.inverse}",
77
- "$type": "color"
100
+ "$extensions": {
101
+ "nl.amsterdam.type": "color"
102
+ }
78
103
  }
79
104
  },
80
105
  "hover-indicator": {
81
106
  "hover": {
82
107
  "stroke": {
83
108
  "$value": "{ams.color.interactive.hover}",
84
- "$type": "color"
109
+ "$extensions": {
110
+ "nl.amsterdam.type": "color"
111
+ }
85
112
  }
86
113
  },
87
114
  "invalid": {
88
115
  "hover": {
89
116
  "stroke": {
90
117
  "$value": "{ams.color.interactive.invalid.hover}",
91
- "$type": "color"
118
+ "$extensions": {
119
+ "nl.amsterdam.type": "color"
120
+ }
92
121
  }
93
122
  }
94
123
  }
@@ -96,54 +125,74 @@
96
125
  "icon-container": {
97
126
  "block-size": {
98
127
  "$value": "calc({ams.checkbox.font-size} * {ams.checkbox.line-height})",
99
- "$type": "dimension"
128
+ "$extensions": {
129
+ "nl.amsterdam.type": "dimension"
130
+ }
100
131
  },
101
132
  "inline-size": {
102
133
  "$value": "{ams.checkbox.font-size}",
103
- "$type": "dimension"
134
+ "$extensions": {
135
+ "nl.amsterdam.type": "dimension"
136
+ }
104
137
  }
105
138
  },
106
139
  "indeterminate-indicator": {
107
140
  "stroke": {
108
141
  "$value": "{ams.color.interactive.inverse}",
109
- "$type": "color"
142
+ "$extensions": {
143
+ "nl.amsterdam.type": "color"
144
+ }
110
145
  }
111
146
  },
112
147
  "rectangle": {
113
148
  "fill": {
114
- "$value": "{ams.color.background}",
115
- "$type": "color"
149
+ "$value": "{ams.color.background.default}",
150
+ "$extensions": {
151
+ "nl.amsterdam.type": "color"
152
+ }
116
153
  },
117
154
  "stroke": {
118
155
  "$value": "{ams.color.interactive.default}",
119
- "$type": "color"
156
+ "$extensions": {
157
+ "nl.amsterdam.type": "color"
158
+ }
120
159
  },
121
160
  "checked": {
122
161
  "fill": {
123
162
  "$value": "{ams.color.interactive.default}",
124
- "$type": "color"
163
+ "$extensions": {
164
+ "nl.amsterdam.type": "color"
165
+ }
125
166
  },
126
167
  "disabled": {
127
168
  "fill": {
128
169
  "$value": "{ams.color.interactive.disabled}",
129
- "$type": "color"
170
+ "$extensions": {
171
+ "nl.amsterdam.type": "color"
172
+ }
130
173
  }
131
174
  },
132
175
  "hover": {
133
176
  "fill": {
134
177
  "$value": "{ams.color.interactive.hover}",
135
- "$type": "color"
178
+ "$extensions": {
179
+ "nl.amsterdam.type": "color"
180
+ }
136
181
  }
137
182
  },
138
183
  "invalid": {
139
184
  "fill": {
140
185
  "$value": "{ams.color.interactive.invalid.default}",
141
- "$type": "color"
186
+ "$extensions": {
187
+ "nl.amsterdam.type": "color"
188
+ }
142
189
  },
143
190
  "hover": {
144
191
  "fill": {
145
192
  "$value": "{ams.color.interactive.invalid.hover}",
146
- "$type": "color"
193
+ "$extensions": {
194
+ "nl.amsterdam.type": "color"
195
+ }
147
196
  }
148
197
  }
149
198
  }
@@ -151,41 +200,55 @@
151
200
  "disabled": {
152
201
  "stroke": {
153
202
  "$value": "{ams.color.interactive.disabled}",
154
- "$type": "color"
203
+ "$extensions": {
204
+ "nl.amsterdam.type": "color"
205
+ }
155
206
  }
156
207
  },
157
208
  "hover": {
158
209
  "stroke": {
159
210
  "$value": "{ams.color.interactive.hover}",
160
- "$type": "color"
211
+ "$extensions": {
212
+ "nl.amsterdam.type": "color"
213
+ }
161
214
  }
162
215
  },
163
216
  "indeterminate": {
164
217
  "fill": {
165
218
  "$value": "{ams.color.interactive.default}",
166
- "$type": "color"
219
+ "$extensions": {
220
+ "nl.amsterdam.type": "color"
221
+ }
167
222
  },
168
223
  "disabled": {
169
224
  "fill": {
170
225
  "$value": "{ams.color.interactive.disabled}",
171
- "$type": "color"
226
+ "$extensions": {
227
+ "nl.amsterdam.type": "color"
228
+ }
172
229
  }
173
230
  },
174
231
  "hover": {
175
232
  "fill": {
176
233
  "$value": "{ams.color.interactive.hover}",
177
- "$type": "color"
234
+ "$extensions": {
235
+ "nl.amsterdam.type": "color"
236
+ }
178
237
  }
179
238
  },
180
239
  "invalid": {
181
240
  "fill": {
182
241
  "$value": "{ams.color.interactive.invalid.default}",
183
- "$type": "color"
242
+ "$extensions": {
243
+ "nl.amsterdam.type": "color"
244
+ }
184
245
  },
185
246
  "hover": {
186
247
  "fill": {
187
248
  "$value": "{ams.color.interactive.invalid.hover}",
188
- "$type": "color"
249
+ "$extensions": {
250
+ "nl.amsterdam.type": "color"
251
+ }
189
252
  }
190
253
  }
191
254
  }
@@ -193,12 +256,16 @@
193
256
  "invalid": {
194
257
  "stroke": {
195
258
  "$value": "{ams.color.interactive.invalid.default}",
196
- "$type": "color"
259
+ "$extensions": {
260
+ "nl.amsterdam.type": "color"
261
+ }
197
262
  },
198
263
  "hover": {
199
264
  "stroke": {
200
265
  "$value": "{ams.color.interactive.invalid.hover}",
201
- "$type": "color"
266
+ "$extensions": {
267
+ "nl.amsterdam.type": "color"
268
+ }
202
269
  }
203
270
  }
204
271
  }
@@ -4,37 +4,37 @@
4
4
  "gap": {
5
5
  "x-small": {
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
  "small": {
13
13
  "$value": "{ams.space.s}",
14
- "$type": "dimension",
15
14
  "$extensions": {
16
- "nl.amsterdam.subtype": "space"
15
+ "nl.amsterdam.subtype": "space",
16
+ "nl.amsterdam.type": "dimension"
17
17
  }
18
18
  },
19
19
  "medium": {
20
20
  "$value": "{ams.space.m}",
21
- "$type": "dimension",
22
21
  "$extensions": {
23
- "nl.amsterdam.subtype": "space"
22
+ "nl.amsterdam.subtype": "space",
23
+ "nl.amsterdam.type": "dimension"
24
24
  }
25
25
  },
26
26
  "large": {
27
27
  "$value": "{ams.space.l}",
28
- "$type": "dimension",
29
28
  "$extensions": {
30
- "nl.amsterdam.subtype": "space"
29
+ "nl.amsterdam.subtype": "space",
30
+ "nl.amsterdam.type": "dimension"
31
31
  }
32
32
  },
33
33
  "x-large": {
34
34
  "$value": "{ams.space.xl}",
35
- "$type": "dimension",
36
35
  "$extensions": {
37
- "nl.amsterdam.subtype": "space"
36
+ "nl.amsterdam.subtype": "space",
37
+ "nl.amsterdam.type": "dimension"
38
38
  }
39
39
  }
40
40
  }
@@ -3,11 +3,15 @@
3
3
  "date-input": {
4
4
  "background-color": {
5
5
  "$value": "{ams.inputs.background-color}",
6
- "$type": "color"
6
+ "$extensions": {
7
+ "nl.amsterdam.type": "color"
8
+ }
7
9
  },
8
10
  "border-color": {
9
11
  "$value": "{ams.inputs.border-color}",
10
- "$type": "color"
12
+ "$extensions": {
13
+ "nl.amsterdam.type": "color"
14
+ }
11
15
  },
12
16
  "border-style": {
13
17
  "$value": "{ams.inputs.border-style}",
@@ -23,11 +27,15 @@
23
27
  },
24
28
  "color": {
25
29
  "$value": "{ams.inputs.color}",
26
- "$type": "color"
30
+ "$extensions": {
31
+ "nl.amsterdam.type": "color"
32
+ }
27
33
  },
28
34
  "font-family": {
29
35
  "$value": "{ams.inputs.font-family}",
30
- "$type": "fontFamily"
36
+ "$extensions": {
37
+ "nl.amsterdam.type": "fontFamily"
38
+ }
31
39
  },
32
40
  "font-size": {
33
41
  "$value": "{ams.inputs.font-size}",
@@ -37,77 +45,102 @@
37
45
  },
38
46
  "font-weight": {
39
47
  "$value": "{ams.inputs.font-weight}",
40
- "$type": "fontWeight"
48
+ "$extensions": {
49
+ "nl.amsterdam.type": "fontWeight"
50
+ }
41
51
  },
42
52
  "line-height": {
43
53
  "$value": "{ams.inputs.line-height}",
44
54
  "$extensions": {
45
- "nl.amsterdam.type": "lineHeight"
55
+ "nl.amsterdam.subtype": "lineHeight",
56
+ "nl.amsterdam.type": "number"
46
57
  }
47
58
  },
48
59
  "outline-offset": {
49
60
  "$value": "{ams.inputs.outline-offset}",
50
- "$type": "dimension",
51
61
  "$extensions": {
52
- "nl.amsterdam.subtype": "space"
62
+ "nl.amsterdam.subtype": "space",
63
+ "nl.amsterdam.type": "dimension"
53
64
  }
54
65
  },
55
66
  "padding-block": {
56
67
  "$value": "{ams.inputs.padding-block}",
57
- "$type": "dimension",
58
68
  "$extensions": {
59
- "nl.amsterdam.subtype": "space"
69
+ "nl.amsterdam.subtype": "space",
70
+ "nl.amsterdam.type": "dimension"
60
71
  }
61
72
  },
62
73
  "padding-inline": {
63
74
  "$value": "{ams.inputs.padding-inline}",
64
- "$type": "dimension",
65
75
  "$extensions": {
66
- "nl.amsterdam.subtype": "space"
76
+ "nl.amsterdam.subtype": "space",
77
+ "nl.amsterdam.type": "dimension"
67
78
  }
68
79
  },
69
80
  "disabled": {
70
81
  "color": {
71
82
  "$value": "{ams.inputs.disabled.color}",
72
- "$type": "color"
83
+ "$extensions": {
84
+ "nl.amsterdam.type": "color"
85
+ }
73
86
  },
74
87
  "cursor": {
75
- "$value": "{ams.cursor.disabled}"
88
+ "$value": "{ams.cursor.disabled}",
89
+ "$extensions": {
90
+ "nl.amsterdam.type": "cursor"
91
+ }
76
92
  }
77
93
  },
78
94
  "hover": {
79
95
  "box-shadow": {
80
- "$type": "shadow",
81
- "$value": "{ams.inputs.hover.box-shadow}"
96
+ "$value": "{ams.inputs.hover.box-shadow}",
97
+ "$extensions": {
98
+ "nl.amsterdam.type": "shadow"
99
+ }
82
100
  },
83
101
  "calendar-picker-indicator": {
84
102
  "background-image": {
85
- "$value": "url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 36' fill='%23003677'><path d='M28 6V2h-4v4H12V2H8v4H2v28h32V6zm2 24H6V14h24z'/><path d='M10 17h4v4h-4zm6 0h4v4h-4zm6 0h4v4h-4zm-12 6h4v4h-4zm6 0h4v4h-4z'/></svg>\")"
103
+ "$value": "url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 36' fill='%23003677'><path d='M28 6V2h-4v4H12V2H8v4H2v28h32V6zm2 24H6V14h24z'/><path d='M10 17h4v4h-4zm6 0h4v4h-4zm6 0h4v4h-4zm-12 6h4v4h-4zm6 0h4v4h-4z'/></svg>\")",
104
+ "$extensions": {
105
+ "nl.amsterdam.type": "backgroundImage"
106
+ }
86
107
  }
87
108
  }
88
109
  },
89
110
  "invalid": {
90
111
  "border-color": {
91
112
  "$value": "{ams.inputs.invalid.border-color}",
92
- "$type": "color"
113
+ "$extensions": {
114
+ "nl.amsterdam.type": "color"
115
+ }
93
116
  },
94
117
  "hover": {
95
118
  "border-color": {
96
119
  "$value": "{ams.inputs.invalid.hover.border-color}",
97
- "$type": "color"
120
+ "$extensions": {
121
+ "nl.amsterdam.type": "color"
122
+ }
98
123
  },
99
124
  "box-shadow": {
100
- "$type": "shadow",
101
- "$value": "{ams.inputs.invalid.hover.box-shadow}"
125
+ "$value": "{ams.inputs.invalid.hover.box-shadow}",
126
+ "$extensions": {
127
+ "nl.amsterdam.type": "shadow"
128
+ }
102
129
  }
103
130
  }
104
131
  },
105
132
  "calendar-picker-indicator": {
106
133
  "background-image": {
107
- "$value": "url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 36' fill='%23004699'><path d='M28 6V2h-4v4H12V2H8v4H2v28h32V6zm2 24H6V14h24z'/><path d='M10 17h4v4h-4zm6 0h4v4h-4zm6 0h4v4h-4zm-12 6h4v4h-4zm6 0h4v4h-4z'/></svg>\")"
134
+ "$value": "url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 36' fill='%23004699'><path d='M28 6V2h-4v4H12V2H8v4H2v28h32V6zm2 24H6V14h24z'/><path d='M10 17h4v4h-4zm6 0h4v4h-4zm6 0h4v4h-4zm-12 6h4v4h-4zm6 0h4v4h-4z'/></svg>\")",
135
+ "$extensions": {
136
+ "nl.amsterdam.type": "backgroundImage"
137
+ }
108
138
  },
109
139
  "cursor": {
110
- "$value": "{ams.cursor.interactive}"
140
+ "$value": "{ams.cursor.interactive}",
141
+ "$extensions": {
142
+ "nl.amsterdam.type": "cursor"
143
+ }
111
144
  }
112
145
  }
113
146
  }