@utrecht/design-tokens 3.2.0 → 3.3.0

package/dist/dark/list.json

@@ -31731,6 +31731,321 @@
       "border-bottom-width"
     ]
   },
+  {
+    "$extensions": {
+      "nl.nldesignsystem.css.property": {
+        "syntax": "<color>",
+        "inherits": true
+      },
+      "nl.nldesignsystem.figma.supports-token": false
+    },
+    "type": "color",
+    "value": "hsl(0 0% 100%)",
+    "filePath": "src/component/utrecht/tooltip.tokens.json",
+    "isSource": true,
+    "original": {
+      "$extensions": {
+        "nl.nldesignsystem.css.property": {
+          "syntax": "<color>",
+          "inherits": true
+        },
+        "nl.nldesignsystem.figma.supports-token": false
+      },
+      "type": "color",
+      "value": "{utrecht.color.white}"
+    },
+    "name": "utrechtTooltipBackgroundColor",
+    "attributes": {},
+    "path": [
+      "utrecht",
+      "tooltip",
+      "background-color"
+    ]
+  },
+  {
+    "$extensions": {
+      "nl.nldesignsystem.css.property": {
+        "syntax": "<color>",
+        "inherits": true
+      },
+      "nl.nldesignsystem.figma.supports-token": false
+    },
+    "type": "color",
+    "value": "hsl(0 0% 40%)",
+    "filePath": "src/component/utrecht/tooltip.tokens.json",
+    "isSource": true,
+    "original": {
+      "$extensions": {
+        "nl.nldesignsystem.css.property": {
+          "syntax": "<color>",
+          "inherits": true
+        },
+        "nl.nldesignsystem.figma.supports-token": false
+      },
+      "type": "color",
+      "value": "{utrecht.color.grey.40}"
+    },
+    "name": "utrechtTooltipBorderColor",
+    "attributes": {},
+    "path": [
+      "utrecht",
+      "tooltip",
+      "border-color"
+    ]
+  },
+  {
+    "$extensions": {
+      "nl.nldesignsystem.css.property": {
+        "syntax": "<length-percentage>",
+        "inherits": true
+      },
+      "nl.nldesignsystem.figma.supports-token": false,
+      "studio.tokens": {
+        "originalType": "borderRadius"
+      }
+    },
+    "type": "dimension",
+    "value": "0",
+    "filePath": "src/component/utrecht/tooltip.tokens.json",
+    "isSource": true,
+    "original": {
+      "$extensions": {
+        "nl.nldesignsystem.css.property": {
+          "syntax": "<length-percentage>",
+          "inherits": true
+        },
+        "nl.nldesignsystem.figma.supports-token": false,
+        "studio.tokens": {
+          "originalType": "borderRadius"
+        }
+      },
+      "type": "dimension",
+      "value": "0"
+    },
+    "name": "utrechtTooltipBorderRadius",
+    "attributes": {},
+    "path": [
+      "utrecht",
+      "tooltip",
+      "border-radius"
+    ]
+  },
+  {
+    "$extensions": {
+      "nl.nldesignsystem.css.property": {
+        "syntax": "<length>",
+        "inherits": true
+      },
+      "nl.nldesignsystem.figma.supports-token": false,
+      "studio.tokens": {
+        "originalType": "borderWidth"
+      }
+    },
+    "type": "dimension",
+    "value": "1px",
+    "filePath": "src/component/utrecht/tooltip.tokens.json",
+    "isSource": true,
+    "original": {
+      "$extensions": {
+        "nl.nldesignsystem.css.property": {
+          "syntax": "<length>",
+          "inherits": true
+        },
+        "nl.nldesignsystem.figma.supports-token": false,
+        "studio.tokens": {
+          "originalType": "borderWidth"
+        }
+      },
+      "type": "dimension",
+      "value": "1px"
+    },
+    "name": "utrechtTooltipBorderWidth",
+    "attributes": {},
+    "path": [
+      "utrecht",
+      "tooltip",
+      "border-width"
+    ]
+  },
+  {
+    "$extensions": {
+      "nl.nldesignsystem.css.property": {
+        "syntax": "<color>",
+        "inherits": true
+      },
+      "nl.nldesignsystem.figma.supports-token": false
+    },
+    "type": "color",
+    "value": "hsl(0 0% 40%)",
+    "filePath": "src/component/utrecht/tooltip.tokens.json",
+    "isSource": true,
+    "original": {
+      "$extensions": {
+        "nl.nldesignsystem.css.property": {
+          "syntax": "<color>",
+          "inherits": true
+        },
+        "nl.nldesignsystem.figma.supports-token": false
+      },
+      "type": "color",
+      "value": "{utrecht.color.grey.40}"
+    },
+    "name": "utrechtTooltipColor",
+    "attributes": {},
+    "path": [
+      "utrecht",
+      "tooltip",
+      "color"
+    ]
+  },
+  {
+    "$extensions": {
+      "nl.nldesignsystem.css.property": {
+        "syntax": "*",
+        "inherits": true
+      },
+      "nl.nldesignsystem.figma.supports-token": false,
+      "studio.tokens": {
+        "originalType": "fontFamilies"
+      }
+    },
+    "type": "fontFamily",
+    "value": "\"Lucida Grande\", \"Lucida Sans Unicode\", \"Lucida Sans\", \"Arial\", sans-serif",
+    "filePath": "src/component/utrecht/tooltip.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": "utrechtTooltipFontFamily",
+    "attributes": {},
+    "path": [
+      "utrecht",
+      "tooltip",
+      "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/tooltip.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": "utrechtTooltipFontSize",
+    "attributes": {},
+    "path": [
+      "utrecht",
+      "tooltip",
+      "font-size"
+    ]
+  },
+  {
+    "$extensions": {
+      "nl.nldesignsystem.css.property": {
+        "syntax": "<length>",
+        "inherits": true
+      },
+      "nl.nldesignsystem.figma.supports-token": false,
+      "studio.tokens": {
+        "originalType": "spacing"
+      }
+    },
+    "type": "dimension",
+    "value": "8px",
+    "filePath": "src/component/utrecht/tooltip.tokens.json",
+    "isSource": true,
+    "original": {
+      "$extensions": {
+        "nl.nldesignsystem.css.property": {
+          "syntax": "<length>",
+          "inherits": true
+        },
+        "nl.nldesignsystem.figma.supports-token": false,
+        "studio.tokens": {
+          "originalType": "spacing"
+        }
+      },
+      "type": "dimension",
+      "value": "{utrecht.space.block.xs}"
+    },
+    "name": "utrechtTooltipPaddingBlock",
+    "attributes": {},
+    "path": [
+      "utrecht",
+      "tooltip",
+      "padding-block"
+    ]
+  },
+  {
+    "$extensions": {
+      "nl.nldesignsystem.css.property": {
+        "syntax": "<length>",
+        "inherits": true
+      },
+      "nl.nldesignsystem.figma.supports-token": false,
+      "studio.tokens": {
+        "originalType": "spacing"
+      }
+    },
+    "type": "dimension",
+    "value": "16px",
+    "filePath": "src/component/utrecht/tooltip.tokens.json",
+    "isSource": true,
+    "original": {
+      "$extensions": {
+        "nl.nldesignsystem.css.property": {
+          "syntax": "<length>",
+          "inherits": true
+        },
+        "nl.nldesignsystem.figma.supports-token": false,
+        "studio.tokens": {
+          "originalType": "spacing"
+        }
+      },
+      "type": "dimension",
+      "value": "{utrecht.space.inline.md}"
+    },
+    "name": "utrechtTooltipPaddingInline",
+    "attributes": {},
+    "path": [
+      "utrecht",
+      "tooltip",
+      "padding-inline"
+    ]
+  },
   {
     "value": "hsl(211 60% 40%)",
     "filePath": "src/component/utrecht/topnav.tokens.json",

package/dist/dark/list.mjs

@@ -31731,6 +31731,321 @@ export default [
       "border-bottom-width"
     ]
   },
+  {
+    "$extensions": {
+      "nl.nldesignsystem.css.property": {
+        "syntax": "<color>",
+        "inherits": true
+      },
+      "nl.nldesignsystem.figma.supports-token": false
+    },
+    "type": "color",
+    "value": "hsl(0 0% 100%)",
+    "filePath": "src/component/utrecht/tooltip.tokens.json",
+    "isSource": true,
+    "original": {
+      "$extensions": {
+        "nl.nldesignsystem.css.property": {
+          "syntax": "<color>",
+          "inherits": true
+        },
+        "nl.nldesignsystem.figma.supports-token": false
+      },
+      "type": "color",
+      "value": "{utrecht.color.white}"
+    },
+    "name": "utrechtTooltipBackgroundColor",
+    "attributes": {},
+    "path": [
+      "utrecht",
+      "tooltip",
+      "background-color"
+    ]
+  },
+  {
+    "$extensions": {
+      "nl.nldesignsystem.css.property": {
+        "syntax": "<color>",
+        "inherits": true
+      },
+      "nl.nldesignsystem.figma.supports-token": false
+    },
+    "type": "color",
+    "value": "hsl(0 0% 40%)",
+    "filePath": "src/component/utrecht/tooltip.tokens.json",
+    "isSource": true,
+    "original": {
+      "$extensions": {
+        "nl.nldesignsystem.css.property": {
+          "syntax": "<color>",
+          "inherits": true
+        },
+        "nl.nldesignsystem.figma.supports-token": false
+      },
+      "type": "color",
+      "value": "{utrecht.color.grey.40}"
+    },
+    "name": "utrechtTooltipBorderColor",
+    "attributes": {},
+    "path": [
+      "utrecht",
+      "tooltip",
+      "border-color"
+    ]
+  },
+  {
+    "$extensions": {
+      "nl.nldesignsystem.css.property": {
+        "syntax": "<length-percentage>",
+        "inherits": true
+      },
+      "nl.nldesignsystem.figma.supports-token": false,
+      "studio.tokens": {
+        "originalType": "borderRadius"
+      }
+    },
+    "type": "dimension",
+    "value": "0",
+    "filePath": "src/component/utrecht/tooltip.tokens.json",
+    "isSource": true,
+    "original": {
+      "$extensions": {
+        "nl.nldesignsystem.css.property": {
+          "syntax": "<length-percentage>",
+          "inherits": true
+        },
+        "nl.nldesignsystem.figma.supports-token": false,
+        "studio.tokens": {
+          "originalType": "borderRadius"
+        }
+      },
+      "type": "dimension",
+      "value": "0"
+    },
+    "name": "utrechtTooltipBorderRadius",
+    "attributes": {},
+    "path": [
+      "utrecht",
+      "tooltip",
+      "border-radius"
+    ]
+  },
+  {
+    "$extensions": {
+      "nl.nldesignsystem.css.property": {
+        "syntax": "<length>",
+        "inherits": true
+      },
+      "nl.nldesignsystem.figma.supports-token": false,
+      "studio.tokens": {
+        "originalType": "borderWidth"
+      }
+    },
+    "type": "dimension",
+    "value": "1px",
+    "filePath": "src/component/utrecht/tooltip.tokens.json",
+    "isSource": true,
+    "original": {
+      "$extensions": {
+        "nl.nldesignsystem.css.property": {
+          "syntax": "<length>",
+          "inherits": true
+        },
+        "nl.nldesignsystem.figma.supports-token": false,
+        "studio.tokens": {
+          "originalType": "borderWidth"
+        }
+      },
+      "type": "dimension",
+      "value": "1px"
+    },
+    "name": "utrechtTooltipBorderWidth",
+    "attributes": {},
+    "path": [
+      "utrecht",
+      "tooltip",
+      "border-width"
+    ]
+  },
+  {
+    "$extensions": {
+      "nl.nldesignsystem.css.property": {
+        "syntax": "<color>",
+        "inherits": true
+      },
+      "nl.nldesignsystem.figma.supports-token": false
+    },
+    "type": "color",
+    "value": "hsl(0 0% 40%)",
+    "filePath": "src/component/utrecht/tooltip.tokens.json",
+    "isSource": true,
+    "original": {
+      "$extensions": {
+        "nl.nldesignsystem.css.property": {
+          "syntax": "<color>",
+          "inherits": true
+        },
+        "nl.nldesignsystem.figma.supports-token": false
+      },
+      "type": "color",
+      "value": "{utrecht.color.grey.40}"
+    },
+    "name": "utrechtTooltipColor",
+    "attributes": {},
+    "path": [
+      "utrecht",
+      "tooltip",
+      "color"
+    ]
+  },
+  {
+    "$extensions": {
+      "nl.nldesignsystem.css.property": {
+        "syntax": "*",
+        "inherits": true
+      },
+      "nl.nldesignsystem.figma.supports-token": false,
+      "studio.tokens": {
+        "originalType": "fontFamilies"
+      }
+    },
+    "type": "fontFamily",
+    "value": "\"Lucida Grande\", \"Lucida Sans Unicode\", \"Lucida Sans\", \"Arial\", sans-serif",
+    "filePath": "src/component/utrecht/tooltip.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": "utrechtTooltipFontFamily",
+    "attributes": {},
+    "path": [
+      "utrecht",
+      "tooltip",
+      "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/tooltip.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": "utrechtTooltipFontSize",
+    "attributes": {},
+    "path": [
+      "utrecht",
+      "tooltip",
+      "font-size"
+    ]
+  },
+  {
+    "$extensions": {
+      "nl.nldesignsystem.css.property": {
+        "syntax": "<length>",
+        "inherits": true
+      },
+      "nl.nldesignsystem.figma.supports-token": false,
+      "studio.tokens": {
+        "originalType": "spacing"
+      }
+    },
+    "type": "dimension",
+    "value": "8px",
+    "filePath": "src/component/utrecht/tooltip.tokens.json",
+    "isSource": true,
+    "original": {
+      "$extensions": {
+        "nl.nldesignsystem.css.property": {
+          "syntax": "<length>",
+          "inherits": true
+        },
+        "nl.nldesignsystem.figma.supports-token": false,
+        "studio.tokens": {
+          "originalType": "spacing"
+        }
+      },
+      "type": "dimension",
+      "value": "{utrecht.space.block.xs}"
+    },
+    "name": "utrechtTooltipPaddingBlock",
+    "attributes": {},
+    "path": [
+      "utrecht",
+      "tooltip",
+      "padding-block"
+    ]
+  },
+  {
+    "$extensions": {
+      "nl.nldesignsystem.css.property": {
+        "syntax": "<length>",
+        "inherits": true
+      },
+      "nl.nldesignsystem.figma.supports-token": false,
+      "studio.tokens": {
+        "originalType": "spacing"
+      }
+    },
+    "type": "dimension",
+    "value": "16px",
+    "filePath": "src/component/utrecht/tooltip.tokens.json",
+    "isSource": true,
+    "original": {
+      "$extensions": {
+        "nl.nldesignsystem.css.property": {
+          "syntax": "<length>",
+          "inherits": true
+        },
+        "nl.nldesignsystem.figma.supports-token": false,
+        "studio.tokens": {
+          "originalType": "spacing"
+        }
+      },
+      "type": "dimension",
+      "value": "{utrecht.space.inline.md}"
+    },
+    "name": "utrechtTooltipPaddingInline",
+    "attributes": {},
+    "path": [
+      "utrecht",
+      "tooltip",
+      "padding-inline"
+    ]
+  },
   {
     "value": "hsl(211 60% 40%)",
     "filePath": "src/component/utrecht/topnav.tokens.json",

package/dist/dark/property.css

@@ -712,6 +712,14 @@
 @property --utrecht-textarea-border-bottom-width { syntax: '<length>'; inherits: true; }
 @property --utrecht-textarea-line-height { syntax: '<length>'; inherits: true; }
 @property --utrecht-textbox-border-bottom-width { syntax: '<length>'; inherits: true; }
+@property --utrecht-tooltip-background-color { syntax: '<color>'; inherits: true; }
+@property --utrecht-tooltip-border-color { syntax: '<color>'; inherits: true; }
+@property --utrecht-tooltip-border-radius { syntax: '<length-percentage>'; inherits: true; }
+@property --utrecht-tooltip-border-width { syntax: '<length>'; inherits: true; }
+@property --utrecht-tooltip-color { syntax: '<color>'; inherits: true; }
+@property --utrecht-tooltip-font-size { syntax: '<length>'; inherits: true; }
+@property --utrecht-tooltip-padding-block { syntax: '<length>'; inherits: true; }
+@property --utrecht-tooltip-padding-inline { syntax: '<length>'; inherits: true; }
 @property --utrecht-toptask-link-background-color { syntax: '<color>'; inherits: true; }
 @property --utrecht-toptask-link-color { syntax: '<color>'; inherits: true; }
 @property --utrecht-toptask-link-font-size { syntax: '<length>'; inherits: true; }

package/dist/dark/root.css

@@ -30,6 +30,8 @@
   --utrecht-toptask-link-hover-transform-scale: 1.02;
   --utrecht-topnav-link-focus-text-decoration: none;
   --utrecht-topnav-link-focus-border-type: dotted;
+  --utrecht-tooltip-border-width: 1px;
+  --utrecht-tooltip-border-radius: 0;
   --utrecht-textbox-border-bottom-width: 3px;
   --utrecht-textarea-border-bottom-width: 3px;
   --utrecht-textarea-border-block-end-width: 3px;
@@ -426,6 +428,13 @@
   --utrecht-topnav-link-focus-background-color: var(--utrecht-color-yellow-80);
   --utrecht-topnav-link-color: var(--utrecht-color-white);
   --utrecht-topnav-link-background-color: var(--utrecht-color-blue-40);
+  --utrecht-tooltip-padding-inline: var(--utrecht-space-inline-md);
+  --utrecht-tooltip-padding-block: var(--utrecht-space-block-xs);
+  --utrecht-tooltip-font-size: var(--utrecht-typography-scale-md-font-size);
+  --utrecht-tooltip-font-family: var(--utrecht-typography-sans-serif-font-family);
+  --utrecht-tooltip-color: var(--utrecht-color-grey-40);
+  --utrecht-tooltip-border-color: var(--utrecht-color-grey-40);
+  --utrecht-tooltip-background-color: var(--utrecht-color-white);
   --utrecht-textarea-line-height: var(--utrecht-typography-line-height-md);
   --utrecht-table-row-border-block-end-width: var(--utrecht-border-width-sm);
   --utrecht-table-row-border-block-end-color: var(--utrecht-color-grey-90);