colorizr - npm Package Compare versions

Comparing version 1.1.1 to 2.0.0-0

lib/index.js

 "use strict";
-
-exports.__esModule = true;
-exports.default = void 0;
-
-var _utils = require("./utils");
-
-exports.validateHex = _utils.validateHex;
-
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
-
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
-
-function _iterableToArrayLimit(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
-
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { keys.push.apply(keys, Object.getOwnPropertySymbols(object)); } if (enumerableOnly) keys = keys.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(source, true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(source).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
-
-function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
-
-function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
-
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
-var RGB = ['r', 'g', 'b'];
-var HSL = ['h', 's', 'l'];
-
-/**
- * Colorizr
- * @class Colorizr
- */
-var Colorizr =
-/*#__PURE__*/
-function () {
-  /**
-   * @constructs Colorizr
-   * @param {string|Array|Object} color
-   */
-  function Colorizr(color) {
-    _classCallCheck(this, Colorizr);
-
-    _defineProperty(this, "hex", '');
-
-    _defineProperty(this, "hsl", {
-      h: 0,
-      s: 0,
-      l: 0
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.wcagAnalysis = exports.textColor = exports.shift = exports.rotate = exports.rgb2hsl = exports.rgb2hex = exports.random = exports.parseHex = exports.parseCSS = exports.palette = exports.isValidHex = exports.hue2rgb = exports.hsl2rgb = exports.hsl2hex = exports.hex2rgb = exports.hex2hsl = exports.harmony = exports.luminance = exports.contrast = exports.colorDifference = exports.brightnessDifference = void 0;
+var utils_1 = require("./utils");
+var brightness_difference_1 = require("./brightness-difference");
+exports.brightnessDifference = brightness_difference_1.default;
+var color_difference_1 = require("./color-difference");
+exports.colorDifference = color_difference_1.default;
+var contrast_1 = require("./contrast");
+exports.contrast = contrast_1.default;
+var harmony_1 = require("./harmony");
+exports.harmony = harmony_1.default;
+var hex2hsl_1 = require("./hex2hsl");
+exports.hex2hsl = hex2hsl_1.default;
+var hex2rgb_1 = require("./hex2rgb");
+exports.hex2rgb = hex2rgb_1.default;
+var hsl2hex_1 = require("./hsl2hex");
+exports.hsl2hex = hsl2hex_1.default;
+var hsl2rgb_1 = require("./hsl2rgb");
+exports.hsl2rgb = hsl2rgb_1.default;
+var hue2rgb_1 = require("./hue2rgb");
+exports.hue2rgb = hue2rgb_1.default;
+var valid_hex_1 = require("./valid-hex");
+exports.isValidHex = valid_hex_1.default;
+var luminance_1 = require("./luminance");
+exports.luminance = luminance_1.default;
+var palette_1 = require("./palette");
+exports.palette = palette_1.default;
+var parse_color_1 = require("./parse-color");
+var parse_css_1 = require("./parse-css");
+exports.parseCSS = parse_css_1.default;
+var parse_hex_1 = require("./parse-hex");
+exports.parseHex = parse_hex_1.default;
+var random_1 = require("./random");
+exports.random = random_1.default;
+var rgb2hex_1 = require("./rgb2hex");
+exports.rgb2hex = rgb2hex_1.default;
+var rgb2hsl_1 = require("./rgb2hsl");
+exports.rgb2hsl = rgb2hsl_1.default;
+var rotate_1 = require("./rotate");
+exports.rotate = rotate_1.default;
+var shift_1 = require("./shift");
+exports.shift = shift_1.default;
+var text_color_1 = require("./text-color");
+exports.textColor = text_color_1.default;
+var wcag_1 = require("./wcag");
+exports.wcagAnalysis = wcag_1.default;
+var Colorizr = /** @class */ (function () {
+    function Colorizr(color, options) {
+        if (options === void 0) { options = {}; }
+        utils_1.invariant(!color, 'color is required');
+        var _a = options.model, model = _a === void 0 ? 'hsl' : _a;
+        var _b = parse_color_1.default(color), hex = _b.hex, hsl = _b.hsl, rgb = _b.rgb;
+        this.model = model;
+        this.hex = hex;
+        this.hsl = hsl;
+        this.rgb = rgb;
+    }
+    Object.defineProperty(Colorizr.prototype, "css", {
+        /**
+         * Get css string.
+         *
+         * @type {number}
+         */
+        get: function () {
+            if (this.model === 'rgb') {
+                return "rgb(" + Math.round(this.rgb.r) + ", " + Math.round(this.rgb.g) + ", " + Math.round(this.rgb.b) + ")";
+            }
+            return "hsl(" + Math.round(this.hsl.h) + ", " + Math.round(this.hsl.s) + "%, " + Math.round(this.hsl.l) + "%)";
+        },
+        enumerable: false,
+        configurable: true
     });
-
-    _defineProperty(this, "rgb", {
-      r: 0,
-      g: 0,
-      b: 0
+    Object.defineProperty(Colorizr.prototype, "red", {
+        /**
+         * Get red value.
+         *
+         * @type {number}
+         */
+        get: function () {
+            return Number(this.rgb.r);
+        },
+        enumerable: false,
+        configurable: true
     });
-
-    this.setColor(color);
-  }
-  /**
-   * Set the instance color.
-   *
-   * @param {string|Array|Object} color
-   */
-
-
-  _createClass(Colorizr, [{
-    key: "setColor",
-    value: function setColor(color) {
-      if (!color) return;
-
-      if (typeof color === 'string') {
-        this.hex = this.parseHex(color);
-        this.rgb = this.hex2rgb();
-        this.hsl = this.hex2hsl();
-      } else if (Array.isArray(color)) {
-        this.setColorFromArray(color);
-      } else if ((0, _utils.isPlainObject)(color)) {
-        this.setColorFromObject(color);
-      } else {
-        throw new Error('Invalid input type');
-      }
-    }
+    Object.defineProperty(Colorizr.prototype, "green", {
+        /**
+         * Get green value.
+         *
+         * @type {number}
+         */
+        get: function () {
+            return Number(this.rgb.g);
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(Colorizr.prototype, "blue", {
+        /**
+         * Get blue value.
+         *
+         * @type {number}
+         */
+        get: function () {
+            return Number(this.rgb.b);
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(Colorizr.prototype, "hue", {
+        /**
+         * Get hue value.
+         *
+         * @type {number}
+         */
+        get: function () {
+            return Number(this.hsl.h);
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(Colorizr.prototype, "saturation", {
+        /**
+         * Get saturation value,
+         *
+         * @type {number}
+         */
+        get: function () {
+            return Number(this.hsl.s);
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(Colorizr.prototype, "lightness", {
+        /**
+         * Get lightness value.
+         *
+         * @type {number}
+         */
+        get: function () {
+            return Number(this.hsl.l);
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(Colorizr.prototype, "luminance", {
+        /**
+         * Get luminance value.
+         *
+         * @type {number}
+         */
+        get: function () {
+            return luminance_1.default(this.hex);
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(Colorizr.prototype, "chroma", {
+        get: function () {
+            var _a = this.rgb, r = _a.r, g = _a.g, b = _a.b;
+            var max = Math.max(r, g, b);
+            var min = Math.min(r, g, b);
+            return utils_1.round((max - min) / 255, 4);
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(Colorizr.prototype, "textColor", {
+        /**
+         * Get the contrasted color
+         */
+        get: function () {
+            return text_color_1.default(this.hex);
+        },
+        enumerable: false,
+        configurable: true
+    });
     /**
-     * Set color from an array.
-     *
-     * @private
-     * @param {Array} input
+     * Test 2 colors for compliance.
      */
-
-  }, {
-    key: "setColorFromArray",
-    value: function setColorFromArray() {
-      var input = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : (0, _utils.isRequired)('input');
-      if (!Array.isArray(input)) throw new Error('input is not an array');
-      this.rgb = {
-        r: this.limit(input[0], 'r'),
-        g: this.limit(input[1], 'g'),
-        b: this.limit(input[2], 'b')
-      };
-      this.hex = this.rgb2hex();
-      this.hsl = this.rgb2hsl();
-    }
+    Colorizr.prototype.compareTo = function (input) {
+        utils_1.invariant(!utils_1.isString(input), 'input must be a string');
+        return wcag_1.default(this.hex, input);
+    };
     /**
-     * Set color from an object.
-     *
-     * @private
-     * @param {Object} input
-     */
-
-  }, {
-    key: "setColorFromObject",
-    value: function setColorFromObject() {
-      var input = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : (0, _utils.isRequired)('input');
-      if (!(0, _utils.isPlainObject)(input)) throw new Error('input is not an object');
-
-      if (this.isHSL(input, true)) {
-        this.hsl = {
-          h: this.limit(input.h, 'h'),
-          s: this.limit(input.s, 's'),
-          l: this.limit(input.l, 'l')
-        };
-        this.rgb = this.hsl2rgb();
-      } else if (this.isRGB(input, true)) {
-        this.rgb = input;
-        this.hsl = this.rgb2hsl();
-      } else {
-        throw new Error('Invalid object');
-      }
-
-      this.hex = this.hsl2hex();
-    }
-    /**
      * Increase lightness.
-     *
-     * @param {number} percentage
-     * @returns {string}
      */
-
-  }, {
-    key: "lighten",
-    value: function lighten() {
-      var percentage = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 10;
-      var hsl = this.shift({
-        l: this.constrain(this.lightness, percentage, [0, 100], '+')
-      });
-      return this.hsl2hex(hsl);
-    }
+    Colorizr.prototype.lighten = function (percentage) {
+        if (percentage === void 0) { percentage = 10; }
+        return shift_1.default(this.hex, {
+            l: utils_1.constrain(this.lightness, percentage, [0, 100], '+'),
+        });
+    };
     /**
      * Decrease lightness.
-     *
-     * @param {number} percentage
-     * @returns {string}
      */
-
-  }, {
-    key: "darken",
-    value: function darken() {
-      var percentage = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 10;
-      var hsl = this.shift({
-        l: this.constrain(this.lightness, percentage, [0, 100], '-')
-      });
-      return this.hsl2hex(hsl);
-    }
+    Colorizr.prototype.darken = function (percentage) {
+        if (percentage === void 0) { percentage = 10; }
+        return shift_1.default(this.hex, {
+            l: utils_1.constrain(this.lightness, percentage, [0, 100], '-'),
+        });
+    };
     /**
      * Increase saturation.
-     *
-     * @param {number} percentage
-     * @returns {string}
      */
-
-  }, {
-    key: "saturate",
-    value: function saturate() {
-      var percentage = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 10;
-      var hsl = this.shift({
-        s: this.constrain(this.saturation, percentage, [0, 100], '+')
-      });
-      return this.hsl2hex(hsl);
-    }
+    Colorizr.prototype.saturate = function (percentage) {
+        if (percentage === void 0) { percentage = 10; }
+        return shift_1.default(this.hex, {
+            s: utils_1.constrain(this.saturation, percentage, [0, 100], '+'),
+        });
+    };
     /**
      * Decrease saturation.
-     *
-     * @param {number} percentage
-     * @returns {string}
      */
-
-  }, {
-    key: "desaturate",
-    value: function desaturate() {
-      var percentage = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 10;
-      var hsl = this.shift({
-        s: this.constrain(this.saturation, percentage, [0, 100], '-')
-      });
-      return this.hsl2hex(hsl);
-    }
-    /**
-     * Adjust the color hue.
-     *
-     * @param {number} degrees
-     * @returns {string}
-     */
-
-  }, {
-    key: "rotate",
-    value: function rotate() {
-      var degrees = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 15;
-      var hsl = this.shift({
-        h: this.constrainDegrees(this.hue, +degrees)
-      });
-      return this.hsl2hex(hsl);
-    }
-    /**
-     * Alter color values.
-     *
-     * @param {Object} input
-     * @param {boolean} [returnHex]
-     *
-     * @returns {string}
-     */
-
-  }, {
-    key: "remix",
-    value: function remix() {
-      var input = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : (0, _utils.isRequired)('input');
-      var returnHex = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
-      var shift = this.shift(input);
-
-      if (returnHex) {
-        return this.isRGB(shift) ? this.rgb2hex(shift) : this.hsl2hex(shift);
-      }
-
-      return shift;
-    }
-    /**
-     * Generate a random color.
-     *
-     * @returns {{hex: string, rgb: Object, hsl: Object}}
-     */
-
-  }, {
-    key: "random",
-    value: function random() {
-      var hsl = {
-        h: Math.floor(Math.random() * 360) + 1,
-        s: Math.floor(Math.random() * 90) + 10,
-        l: Math.floor(Math.random() * 80) + 10
-      };
-      return {
-        hex: this.hsl2hex(hsl),
-        rgb: this.hsl2rgb(hsl),
-        hsl: hsl
-      };
-    }
-    /**
-     * Get the contrasted color for a given hex.
-     *
-     * @param {string} input
-     * @returns {string}
-     */
-
-  }, {
-    key: "textColor",
-    value: function textColor() {
-      var input = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.hex;
-
-      var _this$hex2rgb = this.hex2rgb(input),
-          r = _this$hex2rgb.r,
-          g = _this$hex2rgb.g,
-          b = _this$hex2rgb.b;
-
-      var yiq = (r * 299 + g * 587 + b * 114) / 1000;
-      return yiq >= 128 ? '#000' : '#fff';
-    }
-    /**
-     * Get the brightness difference between 2 colors.
-     *
-     * @param {Object} left
-     * @param {Object} [right]
-     * @returns {number}
-     */
-
-  }, {
-    key: "getBrightnessDifference",
-    value: function getBrightnessDifference() {
-      var left = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : (0, _utils.isRequired)('left');
-      var right = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : this.hex;
-      var RGBLeft = this.hex2rgb(left);
-      var RGBRight = this.hex2rgb(right);
-      var rightY = (RGBRight.r * 299 + RGBRight.g * 587 + RGBRight.b * 114) / 1000;
-      var leftY = (RGBLeft.r * 299 + RGBLeft.g * 587 + RGBLeft.b * 114) / 1000;
-      return (0, _utils.round)(Math.abs(rightY - leftY), 4);
-    }
-    /**
-     * Get the color difference between 2 colors.
-     *
-     * @param {Object} left
-     * @param {Object} [right]
-     * @returns {number}
-     */
-
-  }, {
-    key: "getColorDifference",
-    value: function getColorDifference() {
-      var left = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : (0, _utils.isRequired)('left');
-      var right = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : this.hex;
-      var RGBLeft = this.hex2rgb(left);
-      var RGBRight = this.hex2rgb(right);
-      return Math.max(RGBLeft.r, RGBRight.r) - Math.min(RGBLeft.r, RGBRight.r) + (Math.max(RGBLeft.g, RGBRight.g) - Math.min(RGBLeft.g, RGBRight.g)) + (Math.max(RGBLeft.b, RGBRight.b) - Math.min(RGBLeft.b, RGBRight.b));
-    }
-    /**
-     * Test 2 colors for compliance.
-     *
-     * @param {Object} left
-     * @param {Object} [right]
-     * @returns {Object}
-     */
-
-  }, {
-    key: "compare",
-    value: function compare() {
-      var left = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : (0, _utils.isRequired)('left');
-      var right = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : this.hex;
-      var LuminanceLeft = this.getLuminance(left);
-      var LuminanceRight = this.getLuminance(right);
-      var colorDifference = this.getColorDifference(left, right);
-      var colorThreshold = 500;
-      var brightnessDifference = this.getBrightnessDifference(left, right);
-      var brightnessThreshold = 125;
-      var ratio = 1;
-
-      if (LuminanceLeft >= LuminanceRight) {
-        ratio = (LuminanceLeft + 0.05) / (LuminanceRight + 0.05);
-      } else {
-        ratio = (LuminanceRight + 0.05) / (LuminanceLeft + 0.05);
-      }
-
-      ratio = (0, _utils.round)(ratio, 4);
-      var isBright = brightnessDifference >= brightnessThreshold;
-      var hasEnoughDifference = colorDifference >= colorThreshold;
-      var compliant = 0;
-
-      if (isBright && hasEnoughDifference) {
-        compliant = 2;
-      } else if (isBright || hasEnoughDifference) {
-        compliant = 1;
-      }
-
-      return {
-        brightnessDifference: brightnessDifference,
-        colorDifference: colorDifference,
-        compliant: compliant,
-        contrast: ratio,
-        w2a: ratio >= 3,
-        w2aaab: ratio >= 7,
-        w2aaaa: ratio >= 4.5,
-        w2b: ratio >= 4.5
-      };
-    }
-    /**
-     * Get contrast ratio.
-     *
-     * @param {Object} left
-     * @param {Object} [right]
-     * @returns {Object}
-     */
-
-  }, {
-    key: "contrast",
-    value: function contrast() {
-      var left = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : (0, _utils.isRequired)('left');
-      var right = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : this.hex;
-      var compare = this.compare(left, right);
-      return compare.contrast;
-    }
-    /**
-     * Get the luminance of a color.
-     *
-     * @param hex
-     * @returns {number}
-     */
-
-  }, {
-    key: "getLuminance",
-    value: function getLuminance() {
-      var hex = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.hex;
-      var rgb = this.hex2rgb(hex);
-      rgb = [rgb.r / 255, rgb.g / 255, rgb.b / 255];
-
-      for (var i = 0; i < rgb.length; i++) {
-        if (rgb[i] <= 0.03928) {
-          rgb[i] /= 12.92;
-        } else {
-          rgb[i] = Math.pow((rgb[i] + 0.055) / 1.055, 2.4);
-        }
-      }
-
-      return (0, _utils.round)(0.2126 * rgb[0] + 0.7152 * rgb[1] + 0.0722 * rgb[2], 4);
-    }
-    /**
-     * Parse HEX color.
-     *
-     * @param {string} input
-     *
-     * @returns {string}
-     */
-
-  }, {
-    key: "parseHex",
-    value: function parseHex() {
-      var input = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : (0, _utils.isRequired)('input');
-      var color = input.replace('#', '');
-      var hex = color;
-
-      if (color.length === 3) {
-        hex = '';
-        color.split('').forEach(function (d) {
-          hex += d + d;
+    Colorizr.prototype.desaturate = function (percentage) {
+        if (percentage === void 0) { percentage = 10; }
+        return shift_1.default(this.hex, {
+            s: utils_1.constrain(this.saturation, percentage, [0, 100], '-'),
         });
-      }
-
-      hex = "#".concat(hex);
-
-      if (!(0, _utils.validateHex)(hex)) {
-        throw new Error('Invalid color');
-      }
-
-      return hex;
-    }
+    };
     /**
-     * Parse CSS attribute.
-     *
-     * @param {string} input
-     * @returns {Object}
+     * Invert color
      */
-
-  }, {
-    key: "parseCSS",
-    value: function parseCSS() {
-      var input = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : (0, _utils.isRequired)('input');
-      var model = /^rgb/.test(input) ? 'rgba' : 'hsla';
-      var regex = new RegExp("^".concat(model, "?[\\s+]?\\([\\s+]?(\\d+)[\\s+]?,[\\s+]?(\\d+)[\\s+]?,[\\s+]?(\\d+)[\\s+]?"), 'i');
-      var matches = input.match(regex);
-
-      if (matches && matches.length === 4) {
-        var _ref;
-
-        return _ref = {}, _defineProperty(_ref, model.slice(0, 1), parseInt(matches[1], 10)), _defineProperty(_ref, model.slice(1, 2), parseInt(matches[2], 10)), _defineProperty(_ref, model.slice(2, 3), parseInt(matches[3], 10)), _ref;
-      }
-
-      throw new Error('Invalid CSS string');
-    }
-    /**
-     * Convert a hex string to RGB object.
-     *
-     * @param {string} [input]
-     * @returns {{r: number, g: number, b: number}}
-     */
-
-  }, {
-    key: "hex2rgb",
-    value: function hex2rgb() {
-      var input = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.hex;
-      var hex = this.parseHex(input).substr(1);
-      return {
-        r: parseInt(String(hex.charAt(0)) + hex.charAt(1), 16),
-        g: parseInt(String(hex.charAt(2)) + hex.charAt(3), 16),
-        b: parseInt(String(hex.charAt(4)) + hex.charAt(5), 16)
-      };
-    }
-    /**
-     * Convert a hex string to HSL object.
-     *
-     * @param {string} [input]
-     * @returns {{h: number, s: number, l: number}}
-     */
-
-  }, {
-    key: "hex2hsl",
-    value: function hex2hsl() {
-      var input = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.hex;
-      return this.rgb2hsl(this.hex2rgb(input));
-    }
-    /**
-     * Convert a RGB object to HSL.
-     *
-     * @param {Object|string} [input]
-     * @returns {{h: number, s: number, l: number}}
-     */
-
-  }, {
-    key: "rgb2hsl",
-    value: function rgb2hsl() {
-      var input = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.rgb;
-      var rgb = typeof input === 'string' ? this.parseCSS(input) : input;
-
-      if (!this.isRGB(rgb, true)) {
-        throw new Error('Invalid object');
-      }
-
-      var r = this.limit(rgb.r, 'r') / 255;
-      var g = this.limit(rgb.g, 'g') / 255;
-      var b = this.limit(rgb.b, 'b') / 255;
-      var min = Math.min(r, g, b);
-      var max = Math.max(r, g, b);
-      var delta = max - min;
-      var h = 0;
-      var s;
-      var l;
-      var rate;
-
-      switch (max) {
-        case r:
-          rate = !delta ? 0 : (g - b) / delta;
-          h = 60 * rate;
-          break;
-
-        case g:
-          rate = (b - r) / delta;
-          h = 60 * rate + 120;
-          break;
-
-        case b:
-          rate = (r - g) / delta;
-          h = 60 * rate + 240;
-          break;
-
-        /* istanbul ignore next */
-
-        default:
-          break;
-      }
-
-      if (h < 0) {
-        h = 360 + h;
-      }
-
-      l = (max + min) / 2.0;
-
-      if (min === max) {
-        s = 0;
-      } else {
-        s = l < 0.5 ? delta / (2 * l) : delta / (2 - 2 * l);
-      }
-
-      return {
-        h: Math.abs(+(h % 360).toFixed(2)),
-        s: +(s * 100).toFixed(2),
-        l: +(l * 100).toFixed(2)
-      };
-    }
-    /**
-     * Convert a RGA object to hex.
-     *
-     * @param {Object|string} [input]
-     *
-     * @returns {string}
-     */
-
-  }, {
-    key: "rgb2hex",
-    value: function rgb2hex() {
-      var input = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.rgb;
-      var rgb = typeof input === 'string' ? this.parseCSS(input) : input;
-
-      if (!this.isRGB(rgb, true)) {
-        throw new Error('Invalid object');
-      }
-
-      var hex = (1 << 24) + (rgb.r << 16) + (rgb.g << 8) + rgb.b;
-      return "#".concat(hex.toString(16).slice(1));
-    }
-    /**
-     * Convert a HSL object to RGB.
-     *
-     * @param {Object|string} [input]
-     * @returns {{r: number, g: number, b: number}}
-     */
-
-  }, {
-    key: "hsl2rgb",
-    value: function hsl2rgb() {
-      var input = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.hsl;
-      var hsl = typeof input === 'string' ? this.parseCSS(input) : input;
-
-      if (!this.isHSL(hsl, true)) {
-        throw new Error('Invalid object');
-      }
-
-      var h = (0, _utils.round)(hsl.h) / 360;
-      var s = (0, _utils.round)(hsl.s) / 100;
-      var l = (0, _utils.round)(hsl.l) / 100;
-      var r;
-      var g;
-      var b;
-      var point;
-      var chroma;
-
-      if (s === 0) {
-        r = l;
-        g = l;
-        b = l;
-      } else {
-        chroma = l < 0.5 ? l * (1 + s) : l + s - l * s;
-        point = 2 * l - chroma;
-        r = this.hue2rgb(point, chroma, h + 1 / 3);
-        g = this.hue2rgb(point, chroma, h);
-        b = this.hue2rgb(point, chroma, h - 1 / 3);
-      }
-
-      return {
-        r: Math.round(r * 255),
-        g: Math.round(g * 255),
-        b: Math.round(b * 255)
-      };
-    }
-    /**
-     * Convert a HSL object to HEX.
-     *
-     * @param {Object|string} [input]
-     * @returns {string}
-     */
-
-  }, {
-    key: "hsl2hex",
-    value: function hsl2hex() {
-      var input = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.hsl;
-      var hsl = typeof input === 'string' ? this.parseCSS(input) : input;
-      return this.rgb2hex(this.hsl2rgb(hsl));
-    }
-    /**
-     * Convert hue to RGB using chroma and median point
-     *
-     * @private
-     * @param {number} point
-     * @param {number} chroma
-     * @param {number} h
-     *
-     * @returns {*}
-     */
-
-  }, {
-    key: "hue2rgb",
-    value: function hue2rgb() {
-      var point = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : (0, _utils.isRequired)('point');
-      var chroma = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : (0, _utils.isRequired)('chroma');
-      var h = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : (0, _utils.isRequired)('hue');
-      var hue = h;
-
-      if (hue < 0) {
-        hue += 1;
-      }
-
-      if (hue > 1) {
-        hue -= 1;
-      }
-
-      if (hue < 1 / 6) {
-        return (0, _utils.round)(point + (chroma - point) * 6 * hue, 4);
-      }
-
-      if (hue < 1 / 2) {
-        return (0, _utils.round)(chroma, 4);
-      }
-
-      if (hue < 2 / 3) {
-        return (0, _utils.round)(point + (chroma - point) * (2 / 3 - hue) * 6, 4);
-      }
-
-      return (0, _utils.round)(point, 4);
-    }
-    /**
-     * Get a shifted color object with the same model of the input.
-     *
-     * @private
-     * @param {Object} input - {r,g,b} or {h,s,l}
-     * @returns {Object}
-     */
-
-  }, {
-    key: "shift",
-    value: function shift() {
-      var input = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : (0, _utils.isRequired)('input');
-
-      if (!(0, _utils.isPlainObject)(input)) {
-        throw new Error('Invalid input');
-      }
-
-      var isHSL = this.isHSL(input);
-      var isRGB = this.isRGB(input);
-
-      if (isRGB && isHSL) {
-        throw new Error('Use a single color model');
-      }
-
-      if (!isHSL && !isRGB) {
-        throw new Error('Could not match a color model');
-      }
-
-      if (isHSL) {
-        var hsl = (0, _utils.pick)(input, HSL);
-        return _objectSpread({}, this.hsl, {}, hsl);
-      } // Not HSL so it must be RGB
-
-
-      var rgb = (0, _utils.pick)(input, RGB);
-      return _objectSpread({}, this.rgb, {}, rgb);
-    }
-    /**
-     * Limit values per type.
-     *
-     * @private
-     * @param {number} input
-     * @param {string} type
-     * @returns {number}
-     */
-
-  }, {
-    key: "limit",
-    value: function limit() {
-      var input = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : (0, _utils.isRequired)('input');
-      var type = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : (0, _utils.isRequired)('type');
-
-      if (typeof input !== 'number') {
-        throw new Error('Input is not a number');
-      }
-      /* istanbul ignore else */
-
-
-      if (RGB.includes(type)) {
-        return Math.max(Math.min(input, 255), 0);
-      }
-
-      if (['s', 'l'].includes(type)) {
-        return Math.max(Math.min(input, 100), 0);
-      }
-
-      if (type === 'h') {
-        return Math.max(Math.min(input, 360), 0);
-      }
-
-      throw new Error('Invalid type');
-    }
-    /**
-     * Constrain value into the range
-     *
-     * @private
-     * @param {number} input
-     * @param {number} amount
-     * @param {Array} range
-     * @param {string} sign
-     * @returns {number}
-     */
-
-  }, {
-    key: "constrain",
-    value: function constrain() {
-      var input = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : (0, _utils.isRequired)('input');
-      var amount = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : (0, _utils.isRequired)('amount');
-      var range = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : (0, _utils.isRequired)('range');
-      var sign = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : (0, _utils.isRequired)('sign');
-
-      var _range = _slicedToArray(range, 2),
-          min = _range[0],
-          max = _range[1];
-
-      var value = (0, _utils.expr)(input + sign + amount);
-
-      if (value < min) {
-        value = min;
-      } else if (value > max) {
-        value = max;
-      }
-
-      return Math.abs(value);
-    }
-    /**
-     * Constrain an angle
-     *
-     * @private
-     * @param {number} input
-     * @param {number} amount
-     * @returns {number}
-     */
-
-  }, {
-    key: "constrainDegrees",
-    value: function constrainDegrees() {
-      var input = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : (0, _utils.isRequired)('input');
-      var amount = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : (0, _utils.isRequired)('amount');
-      var value = input + amount;
-
-      if (value > 360) {
-        value -= 360;
-      }
-
-      if (value < 0) {
-        value += 360;
-      }
-
-      return Math.abs(value);
-    }
-    /**
-     * Check if an object contains HSL values.
-     *
-     * @param {Object} input
-     * @param {boolean} all
-     *
-     * @returns {boolean}
-     */
-
-  }, {
-    key: "isHSL",
-    value: function isHSL(input) {
-      var all = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
-      var keys = Object.keys(input);
-
-      if (all) {
-        return keys.every(function (d) {
-          return HSL.includes(d);
+    Colorizr.prototype.invert = function () {
+        return shift_1.default(this.hex, {
+            h: utils_1.constrainDegrees(this.hue, 180),
         });
-      }
-
-      return keys.some(function (d) {
-        return HSL.includes(d);
-      });
-    }
+    };
     /**
-     * Check if an object contains RGB values.
-     *
-     * @param {Object} input
-     * @param {boolean} all
-     *
-     * @returns {boolean}
+     * Fade color.
      */
-
-  }, {
-    key: "isRGB",
-    value: function isRGB(input) {
-      var all = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
-      var keys = Object.keys(input);
-
-      if (all) {
-        return keys.every(function (d) {
-          return RGB.includes(d);
-        });
-      }
-
-      return keys.some(function (d) {
-        return RGB.includes(d);
-      });
-    }
-    /**
-     * Get red value.
-     *
-     * @type {number}
-     */
-
-  }, {
-    key: "red",
-    get: function get() {
-      return Number(this.rgb.r);
-    }
-    /**
-     * Get green value.
-     *
-     * @type {number}
-     */
-
-  }, {
-    key: "green",
-    get: function get() {
-      return Number(this.rgb.g);
-    }
-    /**
-     * Get blue value.
-     *
-     * @type {number}
-     */
-
-  }, {
-    key: "blue",
-    get: function get() {
-      return Number(this.rgb.b);
-    }
-    /**
-     * Get hue value.
-     *
-     * @type {number}
-     */
-
-  }, {
-    key: "hue",
-    get: function get() {
-      return Number(this.hsl.h);
-    }
-    /**
-     * Get saturation value,
-     *
-     * @type {number}
-     */
-
-  }, {
-    key: "saturation",
-    get: function get() {
-      return Number(this.hsl.s);
-    }
-    /**
-     * Get lightness value.
-     *
-     * @type {number}
-     */
-
-  }, {
-    key: "lightness",
-    get: function get() {
-      return Number(this.hsl.l);
-    }
-    /**
-     * Get luminance value.
-     *
-     * @type {number}
-     */
-
-  }, {
-    key: "luminance",
-    get: function get() {
-      return this.getLuminance();
-    }
-  }, {
-    key: "chroma",
-    get: function get() {
-      var _this$rgb = this.rgb,
-          r = _this$rgb.r,
-          g = _this$rgb.g,
-          b = _this$rgb.b;
-      var max = Math.max(r, g, b);
-      var min = Math.min(r, g, b);
-      return (0, _utils.round)((max - min) / 255, 4);
-    }
-  }]);
-
-  return Colorizr;
-}();
-
-exports.default = Colorizr;
+    Colorizr.prototype.fade = function (percentage) {
+        if (percentage === void 0) { percentage = 10; }
+        var amount = (100 - percentage) / 100;
+        if (this.model === 'rgb') {
+            return "rgba(" + this.rgb.r + ", " + this.rgb.g + ", " + this.rgb.b + ", " + amount + ")";
+        }
+        return "hsla(" + this.hsl.h + ", " + this.hsl.s + "%, " + this.hsl.l + "%, " + amount + ")";
+    };
+    return Colorizr;
+}());
+__exportStar(require("./types"), exports);
+exports.default = Colorizr;
+//# sourceMappingURL=index.js.map

lib/utils.js

 "use strict";
-
-exports.__esModule = true;
-exports.expr = expr;
-exports.isPlainObject = isPlainObject;
-exports.isRequired = isRequired;
-exports.pick = pick;
-exports.round = round;
-exports.validateHex = validateHex;
-
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.round = exports.pick = exports.limit = exports.isString = exports.isRGBArray = exports.isRGB = exports.isPlainObject = exports.isNumber = exports.isHSL = exports.invariant = exports.expr = exports.constrainDegrees = exports.constrain = exports.RGBKeys = exports.HSLKeys = void 0;
+exports.HSLKeys = ['h', 's', 'l'];
+exports.RGBKeys = ['r', 'g', 'b'];
 /**
- * Colorizr Utils
- * @module Utils
+ * Constrain value into the range
  */
-
+function constrain(input, amount, range, sign) {
+    invariant(arguments.length < 4, 'All parameters are required');
+    var min = range[0], max = range[1];
+    var value = expr(input + sign + amount);
+    if (value < min) {
+        value = min;
+    }
+    else if (value > max) {
+        value = max;
+    }
+    return Math.abs(value);
+}
+exports.constrain = constrain;
 /**
+ * Constrain an angle
+ */
+function constrainDegrees(input, amount) {
+    invariant(!isNumber(input), 'input is required');
+    var value = input + amount;
+    if (value > 360) {
+        value %= 360;
+    }
+    if (value < 0) {
+        value += 360;
+    }
+    return Math.abs(value);
+}
+exports.constrainDegrees = constrainDegrees;
+/**
  * Parse math string expressions.
- *
- * @function
- * @param {string} input
- *
- * @returns {number}
  */
 function expr(input) {
-  var chars = input.split('');
-  var n = [];
-  var op = [];
-  var parsed;
-  var index = 0;
-  var last = true;
-  n[index] = ''; // Parse the string
-
-  for (var c = 0; c < chars.length; c++) {
-    if (isNaN(parseInt(chars[c], 10)) && chars[c] !== '.' && !last) {
-      op[index] = chars[c];
-      index++;
-      n[index] = '';
-      last = true;
-    } else {
-      n[index] += chars[c];
-      last = false;
+    var chars = input.split('');
+    var n = [];
+    var op = [];
+    var parsed;
+    var index = 0;
+    var last = true;
+    n[index] = '';
+    // Parse the string
+    for (var _i = 0, chars_1 = chars; _i < chars_1.length; _i++) {
+        var char = chars_1[_i];
+        if (Number.isNaN(parseInt(char, 10)) && char !== '.' && !last) {
+            op[index] = char;
+            index++;
+            n[index] = '';
+            last = true;
+        }
+        else {
+            n[index] += char;
+            last = false;
+        }
     }
-  } // Calculate the expression
-
-
-  parsed = parseFloat(n[0]);
-
-  for (var o = 0; o < op.length; o++) {
-    var num = parseFloat(n[o + 1]);
-
-    switch (op[o]) {
-      case '+':
-        parsed += num;
-        break;
-
-      case '-':
-        parsed -= num;
-        break;
-
-      case '*':
-        parsed *= num;
-        break;
-
-      case '/':
-        parsed /= num;
-        break;
-
-      default:
-        break;
+    // Calculate the expression
+    parsed = parseFloat(n[0]);
+    for (var o = 0; o < op.length; o++) {
+        var num = parseFloat(n[o + 1]);
+        switch (op[o]) {
+            case '+':
+                parsed += num;
+                break;
+            case '-':
+                parsed -= num;
+                break;
+            case '*':
+                parsed *= num;
+                break;
+            case '/':
+                parsed /= num;
+                break;
+            default:
+                break;
+        }
     }
-  }
-
-  return parsed;
+    return parsed;
 }
+exports.expr = expr;
+function invariant(condition, message, a, b, c, d, e, f) {
+    /* istanbul ignore else */
+    if (process.env.NODE_ENV !== 'production') {
+        if (message === undefined) {
+            throw new Error('invariant requires an error message argument');
+        }
+    }
+    if (condition) {
+        var error = void 0;
+        if (!message) {
+            error = new Error('Minified exception occurred; use the non-minified dev environment ' +
+                'for the full error message and additional helpful warnings.');
+        }
+        else {
+            var args_1 = [a, b, c, d, e, f];
+            var argIndex_1 = 0;
+            error = new Error(message.replace(/%s/g, function () { return args_1[argIndex_1++]; }));
+            error.name = 'Colorizr';
+        }
+        throw error;
+    }
+}
+exports.invariant = invariant;
 /**
+ * Check if an object contains HSL values.
+ */
+function isHSL(input) {
+    if (!isPlainObject(input)) {
+        return false;
+    }
+    var entries = Object.entries(input);
+    return (!!entries.length &&
+        entries.every(function (_a) {
+            var key = _a[0], value = _a[1];
+            return exports.HSLKeys.indexOf(key) >= 0 && value >= 0 && value <= (key === 'h' ? 360 : 100);
+        }));
+}
+exports.isHSL = isHSL;
+/**
+ * Check if the input is a number and no NaN
+ */
+function isNumber(input) {
+    return typeof input === 'number' && !Number.isNaN(input);
+}
+exports.isNumber = isNumber;
+/**
  * Check if the input is an object
- *
- * @param {*} input
- * @returns {boolean}
  */
-
-
 function isPlainObject(input) {
-  if (!input) return false;
-  var toString = Object.prototype.toString;
-  var prototype = Object.getPrototypeOf(input);
-  return toString.call(input) === '[object Object]' && (prototype === null || prototype === Object.getPrototypeOf({}));
+    if (!input) {
+        return false;
+    }
+    var toString = Object.prototype.toString;
+    var prototype = Object.getPrototypeOf(input);
+    return (toString.call(input) === '[object Object]' &&
+        (prototype === null || prototype === Object.getPrototypeOf({})));
 }
-
-function isRequired(name) {
-  throw new Error("".concat(name || 'parameter', " is required"));
+exports.isPlainObject = isPlainObject;
+/**
+ * Check if an object contains RGB values.
+ */
+function isRGB(input) {
+    if (!isPlainObject(input)) {
+        return false;
+    }
+    var entries = Object.entries(input);
+    return (!!entries.length &&
+        entries.every(function (_a) {
+            var key = _a[0], value = _a[1];
+            return exports.RGBKeys.indexOf(key) >= 0 && value >= 0 && value <= 255;
+        }));
 }
+exports.isRGB = isRGB;
 /**
+ * Check if an array contains RGB values.
+ */
+function isRGBArray(input) {
+    return Array.isArray(input) && input.length === 3 && input.every(function (d) { return d >= 0 && d <= 255; });
+}
+exports.isRGBArray = isRGBArray;
+/**
+ * Check if the input is a string
+ */
+function isString(input) {
+    return typeof input === 'string';
+}
+exports.isString = isString;
+/**
+ * Limit values per type.
+ */
+function limit(input, type) {
+    invariant(!isNumber(input), 'Input is not a number');
+    /* istanbul ignore else */
+    if (exports.RGBKeys.indexOf(type) >= 0) {
+        return Math.max(Math.min(input, 255), 0);
+    }
+    if (['s', 'l'].indexOf(type) >= 0) {
+        return Math.max(Math.min(input, 100), 0);
+    }
+    if (type === 'h') {
+        return Math.max(Math.min(input, 360), 0);
+    }
+    throw new Error('Invalid type');
+}
+exports.limit = limit;
+/**
  * Creates an object composed of the picked source properties.
- *
- * @param {Object} input
- * @param {Array} options
- *
- * @returns {Object}
  */
-
-
 function pick(input, options) {
-  if (!Array.isArray(options)) {
-    throw new Error('options must be an array');
-  }
-
-  return options.filter(function (d) {
-    return typeof input[d] !== 'undefined';
-  }).reduce(function (acc, i) {
-    acc[i] = input[i];
-    return acc;
-  }, {});
+    if (!Array.isArray(options)) {
+        throw new Error('options must be an array');
+    }
+    return options
+        .filter(function (d) { return typeof input[d] !== 'undefined'; })
+        .reduce(function (acc, d) {
+        acc[d] = input[d];
+        return acc;
+    }, {});
 }
+exports.pick = pick;
 /**
  * Round decimal numbers.
- *
- * @function
- * @param {number} input
- * @param {number} digits
- *
- * @returns {number}
  */
-
-
-function round(input) {
-  var digits = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 2;
-  var factor = Math.pow(10, digits);
-  return Math.round(input * factor) / factor;
+function round(input, digits) {
+    if (digits === void 0) { digits = 2; }
+    var factor = Math.pow(10, digits);
+    return Math.round(input * factor) / factor;
 }
-
-function validateHex(input) {
-  return /(^#[0-9A-F]{6}$)|(^#[0-9A-F]{3}$)/i.test(input);
-}
+exports.round = round;
+//# sourceMappingURL=utils.js.map

package.json

 {
   "name": "colorizr",
-  "version": "1.1.1",
+  "version": "2.0.0-0",
   "description": "Manipulate colors like a boss",
@@ -8,3 +8,5 @@ "author": "Gil Barbara <[e-mail]>",
     "color",
-    "color manipulation"
+    "color manipulation",
+    "wcga",
+    "a11y"
   ],
@@ -20,74 +22,64 @@ "license": "MIT",
   "main": "lib/index.js",
-  "module": "es/index.js",
+  "module": "esm/index.js",
   "files": [
-    "es",
     "lib",
+    "esm",
     "src"
   ],
+  "types": "lib/index.d.ts",
+  "sideEffects": false,
   "dependencies": {},
   "devDependencies": {
-    "@babel/cli": "^7.5.0",
-    "@babel/core": "^7.5.4",
-    "@babel/plugin-proposal-class-properties": "^7.5.0",
-    "@babel/plugin-proposal-decorators": "^7.4.4",
-    "@babel/plugin-proposal-do-expressions": "^7.5.0",
-    "@babel/plugin-proposal-export-default-from": "^7.5.2",
-    "@babel/plugin-proposal-export-namespace-from": "^7.5.2",
-    "@babel/plugin-proposal-function-sent": "^7.5.0",
-    "@babel/plugin-proposal-json-strings": "^7.2.0",
-    "@babel/plugin-proposal-logical-assignment-operators": "^7.2.0",
-    "@babel/plugin-proposal-nullish-coalescing-operator": "^7.4.4",
-    "@babel/plugin-proposal-numeric-separator": "^7.2.0",
-    "@babel/plugin-proposal-optional-chaining": "^7.2.0",
-    "@babel/plugin-proposal-pipeline-operator": "^7.5.0",
-    "@babel/plugin-proposal-throw-expressions": "^7.2.0",
-    "@babel/plugin-syntax-dynamic-import": "^7.2.0",
-    "@babel/plugin-syntax-import-meta": "^7.2.0",
-    "@babel/plugin-transform-flow-strip-types": "^7.4.4",
-    "@babel/preset-env": "^7.5.4",
-    "@babel/preset-flow": "^7.0.0",
-    "babel-core": "^7.0.0-bridge.0",
-    "babel-eslint": "^10.0.2",
-    "babel-jest": "^24.8.0",
-    "babel-plugin-array-includes": "^2.0.3",
-    "bundlesize": "^0.18.0",
-    "core-js": "^3.1.4",
-    "cross-env": "^5.2.0",
-    "eslint": "^5.16.0",
-    "eslint-config-airbnb-base": "^13.2.0",
-    "eslint-plugin-babel": "^5.3.0",
-    "eslint-plugin-flowtype": "^3.11.1",
-    "eslint-plugin-import": "^2.18.0",
-    "eslint-plugin-jsx-a11y": "^6.2.3",
-    "flow-bin": "^0.102.0",
-    "husky": "^3.0.0",
-    "jest": "^24.8.0",
-    "rimraf": "^2.6.3",
+    "@gilbarbara/tsconfig": "^0.1.0",
+    "@size-limit/preset-small-lib": "^4.6.0",
+    "@types/jest": "^26.0.14",
+    "@types/node": "^14.11.2",
+    "@typescript-eslint/eslint-plugin": "^4.2.0",
+    "@typescript-eslint/parser": "^4.2.0",
+    "eslint": "^7.10.0",
+    "eslint-config-airbnb-base": "^14.2.0",
+    "eslint-config-prettier": "^6.12.0",
+    "eslint-plugin-import": "^2.22.0",
+    "eslint-plugin-jsx-a11y": "^6.3.1",
+    "eslint-plugin-prettier": "^3.1.4",
+    "husky": "^4.3.0",
+    "is-ci-cli": "^2.1.2",
+    "jest": "^26.4.2",
+    "jest-watch-typeahead": "^0.6.1",
+    "prettier": "^2.1.2",
+    "repo-tools": "^0.2.0",
+    "rimraf": "^3.0.2",
+    "size-limit": "^4.6.0",
+    "ts-jest": "^26.4.0",
+    "ts-node": "^9.0.0",
+    "typescript": "^4.0.3",
     "watch-run": "^1.2.5"
   },
   "scripts": {
-    "build": "npm run clean && npm run build:commonjs && npm run build:es",
-    "build:commonjs": "cross-env BABEL_ENV=commonjs babel src -d lib",
-    "build:es": "cross-env NODE_ENV=production babel src -d es",
-    "watch": "npm run build && watch-run -p 'src/**/*.js' npm run build:es",
-    "clean": "rimraf es && rimraf lib",
-    "lint": "eslint src test",
-    "test": "jest --coverage",
-    "test:watch": "jest --watch",
-    "bundlesize": "bundlesize",
-    "validate": "npm run lint && npm test && flow && npm run build && bundlesize",
+    "build": "npm run clean && npm run build:cjs && npm run build:esm",
+    "build:cjs": "tsc",
+    "build:esm": "tsc -m es6 --outDir esm",
+    "watch:cjs": "npm run build:cjs -- -w",
+    "watch:esm": "npm run build:esm -- -w",
+    "clean": "rimraf lib && rimraf esm",
+    "lint": "eslint --ext .ts,.tsx src test",
+    "test": "is-ci \"test:coverage\" \"test:watch\"",
+    "test:coverage": "jest --coverage --bail",
+    "test:watch": "jest --watch --verbose",
+    "format": "prettier \"**/*.{js,jsx,json,yml,yaml,css,less,scss,ts,tsx,md,graphql,mdx}\" --write",
+    "validate": "npm run lint && npm run test:coverage && npm run build && npm run size",
+    "size": "size-limit",
     "prepublishOnly": "npm run validate"
   },
-  "browserslist": [
-    "> 0.2%",
-    "not dead"
-  ],
-  "bundlesize": [
+  "prettier": {
+    "arrowParens": "avoid",
+    "printWidth": 100,
+    "proseWrap": "never",
+    "singleQuote": true,
+    "trailingComma": "all"
+  },
+  "size-limit": [
     {
-      "path": "./es/index.js",
-      "maxSize": "6 kB"
-    },
-    {
-      "path": "./lib/index.js",
-      "maxSize": "6 kB"
+      "path": "./lib/*.js",
+      "limit": "5 KB"
     }
@@ -97,5 +89,6 @@ ],
     "hooks": {
-      "pre-commit": "npm run validate"
+      "pre-commit": "repo-tools check-remote && npm run validate",
+      "post-merge": "repo-tools install-packages"
     }
   }
 }

README.md

@@ -1,11 +0,14 @@
-Colorizr
-===
+# Colorizr
 
-[![NPM version](https://badge.fury.io/js/colorizr.svg)](https://www.npmjs.com/package/colorizr)
-[![build status](https://travis-ci.org/gilbarbara/colorizr.svg)](https://travis-ci.org/gilbarbara/colorizr) 
-[![Maintainability](https://api.codeclimate.com/v1/badges/6d686ce2a9f2a1a47d98/maintainability)](https://codeclimate.com/github/gilbarbara/colorizr/maintainability) 
-[![Test Coverage](https://api.codeclimate.com/v1/badges/6d686ce2a9f2a1a47d98/test_coverage)](https://codeclimate.com/github/gilbarbara/colorizr/test_coverage)
+[![NPM version](https://badge.fury.io/js/colorizr.svg)](https://www.npmjs.com/package/colorizr) [![build status](https://travis-ci.org/gilbarbara/colorizr.svg)](https://travis-ci.org/gilbarbara/colorizr) [![Maintainability](https://api.codeclimate.com/v1/badges/6d686ce2a9f2a1a47d98/maintainability)](https://codeclimate.com/github/gilbarbara/colorizr/maintainability) [![Test Coverage](https://api.codeclimate.com/v1/badges/6d686ce2a9f2a1a47d98/test_coverage)](https://codeclimate.com/github/gilbarbara/colorizr/test_coverage)
 
-> JavaScript module to manipulate colors, get its properties and compare it with another color following the WCAG 2.0.
+Color conversion, manipulation and comparison.
 
+## Highlights
+
+- 🏖 **Easy to use**: Works with most color models, including CSS strings
+- ♿️ **Acessibility:** Full WCAG analysis and comparison.
+- 🛠 **Small:** Less than 4k (gzipped) and zero dependencies.
+- 🟦 **Modern:** Written in Typescript.
+
 ## Setup
@@ -33,5 +36,2 @@
 colorizr.rgb // { r: 255, g: 0, b: 68 };
-
-colorizr.saturate(20);
-colorizr.lighten(10);
 ```
@@ -41,40 +41,113 @@
 
-*Set the instance color.*  
-**colorizr.setColor(color: string | Array<number> | Object)**
+### Getters
 
-#### Getters
+**colorizr.hex**  
+*returns the hex*
 
-```js
-colorizr.hue // 0-360
-colorizr.saturation // 0-100
-colorizr.lightness // 0-100
-colorizr.red // 0-255
-colorizr.green // 0-255
-colorizr.blue // 0-255
-colorizr.luminance // 0-1
-colorizr.chroma // 0-1
-```
+**colorizr.hsl**  
+*returns the hsl object*
 
+**colorizr.rgb**  
+*returns the rgb object*
 
-#### Manipulation
+**colorizr.hue**  
+*returns the color hue, between 0 and 360*
 
-*Increase lightness.*  
-**colorizr.lighten(percentage: number = 10)**
+**colorizr.saturation**  
+*returns the color saturation, between 0 and 100*
 
-*Decrease lightness.*  
-**colorizr.darken(percentage: number = 10)**
+**colorizr.lightness**  
+*returns the color lightness, between 0 and 100*
 
-*Increase saturation.*  
-**colorizr.saturate(percentage: number = 10)**
+**colorizr.red**  
+*returns the color red level, between 0 and 255*
 
-*Decrease saturation.*  
-**colorizr.saturate(percentage: number = 10)**
+**colorizr.green**  
+*returns the color green level, between 0 and 255*
 
+**colorizr.blue**  
+*returns the color blue level, between 0 and 255*
 
+**colorizr.luminance**  
+*returns the color luminance, between 0 and 1*
 
+**colorizr.chroma**  
+*returns the color chroma, between 0 and 1*
 
+**colorizr.textColor**  
+*returns a hex value with the contrasted color*
 
-### References
+### Manipulation
+
+**colorizr.lighten(percentage: number = 10)**  
+*returns a hex value with the increased lightness*
+
+**colorizr.darken(percentage: number = 10)**  
+*returns a hex value with the decreased lightness*
+
+**colorizr.saturate(percentage: number = 10)**  
+*returns a hex value with the increased saturation*
+
+**colorizr.saturate(percentage: number = 10)**  
+*returns a hex value with the decreased lightness*
+
+**colorizr.invert()**  
+*returns a hex value with the inverted color*
+
+**colorizr.fade(percentage: number = 10)**  
+*returns a css value with alpha*
+
+### Comparison
+
+**colorizr.compareTo(color: string)**  
+*returns an object with the analysis*
+
+```typescript
+{
+  brightnessDifference: 189.041,
+  colorDifference: 595,
+  compliant: 2,
+  contrast: 10.67,
+  largeAA: true,
+  largeAAA: true,
+  normalAA: true,
+  normalAAA: true,
+}
+```
+
+## Helpers
+
+**brightnessDifference**  
+*get the brightness difference between 2 colors*
+
+**colorDifference**  
+*get the color difference between 2 colors*
+
+**contrast**   
+*get the color contrast between 2 colors*
+
+**harmony**  
+*get the harmony scheme for a color*
+
+hex2hsl
+hex2rgb
+hsl2hex
+hsl2rgb
+hue2rgb
+luminance
+palette
+parse-css
+parse-hex
+random
+rgb2hex
+rgb2hsl
+rotate
+shift
+text-color
+valid-hex
+wcag
+
+## References
 [calculating-color-contrast](https://24ways.org/2010/calculating-color-contrast/)  
 [Colour Contrast Check](https://snook.ca/technical/colour_contrast/colour.html)    
-[Contrast Checker](https://webaim.org/resources/contrastchecker/)  
+[Contrast Checker](https://webaim.org/resources/contrastchecker/)  

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

178565

increased by115.03%

Dev dependency count

24

decreased by-36.84%

Number of package files

178

increased by1877.78%

Lines of code

3567

increased by34.4%

Number of lines in readme file

151

increased by91.14%

Worsened metrics

Number of low quality alerts

2

increased by100%

Number of medium supply chain risk alerts

1

increased byInfinity%

No dependency changes