@norges-domstoler/dds-design-tokens 8.0.0 → 8.0.2

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.
@@ -78,6 +78,9 @@
78
78
  $dds-zindex-dropdown: var(--dds-zindex-dropdown); /* Dropdown brukes for bl.a søkeforslag, dropdown i select */
79
79
  $dds-zindex-sticky: var(--dds-zindex-sticky); /* Sticky header skal dekke til flat innhold i gruppen (tabell o.l.). Den skal legge seg under elementer som stiller med egne flater */
80
80
  $dds-zindex-absolute-element: var(--dds-zindex-absolute-element); /* Dekorative elementer med absolutt posisjon, som ellers hadde blitt skjult bak forelder */
81
+ $dds-color-data-10-default: var(--dds-color-data-10-default);
82
+ $dds-color-data-10-subtle: var(--dds-color-data-10-subtle);
83
+ $dds-color-data-10-border: var(--dds-color-data-10-border);
81
84
  $dds-color-data-red-100: var(--dds-color-data-red-100);
82
85
  $dds-color-data-red-200: var(--dds-color-data-red-200);
83
86
  $dds-color-data-red-300: var(--dds-color-data-red-300);
@@ -168,6 +171,33 @@
168
171
  $dds-color-data-gray-700: var(--dds-color-data-gray-700);
169
172
  $dds-color-data-gray-800: var(--dds-color-data-gray-800);
170
173
  $dds-color-data-gray-900: var(--dds-color-data-gray-900);
174
+ $dds-color-data-01-default: var(--dds-color-data-01-default);
175
+ $dds-color-data-01-subtle: var(--dds-color-data-01-subtle);
176
+ $dds-color-data-01-border: var(--dds-color-data-01-border);
177
+ $dds-color-data-02-default: var(--dds-color-data-02-default);
178
+ $dds-color-data-02-subtle: var(--dds-color-data-02-subtle);
179
+ $dds-color-data-02-border: var(--dds-color-data-02-border);
180
+ $dds-color-data-03-default: var(--dds-color-data-03-default);
181
+ $dds-color-data-03-subtle: var(--dds-color-data-03-subtle);
182
+ $dds-color-data-03-border: var(--dds-color-data-03-border);
183
+ $dds-color-data-04-default: var(--dds-color-data-04-default);
184
+ $dds-color-data-04-subtle: var(--dds-color-data-04-subtle);
185
+ $dds-color-data-04-border: var(--dds-color-data-04-border);
186
+ $dds-color-data-05-default: var(--dds-color-data-05-default);
187
+ $dds-color-data-05-subtle: var(--dds-color-data-05-subtle);
188
+ $dds-color-data-05-border: var(--dds-color-data-05-border);
189
+ $dds-color-data-06-default: var(--dds-color-data-06-default);
190
+ $dds-color-data-06-subtle: var(--dds-color-data-06-subtle);
191
+ $dds-color-data-06-border: var(--dds-color-data-06-border);
192
+ $dds-color-data-07-default: var(--dds-color-data-07-default);
193
+ $dds-color-data-07-subtle: var(--dds-color-data-07-subtle);
194
+ $dds-color-data-07-border: var(--dds-color-data-07-border);
195
+ $dds-color-data-08-default: var(--dds-color-data-08-default);
196
+ $dds-color-data-08-subtle: var(--dds-color-data-08-subtle);
197
+ $dds-color-data-08-border: var(--dds-color-data-08-border);
198
+ $dds-color-data-09-default: var(--dds-color-data-09-default);
199
+ $dds-color-data-09-subtle: var(--dds-color-data-09-subtle);
200
+ $dds-color-data-09-border: var(--dds-color-data-09-border);
171
201
  $dds-color-bg-default: var(--dds-color-bg-default); /* UI shell base color */
172
202
  $dds-color-bg-subtle: var(--dds-color-bg-subtle); /* Alternative UI shell base color */
173
203
  $dds-color-surface-default: var(--dds-color-surface-default); /* Default bg */
@@ -255,36 +285,6 @@
255
285
  $dds-color-brand-tertiary-strong: var(--dds-color-brand-tertiary-strong); /* Tertiary brand color */
256
286
  $dds-color-focus-outside: var(--dds-color-focus-outside); /* Contrast to .inside */
257
287
  $dds-color-focus-inside: var(--dds-color-focus-inside); /* Contrast to .outside */
258
- $dds-color-data-10-default: var(--dds-color-data-10-default);
259
- $dds-color-data-10-subtle: var(--dds-color-data-10-subtle);
260
- $dds-color-data-10-border: var(--dds-color-data-10-border);
261
- $dds-color-data-01-default: var(--dds-color-data-01-default);
262
- $dds-color-data-01-subtle: var(--dds-color-data-01-subtle);
263
- $dds-color-data-01-border: var(--dds-color-data-01-border);
264
- $dds-color-data-02-default: var(--dds-color-data-02-default);
265
- $dds-color-data-02-subtle: var(--dds-color-data-02-subtle);
266
- $dds-color-data-02-border: var(--dds-color-data-02-border);
267
- $dds-color-data-03-default: var(--dds-color-data-03-default);
268
- $dds-color-data-03-subtle: var(--dds-color-data-03-subtle);
269
- $dds-color-data-03-border: var(--dds-color-data-03-border);
270
- $dds-color-data-04-default: var(--dds-color-data-04-default);
271
- $dds-color-data-04-subtle: var(--dds-color-data-04-subtle);
272
- $dds-color-data-04-border: var(--dds-color-data-04-border);
273
- $dds-color-data-05-default: var(--dds-color-data-05-default);
274
- $dds-color-data-05-subtle: var(--dds-color-data-05-subtle);
275
- $dds-color-data-05-border: var(--dds-color-data-05-border);
276
- $dds-color-data-06-default: var(--dds-color-data-06-default);
277
- $dds-color-data-06-subtle: var(--dds-color-data-06-subtle);
278
- $dds-color-data-06-border: var(--dds-color-data-06-border);
279
- $dds-color-data-07-default: var(--dds-color-data-07-default);
280
- $dds-color-data-07-subtle: var(--dds-color-data-07-subtle);
281
- $dds-color-data-07-border: var(--dds-color-data-07-border);
282
- $dds-color-data-08-default: var(--dds-color-data-08-default);
283
- $dds-color-data-08-subtle: var(--dds-color-data-08-subtle);
284
- $dds-color-data-08-border: var(--dds-color-data-08-border);
285
- $dds-color-data-09-default: var(--dds-color-data-09-default);
286
- $dds-color-data-09-subtle: var(--dds-color-data-09-subtle);
287
- $dds-color-data-09-border: var(--dds-color-data-09-border);
288
288
  $dds-border-radius-button: var(--dds-border-radius-button); /* For use in button component and togglebutton */
289
289
  $dds-border-radius-surface: var(--dds-border-radius-surface); /* Most surfaces, for example cards, papers, messages, backgrounds in GUI */
290
290
  $dds-border-radius-input: var(--dds-border-radius-input); /* All input fields, and check boxes */
@@ -119,6 +119,9 @@ export declare const ddsTokens: {
119
119
  ddsZindexDropdown: "100";
120
120
  ddsZindexSticky: "50";
121
121
  ddsZindexAbsoluteElement: "1";
122
+ ddsColorData10Default: "#196b8f";
123
+ ddsColorData10Subtle: "#96c5d9";
124
+ ddsColorData10Border: "#196b8f";
122
125
  ddsColorDataRed100: "#f8d2d4";
123
126
  ddsColorDataRed200: "#f0a5a9";
124
127
  ddsColorDataRed300: "#e9787e";
@@ -209,11 +212,38 @@ export declare const ddsTokens: {
209
212
  ddsColorDataGray700: "#444444";
210
213
  ddsColorDataGray800: "#2e2e2e";
211
214
  ddsColorDataGray900: "#171717";
215
+ ddsColorData01Default: "#0f62fe";
216
+ ddsColorData01Subtle: "#9fc0ff";
217
+ ddsColorData01Border: "#0f62fe";
218
+ ddsColorData02Default: "#b3572f";
219
+ ddsColorData02Subtle: "#e1bcac";
220
+ ddsColorData02Border: "#b3572f";
221
+ ddsColorData03Default: "#727272";
222
+ ddsColorData03Subtle: "#c7c7c7";
223
+ ddsColorData03Border: "#727272";
224
+ ddsColorData04Default: "#198038";
225
+ ddsColorData04Subtle: "#a3ccaf";
226
+ ddsColorData04Border: "#198038";
227
+ ddsColorData05Default: "#8a3ffc";
228
+ ddsColorData05Subtle: "#d0b2fe";
229
+ ddsColorData05Border: "#8a3ffc";
230
+ ddsColorData06Default: "#b62665";
231
+ ddsColorData06Subtle: "#dfa5bf";
232
+ ddsColorData06Border: "#b62665";
233
+ ddsColorData07Default: "#7c7518";
234
+ ddsColorData07Subtle: "#cdc9a1";
235
+ ddsColorData07Border: "#7c7518";
236
+ ddsColorData08Default: "#da1e28";
237
+ ddsColorData08Subtle: "#f0a5a9";
238
+ ddsColorData08Border: "#da1e28";
239
+ ddsColorData09Default: "#007d79";
240
+ ddsColorData09Subtle: "#90ccc9";
241
+ ddsColorData09Border: "#007d79";
212
242
  ddsColorBgDefault: "#ffffff";
213
243
  ddsColorBgSubtle: "#f1f3f4";
214
244
  ddsColorSurfaceDefault: "#ffffff";
215
245
  ddsColorSurfaceSubtle: "#f1f3f4";
216
- ddsColorSurfaceMedium: "#e4e6e8";
246
+ ddsColorSurfaceMedium: "#e9ebec";
217
247
  ddsColorSurfaceHoverDefault: "#e7f1f7";
218
248
  ddsColorSurfaceHoverSubtle: "#f1f3f4";
219
249
  ddsColorSurfaceSelectedDefault: "#e7f1f7";
@@ -296,36 +326,6 @@ export declare const ddsTokens: {
296
326
  ddsColorBrandTertiaryStrong: "#d45d32";
297
327
  ddsColorFocusOutside: "#2a4b61";
298
328
  ddsColorFocusInside: "#f1f8fd";
299
- ddsColorData10Default: "#196b8f";
300
- ddsColorData10Subtle: "#96c5d9";
301
- ddsColorData10Border: "#196b8f";
302
- ddsColorData01Default: "#0f62fe";
303
- ddsColorData01Subtle: "#9fc0ff";
304
- ddsColorData01Border: "#0f62fe";
305
- ddsColorData02Default: "#b3572f";
306
- ddsColorData02Subtle: "#e1bcac";
307
- ddsColorData02Border: "#b3572f";
308
- ddsColorData03Default: "#727272";
309
- ddsColorData03Subtle: "#c7c7c7";
310
- ddsColorData03Border: "#727272";
311
- ddsColorData04Default: "#198038";
312
- ddsColorData04Subtle: "#a3ccaf";
313
- ddsColorData04Border: "#198038";
314
- ddsColorData05Default: "#8a3ffc";
315
- ddsColorData05Subtle: "#d0b2fe";
316
- ddsColorData05Border: "#8a3ffc";
317
- ddsColorData06Default: "#b62665";
318
- ddsColorData06Subtle: "#dfa5bf";
319
- ddsColorData06Border: "#b62665";
320
- ddsColorData07Default: "#7c7518";
321
- ddsColorData07Subtle: "#cdc9a1";
322
- ddsColorData07Border: "#7c7518";
323
- ddsColorData08Default: "#da1e28";
324
- ddsColorData08Subtle: "#f0a5a9";
325
- ddsColorData08Border: "#da1e28";
326
- ddsColorData09Default: "#007d79";
327
- ddsColorData09Subtle: "#90ccc9";
328
- ddsColorData09Border: "#007d79";
329
329
  ddsFontLabelMedium: "600 0.875rem/1.5 'IBM Plex Sans', Arial, sans-serif";
330
330
  ddsFontBodyXsmall: "400 0.75rem/1.5 'IBM Plex Sans', Arial, sans-serif";
331
331
  ddsFontBodySmall: "400 0.875rem/1.5 'IBM Plex Sans', Arial, sans-serif";
@@ -335,8 +335,8 @@ export declare const ddsTokens: {
335
335
  ddsFontHeadingXsmall: "600 0.875rem/1.5 'IBM Plex Sans', Arial, sans-serif";
336
336
  ddsFontHeadingSmall: "600 1rem/1.5 'IBM Plex Sans', Arial, sans-serif";
337
337
  ddsFontHeadingMedium: "600 1.125rem/1.5 'IBM Plex Sans', Arial, sans-serif";
338
- ddsFontHeadingLarge: "400 clamp(1.25rem, 0.833rem + 1.111vw, 1.5rem)/1.35 'IBM Plex Sans', Arial, sans-serif";
339
- ddsFontHeadingXlarge: "400 clamp(1.5rem, 0.667rem + 2.222vw, 2rem)/1.35 'IBM Plex Sans', Arial, sans-serif";
338
+ ddsFontHeadingLarge: "400 1.5rem/1.35 'IBM Plex Sans', Arial, sans-serif";
339
+ ddsFontHeadingXlarge: "400 2rem/1.35 'IBM Plex Sans', Arial, sans-serif";
340
340
  ddsFontHeadingXxlarge: "300 clamp(2.5rem, 1.667rem + 2.222vw, 3rem)/1.2 'IBM Plex Sans', Arial, sans-serif";
341
341
  ddsFontLeadMedium: "300 1.125rem/1.5 'IBM Plex Sans', Arial, sans-serif";
342
342
  ddsFontCodeMedium: "400 1rem/1.5 'IBM Plex Mono', 'Courier New', monospace";
@@ -513,6 +513,9 @@ export declare const ddsTokens: {
513
513
  ddsZindexDropdown: "100";
514
514
  ddsZindexSticky: "50";
515
515
  ddsZindexAbsoluteElement: "1";
516
+ ddsColorData10Default: "#196b8f";
517
+ ddsColorData10Subtle: "#96c5d9";
518
+ ddsColorData10Border: "#196b8f";
516
519
  ddsColorDataRed100: "#f8d2d4";
517
520
  ddsColorDataRed200: "#f0a5a9";
518
521
  ddsColorDataRed300: "#e9787e";
@@ -603,11 +606,38 @@ export declare const ddsTokens: {
603
606
  ddsColorDataGray700: "#444444";
604
607
  ddsColorDataGray800: "#2e2e2e";
605
608
  ddsColorDataGray900: "#171717";
609
+ ddsColorData01Default: "#0f62fe";
610
+ ddsColorData01Subtle: "#9fc0ff";
611
+ ddsColorData01Border: "#0f62fe";
612
+ ddsColorData02Default: "#b3572f";
613
+ ddsColorData02Subtle: "#e1bcac";
614
+ ddsColorData02Border: "#b3572f";
615
+ ddsColorData03Default: "#727272";
616
+ ddsColorData03Subtle: "#c7c7c7";
617
+ ddsColorData03Border: "#727272";
618
+ ddsColorData04Default: "#198038";
619
+ ddsColorData04Subtle: "#a3ccaf";
620
+ ddsColorData04Border: "#198038";
621
+ ddsColorData05Default: "#8a3ffc";
622
+ ddsColorData05Subtle: "#d0b2fe";
623
+ ddsColorData05Border: "#8a3ffc";
624
+ ddsColorData06Default: "#b62665";
625
+ ddsColorData06Subtle: "#dfa5bf";
626
+ ddsColorData06Border: "#b62665";
627
+ ddsColorData07Default: "#7c7518";
628
+ ddsColorData07Subtle: "#cdc9a1";
629
+ ddsColorData07Border: "#7c7518";
630
+ ddsColorData08Default: "#da1e28";
631
+ ddsColorData08Subtle: "#f0a5a9";
632
+ ddsColorData08Border: "#da1e28";
633
+ ddsColorData09Default: "#007d79";
634
+ ddsColorData09Subtle: "#90ccc9";
635
+ ddsColorData09Border: "#007d79";
606
636
  ddsColorBgDefault: "#ffffff";
607
637
  ddsColorBgSubtle: "#f1f3f4";
608
638
  ddsColorSurfaceDefault: "#ffffff";
609
639
  ddsColorSurfaceSubtle: "#f1f3f4";
610
- ddsColorSurfaceMedium: "#e4e6e8";
640
+ ddsColorSurfaceMedium: "#e9ebec";
611
641
  ddsColorSurfaceHoverDefault: "#e7f1f7";
612
642
  ddsColorSurfaceHoverSubtle: "#f1f3f4";
613
643
  ddsColorSurfaceSelectedDefault: "#e7f1f7";
@@ -690,36 +720,6 @@ export declare const ddsTokens: {
690
720
  ddsColorBrandTertiaryStrong: "#d45d32";
691
721
  ddsColorFocusOutside: "#2a4b61";
692
722
  ddsColorFocusInside: "#f1f8fd";
693
- ddsColorData10Default: "#196b8f";
694
- ddsColorData10Subtle: "#96c5d9";
695
- ddsColorData10Border: "#196b8f";
696
- ddsColorData01Default: "#0f62fe";
697
- ddsColorData01Subtle: "#9fc0ff";
698
- ddsColorData01Border: "#0f62fe";
699
- ddsColorData02Default: "#b3572f";
700
- ddsColorData02Subtle: "#e1bcac";
701
- ddsColorData02Border: "#b3572f";
702
- ddsColorData03Default: "#727272";
703
- ddsColorData03Subtle: "#c7c7c7";
704
- ddsColorData03Border: "#727272";
705
- ddsColorData04Default: "#198038";
706
- ddsColorData04Subtle: "#a3ccaf";
707
- ddsColorData04Border: "#198038";
708
- ddsColorData05Default: "#8a3ffc";
709
- ddsColorData05Subtle: "#d0b2fe";
710
- ddsColorData05Border: "#8a3ffc";
711
- ddsColorData06Default: "#b62665";
712
- ddsColorData06Subtle: "#dfa5bf";
713
- ddsColorData06Border: "#b62665";
714
- ddsColorData07Default: "#7c7518";
715
- ddsColorData07Subtle: "#cdc9a1";
716
- ddsColorData07Border: "#7c7518";
717
- ddsColorData08Default: "#da1e28";
718
- ddsColorData08Subtle: "#f0a5a9";
719
- ddsColorData08Border: "#da1e28";
720
- ddsColorData09Default: "#007d79";
721
- ddsColorData09Subtle: "#90ccc9";
722
- ddsColorData09Border: "#007d79";
723
723
  ddsBorderRadiusButton: "2px";
724
724
  ddsBorderRadiusButtonNumberPx: 2;
725
725
  ddsBorderRadiusSurface: "2px";
@@ -739,7 +739,7 @@ export declare const ddsTokens: {
739
739
  ddsFontHeadingXsmall: "600 1.125rem/1.5 'IBM Plex Sans', Arial, sans-serif";
740
740
  ddsFontHeadingSmall: "600 1.25rem/1.5 'IBM Plex Sans', Arial, sans-serif";
741
741
  ddsFontHeadingMedium: "500 1.5rem/1.5 'IBM Plex Sans', Arial, sans-serif";
742
- ddsFontHeadingLarge: "400 clamp(1.5rem, 0.667rem + 2.222vw, 2rem)/1.35 'IBM Plex Sans', Arial, sans-serif";
742
+ ddsFontHeadingLarge: "400 2rem/1.35 'IBM Plex Sans', Arial, sans-serif";
743
743
  ddsFontHeadingXlarge: "300 clamp(2.5rem, 1.667rem + 2.222vw, 3rem)/1.35 'IBM Plex Sans', Arial, sans-serif";
744
744
  ddsFontHeadingXxlarge: "300 clamp(3rem, 1.333rem + 4.444vw, 4rem)/1.2 'IBM Plex Sans', Arial, sans-serif";
745
745
  ddsFontLeadMedium: "300 1.5rem/1.5 'IBM Plex Sans', Arial, sans-serif";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@norges-domstoler/dds-design-tokens",
3
- "version": "8.0.0",
3
+ "version": "8.0.2",
4
4
  "description": "Design tokens used in Domstolenes designsystem",
5
5
  "author": "DDS team",
6
6
  "license": "MIT",
@@ -38,7 +38,7 @@
38
38
  "devDependencies": {
39
39
  "@rollup/plugin-commonjs": "^28.0.3",
40
40
  "@rollup/plugin-node-resolve": "^16.0.1",
41
- "@types/node": "^22.14.1",
41
+ "@types/node": "^22.15.29",
42
42
  "@tokens-studio/sd-transforms": "^1.3.0",
43
43
  "fork-ts-checker-webpack-plugin": "^9.1.0",
44
44
  "rollup": "^3.29.5",
@@ -46,7 +46,7 @@
46
46
  "rollup-plugin-peer-deps-external": "^2.2.4",
47
47
  "rollup-plugin-sass": "^1.15.2",
48
48
  "rollup-plugin-typescript2": "^0.36.0",
49
- "style-dictionary": "^4.3.3",
49
+ "style-dictionary": "^4.4.0",
50
50
  "typescript": "^5.8.3"
51
51
  },
52
52
  "publishConfig": {