'use strict';
|
|
var cssKeywords = {
|
aliceblue: [240, 248, 255],
|
antiquewhite: [250, 235, 215],
|
aqua: [0, 255, 255],
|
aquamarine: [127, 255, 212],
|
azure: [240, 255, 255],
|
beige: [245, 245, 220],
|
bisque: [255, 228, 196],
|
black: [0, 0, 0],
|
blanchedalmond: [255, 235, 205],
|
blue: [0, 0, 255],
|
blueviolet: [138, 43, 226],
|
brown: [165, 42, 42],
|
burlywood: [222, 184, 135],
|
cadetblue: [95, 158, 160],
|
chartreuse: [127, 255, 0],
|
chocolate: [210, 105, 30],
|
coral: [255, 127, 80],
|
cornflowerblue: [100, 149, 237],
|
cornsilk: [255, 248, 220],
|
crimson: [220, 20, 60],
|
cyan: [0, 255, 255],
|
darkblue: [0, 0, 139],
|
darkcyan: [0, 139, 139],
|
darkgoldenrod: [184, 134, 11],
|
darkgray: [169, 169, 169],
|
darkgreen: [0, 100, 0],
|
darkgrey: [169, 169, 169],
|
darkkhaki: [189, 183, 107],
|
darkmagenta: [139, 0, 139],
|
darkolivegreen: [85, 107, 47],
|
darkorange: [255, 140, 0],
|
darkorchid: [153, 50, 204],
|
darkred: [139, 0, 0],
|
darksalmon: [233, 150, 122],
|
darkseagreen: [143, 188, 143],
|
darkslateblue: [72, 61, 139],
|
darkslategray: [47, 79, 79],
|
darkslategrey: [47, 79, 79],
|
darkturquoise: [0, 206, 209],
|
darkviolet: [148, 0, 211],
|
deeppink: [255, 20, 147],
|
deepskyblue: [0, 191, 255],
|
dimgray: [105, 105, 105],
|
dimgrey: [105, 105, 105],
|
dodgerblue: [30, 144, 255],
|
firebrick: [178, 34, 34],
|
floralwhite: [255, 250, 240],
|
forestgreen: [34, 139, 34],
|
fuchsia: [255, 0, 255],
|
gainsboro: [220, 220, 220],
|
ghostwhite: [248, 248, 255],
|
gold: [255, 215, 0],
|
goldenrod: [218, 165, 32],
|
gray: [128, 128, 128],
|
green: [0, 128, 0],
|
greenyellow: [173, 255, 47],
|
grey: [128, 128, 128],
|
honeydew: [240, 255, 240],
|
hotpink: [255, 105, 180],
|
indianred: [205, 92, 92],
|
indigo: [75, 0, 130],
|
ivory: [255, 255, 240],
|
khaki: [240, 230, 140],
|
lavender: [230, 230, 250],
|
lavenderblush: [255, 240, 245],
|
lawngreen: [124, 252, 0],
|
lemonchiffon: [255, 250, 205],
|
lightblue: [173, 216, 230],
|
lightcoral: [240, 128, 128],
|
lightcyan: [224, 255, 255],
|
lightgoldenrodyellow: [250, 250, 210],
|
lightgray: [211, 211, 211],
|
lightgreen: [144, 238, 144],
|
lightgrey: [211, 211, 211],
|
lightpink: [255, 182, 193],
|
lightsalmon: [255, 160, 122],
|
lightseagreen: [32, 178, 170],
|
lightskyblue: [135, 206, 250],
|
lightslategray: [119, 136, 153],
|
lightslategrey: [119, 136, 153],
|
lightsteelblue: [176, 196, 222],
|
lightyellow: [255, 255, 224],
|
lime: [0, 255, 0],
|
limegreen: [50, 205, 50],
|
linen: [250, 240, 230],
|
magenta: [255, 0, 255],
|
maroon: [128, 0, 0],
|
mediumaquamarine: [102, 205, 170],
|
mediumblue: [0, 0, 205],
|
mediumorchid: [186, 85, 211],
|
mediumpurple: [147, 112, 219],
|
mediumseagreen: [60, 179, 113],
|
mediumslateblue: [123, 104, 238],
|
mediumspringgreen: [0, 250, 154],
|
mediumturquoise: [72, 209, 204],
|
mediumvioletred: [199, 21, 133],
|
midnightblue: [25, 25, 112],
|
mintcream: [245, 255, 250],
|
mistyrose: [255, 228, 225],
|
moccasin: [255, 228, 181],
|
navajowhite: [255, 222, 173],
|
navy: [0, 0, 128],
|
oldlace: [253, 245, 230],
|
olive: [128, 128, 0],
|
olivedrab: [107, 142, 35],
|
orange: [255, 165, 0],
|
orangered: [255, 69, 0],
|
orchid: [218, 112, 214],
|
palegoldenrod: [238, 232, 170],
|
palegreen: [152, 251, 152],
|
paleturquoise: [175, 238, 238],
|
palevioletred: [219, 112, 147],
|
papayawhip: [255, 239, 213],
|
peachpuff: [255, 218, 185],
|
peru: [205, 133, 63],
|
pink: [255, 192, 203],
|
plum: [221, 160, 221],
|
powderblue: [176, 224, 230],
|
purple: [128, 0, 128],
|
rebeccapurple: [102, 51, 153],
|
red: [255, 0, 0],
|
rosybrown: [188, 143, 143],
|
royalblue: [65, 105, 225],
|
saddlebrown: [139, 69, 19],
|
salmon: [250, 128, 114],
|
sandybrown: [244, 164, 96],
|
seagreen: [46, 139, 87],
|
seashell: [255, 245, 238],
|
sienna: [160, 82, 45],
|
silver: [192, 192, 192],
|
skyblue: [135, 206, 235],
|
slateblue: [106, 90, 205],
|
slategray: [112, 128, 144],
|
slategrey: [112, 128, 144],
|
snow: [255, 250, 250],
|
springgreen: [0, 255, 127],
|
steelblue: [70, 130, 180],
|
tan: [210, 180, 140],
|
teal: [0, 128, 128],
|
thistle: [216, 191, 216],
|
tomato: [255, 99, 71],
|
turquoise: [64, 224, 208],
|
violet: [238, 130, 238],
|
wheat: [245, 222, 179],
|
white: [255, 255, 255],
|
whitesmoke: [245, 245, 245],
|
yellow: [255, 255, 0],
|
yellowgreen: [154, 205, 50]
|
};
|
|
const reverseNames = Object.create(null);
|
|
// Create a list of reverse color names
|
for (const name in cssKeywords) {
|
if (Object.hasOwn(cssKeywords, name)) {
|
reverseNames[cssKeywords[name]] = name;
|
}
|
}
|
|
const cs = {
|
to: {},
|
get: {},
|
};
|
|
cs.get = function (string) {
|
const prefix = string.slice(0, 3).toLowerCase();
|
let value;
|
let model;
|
switch (prefix) {
|
case 'hsl': {
|
value = cs.get.hsl(string);
|
model = 'hsl';
|
break;
|
}
|
|
case 'hwb': {
|
value = cs.get.hwb(string);
|
model = 'hwb';
|
break;
|
}
|
|
default: {
|
value = cs.get.rgb(string);
|
model = 'rgb';
|
break;
|
}
|
}
|
|
if (!value) {
|
return null;
|
}
|
|
return {model, value};
|
};
|
|
cs.get.rgb = function (string) {
|
if (!string) {
|
return null;
|
}
|
|
const abbr = /^#([a-f\d]{3,4})$/i;
|
const hex = /^#([a-f\d]{6})([a-f\d]{2})?$/i;
|
const rgba = /^rgba?\(\s*([+-]?\d+)(?=[\s,])\s*(?:,\s*)?([+-]?\d+)(?=[\s,])\s*(?:,\s*)?([+-]?\d+)\s*(?:[\s,|/]\s*([+-]?[\d.]+)(%?)\s*)?\)$/;
|
const per = /^rgba?\(\s*([+-]?[\d.]+)%\s*,?\s*([+-]?[\d.]+)%\s*,?\s*([+-]?[\d.]+)%\s*(?:[\s,|/]\s*([+-]?[\d.]+)(%?)\s*)?\)$/;
|
const keyword = /^(\w+)$/;
|
|
let rgb = [0, 0, 0, 1];
|
let match;
|
let i;
|
let hexAlpha;
|
|
if (match = string.match(hex)) {
|
hexAlpha = match[2];
|
match = match[1];
|
|
for (i = 0; i < 3; i++) {
|
// https://jsperf.com/slice-vs-substr-vs-substring-methods-long-string/19
|
const i2 = i * 2;
|
rgb[i] = Number.parseInt(match.slice(i2, i2 + 2), 16);
|
}
|
|
if (hexAlpha) {
|
rgb[3] = Number.parseInt(hexAlpha, 16) / 255;
|
}
|
} else if (match = string.match(abbr)) {
|
match = match[1];
|
hexAlpha = match[3];
|
|
for (i = 0; i < 3; i++) {
|
rgb[i] = Number.parseInt(match[i] + match[i], 16);
|
}
|
|
if (hexAlpha) {
|
rgb[3] = Number.parseInt(hexAlpha + hexAlpha, 16) / 255;
|
}
|
} else if (match = string.match(rgba)) {
|
for (i = 0; i < 3; i++) {
|
rgb[i] = Number.parseInt(match[i + 1], 10);
|
}
|
|
if (match[4]) {
|
rgb[3] = match[5] ? Number.parseFloat(match[4]) * 0.01 : Number.parseFloat(match[4]);
|
}
|
} else if (match = string.match(per)) {
|
for (i = 0; i < 3; i++) {
|
rgb[i] = Math.round(Number.parseFloat(match[i + 1]) * 2.55);
|
}
|
|
if (match[4]) {
|
rgb[3] = match[5] ? Number.parseFloat(match[4]) * 0.01 : Number.parseFloat(match[4]);
|
}
|
} else if (match = string.match(keyword)) {
|
if (match[1] === 'transparent') {
|
return [0, 0, 0, 0];
|
}
|
|
if (!Object.hasOwn(cssKeywords, match[1])) {
|
return null;
|
}
|
|
rgb = cssKeywords[match[1]];
|
rgb[3] = 1;
|
|
return rgb;
|
} else {
|
return null;
|
}
|
|
for (i = 0; i < 3; i++) {
|
rgb[i] = clamp(rgb[i], 0, 255);
|
}
|
|
rgb[3] = clamp(rgb[3], 0, 1);
|
|
return rgb;
|
};
|
|
cs.get.hsl = function (string) {
|
if (!string) {
|
return null;
|
}
|
|
const hsl = /^hsla?\(\s*([+-]?(?:\d{0,3}\.)?\d+)(?:deg)?\s*,?\s*([+-]?[\d.]+)%\s*,?\s*([+-]?[\d.]+)%\s*(?:[,|/]\s*([+-]?(?=\.\d|\d)(?:0|[1-9]\d*)?(?:\.\d*)?(?:[eE][+-]?\d+)?)\s*)?\)$/;
|
const match = string.match(hsl);
|
|
if (match) {
|
const alpha = Number.parseFloat(match[4]);
|
const h = ((Number.parseFloat(match[1]) % 360) + 360) % 360;
|
const s = clamp(Number.parseFloat(match[2]), 0, 100);
|
const l = clamp(Number.parseFloat(match[3]), 0, 100);
|
const a = clamp(Number.isNaN(alpha) ? 1 : alpha, 0, 1);
|
|
return [h, s, l, a];
|
}
|
|
return null;
|
};
|
|
cs.get.hwb = function (string) {
|
if (!string) {
|
return null;
|
}
|
|
const hwb = /^hwb\(\s*([+-]?\d{0,3}(?:\.\d+)?)(?:deg)?\s*[\s,]\s*([+-]?[\d.]+)%\s*[\s,]\s*([+-]?[\d.]+)%\s*(?:[\s,]\s*([+-]?(?=\.\d|\d)(?:0|[1-9]\d*)?(?:\.\d*)?(?:[eE][+-]?\d+)?)\s*)?\)$/;
|
const match = string.match(hwb);
|
|
if (match) {
|
const alpha = Number.parseFloat(match[4]);
|
const h = ((Number.parseFloat(match[1]) % 360) + 360) % 360;
|
const w = clamp(Number.parseFloat(match[2]), 0, 100);
|
const b = clamp(Number.parseFloat(match[3]), 0, 100);
|
const a = clamp(Number.isNaN(alpha) ? 1 : alpha, 0, 1);
|
return [h, w, b, a];
|
}
|
|
return null;
|
};
|
|
cs.to.hex = function (...rgba) {
|
return (
|
'#' +
|
hexDouble(rgba[0]) +
|
hexDouble(rgba[1]) +
|
hexDouble(rgba[2]) +
|
(rgba[3] < 1
|
? (hexDouble(Math.round(rgba[3] * 255)))
|
: '')
|
);
|
};
|
|
cs.to.rgb = function (...rgba) {
|
return rgba.length < 4 || rgba[3] === 1
|
? 'rgb(' + Math.round(rgba[0]) + ', ' + Math.round(rgba[1]) + ', ' + Math.round(rgba[2]) + ')'
|
: 'rgba(' + Math.round(rgba[0]) + ', ' + Math.round(rgba[1]) + ', ' + Math.round(rgba[2]) + ', ' + rgba[3] + ')';
|
};
|
|
cs.to.rgb.percent = function (...rgba) {
|
const r = Math.round(rgba[0] / 255 * 100);
|
const g = Math.round(rgba[1] / 255 * 100);
|
const b = Math.round(rgba[2] / 255 * 100);
|
|
return rgba.length < 4 || rgba[3] === 1
|
? 'rgb(' + r + '%, ' + g + '%, ' + b + '%)'
|
: 'rgba(' + r + '%, ' + g + '%, ' + b + '%, ' + rgba[3] + ')';
|
};
|
|
cs.to.hsl = function (...hsla) {
|
return hsla.length < 4 || hsla[3] === 1
|
? 'hsl(' + hsla[0] + ', ' + hsla[1] + '%, ' + hsla[2] + '%)'
|
: 'hsla(' + hsla[0] + ', ' + hsla[1] + '%, ' + hsla[2] + '%, ' + hsla[3] + ')';
|
};
|
|
// Hwb is a bit different than rgb(a) & hsl(a) since there is no alpha specific syntax
|
// (hwb have alpha optional & 1 is default value)
|
cs.to.hwb = function (...hwba) {
|
let a = '';
|
if (hwba.length >= 4 && hwba[3] !== 1) {
|
a = ', ' + hwba[3];
|
}
|
|
return 'hwb(' + hwba[0] + ', ' + hwba[1] + '%, ' + hwba[2] + '%' + a + ')';
|
};
|
|
cs.to.keyword = function (...rgb) {
|
return reverseNames[rgb.slice(0, 3)];
|
};
|
|
// Helpers
|
function clamp(number_, min, max) {
|
return Math.min(Math.max(min, number_), max);
|
}
|
|
function hexDouble(number_) {
|
const string_ = Math.round(number_).toString(16).toUpperCase();
|
return (string_.length < 2) ? '0' + string_ : string_;
|
}
|
|
/* MIT license */
|
/* eslint-disable no-mixed-operators */
|
|
// NOTE: conversions should only return primitive values (i.e. arrays, or
|
// values that give correct `typeof` results).
|
// do not use box values types (i.e. Number(), String(), etc.)
|
|
const reverseKeywords = {};
|
for (const key of Object.keys(cssKeywords)) {
|
reverseKeywords[cssKeywords[key]] = key;
|
}
|
|
const convert$1 = {
|
rgb: {channels: 3, labels: 'rgb'},
|
hsl: {channels: 3, labels: 'hsl'},
|
hsv: {channels: 3, labels: 'hsv'},
|
hwb: {channels: 3, labels: 'hwb'},
|
cmyk: {channels: 4, labels: 'cmyk'},
|
xyz: {channels: 3, labels: 'xyz'},
|
lab: {channels: 3, labels: 'lab'},
|
oklab: {channels: 3, labels: ['okl', 'oka', 'okb']},
|
lch: {channels: 3, labels: 'lch'},
|
oklch: {channels: 3, labels: ['okl', 'okc', 'okh']},
|
hex: {channels: 1, labels: ['hex']},
|
keyword: {channels: 1, labels: ['keyword']},
|
ansi16: {channels: 1, labels: ['ansi16']},
|
ansi256: {channels: 1, labels: ['ansi256']},
|
hcg: {channels: 3, labels: ['h', 'c', 'g']},
|
apple: {channels: 3, labels: ['r16', 'g16', 'b16']},
|
gray: {channels: 1, labels: ['gray']},
|
};
|
|
// LAB f(t) constant
|
const LAB_FT = (6 / 29) ** 3;
|
|
// SRGB non-linear transform functions
|
function srgbNonlinearTransform(c) {
|
const cc = c > 0.003_130_8
|
? ((1.055 * (c ** (1 / 2.4))) - 0.055)
|
: c * 12.92;
|
return Math.min(Math.max(0, cc), 1);
|
}
|
|
function srgbNonlinearTransformInv(c) {
|
return c > 0.040_45 ? (((c + 0.055) / 1.055) ** 2.4) : (c / 12.92);
|
}
|
|
// Hide .channels and .labels properties
|
for (const model of Object.keys(convert$1)) {
|
if (!('channels' in convert$1[model])) {
|
throw new Error('missing channels property: ' + model);
|
}
|
|
if (!('labels' in convert$1[model])) {
|
throw new Error('missing channel labels property: ' + model);
|
}
|
|
if (convert$1[model].labels.length !== convert$1[model].channels) {
|
throw new Error('channel and label counts mismatch: ' + model);
|
}
|
|
const {channels, labels} = convert$1[model];
|
delete convert$1[model].channels;
|
delete convert$1[model].labels;
|
Object.defineProperty(convert$1[model], 'channels', {value: channels});
|
Object.defineProperty(convert$1[model], 'labels', {value: labels});
|
}
|
|
convert$1.rgb.hsl = function (rgb) {
|
const r = rgb[0] / 255;
|
const g = rgb[1] / 255;
|
const b = rgb[2] / 255;
|
const min = Math.min(r, g, b);
|
const max = Math.max(r, g, b);
|
const delta = max - min;
|
let h;
|
let s;
|
|
switch (max) {
|
case min: {
|
h = 0;
|
|
break;
|
}
|
|
case r: {
|
h = (g - b) / delta;
|
|
break;
|
}
|
|
case g: {
|
h = 2 + (b - r) / delta;
|
|
break;
|
}
|
|
case b: {
|
h = 4 + (r - g) / delta;
|
|
break;
|
}
|
// No default
|
}
|
|
h = Math.min(h * 60, 360);
|
|
if (h < 0) {
|
h += 360;
|
}
|
|
const l = (min + max) / 2;
|
|
if (max === min) {
|
s = 0;
|
} else if (l <= 0.5) {
|
s = delta / (max + min);
|
} else {
|
s = delta / (2 - max - min);
|
}
|
|
return [h, s * 100, l * 100];
|
};
|
|
convert$1.rgb.hsv = function (rgb) {
|
let rdif;
|
let gdif;
|
let bdif;
|
let h;
|
let s;
|
|
const r = rgb[0] / 255;
|
const g = rgb[1] / 255;
|
const b = rgb[2] / 255;
|
const v = Math.max(r, g, b);
|
const diff = v - Math.min(r, g, b);
|
const diffc = function (c) {
|
return (v - c) / 6 / diff + 1 / 2;
|
};
|
|
if (diff === 0) {
|
h = 0;
|
s = 0;
|
} else {
|
s = diff / v;
|
rdif = diffc(r);
|
gdif = diffc(g);
|
bdif = diffc(b);
|
|
switch (v) {
|
case r: {
|
h = bdif - gdif;
|
|
break;
|
}
|
|
case g: {
|
h = (1 / 3) + rdif - bdif;
|
|
break;
|
}
|
|
case b: {
|
h = (2 / 3) + gdif - rdif;
|
|
break;
|
}
|
// No default
|
}
|
|
if (h < 0) {
|
h += 1;
|
} else if (h > 1) {
|
h -= 1;
|
}
|
}
|
|
return [
|
h * 360,
|
s * 100,
|
v * 100,
|
];
|
};
|
|
convert$1.rgb.hwb = function (rgb) {
|
const r = rgb[0];
|
const g = rgb[1];
|
let b = rgb[2];
|
const h = convert$1.rgb.hsl(rgb)[0];
|
const w = 1 / 255 * Math.min(r, Math.min(g, b));
|
|
b = 1 - 1 / 255 * Math.max(r, Math.max(g, b));
|
|
return [h, w * 100, b * 100];
|
};
|
|
convert$1.rgb.oklab = function (rgb) {
|
// Assume sRGB
|
const r = srgbNonlinearTransformInv(rgb[0] / 255);
|
const g = srgbNonlinearTransformInv(rgb[1] / 255);
|
const b = srgbNonlinearTransformInv(rgb[2] / 255);
|
|
const lp = Math.cbrt(0.412_221_470_8 * r + 0.536_332_536_3 * g + 0.051_445_992_9 * b);
|
const mp = Math.cbrt(0.211_903_498_2 * r + 0.680_699_545_1 * g + 0.107_396_956_6 * b);
|
const sp = Math.cbrt(0.088_302_461_9 * r + 0.281_718_837_6 * g + 0.629_978_700_5 * b);
|
|
const l = 0.210_454_255_3 * lp + 0.793_617_785 * mp - 0.004_072_046_8 * sp;
|
const aa = 1.977_998_495_1 * lp - 2.428_592_205 * mp + 0.450_593_709_9 * sp;
|
const bb = 0.025_904_037_1 * lp + 0.782_771_766_2 * mp - 0.808_675_766 * sp;
|
|
return [l * 100, aa * 100, bb * 100];
|
};
|
|
convert$1.rgb.cmyk = function (rgb) {
|
const r = rgb[0] / 255;
|
const g = rgb[1] / 255;
|
const b = rgb[2] / 255;
|
|
const k = Math.min(1 - r, 1 - g, 1 - b);
|
const c = (1 - r - k) / (1 - k) || 0;
|
const m = (1 - g - k) / (1 - k) || 0;
|
const y = (1 - b - k) / (1 - k) || 0;
|
|
return [c * 100, m * 100, y * 100, k * 100];
|
};
|
|
function comparativeDistance(x, y) {
|
/*
|
See https://en.m.wikipedia.org/wiki/Euclidean_distance#Squared_Euclidean_distance
|
*/
|
return (
|
((x[0] - y[0]) ** 2) +
|
((x[1] - y[1]) ** 2) +
|
((x[2] - y[2]) ** 2)
|
);
|
}
|
|
convert$1.rgb.keyword = function (rgb) {
|
const reversed = reverseKeywords[rgb];
|
if (reversed) {
|
return reversed;
|
}
|
|
let currentClosestDistance = Number.POSITIVE_INFINITY;
|
let currentClosestKeyword;
|
|
for (const keyword of Object.keys(cssKeywords)) {
|
const value = cssKeywords[keyword];
|
|
// Compute comparative distance
|
const distance = comparativeDistance(rgb, value);
|
|
// Check if its less, if so set as closest
|
if (distance < currentClosestDistance) {
|
currentClosestDistance = distance;
|
currentClosestKeyword = keyword;
|
}
|
}
|
|
return currentClosestKeyword;
|
};
|
|
convert$1.keyword.rgb = function (keyword) {
|
return cssKeywords[keyword];
|
};
|
|
convert$1.rgb.xyz = function (rgb) {
|
// Assume sRGB
|
const r = srgbNonlinearTransformInv(rgb[0] / 255);
|
const g = srgbNonlinearTransformInv(rgb[1] / 255);
|
const b = srgbNonlinearTransformInv(rgb[2] / 255);
|
|
const x = (r * 0.412_456_4) + (g * 0.357_576_1) + (b * 0.180_437_5);
|
const y = (r * 0.212_672_9) + (g * 0.715_152_2) + (b * 0.072_175);
|
const z = (r * 0.019_333_9) + (g * 0.119_192) + (b * 0.950_304_1);
|
|
return [x * 100, y * 100, z * 100];
|
};
|
|
convert$1.rgb.lab = function (rgb) {
|
const xyz = convert$1.rgb.xyz(rgb);
|
let x = xyz[0];
|
let y = xyz[1];
|
let z = xyz[2];
|
|
x /= 95.047;
|
y /= 100;
|
z /= 108.883;
|
|
x = x > LAB_FT ? (x ** (1 / 3)) : (7.787 * x) + (16 / 116);
|
y = y > LAB_FT ? (y ** (1 / 3)) : (7.787 * y) + (16 / 116);
|
z = z > LAB_FT ? (z ** (1 / 3)) : (7.787 * z) + (16 / 116);
|
|
const l = (116 * y) - 16;
|
const a = 500 * (x - y);
|
const b = 200 * (y - z);
|
|
return [l, a, b];
|
};
|
|
convert$1.hsl.rgb = function (hsl) {
|
const h = hsl[0] / 360;
|
const s = hsl[1] / 100;
|
const l = hsl[2] / 100;
|
let t3;
|
let value;
|
|
if (s === 0) {
|
value = l * 255;
|
return [value, value, value];
|
}
|
|
const t2 = l < 0.5 ? l * (1 + s) : l + s - l * s;
|
|
const t1 = 2 * l - t2;
|
|
const rgb = [0, 0, 0];
|
for (let i = 0; i < 3; i++) {
|
t3 = h + 1 / 3 * -(i - 1);
|
if (t3 < 0) {
|
t3++;
|
}
|
|
if (t3 > 1) {
|
t3--;
|
}
|
|
if (6 * t3 < 1) {
|
value = t1 + (t2 - t1) * 6 * t3;
|
} else if (2 * t3 < 1) {
|
value = t2;
|
} else if (3 * t3 < 2) {
|
value = t1 + (t2 - t1) * (2 / 3 - t3) * 6;
|
} else {
|
value = t1;
|
}
|
|
rgb[i] = value * 255;
|
}
|
|
return rgb;
|
};
|
|
convert$1.hsl.hsv = function (hsl) {
|
const h = hsl[0];
|
let s = hsl[1] / 100;
|
let l = hsl[2] / 100;
|
let smin = s;
|
const lmin = Math.max(l, 0.01);
|
|
l *= 2;
|
s *= (l <= 1) ? l : 2 - l;
|
smin *= lmin <= 1 ? lmin : 2 - lmin;
|
const v = (l + s) / 2;
|
const sv = l === 0 ? (2 * smin) / (lmin + smin) : (2 * s) / (l + s);
|
|
return [h, sv * 100, v * 100];
|
};
|
|
convert$1.hsv.rgb = function (hsv) {
|
const h = hsv[0] / 60;
|
const s = hsv[1] / 100;
|
let v = hsv[2] / 100;
|
const hi = Math.floor(h) % 6;
|
|
const f = h - Math.floor(h);
|
const p = 255 * v * (1 - s);
|
const q = 255 * v * (1 - (s * f));
|
const t = 255 * v * (1 - (s * (1 - f)));
|
v *= 255;
|
|
switch (hi) {
|
case 0: {
|
return [v, t, p];
|
}
|
|
case 1: {
|
return [q, v, p];
|
}
|
|
case 2: {
|
return [p, v, t];
|
}
|
|
case 3: {
|
return [p, q, v];
|
}
|
|
case 4: {
|
return [t, p, v];
|
}
|
|
case 5: {
|
return [v, p, q];
|
}
|
}
|
};
|
|
convert$1.hsv.hsl = function (hsv) {
|
const h = hsv[0];
|
const s = hsv[1] / 100;
|
const v = hsv[2] / 100;
|
const vmin = Math.max(v, 0.01);
|
let sl;
|
let l;
|
|
l = (2 - s) * v;
|
const lmin = (2 - s) * vmin;
|
sl = s * vmin;
|
sl /= (lmin <= 1) ? lmin : 2 - lmin;
|
sl = sl || 0;
|
l /= 2;
|
|
return [h, sl * 100, l * 100];
|
};
|
|
// http://dev.w3.org/csswg/css-color/#hwb-to-rgb
|
convert$1.hwb.rgb = function (hwb) {
|
const h = hwb[0] / 360;
|
let wh = hwb[1] / 100;
|
let bl = hwb[2] / 100;
|
const ratio = wh + bl;
|
let f;
|
|
// Wh + bl cant be > 1
|
if (ratio > 1) {
|
wh /= ratio;
|
bl /= ratio;
|
}
|
|
const i = Math.floor(6 * h);
|
const v = 1 - bl;
|
f = 6 * h - i;
|
|
// eslint-disable-next-line no-bitwise
|
if ((i & 0x01) !== 0) {
|
f = 1 - f;
|
}
|
|
const n = wh + f * (v - wh); // Linear interpolation
|
|
let r;
|
let g;
|
let b;
|
/* eslint-disable max-statements-per-line,no-multi-spaces, default-case-last */
|
switch (i) {
|
default:
|
case 6:
|
case 0: { r = v; g = n; b = wh; break;
|
}
|
|
case 1: { r = n; g = v; b = wh; break;
|
}
|
|
case 2: { r = wh; g = v; b = n; break;
|
}
|
|
case 3: { r = wh; g = n; b = v; break;
|
}
|
|
case 4: { r = n; g = wh; b = v; break;
|
}
|
|
case 5: { r = v; g = wh; b = n; break;
|
}
|
}
|
/* eslint-enable max-statements-per-line,no-multi-spaces, default-case-last */
|
|
return [r * 255, g * 255, b * 255];
|
};
|
|
convert$1.cmyk.rgb = function (cmyk) {
|
const c = cmyk[0] / 100;
|
const m = cmyk[1] / 100;
|
const y = cmyk[2] / 100;
|
const k = cmyk[3] / 100;
|
|
const r = 1 - Math.min(1, c * (1 - k) + k);
|
const g = 1 - Math.min(1, m * (1 - k) + k);
|
const b = 1 - Math.min(1, y * (1 - k) + k);
|
|
return [r * 255, g * 255, b * 255];
|
};
|
|
convert$1.xyz.rgb = function (xyz) {
|
const x = xyz[0] / 100;
|
const y = xyz[1] / 100;
|
const z = xyz[2] / 100;
|
let r;
|
let g;
|
let b;
|
|
r = (x * 3.240_454_2) + (y * -1.537_138_5) + (z * -0.498_531_4);
|
g = (x * -0.969_266) + (y * 1.876_010_8) + (z * 0.041_556);
|
b = (x * 0.055_643_4) + (y * -0.204_025_9) + (z * 1.057_225_2);
|
|
// Assume sRGB
|
r = srgbNonlinearTransform(r);
|
g = srgbNonlinearTransform(g);
|
b = srgbNonlinearTransform(b);
|
|
return [r * 255, g * 255, b * 255];
|
};
|
|
convert$1.xyz.lab = function (xyz) {
|
let x = xyz[0];
|
let y = xyz[1];
|
let z = xyz[2];
|
|
x /= 95.047;
|
y /= 100;
|
z /= 108.883;
|
|
x = x > LAB_FT ? (x ** (1 / 3)) : (7.787 * x) + (16 / 116);
|
y = y > LAB_FT ? (y ** (1 / 3)) : (7.787 * y) + (16 / 116);
|
z = z > LAB_FT ? (z ** (1 / 3)) : (7.787 * z) + (16 / 116);
|
|
const l = (116 * y) - 16;
|
const a = 500 * (x - y);
|
const b = 200 * (y - z);
|
|
return [l, a, b];
|
};
|
|
convert$1.xyz.oklab = function (xyz) {
|
const x = xyz[0] / 100;
|
const y = xyz[1] / 100;
|
const z = xyz[2] / 100;
|
|
const lp = Math.cbrt(0.818_933_010_1 * x + 0.361_866_742_4 * y - 0.128_859_713_7 * z);
|
const mp = Math.cbrt(0.032_984_543_6 * x + 0.929_311_871_5 * y + 0.036_145_638_7 * z);
|
const sp = Math.cbrt(0.048_200_301_8 * x + 0.264_366_269_1 * y + 0.633_851_707 * z);
|
|
const l = 0.210_454_255_3 * lp + 0.793_617_785 * mp - 0.004_072_046_8 * sp;
|
const a = 1.977_998_495_1 * lp - 2.428_592_205 * mp + 0.450_593_709_9 * sp;
|
const b = 0.025_904_037_1 * lp + 0.782_771_766_2 * mp - 0.808_675_766 * sp;
|
|
return [l * 100, a * 100, b * 100];
|
};
|
|
convert$1.oklab.oklch = function (oklab) {
|
return convert$1.lab.lch(oklab);
|
};
|
|
convert$1.oklab.xyz = function (oklab) {
|
const ll = oklab[0] / 100;
|
const a = oklab[1] / 100;
|
const b = oklab[2] / 100;
|
|
const l = (0.999_999_998 * ll + 0.396_337_792 * a + 0.215_803_758 * b) ** 3;
|
const m = (1.000_000_008 * ll - 0.105_561_342 * a - 0.063_854_175 * b) ** 3;
|
const s = (1.000_000_055 * ll - 0.089_484_182 * a - 1.291_485_538 * b) ** 3;
|
|
const x = 1.227_013_851 * l - 0.557_799_98 * m + 0.281_256_149 * s;
|
const y = -0.040_580_178 * l + 1.112_256_87 * m - 0.071_676_679 * s;
|
const z = -0.076_381_285 * l - 0.421_481_978 * m + 1.586_163_22 * s;
|
|
return [x * 100, y * 100, z * 100];
|
};
|
|
convert$1.oklab.rgb = function (oklab) {
|
const ll = oklab[0] / 100;
|
const aa = oklab[1] / 100;
|
const bb = oklab[2] / 100;
|
|
const l = (ll + 0.396_337_777_4 * aa + 0.215_803_757_3 * bb) ** 3;
|
const m = (ll - 0.105_561_345_8 * aa - 0.063_854_172_8 * bb) ** 3;
|
const s = (ll - 0.089_484_177_5 * aa - 1.291_485_548 * bb) ** 3;
|
|
// Assume sRGB
|
const r = srgbNonlinearTransform(4.076_741_662_1 * l - 3.307_711_591_3 * m + 0.230_969_929_2 * s);
|
const g = srgbNonlinearTransform(-1.268_438_004_6 * l + 2.609_757_401_1 * m - 0.341_319_396_5 * s);
|
const b = srgbNonlinearTransform(-0.004_196_086_3 * l - 0.703_418_614_7 * m + 1.707_614_701 * s);
|
|
return [r * 255, g * 255, b * 255];
|
};
|
|
convert$1.oklch.oklab = function (oklch) {
|
return convert$1.lch.lab(oklch);
|
};
|
|
convert$1.lab.xyz = function (lab) {
|
const l = lab[0];
|
const a = lab[1];
|
const b = lab[2];
|
let x;
|
let y;
|
let z;
|
|
y = (l + 16) / 116;
|
x = a / 500 + y;
|
z = y - b / 200;
|
|
const y2 = y ** 3;
|
const x2 = x ** 3;
|
const z2 = z ** 3;
|
y = y2 > LAB_FT ? y2 : (y - 16 / 116) / 7.787;
|
x = x2 > LAB_FT ? x2 : (x - 16 / 116) / 7.787;
|
z = z2 > LAB_FT ? z2 : (z - 16 / 116) / 7.787;
|
|
// Illuminant D65 XYZ Tristrimulus Values
|
// https://en.wikipedia.org/wiki/CIE_1931_color_space
|
x *= 95.047;
|
y *= 100;
|
z *= 108.883;
|
|
return [x, y, z];
|
};
|
|
convert$1.lab.lch = function (lab) {
|
const l = lab[0];
|
const a = lab[1];
|
const b = lab[2];
|
let h;
|
|
const hr = Math.atan2(b, a);
|
h = hr * 360 / 2 / Math.PI;
|
|
if (h < 0) {
|
h += 360;
|
}
|
|
const c = Math.sqrt(a * a + b * b);
|
|
return [l, c, h];
|
};
|
|
convert$1.lch.lab = function (lch) {
|
const l = lch[0];
|
const c = lch[1];
|
const h = lch[2];
|
|
const hr = h / 360 * 2 * Math.PI;
|
const a = c * Math.cos(hr);
|
const b = c * Math.sin(hr);
|
|
return [l, a, b];
|
};
|
|
convert$1.rgb.ansi16 = function (args, saturation = null) {
|
const [r, g, b] = args;
|
let value = saturation === null ? convert$1.rgb.hsv(args)[2] : saturation; // Hsv -> ansi16 optimization
|
|
value = Math.round(value / 50);
|
|
if (value === 0) {
|
return 30;
|
}
|
|
let ansi = 30
|
/* eslint-disable no-bitwise */
|
+ ((Math.round(b / 255) << 2)
|
| (Math.round(g / 255) << 1)
|
| Math.round(r / 255));
|
/* eslint-enable no-bitwise */
|
|
if (value === 2) {
|
ansi += 60;
|
}
|
|
return ansi;
|
};
|
|
convert$1.hsv.ansi16 = function (args) {
|
// Optimization here; we already know the value and don't need to get
|
// it converted for us.
|
return convert$1.rgb.ansi16(convert$1.hsv.rgb(args), args[2]);
|
};
|
|
convert$1.rgb.ansi256 = function (args) {
|
const r = args[0];
|
const g = args[1];
|
const b = args[2];
|
|
// We use the extended greyscale palette here, with the exception of
|
// black and white. normal palette only has 4 greyscale shades.
|
// eslint-disable-next-line no-bitwise
|
if (r >> 4 === g >> 4 && g >> 4 === b >> 4) {
|
if (r < 8) {
|
return 16;
|
}
|
|
if (r > 248) {
|
return 231;
|
}
|
|
return Math.round(((r - 8) / 247) * 24) + 232;
|
}
|
|
const ansi = 16
|
+ (36 * Math.round(r / 255 * 5))
|
+ (6 * Math.round(g / 255 * 5))
|
+ Math.round(b / 255 * 5);
|
|
return ansi;
|
};
|
|
convert$1.ansi16.rgb = function (args) {
|
args = args[0];
|
|
let color = args % 10;
|
|
// Handle greyscale
|
if (color === 0 || color === 7) {
|
if (args > 50) {
|
color += 3.5;
|
}
|
|
color = color / 10.5 * 255;
|
|
return [color, color, color];
|
}
|
|
const mult = (Math.trunc(args > 50) + 1) * 0.5;
|
/* eslint-disable no-bitwise */
|
const r = ((color & 1) * mult) * 255;
|
const g = (((color >> 1) & 1) * mult) * 255;
|
const b = (((color >> 2) & 1) * mult) * 255;
|
/* eslint-enable no-bitwise */
|
|
return [r, g, b];
|
};
|
|
convert$1.ansi256.rgb = function (args) {
|
args = args[0];
|
|
// Handle greyscale
|
if (args >= 232) {
|
const c = (args - 232) * 10 + 8;
|
return [c, c, c];
|
}
|
|
args -= 16;
|
|
let rem;
|
const r = Math.floor(args / 36) / 5 * 255;
|
const g = Math.floor((rem = args % 36) / 6) / 5 * 255;
|
const b = (rem % 6) / 5 * 255;
|
|
return [r, g, b];
|
};
|
|
convert$1.rgb.hex = function (args) {
|
/* eslint-disable no-bitwise */
|
const integer = ((Math.round(args[0]) & 0xFF) << 16)
|
+ ((Math.round(args[1]) & 0xFF) << 8)
|
+ (Math.round(args[2]) & 0xFF);
|
/* eslint-enable no-bitwise */
|
|
const string = integer.toString(16).toUpperCase();
|
return '000000'.slice(string.length) + string;
|
};
|
|
convert$1.hex.rgb = function (args) {
|
const match = args.toString(16).match(/[a-f\d]{6}|[a-f\d]{3}/i);
|
if (!match) {
|
return [0, 0, 0];
|
}
|
|
let colorString = match[0];
|
|
if (match[0].length === 3) {
|
colorString = [...colorString].map(char => char + char).join('');
|
}
|
|
const integer = Number.parseInt(colorString, 16);
|
/* eslint-disable no-bitwise */
|
const r = (integer >> 16) & 0xFF;
|
const g = (integer >> 8) & 0xFF;
|
const b = integer & 0xFF;
|
/* eslint-enable no-bitwise */
|
|
return [r, g, b];
|
};
|
|
convert$1.rgb.hcg = function (rgb) {
|
const r = rgb[0] / 255;
|
const g = rgb[1] / 255;
|
const b = rgb[2] / 255;
|
const max = Math.max(Math.max(r, g), b);
|
const min = Math.min(Math.min(r, g), b);
|
const chroma = (max - min);
|
let hue;
|
|
const grayscale = chroma < 1 ? min / (1 - chroma) : 0;
|
|
if (chroma <= 0) {
|
hue = 0;
|
} else if (max === r) {
|
hue = ((g - b) / chroma) % 6;
|
} else if (max === g) {
|
hue = 2 + (b - r) / chroma;
|
} else {
|
hue = 4 + (r - g) / chroma;
|
}
|
|
hue /= 6;
|
hue %= 1;
|
|
return [hue * 360, chroma * 100, grayscale * 100];
|
};
|
|
convert$1.hsl.hcg = function (hsl) {
|
const s = hsl[1] / 100;
|
const l = hsl[2] / 100;
|
|
const c = l < 0.5 ? (2 * s * l) : (2 * s * (1 - l));
|
|
let f = 0;
|
if (c < 1) {
|
f = (l - 0.5 * c) / (1 - c);
|
}
|
|
return [hsl[0], c * 100, f * 100];
|
};
|
|
convert$1.hsv.hcg = function (hsv) {
|
const s = hsv[1] / 100;
|
const v = hsv[2] / 100;
|
|
const c = s * v;
|
let f = 0;
|
|
if (c < 1) {
|
f = (v - c) / (1 - c);
|
}
|
|
return [hsv[0], c * 100, f * 100];
|
};
|
|
convert$1.hcg.rgb = function (hcg) {
|
const h = hcg[0] / 360;
|
const c = hcg[1] / 100;
|
const g = hcg[2] / 100;
|
|
if (c === 0) {
|
return [g * 255, g * 255, g * 255];
|
}
|
|
const pure = [0, 0, 0];
|
const hi = (h % 1) * 6;
|
const v = hi % 1;
|
const w = 1 - v;
|
let mg = 0;
|
|
/* eslint-disable max-statements-per-line */
|
switch (Math.floor(hi)) {
|
case 0: {
|
pure[0] = 1; pure[1] = v; pure[2] = 0; break;
|
}
|
|
case 1: {
|
pure[0] = w; pure[1] = 1; pure[2] = 0; break;
|
}
|
|
case 2: {
|
pure[0] = 0; pure[1] = 1; pure[2] = v; break;
|
}
|
|
case 3: {
|
pure[0] = 0; pure[1] = w; pure[2] = 1; break;
|
}
|
|
case 4: {
|
pure[0] = v; pure[1] = 0; pure[2] = 1; break;
|
}
|
|
default: {
|
pure[0] = 1; pure[1] = 0; pure[2] = w;
|
}
|
}
|
/* eslint-enable max-statements-per-line */
|
|
mg = (1 - c) * g;
|
|
return [
|
(c * pure[0] + mg) * 255,
|
(c * pure[1] + mg) * 255,
|
(c * pure[2] + mg) * 255,
|
];
|
};
|
|
convert$1.hcg.hsv = function (hcg) {
|
const c = hcg[1] / 100;
|
const g = hcg[2] / 100;
|
|
const v = c + g * (1 - c);
|
let f = 0;
|
|
if (v > 0) {
|
f = c / v;
|
}
|
|
return [hcg[0], f * 100, v * 100];
|
};
|
|
convert$1.hcg.hsl = function (hcg) {
|
const c = hcg[1] / 100;
|
const g = hcg[2] / 100;
|
|
const l = g * (1 - c) + 0.5 * c;
|
let s = 0;
|
|
if (l > 0 && l < 0.5) {
|
s = c / (2 * l);
|
} else if (l >= 0.5 && l < 1) {
|
s = c / (2 * (1 - l));
|
}
|
|
return [hcg[0], s * 100, l * 100];
|
};
|
|
convert$1.hcg.hwb = function (hcg) {
|
const c = hcg[1] / 100;
|
const g = hcg[2] / 100;
|
const v = c + g * (1 - c);
|
return [hcg[0], (v - c) * 100, (1 - v) * 100];
|
};
|
|
convert$1.hwb.hcg = function (hwb) {
|
const w = hwb[1] / 100;
|
const b = hwb[2] / 100;
|
const v = 1 - b;
|
const c = v - w;
|
let g = 0;
|
|
if (c < 1) {
|
g = (v - c) / (1 - c);
|
}
|
|
return [hwb[0], c * 100, g * 100];
|
};
|
|
convert$1.apple.rgb = function (apple) {
|
return [(apple[0] / 65_535) * 255, (apple[1] / 65_535) * 255, (apple[2] / 65_535) * 255];
|
};
|
|
convert$1.rgb.apple = function (rgb) {
|
return [(rgb[0] / 255) * 65_535, (rgb[1] / 255) * 65_535, (rgb[2] / 255) * 65_535];
|
};
|
|
convert$1.gray.rgb = function (args) {
|
return [args[0] / 100 * 255, args[0] / 100 * 255, args[0] / 100 * 255];
|
};
|
|
convert$1.gray.hsl = function (args) {
|
return [0, 0, args[0]];
|
};
|
|
convert$1.gray.hsv = convert$1.gray.hsl;
|
|
convert$1.gray.hwb = function (gray) {
|
return [0, 100, gray[0]];
|
};
|
|
convert$1.gray.cmyk = function (gray) {
|
return [0, 0, 0, gray[0]];
|
};
|
|
convert$1.gray.lab = function (gray) {
|
return [gray[0], 0, 0];
|
};
|
|
convert$1.gray.hex = function (gray) {
|
/* eslint-disable no-bitwise */
|
const value = Math.round(gray[0] / 100 * 255) & 0xFF;
|
const integer = (value << 16) + (value << 8) + value;
|
/* eslint-enable no-bitwise */
|
|
const string = integer.toString(16).toUpperCase();
|
return '000000'.slice(string.length) + string;
|
};
|
|
convert$1.rgb.gray = function (rgb) {
|
const value = (rgb[0] + rgb[1] + rgb[2]) / 3;
|
return [value / 255 * 100];
|
};
|
|
/*
|
This function routes a model to all other models.
|
|
all functions that are routed have a property `.conversion` attached
|
to the returned synthetic function. This property is an array
|
of strings, each with the steps in between the 'from' and 'to'
|
color models (inclusive).
|
|
conversions that are not possible simply are not included.
|
*/
|
|
function buildGraph() {
|
const graph = {};
|
// https://jsperf.com/object-keys-vs-for-in-with-closure/3
|
const models = Object.keys(convert$1);
|
|
for (let {length} = models, i = 0; i < length; i++) {
|
graph[models[i]] = {
|
// http://jsperf.com/1-vs-infinity
|
// micro-opt, but this is simple.
|
distance: -1,
|
parent: null,
|
};
|
}
|
|
return graph;
|
}
|
|
// https://en.wikipedia.org/wiki/Breadth-first_search
|
function deriveBFS(fromModel) {
|
const graph = buildGraph();
|
const queue = [fromModel]; // Unshift -> queue -> pop
|
|
graph[fromModel].distance = 0;
|
|
while (queue.length > 0) {
|
const current = queue.pop();
|
const adjacents = Object.keys(convert$1[current]);
|
|
for (let {length} = adjacents, i = 0; i < length; i++) {
|
const adjacent = adjacents[i];
|
const node = graph[adjacent];
|
|
if (node.distance === -1) {
|
node.distance = graph[current].distance + 1;
|
node.parent = current;
|
queue.unshift(adjacent);
|
}
|
}
|
}
|
|
return graph;
|
}
|
|
function link(from, to) {
|
return function (args) {
|
return to(from(args));
|
};
|
}
|
|
function wrapConversion(toModel, graph) {
|
const path = [graph[toModel].parent, toModel];
|
let fn = convert$1[graph[toModel].parent][toModel];
|
|
let cur = graph[toModel].parent;
|
while (graph[cur].parent) {
|
path.unshift(graph[cur].parent);
|
fn = link(convert$1[graph[cur].parent][cur], fn);
|
cur = graph[cur].parent;
|
}
|
|
fn.conversion = path;
|
return fn;
|
}
|
|
function route(fromModel) {
|
const graph = deriveBFS(fromModel);
|
const conversion = {};
|
|
const models = Object.keys(graph);
|
for (let {length} = models, i = 0; i < length; i++) {
|
const toModel = models[i];
|
const node = graph[toModel];
|
|
if (node.parent === null) {
|
// No possible conversion, or this node is the source model.
|
continue;
|
}
|
|
conversion[toModel] = wrapConversion(toModel, graph);
|
}
|
|
return conversion;
|
}
|
|
const convert = {};
|
|
const models = Object.keys(convert$1);
|
|
function wrapRaw(fn) {
|
const wrappedFn = function (...args) {
|
const arg0 = args[0];
|
if (arg0 === undefined || arg0 === null) {
|
return arg0;
|
}
|
|
if (arg0.length > 1) {
|
args = arg0;
|
}
|
|
return fn(args);
|
};
|
|
// Preserve .conversion property if there is one
|
if ('conversion' in fn) {
|
wrappedFn.conversion = fn.conversion;
|
}
|
|
return wrappedFn;
|
}
|
|
function wrapRounded(fn) {
|
const wrappedFn = function (...args) {
|
const arg0 = args[0];
|
|
if (arg0 === undefined || arg0 === null) {
|
return arg0;
|
}
|
|
if (arg0.length > 1) {
|
args = arg0;
|
}
|
|
const result = fn(args);
|
|
// We're assuming the result is an array here.
|
// see notice in conversions.js; don't use box types
|
// in conversion functions.
|
if (typeof result === 'object') {
|
for (let {length} = result, i = 0; i < length; i++) {
|
result[i] = Math.round(result[i]);
|
}
|
}
|
|
return result;
|
};
|
|
// Preserve .conversion property if there is one
|
if ('conversion' in fn) {
|
wrappedFn.conversion = fn.conversion;
|
}
|
|
return wrappedFn;
|
}
|
|
for (const fromModel of models) {
|
convert[fromModel] = {};
|
|
Object.defineProperty(convert[fromModel], 'channels', {value: convert$1[fromModel].channels});
|
Object.defineProperty(convert[fromModel], 'labels', {value: convert$1[fromModel].labels});
|
|
const routes = route(fromModel);
|
const routeModels = Object.keys(routes);
|
|
for (const toModel of routeModels) {
|
const fn = routes[toModel];
|
|
convert[fromModel][toModel] = wrapRounded(fn);
|
convert[fromModel][toModel].raw = wrapRaw(fn);
|
}
|
}
|
|
const skippedModels = [
|
// To be honest, I don't really feel like keyword belongs in color convert, but eh.
|
'keyword',
|
|
// Gray conflicts with some method names, and has its own method defined.
|
'gray',
|
|
// Shouldn't really be in color-convert either...
|
'hex',
|
];
|
|
const hashedModelKeys = {};
|
for (const model of Object.keys(convert)) {
|
hashedModelKeys[[...convert[model].labels].sort().join('')] = model;
|
}
|
|
const limiters = {};
|
|
function Color(object, model) {
|
if (!(this instanceof Color)) {
|
return new Color(object, model);
|
}
|
|
if (model && model in skippedModels) {
|
model = null;
|
}
|
|
if (model && !(model in convert)) {
|
throw new Error('Unknown model: ' + model);
|
}
|
|
let i;
|
let channels;
|
|
if (object == null) { // eslint-disable-line no-eq-null,eqeqeq
|
this.model = 'rgb';
|
this.color = [0, 0, 0];
|
this.valpha = 1;
|
} else if (object instanceof Color) {
|
this.model = object.model;
|
this.color = [...object.color];
|
this.valpha = object.valpha;
|
} else if (typeof object === 'string') {
|
const result = cs.get(object);
|
if (result === null) {
|
throw new Error('Unable to parse color from string: ' + object);
|
}
|
|
this.model = result.model;
|
channels = convert[this.model].channels;
|
this.color = result.value.slice(0, channels);
|
this.valpha = typeof result.value[channels] === 'number' ? result.value[channels] : 1;
|
} else if (object.length > 0) {
|
this.model = model || 'rgb';
|
channels = convert[this.model].channels;
|
const newArray = Array.prototype.slice.call(object, 0, channels);
|
this.color = zeroArray(newArray, channels);
|
this.valpha = typeof object[channels] === 'number' ? object[channels] : 1;
|
} else if (typeof object === 'number') {
|
// This is always RGB - can be converted later on.
|
this.model = 'rgb';
|
this.color = [
|
(object >> 16) & 0xFF,
|
(object >> 8) & 0xFF,
|
object & 0xFF,
|
];
|
this.valpha = 1;
|
} else {
|
this.valpha = 1;
|
|
const keys = Object.keys(object);
|
if ('alpha' in object) {
|
keys.splice(keys.indexOf('alpha'), 1);
|
this.valpha = typeof object.alpha === 'number' ? object.alpha : 0;
|
}
|
|
const hashedKeys = keys.sort().join('');
|
if (!(hashedKeys in hashedModelKeys)) {
|
throw new Error('Unable to parse color from object: ' + JSON.stringify(object));
|
}
|
|
this.model = hashedModelKeys[hashedKeys];
|
|
const {labels} = convert[this.model];
|
const color = [];
|
for (i = 0; i < labels.length; i++) {
|
color.push(object[labels[i]]);
|
}
|
|
this.color = zeroArray(color);
|
}
|
|
// Perform limitations (clamping, etc.)
|
if (limiters[this.model]) {
|
channels = convert[this.model].channels;
|
for (i = 0; i < channels; i++) {
|
const limit = limiters[this.model][i];
|
if (limit) {
|
this.color[i] = limit(this.color[i]);
|
}
|
}
|
}
|
|
this.valpha = Math.max(0, Math.min(1, this.valpha));
|
|
if (Object.freeze) {
|
Object.freeze(this);
|
}
|
}
|
|
Color.prototype = {
|
toString() {
|
return this.string();
|
},
|
|
toJSON() {
|
return this[this.model]();
|
},
|
|
string(places) {
|
let self = this.model in cs.to ? this : this.rgb();
|
self = self.round(typeof places === 'number' ? places : 1);
|
const arguments_ = self.valpha === 1 ? self.color : [...self.color, this.valpha];
|
return cs.to[self.model](...arguments_);
|
},
|
|
percentString(places) {
|
const self = this.rgb().round(typeof places === 'number' ? places : 1);
|
const arguments_ = self.valpha === 1 ? self.color : [...self.color, this.valpha];
|
return cs.to.rgb.percent(...arguments_);
|
},
|
|
array() {
|
return this.valpha === 1 ? [...this.color] : [...this.color, this.valpha];
|
},
|
|
object() {
|
const result = {};
|
const {channels} = convert[this.model];
|
const {labels} = convert[this.model];
|
|
for (let i = 0; i < channels; i++) {
|
result[labels[i]] = this.color[i];
|
}
|
|
if (this.valpha !== 1) {
|
result.alpha = this.valpha;
|
}
|
|
return result;
|
},
|
|
unitArray() {
|
const rgb = this.rgb().color;
|
rgb[0] /= 255;
|
rgb[1] /= 255;
|
rgb[2] /= 255;
|
|
if (this.valpha !== 1) {
|
rgb.push(this.valpha);
|
}
|
|
return rgb;
|
},
|
|
unitObject() {
|
const rgb = this.rgb().object();
|
rgb.r /= 255;
|
rgb.g /= 255;
|
rgb.b /= 255;
|
|
if (this.valpha !== 1) {
|
rgb.alpha = this.valpha;
|
}
|
|
return rgb;
|
},
|
|
round(places) {
|
places = Math.max(places || 0, 0);
|
return new Color([...this.color.map(roundToPlace(places)), this.valpha], this.model);
|
},
|
|
alpha(value) {
|
if (value !== undefined) {
|
return new Color([...this.color, Math.max(0, Math.min(1, value))], this.model);
|
}
|
|
return this.valpha;
|
},
|
|
// Rgb
|
red: getset('rgb', 0, maxfn(255)),
|
green: getset('rgb', 1, maxfn(255)),
|
blue: getset('rgb', 2, maxfn(255)),
|
|
hue: getset(['hsl', 'hsv', 'hsl', 'hwb', 'hcg'], 0, value => ((value % 360) + 360) % 360),
|
|
saturationl: getset('hsl', 1, maxfn(100)),
|
lightness: getset('hsl', 2, maxfn(100)),
|
|
saturationv: getset('hsv', 1, maxfn(100)),
|
value: getset('hsv', 2, maxfn(100)),
|
|
chroma: getset('hcg', 1, maxfn(100)),
|
gray: getset('hcg', 2, maxfn(100)),
|
|
white: getset('hwb', 1, maxfn(100)),
|
wblack: getset('hwb', 2, maxfn(100)),
|
|
cyan: getset('cmyk', 0, maxfn(100)),
|
magenta: getset('cmyk', 1, maxfn(100)),
|
yellow: getset('cmyk', 2, maxfn(100)),
|
black: getset('cmyk', 3, maxfn(100)),
|
|
x: getset('xyz', 0, maxfn(95.047)),
|
y: getset('xyz', 1, maxfn(100)),
|
z: getset('xyz', 2, maxfn(108.833)),
|
|
l: getset('lab', 0, maxfn(100)),
|
a: getset('lab', 1),
|
b: getset('lab', 2),
|
|
keyword(value) {
|
if (value !== undefined) {
|
return new Color(value);
|
}
|
|
return convert[this.model].keyword(this.color);
|
},
|
|
hex(value) {
|
if (value !== undefined) {
|
return new Color(value);
|
}
|
|
return cs.to.hex(...this.rgb().round().color);
|
},
|
|
hexa(value) {
|
if (value !== undefined) {
|
return new Color(value);
|
}
|
|
const rgbArray = this.rgb().round().color;
|
|
let alphaHex = Math.round(this.valpha * 255).toString(16).toUpperCase();
|
if (alphaHex.length === 1) {
|
alphaHex = '0' + alphaHex;
|
}
|
|
return cs.to.hex(...rgbArray) + alphaHex;
|
},
|
|
rgbNumber() {
|
const rgb = this.rgb().color;
|
return ((rgb[0] & 0xFF) << 16) | ((rgb[1] & 0xFF) << 8) | (rgb[2] & 0xFF);
|
},
|
|
luminosity() {
|
// http://www.w3.org/TR/WCAG20/#relativeluminancedef
|
const rgb = this.rgb().color;
|
|
const lum = [];
|
for (const [i, element] of rgb.entries()) {
|
const chan = element / 255;
|
lum[i] = (chan <= 0.04045) ? chan / 12.92 : ((chan + 0.055) / 1.055) ** 2.4;
|
}
|
|
return 0.2126 * lum[0] + 0.7152 * lum[1] + 0.0722 * lum[2];
|
},
|
|
contrast(color2) {
|
// http://www.w3.org/TR/WCAG20/#contrast-ratiodef
|
const lum1 = this.luminosity();
|
const lum2 = color2.luminosity();
|
|
if (lum1 > lum2) {
|
return (lum1 + 0.05) / (lum2 + 0.05);
|
}
|
|
return (lum2 + 0.05) / (lum1 + 0.05);
|
},
|
|
level(color2) {
|
// https://www.w3.org/TR/WCAG/#contrast-enhanced
|
const contrastRatio = this.contrast(color2);
|
if (contrastRatio >= 7) {
|
return 'AAA';
|
}
|
|
return (contrastRatio >= 4.5) ? 'AA' : '';
|
},
|
|
isDark() {
|
// YIQ equation from http://24ways.org/2010/calculating-color-contrast
|
const rgb = this.rgb().color;
|
const yiq = (rgb[0] * 2126 + rgb[1] * 7152 + rgb[2] * 722) / 10000;
|
return yiq < 128;
|
},
|
|
isLight() {
|
return !this.isDark();
|
},
|
|
negate() {
|
const rgb = this.rgb();
|
for (let i = 0; i < 3; i++) {
|
rgb.color[i] = 255 - rgb.color[i];
|
}
|
|
return rgb;
|
},
|
|
lighten(ratio) {
|
const hsl = this.hsl();
|
hsl.color[2] += hsl.color[2] * ratio;
|
return hsl;
|
},
|
|
darken(ratio) {
|
const hsl = this.hsl();
|
hsl.color[2] -= hsl.color[2] * ratio;
|
return hsl;
|
},
|
|
saturate(ratio) {
|
const hsl = this.hsl();
|
hsl.color[1] += hsl.color[1] * ratio;
|
return hsl;
|
},
|
|
desaturate(ratio) {
|
const hsl = this.hsl();
|
hsl.color[1] -= hsl.color[1] * ratio;
|
return hsl;
|
},
|
|
whiten(ratio) {
|
const hwb = this.hwb();
|
hwb.color[1] += hwb.color[1] * ratio;
|
return hwb;
|
},
|
|
blacken(ratio) {
|
const hwb = this.hwb();
|
hwb.color[2] += hwb.color[2] * ratio;
|
return hwb;
|
},
|
|
grayscale() {
|
// http://en.wikipedia.org/wiki/Grayscale#Converting_colour_to_grayscale
|
const rgb = this.rgb().color;
|
const value = rgb[0] * 0.3 + rgb[1] * 0.59 + rgb[2] * 0.11;
|
return Color.rgb(value, value, value);
|
},
|
|
fade(ratio) {
|
return this.alpha(this.valpha - (this.valpha * ratio));
|
},
|
|
opaquer(ratio) {
|
return this.alpha(this.valpha + (this.valpha * ratio));
|
},
|
|
rotate(degrees) {
|
const hsl = this.hsl();
|
let hue = hsl.color[0];
|
hue = (hue + degrees) % 360;
|
hue = hue < 0 ? 360 + hue : hue;
|
hsl.color[0] = hue;
|
return hsl;
|
},
|
|
mix(mixinColor, weight) {
|
// Ported from sass implementation in C
|
// https://github.com/sass/libsass/blob/0e6b4a2850092356aa3ece07c6b249f0221caced/functions.cpp#L209
|
if (!mixinColor || !mixinColor.rgb) {
|
throw new Error('Argument to "mix" was not a Color instance, but rather an instance of ' + typeof mixinColor);
|
}
|
|
const color1 = mixinColor.rgb();
|
const color2 = this.rgb();
|
const p = weight === undefined ? 0.5 : weight;
|
|
const w = 2 * p - 1;
|
const a = color1.alpha() - color2.alpha();
|
|
const w1 = (((w * a === -1) ? w : (w + a) / (1 + w * a)) + 1) / 2;
|
const w2 = 1 - w1;
|
|
return Color.rgb(
|
w1 * color1.red() + w2 * color2.red(),
|
w1 * color1.green() + w2 * color2.green(),
|
w1 * color1.blue() + w2 * color2.blue(),
|
color1.alpha() * p + color2.alpha() * (1 - p));
|
},
|
};
|
|
// Model conversion methods and static constructors
|
for (const model of Object.keys(convert)) {
|
if (skippedModels.includes(model)) {
|
continue;
|
}
|
|
const {channels} = convert[model];
|
|
// Conversion methods
|
Color.prototype[model] = function (...arguments_) {
|
if (this.model === model) {
|
return new Color(this);
|
}
|
|
if (arguments_.length > 0) {
|
return new Color(arguments_, model);
|
}
|
|
return new Color([...assertArray(convert[this.model][model].raw(this.color)), this.valpha], model);
|
};
|
|
// 'static' construction methods
|
Color[model] = function (...arguments_) {
|
let color = arguments_[0];
|
if (typeof color === 'number') {
|
color = zeroArray(arguments_, channels);
|
}
|
|
return new Color(color, model);
|
};
|
}
|
|
function roundTo(number, places) {
|
return Number(number.toFixed(places));
|
}
|
|
function roundToPlace(places) {
|
return function (number) {
|
return roundTo(number, places);
|
};
|
}
|
|
function getset(model, channel, modifier) {
|
model = Array.isArray(model) ? model : [model];
|
|
for (const m of model) {
|
(limiters[m] ||= [])[channel] = modifier;
|
}
|
|
model = model[0];
|
|
return function (value) {
|
let result;
|
|
if (value !== undefined) {
|
if (modifier) {
|
value = modifier(value);
|
}
|
|
result = this[model]();
|
result.color[channel] = value;
|
return result;
|
}
|
|
result = this[model]().color[channel];
|
if (modifier) {
|
result = modifier(result);
|
}
|
|
return result;
|
};
|
}
|
|
function maxfn(max) {
|
return function (v) {
|
return Math.max(0, Math.min(max, v));
|
};
|
}
|
|
function assertArray(value) {
|
return Array.isArray(value) ? value : [value];
|
}
|
|
function zeroArray(array, length) {
|
for (let i = 0; i < length; i++) {
|
if (typeof array[i] !== 'number') {
|
array[i] = 0;
|
}
|
}
|
|
return array;
|
}
|
|
function getDefaultExportFromCjs (x) {
|
return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
|
}
|
|
/***
|
* Convert string to hex color.
|
*
|
* @param {String} str Text to hash and convert to hex.
|
* @returns {String}
|
* @api public
|
*/
|
var textHex = function hex(str) {
|
for (
|
var i = 0, hash = 0;
|
i < str.length;
|
hash = str.charCodeAt(i++) + ((hash << 5) - hash)
|
);
|
|
var color = Math.floor(
|
Math.abs(
|
(Math.sin(hash) * 10000) % 1 * 16777216
|
)
|
).toString(16);
|
|
return '#' + Array(6 - color.length + 1).join('0') + color;
|
};
|
|
var hex = /*@__PURE__*/getDefaultExportFromCjs(textHex);
|
|
/**
|
* Generate a color for a given name. But be reasonably smart about it by
|
* understanding name spaces and coloring each namespace a bit lighter so they
|
* still have the same base color as the root.
|
*
|
* @param {string} namespace The namespace
|
* @param {string} [delimiter] The delimiter
|
* @returns {string} color
|
*/
|
function colorspace(namespace, delimiter) {
|
const split = namespace.split(delimiter || ':');
|
let base = hex(split[0]);
|
if (!split.length) return base;
|
for (let i = 0, l = split.length - 1; i < l; i++) {
|
base = Color(base).mix(Color(hex(split[i + 1]))).saturate(1).hex();
|
}
|
return base;
|
}
|
|
module.exports = colorspace;
|
