@rijkshuisstijl-community/design-tokens 5.0.0 → 6.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.
Files changed (105) hide show
  1. package/CHANGELOG.md +34 -0
  2. package/dist/_variables.scss +603 -668
  3. package/dist/index.css +603 -668
  4. package/dist/index.d.ts +690 -755
  5. package/dist/index.js +692 -757
  6. package/dist/index.json +691 -756
  7. package/dist/index.tokens.json +1715 -1802
  8. package/dist/koop/_variables.scss +38 -118
  9. package/dist/koop/index.css +38 -118
  10. package/dist/koop/index.d.ts +36 -116
  11. package/dist/koop/index.js +38 -118
  12. package/dist/koop/index.json +37 -117
  13. package/dist/koop/index.tokens.json +47 -159
  14. package/dist/koop/root.css +38 -118
  15. package/dist/koop/tokens.d.ts +46 -158
  16. package/dist/koop/tokens.js +2345 -4171
  17. package/dist/root.css +603 -668
  18. package/dist/tokens.d.ts +1614 -1701
  19. package/dist/tokens.js +24567 -26048
  20. package/dist/uitvoerend-groen/_variables.scss +28 -108
  21. package/dist/uitvoerend-groen/index.css +28 -108
  22. package/dist/uitvoerend-groen/index.d.ts +26 -106
  23. package/dist/uitvoerend-groen/index.js +28 -108
  24. package/dist/uitvoerend-groen/index.json +27 -107
  25. package/dist/uitvoerend-groen/index.tokens.json +35 -147
  26. package/dist/uitvoerend-groen/root.css +28 -108
  27. package/dist/uitvoerend-groen/tokens.d.ts +34 -146
  28. package/dist/uitvoerend-groen/tokens.js +1240 -3066
  29. package/dist/uitvoerend-hemelblauw/_variables.scss +28 -108
  30. package/dist/uitvoerend-hemelblauw/index.css +28 -108
  31. package/dist/uitvoerend-hemelblauw/index.d.ts +26 -106
  32. package/dist/uitvoerend-hemelblauw/index.js +28 -108
  33. package/dist/uitvoerend-hemelblauw/index.json +27 -107
  34. package/dist/uitvoerend-hemelblauw/index.tokens.json +35 -147
  35. package/dist/uitvoerend-hemelblauw/root.css +28 -108
  36. package/dist/uitvoerend-hemelblauw/tokens.d.ts +34 -146
  37. package/dist/uitvoerend-hemelblauw/tokens.js +1240 -3066
  38. package/dist/uitvoerend-mintgroen/_variables.scss +28 -108
  39. package/dist/uitvoerend-mintgroen/index.css +28 -108
  40. package/dist/uitvoerend-mintgroen/index.d.ts +26 -106
  41. package/dist/uitvoerend-mintgroen/index.js +28 -108
  42. package/dist/uitvoerend-mintgroen/index.json +27 -107
  43. package/dist/uitvoerend-mintgroen/index.tokens.json +35 -147
  44. package/dist/uitvoerend-mintgroen/root.css +28 -108
  45. package/dist/uitvoerend-mintgroen/tokens.d.ts +34 -146
  46. package/dist/uitvoerend-mintgroen/tokens.js +1240 -3066
  47. package/dist/uitvoerend-oranje/_variables.scss +51 -131
  48. package/dist/uitvoerend-oranje/index.css +51 -131
  49. package/dist/uitvoerend-oranje/index.d.ts +49 -129
  50. package/dist/uitvoerend-oranje/index.js +51 -131
  51. package/dist/uitvoerend-oranje/index.json +50 -130
  52. package/dist/uitvoerend-oranje/index.tokens.json +69 -181
  53. package/dist/uitvoerend-oranje/root.css +51 -131
  54. package/dist/uitvoerend-oranje/tokens.d.ts +65 -177
  55. package/dist/uitvoerend-oranje/tokens.js +1856 -3682
  56. package/dist/uitvoerend-paars/_variables.scss +28 -108
  57. package/dist/uitvoerend-paars/index.css +28 -108
  58. package/dist/uitvoerend-paars/index.d.ts +26 -106
  59. package/dist/uitvoerend-paars/index.js +28 -108
  60. package/dist/uitvoerend-paars/index.json +27 -107
  61. package/dist/uitvoerend-paars/index.tokens.json +35 -147
  62. package/dist/uitvoerend-paars/root.css +28 -108
  63. package/dist/uitvoerend-paars/tokens.d.ts +34 -146
  64. package/dist/uitvoerend-paars/tokens.js +1240 -3066
  65. package/dist/uitvoerend-violet/_variables.scss +28 -108
  66. package/dist/uitvoerend-violet/index.css +28 -108
  67. package/dist/uitvoerend-violet/index.d.ts +26 -106
  68. package/dist/uitvoerend-violet/index.js +28 -108
  69. package/dist/uitvoerend-violet/index.json +27 -107
  70. package/dist/uitvoerend-violet/index.tokens.json +35 -147
  71. package/dist/uitvoerend-violet/root.css +28 -108
  72. package/dist/uitvoerend-violet/tokens.d.ts +34 -146
  73. package/dist/uitvoerend-violet/tokens.js +1240 -3066
  74. package/dist/uitvoerend-violet-oud/_variables.scss +83 -163
  75. package/dist/uitvoerend-violet-oud/index.css +83 -163
  76. package/dist/uitvoerend-violet-oud/index.d.ts +81 -161
  77. package/dist/uitvoerend-violet-oud/index.js +83 -163
  78. package/dist/uitvoerend-violet-oud/index.json +82 -162
  79. package/dist/uitvoerend-violet-oud/index.tokens.json +102 -214
  80. package/dist/uitvoerend-violet-oud/root.css +83 -163
  81. package/dist/uitvoerend-violet-oud/tokens.d.ts +100 -212
  82. package/dist/uitvoerend-violet-oud/tokens.js +3009 -4835
  83. package/dist/wetgevend/_variables.scss +28 -108
  84. package/dist/wetgevend/index.css +28 -108
  85. package/dist/wetgevend/index.d.ts +26 -106
  86. package/dist/wetgevend/index.js +28 -108
  87. package/dist/wetgevend/index.json +27 -107
  88. package/dist/wetgevend/index.tokens.json +35 -147
  89. package/dist/wetgevend/root.css +28 -108
  90. package/dist/wetgevend/tokens.d.ts +34 -146
  91. package/dist/wetgevend/tokens.js +1240 -3066
  92. package/figma/figma.tokens.json +872 -934
  93. package/package.json +1 -1
  94. package/src/generated/base.tokens.json +4916 -5198
  95. package/src/generated/koop/tokens.json +167 -519
  96. package/src/generated/themes.json +1379 -4547
  97. package/src/generated/uitvoerend-groen/tokens.json +124 -476
  98. package/src/generated/uitvoerend-hemelblauw/tokens.json +124 -476
  99. package/src/generated/uitvoerend-mintgroen/tokens.json +124 -476
  100. package/src/generated/uitvoerend-oranje/tokens.json +196 -548
  101. package/src/generated/uitvoerend-paars/tokens.json +124 -476
  102. package/src/generated/uitvoerend-violet/tokens.json +124 -476
  103. package/src/generated/uitvoerend-violet-oud/tokens.json +434 -786
  104. package/src/generated/wetgevend/tokens.json +124 -476
  105. package/token-transformer.mjs +1 -1
package/dist/uitvoerend-violet-oud/tokens.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Fri, 22 Aug 2025 10:20:30 GMT
3
+ * Generated on Fri, 05 Sep 2025 09:25:14 GMT
4
4
  */
5
5
 
6
6
  export default tokens;
@@ -393,21 +393,6 @@ declare const tokens: {
393
393
  "color": DesignToken
394
394
  }
395
395
  },
396
- "number-badge": {
397
- "line-height": DesignToken,
398
- "background-color": DesignToken,
399
- "border-color": DesignToken,
400
- "border-radius": DesignToken,
401
- "border-width": DesignToken,
402
- "color": DesignToken,
403
- "font-family": DesignToken,
404
- "font-size": DesignToken,
405
- "font-weight": DesignToken,
406
- "min-block-size": DesignToken,
407
- "min-inline-size": DesignToken,
408
- "padding-block": DesignToken,
409
- "padding-inline": DesignToken
410
- },
411
396
  "figure": {
412
397
  "caption": {
413
398
  "border-color": DesignToken,
@@ -426,18 +411,92 @@ declare const tokens: {
426
411
  "border-start-start-radius": DesignToken
427
412
  }
428
413
  },
429
- "alert": {
430
- "heading": {
414
+ "number-badge": {
415
+ "background-color": DesignToken,
416
+ "border-color": DesignToken,
417
+ "border-radius": DesignToken,
418
+ "border-width": DesignToken,
419
+ "color": DesignToken,
420
+ "font-family": DesignToken,
421
+ "font-size": DesignToken,
422
+ "font-weight": DesignToken,
423
+ "min-block-size": DesignToken,
424
+ "min-inline-size": DesignToken,
425
+ "padding-block": DesignToken,
426
+ "padding-inline": DesignToken
427
+ },
428
+ "blockquote": {
429
+ "border-block-end-width": DesignToken,
430
+ "border-block-start-width": DesignToken,
431
+ "border-end-end-radius": DesignToken,
432
+ "border-end-start-radius": DesignToken,
433
+ "border-inline-end-width": DesignToken,
434
+ "border-start-end-radius": DesignToken,
435
+ "border-start-start-radius": DesignToken,
436
+ "margin-block-end": DesignToken,
437
+ "margin-block-start": DesignToken,
438
+ "margin-inline-end": DesignToken,
439
+ "margin-inline-start": DesignToken,
440
+ "blue-corner-border-variation": {
441
+ "border-block-end-width": DesignToken,
442
+ "border-color": DesignToken,
443
+ "border-end-end-radius": DesignToken,
444
+ "border-inline-end-width": DesignToken
445
+ },
446
+ "caption": {
447
+ "color": DesignToken,
431
448
  "font-family": DesignToken,
432
449
  "font-size": DesignToken,
433
450
  "font-weight": DesignToken,
434
- "line-height": DesignToken
451
+ "line-height": DesignToken,
452
+ "padding-block-start": DesignToken
435
453
  },
436
- "message": {
437
- "column-gap": DesignToken,
454
+ "content": {
455
+ "font-family": DesignToken,
456
+ "font-weight": DesignToken,
438
457
  "line-height": DesignToken,
439
- "row-gap": DesignToken
458
+ "color": DesignToken,
459
+ "font-size": DesignToken
460
+ },
461
+ "pink-background-variation": {
462
+ "background-color": DesignToken,
463
+ "border-end-start-radius": DesignToken,
464
+ "padding": DesignToken
465
+ },
466
+ "pink-corner-border-variation": {
467
+ "border-block-start-width": DesignToken,
468
+ "border-color": DesignToken,
469
+ "border-inline-start-width": DesignToken,
470
+ "border-start-start-radius": DesignToken,
471
+ "padding": DesignToken
472
+ },
473
+ "pink-left-border-variation": {
474
+ "border-color": DesignToken,
475
+ "border-inline-start-width": DesignToken,
476
+ "padding-block-end": DesignToken,
477
+ "padding-block-start": DesignToken,
478
+ "padding-inline-end": DesignToken,
479
+ "padding-inline-start": DesignToken
440
480
  },
481
+ "background-color": DesignToken,
482
+ "border-inline-start-width": DesignToken,
483
+ "border-color": DesignToken,
484
+ "border-radius": DesignToken,
485
+ "border-width": DesignToken,
486
+ "color": DesignToken,
487
+ "font-size": DesignToken,
488
+ "font-family": DesignToken,
489
+ "padding-block-end": DesignToken,
490
+ "padding-block-start": DesignToken,
491
+ "padding-inline-end": DesignToken,
492
+ "padding-inline-start": DesignToken,
493
+ "row-gap": DesignToken,
494
+ "attribution": {
495
+ "color": DesignToken,
496
+ "font-size": DesignToken
497
+ }
498
+ },
499
+ "alert": {
441
500
  "background-color": DesignToken,
442
501
  "border-color": DesignToken,
443
502
  "border-radius": DesignToken,
@@ -463,6 +522,9 @@ declare const tokens: {
463
522
  "border-color": DesignToken,
464
523
  "color": DesignToken
465
524
  },
525
+ "message": {
526
+ "row-gap": DesignToken
527
+ },
466
528
  "ok": {
467
529
  "background-color": DesignToken,
468
530
  "border-color": DesignToken,
@@ -492,18 +554,18 @@ declare const tokens: {
492
554
  }
493
555
  },
494
556
  "accordion": {
557
+ "margin-block-end": DesignToken,
558
+ "margin-block-start": DesignToken,
559
+ "row-gap": DesignToken,
560
+ "panel": {
561
+ "border-color": DesignToken,
562
+ "border-width": DesignToken,
563
+ "padding-block-end": DesignToken,
564
+ "padding-block-start": DesignToken,
565
+ "padding-inline-end": DesignToken,
566
+ "padding-inline-start": DesignToken
567
+ },
495
568
  "button": {
496
- "active": {
497
- "row-gap": DesignToken,
498
- "background-color": DesignToken,
499
- "border-color": DesignToken,
500
- "color": DesignToken
501
- },
502
- "focus": {
503
- "background-color": DesignToken,
504
- "border-color": DesignToken,
505
- "color": DesignToken
506
- },
507
569
  "background-color": DesignToken,
508
570
  "border-color": DesignToken,
509
571
  "border-radius": DesignToken,
@@ -517,6 +579,11 @@ declare const tokens: {
517
579
  "icon": {
518
580
  "size": DesignToken
519
581
  },
582
+ "active": {
583
+ "background-color": DesignToken,
584
+ "border-color": DesignToken,
585
+ "color": DesignToken
586
+ },
520
587
  "hover": {
521
588
  "background-color": DesignToken,
522
589
  "border-color": DesignToken,
@@ -529,17 +596,6 @@ declare const tokens: {
529
596
  "color": DesignToken
530
597
  }
531
598
  },
532
- "margin-block-end": DesignToken,
533
- "margin-block-start": DesignToken,
534
- "row-gap": DesignToken,
535
- "panel": {
536
- "border-color": DesignToken,
537
- "border-width": DesignToken,
538
- "padding-block-end": DesignToken,
539
- "padding-block-start": DesignToken,
540
- "padding-inline-end": DesignToken,
541
- "padding-inline-start": DesignToken
542
- },
543
599
  "section": {
544
600
  "border-color": DesignToken,
545
601
  "hover": {
@@ -550,114 +606,6 @@ declare const tokens: {
550
606
  "margin-block-start": DesignToken
551
607
  }
552
608
  },
553
- "blockquote": {
554
- "border-block-end-width": DesignToken,
555
- "border-block-start-width": DesignToken,
556
- "border-end-end-radius": DesignToken,
557
- "border-end-start-radius": DesignToken,
558
- "border-inline-end-width": DesignToken,
559
- "border-start-end-radius": DesignToken,
560
- "border-start-start-radius": DesignToken,
561
- "margin-block-end": DesignToken,
562
- "margin-block-start": DesignToken,
563
- "margin-inline-end": DesignToken,
564
- "margin-inline-start": DesignToken,
565
- "blue-corner-border-variation": {
566
- "border-block-end-width": DesignToken,
567
- "border-color": DesignToken,
568
- "border-end-end-radius": DesignToken,
569
- "border-inline-end-width": DesignToken
570
- },
571
- "caption": {
572
- "color": DesignToken,
573
- "font-family": DesignToken,
574
- "font-size": DesignToken,
575
- "font-weight": DesignToken,
576
- "line-height": DesignToken,
577
- "padding-block-start": DesignToken
578
- },
579
- "content": {
580
- "font-family": DesignToken,
581
- "font-weight": DesignToken,
582
- "line-height": DesignToken,
583
- "color": DesignToken,
584
- "font-size": DesignToken
585
- },
586
- "pink-background-variation": {
587
- "background-color": DesignToken,
588
- "border-end-start-radius": DesignToken,
589
- "padding": DesignToken
590
- },
591
- "pink-corner-border-variation": {
592
- "border-block-start-width": DesignToken,
593
- "border-color": DesignToken,
594
- "border-inline-start-width": DesignToken,
595
- "border-start-start-radius": DesignToken,
596
- "padding": DesignToken
597
- },
598
- "pink-left-border-variation": {
599
- "border-color": DesignToken,
600
- "border-inline-start-width": DesignToken,
601
- "padding-block-end": DesignToken,
602
- "padding-block-start": DesignToken,
603
- "padding-inline-end": DesignToken,
604
- "padding-inline-start": DesignToken
605
- },
606
- "background-color": DesignToken,
607
- "border-inline-start-width": DesignToken,
608
- "border-color": DesignToken,
609
- "border-radius": DesignToken,
610
- "border-width": DesignToken,
611
- "color": DesignToken,
612
- "font-size": DesignToken,
613
- "font-family": DesignToken,
614
- "padding-block-end": DesignToken,
615
- "padding-block-start": DesignToken,
616
- "padding-inline-end": DesignToken,
617
- "padding-inline-start": DesignToken,
618
- "row-gap": DesignToken,
619
- "attribution": {
620
- "color": DesignToken,
621
- "font-size": DesignToken
622
- }
623
- },
624
- "skip-link": {
625
- "focus": {
626
- "text-decoration": DesignToken,
627
- "border-color": DesignToken,
628
- "border-width": DesignToken,
629
- "border-style": DesignToken,
630
- "background-color": DesignToken,
631
- "color": DesignToken
632
- },
633
- "border-color": DesignToken,
634
- "box-block-end-shadow": {
635
- "color": DesignToken,
636
- "blur-radius": DesignToken,
637
- "offset-x": DesignToken,
638
- "offset-y": DesignToken,
639
- "spread-radius": DesignToken
640
- },
641
- "focus-visible": {
642
- "outline-color": DesignToken,
643
- "text-decoration": DesignToken
644
- },
645
- "font-family": DesignToken,
646
- "font-weight": DesignToken,
647
- "line-height": DesignToken,
648
- "border-width": DesignToken,
649
- "text-underline-offset": DesignToken,
650
- "font-size": DesignToken,
651
- "background-color": DesignToken,
652
- "color": DesignToken,
653
- "min-block-size": DesignToken,
654
- "min-inline-size": DesignToken,
655
- "padding-block-end": DesignToken,
656
- "padding-block-start": DesignToken,
657
- "padding-inline-end": DesignToken,
658
- "padding-inline-start": DesignToken,
659
- "text-decoration": DesignToken
660
- },
661
609
  "data-badge": {
662
610
  "background-color": DesignToken,
663
611
  "border-radius": DesignToken,
@@ -1230,14 +1178,10 @@ declare const tokens: {
1230
1178
  "text-decoration": DesignToken
1231
1179
  }
1232
1180
  }
1233
- },
1234
- "skip-link": {
1235
- "font-weight": DesignToken
1236
1181
  }
1237
1182
  },
1238
1183
  "nl": {
1239
1184
  "number-badge": {
1240
- "line-height": DesignToken,
1241
1185
  "background-color": DesignToken,
1242
1186
  "border-color": DesignToken,
1243
1187
  "border-radius": DesignToken,
@@ -1252,33 +1196,6 @@ declare const tokens: {
1252
1196
  "padding-inline": DesignToken
1253
1197
  },
1254
1198
  "skip-link": {
1255
- "border-color": DesignToken,
1256
- "border-width": DesignToken,
1257
- "font-family": DesignToken,
1258
- "font-weight": DesignToken,
1259
- "padding-block-end": DesignToken,
1260
- "padding-block-start": DesignToken,
1261
- "padding-inline-end": DesignToken,
1262
- "padding-inline-start": DesignToken,
1263
- "box-block-end-shadow": {
1264
- "blur-radius": DesignToken,
1265
- "color": DesignToken,
1266
- "offset-x": DesignToken,
1267
- "offset-y": DesignToken,
1268
- "spread-radius": DesignToken
1269
- },
1270
- "focus": {
1271
- "background-color": DesignToken,
1272
- "border-color": DesignToken,
1273
- "border-style": DesignToken,
1274
- "border-width": DesignToken,
1275
- "color": DesignToken,
1276
- "text-decoration": DesignToken
1277
- },
1278
- "focus-visible": {
1279
- "outline-color": DesignToken
1280
- },
1281
- "text-decoration": DesignToken,
1282
1199
  "background-color": DesignToken,
1283
1200
  "color": DesignToken,
1284
1201
  "padding-block": DesignToken,
@@ -1386,35 +1303,6 @@ declare const tokens: {
1386
1303
  }
1387
1304
  },
1388
1305
  "rhc": {
1389
- "accordion": {
1390
- "border-radius": DesignToken,
1391
- "color": DesignToken,
1392
- "header": {
1393
- "margin": DesignToken
1394
- },
1395
- "section": {
1396
- "border-block-end-width": DesignToken,
1397
- "border-color": DesignToken,
1398
- "border-width": DesignToken
1399
- },
1400
- "button": {
1401
- "padding-block-end": DesignToken,
1402
- "padding-block-start": DesignToken,
1403
- "padding-inline-end": DesignToken,
1404
- "padding-inline-start": DesignToken,
1405
- "expanded": {
1406
- "background-color": DesignToken,
1407
- "color": DesignToken
1408
- },
1409
- "icon": {
1410
- "margin-block": DesignToken
1411
- },
1412
- "font-family": DesignToken,
1413
- "font-weight": DesignToken,
1414
- "font-size": DesignToken,
1415
- "line-height": DesignToken
1416
- }
1417
- },
1418
1306
  "keep": {
1419
1307
  "_comment": DesignToken,
1420
1308
  "top-left": {