@babylonjs/gui-editor
Version:
Gui Editor es6
1,317 lines (1,267 loc) • 61.2 MB
JavaScript
(function webpackUniversalModuleDefinition(root, factory) {
if(typeof exports === 'object' && typeof module === 'object')
module.exports = factory(require("@babylonjs/core"), require("@babylonjs/gui"));
else if(typeof define === 'function' && define.amd)
define("@babylonjs/gui-editor", ["@babylonjs/core", "@babylonjs/gui"], factory);
else if(typeof exports === 'object')
exports["@babylonjs/gui-editor"] = factory(require("@babylonjs/core"), require("@babylonjs/gui"));
else
root["GUIEDITOR"] = factory(root["BABYLON"], root["BABYLON"]["GUI"]);
})((typeof self !== "undefined" ? self : typeof global !== "undefined" ? global : this), (__WEBPACK_EXTERNAL_MODULE_core_Misc_observable__, __WEBPACK_EXTERNAL_MODULE_gui_2D_controls_container__) => {
return /******/ (() => { // webpackBootstrap
/******/ var __webpack_modules__ = ({
/***/ "../../../../node_modules/@babel/runtime/helpers/esm/assertThisInitialized.js":
/*!************************************************************************************!*\
!*** ../../../../node_modules/@babel/runtime/helpers/esm/assertThisInitialized.js ***!
\************************************************************************************/
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ _assertThisInitialized)
/* harmony export */ });
function _assertThisInitialized(e) {
if (void 0 === e) throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
return e;
}
/***/ }),
/***/ "../../../../node_modules/@babel/runtime/helpers/esm/extends.js":
/*!**********************************************************************!*\
!*** ../../../../node_modules/@babel/runtime/helpers/esm/extends.js ***!
\**********************************************************************/
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ _extends)
/* harmony export */ });
function _extends() {
return _extends = Object.assign ? Object.assign.bind() : function (n) {
for (var e = 1; e < arguments.length; e++) {
var t = arguments[e];
for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
}
return n;
}, _extends.apply(null, arguments);
}
/***/ }),
/***/ "../../../../node_modules/@babel/runtime/helpers/esm/inheritsLoose.js":
/*!****************************************************************************!*\
!*** ../../../../node_modules/@babel/runtime/helpers/esm/inheritsLoose.js ***!
\****************************************************************************/
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ _inheritsLoose)
/* harmony export */ });
/* harmony import */ var _setPrototypeOf_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./setPrototypeOf.js */ "../../../../node_modules/@babel/runtime/helpers/esm/setPrototypeOf.js");
function _inheritsLoose(t, o) {
t.prototype = Object.create(o.prototype), t.prototype.constructor = t, (0,_setPrototypeOf_js__WEBPACK_IMPORTED_MODULE_0__["default"])(t, o);
}
/***/ }),
/***/ "../../../../node_modules/@babel/runtime/helpers/esm/objectWithoutPropertiesLoose.js":
/*!*******************************************************************************************!*\
!*** ../../../../node_modules/@babel/runtime/helpers/esm/objectWithoutPropertiesLoose.js ***!
\*******************************************************************************************/
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ _objectWithoutPropertiesLoose)
/* harmony export */ });
function _objectWithoutPropertiesLoose(r, e) {
if (null == r) return {};
var t = {};
for (var n in r) if ({}.hasOwnProperty.call(r, n)) {
if (-1 !== e.indexOf(n)) continue;
t[n] = r[n];
}
return t;
}
/***/ }),
/***/ "../../../../node_modules/@babel/runtime/helpers/esm/setPrototypeOf.js":
/*!*****************************************************************************!*\
!*** ../../../../node_modules/@babel/runtime/helpers/esm/setPrototypeOf.js ***!
\*****************************************************************************/
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ _setPrototypeOf)
/* harmony export */ });
function _setPrototypeOf(t, e) {
return _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function (t, e) {
return t.__proto__ = e, t;
}, _setPrototypeOf(t, e);
}
/***/ }),
/***/ "../../../../node_modules/@ctrl/tinycolor/dist/module/conversion.js":
/*!**************************************************************************!*\
!*** ../../../../node_modules/@ctrl/tinycolor/dist/module/conversion.js ***!
\**************************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ convertDecimalToHex: () => (/* binding */ convertDecimalToHex),
/* harmony export */ convertHexToDecimal: () => (/* binding */ convertHexToDecimal),
/* harmony export */ hslToRgb: () => (/* binding */ hslToRgb),
/* harmony export */ hsvToRgb: () => (/* binding */ hsvToRgb),
/* harmony export */ numberInputToObject: () => (/* binding */ numberInputToObject),
/* harmony export */ parseIntFromHex: () => (/* binding */ parseIntFromHex),
/* harmony export */ rgbToHex: () => (/* binding */ rgbToHex),
/* harmony export */ rgbToHsl: () => (/* binding */ rgbToHsl),
/* harmony export */ rgbToHsv: () => (/* binding */ rgbToHsv),
/* harmony export */ rgbToRgb: () => (/* binding */ rgbToRgb),
/* harmony export */ rgbaToArgbHex: () => (/* binding */ rgbaToArgbHex),
/* harmony export */ rgbaToHex: () => (/* binding */ rgbaToHex)
/* harmony export */ });
/* harmony import */ var _util_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./util.js */ "../../../../node_modules/@ctrl/tinycolor/dist/module/util.js");
// `rgbToHsl`, `rgbToHsv`, `hslToRgb`, `hsvToRgb` modified from:
// <http://mjijackson.com/2008/02/rgb-to-hsl-and-rgb-to-hsv-color-model-conversion-algorithms-in-javascript>
/**
* Handle bounds / percentage checking to conform to CSS color spec
* <http://www.w3.org/TR/css3-color/>
* *Assumes:* r, g, b in [0, 255] or [0, 1]
* *Returns:* { r, g, b } in [0, 255]
*/
function rgbToRgb(r, g, b) {
return {
r: (0,_util_js__WEBPACK_IMPORTED_MODULE_0__.bound01)(r, 255) * 255,
g: (0,_util_js__WEBPACK_IMPORTED_MODULE_0__.bound01)(g, 255) * 255,
b: (0,_util_js__WEBPACK_IMPORTED_MODULE_0__.bound01)(b, 255) * 255,
};
}
/**
* Converts an RGB color value to HSL.
* *Assumes:* r, g, and b are contained in [0, 255] or [0, 1]
* *Returns:* { h, s, l } in [0,1]
*/
function rgbToHsl(r, g, b) {
r = (0,_util_js__WEBPACK_IMPORTED_MODULE_0__.bound01)(r, 255);
g = (0,_util_js__WEBPACK_IMPORTED_MODULE_0__.bound01)(g, 255);
b = (0,_util_js__WEBPACK_IMPORTED_MODULE_0__.bound01)(b, 255);
var max = Math.max(r, g, b);
var min = Math.min(r, g, b);
var h = 0;
var s = 0;
var l = (max + min) / 2;
if (max === min) {
s = 0;
h = 0; // achromatic
}
else {
var d = max - min;
s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
switch (max) {
case r:
h = (g - b) / d + (g < b ? 6 : 0);
break;
case g:
h = (b - r) / d + 2;
break;
case b:
h = (r - g) / d + 4;
break;
default:
break;
}
h /= 6;
}
return { h: h, s: s, l: l };
}
function hue2rgb(p, q, t) {
if (t < 0) {
t += 1;
}
if (t > 1) {
t -= 1;
}
if (t < 1 / 6) {
return p + (q - p) * (6 * t);
}
if (t < 1 / 2) {
return q;
}
if (t < 2 / 3) {
return p + (q - p) * (2 / 3 - t) * 6;
}
return p;
}
/**
* Converts an HSL color value to RGB.
*
* *Assumes:* h is contained in [0, 1] or [0, 360] and s and l are contained [0, 1] or [0, 100]
* *Returns:* { r, g, b } in the set [0, 255]
*/
function hslToRgb(h, s, l) {
var r;
var g;
var b;
h = (0,_util_js__WEBPACK_IMPORTED_MODULE_0__.bound01)(h, 360);
s = (0,_util_js__WEBPACK_IMPORTED_MODULE_0__.bound01)(s, 100);
l = (0,_util_js__WEBPACK_IMPORTED_MODULE_0__.bound01)(l, 100);
if (s === 0) {
// achromatic
g = l;
b = l;
r = l;
}
else {
var q = l < 0.5 ? l * (1 + s) : l + s - l * s;
var p = 2 * l - q;
r = hue2rgb(p, q, h + 1 / 3);
g = hue2rgb(p, q, h);
b = hue2rgb(p, q, h - 1 / 3);
}
return { r: r * 255, g: g * 255, b: b * 255 };
}
/**
* Converts an RGB color value to HSV
*
* *Assumes:* r, g, and b are contained in the set [0, 255] or [0, 1]
* *Returns:* { h, s, v } in [0,1]
*/
function rgbToHsv(r, g, b) {
r = (0,_util_js__WEBPACK_IMPORTED_MODULE_0__.bound01)(r, 255);
g = (0,_util_js__WEBPACK_IMPORTED_MODULE_0__.bound01)(g, 255);
b = (0,_util_js__WEBPACK_IMPORTED_MODULE_0__.bound01)(b, 255);
var max = Math.max(r, g, b);
var min = Math.min(r, g, b);
var h = 0;
var v = max;
var d = max - min;
var s = max === 0 ? 0 : d / max;
if (max === min) {
h = 0; // achromatic
}
else {
switch (max) {
case r:
h = (g - b) / d + (g < b ? 6 : 0);
break;
case g:
h = (b - r) / d + 2;
break;
case b:
h = (r - g) / d + 4;
break;
default:
break;
}
h /= 6;
}
return { h: h, s: s, v: v };
}
/**
* Converts an HSV color value to RGB.
*
* *Assumes:* h is contained in [0, 1] or [0, 360] and s and v are contained in [0, 1] or [0, 100]
* *Returns:* { r, g, b } in the set [0, 255]
*/
function hsvToRgb(h, s, v) {
h = (0,_util_js__WEBPACK_IMPORTED_MODULE_0__.bound01)(h, 360) * 6;
s = (0,_util_js__WEBPACK_IMPORTED_MODULE_0__.bound01)(s, 100);
v = (0,_util_js__WEBPACK_IMPORTED_MODULE_0__.bound01)(v, 100);
var i = Math.floor(h);
var f = h - i;
var p = v * (1 - s);
var q = v * (1 - f * s);
var t = v * (1 - (1 - f) * s);
var mod = i % 6;
var r = [v, q, p, p, t, v][mod];
var g = [t, v, v, q, p, p][mod];
var b = [p, p, t, v, v, q][mod];
return { r: r * 255, g: g * 255, b: b * 255 };
}
/**
* Converts an RGB color to hex
*
* Assumes r, g, and b are contained in the set [0, 255]
* Returns a 3 or 6 character hex
*/
function rgbToHex(r, g, b, allow3Char) {
var hex = [
(0,_util_js__WEBPACK_IMPORTED_MODULE_0__.pad2)(Math.round(r).toString(16)),
(0,_util_js__WEBPACK_IMPORTED_MODULE_0__.pad2)(Math.round(g).toString(16)),
(0,_util_js__WEBPACK_IMPORTED_MODULE_0__.pad2)(Math.round(b).toString(16)),
];
// Return a 3 character hex if possible
if (allow3Char &&
hex[0].startsWith(hex[0].charAt(1)) &&
hex[1].startsWith(hex[1].charAt(1)) &&
hex[2].startsWith(hex[2].charAt(1))) {
return hex[0].charAt(0) + hex[1].charAt(0) + hex[2].charAt(0);
}
return hex.join('');
}
/**
* Converts an RGBA color plus alpha transparency to hex
*
* Assumes r, g, b are contained in the set [0, 255] and
* a in [0, 1]. Returns a 4 or 8 character rgba hex
*/
// eslint-disable-next-line max-params
function rgbaToHex(r, g, b, a, allow4Char) {
var hex = [
(0,_util_js__WEBPACK_IMPORTED_MODULE_0__.pad2)(Math.round(r).toString(16)),
(0,_util_js__WEBPACK_IMPORTED_MODULE_0__.pad2)(Math.round(g).toString(16)),
(0,_util_js__WEBPACK_IMPORTED_MODULE_0__.pad2)(Math.round(b).toString(16)),
(0,_util_js__WEBPACK_IMPORTED_MODULE_0__.pad2)(convertDecimalToHex(a)),
];
// Return a 4 character hex if possible
if (allow4Char &&
hex[0].startsWith(hex[0].charAt(1)) &&
hex[1].startsWith(hex[1].charAt(1)) &&
hex[2].startsWith(hex[2].charAt(1)) &&
hex[3].startsWith(hex[3].charAt(1))) {
return hex[0].charAt(0) + hex[1].charAt(0) + hex[2].charAt(0) + hex[3].charAt(0);
}
return hex.join('');
}
/**
* Converts an RGBA color to an ARGB Hex8 string
* Rarely used, but required for "toFilter()"
*/
function rgbaToArgbHex(r, g, b, a) {
var hex = [
(0,_util_js__WEBPACK_IMPORTED_MODULE_0__.pad2)(convertDecimalToHex(a)),
(0,_util_js__WEBPACK_IMPORTED_MODULE_0__.pad2)(Math.round(r).toString(16)),
(0,_util_js__WEBPACK_IMPORTED_MODULE_0__.pad2)(Math.round(g).toString(16)),
(0,_util_js__WEBPACK_IMPORTED_MODULE_0__.pad2)(Math.round(b).toString(16)),
];
return hex.join('');
}
/** Converts a decimal to a hex value */
function convertDecimalToHex(d) {
return Math.round(parseFloat(d) * 255).toString(16);
}
/** Converts a hex value to a decimal */
function convertHexToDecimal(h) {
return parseIntFromHex(h) / 255;
}
/** Parse a base-16 hex value into a base-10 integer */
function parseIntFromHex(val) {
return parseInt(val, 16);
}
function numberInputToObject(color) {
return {
r: color >> 16,
g: (color & 0xff00) >> 8,
b: color & 0xff,
};
}
/***/ }),
/***/ "../../../../node_modules/@ctrl/tinycolor/dist/module/css-color-names.js":
/*!*******************************************************************************!*\
!*** ../../../../node_modules/@ctrl/tinycolor/dist/module/css-color-names.js ***!
\*******************************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ names: () => (/* binding */ names)
/* harmony export */ });
// https://github.com/bahamas10/css-color-names/blob/master/css-color-names.json
/**
* @hidden
*/
var names = {
aliceblue: '#f0f8ff',
antiquewhite: '#faebd7',
aqua: '#00ffff',
aquamarine: '#7fffd4',
azure: '#f0ffff',
beige: '#f5f5dc',
bisque: '#ffe4c4',
black: '#000000',
blanchedalmond: '#ffebcd',
blue: '#0000ff',
blueviolet: '#8a2be2',
brown: '#a52a2a',
burlywood: '#deb887',
cadetblue: '#5f9ea0',
chartreuse: '#7fff00',
chocolate: '#d2691e',
coral: '#ff7f50',
cornflowerblue: '#6495ed',
cornsilk: '#fff8dc',
crimson: '#dc143c',
cyan: '#00ffff',
darkblue: '#00008b',
darkcyan: '#008b8b',
darkgoldenrod: '#b8860b',
darkgray: '#a9a9a9',
darkgreen: '#006400',
darkgrey: '#a9a9a9',
darkkhaki: '#bdb76b',
darkmagenta: '#8b008b',
darkolivegreen: '#556b2f',
darkorange: '#ff8c00',
darkorchid: '#9932cc',
darkred: '#8b0000',
darksalmon: '#e9967a',
darkseagreen: '#8fbc8f',
darkslateblue: '#483d8b',
darkslategray: '#2f4f4f',
darkslategrey: '#2f4f4f',
darkturquoise: '#00ced1',
darkviolet: '#9400d3',
deeppink: '#ff1493',
deepskyblue: '#00bfff',
dimgray: '#696969',
dimgrey: '#696969',
dodgerblue: '#1e90ff',
firebrick: '#b22222',
floralwhite: '#fffaf0',
forestgreen: '#228b22',
fuchsia: '#ff00ff',
gainsboro: '#dcdcdc',
ghostwhite: '#f8f8ff',
goldenrod: '#daa520',
gold: '#ffd700',
gray: '#808080',
green: '#008000',
greenyellow: '#adff2f',
grey: '#808080',
honeydew: '#f0fff0',
hotpink: '#ff69b4',
indianred: '#cd5c5c',
indigo: '#4b0082',
ivory: '#fffff0',
khaki: '#f0e68c',
lavenderblush: '#fff0f5',
lavender: '#e6e6fa',
lawngreen: '#7cfc00',
lemonchiffon: '#fffacd',
lightblue: '#add8e6',
lightcoral: '#f08080',
lightcyan: '#e0ffff',
lightgoldenrodyellow: '#fafad2',
lightgray: '#d3d3d3',
lightgreen: '#90ee90',
lightgrey: '#d3d3d3',
lightpink: '#ffb6c1',
lightsalmon: '#ffa07a',
lightseagreen: '#20b2aa',
lightskyblue: '#87cefa',
lightslategray: '#778899',
lightslategrey: '#778899',
lightsteelblue: '#b0c4de',
lightyellow: '#ffffe0',
lime: '#00ff00',
limegreen: '#32cd32',
linen: '#faf0e6',
magenta: '#ff00ff',
maroon: '#800000',
mediumaquamarine: '#66cdaa',
mediumblue: '#0000cd',
mediumorchid: '#ba55d3',
mediumpurple: '#9370db',
mediumseagreen: '#3cb371',
mediumslateblue: '#7b68ee',
mediumspringgreen: '#00fa9a',
mediumturquoise: '#48d1cc',
mediumvioletred: '#c71585',
midnightblue: '#191970',
mintcream: '#f5fffa',
mistyrose: '#ffe4e1',
moccasin: '#ffe4b5',
navajowhite: '#ffdead',
navy: '#000080',
oldlace: '#fdf5e6',
olive: '#808000',
olivedrab: '#6b8e23',
orange: '#ffa500',
orangered: '#ff4500',
orchid: '#da70d6',
palegoldenrod: '#eee8aa',
palegreen: '#98fb98',
paleturquoise: '#afeeee',
palevioletred: '#db7093',
papayawhip: '#ffefd5',
peachpuff: '#ffdab9',
peru: '#cd853f',
pink: '#ffc0cb',
plum: '#dda0dd',
powderblue: '#b0e0e6',
purple: '#800080',
rebeccapurple: '#663399',
red: '#ff0000',
rosybrown: '#bc8f8f',
royalblue: '#4169e1',
saddlebrown: '#8b4513',
salmon: '#fa8072',
sandybrown: '#f4a460',
seagreen: '#2e8b57',
seashell: '#fff5ee',
sienna: '#a0522d',
silver: '#c0c0c0',
skyblue: '#87ceeb',
slateblue: '#6a5acd',
slategray: '#708090',
slategrey: '#708090',
snow: '#fffafa',
springgreen: '#00ff7f',
steelblue: '#4682b4',
tan: '#d2b48c',
teal: '#008080',
thistle: '#d8bfd8',
tomato: '#ff6347',
turquoise: '#40e0d0',
violet: '#ee82ee',
wheat: '#f5deb3',
white: '#ffffff',
whitesmoke: '#f5f5f5',
yellow: '#ffff00',
yellowgreen: '#9acd32',
};
/***/ }),
/***/ "../../../../node_modules/@ctrl/tinycolor/dist/module/format-input.js":
/*!****************************************************************************!*\
!*** ../../../../node_modules/@ctrl/tinycolor/dist/module/format-input.js ***!
\****************************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ inputToRGB: () => (/* binding */ inputToRGB),
/* harmony export */ isValidCSSUnit: () => (/* binding */ isValidCSSUnit),
/* harmony export */ stringInputToObject: () => (/* binding */ stringInputToObject)
/* harmony export */ });
/* harmony import */ var _conversion_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./conversion.js */ "../../../../node_modules/@ctrl/tinycolor/dist/module/conversion.js");
/* harmony import */ var _css_color_names_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./css-color-names.js */ "../../../../node_modules/@ctrl/tinycolor/dist/module/css-color-names.js");
/* harmony import */ var _util_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./util.js */ "../../../../node_modules/@ctrl/tinycolor/dist/module/util.js");
/* eslint-disable @typescript-eslint/no-redundant-type-constituents */
/**
* Given a string or object, convert that input to RGB
*
* Possible string inputs:
* ```
* "red"
* "#f00" or "f00"
* "#ff0000" or "ff0000"
* "#ff000000" or "ff000000"
* "rgb 255 0 0" or "rgb (255, 0, 0)"
* "rgb 1.0 0 0" or "rgb (1, 0, 0)"
* "rgba (255, 0, 0, 1)" or "rgba 255, 0, 0, 1"
* "rgba (1.0, 0, 0, 1)" or "rgba 1.0, 0, 0, 1"
* "hsl(0, 100%, 50%)" or "hsl 0 100% 50%"
* "hsla(0, 100%, 50%, 1)" or "hsla 0 100% 50%, 1"
* "hsv(0, 100%, 100%)" or "hsv 0 100% 100%"
* ```
*/
function inputToRGB(color) {
var rgb = { r: 0, g: 0, b: 0 };
var a = 1;
var s = null;
var v = null;
var l = null;
var ok = false;
var format = false;
if (typeof color === 'string') {
color = stringInputToObject(color);
}
if (typeof color === 'object') {
if (isValidCSSUnit(color.r) && isValidCSSUnit(color.g) && isValidCSSUnit(color.b)) {
rgb = (0,_conversion_js__WEBPACK_IMPORTED_MODULE_0__.rgbToRgb)(color.r, color.g, color.b);
ok = true;
format = String(color.r).substr(-1) === '%' ? 'prgb' : 'rgb';
}
else if (isValidCSSUnit(color.h) && isValidCSSUnit(color.s) && isValidCSSUnit(color.v)) {
s = (0,_util_js__WEBPACK_IMPORTED_MODULE_2__.convertToPercentage)(color.s);
v = (0,_util_js__WEBPACK_IMPORTED_MODULE_2__.convertToPercentage)(color.v);
rgb = (0,_conversion_js__WEBPACK_IMPORTED_MODULE_0__.hsvToRgb)(color.h, s, v);
ok = true;
format = 'hsv';
}
else if (isValidCSSUnit(color.h) && isValidCSSUnit(color.s) && isValidCSSUnit(color.l)) {
s = (0,_util_js__WEBPACK_IMPORTED_MODULE_2__.convertToPercentage)(color.s);
l = (0,_util_js__WEBPACK_IMPORTED_MODULE_2__.convertToPercentage)(color.l);
rgb = (0,_conversion_js__WEBPACK_IMPORTED_MODULE_0__.hslToRgb)(color.h, s, l);
ok = true;
format = 'hsl';
}
if (Object.prototype.hasOwnProperty.call(color, 'a')) {
a = color.a;
}
}
a = (0,_util_js__WEBPACK_IMPORTED_MODULE_2__.boundAlpha)(a);
return {
ok: ok,
format: color.format || format,
r: Math.min(255, Math.max(rgb.r, 0)),
g: Math.min(255, Math.max(rgb.g, 0)),
b: Math.min(255, Math.max(rgb.b, 0)),
a: a,
};
}
// <http://www.w3.org/TR/css3-values/#integers>
var CSS_INTEGER = '[-\\+]?\\d+%?';
// <http://www.w3.org/TR/css3-values/#number-value>
var CSS_NUMBER = '[-\\+]?\\d*\\.\\d+%?';
// Allow positive/negative integer/number. Don't capture the either/or, just the entire outcome.
var CSS_UNIT = "(?:".concat(CSS_NUMBER, ")|(?:").concat(CSS_INTEGER, ")");
// Actual matching.
// Parentheses and commas are optional, but not required.
// Whitespace can take the place of commas or opening paren
var PERMISSIVE_MATCH3 = "[\\s|\\(]+(".concat(CSS_UNIT, ")[,|\\s]+(").concat(CSS_UNIT, ")[,|\\s]+(").concat(CSS_UNIT, ")\\s*\\)?");
var PERMISSIVE_MATCH4 = "[\\s|\\(]+(".concat(CSS_UNIT, ")[,|\\s]+(").concat(CSS_UNIT, ")[,|\\s]+(").concat(CSS_UNIT, ")[,|\\s]+(").concat(CSS_UNIT, ")\\s*\\)?");
var matchers = {
CSS_UNIT: new RegExp(CSS_UNIT),
rgb: new RegExp('rgb' + PERMISSIVE_MATCH3),
rgba: new RegExp('rgba' + PERMISSIVE_MATCH4),
hsl: new RegExp('hsl' + PERMISSIVE_MATCH3),
hsla: new RegExp('hsla' + PERMISSIVE_MATCH4),
hsv: new RegExp('hsv' + PERMISSIVE_MATCH3),
hsva: new RegExp('hsva' + PERMISSIVE_MATCH4),
hex3: /^#?([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/,
hex6: /^#?([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/,
hex4: /^#?([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/,
hex8: /^#?([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/,
};
/**
* Permissive string parsing. Take in a number of formats, and output an object
* based on detected format. Returns `{ r, g, b }` or `{ h, s, l }` or `{ h, s, v}`
*/
function stringInputToObject(color) {
color = color.trim().toLowerCase();
if (color.length === 0) {
return false;
}
var named = false;
if (_css_color_names_js__WEBPACK_IMPORTED_MODULE_1__.names[color]) {
color = _css_color_names_js__WEBPACK_IMPORTED_MODULE_1__.names[color];
named = true;
}
else if (color === 'transparent') {
return { r: 0, g: 0, b: 0, a: 0, format: 'name' };
}
// Try to match string input using regular expressions.
// Keep most of the number bounding out of this function - don't worry about [0,1] or [0,100] or [0,360]
// Just return an object and let the conversion functions handle that.
// This way the result will be the same whether the tinycolor is initialized with string or object.
var match = matchers.rgb.exec(color);
if (match) {
return { r: match[1], g: match[2], b: match[3] };
}
match = matchers.rgba.exec(color);
if (match) {
return { r: match[1], g: match[2], b: match[3], a: match[4] };
}
match = matchers.hsl.exec(color);
if (match) {
return { h: match[1], s: match[2], l: match[3] };
}
match = matchers.hsla.exec(color);
if (match) {
return { h: match[1], s: match[2], l: match[3], a: match[4] };
}
match = matchers.hsv.exec(color);
if (match) {
return { h: match[1], s: match[2], v: match[3] };
}
match = matchers.hsva.exec(color);
if (match) {
return { h: match[1], s: match[2], v: match[3], a: match[4] };
}
match = matchers.hex8.exec(color);
if (match) {
return {
r: (0,_conversion_js__WEBPACK_IMPORTED_MODULE_0__.parseIntFromHex)(match[1]),
g: (0,_conversion_js__WEBPACK_IMPORTED_MODULE_0__.parseIntFromHex)(match[2]),
b: (0,_conversion_js__WEBPACK_IMPORTED_MODULE_0__.parseIntFromHex)(match[3]),
a: (0,_conversion_js__WEBPACK_IMPORTED_MODULE_0__.convertHexToDecimal)(match[4]),
format: named ? 'name' : 'hex8',
};
}
match = matchers.hex6.exec(color);
if (match) {
return {
r: (0,_conversion_js__WEBPACK_IMPORTED_MODULE_0__.parseIntFromHex)(match[1]),
g: (0,_conversion_js__WEBPACK_IMPORTED_MODULE_0__.parseIntFromHex)(match[2]),
b: (0,_conversion_js__WEBPACK_IMPORTED_MODULE_0__.parseIntFromHex)(match[3]),
format: named ? 'name' : 'hex',
};
}
match = matchers.hex4.exec(color);
if (match) {
return {
r: (0,_conversion_js__WEBPACK_IMPORTED_MODULE_0__.parseIntFromHex)(match[1] + match[1]),
g: (0,_conversion_js__WEBPACK_IMPORTED_MODULE_0__.parseIntFromHex)(match[2] + match[2]),
b: (0,_conversion_js__WEBPACK_IMPORTED_MODULE_0__.parseIntFromHex)(match[3] + match[3]),
a: (0,_conversion_js__WEBPACK_IMPORTED_MODULE_0__.convertHexToDecimal)(match[4] + match[4]),
format: named ? 'name' : 'hex8',
};
}
match = matchers.hex3.exec(color);
if (match) {
return {
r: (0,_conversion_js__WEBPACK_IMPORTED_MODULE_0__.parseIntFromHex)(match[1] + match[1]),
g: (0,_conversion_js__WEBPACK_IMPORTED_MODULE_0__.parseIntFromHex)(match[2] + match[2]),
b: (0,_conversion_js__WEBPACK_IMPORTED_MODULE_0__.parseIntFromHex)(match[3] + match[3]),
format: named ? 'name' : 'hex',
};
}
return false;
}
/**
* Check to see if it looks like a CSS unit
* (see `matchers` above for definition).
*/
function isValidCSSUnit(color) {
return Boolean(matchers.CSS_UNIT.exec(String(color)));
}
/***/ }),
/***/ "../../../../node_modules/@ctrl/tinycolor/dist/module/from-ratio.js":
/*!**************************************************************************!*\
!*** ../../../../node_modules/@ctrl/tinycolor/dist/module/from-ratio.js ***!
\**************************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ fromRatio: () => (/* binding */ fromRatio),
/* harmony export */ legacyRandom: () => (/* binding */ legacyRandom)
/* harmony export */ });
/* harmony import */ var _index_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./index.js */ "../../../../node_modules/@ctrl/tinycolor/dist/module/index.js");
/* harmony import */ var _util_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./util.js */ "../../../../node_modules/@ctrl/tinycolor/dist/module/util.js");
/**
* If input is an object, force 1 into "1.0" to handle ratios properly
* String input requires "1.0" as input, so 1 will be treated as 1
*/
function fromRatio(ratio, opts) {
var newColor = {
r: (0,_util_js__WEBPACK_IMPORTED_MODULE_1__.convertToPercentage)(ratio.r),
g: (0,_util_js__WEBPACK_IMPORTED_MODULE_1__.convertToPercentage)(ratio.g),
b: (0,_util_js__WEBPACK_IMPORTED_MODULE_1__.convertToPercentage)(ratio.b),
};
if (ratio.a !== undefined) {
newColor.a = Number(ratio.a);
}
return new _index_js__WEBPACK_IMPORTED_MODULE_0__.TinyColor(newColor, opts);
}
/** old random function */
function legacyRandom() {
return new _index_js__WEBPACK_IMPORTED_MODULE_0__.TinyColor({
r: Math.random(),
g: Math.random(),
b: Math.random(),
});
}
/***/ }),
/***/ "../../../../node_modules/@ctrl/tinycolor/dist/module/index.js":
/*!*********************************************************************!*\
!*** ../../../../node_modules/@ctrl/tinycolor/dist/module/index.js ***!
\*********************************************************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ TinyColor: () => (/* binding */ TinyColor),
/* harmony export */ tinycolor: () => (/* binding */ tinycolor)
/* harmony export */ });
/* harmony import */ var _conversion_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./conversion.js */ "../../../../node_modules/@ctrl/tinycolor/dist/module/conversion.js");
/* harmony import */ var _css_color_names_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./css-color-names.js */ "../../../../node_modules/@ctrl/tinycolor/dist/module/css-color-names.js");
/* harmony import */ var _format_input__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./format-input */ "../../../../node_modules/@ctrl/tinycolor/dist/module/format-input.js");
/* harmony import */ var _util_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./util.js */ "../../../../node_modules/@ctrl/tinycolor/dist/module/util.js");
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_js__WEBPACK_IMPORTED_MODULE_0__.numberInputToObject)(color);
}
this.originalInput = color;
var rgb = (0,_format_input__WEBPACK_IMPORTED_MODULE_2__.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_js__WEBPACK_IMPORTED_MODULE_3__.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_js__WEBPACK_IMPORTED_MODULE_0__.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_js__WEBPACK_IMPORTED_MODULE_0__.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_js__WEBPACK_IMPORTED_MODULE_0__.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_js__WEBPACK_IMPORTED_MODULE_0__.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_js__WEBPACK_IMPORTED_MODULE_0__.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_js__WEBPACK_IMPORTED_MODULE_0__.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_js__WEBPACK_IMPORTED_MODULE_3__.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_js__WEBPACK_IMPORTED_MODULE_3__.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_js__WEBPACK_IMPORTED_MODULE_0__.rgbToHex)(this.r, this.g, this.b, false);
for (var _i = 0, _a = Object.entries(_css_color_names_js__WEBPACK_IMPORTED_MODULE_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_js__WEBPACK_IMPORTED_MODULE_3__.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_js__WEBPACK_IMPORTED_MODULE_3__.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_js__WEBPACK_IMPORTED_MODULE_3__.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_js__WEBPACK_IMPORTED_MODULE_3__.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;
}());
// kept for backwards compatability with v1
funct