@rijkshuisstijl-community/design-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.
Files changed (88) hide show
  1. package/CHANGELOG.md +26 -0
  2. package/README.md +46 -1
  3. package/build.mjs +36 -10
  4. package/cssFixers.mjs +89 -0
  5. package/cssFixers.spec.mjs +98 -0
  6. package/dist/_variables.scss +20 -17
  7. package/dist/index.css +20 -17
  8. package/dist/index.d.ts +24 -19
  9. package/dist/index.js +23 -20
  10. package/dist/index.json +21 -19
  11. package/dist/index.tokens.json +33 -31
  12. package/dist/kern-lintblauw/_variables.scss +20 -17
  13. package/dist/kern-lintblauw/index.css +20 -17
  14. package/dist/kern-lintblauw/index.d.ts +24 -19
  15. package/dist/kern-lintblauw/index.js +23 -20
  16. package/dist/kern-lintblauw/index.json +21 -19
  17. package/dist/kern-lintblauw/index.tokens.json +33 -31
  18. package/dist/kern-lintblauw/root.css +20 -17
  19. package/dist/kern-lintblauw/tokens.d.ts +31 -28
  20. package/dist/kern-lintblauw/tokens.js +446 -531
  21. package/dist/root.css +20 -17
  22. package/dist/tokens.d.ts +31 -28
  23. package/dist/tokens.js +446 -531
  24. package/dist/uitvoerend-groen/_variables.scss +21 -18
  25. package/dist/uitvoerend-groen/index.css +21 -18
  26. package/dist/uitvoerend-groen/index.d.ts +24 -19
  27. package/dist/uitvoerend-groen/index.js +23 -20
  28. package/dist/uitvoerend-groen/index.json +21 -19
  29. package/dist/uitvoerend-groen/index.tokens.json +33 -31
  30. package/dist/uitvoerend-groen/root.css +21 -18
  31. package/dist/uitvoerend-groen/tokens.d.ts +31 -28
  32. package/dist/uitvoerend-groen/tokens.js +446 -531
  33. package/dist/uitvoerend-hemelblauw/_variables.scss +21 -18
  34. package/dist/uitvoerend-hemelblauw/index.css +21 -18
  35. package/dist/uitvoerend-hemelblauw/index.d.ts +24 -19
  36. package/dist/uitvoerend-hemelblauw/index.js +23 -20
  37. package/dist/uitvoerend-hemelblauw/index.json +21 -19
  38. package/dist/uitvoerend-hemelblauw/index.tokens.json +33 -31
  39. package/dist/uitvoerend-hemelblauw/root.css +21 -18
  40. package/dist/uitvoerend-hemelblauw/tokens.d.ts +31 -28
  41. package/dist/uitvoerend-hemelblauw/tokens.js +446 -531
  42. package/dist/uitvoerend-lintblauw/_variables.scss +21 -18
  43. package/dist/uitvoerend-lintblauw/index.css +21 -18
  44. package/dist/uitvoerend-lintblauw/index.d.ts +24 -19
  45. package/dist/uitvoerend-lintblauw/index.js +23 -20
  46. package/dist/uitvoerend-lintblauw/index.json +21 -19
  47. package/dist/uitvoerend-lintblauw/index.tokens.json +33 -31
  48. package/dist/uitvoerend-lintblauw/root.css +21 -18
  49. package/dist/uitvoerend-lintblauw/tokens.d.ts +31 -28
  50. package/dist/uitvoerend-lintblauw/tokens.js +446 -531
  51. package/dist/uitvoerend-oranje/_variables.scss +21 -18
  52. package/dist/uitvoerend-oranje/index.css +21 -18
  53. package/dist/uitvoerend-oranje/index.d.ts +24 -19
  54. package/dist/uitvoerend-oranje/index.js +23 -20
  55. package/dist/uitvoerend-oranje/index.json +21 -19
  56. package/dist/uitvoerend-oranje/index.tokens.json +33 -31
  57. package/dist/uitvoerend-oranje/root.css +21 -18
  58. package/dist/uitvoerend-oranje/tokens.d.ts +31 -28
  59. package/dist/uitvoerend-oranje/tokens.js +446 -531
  60. package/dist/uitvoerend-paars/_variables.scss +21 -18
  61. package/dist/uitvoerend-paars/index.css +21 -18
  62. package/dist/uitvoerend-paars/index.d.ts +24 -19
  63. package/dist/uitvoerend-paars/index.js +23 -20
  64. package/dist/uitvoerend-paars/index.json +21 -19
  65. package/dist/uitvoerend-paars/index.tokens.json +33 -31
  66. package/dist/uitvoerend-paars/root.css +21 -18
  67. package/dist/uitvoerend-paars/tokens.d.ts +31 -28
  68. package/dist/uitvoerend-paars/tokens.js +446 -531
  69. package/dist/uitvoerend-robijnrood/_variables.scss +21 -18
  70. package/dist/uitvoerend-robijnrood/index.css +21 -18
  71. package/dist/uitvoerend-robijnrood/index.d.ts +24 -19
  72. package/dist/uitvoerend-robijnrood/index.js +23 -20
  73. package/dist/uitvoerend-robijnrood/index.json +21 -19
  74. package/dist/uitvoerend-robijnrood/index.tokens.json +33 -31
  75. package/dist/uitvoerend-robijnrood/root.css +21 -18
  76. package/dist/uitvoerend-robijnrood/tokens.d.ts +31 -28
  77. package/dist/uitvoerend-robijnrood/tokens.js +446 -531
  78. package/figma/figma.tokens.json +90 -171
  79. package/package.json +4 -3
  80. package/src/generated/base.tokens.json +89 -170
  81. package/src/generated/kern-lintblauw/tokens.json +89 -170
  82. package/src/generated/themes.json +623 -1190
  83. package/src/generated/uitvoerend-groen/tokens.json +89 -170
  84. package/src/generated/uitvoerend-hemelblauw/tokens.json +89 -170
  85. package/src/generated/uitvoerend-lintblauw/tokens.json +89 -170
  86. package/src/generated/uitvoerend-oranje/tokens.json +89 -170
  87. package/src/generated/uitvoerend-paars/tokens.json +89 -170
  88. package/src/generated/uitvoerend-robijnrood/tokens.json +89 -170
package/dist/index.json CHANGED
@@ -428,31 +428,33 @@
428
428
  "rhcNavBarBackgroundColor": "#ffffff",
429
429
  "rhcNavBarColor": "#154273",
430
430
  "rhcNavBarBorderColor": "#4f7196",
431
- "rhcNavigationListIconBackgroundColor": "#0f172a",
432
- "rhcNavigationListIconBorderRadius": "999px",
433
- "rhcNavigationListIconColor": "#ffffff",
434
- "rhcNavigationListItemIconPaddingInline": "0.5rem",
435
- "rhcNavigationListItemIconPaddingBlock": "0.5rem",
436
- "rhcNavigationListItemIconSize": "24px",
437
- "rhcNavigationListItemContentFontSize": "1.25rem",
438
- "rhcNavigationListItemContentColumnGap": "0.5rem",
439
- "rhcNavigationListItemContentRowGap": "0.25rem",
440
- "rhcNavigationListItemLabelFontFamily": "'Fira Sans', Arial, Verdana, sans-serif",
441
- "rhcNavigationListItemLabelFontSize": "1.875rem",
442
- "rhcNavigationListItemLabelFontWeight": "700",
443
- "rhcNavigationListItemLabelLineHeight": "150%",
444
- "rhcNavigationListItemActiveBackgroundColor": "#f1f5f9",
445
- "rhcNavigationListItemHoverBackgroundColor": "#f8fafc",
446
- "rhcNavigationListItemFocusBackgroundColor": "#dce3ea",
447
431
  "rhcNavigationListItemBackgroundColor": "#ffffff",
448
- "rhcNavigationListItemColor": "#334155",
449
- "rhcNavigationListItemBorderWidth": "1px",
450
432
  "rhcNavigationListItemBorderColor": "#cbd5e1",
451
- "rhcNavigationListItemHeadingColor": "#0f172a",
433
+ "rhcNavigationListItemBorderWidth": "1px",
452
434
  "rhcNavigationListItemColumnGap": "1rem",
453
435
  "rhcNavigationListItemMinHeight": "48px",
454
436
  "rhcNavigationListItemPaddingBlock": "0.75rem",
455
437
  "rhcNavigationListItemPaddingInline": "1rem",
438
+ "rhcNavigationListItemActiveBackgroundColor": "#f1f5f9",
439
+ "rhcNavigationListItemHoverBackgroundColor": "#f8fafc",
440
+ "rhcNavigationListItemFocusBackgroundColor": "#dce3ea",
441
+ "rhcNavigationListItemContentColumnGap": "0.5rem",
442
+ "rhcNavigationListItemContentRowGap": "0.25rem",
443
+ "rhcNavigationListItemDescriptionColor": "#334155",
444
+ "rhcNavigationListItemDescriptionFontSize": "1.25rem",
445
+ "rhcNavigationListItemDescriptionLineHeight": "150%",
446
+ "rhcNavigationListItemIconEndColor": "#334155",
447
+ "rhcNavigationListItemIconStartBackgroundColor": "#0f172a",
448
+ "rhcNavigationListItemIconStartBorderRadius": "999px",
449
+ "rhcNavigationListItemIconStartColor": "#ffffff",
450
+ "rhcNavigationListItemIconStartPaddingBlock": "0.5rem",
451
+ "rhcNavigationListItemIconStartPaddingInline": "0.5rem",
452
+ "rhcNavigationListItemIconStartSize": "24px",
453
+ "rhcNavigationListItemLabelColor": "#0f172a",
454
+ "rhcNavigationListItemLabelFontFamily": "'Fira Sans', Arial, Verdana, sans-serif",
455
+ "rhcNavigationListItemLabelFontSize": "1.875rem",
456
+ "rhcNavigationListItemLabelFontWeight": "700",
457
+ "rhcNavigationListItemLabelLineHeight": "150%",
456
458
  "rhcRadioGroupPaddingBlockEnd": "0.5rem",
457
459
  "rhcRadioGroupPaddingBlockStart": "0.5rem",
458
460
  "rhcRadioGroupRowGap": "1rem",
@@ -678,28 +678,14 @@
678
678
  "border-color": "#4f7196"
679
679
  },
680
680
  "navigation-list": {
681
- "icon": {
682
- "background-color": "#0f172a",
683
- "border-radius": "999px",
684
- "color": "#ffffff"
685
- },
686
681
  "item": {
687
- "icon": {
688
- "padding-inline": "0.5rem",
689
- "padding-block": "0.5rem",
690
- "size": "24px"
691
- },
692
- "content": {
693
- "font-size": "1.25rem",
694
- "column-gap": "0.5rem",
695
- "row-gap": "0.25rem"
696
- },
697
- "label": {
698
- "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
699
- "font-size": "1.875rem",
700
- "font-weight": "700",
701
- "line-height": "150%"
702
- },
682
+ "background-color": "#ffffff",
683
+ "border-color": "#cbd5e1",
684
+ "border-width": "1px",
685
+ "column-gap": "1rem",
686
+ "min-height": "48px",
687
+ "padding-block": "0.75rem",
688
+ "padding-inline": "1rem",
703
689
  "active": {
704
690
  "background-color": "#f1f5f9"
705
691
  },
@@ -709,17 +695,33 @@
709
695
  "focus": {
710
696
  "background-color": "#dce3ea"
711
697
  },
712
- "background-color": "#ffffff",
713
- "color": "#334155",
714
- "border-width": "1px",
715
- "border-color": "#cbd5e1",
716
- "heading": {
717
- "color": "#0f172a"
698
+ "content": {
699
+ "column-gap": "0.5rem",
700
+ "row-gap": "0.25rem"
718
701
  },
719
- "column-gap": "1rem",
720
- "min-height": "48px",
721
- "padding-block": "0.75rem",
722
- "padding-inline": "1rem"
702
+ "description": {
703
+ "color": "#334155",
704
+ "font-size": "1.25rem",
705
+ "line-height": "150%"
706
+ },
707
+ "icon-end": {
708
+ "color": "#334155"
709
+ },
710
+ "icon-start": {
711
+ "background-color": "#0f172a",
712
+ "border-radius": "999px",
713
+ "color": "#ffffff",
714
+ "padding-block": "0.5rem",
715
+ "padding-inline": "0.5rem",
716
+ "size": "24px"
717
+ },
718
+ "label": {
719
+ "color": "#0f172a",
720
+ "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
721
+ "font-size": "1.875rem",
722
+ "font-weight": "700",
723
+ "line-height": "150%"
724
+ }
723
725
  }
724
726
  },
725
727
  "radio-group": {
@@ -1,5 +1,6 @@
1
1
 
2
2
  // Do not edit directly, this file was auto-generated.
3
+ // Generated on Tue, 30 Dec 2025 09:35:40 GMT
3
4
 
4
5
  $rhc-border-radius-round: 999px;
5
6
  $rhc-border-radius-none: 0px;
@@ -493,21 +494,22 @@ $rhc-nav-bar-link-padding-inline-end: $rhc-space-150;
493
494
  $rhc-nav-bar-link-padding-inline-start: $rhc-space-150;
494
495
  $rhc-nav-bar-link-column-gap: $rhc-space-100;
495
496
  $rhc-nav-bar-background-color: $rhc-color-wit;
496
- $rhc-navigation-list-icon-border-radius: $rhc-border-radius-round;
497
- $rhc-navigation-list-item-icon-padding-inline: $rhc-space-100;
498
- $rhc-navigation-list-item-icon-padding-block: $rhc-space-100;
499
- $rhc-navigation-list-item-icon-size: $rhc-size-icon-md;
500
- $rhc-navigation-list-item-content-column-gap: $rhc-space-100;
501
- $rhc-navigation-list-item-content-row-gap: $rhc-space-50;
502
- $rhc-navigation-list-item-label-line-height: $rhc-text-line-height-md;
503
- $rhc-navigation-list-item-active-background-color: $rhc-color-cool-grey-100;
504
- $rhc-navigation-list-item-hover-background-color: $rhc-color-cool-grey-50;
505
- $rhc-navigation-list-item-border-width: $rhc-border-width-sm;
506
497
  $rhc-navigation-list-item-border-color: $rhc-color-cool-grey-300;
498
+ $rhc-navigation-list-item-border-width: $rhc-border-width-sm;
507
499
  $rhc-navigation-list-item-column-gap: $rhc-space-200;
508
500
  $rhc-navigation-list-item-min-height: $rhc-size-pointer-target;
509
501
  $rhc-navigation-list-item-padding-block: $rhc-space-150;
510
502
  $rhc-navigation-list-item-padding-inline: $rhc-space-200;
503
+ $rhc-navigation-list-item-active-background-color: $rhc-color-cool-grey-100;
504
+ $rhc-navigation-list-item-hover-background-color: $rhc-color-cool-grey-50;
505
+ $rhc-navigation-list-item-content-column-gap: $rhc-space-100; // [code-only]
506
+ $rhc-navigation-list-item-content-row-gap: $rhc-space-50; // [code-only]
507
+ $rhc-navigation-list-item-description-line-height: $rhc-text-line-height-md;
508
+ $rhc-navigation-list-item-icon-start-border-radius: $rhc-border-radius-round;
509
+ $rhc-navigation-list-item-icon-start-padding-block: $rhc-space-100;
510
+ $rhc-navigation-list-item-icon-start-padding-inline: $rhc-space-100;
511
+ $rhc-navigation-list-item-icon-start-size: $rhc-size-icon-md;
512
+ $rhc-navigation-list-item-label-line-height: $rhc-text-line-height-md;
511
513
  $rhc-radio-group-padding-block-end: $rhc-space-100;
512
514
  $rhc-radio-group-padding-block-start: $rhc-space-100;
513
515
  $rhc-radio-group-row-gap: $rhc-space-200;
@@ -1052,16 +1054,17 @@ $rhc-nav-bar-link-font-size: $rhc-text-font-size-md;
1052
1054
  $rhc-nav-bar-heading-font-weight: $rhc-text-font-weight-strong;
1053
1055
  $rhc-nav-bar-color: $rhc-color-primary-500;
1054
1056
  $rhc-nav-bar-border-color: $rhc-color-primary-400;
1055
- $rhc-navigation-list-icon-background-color: $rhc-color-foreground-default;
1056
- $rhc-navigation-list-icon-color: $rhc-color-foreground-on-dark-color;
1057
- $rhc-navigation-list-item-content-font-size: $rhc-text-font-size-md;
1057
+ $rhc-navigation-list-item-background-color: $rhc-color-bg-document;
1058
+ $rhc-navigation-list-item-focus-background-color: $rhc-color-primary-50;
1059
+ $rhc-navigation-list-item-description-color: $rhc-color-foreground-subtle;
1060
+ $rhc-navigation-list-item-description-font-size: $rhc-text-font-size-md;
1061
+ $rhc-navigation-list-item-icon-end-color: $rhc-color-foreground-subtle;
1062
+ $rhc-navigation-list-item-icon-start-background-color: $rhc-color-foreground-default;
1063
+ $rhc-navigation-list-item-icon-start-color: $rhc-color-foreground-on-dark-color;
1064
+ $rhc-navigation-list-item-label-color: $rhc-color-foreground-default;
1058
1065
  $rhc-navigation-list-item-label-font-family: $rhc-text-font-family-default;
1059
1066
  $rhc-navigation-list-item-label-font-size: $rhc-text-font-size-xl;
1060
1067
  $rhc-navigation-list-item-label-font-weight: $rhc-text-font-weight-strong;
1061
- $rhc-navigation-list-item-focus-background-color: $rhc-color-primary-50;
1062
- $rhc-navigation-list-item-background-color: $rhc-color-bg-document;
1063
- $rhc-navigation-list-item-color: $rhc-color-foreground-subtle;
1064
- $rhc-navigation-list-item-heading-color: $rhc-color-foreground-default;
1065
1068
  $rhc-sidenav-link-font-size: $rhc-text-font-size-md;
1066
1069
  $rhc-sidenav-link-font-family: $rhc-text-font-family-default;
1067
1070
  $rhc-sidenav-link-font-weight: $rhc-text-font-weight-default;
@@ -1,5 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly, this file was auto-generated.
3
+ * Generated on Tue, 30 Dec 2025 09:35:40 GMT
3
4
  */
4
5
 
5
6
  .kern-lintblauw {
@@ -495,21 +496,22 @@
495
496
  --rhc-nav-bar-link-padding-inline-start: var(--rhc-space-150);
496
497
  --rhc-nav-bar-link-column-gap: var(--rhc-space-100);
497
498
  --rhc-nav-bar-background-color: var(--rhc-color-wit);
498
- --rhc-navigation-list-icon-border-radius: var(--rhc-border-radius-round);
499
- --rhc-navigation-list-item-icon-padding-inline: var(--rhc-space-100);
500
- --rhc-navigation-list-item-icon-padding-block: var(--rhc-space-100);
501
- --rhc-navigation-list-item-icon-size: var(--rhc-size-icon-md);
502
- --rhc-navigation-list-item-content-column-gap: var(--rhc-space-100);
503
- --rhc-navigation-list-item-content-row-gap: var(--rhc-space-50);
504
- --rhc-navigation-list-item-label-line-height: var(--rhc-text-line-height-md);
505
- --rhc-navigation-list-item-active-background-color: var(--rhc-color-cool-grey-100);
506
- --rhc-navigation-list-item-hover-background-color: var(--rhc-color-cool-grey-50);
507
- --rhc-navigation-list-item-border-width: var(--rhc-border-width-sm);
508
499
  --rhc-navigation-list-item-border-color: var(--rhc-color-cool-grey-300);
500
+ --rhc-navigation-list-item-border-width: var(--rhc-border-width-sm);
509
501
  --rhc-navigation-list-item-column-gap: var(--rhc-space-200);
510
502
  --rhc-navigation-list-item-min-height: var(--rhc-size-pointer-target);
511
503
  --rhc-navigation-list-item-padding-block: var(--rhc-space-150);
512
504
  --rhc-navigation-list-item-padding-inline: var(--rhc-space-200);
505
+ --rhc-navigation-list-item-active-background-color: var(--rhc-color-cool-grey-100);
506
+ --rhc-navigation-list-item-hover-background-color: var(--rhc-color-cool-grey-50);
507
+ --rhc-navigation-list-item-content-column-gap: var(--rhc-space-100); /** [code-only] */
508
+ --rhc-navigation-list-item-content-row-gap: var(--rhc-space-50); /** [code-only] */
509
+ --rhc-navigation-list-item-description-line-height: var(--rhc-text-line-height-md);
510
+ --rhc-navigation-list-item-icon-start-border-radius: var(--rhc-border-radius-round);
511
+ --rhc-navigation-list-item-icon-start-padding-block: var(--rhc-space-100);
512
+ --rhc-navigation-list-item-icon-start-padding-inline: var(--rhc-space-100);
513
+ --rhc-navigation-list-item-icon-start-size: var(--rhc-size-icon-md);
514
+ --rhc-navigation-list-item-label-line-height: var(--rhc-text-line-height-md);
513
515
  --rhc-radio-group-padding-block-end: var(--rhc-space-100);
514
516
  --rhc-radio-group-padding-block-start: var(--rhc-space-100);
515
517
  --rhc-radio-group-row-gap: var(--rhc-space-200);
@@ -1054,16 +1056,17 @@
1054
1056
  --rhc-nav-bar-heading-font-weight: var(--rhc-text-font-weight-strong);
1055
1057
  --rhc-nav-bar-color: var(--rhc-color-primary-500);
1056
1058
  --rhc-nav-bar-border-color: var(--rhc-color-primary-400);
1057
- --rhc-navigation-list-icon-background-color: var(--rhc-color-foreground-default);
1058
- --rhc-navigation-list-icon-color: var(--rhc-color-foreground-on-dark-color);
1059
- --rhc-navigation-list-item-content-font-size: var(--rhc-text-font-size-md);
1059
+ --rhc-navigation-list-item-background-color: var(--rhc-color-bg-document);
1060
+ --rhc-navigation-list-item-focus-background-color: var(--rhc-color-primary-50);
1061
+ --rhc-navigation-list-item-description-color: var(--rhc-color-foreground-subtle);
1062
+ --rhc-navigation-list-item-description-font-size: var(--rhc-text-font-size-md);
1063
+ --rhc-navigation-list-item-icon-end-color: var(--rhc-color-foreground-subtle);
1064
+ --rhc-navigation-list-item-icon-start-background-color: var(--rhc-color-foreground-default);
1065
+ --rhc-navigation-list-item-icon-start-color: var(--rhc-color-foreground-on-dark-color);
1066
+ --rhc-navigation-list-item-label-color: var(--rhc-color-foreground-default);
1060
1067
  --rhc-navigation-list-item-label-font-family: var(--rhc-text-font-family-default);
1061
1068
  --rhc-navigation-list-item-label-font-size: var(--rhc-text-font-size-xl);
1062
1069
  --rhc-navigation-list-item-label-font-weight: var(--rhc-text-font-weight-strong);
1063
- --rhc-navigation-list-item-focus-background-color: var(--rhc-color-primary-50);
1064
- --rhc-navigation-list-item-background-color: var(--rhc-color-bg-document);
1065
- --rhc-navigation-list-item-color: var(--rhc-color-foreground-subtle);
1066
- --rhc-navigation-list-item-heading-color: var(--rhc-color-foreground-default);
1067
1070
  --rhc-sidenav-link-font-size: var(--rhc-text-font-size-md);
1068
1071
  --rhc-sidenav-link-font-family: var(--rhc-text-font-family-default);
1069
1072
  --rhc-sidenav-link-font-weight: var(--rhc-text-font-weight-default);
@@ -1,5 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly, this file was auto-generated.
3
+ * Generated on Tue, 30 Dec 2025 09:35:40 GMT
3
4
  */
4
5
 
5
6
  export const rhcBorderRadiusRound: string;
@@ -434,31 +435,35 @@ export const rhcNavBarHeadingFontWeight: string;
434
435
  export const rhcNavBarBackgroundColor: string;
435
436
  export const rhcNavBarColor: string;
436
437
  export const rhcNavBarBorderColor: string;
437
- export const rhcNavigationListIconBackgroundColor: string;
438
- export const rhcNavigationListIconBorderRadius: string;
439
- export const rhcNavigationListIconColor: string;
440
- export const rhcNavigationListItemIconPaddingInline: string;
441
- export const rhcNavigationListItemIconPaddingBlock: string;
442
- export const rhcNavigationListItemIconSize: string;
443
- export const rhcNavigationListItemContentFontSize: string;
444
- export const rhcNavigationListItemContentColumnGap: string;
445
- export const rhcNavigationListItemContentRowGap: string;
446
- export const rhcNavigationListItemLabelFontFamily: string;
447
- export const rhcNavigationListItemLabelFontSize: string;
448
- export const rhcNavigationListItemLabelFontWeight: string;
449
- export const rhcNavigationListItemLabelLineHeight: string;
450
- export const rhcNavigationListItemActiveBackgroundColor: string;
451
- export const rhcNavigationListItemHoverBackgroundColor: string;
452
- export const rhcNavigationListItemFocusBackgroundColor: string;
453
438
  export const rhcNavigationListItemBackgroundColor: string;
454
- export const rhcNavigationListItemColor: string;
455
- export const rhcNavigationListItemBorderWidth: string;
456
439
  export const rhcNavigationListItemBorderColor: string;
457
- export const rhcNavigationListItemHeadingColor: string;
440
+ export const rhcNavigationListItemBorderWidth: string;
458
441
  export const rhcNavigationListItemColumnGap: string;
459
442
  export const rhcNavigationListItemMinHeight: string;
460
443
  export const rhcNavigationListItemPaddingBlock: string;
461
444
  export const rhcNavigationListItemPaddingInline: string;
445
+ export const rhcNavigationListItemActiveBackgroundColor: string;
446
+ export const rhcNavigationListItemHoverBackgroundColor: string;
447
+ export const rhcNavigationListItemFocusBackgroundColor: string;
448
+ /** [code-only] */
449
+ export const rhcNavigationListItemContentColumnGap: string;
450
+ /** [code-only] */
451
+ export const rhcNavigationListItemContentRowGap: string;
452
+ export const rhcNavigationListItemDescriptionColor: string;
453
+ export const rhcNavigationListItemDescriptionFontSize: string;
454
+ export const rhcNavigationListItemDescriptionLineHeight: string;
455
+ export const rhcNavigationListItemIconEndColor: string;
456
+ export const rhcNavigationListItemIconStartBackgroundColor: string;
457
+ export const rhcNavigationListItemIconStartBorderRadius: string;
458
+ export const rhcNavigationListItemIconStartColor: string;
459
+ export const rhcNavigationListItemIconStartPaddingBlock: string;
460
+ export const rhcNavigationListItemIconStartPaddingInline: string;
461
+ export const rhcNavigationListItemIconStartSize: string;
462
+ export const rhcNavigationListItemLabelColor: string;
463
+ export const rhcNavigationListItemLabelFontFamily: string;
464
+ export const rhcNavigationListItemLabelFontSize: string;
465
+ export const rhcNavigationListItemLabelFontWeight: string;
466
+ export const rhcNavigationListItemLabelLineHeight: string;
462
467
  export const rhcRadioGroupPaddingBlockEnd: string;
463
468
  export const rhcRadioGroupPaddingBlockStart: string;
464
469
  export const rhcRadioGroupRowGap: string;
@@ -1,5 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly, this file was auto-generated.
3
+ * Generated on Tue, 30 Dec 2025 09:35:40 GMT
3
4
  */
4
5
 
5
6
  export const rhcBorderRadiusRound = "999px";
@@ -435,32 +436,34 @@ export const rhcNavBarHeadingFontWeight = "700";
435
436
  export const rhcNavBarBackgroundColor = "#ffffff";
436
437
  export const rhcNavBarColor = "#154273";
437
438
  export const rhcNavBarBorderColor = "#4f7196";
438
- export const rhcNavigationListIconBackgroundColor = "#0f172a";
439
- export const rhcNavigationListIconBorderRadius = "999px";
440
- export const rhcNavigationListIconColor = "#ffffff";
441
- export const rhcNavigationListItemIconPaddingInline = "0.5rem";
442
- export const rhcNavigationListItemIconPaddingBlock = "0.5rem";
443
- export const rhcNavigationListItemIconSize = "24px";
444
- export const rhcNavigationListItemContentFontSize = "1.25rem";
445
- export const rhcNavigationListItemContentColumnGap = "0.5rem";
446
- export const rhcNavigationListItemContentRowGap = "0.25rem";
447
- export const rhcNavigationListItemLabelFontFamily =
448
- "'Fira Sans', Arial, Verdana, sans-serif";
449
- export const rhcNavigationListItemLabelFontSize = "1.875rem";
450
- export const rhcNavigationListItemLabelFontWeight = "700";
451
- export const rhcNavigationListItemLabelLineHeight = "150%";
452
- export const rhcNavigationListItemActiveBackgroundColor = "#f1f5f9";
453
- export const rhcNavigationListItemHoverBackgroundColor = "#f8fafc";
454
- export const rhcNavigationListItemFocusBackgroundColor = "#dce3ea";
455
439
  export const rhcNavigationListItemBackgroundColor = "#ffffff";
456
- export const rhcNavigationListItemColor = "#334155";
457
- export const rhcNavigationListItemBorderWidth = "1px";
458
440
  export const rhcNavigationListItemBorderColor = "#cbd5e1";
459
- export const rhcNavigationListItemHeadingColor = "#0f172a";
441
+ export const rhcNavigationListItemBorderWidth = "1px";
460
442
  export const rhcNavigationListItemColumnGap = "1rem";
461
443
  export const rhcNavigationListItemMinHeight = "48px";
462
444
  export const rhcNavigationListItemPaddingBlock = "0.75rem";
463
445
  export const rhcNavigationListItemPaddingInline = "1rem";
446
+ export const rhcNavigationListItemActiveBackgroundColor = "#f1f5f9";
447
+ export const rhcNavigationListItemHoverBackgroundColor = "#f8fafc";
448
+ export const rhcNavigationListItemFocusBackgroundColor = "#dce3ea";
449
+ export const rhcNavigationListItemContentColumnGap = "0.5rem"; // [code-only]
450
+ export const rhcNavigationListItemContentRowGap = "0.25rem"; // [code-only]
451
+ export const rhcNavigationListItemDescriptionColor = "#334155";
452
+ export const rhcNavigationListItemDescriptionFontSize = "1.25rem";
453
+ export const rhcNavigationListItemDescriptionLineHeight = "150%";
454
+ export const rhcNavigationListItemIconEndColor = "#334155";
455
+ export const rhcNavigationListItemIconStartBackgroundColor = "#0f172a";
456
+ export const rhcNavigationListItemIconStartBorderRadius = "999px";
457
+ export const rhcNavigationListItemIconStartColor = "#ffffff";
458
+ export const rhcNavigationListItemIconStartPaddingBlock = "0.5rem";
459
+ export const rhcNavigationListItemIconStartPaddingInline = "0.5rem";
460
+ export const rhcNavigationListItemIconStartSize = "24px";
461
+ export const rhcNavigationListItemLabelColor = "#0f172a";
462
+ export const rhcNavigationListItemLabelFontFamily =
463
+ "'Fira Sans', Arial, Verdana, sans-serif";
464
+ export const rhcNavigationListItemLabelFontSize = "1.875rem";
465
+ export const rhcNavigationListItemLabelFontWeight = "700";
466
+ export const rhcNavigationListItemLabelLineHeight = "150%";
464
467
  export const rhcRadioGroupPaddingBlockEnd = "0.5rem";
465
468
  export const rhcRadioGroupPaddingBlockStart = "0.5rem";
466
469
  export const rhcRadioGroupRowGap = "1rem";
@@ -428,31 +428,33 @@
428
428
  "rhcNavBarBackgroundColor": "#ffffff",
429
429
  "rhcNavBarColor": "#154273",
430
430
  "rhcNavBarBorderColor": "#4f7196",
431
- "rhcNavigationListIconBackgroundColor": "#0f172a",
432
- "rhcNavigationListIconBorderRadius": "999px",
433
- "rhcNavigationListIconColor": "#ffffff",
434
- "rhcNavigationListItemIconPaddingInline": "0.5rem",
435
- "rhcNavigationListItemIconPaddingBlock": "0.5rem",
436
- "rhcNavigationListItemIconSize": "24px",
437
- "rhcNavigationListItemContentFontSize": "1.25rem",
438
- "rhcNavigationListItemContentColumnGap": "0.5rem",
439
- "rhcNavigationListItemContentRowGap": "0.25rem",
440
- "rhcNavigationListItemLabelFontFamily": "'Fira Sans', Arial, Verdana, sans-serif",
441
- "rhcNavigationListItemLabelFontSize": "1.875rem",
442
- "rhcNavigationListItemLabelFontWeight": "700",
443
- "rhcNavigationListItemLabelLineHeight": "150%",
444
- "rhcNavigationListItemActiveBackgroundColor": "#f1f5f9",
445
- "rhcNavigationListItemHoverBackgroundColor": "#f8fafc",
446
- "rhcNavigationListItemFocusBackgroundColor": "#dce3ea",
447
431
  "rhcNavigationListItemBackgroundColor": "#ffffff",
448
- "rhcNavigationListItemColor": "#334155",
449
- "rhcNavigationListItemBorderWidth": "1px",
450
432
  "rhcNavigationListItemBorderColor": "#cbd5e1",
451
- "rhcNavigationListItemHeadingColor": "#0f172a",
433
+ "rhcNavigationListItemBorderWidth": "1px",
452
434
  "rhcNavigationListItemColumnGap": "1rem",
453
435
  "rhcNavigationListItemMinHeight": "48px",
454
436
  "rhcNavigationListItemPaddingBlock": "0.75rem",
455
437
  "rhcNavigationListItemPaddingInline": "1rem",
438
+ "rhcNavigationListItemActiveBackgroundColor": "#f1f5f9",
439
+ "rhcNavigationListItemHoverBackgroundColor": "#f8fafc",
440
+ "rhcNavigationListItemFocusBackgroundColor": "#dce3ea",
441
+ "rhcNavigationListItemContentColumnGap": "0.5rem",
442
+ "rhcNavigationListItemContentRowGap": "0.25rem",
443
+ "rhcNavigationListItemDescriptionColor": "#334155",
444
+ "rhcNavigationListItemDescriptionFontSize": "1.25rem",
445
+ "rhcNavigationListItemDescriptionLineHeight": "150%",
446
+ "rhcNavigationListItemIconEndColor": "#334155",
447
+ "rhcNavigationListItemIconStartBackgroundColor": "#0f172a",
448
+ "rhcNavigationListItemIconStartBorderRadius": "999px",
449
+ "rhcNavigationListItemIconStartColor": "#ffffff",
450
+ "rhcNavigationListItemIconStartPaddingBlock": "0.5rem",
451
+ "rhcNavigationListItemIconStartPaddingInline": "0.5rem",
452
+ "rhcNavigationListItemIconStartSize": "24px",
453
+ "rhcNavigationListItemLabelColor": "#0f172a",
454
+ "rhcNavigationListItemLabelFontFamily": "'Fira Sans', Arial, Verdana, sans-serif",
455
+ "rhcNavigationListItemLabelFontSize": "1.875rem",
456
+ "rhcNavigationListItemLabelFontWeight": "700",
457
+ "rhcNavigationListItemLabelLineHeight": "150%",
456
458
  "rhcRadioGroupPaddingBlockEnd": "0.5rem",
457
459
  "rhcRadioGroupPaddingBlockStart": "0.5rem",
458
460
  "rhcRadioGroupRowGap": "1rem",
@@ -678,28 +678,14 @@
678
678
  "border-color": "#4f7196"
679
679
  },
680
680
  "navigation-list": {
681
- "icon": {
682
- "background-color": "#0f172a",
683
- "border-radius": "999px",
684
- "color": "#ffffff"
685
- },
686
681
  "item": {
687
- "icon": {
688
- "padding-inline": "0.5rem",
689
- "padding-block": "0.5rem",
690
- "size": "24px"
691
- },
692
- "content": {
693
- "font-size": "1.25rem",
694
- "column-gap": "0.5rem",
695
- "row-gap": "0.25rem"
696
- },
697
- "label": {
698
- "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
699
- "font-size": "1.875rem",
700
- "font-weight": "700",
701
- "line-height": "150%"
702
- },
682
+ "background-color": "#ffffff",
683
+ "border-color": "#cbd5e1",
684
+ "border-width": "1px",
685
+ "column-gap": "1rem",
686
+ "min-height": "48px",
687
+ "padding-block": "0.75rem",
688
+ "padding-inline": "1rem",
703
689
  "active": {
704
690
  "background-color": "#f1f5f9"
705
691
  },
@@ -709,17 +695,33 @@
709
695
  "focus": {
710
696
  "background-color": "#dce3ea"
711
697
  },
712
- "background-color": "#ffffff",
713
- "color": "#334155",
714
- "border-width": "1px",
715
- "border-color": "#cbd5e1",
716
- "heading": {
717
- "color": "#0f172a"
698
+ "content": {
699
+ "column-gap": "0.5rem",
700
+ "row-gap": "0.25rem"
718
701
  },
719
- "column-gap": "1rem",
720
- "min-height": "48px",
721
- "padding-block": "0.75rem",
722
- "padding-inline": "1rem"
702
+ "description": {
703
+ "color": "#334155",
704
+ "font-size": "1.25rem",
705
+ "line-height": "150%"
706
+ },
707
+ "icon-end": {
708
+ "color": "#334155"
709
+ },
710
+ "icon-start": {
711
+ "background-color": "#0f172a",
712
+ "border-radius": "999px",
713
+ "color": "#ffffff",
714
+ "padding-block": "0.5rem",
715
+ "padding-inline": "0.5rem",
716
+ "size": "24px"
717
+ },
718
+ "label": {
719
+ "color": "#0f172a",
720
+ "font-family": "'Fira Sans', Arial, Verdana, sans-serif",
721
+ "font-size": "1.875rem",
722
+ "font-weight": "700",
723
+ "line-height": "150%"
724
+ }
723
725
  }
724
726
  },
725
727
  "radio-group": {
@@ -1,5 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly, this file was auto-generated.
3
+ * Generated on Tue, 30 Dec 2025 09:35:40 GMT
3
4
  */
4
5
 
5
6
  :root {
@@ -495,21 +496,22 @@
495
496
  --rhc-nav-bar-link-padding-inline-start: var(--rhc-space-150);
496
497
  --rhc-nav-bar-link-column-gap: var(--rhc-space-100);
497
498
  --rhc-nav-bar-background-color: var(--rhc-color-wit);
498
- --rhc-navigation-list-icon-border-radius: var(--rhc-border-radius-round);
499
- --rhc-navigation-list-item-icon-padding-inline: var(--rhc-space-100);
500
- --rhc-navigation-list-item-icon-padding-block: var(--rhc-space-100);
501
- --rhc-navigation-list-item-icon-size: var(--rhc-size-icon-md);
502
- --rhc-navigation-list-item-content-column-gap: var(--rhc-space-100);
503
- --rhc-navigation-list-item-content-row-gap: var(--rhc-space-50);
504
- --rhc-navigation-list-item-label-line-height: var(--rhc-text-line-height-md);
505
- --rhc-navigation-list-item-active-background-color: var(--rhc-color-cool-grey-100);
506
- --rhc-navigation-list-item-hover-background-color: var(--rhc-color-cool-grey-50);
507
- --rhc-navigation-list-item-border-width: var(--rhc-border-width-sm);
508
499
  --rhc-navigation-list-item-border-color: var(--rhc-color-cool-grey-300);
500
+ --rhc-navigation-list-item-border-width: var(--rhc-border-width-sm);
509
501
  --rhc-navigation-list-item-column-gap: var(--rhc-space-200);
510
502
  --rhc-navigation-list-item-min-height: var(--rhc-size-pointer-target);
511
503
  --rhc-navigation-list-item-padding-block: var(--rhc-space-150);
512
504
  --rhc-navigation-list-item-padding-inline: var(--rhc-space-200);
505
+ --rhc-navigation-list-item-active-background-color: var(--rhc-color-cool-grey-100);
506
+ --rhc-navigation-list-item-hover-background-color: var(--rhc-color-cool-grey-50);
507
+ --rhc-navigation-list-item-content-column-gap: var(--rhc-space-100); /** [code-only] */
508
+ --rhc-navigation-list-item-content-row-gap: var(--rhc-space-50); /** [code-only] */
509
+ --rhc-navigation-list-item-description-line-height: var(--rhc-text-line-height-md);
510
+ --rhc-navigation-list-item-icon-start-border-radius: var(--rhc-border-radius-round);
511
+ --rhc-navigation-list-item-icon-start-padding-block: var(--rhc-space-100);
512
+ --rhc-navigation-list-item-icon-start-padding-inline: var(--rhc-space-100);
513
+ --rhc-navigation-list-item-icon-start-size: var(--rhc-size-icon-md);
514
+ --rhc-navigation-list-item-label-line-height: var(--rhc-text-line-height-md);
513
515
  --rhc-radio-group-padding-block-end: var(--rhc-space-100);
514
516
  --rhc-radio-group-padding-block-start: var(--rhc-space-100);
515
517
  --rhc-radio-group-row-gap: var(--rhc-space-200);
@@ -1054,16 +1056,17 @@
1054
1056
  --rhc-nav-bar-heading-font-weight: var(--rhc-text-font-weight-strong);
1055
1057
  --rhc-nav-bar-color: var(--rhc-color-primary-500);
1056
1058
  --rhc-nav-bar-border-color: var(--rhc-color-primary-400);
1057
- --rhc-navigation-list-icon-background-color: var(--rhc-color-foreground-default);
1058
- --rhc-navigation-list-icon-color: var(--rhc-color-foreground-on-dark-color);
1059
- --rhc-navigation-list-item-content-font-size: var(--rhc-text-font-size-md);
1059
+ --rhc-navigation-list-item-background-color: var(--rhc-color-bg-document);
1060
+ --rhc-navigation-list-item-focus-background-color: var(--rhc-color-primary-50);
1061
+ --rhc-navigation-list-item-description-color: var(--rhc-color-foreground-subtle);
1062
+ --rhc-navigation-list-item-description-font-size: var(--rhc-text-font-size-md);
1063
+ --rhc-navigation-list-item-icon-end-color: var(--rhc-color-foreground-subtle);
1064
+ --rhc-navigation-list-item-icon-start-background-color: var(--rhc-color-foreground-default);
1065
+ --rhc-navigation-list-item-icon-start-color: var(--rhc-color-foreground-on-dark-color);
1066
+ --rhc-navigation-list-item-label-color: var(--rhc-color-foreground-default);
1060
1067
  --rhc-navigation-list-item-label-font-family: var(--rhc-text-font-family-default);
1061
1068
  --rhc-navigation-list-item-label-font-size: var(--rhc-text-font-size-xl);
1062
1069
  --rhc-navigation-list-item-label-font-weight: var(--rhc-text-font-weight-strong);
1063
- --rhc-navigation-list-item-focus-background-color: var(--rhc-color-primary-50);
1064
- --rhc-navigation-list-item-background-color: var(--rhc-color-bg-document);
1065
- --rhc-navigation-list-item-color: var(--rhc-color-foreground-subtle);
1066
- --rhc-navigation-list-item-heading-color: var(--rhc-color-foreground-default);
1067
1070
  --rhc-sidenav-link-font-size: var(--rhc-text-font-size-md);
1068
1071
  --rhc-sidenav-link-font-family: var(--rhc-text-font-family-default);
1069
1072
  --rhc-sidenav-link-font-weight: var(--rhc-text-font-weight-default);