@hero-design/colors 7.7.0 → 7.8.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 (40) hide show
  1. package/.eslintrc +10 -0
  2. package/.turbo/turbo-build.log +11 -2
  3. package/es/index.js +964 -77
  4. package/lib/index.js +978 -77
  5. package/package.json +5 -1
  6. package/rollup.config.js +3 -2
  7. package/src/colorScales/createColorScales.ts +49 -0
  8. package/src/colorScales/index.ts +49 -0
  9. package/src/defaultMobilePalette/index.ts +57 -0
  10. package/src/defaultWebPalette/index.ts +105 -0
  11. package/src/eBensPalette/index.ts +48 -0
  12. package/src/index.ts +20 -86
  13. package/src/jobsPalette/index.ts +13 -0
  14. package/src/swagPalette/index.ts +22 -0
  15. package/src/walletPalette/index.ts +19 -0
  16. package/src/workPalette/index.ts +16 -0
  17. package/types/baseColors/index.d.ts +45 -0
  18. package/types/baseColors/utils.d.ts +10 -0
  19. package/types/colorScales/createColorScales.d.ts +10 -0
  20. package/types/colorScales/createColorScales.js +34 -0
  21. package/types/colorScales/index.d.ts +43 -0
  22. package/types/colorScales/index.js +43 -0
  23. package/types/defaultMobilePalette/index.d.ts +31 -0
  24. package/types/defaultMobilePalette/index.js +32 -0
  25. package/types/defaultWebPalette/index.d.ts +87 -0
  26. package/types/defaultWebPalette/index.js +89 -0
  27. package/types/eBensPalette/index.d.ts +44 -0
  28. package/types/eBensPalette/index.js +24 -0
  29. package/types/ehBrand/index.d.ts +87 -0
  30. package/types/finTechBrand/index.d.ts +2 -0
  31. package/types/index.d.ts +10 -87
  32. package/types/index.js +10 -0
  33. package/types/jobsPalette/index.d.ts +32 -0
  34. package/types/jobsPalette/index.js +9 -0
  35. package/types/swagPalette/index.d.ts +41 -0
  36. package/types/swagPalette/index.js +17 -0
  37. package/types/walletPalette/index.d.ts +38 -0
  38. package/types/walletPalette/index.js +14 -0
  39. package/types/workPalette/index.d.ts +36 -0
  40. package/types/workPalette/index.js +12 -0
package/es/index.js CHANGED
@@ -1,88 +1,975 @@
1
- const palette = {
2
- black: '#000000',
1
+ import hex2Rgb from 'hex-rgb';
2
+
3
+ var colorName = {
4
+ "aliceblue": [240, 248, 255],
5
+ "antiquewhite": [250, 235, 215],
6
+ "aqua": [0, 255, 255],
7
+ "aquamarine": [127, 255, 212],
8
+ "azure": [240, 255, 255],
9
+ "beige": [245, 245, 220],
10
+ "bisque": [255, 228, 196],
11
+ "black": [0, 0, 0],
12
+ "blanchedalmond": [255, 235, 205],
13
+ "blue": [0, 0, 255],
14
+ "blueviolet": [138, 43, 226],
15
+ "brown": [165, 42, 42],
16
+ "burlywood": [222, 184, 135],
17
+ "cadetblue": [95, 158, 160],
18
+ "chartreuse": [127, 255, 0],
19
+ "chocolate": [210, 105, 30],
20
+ "coral": [255, 127, 80],
21
+ "cornflowerblue": [100, 149, 237],
22
+ "cornsilk": [255, 248, 220],
23
+ "crimson": [220, 20, 60],
24
+ "cyan": [0, 255, 255],
25
+ "darkblue": [0, 0, 139],
26
+ "darkcyan": [0, 139, 139],
27
+ "darkgoldenrod": [184, 134, 11],
28
+ "darkgray": [169, 169, 169],
29
+ "darkgreen": [0, 100, 0],
30
+ "darkgrey": [169, 169, 169],
31
+ "darkkhaki": [189, 183, 107],
32
+ "darkmagenta": [139, 0, 139],
33
+ "darkolivegreen": [85, 107, 47],
34
+ "darkorange": [255, 140, 0],
35
+ "darkorchid": [153, 50, 204],
36
+ "darkred": [139, 0, 0],
37
+ "darksalmon": [233, 150, 122],
38
+ "darkseagreen": [143, 188, 143],
39
+ "darkslateblue": [72, 61, 139],
40
+ "darkslategray": [47, 79, 79],
41
+ "darkslategrey": [47, 79, 79],
42
+ "darkturquoise": [0, 206, 209],
43
+ "darkviolet": [148, 0, 211],
44
+ "deeppink": [255, 20, 147],
45
+ "deepskyblue": [0, 191, 255],
46
+ "dimgray": [105, 105, 105],
47
+ "dimgrey": [105, 105, 105],
48
+ "dodgerblue": [30, 144, 255],
49
+ "firebrick": [178, 34, 34],
50
+ "floralwhite": [255, 250, 240],
51
+ "forestgreen": [34, 139, 34],
52
+ "fuchsia": [255, 0, 255],
53
+ "gainsboro": [220, 220, 220],
54
+ "ghostwhite": [248, 248, 255],
55
+ "gold": [255, 215, 0],
56
+ "goldenrod": [218, 165, 32],
57
+ "gray": [128, 128, 128],
58
+ "green": [0, 128, 0],
59
+ "greenyellow": [173, 255, 47],
60
+ "grey": [128, 128, 128],
61
+ "honeydew": [240, 255, 240],
62
+ "hotpink": [255, 105, 180],
63
+ "indianred": [205, 92, 92],
64
+ "indigo": [75, 0, 130],
65
+ "ivory": [255, 255, 240],
66
+ "khaki": [240, 230, 140],
67
+ "lavender": [230, 230, 250],
68
+ "lavenderblush": [255, 240, 245],
69
+ "lawngreen": [124, 252, 0],
70
+ "lemonchiffon": [255, 250, 205],
71
+ "lightblue": [173, 216, 230],
72
+ "lightcoral": [240, 128, 128],
73
+ "lightcyan": [224, 255, 255],
74
+ "lightgoldenrodyellow": [250, 250, 210],
75
+ "lightgray": [211, 211, 211],
76
+ "lightgreen": [144, 238, 144],
77
+ "lightgrey": [211, 211, 211],
78
+ "lightpink": [255, 182, 193],
79
+ "lightsalmon": [255, 160, 122],
80
+ "lightseagreen": [32, 178, 170],
81
+ "lightskyblue": [135, 206, 250],
82
+ "lightslategray": [119, 136, 153],
83
+ "lightslategrey": [119, 136, 153],
84
+ "lightsteelblue": [176, 196, 222],
85
+ "lightyellow": [255, 255, 224],
86
+ "lime": [0, 255, 0],
87
+ "limegreen": [50, 205, 50],
88
+ "linen": [250, 240, 230],
89
+ "magenta": [255, 0, 255],
90
+ "maroon": [128, 0, 0],
91
+ "mediumaquamarine": [102, 205, 170],
92
+ "mediumblue": [0, 0, 205],
93
+ "mediumorchid": [186, 85, 211],
94
+ "mediumpurple": [147, 112, 219],
95
+ "mediumseagreen": [60, 179, 113],
96
+ "mediumslateblue": [123, 104, 238],
97
+ "mediumspringgreen": [0, 250, 154],
98
+ "mediumturquoise": [72, 209, 204],
99
+ "mediumvioletred": [199, 21, 133],
100
+ "midnightblue": [25, 25, 112],
101
+ "mintcream": [245, 255, 250],
102
+ "mistyrose": [255, 228, 225],
103
+ "moccasin": [255, 228, 181],
104
+ "navajowhite": [255, 222, 173],
105
+ "navy": [0, 0, 128],
106
+ "oldlace": [253, 245, 230],
107
+ "olive": [128, 128, 0],
108
+ "olivedrab": [107, 142, 35],
109
+ "orange": [255, 165, 0],
110
+ "orangered": [255, 69, 0],
111
+ "orchid": [218, 112, 214],
112
+ "palegoldenrod": [238, 232, 170],
113
+ "palegreen": [152, 251, 152],
114
+ "paleturquoise": [175, 238, 238],
115
+ "palevioletred": [219, 112, 147],
116
+ "papayawhip": [255, 239, 213],
117
+ "peachpuff": [255, 218, 185],
118
+ "peru": [205, 133, 63],
119
+ "pink": [255, 192, 203],
120
+ "plum": [221, 160, 221],
121
+ "powderblue": [176, 224, 230],
122
+ "purple": [128, 0, 128],
123
+ "rebeccapurple": [102, 51, 153],
124
+ "red": [255, 0, 0],
125
+ "rosybrown": [188, 143, 143],
126
+ "royalblue": [65, 105, 225],
127
+ "saddlebrown": [139, 69, 19],
128
+ "salmon": [250, 128, 114],
129
+ "sandybrown": [244, 164, 96],
130
+ "seagreen": [46, 139, 87],
131
+ "seashell": [255, 245, 238],
132
+ "sienna": [160, 82, 45],
133
+ "silver": [192, 192, 192],
134
+ "skyblue": [135, 206, 235],
135
+ "slateblue": [106, 90, 205],
136
+ "slategray": [112, 128, 144],
137
+ "slategrey": [112, 128, 144],
138
+ "snow": [255, 250, 250],
139
+ "springgreen": [0, 255, 127],
140
+ "steelblue": [70, 130, 180],
141
+ "tan": [210, 180, 140],
142
+ "teal": [0, 128, 128],
143
+ "thistle": [216, 191, 216],
144
+ "tomato": [255, 99, 71],
145
+ "turquoise": [64, 224, 208],
146
+ "violet": [238, 130, 238],
147
+ "wheat": [245, 222, 179],
148
+ "white": [255, 255, 255],
149
+ "whitesmoke": [245, 245, 245],
150
+ "yellow": [255, 255, 0],
151
+ "yellowgreen": [154, 205, 50]
152
+ };
153
+
154
+ const pattern$8 = /^#([a-f0-9]{3,4}|[a-f0-9]{4}(?:[a-f0-9]{2}){1,2})\b$/;
155
+ var hexRe$1 = new RegExp(pattern$8, 'i');
156
+
157
+ const float$1 = '-?\\d*(?:\\.\\d+)';
158
+
159
+ const number$1 = `(${float$1}?)`;
160
+ const percentage$1 = `(${float$1}?%)`;
161
+ const numberOrPercentage$1 = `(${float$1}?%?)`;
162
+
163
+ const pattern$1$1 = `^
164
+ hsla?\\(
165
+ \\s*(-?\\d*(?:\\.\\d+)?(?:deg|rad|turn)?)\\s*,
166
+ \\s*${percentage$1}\\s*,
167
+ \\s*${percentage$1}\\s*
168
+ (?:,\\s*${numberOrPercentage$1}\\s*)?
169
+ \\)
170
+ $
171
+ `.replace(/\n|\s/g, '');
172
+
173
+ var hsl3Re$1 = new RegExp(pattern$1$1);
174
+
175
+ const pattern$2$1 = `^
176
+ hsla?\\(
177
+ \\s*(-?\\d*(?:\\.\\d+)?(?:deg|rad|turn)?)\\s*
178
+ \\s+${percentage$1}
179
+ \\s+${percentage$1}
180
+ \\s*(?:\\s*\\/\\s*${numberOrPercentage$1}\\s*)?
181
+ \\)
182
+ $
183
+ `.replace(/\n|\s/g, '');
184
+
185
+ var hsl4Re$1 = new RegExp(pattern$2$1);
186
+
187
+ const pattern$3$1 = `^
188
+ rgba?\\(
189
+ \\s*${number$1}\\s*,
190
+ \\s*${number$1}\\s*,
191
+ \\s*${number$1}\\s*
192
+ (?:,\\s*${numberOrPercentage$1}\\s*)?
193
+ \\)
194
+ $
195
+ `.replace(/\n|\s/g, '');
196
+
197
+ var rgb3NumberRe$1 = new RegExp(pattern$3$1);
198
+
199
+ const pattern$4$1 = `^
200
+ rgba?\\(
201
+ \\s*${percentage$1}\\s*,
202
+ \\s*${percentage$1}\\s*,
203
+ \\s*${percentage$1}\\s*
204
+ (?:,\\s*${numberOrPercentage$1}\\s*)?
205
+ \\)
206
+ $
207
+ `.replace(/\n|\s/g, '');
208
+
209
+ var rgb3PercentageRe$1 = new RegExp(pattern$4$1);
210
+
211
+ const pattern$5$1 = `^
212
+ rgba?\\(
213
+ \\s*${number$1}
214
+ \\s+${number$1}
215
+ \\s+${number$1}
216
+ \\s*(?:\\s*\\/\\s*${numberOrPercentage$1}\\s*)?
217
+ \\)
218
+ $
219
+ `.replace(/\n|\s/g, '');
220
+
221
+ var rgb4NumberRe$1 = new RegExp(pattern$5$1);
222
+
223
+ const pattern$6$1 = `^
224
+ rgba?\\(
225
+ \\s*${percentage$1}
226
+ \\s+${percentage$1}
227
+ \\s+${percentage$1}
228
+ \\s*(?:\\s*\\/\\s*${numberOrPercentage$1}\\s*)?
229
+ \\)
230
+ $
231
+ `.replace(/\n|\s/g, '');
232
+
233
+ var rgb4PercentageRe$1 = new RegExp(pattern$6$1);
234
+
235
+ const pattern$7$1 = /^transparent$/;
236
+ var transparentRe$1 = new RegExp(pattern$7$1, 'i');
237
+
238
+ const clamp$3 = (num, min, max) => Math.min(Math.max(min, num), max);
239
+
240
+ /* 500 => 255, -10 => 0, 128 => 128 */
241
+ const parseRGB$1 = (num) => {
242
+ let n = num;
243
+ if (typeof n !== 'number') n = n.endsWith('%') ? (parseFloat(n) * 255) / 100 : parseFloat(n);
244
+ return clamp$3(Math.round(n), 0, 255);
245
+ };
246
+
247
+ /* 200 => 100, -100 => 0, 50 => 50 */
248
+ const parsePercentage$1 = (percentage) => clamp$3(parseFloat(percentage), 0, 100);
249
+
250
+ /* '50%' => 5.0, 200 => 1, -10 => 0 */
251
+ function parseAlpha$1(alpha) {
252
+ let a = alpha;
253
+ if (typeof a !== 'number') a = a.endsWith('%') ? parseFloat(a) / 100 : parseFloat(a);
254
+ return clamp$3(a, 0, 1);
255
+ }
256
+
257
+ function getHEX$1(hex) {
258
+ const [r, g, b, a] = hex2Rgb(hex, { format: 'array' });
259
+ return getRGB$1([null, ...[r, g, b, a]]);
260
+ }
261
+
262
+ function getHSL$1([, h, s, l, a = 1]) {
263
+ let hh = h;
264
+ if (hh.endsWith('turn')) {
265
+ hh = (parseFloat(hh) * 360) / 1;
266
+ } else if (hh.endsWith('rad')) {
267
+ hh = Math.round((parseFloat(hh) * 180) / Math.PI);
268
+ } else {
269
+ hh = parseFloat(hh);
270
+ }
271
+ return {
272
+ type: 'hsl',
273
+ values: [hh, parsePercentage$1(s), parsePercentage$1(l)],
274
+ alpha: parseAlpha$1(a === null ? 1 : a)
275
+ };
276
+ }
277
+
278
+ function getRGB$1([, r, g, b, a = 1]) {
279
+ return {
280
+ type: 'rgb',
281
+ values: [r, g, b].map(parseRGB$1),
282
+ alpha: parseAlpha$1(a === null ? 1 : a)
283
+ };
284
+ }
285
+
286
+ /**
287
+ * parse-css-color
288
+ * @version v0.1.2
289
+ * @link http://github.com/noeldelgado/parse-css-color/
290
+ * @license MIT
291
+ */
292
+
293
+ const parseCSSColor$1 = (str) => {
294
+ if (typeof str !== 'string') return null;
295
+
296
+ const hex = hexRe$1.exec(str);
297
+ if (hex) return getHEX$1(hex[0]);
298
+
299
+ const hsl = hsl4Re$1.exec(str) || hsl3Re$1.exec(str);
300
+ if (hsl) return getHSL$1(hsl);
301
+
302
+ const rgb =
303
+ rgb4NumberRe$1.exec(str) ||
304
+ rgb4PercentageRe$1.exec(str) ||
305
+ rgb3NumberRe$1.exec(str) ||
306
+ rgb3PercentageRe$1.exec(str);
307
+ if (rgb) return getRGB$1(rgb);
308
+
309
+ if (transparentRe$1.exec(str)) return getRGB$1([null, 0, 0, 0, 0]);
310
+
311
+ const cn = colorName[str.toLowerCase()];
312
+ if (cn) return getRGB$1([null, cn[0], cn[1], cn[2], 1]);
313
+
314
+ return null;
315
+ };
316
+
317
+ function hsl2rgb(hsl) {
318
+ var h = hsl[0] / 360,
319
+ s = hsl[1] / 100,
320
+ l = hsl[2] / 100,
321
+ t1, t2, t3, rgb, val;
322
+
323
+ if (s == 0) {
324
+ val = l * 255;
325
+ return [val, val, val];
326
+ }
327
+
328
+ if (l < 0.5)
329
+ t2 = l * (1 + s);
330
+ else
331
+ t2 = l + s - l * s;
332
+ t1 = 2 * l - t2;
333
+
334
+ rgb = [0, 0, 0];
335
+ for (var i = 0; i < 3; i++) {
336
+ t3 = h + 1 / 3 * - (i - 1);
337
+ t3 < 0 && t3++;
338
+ t3 > 1 && t3--;
339
+
340
+ if (6 * t3 < 1)
341
+ val = t1 + (t2 - t1) * 6 * t3;
342
+ else if (2 * t3 < 1)
343
+ val = t2;
344
+ else if (3 * t3 < 2)
345
+ val = t1 + (t2 - t1) * (2 / 3 - t3) * 6;
346
+ else
347
+ val = t1;
348
+
349
+ rgb[i] = val * 255;
350
+ }
351
+
352
+ return rgb;
353
+ }
354
+
355
+ var hsl2rgb_1 = hsl2rgb;
356
+
357
+ function clamp$2(val, min, max) {
358
+ return Math.min(Math.max(val, min), max);
359
+ }
360
+
361
+ var clamp_1 = clamp$2;
362
+
363
+ var clamp$1 = clamp_1;
364
+
365
+ function componentToHex(c) {
366
+ var value = Math.round(clamp$1(c, 0, 255));
367
+ var hex = value.toString(16);
368
+
369
+ return hex.length == 1 ? "0" + hex : hex;
370
+ }
371
+
372
+ function rgb2hex(rgb) {
373
+ var alpha = rgb.length === 4 ? componentToHex(rgb[3] * 255) : "";
374
+
375
+ return "#" + componentToHex(rgb[0]) + componentToHex(rgb[1]) + componentToHex(rgb[2]) + alpha;
376
+ }
377
+
378
+ var rgb2hex_1 = rgb2hex;
379
+
380
+ function rgb2hsl(rgb) {
381
+ var r = rgb[0]/255,
382
+ g = rgb[1]/255,
383
+ b = rgb[2]/255,
384
+ min = Math.min(r, g, b),
385
+ max = Math.max(r, g, b),
386
+ delta = max - min,
387
+ h, s, l;
388
+
389
+ if (max == min)
390
+ h = 0;
391
+ else if (r == max)
392
+ h = (g - b) / delta;
393
+ else if (g == max)
394
+ h = 2 + (b - r) / delta;
395
+ else if (b == max)
396
+ h = 4 + (r - g)/ delta;
397
+
398
+ h = Math.min(h * 60, 360);
399
+
400
+ if (h < 0)
401
+ h += 360;
402
+
403
+ l = (min + max) / 2;
404
+
405
+ if (max == min)
406
+ s = 0;
407
+ else if (l <= 0.5)
408
+ s = delta / (max + min);
409
+ else
410
+ s = delta / (2 - max - min);
411
+
412
+ return [h, s * 100, l * 100];
413
+ }
414
+
415
+ var rgb2hsl_1 = rgb2hsl;
416
+
417
+ /**
418
+ * mix-css-color
419
+ * @version v0.2.0
420
+ * @link http://github.com/noeldelgado/mix-css-color/
421
+ * @license MIT
422
+ */
423
+
424
+ function parseColor(color) {
425
+ const res = parseCSSColor$1(color);
426
+ if (res === null) return null;
427
+ if (res.type === 'hsl') res.values = hsl2rgb_1(res.values);
428
+ return res;
429
+ }
430
+
431
+ /**
432
+ * Mix two colors together in variable proportion. Opacity is included in the calculations.
433
+ * Copyright (c) 2006-2009 Hampton Catlin, Natalie Weizenbaum, and Chris Eppstein
434
+ * http://sass-lang.com
435
+ * @see https://github.com/less/less.js/blob/cae5021358a5fca932c32ed071f652403d07def8/lib/less/functions/color.js#L302
436
+ */
437
+ function mix(color1, color2, percentage = 50) {
438
+ const c1 = parseColor(color1);
439
+ const c2 = parseColor(color2);
440
+
441
+ if (!c1 || !c2) return null;
442
+
443
+ const p = Math.min(Math.max(0, percentage), 100) / 100.0;
444
+ const w = p * 2 - 1;
445
+ const a = c1.alpha - c2.alpha;
446
+ const w1 = ((w * a === -1 ? w : (w + a) / (1 + w * a)) + 1) / 2.0;
447
+ const w2 = 1 - w1;
448
+ const [r, g, b] = c1.values.map((c, i) => Math.round(c1.values[i] * w1 + c2.values[i] * w2));
449
+ const alpha = parseFloat((c1.alpha * p + c2.alpha * (1 - p)).toFixed(8));
450
+
451
+ return {
452
+ hex: rgb2hex_1([r, g, b]),
453
+ hexa: rgb2hex_1([r, g, b, alpha]),
454
+ rgba: [r, g, b, alpha],
455
+ hsla: [...rgb2hsl_1([r, g, b]).map(Math.round), alpha]
456
+ };
457
+ }
458
+
459
+ const pattern = /^#([a-f0-9]{3,4}|[a-f0-9]{4}(?:[a-f0-9]{2}){1,2})\b$/;
460
+ var hexRe = new RegExp(pattern, 'i');
461
+
462
+ const float = '-?\\d*(?:\\.\\d+)';
463
+
464
+ const number = `(${float}?)`;
465
+ const percentage = `(${float}?%)`;
466
+ const numberOrPercentage = `(${float}?%?)`;
467
+
468
+ const pattern$1 = `^
469
+ hsla?\\(
470
+ \\s*(-?\\d*(?:\\.\\d+)?(?:deg|rad|turn)?)\\s*,
471
+ \\s*${percentage}\\s*,
472
+ \\s*${percentage}\\s*
473
+ (?:,\\s*${numberOrPercentage}\\s*)?
474
+ \\)
475
+ $
476
+ `.replace(/\n|\s/g, '');
477
+
478
+ var hsl3Re = new RegExp(pattern$1);
479
+
480
+ const pattern$2 = `^
481
+ hsla?\\(
482
+ \\s*(-?\\d*(?:\\.\\d+)?(?:deg|rad|turn)?)\\s*
483
+ \\s+${percentage}
484
+ \\s+${percentage}
485
+ \\s*(?:\\s*\\/\\s*${numberOrPercentage}\\s*)?
486
+ \\)
487
+ $
488
+ `.replace(/\n|\s/g, '');
489
+
490
+ var hsl4Re = new RegExp(pattern$2);
491
+
492
+ const pattern$3 = `^
493
+ rgba?\\(
494
+ \\s*${number}\\s*,
495
+ \\s*${number}\\s*,
496
+ \\s*${number}\\s*
497
+ (?:,\\s*${numberOrPercentage}\\s*)?
498
+ \\)
499
+ $
500
+ `.replace(/\n|\s/g, '');
501
+
502
+ var rgb3NumberRe = new RegExp(pattern$3);
503
+
504
+ const pattern$4 = `^
505
+ rgba?\\(
506
+ \\s*${percentage}\\s*,
507
+ \\s*${percentage}\\s*,
508
+ \\s*${percentage}\\s*
509
+ (?:,\\s*${numberOrPercentage}\\s*)?
510
+ \\)
511
+ $
512
+ `.replace(/\n|\s/g, '');
513
+
514
+ var rgb3PercentageRe = new RegExp(pattern$4);
515
+
516
+ const pattern$5 = `^
517
+ rgba?\\(
518
+ \\s*${number}
519
+ \\s+${number}
520
+ \\s+${number}
521
+ \\s*(?:\\s*\\/\\s*${numberOrPercentage}\\s*)?
522
+ \\)
523
+ $
524
+ `.replace(/\n|\s/g, '');
525
+
526
+ var rgb4NumberRe = new RegExp(pattern$5);
527
+
528
+ const pattern$6 = `^
529
+ rgba?\\(
530
+ \\s*${percentage}
531
+ \\s+${percentage}
532
+ \\s+${percentage}
533
+ \\s*(?:\\s*\\/\\s*${numberOrPercentage}\\s*)?
534
+ \\)
535
+ $
536
+ `.replace(/\n|\s/g, '');
537
+
538
+ var rgb4PercentageRe = new RegExp(pattern$6);
539
+
540
+ const pattern$7 = /^transparent$/;
541
+ var transparentRe = new RegExp(pattern$7, 'i');
542
+
543
+ const clamp = (num, min, max) => Math.min(Math.max(min, num), max);
544
+
545
+ /* 500 => 255, -10 => 0, 128 => 128 */
546
+ const parseRGB = (num) => {
547
+ let n = num;
548
+ if (typeof n !== 'number') n = n.endsWith('%') ? (parseFloat(n) * 255) / 100 : parseFloat(n);
549
+ return clamp(Math.round(n), 0, 255);
550
+ };
551
+
552
+ /* 200 => 100, -100 => 0, 50 => 50 */
553
+ const parsePercentage = (percentage) => clamp(parseFloat(percentage), 0, 100);
554
+
555
+ /* '50%' => 5.0, 200 => 1, -10 => 0 */
556
+ function parseAlpha(alpha) {
557
+ let a = alpha;
558
+ if (typeof a !== 'number') a = a.endsWith('%') ? parseFloat(a) / 100 : parseFloat(a);
559
+ return clamp(a, 0, 1);
560
+ }
561
+
562
+ function getHEX(hex) {
563
+ const [r, g, b, a] = hex2Rgb(hex, { format: 'array' });
564
+ return getRGB([null, ...[r, g, b, a]]);
565
+ }
566
+
567
+ function getHSL([, h, s, l, a = 1]) {
568
+ let hh = h;
569
+ if (hh.endsWith('turn')) {
570
+ hh = (parseFloat(hh) * 360) / 1;
571
+ } else if (hh.endsWith('rad')) {
572
+ hh = Math.round((parseFloat(hh) * 180) / Math.PI);
573
+ } else {
574
+ hh = parseFloat(hh);
575
+ }
576
+ return {
577
+ type: 'hsl',
578
+ values: [hh, parsePercentage(s), parsePercentage(l)],
579
+ alpha: parseAlpha(a === null ? 1 : a)
580
+ };
581
+ }
582
+
583
+ function getRGB([, r, g, b, a = 1]) {
584
+ return {
585
+ type: 'rgb',
586
+ values: [r, g, b].map(parseRGB),
587
+ alpha: parseAlpha(a === null ? 1 : a)
588
+ };
589
+ }
590
+
591
+ /**
592
+ * parse-css-color
593
+ * @version v0.2.0
594
+ * @link http://github.com/noeldelgado/parse-css-color/
595
+ * @license MIT
596
+ */
597
+
598
+ const parseCSSColor = (str) => {
599
+ if (typeof str !== 'string') return null;
600
+
601
+ const hex = hexRe.exec(str);
602
+ if (hex) return getHEX(hex[0]);
603
+
604
+ const hsl = hsl4Re.exec(str) || hsl3Re.exec(str);
605
+ if (hsl) return getHSL(hsl);
606
+
607
+ const rgb =
608
+ rgb4NumberRe.exec(str) ||
609
+ rgb4PercentageRe.exec(str) ||
610
+ rgb3NumberRe.exec(str) ||
611
+ rgb3PercentageRe.exec(str);
612
+ if (rgb) return getRGB(rgb);
613
+
614
+ if (transparentRe.exec(str)) return getRGB([null, 0, 0, 0, 0]);
615
+
616
+ const cn = colorName[str.toLowerCase()];
617
+ if (cn) return getRGB([null, cn[0], cn[1], cn[2], 1]);
618
+
619
+ return null;
620
+ };
621
+
622
+ /**
623
+ * values.js - Get the tints and shades of a color
624
+ * @version v2.1.1
625
+ * @link http://noeldelgado.github.io/values.js/
626
+ * @license MIT
627
+ */
628
+ const defaultNumberParam = (v, d) => (v === null || isNaN(v) || typeof v === 'string' ? d : v);
629
+ class Values {
630
+ constructor(color = '#000', type = 'base', weight = 0) {
631
+ [this.rgb, this.alpha, this.type, this.weight] = [[0, 0, 0], 1, type, weight];
632
+ const c = color === null ? '#000' : color;
633
+ if (typeof c !== 'string') throw new TypeError(`Input should be a string: ${c}`);
634
+ const parsed = parseCSSColor(c);
635
+ if (!parsed) throw new Error(`Unable to parse color from string: ${c}`);
636
+ return this[`_setFrom${parsed.type.toUpperCase()}`]([...parsed.values, parsed.alpha]);
637
+ }
638
+ get hex() {
639
+ return this.hexString().replace(/^#/, '');
640
+ }
641
+ setColor(color) {
642
+ const parsed = parseCSSColor(color);
643
+ if (!parsed) return null;
644
+ return this[`_setFrom${parsed.type.toUpperCase()}`]([...parsed.values, parsed.alpha]);
645
+ }
646
+ tint(weight, w = defaultNumberParam(weight, 50)) {
647
+ return new Values(`rgb(${mix('#fff', this.rgbString(), w).rgba})`, 'tint', w);
648
+ }
649
+ shade(weight, w = defaultNumberParam(weight, 50)) {
650
+ return new Values(`rgb(${mix('#000', this.rgbString(), w).rgba})`, 'shade', w);
651
+ }
652
+ tints(weight, w = defaultNumberParam(weight, 10)) {
653
+ return Array.from({ length: 100 / w }, (_, i) => this.tint((i + 1) * w));
654
+ }
655
+ shades(weight, w = defaultNumberParam(weight, 10)) {
656
+ return Array.from({ length: 100 / w }, (_, i) => this.shade((i + 1) * w));
657
+ }
658
+ all(weight = 10) {
659
+ return [...this.tints(weight).reverse(), Object.assign(this), ...this.shades(weight)];
660
+ }
661
+ hexString() {
662
+ return rgb2hex_1(this.alpha >= 1 ? this.rgb : [...this.rgb, this.alpha]);
663
+ }
664
+ rgbString() {
665
+ const channels = (this.alpha >= 1 ? this.rgb : [...this.rgb, this.alpha]).join(', ');
666
+ return `${this.alpha >= 1 ? 'rgb' : 'rgba'}(${channels})`;
667
+ }
668
+ getBrightness() {
669
+ return Math.round((this.rgb.reduce((a, b) => a + b) / (255 * 3)) * 100);
670
+ }
671
+ _setFromRGB([r, g, b, a]) {
672
+ [this.rgb, this.alpha] = [[r, g, b], a];
673
+ return this;
674
+ }
675
+ _setFromHSL([h, s, l, a]) {
676
+ [this.rgb, this.alpha] = [hsl2rgb_1([h, s, l]).map(Math.round), a];
677
+ return this;
678
+ }
679
+ }
680
+ Values.VERSION = 'v2.1.1';
681
+
682
+ var Values$1 = Values;
683
+
684
+ const STEPS = [5, 10, 15, 20, 25, 30, 35, 40, 45, 50, 55, 60, 65, 70, 75, 80, 85, 90, 95];
685
+
686
+ const createColorScales = base => {
687
+ const colorValues = new Values$1(base);
688
+ return { ...STEPS.reduce((acc, step) => ({ ...acc,
689
+ [`lighten${step}`]: colorValues.tint(step).hexString(),
690
+ [`darken${step}`]: colorValues.shade(step).hexString()
691
+ }), {}),
692
+ base: colorValues.hexString()
693
+ };
694
+ };
695
+
696
+ const BASE_COLORS = {
697
+ antiFlashWhite: '#f1f2f3',
3
698
  blue: '#1dbeee',
4
- blueDark30: '#1485a7',
5
- blueDark75: '#07303c',
6
- blueLight30: '#61d2f3',
7
- blueLight75: '#c7effb',
8
- blueLight90: '#e8f9fd',
9
- dodgerBlue: '#4568fb',
10
- dodgerBlueDark30: '#3049b0',
11
- dodgerBlueLight30: '#7d95fc',
12
- dodgerBlueLight75: '#d1d9fe',
13
- dodgerBlueLight90: '#ecf0ff',
699
+ blue1: '#5a68e2',
700
+ nightBlue: '#353957',
701
+ darkBlue: '#25006e',
702
+ maasstrichtBlue: '#001f23',
703
+ ultramarineBlue: '#4568fb',
704
+ aliceBlue: '#ecf0ff',
705
+ jordyBlue: '#92abfc',
706
+ cornflowerBlue: '#5d80f0',
707
+ paua: '#130066',
14
708
  green: '#01b39c',
15
- greenDark15: '#019885',
16
- greenDark30: '#017d6d',
17
- greenDark75: '#002d27',
18
- greenLight30: '#4dcaba',
19
- greenLight75: '#c0ece6',
20
- greenLight90: '#e6f7f5',
709
+ emerald: '#5ace7d',
710
+ pineGreen: '#017d6d',
711
+ honeydew: '#f0fef4',
21
712
  grey: '#a3a6ac',
22
- greyDark15: '#8b8d92',
23
- greyDark30: '#727478',
24
- greyDark45: '#5a5b5f',
25
- greyDark60: '#414245',
26
- greyDark75: '#292a2b',
27
- greyLight45: '#ccced1',
28
- greyLight60: '#dadbde',
29
- greyLight75: '#e8e9ea',
30
- greyLight85: '#f1f2f3',
31
- greyLight90: '#f6f6f7',
32
- greyLight95: '#fafbfb',
713
+ currant: '#48000a',
714
+ sonicSilver: '#737479',
33
715
  grotesqueGreen: '#6af293',
34
- grotesqueGreenDark45: '#3a8551',
35
- grotesqueGreenLight60: '#c3fad4',
36
- grotesqueGreenLight75: '#dafce4',
37
- grotesqueGreenLight90: '#f0fef4',
38
- orange: '#ffa234',
39
- orangeDark15: '#d98a2c',
40
- orangeDark30: '#b37124',
41
- orangeDark75: '#40290d',
42
- orangeLight30: '#ffbe71',
43
- orangeLight75: '#ffe8cc',
44
- orangeLight90: '#fff6eb',
716
+ mellowApricot: '#ffbe71',
717
+ deepSaffron: '#ffa234',
45
718
  pink: '#fe56aa',
46
- pinkDark15: '#cf4991',
47
- pinkDark30: '#b23c77',
48
- pinkDark45: '#8c2f5e',
49
- pinkDark75: '#40162b',
50
- pinkLight30: '#fe89c4',
51
- pinkLight45: '#fea2d0',
52
- pinkLight75: '#fcd5ea',
53
- pinkLight90: '#ffeef7',
719
+ hitPink: '#ffad79',
720
+ apple: '#e3602a',
54
721
  purple: '#be83cf',
55
- purpleDark15: '#a26fb0',
56
- red: '#de350b',
57
- redDark15: '#bd2d09',
58
- redDark30: '#9b2508',
59
- redDark75: '#380d03',
60
- redLight15: '#e35330',
61
- redLight30: '#e87254',
62
- redLight60: '#f2ae9d',
63
- redLight75: '#f7cdc2',
64
- redLight90: '#fcebe7',
722
+ scarletGum: '#401960',
723
+ vodka: '#b5c3fd',
724
+ peach: '#f8ac7d',
725
+ pastelRed: '#f46363',
726
+ vermilion: '#de350b',
727
+ linen: '#fcebe7',
65
728
  smalt: '#003580',
66
- smaltDark75: '#000d20',
67
- smaltLight30: '#4d72a6',
68
- smaltLight45: '#7390b9',
69
- smaltLight75: '#bfcddf',
70
- smaltLight90: '#e6ebf2',
71
729
  violet: '#7622d7',
72
- violetDark15: '#641db7',
73
- violetDark30: '#531897',
74
- violetDark45: '#411376',
75
- violetDark75: '#1e0936',
76
- violetLight30: '#9f64e3',
77
- violetLight60: '#c8a7ef',
78
- violetLight75: '#ddc8f5',
79
- violetLight90: '#f1e9fb',
80
- white: '#ffffff',
730
+ violet1: '#8505a2',
731
+ mauve: '#c38cee',
81
732
  yellow: '#fadb14',
82
- yellowDark15: '#d5ba11',
83
- yellowDark75: '#3f3705',
84
- yellowLight60: '#fdf1a1',
85
- yellowLight90: '#fffbe8'
733
+ seashell: '#ebf4ff',
734
+ gold: '#ffd500'
735
+ };
736
+ const colorScales = Object.entries(BASE_COLORS).reduce((acc, [key, value]) => ({ ...acc,
737
+ [key]: createColorScales(value)
738
+ }), {});
739
+
740
+ const {
741
+ blue,
742
+ ultramarineBlue: ultramarineBlue$1,
743
+ green,
744
+ grey: grey$2,
745
+ grotesqueGreen,
746
+ deepSaffron: deepSaffron$2,
747
+ pink,
748
+ purple,
749
+ vermilion: vermilion$2,
750
+ smalt,
751
+ violet,
752
+ yellow
753
+ } = colorScales;
754
+ const palette$6 = {
755
+ black: '#000000',
756
+ white: '#ffffff',
757
+ blue: blue.base,
758
+ blueDark30: blue.darken30,
759
+ blueDark75: blue.darken75,
760
+ blueLight30: blue.lighten30,
761
+ blueLight75: blue.lighten75,
762
+ blueLight90: blue.lighten90,
763
+ dodgerBlue: ultramarineBlue$1.base,
764
+ dodgerBlueDark30: ultramarineBlue$1.darken30,
765
+ dodgerBlueLight30: ultramarineBlue$1.lighten30,
766
+ dodgerBlueLight75: ultramarineBlue$1.lighten75,
767
+ dodgerBlueLight90: ultramarineBlue$1.lighten90,
768
+ green: green.base,
769
+ greenDark15: green.darken15,
770
+ greenDark30: green.darken30,
771
+ greenDark75: green.darken75,
772
+ greenLight30: green.lighten30,
773
+ greenLight75: green.lighten75,
774
+ greenLight90: green.lighten90,
775
+ grey: grey$2.base,
776
+ greyDark15: grey$2.darken15,
777
+ greyDark30: grey$2.darken30,
778
+ greyDark45: grey$2.darken45,
779
+ greyDark60: grey$2.darken60,
780
+ greyDark75: grey$2.darken75,
781
+ greyLight45: grey$2.lighten45,
782
+ greyLight60: grey$2.lighten60,
783
+ greyLight75: grey$2.lighten75,
784
+ greyLight85: grey$2.lighten85,
785
+ greyLight90: grey$2.lighten90,
786
+ greyLight95: grey$2.lighten95,
787
+ grotesqueGreen: grotesqueGreen.base,
788
+ grotesqueGreenDark45: grotesqueGreen.darken45,
789
+ grotesqueGreenLight60: grotesqueGreen.lighten60,
790
+ grotesqueGreenLight75: grotesqueGreen.lighten75,
791
+ grotesqueGreenLight90: grotesqueGreen.lighten90,
792
+ orange: deepSaffron$2.base,
793
+ orangeDark15: deepSaffron$2.darken15,
794
+ orangeDark30: deepSaffron$2.darken30,
795
+ orangeDark75: deepSaffron$2.darken75,
796
+ orangeLight30: deepSaffron$2.lighten30,
797
+ orangeLight75: deepSaffron$2.lighten75,
798
+ orangeLight90: deepSaffron$2.lighten90,
799
+ pink: pink.base,
800
+ pinkDark15: pink.darken15,
801
+ pinkDark30: pink.darken30,
802
+ pinkDark45: pink.darken45,
803
+ pinkDark75: pink.darken75,
804
+ pinkLight30: pink.lighten30,
805
+ pinkLight45: pink.lighten45,
806
+ pinkLight75: pink.lighten75,
807
+ pinkLight90: pink.lighten90,
808
+ purple: purple.base,
809
+ purpleDark15: purple.darken15,
810
+ red: vermilion$2.base,
811
+ redDark15: vermilion$2.darken15,
812
+ redDark30: vermilion$2.darken30,
813
+ redDark75: vermilion$2.darken75,
814
+ redLight15: vermilion$2.lighten15,
815
+ redLight30: vermilion$2.lighten30,
816
+ redLight60: vermilion$2.lighten60,
817
+ redLight75: vermilion$2.lighten75,
818
+ redLight90: vermilion$2.lighten90,
819
+ smalt: smalt.base,
820
+ smaltDark75: smalt.darken75,
821
+ smaltLight30: smalt.lighten30,
822
+ smaltLight45: smalt.lighten45,
823
+ smaltLight75: smalt.lighten75,
824
+ smaltLight90: smalt.lighten90,
825
+ violet: violet.base,
826
+ violetDark15: violet.darken15,
827
+ violetDark30: violet.darken30,
828
+ violetDark45: violet.darken45,
829
+ violetDark75: violet.darken75,
830
+ violetLight30: violet.lighten30,
831
+ violetLight60: violet.lighten60,
832
+ violetLight75: violet.lighten75,
833
+ violetLight90: violet.lighten90,
834
+ yellow: yellow.base,
835
+ yellowDark15: yellow.darken15,
836
+ yellowDark75: yellow.darken75,
837
+ yellowLight60: yellow.lighten60,
838
+ yellowLight90: yellow.lighten90
839
+ };
840
+
841
+ const {
842
+ maasstrichtBlue,
843
+ grey: grey$1,
844
+ pastelRed: pastelRed$1,
845
+ mellowApricot,
846
+ emerald: emerald$1,
847
+ vodka,
848
+ vermilion: vermilion$1,
849
+ deepSaffron: deepSaffron$1,
850
+ pineGreen,
851
+ ultramarineBlue,
852
+ sonicSilver,
853
+ linen,
854
+ seashell,
855
+ honeydew,
856
+ aliceBlue,
857
+ antiFlashWhite,
858
+ apple: apple$1
859
+ } = colorScales;
860
+ const palette$5 = {
861
+ black: '#000000',
862
+ white: '#ffffff',
863
+ greyLight95: grey$1.lighten95,
864
+ greyLight90: grey$1.lighten90,
865
+ greyLight75: grey$1.lighten75,
866
+ greyLight45: grey$1.lighten45,
867
+ greyLight30: grey$1.lighten30,
868
+ grey: grey$1.base,
869
+ maasstrichtBlueLight90: maasstrichtBlue.lighten90,
870
+ maasstrichtBlueLight80: maasstrichtBlue.lighten80,
871
+ maasstrichtBlueLight50: maasstrichtBlue.lighten50,
872
+ maasstrichtBlueLight30: maasstrichtBlue.lighten30,
873
+ maasstrichtBlue: maasstrichtBlue.base,
874
+ pastelRed: pastelRed$1.base,
875
+ mellowApricot: mellowApricot.base,
876
+ emerald: emerald$1.base,
877
+ vodka: vodka.base,
878
+ vermilion: vermilion$1.base,
879
+ deepSaffron: deepSaffron$1.base,
880
+ pineGreen: pineGreen.base,
881
+ ultramarineBlue: ultramarineBlue.base,
882
+ sonicSilver: sonicSilver.base,
883
+ linen: linen.base,
884
+ seashell: seashell.base,
885
+ honeydew: honeydew.base,
886
+ aliceBlue: aliceBlue.base,
887
+ antiFlashWhite: antiFlashWhite.base,
888
+ apple: apple$1.base
889
+ };
890
+
891
+ const {
892
+ emerald,
893
+ blue1,
894
+ nightBlue,
895
+ darkBlue,
896
+ grey,
897
+ deepSaffron,
898
+ peach,
899
+ vermilion,
900
+ pastelRed,
901
+ mauve
902
+ } = colorScales;
903
+ const palette$4 = { ...palette$5,
904
+ nightBlue: nightBlue.base,
905
+ blueLight60: blue1.lighten60,
906
+ blue: blue1.base,
907
+ darkBlue: darkBlue.base,
908
+ darkBlueDark15: darkBlue.darken15,
909
+ green: emerald.base,
910
+ greyDark45: grey.darken45,
911
+ greyDark75: grey.darken75,
912
+ greyLight30: grey.lighten30,
913
+ greyLight45: grey.lighten45,
914
+ greyLight90: grey.lighten90,
915
+ orangeLight30: deepSaffron.lighten30,
916
+ peach: peach.base,
917
+ peachLight75: peach.lighten75,
918
+ red: vermilion.base,
919
+ pastelRed: pastelRed.base,
920
+ mauve: mauve.base
921
+ };
922
+
923
+ const {
924
+ apple,
925
+ currant
926
+ } = colorScales;
927
+ const palette$3 = { ...palette$5,
928
+ apple: apple.base,
929
+ currant: currant.base
930
+ };
931
+
932
+ const {
933
+ scarletGum,
934
+ violet1
935
+ } = colorScales;
936
+ const palette$2 = { ...palette$5,
937
+ scarletGumLight30: scarletGum.lighten30,
938
+ scarletGumLight50: scarletGum.lighten50,
939
+ scarletGumLight80: scarletGum.lighten80,
940
+ scarletGumLight90: scarletGum.lighten90,
941
+ scarletGum: scarletGum.base,
942
+ violetLight30: violet1.lighten30,
943
+ violetLight50: violet1.lighten50,
944
+ violetLight80: violet1.lighten80,
945
+ violetLight90: violet1.lighten90,
946
+ violet: violet1.base
947
+ };
948
+
949
+ const {
950
+ jordyBlue,
951
+ cornflowerBlue,
952
+ paua
953
+ } = colorScales;
954
+ const palette$1 = { ...palette$5,
955
+ jordyBlueLight30: jordyBlue.lighten30,
956
+ jordyBlueLight50: jordyBlue.lighten50,
957
+ jordyBlueLight70: jordyBlue.lighten70,
958
+ jordyBlueLight90: jordyBlue.lighten90,
959
+ jordyBlue: jordyBlue.base,
960
+ cornflowerBlue: cornflowerBlue.base,
961
+ paua: paua.base
962
+ };
963
+
964
+ const {
965
+ gold
966
+ } = colorScales;
967
+ const palette = { ...palette$5,
968
+ goldLight20: gold.lighten20,
969
+ goldLight50: gold.lighten50,
970
+ goldLight70: gold.lighten70,
971
+ goldLight90: gold.lighten90,
972
+ gold: gold.base
86
973
  };
87
974
 
88
- export { palette as default };
975
+ export { colorScales, palette$6 as default, palette$5 as defaultMobilePalette, palette$6 as defaultWebPalette, palette$4 as eBensPalette, palette$3 as jobsPalette, palette$2 as swagPalette, palette$1 as walletPalette, palette as workPalette };