@oscarpalmer/atoms 0.80.0 → 0.82.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.
- package/dist/array/chunk.cjs +6 -8
- package/dist/array/chunk.js +6 -8
- package/dist/array/compact.cjs +10 -1
- package/dist/array/compact.js +10 -1
- package/dist/{colour → color}/base.cjs +8 -8
- package/dist/{colour → color}/base.js +8 -8
- package/dist/{colour → color}/functions.cjs +9 -9
- package/dist/{colour → color}/functions.js +9 -9
- package/dist/color/hex.cjs +56 -0
- package/dist/{colour → color}/hex.js +14 -14
- package/dist/{colour → color}/hsl.cjs +12 -12
- package/dist/{colour → color}/hsl.js +10 -10
- package/dist/color/index.cjs +34 -0
- package/dist/color/index.js +34 -0
- package/dist/color/is.cjs +27 -0
- package/dist/color/is.js +27 -0
- package/dist/{colour → color}/rgb.cjs +14 -14
- package/dist/{colour → color}/rgb.js +11 -11
- package/dist/index.cjs +21 -21
- package/dist/index.js +17 -17
- package/dist/math.cjs +35 -8
- package/dist/math.js +35 -8
- package/dist/value/diff.cjs +4 -1
- package/dist/value/diff.js +4 -1
- package/package.json +12 -12
- package/src/array/chunk.ts +7 -10
- package/src/array/compact.ts +13 -3
- package/src/color/base.ts +79 -0
- package/src/{colour → color}/functions.ts +17 -17
- package/src/color/hex.ts +74 -0
- package/src/{colour → color}/hsl.ts +16 -16
- package/src/color/index.ts +29 -0
- package/src/color/is.ts +54 -0
- package/src/{colour → color}/rgb.ts +18 -18
- package/src/index.ts +1 -1
- package/src/math.ts +108 -8
- package/src/value/diff.ts +5 -1
- package/types/array/chunk.d.cts +2 -2
- package/types/array/chunk.d.ts +2 -2
- package/types/array/index.d.cts +2 -2
- package/types/{colour → color}/base.d.cts +40 -40
- package/types/color/base.d.ts +32 -0
- package/types/color/functions.d.cts +181 -0
- package/types/color/functions.d.ts +23 -0
- package/types/color/hex.d.cts +165 -0
- package/types/color/hex.d.ts +35 -0
- package/types/color/hsl.d.cts +165 -0
- package/types/{colour → color}/hsl.d.ts +13 -13
- package/types/color/index.d.cts +211 -0
- package/types/color/index.d.ts +10 -0
- package/types/color/is.d.cts +178 -0
- package/types/color/is.d.ts +20 -0
- package/types/color/rgb.d.cts +165 -0
- package/types/{colour → color}/rgb.d.ts +15 -15
- package/types/index.d.cts +180 -78
- package/types/index.d.ts +1 -1
- package/types/math.d.cts +43 -0
- package/types/math.d.ts +13 -0
- package/types/models.d.cts +19 -8
- package/types/value/get.d.cts +19 -8
- package/types/value/index.d.cts +78 -11
- package/types/value/set.d.cts +7 -3
- package/types/value/smush.d.cts +19 -8
- package/types/value/unsmush.d.cts +53 -1
- package/dist/colour/hex.cjs +0 -56
- package/dist/colour/index.cjs +0 -34
- package/dist/colour/index.js +0 -34
- package/dist/colour/is.cjs +0 -27
- package/dist/colour/is.js +0 -27
- package/src/colour/base.ts +0 -79
- package/src/colour/hex.ts +0 -74
- package/src/colour/index.ts +0 -29
- package/src/colour/is.ts +0 -54
- package/types/colour/base.d.ts +0 -32
- package/types/colour/functions.d.cts +0 -181
- package/types/colour/functions.d.ts +0 -23
- package/types/colour/hex.d.cts +0 -165
- package/types/colour/hex.d.ts +0 -35
- package/types/colour/hsl.d.cts +0 -165
- package/types/colour/index.d.cts +0 -211
- package/types/colour/index.d.ts +0 -10
- package/types/colour/is.d.cts +0 -178
- package/types/colour/is.d.ts +0 -20
- package/types/colour/rgb.d.cts +0 -165
package/dist/array/chunk.cjs
CHANGED
|
@@ -1,17 +1,15 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
-
|
|
4
|
-
function chunk(array, size) {
|
|
5
|
-
const chunkSize = number.clamp(size ?? 5e3, 1, 5e3);
|
|
3
|
+
function chunk(array) {
|
|
6
4
|
const { length } = array;
|
|
7
|
-
if (length <=
|
|
5
|
+
if (length <= 5e3) {
|
|
8
6
|
return [array];
|
|
9
7
|
}
|
|
10
8
|
const chunks = [];
|
|
11
|
-
let
|
|
12
|
-
while (
|
|
13
|
-
chunks.push(array.
|
|
14
|
-
|
|
9
|
+
let index = 0;
|
|
10
|
+
while (index < length) {
|
|
11
|
+
chunks.push(array.slice(index, index + 5e3));
|
|
12
|
+
index += 5e3;
|
|
15
13
|
}
|
|
16
14
|
return chunks;
|
|
17
15
|
}
|
package/dist/array/chunk.js
CHANGED
|
@@ -1,15 +1,13 @@
|
|
|
1
|
-
|
|
2
|
-
function chunk(array, size) {
|
|
3
|
-
const chunkSize = clamp(size ?? 5e3, 1, 5e3);
|
|
1
|
+
function chunk(array) {
|
|
4
2
|
const { length } = array;
|
|
5
|
-
if (length <=
|
|
3
|
+
if (length <= 5e3) {
|
|
6
4
|
return [array];
|
|
7
5
|
}
|
|
8
6
|
const chunks = [];
|
|
9
|
-
let
|
|
10
|
-
while (
|
|
11
|
-
chunks.push(array.
|
|
12
|
-
|
|
7
|
+
let index = 0;
|
|
8
|
+
while (index < length) {
|
|
9
|
+
chunks.push(array.slice(index, index + 5e3));
|
|
10
|
+
index += 5e3;
|
|
13
11
|
}
|
|
14
12
|
return chunks;
|
|
15
13
|
}
|
package/dist/array/compact.cjs
CHANGED
|
@@ -1,6 +1,15 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
3
|
function compact(array, strict) {
|
|
4
|
-
|
|
4
|
+
const isStrict = strict ?? false;
|
|
5
|
+
const { length } = array;
|
|
6
|
+
const compacted = [];
|
|
7
|
+
for (let index = 0; index < length; index += 1) {
|
|
8
|
+
const item = array[index];
|
|
9
|
+
if (isStrict && !!item || !isStrict && item != null) {
|
|
10
|
+
compacted.push(item);
|
|
11
|
+
}
|
|
12
|
+
}
|
|
13
|
+
return compacted;
|
|
5
14
|
}
|
|
6
15
|
exports.compact = compact;
|
package/dist/array/compact.js
CHANGED
|
@@ -1,5 +1,14 @@
|
|
|
1
1
|
function compact(array, strict) {
|
|
2
|
-
|
|
2
|
+
const isStrict = strict ?? false;
|
|
3
|
+
const { length } = array;
|
|
4
|
+
const compacted = [];
|
|
5
|
+
for (let index = 0; index < length; index += 1) {
|
|
6
|
+
const item = array[index];
|
|
7
|
+
if (isStrict && !!item || !isStrict && item != null) {
|
|
8
|
+
compacted.push(item);
|
|
9
|
+
}
|
|
10
|
+
}
|
|
11
|
+
return compacted;
|
|
3
12
|
}
|
|
4
13
|
export {
|
|
5
14
|
compact
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
-
const
|
|
3
|
+
const color_is = require("./is.cjs");
|
|
4
4
|
const defaults = {
|
|
5
5
|
hsl: {
|
|
6
6
|
hue: 0,
|
|
@@ -18,26 +18,26 @@ const properties = {
|
|
|
18
18
|
rgb: ["blue", "green", "red"]
|
|
19
19
|
};
|
|
20
20
|
function getValue(value, type) {
|
|
21
|
-
return
|
|
21
|
+
return color_is.isColorValue(value, properties[type]) ? { ...value } : { ...defaults[type] };
|
|
22
22
|
}
|
|
23
|
-
class
|
|
23
|
+
class Color {
|
|
24
24
|
/**
|
|
25
|
-
* Get the current value of the
|
|
25
|
+
* Get the current value of the color
|
|
26
26
|
*/
|
|
27
27
|
get value() {
|
|
28
28
|
return { ...this.state.value };
|
|
29
29
|
}
|
|
30
30
|
/**
|
|
31
|
-
* Set the current value of the
|
|
31
|
+
* Set the current value of the color
|
|
32
32
|
*/
|
|
33
33
|
set value(value) {
|
|
34
|
-
this.state.value = getValue(value, this.$
|
|
34
|
+
this.state.value = getValue(value, this.$color);
|
|
35
35
|
}
|
|
36
36
|
constructor(type, value) {
|
|
37
|
-
this.$
|
|
37
|
+
this.$color = type;
|
|
38
38
|
this.state = {
|
|
39
39
|
value: getValue(value, type)
|
|
40
40
|
};
|
|
41
41
|
}
|
|
42
42
|
}
|
|
43
|
-
exports.
|
|
43
|
+
exports.Color = Color;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { isColorValue } from "./is.js";
|
|
2
2
|
const defaults = {
|
|
3
3
|
hsl: {
|
|
4
4
|
hue: 0,
|
|
@@ -16,28 +16,28 @@ const properties = {
|
|
|
16
16
|
rgb: ["blue", "green", "red"]
|
|
17
17
|
};
|
|
18
18
|
function getValue(value, type) {
|
|
19
|
-
return
|
|
19
|
+
return isColorValue(value, properties[type]) ? { ...value } : { ...defaults[type] };
|
|
20
20
|
}
|
|
21
|
-
class
|
|
21
|
+
class Color {
|
|
22
22
|
/**
|
|
23
|
-
* Get the current value of the
|
|
23
|
+
* Get the current value of the color
|
|
24
24
|
*/
|
|
25
25
|
get value() {
|
|
26
26
|
return { ...this.state.value };
|
|
27
27
|
}
|
|
28
28
|
/**
|
|
29
|
-
* Set the current value of the
|
|
29
|
+
* Set the current value of the color
|
|
30
30
|
*/
|
|
31
31
|
set value(value) {
|
|
32
|
-
this.state.value = getValue(value, this.$
|
|
32
|
+
this.state.value = getValue(value, this.$color);
|
|
33
33
|
}
|
|
34
34
|
constructor(type, value) {
|
|
35
|
-
this.$
|
|
35
|
+
this.$color = type;
|
|
36
36
|
this.state = {
|
|
37
37
|
value: getValue(value, type)
|
|
38
38
|
};
|
|
39
39
|
}
|
|
40
40
|
}
|
|
41
41
|
export {
|
|
42
|
-
|
|
42
|
+
Color
|
|
43
43
|
};
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
3
|
const number = require("../number.cjs");
|
|
4
|
-
const
|
|
5
|
-
const
|
|
6
|
-
const
|
|
4
|
+
const color_hex = require("./hex.cjs");
|
|
5
|
+
const color_hsl = require("./hsl.cjs");
|
|
6
|
+
const color_rgb = require("./rgb.cjs");
|
|
7
7
|
const anyPattern = /^#*([a-f0-9]{3}){1,2}$/i;
|
|
8
8
|
const groupedPattern = /^#*([a-f0-9]{2})([a-f0-9]{2})([a-f0-9]{2})$/i;
|
|
9
9
|
function getNormalisedHex(value) {
|
|
@@ -18,7 +18,7 @@ function hexToRgb(value) {
|
|
|
18
18
|
for (let index = 1; index < length; index += 1) {
|
|
19
19
|
rgb.push(Number.parseInt(pairs[index], 16));
|
|
20
20
|
}
|
|
21
|
-
return new
|
|
21
|
+
return new color_rgb.RGBColor({
|
|
22
22
|
blue: rgb[2] ?? 0,
|
|
23
23
|
green: rgb[1] ?? 0,
|
|
24
24
|
red: rgb[0] ?? 0
|
|
@@ -36,16 +36,16 @@ function hslToRgb(value) {
|
|
|
36
36
|
const mod = saturation * Math.min(lightness, 1 - lightness);
|
|
37
37
|
return lightness - mod * Math.max(-1, Math.min(part - 3, 9 - part, 1));
|
|
38
38
|
}
|
|
39
|
-
return new
|
|
39
|
+
return new color_rgb.RGBColor({
|
|
40
40
|
blue: number.clamp(Math.round(get(4) * 255), 0, 255),
|
|
41
41
|
green: number.clamp(Math.round(get(8) * 255), 0, 255),
|
|
42
42
|
red: number.clamp(Math.round(get(0) * 255), 0, 255)
|
|
43
43
|
});
|
|
44
44
|
}
|
|
45
45
|
function rgbToHex(value) {
|
|
46
|
-
return new
|
|
47
|
-
`${[value.red, value.green, value.blue].map((
|
|
48
|
-
const hex =
|
|
46
|
+
return new color_hex.HexColor(
|
|
47
|
+
`${[value.red, value.green, value.blue].map((color) => {
|
|
48
|
+
const hex = color.toString(16);
|
|
49
49
|
return hex.length === 1 ? `0${hex}` : hex;
|
|
50
50
|
}).join("")}`
|
|
51
51
|
);
|
|
@@ -82,7 +82,7 @@ function rgbToHsl(rgb) {
|
|
|
82
82
|
if (hue >= 360) {
|
|
83
83
|
hue -= 360;
|
|
84
84
|
}
|
|
85
|
-
return new
|
|
85
|
+
return new color_hsl.HSLColor({
|
|
86
86
|
hue: +hue.toFixed(2),
|
|
87
87
|
lightness: +(lightness * 100).toFixed(2),
|
|
88
88
|
saturation: +(saturation * 100).toFixed(2)
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { clamp } from "../number.js";
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
2
|
+
import { HexColor } from "./hex.js";
|
|
3
|
+
import { HSLColor } from "./hsl.js";
|
|
4
|
+
import { RGBColor } from "./rgb.js";
|
|
5
5
|
const anyPattern = /^#*([a-f0-9]{3}){1,2}$/i;
|
|
6
6
|
const groupedPattern = /^#*([a-f0-9]{2})([a-f0-9]{2})([a-f0-9]{2})$/i;
|
|
7
7
|
function getNormalisedHex(value) {
|
|
@@ -16,7 +16,7 @@ function hexToRgb(value) {
|
|
|
16
16
|
for (let index = 1; index < length; index += 1) {
|
|
17
17
|
rgb.push(Number.parseInt(pairs[index], 16));
|
|
18
18
|
}
|
|
19
|
-
return new
|
|
19
|
+
return new RGBColor({
|
|
20
20
|
blue: rgb[2] ?? 0,
|
|
21
21
|
green: rgb[1] ?? 0,
|
|
22
22
|
red: rgb[0] ?? 0
|
|
@@ -34,16 +34,16 @@ function hslToRgb(value) {
|
|
|
34
34
|
const mod = saturation * Math.min(lightness, 1 - lightness);
|
|
35
35
|
return lightness - mod * Math.max(-1, Math.min(part - 3, 9 - part, 1));
|
|
36
36
|
}
|
|
37
|
-
return new
|
|
37
|
+
return new RGBColor({
|
|
38
38
|
blue: clamp(Math.round(get(4) * 255), 0, 255),
|
|
39
39
|
green: clamp(Math.round(get(8) * 255), 0, 255),
|
|
40
40
|
red: clamp(Math.round(get(0) * 255), 0, 255)
|
|
41
41
|
});
|
|
42
42
|
}
|
|
43
43
|
function rgbToHex(value) {
|
|
44
|
-
return new
|
|
45
|
-
`${[value.red, value.green, value.blue].map((
|
|
46
|
-
const hex =
|
|
44
|
+
return new HexColor(
|
|
45
|
+
`${[value.red, value.green, value.blue].map((color) => {
|
|
46
|
+
const hex = color.toString(16);
|
|
47
47
|
return hex.length === 1 ? `0${hex}` : hex;
|
|
48
48
|
}).join("")}`
|
|
49
49
|
);
|
|
@@ -80,7 +80,7 @@ function rgbToHsl(rgb) {
|
|
|
80
80
|
if (hue >= 360) {
|
|
81
81
|
hue -= 360;
|
|
82
82
|
}
|
|
83
|
-
return new
|
|
83
|
+
return new HSLColor({
|
|
84
84
|
hue: +hue.toFixed(2),
|
|
85
85
|
lightness: +(lightness * 100).toFixed(2),
|
|
86
86
|
saturation: +(saturation * 100).toFixed(2)
|
|
@@ -0,0 +1,56 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
4
|
+
var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
|
|
5
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
6
|
+
const color_functions = require("./functions.cjs");
|
|
7
|
+
class HexColor {
|
|
8
|
+
constructor(value) {
|
|
9
|
+
__publicField(this, "state");
|
|
10
|
+
this.$color = "hex";
|
|
11
|
+
this.state = {
|
|
12
|
+
value: typeof value === "string" && color_functions.anyPattern.test(value) ? color_functions.getNormalisedHex(value) : "000000"
|
|
13
|
+
};
|
|
14
|
+
}
|
|
15
|
+
/**
|
|
16
|
+
* Get the value of the color
|
|
17
|
+
*/
|
|
18
|
+
get value() {
|
|
19
|
+
return `#${this.state.value}`;
|
|
20
|
+
}
|
|
21
|
+
/**
|
|
22
|
+
* Set the value of the color
|
|
23
|
+
*/
|
|
24
|
+
set value(value) {
|
|
25
|
+
this.state.value = color_functions.anyPattern.test(value) ? color_functions.getNormalisedHex(value) : "000000";
|
|
26
|
+
}
|
|
27
|
+
/**
|
|
28
|
+
* Convert the color to an RGB-color
|
|
29
|
+
*/
|
|
30
|
+
toHsl() {
|
|
31
|
+
return HexColor.toRgb(this.value).toHsl();
|
|
32
|
+
}
|
|
33
|
+
/**
|
|
34
|
+
* Convert the color to an HSL-color
|
|
35
|
+
*/
|
|
36
|
+
toRgb() {
|
|
37
|
+
return HexColor.toRgb(this.value);
|
|
38
|
+
}
|
|
39
|
+
/**
|
|
40
|
+
* Get the color as a string _(prefixed with #)_
|
|
41
|
+
*/
|
|
42
|
+
toString() {
|
|
43
|
+
return this.value;
|
|
44
|
+
}
|
|
45
|
+
/**
|
|
46
|
+
* Convert a hex-color to an RGB-color
|
|
47
|
+
*/
|
|
48
|
+
static toRgb(value) {
|
|
49
|
+
return color_functions.hexToRgb(value);
|
|
50
|
+
}
|
|
51
|
+
}
|
|
52
|
+
function getHexColor(value) {
|
|
53
|
+
return new HexColor(value);
|
|
54
|
+
}
|
|
55
|
+
exports.HexColor = HexColor;
|
|
56
|
+
exports.getHexColor = getHexColor;
|
|
@@ -2,55 +2,55 @@ var __defProp = Object.defineProperty;
|
|
|
2
2
|
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
3
3
|
var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
|
|
4
4
|
import { anyPattern, getNormalisedHex, hexToRgb } from "./functions.js";
|
|
5
|
-
class
|
|
5
|
+
class HexColor {
|
|
6
6
|
constructor(value) {
|
|
7
7
|
__publicField(this, "state");
|
|
8
|
-
this.$
|
|
8
|
+
this.$color = "hex";
|
|
9
9
|
this.state = {
|
|
10
10
|
value: typeof value === "string" && anyPattern.test(value) ? getNormalisedHex(value) : "000000"
|
|
11
11
|
};
|
|
12
12
|
}
|
|
13
13
|
/**
|
|
14
|
-
* Get the value of the
|
|
14
|
+
* Get the value of the color
|
|
15
15
|
*/
|
|
16
16
|
get value() {
|
|
17
17
|
return `#${this.state.value}`;
|
|
18
18
|
}
|
|
19
19
|
/**
|
|
20
|
-
* Set the value of the
|
|
20
|
+
* Set the value of the color
|
|
21
21
|
*/
|
|
22
22
|
set value(value) {
|
|
23
23
|
this.state.value = anyPattern.test(value) ? getNormalisedHex(value) : "000000";
|
|
24
24
|
}
|
|
25
25
|
/**
|
|
26
|
-
* Convert the
|
|
26
|
+
* Convert the color to an RGB-color
|
|
27
27
|
*/
|
|
28
28
|
toHsl() {
|
|
29
|
-
return
|
|
29
|
+
return HexColor.toRgb(this.value).toHsl();
|
|
30
30
|
}
|
|
31
31
|
/**
|
|
32
|
-
* Convert the
|
|
32
|
+
* Convert the color to an HSL-color
|
|
33
33
|
*/
|
|
34
34
|
toRgb() {
|
|
35
|
-
return
|
|
35
|
+
return HexColor.toRgb(this.value);
|
|
36
36
|
}
|
|
37
37
|
/**
|
|
38
|
-
* Get the
|
|
38
|
+
* Get the color as a string _(prefixed with #)_
|
|
39
39
|
*/
|
|
40
40
|
toString() {
|
|
41
41
|
return this.value;
|
|
42
42
|
}
|
|
43
43
|
/**
|
|
44
|
-
* Convert a hex-
|
|
44
|
+
* Convert a hex-color to an RGB-color
|
|
45
45
|
*/
|
|
46
46
|
static toRgb(value) {
|
|
47
47
|
return hexToRgb(value);
|
|
48
48
|
}
|
|
49
49
|
}
|
|
50
|
-
function
|
|
51
|
-
return new
|
|
50
|
+
function getHexColor(value) {
|
|
51
|
+
return new HexColor(value);
|
|
52
52
|
}
|
|
53
53
|
export {
|
|
54
|
-
|
|
55
|
-
|
|
54
|
+
HexColor,
|
|
55
|
+
getHexColor
|
|
56
56
|
};
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
3
|
const number = require("../number.cjs");
|
|
4
|
-
const
|
|
5
|
-
const
|
|
6
|
-
class
|
|
4
|
+
const color_base = require("./base.cjs");
|
|
5
|
+
const color_functions = require("./functions.cjs");
|
|
6
|
+
class HSLColor extends color_base.Color {
|
|
7
7
|
/**
|
|
8
8
|
* Get the current hue
|
|
9
9
|
*/
|
|
@@ -47,13 +47,13 @@ class HSLColour extends colour_base.Colour {
|
|
|
47
47
|
* @inheritdoc
|
|
48
48
|
*/
|
|
49
49
|
toHex() {
|
|
50
|
-
return
|
|
50
|
+
return HSLColor.toRgb(this.state.value).toHex();
|
|
51
51
|
}
|
|
52
52
|
/**
|
|
53
|
-
* Convert the
|
|
53
|
+
* Convert the color to an RGB-color
|
|
54
54
|
*/
|
|
55
55
|
toRgb() {
|
|
56
|
-
return
|
|
56
|
+
return HSLColor.toRgb(this.state.value);
|
|
57
57
|
}
|
|
58
58
|
/**
|
|
59
59
|
* @inheritdoc
|
|
@@ -62,14 +62,14 @@ class HSLColour extends colour_base.Colour {
|
|
|
62
62
|
return `hsl(${this.state.value.hue}, ${this.state.value.saturation}%, ${this.state.value.lightness}%)`;
|
|
63
63
|
}
|
|
64
64
|
/**
|
|
65
|
-
* Convert an HSL-
|
|
65
|
+
* Convert an HSL-color to an RGB-color
|
|
66
66
|
*/
|
|
67
67
|
static toRgb(value) {
|
|
68
|
-
return
|
|
68
|
+
return color_functions.hslToRgb(value);
|
|
69
69
|
}
|
|
70
70
|
}
|
|
71
|
-
function
|
|
72
|
-
return new
|
|
71
|
+
function getHSLColor(value) {
|
|
72
|
+
return new HSLColor(value);
|
|
73
73
|
}
|
|
74
|
-
exports.
|
|
75
|
-
exports.
|
|
74
|
+
exports.HSLColor = HSLColor;
|
|
75
|
+
exports.getHSLColor = getHSLColor;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { clamp } from "../number.js";
|
|
2
|
-
import {
|
|
2
|
+
import { Color } from "./base.js";
|
|
3
3
|
import { hslToRgb } from "./functions.js";
|
|
4
|
-
class
|
|
4
|
+
class HSLColor extends Color {
|
|
5
5
|
/**
|
|
6
6
|
* Get the current hue
|
|
7
7
|
*/
|
|
@@ -45,13 +45,13 @@ class HSLColour extends Colour {
|
|
|
45
45
|
* @inheritdoc
|
|
46
46
|
*/
|
|
47
47
|
toHex() {
|
|
48
|
-
return
|
|
48
|
+
return HSLColor.toRgb(this.state.value).toHex();
|
|
49
49
|
}
|
|
50
50
|
/**
|
|
51
|
-
* Convert the
|
|
51
|
+
* Convert the color to an RGB-color
|
|
52
52
|
*/
|
|
53
53
|
toRgb() {
|
|
54
|
-
return
|
|
54
|
+
return HSLColor.toRgb(this.state.value);
|
|
55
55
|
}
|
|
56
56
|
/**
|
|
57
57
|
* @inheritdoc
|
|
@@ -60,16 +60,16 @@ class HSLColour extends Colour {
|
|
|
60
60
|
return `hsl(${this.state.value.hue}, ${this.state.value.saturation}%, ${this.state.value.lightness}%)`;
|
|
61
61
|
}
|
|
62
62
|
/**
|
|
63
|
-
* Convert an HSL-
|
|
63
|
+
* Convert an HSL-color to an RGB-color
|
|
64
64
|
*/
|
|
65
65
|
static toRgb(value) {
|
|
66
66
|
return hslToRgb(value);
|
|
67
67
|
}
|
|
68
68
|
}
|
|
69
|
-
function
|
|
70
|
-
return new
|
|
69
|
+
function getHSLColor(value) {
|
|
70
|
+
return new HSLColor(value);
|
|
71
71
|
}
|
|
72
72
|
export {
|
|
73
|
-
|
|
74
|
-
|
|
73
|
+
HSLColor,
|
|
74
|
+
getHSLColor
|
|
75
75
|
};
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
+
const color_functions = require("./functions.cjs");
|
|
4
|
+
const color_hex = require("./hex.cjs");
|
|
5
|
+
const color_hsl = require("./hsl.cjs");
|
|
6
|
+
const color_is = require("./is.cjs");
|
|
7
|
+
const color_rgb = require("./rgb.cjs");
|
|
8
|
+
function getForegroundColor(value) {
|
|
9
|
+
const values = [value.blue / 255, value.green / 255, value.red / 255];
|
|
10
|
+
for (let color of values) {
|
|
11
|
+
if (color <= 0.03928) {
|
|
12
|
+
color /= 12.92;
|
|
13
|
+
} else {
|
|
14
|
+
color = ((color + 0.055) / 1.055) ** 2.4;
|
|
15
|
+
}
|
|
16
|
+
}
|
|
17
|
+
const luminance = 0.2126 * values[2] + 0.7152 * values[1] + 0.0722 * values[0];
|
|
18
|
+
return luminance > 0.625 ? "black" : "white";
|
|
19
|
+
}
|
|
20
|
+
exports.hexToRgb = color_functions.hexToRgb;
|
|
21
|
+
exports.hslToRgb = color_functions.hslToRgb;
|
|
22
|
+
exports.rgbToHex = color_functions.rgbToHex;
|
|
23
|
+
exports.rgbToHsl = color_functions.rgbToHsl;
|
|
24
|
+
exports.HexColor = color_hex.HexColor;
|
|
25
|
+
exports.getHexColor = color_hex.getHexColor;
|
|
26
|
+
exports.HSLColor = color_hsl.HSLColor;
|
|
27
|
+
exports.getHSLColor = color_hsl.getHSLColor;
|
|
28
|
+
exports.isColor = color_is.isColor;
|
|
29
|
+
exports.isHSLColor = color_is.isHSLColor;
|
|
30
|
+
exports.isHexColor = color_is.isHexColor;
|
|
31
|
+
exports.isRGBColor = color_is.isRGBColor;
|
|
32
|
+
exports.RGBColor = color_rgb.RGBColor;
|
|
33
|
+
exports.getRGBColor = color_rgb.getRGBColor;
|
|
34
|
+
exports.getForegroundColor = getForegroundColor;
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
import { hexToRgb, hslToRgb, rgbToHex, rgbToHsl } from "./functions.js";
|
|
2
|
+
import { HexColor, getHexColor } from "./hex.js";
|
|
3
|
+
import { HSLColor, getHSLColor } from "./hsl.js";
|
|
4
|
+
import { isColor, isHSLColor, isHexColor, isRGBColor } from "./is.js";
|
|
5
|
+
import { RGBColor, getRGBColor } from "./rgb.js";
|
|
6
|
+
function getForegroundColor(value) {
|
|
7
|
+
const values = [value.blue / 255, value.green / 255, value.red / 255];
|
|
8
|
+
for (let color of values) {
|
|
9
|
+
if (color <= 0.03928) {
|
|
10
|
+
color /= 12.92;
|
|
11
|
+
} else {
|
|
12
|
+
color = ((color + 0.055) / 1.055) ** 2.4;
|
|
13
|
+
}
|
|
14
|
+
}
|
|
15
|
+
const luminance = 0.2126 * values[2] + 0.7152 * values[1] + 0.0722 * values[0];
|
|
16
|
+
return luminance > 0.625 ? "black" : "white";
|
|
17
|
+
}
|
|
18
|
+
export {
|
|
19
|
+
HSLColor,
|
|
20
|
+
HexColor,
|
|
21
|
+
RGBColor,
|
|
22
|
+
getForegroundColor,
|
|
23
|
+
getHSLColor,
|
|
24
|
+
getHexColor,
|
|
25
|
+
getRGBColor,
|
|
26
|
+
hexToRgb,
|
|
27
|
+
hslToRgb,
|
|
28
|
+
isColor,
|
|
29
|
+
isHSLColor,
|
|
30
|
+
isHexColor,
|
|
31
|
+
isRGBColor,
|
|
32
|
+
rgbToHex,
|
|
33
|
+
rgbToHsl
|
|
34
|
+
};
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
+
function isColor(value) {
|
|
4
|
+
return isInstance(/^(hex|hsl|rgb)$/, value);
|
|
5
|
+
}
|
|
6
|
+
function isColorValue(value, properties) {
|
|
7
|
+
return typeof value === "object" && value !== null && properties.every(
|
|
8
|
+
(property) => property in value && typeof value[property] === "number"
|
|
9
|
+
);
|
|
10
|
+
}
|
|
11
|
+
function isHexColor(value) {
|
|
12
|
+
return isInstance(/^hex$/, value);
|
|
13
|
+
}
|
|
14
|
+
function isHSLColor(value) {
|
|
15
|
+
return isInstance(/^hsl$/, value);
|
|
16
|
+
}
|
|
17
|
+
function isInstance(pattern, value) {
|
|
18
|
+
return typeof value === "object" && value !== null && "$color" in value && typeof value.$color === "string" && pattern.test(value.$color);
|
|
19
|
+
}
|
|
20
|
+
function isRGBColor(value) {
|
|
21
|
+
return isInstance(/^rgb$/, value);
|
|
22
|
+
}
|
|
23
|
+
exports.isColor = isColor;
|
|
24
|
+
exports.isColorValue = isColorValue;
|
|
25
|
+
exports.isHSLColor = isHSLColor;
|
|
26
|
+
exports.isHexColor = isHexColor;
|
|
27
|
+
exports.isRGBColor = isRGBColor;
|
package/dist/color/is.js
ADDED
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
function isColor(value) {
|
|
2
|
+
return isInstance(/^(hex|hsl|rgb)$/, value);
|
|
3
|
+
}
|
|
4
|
+
function isColorValue(value, properties) {
|
|
5
|
+
return typeof value === "object" && value !== null && properties.every(
|
|
6
|
+
(property) => property in value && typeof value[property] === "number"
|
|
7
|
+
);
|
|
8
|
+
}
|
|
9
|
+
function isHexColor(value) {
|
|
10
|
+
return isInstance(/^hex$/, value);
|
|
11
|
+
}
|
|
12
|
+
function isHSLColor(value) {
|
|
13
|
+
return isInstance(/^hsl$/, value);
|
|
14
|
+
}
|
|
15
|
+
function isInstance(pattern, value) {
|
|
16
|
+
return typeof value === "object" && value !== null && "$color" in value && typeof value.$color === "string" && pattern.test(value.$color);
|
|
17
|
+
}
|
|
18
|
+
function isRGBColor(value) {
|
|
19
|
+
return isInstance(/^rgb$/, value);
|
|
20
|
+
}
|
|
21
|
+
export {
|
|
22
|
+
isColor,
|
|
23
|
+
isColorValue,
|
|
24
|
+
isHSLColor,
|
|
25
|
+
isHexColor,
|
|
26
|
+
isRGBColor
|
|
27
|
+
};
|