toosoon-utils 4.2.3 → 4.3.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 +501 -603
- package/lib/colors.d.ts +147 -66
- package/lib/colors.js +149 -63
- package/lib/constants.js +1 -1
- package/lib/dom.d.ts +1 -1
- package/lib/dom.js +1 -1
- package/lib/extras/colors/Color.d.ts +406 -0
- package/lib/extras/colors/Color.js +546 -0
- package/lib/extras/colors/ColorPalette.d.ts +105 -0
- package/lib/extras/colors/ColorPalette.js +124 -0
- package/lib/extras/colors/ColorScale.d.ts +257 -0
- package/lib/extras/colors/ColorScale.js +347 -0
- package/lib/extras/colors/_ColorScale.d.ts +62 -0
- package/lib/extras/colors/_ColorScale.js +156 -0
- package/lib/extras/colors/index.d.ts +3 -0
- package/lib/extras/colors/index.js +3 -0
- package/lib/extras/frame-rate/FrameRate.d.ts +12 -9
- package/lib/extras/frame-rate/FrameRate.js +10 -7
- package/lib/extras/geometry/Vector.d.ts +1 -1
- package/lib/extras/geometry/Vector2.d.ts +17 -11
- package/lib/extras/geometry/Vector2.js +29 -23
- package/lib/extras/geometry/Vector3.d.ts +5 -5
- package/lib/extras/geometry/Vector3.js +10 -10
- package/lib/extras/paths/Path.d.ts +3 -3
- package/lib/extras/paths/Path.js +10 -10
- package/lib/extras/paths/PathContext.d.ts +7 -10
- package/lib/extras/paths/PathContext.js +79 -102
- package/lib/extras/paths/PathSVG.d.ts +31 -25
- package/lib/extras/paths/PathSVG.js +36 -39
- package/lib/extras/paths/index.d.ts +1 -1
- package/lib/geometry.d.ts +7 -7
- package/lib/geometry.js +13 -13
- package/lib/maths.d.ts +19 -13
- package/lib/maths.js +23 -17
- package/lib/prng.d.ts +4 -4
- package/lib/prng.js +4 -4
- package/lib/random.d.ts +4 -4
- package/lib/random.js +4 -4
- package/lib/strings.d.ts +14 -8
- package/lib/strings.js +14 -8
- package/lib/tsconfig.tsbuildinfo +1 -1
- package/lib/types.d.ts +15 -8
- package/package.json +14 -14
package/lib/colors.d.ts
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
import type { ColorRepresentation } from './types';
|
|
1
|
+
import type { ColorHex, ColorRgb, ColorHsl, ColorHsb, ColorHcl, ColorLab, ColorRepresentation } from './types';
|
|
2
2
|
/**
|
|
3
3
|
* Normalize a color representation into RGB
|
|
4
4
|
*
|
|
5
5
|
* @param {ColorRepresentation} color Color representation
|
|
6
|
-
* @returns {
|
|
6
|
+
* @returns {ColorRgb} Normalized RGB color
|
|
7
7
|
*/
|
|
8
|
-
export declare function normalizeColor(color: ColorRepresentation):
|
|
8
|
+
export declare function normalizeColor(color: ColorRepresentation): ColorRgb;
|
|
9
9
|
/**
|
|
10
10
|
* Normalize an hexadecimal string
|
|
11
11
|
*
|
|
@@ -15,28 +15,34 @@ export declare function normalizeColor(color: ColorRepresentation): [number, num
|
|
|
15
15
|
export declare function normalizeHexString(hex: string): string;
|
|
16
16
|
/**
|
|
17
17
|
* Convert RGB to hexadecimal
|
|
18
|
-
* Note: rgb values are contained in the interval [0, 1]
|
|
19
18
|
*
|
|
20
|
-
*
|
|
21
|
-
*
|
|
19
|
+
* Note:
|
|
20
|
+
* - RGB values are contained in the interval [0, 1]
|
|
21
|
+
*
|
|
22
|
+
* @param {ColorRgb} rgb RGB color
|
|
23
|
+
* @returns {ColorHex} Hexadecimal color
|
|
22
24
|
*/
|
|
23
|
-
export declare function rgbToHex([r, g, b]:
|
|
25
|
+
export declare function rgbToHex([r, g, b]: ColorRgb): ColorHex;
|
|
24
26
|
/**
|
|
25
27
|
* Convert RGB to hexadecimal string
|
|
26
|
-
* Note: rgb values are contained in the interval [0, 1]
|
|
27
28
|
*
|
|
28
|
-
*
|
|
29
|
+
* Note:
|
|
30
|
+
* - RGB values are contained in the interval [0, 1]
|
|
31
|
+
*
|
|
32
|
+
* @param {ColorRgb} rgb RGB color
|
|
29
33
|
* @returns {string} Hexadecimal string
|
|
30
34
|
*/
|
|
31
|
-
export declare function rgbToHexString([r, g, b]:
|
|
35
|
+
export declare function rgbToHexString([r, g, b]: ColorRgb): string;
|
|
32
36
|
/**
|
|
33
37
|
* Convert hexadecimal to RGB
|
|
34
|
-
* Note: rgb values are contained in the interval [0, 1]
|
|
35
38
|
*
|
|
36
|
-
*
|
|
37
|
-
*
|
|
39
|
+
* Note:
|
|
40
|
+
* - RGB values are contained in the interval [0, 1]
|
|
41
|
+
*
|
|
42
|
+
* @param {ColorHex|string} hex Hexadecimal color
|
|
43
|
+
* @returns {ColorRgb} RGB color
|
|
38
44
|
*/
|
|
39
|
-
export declare function hexToRgb(hex:
|
|
45
|
+
export declare function hexToRgb(hex: ColorHex | string): ColorRgb;
|
|
40
46
|
/**
|
|
41
47
|
* Lighten a color
|
|
42
48
|
*
|
|
@@ -55,101 +61,176 @@ export declare function lighten(hex: string, amount?: number): string;
|
|
|
55
61
|
export declare function darken(hex: string, amount?: number): string;
|
|
56
62
|
/**
|
|
57
63
|
* Normalize an HSL string
|
|
58
|
-
*
|
|
64
|
+
*
|
|
65
|
+
* Note:
|
|
66
|
+
* - HSL values are contained in the intervals:
|
|
67
|
+
* - Hue: [0, 360]
|
|
68
|
+
* - Saturation: [0, 1]
|
|
69
|
+
* - Lightness: [0, 1]
|
|
59
70
|
*
|
|
60
71
|
* @param {string} hsl HSL string (format: 'hsl(360, 100%, 100%)')
|
|
61
|
-
* @returns {
|
|
72
|
+
* @returns {ColorHsl} Normalized HSL color
|
|
62
73
|
*/
|
|
63
|
-
export declare function normalizeHslString(hsl: string):
|
|
74
|
+
export declare function normalizeHslString(hsl: string): ColorHsl;
|
|
64
75
|
/**
|
|
65
76
|
* Convert RGB to HSL
|
|
77
|
+
*
|
|
66
78
|
* Notes:
|
|
67
|
-
*
|
|
68
|
-
*
|
|
79
|
+
* - RGB values are contained in the interval [0, 1]
|
|
80
|
+
* - HSL values are contained in the intervals:
|
|
81
|
+
* - Hue: [0, 360]
|
|
82
|
+
* - Saturation: [0, 1]
|
|
83
|
+
* - Lightness: [0, 1]
|
|
69
84
|
*
|
|
70
|
-
* @param {
|
|
71
|
-
* @returns {
|
|
85
|
+
* @param {ColorHgb} rgb RGB color
|
|
86
|
+
* @returns {ColorHsl} HSL color
|
|
72
87
|
*/
|
|
73
|
-
export declare function rgbToHsl([r, g, b]:
|
|
88
|
+
export declare function rgbToHsl([r, g, b]: ColorRgb): ColorHsl;
|
|
74
89
|
/**
|
|
75
90
|
* Convert HSL to RGB
|
|
91
|
+
*
|
|
76
92
|
* Notes:
|
|
77
|
-
*
|
|
78
|
-
*
|
|
93
|
+
* - RGB values are contained in the interval [0, 1]
|
|
94
|
+
* - HSL values are contained in the intervals:
|
|
95
|
+
* - Hue: [0, 360]
|
|
96
|
+
* - Saturation: [0, 1]
|
|
97
|
+
* - Lightness: [0, 1]
|
|
79
98
|
*
|
|
80
|
-
* @param {
|
|
81
|
-
* @returns {
|
|
99
|
+
* @param {ColorHsl} hsl HSL color
|
|
100
|
+
* @returns {ColorRgb} RGB color
|
|
82
101
|
*/
|
|
83
|
-
export declare function hslToRgb([h, s, l]:
|
|
102
|
+
export declare function hslToRgb([h, s, l]: ColorHsl): ColorRgb;
|
|
84
103
|
/**
|
|
85
104
|
* Convert RGB to HSB
|
|
105
|
+
*
|
|
86
106
|
* Notes:
|
|
87
|
-
*
|
|
88
|
-
*
|
|
107
|
+
* - RGB values are contained in the interval [0, 1]
|
|
108
|
+
* - HSB values are contained in the intervals:
|
|
109
|
+
* - Hue: [0, 360]
|
|
110
|
+
* - Saturation: [0, 1]
|
|
111
|
+
* - Brightness: [0, 1]
|
|
89
112
|
*
|
|
90
|
-
* @param {
|
|
91
|
-
* @returns {
|
|
113
|
+
* @param {ColorRgb} rgb RGB color
|
|
114
|
+
* @returns {ColorHsb} HSB color
|
|
92
115
|
*/
|
|
93
|
-
export declare function rgbToHsb([r, g, b]:
|
|
116
|
+
export declare function rgbToHsb([r, g, b]: ColorRgb): ColorHsb;
|
|
94
117
|
/**
|
|
95
118
|
* Convert HSB to RGB
|
|
119
|
+
*
|
|
96
120
|
* Notes:
|
|
97
|
-
*
|
|
98
|
-
*
|
|
121
|
+
* - RGB values are contained in the interval [0, 1]
|
|
122
|
+
* - HSB values are contained in the intervals:
|
|
123
|
+
* - Hue: [0, 360]
|
|
124
|
+
* - Saturation: [0, 1]
|
|
125
|
+
* - Brightness: [0, 1]
|
|
99
126
|
*
|
|
100
|
-
* @param {
|
|
101
|
-
* @returns {
|
|
127
|
+
* @param {ColorHsb} hsb HSB color
|
|
128
|
+
* @returns {ColorRgb} RGB color
|
|
102
129
|
*/
|
|
103
|
-
export declare function hsbToRgb([h, s, b]:
|
|
130
|
+
export declare function hsbToRgb([h, s, b]: ColorHsb): ColorRgb;
|
|
104
131
|
/**
|
|
105
|
-
* Convert
|
|
106
|
-
*
|
|
132
|
+
* Convert L*a*b* to HCL
|
|
133
|
+
* -> http://www.brucelindbloom.com/index.html?Eqn_Lab_to_LCH.html
|
|
107
134
|
*
|
|
108
|
-
*
|
|
109
|
-
*
|
|
135
|
+
* Notes:
|
|
136
|
+
* - L*a*b* values are contained in the intervals:
|
|
137
|
+
* - Lightness: [0 à 100]
|
|
138
|
+
* - a (green, red): [~-128, ~+128]
|
|
139
|
+
* - b (blue, yellow): [~-128, ~+128]
|
|
140
|
+
* - HCL values are contained in the intervals:
|
|
141
|
+
* - Hue: [0, 360]
|
|
142
|
+
* - Chroma: [0, ~150]
|
|
143
|
+
* - Lightness: [0, 100]
|
|
144
|
+
*
|
|
145
|
+
* @param {ColorLab} lab LAB color
|
|
146
|
+
* @returns {ColorHcl} HCL color
|
|
110
147
|
*/
|
|
111
|
-
export declare function labToHcl([l, a, b]:
|
|
148
|
+
export declare function labToHcl([l, a, b]: ColorLab): ColorHcl;
|
|
112
149
|
/**
|
|
113
|
-
* Convert HCL to
|
|
114
|
-
*
|
|
150
|
+
* Convert HCL to L*a*b*
|
|
151
|
+
* -> http://www.brucelindbloom.com/index.html?Eqn_LCH_to_Lab.html
|
|
115
152
|
*
|
|
116
|
-
*
|
|
117
|
-
*
|
|
153
|
+
* Notes:
|
|
154
|
+
* - HCL values are contained in the intervals:
|
|
155
|
+
* - Hue: [0, 360]
|
|
156
|
+
* - Chroma: [0, ~150]
|
|
157
|
+
* - Lightness: [0, 100]
|
|
158
|
+
* - L*a*b* values are contained in the intervals:
|
|
159
|
+
* - Lightness: [0 à 100]
|
|
160
|
+
* - a (green, red): [~-128, ~+128]
|
|
161
|
+
* - b (blue, yellow): [~-128, ~+128]
|
|
162
|
+
*
|
|
163
|
+
* @param {ColorHcl} hcl HCL color
|
|
164
|
+
* @returns {ColorLab} LAB color
|
|
118
165
|
*/
|
|
119
|
-
export declare function hclToLab([h, c, l]:
|
|
166
|
+
export declare function hclToLab([h, c, l]: ColorHcl): ColorLab;
|
|
120
167
|
/**
|
|
121
|
-
*
|
|
168
|
+
* Convert L*a*b* to RGB
|
|
169
|
+
*
|
|
170
|
+
* Notes:
|
|
171
|
+
* - RGB values are contained in the interval [0, 1]
|
|
172
|
+
* - L*a*b* values are contained in the intervals:
|
|
173
|
+
* - Lightness: [0 à 100]
|
|
174
|
+
* - a (green, red): [~-128, ~+128]
|
|
175
|
+
* - b (blue, yellow): [~-128, ~+128]
|
|
122
176
|
*
|
|
123
|
-
* @param {
|
|
124
|
-
* @returns {
|
|
177
|
+
* @param {ColorLab} lab L*a*b* color
|
|
178
|
+
* @returns {ColorRgb} RGB color
|
|
125
179
|
*/
|
|
126
|
-
export declare function labToRgb([l, a, b]:
|
|
180
|
+
export declare function labToRgb([l, a, b]: ColorLab): ColorRgb;
|
|
127
181
|
/**
|
|
128
|
-
*
|
|
182
|
+
* Convert RGB to L*a*b*
|
|
183
|
+
*
|
|
184
|
+
* Notes:
|
|
185
|
+
* - RGB values are contained in the interval [0, 1]
|
|
186
|
+
* - L*a*b* values are contained in the intervals:
|
|
187
|
+
* - Lightness: [0 à 100]
|
|
188
|
+
* - a (green, red): [~-128, ~+128]
|
|
189
|
+
* - b (blue, yellow): [~-128, ~+128]
|
|
129
190
|
*
|
|
130
|
-
* @param {
|
|
131
|
-
* @returns {
|
|
191
|
+
* @param {ColorRgb} rgb RGB color
|
|
192
|
+
* @returns {ColorLab} L*a*b* color
|
|
132
193
|
*/
|
|
133
|
-
export declare function rgbToLab([r, g, b]:
|
|
194
|
+
export declare function rgbToLab([r, g, b]: ColorRgb): ColorLab;
|
|
134
195
|
/**
|
|
135
|
-
* Get the delta from two
|
|
196
|
+
* Get the delta from two L*a*b* colors
|
|
136
197
|
*
|
|
137
|
-
*
|
|
138
|
-
*
|
|
139
|
-
*
|
|
198
|
+
* Note:
|
|
199
|
+
* - L*a*b* values are contained in the intervals:
|
|
200
|
+
* - Lightness: [0 à 100]
|
|
201
|
+
* - a (green, red): [~-128, ~+128]
|
|
202
|
+
* - b (blue, yellow): [~-128, ~+128]
|
|
203
|
+
*
|
|
204
|
+
* @param {ColorLab} lab1 First L*a*b* color
|
|
205
|
+
* @param {ColorLab} lab2 Second L*a*b* color
|
|
206
|
+
* @returns {number}
|
|
140
207
|
*/
|
|
141
|
-
export declare function deltaE(
|
|
208
|
+
export declare function deltaE(lab1: ColorLab, lab2: ColorLab): number;
|
|
142
209
|
/**
|
|
143
210
|
* Convert RGB to HCL
|
|
144
211
|
*
|
|
145
|
-
*
|
|
146
|
-
*
|
|
212
|
+
* Notes:
|
|
213
|
+
* - RGB values are contained in the interval [0, 1]
|
|
214
|
+
* - HCL values are contained in the intervals:
|
|
215
|
+
* - Hue: [0, 360]
|
|
216
|
+
* - Chroma: [0, ~150]
|
|
217
|
+
* - Luminance: [0, 100]
|
|
218
|
+
*
|
|
219
|
+
* @param {ColorRgb} rgb RGB color
|
|
220
|
+
* @returns {ColorHcl} HCL color
|
|
147
221
|
*/
|
|
148
|
-
export declare function rgbToHcl([r, g, b]:
|
|
222
|
+
export declare function rgbToHcl([r, g, b]: ColorRgb): ColorHcl;
|
|
149
223
|
/**
|
|
150
224
|
* Converts HCL to RGB
|
|
151
225
|
*
|
|
152
|
-
*
|
|
153
|
-
*
|
|
226
|
+
* Notes:
|
|
227
|
+
* - RGB values are contained in the interval [0, 1]
|
|
228
|
+
* - HCL values are contained in the intervals:
|
|
229
|
+
* - Hue: [0, 360]
|
|
230
|
+
* - Chroma: [0, ~150]
|
|
231
|
+
* - Luminance: [0, 100]
|
|
232
|
+
*
|
|
233
|
+
* @param {ColorHcl} hcl RGB color
|
|
234
|
+
* @returns {ColorRgb} RGB color
|
|
154
235
|
*/
|
|
155
|
-
export declare function hclToRgb([h, c, l]:
|
|
236
|
+
export declare function hclToRgb([h, c, l]: ColorHcl): ColorRgb;
|
package/lib/colors.js
CHANGED
|
@@ -5,7 +5,7 @@ import { clamp } from './maths';
|
|
|
5
5
|
* Normalize a color representation into RGB
|
|
6
6
|
*
|
|
7
7
|
* @param {ColorRepresentation} color Color representation
|
|
8
|
-
* @returns {
|
|
8
|
+
* @returns {ColorRgb} Normalized RGB color
|
|
9
9
|
*/
|
|
10
10
|
export function normalizeColor(color) {
|
|
11
11
|
if (typeof color === 'string') {
|
|
@@ -47,19 +47,23 @@ export function normalizeHexString(hex) {
|
|
|
47
47
|
}
|
|
48
48
|
/**
|
|
49
49
|
* Convert RGB to hexadecimal
|
|
50
|
-
* Note: rgb values are contained in the interval [0, 1]
|
|
51
50
|
*
|
|
52
|
-
*
|
|
53
|
-
*
|
|
51
|
+
* Note:
|
|
52
|
+
* - RGB values are contained in the interval [0, 1]
|
|
53
|
+
*
|
|
54
|
+
* @param {ColorRgb} rgb RGB color
|
|
55
|
+
* @returns {ColorHex} Hexadecimal color
|
|
54
56
|
*/
|
|
55
57
|
export function rgbToHex([r, g, b]) {
|
|
56
58
|
return ((r * 255) << 16) ^ ((g * 255) << 8) ^ ((b * 255) << 0);
|
|
57
59
|
}
|
|
58
60
|
/**
|
|
59
61
|
* Convert RGB to hexadecimal string
|
|
60
|
-
* Note: rgb values are contained in the interval [0, 1]
|
|
61
62
|
*
|
|
62
|
-
*
|
|
63
|
+
* Note:
|
|
64
|
+
* - RGB values are contained in the interval [0, 1]
|
|
65
|
+
*
|
|
66
|
+
* @param {ColorRgb} rgb RGB color
|
|
63
67
|
* @returns {string} Hexadecimal string
|
|
64
68
|
*/
|
|
65
69
|
export function rgbToHexString([r, g, b]) {
|
|
@@ -71,10 +75,12 @@ export function rgbToHexString([r, g, b]) {
|
|
|
71
75
|
}
|
|
72
76
|
/**
|
|
73
77
|
* Convert hexadecimal to RGB
|
|
74
|
-
* Note: rgb values are contained in the interval [0, 1]
|
|
75
78
|
*
|
|
76
|
-
*
|
|
77
|
-
*
|
|
79
|
+
* Note:
|
|
80
|
+
* - RGB values are contained in the interval [0, 1]
|
|
81
|
+
*
|
|
82
|
+
* @param {ColorHex|string} hex Hexadecimal color
|
|
83
|
+
* @returns {ColorRgb} RGB color
|
|
78
84
|
*/
|
|
79
85
|
export function hexToRgb(hex) {
|
|
80
86
|
if (typeof hex === 'number') {
|
|
@@ -127,10 +133,15 @@ export function darken(hex, amount = 0) {
|
|
|
127
133
|
// ***************************************************
|
|
128
134
|
/**
|
|
129
135
|
* Normalize an HSL string
|
|
130
|
-
*
|
|
136
|
+
*
|
|
137
|
+
* Note:
|
|
138
|
+
* - HSL values are contained in the intervals:
|
|
139
|
+
* - Hue: [0, 360]
|
|
140
|
+
* - Saturation: [0, 1]
|
|
141
|
+
* - Lightness: [0, 1]
|
|
131
142
|
*
|
|
132
143
|
* @param {string} hsl HSL string (format: 'hsl(360, 100%, 100%)')
|
|
133
|
-
* @returns {
|
|
144
|
+
* @returns {ColorHsl} Normalized HSL color
|
|
134
145
|
*/
|
|
135
146
|
export function normalizeHslString(hsl) {
|
|
136
147
|
const [h, s, l] = hsl.match(/\d+/g)?.map(Number) ?? [0, 0, 0];
|
|
@@ -138,12 +149,16 @@ export function normalizeHslString(hsl) {
|
|
|
138
149
|
}
|
|
139
150
|
/**
|
|
140
151
|
* Convert RGB to HSL
|
|
152
|
+
*
|
|
141
153
|
* Notes:
|
|
142
|
-
*
|
|
143
|
-
*
|
|
154
|
+
* - RGB values are contained in the interval [0, 1]
|
|
155
|
+
* - HSL values are contained in the intervals:
|
|
156
|
+
* - Hue: [0, 360]
|
|
157
|
+
* - Saturation: [0, 1]
|
|
158
|
+
* - Lightness: [0, 1]
|
|
144
159
|
*
|
|
145
|
-
* @param {
|
|
146
|
-
* @returns {
|
|
160
|
+
* @param {ColorHgb} rgb RGB color
|
|
161
|
+
* @returns {ColorHsl} HSL color
|
|
147
162
|
*/
|
|
148
163
|
export function rgbToHsl([r, g, b]) {
|
|
149
164
|
const l = Math.max(r, g, b);
|
|
@@ -157,12 +172,16 @@ export function rgbToHsl([r, g, b]) {
|
|
|
157
172
|
}
|
|
158
173
|
/**
|
|
159
174
|
* Convert HSL to RGB
|
|
175
|
+
*
|
|
160
176
|
* Notes:
|
|
161
|
-
*
|
|
162
|
-
*
|
|
177
|
+
* - RGB values are contained in the interval [0, 1]
|
|
178
|
+
* - HSL values are contained in the intervals:
|
|
179
|
+
* - Hue: [0, 360]
|
|
180
|
+
* - Saturation: [0, 1]
|
|
181
|
+
* - Lightness: [0, 1]
|
|
163
182
|
*
|
|
164
|
-
* @param {
|
|
165
|
-
* @returns {
|
|
183
|
+
* @param {ColorHsl} hsl HSL color
|
|
184
|
+
* @returns {ColorRgb} RGB color
|
|
166
185
|
*/
|
|
167
186
|
export function hslToRgb([h, s, l]) {
|
|
168
187
|
const a = s * Math.min(l, 1 - l);
|
|
@@ -175,12 +194,16 @@ export function hslToRgb([h, s, l]) {
|
|
|
175
194
|
// ***************************************************
|
|
176
195
|
/**
|
|
177
196
|
* Convert RGB to HSB
|
|
197
|
+
*
|
|
178
198
|
* Notes:
|
|
179
|
-
*
|
|
180
|
-
*
|
|
199
|
+
* - RGB values are contained in the interval [0, 1]
|
|
200
|
+
* - HSB values are contained in the intervals:
|
|
201
|
+
* - Hue: [0, 360]
|
|
202
|
+
* - Saturation: [0, 1]
|
|
203
|
+
* - Brightness: [0, 1]
|
|
181
204
|
*
|
|
182
|
-
* @param {
|
|
183
|
-
* @returns {
|
|
205
|
+
* @param {ColorRgb} rgb RGB color
|
|
206
|
+
* @returns {ColorHsb} HSB color
|
|
184
207
|
*/
|
|
185
208
|
export function rgbToHsb([r, g, b]) {
|
|
186
209
|
const max = Math.max(r, g, b);
|
|
@@ -191,27 +214,41 @@ export function rgbToHsb([r, g, b]) {
|
|
|
191
214
|
}
|
|
192
215
|
/**
|
|
193
216
|
* Convert HSB to RGB
|
|
217
|
+
*
|
|
194
218
|
* Notes:
|
|
195
|
-
*
|
|
196
|
-
*
|
|
219
|
+
* - RGB values are contained in the interval [0, 1]
|
|
220
|
+
* - HSB values are contained in the intervals:
|
|
221
|
+
* - Hue: [0, 360]
|
|
222
|
+
* - Saturation: [0, 1]
|
|
223
|
+
* - Brightness: [0, 1]
|
|
197
224
|
*
|
|
198
|
-
* @param {
|
|
199
|
-
* @returns {
|
|
225
|
+
* @param {ColorHsb} hsb HSB color
|
|
226
|
+
* @returns {ColorRgb} RGB color
|
|
200
227
|
*/
|
|
201
228
|
export function hsbToRgb([h, s, b]) {
|
|
202
229
|
const k = (v) => (v + h / 60) % 6;
|
|
203
230
|
const f = (v) => b * (1 - s * Math.max(0, Math.min(k(v), 4 - k(v), 1)));
|
|
204
231
|
return [f(5), f(3), f(1)];
|
|
205
232
|
}
|
|
206
|
-
//
|
|
207
|
-
//
|
|
208
|
-
//
|
|
233
|
+
// ************************************************
|
|
234
|
+
// L*a*b* & Hue-Chroma-Luminance (HCL) color spaces
|
|
235
|
+
// ************************************************
|
|
209
236
|
/**
|
|
210
|
-
* Convert
|
|
211
|
-
*
|
|
237
|
+
* Convert L*a*b* to HCL
|
|
238
|
+
* -> http://www.brucelindbloom.com/index.html?Eqn_Lab_to_LCH.html
|
|
239
|
+
*
|
|
240
|
+
* Notes:
|
|
241
|
+
* - L*a*b* values are contained in the intervals:
|
|
242
|
+
* - Lightness: [0 à 100]
|
|
243
|
+
* - a (green, red): [~-128, ~+128]
|
|
244
|
+
* - b (blue, yellow): [~-128, ~+128]
|
|
245
|
+
* - HCL values are contained in the intervals:
|
|
246
|
+
* - Hue: [0, 360]
|
|
247
|
+
* - Chroma: [0, ~150]
|
|
248
|
+
* - Lightness: [0, 100]
|
|
212
249
|
*
|
|
213
|
-
* @param {
|
|
214
|
-
* @returns {
|
|
250
|
+
* @param {ColorLab} lab LAB color
|
|
251
|
+
* @returns {ColorHcl} HCL color
|
|
215
252
|
*/
|
|
216
253
|
export function labToHcl([l, a, b]) {
|
|
217
254
|
const c = Math.sqrt(a * a + b * b);
|
|
@@ -219,11 +256,21 @@ export function labToHcl([l, a, b]) {
|
|
|
219
256
|
return [h, c, l];
|
|
220
257
|
}
|
|
221
258
|
/**
|
|
222
|
-
* Convert HCL to
|
|
223
|
-
*
|
|
259
|
+
* Convert HCL to L*a*b*
|
|
260
|
+
* -> http://www.brucelindbloom.com/index.html?Eqn_LCH_to_Lab.html
|
|
224
261
|
*
|
|
225
|
-
*
|
|
226
|
-
*
|
|
262
|
+
* Notes:
|
|
263
|
+
* - HCL values are contained in the intervals:
|
|
264
|
+
* - Hue: [0, 360]
|
|
265
|
+
* - Chroma: [0, ~150]
|
|
266
|
+
* - Lightness: [0, 100]
|
|
267
|
+
* - L*a*b* values are contained in the intervals:
|
|
268
|
+
* - Lightness: [0 à 100]
|
|
269
|
+
* - a (green, red): [~-128, ~+128]
|
|
270
|
+
* - b (blue, yellow): [~-128, ~+128]
|
|
271
|
+
*
|
|
272
|
+
* @param {ColorHcl} hcl HCL color
|
|
273
|
+
* @returns {ColorLab} LAB color
|
|
227
274
|
*/
|
|
228
275
|
export function hclToLab([h, c, l]) {
|
|
229
276
|
const a = c * Math.cos(toRadians(h));
|
|
@@ -231,11 +278,16 @@ export function hclToLab([h, c, l]) {
|
|
|
231
278
|
return [l, a, b];
|
|
232
279
|
}
|
|
233
280
|
/**
|
|
234
|
-
* Convert
|
|
235
|
-
*
|
|
281
|
+
* Convert a and b of L*a*b* to Hue of HCL
|
|
282
|
+
* -> https://stackoverflow.com/questions/53733379/conversion-of-cielab-to-cielchab-not-yielding-correct-result
|
|
283
|
+
*
|
|
284
|
+
* Note:
|
|
285
|
+
* - ab values are contained in the intervals:
|
|
286
|
+
* - a (green, red): [~-128, ~+128]
|
|
287
|
+
* - b (blue, yellow): [~-128, ~+128]
|
|
236
288
|
*
|
|
237
|
-
* @param {number} a
|
|
238
|
-
* @param {number} b
|
|
289
|
+
* @param {number} a
|
|
290
|
+
* @param {number} b
|
|
239
291
|
* @returns {number} Hue value
|
|
240
292
|
*/
|
|
241
293
|
function abToHue(a, b) {
|
|
@@ -264,17 +316,24 @@ function abToHue(a, b) {
|
|
|
264
316
|
return toDegrees(Math.atan(b / a)) + xBias;
|
|
265
317
|
}
|
|
266
318
|
// ******************************************
|
|
267
|
-
//
|
|
319
|
+
// L*a*b* & RGB color spaces
|
|
268
320
|
// ******************************************
|
|
269
321
|
const f1 = (v) => (v * v * v > 0.008856 ? v * v * v : (v - 16 / 116) / 7.787);
|
|
270
322
|
const f2 = (v) => (v > 0.0031308 ? 1.055 * Math.pow(v, 1 / 2.4) - 0.055 : 12.92 * v);
|
|
271
323
|
const f3 = (v) => (v > 0.04045 ? Math.pow((v + 0.055) / 1.055, 2.4) : v / 12.92);
|
|
272
324
|
const f4 = (v) => (v > 0.008856 ? Math.pow(v, 1 / 3) : 7.787 * v + 16 / 116);
|
|
273
325
|
/**
|
|
274
|
-
*
|
|
326
|
+
* Convert L*a*b* to RGB
|
|
275
327
|
*
|
|
276
|
-
*
|
|
277
|
-
*
|
|
328
|
+
* Notes:
|
|
329
|
+
* - RGB values are contained in the interval [0, 1]
|
|
330
|
+
* - L*a*b* values are contained in the intervals:
|
|
331
|
+
* - Lightness: [0 à 100]
|
|
332
|
+
* - a (green, red): [~-128, ~+128]
|
|
333
|
+
* - b (blue, yellow): [~-128, ~+128]
|
|
334
|
+
*
|
|
335
|
+
* @param {ColorLab} lab L*a*b* color
|
|
336
|
+
* @returns {ColorRgb} RGB color
|
|
278
337
|
*/
|
|
279
338
|
export function labToRgb([l, a, b]) {
|
|
280
339
|
let y = (l + 16) / 116;
|
|
@@ -290,10 +349,17 @@ export function labToRgb([l, a, b]) {
|
|
|
290
349
|
];
|
|
291
350
|
}
|
|
292
351
|
/**
|
|
293
|
-
*
|
|
352
|
+
* Convert RGB to L*a*b*
|
|
353
|
+
*
|
|
354
|
+
* Notes:
|
|
355
|
+
* - RGB values are contained in the interval [0, 1]
|
|
356
|
+
* - L*a*b* values are contained in the intervals:
|
|
357
|
+
* - Lightness: [0 à 100]
|
|
358
|
+
* - a (green, red): [~-128, ~+128]
|
|
359
|
+
* - b (blue, yellow): [~-128, ~+128]
|
|
294
360
|
*
|
|
295
|
-
* @param {
|
|
296
|
-
* @returns {
|
|
361
|
+
* @param {ColorRgb} rgb RGB color
|
|
362
|
+
* @returns {ColorLab} L*a*b* color
|
|
297
363
|
*/
|
|
298
364
|
export function rgbToLab([r, g, b]) {
|
|
299
365
|
r = f3(r);
|
|
@@ -305,18 +371,24 @@ export function rgbToLab([r, g, b]) {
|
|
|
305
371
|
return [116 * y - 16, 500 * (x - y), 200 * (y - z)];
|
|
306
372
|
}
|
|
307
373
|
/**
|
|
308
|
-
* Get the delta from two
|
|
374
|
+
* Get the delta from two L*a*b* colors
|
|
375
|
+
*
|
|
376
|
+
* Note:
|
|
377
|
+
* - L*a*b* values are contained in the intervals:
|
|
378
|
+
* - Lightness: [0 à 100]
|
|
379
|
+
* - a (green, red): [~-128, ~+128]
|
|
380
|
+
* - b (blue, yellow): [~-128, ~+128]
|
|
309
381
|
*
|
|
310
|
-
* @param {
|
|
311
|
-
* @param {
|
|
312
|
-
* @returns {number}
|
|
382
|
+
* @param {ColorLab} lab1 First L*a*b* color
|
|
383
|
+
* @param {ColorLab} lab2 Second L*a*b* color
|
|
384
|
+
* @returns {number}
|
|
313
385
|
*/
|
|
314
|
-
export function deltaE(
|
|
315
|
-
const deltaL =
|
|
316
|
-
const deltaA =
|
|
317
|
-
const deltaB =
|
|
318
|
-
const c1 = Math.sqrt(
|
|
319
|
-
const c2 = Math.sqrt(
|
|
386
|
+
export function deltaE(lab1, lab2) {
|
|
387
|
+
const deltaL = lab1[0] - lab2[0];
|
|
388
|
+
const deltaA = lab1[1] - lab2[1];
|
|
389
|
+
const deltaB = lab1[2] - lab2[2];
|
|
390
|
+
const c1 = Math.sqrt(lab1[1] * lab1[1] + lab1[2] * lab1[2]);
|
|
391
|
+
const c2 = Math.sqrt(lab2[1] * lab2[1] + lab2[2] * lab2[2]);
|
|
320
392
|
const deltaC = c1 - c2;
|
|
321
393
|
let deltaH = deltaA * deltaA + deltaB * deltaB - deltaC * deltaC;
|
|
322
394
|
deltaH = deltaH < 0 ? 0 : Math.sqrt(deltaH);
|
|
@@ -334,8 +406,15 @@ export function deltaE(labA, labB) {
|
|
|
334
406
|
/**
|
|
335
407
|
* Convert RGB to HCL
|
|
336
408
|
*
|
|
337
|
-
*
|
|
338
|
-
*
|
|
409
|
+
* Notes:
|
|
410
|
+
* - RGB values are contained in the interval [0, 1]
|
|
411
|
+
* - HCL values are contained in the intervals:
|
|
412
|
+
* - Hue: [0, 360]
|
|
413
|
+
* - Chroma: [0, ~150]
|
|
414
|
+
* - Luminance: [0, 100]
|
|
415
|
+
*
|
|
416
|
+
* @param {ColorRgb} rgb RGB color
|
|
417
|
+
* @returns {ColorHcl} HCL color
|
|
339
418
|
*/
|
|
340
419
|
export function rgbToHcl([r, g, b]) {
|
|
341
420
|
return labToHcl(rgbToLab([r, g, b]));
|
|
@@ -343,8 +422,15 @@ export function rgbToHcl([r, g, b]) {
|
|
|
343
422
|
/**
|
|
344
423
|
* Converts HCL to RGB
|
|
345
424
|
*
|
|
346
|
-
*
|
|
347
|
-
*
|
|
425
|
+
* Notes:
|
|
426
|
+
* - RGB values are contained in the interval [0, 1]
|
|
427
|
+
* - HCL values are contained in the intervals:
|
|
428
|
+
* - Hue: [0, 360]
|
|
429
|
+
* - Chroma: [0, ~150]
|
|
430
|
+
* - Luminance: [0, 100]
|
|
431
|
+
*
|
|
432
|
+
* @param {ColorHcl} hcl RGB color
|
|
433
|
+
* @returns {ColorRgb} RGB color
|
|
348
434
|
*/
|
|
349
435
|
export function hclToRgb([h, c, l]) {
|
|
350
436
|
return labToRgb(hclToLab([h, c, l]));
|
package/lib/constants.js
CHANGED
|
@@ -14,7 +14,7 @@ export const QUARTER_PI = PI / 4;
|
|
|
14
14
|
// Colors
|
|
15
15
|
// *********************
|
|
16
16
|
// X11 colors
|
|
17
|
-
//
|
|
17
|
+
// -> https://www.w3.org/TR/css-color-3/#svg-color
|
|
18
18
|
export const W3CX11 = {
|
|
19
19
|
aliceblue: 0xf0f8ff,
|
|
20
20
|
antiquewhite: 0xfaebd7,
|
package/lib/dom.d.ts
CHANGED
package/lib/dom.js
CHANGED
|
@@ -2,7 +2,7 @@ const DOCUMENT_NODE_TYPE = 9;
|
|
|
2
2
|
/**
|
|
3
3
|
* Find the closest parent that matches a selector
|
|
4
4
|
*
|
|
5
|
-
* @param {Element|null}
|
|
5
|
+
* @param {Element|null} element Target element
|
|
6
6
|
* @param {Element|string} selector Selector or parent to match
|
|
7
7
|
* @returns {Element|null}
|
|
8
8
|
*/
|