@gitlab/ui 68.4.0 → 68.6.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 (30) hide show
  1. package/CHANGELOG.md +14 -0
  2. package/dist/index.css +1 -1
  3. package/dist/index.css.map +1 -1
  4. package/dist/tokens/common_story_options.js +32 -0
  5. package/dist/tokens/css/tokens.css +122 -56
  6. package/dist/tokens/css/tokens.dark.css +2 -2
  7. package/dist/tokens/js/tokens.dark.js +1 -1
  8. package/dist/tokens/js/tokens.js +122 -56
  9. package/dist/tokens/json/tokens.dark.grouped.json +121 -55
  10. package/dist/tokens/json/tokens.dark.json +3504 -2104
  11. package/dist/tokens/json/tokens.grouped.json +121 -55
  12. package/dist/tokens/json/tokens.json +3465 -2065
  13. package/dist/tokens/scss/_tokens.dark.scss +2 -2
  14. package/dist/tokens/scss/_tokens.scss +122 -56
  15. package/dist/utils/utils.js +3 -2
  16. package/package.json +1 -1
  17. package/scss_to_js/scss_variables.js +122 -122
  18. package/scss_to_js/scss_variables.json +1265 -1265
  19. package/src/components/base/banner/banner.scss +1 -1
  20. package/src/scss/variables.scss +0 -74
  21. package/src/tokens/color.dark.tokens.json +1 -1
  22. package/src/tokens/color.dark.tokens.stories.js +42 -0
  23. package/src/tokens/color.data_viz.tokens.json +344 -0
  24. package/src/tokens/color.data_viz.tokens.stories.js +56 -0
  25. package/src/tokens/color.theme.tokens.json +412 -0
  26. package/src/tokens/color.theme.tokens.stories.js +60 -0
  27. package/src/tokens/color.tokens.json +0 -342
  28. package/src/tokens/color.tokens.stories.js +42 -0
  29. package/src/tokens/common_story_options.js +31 -0
  30. package/src/utils/utils.js +3 -3
package/dist/tokens/scss/_tokens.dark.scss CHANGED
@@ -1,6 +1,6 @@
1
1
 
2
2
  // Do not edit directly
3
- // Generated on Tue, 14 Nov 2023 09:09:01 GMT
3
+ // Generated on Wed, 15 Nov 2023 08:05:48 GMT
4
4
 
5
5
  $red-950: #fff4f3;
6
6
  $red-900: #fcf1ef;
@@ -69,5 +69,5 @@ $blue-300: #1068bf;
69
69
  $blue-200: #0b5cad;
70
70
  $blue-100: #064787;
71
71
  $blue-50: #033464;
72
+ $white: #333238;
72
73
  $black: #fff;
73
- $white: $gray-50;
package/dist/tokens/scss/_tokens.scss CHANGED
@@ -1,6 +1,6 @@
1
1
 
2
2
  // Do not edit directly
3
- // Generated on Tue, 14 Nov 2023 09:09:01 GMT
3
+ // Generated on Wed, 15 Nov 2023 08:05:48 GMT
4
4
 
5
5
  $gl-line-height-52: 3.25rem;
6
6
  $gl-line-height-44: 2.75rem;
@@ -23,61 +23,6 @@ $brand-orange-03: #e24329 !default;
23
23
  $brand-orange-02: #fc6d26 !default;
24
24
  $brand-orange-01: #fca326 !default;
25
25
  $brand-charcoal: #171321 !default;
26
- $data-viz-orange-950: #4b2707 !default;
27
- $data-viz-orange-900: #5e2f05 !default;
28
- $data-viz-orange-800: #6f3500 !default;
29
- $data-viz-orange-700: #92430a !default;
30
- $data-viz-orange-600: #b14f18 !default;
31
- $data-viz-orange-500: #c95d2e !default;
32
- $data-viz-orange-400: #e07e41 !default;
33
- $data-viz-orange-300: #e99b60 !default;
34
- $data-viz-orange-200: #eebd8c !default;
35
- $data-viz-orange-100: #f5d6b3 !default;
36
- $data-viz-orange-50: #fae8d1 !default;
37
- $data-viz-magenta-950: #541d31 !default;
38
- $data-viz-magenta-900: #661e3a !default;
39
- $data-viz-magenta-800: #7c214f !default;
40
- $data-viz-magenta-700: #9a2e5d !default;
41
- $data-viz-magenta-600: #b93d71 !default;
42
- $data-viz-magenta-500: #cf4d81 !default;
43
- $data-viz-magenta-400: #e86e9a !default;
44
- $data-viz-magenta-300: #f88aaf !default;
45
- $data-viz-magenta-200: #fcacc5 !default;
46
- $data-viz-magenta-100: #ffccdb !default;
47
- $data-viz-magenta-50: #ffe3eb !default;
48
- $data-viz-blue-950: #2a2b59 !default;
49
- $data-viz-blue-900: #303470 !default;
50
- $data-viz-blue-800: #374291 !default;
51
- $data-viz-blue-700: #3f51ae !default;
52
- $data-viz-blue-600: #4e65cd !default;
53
- $data-viz-blue-500: #617ae2 !default;
54
- $data-viz-blue-400: #7992f5 !default;
55
- $data-viz-blue-300: #97acff !default;
56
- $data-viz-blue-200: #b7c6ff !default;
57
- $data-viz-blue-100: #d2dcff !default;
58
- $data-viz-blue-50: #e9ebff !default;
59
- $data-viz-aqua-950: #00344b !default;
60
- $data-viz-aqua-900: #004059 !default;
61
- $data-viz-aqua-800: #00516c !default;
62
- $data-viz-aqua-700: #006381 !default;
63
- $data-viz-aqua-600: #007b9b !default;
64
- $data-viz-aqua-500: #0090b1 !default;
65
- $data-viz-aqua-400: #00acc4 !default;
66
- $data-viz-aqua-300: #32c5d2 !default;
67
- $data-viz-aqua-200: #5edee3 !default;
68
- $data-viz-aqua-100: #93f2ef !default;
69
- $data-viz-aqua-50: #b5fefd !default;
70
- $data-viz-green-950: #133a03 !default;
71
- $data-viz-green-900: #1a4500 !default;
72
- $data-viz-green-800: #275600 !default;
73
- $data-viz-green-700: #366800 !default;
74
- $data-viz-green-600: #4e7f0e !default;
75
- $data-viz-green-500: #619025 !default;
76
- $data-viz-green-400: #81ac41 !default;
77
- $data-viz-green-300: #94c25e !default;
78
- $data-viz-green-200: #b0d97b !default;
79
- $data-viz-green-100: #c6ed94 !default;
80
- $data-viz-green-50: #ddfab7 !default;
81
26
  $red-950: #4d0a00 !default;
82
27
  $red-900: #660e00 !default;
83
28
  $red-800: #8d1300 !default;
@@ -147,3 +92,124 @@ $blue-100: #cbe2f9 !default;
147
92
  $blue-50: #e9f3fc !default;
148
93
  $white: #fff !default;
149
94
  $black: #000 !default;
95
+ $theme-light-red-950: #5c1105;
96
+ $theme-light-red-900: #751709;
97
+ $theme-light-red-800: #8b2212;
98
+ $theme-light-red-700: #a02e1c;
99
+ $theme-light-red-600: #b53a26;
100
+ $theme-light-red-500: #c24b38;
101
+ $theme-light-red-400: #d36250;
102
+ $theme-light-red-300: #e07f6f;
103
+ $theme-light-red-200: #ebada2;
104
+ $theme-light-red-100: #f6d9d5;
105
+ $theme-light-red-50: #faf2f1;
106
+ $theme-red-950: #380700;
107
+ $theme-red-900: #580d02;
108
+ $theme-red-800: #761405;
109
+ $theme-red-700: #8f2110;
110
+ $theme-red-600: #a13322;
111
+ $theme-red-500: #ad4a3b;
112
+ $theme-red-400: #c66e60;
113
+ $theme-red-300: #d59086;
114
+ $theme-red-200: #e3bab5;
115
+ $theme-red-100: #ecd3d0;
116
+ $theme-red-50: #f4e9e7;
117
+ $theme-green-950: #052e19;
118
+ $theme-green-900: #0e4328;
119
+ $theme-green-800: #155635;
120
+ $theme-green-700: #1b653f;
121
+ $theme-green-600: #25744c;
122
+ $theme-green-500: #308258;
123
+ $theme-green-400: #499767;
124
+ $theme-green-300: #69af7d;
125
+ $theme-green-200: #8cc497;
126
+ $theme-green-100: #b1d6b5;
127
+ $theme-green-50: #dde9de;
128
+ $theme-light-blue-950: #0a3764;
129
+ $theme-light-blue-900: #0c4277;
130
+ $theme-light-blue-800: #0e4d8d;
131
+ $theme-light-blue-700: #145aa1;
132
+ $theme-light-blue-600: #2268ae;
133
+ $theme-light-blue-500: #3476b9;
134
+ $theme-light-blue-400: #4f8bc7;
135
+ $theme-light-blue-300: #74a3d3;
136
+ $theme-light-blue-200: #a0bedc;
137
+ $theme-light-blue-100: #c1d4e6;
138
+ $theme-light-blue-50: #dde6ee;
139
+ $theme-blue-950: #04101c;
140
+ $theme-blue-900: #0b2640;
141
+ $theme-blue-800: #153c63;
142
+ $theme-blue-700: #235180;
143
+ $theme-blue-600: #346596;
144
+ $theme-blue-500: #4977a5;
145
+ $theme-blue-400: #628eb9;
146
+ $theme-blue-300: #81a5c9;
147
+ $theme-blue-200: #a6bdd5;
148
+ $theme-blue-100: #b9cadc;
149
+ $theme-blue-50: #cdd8e3;
150
+ $theme-indigo-950: #14143d;
151
+ $theme-indigo-900: #222261;
152
+ $theme-indigo-800: #303083;
153
+ $theme-indigo-700: #41419f;
154
+ $theme-indigo-600: #5252b5;
155
+ $theme-indigo-500: #6666c4;
156
+ $theme-indigo-400: #8181d7;
157
+ $theme-indigo-300: #a2a2e6;
158
+ $theme-indigo-200: #c7c7f2;
159
+ $theme-indigo-100: #dbdbf8;
160
+ $theme-indigo-50: #f1f1ff;
161
+ $data-viz-orange-950: #4b2707 !default;
162
+ $data-viz-orange-900: #5e2f05 !default;
163
+ $data-viz-orange-800: #6f3500 !default;
164
+ $data-viz-orange-700: #92430a !default;
165
+ $data-viz-orange-600: #b14f18 !default;
166
+ $data-viz-orange-500: #c95d2e !default;
167
+ $data-viz-orange-400: #e07e41 !default;
168
+ $data-viz-orange-300: #e99b60 !default;
169
+ $data-viz-orange-200: #eebd8c !default;
170
+ $data-viz-orange-100: #f5d6b3 !default;
171
+ $data-viz-orange-50: #fae8d1 !default;
172
+ $data-viz-magenta-950: #541d31 !default;
173
+ $data-viz-magenta-900: #661e3a !default;
174
+ $data-viz-magenta-800: #7c214f !default;
175
+ $data-viz-magenta-700: #9a2e5d !default;
176
+ $data-viz-magenta-600: #b93d71 !default;
177
+ $data-viz-magenta-500: #cf4d81 !default;
178
+ $data-viz-magenta-400: #e86e9a !default;
179
+ $data-viz-magenta-300: #f88aaf !default;
180
+ $data-viz-magenta-200: #fcacc5 !default;
181
+ $data-viz-magenta-100: #ffccdb !default;
182
+ $data-viz-magenta-50: #ffe3eb !default;
183
+ $data-viz-blue-950: #2a2b59 !default;
184
+ $data-viz-blue-900: #303470 !default;
185
+ $data-viz-blue-800: #374291 !default;
186
+ $data-viz-blue-700: #3f51ae !default;
187
+ $data-viz-blue-600: #4e65cd !default;
188
+ $data-viz-blue-500: #617ae2 !default;
189
+ $data-viz-blue-400: #7992f5 !default;
190
+ $data-viz-blue-300: #97acff !default;
191
+ $data-viz-blue-200: #b7c6ff !default;
192
+ $data-viz-blue-100: #d2dcff !default;
193
+ $data-viz-blue-50: #e9ebff !default;
194
+ $data-viz-aqua-950: #00344b !default;
195
+ $data-viz-aqua-900: #004059 !default;
196
+ $data-viz-aqua-800: #00516c !default;
197
+ $data-viz-aqua-700: #006381 !default;
198
+ $data-viz-aqua-600: #007b9b !default;
199
+ $data-viz-aqua-500: #0090b1 !default;
200
+ $data-viz-aqua-400: #00acc4 !default;
201
+ $data-viz-aqua-300: #32c5d2 !default;
202
+ $data-viz-aqua-200: #5edee3 !default;
203
+ $data-viz-aqua-100: #93f2ef !default;
204
+ $data-viz-aqua-50: #b5fefd !default;
205
+ $data-viz-green-950: #133a03 !default;
206
+ $data-viz-green-900: #1a4500 !default;
207
+ $data-viz-green-800: #275600 !default;
208
+ $data-viz-green-700: #366800 !default;
209
+ $data-viz-green-600: #4e7f0e !default;
210
+ $data-viz-green-500: #619025 !default;
211
+ $data-viz-green-400: #81ac41 !default;
212
+ $data-viz-green-300: #94c25e !default;
213
+ $data-viz-green-200: #b0d97b !default;
214
+ $data-viz-green-100: #c6ed94 !default;
215
+ $data-viz-green-50: #ddfab7 !default;
package/dist/utils/utils.js CHANGED
@@ -57,6 +57,7 @@ function relativeLuminance(rgb) {
57
57
  return 0.2126 * toSrgb(rgb[0]) + 0.7152 * toSrgb(rgb[1]) + 0.0722 * toSrgb(rgb[2]);
58
58
  }
59
59
  function colorFromBackground(backgroundColor) {
60
+ let contrastRatio = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 2.4;
60
61
  let color;
61
62
  const lightColor = rgbFromHex('#FFFFFF');
62
63
  const darkColor = rgbFromHex('#1f1e24');
@@ -73,9 +74,9 @@ function colorFromBackground(backgroundColor) {
73
74
  const contrastLight = (lightLuminance + 0.05) / (luminance + 0.05);
74
75
  const contrastDark = (luminance + 0.05) / (darkLuminance + 0.05);
75
76
 
76
- // Using a threshold contrast of 2.4 instead of 3
77
+ // Using a default threshold contrast of 2.4 instead of 3
77
78
  // as this will solve weird color combinations in the mid tones
78
- return contrastLight >= 2.4 || contrastLight > contrastDark ? labelColorOptions.light : labelColorOptions.dark;
79
+ return contrastLight >= contrastRatio || contrastLight > contrastDark ? labelColorOptions.light : labelColorOptions.dark;
79
80
  }
80
81
  function uid() {
81
82
  return Math.random().toString(36).substring(2);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gitlab/ui",
3
- "version": "68.4.0",
3
+ "version": "68.6.0",
4
4
  "description": "GitLab UI Components",
5
5
  "license": "MIT",
6
6
  "main": "dist/index.js",
package/scss_to_js/scss_variables.js CHANGED
@@ -38,72 +38,6 @@ export const whiteNormal = '#f0f0f0'
38
38
  export const whiteDark = '#eaeaea'
39
39
  export const whiteTransparent = 'rgba(255, 255, 255, 0.8)'
40
40
  export const transparentRgba = 'rgba(255, 255, 255, 0)'
41
- export const themeIndigo50 = '#f1f1ff'
42
- export const themeIndigo100 = '#dbdbf8'
43
- export const themeIndigo200 = '#c7c7f2'
44
- export const themeIndigo300 = '#a2a2e6'
45
- export const themeIndigo400 = '#8181d7'
46
- export const themeIndigo500 = '#6666c4'
47
- export const themeIndigo600 = '#5252b5'
48
- export const themeIndigo700 = '#41419f'
49
- export const themeIndigo800 = '#303083'
50
- export const themeIndigo900 = '#222261'
51
- export const themeIndigo950 = '#14143d'
52
- export const themeBlue50 = '#cdd8e3'
53
- export const themeBlue100 = '#b9cadc'
54
- export const themeBlue200 = '#a6bdd5'
55
- export const themeBlue300 = '#81a5c9'
56
- export const themeBlue400 = '#628eb9'
57
- export const themeBlue500 = '#4977a5'
58
- export const themeBlue600 = '#346596'
59
- export const themeBlue700 = '#235180'
60
- export const themeBlue800 = '#153c63'
61
- export const themeBlue900 = '#0b2640'
62
- export const themeBlue950 = '#04101c'
63
- export const themeLightBlue50 = '#dde6ee'
64
- export const themeLightBlue100 = '#c1d4e6'
65
- export const themeLightBlue200 = '#a0bedc'
66
- export const themeLightBlue300 = '#74a3d3'
67
- export const themeLightBlue400 = '#4f8bc7'
68
- export const themeLightBlue500 = '#3476b9'
69
- export const themeLightBlue600 = '#2268ae'
70
- export const themeLightBlue700 = '#145aa1'
71
- export const themeLightBlue800 = '#0e4d8d'
72
- export const themeLightBlue900 = '#0c4277'
73
- export const themeLightBlue950 = '#0a3764'
74
- export const themeGreen50 = '#dde9de'
75
- export const themeGreen100 = '#b1d6b5'
76
- export const themeGreen200 = '#8cc497'
77
- export const themeGreen300 = '#69af7d'
78
- export const themeGreen400 = '#499767'
79
- export const themeGreen500 = '#308258'
80
- export const themeGreen600 = '#25744c'
81
- export const themeGreen700 = '#1b653f'
82
- export const themeGreen800 = '#155635'
83
- export const themeGreen900 = '#0e4328'
84
- export const themeGreen950 = '#052e19'
85
- export const themeRed50 = '#f4e9e7'
86
- export const themeRed100 = '#ecd3d0'
87
- export const themeRed200 = '#e3bab5'
88
- export const themeRed300 = '#d59086'
89
- export const themeRed400 = '#c66e60'
90
- export const themeRed500 = '#ad4a3b'
91
- export const themeRed600 = '#a13322'
92
- export const themeRed700 = '#8f2110'
93
- export const themeRed800 = '#761405'
94
- export const themeRed900 = '#580d02'
95
- export const themeRed950 = '#380700'
96
- export const themeLightRed50 = '#faf2f1'
97
- export const themeLightRed100 = '#f6d9d5'
98
- export const themeLightRed200 = '#ebada2'
99
- export const themeLightRed300 = '#e07f6f'
100
- export const themeLightRed400 = '#d36250'
101
- export const themeLightRed500 = '#c24b38'
102
- export const themeLightRed600 = '#b53a26'
103
- export const themeLightRed700 = '#a02e1c'
104
- export const themeLightRed800 = '#8b2212'
105
- export const themeLightRed900 = '#751709'
106
- export const themeLightRed950 = '#5c1105'
107
41
  export const tGrayA02 = 'rgba(31, 30, 36, 0.02)'
108
42
  export const tGrayA04 = 'rgba(31, 30, 36, 0.04)'
109
43
  export const tGrayA06 = 'rgba(31, 30, 36, 0.06)'
@@ -260,61 +194,6 @@ export const brandOrange03 = '#e24329'
260
194
  export const brandOrange02 = '#fc6d26'
261
195
  export const brandOrange01 = '#fca326'
262
196
  export const brandCharcoal = '#171321'
263
- export const dataVizOrange950 = '#4b2707'
264
- export const dataVizOrange900 = '#5e2f05'
265
- export const dataVizOrange800 = '#6f3500'
266
- export const dataVizOrange700 = '#92430a'
267
- export const dataVizOrange600 = '#b14f18'
268
- export const dataVizOrange500 = '#c95d2e'
269
- export const dataVizOrange400 = '#e07e41'
270
- export const dataVizOrange300 = '#e99b60'
271
- export const dataVizOrange200 = '#eebd8c'
272
- export const dataVizOrange100 = '#f5d6b3'
273
- export const dataVizOrange50 = '#fae8d1'
274
- export const dataVizMagenta950 = '#541d31'
275
- export const dataVizMagenta900 = '#661e3a'
276
- export const dataVizMagenta800 = '#7c214f'
277
- export const dataVizMagenta700 = '#9a2e5d'
278
- export const dataVizMagenta600 = '#b93d71'
279
- export const dataVizMagenta500 = '#cf4d81'
280
- export const dataVizMagenta400 = '#e86e9a'
281
- export const dataVizMagenta300 = '#f88aaf'
282
- export const dataVizMagenta200 = '#fcacc5'
283
- export const dataVizMagenta100 = '#ffccdb'
284
- export const dataVizMagenta50 = '#ffe3eb'
285
- export const dataVizBlue950 = '#2a2b59'
286
- export const dataVizBlue900 = '#303470'
287
- export const dataVizBlue800 = '#374291'
288
- export const dataVizBlue700 = '#3f51ae'
289
- export const dataVizBlue600 = '#4e65cd'
290
- export const dataVizBlue500 = '#617ae2'
291
- export const dataVizBlue400 = '#7992f5'
292
- export const dataVizBlue300 = '#97acff'
293
- export const dataVizBlue200 = '#b7c6ff'
294
- export const dataVizBlue100 = '#d2dcff'
295
- export const dataVizBlue50 = '#e9ebff'
296
- export const dataVizAqua950 = '#00344b'
297
- export const dataVizAqua900 = '#004059'
298
- export const dataVizAqua800 = '#00516c'
299
- export const dataVizAqua700 = '#006381'
300
- export const dataVizAqua600 = '#007b9b'
301
- export const dataVizAqua500 = '#0090b1'
302
- export const dataVizAqua400 = '#00acc4'
303
- export const dataVizAqua300 = '#32c5d2'
304
- export const dataVizAqua200 = '#5edee3'
305
- export const dataVizAqua100 = '#93f2ef'
306
- export const dataVizAqua50 = '#b5fefd'
307
- export const dataVizGreen950 = '#133a03'
308
- export const dataVizGreen900 = '#1a4500'
309
- export const dataVizGreen800 = '#275600'
310
- export const dataVizGreen700 = '#366800'
311
- export const dataVizGreen600 = '#4e7f0e'
312
- export const dataVizGreen500 = '#619025'
313
- export const dataVizGreen400 = '#81ac41'
314
- export const dataVizGreen300 = '#94c25e'
315
- export const dataVizGreen200 = '#b0d97b'
316
- export const dataVizGreen100 = '#c6ed94'
317
- export const dataVizGreen50 = '#ddfab7'
318
197
  export const red950 = '#4d0a00'
319
198
  export const red900 = '#660e00'
320
199
  export const red800 = '#8d1300'
@@ -383,4 +262,125 @@ export const blue200 = '#9dc7f1'
383
262
  export const blue100 = '#cbe2f9'
384
263
  export const blue50 = '#e9f3fc'
385
264
  export const white = '#fff'
386
- export const black = '#000'
265
+ export const black = '#000'
266
+ export const themeLightRed950 = '#5c1105'
267
+ export const themeLightRed900 = '#751709'
268
+ export const themeLightRed800 = '#8b2212'
269
+ export const themeLightRed700 = '#a02e1c'
270
+ export const themeLightRed600 = '#b53a26'
271
+ export const themeLightRed500 = '#c24b38'
272
+ export const themeLightRed400 = '#d36250'
273
+ export const themeLightRed300 = '#e07f6f'
274
+ export const themeLightRed200 = '#ebada2'
275
+ export const themeLightRed100 = '#f6d9d5'
276
+ export const themeLightRed50 = '#faf2f1'
277
+ export const themeRed950 = '#380700'
278
+ export const themeRed900 = '#580d02'
279
+ export const themeRed800 = '#761405'
280
+ export const themeRed700 = '#8f2110'
281
+ export const themeRed600 = '#a13322'
282
+ export const themeRed500 = '#ad4a3b'
283
+ export const themeRed400 = '#c66e60'
284
+ export const themeRed300 = '#d59086'
285
+ export const themeRed200 = '#e3bab5'
286
+ export const themeRed100 = '#ecd3d0'
287
+ export const themeRed50 = '#f4e9e7'
288
+ export const themeGreen950 = '#052e19'
289
+ export const themeGreen900 = '#0e4328'
290
+ export const themeGreen800 = '#155635'
291
+ export const themeGreen700 = '#1b653f'
292
+ export const themeGreen600 = '#25744c'
293
+ export const themeGreen500 = '#308258'
294
+ export const themeGreen400 = '#499767'
295
+ export const themeGreen300 = '#69af7d'
296
+ export const themeGreen200 = '#8cc497'
297
+ export const themeGreen100 = '#b1d6b5'
298
+ export const themeGreen50 = '#dde9de'
299
+ export const themeLightBlue950 = '#0a3764'
300
+ export const themeLightBlue900 = '#0c4277'
301
+ export const themeLightBlue800 = '#0e4d8d'
302
+ export const themeLightBlue700 = '#145aa1'
303
+ export const themeLightBlue600 = '#2268ae'
304
+ export const themeLightBlue500 = '#3476b9'
305
+ export const themeLightBlue400 = '#4f8bc7'
306
+ export const themeLightBlue300 = '#74a3d3'
307
+ export const themeLightBlue200 = '#a0bedc'
308
+ export const themeLightBlue100 = '#c1d4e6'
309
+ export const themeLightBlue50 = '#dde6ee'
310
+ export const themeBlue950 = '#04101c'
311
+ export const themeBlue900 = '#0b2640'
312
+ export const themeBlue800 = '#153c63'
313
+ export const themeBlue700 = '#235180'
314
+ export const themeBlue600 = '#346596'
315
+ export const themeBlue500 = '#4977a5'
316
+ export const themeBlue400 = '#628eb9'
317
+ export const themeBlue300 = '#81a5c9'
318
+ export const themeBlue200 = '#a6bdd5'
319
+ export const themeBlue100 = '#b9cadc'
320
+ export const themeBlue50 = '#cdd8e3'
321
+ export const themeIndigo950 = '#14143d'
322
+ export const themeIndigo900 = '#222261'
323
+ export const themeIndigo800 = '#303083'
324
+ export const themeIndigo700 = '#41419f'
325
+ export const themeIndigo600 = '#5252b5'
326
+ export const themeIndigo500 = '#6666c4'
327
+ export const themeIndigo400 = '#8181d7'
328
+ export const themeIndigo300 = '#a2a2e6'
329
+ export const themeIndigo200 = '#c7c7f2'
330
+ export const themeIndigo100 = '#dbdbf8'
331
+ export const themeIndigo50 = '#f1f1ff'
332
+ export const dataVizOrange950 = '#4b2707'
333
+ export const dataVizOrange900 = '#5e2f05'
334
+ export const dataVizOrange800 = '#6f3500'
335
+ export const dataVizOrange700 = '#92430a'
336
+ export const dataVizOrange600 = '#b14f18'
337
+ export const dataVizOrange500 = '#c95d2e'
338
+ export const dataVizOrange400 = '#e07e41'
339
+ export const dataVizOrange300 = '#e99b60'
340
+ export const dataVizOrange200 = '#eebd8c'
341
+ export const dataVizOrange100 = '#f5d6b3'
342
+ export const dataVizOrange50 = '#fae8d1'
343
+ export const dataVizMagenta950 = '#541d31'
344
+ export const dataVizMagenta900 = '#661e3a'
345
+ export const dataVizMagenta800 = '#7c214f'
346
+ export const dataVizMagenta700 = '#9a2e5d'
347
+ export const dataVizMagenta600 = '#b93d71'
348
+ export const dataVizMagenta500 = '#cf4d81'
349
+ export const dataVizMagenta400 = '#e86e9a'
350
+ export const dataVizMagenta300 = '#f88aaf'
351
+ export const dataVizMagenta200 = '#fcacc5'
352
+ export const dataVizMagenta100 = '#ffccdb'
353
+ export const dataVizMagenta50 = '#ffe3eb'
354
+ export const dataVizBlue950 = '#2a2b59'
355
+ export const dataVizBlue900 = '#303470'
356
+ export const dataVizBlue800 = '#374291'
357
+ export const dataVizBlue700 = '#3f51ae'
358
+ export const dataVizBlue600 = '#4e65cd'
359
+ export const dataVizBlue500 = '#617ae2'
360
+ export const dataVizBlue400 = '#7992f5'
361
+ export const dataVizBlue300 = '#97acff'
362
+ export const dataVizBlue200 = '#b7c6ff'
363
+ export const dataVizBlue100 = '#d2dcff'
364
+ export const dataVizBlue50 = '#e9ebff'
365
+ export const dataVizAqua950 = '#00344b'
366
+ export const dataVizAqua900 = '#004059'
367
+ export const dataVizAqua800 = '#00516c'
368
+ export const dataVizAqua700 = '#006381'
369
+ export const dataVizAqua600 = '#007b9b'
370
+ export const dataVizAqua500 = '#0090b1'
371
+ export const dataVizAqua400 = '#00acc4'
372
+ export const dataVizAqua300 = '#32c5d2'
373
+ export const dataVizAqua200 = '#5edee3'
374
+ export const dataVizAqua100 = '#93f2ef'
375
+ export const dataVizAqua50 = '#b5fefd'
376
+ export const dataVizGreen950 = '#133a03'
377
+ export const dataVizGreen900 = '#1a4500'
378
+ export const dataVizGreen800 = '#275600'
379
+ export const dataVizGreen700 = '#366800'
380
+ export const dataVizGreen600 = '#4e7f0e'
381
+ export const dataVizGreen500 = '#619025'
382
+ export const dataVizGreen400 = '#81ac41'
383
+ export const dataVizGreen300 = '#94c25e'
384
+ export const dataVizGreen200 = '#b0d97b'
385
+ export const dataVizGreen100 = '#c6ed94'
386
+ export const dataVizGreen50 = '#ddfab7'