@amsterdam/design-system-tokens 3.2.0 → 3.3.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 (9) hide show
  1. package/CHANGELOG.md +7 -0
  2. package/dist/index.css +1 -0
  3. package/dist/index.d.ts +3 -0
  4. package/dist/index.json +4 -1
  5. package/dist/index.mjs +2 -0
  6. package/dist/index.scss +1 -0
  7. package/dist/index.theme.css +1 -0
  8. package/package.json +1 -1
  9. package/src/components/ams/description-list.tokens.json +10 -0
package/CHANGELOG.md CHANGED
@@ -3,6 +3,13 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ ## [3.3.0](https://github.com/Amsterdam/design-system/compare/design-system-tokens-v3.2.0...design-system-tokens-v3.3.0) (2026-03-17)
7
+
8
+
9
+ ### Features
10
+
11
+ * **Description List:** Let terms contribute to vertical space ([#2460](https://github.com/Amsterdam/design-system/issues/2460)) ([1ecbdad](https://github.com/Amsterdam/design-system/commit/1ecbdadad4994b50dd22cfac39bfb3932a5b2f91))
12
+
6
13
  ## [3.2.0](https://github.com/Amsterdam/design-system/compare/design-system-tokens-v3.1.0...design-system-tokens-v3.2.0) (2026-03-13)
7
14
 
8
15
 
package/dist/index.css CHANGED
@@ -898,6 +898,7 @@
898
898
  --ams-date-input-invalid-border-color: var(--ams-inputs-invalid-border-color);
899
899
  --ams-date-input-invalid-hover-border-color: var(--ams-inputs-invalid-hover-border-color);
900
900
  --ams-date-input-invalid-hover-box-shadow: var(--ams-inputs-invalid-hover-box-shadow);
901
+ --ams-description-list-term-vi-medium-margin-block-end: var(--ams-description-list-description-margin-block-end);
901
902
  --ams-dialog-border-color: var(--ams-dialog-background-color);
902
903
  --ams-field-set-legend-font-size: var(--ams-typography-heading-3-font-size);
903
904
  --ams-file-input-background-color: var(--ams-inputs-background-color);
package/dist/index.d.ts CHANGED
@@ -661,6 +661,9 @@ declare const tokens: {
661
661
  term: {
662
662
  "font-weight": DesignToken;
663
663
  "margin-block-end": DesignToken;
664
+ "vi-medium": {
665
+ "margin-block-end": DesignToken;
666
+ };
664
667
  };
665
668
  description: {
666
669
  "font-weight": DesignToken;
package/dist/index.json CHANGED
@@ -644,7 +644,10 @@
644
644
  },
645
645
  "term": {
646
646
  "font-weight": "800",
647
- "margin-block-end": "clamp(0.25rem, 0.2143rem + 0.1786vw, 0.375rem)"
647
+ "margin-block-end": "clamp(0.25rem, 0.2143rem + 0.1786vw, 0.375rem)",
648
+ "vi-medium": {
649
+ "margin-block-end": "clamp(1rem, 0.8571rem + 0.7143vw, 1.5rem)"
650
+ }
648
651
  },
649
652
  "description": {
650
653
  "font-weight": "400",
package/dist/index.mjs CHANGED
@@ -424,6 +424,8 @@ export const amsDescriptionListInverseColor = "#ffffff";
424
424
  export const amsDescriptionListTermFontWeight = "800";
425
425
  export const amsDescriptionListTermMarginBlockEnd =
426
426
  "clamp(0.25rem, 0.2143rem + 0.1786vw, 0.375rem)";
427
+ export const amsDescriptionListTermViMediumMarginBlockEnd =
428
+ "clamp(1rem, 0.8571rem + 0.7143vw, 1.5rem)";
427
429
  export const amsDescriptionListDescriptionFontWeight = "400";
428
430
  export const amsDescriptionListDescriptionMarginBlockEnd =
429
431
  "clamp(1rem, 0.8571rem + 0.7143vw, 1.5rem)";
package/dist/index.scss CHANGED
@@ -896,6 +896,7 @@ $ams-date-input-padding-inline: $ams-inputs-padding-inline;
896
896
  $ams-date-input-invalid-border-color: $ams-inputs-invalid-border-color;
897
897
  $ams-date-input-invalid-hover-border-color: $ams-inputs-invalid-hover-border-color;
898
898
  $ams-date-input-invalid-hover-box-shadow: $ams-inputs-invalid-hover-box-shadow;
899
+ $ams-description-list-term-vi-medium-margin-block-end: $ams-description-list-description-margin-block-end;
899
900
  $ams-dialog-border-color: $ams-dialog-background-color;
900
901
  $ams-field-set-legend-font-size: $ams-typography-heading-3-font-size;
901
902
  $ams-file-input-background-color: $ams-inputs-background-color;
package/dist/index.theme.css CHANGED
@@ -898,6 +898,7 @@
898
898
  --ams-date-input-invalid-border-color: var(--ams-inputs-invalid-border-color);
899
899
  --ams-date-input-invalid-hover-border-color: var(--ams-inputs-invalid-hover-border-color);
900
900
  --ams-date-input-invalid-hover-box-shadow: var(--ams-inputs-invalid-hover-box-shadow);
901
+ --ams-description-list-term-vi-medium-margin-block-end: var(--ams-description-list-description-margin-block-end);
901
902
  --ams-dialog-border-color: var(--ams-dialog-background-color);
902
903
  --ams-field-set-legend-font-size: var(--ams-typography-heading-3-font-size);
903
904
  --ams-file-input-background-color: var(--ams-inputs-background-color);
package/package.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "version": "3.2.0",
2
+ "version": "3.3.0",
3
3
  "author": "Design System Team, City of Amsterdam <designsystem@amsterdam.nl>",
4
4
  "description": "All design tokens from the Amsterdam Design System. Use it to apply its visual design to your website or application.",
5
5
  "homepage": "https://designsystem.amsterdam",
package/src/components/ams/description-list.tokens.json CHANGED
@@ -53,6 +53,16 @@
53
53
  "$extensions": {
54
54
  "nl.amsterdam.subtype": "space"
55
55
  }
56
+ },
57
+ "vi-medium": {
58
+ "margin-block-end": {
59
+ "$value": "{ams.description-list.description.margin-block-end}",
60
+ "$type": "dimension",
61
+ "$extensions": {
62
+ "nl.amsterdam.hint": "Should equal the bottom margin of descriptions.",
63
+ "nl.amsterdam.subtype": "space"
64
+ }
65
+ }
56
66
  }
57
67
  },
58
68
  "description": {