/
index.js
98 lines (81 loc) · 2.32 KB
/
index.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
const { nanoid } = require("nanoid");
const {
createHueScale,
createSaturationScale,
createDistributionValues,
} = require("./lib/scales.js");
const {
hexToHSL,
HSLToHex,
luminanceFromHex,
lightnessFromHSLum,
isValidName,
checkHash,
isHex,
output,
} = require("./lib/helpers.js");
const { DEFAULT_PALETTE_CONFIG } = require("./lib/constants.js");
const createPaletteFromColor = (name, baseColor, config) => {
if (!name || !isValidName(name) || !baseColor || !isHex(baseColor)) {
return null;
}
const nameValue = {
...DEFAULT_PALETTE_CONFIG,
id: nanoid(),
name,
value: baseColor.toUpperCase(),
swatches: [],
...config,
};
return output([
{
...nameValue,
swatches: createSwatches(nameValue),
},
]);
};
const createSwatches = (palette) => {
const { value } = palette;
const useLightness =
palette.useLightness ?? DEFAULT_PALETTE_CONFIG.useLightness;
const h = palette.h ?? DEFAULT_PALETTE_CONFIG.h;
const s = palette.s ?? DEFAULT_PALETTE_CONFIG.s;
const lMin = palette.lMin ?? DEFAULT_PALETTE_CONFIG.lMin;
const lMax = palette.lMax ?? DEFAULT_PALETTE_CONFIG.lMax;
const hueScale = createHueScale(h);
const saturationScale = createSaturationScale(s);
const { h: valueH, s: valueS, l: valueL } = hexToHSL(value);
const lightnessValue = useLightness ? valueL : luminanceFromHex(value);
const distributionScale = createDistributionValues(
lMin,
lMax,
lightnessValue
);
const swatches = hueScale.map(({ key }, i) => {
let newH = valueH + hueScale[i].tweak;
newH = newH < 0 ? 360 + newH - 1 : newH;
newH = newH > 720 ? newH - 360 : newH;
newH = newH > 360 ? newH - 360 : newH;
let newS = valueS + saturationScale[i].tweak;
newS = newS > 100 ? 100 : newS;
const newL = useLightness
? distributionScale[i].tweak
: lightnessFromHSLum(newH, newS, distributionScale[i].tweak);
const newHex = HSLToHex(newH, newS, newL);
const paletteI = key;
return {
stop: paletteI,
hex:
paletteI === 500
? checkHash(palette.value).toUpperCase()
: newHex.toUpperCase(),
h: newH,
hScale: hueScale[i].tweak,
s: newS,
sScale: saturationScale[i].tweak,
l: newL,
};
});
return swatches;
};
module.exports = { createPaletteFromColor };