@utrecht/design-tokens 2.3.0 → 2.4.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 (73) hide show
  1. package/CHANGELOG.md +14 -0
  2. package/dist/_mixin-theme.scss +124 -63
  3. package/dist/_mixin.scss +124 -63
  4. package/dist/_variables.scss +124 -63
  5. package/dist/dark/_mixin-theme.scss +124 -63
  6. package/dist/dark/_mixin.scss +124 -63
  7. package/dist/dark/_variables.scss +124 -63
  8. package/dist/dark/index.cjs +62 -1
  9. package/dist/dark/index.css +124 -63
  10. package/dist/dark/index.d.ts +62 -1
  11. package/dist/dark/index.flat.json +62 -1
  12. package/dist/dark/index.json +1046 -102
  13. package/dist/dark/index.mjs +62 -1
  14. package/dist/dark/index.tokens.json +246 -36
  15. package/dist/dark/list.json +1046 -102
  16. package/dist/dark/list.mjs +1046 -102
  17. package/dist/dark/property.css +0 -1
  18. package/dist/dark/root.css +124 -63
  19. package/dist/dark/theme-prince-xml.css +124 -63
  20. package/dist/dark/theme.css +124 -63
  21. package/dist/dark/tokens.cjs +1209 -116
  22. package/dist/dark/tokens.d.ts +177 -20
  23. package/dist/dark/tokens.json +1209 -116
  24. package/dist/dark/variables.cjs +62 -1
  25. package/dist/dark/variables.css +124 -63
  26. package/dist/dark/variables.d.ts +62 -1
  27. package/dist/dark/variables.json +62 -1
  28. package/dist/dark/variables.less +124 -63
  29. package/dist/dark/variables.mjs +62 -1
  30. package/dist/index.cjs +62 -1
  31. package/dist/index.css +248 -126
  32. package/dist/index.d.ts +62 -1
  33. package/dist/index.flat.json +62 -1
  34. package/dist/index.json +1046 -102
  35. package/dist/index.mjs +62 -1
  36. package/dist/index.tokens.json +246 -36
  37. package/dist/list.json +1046 -102
  38. package/dist/list.mjs +1046 -102
  39. package/dist/property.css +0 -1
  40. package/dist/root.css +124 -63
  41. package/dist/theme-prince-xml.css +124 -63
  42. package/dist/theme.css +124 -63
  43. package/dist/tokens.cjs +1209 -116
  44. package/dist/tokens.d.ts +177 -20
  45. package/dist/tokens.json +1209 -116
  46. package/dist/variables.cjs +62 -1
  47. package/dist/variables.css +124 -63
  48. package/dist/variables.d.ts +62 -1
  49. package/dist/variables.json +62 -1
  50. package/dist/variables.less +124 -63
  51. package/dist/variables.mjs +62 -1
  52. package/package.json +1 -1
  53. package/src/component/nl/code-block.tokens.json +13 -0
  54. package/src/component/nl/code.tokens.json +11 -0
  55. package/src/component/nl/data-badge.tokens.json +22 -0
  56. package/src/component/nl/heading.tokens.json +48 -0
  57. package/src/component/nl/mark.tokens.json +8 -0
  58. package/src/component/nl/number-badge.tokens.json +23 -0
  59. package/src/component/nl/paragraph.tokens.json +20 -0
  60. package/src/component/nl/skip-link.tokens.json +16 -0
  61. package/src/component/utrecht/badge.tokens.json +5 -5
  62. package/src/component/utrecht/code-block.tokens.json +9 -9
  63. package/src/component/utrecht/heading-1.tokens.json +4 -4
  64. package/src/component/utrecht/heading-2.tokens.json +4 -4
  65. package/src/component/utrecht/heading-3.tokens.json +4 -4
  66. package/src/component/utrecht/heading-4.tokens.json +4 -4
  67. package/src/component/utrecht/heading-5.tokens.json +4 -4
  68. package/src/component/utrecht/heading-6.tokens.json +4 -4
  69. package/src/component/utrecht/mark.tokens.json +2 -2
  70. package/src/component/utrecht/number-badge.tokens.json +6 -6
  71. package/src/component/utrecht/paragraph.tokens.json +8 -8
  72. package/src/component/utrecht/skip-link.tokens.json +10 -10
  73. package/src/component/utrecht/badge-data.tokens.json +0 -8
package/src/component/utrecht/heading-1.tokens.json CHANGED
@@ -2,10 +2,10 @@
2
2
  "utrecht": {
3
3
  "heading-1": {
4
4
  "color": {},
5
- "font-family": { "value": "{utrecht.typography.sans-serif.font-family}" },
6
- "font-size": { "value": "{utrecht.typography.scale.4xl.font-size}" },
7
- "font-weight": { "value": "{utrecht.typography.weight-scale.bold.font-weight}" },
8
- "line-height": { "value": "{utrecht.typography.line-height.sm}" },
5
+ "font-family": { "value": "{nl.heading.level-1.font-family}" },
6
+ "font-size": { "value": "{nl.heading.level-1.font-size}" },
7
+ "font-weight": { "value": "{nl.heading.level-1.font-weight}" },
8
+ "line-height": { "value": "{nl.heading.level-1.line-height}" },
9
9
  "margin-block-end": { "value": "0.67rem" },
10
10
  "margin-block-start": { "value": "0.67rem" },
11
11
  "text-transform": {}
package/src/component/utrecht/heading-2.tokens.json CHANGED
@@ -2,10 +2,10 @@
2
2
  "utrecht": {
3
3
  "heading-2": {
4
4
  "color": {},
5
- "font-family": { "value": "{utrecht.typography.sans-serif.font-family}" },
6
- "font-size": { "value": "{utrecht.typography.scale.xl.font-size}" },
7
- "font-weight": { "value": "{utrecht.typography.weight-scale.bold.font-weight}" },
8
- "line-height": { "value": "{utrecht.typography.line-height.sm}" },
5
+ "font-family": { "value": "{nl.heading.level-2.font-family}" },
6
+ "font-size": { "value": "{nl.heading.level-2.font-size}" },
7
+ "font-weight": { "value": "{nl.heading.level-2.font-weight}" },
8
+ "line-height": { "value": "{nl.heading.level-2.line-height}" },
9
9
  "margin-block-end": { "value": "0.3rem" },
10
10
  "margin-block-start": { "value": "1.5rem" },
11
11
  "text-transform": {}
package/src/component/utrecht/heading-3.tokens.json CHANGED
@@ -2,10 +2,10 @@
2
2
  "utrecht": {
3
3
  "heading-3": {
4
4
  "color": {},
5
- "font-family": { "value": "{utrecht.typography.sans-serif.font-family}" },
6
- "font-size": { "value": "{utrecht.typography.scale.xl.font-size}" },
7
- "font-weight": { "value": "{utrecht.typography.weight-scale.normal.font-weight}" },
8
- "line-height": { "value": "{utrecht.typography.line-height.sm}" },
5
+ "font-family": { "value": "{nl.heading.level-3.font-family}" },
6
+ "font-size": { "value": "{nl.heading.level-3.font-size}" },
7
+ "font-weight": { "value": "{nl.heading.level-3.font-weight}" },
8
+ "line-height": { "value": "{nl.heading.level-3.line-height}" },
9
9
  "margin-block-end": { "value": "0.2rem" },
10
10
  "margin-block-start": { "value": "1rem" },
11
11
  "text-transform": {}
package/src/component/utrecht/heading-4.tokens.json CHANGED
@@ -2,10 +2,10 @@
2
2
  "utrecht": {
3
3
  "heading-4": {
4
4
  "color": {},
5
- "font-family": { "value": "{utrecht.typography.sans-serif.font-family}" },
6
- "font-size": { "value": "{utrecht.typography.scale.lg.font-size}" },
7
- "font-weight": { "value": "{utrecht.typography.weight-scale.normal.font-weight}" },
8
- "line-height": { "value": "{utrecht.typography.line-height.md}" },
5
+ "font-family": { "value": "{nl.heading.level-4.font-family}" },
6
+ "font-size": { "value": "{nl.heading.level-4.font-size}" },
7
+ "font-weight": { "value": "{nl.heading.level-4.font-weight}" },
8
+ "line-height": { "value": "{nl.heading.level-4.line-height}" },
9
9
  "margin-block-end": { "value": "0.3rem" },
10
10
  "margin-block-start": { "value": "1.2rem" },
11
11
  "text-transform": {}
package/src/component/utrecht/heading-5.tokens.json CHANGED
@@ -2,10 +2,10 @@
2
2
  "utrecht": {
3
3
  "heading-5": {
4
4
  "color": {},
5
- "font-family": { "value": "{utrecht.typography.sans-serif.font-family}" },
6
- "font-size": { "value": "{utrecht.typography.scale.sm.font-size}" },
7
- "font-weight": { "value": "{utrecht.typography.weight-scale.normal.font-weight}" },
8
- "line-height": { "value": "{utrecht.typography.line-height.md}" },
5
+ "font-family": { "value": "{nl.heading.level-5.font-family}" },
6
+ "font-size": { "value": "{nl.heading.level-5.font-size}" },
7
+ "font-weight": { "value": "{nl.heading.level-5.font-weight}" },
8
+ "line-height": { "value": "{nl.heading.level-5.line-height}" },
9
9
  "margin-block-end": { "value": "0.2rem" },
10
10
  "margin-block-start": { "value": "1rem" }
11
11
  }
package/src/component/utrecht/heading-6.tokens.json CHANGED
@@ -2,10 +2,10 @@
2
2
  "utrecht": {
3
3
  "heading-6": {
4
4
  "color": {},
5
- "font-family": { "value": "{utrecht.typography.sans-serif.font-family}" },
6
- "font-size": { "value": "{utrecht.typography.scale.sm.font-size}" },
7
- "font-weight": { "value": "{utrecht.typography.weight-scale.normal.font-weight}" },
8
- "line-height": { "value": "{utrecht.typography.line-height.md}" },
5
+ "font-family": { "value": "{nl.heading.level-6.font-family}" },
6
+ "font-size": { "value": "{nl.heading.level-6.font-size}" },
7
+ "font-weight": { "value": "{nl.heading.level-6.font-weight}" },
8
+ "line-height": { "value": "{nl.heading.level-6.line-height}" },
9
9
  "margin-block-end": {},
10
10
  "margin-block-start": {}
11
11
  }
package/src/component/utrecht/mark.tokens.json CHANGED
@@ -1,8 +1,8 @@
1
1
  {
2
2
  "utrecht": {
3
3
  "mark": {
4
- "background-color": { "value": "{utrecht.color.yellow.60}" },
5
- "color": { "value": "{utrecht.color.black}" }
4
+ "background-color": { "value": "{nl.mark.background-color}" },
5
+ "color": { "value": "{nl.mark.color}" }
6
6
  }
7
7
  }
8
8
  }
package/src/component/utrecht/number-badge.tokens.json CHANGED
@@ -2,21 +2,21 @@
2
2
  "utrecht": {
3
3
  "number-badge": {
4
4
  "background-color": {
5
- "value": "{utrecht.color.red.40}"
5
+ "value": "{nl.number-badge.background-color}"
6
6
  },
7
7
  "border-radius": {
8
- "value": "{utrecht.number-badge.font-size}"
8
+ "value": "{nl.number-badge.border-radius}"
9
9
  },
10
10
  "color": {
11
- "value": "{utrecht.color.white}"
11
+ "value": "{nl.number-badge.color}"
12
12
  },
13
- "font-size": { "value": "{utrecht.typography.scale.md.font-size}" },
13
+ "font-size": { "value": "{nl.number-badge.font-size}" },
14
14
  "font-weight": {},
15
15
  "padding-block": {
16
- "value": "1ex"
16
+ "value": "{nl.number-badge.padding-block}"
17
17
  },
18
18
  "padding-inline": {
19
- "value": "1ex"
19
+ "value": "{nl.number-badge.padding-inline}"
20
20
  }
21
21
  }
22
22
  }
package/src/component/utrecht/paragraph.tokens.json CHANGED
@@ -2,17 +2,17 @@
2
2
  "utrecht": {
3
3
  "paragraph": {
4
4
  "color": {},
5
- "font-family": { "value": "{utrecht.typography.sans-serif.font-family}" },
6
- "font-size": { "value": "{utrecht.typography.scale.md.font-size}" },
7
- "font-weight": { "value": "{utrecht.typography.weight-scale.normal.font-weight}" },
8
- "line-height": { "value": "{utrecht.typography.line-height.md}" },
5
+ "font-family": { "value": "{nl.paragraph.font-family}" },
6
+ "font-size": { "value": "{nl.paragraph.font-size}" },
7
+ "font-weight": { "value": "{nl.paragraph.font-weight}" },
8
+ "line-height": { "value": "{nl.paragraph.line-height}" },
9
9
  "margin-block-start": { "value": "{utrecht.space.block.md}" },
10
10
  "margin-block-end": { "value": "0" },
11
11
  "lead": {
12
- "color": { "value": "{utrecht.document.color}" },
13
- "font-size": { "value": "{utrecht.typography.scale.xl.font-size}" },
14
- "font-weight": { "value": "{utrecht.typography.weight-scale.normal.font-weight}" },
15
- "line-height": { "value": "{utrecht.typography.line-height.md}" }
12
+ "color": {},
13
+ "font-size": { "value": "{nl.paragraph.lead.font-size}" },
14
+ "font-weight": { "value": "{nl.paragraph.lead.font-weight}" },
15
+ "line-height": { "value": "{nl.paragraph.lead.line-height}" }
16
16
  },
17
17
  "small": {
18
18
  "font-size": { "value": "{utrecht.typography.scale.sm.font-size}" }
package/src/component/utrecht/skip-link.tokens.json CHANGED
@@ -1,19 +1,19 @@
1
1
  {
2
2
  "utrecht": {
3
3
  "skip-link": {
4
- "background-color": { "value": "{utrecht.topnav.list.background-color}" },
5
- "color": { "value": "{utrecht.topnav.link.color}" },
6
- "padding-block-end": { "value": "{utrecht.button.padding-block-end}" },
7
- "padding-block-start": { "value": "{utrecht.button.padding-block-start}" },
8
- "padding-inline-end": { "value": "{utrecht.button.padding-inline-end}" },
9
- "padding-inline-start": { "value": "{utrecht.button.padding-inline-start}" },
10
- "text-decoration": { "value": "{utrecht.link.text-decoration}" },
4
+ "background-color": { "value": "{nl.skip-link.background-color}" },
5
+ "color": { "value": "{nl.skip-link.color}" },
6
+ "padding-block-end": { "value": "{nl.skip-link.padding-block}" },
7
+ "padding-block-start": { "value": "{nl.skip-link.padding-block}" },
8
+ "padding-inline-end": { "value": "{nl.skip-link.padding-inline}" },
9
+ "padding-inline-start": { "value": "{nl.skip-link.padding-inline}" },
10
+ "text-decoration": { "value": "{nl.skip-link.text-decoration}" },
11
11
  "focus": {
12
- "color": { "value": "{utrecht.topnav.link.focus.color}" },
13
- "background-color": { "value": "{utrecht.topnav.link.focus.background-color}" }
12
+ "color": { "value": "{nl.skip-link.focus-visible.color}" },
13
+ "background-color": { "value": "{nl.skip-link.focus-visible.background-color}" }
14
14
  },
15
15
  "focus-visible": {
16
- "text-decoration": { "value": "{utrecht.link.focus-visible.text-decoration}" }
16
+ "text-decoration": { "value": "{nl.skip-link.focus-visible.text-decoration}" }
17
17
  }
18
18
  }
19
19
  }
package/src/component/utrecht/badge-data.tokens.json DELETED
@@ -1,8 +0,0 @@
1
- {
2
- "utrecht": {
3
- "badge-data": {
4
- "letter-spacing": {},
5
- "text-transform": {}
6
- }
7
- }
8
- }