toosoon-utils 3.1.0 → 4.0.1
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/README.md +1 -1
- package/lib/classes/_pool.d.ts +2 -2
- package/lib/classes/_pool.js +22 -50
- package/lib/classes/color-scale.d.ts +1 -1
- package/lib/classes/color-scale.js +67 -88
- package/lib/classes/frame-rate.js +19 -27
- package/lib/colors.d.ts +1 -1
- package/lib/colors.js +85 -123
- package/lib/constants.js +6 -9
- package/lib/dom.js +10 -17
- package/lib/files.js +8 -15
- package/lib/functions.d.ts +1 -1
- package/lib/functions.js +27 -40
- package/lib/geometry.d.ts +11 -11
- package/lib/geometry.js +30 -43
- package/lib/maths.js +22 -51
- package/lib/prng.js +43 -70
- package/lib/query.js +9 -15
- package/lib/random.d.ts +1 -1
- package/lib/random.js +30 -62
- package/lib/strings.js +17 -30
- package/lib/tsconfig.tsbuildinfo +1 -1
- package/lib/types.d.ts +6 -6
- package/lib/types.js +1 -2
- package/package.json +3 -1
- package/tsconfig.json +17 -11
package/lib/colors.js
CHANGED
|
@@ -1,19 +1,15 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
var constants_1 = require("./constants");
|
|
5
|
-
var geometry_1 = require("./geometry");
|
|
6
|
-
var maths_1 = require("./maths");
|
|
1
|
+
import { W3CX11 } from './constants';
|
|
2
|
+
import { toDegrees, toRadians } from './geometry';
|
|
3
|
+
import { clamp } from './maths';
|
|
7
4
|
/**
|
|
8
5
|
* Normalize a color representation into RGB
|
|
9
6
|
*
|
|
10
7
|
* @param {ColorRepresentation} color Color representation
|
|
11
8
|
* @returns {[number,number,number]} Normalized RGB color
|
|
12
9
|
*/
|
|
13
|
-
function normalizeColor(color) {
|
|
14
|
-
var _a;
|
|
10
|
+
export function normalizeColor(color) {
|
|
15
11
|
if (typeof color === 'string') {
|
|
16
|
-
return hexToRgb(
|
|
12
|
+
return hexToRgb(W3CX11[color] ?? color);
|
|
17
13
|
}
|
|
18
14
|
else if (typeof color === 'number') {
|
|
19
15
|
return hexToRgb(color);
|
|
@@ -22,7 +18,6 @@ function normalizeColor(color) {
|
|
|
22
18
|
return color;
|
|
23
19
|
}
|
|
24
20
|
}
|
|
25
|
-
exports.normalizeColor = normalizeColor;
|
|
26
21
|
// ******************************************
|
|
27
22
|
// RGB & Hexadecimal color spaces
|
|
28
23
|
// ******************************************
|
|
@@ -32,9 +27,9 @@ exports.normalizeColor = normalizeColor;
|
|
|
32
27
|
* @param {string} hex Hexadecimal string
|
|
33
28
|
* @returns {string} Normalized hexadecimal string
|
|
34
29
|
*/
|
|
35
|
-
function normalizeHexString(hex) {
|
|
36
|
-
|
|
37
|
-
|
|
30
|
+
export function normalizeHexString(hex) {
|
|
31
|
+
let match;
|
|
32
|
+
let result = '000000';
|
|
38
33
|
hex = hex.toLocaleLowerCase();
|
|
39
34
|
if ((match = hex.match(/(#|0x)?([a-f0-9]{6})/i))) {
|
|
40
35
|
result = match[2];
|
|
@@ -48,9 +43,8 @@ function normalizeHexString(hex) {
|
|
|
48
43
|
parseInt(match[2]).toString(16).padStart(2, '0') +
|
|
49
44
|
parseInt(match[3]).toString(16).padStart(2, '0');
|
|
50
45
|
}
|
|
51
|
-
return
|
|
46
|
+
return `#${result}`;
|
|
52
47
|
}
|
|
53
|
-
exports.normalizeHexString = normalizeHexString;
|
|
54
48
|
/**
|
|
55
49
|
* Convert RGB to hexadecimal
|
|
56
50
|
* Note: rgb values are contained in the interval [0, 1]
|
|
@@ -58,11 +52,9 @@ exports.normalizeHexString = normalizeHexString;
|
|
|
58
52
|
* @param {[number, number, number]} rgb RGB color
|
|
59
53
|
* @returns {number} Hexadecimal color
|
|
60
54
|
*/
|
|
61
|
-
function rgbToHex(
|
|
62
|
-
var r = _a[0], g = _a[1], b = _a[2];
|
|
55
|
+
export function rgbToHex([r, g, b]) {
|
|
63
56
|
return ((r * 255) << 16) ^ ((g * 255) << 8) ^ ((b * 255) << 0);
|
|
64
57
|
}
|
|
65
|
-
exports.rgbToHex = rgbToHex;
|
|
66
58
|
/**
|
|
67
59
|
* Convert RGB to hexadecimal string
|
|
68
60
|
* Note: rgb values are contained in the interval [0, 1]
|
|
@@ -70,15 +62,13 @@ exports.rgbToHex = rgbToHex;
|
|
|
70
62
|
* @param {[number, number, number]} rgb RGB color
|
|
71
63
|
* @returns {string} Hexadecimal string
|
|
72
64
|
*/
|
|
73
|
-
function rgbToHexString(
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
return "#".concat(result);
|
|
65
|
+
export function rgbToHexString([r, g, b]) {
|
|
66
|
+
r = clamp(Math.round(r * 255), 0, 255);
|
|
67
|
+
g = clamp(Math.round(g * 255), 0, 255);
|
|
68
|
+
b = clamp(Math.round(b * 255), 0, 255);
|
|
69
|
+
const result = (b | (g << 8) | (r << 16) | (1 << 24)).toString(16).slice(1);
|
|
70
|
+
return `#${result}`;
|
|
80
71
|
}
|
|
81
|
-
exports.rgbToHexString = rgbToHexString;
|
|
82
72
|
/**
|
|
83
73
|
* Convert hexadecimal to RGB
|
|
84
74
|
* Note: rgb values are contained in the interval [0, 1]
|
|
@@ -86,7 +76,7 @@ exports.rgbToHexString = rgbToHexString;
|
|
|
86
76
|
* @param {number|string} hex Hexadecimal color
|
|
87
77
|
* @returns {[number, number, number]} RGB color
|
|
88
78
|
*/
|
|
89
|
-
function hexToRgb(hex) {
|
|
79
|
+
export function hexToRgb(hex) {
|
|
90
80
|
if (typeof hex === 'number') {
|
|
91
81
|
hex = Math.floor(hex);
|
|
92
82
|
}
|
|
@@ -94,12 +84,11 @@ function hexToRgb(hex) {
|
|
|
94
84
|
hex = normalizeHexString(hex).replace(/^#/, '');
|
|
95
85
|
hex = parseInt(hex, 16);
|
|
96
86
|
}
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
87
|
+
const r = ((hex >> 16) & 255) / 255;
|
|
88
|
+
const g = ((hex >> 8) & 255) / 255;
|
|
89
|
+
const b = (hex & 255) / 255;
|
|
100
90
|
return [r, g, b];
|
|
101
91
|
}
|
|
102
|
-
exports.hexToRgb = hexToRgb;
|
|
103
92
|
/**
|
|
104
93
|
* Lighten a color
|
|
105
94
|
*
|
|
@@ -107,24 +96,22 @@ exports.hexToRgb = hexToRgb;
|
|
|
107
96
|
* @param {number} [amount=0] Amount of the color offset
|
|
108
97
|
* @returns {string} Computed hexadecimal
|
|
109
98
|
*/
|
|
110
|
-
function lighten(hex, amount) {
|
|
111
|
-
|
|
112
|
-
var prefix = '';
|
|
99
|
+
export function lighten(hex, amount = 0) {
|
|
100
|
+
let prefix = '';
|
|
113
101
|
if (hex[0] === '#') {
|
|
114
102
|
hex = hex.slice(1);
|
|
115
103
|
prefix = '#';
|
|
116
104
|
}
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
105
|
+
const value = parseInt(hex, 16);
|
|
106
|
+
const r = clamp((value >> 16) + amount, 0, 255);
|
|
107
|
+
const b = clamp(((value >> 8) & 0x00ff) + amount, 0, 255);
|
|
108
|
+
const g = clamp((value & 0x0000ff) + amount, 0, 255);
|
|
109
|
+
let result = g | (b << 8) | (r << 16);
|
|
122
110
|
if (r === 0 && g === 0 && b === 0 && amount !== 0) {
|
|
123
111
|
result = '000000';
|
|
124
112
|
}
|
|
125
113
|
return prefix + result.toString(16);
|
|
126
114
|
}
|
|
127
|
-
exports.lighten = lighten;
|
|
128
115
|
/**
|
|
129
116
|
* Darken a color
|
|
130
117
|
*
|
|
@@ -132,11 +119,9 @@ exports.lighten = lighten;
|
|
|
132
119
|
* @param {number} [amount=0] Amount of the color offset
|
|
133
120
|
* @returns {string} Computed hexadecimal
|
|
134
121
|
*/
|
|
135
|
-
function darken(hex, amount) {
|
|
136
|
-
if (amount === void 0) { amount = 0; }
|
|
122
|
+
export function darken(hex, amount = 0) {
|
|
137
123
|
return lighten(hex, -amount);
|
|
138
124
|
}
|
|
139
|
-
exports.darken = darken;
|
|
140
125
|
// ***************************************************
|
|
141
126
|
// RGB & Hue-Saturation-Lightness (HSL) color spaces
|
|
142
127
|
// ***************************************************
|
|
@@ -147,12 +132,10 @@ exports.darken = darken;
|
|
|
147
132
|
* @param {string} hsl HSL string (format: 'hsl(360, 100%, 100%)')
|
|
148
133
|
* @returns {[number, number, number]} Normalized HSL color
|
|
149
134
|
*/
|
|
150
|
-
function normalizeHslString(hsl) {
|
|
151
|
-
|
|
152
|
-
var _c = (_b = (_a = hsl.match(/\d+/g)) === null || _a === void 0 ? void 0 : _a.map(Number)) !== null && _b !== void 0 ? _b : [0, 0, 0], h = _c[0], s = _c[1], l = _c[2];
|
|
135
|
+
export function normalizeHslString(hsl) {
|
|
136
|
+
const [h, s, l] = hsl.match(/\d+/g)?.map(Number) ?? [0, 0, 0];
|
|
153
137
|
return [h, s / 100, l / 100];
|
|
154
138
|
}
|
|
155
|
-
exports.normalizeHslString = normalizeHslString;
|
|
156
139
|
/**
|
|
157
140
|
* Convert RGB to HSL
|
|
158
141
|
* Notes:
|
|
@@ -162,18 +145,16 @@ exports.normalizeHslString = normalizeHslString;
|
|
|
162
145
|
* @param {[number, number, number]} rgb RGB color
|
|
163
146
|
* @returns {[number, number, number]} HSL color
|
|
164
147
|
*/
|
|
165
|
-
function rgbToHsl(
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
var h = s ? (l === r ? (g - b) / s : l === g ? 2 + (b - r) / s : 4 + (r - g) / s) : 0;
|
|
148
|
+
export function rgbToHsl([r, g, b]) {
|
|
149
|
+
const l = Math.max(r, g, b);
|
|
150
|
+
const s = l - Math.min(r, g, b);
|
|
151
|
+
const h = s ? (l === r ? (g - b) / s : l === g ? 2 + (b - r) / s : 4 + (r - g) / s) : 0;
|
|
170
152
|
return [
|
|
171
153
|
60 * h < 0 ? 60 * h + 360 : 60 * h,
|
|
172
154
|
s ? (l <= 0.5 ? s / (2 * l - s) : s / (2 - (2 * l - s))) : 0,
|
|
173
155
|
(2 * l - s) / 2
|
|
174
156
|
];
|
|
175
157
|
}
|
|
176
|
-
exports.rgbToHsl = rgbToHsl;
|
|
177
158
|
/**
|
|
178
159
|
* Convert HSL to RGB
|
|
179
160
|
* Notes:
|
|
@@ -183,14 +164,12 @@ exports.rgbToHsl = rgbToHsl;
|
|
|
183
164
|
* @param {[number, number, number]} hsl HSL color
|
|
184
165
|
* @returns {[number, number, number]} RGB color
|
|
185
166
|
*/
|
|
186
|
-
function hslToRgb(
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
var f = function (v) { return l - a * Math.max(-1, Math.min(k(v) - 3, Math.min(9 - k(v), 1))); };
|
|
167
|
+
export function hslToRgb([h, s, l]) {
|
|
168
|
+
const a = s * Math.min(l, 1 - l);
|
|
169
|
+
const k = (v) => (v + h / 30) % 12;
|
|
170
|
+
const f = (v) => l - a * Math.max(-1, Math.min(k(v) - 3, Math.min(9 - k(v), 1)));
|
|
191
171
|
return [f(0), f(8), f(4)];
|
|
192
172
|
}
|
|
193
|
-
exports.hslToRgb = hslToRgb;
|
|
194
173
|
// ***************************************************
|
|
195
174
|
// RGB & Hue-Saturation-Brightness (HSB) color spaces
|
|
196
175
|
// ***************************************************
|
|
@@ -203,15 +182,13 @@ exports.hslToRgb = hslToRgb;
|
|
|
203
182
|
* @param {[number, number, number]} rgb RGB color
|
|
204
183
|
* @returns {[number, number, number]} HSB color
|
|
205
184
|
*/
|
|
206
|
-
function rgbToHsb(
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
var h = delta === 0 ? 0 : delta && max === r ? (g - b) / delta : max === g ? 2 + (b - r) / delta : 4 + (r - g) / delta;
|
|
185
|
+
export function rgbToHsb([r, g, b]) {
|
|
186
|
+
const max = Math.max(r, g, b);
|
|
187
|
+
const min = Math.min(r, g, b);
|
|
188
|
+
const delta = max - min;
|
|
189
|
+
const h = delta === 0 ? 0 : delta && max === r ? (g - b) / delta : max === g ? 2 + (b - r) / delta : 4 + (r - g) / delta;
|
|
212
190
|
return [60 * (h < 0 ? h + 6 : h), max && delta / max, max];
|
|
213
191
|
}
|
|
214
|
-
exports.rgbToHsb = rgbToHsb;
|
|
215
192
|
/**
|
|
216
193
|
* Convert HSB to RGB
|
|
217
194
|
* Notes:
|
|
@@ -221,13 +198,11 @@ exports.rgbToHsb = rgbToHsb;
|
|
|
221
198
|
* @param {[number, number, number]} hsb HSB color
|
|
222
199
|
* @returns {[number, number, number]} RGB color
|
|
223
200
|
*/
|
|
224
|
-
function hsbToRgb(
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
var f = function (v) { return b * (1 - s * Math.max(0, Math.min(k(v), 4 - k(v), 1))); };
|
|
201
|
+
export function hsbToRgb([h, s, b]) {
|
|
202
|
+
const k = (v) => (v + h / 60) % 6;
|
|
203
|
+
const f = (v) => b * (1 - s * Math.max(0, Math.min(k(v), 4 - k(v), 1)));
|
|
228
204
|
return [f(5), f(3), f(1)];
|
|
229
205
|
}
|
|
230
|
-
exports.hsbToRgb = hsbToRgb;
|
|
231
206
|
// *********************************************
|
|
232
207
|
// LAB & Hue-Chroma-Luminance (HCL) color spaces
|
|
233
208
|
// *********************************************
|
|
@@ -238,13 +213,11 @@ exports.hsbToRgb = hsbToRgb;
|
|
|
238
213
|
* @param {[number, number, number]} lab LAB color
|
|
239
214
|
* @returns {[number, number, number]} HCL color
|
|
240
215
|
*/
|
|
241
|
-
function labToHcl(
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
var h = abToHue(a, b);
|
|
216
|
+
export function labToHcl([l, a, b]) {
|
|
217
|
+
const c = Math.sqrt(a * a + b * b);
|
|
218
|
+
const h = abToHue(a, b);
|
|
245
219
|
return [h, c, l];
|
|
246
220
|
}
|
|
247
|
-
exports.labToHcl = labToHcl;
|
|
248
221
|
/**
|
|
249
222
|
* Convert HCL to LAB
|
|
250
223
|
* -> http://www.brucelindbloom.com/index.html?Eqn_LCH_to_Lab.html
|
|
@@ -252,13 +225,11 @@ exports.labToHcl = labToHcl;
|
|
|
252
225
|
* @param {[number, number, number]} hcl HCL color
|
|
253
226
|
* @returns {[number, number, number]} LAB color space
|
|
254
227
|
*/
|
|
255
|
-
function hclToLab(
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
var b = c * Math.sin((0, geometry_1.toRadians)(h));
|
|
228
|
+
export function hclToLab([h, c, l]) {
|
|
229
|
+
const a = c * Math.cos(toRadians(h));
|
|
230
|
+
const b = c * Math.sin(toRadians(h));
|
|
259
231
|
return [l, a, b];
|
|
260
232
|
}
|
|
261
|
-
exports.hclToLab = hclToLab;
|
|
262
233
|
/**
|
|
263
234
|
* Convert A and B of LAB to Hue of LCH
|
|
264
235
|
* -> https://stackoverflow.com/questions/53733379/conversion-of-cielab-to-cielchab-not-yielding-correct-result
|
|
@@ -280,7 +251,7 @@ function abToHue(a, b) {
|
|
|
280
251
|
if (a === 0 && b < 0) {
|
|
281
252
|
return 270;
|
|
282
253
|
}
|
|
283
|
-
|
|
254
|
+
let xBias = 0;
|
|
284
255
|
if (a > 0 && b > 0) {
|
|
285
256
|
xBias = 0;
|
|
286
257
|
}
|
|
@@ -290,53 +261,49 @@ function abToHue(a, b) {
|
|
|
290
261
|
else if (a > 0 && b < 0) {
|
|
291
262
|
xBias = 360;
|
|
292
263
|
}
|
|
293
|
-
return
|
|
264
|
+
return toDegrees(Math.atan(b / a)) + xBias;
|
|
294
265
|
}
|
|
295
266
|
// ******************************************
|
|
296
267
|
// LAB & RGB color spaces
|
|
297
268
|
// ******************************************
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
269
|
+
const f1 = (v) => (v * v * v > 0.008856 ? v * v * v : (v - 16 / 116) / 7.787);
|
|
270
|
+
const f2 = (v) => (v > 0.0031308 ? 1.055 * Math.pow(v, 1 / 2.4) - 0.055 : 12.92 * v);
|
|
271
|
+
const f3 = (v) => (v > 0.04045 ? Math.pow((v + 0.055) / 1.055, 2.4) : v / 12.92);
|
|
272
|
+
const f4 = (v) => (v > 0.008856 ? Math.pow(v, 1 / 3) : 7.787 * v + 16 / 116);
|
|
302
273
|
/**
|
|
303
274
|
* Converts LAB to RGB
|
|
304
275
|
*
|
|
305
276
|
* @param {[number, number, number]} lab LAB color
|
|
306
277
|
* @returns {[number, number, number]} RGB color
|
|
307
278
|
*/
|
|
308
|
-
function labToRgb(
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
var z = y - b / 200;
|
|
279
|
+
export function labToRgb([l, a, b]) {
|
|
280
|
+
let y = (l + 16) / 116;
|
|
281
|
+
let x = a / 500 + y;
|
|
282
|
+
let z = y - b / 200;
|
|
313
283
|
x = 0.95047 * f1(x);
|
|
314
284
|
y = 1.0 * f1(y);
|
|
315
285
|
z = 1.08883 * f1(z);
|
|
316
286
|
return [
|
|
317
|
-
|
|
318
|
-
|
|
319
|
-
|
|
287
|
+
clamp(f2(x * 3.2406 + y * -1.5372 + z * -0.4986)),
|
|
288
|
+
clamp(f2(x * -0.9689 + y * 1.8758 + z * 0.0415)),
|
|
289
|
+
clamp(f2(x * 0.0557 + y * -0.204 + z * 1.057))
|
|
320
290
|
];
|
|
321
291
|
}
|
|
322
|
-
exports.labToRgb = labToRgb;
|
|
323
292
|
/**
|
|
324
293
|
* Converts RGB to LAB
|
|
325
294
|
*
|
|
326
295
|
* @param {[number, number, number]} rgb RGB color
|
|
327
296
|
* @returns {[number, number, number]} LAB color
|
|
328
297
|
*/
|
|
329
|
-
function rgbToLab(
|
|
330
|
-
var r = _a[0], g = _a[1], b = _a[2];
|
|
298
|
+
export function rgbToLab([r, g, b]) {
|
|
331
299
|
r = f3(r);
|
|
332
300
|
g = f3(g);
|
|
333
301
|
b = f3(b);
|
|
334
|
-
|
|
335
|
-
|
|
336
|
-
|
|
302
|
+
let x = f4((r * 0.4124 + g * 0.3576 + b * 0.1805) / 0.95047);
|
|
303
|
+
let y = f4((r * 0.2126 + g * 0.7152 + b * 0.0722) / 1);
|
|
304
|
+
let z = f4((r * 0.0193 + g * 0.1192 + b * 0.9505) / 1.08883);
|
|
337
305
|
return [116 * y - 16, 500 * (x - y), 200 * (y - z)];
|
|
338
306
|
}
|
|
339
|
-
exports.rgbToLab = rgbToLab;
|
|
340
307
|
/**
|
|
341
308
|
* Get the delta from two LAB colors
|
|
342
309
|
*
|
|
@@ -344,24 +311,23 @@ exports.rgbToLab = rgbToLab;
|
|
|
344
311
|
* @param {[number, number, number]} labB Second LAB color
|
|
345
312
|
* @returns {number} Delta
|
|
346
313
|
*/
|
|
347
|
-
function deltaE(labA, labB) {
|
|
348
|
-
|
|
349
|
-
|
|
350
|
-
|
|
351
|
-
|
|
352
|
-
|
|
353
|
-
|
|
354
|
-
|
|
314
|
+
export function deltaE(labA, labB) {
|
|
315
|
+
const deltaL = labA[0] - labB[0];
|
|
316
|
+
const deltaA = labA[1] - labB[1];
|
|
317
|
+
const deltaB = labA[2] - labB[2];
|
|
318
|
+
const c1 = Math.sqrt(labA[1] * labA[1] + labA[2] * labA[2]);
|
|
319
|
+
const c2 = Math.sqrt(labB[1] * labB[1] + labB[2] * labB[2]);
|
|
320
|
+
const deltaC = c1 - c2;
|
|
321
|
+
let deltaH = deltaA * deltaA + deltaB * deltaB - deltaC * deltaC;
|
|
355
322
|
deltaH = deltaH < 0 ? 0 : Math.sqrt(deltaH);
|
|
356
|
-
|
|
357
|
-
|
|
358
|
-
|
|
359
|
-
|
|
360
|
-
|
|
361
|
-
|
|
323
|
+
const sc = 1.0 + 0.045 * c1;
|
|
324
|
+
const sh = 1.0 + 0.015 * c1;
|
|
325
|
+
const deltaLKlsl = deltaL / 1;
|
|
326
|
+
const deltaCkcsc = deltaC / sc;
|
|
327
|
+
const deltaHkhsh = deltaH / sh;
|
|
328
|
+
const i = deltaLKlsl * deltaLKlsl + deltaCkcsc * deltaCkcsc + deltaHkhsh * deltaHkhsh;
|
|
362
329
|
return i < 0 ? 0 : Math.sqrt(i);
|
|
363
330
|
}
|
|
364
|
-
exports.deltaE = deltaE;
|
|
365
331
|
// *********************************************
|
|
366
332
|
// RGB & Hue-Chroma-Luminance (HCL) color spaces
|
|
367
333
|
// *********************************************
|
|
@@ -371,19 +337,15 @@ exports.deltaE = deltaE;
|
|
|
371
337
|
* @param {[number, number, number]} rgb RGB color
|
|
372
338
|
* @returns {[number, number, number]} HCL color
|
|
373
339
|
*/
|
|
374
|
-
function rgbToHcl(
|
|
375
|
-
var r = _a[0], g = _a[1], b = _a[2];
|
|
340
|
+
export function rgbToHcl([r, g, b]) {
|
|
376
341
|
return labToHcl(rgbToLab([r, g, b]));
|
|
377
342
|
}
|
|
378
|
-
exports.rgbToHcl = rgbToHcl;
|
|
379
343
|
/**
|
|
380
344
|
* Converts HCL to RGB
|
|
381
345
|
*
|
|
382
346
|
* @param {[number, number, number]} hcl RGB color
|
|
383
347
|
* @returns {[number, number, number]} RGB color
|
|
384
348
|
*/
|
|
385
|
-
function hclToRgb(
|
|
386
|
-
var h = _a[0], c = _a[1], l = _a[2];
|
|
349
|
+
export function hclToRgb([h, c, l]) {
|
|
387
350
|
return labToRgb(hclToLab([h, c, l]));
|
|
388
351
|
}
|
|
389
|
-
exports.hclToRgb = hclToRgb;
|
package/lib/constants.js
CHANGED
|
@@ -1,20 +1,17 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.W3CX11 = exports.QUARTER_PI = exports.HALF_PI = exports.TWO_PI = exports.PI = exports.EPSILON = void 0;
|
|
4
1
|
// *********************
|
|
5
2
|
// Maths
|
|
6
3
|
// *********************
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
4
|
+
export const EPSILON = 1e-10;
|
|
5
|
+
export const PI = Math.PI;
|
|
6
|
+
export const TWO_PI = Math.PI * 2;
|
|
7
|
+
export const HALF_PI = Math.PI / 2;
|
|
8
|
+
export const QUARTER_PI = Math.PI / 4;
|
|
12
9
|
// *********************
|
|
13
10
|
// Colors
|
|
14
11
|
// *********************
|
|
15
12
|
// X11 colors
|
|
16
13
|
// -> https://www.w3.org/TR/css-color-3/#svg-color
|
|
17
|
-
|
|
14
|
+
export const W3CX11 = {
|
|
18
15
|
aliceblue: 0xf0f8ff,
|
|
19
16
|
antiquewhite: 0xfaebd7,
|
|
20
17
|
aqua: 0x00ffff,
|
package/lib/dom.js
CHANGED
|
@@ -1,7 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.injectStyles = exports.createCanvas = exports.closest = void 0;
|
|
4
|
-
var DOCUMENT_NODE_TYPE = 9;
|
|
1
|
+
const DOCUMENT_NODE_TYPE = 9;
|
|
5
2
|
/**
|
|
6
3
|
* Find the closest parent that matches a selector
|
|
7
4
|
*
|
|
@@ -9,8 +6,8 @@ var DOCUMENT_NODE_TYPE = 9;
|
|
|
9
6
|
* @param {Element|string} selector Selector or parent to match
|
|
10
7
|
* @returns {Element|null}
|
|
11
8
|
*/
|
|
12
|
-
function closest(element, selector) {
|
|
13
|
-
|
|
9
|
+
export function closest(element, selector) {
|
|
10
|
+
let current = element;
|
|
14
11
|
while (current && current.nodeType !== DOCUMENT_NODE_TYPE) {
|
|
15
12
|
if ((typeof selector === 'string' && current.matches(selector)) || current === selector) {
|
|
16
13
|
return current;
|
|
@@ -19,7 +16,6 @@ function closest(element, selector) {
|
|
|
19
16
|
}
|
|
20
17
|
return current;
|
|
21
18
|
}
|
|
22
|
-
exports.closest = closest;
|
|
23
19
|
/**
|
|
24
20
|
* Create a canvas and 2d context
|
|
25
21
|
*
|
|
@@ -27,27 +23,24 @@ exports.closest = closest;
|
|
|
27
23
|
* @param {number} height Height of the canvas
|
|
28
24
|
* @returns {{ canvas: HTMLCanvasElement, ctx: CanvasRenderingContext2D }}
|
|
29
25
|
*/
|
|
30
|
-
function createCanvas(width, height) {
|
|
31
|
-
|
|
32
|
-
var canvas = document.createElement('canvas');
|
|
26
|
+
export function createCanvas(width, height) {
|
|
27
|
+
const canvas = document.createElement('canvas');
|
|
33
28
|
canvas.width = width;
|
|
34
29
|
canvas.height = height;
|
|
35
|
-
|
|
36
|
-
return { canvas
|
|
30
|
+
const ctx = canvas.getContext('2d') ?? new CanvasRenderingContext2D();
|
|
31
|
+
return { canvas, ctx };
|
|
37
32
|
}
|
|
38
|
-
exports.createCanvas = createCanvas;
|
|
39
33
|
/**
|
|
40
34
|
* Inject CSS styles in `document.head`
|
|
41
35
|
*
|
|
42
36
|
* @param {string} styles CSS styles to inject
|
|
43
37
|
*/
|
|
44
|
-
function injectStyles(styles) {
|
|
45
|
-
|
|
38
|
+
export function injectStyles(styles) {
|
|
39
|
+
const $style = document.createElement('style');
|
|
46
40
|
$style.innerHTML = styles;
|
|
47
|
-
|
|
41
|
+
const $before = document.querySelector('head link[rel=stylesheet], head style');
|
|
48
42
|
if ($before)
|
|
49
43
|
document.head.insertBefore($style, $before);
|
|
50
44
|
else
|
|
51
45
|
document.head.appendChild($style);
|
|
52
46
|
}
|
|
53
|
-
exports.injectStyles = injectStyles;
|
package/lib/files.js
CHANGED
|
@@ -1,38 +1,32 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.upload = exports.download = void 0;
|
|
4
1
|
/**
|
|
5
2
|
* Download a Blob object into user files
|
|
6
3
|
*
|
|
7
4
|
* @param {Blob} blob Blob object to download
|
|
8
5
|
* @param {string} filename Downloaded file name
|
|
9
6
|
*/
|
|
10
|
-
function download(blob, filename) {
|
|
11
|
-
|
|
7
|
+
export function download(blob, filename) {
|
|
8
|
+
const link = document.createElement('a');
|
|
12
9
|
link.setAttribute('href', URL.createObjectURL(blob));
|
|
13
10
|
link.setAttribute('download', filename);
|
|
14
11
|
document.body.appendChild(link);
|
|
15
12
|
link.click();
|
|
16
13
|
document.body.removeChild(link);
|
|
17
14
|
}
|
|
18
|
-
exports.download = download;
|
|
19
15
|
/**
|
|
20
16
|
* Upload a file from user files
|
|
21
17
|
*
|
|
22
18
|
* @param {Function} onLoad Callback called once the file is loaded
|
|
23
19
|
* @param {string} [accept=''] MIME type the file input should accept
|
|
24
20
|
*/
|
|
25
|
-
function upload(onLoad, accept) {
|
|
26
|
-
|
|
27
|
-
var input = document.createElement('input');
|
|
21
|
+
export function upload(onLoad, accept = '') {
|
|
22
|
+
const input = document.createElement('input');
|
|
28
23
|
input.setAttribute('type', 'file');
|
|
29
24
|
input.setAttribute('accept', accept);
|
|
30
|
-
input.addEventListener('change',
|
|
31
|
-
|
|
32
|
-
var file = (_b = (_a = event.target) === null || _a === void 0 ? void 0 : _a.files) === null || _b === void 0 ? void 0 : _b[0];
|
|
25
|
+
input.addEventListener('change', (event) => {
|
|
26
|
+
const file = event.target?.files?.[0];
|
|
33
27
|
if (file) {
|
|
34
|
-
|
|
35
|
-
fileReader.addEventListener('load',
|
|
28
|
+
const fileReader = new FileReader();
|
|
29
|
+
fileReader.addEventListener('load', () => onLoad(URL.createObjectURL(file)));
|
|
36
30
|
fileReader.readAsDataURL(file);
|
|
37
31
|
}
|
|
38
32
|
});
|
|
@@ -40,4 +34,3 @@ function upload(onLoad, accept) {
|
|
|
40
34
|
input.click();
|
|
41
35
|
document.body.removeChild(input);
|
|
42
36
|
}
|
|
43
|
-
exports.upload = upload;
|
package/lib/functions.d.ts
CHANGED