@amsterdam/design-system-tokens 0.8.0 → 0.10.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 (35) hide show
  1. package/CHANGELOG.md +45 -0
  2. package/dist/compact.css +1 -1
  3. package/dist/compact.d.ts +1 -1
  4. package/dist/compact.mjs +1 -1
  5. package/dist/compact.scss +1 -1
  6. package/dist/compact.theme.css +1 -1
  7. package/dist/index.css +129 -45
  8. package/dist/index.d.ts +174 -32
  9. package/dist/index.json +217 -75
  10. package/dist/index.mjs +161 -77
  11. package/dist/index.scss +129 -45
  12. package/dist/index.theme.css +129 -45
  13. package/package.json +1 -1
  14. package/src/brand/ams/proportion.tokens.json +3 -3
  15. package/src/common/ams/focus.tokens.json +1 -1
  16. package/src/common/ams/link-appearance.tokens.json +2 -2
  17. package/src/components/ams/avatar.tokens.json +24 -4
  18. package/src/components/ams/badge.tokens.json +28 -4
  19. package/src/components/ams/breadcrumb.tokens.json +1 -1
  20. package/src/components/ams/error-message.tokens.json +11 -0
  21. package/src/components/ams/{fieldset.tokens.json → field-set.tokens.json} +11 -2
  22. package/src/components/ams/field.tokens.json +17 -0
  23. package/src/components/ams/file-input.tokens.json +42 -0
  24. package/src/components/ams/link-list.tokens.json +2 -4
  25. package/src/components/ams/logo.tokens.json +1 -1
  26. package/src/components/ams/ordered-list.tokens.json +4 -0
  27. package/src/components/ams/paragraph.tokens.json +2 -4
  28. package/src/components/ams/screen.tokens.json +2 -2
  29. package/src/components/ams/search-field.tokens.json +11 -5
  30. package/src/components/ams/switch.tokens.json +6 -5
  31. package/src/components/ams/table-of-contents.tokens.json +34 -0
  32. package/src/components/ams/table.tokens.json +1 -1
  33. package/src/components/ams/tabs.tokens.json +1 -1
  34. package/src/components/ams/text-area.tokens.json +1 -1
  35. package/src/components/ams/unordered-list.tokens.json +4 -0
package/dist/index.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Mon, 22 Apr 2024 09:30:48 GMT
3
+ * Generated on Fri, 28 Jun 2024 12:13:40 GMT
4
4
  */
5
5
 
6
6
  export default tokens;
@@ -235,11 +235,11 @@ declare const tokens: {
235
235
  "line-height": DesignToken,
236
236
  "padding-block": DesignToken,
237
237
  "padding-inline": DesignToken,
238
- "blue": {
238
+ "black": {
239
239
  "background-color": DesignToken,
240
240
  "color": DesignToken
241
241
  },
242
- "dark-blue": {
242
+ "blue": {
243
243
  "background-color": DesignToken,
244
244
  "color": DesignToken
245
245
  },
@@ -251,6 +251,22 @@ declare const tokens: {
251
251
  "background-color": DesignToken,
252
252
  "color": DesignToken
253
253
  },
254
+ "grey-1": {
255
+ "background-color": DesignToken,
256
+ "color": DesignToken
257
+ },
258
+ "grey-2": {
259
+ "background-color": DesignToken,
260
+ "color": DesignToken
261
+ },
262
+ "grey-3": {
263
+ "background-color": DesignToken,
264
+ "color": DesignToken
265
+ },
266
+ "light-blue": {
267
+ "background-color": DesignToken,
268
+ "color": DesignToken
269
+ },
254
270
  "magenta": {
255
271
  "background-color": DesignToken,
256
272
  "color": DesignToken
@@ -267,6 +283,10 @@ declare const tokens: {
267
283
  "background-color": DesignToken,
268
284
  "color": DesignToken
269
285
  },
286
+ "white": {
287
+ "background-color": DesignToken,
288
+ "color": DesignToken
289
+ },
270
290
  "yellow": {
271
291
  "background-color": DesignToken,
272
292
  "color": DesignToken
@@ -278,11 +298,11 @@ declare const tokens: {
278
298
  "font-weight": DesignToken,
279
299
  "line-height": DesignToken,
280
300
  "padding-inline": DesignToken,
281
- "blue": {
301
+ "black": {
282
302
  "background-color": DesignToken,
283
303
  "color": DesignToken
284
304
  },
285
- "dark-blue": {
305
+ "blue": {
286
306
  "background-color": DesignToken,
287
307
  "color": DesignToken
288
308
  },
@@ -294,6 +314,22 @@ declare const tokens: {
294
314
  "background-color": DesignToken,
295
315
  "color": DesignToken
296
316
  },
317
+ "grey-1": {
318
+ "background-color": DesignToken,
319
+ "color": DesignToken
320
+ },
321
+ "grey-2": {
322
+ "background-color": DesignToken,
323
+ "color": DesignToken
324
+ },
325
+ "grey-3": {
326
+ "background-color": DesignToken,
327
+ "color": DesignToken
328
+ },
329
+ "light-blue": {
330
+ "background-color": DesignToken,
331
+ "color": DesignToken
332
+ },
297
333
  "magenta": {
298
334
  "background-color": DesignToken,
299
335
  "color": DesignToken
@@ -306,6 +342,14 @@ declare const tokens: {
306
342
  "background-color": DesignToken,
307
343
  "color": DesignToken
308
344
  },
345
+ "red": {
346
+ "background-color": DesignToken,
347
+ "color": DesignToken
348
+ },
349
+ "white": {
350
+ "background-color": DesignToken,
351
+ "color": DesignToken
352
+ },
309
353
  "yellow": {
310
354
  "background-color": DesignToken,
311
355
  "color": DesignToken
@@ -327,7 +371,7 @@ declare const tokens: {
327
371
  "separator": {
328
372
  "background-image": DesignToken
329
373
  },
330
- "item-link": {
374
+ "link": {
331
375
  "color": DesignToken,
332
376
  "outline-offset": DesignToken,
333
377
  "text-decoration-line": DesignToken,
@@ -558,13 +602,70 @@ declare const tokens: {
558
602
  "gap": DesignToken
559
603
  }
560
604
  },
561
- "fieldset": {
605
+ "error-message": {
606
+ "color": DesignToken,
607
+ "font-family": DesignToken,
608
+ "font-size": DesignToken,
609
+ "font-weight": DesignToken,
610
+ "line-height": DesignToken
611
+ },
612
+ "field-set": {
613
+ "invalid": {
614
+ "border-inline-start": DesignToken,
615
+ "padding-inline-start": DesignToken
616
+ },
562
617
  "legend": {
563
618
  "color": DesignToken,
564
619
  "font-family": DesignToken,
565
620
  "font-size": DesignToken,
566
621
  "font-weight": DesignToken,
567
- "line-height": DesignToken
622
+ "line-height": DesignToken,
623
+ "margin-block-end": DesignToken
624
+ }
625
+ },
626
+ "field": {
627
+ "gap": DesignToken,
628
+ "invalid": {
629
+ "border-inline-start": DesignToken,
630
+ "padding-inline-start": DesignToken
631
+ }
632
+ },
633
+ "file-input": {
634
+ "background-color": DesignToken,
635
+ "border": DesignToken,
636
+ "color": DesignToken,
637
+ "cursor": DesignToken,
638
+ "font-family": DesignToken,
639
+ "font-size": DesignToken,
640
+ "font-weight": DesignToken,
641
+ "line-height": DesignToken,
642
+ "outline-offset": DesignToken,
643
+ "padding-block": DesignToken,
644
+ "padding-inline": DesignToken,
645
+ "disabled": {
646
+ "color": DesignToken,
647
+ "cursor": DesignToken
648
+ },
649
+ "file-selector-button": {
650
+ "background-color": DesignToken,
651
+ "box-shadow": DesignToken,
652
+ "color": DesignToken,
653
+ "cursor": DesignToken,
654
+ "margin-inline-end": DesignToken,
655
+ "padding-block": DesignToken,
656
+ "padding-inline": DesignToken,
657
+ "hover": {
658
+ "box-shadow": DesignToken,
659
+ "color": DesignToken
660
+ },
661
+ "disabled": {
662
+ "box-shadow": DesignToken,
663
+ "color": DesignToken,
664
+ "cursor": DesignToken
665
+ },
666
+ "forced-color-mode": {
667
+ "border": DesignToken
668
+ }
568
669
  }
569
670
  },
570
671
  "form-field-character-counter": {
@@ -707,8 +808,10 @@ declare const tokens: {
707
808
  "link": {
708
809
  "color": DesignToken,
709
810
  "font-family": DesignToken,
811
+ "font-size": DesignToken,
710
812
  "font-weight": DesignToken,
711
813
  "gap": DesignToken,
814
+ "line-height": DesignToken,
712
815
  "outline-offset": DesignToken,
713
816
  "text-decoration-line": DesignToken,
714
817
  "text-decoration-thickness": DesignToken,
@@ -717,10 +820,6 @@ declare const tokens: {
717
820
  "font-size": DesignToken,
718
821
  "line-height": DesignToken
719
822
  },
720
- "medium": {
721
- "font-size": DesignToken,
722
- "line-height": DesignToken
723
- },
724
823
  "large": {
725
824
  "font-size": DesignToken,
726
825
  "line-height": DesignToken
@@ -797,7 +896,7 @@ declare const tokens: {
797
896
  }
798
897
  },
799
898
  "logo": {
800
- "height": DesignToken,
899
+ "block-size": DesignToken,
801
900
  "emblem": {
802
901
  "color": DesignToken
803
902
  },
@@ -835,6 +934,10 @@ declare const tokens: {
835
934
  "inverse-color": DesignToken,
836
935
  "line-height": DesignToken,
837
936
  "list-style-type": DesignToken,
937
+ "small": {
938
+ "font-size": DesignToken,
939
+ "line-height": DesignToken
940
+ },
838
941
  "item": {
839
942
  "margin-inline-start": DesignToken,
840
943
  "padding-inline-start": DesignToken
@@ -899,16 +1002,14 @@ declare const tokens: {
899
1002
  "paragraph": {
900
1003
  "color": DesignToken,
901
1004
  "font-family": DesignToken,
1005
+ "font-size": DesignToken,
902
1006
  "font-weight": DesignToken,
1007
+ "line-height": DesignToken,
903
1008
  "inverse-color": DesignToken,
904
1009
  "small": {
905
1010
  "font-size": DesignToken,
906
1011
  "line-height": DesignToken
907
1012
  },
908
- "medium": {
909
- "font-size": DesignToken,
910
- "line-height": DesignToken
911
- },
912
1013
  "large": {
913
1014
  "font-size": DesignToken,
914
1015
  "line-height": DesignToken
@@ -976,10 +1077,10 @@ declare const tokens: {
976
1077
  "screen": {
977
1078
  "background-color": DesignToken,
978
1079
  "wide": {
979
- "max-width": DesignToken
1080
+ "max-inline-size": DesignToken
980
1081
  },
981
1082
  "x-wide": {
982
- "max-width": DesignToken
1083
+ "max-inline-size": DesignToken
983
1084
  }
984
1085
  },
985
1086
  "search-field": {
@@ -987,11 +1088,11 @@ declare const tokens: {
987
1088
  "background-color": DesignToken,
988
1089
  "color": DesignToken,
989
1090
  "outline-offset": DesignToken,
1091
+ "padding-block": DesignToken,
1092
+ "padding-inline": DesignToken,
990
1093
  "hover": {
991
1094
  "background-color": DesignToken
992
- },
993
- "padding-block": DesignToken,
994
- "padding-inline": DesignToken
1095
+ }
995
1096
  },
996
1097
  "input": {
997
1098
  "background-color": DesignToken,
@@ -1006,13 +1107,19 @@ declare const tokens: {
1006
1107
  "padding-inline": DesignToken,
1007
1108
  "cancel-button": {
1008
1109
  "background-image": DesignToken,
1110
+ "block-size": DesignToken,
1009
1111
  "color": DesignToken,
1010
- "height": DesignToken,
1011
- "width": DesignToken
1112
+ "inline-size": DesignToken
1012
1113
  },
1013
1114
  "hover": {
1014
1115
  "box-shadow": DesignToken
1015
1116
  },
1117
+ "invalid": {
1118
+ "box-shadow": DesignToken,
1119
+ "hover": {
1120
+ "box-shadow": DesignToken
1121
+ }
1122
+ },
1016
1123
  "placeholder": {
1017
1124
  "color": DesignToken
1018
1125
  }
@@ -1092,25 +1199,56 @@ declare const tokens: {
1092
1199
  }
1093
1200
  },
1094
1201
  "switch": {
1095
- "font-family": DesignToken,
1096
1202
  "background-color": DesignToken,
1097
- "width": DesignToken,
1203
+ "font-family": DesignToken,
1204
+ "outline-offset": DesignToken,
1205
+ "inline-size": DesignToken,
1098
1206
  "thumb": {
1099
1207
  "background-color": DesignToken,
1100
- "width": DesignToken,
1101
- "height": DesignToken,
1208
+ "inline-size": DesignToken,
1209
+ "block-size": DesignToken,
1102
1210
  "hover": {
1211
+ "box-shadow": DesignToken,
1103
1212
  "color": DesignToken
1104
1213
  }
1105
1214
  },
1106
1215
  "checked": {
1107
1216
  "background-color": DesignToken
1108
1217
  },
1109
- "outline-offset": DesignToken,
1110
1218
  "disabled": {
1111
1219
  "background-color": DesignToken
1112
1220
  }
1113
1221
  },
1222
+ "table-of-contents": {
1223
+ "font-family": DesignToken,
1224
+ "font-size": DesignToken,
1225
+ "font-weight": DesignToken,
1226
+ "gap": DesignToken,
1227
+ "line-height": DesignToken,
1228
+ "link": {
1229
+ "color": DesignToken,
1230
+ "outline-offset": DesignToken,
1231
+ "text-decoration-line": DesignToken,
1232
+ "text-decoration-thickness": DesignToken,
1233
+ "text-underline-offset": DesignToken,
1234
+ "hover": {
1235
+ "color": DesignToken,
1236
+ "text-decoration-line": DesignToken
1237
+ }
1238
+ },
1239
+ "list": {
1240
+ "gap": DesignToken,
1241
+ "list": {
1242
+ "padding-block-start": DesignToken,
1243
+ "padding-inline-start": DesignToken
1244
+ }
1245
+ },
1246
+ "heading": {
1247
+ "font-weight": DesignToken,
1248
+ "font-size": DesignToken,
1249
+ "line-height": DesignToken
1250
+ }
1251
+ },
1114
1252
  "table": {
1115
1253
  "color": DesignToken,
1116
1254
  "font-family": DesignToken,
@@ -1121,7 +1259,7 @@ declare const tokens: {
1121
1259
  "font-weight": DesignToken
1122
1260
  },
1123
1261
  "cell": {
1124
- "border-bottom": DesignToken,
1262
+ "border-block-end": DesignToken,
1125
1263
  "padding-block": DesignToken,
1126
1264
  "padding-inline": DesignToken
1127
1265
  },
@@ -1132,7 +1270,7 @@ declare const tokens: {
1132
1270
  "tabs": {
1133
1271
  "list": {
1134
1272
  "background-color": DesignToken,
1135
- "border-bottom": DesignToken
1273
+ "border-block-end": DesignToken
1136
1274
  },
1137
1275
  "button": {
1138
1276
  "color": DesignToken,
@@ -1166,7 +1304,7 @@ declare const tokens: {
1166
1304
  "font-size": DesignToken,
1167
1305
  "font-weight": DesignToken,
1168
1306
  "line-height": DesignToken,
1169
- "min-height": DesignToken,
1307
+ "min-block-size": DesignToken,
1170
1308
  "outline-offset": DesignToken,
1171
1309
  "padding-block": DesignToken,
1172
1310
  "padding-inline": DesignToken,
@@ -1296,6 +1434,10 @@ declare const tokens: {
1296
1434
  "margin-inline-start": DesignToken,
1297
1435
  "padding-inline-start": DesignToken
1298
1436
  }
1437
+ },
1438
+ "small": {
1439
+ "font-size": DesignToken,
1440
+ "line-height": DesignToken
1299
1441
  }
1300
1442
  }
1301
1443
  }