1 | "use strict";
|
2 |
|
3 | Object.defineProperty(exports, "__esModule", {
|
4 | value: true
|
5 | });
|
6 | exports["default"] = generate;
|
7 |
|
8 | var _tinycolor = require("@ctrl/tinycolor");
|
9 |
|
10 | var hueStep = 2;
|
11 |
|
12 | var saturationStep = 0.16;
|
13 |
|
14 | var saturationStep2 = 0.05;
|
15 |
|
16 | var brightnessStep1 = 0.05;
|
17 |
|
18 | var brightnessStep2 = 0.15;
|
19 |
|
20 | var lightColorCount = 5;
|
21 |
|
22 | var darkColorCount = 4;
|
23 |
|
24 |
|
25 | var darkColorMap = [{
|
26 | index: 7,
|
27 | opacity: 0.15
|
28 | }, {
|
29 | index: 6,
|
30 | opacity: 0.25
|
31 | }, {
|
32 | index: 5,
|
33 | opacity: 0.3
|
34 | }, {
|
35 | index: 5,
|
36 | opacity: 0.45
|
37 | }, {
|
38 | index: 5,
|
39 | opacity: 0.65
|
40 | }, {
|
41 | index: 5,
|
42 | opacity: 0.85
|
43 | }, {
|
44 | index: 4,
|
45 | opacity: 0.9
|
46 | }, {
|
47 | index: 3,
|
48 | opacity: 0.95
|
49 | }, {
|
50 | index: 2,
|
51 | opacity: 0.97
|
52 | }, {
|
53 | index: 1,
|
54 | opacity: 0.98
|
55 | }];
|
56 |
|
57 | function getHue(hsv, i, light) {
|
58 | var hue;
|
59 |
|
60 | if (Math.round(hsv.h) >= 60 && Math.round(hsv.h) <= 240) {
|
61 | hue = light ? Math.round(hsv.h) - hueStep * i : Math.round(hsv.h) + hueStep * i;
|
62 | } else {
|
63 | hue = light ? Math.round(hsv.h) + hueStep * i : Math.round(hsv.h) - hueStep * i;
|
64 | }
|
65 |
|
66 | if (hue < 0) {
|
67 | hue += 360;
|
68 | } else if (hue >= 360) {
|
69 | hue -= 360;
|
70 | }
|
71 |
|
72 | return hue;
|
73 | }
|
74 |
|
75 | function getSaturation(hsv, i, light) {
|
76 |
|
77 | if (hsv.h === 0 && hsv.s === 0) {
|
78 | return hsv.s;
|
79 | }
|
80 |
|
81 | var saturation;
|
82 |
|
83 | if (light) {
|
84 | saturation = hsv.s - saturationStep * i;
|
85 | } else if (i === darkColorCount) {
|
86 | saturation = hsv.s + saturationStep;
|
87 | } else {
|
88 | saturation = hsv.s + saturationStep2 * i;
|
89 | }
|
90 |
|
91 |
|
92 | if (saturation > 1) {
|
93 | saturation = 1;
|
94 | }
|
95 |
|
96 |
|
97 | if (light && i === lightColorCount && saturation > 0.1) {
|
98 | saturation = 0.1;
|
99 | }
|
100 |
|
101 | if (saturation < 0.06) {
|
102 | saturation = 0.06;
|
103 | }
|
104 |
|
105 | return Number(saturation.toFixed(2));
|
106 | }
|
107 |
|
108 | function getValue(hsv, i, light) {
|
109 | var value;
|
110 |
|
111 | if (light) {
|
112 | value = hsv.v + brightnessStep1 * i;
|
113 | } else {
|
114 | value = hsv.v - brightnessStep2 * i;
|
115 | }
|
116 |
|
117 | if (value > 1) {
|
118 | value = 1;
|
119 | }
|
120 |
|
121 | return Number(value.toFixed(2));
|
122 | }
|
123 |
|
124 | function generate(color) {
|
125 | var opts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
126 | var patterns = [];
|
127 | var pColor = new _tinycolor.TinyColor(color);
|
128 |
|
129 | for (var i = lightColorCount; i > 0; i -= 1) {
|
130 | var hsv = pColor.toHsv();
|
131 | var colorString = new _tinycolor.TinyColor({
|
132 | h: getHue(hsv, i, true),
|
133 | s: getSaturation(hsv, i, true),
|
134 | v: getValue(hsv, i, true)
|
135 | }).toHexString();
|
136 | patterns.push(colorString);
|
137 | }
|
138 |
|
139 | patterns.push(pColor.toHexString());
|
140 |
|
141 | for (var _i = 1; _i <= darkColorCount; _i += 1) {
|
142 | var _hsv = pColor.toHsv();
|
143 |
|
144 | var _colorString = new _tinycolor.TinyColor({
|
145 | h: getHue(_hsv, _i),
|
146 | s: getSaturation(_hsv, _i),
|
147 | v: getValue(_hsv, _i)
|
148 | }).toHexString();
|
149 |
|
150 | patterns.push(_colorString);
|
151 | }
|
152 |
|
153 |
|
154 | if (opts.theme === 'dark') {
|
155 | return darkColorMap.map(function (_ref) {
|
156 | var index = _ref.index,
|
157 | opacity = _ref.opacity;
|
158 | var darkColorString = new _tinycolor.TinyColor(opts.backgroundColor || '#141414').mix(patterns[index], opacity * 100).toHexString();
|
159 | return darkColorString;
|
160 | });
|
161 | }
|
162 |
|
163 | return patterns;
|
164 | }
|
165 |
|