@amsterdam/design-system-tokens 0.15.0 → 1.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 (54) hide show
  1. package/CHANGELOG.md +61 -0
  2. package/LICENSE.md +2 -2
  3. package/README.md +4 -4
  4. package/dist/compact.css +3 -0
  5. package/dist/compact.d.ts +7 -0
  6. package/dist/compact.json +8 -1
  7. package/dist/compact.mjs +4 -0
  8. package/dist/compact.scss +3 -0
  9. package/dist/compact.theme.css +3 -0
  10. package/dist/index.css +239 -217
  11. package/dist/index.d.ts +292 -250
  12. package/dist/index.json +361 -319
  13. package/dist/index.mjs +293 -273
  14. package/dist/index.scss +231 -209
  15. package/dist/index.theme.css +239 -217
  16. package/package.json +3 -3
  17. package/src/brand/ams/focus.tokens.json +1 -1
  18. package/src/brand/ams/typography.compact.tokens.json +2 -1
  19. package/src/brand/ams/typography.tokens.json +1 -0
  20. package/src/components/ams/accordion.tokens.json +1 -0
  21. package/src/components/ams/alert.tokens.json +7 -8
  22. package/src/components/ams/avatar.tokens.json +10 -1
  23. package/src/components/ams/badge.tokens.json +1 -1
  24. package/src/components/ams/button.tokens.json +8 -12
  25. package/src/components/ams/card.tokens.json +8 -2
  26. package/src/components/ams/checkbox.tokens.json +57 -36
  27. package/src/components/ams/date-input.tokens.json +9 -8
  28. package/src/components/ams/dialog.tokens.json +25 -8
  29. package/src/components/ams/field-set.tokens.json +2 -1
  30. package/src/components/ams/file-input.tokens.json +8 -11
  31. package/src/components/ams/grid.tokens.json +6 -6
  32. package/src/components/ams/heading.tokens.json +1 -0
  33. package/src/components/ams/hint.tokens.json +1 -1
  34. package/src/components/ams/label.tokens.json +2 -1
  35. package/src/components/ams/link.tokens.json +8 -27
  36. package/src/components/ams/{footer.tokens.json → page-footer.tokens.json} +7 -1
  37. package/src/components/ams/page-header.compact.tokens.json +10 -0
  38. package/src/components/ams/{header.tokens.json → page-header.tokens.json} +10 -2
  39. package/src/components/ams/page-heading.tokens.json +1 -0
  40. package/src/components/ams/page.tokens.json +8 -0
  41. package/src/components/ams/password-input.tokens.json +7 -6
  42. package/src/components/ams/radio.tokens.json +0 -2
  43. package/src/components/ams/search-field.tokens.json +7 -4
  44. package/src/components/ams/select.tokens.json +11 -6
  45. package/src/components/ams/standalone-link.tokens.json +40 -0
  46. package/src/components/ams/switch.tokens.json +2 -2
  47. package/src/components/ams/tabs.tokens.json +3 -3
  48. package/src/components/ams/text-area.tokens.json +7 -6
  49. package/src/components/ams/text-input.tokens.json +7 -6
  50. package/src/components/ams/time-input.tokens.json +9 -8
  51. package/src/components/ams/mega-menu.tokens.json +0 -18
  52. package/src/components/ams/page-menu.tokens.json +0 -24
  53. package/src/components/ams/screen.tokens.json +0 -13
  54. package/src/components/ams/top-task-link.tokens.json +0 -29
package/src/components/ams/{footer.tokens.json → page-footer.tokens.json} RENAMED
@@ -1,11 +1,17 @@
1
1
  {
2
2
  "ams": {
3
- "footer": {
3
+ "page-footer": {
4
4
  "menu": {
5
5
  "column-gap": { "value": "{ams.space.l}" },
6
6
  "padding-block": { "value": "{ams.space.l}" },
7
7
  "padding-inline": { "value": "{ams.grid.padding-inline}" },
8
8
  "row-gap": { "value": "{ams.space.xs}" },
9
+ "medium": {
10
+ "padding-inline": { "value": "{ams.grid.medium.padding-inline}" }
11
+ },
12
+ "wide": {
13
+ "padding-inline": { "value": "{ams.grid.wide.padding-inline}" }
14
+ },
9
15
  "link": {
10
16
  "color": { "value": "{ams.links.color}" },
11
17
  "font-family": { "value": "{ams.typography.font-family}" },
package/src/components/ams/page-header.compact.tokens.json ADDED
@@ -0,0 +1,10 @@
1
+ {
2
+ "ams": {
3
+ "page-header": {
4
+ "brand-name": {
5
+ "font-size": { "value": "{ams.typography.heading.2.font-size}" },
6
+ "line-height": { "value": "{ams.typography.heading.2.line-height}" }
7
+ }
8
+ }
9
+ }
10
+ }
package/src/components/ams/{header.tokens.json → page-header.tokens.json} RENAMED
@@ -1,12 +1,18 @@
1
1
  {
2
2
  "ams": {
3
- "header": {
3
+ "page-header": {
4
4
  "font-family": { "value": "{ams.typography.font-family}" },
5
5
  "padding-block": { "value": "{ams.space.l}" },
6
6
  "padding-inline": {
7
7
  "value": "{ams.grid.padding-inline}",
8
8
  "comment": "Must be the Grid inline padding, to make sure Header and Grid line up"
9
9
  },
10
+ "medium": {
11
+ "padding-inline": { "value": "{ams.grid.medium.padding-inline}" }
12
+ },
13
+ "wide": {
14
+ "padding-inline": { "value": "{ams.grid.wide.padding-inline}" }
15
+ },
10
16
  "logo-link": {
11
17
  "column-gap": { "value": "{ams.space.m}" },
12
18
  "outline-offset": { "value": "{ams.focus.outline-offset}" }
@@ -14,7 +20,9 @@
14
20
  "brand-name": {
15
21
  "color": { "value": "{ams.color.text.default}" },
16
22
  "font-size": { "value": "{ams.typography.heading.4.font-size}" },
17
- "font-weight": { "value": "{ams.typography.heading.font-weight}" }
23
+ "font-weight": { "value": "{ams.typography.heading.font-weight}" },
24
+ "line-height": { "value": "{ams.typography.heading.4.line-height}" },
25
+ "text-wrap": { "value": "{ams.typography.heading.text-wrap}" }
18
26
  },
19
27
  "mega-menu": {
20
28
  "button": {
package/src/components/ams/page-heading.tokens.json CHANGED
@@ -6,6 +6,7 @@
6
6
  "font-size": { "value": "{ams.typography.heading.0.font-size}" },
7
7
  "font-weight": { "value": "{ams.typography.heading.font-weight}" },
8
8
  "line-height": { "value": "{ams.typography.heading.0.line-height}" },
9
+ "text-wrap": { "value": "{ams.typography.heading.text-wrap}" },
9
10
  "inverse": {
10
11
  "color": { "value": "{ams.color.text.inverse}" }
11
12
  }
package/src/components/ams/page.tokens.json ADDED
@@ -0,0 +1,8 @@
1
+ {
2
+ "ams": {
3
+ "page": {
4
+ "background-color": { "value": "{ams.color.background}" },
5
+ "max-inline-size": { "value": "100rem" }
6
+ }
7
+ }
8
+ }
package/src/components/ams/password-input.tokens.json CHANGED
@@ -2,7 +2,9 @@
2
2
  "ams": {
3
3
  "password-input": {
4
4
  "background-color": { "value": "{ams.color.background}" },
5
- "box-shadow": { "value": "inset 0 0 0 {ams.border.width.s} {ams.color.interactive.secondary}" },
5
+ "border-color": { "value": "currentColor" },
6
+ "border-style": { "value": "solid" },
7
+ "border-width": { "value": "{ams.border.width.m}" },
6
8
  "color": { "value": "{ams.color.text.default}" },
7
9
  "font-family": { "value": "{ams.typography.font-family}" },
8
10
  "font-size": { "value": "{ams.typography.body-text.font-size}" },
@@ -12,18 +14,17 @@
12
14
  "padding-block": { "value": "{ams.space.s}" },
13
15
  "padding-inline": { "value": "{ams.space.m}" },
14
16
  "disabled": {
15
- "background-color": { "value": "{ams.color.background}" },
16
- "box-shadow": { "value": "inset 0 0 0 {ams.border.width.s} {ams.color.interactive.disabled}" },
17
17
  "color": { "value": "{ams.color.interactive.disabled}" },
18
18
  "cursor": { "value": "{ams.cursor.disabled}" }
19
19
  },
20
20
  "hover": {
21
- "box-shadow": { "value": "inset 0 0 0 {ams.border.width.m} {ams.color.interactive.secondary}" }
21
+ "box-shadow": { "value": "inset 0 0 0 {ams.border.width.s}" }
22
22
  },
23
23
  "invalid": {
24
- "box-shadow": { "value": "inset 0 0 0 {ams.border.width.s} {ams.color.interactive.invalid.default}" },
24
+ "border-color": { "value": "{ams.color.interactive.invalid.default}" },
25
25
  "hover": {
26
- "box-shadow": { "value": "inset 0 0 0 {ams.border.width.m} {ams.color.interactive.invalid.hover}" }
26
+ "border-color": { "value": "{ams.color.interactive.invalid.hover}" },
27
+ "box-shadow": { "value": "inset 0 0 0 {ams.border.width.s} {ams.color.interactive.invalid.hover}" }
27
28
  }
28
29
  },
29
30
  "placeholder": {
package/src/components/ams/radio.tokens.json CHANGED
@@ -33,7 +33,6 @@
33
33
  }
34
34
  },
35
35
  "hover-indicator": {
36
- "stroke-width": { "value": "3px" },
37
36
  "hover": {
38
37
  "stroke": { "value": "{ams.color.interactive.hover}" }
39
38
  },
@@ -46,7 +45,6 @@
46
45
  "circle": {
47
46
  "fill": { "value": "{ams.color.background}" },
48
47
  "stroke": { "value": "{ams.color.interactive.default}" },
49
- "stroke-width": { "value": "2px" },
50
48
  "disabled": {
51
49
  "stroke": { "value": "{ams.color.interactive.disabled}" }
52
50
  },
package/src/components/ams/search-field.tokens.json CHANGED
@@ -3,7 +3,9 @@
3
3
  "search-field": {
4
4
  "input": {
5
5
  "background-color": { "value": "{ams.color.background}" },
6
- "box-shadow": { "value": "inset 0 0 0 {ams.border.width.s} {ams.color.interactive.secondary}" },
6
+ "border-color": { "value": "currentColor" },
7
+ "border-style": { "value": "solid" },
8
+ "border-width": { "value": "{ams.border.width.m}" },
7
9
  "color": { "value": "{ams.color.text.default}" },
8
10
  "font-family": { "value": "{ams.typography.font-family}" },
9
11
  "font-size": { "value": "{ams.typography.body-text.font-size}" },
@@ -22,12 +24,13 @@
22
24
  "inline-size": { "value": "{ams.typography.body-text.font-size}" }
23
25
  },
24
26
  "hover": {
25
- "box-shadow": { "value": "inset 0 0 0 {ams.border.width.m} {ams.color.interactive.secondary}" }
27
+ "box-shadow": { "value": "inset 0 0 0 {ams.border.width.s}" }
26
28
  },
27
29
  "invalid": {
28
- "box-shadow": { "value": "inset 0 0 0 {ams.border.width.s} {ams.color.interactive.invalid.default}" },
30
+ "border-color": { "value": "{ams.color.interactive.invalid.default}" },
29
31
  "hover": {
30
- "box-shadow": { "value": "inset 0 0 0 {ams.border.width.m} {ams.color.interactive.invalid.hover}" }
32
+ "border-color": { "value": "{ams.color.interactive.invalid.hover}" },
33
+ "box-shadow": { "value": "inset 0 0 0 {ams.border.width.s} {ams.color.interactive.invalid.hover}" }
31
34
  }
32
35
  },
33
36
  "placeholder": {
package/src/components/ams/select.tokens.json CHANGED
@@ -6,7 +6,9 @@
6
6
  "value": "url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><path fill='%23004699' fill-rule='evenodd' d='m16 25.757-16-16 2.91-2.9L16 19.937l13.09-13.08 2.91 2.9z'/></svg>\")"
7
7
  },
8
8
  "background-position": { "value": "right {ams.space.m} center" },
9
- "box-shadow": { "value": "inset 0 0 0 {ams.border.width.s} {ams.color.interactive.secondary}" },
9
+ "border-color": { "value": "currentColor" },
10
+ "border-style": { "value": "solid" },
11
+ "border-width": { "value": "{ams.border.width.m}" },
10
12
  "color": { "value": "{ams.color.text.default}" },
11
13
  "font-family": { "value": "{ams.typography.font-family}" },
12
14
  "font-size": { "value": "{ams.typography.body-text.font-size}" },
@@ -17,19 +19,22 @@
17
19
  "padding-inline": { "value": "{ams.space.m} calc(2 * {ams.space.m} + 1em)" },
18
20
  "disabled": {
19
21
  "background-image": {
20
- "value": "url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><path fill='%23BEBEBE' fill-rule='evenodd' d='m16 25.757-16-16 2.91-2.9L16 19.937l13.09-13.08 2.91 2.9z'/></svg>\")"
22
+ "value": "url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><path fill='%23767676' fill-rule='evenodd' d='m16 25.757-16-16 2.91-2.9L16 19.937l13.09-13.08 2.91 2.9z'/></svg>\")"
21
23
  },
22
- "box-shadow": { "value": "inset 0 0 0 {ams.border.width.s} {ams.color.interactive.disabled}" },
23
24
  "color": { "value": "{ams.color.interactive.disabled}" },
24
25
  "cursor": { "value": "{ams.cursor.disabled}" }
25
26
  },
26
27
  "hover": {
27
- "box-shadow": { "value": "inset 0 0 0 {ams.border.width.m} {ams.color.interactive.secondary}" }
28
+ "box-shadow": { "value": "inset 0 0 0 {ams.border.width.s}" },
29
+ "background-image": {
30
+ "value": "url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><path fill='%23003677' fill-rule='evenodd' d='m16 25.757-16-16 2.91-2.9L16 19.937l13.09-13.08 2.91 2.9z'/></svg>\")"
31
+ }
28
32
  },
29
33
  "invalid": {
30
- "box-shadow": { "value": "inset 0 0 0 {ams.border.width.s} {ams.color.interactive.invalid.default}" },
34
+ "border-color": { "value": "{ams.color.interactive.invalid.default}" },
31
35
  "hover": {
32
- "box-shadow": { "value": "inset 0 0 0 {ams.border.width.m} {ams.color.interactive.invalid.hover}" }
36
+ "border-color": { "value": "{ams.color.interactive.invalid.hover}" },
37
+ "box-shadow": { "value": "inset 0 0 0 {ams.border.width.s} {ams.color.interactive.invalid.hover}" }
33
38
  }
34
39
  },
35
40
  "option": {
package/src/components/ams/standalone-link.tokens.json ADDED
@@ -0,0 +1,40 @@
1
+ {
2
+ "ams": {
3
+ "standalone-link": {
4
+ "color": { "value": "{ams.links.color}" },
5
+ "column-gap": { "value": "{ams.space.s}" },
6
+ "font-family": { "value": "{ams.typography.font-family}" },
7
+ "font-size": { "value": "{ams.typography.body-text.font-size}" },
8
+ "font-weight": { "value": "{ams.typography.body-text.font-weight}" },
9
+ "line-height": { "value": "{ams.typography.body-text.line-height}" },
10
+ "outline-offset": { "value": "{ams.focus.outline-offset}" },
11
+ "text-decoration-thickness": { "value": "{ams.links.text-decoration-thickness}" },
12
+ "text-underline-offset": { "value": "{ams.links.text-underline-offset}" },
13
+ "contrast": {
14
+ "color": { "value": "{ams.links.contrast.color}" },
15
+ "hover": {
16
+ "color": { "value": "{ams.links.contrast.hover.color}" }
17
+ }
18
+ },
19
+ "hover": {
20
+ "color": { "value": "{ams.links.hover.color}" },
21
+ "text-decoration-thickness": {
22
+ "value": "{ams.links.hover.text-decoration-thickness}"
23
+ },
24
+ "text-underline-offset": { "value": "{ams.links.hover.text-underline-offset}" }
25
+ },
26
+ "inverse": {
27
+ "color": { "value": "{ams.links.inverse.color}" },
28
+ "hover": {
29
+ "color": { "value": "{ams.links.inverse.hover.color}" }
30
+ }
31
+ },
32
+ "with-icon": {
33
+ "text-decoration-line": { "value": "{ams.links.subtle.text-decoration-line}" },
34
+ "hover": {
35
+ "text-decoration-line": { "value": "{ams.links.subtle.hover.text-decoration-line}" }
36
+ }
37
+ }
38
+ }
39
+ }
40
+ }
package/src/components/ams/switch.tokens.json CHANGED
@@ -7,10 +7,10 @@
7
7
  "inline-size": { "value": "3.5rem" },
8
8
  "thumb": {
9
9
  "background-color": { "value": "{ams.color.background}" },
10
- "inline-size": { "value": "1.75rem" },
11
10
  "block-size": { "value": "1.75rem" },
11
+ "inline-size": { "value": "1.75rem" },
12
12
  "hover": {
13
- "box-shadow": { "value": "0 0 0 0.125rem {ams.switch.thumb.hover.color}" },
13
+ "box-shadow": { "value": "0 0 0 {ams.border.width.m} {ams.switch.thumb.hover.color}" },
14
14
  "color": { "value": "{ams.color.interactive.hover}" }
15
15
  }
16
16
  },
package/src/components/ams/tabs.tokens.json CHANGED
@@ -12,12 +12,12 @@
12
12
  "font-size": { "value": "{ams.typography.body-text.font-size}" },
13
13
  "font-weight": { "value": "{ams.typography.body-text.font-weight}" },
14
14
  "line-height": { "value": "{ams.typography.body-text.line-height}" },
15
- "outline-offset": { "value": "-0.25rem" },
15
+ "outline-offset": { "value": "calc({ams.focus.outline-offset} * -1)" },
16
16
  "padding-block": { "value": "{ams.space.s}" },
17
17
  "padding-inline": { "value": "{ams.space.m}" },
18
18
  "hover": {
19
- "color": { "value": "{ams.color.interactive.hover}" },
20
- "box-shadow": { "value": "inset 0 calc({ams.border.width.m} * -1)" }
19
+ "box-shadow": { "value": "inset 0 calc({ams.border.width.m} * -1)" },
20
+ "color": { "value": "{ams.color.interactive.hover}" }
21
21
  },
22
22
  "selected": {
23
23
  "box-shadow": { "value": "inset 0 calc({ams.border.width.xl} * -1)" },
package/src/components/ams/text-area.tokens.json CHANGED
@@ -2,7 +2,9 @@
2
2
  "ams": {
3
3
  "text-area": {
4
4
  "background-color": { "value": "{ams.color.background}" },
5
- "box-shadow": { "value": "inset 0 0 0 {ams.border.width.s} {ams.color.interactive.secondary}" },
5
+ "border-color": { "value": "currentColor" },
6
+ "border-style": { "value": "solid" },
7
+ "border-width": { "value": "{ams.border.width.m}" },
6
8
  "color": { "value": "{ams.color.text.default}" },
7
9
  "font-family": { "value": "{ams.typography.font-family}" },
8
10
  "font-size": { "value": "{ams.typography.body-text.font-size}" },
@@ -15,18 +17,17 @@
15
17
  "padding-block": { "value": "{ams.space.s}" },
16
18
  "padding-inline": { "value": "{ams.space.m}" },
17
19
  "disabled": {
18
- "background-color": { "value": "{ams.color.background}" },
19
- "box-shadow": { "value": "inset 0 0 0 {ams.border.width.s} {ams.color.interactive.disabled}" },
20
20
  "color": { "value": "{ams.color.interactive.disabled}" },
21
21
  "cursor": { "value": "{ams.cursor.disabled}" }
22
22
  },
23
23
  "hover": {
24
- "box-shadow": { "value": "inset 0 0 0 {ams.border.width.m} {ams.color.interactive.secondary}" }
24
+ "box-shadow": { "value": "inset 0 0 0 {ams.border.width.s}" }
25
25
  },
26
26
  "invalid": {
27
- "box-shadow": { "value": "inset 0 0 0 {ams.border.width.s} {ams.color.interactive.invalid.default}" },
27
+ "border-color": { "value": "{ams.color.interactive.invalid.default}" },
28
28
  "hover": {
29
- "box-shadow": { "value": "inset 0 0 0 {ams.border.width.m} {ams.color.interactive.invalid.hover}" }
29
+ "border-color": { "value": "{ams.color.interactive.invalid.hover}" },
30
+ "box-shadow": { "value": "inset 0 0 0 {ams.border.width.s} {ams.color.interactive.invalid.hover}" }
30
31
  }
31
32
  },
32
33
  "placeholder": {
package/src/components/ams/text-input.tokens.json CHANGED
@@ -2,7 +2,9 @@
2
2
  "ams": {
3
3
  "text-input": {
4
4
  "background-color": { "value": "{ams.color.background}" },
5
- "box-shadow": { "value": "inset 0 0 0 {ams.border.width.s} {ams.color.interactive.secondary}" },
5
+ "border-color": { "value": "currentColor" },
6
+ "border-style": { "value": "solid" },
7
+ "border-width": { "value": "{ams.border.width.m}" },
6
8
  "color": { "value": "{ams.color.text.default}" },
7
9
  "font-family": { "value": "{ams.typography.font-family}" },
8
10
  "font-size": { "value": "{ams.typography.body-text.font-size}" },
@@ -12,18 +14,17 @@
12
14
  "padding-block": { "value": "{ams.space.s}" },
13
15
  "padding-inline": { "value": "{ams.space.m}" },
14
16
  "disabled": {
15
- "background-color": { "value": "{ams.color.background}" },
16
- "box-shadow": { "value": "inset 0 0 0 {ams.border.width.s} {ams.color.interactive.disabled}" },
17
17
  "color": { "value": "{ams.color.interactive.disabled}" },
18
18
  "cursor": { "value": "{ams.cursor.disabled}" }
19
19
  },
20
20
  "hover": {
21
- "box-shadow": { "value": "inset 0 0 0 {ams.border.width.m} {ams.color.interactive.secondary}" }
21
+ "box-shadow": { "value": "inset 0 0 0 {ams.border.width.s}" }
22
22
  },
23
23
  "invalid": {
24
- "box-shadow": { "value": "inset 0 0 0 {ams.border.width.s} {ams.color.interactive.invalid.default}" },
24
+ "border-color": { "value": "{ams.color.interactive.invalid.default}" },
25
25
  "hover": {
26
- "box-shadow": { "value": "inset 0 0 0 {ams.border.width.m} {ams.color.interactive.invalid.hover}" }
26
+ "border-color": { "value": "{ams.color.interactive.invalid.hover}" },
27
+ "box-shadow": { "value": "inset 0 0 0 {ams.border.width.s} {ams.color.interactive.invalid.hover}" }
27
28
  }
28
29
  },
29
30
  "placeholder": {
package/src/components/ams/time-input.tokens.json CHANGED
@@ -2,7 +2,9 @@
2
2
  "ams": {
3
3
  "time-input": {
4
4
  "background-color": { "value": "{ams.color.background}" },
5
- "box-shadow": { "value": "inset 0 0 0 {ams.border.width.s} {ams.color.interactive.secondary}" },
5
+ "border-color": { "value": "currentColor" },
6
+ "border-style": { "value": "solid" },
7
+ "border-width": { "value": "{ams.border.width.m}" },
6
8
  "color": { "value": "{ams.color.text.default}" },
7
9
  "font-family": { "value": "{ams.typography.font-family}" },
8
10
  "font-size": { "value": "{ams.typography.body-text.font-size}" },
@@ -18,28 +20,27 @@
18
20
  "cursor": { "value": "{ams.cursor.interactive}" }
19
21
  },
20
22
  "disabled": {
21
- "background-color": { "value": "{ams.color.background}" },
22
- "box-shadow": { "value": "inset 0 0 0 {ams.border.width.s} {ams.color.interactive.disabled}" },
23
23
  "color": { "value": "{ams.color.interactive.disabled}" },
24
24
  "cursor": { "value": "{ams.cursor.disabled}" },
25
25
  "calender-picker-indicator": {
26
26
  "background-image": {
27
- "value": "url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='%23BEBEBE'><path d='M16 0C7.163 0 0 7.163 0 16s7.163 16 16 16 16-7.163 16-16A16 16 0 0 0 16 0zm.9 28v-2h-2v1.9A11.8 11.8 0 0 1 4.1 17H6v-2H4.1A11.8 11.8 0 0 1 15 4.1V6h2V4.1A11.8 11.8 0 0 1 27.9 15H26v2h1.9a11.9 11.9 0 0 1-11 11zm.1-13h4v2h-6V9h2v6z'/></svg>\")"
27
+ "value": "url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='%23767676'><path d='M16 0C7.163 0 0 7.163 0 16s7.163 16 16 16 16-7.163 16-16A16 16 0 0 0 16 0zm.9 28v-2h-2v1.9A11.8 11.8 0 0 1 4.1 17H6v-2H4.1A11.8 11.8 0 0 1 15 4.1V6h2V4.1A11.8 11.8 0 0 1 27.9 15H26v2h1.9a11.9 11.9 0 0 1-11 11zm.1-13h4v2h-6V9h2v6z'/></svg>\")"
28
28
  }
29
29
  }
30
30
  },
31
31
  "hover": {
32
- "box-shadow": { "value": "inset 0 0 0 {ams.border.width.m} {ams.color.interactive.secondary}" },
32
+ "box-shadow": { "value": "inset 0 0 0 {ams.border.width.s}" },
33
33
  "calender-picker-indicator": {
34
34
  "background-image": {
35
- "value": "url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='%23102E62'><path d='M16 0C7.163 0 0 7.163 0 16s7.163 16 16 16 16-7.163 16-16A16 16 0 0 0 16 0zm.9 28v-2h-2v1.9A11.8 11.8 0 0 1 4.1 17H6v-2H4.1A11.8 11.8 0 0 1 15 4.1V6h2V4.1A11.8 11.8 0 0 1 27.9 15H26v2h1.9a11.9 11.9 0 0 1-11 11zm.1-13h4v2h-6V9h2v6z'/></svg>\")"
35
+ "value": "url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='%23003677'><path d='M16 0C7.163 0 0 7.163 0 16s7.163 16 16 16 16-7.163 16-16A16 16 0 0 0 16 0zm.9 28v-2h-2v1.9A11.8 11.8 0 0 1 4.1 17H6v-2H4.1A11.8 11.8 0 0 1 15 4.1V6h2V4.1A11.8 11.8 0 0 1 27.9 15H26v2h1.9a11.9 11.9 0 0 1-11 11zm.1-13h4v2h-6V9h2v6z'/></svg>\")"
36
36
  }
37
37
  }
38
38
  },
39
39
  "invalid": {
40
- "box-shadow": { "value": "inset 0 0 0 {ams.border.width.s} {ams.color.interactive.invalid.default}" },
40
+ "border-color": { "value": "{ams.color.interactive.invalid.default}" },
41
41
  "hover": {
42
- "box-shadow": { "value": "inset 0 0 0 {ams.border.width.m} {ams.color.interactive.invalid.hover}" }
42
+ "border-color": { "value": "{ams.color.interactive.invalid.hover}" },
43
+ "box-shadow": { "value": "inset 0 0 0 {ams.border.width.s} {ams.color.interactive.invalid.hover}" }
43
44
  }
44
45
  }
45
46
  }
package/src/components/ams/mega-menu.tokens.json DELETED
@@ -1,18 +0,0 @@
1
- {
2
- "ams": {
3
- "mega-menu": {
4
- "list-category": {
5
- "column-gap": {
6
- "value": "{ams.space.xl}",
7
- "comment": "Must have the same value as `ams.grid.column-gap`."
8
- },
9
- "column-width": { "value": "20rem" },
10
- "padding-block-start": { "value": "{ams.space.m}" },
11
- "padding-block-end": {
12
- "value": "{ams.space.xl}",
13
- "comment": "Must have the same value as `ams.grid.row-gap.md`."
14
- }
15
- }
16
- }
17
- }
18
- }
package/src/components/ams/page-menu.tokens.json DELETED
@@ -1,24 +0,0 @@
1
- {
2
- "ams": {
3
- "page-menu": {
4
- "column-gap": { "value": "{ams.space.xl}" },
5
- "row-gap": { "value": "{ams.space.m}" },
6
- "item": {
7
- "color": { "value": "{ams.links.color}" },
8
- "font-family": { "value": "{ams.typography.font-family}" },
9
- "font-size": { "value": "{ams.typography.body-text.small.font-size}" },
10
- "font-weight": { "value": "{ams.typography.body-text.font-weight}" },
11
- "gap": { "value": "{ams.space.s}" },
12
- "line-height": { "value": "{ams.typography.body-text.small.line-height}" },
13
- "outline-offset": { "value": "{ams.focus.outline-offset}" },
14
- "text-decoration-line": { "value": "{ams.links.subtle.text-decoration-line}" },
15
- "text-decoration-thickness": { "value": "{ams.links.text-decoration-thickness}" },
16
- "text-underline-offset": { "value": "{ams.links.text-underline-offset}" },
17
- "hover": {
18
- "color": { "value": "{ams.links.hover.color}" },
19
- "text-decoration-line": { "value": "{ams.links.subtle.hover.text-decoration-line}" }
20
- }
21
- }
22
- }
23
- }
24
- }
package/src/components/ams/screen.tokens.json DELETED
@@ -1,13 +0,0 @@
1
- {
2
- "ams": {
3
- "screen": {
4
- "background-color": { "value": "{ams.color.background}" },
5
- "wide": {
6
- "max-inline-size": { "value": "100rem" }
7
- },
8
- "x-wide": {
9
- "max-inline-size": { "value": "132rem" }
10
- }
11
- }
12
- }
13
- }
package/src/components/ams/top-task-link.tokens.json DELETED
@@ -1,29 +0,0 @@
1
- {
2
- "ams": {
3
- "top-task-link": {
4
- "gap": { "value": "{ams.space.s}" },
5
- "description": {
6
- "color": { "value": "{ams.color.text.default}" },
7
- "font-family": { "value": "{ams.typography.font-family}" },
8
- "font-size": { "value": "{ams.typography.body-text.small.font-size}" },
9
- "font-weight": { "value": "{ams.typography.body-text.font-weight}" },
10
- "line-height": { "value": "{ams.typography.body-text.small.line-height}" }
11
- },
12
- "label": {
13
- "color": { "value": "{ams.links.color}" },
14
- "font-family": { "value": "{ams.typography.font-family}" },
15
- "font-size": { "value": "{ams.typography.heading.4.font-size}" },
16
- "font-weight": { "value": "{ams.typography.heading.font-weight}" },
17
- "line-height": { "value": "{ams.typography.heading.4.line-height}" },
18
- "text-decoration-line": { "value": "{ams.links.subtle.text-decoration-line}" },
19
- "text-decoration-thickness": { "value": "{ams.links.text-decoration-thickness}" },
20
- "text-underline-offset": { "value": "{ams.links.text-underline-offset}" },
21
- "hover": {
22
- "color": { "value": "{ams.links.hover.color}" },
23
- "text-decoration-line": { "value": "{ams.links.subtle.hover.text-decoration-line}" }
24
- }
25
- },
26
- "outline-offset": { "value": "{ams.focus.outline-offset}" }
27
- }
28
- }
29
- }