@rijkshuisstijl-community/design-tokens 1.0.1 → 1.1.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 (54) hide show
  1. package/CHANGELOG.md +10 -0
  2. package/dist/_variables.scss +113 -3
  3. package/dist/index.css +113 -3
  4. package/dist/index.d.ts +111 -1
  5. package/dist/index.js +113 -3
  6. package/dist/index.json +112 -2
  7. package/dist/index.tokens.json +148 -2
  8. package/dist/root.css +113 -3
  9. package/dist/tokens.d.ts +147 -1
  10. package/dist/tokens.js +6283 -3879
  11. package/dist/uitvoerend-mintgroen-focus/_variables.scss +112 -3
  12. package/dist/uitvoerend-mintgroen-focus/index.css +112 -3
  13. package/dist/uitvoerend-mintgroen-focus/index.d.ts +110 -1
  14. package/dist/uitvoerend-mintgroen-focus/index.js +112 -3
  15. package/dist/uitvoerend-mintgroen-focus/index.json +111 -2
  16. package/dist/uitvoerend-mintgroen-focus/index.tokens.json +145 -4
  17. package/dist/uitvoerend-mintgroen-focus/root.css +112 -3
  18. package/dist/uitvoerend-mintgroen-focus/tokens.d.ts +144 -3
  19. package/dist/uitvoerend-mintgroen-focus/tokens.js +6405 -4028
  20. package/dist/uitvoerend-violet/_variables.scss +113 -3
  21. package/dist/uitvoerend-violet/index.css +113 -3
  22. package/dist/uitvoerend-violet/index.d.ts +111 -1
  23. package/dist/uitvoerend-violet/index.js +113 -3
  24. package/dist/uitvoerend-violet/index.json +112 -2
  25. package/dist/uitvoerend-violet/index.tokens.json +148 -2
  26. package/dist/uitvoerend-violet/root.css +113 -3
  27. package/dist/uitvoerend-violet/tokens.d.ts +147 -1
  28. package/dist/uitvoerend-violet/tokens.js +5182 -2778
  29. package/dist/uitvoerend-violet-oud/_variables.scss +113 -3
  30. package/dist/uitvoerend-violet-oud/index.css +113 -3
  31. package/dist/uitvoerend-violet-oud/index.d.ts +111 -1
  32. package/dist/uitvoerend-violet-oud/index.js +113 -3
  33. package/dist/uitvoerend-violet-oud/index.json +112 -2
  34. package/dist/uitvoerend-violet-oud/index.tokens.json +148 -2
  35. package/dist/uitvoerend-violet-oud/root.css +113 -3
  36. package/dist/uitvoerend-violet-oud/tokens.d.ts +147 -1
  37. package/dist/uitvoerend-violet-oud/tokens.js +5182 -2778
  38. package/dist/wetgevend/_variables.scss +113 -3
  39. package/dist/wetgevend/index.css +113 -3
  40. package/dist/wetgevend/index.d.ts +111 -1
  41. package/dist/wetgevend/index.js +113 -3
  42. package/dist/wetgevend/index.json +112 -2
  43. package/dist/wetgevend/index.tokens.json +148 -2
  44. package/dist/wetgevend/root.css +113 -3
  45. package/dist/wetgevend/tokens.d.ts +147 -1
  46. package/dist/wetgevend/tokens.js +5182 -2778
  47. package/figma/figma.tokens.json +554 -33
  48. package/package.json +1 -1
  49. package/src/generated/base.tokens.json +487 -11
  50. package/src/generated/themes.json +2216 -320
  51. package/src/generated/uitvoerend-mintgroen-focus/tokens.json +479 -11
  52. package/src/generated/uitvoerend-violet/tokens.json +487 -11
  53. package/src/generated/uitvoerend-violet-oud/tokens.json +487 -11
  54. package/src/generated/wetgevend/tokens.json +487 -11
@@ -602,6 +602,126 @@
602
602
  "type": "fontSizes"
603
603
  }
604
604
  },
605
+ "skip-link": {
606
+ "font-weight": {
607
+ "value": 700,
608
+ "type": "fontWeights"
609
+ },
610
+ "font-family": {
611
+ "value": "Fira Sans, Arial, Verdana, sans-serif",
612
+ "type": "fontFamilies"
613
+ },
614
+ "font-size": {
615
+ "value": "1.25rem",
616
+ "type": "fontSizes"
617
+ },
618
+ "line-height": {
619
+ "value": "150%",
620
+ "type": "lineHeights"
621
+ },
622
+ "min-block-size": {
623
+ "value": "48px",
624
+ "type": "sizing"
625
+ },
626
+ "min-inline-size": {
627
+ "value": "48px",
628
+ "type": "sizing"
629
+ },
630
+ "padding-block-end": {
631
+ "value": "0.75rem",
632
+ "type": "spacing"
633
+ },
634
+ "padding-block-start": {
635
+ "value": "0.75rem",
636
+ "type": "spacing"
637
+ },
638
+ "padding-inline-end": {
639
+ "value": "1rem",
640
+ "type": "spacing"
641
+ },
642
+ "padding-inline-start": {
643
+ "value": "1rem",
644
+ "type": "spacing"
645
+ },
646
+ "focus": {
647
+ "background-color": {
648
+ "value": "#fff",
649
+ "type": "color"
650
+ },
651
+ "border-color": {
652
+ "value": "#154273",
653
+ "type": "color"
654
+ },
655
+ "border-style": {
656
+ "value": "solid",
657
+ "type": "borderStyle"
658
+ },
659
+ "border-width": {
660
+ "value": "2px",
661
+ "type": "borderWidth"
662
+ },
663
+ "color": {
664
+ "value": "#0F172A",
665
+ "type": "color"
666
+ },
667
+ "text-decoration": {
668
+ "value": "None",
669
+ "type": "textDecoration"
670
+ }
671
+ },
672
+ "focus-visible": {
673
+ "outline-color": {
674
+ "value": "#000",
675
+ "type": "color"
676
+ }
677
+ },
678
+ "background-color": {
679
+ "value": "#154273",
680
+ "type": "color"
681
+ },
682
+ "border-color": {
683
+ "value": "transparent",
684
+ "type": "color"
685
+ },
686
+ "color": {
687
+ "value": "#fff",
688
+ "type": "color"
689
+ },
690
+ "border-width": {
691
+ "value": "2px",
692
+ "type": "borderWidth"
693
+ },
694
+ "box-block-end-shadow": {
695
+ "offset-x": {
696
+ "value": 0,
697
+ "type": "other"
698
+ },
699
+ "offset-y": {
700
+ "value": "16px",
701
+ "type": "other"
702
+ },
703
+ "blur-radius": {
704
+ "value": "48px",
705
+ "type": "other"
706
+ },
707
+ "spread-radius": {
708
+ "value": 0,
709
+ "type": "other"
710
+ },
711
+ "color": {
712
+ "value": "#0000001a",
713
+ "type": "color"
714
+ }
715
+ },
716
+ "text-decoration": {
717
+ "value": "underline",
718
+ "type": "textDecoration"
719
+ },
720
+ "text-underline-offset": {
721
+ "value": "0.125rem",
722
+ "type": "other"
723
+ }
724
+ },
605
725
  "separator": {
606
726
  "color": {
607
727
  "value": "#CBD5E1",
@@ -944,6 +1064,54 @@
944
1064
  "type": "borderWidth"
945
1065
  }
946
1066
  },
1067
+ "paragraph": {
1068
+ "color": {
1069
+ "value": "#0F172A",
1070
+ "type": "color"
1071
+ },
1072
+ "font-family": {
1073
+ "value": "Fira Sans, Arial, Verdana, sans-serif",
1074
+ "type": "fontFamilies"
1075
+ },
1076
+ "font-size": {
1077
+ "value": "1.25rem",
1078
+ "type": "fontSizes"
1079
+ },
1080
+ "font-weight": {
1081
+ "value": 400,
1082
+ "type": "fontWeights"
1083
+ },
1084
+ "line-height": {
1085
+ "value": "150%",
1086
+ "type": "lineHeights"
1087
+ },
1088
+ "margin-block-end": {
1089
+ "value": 0,
1090
+ "type": "spacing"
1091
+ },
1092
+ "margin-block-start": {
1093
+ "value": 0,
1094
+ "type": "spacing"
1095
+ },
1096
+ "lead": {
1097
+ "color": {
1098
+ "value": "#0F172A",
1099
+ "type": "color"
1100
+ },
1101
+ "font-size": {
1102
+ "value": "1.5rem",
1103
+ "type": "fontSizes"
1104
+ },
1105
+ "font-weight": {
1106
+ "value": 400,
1107
+ "type": "fontWeights"
1108
+ },
1109
+ "line-height": {
1110
+ "value": "150%",
1111
+ "type": "lineHeights"
1112
+ }
1113
+ }
1114
+ },
947
1115
  "ordered-list": {
948
1116
  "padding-inline-start": {
949
1117
  "value": "1.5rem",
@@ -1069,15 +1237,6 @@
1069
1237
  },
1070
1238
  "hover": {
1071
1239
  "color": {
1072
- "$extensions": {
1073
- "studio.tokens": {
1074
- "modify": {
1075
- "type": "darken",
1076
- "value": "0.3",
1077
- "space": "srgb"
1078
- }
1079
- }
1080
- },
1081
1240
  "value": "#01496c",
1082
1241
  "type": "color"
1083
1242
  },
@@ -1139,6 +1298,156 @@
1139
1298
  "type": "lineHeights"
1140
1299
  }
1141
1300
  },
1301
+ "heading-1": {
1302
+ "color": {
1303
+ "value": "#154273",
1304
+ "type": "color"
1305
+ },
1306
+ "font-family": {
1307
+ "value": "Fira Sans, Arial, Verdana, sans-serif",
1308
+ "type": "fontFamilies"
1309
+ },
1310
+ "font-weight": {
1311
+ "value": 700,
1312
+ "type": "fontWeights"
1313
+ },
1314
+ "line-height": {
1315
+ "value": "125%",
1316
+ "type": "lineHeights"
1317
+ },
1318
+ "font-size": {
1319
+ "value": "3.125rem",
1320
+ "type": "fontSizes"
1321
+ },
1322
+ "margin-block-end": {
1323
+ "value": 0,
1324
+ "type": "spacing"
1325
+ },
1326
+ "margin-block-start": {
1327
+ "value": 0,
1328
+ "type": "spacing"
1329
+ }
1330
+ },
1331
+ "heading-2": {
1332
+ "color": {
1333
+ "value": "#154273",
1334
+ "type": "color"
1335
+ },
1336
+ "font-family": {
1337
+ "value": "Fira Sans, Arial, Verdana, sans-serif",
1338
+ "type": "fontFamilies"
1339
+ },
1340
+ "font-weight": {
1341
+ "value": 700,
1342
+ "type": "fontWeights"
1343
+ },
1344
+ "line-height": {
1345
+ "value": "125%",
1346
+ "type": "lineHeights"
1347
+ },
1348
+ "font-size": {
1349
+ "value": "2.5rem",
1350
+ "type": "fontSizes"
1351
+ },
1352
+ "margin-block-end": {
1353
+ "value": 0,
1354
+ "type": "spacing"
1355
+ },
1356
+ "margin-block-start": {
1357
+ "value": 0,
1358
+ "type": "spacing"
1359
+ }
1360
+ },
1361
+ "heading-3": {
1362
+ "color": {
1363
+ "value": "#154273",
1364
+ "type": "color"
1365
+ },
1366
+ "font-family": {
1367
+ "value": "Fira Sans, Arial, Verdana, sans-serif",
1368
+ "type": "fontFamilies"
1369
+ },
1370
+ "font-weight": {
1371
+ "value": 700,
1372
+ "type": "fontWeights"
1373
+ },
1374
+ "line-height": {
1375
+ "value": "125%",
1376
+ "type": "lineHeights"
1377
+ },
1378
+ "font-size": {
1379
+ "value": "1.875rem",
1380
+ "type": "fontSizes"
1381
+ },
1382
+ "margin-block-end": {
1383
+ "value": 0,
1384
+ "type": "spacing"
1385
+ },
1386
+ "margin-block-start": {
1387
+ "value": 0,
1388
+ "type": "spacing"
1389
+ }
1390
+ },
1391
+ "heading-4": {
1392
+ "color": {
1393
+ "value": "#154273",
1394
+ "type": "color"
1395
+ },
1396
+ "font-family": {
1397
+ "value": "Fira Sans, Arial, Verdana, sans-serif",
1398
+ "type": "fontFamilies"
1399
+ },
1400
+ "font-weight": {
1401
+ "value": 700,
1402
+ "type": "fontWeights"
1403
+ },
1404
+ "line-height": {
1405
+ "value": "125%",
1406
+ "type": "lineHeights"
1407
+ },
1408
+ "font-size": {
1409
+ "value": "1.5rem",
1410
+ "type": "fontSizes"
1411
+ },
1412
+ "margin-block-end": {
1413
+ "value": 0,
1414
+ "type": "spacing"
1415
+ },
1416
+ "margin-block-start": {
1417
+ "value": 0,
1418
+ "type": "spacing"
1419
+ }
1420
+ },
1421
+ "heading-5": {
1422
+ "color": {
1423
+ "value": "#154273",
1424
+ "type": "color"
1425
+ },
1426
+ "font-family": {
1427
+ "value": "Fira Sans, Arial, Verdana, sans-serif",
1428
+ "type": "fontFamilies"
1429
+ },
1430
+ "font-weight": {
1431
+ "value": 700,
1432
+ "type": "fontWeights"
1433
+ },
1434
+ "line-height": {
1435
+ "value": "125%",
1436
+ "type": "lineHeights"
1437
+ },
1438
+ "font-size": {
1439
+ "value": "1.25rem",
1440
+ "type": "fontSizes"
1441
+ },
1442
+ "margin-block-end": {
1443
+ "value": 0,
1444
+ "type": "spacing"
1445
+ },
1446
+ "margin-block-start": {
1447
+ "value": 0,
1448
+ "type": "spacing"
1449
+ }
1450
+ },
1142
1451
  "form-label": {
1143
1452
  "color": {
1144
1453
  "value": "#0F172A",
@@ -1414,6 +1723,60 @@
1414
1723
  }
1415
1724
  }
1416
1725
  },
1726
+ "number-badge": {
1727
+ "font-size": {
1728
+ "value": "1.25rem",
1729
+ "type": "fontSizes"
1730
+ },
1731
+ "line-height": {
1732
+ "value": "150%",
1733
+ "type": "lineHeights"
1734
+ },
1735
+ "min-block-size": {
1736
+ "value": "24px",
1737
+ "type": "sizing"
1738
+ },
1739
+ "min-inline-size": {
1740
+ "value": "24px",
1741
+ "type": "sizing"
1742
+ },
1743
+ "font-weight": {
1744
+ "value": 700,
1745
+ "type": "fontWeights"
1746
+ },
1747
+ "border-width": {
1748
+ "value": "0px",
1749
+ "type": "borderWidth"
1750
+ },
1751
+ "border-radius": {
1752
+ "value": "999px",
1753
+ "type": "borderRadius"
1754
+ },
1755
+ "font-family": {
1756
+ "value": "Fira Sans, Arial, Verdana, sans-serif",
1757
+ "type": "fontFamilies"
1758
+ },
1759
+ "background-color": {
1760
+ "value": "#154273",
1761
+ "type": "color"
1762
+ },
1763
+ "border-color": {
1764
+ "value": "transparent",
1765
+ "type": "color"
1766
+ },
1767
+ "color": {
1768
+ "value": "#fff",
1769
+ "type": "color"
1770
+ },
1771
+ "padding-inline": {
1772
+ "value": "0.5rem",
1773
+ "type": "spacing"
1774
+ },
1775
+ "padding-block": {
1776
+ "value": "0.5rem",
1777
+ "type": "spacing"
1778
+ }
1779
+ },
1417
1780
  "checkbox": {
1418
1781
  "border-radius": {
1419
1782
  "value": "2.5px",
@@ -3849,7 +4212,7 @@
3849
4212
  },
3850
4213
  "icon": {
3851
4214
  "color": {
3852
- "value": "#0F172A",
4215
+ "value": "#154273",
3853
4216
  "type": "color"
3854
4217
  },
3855
4218
  "size": {
@@ -3887,7 +4250,7 @@
3887
4250
  },
3888
4251
  "metadata": {
3889
4252
  "color": {
3890
- "value": "#0F172A",
4253
+ "value": "#334155",
3891
4254
  "type": "color"
3892
4255
  }
3893
4256
  },
@@ -3960,6 +4323,10 @@
3960
4323
  }
3961
4324
  },
3962
4325
  "heading": {
4326
+ "color": {
4327
+ "value": "#154273",
4328
+ "type": "color"
4329
+ },
3963
4330
  "padding-block-start": {
3964
4331
  "value": "0.5rem",
3965
4332
  "type": "spacing"
@@ -5386,6 +5753,115 @@
5386
5753
  }
5387
5754
  }
5388
5755
  },
5756
+ "link": {
5757
+ "color": {
5758
+ "value": "#01689b",
5759
+ "type": "color"
5760
+ },
5761
+ "text-decoration-color": {
5762
+ "value": "#01689b",
5763
+ "type": "color"
5764
+ },
5765
+ "active": {
5766
+ "color": {
5767
+ "value": "#42145f",
5768
+ "type": "color"
5769
+ },
5770
+ "text-decoration": {
5771
+ "value": "None",
5772
+ "type": "textDecoration"
5773
+ }
5774
+ },
5775
+ "focus": {
5776
+ "background-color": {
5777
+ "value": "transparent",
5778
+ "type": "color"
5779
+ },
5780
+ "color": {
5781
+ "value": "#01689b",
5782
+ "type": "color"
5783
+ },
5784
+ "text-decoration": {
5785
+ "value": "None",
5786
+ "type": "textDecoration"
5787
+ },
5788
+ "text-decoration-thickness": {
5789
+ "value": "auto",
5790
+ "type": "other"
5791
+ }
5792
+ },
5793
+ "hover": {
5794
+ "color": {
5795
+ "$extensions": {
5796
+ "studio.tokens": {
5797
+ "modify": {
5798
+ "type": "darken",
5799
+ "value": "0.3",
5800
+ "space": "srgb"
5801
+ }
5802
+ }
5803
+ },
5804
+ "value": "#01496c",
5805
+ "type": "color"
5806
+ },
5807
+ "text-decoration": {
5808
+ "value": "None",
5809
+ "type": "textDecoration"
5810
+ },
5811
+ "text-decoration-thickness": {
5812
+ "value": "auto",
5813
+ "type": "other"
5814
+ }
5815
+ },
5816
+ "visited": {
5817
+ "color": {
5818
+ "value": "#42145f",
5819
+ "type": "color"
5820
+ }
5821
+ },
5822
+ "text-decoration": {
5823
+ "value": "underline",
5824
+ "type": "textDecoration"
5825
+ },
5826
+ "icon": {
5827
+ "inset-block-start": {
5828
+ "value": "0.25rem",
5829
+ "type": "spacing"
5830
+ },
5831
+ "size": {
5832
+ "value": "24px",
5833
+ "type": "sizing"
5834
+ }
5835
+ },
5836
+ "column-gap": {
5837
+ "value": "0.25rem",
5838
+ "type": "spacing"
5839
+ },
5840
+ "text-decoration-thickness": {
5841
+ "value": "auto",
5842
+ "type": "other"
5843
+ },
5844
+ "text-underline-offset": {
5845
+ "value": "0.125rem",
5846
+ "type": "other"
5847
+ },
5848
+ "font-family": {
5849
+ "value": "Fira Sans, Arial, Verdana, sans-serif",
5850
+ "type": "fontFamilies"
5851
+ },
5852
+ "font-weight": {
5853
+ "value": 400,
5854
+ "type": "fontWeights"
5855
+ },
5856
+ "font-size": {
5857
+ "value": "1.25rem",
5858
+ "type": "fontSizes"
5859
+ },
5860
+ "line-height": {
5861
+ "value": "150%",
5862
+ "type": "lineHeights"
5863
+ }
5864
+ },
5389
5865
  "heading-level-1": {
5390
5866
  "color": {
5391
5867
  "value": "#154273",