@utrecht/design-tokens 2.2.0 → 2.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (79) hide show
  1. package/CHANGELOG.md +20 -0
  2. package/dist/_mixin-theme.scss +124 -63
  3. package/dist/_mixin.scss +124 -63
  4. package/dist/_variables.scss +124 -63
  5. package/dist/dark/_mixin-theme.scss +124 -63
  6. package/dist/dark/_mixin.scss +124 -63
  7. package/dist/dark/_variables.scss +124 -63
  8. package/dist/dark/index.cjs +62 -1
  9. package/dist/dark/index.css +124 -63
  10. package/dist/dark/index.d.ts +62 -1
  11. package/dist/dark/index.flat.json +62 -1
  12. package/dist/dark/index.json +1046 -102
  13. package/dist/dark/index.mjs +62 -1
  14. package/dist/dark/index.tokens.json +614 -72
  15. package/dist/dark/list.d.ts +14 -0
  16. package/dist/dark/list.json +1046 -102
  17. package/dist/dark/list.mjs +31638 -0
  18. package/dist/dark/property.css +0 -1
  19. package/dist/dark/root.css +124 -63
  20. package/dist/dark/theme-prince-xml.css +124 -63
  21. package/dist/dark/theme.css +124 -63
  22. package/dist/dark/tokens.cjs +1541 -116
  23. package/dist/dark/tokens.d.ts +355 -22
  24. package/dist/dark/tokens.json +1541 -116
  25. package/dist/dark/variables.cjs +62 -1
  26. package/dist/dark/variables.css +124 -63
  27. package/dist/dark/variables.d.ts +62 -1
  28. package/dist/dark/variables.json +62 -1
  29. package/dist/dark/variables.less +124 -63
  30. package/dist/dark/variables.mjs +62 -1
  31. package/dist/index.cjs +62 -1
  32. package/dist/index.css +248 -126
  33. package/dist/index.d.ts +62 -1
  34. package/dist/index.flat.json +62 -1
  35. package/dist/index.json +1046 -102
  36. package/dist/index.mjs +62 -1
  37. package/dist/index.tokens.json +614 -72
  38. package/dist/list.d.ts +14 -0
  39. package/dist/list.json +1046 -102
  40. package/dist/list.mjs +32755 -0
  41. package/dist/property.css +0 -1
  42. package/dist/root.css +124 -63
  43. package/dist/theme-prince-xml.css +124 -63
  44. package/dist/theme.css +124 -63
  45. package/dist/tokens.cjs +1541 -116
  46. package/dist/tokens.d.ts +355 -22
  47. package/dist/tokens.json +1541 -116
  48. package/dist/variables.cjs +62 -1
  49. package/dist/variables.css +124 -63
  50. package/dist/variables.d.ts +62 -1
  51. package/dist/variables.json +62 -1
  52. package/dist/variables.less +124 -63
  53. package/dist/variables.mjs +62 -1
  54. package/package.json +1 -1
  55. package/src/component/nl/code-block.tokens.json +13 -0
  56. package/src/component/nl/code.tokens.json +11 -0
  57. package/src/component/nl/data-badge.tokens.json +22 -0
  58. package/src/component/nl/heading.tokens.json +48 -0
  59. package/src/component/nl/mark.tokens.json +8 -0
  60. package/src/component/nl/number-badge.tokens.json +23 -0
  61. package/src/component/nl/paragraph.tokens.json +20 -0
  62. package/src/component/nl/skip-link.tokens.json +16 -0
  63. package/src/component/utrecht/badge.tokens.json +5 -5
  64. package/src/component/utrecht/code-block.tokens.json +9 -9
  65. package/src/component/utrecht/heading-1.tokens.json +4 -4
  66. package/src/component/utrecht/heading-2.tokens.json +4 -4
  67. package/src/component/utrecht/heading-3.tokens.json +4 -4
  68. package/src/component/utrecht/heading-4.tokens.json +4 -4
  69. package/src/component/utrecht/heading-5.tokens.json +4 -4
  70. package/src/component/utrecht/heading-6.tokens.json +4 -4
  71. package/src/component/utrecht/mark.tokens.json +2 -2
  72. package/src/component/utrecht/number-badge.tokens.json +6 -6
  73. package/src/component/utrecht/paragraph.tokens.json +8 -8
  74. package/src/component/utrecht/skip-link.tokens.json +10 -10
  75. package/src/css-property-formatter.mjs +2 -1
  76. package/src/json-list-formatter.js +2 -1
  77. package/style-dictionary-build.mjs +3 -1
  78. package/style-dictionary-config.mjs +27 -0
  79. package/src/component/utrecht/badge-data.tokens.json +0 -8
package/dist/dark/index.mjs CHANGED
@@ -284,6 +284,7 @@ export const utrechtCheckboxInvalidBorderColor = "#990000";
284
284
  export const utrechtCheckboxMarginBlockStart = 0;
285
285
  export const utrechtCodeBlockBackgroundColor = "hsl(0 0% 95%)";
286
286
  export const utrechtCodeBlockColor = "hsl(0 0% 0%)";
287
+ export const utrechtCodeBlockFontFamily = "\"Monaco\"";
287
288
  export const utrechtCodeBlockFontSize = "1rem";
288
289
  export const utrechtCodeBlockLineHeight = "1.5";
289
290
  export const utrechtCodeBlockMarginBlockStart = "20px";
@@ -737,7 +738,6 @@ export const utrechtParagraphFontWeight = "400";
737
738
  export const utrechtParagraphLineHeight = "1.5";
738
739
  export const utrechtParagraphMarginBlockStart = "16px";
739
740
  export const utrechtParagraphMarginBlockEnd = "0";
740
- export const utrechtParagraphLeadColor = "hsl(0 0% 95%)";
741
741
  export const utrechtParagraphLeadFontSize = "1.25rem";
742
742
  export const utrechtParagraphLeadFontWeight = "400";
743
743
  export const utrechtParagraphLeadLineHeight = "1.5";
@@ -1010,6 +1010,67 @@ export const denhaagProcessStepsSubStepHeadingColor = "hsl(0 0% 15%)";
1010
1010
  export const denhaagProcessStepsSubStepHeadingFontSize = "0.875rem";
1011
1011
  export const denhaagProcessStepsSubStepHeadingFontWeight = "400";
1012
1012
  export const denhaagProcessStepsSubStepLineColor = "hsl(90 30% 30%)";
1013
+ export const nlCodeBlockBackgroundColor = "hsl(0 0% 95%)";
1014
+ export const nlCodeBlockColor = "hsl(0 0% 0%)";
1015
+ export const nlCodeBlockFontFamily = "\"Monaco\"";
1016
+ export const nlCodeBlockFontSize = "1rem";
1017
+ export const nlCodeBlockLineHeight = "1.5";
1018
+ export const nlCodeBlockPaddingBlock = "20px";
1019
+ export const nlCodeBlockPaddingInline = "20px";
1020
+ export const nlDataBadgeBackgroundColor = "hsl(0 0% 30%)";
1021
+ export const nlDataBadgeBorderRadius = "0";
1022
+ export const nlDataBadgeColor = "hsl(0 0% 100%)";
1023
+ export const nlDataBadgePaddingBlock = "8px";
1024
+ export const nlDataBadgePaddingInline = "12px";
1025
+ export const nlHeadingLevel1FontFamily = "\"Lucida Grande\", \"Lucida Sans Unicode\", \"Lucida Sans\", \"Arial\", sans-serif";
1026
+ export const nlHeadingLevel1FontSize = "2rem";
1027
+ export const nlHeadingLevel1FontWeight = "700";
1028
+ export const nlHeadingLevel1LineHeight = "1.25";
1029
+ export const nlHeadingLevel2FontFamily = "\"Lucida Grande\", \"Lucida Sans Unicode\", \"Lucida Sans\", \"Arial\", sans-serif";
1030
+ export const nlHeadingLevel2FontSize = "1.25rem";
1031
+ export const nlHeadingLevel2FontWeight = "700";
1032
+ export const nlHeadingLevel2LineHeight = "1.25";
1033
+ export const nlHeadingLevel3FontFamily = "\"Lucida Grande\", \"Lucida Sans Unicode\", \"Lucida Sans\", \"Arial\", sans-serif";
1034
+ export const nlHeadingLevel3FontSize = "1.25rem";
1035
+ export const nlHeadingLevel3FontWeight = "400";
1036
+ export const nlHeadingLevel3LineHeight = "1.25";
1037
+ export const nlHeadingLevel4FontFamily = "\"Lucida Grande\", \"Lucida Sans Unicode\", \"Lucida Sans\", \"Arial\", sans-serif";
1038
+ export const nlHeadingLevel4FontSize = "1.125rem";
1039
+ export const nlHeadingLevel4FontWeight = "400";
1040
+ export const nlHeadingLevel4LineHeight = "1.5";
1041
+ export const nlHeadingLevel5FontFamily = "\"Lucida Grande\", \"Lucida Sans Unicode\", \"Lucida Sans\", \"Arial\", sans-serif";
1042
+ export const nlHeadingLevel5FontSize = "0.875rem";
1043
+ export const nlHeadingLevel5FontWeight = "400";
1044
+ export const nlHeadingLevel5LineHeight = "1.5";
1045
+ export const nlHeadingLevel6FontFamily = "\"Lucida Grande\", \"Lucida Sans Unicode\", \"Lucida Sans\", \"Arial\", sans-serif";
1046
+ export const nlHeadingLevel6FontSize = "0.875rem";
1047
+ export const nlHeadingLevel6FontWeight = "400";
1048
+ export const nlHeadingLevel6LineHeight = "1.5";
1049
+ export const nlMarkBackgroundColor = "hsl(48 100% 60%)";
1050
+ export const nlMarkColor = "hsl(0 0% 0%)";
1051
+ export const nlNumberBadgeBackgroundColor = "hsl(0 100% 40%)";
1052
+ export const nlNumberBadgeBorderRadius = "1rem";
1053
+ export const nlNumberBadgeColor = "hsl(0 0% 100%)";
1054
+ export const nlNumberBadgeFontSize = "1rem";
1055
+ export const nlNumberBadgePaddingBlock = "1ex";
1056
+ export const nlNumberBadgePaddingInline = "1ex";
1057
+ export const nlParagraphFontFamily = "\"Lucida Grande\", \"Lucida Sans Unicode\", \"Lucida Sans\", \"Arial\", sans-serif";
1058
+ export const nlParagraphFontSize = "1rem";
1059
+ export const nlParagraphFontWeight = "400";
1060
+ export const nlParagraphLineHeight = "1.5";
1061
+ export const nlParagraphLeadColor = "hsl(0 0% 95%)";
1062
+ export const nlParagraphLeadFontSize = "1.25rem";
1063
+ export const nlParagraphLeadFontWeight = "400";
1064
+ export const nlParagraphLeadLineHeight = "1.5";
1065
+ export const nlParagraphSmallFontSize = "0.875rem";
1066
+ export const nlSkipLinkBackgroundColor = "hsl(0 0% 15%)";
1067
+ export const nlSkipLinkColor = "hsl(0 0% 100%)";
1068
+ export const nlSkipLinkPaddingBlock = "8px";
1069
+ export const nlSkipLinkPaddingInline = "16px";
1070
+ export const nlSkipLinkTextDecoration = "underline";
1071
+ export const nlSkipLinkFocusVisibleColor = "hsl(0 0% 0%)";
1072
+ export const nlSkipLinkFocusVisibleBackgroundColor = "hsl(48 100% 80%)";
1073
+ export const nlSkipLinkFocusVisibleTextDecoration = "none";
1013
1074
  export const ofLayoutBackground = "hsl(0 0% 15%)";
1014
1075
  export const ofLayoutBg = "hsl(0 0% 15%)";
1015
1076
  export const ofPageFooterBg = "hsl(0 100% 40%)";