@utrecht/design-tokens 2.1.1 → 2.3.0

package/dist/dark/index.tokens.json

@@ -409,6 +409,7 @@
         "color": "hsl(0 0% 100%)"
       }
     },
+    "alternate-lang-nav": {},
     "article": {
       "max-inline-size": "780px"
     },
@@ -841,7 +842,7 @@
           },
           "type": "color"
         },
-        "font-size": "0.75rem"
+        "font-size": "0.875rem"
       },
       "quote": {
         "color": {
@@ -868,6 +869,51 @@
       "margin-block-start": "1.6em",
       "margin-block-end": "1.6em"
     },
+    "body": {
+      "font-family": {
+        "$extensions": {
+          "nl.nldesignsystem.css.property": {
+            "syntax": "*",
+            "inherits": true
+          },
+          "nl.nldesignsystem.figma.supports-token": true
+        },
+        "type": "fontFamilies"
+      },
+      "font-size": {
+        "$extensions": {
+          "nl.nldesignsystem.css.property": {
+            "syntax": "<length>",
+            "inherits": true
+          },
+          "nl.nldesignsystem.figma.supports-token": true
+        },
+        "type": "fontSizes"
+      },
+      "font-weight": {
+        "$extensions": {
+          "nl.nldesignsystem.css.property": {
+            "syntax": "<number>",
+            "inherits": true
+          },
+          "nl.nldesignsystem.figma.supports-token": true
+        },
+        "type": "fontWeights"
+      },
+      "line-height": {
+        "$extensions": {
+          "nl.nldesignsystem.css.property": {
+            "syntax": [
+              "<length>",
+              "<number>"
+            ],
+            "inherits": true
+          },
+          "nl.nldesignsystem.figma.supports-token": true
+        },
+        "type": "lineHeights"
+      }
+    },
     "breadcrumb-nav": {
       "min-block-size": "34px",
       "font-family": {
@@ -2458,6 +2504,20 @@
         }
       }
     },
+    "combobox": {
+      "popover": {
+        "z-index": {
+          "$extensions": {
+            "nl.nldesignsystem.css.property": {
+              "syntax": "<number>",
+              "inherits": true
+            },
+            "nl.nldesignsystem.figma.supports-token": false
+          },
+          "type": "other"
+        }
+      }
+    },
     "action": {
       "activate": {
         "cursor": "pointer"
@@ -3892,6 +3952,7 @@
       },
       "font-weight": "700"
     },
+    "html-content": {},
     "iban-data": {},
     "icon": {
       "color": {
@@ -4320,9 +4381,67 @@
           "color": "hsl(0 0% 0%)",
           "font-weight": "700"
         },
+        "disabled": {
+          "background-color": {
+            "$extensions": {
+              "nl.nldesignsystem.css.property": {
+                "syntax": "<color>",
+                "inherits": true
+              }
+            }
+          },
+          "color": {
+            "$extensions": {
+              "nl.nldesignsystem.css.property": {
+                "syntax": "<color>",
+                "inherits": true
+              }
+            }
+          }
+        },
+        "hover": {
+          "background-color": "hsl(211 60% 90%)",
+          "color": "hsl(0 0% 0%)"
+        },
         "selected": {
           "background-color": "hsl(0 0% 95%)",
-          "color": "hsl(0 0% 0%)"
+          "color": "hsl(0 0% 0%)",
+          "disabled": {
+            "background-color": {
+              "$extensions": {
+                "nl.nldesignsystem.css.property": {
+                  "syntax": "<color>",
+                  "inherits": true
+                }
+              }
+            },
+            "color": {
+              "$extensions": {
+                "nl.nldesignsystem.css.property": {
+                  "syntax": "<color>",
+                  "inherits": true
+                }
+              }
+            }
+          },
+          "hover": {
+            "background-color": {
+              "$extensions": {
+                "nl.nldesignsystem.css.property": {
+                  "syntax": "<color>",
+                  "inherits": true
+                }
+              }
+            },
+            "color": {
+              "$extensions": {
+                "nl.nldesignsystem.css.property": {
+                  "syntax": "<color>",
+                  "inherits": true
+                }
+              }
+            }
+          }
         },
         "icon": {
           "size": {
@@ -4333,10 +4452,6 @@
               }
             }
           }
-        },
-        "hover": {
-          "color": "hsl(0 0% 0%)",
-          "background-color": "hsl(211 60% 90%)"
         }
       },
       "z-index": {},
@@ -4483,6 +4598,26 @@
       "background-color": "hsl(0 0% 100%)",
       "color": "hsl(0 0% 0%)",
       "content": {
+        "background-color": {
+          "$extensions": {
+            "nl.nldesignsystem.css.property": {
+              "syntax": "<color>",
+              "inherits": true
+            },
+            "nl.nldesignsystem.figma.supports-token": false
+          },
+          "type": "color"
+        },
+        "color": {
+          "$extensions": {
+            "nl.nldesignsystem.css.property": {
+              "syntax": "<color>",
+              "inherits": true
+            },
+            "nl.nldesignsystem.figma.supports-token": false
+          },
+          "type": "color"
+        },
         "max-inline-size": "1184px"
       },
       "link": {
@@ -4682,6 +4817,90 @@
         "padding-inline-start": "0"
       }
     },
+    "page-body": {
+      "background-color": {
+        "$extensions": {
+          "nl.nldesignsystem.css.property": {
+            "syntax": "<color>",
+            "inherits": true
+          },
+          "nl.nldesignsystem.figma.supports-token": false
+        },
+        "type": "color"
+      },
+      "color": {
+        "$extensions": {
+          "nl.nldesignsystem.css.property": {
+            "syntax": "<color>",
+            "inherits": true
+          },
+          "nl.nldesignsystem.figma.supports-token": false
+        },
+        "type": "color"
+      },
+      "content": {
+        "background-color": {
+          "$extensions": {
+            "nl.nldesignsystem.css.property": {
+              "syntax": "<color>",
+              "inherits": true
+            },
+            "nl.nldesignsystem.figma.supports-token": false
+          },
+          "type": "color"
+        },
+        "color": {
+          "$extensions": {
+            "nl.nldesignsystem.css.property": {
+              "syntax": "<color>",
+              "inherits": true
+            },
+            "nl.nldesignsystem.figma.supports-token": false
+          },
+          "type": "color"
+        },
+        "padding-block-start": {
+          "$extensions": {
+            "nl.nldesignsystem.css.property": {
+              "syntax": "<length>",
+              "inherits": true
+            },
+            "nl.nldesignsystem.figma.supports-token": false
+          },
+          "type": "spacing"
+        },
+        "padding-block-end": {
+          "$extensions": {
+            "nl.nldesignsystem.css.property": {
+              "syntax": "<length>",
+              "inherits": true
+            },
+            "nl.nldesignsystem.figma.supports-token": false
+          },
+          "type": "spacing"
+        },
+        "padding-inline-start": {
+          "$extensions": {
+            "nl.nldesignsystem.css.property": {
+              "syntax": "<length>",
+              "inherits": true
+            },
+            "nl.nldesignsystem.figma.supports-token": false
+          },
+          "type": "spacing"
+        },
+        "padding-inine-end": {
+          "$extensions": {
+            "nl.nldesignsystem.css.property": {
+              "syntax": "<length>",
+              "inherits": true
+            },
+            "nl.nldesignsystem.figma.supports-token": false
+          },
+          "type": "spacing"
+        }
+      }
+    },
     "page-content": {
       "padding-block-start": "2em",
       "padding-block-end": "2em",
@@ -4713,7 +4932,69 @@
       "padding-inline-end": "28px",
       "padding-inline-start": "28px",
       "padding-block-end": "48px",
-      "padding-block-start": "48px"
+      "padding-block-start": "48px",
+      "content": {
+        "color": {
+          "$extensions": {
+            "nl.nldesignsystem.css.property": {
+              "syntax": "<color>",
+              "inherits": true
+            },
+            "nl.nldesignsystem.figma.supports-token": false
+          },
+          "type": "color"
+        },
+        "background-color": {
+          "$extensions": {
+            "nl.nldesignsystem.css.property": {
+              "syntax": "<color>",
+              "inherits": true
+            },
+            "nl.nldesignsystem.figma.supports-token": false
+          },
+          "type": "color"
+        },
+        "padding-inline-end": {
+          "$extensions": {
+            "nl.nldesignsystem.css.property": {
+              "syntax": "<length>",
+              "inherits": true
+            },
+            "nl.nldesignsystem.figma.supports-token": false
+          },
+          "type": "spacing"
+        },
+        "padding-inline-start": {
+          "$extensions": {
+            "nl.nldesignsystem.css.property": {
+              "syntax": "<length>",
+              "inherits": true
+            },
+            "nl.nldesignsystem.figma.supports-token": false
+          },
+          "type": "spacing"
+        },
+        "padding-block-end": {
+          "$extensions": {
+            "nl.nldesignsystem.css.property": {
+              "syntax": "<length>",
+              "inherits": true
+            },
+            "nl.nldesignsystem.figma.supports-token": false
+          },
+          "type": "spacing"
+        },
+        "padding-block-start": {
+          "$extensions": {
+            "nl.nldesignsystem.css.property": {
+              "syntax": "<length>",
+              "inherits": true
+            },
+            "nl.nldesignsystem.figma.supports-token": false
+          },
+          "type": "spacing"
+        }
+      }
     },
     "page-header": {
       "background-color": {
@@ -4726,6 +5007,16 @@
         },
         "type": "color"
       },
+      "border-block-end-color": {
+        "$extensions": {
+          "nl.nldesignsystem.css.property": {
+            "syntax": "<color>",
+            "inherits": true
+          },
+          "nl.nldesignsystem.figma.supports-token": false
+        },
+        "type": "color"
+      },
       "color": {
         "$extensions": {
           "nl.nldesignsystem.css.property": {
@@ -4739,8 +5030,71 @@
       "padding-block-start": "1.8em",
       "padding-block-end": "1em",
       "padding-inline-start": "2em",
-      "padding-inline-end": "2.4em"
+      "padding-inline-end": "2.4em",
+      "content": {
+        "background-color": {
+          "$extensions": {
+            "nl.nldesignsystem.css.property": {
+              "syntax": "<color>",
+              "inherits": true
+            },
+            "nl.nldesignsystem.figma.supports-token": false
+          },
+          "type": "color"
+        },
+        "color": {
+          "$extensions": {
+            "nl.nldesignsystem.css.property": {
+              "syntax": "<color>",
+              "inherits": true
+            },
+            "nl.nldesignsystem.figma.supports-token": false
+          },
+          "type": "color"
+        },
+        "padding-block-start": {
+          "$extensions": {
+            "nl.nldesignsystem.css.property": {
+              "syntax": "<length>",
+              "inherits": true
+            },
+            "nl.nldesignsystem.figma.supports-token": false
+          },
+          "type": "spacing"
+        },
+        "padding-block-end": {
+          "$extensions": {
+            "nl.nldesignsystem.css.property": {
+              "syntax": "<length>",
+              "inherits": true
+            },
+            "nl.nldesignsystem.figma.supports-token": false
+          },
+          "type": "spacing"
+        },
+        "padding-inline-start": {
+          "$extensions": {
+            "nl.nldesignsystem.css.property": {
+              "syntax": "<length>",
+              "inherits": true
+            },
+            "nl.nldesignsystem.figma.supports-token": false
+          },
+          "type": "spacing"
+        },
+        "padding-inline-end": {
+          "$extensions": {
+            "nl.nldesignsystem.css.property": {
+              "syntax": "<length>",
+              "inherits": true
+            },
+            "nl.nldesignsystem.figma.supports-token": false
+          },
+          "type": "spacing"
+        }
+      }
     },
+    "page-layout": {},
     "page": {
       "background-color": "hsl(0 0% 15%)",
       "color": "hsl(0 0% 95%)",
@@ -5331,6 +5685,38 @@
         "margin-block-end": 0
       }
     },
+    "root": {
+      "background-color": {
+        "$extensions": {
+          "nl.nldesignsystem.css.property": {
+            "syntax": "<color>",
+            "inherits": true
+          },
+          "nl.nldesignsystem.figma.supports-token": false
+        },
+        "type": "color"
+      },
+      "color": {
+        "$extensions": {
+          "nl.nldesignsystem.css.property": {
+            "syntax": "<color>",
+            "inherits": true
+          },
+          "nl.nldesignsystem.figma.supports-token": false
+        },
+        "type": "color"
+      },
+      "font-family": {
+        "$extensions": {
+          "nl.nldesignsystem.css.property": {
+            "syntax": "*",
+            "inherits": true
+          },
+          "nl.nldesignsystem.figma.supports-token": false
+        },
+        "type": "fontFamilies"
+      }
+    },
     "search-bar": {
       "button": {
         "background-color": "hsl(0 100% 40%)",
@@ -5764,6 +6150,53 @@
           "type": "color"
         }
       },
+      "hover": {
+        "background-color": {
+          "$extensions": {
+            "nl.nldesignsystem.css.property": {
+              "syntax": "<color>",
+              "inherits": true
+            },
+            "nl.nldesignsystem.fallback": [
+              "utrecht.form-control.hover.background-color",
+              "utrecht.select.background-color",
+              "utrecht.form-control.background-color"
+            ],
+            "nl.nldesignsystem.figma.supports-token": true
+          },
+          "type": "color"
+        },
+        "border-color": {
+          "$extensions": {
+            "nl.nldesignsystem.css.property": {
+              "syntax": "<color>",
+              "inherits": true
+            },
+            "nl.nldesignsystem.fallback": [
+              "utrecht.form-control.hover.border-color",
+              "utrecht.select.border-color",
+              "utrecht.form-control.border-color"
+            ],
+            "nl.nldesignsystem.figma.supports-token": true
+          },
+          "type": "color"
+        },
+        "color": {
+          "$extensions": {
+            "nl.nldesignsystem.css.property": {
+              "syntax": "<color>",
+              "inherits": true
+            },
+            "nl.nldesignsystem.fallback": [
+              "utrecht.form-control.hover.color",
+              "utrecht.select.color",
+              "utrecht.form-control.color"
+            ],
+            "nl.nldesignsystem.figma.supports-token": true
+          },
+          "type": "color"
+        }
+      },
       "focus": {
         "background-color": {
           "$extensions": {
@@ -7524,12 +7957,6 @@
         "font-family": "\"Lucida Grande\", \"Lucida Sans Unicode\", \"Lucida Sans\", \"Arial\", sans-serif"
       },
       "scale": {
-        "2xs": {
-          "font-size": "0.5rem"
-        },
-        "xs": {
-          "font-size": "0.75rem"
-        },
         "sm": {
           "font-size": "0.875rem"
         },

package/dist/dark/list.d.ts

@@ -0,0 +1,14 @@
+
+declare interface DesignToken {
+  value?: any;
+  type?: string;
+  comment?: string;
+  name?: string;
+  themeable?: boolean;
+  attributes?: Record<string, unknown>;
+  [key: string]: any;
+}
+
+export default tokens;
+
+declare const tokens: DesignToken[];

package/dist/dark/list.json

@@ -4047,7 +4047,7 @@
       }
     },
     "type": "fontSize",
-    "value": "0.75rem",
+    "value": "0.875rem",
     "filePath": "src/component/utrecht/blockquote.tokens.json",
     "isSource": true,
     "original": {
@@ -4062,7 +4062,7 @@
         }
       },
       "type": "fontSize",
-      "value": "{utrecht.typography.scale.xs.font-size}"
+      "value": "{utrecht.typography.scale.sm.font-size}"
     },
     "name": "utrechtBlockquoteCaptionFontSize",
     "attributes": {},
@@ -18845,10 +18845,22 @@
     ]
   },
   {
+    "$extensions": {
+      "nl.nldesignsystem.css.property": {
+        "syntax": "<color>",
+        "inherits": true
+      }
+    },
     "value": "hsl(211 60% 90%)",
     "filePath": "src/component/utrecht/listbox.tokens.json",
     "isSource": true,
     "original": {
+      "$extensions": {
+        "nl.nldesignsystem.css.property": {
+          "syntax": "<color>",
+          "inherits": true
+        }
+      },
       "value": "{utrecht.color.blue.90}"
     },
     "name": "utrechtListboxOptionHoverBackgroundColor",
@@ -18862,10 +18874,22 @@
     ]
   },
   {
+    "$extensions": {
+      "nl.nldesignsystem.css.property": {
+        "syntax": "<color>",
+        "inherits": true
+      }
+    },
     "value": "hsl(0 0% 0%)",
     "filePath": "src/component/utrecht/listbox.tokens.json",
     "isSource": true,
     "original": {
+      "$extensions": {
+        "nl.nldesignsystem.css.property": {
+          "syntax": "<color>",
+          "inherits": true
+        }
+      },
       "value": "{utrecht.color.black}"
     },
     "name": "utrechtListboxOptionHoverColor",
@@ -30337,25 +30361,6 @@
       "font-size"
     ]
   },
-  {
-    "value": "0.5rem",
-    "comment": "8px",
-    "filePath": "src/brand/utrecht/typography.tokens.json",
-    "isSource": true,
-    "original": {
-      "value": "8px",
-      "comment": "8px"
-    },
-    "name": "utrechtTypographyScale2xsFontSize",
-    "attributes": {},
-    "path": [
-      "utrecht",
-      "typography",
-      "scale",
-      "2xs",
-      "font-size"
-    ]
-  },
   {
     "value": "1.5rem",
     "comment": "24px",
@@ -30470,25 +30475,6 @@
       "font-size"
     ]
   },
-  {
-    "value": "0.75rem",
-    "comment": "12px",
-    "filePath": "src/brand/utrecht/typography.tokens.json",
-    "isSource": true,
-    "original": {
-      "value": "12px",
-      "comment": "12px"
-    },
-    "name": "utrechtTypographyScaleXsFontSize",
-    "attributes": {},
-    "path": [
-      "utrecht",
-      "typography",
-      "scale",
-      "xs",
-      "font-size"
-    ]
-  },
   {
     "value": "700",
     "filePath": "src/brand/utrecht/typography.tokens.json",