"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.tinycolor = exports.TinyColor = void 0; var conversion_1 = require("./conversion"); var css_color_names_1 = require("./css-color-names"); var format_input_1 = require("./format-input"); var util_1 = require("./util"); var TinyColor = /** @class */ (function () { function TinyColor(color, opts) { if (color === void 0) { color = ''; } if (opts === void 0) { opts = {}; } var _a; // If input is already a tinycolor, return itself if (color instanceof TinyColor) { // eslint-disable-next-line no-constructor-return return color; } if (typeof color === 'number') { color = (0, conversion_1.numberInputToObject)(color); } this.originalInput = color; var rgb = (0, format_input_1.inputToRGB)(color); this.originalInput = color; this.r = rgb.r; this.g = rgb.g; this.b = rgb.b; this.a = rgb.a; this.roundA = Math.round(100 * this.a) / 100; this.format = (_a = opts.format) !== null && _a !== void 0 ? _a : rgb.format; this.gradientType = opts.gradientType; // Don't let the range of [0,255] come back in [0,1]. // Potentially lose a little bit of precision here, but will fix issues where // .5 gets interpreted as half of the total, instead of half of 1 // If it was supposed to be 128, this was already taken care of by `inputToRgb` if (this.r < 1) { this.r = Math.round(this.r); } if (this.g < 1) { this.g = Math.round(this.g); } if (this.b < 1) { this.b = Math.round(this.b); } this.isValid = rgb.ok; } TinyColor.prototype.isDark = function () { return this.getBrightness() < 128; }; TinyColor.prototype.isLight = function () { return !this.isDark(); }; /** * Returns the perceived brightness of the color, from 0-255. */ TinyColor.prototype.getBrightness = function () { // http://www.w3.org/TR/AERT#color-contrast var rgb = this.toRgb(); return (rgb.r * 299 + rgb.g * 587 + rgb.b * 114) / 1000; }; /** * Returns the perceived luminance of a color, from 0-1. */ TinyColor.prototype.getLuminance = function () { // http://www.w3.org/TR/2008/REC-WCAG20-20081211/#relativeluminancedef var rgb = this.toRgb(); var R; var G; var B; var RsRGB = rgb.r / 255; var GsRGB = rgb.g / 255; var BsRGB = rgb.b / 255; if (RsRGB <= 0.03928) { R = RsRGB / 12.92; } else { // eslint-disable-next-line prefer-exponentiation-operator R = Math.pow((RsRGB + 0.055) / 1.055, 2.4); } if (GsRGB <= 0.03928) { G = GsRGB / 12.92; } else { // eslint-disable-next-line prefer-exponentiation-operator G = Math.pow((GsRGB + 0.055) / 1.055, 2.4); } if (BsRGB <= 0.03928) { B = BsRGB / 12.92; } else { // eslint-disable-next-line prefer-exponentiation-operator B = Math.pow((BsRGB + 0.055) / 1.055, 2.4); } return 0.2126 * R + 0.7152 * G + 0.0722 * B; }; /** * Returns the alpha value of a color, from 0-1. */ TinyColor.prototype.getAlpha = function () { return this.a; }; /** * Sets the alpha value on the current color. * * @param alpha - The new alpha value. The accepted range is 0-1. */ TinyColor.prototype.setAlpha = function (alpha) { this.a = (0, util_1.boundAlpha)(alpha); this.roundA = Math.round(100 * this.a) / 100; return this; }; /** * Returns whether the color is monochrome. */ TinyColor.prototype.isMonochrome = function () { var s = this.toHsl().s; return s === 0; }; /** * Returns the object as a HSVA object. */ TinyColor.prototype.toHsv = function () { var hsv = (0, conversion_1.rgbToHsv)(this.r, this.g, this.b); return { h: hsv.h * 360, s: hsv.s, v: hsv.v, a: this.a }; }; /** * Returns the hsva values interpolated into a string with the following format: * "hsva(xxx, xxx, xxx, xx)". */ TinyColor.prototype.toHsvString = function () { var hsv = (0, conversion_1.rgbToHsv)(this.r, this.g, this.b); var h = Math.round(hsv.h * 360); var s = Math.round(hsv.s * 100); var v = Math.round(hsv.v * 100); return this.a === 1 ? "hsv(".concat(h, ", ").concat(s, "%, ").concat(v, "%)") : "hsva(".concat(h, ", ").concat(s, "%, ").concat(v, "%, ").concat(this.roundA, ")"); }; /** * Returns the object as a HSLA object. */ TinyColor.prototype.toHsl = function () { var hsl = (0, conversion_1.rgbToHsl)(this.r, this.g, this.b); return { h: hsl.h * 360, s: hsl.s, l: hsl.l, a: this.a }; }; /** * Returns the hsla values interpolated into a string with the following format: * "hsla(xxx, xxx, xxx, xx)". */ TinyColor.prototype.toHslString = function () { var hsl = (0, conversion_1.rgbToHsl)(this.r, this.g, this.b); var h = Math.round(hsl.h * 360); var s = Math.round(hsl.s * 100); var l = Math.round(hsl.l * 100); return this.a === 1 ? "hsl(".concat(h, ", ").concat(s, "%, ").concat(l, "%)") : "hsla(".concat(h, ", ").concat(s, "%, ").concat(l, "%, ").concat(this.roundA, ")"); }; /** * Returns the hex value of the color. * @param allow3Char will shorten hex value to 3 char if possible */ TinyColor.prototype.toHex = function (allow3Char) { if (allow3Char === void 0) { allow3Char = false; } return (0, conversion_1.rgbToHex)(this.r, this.g, this.b, allow3Char); }; /** * Returns the hex value of the color -with a # prefixed. * @param allow3Char will shorten hex value to 3 char if possible */ TinyColor.prototype.toHexString = function (allow3Char) { if (allow3Char === void 0) { allow3Char = false; } return '#' + this.toHex(allow3Char); }; /** * Returns the hex 8 value of the color. * @param allow4Char will shorten hex value to 4 char if possible */ TinyColor.prototype.toHex8 = function (allow4Char) { if (allow4Char === void 0) { allow4Char = false; } return (0, conversion_1.rgbaToHex)(this.r, this.g, this.b, this.a, allow4Char); }; /** * Returns the hex 8 value of the color -with a # prefixed. * @param allow4Char will shorten hex value to 4 char if possible */ TinyColor.prototype.toHex8String = function (allow4Char) { if (allow4Char === void 0) { allow4Char = false; } return '#' + this.toHex8(allow4Char); }; /** * Returns the shorter hex value of the color depends on its alpha -with a # prefixed. * @param allowShortChar will shorten hex value to 3 or 4 char if possible */ TinyColor.prototype.toHexShortString = function (allowShortChar) { if (allowShortChar === void 0) { allowShortChar = false; } return this.a === 1 ? this.toHexString(allowShortChar) : this.toHex8String(allowShortChar); }; /** * Returns the object as a RGBA object. */ TinyColor.prototype.toRgb = function () { return { r: Math.round(this.r), g: Math.round(this.g), b: Math.round(this.b), a: this.a, }; }; /** * Returns the RGBA values interpolated into a string with the following format: * "RGBA(xxx, xxx, xxx, xx)". */ TinyColor.prototype.toRgbString = function () { var r = Math.round(this.r); var g = Math.round(this.g); var b = Math.round(this.b); return this.a === 1 ? "rgb(".concat(r, ", ").concat(g, ", ").concat(b, ")") : "rgba(".concat(r, ", ").concat(g, ", ").concat(b, ", ").concat(this.roundA, ")"); }; /** * Returns the object as a RGBA object. */ TinyColor.prototype.toPercentageRgb = function () { var fmt = function (x) { return "".concat(Math.round((0, util_1.bound01)(x, 255) * 100), "%"); }; return { r: fmt(this.r), g: fmt(this.g), b: fmt(this.b), a: this.a, }; }; /** * Returns the RGBA relative values interpolated into a string */ TinyColor.prototype.toPercentageRgbString = function () { var rnd = function (x) { return Math.round((0, util_1.bound01)(x, 255) * 100); }; return this.a === 1 ? "rgb(".concat(rnd(this.r), "%, ").concat(rnd(this.g), "%, ").concat(rnd(this.b), "%)") : "rgba(".concat(rnd(this.r), "%, ").concat(rnd(this.g), "%, ").concat(rnd(this.b), "%, ").concat(this.roundA, ")"); }; /** * The 'real' name of the color -if there is one. */ TinyColor.prototype.toName = function () { if (this.a === 0) { return 'transparent'; } if (this.a < 1) { return false; } var hex = '#' + (0, conversion_1.rgbToHex)(this.r, this.g, this.b, false); for (var _i = 0, _a = Object.entries(css_color_names_1.names); _i < _a.length; _i++) { var _b = _a[_i], key = _b[0], value = _b[1]; if (hex === value) { return key; } } return false; }; TinyColor.prototype.toString = function (format) { var formatSet = Boolean(format); format = format !== null && format !== void 0 ? format : this.format; var formattedString = false; var hasAlpha = this.a < 1 && this.a >= 0; var needsAlphaFormat = !formatSet && hasAlpha && (format.startsWith('hex') || format === 'name'); if (needsAlphaFormat) { // Special case for "transparent", all other non-alpha formats // will return rgba when there is transparency. if (format === 'name' && this.a === 0) { return this.toName(); } return this.toRgbString(); } if (format === 'rgb') { formattedString = this.toRgbString(); } if (format === 'prgb') { formattedString = this.toPercentageRgbString(); } if (format === 'hex' || format === 'hex6') { formattedString = this.toHexString(); } if (format === 'hex3') { formattedString = this.toHexString(true); } if (format === 'hex4') { formattedString = this.toHex8String(true); } if (format === 'hex8') { formattedString = this.toHex8String(); } if (format === 'name') { formattedString = this.toName(); } if (format === 'hsl') { formattedString = this.toHslString(); } if (format === 'hsv') { formattedString = this.toHsvString(); } return formattedString || this.toHexString(); }; TinyColor.prototype.toNumber = function () { return (Math.round(this.r) << 16) + (Math.round(this.g) << 8) + Math.round(this.b); }; TinyColor.prototype.clone = function () { return new TinyColor(this.toString()); }; /** * Lighten the color a given amount. Providing 100 will always return white. * @param amount - valid between 1-100 */ TinyColor.prototype.lighten = function (amount) { if (amount === void 0) { amount = 10; } var hsl = this.toHsl(); hsl.l += amount / 100; hsl.l = (0, util_1.clamp01)(hsl.l); return new TinyColor(hsl); }; /** * Brighten the color a given amount, from 0 to 100. * @param amount - valid between 1-100 */ TinyColor.prototype.brighten = function (amount) { if (amount === void 0) { amount = 10; } var rgb = this.toRgb(); rgb.r = Math.max(0, Math.min(255, rgb.r - Math.round(255 * -(amount / 100)))); rgb.g = Math.max(0, Math.min(255, rgb.g - Math.round(255 * -(amount / 100)))); rgb.b = Math.max(0, Math.min(255, rgb.b - Math.round(255 * -(amount / 100)))); return new TinyColor(rgb); }; /** * Darken the color a given amount, from 0 to 100. * Providing 100 will always return black. * @param amount - valid between 1-100 */ TinyColor.prototype.darken = function (amount) { if (amount === void 0) { amount = 10; } var hsl = this.toHsl(); hsl.l -= amount / 100; hsl.l = (0, util_1.clamp01)(hsl.l); return new TinyColor(hsl); }; /** * Mix the color with pure white, from 0 to 100. * Providing 0 will do nothing, providing 100 will always return white. * @param amount - valid between 1-100 */ TinyColor.prototype.tint = function (amount) { if (amount === void 0) { amount = 10; } return this.mix('white', amount); }; /** * Mix the color with pure black, from 0 to 100. * Providing 0 will do nothing, providing 100 will always return black. * @param amount - valid between 1-100 */ TinyColor.prototype.shade = function (amount) { if (amount === void 0) { amount = 10; } return this.mix('black', amount); }; /** * Desaturate the color a given amount, from 0 to 100. * Providing 100 will is the same as calling greyscale * @param amount - valid between 1-100 */ TinyColor.prototype.desaturate = function (amount) { if (amount === void 0) { amount = 10; } var hsl = this.toHsl(); hsl.s -= amount / 100; hsl.s = (0, util_1.clamp01)(hsl.s); return new TinyColor(hsl); }; /** * Saturate the color a given amount, from 0 to 100. * @param amount - valid between 1-100 */ TinyColor.prototype.saturate = function (amount) { if (amount === void 0) { amount = 10; } var hsl = this.toHsl(); hsl.s += amount / 100; hsl.s = (0, util_1.clamp01)(hsl.s); return new TinyColor(hsl); }; /** * Completely desaturates a color into greyscale. * Same as calling `desaturate(100)` */ TinyColor.prototype.greyscale = function () { return this.desaturate(100); }; /** * Spin takes a positive or negative amount within [-360, 360] indicating the change of hue. * Values outside of this range will be wrapped into this range. */ TinyColor.prototype.spin = function (amount) { var hsl = this.toHsl(); var hue = (hsl.h + amount) % 360; hsl.h = hue < 0 ? 360 + hue : hue; return new TinyColor(hsl); }; /** * Mix the current color a given amount with another color, from 0 to 100. * 0 means no mixing (return current color). */ TinyColor.prototype.mix = function (color, amount) { if (amount === void 0) { amount = 50; } var rgb1 = this.toRgb(); var rgb2 = new TinyColor(color).toRgb(); var p = amount / 100; var rgba = { r: (rgb2.r - rgb1.r) * p + rgb1.r, g: (rgb2.g - rgb1.g) * p + rgb1.g, b: (rgb2.b - rgb1.b) * p + rgb1.b, a: (rgb2.a - rgb1.a) * p + rgb1.a, }; return new TinyColor(rgba); }; TinyColor.prototype.analogous = function (results, slices) { if (results === void 0) { results = 6; } if (slices === void 0) { slices = 30; } var hsl = this.toHsl(); var part = 360 / slices; var ret = [this]; for (hsl.h = (hsl.h - ((part * results) >> 1) + 720) % 360; --results;) { hsl.h = (hsl.h + part) % 360; ret.push(new TinyColor(hsl)); } return ret; }; /** * taken from https://github.com/infusion/jQuery-xcolor/blob/master/jquery.xcolor.js */ TinyColor.prototype.complement = function () { var hsl = this.toHsl(); hsl.h = (hsl.h + 180) % 360; return new TinyColor(hsl); }; TinyColor.prototype.monochromatic = function (results) { if (results === void 0) { results = 6; } var hsv = this.toHsv(); var h = hsv.h; var s = hsv.s; var v = hsv.v; var res = []; var modification = 1 / results; while (results--) { res.push(new TinyColor({ h: h, s: s, v: v })); v = (v + modification) % 1; } return res; }; TinyColor.prototype.splitcomplement = function () { var hsl = this.toHsl(); var h = hsl.h; return [ this, new TinyColor({ h: (h + 72) % 360, s: hsl.s, l: hsl.l }), new TinyColor({ h: (h + 216) % 360, s: hsl.s, l: hsl.l }), ]; }; /** * Compute how the color would appear on a background */ TinyColor.prototype.onBackground = function (background) { var fg = this.toRgb(); var bg = new TinyColor(background).toRgb(); var alpha = fg.a + bg.a * (1 - fg.a); return new TinyColor({ r: (fg.r * fg.a + bg.r * bg.a * (1 - fg.a)) / alpha, g: (fg.g * fg.a + bg.g * bg.a * (1 - fg.a)) / alpha, b: (fg.b * fg.a + bg.b * bg.a * (1 - fg.a)) / alpha, a: alpha, }); }; /** * Alias for `polyad(3)` */ TinyColor.prototype.triad = function () { return this.polyad(3); }; /** * Alias for `polyad(4)` */ TinyColor.prototype.tetrad = function () { return this.polyad(4); }; /** * Get polyad colors, like (for 1, 2, 3, 4, 5, 6, 7, 8, etc...) * monad, dyad, triad, tetrad, pentad, hexad, heptad, octad, etc... */ TinyColor.prototype.polyad = function (n) { var hsl = this.toHsl(); var h = hsl.h; var result = [this]; var increment = 360 / n; for (var i = 1; i < n; i++) { result.push(new TinyColor({ h: (h + i * increment) % 360, s: hsl.s, l: hsl.l })); } return result; }; /** * compare color vs current color */ TinyColor.prototype.equals = function (color) { return this.toRgbString() === new TinyColor(color).toRgbString(); }; return TinyColor; }()); exports.TinyColor = TinyColor; // kept for backwards compatability with v1 function tinycolor(color, opts) { if (color === void 0) { color = ''; } if (opts === void 0) { opts = {}; } return new TinyColor(color, opts); } exports.tinycolor = tinycolor;