@amsterdam/design-system-tokens 3.0.0 → 3.2.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 (107) hide show
  1. package/CHANGELOG.md +24 -0
  2. package/README.md +45 -1
  3. package/build.js +25 -35
  4. package/dist/compact.css +2 -2
  5. package/dist/compact.d.ts +3 -3
  6. package/dist/compact.mjs +2 -2
  7. package/dist/compact.scss +2 -2
  8. package/dist/compact.theme.css +2 -2
  9. package/dist/index.css +118 -47
  10. package/dist/index.d.ts +174 -9
  11. package/dist/index.json +197 -32
  12. package/dist/index.mjs +176 -70
  13. package/dist/index.scss +118 -47
  14. package/dist/index.theme.css +118 -47
  15. package/package.json +2 -2
  16. package/src/brand/ams/aspect-ratio.tokens.json +18 -6
  17. package/src/brand/ams/border.compact.tokens.json +36 -4
  18. package/src/brand/ams/border.tokens.json +36 -4
  19. package/src/brand/ams/color.deprecated.tokens.json +3 -2
  20. package/src/brand/ams/color.tokens.json +106 -23
  21. package/src/brand/ams/cursor.tokens.json +6 -2
  22. package/src/brand/ams/focus.tokens.json +10 -1
  23. package/src/brand/ams/space.compact.tokens.json +30 -6
  24. package/src/brand/ams/space.tokens.json +24 -6
  25. package/src/brand/ams/typography.compact.tokens.json +110 -18
  26. package/src/brand/ams/typography.deprecated.compact.tokens.json +10 -4
  27. package/src/brand/ams/typography.deprecated.tokens.json +20 -8
  28. package/src/brand/ams/typography.tokens.json +131 -24
  29. package/src/common/ams/inputs.tokens.json +121 -18
  30. package/src/common/ams/links.tokens.json +72 -12
  31. package/src/components/ams/accordion.deprecated.tokens.json +29 -7
  32. package/src/components/ams/accordion.tokens.json +46 -8
  33. package/src/components/ams/action-group.tokens.json +7 -1
  34. package/src/components/ams/alert.tokens.json +83 -16
  35. package/src/components/ams/avatar.tokens.json +139 -31
  36. package/src/components/ams/badge.tokens.json +98 -21
  37. package/src/components/ams/blockquote.tokens.json +28 -6
  38. package/src/components/ams/breadcrumb.tokens.json +68 -15
  39. package/src/components/ams/button.tokens.json +176 -34
  40. package/src/components/ams/call-to-action-link.tokens.json +73 -14
  41. package/src/components/ams/card.tokens.json +60 -11
  42. package/src/components/ams/character-count.tokens.json +28 -6
  43. package/src/components/ams/checkbox.deprecated.tokens.json +23 -7
  44. package/src/components/ams/checkbox.tokens.json +154 -36
  45. package/src/components/ams/column.tokens.json +35 -5
  46. package/src/components/ams/date-input.deprecated.tokens.json +14 -8
  47. package/src/components/ams/date-input.tokens.json +92 -25
  48. package/src/components/ams/description-list.tokens.json +86 -13
  49. package/src/components/ams/dialog.tokens.json +144 -23
  50. package/src/components/ams/error-message.tokens.json +31 -6
  51. package/src/components/ams/field-set.deprecated.tokens.json +8 -1
  52. package/src/components/ams/field-set.tokens.json +69 -13
  53. package/src/components/ams/field.deprecated.tokens.json +8 -1
  54. package/src/components/ams/field.tokens.json +24 -4
  55. package/src/components/ams/figure.tokens.json +35 -7
  56. package/src/components/ams/file-input.tokens.json +143 -29
  57. package/src/components/ams/file-list.tokens.json +49 -9
  58. package/src/components/ams/grid.compact.tokens.json +7 -1
  59. package/src/components/ams/grid.tokens.json +79 -13
  60. package/src/components/ams/heading.tokens.json +91 -17
  61. package/src/components/ams/hint.tokens.json +8 -2
  62. package/src/components/ams/icon-button.tokens.json +69 -17
  63. package/src/components/ams/icon.deprecated.tokens.json +10 -4
  64. package/src/components/ams/icon.tokens.json +112 -19
  65. package/src/components/ams/image-slider.tokens.json +60 -10
  66. package/src/components/ams/image.tokens.json +3 -1
  67. package/src/components/ams/invalid-form-alert.tokens.json +7 -1
  68. package/src/components/ams/label.tokens.json +31 -7
  69. package/src/components/ams/link-list.tokens.json +106 -21
  70. package/src/components/ams/link.tokens.json +73 -15
  71. package/src/components/ams/logo.tokens.json +23 -5
  72. package/src/components/ams/mark.tokens.json +4 -1
  73. package/src/components/ams/menu.deprecated.tokens.json +12 -8
  74. package/src/components/ams/menu.tokens.json +119 -21
  75. package/src/components/ams/ordered-list.tokens.json +110 -22
  76. package/src/components/ams/page-footer.tokens.json +98 -18
  77. package/src/components/ams/page-header.compact.tokens.json +19 -3
  78. package/src/components/ams/page-header.tokens.json +214 -34
  79. package/src/components/ams/page-heading.deprecated.tokens.json +38 -8
  80. package/src/components/ams/page.tokens.json +24 -5
  81. package/src/components/ams/pagination.tokens.json +70 -14
  82. package/src/components/ams/paragraph.tokens.json +55 -11
  83. package/src/components/ams/password-input.tokens.json +92 -19
  84. package/src/components/ams/progress-list.tokens.json +372 -0
  85. package/src/components/ams/radio.tokens.json +142 -33
  86. package/src/components/ams/row.tokens.json +35 -5
  87. package/src/components/ams/search-field.tokens.json +101 -22
  88. package/src/components/ams/select.tokens.json +97 -24
  89. package/src/components/ams/skip-link.tokens.json +53 -10
  90. package/src/components/ams/spotlight.tokens.json +28 -7
  91. package/src/components/ams/standalone-link.deprecated.tokens.json +16 -10
  92. package/src/components/ams/standalone-link.tokens.json +75 -16
  93. package/src/components/ams/switch.tokens.json +57 -12
  94. package/src/components/ams/table-of-contents.deprecated.tokens.json +16 -3
  95. package/src/components/ams/table-of-contents.tokens.json +80 -15
  96. package/src/components/ams/table.tokens.json +49 -10
  97. package/src/components/ams/tabs.tokens.json +130 -17
  98. package/src/components/ams/text-area.tokens.json +97 -20
  99. package/src/components/ams/text-input.tokens.json +90 -19
  100. package/src/components/ams/time-input.deprecated.tokens.json +14 -8
  101. package/src/components/ams/time-input.tokens.json +90 -25
  102. package/src/components/ams/unordered-list.tokens.json +112 -22
  103. package/style-dictionary/dimensionToString.js +25 -0
  104. package/style-dictionary/transforms/dtcg-dimension.js +30 -0
  105. package/style-dictionary/transforms/name-custom-camel.js +27 -0
  106. package/style-dictionary/transforms/name-custom-kebab.js +27 -0
  107. package/style-dictionary/transforms/shadow-dtcg-dimension-normalize.js +50 -0
package/src/brand/ams/color.tokens.json CHANGED
@@ -1,38 +1,121 @@
1
1
  {
2
2
  "ams": {
3
3
  "color": {
4
- "background": { "value": "#ffffff" },
4
+ "background": {
5
+ "$value": "#ffffff",
6
+ "$type": "color"
7
+ },
5
8
  "feedback": {
6
- "error": { "value": "#ec0000" },
7
- "info": { "value": "#009de6" },
8
- "success": { "value": "#00893c" },
9
- "warning": { "value": "#ff9100" }
9
+ "error": {
10
+ "$value": "#ec0000",
11
+ "$type": "color"
12
+ },
13
+ "info": {
14
+ "$value": "#009de6",
15
+ "$type": "color"
16
+ },
17
+ "success": {
18
+ "$value": "#00893c",
19
+ "$type": "color"
20
+ },
21
+ "warning": {
22
+ "$value": "#ff9100",
23
+ "$type": "color"
24
+ }
10
25
  },
11
26
  "highlight": {
12
- "azure": { "value": "#009de6" },
13
- "green": { "value": "#00893c" },
14
- "lime": { "value": "#bed200" },
15
- "magenta": { "value": "#e50082" },
16
- "orange": { "value": "#ff9100" },
17
- "purple": { "value": "#a00078" },
18
- "yellow": { "value": "#ffe600" }
27
+ "azure": {
28
+ "$value": "#009de6",
29
+ "$type": "color"
30
+ },
31
+ "green": {
32
+ "$value": "#00893c",
33
+ "$type": "color"
34
+ },
35
+ "lime": {
36
+ "$value": "#bed200",
37
+ "$type": "color"
38
+ },
39
+ "magenta": {
40
+ "$value": "#e50082",
41
+ "$type": "color"
42
+ },
43
+ "orange": {
44
+ "$value": "#ff9100",
45
+ "$type": "color"
46
+ },
47
+ "purple": {
48
+ "$value": "#a00078",
49
+ "$type": "color"
50
+ },
51
+ "yellow": {
52
+ "$value": "#ffe600",
53
+ "$type": "color"
54
+ }
19
55
  },
20
56
  "interactive": {
21
- "contrast": { "value": "#202020" },
22
- "default": { "value": "#004699" },
23
- "disabled": { "value": "#767676" },
24
- "hover": { "value": "#003677" },
57
+ "contrast": {
58
+ "$value": "#202020",
59
+ "$type": "color"
60
+ },
61
+ "default": {
62
+ "$value": "#004699",
63
+ "$type": "color"
64
+ },
65
+ "disabled": {
66
+ "$value": "#767676",
67
+ "$type": "color"
68
+ },
69
+ "hover": {
70
+ "$value": "#003677",
71
+ "$type": "color"
72
+ },
25
73
  "invalid": {
26
- "default": { "value": "#ec0000" },
27
- "hover": { "value": "#b70000" }
74
+ "default": {
75
+ "$value": "#ec0000",
76
+ "$type": "color"
77
+ },
78
+ "hover": {
79
+ "$value": "#b70000",
80
+ "$type": "color"
81
+ }
82
+ },
83
+ "inverse": {
84
+ "$value": "#ffffff",
85
+ "$type": "color"
86
+ }
87
+ },
88
+ "progress": {
89
+ "current": {
90
+ "$value": "#00893c",
91
+ "$type": "color"
92
+ },
93
+ "completed": {
94
+ "$value": "#00893c",
95
+ "$type": "color"
28
96
  },
29
- "inverse": { "value": "#ffffff" }
97
+ "upcoming": {
98
+ "$value": "#767676",
99
+ "$type": "color"
100
+ }
101
+ },
102
+ "separator": {
103
+ "$value": "#d1d1d1",
104
+ "$type": "color"
30
105
  },
31
- "separator": { "value": "#d1d1d1" },
32
106
  "text": {
33
- "default": { "value": "#202020" },
34
- "inverse": { "value": "#ffffff" },
35
- "secondary": { "value": "#767676" }
107
+ "default": {
108
+ "$value": "#202020",
109
+ "$type": "color"
110
+ },
111
+ "inverse": {
112
+ "$value": "#ffffff",
113
+ "$type": "color"
114
+ },
115
+ "secondary": {
116
+ "$value": "#767676",
117
+ "$type": "color"
118
+ }
36
119
  }
37
120
  }
38
121
  }
package/src/brand/ams/cursor.tokens.json CHANGED
@@ -1,8 +1,12 @@
1
1
  {
2
2
  "ams": {
3
3
  "cursor": {
4
- "disabled": { "value": "not-allowed" },
5
- "interactive": { "value": "pointer" }
4
+ "disabled": {
5
+ "$value": "not-allowed"
6
+ },
7
+ "interactive": {
8
+ "$value": "pointer"
9
+ }
6
10
  }
7
11
  }
8
12
  }
package/src/brand/ams/focus.tokens.json CHANGED
@@ -1,7 +1,16 @@
1
1
  {
2
2
  "ams": {
3
3
  "focus": {
4
- "outline-offset": { "value": "0.25rem" }
4
+ "outline-offset": {
5
+ "$value": {
6
+ "value": 0.25,
7
+ "unit": "rem"
8
+ },
9
+ "$type": "dimension",
10
+ "$extensions": {
11
+ "nl.amsterdam.subtype": "space"
12
+ }
13
+ }
5
14
  }
6
15
  }
7
16
  }
package/src/brand/ams/space.compact.tokens.json CHANGED
@@ -1,12 +1,36 @@
1
1
  {
2
2
  "ams": {
3
3
  "space": {
4
- "xs": { "value": "0.25rem" },
5
- "s": { "value": "0.5rem" },
6
- "m": { "value": "clamp(0.75rem, 0.6786rem + 0.3571vw, 1rem)" },
7
- "l": { "value": "clamp(1rem, 0.8571rem + 0.7143vw, 1.5rem)" },
8
- "xl": { "value": "clamp(1.5rem, 1.2857rem + 1.0714vw, 2.25rem)" },
9
- "2xl": { "value": "clamp(2rem, 1.7143rem + 1.4286vw, 3rem)" }
4
+ "xs": {
5
+ "$value": {
6
+ "value": 0.25,
7
+ "unit": "rem"
8
+ },
9
+ "$type": "dimension"
10
+ },
11
+ "s": {
12
+ "$value": {
13
+ "value": 0.5,
14
+ "unit": "rem"
15
+ },
16
+ "$type": "dimension"
17
+ },
18
+ "m": {
19
+ "$value": "clamp(0.75rem, 0.6786rem + 0.3571vw, 1rem)",
20
+ "$type": "dimension"
21
+ },
22
+ "l": {
23
+ "$value": "clamp(1rem, 0.8571rem + 0.7143vw, 1.5rem)",
24
+ "$type": "dimension"
25
+ },
26
+ "xl": {
27
+ "$value": "clamp(1.5rem, 1.2857rem + 1.0714vw, 2.25rem)",
28
+ "$type": "dimension"
29
+ },
30
+ "2xl": {
31
+ "$value": "clamp(2rem, 1.7143rem + 1.4286vw, 3rem)",
32
+ "$type": "dimension"
33
+ }
10
34
  }
11
35
  }
12
36
  }
package/src/brand/ams/space.tokens.json CHANGED
@@ -1,12 +1,30 @@
1
1
  {
2
2
  "ams": {
3
3
  "space": {
4
- "xs": { "value": "clamp(0.25rem, 0.2143rem + 0.1786vw, 0.375rem)" },
5
- "s": { "value": "clamp(0.5rem, 0.4286rem + 0.3571vw, 0.75rem)" },
6
- "m": { "value": "clamp(1rem, 0.8571rem + 0.7143vw, 1.5rem)" },
7
- "l": { "value": "clamp(1.5rem, 1.2857rem + 1.0714vw, 2.25rem)" },
8
- "xl": { "value": "clamp(2.25rem, 1.8214rem + 2.1429vw, 3.75rem)" },
9
- "2xl": { "value": "clamp(3rem, 2.25rem + 3.75vw, 5.625rem)" }
4
+ "xs": {
5
+ "$value": "clamp(0.25rem, 0.2143rem + 0.1786vw, 0.375rem)",
6
+ "$type": "dimension"
7
+ },
8
+ "s": {
9
+ "$value": "clamp(0.5rem, 0.4286rem + 0.3571vw, 0.75rem)",
10
+ "$type": "dimension"
11
+ },
12
+ "m": {
13
+ "$value": "clamp(1rem, 0.8571rem + 0.7143vw, 1.5rem)",
14
+ "$type": "dimension"
15
+ },
16
+ "l": {
17
+ "$value": "clamp(1.5rem, 1.2857rem + 1.0714vw, 2.25rem)",
18
+ "$type": "dimension"
19
+ },
20
+ "xl": {
21
+ "$value": "clamp(2.25rem, 1.8214rem + 2.1429vw, 3.75rem)",
22
+ "$type": "dimension"
23
+ },
24
+ "2xl": {
25
+ "$value": "clamp(3rem, 2.25rem + 3.75vw, 5.625rem)",
26
+ "$type": "dimension"
27
+ }
10
28
  }
11
29
  }
12
30
  }
package/src/brand/ams/typography.compact.tokens.json CHANGED
@@ -2,41 +2,133 @@
2
2
  "ams": {
3
3
  "typography": {
4
4
  "body-text": {
5
- "font-size": { "value": "1rem" },
6
- "line-height": { "value": "1.5" },
5
+ "font-size": {
6
+ "$value": {
7
+ "value": 1,
8
+ "unit": "rem"
9
+ },
10
+ "$type": "dimension"
11
+ },
12
+ "line-height": {
13
+ "$value": "1.5",
14
+ "$extensions": {
15
+ "nl.amsterdam.type": "lineHeight"
16
+ }
17
+ },
7
18
  "small": {
8
- "font-size": { "value": "0.875rem" },
9
- "line-height": { "value": "1.4" }
19
+ "font-size": {
20
+ "$value": {
21
+ "value": 0.875,
22
+ "unit": "rem"
23
+ },
24
+ "$type": "dimension"
25
+ },
26
+ "line-height": {
27
+ "$value": "1.4",
28
+ "$extensions": {
29
+ "nl.amsterdam.type": "lineHeight"
30
+ }
31
+ }
10
32
  },
11
33
  "large": {
12
- "font-size": { "value": "clamp(1.125rem, 1.1071rem + 0.0893vw, 1.1875rem)" },
13
- "line-height": { "value": "1.4" }
34
+ "font-size": {
35
+ "$value": "clamp(1.125rem, 1.1071rem + 0.0893vw, 1.1875rem)",
36
+ "$extensions": {
37
+ "nl.amsterdam.type": "fontSize"
38
+ }
39
+ },
40
+ "line-height": {
41
+ "$value": "1.4",
42
+ "$extensions": {
43
+ "nl.amsterdam.type": "lineHeight"
44
+ }
45
+ }
14
46
  },
15
47
  "x-large": {
16
- "font-size": { "value": "clamp(1.25rem, 1.1964rem + 0.2679vw, 1.4375rem)" },
17
- "line-height": { "value": "1.3" }
48
+ "font-size": {
49
+ "$value": "clamp(1.25rem, 1.1964rem + 0.2679vw, 1.4375rem)",
50
+ "$extensions": {
51
+ "nl.amsterdam.type": "fontSize"
52
+ }
53
+ },
54
+ "line-height": {
55
+ "$value": "1.3",
56
+ "$extensions": {
57
+ "nl.amsterdam.type": "lineHeight"
58
+ }
59
+ }
18
60
  }
19
61
  },
20
62
  "heading": {
21
63
  "1": {
22
- "font-size": { "value": "clamp(1.5rem, 1.4286rem + 0.3571vw, 1.75rem)" },
23
- "line-height": { "value": "1.2" }
64
+ "font-size": {
65
+ "$value": "clamp(1.5rem, 1.4286rem + 0.3571vw, 1.75rem)",
66
+ "$extensions": {
67
+ "nl.amsterdam.type": "fontSize"
68
+ }
69
+ },
70
+ "line-height": {
71
+ "$value": "1.2",
72
+ "$extensions": {
73
+ "nl.amsterdam.type": "lineHeight"
74
+ }
75
+ }
24
76
  },
25
77
  "2": {
26
- "font-size": { "value": "{ams.typography.body-text.x-large.font-size}" },
27
- "line-height": { "value": "1.3" }
78
+ "font-size": {
79
+ "$value": "{ams.typography.body-text.x-large.font-size}",
80
+ "$extensions": {
81
+ "nl.amsterdam.type": "fontSize"
82
+ }
83
+ },
84
+ "line-height": {
85
+ "$value": "1.3",
86
+ "$extensions": {
87
+ "nl.amsterdam.type": "lineHeight"
88
+ }
89
+ }
28
90
  },
29
91
  "3": {
30
- "font-size": { "value": "{ams.typography.body-text.large.font-size}" },
31
- "line-height": { "value": "1.3" }
92
+ "font-size": {
93
+ "$value": "{ams.typography.body-text.large.font-size}",
94
+ "$extensions": {
95
+ "nl.amsterdam.type": "fontSize"
96
+ }
97
+ },
98
+ "line-height": {
99
+ "$value": "1.3",
100
+ "$extensions": {
101
+ "nl.amsterdam.type": "lineHeight"
102
+ }
103
+ }
32
104
  },
33
105
  "4": {
34
- "font-size": { "value": "{ams.typography.body-text.font-size}" },
35
- "line-height": { "value": "1.4" }
106
+ "font-size": {
107
+ "$value": "{ams.typography.body-text.font-size}",
108
+ "$extensions": {
109
+ "nl.amsterdam.type": "fontSize"
110
+ }
111
+ },
112
+ "line-height": {
113
+ "$value": "1.4",
114
+ "$extensions": {
115
+ "nl.amsterdam.type": "lineHeight"
116
+ }
117
+ }
36
118
  },
37
119
  "5": {
38
- "font-size": { "value": "{ams.typography.body-text.small.font-size}" },
39
- "line-height": { "value": "1.4" }
120
+ "font-size": {
121
+ "$value": "{ams.typography.body-text.small.font-size}",
122
+ "$extensions": {
123
+ "nl.amsterdam.type": "fontSize"
124
+ }
125
+ },
126
+ "line-height": {
127
+ "$value": "1.4",
128
+ "$extensions": {
129
+ "nl.amsterdam.type": "lineHeight"
130
+ }
131
+ }
40
132
  }
41
133
  }
42
134
  }
package/src/brand/ams/typography.deprecated.compact.tokens.json CHANGED
@@ -4,14 +4,20 @@
4
4
  "heading": {
5
5
  "0": {
6
6
  "font-size": {
7
- "comment": "Use Heading size 1 instead.",
8
- "value": "clamp(2.1645rem, 2.072rem + 0.4626vw, 2.4883rem)"
7
+ "$deprecated": "Use `ams.typography.heading.1.font-size` instead.",
8
+ "$value": "clamp(2.1645rem, 2.072rem + 0.4626vw, 2.4883rem)",
9
+ "$extensions": {
10
+ "nl.amsterdam.type": "fontSize"
11
+ }
9
12
  }
10
13
  },
11
14
  "6": {
12
15
  "font-size": {
13
- "comment": "Use Heading size 5 instead.",
14
- "value": "{ams.typography.body-text.small.font-size}"
16
+ "$deprecated": "Use `ams.typography.heading.5.font-size` instead.",
17
+ "$value": "{ams.typography.body-text.small.font-size}",
18
+ "$extensions": {
19
+ "nl.amsterdam.type": "fontSize"
20
+ }
15
21
  }
16
22
  }
17
23
  }
package/src/brand/ams/typography.deprecated.tokens.json CHANGED
@@ -4,22 +4,34 @@
4
4
  "heading": {
5
5
  "0": {
6
6
  "font-size": {
7
- "comment": "Use Heading size 1 instead.",
8
- "value": "clamp(2.435rem, 2.0409rem + 1.9709vw, 3.8147rem)"
7
+ "$deprecated": "Use `ams.typography.heading.1.font-size` instead.",
8
+ "$value": "clamp(2.435rem, 2.0409rem + 1.9709vw, 3.8147rem)",
9
+ "$extensions": {
10
+ "nl.amsterdam.type": "fontSize"
11
+ }
9
12
  },
10
13
  "line-height": {
11
- "comment": "Use Heading size 1 instead.",
12
- "value": "1.1"
14
+ "$deprecated": "Use `ams.typography.heading.1.line-height` instead.",
15
+ "$value": "1.1",
16
+ "$extensions": {
17
+ "nl.amsterdam.type": "lineHeight"
18
+ }
13
19
  }
14
20
  },
15
21
  "6": {
16
22
  "font-size": {
17
- "comment": "Use Heading size 5 instead.",
18
- "value": "{ams.typography.body-text.small.font-size}"
23
+ "$deprecated": "Use `ams.typography.heading.5.font-size` instead.",
24
+ "$value": "{ams.typography.body-text.small.font-size}",
25
+ "$extensions": {
26
+ "nl.amsterdam.type": "fontSize"
27
+ }
19
28
  },
20
29
  "line-height": {
21
- "comment": "Use Heading size 5 instead.",
22
- "value": "1.4"
30
+ "$deprecated": "Use `ams.typography.heading.5.line-height` instead.",
31
+ "$value": "1.4",
32
+ "$extensions": {
33
+ "nl.amsterdam.type": "lineHeight"
34
+ }
23
35
  }
24
36
  }
25
37
  }
package/src/brand/ams/typography.tokens.json CHANGED
@@ -1,50 +1,157 @@
1
1
  {
2
2
  "ams": {
3
3
  "typography": {
4
- "font-family": { "value": "'Amsterdam Sans', Arial, sans-serif" },
5
- "hyphenate-limit-chars": { "value": "12 8 4" },
4
+ "font-family": {
5
+ "$value": "'Amsterdam Sans', Arial, sans-serif",
6
+ "$type": "fontFamily"
7
+ },
8
+ "hyphenate-limit-chars": {
9
+ "$value": "auto"
10
+ },
6
11
  "body-text": {
7
- "font-size": { "value": "clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem)" },
8
- "font-weight": { "value": "400" },
9
- "line-height": { "value": "1.8" },
12
+ "font-size": {
13
+ "$value": "clamp(1.125rem, 1.0893rem + 0.1786vw, 1.25rem)",
14
+ "$extensions": {
15
+ "nl.amsterdam.type": "fontSize"
16
+ }
17
+ },
18
+ "font-weight": {
19
+ "$value": "400",
20
+ "$type": "fontWeight"
21
+ },
22
+ "line-height": {
23
+ "$value": "1.8",
24
+ "$extensions": {
25
+ "nl.amsterdam.type": "lineHeight"
26
+ }
27
+ },
10
28
  "bold": {
11
- "font-weight": { "value": "800" }
29
+ "font-weight": {
30
+ "$value": "800",
31
+ "$type": "fontWeight"
32
+ }
12
33
  },
13
34
  "small": {
14
- "font-size": { "value": "1rem" },
15
- "line-height": { "value": "1.6" }
35
+ "font-size": {
36
+ "$value": {
37
+ "value": 1,
38
+ "unit": "rem"
39
+ },
40
+ "$type": "dimension"
41
+ },
42
+ "line-height": {
43
+ "$value": "1.6",
44
+ "$extensions": {
45
+ "nl.amsterdam.type": "lineHeight"
46
+ }
47
+ }
16
48
  },
17
49
  "large": {
18
- "font-size": { "value": "clamp(1.3125rem, 1.2411rem + 0.3571vw, 1.5625rem)" },
19
- "line-height": { "value": "1.6" }
50
+ "font-size": {
51
+ "$value": "clamp(1.3125rem, 1.2411rem + 0.3571vw, 1.5625rem)",
52
+ "$extensions": {
53
+ "nl.amsterdam.type": "fontSize"
54
+ }
55
+ },
56
+ "line-height": {
57
+ "$value": "1.6",
58
+ "$extensions": {
59
+ "nl.amsterdam.type": "lineHeight"
60
+ }
61
+ }
20
62
  },
21
63
  "x-large": {
22
- "font-size": { "value": "clamp(1.5rem, 1.3571rem + 0.7143vw, 2rem)" },
23
- "line-height": { "value": "1.4" }
64
+ "font-size": {
65
+ "$value": "clamp(1.5rem, 1.3571rem + 0.7143vw, 2rem)",
66
+ "$extensions": {
67
+ "nl.amsterdam.type": "fontSize"
68
+ }
69
+ },
70
+ "line-height": {
71
+ "$value": "1.4",
72
+ "$extensions": {
73
+ "nl.amsterdam.type": "lineHeight"
74
+ }
75
+ }
24
76
  }
25
77
  },
26
78
  "heading": {
27
- "font-weight": { "value": "800" },
28
- "text-wrap": { "value": "balance" },
79
+ "font-weight": {
80
+ "$value": "800",
81
+ "$type": "fontWeight"
82
+ },
83
+ "text-wrap": {
84
+ "$value": "balance"
85
+ },
29
86
  "1": {
30
- "font-size": { "value": "clamp(2rem, 1.7143rem + 1.4286vw, 3rem)" },
31
- "line-height": { "value": "1.2" }
87
+ "font-size": {
88
+ "$value": "clamp(2rem, 1.7143rem + 1.4286vw, 3rem)",
89
+ "$extensions": {
90
+ "nl.amsterdam.type": "fontSize"
91
+ }
92
+ },
93
+ "line-height": {
94
+ "$value": "1.2",
95
+ "$extensions": {
96
+ "nl.amsterdam.type": "lineHeight"
97
+ }
98
+ }
32
99
  },
33
100
  "2": {
34
- "font-size": { "value": "{ams.typography.body-text.x-large.font-size}" },
35
- "line-height": { "value": "1.3" }
101
+ "font-size": {
102
+ "$value": "{ams.typography.body-text.x-large.font-size}",
103
+ "$extensions": {
104
+ "nl.amsterdam.type": "fontSize"
105
+ }
106
+ },
107
+ "line-height": {
108
+ "$value": "1.3",
109
+ "$extensions": {
110
+ "nl.amsterdam.type": "lineHeight"
111
+ }
112
+ }
36
113
  },
37
114
  "3": {
38
- "font-size": { "value": "{ams.typography.body-text.large.font-size}" },
39
- "line-height": { "value": "1.3" }
115
+ "font-size": {
116
+ "$value": "{ams.typography.body-text.large.font-size}",
117
+ "$extensions": {
118
+ "nl.amsterdam.type": "fontSize"
119
+ }
120
+ },
121
+ "line-height": {
122
+ "$value": "1.3",
123
+ "$extensions": {
124
+ "nl.amsterdam.type": "lineHeight"
125
+ }
126
+ }
40
127
  },
41
128
  "4": {
42
- "font-size": { "value": "{ams.typography.body-text.font-size}" },
43
- "line-height": { "value": "1.4" }
129
+ "font-size": {
130
+ "$value": "{ams.typography.body-text.font-size}",
131
+ "$extensions": {
132
+ "nl.amsterdam.type": "fontSize"
133
+ }
134
+ },
135
+ "line-height": {
136
+ "$value": "1.4",
137
+ "$extensions": {
138
+ "nl.amsterdam.type": "lineHeight"
139
+ }
140
+ }
44
141
  },
45
142
  "5": {
46
- "font-size": { "value": "{ams.typography.body-text.small.font-size}" },
47
- "line-height": { "value": "1.4" }
143
+ "font-size": {
144
+ "$value": "{ams.typography.body-text.small.font-size}",
145
+ "$extensions": {
146
+ "nl.amsterdam.type": "fontSize"
147
+ }
148
+ },
149
+ "line-height": {
150
+ "$value": "1.4",
151
+ "$extensions": {
152
+ "nl.amsterdam.type": "lineHeight"
153
+ }
154
+ }
48
155
  }
49
156
  }
50
157
  }