@rijkshuisstijl-community/design-tokens 10.0.1 → 11.0.0

package/dist/kern-lintblauw/index.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly, this file was auto-generated.
- * Generated on Mon, 15 Dec 2025 18:39:48 GMT
+ * Generated on Tue, 30 Dec 2025 09:35:40 GMT
  */
 
 export const rhcBorderRadiusRound = "999px";
@@ -436,32 +436,34 @@ export const rhcNavBarHeadingFontWeight = "700";
 export const rhcNavBarBackgroundColor = "#ffffff";
 export const rhcNavBarColor = "#154273";
 export const rhcNavBarBorderColor = "#4f7196";
-export const rhcNavigationListIconBackgroundColor = "#0f172a";
-export const rhcNavigationListIconBorderRadius = "999px";
-export const rhcNavigationListIconColor = "#ffffff";
-export const rhcNavigationListItemIconPaddingInline = "0.5rem";
-export const rhcNavigationListItemIconPaddingBlock = "0.5rem";
-export const rhcNavigationListItemIconSize = "24px";
-export const rhcNavigationListItemContentFontSize = "1.25rem";
-export const rhcNavigationListItemContentColumnGap = "0.5rem";
-export const rhcNavigationListItemContentRowGap = "0.25rem";
-export const rhcNavigationListItemLabelFontFamily =
-  "'Fira Sans', Arial, Verdana, sans-serif";
-export const rhcNavigationListItemLabelFontSize = "1.875rem";
-export const rhcNavigationListItemLabelFontWeight = "700";
-export const rhcNavigationListItemLabelLineHeight = "150%";
-export const rhcNavigationListItemActiveBackgroundColor = "#f1f5f9";
-export const rhcNavigationListItemHoverBackgroundColor = "#f8fafc";
-export const rhcNavigationListItemFocusBackgroundColor = "#dce3ea";
 export const rhcNavigationListItemBackgroundColor = "#ffffff";
-export const rhcNavigationListItemColor = "#334155";
-export const rhcNavigationListItemBorderWidth = "1px";
 export const rhcNavigationListItemBorderColor = "#cbd5e1";
-export const rhcNavigationListItemHeadingColor = "#0f172a";
+export const rhcNavigationListItemBorderWidth = "1px";
 export const rhcNavigationListItemColumnGap = "1rem";
 export const rhcNavigationListItemMinHeight = "48px";
 export const rhcNavigationListItemPaddingBlock = "0.75rem";
 export const rhcNavigationListItemPaddingInline = "1rem";
+export const rhcNavigationListItemActiveBackgroundColor = "#f1f5f9";
+export const rhcNavigationListItemHoverBackgroundColor = "#f8fafc";
+export const rhcNavigationListItemFocusBackgroundColor = "#dce3ea";
+export const rhcNavigationListItemContentColumnGap = "0.5rem"; // [code-only]
+export const rhcNavigationListItemContentRowGap = "0.25rem"; // [code-only]
+export const rhcNavigationListItemDescriptionColor = "#334155";
+export const rhcNavigationListItemDescriptionFontSize = "1.25rem";
+export const rhcNavigationListItemDescriptionLineHeight = "150%";
+export const rhcNavigationListItemIconEndColor = "#334155";
+export const rhcNavigationListItemIconStartBackgroundColor = "#0f172a";
+export const rhcNavigationListItemIconStartBorderRadius = "999px";
+export const rhcNavigationListItemIconStartColor = "#ffffff";
+export const rhcNavigationListItemIconStartPaddingBlock = "0.5rem";
+export const rhcNavigationListItemIconStartPaddingInline = "0.5rem";
+export const rhcNavigationListItemIconStartSize = "24px";
+export const rhcNavigationListItemLabelColor = "#0f172a";
+export const rhcNavigationListItemLabelFontFamily =
+  "'Fira Sans', Arial, Verdana, sans-serif";
+export const rhcNavigationListItemLabelFontSize = "1.875rem";
+export const rhcNavigationListItemLabelFontWeight = "700";
+export const rhcNavigationListItemLabelLineHeight = "150%";
 export const rhcRadioGroupPaddingBlockEnd = "0.5rem";
 export const rhcRadioGroupPaddingBlockStart = "0.5rem";
 export const rhcRadioGroupRowGap = "1rem";

package/dist/kern-lintblauw/index.json

@@ -428,31 +428,33 @@
   "rhcNavBarBackgroundColor": "#ffffff",
   "rhcNavBarColor": "#154273",
   "rhcNavBarBorderColor": "#4f7196",
-  "rhcNavigationListIconBackgroundColor": "#0f172a",
-  "rhcNavigationListIconBorderRadius": "999px",
-  "rhcNavigationListIconColor": "#ffffff",
-  "rhcNavigationListItemIconPaddingInline": "0.5rem",
-  "rhcNavigationListItemIconPaddingBlock": "0.5rem",
-  "rhcNavigationListItemIconSize": "24px",
-  "rhcNavigationListItemContentFontSize": "1.25rem",
-  "rhcNavigationListItemContentColumnGap": "0.5rem",
-  "rhcNavigationListItemContentRowGap": "0.25rem",
-  "rhcNavigationListItemLabelFontFamily": "'Fira Sans', Arial, Verdana, sans-serif",
-  "rhcNavigationListItemLabelFontSize": "1.875rem",
-  "rhcNavigationListItemLabelFontWeight": "700",
-  "rhcNavigationListItemLabelLineHeight": "150%",
-  "rhcNavigationListItemActiveBackgroundColor": "#f1f5f9",
-  "rhcNavigationListItemHoverBackgroundColor": "#f8fafc",
-  "rhcNavigationListItemFocusBackgroundColor": "#dce3ea",
   "rhcNavigationListItemBackgroundColor": "#ffffff",
-  "rhcNavigationListItemColor": "#334155",
-  "rhcNavigationListItemBorderWidth": "1px",
   "rhcNavigationListItemBorderColor": "#cbd5e1",
-  "rhcNavigationListItemHeadingColor": "#0f172a",
+  "rhcNavigationListItemBorderWidth": "1px",
   "rhcNavigationListItemColumnGap": "1rem",
   "rhcNavigationListItemMinHeight": "48px",
   "rhcNavigationListItemPaddingBlock": "0.75rem",
   "rhcNavigationListItemPaddingInline": "1rem",
+  "rhcNavigationListItemActiveBackgroundColor": "#f1f5f9",
+  "rhcNavigationListItemHoverBackgroundColor": "#f8fafc",
+  "rhcNavigationListItemFocusBackgroundColor": "#dce3ea",
+  "rhcNavigationListItemContentColumnGap": "0.5rem",
+  "rhcNavigationListItemContentRowGap": "0.25rem",
+  "rhcNavigationListItemDescriptionColor": "#334155",
+  "rhcNavigationListItemDescriptionFontSize": "1.25rem",
+  "rhcNavigationListItemDescriptionLineHeight": "150%",
+  "rhcNavigationListItemIconEndColor": "#334155",
+  "rhcNavigationListItemIconStartBackgroundColor": "#0f172a",
+  "rhcNavigationListItemIconStartBorderRadius": "999px",
+  "rhcNavigationListItemIconStartColor": "#ffffff",
+  "rhcNavigationListItemIconStartPaddingBlock": "0.5rem",
+  "rhcNavigationListItemIconStartPaddingInline": "0.5rem",
+  "rhcNavigationListItemIconStartSize": "24px",
+  "rhcNavigationListItemLabelColor": "#0f172a",
+  "rhcNavigationListItemLabelFontFamily": "'Fira Sans', Arial, Verdana, sans-serif",
+  "rhcNavigationListItemLabelFontSize": "1.875rem",
+  "rhcNavigationListItemLabelFontWeight": "700",
+  "rhcNavigationListItemLabelLineHeight": "150%",
   "rhcRadioGroupPaddingBlockEnd": "0.5rem",
   "rhcRadioGroupPaddingBlockStart": "0.5rem",
   "rhcRadioGroupRowGap": "1rem",

package/dist/kern-lintblauw/index.tokens.json

@@ -678,28 +678,14 @@
       "border-color": "#4f7196"
     },
     "navigation-list": {
-      "icon": {
-        "background-color": "#0f172a",
-        "border-radius": "999px",
-        "color": "#ffffff"
-      },
       "item": {
-        "icon": {
-          "padding-inline": "0.5rem",
-          "padding-block": "0.5rem",
-          "size": "24px"
-        },
-        "content": {
-          "font-size": "1.25rem",
-          "column-gap": "0.5rem",
-          "row-gap": "0.25rem"
-        },
-        "label": {
-          "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
-          "font-size": "1.875rem",
-          "font-weight": "700",
-          "line-height": "150%"
-        },
+        "background-color": "#ffffff",
+        "border-color": "#cbd5e1",
+        "border-width": "1px",
+        "column-gap": "1rem",
+        "min-height": "48px",
+        "padding-block": "0.75rem",
+        "padding-inline": "1rem",
         "active": {
           "background-color": "#f1f5f9"
         },
@@ -709,17 +695,33 @@
         "focus": {
           "background-color": "#dce3ea"
         },
-        "background-color": "#ffffff",
-        "color": "#334155",
-        "border-width": "1px",
-        "border-color": "#cbd5e1",
-        "heading": {
-          "color": "#0f172a"
+        "content": {
+          "column-gap": "0.5rem",
+          "row-gap": "0.25rem"
         },
-        "column-gap": "1rem",
-        "min-height": "48px",
-        "padding-block": "0.75rem",
-        "padding-inline": "1rem"
+        "description": {
+          "color": "#334155",
+          "font-size": "1.25rem",
+          "line-height": "150%"
+        },
+        "icon-end": {
+          "color": "#334155"
+        },
+        "icon-start": {
+          "background-color": "#0f172a",
+          "border-radius": "999px",
+          "color": "#ffffff",
+          "padding-block": "0.5rem",
+          "padding-inline": "0.5rem",
+          "size": "24px"
+        },
+        "label": {
+          "color": "#0f172a",
+          "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
+          "font-size": "1.875rem",
+          "font-weight": "700",
+          "line-height": "150%"
+        }
       }
     },
     "radio-group": {

package/dist/kern-lintblauw/root.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly, this file was auto-generated.
- * Generated on Mon, 15 Dec 2025 18:39:48 GMT
+ * Generated on Tue, 30 Dec 2025 09:35:40 GMT
  */
 
 :root {
@@ -496,21 +496,22 @@
   --rhc-nav-bar-link-padding-inline-start: var(--rhc-space-150);
   --rhc-nav-bar-link-column-gap: var(--rhc-space-100);
   --rhc-nav-bar-background-color: var(--rhc-color-wit);
-  --rhc-navigation-list-icon-border-radius: var(--rhc-border-radius-round);
-  --rhc-navigation-list-item-icon-padding-inline: var(--rhc-space-100);
-  --rhc-navigation-list-item-icon-padding-block: var(--rhc-space-100);
-  --rhc-navigation-list-item-icon-size: var(--rhc-size-icon-md);
-  --rhc-navigation-list-item-content-column-gap: var(--rhc-space-100);
-  --rhc-navigation-list-item-content-row-gap: var(--rhc-space-50);
-  --rhc-navigation-list-item-label-line-height: var(--rhc-text-line-height-md);
-  --rhc-navigation-list-item-active-background-color: var(--rhc-color-cool-grey-100);
-  --rhc-navigation-list-item-hover-background-color: var(--rhc-color-cool-grey-50);
-  --rhc-navigation-list-item-border-width: var(--rhc-border-width-sm);
   --rhc-navigation-list-item-border-color: var(--rhc-color-cool-grey-300);
+  --rhc-navigation-list-item-border-width: var(--rhc-border-width-sm);
   --rhc-navigation-list-item-column-gap: var(--rhc-space-200);
   --rhc-navigation-list-item-min-height: var(--rhc-size-pointer-target);
   --rhc-navigation-list-item-padding-block: var(--rhc-space-150);
   --rhc-navigation-list-item-padding-inline: var(--rhc-space-200);
+  --rhc-navigation-list-item-active-background-color: var(--rhc-color-cool-grey-100);
+  --rhc-navigation-list-item-hover-background-color: var(--rhc-color-cool-grey-50);
+  --rhc-navigation-list-item-content-column-gap: var(--rhc-space-100); /** [code-only] */
+  --rhc-navigation-list-item-content-row-gap: var(--rhc-space-50); /** [code-only] */
+  --rhc-navigation-list-item-description-line-height: var(--rhc-text-line-height-md);
+  --rhc-navigation-list-item-icon-start-border-radius: var(--rhc-border-radius-round);
+  --rhc-navigation-list-item-icon-start-padding-block: var(--rhc-space-100);
+  --rhc-navigation-list-item-icon-start-padding-inline: var(--rhc-space-100);
+  --rhc-navigation-list-item-icon-start-size: var(--rhc-size-icon-md);
+  --rhc-navigation-list-item-label-line-height: var(--rhc-text-line-height-md);
   --rhc-radio-group-padding-block-end: var(--rhc-space-100);
   --rhc-radio-group-padding-block-start: var(--rhc-space-100);
   --rhc-radio-group-row-gap: var(--rhc-space-200);
@@ -1055,16 +1056,17 @@
   --rhc-nav-bar-heading-font-weight: var(--rhc-text-font-weight-strong);
   --rhc-nav-bar-color: var(--rhc-color-primary-500);
   --rhc-nav-bar-border-color: var(--rhc-color-primary-400);
-  --rhc-navigation-list-icon-background-color: var(--rhc-color-foreground-default);
-  --rhc-navigation-list-icon-color: var(--rhc-color-foreground-on-dark-color);
-  --rhc-navigation-list-item-content-font-size: var(--rhc-text-font-size-md);
+  --rhc-navigation-list-item-background-color: var(--rhc-color-bg-document);
+  --rhc-navigation-list-item-focus-background-color: var(--rhc-color-primary-50);
+  --rhc-navigation-list-item-description-color: var(--rhc-color-foreground-subtle);
+  --rhc-navigation-list-item-description-font-size: var(--rhc-text-font-size-md);
+  --rhc-navigation-list-item-icon-end-color: var(--rhc-color-foreground-subtle);
+  --rhc-navigation-list-item-icon-start-background-color: var(--rhc-color-foreground-default);
+  --rhc-navigation-list-item-icon-start-color: var(--rhc-color-foreground-on-dark-color);
+  --rhc-navigation-list-item-label-color: var(--rhc-color-foreground-default);
   --rhc-navigation-list-item-label-font-family: var(--rhc-text-font-family-default);
   --rhc-navigation-list-item-label-font-size: var(--rhc-text-font-size-xl);
   --rhc-navigation-list-item-label-font-weight: var(--rhc-text-font-weight-strong);
-  --rhc-navigation-list-item-focus-background-color: var(--rhc-color-primary-50);
-  --rhc-navigation-list-item-background-color: var(--rhc-color-bg-document);
-  --rhc-navigation-list-item-color: var(--rhc-color-foreground-subtle);
-  --rhc-navigation-list-item-heading-color: var(--rhc-color-foreground-default);
   --rhc-sidenav-link-font-size: var(--rhc-text-font-size-md);
   --rhc-sidenav-link-font-family: var(--rhc-text-font-family-default);
   --rhc-sidenav-link-font-weight: var(--rhc-text-font-weight-default);

package/dist/kern-lintblauw/tokens.d.ts

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly, this file was auto-generated.
- * Generated on Mon, 15 Dec 2025 18:39:48 GMT
+ * Generated on Tue, 30 Dec 2025 09:35:40 GMT
  */
 
 export default tokens;
@@ -695,48 +695,50 @@ declare const tokens: {
       "border-color": DesignToken;
     };
     "navigation-list": {
-      icon: {
-        "background-color": DesignToken;
-        "border-radius": DesignToken;
-        color: DesignToken;
-      };
       item: {
-        icon: {
-          "padding-inline": DesignToken;
-          "padding-block": DesignToken;
-          size: DesignToken;
+        "background-color": DesignToken;
+        "border-color": DesignToken;
+        "border-width": DesignToken;
+        "column-gap": DesignToken;
+        "min-height": DesignToken;
+        "padding-block": DesignToken;
+        "padding-inline": DesignToken;
+        active: {
+          "background-color": DesignToken;
+        };
+        hover: {
+          "background-color": DesignToken;
+        };
+        focus: {
+          "background-color": DesignToken;
         };
         content: {
-          "font-size": DesignToken;
           "column-gap": DesignToken;
           "row-gap": DesignToken;
         };
-        label: {
-          "font-family": DesignToken;
+        description: {
+          color: DesignToken;
           "font-size": DesignToken;
-          "font-weight": DesignToken;
           "line-height": DesignToken;
         };
-        active: {
-          "background-color": DesignToken;
-        };
-        hover: {
-          "background-color": DesignToken;
+        "icon-end": {
+          color: DesignToken;
         };
-        focus: {
+        "icon-start": {
           "background-color": DesignToken;
+          "border-radius": DesignToken;
+          color: DesignToken;
+          "padding-block": DesignToken;
+          "padding-inline": DesignToken;
+          size: DesignToken;
         };
-        "background-color": DesignToken;
-        color: DesignToken;
-        "border-width": DesignToken;
-        "border-color": DesignToken;
-        heading: {
+        label: {
           color: DesignToken;
+          "font-family": DesignToken;
+          "font-size": DesignToken;
+          "font-weight": DesignToken;
+          "line-height": DesignToken;
         };
-        "column-gap": DesignToken;
-        "min-height": DesignToken;
-        "padding-block": DesignToken;
-        "padding-inline": DesignToken;
       };
     };
     "radio-group": {