@utrecht/design-tokens 5.0.2 → 5.1.0

package/dist/list.mjs

@@ -5647,7 +5647,9 @@ export default [
         "syntax": "*",
         "inherits": true
       },
+      "nl.nldesignsystem.deprecated": true,
       "nl.nldesignsystem.figma.supports-token": true,
+      "nl.nldesignsystem.redirect": "utrecht.root.font-family",
       "studio.tokens": {
         "originalType": "fontFamilies"
       }
@@ -5662,7 +5664,9 @@ export default [
           "syntax": "*",
           "inherits": true
         },
+        "nl.nldesignsystem.deprecated": true,
         "nl.nldesignsystem.figma.supports-token": true,
+        "nl.nldesignsystem.redirect": "utrecht.root.font-family",
         "studio.tokens": {
           "originalType": "fontFamilies"
         }
@@ -5684,7 +5688,9 @@ export default [
         "syntax": "<length>",
         "inherits": true
       },
+      "nl.nldesignsystem.deprecated": true,
       "nl.nldesignsystem.figma.supports-token": true,
+      "nl.nldesignsystem.redirect": "utrecht.root.font-size",
       "studio.tokens": {
         "originalType": "fontSizes"
       }
@@ -5699,7 +5705,9 @@ export default [
           "syntax": "<length>",
           "inherits": true
         },
+        "nl.nldesignsystem.deprecated": true,
         "nl.nldesignsystem.figma.supports-token": true,
+        "nl.nldesignsystem.redirect": "utrecht.root.font-size",
         "studio.tokens": {
           "originalType": "fontSizes"
         }
@@ -5724,7 +5732,9 @@ export default [
         ],
         "inherits": true
       },
+      "nl.nldesignsystem.deprecated": true,
       "nl.nldesignsystem.figma.supports-token": true,
+      "nl.nldesignsystem.redirect": "utrecht.root.font-family",
       "studio.tokens": {
         "originalType": "lineHeights"
       }
@@ -5742,7 +5752,9 @@ export default [
           ],
           "inherits": true
         },
+        "nl.nldesignsystem.deprecated": true,
         "nl.nldesignsystem.figma.supports-token": true,
+        "nl.nldesignsystem.redirect": "utrecht.root.font-family",
         "studio.tokens": {
           "originalType": "lineHeights"
         }
@@ -30975,7 +30987,7 @@ export default [
       "nl.nldesignsystem.figma.supports-token": false
     },
     "type": "color",
-    "value": "hsl(0 0% 95%)",
+    "value": "hsl(0 0% 100%)",
     "filePath": "src/component/utrecht/root.tokens.json",
     "isSource": true,
     "original": {
@@ -30987,7 +30999,7 @@ export default [
         "nl.nldesignsystem.figma.supports-token": false
       },
       "type": "color",
-      "value": "{utrecht.color.grey.95}"
+      "value": "{utrecht.color.white}"
     },
     "name": "utrechtRootBackgroundColor",
     "attributes": {},
@@ -31006,7 +31018,7 @@ export default [
       "nl.nldesignsystem.figma.supports-token": false
     },
     "type": "color",
-    "value": "hsl(0 0% 10%)",
+    "value": "hsl(0 0% 0%)",
     "filePath": "src/component/utrecht/root.tokens.json",
     "isSource": true,
     "original": {
@@ -31018,7 +31030,7 @@ export default [
         "nl.nldesignsystem.figma.supports-token": false
       },
       "type": "color",
-      "value": "{utrecht.color.grey.10}"
+      "value": "{utrecht.color.black}"
     },
     "name": "utrechtRootColor",
     "attributes": {},
@@ -31028,6 +31040,154 @@ export default [
       "color"
     ]
   },
+  {
+    "$extensions": {
+      "nl.nldesignsystem.css.property": {
+        "syntax": "*",
+        "inherits": true
+      },
+      "nl.nldesignsystem.figma.supports-token": false,
+      "studio.tokens": {
+        "originalType": "fontFamilies"
+      }
+    },
+    "type": "fontFamily",
+    "value": "\"Noto Sans Variable\", \"Arial\", sans-serif",
+    "filePath": "src/component/utrecht/root.tokens.json",
+    "isSource": true,
+    "original": {
+      "$extensions": {
+        "nl.nldesignsystem.css.property": {
+          "syntax": "*",
+          "inherits": true
+        },
+        "nl.nldesignsystem.figma.supports-token": false,
+        "studio.tokens": {
+          "originalType": "fontFamilies"
+        }
+      },
+      "type": "fontFamily",
+      "value": "{utrecht.typography.sans-serif.font-family}"
+    },
+    "name": "utrechtRootFontFamily",
+    "attributes": {},
+    "path": [
+      "utrecht",
+      "root",
+      "font-family"
+    ]
+  },
+  {
+    "$extensions": {
+      "nl.nldesignsystem.css.property": {
+        "syntax": "<length>",
+        "inherits": true
+      },
+      "nl.nldesignsystem.figma.supports-token": false,
+      "studio.tokens": {
+        "originalType": "fontSizes"
+      }
+    },
+    "type": "fontSize",
+    "value": "1rem",
+    "filePath": "src/component/utrecht/root.tokens.json",
+    "isSource": true,
+    "original": {
+      "$extensions": {
+        "nl.nldesignsystem.css.property": {
+          "syntax": "<length>",
+          "inherits": true
+        },
+        "nl.nldesignsystem.figma.supports-token": false,
+        "studio.tokens": {
+          "originalType": "fontSizes"
+        }
+      },
+      "type": "fontSize",
+      "value": "{utrecht.typography.scale.md.font-size}"
+    },
+    "name": "utrechtRootFontSize",
+    "attributes": {},
+    "path": [
+      "utrecht",
+      "root",
+      "font-size"
+    ]
+  },
+  {
+    "$extensions": {
+      "nl.nldesignsystem.css.property": {
+        "syntax": "<number>",
+        "inherits": true
+      },
+      "nl.nldesignsystem.figma.supports-token": false
+    },
+    "type": "other",
+    "value": "0.54",
+    "filePath": "src/component/utrecht/root.tokens.json",
+    "isSource": true,
+    "original": {
+      "$extensions": {
+        "nl.nldesignsystem.css.property": {
+          "syntax": "<number>",
+          "inherits": true
+        },
+        "nl.nldesignsystem.figma.supports-token": false
+      },
+      "type": "other",
+      "value": "0.54"
+    },
+    "name": "utrechtRootFontSizeAdjust",
+    "attributes": {},
+    "path": [
+      "utrecht",
+      "root",
+      "font-size-adjust"
+    ]
+  },
+  {
+    "$extensions": {
+      "nl.nldesignsystem.css.property": {
+        "syntax": [
+          "<length>",
+          "<number>"
+        ],
+        "inherits": true
+      },
+      "nl.nldesignsystem.figma.supports-token": false,
+      "studio.tokens": {
+        "originalType": "lineHeights"
+      }
+    },
+    "type": "lineHeight",
+    "value": "1.4",
+    "filePath": "src/component/utrecht/root.tokens.json",
+    "isSource": true,
+    "original": {
+      "$extensions": {
+        "nl.nldesignsystem.css.property": {
+          "syntax": [
+            "<length>",
+            "<number>"
+          ],
+          "inherits": true
+        },
+        "nl.nldesignsystem.figma.supports-token": false,
+        "studio.tokens": {
+          "originalType": "lineHeights"
+        }
+      },
+      "type": "lineHeight",
+      "value": "1.4"
+    },
+    "name": "utrechtRootLineHeight",
+    "attributes": {},
+    "path": [
+      "utrecht",
+      "root",
+      "line-height"
+    ]
+  },
   {
     "$extensions": {
       "nl.nldesignsystem.css.property": {

package/dist/property.css

@@ -718,6 +718,9 @@
 @property --utrecht-rich-text-stranger-margin-block-end { syntax: '<length>'; inherits: true; }
 @property --utrecht-root-background-color { syntax: '<color>'; inherits: true; }
 @property --utrecht-root-color { syntax: '<color>'; inherits: true; }
+@property --utrecht-root-font-size { syntax: '<length>'; inherits: true; }
+@property --utrecht-root-font-size-adjust { syntax: '<number>'; inherits: true; }
+@property --utrecht-root-line-height { syntax: '<length> | <number>'; inherits: true; }
 @property --utrecht-search-bar-button-background-color { syntax: '<color>'; inherits: true; }
 @property --utrecht-search-bar-button-border-color { syntax: '<length>'; inherits: true; }
 @property --utrecht-search-bar-button-color { syntax: '<color>'; inherits: true; }

package/dist/root.css

@@ -117,6 +117,8 @@
   --utrecht-search-bar-dropdown-border-width: 1px;
   --utrecht-search-bar-button-hover-scale: 1;
   --utrecht-search-bar-button-hover-background-color: hsl(359 65% 58%);
+  --utrecht-root-line-height: 1.4;
+  --utrecht-root-font-size-adjust: 0.54;
   --utrecht-rich-text-confidant-margin-block-end: 0;
   --utrecht-radio-button-size: 24px;
   --utrecht-radio-button-margin-inline-end: 12px;
@@ -537,8 +539,10 @@
   --utrecht-search-bar-button-color: var(--utrecht-color-white);
   --utrecht-search-bar-button-border-color: var(--utrecht-color-red-40);
   --utrecht-search-bar-button-background-color: var(--utrecht-color-red-40);
-  --utrecht-root-color: var(--utrecht-color-grey-10);
-  --utrecht-root-background-color: var(--utrecht-color-grey-95);
+  --utrecht-root-font-size: var(--utrecht-typography-scale-md-font-size);
+  --utrecht-root-font-family: var(--utrecht-typography-sans-serif-font-family);
+  --utrecht-root-color: var(--utrecht-color-black);
+  --utrecht-root-background-color: var(--utrecht-color-white);
   --utrecht-rich-text-stranger-margin-block-end: var(--utrecht-space-block-2xl);
   --utrecht-rich-text-friend-margin-block-end: var(--utrecht-space-block-md);
   --utrecht-rich-text-best-friend-margin-block-end: var(--utrecht-space-block-xs);

package/dist/theme-prince-xml.css

@@ -135,6 +135,8 @@
   --utrecht-search-bar-input-background-position-x: .5em;
   --utrecht-search-bar-button-hover-scale: 1;
   --utrecht-search-bar-button-hover-background-color: hsl(359 65% 58%);
+  --utrecht-root-line-height: 1.4;
+  --utrecht-root-font-size-adjust: 0.54;
   --utrecht-rich-text-confidant-margin-block-end: 0;
   --utrecht-radio-button-border-radius: 0;
   --utrecht-radio-button-invalid-border-width: 2px;
@@ -608,8 +610,10 @@
   --utrecht-search-bar-button-color: var(--utrecht-color-white);
   --utrecht-search-bar-button-border-color: var(--utrecht-color-red-40);
   --utrecht-search-bar-button-background-color: var(--utrecht-color-red-40);
-  --utrecht-root-color: var(--utrecht-color-grey-10);
-  --utrecht-root-background-color: var(--utrecht-color-grey-95);
+  --utrecht-root-font-size: var(--utrecht-typography-scale-md-font-size);
+  --utrecht-root-font-family: var(--utrecht-typography-sans-serif-font-family);
+  --utrecht-root-color: var(--utrecht-color-black);
+  --utrecht-root-background-color: var(--utrecht-color-white);
   --utrecht-rich-text-best-friend-margin-block-end: var(--utrecht-space-block-xs);
   --utrecht-rich-text-friend-margin-block-end: var(--utrecht-space-block-md);
   --utrecht-rich-text-acquaintance-margin-block-end: var(--utrecht-space-block-xl);

package/dist/theme.css

@@ -117,6 +117,8 @@
   --utrecht-search-bar-dropdown-border-width: 1px;
   --utrecht-search-bar-button-hover-scale: 1;
   --utrecht-search-bar-button-hover-background-color: hsl(359 65% 58%);
+  --utrecht-root-line-height: 1.4;
+  --utrecht-root-font-size-adjust: 0.54;
   --utrecht-rich-text-confidant-margin-block-end: 0;
   --utrecht-radio-button-size: 24px;
   --utrecht-radio-button-margin-inline-end: 12px;
@@ -537,8 +539,10 @@
   --utrecht-search-bar-button-color: var(--utrecht-color-white);
   --utrecht-search-bar-button-border-color: var(--utrecht-color-red-40);
   --utrecht-search-bar-button-background-color: var(--utrecht-color-red-40);
-  --utrecht-root-color: var(--utrecht-color-grey-10);
-  --utrecht-root-background-color: var(--utrecht-color-grey-95);
+  --utrecht-root-font-size: var(--utrecht-typography-scale-md-font-size);
+  --utrecht-root-font-family: var(--utrecht-typography-sans-serif-font-family);
+  --utrecht-root-color: var(--utrecht-color-black);
+  --utrecht-root-background-color: var(--utrecht-color-white);
   --utrecht-rich-text-stranger-margin-block-end: var(--utrecht-space-block-2xl);
   --utrecht-rich-text-friend-margin-block-end: var(--utrecht-space-block-md);
   --utrecht-rich-text-best-friend-margin-block-end: var(--utrecht-space-block-xs);

package/dist/tokens.cjs

@@ -3788,7 +3788,9 @@ module.exports = {
             "syntax": "*",
             "inherits": true
           },
+          "nl.nldesignsystem.deprecated": true,
           "nl.nldesignsystem.figma.supports-token": true,
+          "nl.nldesignsystem.redirect": "utrecht.root.font-family",
           "studio.tokens": {
             "originalType": "fontFamilies"
           }
@@ -3803,7 +3805,9 @@ module.exports = {
               "syntax": "*",
               "inherits": true
             },
+            "nl.nldesignsystem.deprecated": true,
             "nl.nldesignsystem.figma.supports-token": true,
+            "nl.nldesignsystem.redirect": "utrecht.root.font-family",
             "studio.tokens": {
               "originalType": "fontFamilies"
             }
@@ -3825,7 +3829,9 @@ module.exports = {
             "syntax": "<length>",
             "inherits": true
           },
+          "nl.nldesignsystem.deprecated": true,
           "nl.nldesignsystem.figma.supports-token": true,
+          "nl.nldesignsystem.redirect": "utrecht.root.font-size",
           "studio.tokens": {
             "originalType": "fontSizes"
           }
@@ -3840,7 +3846,9 @@ module.exports = {
               "syntax": "<length>",
               "inherits": true
             },
+            "nl.nldesignsystem.deprecated": true,
             "nl.nldesignsystem.figma.supports-token": true,
+            "nl.nldesignsystem.redirect": "utrecht.root.font-size",
             "studio.tokens": {
               "originalType": "fontSizes"
             }
@@ -3862,7 +3870,9 @@ module.exports = {
             "syntax": "<number>",
             "inherits": true
           },
-          "nl.nldesignsystem.figma.supports-token": true
+          "nl.nldesignsystem.deprecated": true,
+          "nl.nldesignsystem.figma.supports-token": true,
+          "nl.nldesignsystem.redirect": "utrecht.root.font-weight"
         },
         "type": "fontWeights"
       },
@@ -3875,7 +3885,9 @@ module.exports = {
             ],
             "inherits": true
           },
+          "nl.nldesignsystem.deprecated": true,
           "nl.nldesignsystem.figma.supports-token": true,
+          "nl.nldesignsystem.redirect": "utrecht.root.font-family",
           "studio.tokens": {
             "originalType": "lineHeights"
           }
@@ -3893,7 +3905,9 @@ module.exports = {
               ],
               "inherits": true
             },
+            "nl.nldesignsystem.deprecated": true,
             "nl.nldesignsystem.figma.supports-token": true,
+            "nl.nldesignsystem.redirect": "utrecht.root.font-family",
             "studio.tokens": {
               "originalType": "lineHeights"
             }
@@ -34912,7 +34926,7 @@ module.exports = {
           "nl.nldesignsystem.figma.supports-token": false
         },
         "type": "color",
-        "value": "hsl(0 0% 95%)",
+        "value": "hsl(0 0% 100%)",
         "filePath": "src/component/utrecht/root.tokens.json",
         "isSource": true,
         "original": {
@@ -34924,7 +34938,7 @@ module.exports = {
             "nl.nldesignsystem.figma.supports-token": false
           },
           "type": "color",
-          "value": "{utrecht.color.grey.95}"
+          "value": "{utrecht.color.white}"
         },
         "name": "background-color",
         "attributes": {},
@@ -34943,7 +34957,7 @@ module.exports = {
           "nl.nldesignsystem.figma.supports-token": false
         },
         "type": "color",
-        "value": "hsl(0 0% 10%)",
+        "value": "hsl(0 0% 0%)",
         "filePath": "src/component/utrecht/root.tokens.json",
         "isSource": true,
         "original": {
@@ -34955,7 +34969,7 @@ module.exports = {
             "nl.nldesignsystem.figma.supports-token": false
           },
           "type": "color",
-          "value": "{utrecht.color.grey.10}"
+          "value": "{utrecht.color.black}"
         },
         "name": "color",
         "attributes": {},
@@ -34971,9 +34985,157 @@ module.exports = {
             "syntax": "*",
             "inherits": true
           },
+          "nl.nldesignsystem.figma.supports-token": false,
+          "studio.tokens": {
+            "originalType": "fontFamilies"
+          }
+        },
+        "type": "fontFamily",
+        "value": "\"Noto Sans Variable\", \"Arial\", sans-serif",
+        "filePath": "src/component/utrecht/root.tokens.json",
+        "isSource": true,
+        "original": {
+          "$extensions": {
+            "nl.nldesignsystem.css.property": {
+              "syntax": "*",
+              "inherits": true
+            },
+            "nl.nldesignsystem.figma.supports-token": false,
+            "studio.tokens": {
+              "originalType": "fontFamilies"
+            }
+          },
+          "type": "fontFamily",
+          "value": "{utrecht.typography.sans-serif.font-family}"
+        },
+        "name": "font-family",
+        "attributes": {},
+        "path": [
+          "utrecht",
+          "root",
+          "font-family"
+        ]
+      },
+      "font-size-adjust": {
+        "$extensions": {
+          "nl.nldesignsystem.css.property": {
+            "syntax": "<number>",
+            "inherits": true
+          },
           "nl.nldesignsystem.figma.supports-token": false
         },
-        "type": "fontFamilies"
+        "type": "other",
+        "value": "0.54",
+        "filePath": "src/component/utrecht/root.tokens.json",
+        "isSource": true,
+        "original": {
+          "$extensions": {
+            "nl.nldesignsystem.css.property": {
+              "syntax": "<number>",
+              "inherits": true
+            },
+            "nl.nldesignsystem.figma.supports-token": false
+          },
+          "type": "other",
+          "value": "0.54"
+        },
+        "name": "font-size-adjust",
+        "attributes": {},
+        "path": [
+          "utrecht",
+          "root",
+          "font-size-adjust"
+        ]
+      },
+      "font-size": {
+        "$extensions": {
+          "nl.nldesignsystem.css.property": {
+            "syntax": "<length>",
+            "inherits": true
+          },
+          "nl.nldesignsystem.figma.supports-token": false,
+          "studio.tokens": {
+            "originalType": "fontSizes"
+          }
+        },
+        "type": "fontSize",
+        "value": "1rem",
+        "filePath": "src/component/utrecht/root.tokens.json",
+        "isSource": true,
+        "original": {
+          "$extensions": {
+            "nl.nldesignsystem.css.property": {
+              "syntax": "<length>",
+              "inherits": true
+            },
+            "nl.nldesignsystem.figma.supports-token": false,
+            "studio.tokens": {
+              "originalType": "fontSizes"
+            }
+          },
+          "type": "fontSize",
+          "value": "{utrecht.typography.scale.md.font-size}"
+        },
+        "name": "font-size",
+        "attributes": {},
+        "path": [
+          "utrecht",
+          "root",
+          "font-size"
+        ]
+      },
+      "font-weight": {
+        "$extensions": {
+          "nl.nldesignsystem.css.property": {
+            "syntax": "<number>",
+            "inherits": true
+          },
+          "nl.nldesignsystem.figma.supports-token": false
+        },
+        "type": "fontWeights"
+      },
+      "line-height": {
+        "$extensions": {
+          "nl.nldesignsystem.css.property": {
+            "syntax": [
+              "<length>",
+              "<number>"
+            ],
+            "inherits": true
+          },
+          "nl.nldesignsystem.figma.supports-token": false,
+          "studio.tokens": {
+            "originalType": "lineHeights"
+          }
+        },
+        "type": "lineHeight",
+        "value": "1.4",
+        "filePath": "src/component/utrecht/root.tokens.json",
+        "isSource": true,
+        "original": {
+          "$extensions": {
+            "nl.nldesignsystem.css.property": {
+              "syntax": [
+                "<length>",
+                "<number>"
+              ],
+              "inherits": true
+            },
+            "nl.nldesignsystem.figma.supports-token": false,
+            "studio.tokens": {
+              "originalType": "lineHeights"
+            }
+          },
+          "type": "lineHeight",
+          "value": "1.4"
+        },
+        "name": "line-height",
+        "attributes": {},
+        "path": [
+          "utrecht",
+          "root",
+          "line-height"
+        ]
       }
     },
     "search-bar": {

package/dist/tokens.d.ts

@@ -4077,11 +4077,15 @@ declare const tokens: {
     "root": {
       "background-color": DesignToken,
       "color": DesignToken,
-      "font-family": {
+      "font-family": DesignToken,
+      "font-size-adjust": DesignToken,
+      "font-size": DesignToken,
+      "font-weight": {
         "$extensions": {
           "nl.nldesignsystem.css.property": {}
         }
-      }
+      },
+      "line-height": DesignToken
     },
     "search-bar": {
       "button": {