css-color-parser-h 1.0.5 → 2.0.1

package/dist/css-color-parser-h.common.js

@@ -0,0 +1,567 @@
+/******/ (function() { // webpackBootstrap
+/******/ 	"use strict";
+/******/ 	// The require scope
+/******/ 	var __webpack_require__ = {};
+/******/ 	
+/************************************************************************/
+/******/ 	/* webpack/runtime/compat get default export */
+/******/ 	!function() {
+/******/ 		// getDefaultExport function for compatibility with non-harmony modules
+/******/ 		__webpack_require__.n = function(module) {
+/******/ 			var getter = module && module.__esModule ?
+/******/ 				function() { return module['default']; } :
+/******/ 				function() { return module; };
+/******/ 			__webpack_require__.d(getter, { a: getter });
+/******/ 			return getter;
+/******/ 		};
+/******/ 	}();
+/******/ 	
+/******/ 	/* webpack/runtime/define property getters */
+/******/ 	!function() {
+/******/ 		// define getter functions for harmony exports
+/******/ 		__webpack_require__.d = function(exports, definition) {
+/******/ 			for(var key in definition) {
+/******/ 				if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
+/******/ 					Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
+/******/ 				}
+/******/ 			}
+/******/ 		};
+/******/ 	}();
+/******/ 	
+/******/ 	/* webpack/runtime/hasOwnProperty shorthand */
+/******/ 	!function() {
+/******/ 		__webpack_require__.o = function(obj, prop) { return Object.prototype.hasOwnProperty.call(obj, prop); }
+/******/ 	}();
+/******/ 	
+/******/ 	/* webpack/runtime/make namespace object */
+/******/ 	!function() {
+/******/ 		// define __esModule on exports
+/******/ 		__webpack_require__.r = function(exports) {
+/******/ 			if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
+/******/ 				Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+/******/ 			}
+/******/ 			Object.defineProperty(exports, '__esModule', { value: true });
+/******/ 		};
+/******/ 	}();
+/******/ 	
+/************************************************************************/
+var __webpack_exports__ = {};
+// ESM COMPAT FLAG
+__webpack_require__.r(__webpack_exports__);
+
+// EXPORTS
+__webpack_require__.d(__webpack_exports__, {
+  "default": function() { return /* binding */ main; }
+});
+
+// NAMESPACE OBJECT: ./src/utils/parsers.ts
+var parsers_namespaceObject = {};
+__webpack_require__.r(parsers_namespaceObject);
+__webpack_require__.d(parsers_namespaceObject, {
+  "fromArray": function() { return fromArray; },
+  "fromColorStr": function() { return fromColorStr; },
+  "fromHSL": function() { return fromHSL; },
+  "fromHWB": function() { return fromHWB; },
+  "fromJson": function() { return fromJson; },
+  "fromRandom": function() { return fromRandom; },
+  "parseCssColorStr": function() { return parseCssColorStr; },
+  "parseHEX": function() { return parseHEX; },
+  "parseHSLA": function() { return parseHSLA; },
+  "parseHWB": function() { return parseHWB; },
+  "parseKeyWord": function() { return parseKeyWord; },
+  "parseRGBA": function() { return parseRGBA; }
+});
+
+;// CONCATENATED MODULE: external "tslib"
+var external_tslib_namespaceObject = require("tslib");
+;// CONCATENATED MODULE: ./src/utils/common.ts
+var Check = /** @class */ (function () {
+    function Check() {
+    }
+    Check.type = function (type, paramName, value) {
+        var valueType = typeof value;
+        if (valueType !== type) {
+            throw new Error("Expected ".concat(paramName, " to be typeof ").concat(type, ", actual typeof was ").concat(valueType));
+        }
+    };
+    Check.types = function (types, paramName, value) {
+        var valueType = typeof value;
+        var isContained = types.includes(valueType);
+        if (!isContained) {
+            throw new Error("Expected ".concat(paramName, " to be typeof ").concat(types.join('|'), ", actual typeof was ").concat(valueType));
+        }
+    };
+    return Check;
+}());
+
+var ColorJson = /** @class */ (function () {
+    function ColorJson() {
+    }
+    return ColorJson;
+}());
+
+function defaultValue(v, defaultV) {
+    if (v === undefined || v === null) {
+        return defaultV;
+    }
+    if (isNaN(v) && typeof defaultV === 'number') {
+        return defaultV;
+    }
+    return v;
+}
+function limitNumber(min, max, v) {
+    if (v > max) {
+        v = max;
+    }
+    else if (v < min) {
+        v = min;
+    }
+    return v;
+}
+function setNumberPrecision(number, precision) {
+    return Number(number.toFixed(precision));
+}
+
+;// CONCATENATED MODULE: ./src/CssColorParser.ts
+/*
+ * @Descripttion: 颜色解析器
+ * @version: 1.0.0
+ * @Author: roman_123
+ * @Date: 2021-01-19 09:22:11
+ * @LastEditors: Please set LastEditors
+ * @LastEditTime: 2023-05-26 11:20:17
+ */
+
+var CssColorParser = /** @class */ (function () {
+    function CssColorParser(red, green, blue, alpha) {
+        this.r = 255;
+        this.g = 255;
+        this.b = 255;
+        this.a = 1;
+        this.setColor(red, green, blue, alpha);
+    }
+    /**
+     * 设置颜色
+     * @param red
+     * @param green
+     * @param blue
+     * @param alpha
+     * @example: this.setColor(255,255,255,1)
+     */
+    CssColorParser.prototype.setColor = function (red, green, blue, alpha) {
+        this.r = limitNumber(0, 255, defaultValue(Number(red), 0));
+        this.g = limitNumber(0, 255, defaultValue(Number(green), 0));
+        this.b = limitNumber(0, 255, defaultValue(Number(blue), 0));
+        this.a = limitNumber(0, 1, defaultValue(Number(alpha), 1));
+    };
+    /**
+     * @description: 返回rgba格式的css字符串
+     * @return {*}
+     * @author: roman_123
+     */
+    CssColorParser.prototype.toRGBA = function () {
+        var color = this.toJson();
+        if (color.a === 1) {
+            return "rgb(".concat(color.r, ",").concat(color.g, ",").concat(color.b, ")");
+        }
+        return "rgba(".concat(color.r, ",").concat(color.g, ",").concat(color.b, ",").concat(color.a, ")");
+    };
+    /**
+     * @description: 返回字符串
+     * @return {*}
+     * @author: roman_123
+     */
+    CssColorParser.prototype.toString = function () {
+        return this.toRGBA();
+    };
+    /**
+     * @description: 归一化
+     * @return {*}
+     * @author: roman_123
+     */
+    CssColorParser.prototype.toNormalize = function () {
+        return {
+            r: setNumberPrecision(this.r / 255, 2),
+            g: setNumberPrecision(this.g / 255, 2),
+            b: setNumberPrecision(this.b / 255, 2),
+            a: setNumberPrecision(this.a, 2)
+        };
+    };
+    /**
+     * @description: 返回16进制格式的css字符串
+     * @return {*}
+     * @author: roman_123
+     */
+    CssColorParser.prototype.toHEX = function () {
+        var color = this.toJson();
+        var r = color.r.toString(16);
+        if (r.length < 2) {
+            r = "0".concat(r);
+        }
+        var g = color.g.toString(16);
+        if (g.length < 2) {
+            g = "0".concat(g);
+        }
+        var b = color.b.toString(16);
+        if (b.length < 2) {
+            b = "0".concat(b);
+        }
+        // 由于tojson后a会丢失精度，此处使用this.a
+        if (this.a < 1) {
+            var hexAlpha = parseInt((this.a * 255).toFixed()).toString(16);
+            if (hexAlpha.length < 2) {
+                hexAlpha = "0".concat(hexAlpha);
+            }
+            return "#".concat(r).concat(g).concat(b).concat(hexAlpha);
+        }
+        return "#".concat(r).concat(g).concat(b);
+    };
+    /**
+     * @description: 返回rgba数组
+     * @return {*}
+     * @author: roman_123
+     */
+    CssColorParser.prototype.toArray = function () {
+        var color = this.toJson();
+        return [color.r, color.g, color.b, color.a];
+    };
+    /**
+     * @description: 返回ColorJson
+     * @return {*}
+     * @author: roman_123
+     */
+    CssColorParser.prototype.toJson = function () {
+        return {
+            r: parseInt(this.r.toFixed()),
+            g: parseInt(this.g.toFixed()),
+            b: parseInt(this.b.toFixed()),
+            a: parseFloat(this.a.toFixed(2))
+        };
+    };
+    /**
+     * @description: 拷贝
+     * @return {*}
+     * @author: roman_123
+     */
+    CssColorParser.prototype.clone = function () {
+        return new CssColorParser(this.r, this.g, this.b, this.a);
+    };
+    /**
+     * @description: 比较两个解析对象的数据是否相等
+     * @param {*} color
+     * @return {*}
+     * @author: roman_123
+     */
+    CssColorParser.prototype.equals = function (color) {
+        if (this === color) {
+            return true;
+        }
+        else {
+            return (this.r === color.r &&
+                this.g === color.g &&
+                this.b === color.g &&
+                this.a === color.a);
+        }
+    };
+    return CssColorParser;
+}());
+/* harmony default export */ var src_CssColorParser = (CssColorParser);
+
+;// CONCATENATED MODULE: ./src/utils/color-tools.ts
+
+/*
+ * @Author: roman_123
+ * @Description: 部分核心代码修改自cesium
+ * @Date: 2022-11-28 17:32:57
+ * @LastEditTime: 2022-12-06 00:02:21
+ */
+var CssColorStringParser = /** @class */ (function () {
+    function CssColorStringParser() {
+    }
+    // 去除字符串内所有空格
+    CssColorStringParser.clearStrSpace = function (v) {
+        return v.replace(/\s/g, '');
+    };
+    // 去除字符串两边空格,将中间多个空格合并为一个
+    CssColorStringParser.trimStr = function (v) {
+        v = v.replace(/\s+/g, ' ');
+        return v.trim();
+    };
+    // 解析3位16进制 #fff #fff0 
+    CssColorStringParser.parse3BitsHEX = function (v) {
+        var regx = /^#([0-9a-f])([0-9a-f])([0-9a-f])([0-9a-f])?$/i;
+        var res = regx.exec(v);
+        if (res) {
+            var res4 = defaultValue(res[4], 'f');
+            var r = CssColorStringParser._parseResStrForRgb(parseInt(res[1] + res[1], 16));
+            var g = CssColorStringParser._parseResStrForRgb(parseInt(res[2] + res[2], 16));
+            var b = CssColorStringParser._parseResStrForRgb(parseInt(res[3] + res[3], 16));
+            var a = CssColorStringParser._parsePercent(parseInt(res4 + res4, 16) / 255);
+            return [r, g, b, a];
+        }
+        return null;
+    };
+    // 解析6位16进制 #ffffff #ffffff00
+    CssColorStringParser.parse6BitsHEX = function (v) {
+        var regx = /^#([0-9a-f]{2})([0-9a-f]{2})([0-9a-f]{2})([0-9a-f]{2})?$/i;
+        var res = regx.exec(v);
+        if (res) {
+            var res4 = defaultValue(res[4], 'ff');
+            var r = CssColorStringParser._parseResStrForRgb(parseInt(res[1], 16));
+            var g = CssColorStringParser._parseResStrForRgb(parseInt(res[2], 16));
+            var b = CssColorStringParser._parseResStrForRgb(parseInt(res[3], 16));
+            var a = CssColorStringParser._parsePercent(parseInt(res4, 16) / 255.0);
+            return [r, g, b, a];
+        }
+        return null;
+    };
+    // 解析rgb rgba  rgb(255,255,255) rgba(255,255,255,1) rgba(100%,100%,100%, 1)
+    CssColorStringParser.parseRGBA = function (v) {
+        var regx = /^rgba?\(([0-9.]+%?),([0-9.]+%?),([0-9.]+%?)(?:,([0-9.]+%?))?\)$/i;
+        var res = regx.exec(v);
+        if (res) {
+            var r = CssColorStringParser._parseResStrForRgb(res[1]);
+            var g = CssColorStringParser._parseResStrForRgb(res[2]);
+            var b = CssColorStringParser._parseResStrForRgb(res[3]);
+            var a = CssColorStringParser._parsePercent(res[4]);
+            return [r, g, b, a];
+        }
+        return null;
+    };
+    // 解析hsl hsla  hsl(360,100%,100%) hsla(360,100%,100%,1)
+    CssColorStringParser.parseHSLA = function (v) {
+        var regx = /^hsla?\(([0-9.]+)(?:deg)?,([0-9.]+%?),([0-9.]+%?)(?:,([0-9.]+%?))?\)$/i;
+        var res = regx.exec(v);
+        if (res) {
+            var h = CssColorStringParser._parseResStrForHue(res[1]);
+            var s = CssColorStringParser._parsePercent(res[2]);
+            var l = CssColorStringParser._parsePercent(res[3]);
+            var a = CssColorStringParser._parsePercent(res[4]);
+            return [h, s, l, a];
+        }
+        return null;
+    };
+    // 解析hwb
+    CssColorStringParser.parseHWB = function (v) {
+        var regx = /^hwb\s?\(\s?([0-9.]+)(?:deg)?\s([0-9.]+%?)\s([0-9.]+%?)\s?(?:\/\s?([0-9.]+%?))?\s?\)$/i;
+        var res = regx.exec(v);
+        if (res) {
+            var h = CssColorStringParser._parseResStrForHue(res[1]);
+            var w = CssColorStringParser._parsePercent(res[2]);
+            var b = CssColorStringParser._parsePercent(res[3]);
+            var a = CssColorStringParser._parsePercent(res[4]);
+            return [h, w, b, a];
+        }
+        return null;
+    };
+    // 解析rgb rgb(178 57 57 / 44%) 字符串中存在空格，因此使用清除两侧空格的原始字符串
+    CssColorStringParser.parseRGBA2 = function (v) {
+        var regx = /^rgba?\s?\(\s?([0-9.]+%?)\s?([0-9.]+%?)\s?([0-9.]+%?)(?:\s?\/\s?([0-9.]+%?))?\s?\)$/i;
+        var res = regx.exec(v);
+        if (res) {
+            var r = CssColorStringParser._parseResStrForRgb(res[1]);
+            var g = CssColorStringParser._parseResStrForRgb(res[2]);
+            var b = CssColorStringParser._parseResStrForRgb(res[3]);
+            var a = CssColorStringParser._parsePercent(res[4]);
+            return [r, g, b, a];
+        }
+        return null;
+    };
+    // 解析hsl hsl(215 85% 62% / 1)
+    CssColorStringParser.parseHSLA2 = function (v) {
+        var regx = /^hsla?\s?\(\s?([0-9.]+)(?:deg)?\s([0-9.]+%?)\s([0-9.]+%?)\s?(?:\/\s?([0-9.]+%?))?\s?\)$/i;
+        var res = regx.exec(v);
+        if (res) {
+            var h = CssColorStringParser._parseResStrForHue(res[1]);
+            var s = CssColorStringParser._parsePercent(res[2]);
+            var l = CssColorStringParser._parsePercent(res[3]);
+            var a = CssColorStringParser._parsePercent(res[4]);
+            return [h, s, l, a];
+        }
+        return null;
+    };
+    // 将结果解析为数字
+    CssColorStringParser._parseResStrForRgb = function (v) {
+        if (typeof v === 'string') {
+            v = parseFloat(v) / ('%' === v.substr(-1) ? 100.0 / 255 : 1);
+        }
+        if (isNaN(v)) {
+            v = 1;
+        }
+        return limitNumber(0, 255, v);
+    };
+    CssColorStringParser._parseResStrForHue = function (v) {
+        if (typeof v === 'string') {
+            v = parseFloat(v);
+        }
+        if (isNaN(v)) {
+            v = 0;
+        }
+        return limitNumber(0, 360, v);
+    };
+    CssColorStringParser._parsePercent = function (v) {
+        if (typeof v === 'string') {
+            v = parseFloat(v) / ('%' === v.substr(-1) ? 100.0 : 1);
+        }
+        if (isNaN(v)) {
+            v = 1;
+        }
+        return limitNumber(0, 1, v);
+    };
+    return CssColorStringParser;
+}());
+
+
+;// CONCATENATED MODULE: external "color-convert"
+var external_color_convert_namespaceObject = require("color-convert");
+var external_color_convert_default = /*#__PURE__*/__webpack_require__.n(external_color_convert_namespaceObject);
+;// CONCATENATED MODULE: ./src/utils/parsers.ts
+
+
+
+
+function parseKeyWord(v) {
+    var cssStr = CssColorStringParser.clearStrSpace(v);
+    var res = external_color_convert_default().keyword.rgb(cssStr);
+    return res && fromArray(res);
+}
+function parseHEX(v) {
+    var cssStr = CssColorStringParser.clearStrSpace(v);
+    var res = CssColorStringParser.parse3BitsHEX(cssStr);
+    if (!res) {
+        res = CssColorStringParser.parse6BitsHEX(cssStr);
+    }
+    return res && fromArray(res);
+}
+function parseRGBA(v) {
+    var cssStr = CssColorStringParser.clearStrSpace(v);
+    var res = CssColorStringParser.parseRGBA(cssStr);
+    if (!res) {
+        var cssStr2 = CssColorStringParser.trimStr(v);
+        res = CssColorStringParser.parseRGBA2(cssStr2);
+    }
+    return res && fromArray(res);
+}
+function parseHSLA(v) {
+    var cssStr = CssColorStringParser.clearStrSpace(v);
+    var res = CssColorStringParser.parseHSLA(cssStr);
+    if (!res) {
+        var cssStr2 = CssColorStringParser.trimStr(v);
+        res = CssColorStringParser.parseHSLA2(cssStr2);
+    }
+    return res && fromHSL(res[0], res[1], res[2], res[3]);
+}
+function parseHWB(v) {
+    var cssStr2 = CssColorStringParser.trimStr(v);
+    var res = CssColorStringParser.parseHWB(cssStr2);
+    return res && fromHWB(res[0], res[1], res[2], res[3]);
+}
+/**
+ * @description: 将css字符串转换为解析对象
+ * @param {string} v
+ * @return {CssColorParser}
+ * @example: parseCssColorStr('rgba(255,255,255,1)')
+ */
+function parseCssColorStr(v) {
+    Check.type('string', 'color', v);
+    return parseHEX(v) || parseRGBA(v) || parseKeyWord(v) || parseHSLA(v) || parseHWB(v);
+}
+/**
+ * **Deprecated method.** Use `parseCssColorStr()` instead.
+ * @description: since 2.0.1
+ * @deprecated
+ * @param {string} v
+ * @return {CssColorParser}
+ * @example: fromColorStr('rgba(255,255,255,1)')
+ */
+function fromColorStr(v) {
+    Check.type('string', 'color', v);
+    return parseHEX(v) || parseRGBA(v) || parseKeyWord(v) || parseHSLA(v) || parseHWB(v);
+}
+/**
+ * @description: 将HSL色彩模式转换为解析对象
+ * @param {number} hue 色相
+ * @param {number} saturation 饱和度
+ * @param {number} lightness 亮度
+ * @param {number} alpha 不透明度
+ * @return {CssColorParser}
+ * @example: fromHSL(0,1,1,1)
+ */
+function fromHSL(h, s, l, a) {
+    var res = external_color_convert_default().hsl.rgb(limitNumber(0, 360, h), limitNumber(0, 100, s * 100), limitNumber(0, 100, l * 100));
+    return new src_CssColorParser(res[0], res[1], res[2], defaultValue(Number(a), 1));
+}
+/**
+ * @description: 将HWB色彩模式转换为解析对象
+ * @param {number} h 色调
+ * @param {number} w 白度
+ * @param {number} b 黑度
+ * @param {number} a 不透明度
+ * @return {CssColorParser}
+ * @example: fromHSL(0,1,1,1)
+ */
+function fromHWB(h, w, b, a) {
+    var res = external_color_convert_default().hwb.rgb(limitNumber(0, 360, h), limitNumber(0, 100, w * 100), limitNumber(0, 100, b * 100));
+    return new src_CssColorParser(res[0], res[1], res[2], defaultValue(Number(a), 1));
+}
+/**
+   * @description: 从解析器中产生随机颜色
+   * @return {CssColorParser}
+   * @author: roman_123
+   */
+function fromRandom(color1, color2) {
+    if (typeof color1 === 'string') {
+        color1 = parseCssColorStr(color1);
+    }
+    if (typeof color2 === 'string') {
+        color2 = parseCssColorStr(color2);
+    }
+    if (!color1 || !color2) {
+        throw new Error('fail to create object from random');
+    }
+    var r = Math.random() * Math.abs(color2.r - color1.r) +
+        Math.min(color1.r, color2.r);
+    var g = Math.random() * Math.abs(color2.g - color1.g) +
+        Math.min(color1.g, color2.g);
+    var b = Math.random() * Math.abs(color2.b - color1.b) +
+        Math.min(color1.b, color2.b);
+    var a = Math.random() * Math.abs(color2.a - color1.a) +
+        Math.min(color1.a, color2.a);
+    return new src_CssColorParser(r, g, b, a);
+}
+/**
+ * @description: 将ColorJson格式的json数据转换为解析对象
+ * @param {ColorJson} json
+ * @return {CssColorParser}
+ * @author: roman_123
+ */
+function fromJson(json) {
+    return new src_CssColorParser(json.r, json.g, json.b, json.a);
+}
+/**
+ * @description: 将rgba数组转换为解析对象
+ * @param {Array} color
+ * @return {CssColorParser}
+ * @author: roman_123
+ */
+function fromArray(color) {
+    return new src_CssColorParser(color[0], color[1], color[2], color[3]);
+}
+
+;// CONCATENATED MODULE: ./src/main.ts
+
+/*
+ * @Author: roman_123
+ * @Description:
+ * @Date: 2023-05-25 17:45:22
+ * @LastEditTime: 2023-05-26 15:01:18
+ */
+
+
+/* harmony default export */ var main = ((0,external_tslib_namespaceObject.__assign)({ CssColorParser: src_CssColorParser }, parsers_namespaceObject));
+
+var __webpack_export_target__ = exports;
+for(var i in __webpack_exports__) __webpack_export_target__[i] = __webpack_exports__[i];
+if(__webpack_exports__.__esModule) Object.defineProperty(__webpack_export_target__, "__esModule", { value: true });
+/******/ })()
+;