@utrecht/design-tokens 2.1.1 → 2.3.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 (61) hide show
  1. package/CHANGELOG.md +12 -0
  2. package/dist/_mixin-theme.scss +3 -5
  3. package/dist/_mixin.scss +3 -5
  4. package/dist/_variables.scss +3 -5
  5. package/dist/dark/_mixin-theme.scss +3 -5
  6. package/dist/dark/_mixin.scss +3 -5
  7. package/dist/dark/_variables.scss +3 -5
  8. package/dist/dark/index.cjs +3 -5
  9. package/dist/dark/index.css +3 -5
  10. package/dist/dark/index.d.ts +2 -6
  11. package/dist/dark/index.flat.json +1 -3
  12. package/dist/dark/index.json +26 -40
  13. package/dist/dark/index.mjs +3 -5
  14. package/dist/dark/index.tokens.json +441 -14
  15. package/dist/dark/list.d.ts +14 -0
  16. package/dist/dark/list.json +26 -40
  17. package/dist/dark/list.mjs +30694 -0
  18. package/dist/dark/property.css +2 -0
  19. package/dist/dark/root.css +1 -3
  20. package/dist/dark/theme-prince-xml.css +3 -5
  21. package/dist/dark/theme.css +1 -3
  22. package/dist/dark/tokens.cjs +512 -97
  23. package/dist/dark/tokens.d.ts +239 -13
  24. package/dist/dark/tokens.json +514 -99
  25. package/dist/dark/variables.cjs +3 -5
  26. package/dist/dark/variables.css +1 -3
  27. package/dist/dark/variables.d.ts +2 -6
  28. package/dist/dark/variables.json +1 -3
  29. package/dist/dark/variables.less +3 -5
  30. package/dist/dark/variables.mjs +3 -5
  31. package/dist/index.cjs +3 -5
  32. package/dist/index.css +84 -10
  33. package/dist/index.d.ts +2 -6
  34. package/dist/index.flat.json +1 -3
  35. package/dist/index.json +26 -40
  36. package/dist/index.mjs +3 -5
  37. package/dist/index.tokens.json +441 -14
  38. package/dist/list.d.ts +14 -0
  39. package/dist/list.json +26 -40
  40. package/dist/list.mjs +31811 -0
  41. package/dist/property.css +2 -0
  42. package/dist/root.css +1 -3
  43. package/dist/theme-prince-xml.css +3 -5
  44. package/dist/theme.css +1 -3
  45. package/dist/tokens.cjs +512 -97
  46. package/dist/tokens.d.ts +239 -13
  47. package/dist/tokens.json +514 -99
  48. package/dist/variables.cjs +3 -5
  49. package/dist/variables.css +1 -3
  50. package/dist/variables.d.ts +2 -6
  51. package/dist/variables.json +1 -3
  52. package/dist/variables.less +3 -5
  53. package/dist/variables.mjs +3 -5
  54. package/package.json +1 -1
  55. package/src/brand/utrecht/typography.tokens.json +0 -2
  56. package/src/component/utrecht/blockquote.tokens.json +1 -1
  57. package/src/css-property-formatter.mjs +2 -1
  58. package/src/index.scss +79 -0
  59. package/src/json-list-formatter.js +2 -1
  60. package/style-dictionary-build.mjs +3 -1
  61. package/style-dictionary-config.mjs +27 -0
package/dist/dark/property.css CHANGED
@@ -400,6 +400,8 @@
400
400
  @property --utrecht-listbox-max-block-size { syntax: '<length>'; inherits: true; }
401
401
  @property --utrecht-listbox-option-active-background-color { syntax: '<color>'; inherits: true; }
402
402
  @property --utrecht-listbox-option-active-color { syntax: '<color>'; inherits: true; }
403
+ @property --utrecht-listbox-option-hover-background-color { syntax: '<color>'; inherits: true; }
404
+ @property --utrecht-listbox-option-hover-color { syntax: '<color>'; inherits: true; }
403
405
  @property --utrecht-listbox-option-min-block-size { syntax: '<length>'; inherits: true; }
404
406
  @property --utrecht-listbox-option-padding-block-end { syntax: '<length>'; inherits: true; }
405
407
  @property --utrecht-listbox-option-padding-block-start { syntax: '<length>'; inherits: true; }
package/dist/dark/root.css CHANGED
@@ -8,14 +8,12 @@
8
8
  --utrecht-unordered-list-item-margin-block-end: 0.25rem;
9
9
  --utrecht-typography-weight-scale-normal-font-weight: 400;
10
10
  --utrecht-typography-weight-scale-bold-font-weight: 700;
11
- --utrecht-typography-scale-xs-font-size: 0.75rem; /* 12px */
12
11
  --utrecht-typography-scale-xl-font-size: 1.25rem; /* 20px */
13
12
  --utrecht-typography-scale-sm-font-size: 0.875rem; /* 14px */
14
13
  --utrecht-typography-scale-md-font-size: 1rem; /* 16px */
15
14
  --utrecht-typography-scale-lg-font-size: 1.125rem; /* 18px */
16
15
  --utrecht-typography-scale-4xl-font-size: 2rem; /* 32px */
17
16
  --utrecht-typography-scale-3xl-font-size: 1.5rem; /* 24px */
18
- --utrecht-typography-scale-2xs-font-size: 0.5rem; /* 8px */
19
17
  --utrecht-typography-scale-2xl-font-size: 1.375rem; /* 22px */
20
18
  --utrecht-typography-sans-serif-font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "Arial", sans-serif;
21
19
  --utrecht-typography-line-height-xs: 1;
@@ -829,7 +827,7 @@
829
827
  --utrecht-breadcrumb-nav-arrows-link-background-color: var(--utrecht-color-grey-90);
830
828
  --utrecht-blockquote-content-font-size: var(--utrecht-typography-scale-lg-font-size);
831
829
  --utrecht-blockquote-content-color: var(--utrecht-color-red-40);
832
- --utrecht-blockquote-caption-font-size: var(--utrecht-typography-scale-xs-font-size);
830
+ --utrecht-blockquote-caption-font-size: var(--utrecht-typography-scale-sm-font-size);
833
831
  --utrecht-badge-padding-inline: var(--utrecht-space-inline-sm); /* Default inline padding color for badge components */
834
832
  --utrecht-badge-padding-block: var(--utrecht-space-block-xs); /* Default block padding for badge components */
835
833
  --utrecht-badge-list-item-margin-inline: var(--utrecht-space-block-sm);
package/dist/dark/theme-prince-xml.css CHANGED
@@ -32,8 +32,6 @@
32
32
  --utrecht-typography-scale-lg-font-size: 1.125rem; /* 18px */
33
33
  --utrecht-typography-scale-md-font-size: 1rem; /* 16px */
34
34
  --utrecht-typography-scale-sm-font-size: 0.875rem; /* 14px */
35
- --utrecht-typography-scale-xs-font-size: 0.75rem; /* 12px */
36
- --utrecht-typography-scale-2xs-font-size: 0.5rem; /* 8px */
37
35
  --utrecht-typography-sans-serif-font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "Arial", sans-serif;
38
36
  --utrecht-icon-scale-4xl: 48px;
39
37
  --utrecht-icon-scale-3xl: 36px; /* Formaat voor toptaks iconen */
@@ -608,10 +606,10 @@
608
606
  --utrecht-listbox-option-group-title-font-weight: var(--utrecht-typography-weight-scale-bold-font-weight);
609
607
  --utrecht-listbox-option-group-title-font-size: var(--utrecht-typography-scale-md-font-size);
610
608
  --utrecht-listbox-option-group-margin-block-end: var(--utrecht-space-inline-xs);
611
- --utrecht-listbox-option-hover-background-color: var(--utrecht-color-blue-90);
612
- --utrecht-listbox-option-hover-color: var(--utrecht-color-black);
613
609
  --utrecht-listbox-option-selected-color: var(--utrecht-color-black);
614
610
  --utrecht-listbox-option-selected-background-color: var(--utrecht-color-grey-95);
611
+ --utrecht-listbox-option-hover-color: var(--utrecht-color-black);
612
+ --utrecht-listbox-option-hover-background-color: var(--utrecht-color-blue-90);
615
613
  --utrecht-listbox-option-active-font-weight: var(--utrecht-typography-weight-scale-bold-font-weight);
616
614
  --utrecht-listbox-option-active-color: var(--utrecht-color-black);
617
615
  --utrecht-listbox-option-active-background-color: var(--utrecht-color-grey-95);
@@ -867,7 +865,7 @@
867
865
  --utrecht-breadcrumb-nav-item-padding-block-end: var(--utrecht-space-block-xs);
868
866
  --utrecht-breadcrumb-nav-item-padding-block-start: var(--utrecht-space-block-xs);
869
867
  --utrecht-breadcrumb-nav-font-size: var(--utrecht-typography-scale-md-font-size);
870
- --utrecht-blockquote-caption-font-size: var(--utrecht-typography-scale-xs-font-size);
868
+ --utrecht-blockquote-caption-font-size: var(--utrecht-typography-scale-sm-font-size);
871
869
  --utrecht-blockquote-content-font-size: var(--utrecht-typography-scale-lg-font-size);
872
870
  --utrecht-blockquote-content-color: var(--utrecht-color-red-40);
873
871
  --utrecht-badge-font-style: var(--utrecht-typography-font-style-normal);
package/dist/dark/theme.css CHANGED
@@ -8,14 +8,12 @@
8
8
  --utrecht-unordered-list-item-margin-block-end: 0.25rem;
9
9
  --utrecht-typography-weight-scale-normal-font-weight: 400;
10
10
  --utrecht-typography-weight-scale-bold-font-weight: 700;
11
- --utrecht-typography-scale-xs-font-size: 0.75rem; /* 12px */
12
11
  --utrecht-typography-scale-xl-font-size: 1.25rem; /* 20px */
13
12
  --utrecht-typography-scale-sm-font-size: 0.875rem; /* 14px */
14
13
  --utrecht-typography-scale-md-font-size: 1rem; /* 16px */
15
14
  --utrecht-typography-scale-lg-font-size: 1.125rem; /* 18px */
16
15
  --utrecht-typography-scale-4xl-font-size: 2rem; /* 32px */
17
16
  --utrecht-typography-scale-3xl-font-size: 1.5rem; /* 24px */
18
- --utrecht-typography-scale-2xs-font-size: 0.5rem; /* 8px */
19
17
  --utrecht-typography-scale-2xl-font-size: 1.375rem; /* 22px */
20
18
  --utrecht-typography-sans-serif-font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "Arial", sans-serif;
21
19
  --utrecht-typography-line-height-xs: 1;
@@ -829,7 +827,7 @@
829
827
  --utrecht-breadcrumb-nav-arrows-link-background-color: var(--utrecht-color-grey-90);
830
828
  --utrecht-blockquote-content-font-size: var(--utrecht-typography-scale-lg-font-size);
831
829
  --utrecht-blockquote-content-color: var(--utrecht-color-red-40);
832
- --utrecht-blockquote-caption-font-size: var(--utrecht-typography-scale-xs-font-size);
830
+ --utrecht-blockquote-caption-font-size: var(--utrecht-typography-scale-sm-font-size);
833
831
  --utrecht-badge-padding-inline: var(--utrecht-space-inline-sm); /* Default inline padding color for badge components */
834
832
  --utrecht-badge-padding-block: var(--utrecht-space-block-xs); /* Default block padding for badge components */
835
833
  --utrecht-badge-list-item-margin-inline: var(--utrecht-space-block-sm);