@synergy-design-system/tokens 2.28.0 → 2.29.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.
package/CHANGELOG.md CHANGED
@@ -1,3 +1,10 @@
1
+ # [@synergy-design-system/tokens-v2.29.0](https://github.com/synergy-design-system/synergy-design-system/compare/tokens/2.28.0...tokens/2.29.0) (2025-10-20)
2
+
3
+
4
+ ### Features
5
+
6
+ * ✨ CD update for syn-drawer ([#1043](https://github.com/synergy-design-system/synergy-design-system/issues/1043)) ([214b367](https://github.com/synergy-design-system/synergy-design-system/commit/214b367e8e603e264ec2718772087601f463439e))
7
+
1
8
  # [@synergy-design-system/tokens-v2.28.0](https://github.com/synergy-design-system/synergy-design-system/compare/tokens/2.27.0...tokens/2.28.0) (2025-10-13)
2
9
 
3
10
 
@@ -1,5 +1,5 @@
1
1
  /**
2
- * @synergy-design-system/tokens version 2.27.0
2
+ * @synergy-design-system/tokens version 2.28.0
3
3
  * SICK Global UX Foundation
4
4
  */
5
5
 
@@ -988,6 +988,11 @@ export const SynLinkUnderlineOutline: string;
988
988
  */
989
989
  export const SynOpacity50: string;
990
990
 
991
+ /**
992
+ * Maps to the css variable `--syn-overlay-background-blur`
993
+ */
994
+ export const SynOverlayBackgroundBlur: string;
995
+
991
996
  /**
992
997
  * Maps to the css variable `--syn-overlay-background-color`
993
998
  */
package/dist/js/index.js CHANGED
@@ -1,5 +1,5 @@
1
1
  /**
2
- * @synergy-design-system/tokens version 2.27.0
2
+ * @synergy-design-system/tokens version 2.28.0
3
3
  * SICK Global UX Foundation
4
4
  */
5
5
 
@@ -988,6 +988,11 @@ export const SynLinkUnderlineOutline = 'var(--syn-link-underline-outline)';
988
988
  */
989
989
  export const SynOpacity50 = 'var(--syn-opacity-50)';
990
990
 
991
+ /**
992
+ * @type {string}
993
+ */
994
+ export const SynOverlayBackgroundBlur = 'var(--syn-overlay-background-blur)';
995
+
991
996
  /**
992
997
  * @type {string}
993
998
  */
@@ -1,5 +1,5 @@
1
1
  /**
2
- * @synergy-design-system/tokens version 2.27.0
2
+ * @synergy-design-system/tokens version 2.28.0
3
3
  * SICK Global UX Foundation
4
4
  */
5
5
  $SynBorderRadiusCircle: var(--syn-border-radius-circle) !default;
@@ -199,6 +199,7 @@ $SynLinkQuietColorActive: var(--syn-link-quiet-color-active) !default;
199
199
  $SynLinkQuietColorHover: var(--syn-link-quiet-color-hover) !default;
200
200
  $SynLinkUnderlineOutline: var(--syn-link-underline-outline) !default;
201
201
  $SynOpacity50: var(--syn-opacity-50) !default;
202
+ $SynOverlayBackgroundBlur: var(--syn-overlay-background-blur) !default;
202
203
  $SynOverlayBackgroundColor: var(--syn-overlay-background-color) !default;
203
204
  $SynPanelBackgroundColor: var(--syn-panel-background-color) !default;
204
205
  $SynPanelBorderColor: var(--syn-panel-border-color) !default;
@@ -1,5 +1,5 @@
1
1
  /**
2
- * @synergy-design-system/tokens version 2.27.0
2
+ * @synergy-design-system/tokens version 2.28.0
3
3
  * SICK Global UX Foundation
4
4
  * Do not edit directly, this file was auto-generated.
5
5
  */
@@ -138,7 +138,7 @@
138
138
  --syn-input-color-hover: var(--syn-color-neutral-950);
139
139
  --syn-input-disabled-opacity: 0.5;
140
140
  --syn-input-focus-ring-color: var(--syn-color-primary-400);
141
- --syn-input-focus-ring-error: var(--syn-color-error-400);
141
+ --syn-input-focus-ring-error: var(--syn-color-error-600);
142
142
  --syn-input-focus-ring-offset: 0px;
143
143
  --syn-input-font-family: var(--syn-font-sans);
144
144
  --syn-input-font-size-large: var(--syn-font-size-large);
@@ -149,7 +149,7 @@
149
149
  --syn-input-height-medium: var(--syn-spacing-2x-large);
150
150
  --syn-input-height-small: 36px;
151
151
  --syn-input-help-text-color: var(--syn-color-neutral-800);
152
- --syn-input-help-text-color-error: var(--syn-color-error-700);
152
+ --syn-input-help-text-color-error: var(--syn-color-error-600);
153
153
  --syn-input-help-text-font-size-large: var(--syn-font-size-medium);
154
154
  --syn-input-help-text-font-size-medium: var(--syn-font-size-small);
155
155
  --syn-input-help-text-font-size-small: var(--syn-font-size-x-small);
@@ -204,7 +204,8 @@
204
204
  --syn-link-quiet-color-hover: var(--syn-interactive-quiet-color-hover);
205
205
  --syn-link-underline-outline: 7%;
206
206
  --syn-opacity-50: 0.5; /** 50% */
207
- --syn-overlay-background-color: rgba(0, 0, 0, 0.5);
207
+ --syn-overlay-background-blur: 0px;
208
+ --syn-overlay-background-color: rgba(49, 55, 58, 0.5);
208
209
  --syn-panel-background-color: var(--syn-color-neutral-0);
209
210
  --syn-panel-border-color: var(--syn-color-neutral-300);
210
211
  --syn-panel-border-radius: var(--syn-border-radius-medium);
@@ -1,5 +1,5 @@
1
1
  /**
2
- * @synergy-design-system/tokens version 2.27.0
2
+ * @synergy-design-system/tokens version 2.28.0
3
3
  * SICK Global UX Foundation
4
4
  * Do not edit directly, this file was auto-generated.
5
5
  */
@@ -138,7 +138,7 @@
138
138
  --syn-input-color-hover: var(--syn-color-neutral-950);
139
139
  --syn-input-disabled-opacity: 0.5;
140
140
  --syn-input-focus-ring-color: var(--syn-color-primary-400);
141
- --syn-input-focus-ring-error: var(--syn-color-error-400);
141
+ --syn-input-focus-ring-error: var(--syn-color-error-600);
142
142
  --syn-input-focus-ring-offset: 0px;
143
143
  --syn-input-font-family: var(--syn-font-sans);
144
144
  --syn-input-font-size-large: var(--syn-font-size-large);
@@ -149,7 +149,7 @@
149
149
  --syn-input-height-medium: var(--syn-spacing-2x-large);
150
150
  --syn-input-height-small: 36px;
151
151
  --syn-input-help-text-color: var(--syn-color-neutral-800);
152
- --syn-input-help-text-color-error: var(--syn-color-error-700);
152
+ --syn-input-help-text-color-error: var(--syn-color-error-600);
153
153
  --syn-input-help-text-font-size-large: var(--syn-font-size-medium);
154
154
  --syn-input-help-text-font-size-medium: var(--syn-font-size-small);
155
155
  --syn-input-help-text-font-size-small: var(--syn-font-size-x-small);
@@ -204,7 +204,8 @@
204
204
  --syn-link-quiet-color-hover: var(--syn-interactive-quiet-color-hover);
205
205
  --syn-link-underline-outline: 7%;
206
206
  --syn-opacity-50: 0.5; /** 50% */
207
- --syn-overlay-background-color: rgba(0, 0, 0, 0.5);
207
+ --syn-overlay-background-blur: 0px;
208
+ --syn-overlay-background-color: rgba(49, 55, 58, 0.5);
208
209
  --syn-panel-background-color: var(--syn-color-neutral-0);
209
210
  --syn-panel-border-color: var(--syn-color-neutral-300);
210
211
  --syn-panel-border-radius: var(--syn-border-radius-medium);
@@ -1,5 +1,5 @@
1
1
  /**
2
- * @synergy-design-system/tokens version 2.27.0
2
+ * @synergy-design-system/tokens version 2.28.0
3
3
  * SICK Global UX Foundation
4
4
  * Do not edit directly, this file was auto-generated.
5
5
  */
@@ -138,7 +138,7 @@
138
138
  --syn-input-color-hover: var(--syn-color-neutral-950);
139
139
  --syn-input-disabled-opacity: 0.5;
140
140
  --syn-input-focus-ring-color: var(--syn-color-primary-400);
141
- --syn-input-focus-ring-error: var(--syn-color-error-400);
141
+ --syn-input-focus-ring-error: var(--syn-color-error-600);
142
142
  --syn-input-focus-ring-offset: 0px;
143
143
  --syn-input-font-family: var(--syn-font-sans);
144
144
  --syn-input-font-size-large: var(--syn-font-size-large);
@@ -149,7 +149,7 @@
149
149
  --syn-input-height-medium: var(--syn-spacing-2x-large);
150
150
  --syn-input-height-small: 36px;
151
151
  --syn-input-help-text-color: var(--syn-color-neutral-800);
152
- --syn-input-help-text-color-error: var(--syn-color-error-700);
152
+ --syn-input-help-text-color-error: var(--syn-color-error-600);
153
153
  --syn-input-help-text-font-size-large: var(--syn-font-size-medium);
154
154
  --syn-input-help-text-font-size-medium: var(--syn-font-size-small);
155
155
  --syn-input-help-text-font-size-small: var(--syn-font-size-x-small);
@@ -204,7 +204,8 @@
204
204
  --syn-link-quiet-color-hover: var(--syn-interactive-quiet-color-hover);
205
205
  --syn-link-underline-outline: 7%;
206
206
  --syn-opacity-50: 0.5; /** 50% */
207
- --syn-overlay-background-color: rgba(0, 0, 0, 0.5);
207
+ --syn-overlay-background-blur: 0px;
208
+ --syn-overlay-background-color: rgba(49, 55, 58, 0.5);
208
209
  --syn-panel-background-color: var(--syn-color-neutral-0);
209
210
  --syn-panel-border-color: var(--syn-color-neutral-300);
210
211
  --syn-panel-border-radius: var(--syn-border-radius-medium);
@@ -1,5 +1,5 @@
1
1
  /**
2
- * @synergy-design-system/tokens version 2.27.0
2
+ * @synergy-design-system/tokens version 2.28.0
3
3
  * SICK Global UX Foundation
4
4
  * Do not edit directly, this file was auto-generated.
5
5
  */
@@ -138,7 +138,7 @@
138
138
  --syn-input-color-hover: var(--syn-color-neutral-950);
139
139
  --syn-input-disabled-opacity: 0.5;
140
140
  --syn-input-focus-ring-color: var(--syn-color-primary-400);
141
- --syn-input-focus-ring-error: var(--syn-color-error-400);
141
+ --syn-input-focus-ring-error: var(--syn-color-error-600);
142
142
  --syn-input-focus-ring-offset: 0px;
143
143
  --syn-input-font-family: var(--syn-font-sans);
144
144
  --syn-input-font-size-large: var(--syn-font-size-large);
@@ -149,7 +149,7 @@
149
149
  --syn-input-height-medium: var(--syn-spacing-2x-large);
150
150
  --syn-input-height-small: 36px;
151
151
  --syn-input-help-text-color: var(--syn-color-neutral-800);
152
- --syn-input-help-text-color-error: var(--syn-color-error-700);
152
+ --syn-input-help-text-color-error: var(--syn-color-error-600);
153
153
  --syn-input-help-text-font-size-large: var(--syn-font-size-medium);
154
154
  --syn-input-help-text-font-size-medium: var(--syn-font-size-small);
155
155
  --syn-input-help-text-font-size-small: var(--syn-font-size-x-small);
@@ -204,7 +204,8 @@
204
204
  --syn-link-quiet-color-hover: var(--syn-interactive-quiet-color-hover);
205
205
  --syn-link-underline-outline: 7%;
206
206
  --syn-opacity-50: 0.5; /** 50% */
207
- --syn-overlay-background-color: rgba(0, 0, 0, 0.5);
207
+ --syn-overlay-background-blur: 0px;
208
+ --syn-overlay-background-color: rgba(49, 55, 58, 0.5);
208
209
  --syn-panel-background-color: var(--syn-color-neutral-0);
209
210
  --syn-panel-border-color: var(--syn-color-neutral-300);
210
211
  --syn-panel-border-radius: var(--syn-border-radius-medium);
@@ -1,5 +1,5 @@
1
1
  /**
2
- * @synergy-design-system/tokens version 2.27.0
2
+ * @synergy-design-system/tokens version 2.28.0
3
3
  * SICK Global UX Foundation
4
4
  * Do not edit directly, this file was auto-generated.
5
5
  */
@@ -45,7 +45,7 @@
45
45
  --syn-color-error-900: #ffe3e4;
46
46
  --syn-color-error-950: #fff1f1;
47
47
  --syn-color-neutral-0: #000414;
48
- --syn-color-neutral-50: #00061f;
48
+ --syn-color-neutral-50: #000724;
49
49
  --syn-color-neutral-100: #000a37;
50
50
  --syn-color-neutral-200: #141e47;
51
51
  --syn-color-neutral-300: #262f55;
@@ -56,7 +56,7 @@
56
56
  --syn-color-neutral-800: #9298b6;
57
57
  --syn-color-neutral-900: #adb2c8;
58
58
  --syn-color-neutral-950: #c8ccdb;
59
- --syn-color-neutral-1000: #e3e5ed;
59
+ --syn-color-neutral-1000: #e9ebf1;
60
60
  --syn-color-primary-50: #0e275d;
61
61
  --syn-color-primary-100: #0d3f9b;
62
62
  --syn-color-primary-200: #0845c5;
@@ -138,7 +138,7 @@
138
138
  --syn-input-color-hover: var(--syn-color-neutral-1000);
139
139
  --syn-input-disabled-opacity: 0.5;
140
140
  --syn-input-focus-ring-color: var(--syn-color-primary-700);
141
- --syn-input-focus-ring-error: var(--syn-color-error-400);
141
+ --syn-input-focus-ring-error: var(--syn-color-error-600);
142
142
  --syn-input-focus-ring-offset: 0px;
143
143
  --syn-input-font-family: var(--syn-font-sans);
144
144
  --syn-input-font-size-large: var(--syn-font-size-large);
@@ -204,7 +204,8 @@
204
204
  --syn-link-quiet-color-hover: var(--syn-interactive-quiet-color-hover);
205
205
  --syn-link-underline-outline: 25%;
206
206
  --syn-opacity-50: 0.5; /** 50% */
207
- --syn-overlay-background-color: rgba(0, 0, 0, 0.5);
207
+ --syn-overlay-background-blur: 16px;
208
+ --syn-overlay-background-color: rgba(0, 10, 55, 0.6);
208
209
  --syn-panel-background-color: var(--syn-color-neutral-50);
209
210
  --syn-panel-border-color: var(--syn-color-neutral-300);
210
211
  --syn-panel-border-radius: var(--syn-border-radius-medium);
@@ -1,5 +1,5 @@
1
1
  /**
2
- * @synergy-design-system/tokens version 2.27.0
2
+ * @synergy-design-system/tokens version 2.28.0
3
3
  * SICK Global UX Foundation
4
4
  * Do not edit directly, this file was auto-generated.
5
5
  */
@@ -138,7 +138,7 @@
138
138
  --syn-input-color-hover: var(--syn-color-neutral-950);
139
139
  --syn-input-disabled-opacity: 0.5;
140
140
  --syn-input-focus-ring-color: var(--syn-color-primary-500);
141
- --syn-input-focus-ring-error: var(--syn-color-error-500);
141
+ --syn-input-focus-ring-error: var(--syn-color-error-600);
142
142
  --syn-input-focus-ring-offset: 0px;
143
143
  --syn-input-font-family: var(--syn-font-sans);
144
144
  --syn-input-font-size-large: var(--syn-font-size-large);
@@ -204,7 +204,8 @@
204
204
  --syn-link-quiet-color-hover: var(--syn-interactive-quiet-color-hover);
205
205
  --syn-link-underline-outline: 25%;
206
206
  --syn-opacity-50: 0.5; /** 50% */
207
- --syn-overlay-background-color: rgba(0, 0, 0, 0.5);
207
+ --syn-overlay-background-blur: 16px;
208
+ --syn-overlay-background-color: rgba(0, 10, 55, 0.3);
208
209
  --syn-panel-background-color: var(--syn-color-neutral-0);
209
210
  --syn-panel-border-color: #e6e1dc;
210
211
  --syn-panel-border-radius: var(--syn-border-radius-medium);
package/package.json CHANGED
@@ -25,8 +25,8 @@
25
25
  "style-dictionary": "^5.0.1",
26
26
  "stylelint": "^16.23.0",
27
27
  "typescript": "^5.8.3",
28
- "@synergy-design-system/stylelint-config-syn": "0.1.0",
29
- "@synergy-design-system/eslint-config-syn": "0.1.0"
28
+ "@synergy-design-system/eslint-config-syn": "0.1.0",
29
+ "@synergy-design-system/stylelint-config-syn": "0.1.0"
30
30
  },
31
31
  "exports": {
32
32
  ".": {
@@ -113,7 +113,7 @@
113
113
  },
114
114
  "type": "module",
115
115
  "types": "./dist/js/index.d.ts",
116
- "version": "2.28.0",
116
+ "version": "2.29.0",
117
117
  "scripts": {
118
118
  "build": "pnpm clean && node scripts/build.js",
119
119
  "build:all": "dotenvx -q run pnpm build:_all",
@@ -534,6 +534,10 @@
534
534
  "type": "color",
535
535
  "value": "{color.neutral.950}"
536
536
  },
537
+ "color-offset": {
538
+ "type": "color",
539
+ "value": "{panel.background.color}"
540
+ },
537
541
  "radius-large": {
538
542
  "type": "sizing",
539
543
  "value": "{border-radius.none}"
@@ -578,7 +582,7 @@
578
582
  },
579
583
  "error": {
580
584
  "type": "color",
581
- "value": "{color.error.400}"
585
+ "value": "{color.error.600}"
582
586
  },
583
587
  "offset": {
584
588
  "type": "sizing",
@@ -628,7 +632,7 @@
628
632
  },
629
633
  "color-error": {
630
634
  "type": "color",
631
- "value": "{color.error.700}"
635
+ "value": "{color.error.600}"
632
636
  },
633
637
  "font-size": {
634
638
  "large": {
@@ -898,9 +902,13 @@
898
902
  },
899
903
  "overlay": {
900
904
  "background": {
905
+ "blur": {
906
+ "type": "sizing",
907
+ "value": "0px"
908
+ },
901
909
  "color": {
902
910
  "type": "color",
903
- "value": "rgba(0, 0, 0, 0.50)"
911
+ "value": "rgba(49, 55, 58, 0.50)"
904
912
  }
905
913
  }
906
914
  },
@@ -1134,6 +1142,14 @@
1134
1142
  "text-inverted": {
1135
1143
  "type": "color",
1136
1144
  "value": "{color.neutral.0}"
1145
+ },
1146
+ "text-quiet": {
1147
+ "type": "color",
1148
+ "value": "{color.neutral.800}"
1149
+ },
1150
+ "text-quiet-inverted": {
1151
+ "type": "color",
1152
+ "value": "{color.neutral.200}"
1137
1153
  }
1138
1154
  }
1139
1155
  },
@@ -534,6 +534,10 @@
534
534
  "type": "color",
535
535
  "value": "{color.neutral.950}"
536
536
  },
537
+ "color-offset": {
538
+ "type": "color",
539
+ "value": "{panel.background.color}"
540
+ },
537
541
  "radius-large": {
538
542
  "type": "sizing",
539
543
  "value": "{border-radius.none}"
@@ -578,7 +582,7 @@
578
582
  },
579
583
  "error": {
580
584
  "type": "color",
581
- "value": "{color.error.400}"
585
+ "value": "{color.error.600}"
582
586
  },
583
587
  "offset": {
584
588
  "type": "sizing",
@@ -628,7 +632,7 @@
628
632
  },
629
633
  "color-error": {
630
634
  "type": "color",
631
- "value": "{color.error.700}"
635
+ "value": "{color.error.600}"
632
636
  },
633
637
  "font-size": {
634
638
  "large": {
@@ -898,9 +902,13 @@
898
902
  },
899
903
  "overlay": {
900
904
  "background": {
905
+ "blur": {
906
+ "type": "sizing",
907
+ "value": "0px"
908
+ },
901
909
  "color": {
902
910
  "type": "color",
903
- "value": "rgba(0, 0, 0, 0.50)"
911
+ "value": "rgba(49, 55, 58, 0.50)"
904
912
  }
905
913
  }
906
914
  },
@@ -1134,6 +1142,14 @@
1134
1142
  "text-inverted": {
1135
1143
  "type": "color",
1136
1144
  "value": "{color.neutral.0}"
1145
+ },
1146
+ "text-quiet": {
1147
+ "type": "color",
1148
+ "value": "{color.neutral.800}"
1149
+ },
1150
+ "text-quiet-inverted": {
1151
+ "type": "color",
1152
+ "value": "{color.neutral.200}"
1137
1153
  }
1138
1154
  }
1139
1155
  },
@@ -172,7 +172,7 @@
172
172
  },
173
173
  "50": {
174
174
  "type": "color",
175
- "value": "#00061f"
175
+ "value": "#000724"
176
176
  },
177
177
  "100": {
178
178
  "type": "color",
@@ -216,7 +216,7 @@
216
216
  },
217
217
  "1000": {
218
218
  "type": "color",
219
- "value": "#e3e5ed"
219
+ "value": "#e9ebf1"
220
220
  }
221
221
  },
222
222
  "primary": {
@@ -534,6 +534,10 @@
534
534
  "type": "color",
535
535
  "value": "{color.primary.500}"
536
536
  },
537
+ "color-offset": {
538
+ "type": "color",
539
+ "value": "{panel.background.color}"
540
+ },
537
541
  "radius-large": {
538
542
  "type": "sizing",
539
543
  "value": "{border-radius.medium}"
@@ -578,7 +582,7 @@
578
582
  },
579
583
  "error": {
580
584
  "type": "color",
581
- "value": "{color.error.400}"
585
+ "value": "{color.error.600}"
582
586
  },
583
587
  "offset": {
584
588
  "type": "sizing",
@@ -898,9 +902,13 @@
898
902
  },
899
903
  "overlay": {
900
904
  "background": {
905
+ "blur": {
906
+ "type": "sizing",
907
+ "value": "16px"
908
+ },
901
909
  "color": {
902
910
  "type": "color",
903
- "value": "rgba(0, 0, 0, 0.50)"
911
+ "value": "rgba(0, 10, 55, 0.60)"
904
912
  }
905
913
  }
906
914
  },
@@ -1134,6 +1142,14 @@
1134
1142
  "text-inverted": {
1135
1143
  "type": "color",
1136
1144
  "value": "{color.neutral.50}"
1145
+ },
1146
+ "text-quiet": {
1147
+ "type": "color",
1148
+ "value": "{color.neutral.800}"
1149
+ },
1150
+ "text-quiet-inverted": {
1151
+ "type": "color",
1152
+ "value": "{color.neutral.200}"
1137
1153
  }
1138
1154
  }
1139
1155
  },
@@ -534,6 +534,10 @@
534
534
  "type": "color",
535
535
  "value": "{color.primary.700}"
536
536
  },
537
+ "color-offset": {
538
+ "type": "color",
539
+ "value": "{panel.background.color}"
540
+ },
537
541
  "radius-large": {
538
542
  "type": "sizing",
539
543
  "value": "{border-radius.medium}"
@@ -578,7 +582,7 @@
578
582
  },
579
583
  "error": {
580
584
  "type": "color",
581
- "value": "{color.error.500}"
585
+ "value": "{color.error.600}"
582
586
  },
583
587
  "offset": {
584
588
  "type": "sizing",
@@ -898,9 +902,13 @@
898
902
  },
899
903
  "overlay": {
900
904
  "background": {
905
+ "blur": {
906
+ "type": "sizing",
907
+ "value": "16px"
908
+ },
901
909
  "color": {
902
910
  "type": "color",
903
- "value": "rgba(0, 0, 0, 0.50)"
911
+ "value": "rgba(0, 10, 55, 0.30)"
904
912
  }
905
913
  }
906
914
  },
@@ -1134,6 +1142,14 @@
1134
1142
  "text-inverted": {
1135
1143
  "type": "color",
1136
1144
  "value": "{color.neutral.0}"
1145
+ },
1146
+ "text-quiet": {
1147
+ "type": "color",
1148
+ "value": "{color.neutral.700}"
1149
+ },
1150
+ "text-quiet-inverted": {
1151
+ "type": "color",
1152
+ "value": "{color.neutral.300}"
1137
1153
  }
1138
1154
  }
1139
1155
  },