@gyldendal/kobber-tokens 10.0.0 → 11.0.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.
@@ -1,3 +1,68 @@
1
+ === 10.04.2026, 10:42:58 [c0b43659] - MAJOR - npm: v11.0.0 ===
2
+
3
+ ADDED
4
+ components-content-island-inner-container-left-slider-container-padding-left
5
+ components-contextual-navigation-bar-right-container-gap
6
+ components-media-player-container-bottom-border-color-brand
7
+ components-media-player-container-bottom-border-color-neutral
8
+ components-media-player-container-bottom-border-radius
9
+ components-media-player-container-bottom-gap
10
+ components-media-player-container-bottom-padding
11
+ components-media-player-item-inner-container-controllers-gap
12
+ components-menu-item-image-container-size-large-height
13
+ components-menu-item-image-container-size-large-width
14
+ components-menu-item-image-container-size-small-height
15
+ components-menu-item-image-container-size-small-width
16
+ components-slider-controller-top-container-gap
17
+ components-slider-track-filled-size-height
18
+ groups-media-players-color-neutral-150
19
+ groups-media-players-color-wine-150
20
+ groups-media-players-space-large
21
+ groups-menus-space-xlarge
22
+ groups-menus-visual-image-size-xlarge
23
+ groups-menus-visual-image-size-xxlarge
24
+ groups-navigation-bars-space-xsmall
25
+ groups-sliders-border-radius-circle
26
+ groups-sliders-size-medium
27
+ groups-sliders-size-small
28
+ groups-sliders-space-xxsmall
29
+ primitives-font-weight-375
30
+ semantics-typography-weight-book
31
+ semantics-typography-weight-light
32
+ semantics-typography-weight-regular
33
+ semantics-typography-weight-semibold
34
+
35
+ REMOVED
36
+ components-contextual-navigation-bar-border-radius
37
+ components-media-player-border-color
38
+ components-menu-item-image-container-size-height
39
+ components-menu-item-image-container-size-width
40
+ groups-menus-visual-image-size
41
+ groups-sliders-size-xxsmall
42
+
43
+ CHANGED
44
+ components-dropdown-item-gap
45
+ components-dropdown-size-height
46
+ components-menu-item-padding-left-nested
47
+ components-slider-border-radius
48
+ components-slider-size-height
49
+ components-slider-thumb-size-height
50
+ components-slider-thumb-size-width
51
+ groups-menus-space-large
52
+
53
+ === 19.03.2026, 09:11:14 [af9b8249] - PATCH - npm: v10.0.1 ===
54
+
55
+ CHANGED
56
+ primitives-elevation-z-index-1
57
+ primitives-elevation-z-index-10
58
+ primitives-elevation-z-index-100
59
+ primitives-elevation-z-index-1000
60
+ primitives-elevation-z-index-1050
61
+ primitives-elevation-z-index-11
62
+ primitives-elevation-z-index-1100
63
+ primitives-elevation-z-index-9000
64
+ primitives-elevation-z-index-9999
65
+
1
66
  === 16.03.2026, 11:49:53 [9f50b7b0] - MAJOR - npm: v10.0.0 ===
2
67
 
3
68
  ADDED
package/dist/k-tokens.css CHANGED
@@ -171,6 +171,7 @@
171
171
  --k-primitives-size-9999: 624.9375rem;
172
172
  --k-primitives-font-weight-200: 200;
173
173
  --k-primitives-font-weight-300: 300;
174
+ --k-primitives-font-weight-375: 375;
174
175
  --k-primitives-font-weight-400: 400;
175
176
  --k-primitives-font-weight-500: 500;
176
177
  --k-primitives-font-weight-600: 600;
@@ -205,16 +206,16 @@
205
206
  --k-primitives-font-size-48: 3rem;
206
207
  --k-primitives-font-size-56: 3.5rem;
207
208
  --k-primitives-elevation-z-index-0: 0;
208
- --k-primitives-elevation-z-index-1: 0.0625rem;
209
- --k-primitives-elevation-z-index-10: 0.625rem;
210
- --k-primitives-elevation-z-index-11: 0.6875rem;
211
- --k-primitives-elevation-z-index-100: 6.25rem;
212
- --k-primitives-elevation-z-index-1000: 62.5rem;
213
- --k-primitives-elevation-z-index-1050: 65.625rem;
214
- --k-primitives-elevation-z-index-1100: 68.75rem;
215
- --k-primitives-elevation-z-index-9000: 562.5rem;
216
- --k-primitives-elevation-z-index-9999: 624.9375rem;
217
- --k-primitives-elevation-z-index-1: -0.0625rem;
209
+ --k-primitives-elevation-z-index-1: 1;
210
+ --k-primitives-elevation-z-index-10: 10;
211
+ --k-primitives-elevation-z-index-11: 11;
212
+ --k-primitives-elevation-z-index-100: 100;
213
+ --k-primitives-elevation-z-index-1000: 1000;
214
+ --k-primitives-elevation-z-index-1050: 1050;
215
+ --k-primitives-elevation-z-index-1100: 1100;
216
+ --k-primitives-elevation-z-index-9000: 9000;
217
+ --k-primitives-elevation-z-index-9999: 9999;
218
+ --k-primitives-elevation-z-index-1: -1;
218
219
  --k-primitives-opacity-0: 0;
219
220
  --k-primitives-opacity-10: 0.1;
220
221
  --k-primitives-opacity-50: 0.5;
@@ -317,6 +318,10 @@
317
318
  --k-semantics-typography-line-height-60: var(--k-primitives-font-line-height-60);
318
319
  --k-semantics-typography-line-height-70: var(--k-primitives-font-line-height-70);
319
320
  --k-semantics-typography-indent: var(--k-primitives-size-24);
321
+ --k-semantics-typography-weight-light: var(--k-primitives-font-weight-300);
322
+ --k-semantics-typography-weight-book: var(--k-primitives-font-weight-375);
323
+ --k-semantics-typography-weight-regular: var(--k-primitives-font-weight-400);
324
+ --k-semantics-typography-weight-semibold: var(--k-primitives-font-weight-600);
320
325
  --k-semantics-color-identity-brand-carmine-525: var(--k-primitives-color-carmine-525);
321
326
  --k-semantics-color-identity-base-aubergine-25: var(--k-primitives-color-aubergine-25);
322
327
  --k-semantics-color-identity-base-aubergine-50: var(--k-primitives-color-aubergine-50);
@@ -640,8 +645,9 @@
640
645
  --k-groups-menus-space-tiny: var(--k-semantics-layout-element-space-tiny);
641
646
  --k-groups-menus-space-xsmall: var(--k-semantics-layout-element-space-xsmall);
642
647
  --k-groups-menus-space-medium: var(--k-semantics-layout-element-space-medium);
643
- --k-groups-menus-space-large: var(--k-semantics-layout-element-space-xxlarge);
648
+ --k-groups-menus-space-xlarge: var(--k-semantics-layout-element-space-xxlarge);
644
649
  --k-groups-menus-space-small: var(--k-semantics-layout-element-space-small);
650
+ --k-groups-menus-space-large: var(--k-semantics-layout-element-space-large);
645
651
  --k-groups-menus-radius-small: var(--k-semantics-layout-element-radius-xxsmall);
646
652
  --k-groups-menus-radius-large: var(--k-semantics-layout-element-radius-large);
647
653
  --k-groups-menus-radius-medium: var(--k-semantics-layout-element-radius-xsmall);
@@ -653,7 +659,8 @@
653
659
  --k-groups-menus-color-wine-150: var(--k-semantics-color-identity-extended-wine-150);
654
660
  --k-groups-menus-color-neutral-525: var(--k-semantics-effect-shadow-color-concrete-1000-10);
655
661
  --k-groups-menus-color-aubergine-150: var(--k-semantics-color-identity-extended-aubergine-150);
656
- --k-groups-menus-visual-image-size: var(--k-semantics-layout-element-size-xlarge);
662
+ --k-groups-menus-visual-image-size-xlarge: var(--k-semantics-layout-element-size-xlarge);
663
+ --k-groups-menus-visual-image-size-xxlarge: var(--k-semantics-layout-element-size-xxlarge);
657
664
  --k-groups-menus-visual-icon-size-large: var(--k-semantics-visual-icon-size-large);
658
665
  --k-groups-menus-visual-icon-size-medium: var(--k-semantics-visual-icon-size-medium);
659
666
  --k-groups-menus-visual-icon-size-xlarge: var(--k-semantics-visual-icon-size-xlarge);
@@ -758,6 +765,7 @@
758
765
  --k-groups-navigation-bars-space-small: var(--k-semantics-layout-element-space-small);
759
766
  --k-groups-navigation-bars-space-large: var(--k-semantics-layout-element-space-large);
760
767
  --k-groups-navigation-bars-space-xxlarge: var(--k-semantics-layout-element-space-xxlarge);
768
+ --k-groups-navigation-bars-space-xsmall: var(--k-semantics-layout-element-space-xsmall);
761
769
  --k-groups-navigation-bars-radius: var(--k-semantics-layout-element-radius-xsmall);
762
770
  --k-groups-text-blocks-space-medium: var(--k-semantics-layout-element-space-xlarge);
763
771
  --k-groups-text-blocks-space-large: var(--k-semantics-layout-element-space-xxlarge);
@@ -826,11 +834,14 @@
826
834
  --k-groups-media-players-space-medium: var(--k-semantics-layout-element-space-medium);
827
835
  --k-groups-media-players-space-small: var(--k-semantics-layout-element-space-small);
828
836
  --k-groups-media-players-space-xxsmall: var(--k-semantics-layout-element-space-xxsmall);
837
+ --k-groups-media-players-space-large: var(--k-semantics-layout-element-space-large);
829
838
  --k-groups-media-players-border-radius-xsmall: var(--k-semantics-layout-element-radius-xsmall);
830
839
  --k-groups-media-players-effects-shadow-blur: var(--k-semantics-effect-shadow-blur-small);
831
840
  --k-groups-media-players-effects-shadow-color-neutral-1000-10: var(--k-semantics-effect-shadow-color-concrete-1000-10);
832
841
  --k-groups-media-players-color-neutral-25: var(--k-semantics-color-identity-neutral-concrete-25);
833
842
  --k-groups-media-players-color-aubergine-50: var(--k-semantics-color-identity-base-aubergine-50);
843
+ --k-groups-media-players-color-wine-150: var(--k-semantics-color-identity-extended-wine-150);
844
+ --k-groups-media-players-color-neutral-150: var(--k-semantics-color-identity-neutral-concrete-150);
834
845
  --k-groups-popovers-space-medium: var(--k-semantics-layout-element-space-medium);
835
846
  --k-groups-popovers-space-xxsmall: var(--k-semantics-layout-element-space-xxsmall);
836
847
  --k-groups-popovers-space-large: var(--k-semantics-layout-element-space-large);
@@ -842,12 +853,15 @@
842
853
  --k-groups-popovers-size-large: var(--k-semantics-layout-component-size-large);
843
854
  --k-groups-popovers-size-medium: var(--k-semantics-layout-component-size-medium);
844
855
  --k-groups-popovers-size-small: var(--k-semantics-layout-component-size-xxxsmall);
845
- --k-groups-sliders-size-xxsmall: var(--k-semantics-layout-element-size-tiny);
856
+ --k-groups-sliders-size-small: var(--k-semantics-layout-element-size-xxsmall);
846
857
  --k-groups-sliders-size-xsmall: var(--k-semantics-layout-element-size-xxxsmall);
858
+ --k-groups-sliders-size-medium: var(--k-semantics-layout-element-size-small);
847
859
  --k-groups-sliders-color-purple-450: var(--k-semantics-color-identity-extended-purple-450);
848
860
  --k-groups-sliders-color-purple-700: var(--k-semantics-color-identity-extended-purple-700);
849
861
  --k-groups-sliders-color-purple-25: var(--k-semantics-color-identity-extended-purple-25);
850
862
  --k-groups-sliders-border-radius-xsmall: var(--k-semantics-layout-element-radius-xsmall);
863
+ --k-groups-sliders-border-radius-circle: var(--k-semantics-layout-element-radius-circle);
864
+ --k-groups-sliders-space-xxsmall: var(--k-semantics-layout-element-space-xxsmall);
851
865
  --k-groups-sliders-space-xsmall: var(--k-semantics-layout-element-space-xsmall);
852
866
  --k-groups-switches-color-conctrete-425: var(--k-semantics-color-identity-neutral-concrete-425);
853
867
  --k-groups-switches-color-conctrete-525: var(--k-semantics-color-identity-neutral-concrete-525);
@@ -1385,7 +1399,7 @@
1385
1399
  --k-components-menu-item-border-radius: var(--k-groups-menus-radius-small);
1386
1400
  --k-components-menu-item-padding-block: var(--k-groups-menus-space-small);
1387
1401
  --k-components-menu-item-padding-inline: var(--k-groups-menus-space-medium);
1388
- --k-components-menu-item-padding-left-nested: var(--k-groups-menus-space-large);
1402
+ --k-components-menu-item-padding-left-nested: var(--k-groups-menus-space-xlarge);
1389
1403
  --k-components-menu-item-padding-right-nested: var(--k-groups-menus-space-medium);
1390
1404
  --k-components-menu-item-text-container-border-bottom-padding: var(--k-groups-menus-space-tiny);
1391
1405
  --k-components-menu-item-text-container-border-weight-active: var(--k-groups-menus-stroke);
@@ -1393,8 +1407,10 @@
1393
1407
  --k-components-menu-item-text-container-gap: var(--k-groups-menus-space-xsmall);
1394
1408
  --k-components-menu-item-background-color-hover: var(--k-groups-menus-color-aubergine-50);
1395
1409
  --k-components-menu-item-background-color-pressed: var(--k-groups-menus-color-wine-50);
1396
- --k-components-menu-item-image-container-size-height: var(--k-groups-menus-visual-image-size);
1397
- --k-components-menu-item-image-container-size-width: var(--k-groups-menus-visual-image-size);
1410
+ --k-components-menu-item-image-container-size-small-height: var(--k-groups-menus-visual-image-size-xlarge);
1411
+ --k-components-menu-item-image-container-size-small-width: var(--k-groups-menus-visual-image-size-xlarge);
1412
+ --k-components-menu-item-image-container-size-large-height: var(--k-groups-menus-visual-image-size-xxlarge);
1413
+ --k-components-menu-item-image-container-size-large-width: var(--k-groups-menus-visual-image-size-xxlarge);
1398
1414
  --k-components-menu-item-image-container-border-radius: var(--k-groups-menus-radius-small);
1399
1415
  --k-components-menu-item-icon-size-large: var(--k-groups-menus-visual-icon-size-large);
1400
1416
  --k-components-menu-item-icon-size-medium: var(--k-groups-menus-visual-icon-size-medium);
@@ -1432,7 +1448,7 @@
1432
1448
  --k-components-dropdown-background-color-filled-hover: var(--k-groups-menus-color-wine-50);
1433
1449
  --k-components-dropdown-icon-color: var(--k-groups-menus-color-aubergine-750);
1434
1450
  --k-components-dropdown-icon-size: var(--k-groups-menus-visual-icon-size-large);
1435
- --k-components-dropdown-size-height: var(--k-groups-menus-space-large);
1451
+ --k-components-dropdown-size-height: var(--k-groups-menus-space-xlarge);
1436
1452
  --k-components-dropdown-border-radius: var(--k-groups-menus-radius-medium);
1437
1453
  --k-components-text-module-padding-inline: var(--k-groups-text-blocks-space-medium);
1438
1454
  --k-components-text-module-padding-top: var(--k-groups-text-blocks-space-large);
@@ -1583,9 +1599,9 @@
1583
1599
  --k-components-dropdown-menu-gap: var(--k-groups-menus-space-xsmall);
1584
1600
  --k-components-contextual-navigation-bar-padding-inline: var(--k-groups-navigation-bars-space-medium);
1585
1601
  --k-components-contextual-navigation-bar-padding-block: var(--k-groups-navigation-bars-space-large);
1586
- --k-components-contextual-navigation-bar-border-radius: var(--k-groups-navigation-bars-radius);
1587
1602
  --k-components-contextual-navigation-bar-left-container-gap: var(--k-groups-navigation-bars-space-xxlarge);
1588
1603
  --k-components-contextual-navigation-bar-background-color: var(--k-groups-navigation-bars-color-concrete-25);
1604
+ --k-components-contextual-navigation-bar-right-container-gap: var(--k-groups-navigation-bars-space-xsmall);
1589
1605
  --k-components-quote-module-gap-medium-desktop: var(--k-groups-cards-and-modules-space-xlarge);
1590
1606
  --k-components-quote-module-gap-small-desktop: var(--k-groups-cards-and-modules-space-xxlarge);
1591
1607
  --k-components-quote-module-gap-mobile: var(--k-groups-cards-and-modules-space-large);
@@ -1714,7 +1730,7 @@
1714
1730
  --k-components-text-display-text-color: var(--k-semantics-typography-color-brand-aubergine-750);
1715
1731
  --k-components-text-display-extended-text-color: var(--k-semantics-typography-color-brand-carmine-525);
1716
1732
  --k-components-dropdown-item-size-height: var(--k-groups-menus-size);
1717
- --k-components-dropdown-item-gap: var(--k-groups-menus-space-xsmall);
1733
+ --k-components-dropdown-item-gap: var(--k-groups-menus-space-medium);
1718
1734
  --k-components-dropdown-item-padding-inline: var(--k-groups-menus-space-medium);
1719
1735
  --k-components-dropdown-item-background-color-pressed: var(--k-groups-menus-color-wine-50);
1720
1736
  --k-components-dropdown-item-background-color-hover: var(--k-groups-menus-color-aubergine-50);
@@ -1722,6 +1738,7 @@
1722
1738
  --k-components-dropdown-item-icon-color: var(--k-groups-menus-color-aubergine-750);
1723
1739
  --k-components-content-island-background-color-neutral: var(--k-groups-content-controls-color-neutral-25);
1724
1740
  --k-components-content-island-inner-container-left-gap: var(--k-groups-content-controls-space-xxsmall);
1741
+ --k-components-content-island-inner-container-left-slider-container-padding-left: var(--k-groups-content-controls-space-xsmall);
1725
1742
  --k-components-content-island-border-radius: var(--k-groups-content-controls-border-radius-xsmall);
1726
1743
  --k-components-content-island-effect-shadow-spread: var(--k-groups-content-controls-effects-shadow-spread);
1727
1744
  --k-components-content-island-effect-shadow-color-brand-tone-a: var(--k-groups-content-controls-effects-shadow-color-aubergine-1000-10);
@@ -1806,13 +1823,15 @@
1806
1823
  --k-components-popover-inner-container-gap-small: var(--k-groups-popovers-space-xxsmall);
1807
1824
  --k-components-popover-inner-container-gap-large: var(--k-groups-popovers-space-large);
1808
1825
  --k-components-popover-inner-container-content-block-gap: var(--k-groups-popovers-space-medium);
1809
- --k-components-slider-border-radius: var(--k-groups-sliders-border-radius-xsmall);
1826
+ --k-components-slider-border-radius: var(--k-groups-sliders-border-radius-circle);
1810
1827
  --k-components-slider-background-color: var(--k-groups-sliders-color-purple-25);
1811
- --k-components-slider-size-height: var(--k-groups-sliders-size-xxsmall);
1828
+ --k-components-slider-size-height: var(--k-groups-sliders-size-xsmall);
1812
1829
  --k-components-slider-track-filled-background-color: var(--k-groups-sliders-color-purple-450);
1830
+ --k-components-slider-track-filled-size-height: var(--k-groups-sliders-size-xsmall);
1813
1831
  --k-components-slider-thumb-background-color: var(--k-groups-sliders-color-purple-700);
1814
- --k-components-slider-thumb-size-width: var(--k-groups-sliders-size-xxsmall);
1815
- --k-components-slider-thumb-size-height: var(--k-groups-sliders-size-xsmall);
1832
+ --k-components-slider-thumb-size-width: var(--k-groups-sliders-size-small);
1833
+ --k-components-slider-thumb-size-height: var(--k-groups-sliders-size-medium);
1834
+ --k-components-slider-controller-top-container-gap: var(--k-groups-sliders-space-xxsmall);
1816
1835
  --k-components-slider-controller-gap: var(--k-groups-sliders-space-xsmall);
1817
1836
  --k-components-media-player-item-background-color-neutral: var(--k-groups-media-players-color-neutral-25);
1818
1837
  --k-components-media-player-item-effect-shadow-blur: var(--k-groups-media-players-effects-shadow-blur);
@@ -1820,10 +1839,15 @@
1820
1839
  --k-components-media-player-item-border-radius: var(--k-groups-media-players-border-radius-xsmall);
1821
1840
  --k-components-media-player-item-padding: var(--k-groups-media-players-space-xxsmall);
1822
1841
  --k-components-media-player-item-inner-container-gap: var(--k-groups-media-players-space-small);
1842
+ --k-components-media-player-item-inner-container-controllers-gap: var(--k-groups-media-players-space-xxsmall);
1823
1843
  --k-components-media-player-border-radius: var(--k-groups-media-players-border-radius-xsmall);
1824
- --k-components-media-player-border-color: var(--k-groups-media-players-color-aubergine-50);
1825
1844
  --k-components-media-player-padding: var(--k-groups-media-players-space-medium);
1826
1845
  --k-components-media-player-gap: var(--k-groups-media-players-space-small);
1846
+ --k-components-media-player-container-bottom-border-color-brand: var(--k-groups-media-players-color-wine-150);
1847
+ --k-components-media-player-container-bottom-border-color-neutral: var(--k-groups-media-players-color-neutral-150);
1848
+ --k-components-media-player-container-bottom-border-radius: var(--k-groups-media-players-border-radius-xsmall);
1849
+ --k-components-media-player-container-bottom-gap: var(--k-groups-media-players-space-medium);
1850
+ --k-components-media-player-container-bottom-padding: var(--k-groups-media-players-space-large);
1827
1851
  --k-components-switch-background-color-neutral-fallback: var(--k-groups-switches-color-conctrete-425);
1828
1852
  --k-components-switch-background-color-neutral-hover: var(--k-groups-switches-color-conctrete-525);
1829
1853
  --k-components-switch-background-color-brand-fallback: var(--k-groups-switches-color-aubergine-750);
package/dist/tokens.css CHANGED
@@ -171,6 +171,7 @@
171
171
  --kobber-primitives-size-9999: 624.9375rem;
172
172
  --kobber-primitives-font-weight-200: 200;
173
173
  --kobber-primitives-font-weight-300: 300;
174
+ --kobber-primitives-font-weight-375: 375;
174
175
  --kobber-primitives-font-weight-400: 400;
175
176
  --kobber-primitives-font-weight-500: 500;
176
177
  --kobber-primitives-font-weight-600: 600;
@@ -205,16 +206,16 @@
205
206
  --kobber-primitives-font-size-48: 3rem;
206
207
  --kobber-primitives-font-size-56: 3.5rem;
207
208
  --kobber-primitives-elevation-z-index-0: 0;
208
- --kobber-primitives-elevation-z-index-1: 0.0625rem;
209
- --kobber-primitives-elevation-z-index-10: 0.625rem;
210
- --kobber-primitives-elevation-z-index-11: 0.6875rem;
211
- --kobber-primitives-elevation-z-index-100: 6.25rem;
212
- --kobber-primitives-elevation-z-index-1000: 62.5rem;
213
- --kobber-primitives-elevation-z-index-1050: 65.625rem;
214
- --kobber-primitives-elevation-z-index-1100: 68.75rem;
215
- --kobber-primitives-elevation-z-index-9000: 562.5rem;
216
- --kobber-primitives-elevation-z-index-9999: 624.9375rem;
217
- --kobber-primitives-elevation-z-index-1: -0.0625rem;
209
+ --kobber-primitives-elevation-z-index-1: 1;
210
+ --kobber-primitives-elevation-z-index-10: 10;
211
+ --kobber-primitives-elevation-z-index-11: 11;
212
+ --kobber-primitives-elevation-z-index-100: 100;
213
+ --kobber-primitives-elevation-z-index-1000: 1000;
214
+ --kobber-primitives-elevation-z-index-1050: 1050;
215
+ --kobber-primitives-elevation-z-index-1100: 1100;
216
+ --kobber-primitives-elevation-z-index-9000: 9000;
217
+ --kobber-primitives-elevation-z-index-9999: 9999;
218
+ --kobber-primitives-elevation-z-index-1: -1;
218
219
  --kobber-primitives-opacity-0: 0;
219
220
  --kobber-primitives-opacity-10: 0.1;
220
221
  --kobber-primitives-opacity-50: 0.5;
@@ -317,6 +318,10 @@
317
318
  --kobber-semantics-typography-line-height-60: var(--kobber-primitives-font-line-height-60);
318
319
  --kobber-semantics-typography-line-height-70: var(--kobber-primitives-font-line-height-70);
319
320
  --kobber-semantics-typography-indent: var(--kobber-primitives-size-24);
321
+ --kobber-semantics-typography-weight-light: var(--kobber-primitives-font-weight-300);
322
+ --kobber-semantics-typography-weight-book: var(--kobber-primitives-font-weight-375);
323
+ --kobber-semantics-typography-weight-regular: var(--kobber-primitives-font-weight-400);
324
+ --kobber-semantics-typography-weight-semibold: var(--kobber-primitives-font-weight-600);
320
325
  --kobber-semantics-color-identity-brand-carmine-525: var(--kobber-primitives-color-carmine-525);
321
326
  --kobber-semantics-color-identity-base-aubergine-25: var(--kobber-primitives-color-aubergine-25);
322
327
  --kobber-semantics-color-identity-base-aubergine-50: var(--kobber-primitives-color-aubergine-50);
@@ -640,8 +645,9 @@
640
645
  --kobber-groups-menus-space-tiny: var(--kobber-semantics-layout-element-space-tiny);
641
646
  --kobber-groups-menus-space-xsmall: var(--kobber-semantics-layout-element-space-xsmall);
642
647
  --kobber-groups-menus-space-medium: var(--kobber-semantics-layout-element-space-medium);
643
- --kobber-groups-menus-space-large: var(--kobber-semantics-layout-element-space-xxlarge);
648
+ --kobber-groups-menus-space-xlarge: var(--kobber-semantics-layout-element-space-xxlarge);
644
649
  --kobber-groups-menus-space-small: var(--kobber-semantics-layout-element-space-small);
650
+ --kobber-groups-menus-space-large: var(--kobber-semantics-layout-element-space-large);
645
651
  --kobber-groups-menus-radius-small: var(--kobber-semantics-layout-element-radius-xxsmall);
646
652
  --kobber-groups-menus-radius-large: var(--kobber-semantics-layout-element-radius-large);
647
653
  --kobber-groups-menus-radius-medium: var(--kobber-semantics-layout-element-radius-xsmall);
@@ -653,7 +659,8 @@
653
659
  --kobber-groups-menus-color-wine-150: var(--kobber-semantics-color-identity-extended-wine-150);
654
660
  --kobber-groups-menus-color-neutral-525: var(--kobber-semantics-effect-shadow-color-concrete-1000-10);
655
661
  --kobber-groups-menus-color-aubergine-150: var(--kobber-semantics-color-identity-extended-aubergine-150);
656
- --kobber-groups-menus-visual-image-size: var(--kobber-semantics-layout-element-size-xlarge);
662
+ --kobber-groups-menus-visual-image-size-xlarge: var(--kobber-semantics-layout-element-size-xlarge);
663
+ --kobber-groups-menus-visual-image-size-xxlarge: var(--kobber-semantics-layout-element-size-xxlarge);
657
664
  --kobber-groups-menus-visual-icon-size-large: var(--kobber-semantics-visual-icon-size-large);
658
665
  --kobber-groups-menus-visual-icon-size-medium: var(--kobber-semantics-visual-icon-size-medium);
659
666
  --kobber-groups-menus-visual-icon-size-xlarge: var(--kobber-semantics-visual-icon-size-xlarge);
@@ -758,6 +765,7 @@
758
765
  --kobber-groups-navigation-bars-space-small: var(--kobber-semantics-layout-element-space-small);
759
766
  --kobber-groups-navigation-bars-space-large: var(--kobber-semantics-layout-element-space-large);
760
767
  --kobber-groups-navigation-bars-space-xxlarge: var(--kobber-semantics-layout-element-space-xxlarge);
768
+ --kobber-groups-navigation-bars-space-xsmall: var(--kobber-semantics-layout-element-space-xsmall);
761
769
  --kobber-groups-navigation-bars-radius: var(--kobber-semantics-layout-element-radius-xsmall);
762
770
  --kobber-groups-text-blocks-space-medium: var(--kobber-semantics-layout-element-space-xlarge);
763
771
  --kobber-groups-text-blocks-space-large: var(--kobber-semantics-layout-element-space-xxlarge);
@@ -826,11 +834,14 @@
826
834
  --kobber-groups-media-players-space-medium: var(--kobber-semantics-layout-element-space-medium);
827
835
  --kobber-groups-media-players-space-small: var(--kobber-semantics-layout-element-space-small);
828
836
  --kobber-groups-media-players-space-xxsmall: var(--kobber-semantics-layout-element-space-xxsmall);
837
+ --kobber-groups-media-players-space-large: var(--kobber-semantics-layout-element-space-large);
829
838
  --kobber-groups-media-players-border-radius-xsmall: var(--kobber-semantics-layout-element-radius-xsmall);
830
839
  --kobber-groups-media-players-effects-shadow-blur: var(--kobber-semantics-effect-shadow-blur-small);
831
840
  --kobber-groups-media-players-effects-shadow-color-neutral-1000-10: var(--kobber-semantics-effect-shadow-color-concrete-1000-10);
832
841
  --kobber-groups-media-players-color-neutral-25: var(--kobber-semantics-color-identity-neutral-concrete-25);
833
842
  --kobber-groups-media-players-color-aubergine-50: var(--kobber-semantics-color-identity-base-aubergine-50);
843
+ --kobber-groups-media-players-color-wine-150: var(--kobber-semantics-color-identity-extended-wine-150);
844
+ --kobber-groups-media-players-color-neutral-150: var(--kobber-semantics-color-identity-neutral-concrete-150);
834
845
  --kobber-groups-popovers-space-medium: var(--kobber-semantics-layout-element-space-medium);
835
846
  --kobber-groups-popovers-space-xxsmall: var(--kobber-semantics-layout-element-space-xxsmall);
836
847
  --kobber-groups-popovers-space-large: var(--kobber-semantics-layout-element-space-large);
@@ -842,12 +853,15 @@
842
853
  --kobber-groups-popovers-size-large: var(--kobber-semantics-layout-component-size-large);
843
854
  --kobber-groups-popovers-size-medium: var(--kobber-semantics-layout-component-size-medium);
844
855
  --kobber-groups-popovers-size-small: var(--kobber-semantics-layout-component-size-xxxsmall);
845
- --kobber-groups-sliders-size-xxsmall: var(--kobber-semantics-layout-element-size-tiny);
856
+ --kobber-groups-sliders-size-small: var(--kobber-semantics-layout-element-size-xxsmall);
846
857
  --kobber-groups-sliders-size-xsmall: var(--kobber-semantics-layout-element-size-xxxsmall);
858
+ --kobber-groups-sliders-size-medium: var(--kobber-semantics-layout-element-size-small);
847
859
  --kobber-groups-sliders-color-purple-450: var(--kobber-semantics-color-identity-extended-purple-450);
848
860
  --kobber-groups-sliders-color-purple-700: var(--kobber-semantics-color-identity-extended-purple-700);
849
861
  --kobber-groups-sliders-color-purple-25: var(--kobber-semantics-color-identity-extended-purple-25);
850
862
  --kobber-groups-sliders-border-radius-xsmall: var(--kobber-semantics-layout-element-radius-xsmall);
863
+ --kobber-groups-sliders-border-radius-circle: var(--kobber-semantics-layout-element-radius-circle);
864
+ --kobber-groups-sliders-space-xxsmall: var(--kobber-semantics-layout-element-space-xxsmall);
851
865
  --kobber-groups-sliders-space-xsmall: var(--kobber-semantics-layout-element-space-xsmall);
852
866
  --kobber-groups-switches-color-conctrete-425: var(--kobber-semantics-color-identity-neutral-concrete-425);
853
867
  --kobber-groups-switches-color-conctrete-525: var(--kobber-semantics-color-identity-neutral-concrete-525);
@@ -1385,7 +1399,7 @@
1385
1399
  --kobber-components-menu-item-border-radius: var(--kobber-groups-menus-radius-small);
1386
1400
  --kobber-components-menu-item-padding-block: var(--kobber-groups-menus-space-small);
1387
1401
  --kobber-components-menu-item-padding-inline: var(--kobber-groups-menus-space-medium);
1388
- --kobber-components-menu-item-padding-left-nested: var(--kobber-groups-menus-space-large);
1402
+ --kobber-components-menu-item-padding-left-nested: var(--kobber-groups-menus-space-xlarge);
1389
1403
  --kobber-components-menu-item-padding-right-nested: var(--kobber-groups-menus-space-medium);
1390
1404
  --kobber-components-menu-item-text-container-border-bottom-padding: var(--kobber-groups-menus-space-tiny);
1391
1405
  --kobber-components-menu-item-text-container-border-weight-active: var(--kobber-groups-menus-stroke);
@@ -1393,8 +1407,10 @@
1393
1407
  --kobber-components-menu-item-text-container-gap: var(--kobber-groups-menus-space-xsmall);
1394
1408
  --kobber-components-menu-item-background-color-hover: var(--kobber-groups-menus-color-aubergine-50);
1395
1409
  --kobber-components-menu-item-background-color-pressed: var(--kobber-groups-menus-color-wine-50);
1396
- --kobber-components-menu-item-image-container-size-height: var(--kobber-groups-menus-visual-image-size);
1397
- --kobber-components-menu-item-image-container-size-width: var(--kobber-groups-menus-visual-image-size);
1410
+ --kobber-components-menu-item-image-container-size-small-height: var(--kobber-groups-menus-visual-image-size-xlarge);
1411
+ --kobber-components-menu-item-image-container-size-small-width: var(--kobber-groups-menus-visual-image-size-xlarge);
1412
+ --kobber-components-menu-item-image-container-size-large-height: var(--kobber-groups-menus-visual-image-size-xxlarge);
1413
+ --kobber-components-menu-item-image-container-size-large-width: var(--kobber-groups-menus-visual-image-size-xxlarge);
1398
1414
  --kobber-components-menu-item-image-container-border-radius: var(--kobber-groups-menus-radius-small);
1399
1415
  --kobber-components-menu-item-icon-size-large: var(--kobber-groups-menus-visual-icon-size-large);
1400
1416
  --kobber-components-menu-item-icon-size-medium: var(--kobber-groups-menus-visual-icon-size-medium);
@@ -1432,7 +1448,7 @@
1432
1448
  --kobber-components-dropdown-background-color-filled-hover: var(--kobber-groups-menus-color-wine-50);
1433
1449
  --kobber-components-dropdown-icon-color: var(--kobber-groups-menus-color-aubergine-750);
1434
1450
  --kobber-components-dropdown-icon-size: var(--kobber-groups-menus-visual-icon-size-large);
1435
- --kobber-components-dropdown-size-height: var(--kobber-groups-menus-space-large);
1451
+ --kobber-components-dropdown-size-height: var(--kobber-groups-menus-space-xlarge);
1436
1452
  --kobber-components-dropdown-border-radius: var(--kobber-groups-menus-radius-medium);
1437
1453
  --kobber-components-text-module-padding-inline: var(--kobber-groups-text-blocks-space-medium);
1438
1454
  --kobber-components-text-module-padding-top: var(--kobber-groups-text-blocks-space-large);
@@ -1583,9 +1599,9 @@
1583
1599
  --kobber-components-dropdown-menu-gap: var(--kobber-groups-menus-space-xsmall);
1584
1600
  --kobber-components-contextual-navigation-bar-padding-inline: var(--kobber-groups-navigation-bars-space-medium);
1585
1601
  --kobber-components-contextual-navigation-bar-padding-block: var(--kobber-groups-navigation-bars-space-large);
1586
- --kobber-components-contextual-navigation-bar-border-radius: var(--kobber-groups-navigation-bars-radius);
1587
1602
  --kobber-components-contextual-navigation-bar-left-container-gap: var(--kobber-groups-navigation-bars-space-xxlarge);
1588
1603
  --kobber-components-contextual-navigation-bar-background-color: var(--kobber-groups-navigation-bars-color-concrete-25);
1604
+ --kobber-components-contextual-navigation-bar-right-container-gap: var(--kobber-groups-navigation-bars-space-xsmall);
1589
1605
  --kobber-components-quote-module-gap-medium-desktop: var(--kobber-groups-cards-and-modules-space-xlarge);
1590
1606
  --kobber-components-quote-module-gap-small-desktop: var(--kobber-groups-cards-and-modules-space-xxlarge);
1591
1607
  --kobber-components-quote-module-gap-mobile: var(--kobber-groups-cards-and-modules-space-large);
@@ -1714,7 +1730,7 @@
1714
1730
  --kobber-components-text-display-text-color: var(--kobber-semantics-typography-color-brand-aubergine-750);
1715
1731
  --kobber-components-text-display-extended-text-color: var(--kobber-semantics-typography-color-brand-carmine-525);
1716
1732
  --kobber-components-dropdown-item-size-height: var(--kobber-groups-menus-size);
1717
- --kobber-components-dropdown-item-gap: var(--kobber-groups-menus-space-xsmall);
1733
+ --kobber-components-dropdown-item-gap: var(--kobber-groups-menus-space-medium);
1718
1734
  --kobber-components-dropdown-item-padding-inline: var(--kobber-groups-menus-space-medium);
1719
1735
  --kobber-components-dropdown-item-background-color-pressed: var(--kobber-groups-menus-color-wine-50);
1720
1736
  --kobber-components-dropdown-item-background-color-hover: var(--kobber-groups-menus-color-aubergine-50);
@@ -1722,6 +1738,7 @@
1722
1738
  --kobber-components-dropdown-item-icon-color: var(--kobber-groups-menus-color-aubergine-750);
1723
1739
  --kobber-components-content-island-background-color-neutral: var(--kobber-groups-content-controls-color-neutral-25);
1724
1740
  --kobber-components-content-island-inner-container-left-gap: var(--kobber-groups-content-controls-space-xxsmall);
1741
+ --kobber-components-content-island-inner-container-left-slider-container-padding-left: var(--kobber-groups-content-controls-space-xsmall);
1725
1742
  --kobber-components-content-island-border-radius: var(--kobber-groups-content-controls-border-radius-xsmall);
1726
1743
  --kobber-components-content-island-effect-shadow-spread: var(--kobber-groups-content-controls-effects-shadow-spread);
1727
1744
  --kobber-components-content-island-effect-shadow-color-brand-tone-a: var(--kobber-groups-content-controls-effects-shadow-color-aubergine-1000-10);
@@ -1806,13 +1823,15 @@
1806
1823
  --kobber-components-popover-inner-container-gap-small: var(--kobber-groups-popovers-space-xxsmall);
1807
1824
  --kobber-components-popover-inner-container-gap-large: var(--kobber-groups-popovers-space-large);
1808
1825
  --kobber-components-popover-inner-container-content-block-gap: var(--kobber-groups-popovers-space-medium);
1809
- --kobber-components-slider-border-radius: var(--kobber-groups-sliders-border-radius-xsmall);
1826
+ --kobber-components-slider-border-radius: var(--kobber-groups-sliders-border-radius-circle);
1810
1827
  --kobber-components-slider-background-color: var(--kobber-groups-sliders-color-purple-25);
1811
- --kobber-components-slider-size-height: var(--kobber-groups-sliders-size-xxsmall);
1828
+ --kobber-components-slider-size-height: var(--kobber-groups-sliders-size-xsmall);
1812
1829
  --kobber-components-slider-track-filled-background-color: var(--kobber-groups-sliders-color-purple-450);
1830
+ --kobber-components-slider-track-filled-size-height: var(--kobber-groups-sliders-size-xsmall);
1813
1831
  --kobber-components-slider-thumb-background-color: var(--kobber-groups-sliders-color-purple-700);
1814
- --kobber-components-slider-thumb-size-width: var(--kobber-groups-sliders-size-xxsmall);
1815
- --kobber-components-slider-thumb-size-height: var(--kobber-groups-sliders-size-xsmall);
1832
+ --kobber-components-slider-thumb-size-width: var(--kobber-groups-sliders-size-small);
1833
+ --kobber-components-slider-thumb-size-height: var(--kobber-groups-sliders-size-medium);
1834
+ --kobber-components-slider-controller-top-container-gap: var(--kobber-groups-sliders-space-xxsmall);
1816
1835
  --kobber-components-slider-controller-gap: var(--kobber-groups-sliders-space-xsmall);
1817
1836
  --kobber-components-media-player-item-background-color-neutral: var(--kobber-groups-media-players-color-neutral-25);
1818
1837
  --kobber-components-media-player-item-effect-shadow-blur: var(--kobber-groups-media-players-effects-shadow-blur);
@@ -1820,10 +1839,15 @@
1820
1839
  --kobber-components-media-player-item-border-radius: var(--kobber-groups-media-players-border-radius-xsmall);
1821
1840
  --kobber-components-media-player-item-padding: var(--kobber-groups-media-players-space-xxsmall);
1822
1841
  --kobber-components-media-player-item-inner-container-gap: var(--kobber-groups-media-players-space-small);
1842
+ --kobber-components-media-player-item-inner-container-controllers-gap: var(--kobber-groups-media-players-space-xxsmall);
1823
1843
  --kobber-components-media-player-border-radius: var(--kobber-groups-media-players-border-radius-xsmall);
1824
- --kobber-components-media-player-border-color: var(--kobber-groups-media-players-color-aubergine-50);
1825
1844
  --kobber-components-media-player-padding: var(--kobber-groups-media-players-space-medium);
1826
1845
  --kobber-components-media-player-gap: var(--kobber-groups-media-players-space-small);
1846
+ --kobber-components-media-player-container-bottom-border-color-brand: var(--kobber-groups-media-players-color-wine-150);
1847
+ --kobber-components-media-player-container-bottom-border-color-neutral: var(--kobber-groups-media-players-color-neutral-150);
1848
+ --kobber-components-media-player-container-bottom-border-radius: var(--kobber-groups-media-players-border-radius-xsmall);
1849
+ --kobber-components-media-player-container-bottom-gap: var(--kobber-groups-media-players-space-medium);
1850
+ --kobber-components-media-player-container-bottom-padding: var(--kobber-groups-media-players-space-large);
1827
1851
  --kobber-components-switch-background-color-neutral-fallback: var(--kobber-groups-switches-color-conctrete-425);
1828
1852
  --kobber-components-switch-background-color-neutral-hover: var(--kobber-groups-switches-color-conctrete-525);
1829
1853
  --kobber-components-switch-background-color-brand-fallback: var(--kobber-groups-switches-color-aubergine-750);
package/dist/tokens.d.ts CHANGED
@@ -201,6 +201,7 @@ export const primitives: {
201
201
  "weight": {
202
202
  "200": 200,
203
203
  "300": 300,
204
+ "375": 375,
204
205
  "400": 400,
205
206
  "500": 500,
206
207
  "600": 600
@@ -601,8 +602,9 @@ export const groups: {
601
602
  "tiny": 2,
602
603
  "xsmall": 8,
603
604
  "medium": 16,
604
- "large": 40,
605
- "small": 12
605
+ "xlarge": 40,
606
+ "small": 12,
607
+ "large": 24
606
608
  },
607
609
  "radius": {
608
610
  "small": 4,
@@ -621,7 +623,10 @@ export const groups: {
621
623
  },
622
624
  "visual": {
623
625
  "image": {
624
- "size": 40
626
+ "size": {
627
+ "xlarge": 40,
628
+ "xxlarge": 48
629
+ }
625
630
  },
626
631
  "icon": {
627
632
  "size": {
@@ -810,7 +815,8 @@ export const groups: {
810
815
  "xlarge": 32,
811
816
  "small": 12,
812
817
  "large": 24,
813
- "xxlarge": 40
818
+ "xxlarge": 40,
819
+ "xsmall": 8
814
820
  },
815
821
  "radius": 8
816
822
  },
@@ -936,7 +942,8 @@ export const groups: {
936
942
  "space": {
937
943
  "medium": 16,
938
944
  "small": 12,
939
- "xxsmall": 4
945
+ "xxsmall": 4,
946
+ "large": 24
940
947
  },
941
948
  "border": {
942
949
  "radius": {
@@ -953,7 +960,9 @@ export const groups: {
953
960
  },
954
961
  "color": {
955
962
  "neutral-25": "#f9fafb",
956
- "aubergine-50": "#f9eaed"
963
+ "aubergine-50": "#f9eaed",
964
+ "wine-150": "#e5cfd3",
965
+ "neutral-150": "#cfd5dd"
957
966
  }
958
967
  },
959
968
  "popovers": {
@@ -989,8 +998,9 @@ export const groups: {
989
998
  },
990
999
  "sliders": {
991
1000
  "size": {
992
- "xxsmall": 4,
993
- "xsmall": 8
1001
+ "small": 10,
1002
+ "xsmall": 8,
1003
+ "medium": 16
994
1004
  },
995
1005
  "color": {
996
1006
  "purple-450": "#7155f0",
@@ -999,10 +1009,12 @@ export const groups: {
999
1009
  },
1000
1010
  "border": {
1001
1011
  "radius": {
1002
- "xsmall": 8
1012
+ "xsmall": 8,
1013
+ "circle": 9999
1003
1014
  }
1004
1015
  },
1005
1016
  "space": {
1017
+ "xxsmall": 4,
1006
1018
  "xsmall": 8
1007
1019
  }
1008
1020
  },
@@ -2145,8 +2157,14 @@ export const components: {
2145
2157
  },
2146
2158
  "imageContainer": {
2147
2159
  "size": {
2148
- "height": 40,
2149
- "width": 40
2160
+ "small": {
2161
+ "height": 40,
2162
+ "width": 40
2163
+ },
2164
+ "large": {
2165
+ "height": 48,
2166
+ "width": 48
2167
+ }
2150
2168
  },
2151
2169
  "border": {
2152
2170
  "radius": 4
@@ -2697,14 +2715,14 @@ export const components: {
2697
2715
  "inline": 16,
2698
2716
  "block": 24
2699
2717
  },
2700
- "border": {
2701
- "radius": 8
2702
- },
2703
2718
  "leftContainer": {
2704
2719
  "gap": 40
2705
2720
  },
2706
2721
  "background": {
2707
2722
  "color": "#f9fafb"
2723
+ },
2724
+ "rightContainer": {
2725
+ "gap": 8
2708
2726
  }
2709
2727
  },
2710
2728
  "quoteModule": {
@@ -3155,7 +3173,7 @@ export const components: {
3155
3173
  "size": {
3156
3174
  "height": 40
3157
3175
  },
3158
- "gap": 8,
3176
+ "gap": 16,
3159
3177
  "padding": {
3160
3178
  "inline": 16
3161
3179
  },
@@ -3179,7 +3197,10 @@ export const components: {
3179
3197
  }
3180
3198
  },
3181
3199
  "innerContainerLeft": {
3182
- "gap": 4
3200
+ "gap": 4,
3201
+ "sliderContainer": {
3202
+ "paddingLeft": 8
3203
+ }
3183
3204
  },
3184
3205
  "border": {
3185
3206
  "radius": 8
@@ -3429,17 +3450,20 @@ export const components: {
3429
3450
  },
3430
3451
  "_slider": {
3431
3452
  "border": {
3432
- "radius": 8
3453
+ "radius": 9999
3433
3454
  },
3434
3455
  "background": {
3435
3456
  "color": "#ece6f9"
3436
3457
  },
3437
3458
  "size": {
3438
- "height": 4
3459
+ "height": 8
3439
3460
  },
3440
3461
  "trackFilled": {
3441
3462
  "background": {
3442
3463
  "color": "#7155f0"
3464
+ },
3465
+ "size": {
3466
+ "height": 8
3443
3467
  }
3444
3468
  },
3445
3469
  "thumb": {
@@ -3447,12 +3471,15 @@ export const components: {
3447
3471
  "color": "#4420b0"
3448
3472
  },
3449
3473
  "size": {
3450
- "width": 4,
3451
- "height": 8
3474
+ "width": 10,
3475
+ "height": 16
3452
3476
  }
3453
3477
  }
3454
3478
  },
3455
3479
  "_sliderController": {
3480
+ "topContainer": {
3481
+ "gap": 4
3482
+ },
3456
3483
  "gap": 8
3457
3484
  },
3458
3485
  "mediaPlayerItem": {
@@ -3474,16 +3501,29 @@ export const components: {
3474
3501
  },
3475
3502
  "padding": 4,
3476
3503
  "innerContainer": {
3477
- "gap": 12
3504
+ "gap": 12,
3505
+ "controllers": {
3506
+ "gap": 4
3507
+ }
3478
3508
  }
3479
3509
  },
3480
3510
  "mediaPlayer": {
3481
3511
  "border": {
3482
- "radius": 8,
3483
- "color": "#f9eaed"
3512
+ "radius": 8
3484
3513
  },
3485
3514
  "padding": 16,
3486
- "gap": 12
3515
+ "gap": 12,
3516
+ "containerBottom": {
3517
+ "border": {
3518
+ "color": {
3519
+ "brand": "#e5cfd3",
3520
+ "neutral": "#cfd5dd"
3521
+ },
3522
+ "radius": 8
3523
+ },
3524
+ "gap": 16,
3525
+ "padding": 24
3526
+ }
3487
3527
  },
3488
3528
  "switch": {
3489
3529
  "background": {
@@ -3541,14 +3581,14 @@ export const universal: {
3541
3581
  },
3542
3582
  "disabled": {
3543
3583
  "container": {
3544
- "opacity": 0.005
3584
+ "opacity": 0.5
3545
3585
  }
3546
3586
  },
3547
3587
  "hover": {
3548
3588
  "container": {
3549
3589
  "lighten": "#28000e",
3550
3590
  "darken": "#f9eaed",
3551
- "opacity": 0.001
3591
+ "opacity": 0.1
3552
3592
  }
3553
3593
  },
3554
3594
  "iconPackage": {
@@ -3664,7 +3704,13 @@ export const semantics: {
3664
3704
  "light": "light",
3665
3705
  "indent": 24,
3666
3706
  "regularItalic": "italic",
3667
- "bold": "semibold"
3707
+ "bold": "semibold",
3708
+ "weight": {
3709
+ "light": 300,
3710
+ "book": 375,
3711
+ "regular": 400,
3712
+ "semibold": 600
3713
+ }
3668
3714
  },
3669
3715
  "color": {
3670
3716
  "identity": {
package/dist/tokens.js CHANGED
@@ -200,6 +200,7 @@ export const primitives = {
200
200
  "weight": {
201
201
  "200": 200,
202
202
  "300": 300,
203
+ "375": 375,
203
204
  "400": 400,
204
205
  "500": 500,
205
206
  "600": 600
@@ -600,8 +601,9 @@ export const groups = {
600
601
  "tiny": 2,
601
602
  "xsmall": 8,
602
603
  "medium": 16,
603
- "large": 40,
604
- "small": 12
604
+ "xlarge": 40,
605
+ "small": 12,
606
+ "large": 24
605
607
  },
606
608
  "radius": {
607
609
  "small": 4,
@@ -620,7 +622,10 @@ export const groups = {
620
622
  },
621
623
  "visual": {
622
624
  "image": {
623
- "size": 40
625
+ "size": {
626
+ "xlarge": 40,
627
+ "xxlarge": 48
628
+ }
624
629
  },
625
630
  "icon": {
626
631
  "size": {
@@ -809,7 +814,8 @@ export const groups = {
809
814
  "xlarge": 32,
810
815
  "small": 12,
811
816
  "large": 24,
812
- "xxlarge": 40
817
+ "xxlarge": 40,
818
+ "xsmall": 8
813
819
  },
814
820
  "radius": 8
815
821
  },
@@ -935,7 +941,8 @@ export const groups = {
935
941
  "space": {
936
942
  "medium": 16,
937
943
  "small": 12,
938
- "xxsmall": 4
944
+ "xxsmall": 4,
945
+ "large": 24
939
946
  },
940
947
  "border": {
941
948
  "radius": {
@@ -952,7 +959,9 @@ export const groups = {
952
959
  },
953
960
  "color": {
954
961
  "neutral-25": "#f9fafb",
955
- "aubergine-50": "#f9eaed"
962
+ "aubergine-50": "#f9eaed",
963
+ "wine-150": "#e5cfd3",
964
+ "neutral-150": "#cfd5dd"
956
965
  }
957
966
  },
958
967
  "popovers": {
@@ -988,8 +997,9 @@ export const groups = {
988
997
  },
989
998
  "sliders": {
990
999
  "size": {
991
- "xxsmall": 4,
992
- "xsmall": 8
1000
+ "small": 10,
1001
+ "xsmall": 8,
1002
+ "medium": 16
993
1003
  },
994
1004
  "color": {
995
1005
  "purple-450": "#7155f0",
@@ -998,10 +1008,12 @@ export const groups = {
998
1008
  },
999
1009
  "border": {
1000
1010
  "radius": {
1001
- "xsmall": 8
1011
+ "xsmall": 8,
1012
+ "circle": 9999
1002
1013
  }
1003
1014
  },
1004
1015
  "space": {
1016
+ "xxsmall": 4,
1005
1017
  "xsmall": 8
1006
1018
  }
1007
1019
  },
@@ -2144,8 +2156,14 @@ export const components = {
2144
2156
  },
2145
2157
  "imageContainer": {
2146
2158
  "size": {
2147
- "height": 40,
2148
- "width": 40
2159
+ "small": {
2160
+ "height": 40,
2161
+ "width": 40
2162
+ },
2163
+ "large": {
2164
+ "height": 48,
2165
+ "width": 48
2166
+ }
2149
2167
  },
2150
2168
  "border": {
2151
2169
  "radius": 4
@@ -2696,14 +2714,14 @@ export const components = {
2696
2714
  "inline": 16,
2697
2715
  "block": 24
2698
2716
  },
2699
- "border": {
2700
- "radius": 8
2701
- },
2702
2717
  "leftContainer": {
2703
2718
  "gap": 40
2704
2719
  },
2705
2720
  "background": {
2706
2721
  "color": "#f9fafb"
2722
+ },
2723
+ "rightContainer": {
2724
+ "gap": 8
2707
2725
  }
2708
2726
  },
2709
2727
  "quoteModule": {
@@ -3154,7 +3172,7 @@ export const components = {
3154
3172
  "size": {
3155
3173
  "height": 40
3156
3174
  },
3157
- "gap": 8,
3175
+ "gap": 16,
3158
3176
  "padding": {
3159
3177
  "inline": 16
3160
3178
  },
@@ -3178,7 +3196,10 @@ export const components = {
3178
3196
  }
3179
3197
  },
3180
3198
  "innerContainerLeft": {
3181
- "gap": 4
3199
+ "gap": 4,
3200
+ "sliderContainer": {
3201
+ "paddingLeft": 8
3202
+ }
3182
3203
  },
3183
3204
  "border": {
3184
3205
  "radius": 8
@@ -3428,17 +3449,20 @@ export const components = {
3428
3449
  },
3429
3450
  "_slider": {
3430
3451
  "border": {
3431
- "radius": 8
3452
+ "radius": 9999
3432
3453
  },
3433
3454
  "background": {
3434
3455
  "color": "#ece6f9"
3435
3456
  },
3436
3457
  "size": {
3437
- "height": 4
3458
+ "height": 8
3438
3459
  },
3439
3460
  "trackFilled": {
3440
3461
  "background": {
3441
3462
  "color": "#7155f0"
3463
+ },
3464
+ "size": {
3465
+ "height": 8
3442
3466
  }
3443
3467
  },
3444
3468
  "thumb": {
@@ -3446,12 +3470,15 @@ export const components = {
3446
3470
  "color": "#4420b0"
3447
3471
  },
3448
3472
  "size": {
3449
- "width": 4,
3450
- "height": 8
3473
+ "width": 10,
3474
+ "height": 16
3451
3475
  }
3452
3476
  }
3453
3477
  },
3454
3478
  "_sliderController": {
3479
+ "topContainer": {
3480
+ "gap": 4
3481
+ },
3455
3482
  "gap": 8
3456
3483
  },
3457
3484
  "mediaPlayerItem": {
@@ -3473,16 +3500,29 @@ export const components = {
3473
3500
  },
3474
3501
  "padding": 4,
3475
3502
  "innerContainer": {
3476
- "gap": 12
3503
+ "gap": 12,
3504
+ "controllers": {
3505
+ "gap": 4
3506
+ }
3477
3507
  }
3478
3508
  },
3479
3509
  "mediaPlayer": {
3480
3510
  "border": {
3481
- "radius": 8,
3482
- "color": "#f9eaed"
3511
+ "radius": 8
3483
3512
  },
3484
3513
  "padding": 16,
3485
- "gap": 12
3514
+ "gap": 12,
3515
+ "containerBottom": {
3516
+ "border": {
3517
+ "color": {
3518
+ "brand": "#e5cfd3",
3519
+ "neutral": "#cfd5dd"
3520
+ },
3521
+ "radius": 8
3522
+ },
3523
+ "gap": 16,
3524
+ "padding": 24
3525
+ }
3486
3526
  },
3487
3527
  "switch": {
3488
3528
  "background": {
@@ -3540,14 +3580,14 @@ export const universal = {
3540
3580
  },
3541
3581
  "disabled": {
3542
3582
  "container": {
3543
- "opacity": 0.005
3583
+ "opacity": 0.5
3544
3584
  }
3545
3585
  },
3546
3586
  "hover": {
3547
3587
  "container": {
3548
3588
  "lighten": "#28000e",
3549
3589
  "darken": "#f9eaed",
3550
- "opacity": 0.001
3590
+ "opacity": 0.1
3551
3591
  }
3552
3592
  },
3553
3593
  "iconPackage": {
@@ -3663,7 +3703,13 @@ export const semantics = {
3663
3703
  "light": "light",
3664
3704
  "indent": 24,
3665
3705
  "regularItalic": "italic",
3666
- "bold": "semibold"
3706
+ "bold": "semibold",
3707
+ "weight": {
3708
+ "light": 300,
3709
+ "book": 375,
3710
+ "regular": 400,
3711
+ "semibold": 600
3712
+ }
3667
3713
  },
3668
3714
  "color": {
3669
3715
  "identity": {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gyldendal/kobber-tokens",
3
- "version": "10.0.0",
3
+ "version": "11.0.0",
4
4
  "description": "Gyldendal Kobber design tokens",
5
5
  "license": "UNLICENSED",
6
6
  "private": false,