@amsterdam/design-system-tokens 0.6.1 → 0.7.1

package/CHANGELOG.md

@@ -3,6 +3,30 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.7.1](https://github.com/Amsterdam/design-system/compare/design-system-tokens-v0.7.0...design-system-tokens-v0.7.1) (2024-03-22)
+
+
+### Features
+
+* Add Avatar component ([#1134](https://github.com/Amsterdam/design-system/issues/1134)) ([8dec2cf](https://github.com/Amsterdam/design-system/commit/8dec2cff8f7885ccb163774c0dc979fb2c781256))
+* Add Form Field Character Counter ([#1114](https://github.com/Amsterdam/design-system/issues/1114)) ([779ae8c](https://github.com/Amsterdam/design-system/commit/779ae8c9764b23508ffbfb38c6dc2f7a7c1cbd28))
+
+
+### Bug Fixes
+
+* Use semantic Heading for the title of a Dialog ([#1123](https://github.com/Amsterdam/design-system/issues/1123)) ([0493fd8](https://github.com/Amsterdam/design-system/commit/0493fd87587d36a83bb7aa9cbb69b8debf5d66f0))
+
+## [0.7.0](https://github.com/Amsterdam/design-system/compare/design-system-tokens-v0.6.1...design-system-tokens-v0.7.0) (2024-03-12)
+
+
+### ⚠ BREAKING CHANGES
+
+* Shorten namespaces in theme and tokens ([#1125](https://github.com/Amsterdam/design-system/issues/1125))
+
+### Features
+
+* Shorten namespaces in theme and tokens ([#1125](https://github.com/Amsterdam/design-system/issues/1125)) ([1c81f3b](https://github.com/Amsterdam/design-system/commit/1c81f3bd14c1f202eec2341aec1888fb74d956d5))
+
 ## [0.6.1](https://github.com/Amsterdam/design-system/compare/design-system-tokens-v0.6.0...design-system-tokens-v0.6.1) (2024-03-11)
 
 

package/build.js

@@ -28,7 +28,7 @@ function generateSharedConfig(mode) {
           destination: `${name}.theme.css`,
           format: 'css/variables',
           options: {
-            selector: `.amsterdam-theme${name === 'index' ? '' : `--${name}`}`,
+            selector: `.ams-theme${name === 'index' ? '' : `--${name}`}`,
             outputReferences: true,
           },
         },

package/dist/compact.css

@@ -1,20 +1,20 @@
 /**
  * Do not edit directly
- * Generated on Mon, 11 Mar 2024 17:19:31 GMT
+ * Generated on Fri, 22 Mar 2024 15:51:06 GMT
  */
 
 :root {
-  --amsterdam-typography-text-level-6-font-size: clamp(0.75rem, calc(0.188vw + 0.713rem), 0.9rem);
-  --amsterdam-typography-text-level-5-font-size: clamp(0.875rem, calc(0.313vw + 0.813rem), 1.125rem);
-  --amsterdam-typography-text-level-4-font-size: clamp(1.021rem, calc(0.481vw + 0.925rem), 1.406rem);
-  --amsterdam-typography-text-level-3-font-size: clamp(1.191rem, calc(0.709vw + 1.049rem), 1.758rem);
-  --amsterdam-typography-text-level-2-font-size: clamp(1.389rem, calc(1.01vw + 1.187rem), 2.197rem);
-  --amsterdam-typography-text-level-1-font-size: clamp(1.621rem, calc(1.408vw + 1.34rem), 2.747rem);
-  --amsterdam-typography-text-level-0-font-size: clamp(1.891rem, calc(1.927vw + 1.506rem), 3.433rem);
-  --amsterdam-space-grid-xl: clamp(2rem, calc(3.125vw - 0.125rem), 5rem);
-  --amsterdam-space-grid-lg: clamp(1.5rem, calc(2.34375vw - 0.09375rem), 3.75rem);
-  --amsterdam-space-grid-md: clamp(1rem, calc(1.5625vw - 0.0625rem), 2.5rem); /* Grows from 16px at 1088px wide to 40px at 2624px wide. */
-  --amsterdam-space-grid-sm: clamp(0.5rem, calc(0.78125vw - 0.03125rem), 1.25rem);
-  --amsterdam-space-grid-xs: clamp(0.25rem, calc(0.390625vw - 0.015625rem), 0.625rem);
-  --amsterdam-grid-padding-inline: var(--amsterdam-space-grid-md);
+  --ams-text-level-6-font-size: clamp(0.75rem, calc(0.188vw + 0.713rem), 0.9rem);
+  --ams-text-level-5-font-size: clamp(0.875rem, calc(0.313vw + 0.813rem), 1.125rem);
+  --ams-text-level-4-font-size: clamp(1.021rem, calc(0.481vw + 0.925rem), 1.406rem);
+  --ams-text-level-3-font-size: clamp(1.191rem, calc(0.709vw + 1.049rem), 1.758rem);
+  --ams-text-level-2-font-size: clamp(1.389rem, calc(1.01vw + 1.187rem), 2.197rem);
+  --ams-text-level-1-font-size: clamp(1.621rem, calc(1.408vw + 1.34rem), 2.747rem);
+  --ams-text-level-0-font-size: clamp(1.891rem, calc(1.927vw + 1.506rem), 3.433rem);
+  --ams-space-grid-xl: clamp(2rem, calc(3.125vw - 0.125rem), 5rem);
+  --ams-space-grid-lg: clamp(1.5rem, calc(2.34375vw - 0.09375rem), 3.75rem);
+  --ams-space-grid-md: clamp(1rem, calc(1.5625vw - 0.0625rem), 2.5rem); /* Grows from 16px at 1088px wide to 40px at 2624px wide. */
+  --ams-space-grid-sm: clamp(0.5rem, calc(0.78125vw - 0.03125rem), 1.25rem);
+  --ams-space-grid-xs: clamp(0.25rem, calc(0.390625vw - 0.015625rem), 0.625rem);
+  --ams-grid-padding-inline: var(--ams-space-grid-md);
 }

package/dist/compact.d.ts

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Mon, 11 Mar 2024 17:19:31 GMT
+ * Generated on Fri, 22 Mar 2024 15:51:06 GMT
  */
 
 export default tokens;
@@ -22,7 +22,7 @@ declare interface DesignToken {
 }
 
 declare const tokens: {
-  "amsterdam": {
+  "ams": {
     "space": {
       "grid": {
         "xs": DesignToken,
@@ -32,8 +32,8 @@ declare const tokens: {
         "xl": DesignToken
       }
     },
-    "typography": {
-      "text-level": {
+    "text": {
+      "level": {
         "0": {
           "font-size": DesignToken
         },

package/dist/compact.json

@@ -1,5 +1,5 @@
 {
-  "amsterdam": {
+  "ams": {
     "space": {
       "grid": {
         "xs": "clamp(0.25rem, calc(0.390625vw - 0.015625rem), 0.625rem)",
@@ -9,8 +9,8 @@
         "xl": "clamp(2rem, calc(3.125vw - 0.125rem), 5rem)"
       }
     },
-    "typography": {
-      "text-level": {
+    "text": {
+      "level": {
         "0": {
           "font-size": "clamp(1.891rem, calc(1.927vw + 1.506rem), 3.433rem)"
         },

package/dist/compact.mjs

@@ -1,18 +1,18 @@
 /**
  * Do not edit directly
- * Generated on Mon, 11 Mar 2024 17:19:31 GMT
+ * Generated on Fri, 22 Mar 2024 15:51:06 GMT
  */
 
-export const amsterdamSpaceGridXs = "clamp(0.25rem, calc(0.390625vw - 0.015625rem), 0.625rem)";
-export const amsterdamSpaceGridSm = "clamp(0.5rem, calc(0.78125vw - 0.03125rem), 1.25rem)";
-export const amsterdamSpaceGridMd = "clamp(1rem, calc(1.5625vw - 0.0625rem), 2.5rem)"; // Grows from 16px at 1088px wide to 40px at 2624px wide.
-export const amsterdamSpaceGridLg = "clamp(1.5rem, calc(2.34375vw - 0.09375rem), 3.75rem)";
-export const amsterdamSpaceGridXl = "clamp(2rem, calc(3.125vw - 0.125rem), 5rem)";
-export const amsterdamTypographyTextLevel0FontSize = "clamp(1.891rem, calc(1.927vw + 1.506rem), 3.433rem)";
-export const amsterdamTypographyTextLevel1FontSize = "clamp(1.621rem, calc(1.408vw + 1.34rem), 2.747rem)";
-export const amsterdamTypographyTextLevel2FontSize = "clamp(1.389rem, calc(1.01vw + 1.187rem), 2.197rem)";
-export const amsterdamTypographyTextLevel3FontSize = "clamp(1.191rem, calc(0.709vw + 1.049rem), 1.758rem)";
-export const amsterdamTypographyTextLevel4FontSize = "clamp(1.021rem, calc(0.481vw + 0.925rem), 1.406rem)";
-export const amsterdamTypographyTextLevel5FontSize = "clamp(0.875rem, calc(0.313vw + 0.813rem), 1.125rem)";
-export const amsterdamTypographyTextLevel6FontSize = "clamp(0.75rem, calc(0.188vw + 0.713rem), 0.9rem)";
-export const amsterdamGridPaddingInline = "clamp(1rem, calc(1.5625vw - 0.0625rem), 2.5rem)";
+export const amsSpaceGridXs = "clamp(0.25rem, calc(0.390625vw - 0.015625rem), 0.625rem)";
+export const amsSpaceGridSm = "clamp(0.5rem, calc(0.78125vw - 0.03125rem), 1.25rem)";
+export const amsSpaceGridMd = "clamp(1rem, calc(1.5625vw - 0.0625rem), 2.5rem)"; // Grows from 16px at 1088px wide to 40px at 2624px wide.
+export const amsSpaceGridLg = "clamp(1.5rem, calc(2.34375vw - 0.09375rem), 3.75rem)";
+export const amsSpaceGridXl = "clamp(2rem, calc(3.125vw - 0.125rem), 5rem)";
+export const amsTextLevel0FontSize = "clamp(1.891rem, calc(1.927vw + 1.506rem), 3.433rem)";
+export const amsTextLevel1FontSize = "clamp(1.621rem, calc(1.408vw + 1.34rem), 2.747rem)";
+export const amsTextLevel2FontSize = "clamp(1.389rem, calc(1.01vw + 1.187rem), 2.197rem)";
+export const amsTextLevel3FontSize = "clamp(1.191rem, calc(0.709vw + 1.049rem), 1.758rem)";
+export const amsTextLevel4FontSize = "clamp(1.021rem, calc(0.481vw + 0.925rem), 1.406rem)";
+export const amsTextLevel5FontSize = "clamp(0.875rem, calc(0.313vw + 0.813rem), 1.125rem)";
+export const amsTextLevel6FontSize = "clamp(0.75rem, calc(0.188vw + 0.713rem), 0.9rem)";
+export const amsGridPaddingInline = "clamp(1rem, calc(1.5625vw - 0.0625rem), 2.5rem)";

package/dist/compact.scss

@@ -1,17 +1,17 @@
 
 // Do not edit directly
-// Generated on Mon, 11 Mar 2024 17:19:31 GMT
+// Generated on Fri, 22 Mar 2024 15:51:06 GMT
 
-$amsterdam-typography-text-level-6-font-size: clamp(0.75rem, calc(0.188vw + 0.713rem), 0.9rem);
-$amsterdam-typography-text-level-5-font-size: clamp(0.875rem, calc(0.313vw + 0.813rem), 1.125rem);
-$amsterdam-typography-text-level-4-font-size: clamp(1.021rem, calc(0.481vw + 0.925rem), 1.406rem);
-$amsterdam-typography-text-level-3-font-size: clamp(1.191rem, calc(0.709vw + 1.049rem), 1.758rem);
-$amsterdam-typography-text-level-2-font-size: clamp(1.389rem, calc(1.01vw + 1.187rem), 2.197rem);
-$amsterdam-typography-text-level-1-font-size: clamp(1.621rem, calc(1.408vw + 1.34rem), 2.747rem);
-$amsterdam-typography-text-level-0-font-size: clamp(1.891rem, calc(1.927vw + 1.506rem), 3.433rem);
-$amsterdam-space-grid-xl: clamp(2rem, calc(3.125vw - 0.125rem), 5rem);
-$amsterdam-space-grid-lg: clamp(1.5rem, calc(2.34375vw - 0.09375rem), 3.75rem);
-$amsterdam-space-grid-md: clamp(1rem, calc(1.5625vw - 0.0625rem), 2.5rem); // Grows from 16px at 1088px wide to 40px at 2624px wide.
-$amsterdam-space-grid-sm: clamp(0.5rem, calc(0.78125vw - 0.03125rem), 1.25rem);
-$amsterdam-space-grid-xs: clamp(0.25rem, calc(0.390625vw - 0.015625rem), 0.625rem);
-$amsterdam-grid-padding-inline: $amsterdam-space-grid-md;
+$ams-text-level-6-font-size: clamp(0.75rem, calc(0.188vw + 0.713rem), 0.9rem);
+$ams-text-level-5-font-size: clamp(0.875rem, calc(0.313vw + 0.813rem), 1.125rem);
+$ams-text-level-4-font-size: clamp(1.021rem, calc(0.481vw + 0.925rem), 1.406rem);
+$ams-text-level-3-font-size: clamp(1.191rem, calc(0.709vw + 1.049rem), 1.758rem);
+$ams-text-level-2-font-size: clamp(1.389rem, calc(1.01vw + 1.187rem), 2.197rem);
+$ams-text-level-1-font-size: clamp(1.621rem, calc(1.408vw + 1.34rem), 2.747rem);
+$ams-text-level-0-font-size: clamp(1.891rem, calc(1.927vw + 1.506rem), 3.433rem);
+$ams-space-grid-xl: clamp(2rem, calc(3.125vw - 0.125rem), 5rem);
+$ams-space-grid-lg: clamp(1.5rem, calc(2.34375vw - 0.09375rem), 3.75rem);
+$ams-space-grid-md: clamp(1rem, calc(1.5625vw - 0.0625rem), 2.5rem); // Grows from 16px at 1088px wide to 40px at 2624px wide.
+$ams-space-grid-sm: clamp(0.5rem, calc(0.78125vw - 0.03125rem), 1.25rem);
+$ams-space-grid-xs: clamp(0.25rem, calc(0.390625vw - 0.015625rem), 0.625rem);
+$ams-grid-padding-inline: $ams-space-grid-md;

package/dist/compact.theme.css

@@ -1,20 +1,20 @@
 /**
  * Do not edit directly
- * Generated on Mon, 11 Mar 2024 17:19:31 GMT
+ * Generated on Fri, 22 Mar 2024 15:51:06 GMT
  */
 
-.amsterdam-theme--compact {
-  --amsterdam-typography-text-level-6-font-size: clamp(0.75rem, calc(0.188vw + 0.713rem), 0.9rem);
-  --amsterdam-typography-text-level-5-font-size: clamp(0.875rem, calc(0.313vw + 0.813rem), 1.125rem);
-  --amsterdam-typography-text-level-4-font-size: clamp(1.021rem, calc(0.481vw + 0.925rem), 1.406rem);
-  --amsterdam-typography-text-level-3-font-size: clamp(1.191rem, calc(0.709vw + 1.049rem), 1.758rem);
-  --amsterdam-typography-text-level-2-font-size: clamp(1.389rem, calc(1.01vw + 1.187rem), 2.197rem);
-  --amsterdam-typography-text-level-1-font-size: clamp(1.621rem, calc(1.408vw + 1.34rem), 2.747rem);
-  --amsterdam-typography-text-level-0-font-size: clamp(1.891rem, calc(1.927vw + 1.506rem), 3.433rem);
-  --amsterdam-space-grid-xl: clamp(2rem, calc(3.125vw - 0.125rem), 5rem);
-  --amsterdam-space-grid-lg: clamp(1.5rem, calc(2.34375vw - 0.09375rem), 3.75rem);
-  --amsterdam-space-grid-md: clamp(1rem, calc(1.5625vw - 0.0625rem), 2.5rem); /* Grows from 16px at 1088px wide to 40px at 2624px wide. */
-  --amsterdam-space-grid-sm: clamp(0.5rem, calc(0.78125vw - 0.03125rem), 1.25rem);
-  --amsterdam-space-grid-xs: clamp(0.25rem, calc(0.390625vw - 0.015625rem), 0.625rem);
-  --amsterdam-grid-padding-inline: var(--amsterdam-space-grid-md);
+.ams-theme--compact {
+  --ams-text-level-6-font-size: clamp(0.75rem, calc(0.188vw + 0.713rem), 0.9rem);
+  --ams-text-level-5-font-size: clamp(0.875rem, calc(0.313vw + 0.813rem), 1.125rem);
+  --ams-text-level-4-font-size: clamp(1.021rem, calc(0.481vw + 0.925rem), 1.406rem);
+  --ams-text-level-3-font-size: clamp(1.191rem, calc(0.709vw + 1.049rem), 1.758rem);
+  --ams-text-level-2-font-size: clamp(1.389rem, calc(1.01vw + 1.187rem), 2.197rem);
+  --ams-text-level-1-font-size: clamp(1.621rem, calc(1.408vw + 1.34rem), 2.747rem);
+  --ams-text-level-0-font-size: clamp(1.891rem, calc(1.927vw + 1.506rem), 3.433rem);
+  --ams-space-grid-xl: clamp(2rem, calc(3.125vw - 0.125rem), 5rem);
+  --ams-space-grid-lg: clamp(1.5rem, calc(2.34375vw - 0.09375rem), 3.75rem);
+  --ams-space-grid-md: clamp(1rem, calc(1.5625vw - 0.0625rem), 2.5rem); /* Grows from 16px at 1088px wide to 40px at 2624px wide. */
+  --ams-space-grid-sm: clamp(0.5rem, calc(0.78125vw - 0.03125rem), 1.25rem);
+  --ams-space-grid-xs: clamp(0.25rem, calc(0.390625vw - 0.015625rem), 0.625rem);
+  --ams-grid-padding-inline: var(--ams-space-grid-md);
 }