@zcrkey/js-utils 0.0.6 → 0.0.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/color.d.ts +195 -0
- package/dist/cjs/color.js +353 -0
- package/dist/cjs/index.d.ts +5 -4
- package/dist/cjs/index.js +7 -4
- package/dist/cjs/{objUtil.js → obj.js} +4 -4
- package/dist/cjs/{treeUtil.js → tree.js} +4 -4
- package/dist/cjs/util.d.ts +3 -3
- package/dist/cjs/util.js +3 -3
- package/dist/esm/color.d.ts +195 -0
- package/dist/esm/color.js +500 -0
- package/dist/esm/index.d.ts +5 -4
- package/dist/esm/index.js +4 -3
- package/dist/esm/{objUtil.js → obj.js} +6 -6
- package/dist/esm/util.d.ts +3 -3
- package/dist/esm/util.js +129 -129
- package/dist/umd/index.umd.js +1 -1
- package/package.json +1 -1
- /package/dist/cjs/{objUtil.d.ts → obj.d.ts} +0 -0
- /package/dist/cjs/{treeUtil.d.ts → tree.d.ts} +0 -0
- /package/dist/esm/{objUtil.d.ts → obj.d.ts} +0 -0
- /package/dist/esm/{treeUtil.d.ts → tree.d.ts} +0 -0
- /package/dist/esm/{treeUtil.js → tree.js} +0 -0
|
@@ -0,0 +1,195 @@
|
|
|
1
|
+
export default class CrColorUtil {
|
|
2
|
+
/**
|
|
3
|
+
* hex 转 rgb 数组 [r,g,b] r/g/b范围 0-255
|
|
4
|
+
* @param hex 支持 #fff / #ffffff / fff / ffffff 格式
|
|
5
|
+
*/
|
|
6
|
+
static hexToRgb(hex: string): number[];
|
|
7
|
+
/**
|
|
8
|
+
* rgb 转 hex 标准格式
|
|
9
|
+
* @param r 0-255
|
|
10
|
+
* @param g 0-255
|
|
11
|
+
* @param b 0-255
|
|
12
|
+
*/
|
|
13
|
+
static rgbToHex(r: number, g: number, b: number): string;
|
|
14
|
+
/**
|
|
15
|
+
* 将 rgb 格式转为 hsv 格式
|
|
16
|
+
* input: r,g,b in [0,1], out: h in [0,360) and s,v in [0,1]
|
|
17
|
+
* @param r 0-1
|
|
18
|
+
* @param g 0-1
|
|
19
|
+
* @param b 0-1
|
|
20
|
+
*/
|
|
21
|
+
static rgb2hsv(r: number, g: number, b: number): number[];
|
|
22
|
+
/**
|
|
23
|
+
* 将 hsv 格式转为 rgb 格式
|
|
24
|
+
* input: h in [0,360] and s,v in [0,1] - output: r,g,b in [0,1]
|
|
25
|
+
* @param h 0-360
|
|
26
|
+
* @param s 0-1
|
|
27
|
+
* @param v 0-1
|
|
28
|
+
*/
|
|
29
|
+
static hsv2rgb(h: number, s: number, v: number): number[];
|
|
30
|
+
/**
|
|
31
|
+
* hex 转 rgba 格式字符串 可直接用于css
|
|
32
|
+
* @param hex 支持 #fff / #ffffff / fff / ffffff 格式
|
|
33
|
+
* @param alpha 透明度 0-1 默认1(完全不透明)
|
|
34
|
+
* @returns 例: rgba(255,255,255,0.5)
|
|
35
|
+
*/
|
|
36
|
+
static hexToRgba(hex: string, alpha?: number): string;
|
|
37
|
+
/**
|
|
38
|
+
* 给hex颜色添加透明度,返回 8位带透明通道的hex格式 #RRGGBBAA (CSS常用)
|
|
39
|
+
* @param hex 支持 #fff / #ffffff / fff / ffffff 格式
|
|
40
|
+
* @param alpha 透明度 0-1 默认1(完全不透明)
|
|
41
|
+
* @returns 例: #ffffff80 #ff000033
|
|
42
|
+
*/
|
|
43
|
+
static hexAddAlpha(hex: string, alpha?: number): string;
|
|
44
|
+
/**
|
|
45
|
+
* rgba 转 hex 格式
|
|
46
|
+
* @param r 0-255
|
|
47
|
+
* @param g 0-255
|
|
48
|
+
* @param b 0-255
|
|
49
|
+
*/
|
|
50
|
+
static rgbaToHex(r: number, g: number, b: number): string;
|
|
51
|
+
/**
|
|
52
|
+
* hsv 转 hex 十六进制颜色
|
|
53
|
+
* @param h 色相 0-360
|
|
54
|
+
* @param s 饱和度 0-1
|
|
55
|
+
* @param v 明度 0-1
|
|
56
|
+
*/
|
|
57
|
+
static hsvToHex(h: number, s: number, v: number): string;
|
|
58
|
+
/**
|
|
59
|
+
* hex 转 hsv 格式
|
|
60
|
+
* @param hex 支持 #fff / #ffffff / fff / ffffff 格式
|
|
61
|
+
* @returns [h:0-360, s:0-1, v:0-1]
|
|
62
|
+
*/
|
|
63
|
+
static hexToHsv(hex: string): number[];
|
|
64
|
+
/**
|
|
65
|
+
* 颜色加深处理 - 基于hex颜色
|
|
66
|
+
* @param hex 支持 #fff / #ffffff / fff / ffffff 格式
|
|
67
|
+
* @param level 加深程度 0-1 0不变 1最深(接近黑色)
|
|
68
|
+
*/
|
|
69
|
+
static darkenColor(hex: string, level: number): string;
|
|
70
|
+
/**
|
|
71
|
+
* 颜色减淡/提亮处理 - 基于hex颜色
|
|
72
|
+
* @param hex 支持 #fff / #ffffff / fff / ffffff 格式
|
|
73
|
+
* @param level 减淡程度 0-1 0不变 1最亮(接近白色)
|
|
74
|
+
*/
|
|
75
|
+
static lightenColor(hex: string, level: number): string;
|
|
76
|
+
/**
|
|
77
|
+
* 解析8位带透明的hex #RRGGBBAA 为 普通hex + 透明度
|
|
78
|
+
* @param hex8 8位带透明的十六进制颜色 例:#ffffff80
|
|
79
|
+
* @returns { hex: '#ffffff', alpha: 0.5 }
|
|
80
|
+
*/
|
|
81
|
+
static parseHex8(hex8: string): {
|
|
82
|
+
hex: string;
|
|
83
|
+
alpha: number;
|
|
84
|
+
};
|
|
85
|
+
/**
|
|
86
|
+
* rgb 数组 转 rgb/rgba 字符串
|
|
87
|
+
* @param rgb [r,g,b] 0-255
|
|
88
|
+
* @param alpha 透明度0-1 传则返回rgba,不传返回rgb
|
|
89
|
+
*/
|
|
90
|
+
static rgbToStr(rgb: number[], alpha?: number): string;
|
|
91
|
+
/**
|
|
92
|
+
* Hex颜色字符串 转 十进制数值(6位纯颜色值,无透明通道,专用于颜色运算)
|
|
93
|
+
* @param hex 支持 #fff / #ffffff / fff / ffffff 格式
|
|
94
|
+
* @returns 十进制数值 例:#ff0000 → 16711680,非法入参返回 0
|
|
95
|
+
*/
|
|
96
|
+
static hexToNumber(hex: string): number;
|
|
97
|
+
/**
|
|
98
|
+
* 十进制数值 转回 Hex颜色字符串(无透明通道 标准6位)
|
|
99
|
+
* @param num 十进制数值 例:16711680 → #ff0000
|
|
100
|
+
* @returns 标准6位十六进制颜色 #RRGGBB 格式
|
|
101
|
+
*/
|
|
102
|
+
static numberToHex(num: number): string;
|
|
103
|
+
/**
|
|
104
|
+
* ARGB颜色字符串 转 十进制数值(8位带透明通道,专用于带透明的颜色运算)
|
|
105
|
+
* @param argb 支持 #AARRGGBB / AARRGGBB 格式 例:#80FFFFFF、80FFFFFF
|
|
106
|
+
* @returns 十进制数值 例:#80FFFFFF → 2147483647,非法入参/格式错误返回 0
|
|
107
|
+
*/
|
|
108
|
+
static argbToNumber(argb: string): number;
|
|
109
|
+
/**
|
|
110
|
+
* 十进制数值 转回 ARGB颜色字符串(8位带透明通道,标准#AARRGGBB格式)
|
|
111
|
+
* @param num 十进制数值 例:2147483647 → #80ffffff
|
|
112
|
+
* @returns 标准ARGB颜色字符串 #AARRGGBB 小写格式
|
|
113
|
+
*/
|
|
114
|
+
static numberToArgb(num: number): string;
|
|
115
|
+
/**
|
|
116
|
+
* 生成随机Hex颜色
|
|
117
|
+
* @param withSharp 是否带#号 默认为true
|
|
118
|
+
* @returns 随机hex颜色
|
|
119
|
+
*/
|
|
120
|
+
static randomHexColor(withSharp?: boolean): string;
|
|
121
|
+
/**
|
|
122
|
+
* 反色处理 - 取颜色的补色(比如黑色→白色,白色→黑色)
|
|
123
|
+
* @param hex 目标颜色
|
|
124
|
+
* @returns 反色hex
|
|
125
|
+
*/
|
|
126
|
+
static reverseColor(hex: string): string;
|
|
127
|
+
/**
|
|
128
|
+
* 校验是否为合法的hex颜色
|
|
129
|
+
* @param hex 待校验的颜色字符串
|
|
130
|
+
* @returns true=合法 false=不合法
|
|
131
|
+
*/
|
|
132
|
+
static isHexColor(hex: string): boolean;
|
|
133
|
+
/**
|
|
134
|
+
* 标准6位Hex颜色 转 ARGB 8位颜色格式 ( 核心:ARGB格式是 #AARRGGBB )
|
|
135
|
+
* @param hex 6位标准hex 支持 #ffffff / ffffff / #fff / fff
|
|
136
|
+
* @param alpha 透明度 0~1 默认 1 (完全不透明)
|
|
137
|
+
* @returns 8位ARGB格式颜色 例:#80FFFFFF 半透明白色
|
|
138
|
+
*/
|
|
139
|
+
static hexToArgb(hex: string, alpha?: number): string;
|
|
140
|
+
/**
|
|
141
|
+
* ARGB 8位颜色格式 转回 标准6位Hex颜色 + 独立的透明度值 ( 反向解析 )
|
|
142
|
+
* @param argb 8位ARGB格式颜色 必须是 #AARRGGBB 格式 例:#80FFFFFF
|
|
143
|
+
* @returns { hex: '#ffffff', alpha: 0.5 } 标准hex + 0~1的透明度
|
|
144
|
+
*/
|
|
145
|
+
static argbToHex(argb: string): {
|
|
146
|
+
hex: string;
|
|
147
|
+
alpha: number;
|
|
148
|
+
};
|
|
149
|
+
/**
|
|
150
|
+
* ARGB格式(#AARRGGBB) 转 RRGGBBAA格式(#RRGGBBAA)
|
|
151
|
+
* @param argb #AARRGGBB
|
|
152
|
+
* @returns #RRGGBBAA
|
|
153
|
+
*/
|
|
154
|
+
static argbToRgbaHex(argb: string): string;
|
|
155
|
+
/**
|
|
156
|
+
* RRGGBBAA格式(#RRGGBBAA) 转 ARGB格式(#AARRGGBB)
|
|
157
|
+
* @param rgbaHex #RRGGBBAA
|
|
158
|
+
* @returns #AARRGGBB
|
|
159
|
+
*/
|
|
160
|
+
static rgbaHexToArgb(rgbaHex: string): string;
|
|
161
|
+
/**
|
|
162
|
+
* 调整颜色饱和度
|
|
163
|
+
* @param hex 目标颜色
|
|
164
|
+
* @param level 调整程度 0-2 1=不变 <1=降低饱和度 >1=提高饱和度
|
|
165
|
+
* @returns 调整后的hex颜色
|
|
166
|
+
*/
|
|
167
|
+
static adjustSaturation(hex: string, level: number): string;
|
|
168
|
+
/**
|
|
169
|
+
* 调整颜色明度
|
|
170
|
+
* @param hex 目标颜色
|
|
171
|
+
* @param level 调整程度 0-2 1=不变 <1=降低明度 >1=提高明度
|
|
172
|
+
* @returns 调整后的hex颜色
|
|
173
|
+
*/
|
|
174
|
+
static adjustBrightness(hex: string, level: number): string;
|
|
175
|
+
/**
|
|
176
|
+
* 普通6位Hex+透明度 → 直接返回ARGB对应的十进制数值
|
|
177
|
+
* @param hex 支持 #fff / #ffffff 格式
|
|
178
|
+
* @param alpha 透明度 0-1
|
|
179
|
+
* @returns ARGB十进制数值
|
|
180
|
+
*/
|
|
181
|
+
static hexAlphaToArgbNumber(hex: string, alpha?: number): number;
|
|
182
|
+
/**
|
|
183
|
+
* ARGB十进制数值 → 解析出 普通Hex + 0-1透明度
|
|
184
|
+
* @param num ARGB十进制数值
|
|
185
|
+
* @returns { hex: '#ffffff', alpha: 0.5 }
|
|
186
|
+
*/
|
|
187
|
+
static argbNumberToHexAlpha(num: number): {
|
|
188
|
+
hex: string;
|
|
189
|
+
alpha: number;
|
|
190
|
+
};
|
|
191
|
+
/**
|
|
192
|
+
* 补零成两位字符
|
|
193
|
+
*/
|
|
194
|
+
private static twoDigits;
|
|
195
|
+
}
|
|
@@ -0,0 +1,353 @@
|
|
|
1
|
+
var __defProp = Object.defineProperty;
|
|
2
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
3
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
4
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
5
|
+
var __export = (target, all) => {
|
|
6
|
+
for (var name in all)
|
|
7
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
8
|
+
};
|
|
9
|
+
var __copyProps = (to, from, except, desc) => {
|
|
10
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
11
|
+
for (let key of __getOwnPropNames(from))
|
|
12
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
13
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
14
|
+
}
|
|
15
|
+
return to;
|
|
16
|
+
};
|
|
17
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
18
|
+
|
|
19
|
+
// src/color.ts
|
|
20
|
+
var color_exports = {};
|
|
21
|
+
__export(color_exports, {
|
|
22
|
+
default: () => CrColorUtil
|
|
23
|
+
});
|
|
24
|
+
module.exports = __toCommonJS(color_exports);
|
|
25
|
+
var CrColorUtil = class {
|
|
26
|
+
/**
|
|
27
|
+
* hex 转 rgb 数组 [r,g,b] r/g/b范围 0-255
|
|
28
|
+
* @param hex 支持 #fff / #ffffff / fff / ffffff 格式
|
|
29
|
+
*/
|
|
30
|
+
static hexToRgb(hex) {
|
|
31
|
+
let hexVal = hex.replace("#", "");
|
|
32
|
+
if (hexVal.length === 3) {
|
|
33
|
+
hexVal = hexVal.split("").map((c) => c + c).join("");
|
|
34
|
+
}
|
|
35
|
+
const hexInt = parseInt(hexVal, 16);
|
|
36
|
+
const r = hexInt >> 16 & 255;
|
|
37
|
+
const g = hexInt >> 8 & 255;
|
|
38
|
+
const b = hexInt & 255;
|
|
39
|
+
return [r, g, b];
|
|
40
|
+
}
|
|
41
|
+
/**
|
|
42
|
+
* rgb 转 hex 标准格式
|
|
43
|
+
* @param r 0-255
|
|
44
|
+
* @param g 0-255
|
|
45
|
+
* @param b 0-255
|
|
46
|
+
*/
|
|
47
|
+
static rgbToHex(r, g, b) {
|
|
48
|
+
const clamp = (val) => Math.max(0, Math.min(255, Math.round(val)));
|
|
49
|
+
const red = clamp(r);
|
|
50
|
+
const green = clamp(g);
|
|
51
|
+
const blue = clamp(b);
|
|
52
|
+
return "#" + this.twoDigits(red.toString(16)) + this.twoDigits(green.toString(16)) + this.twoDigits(blue.toString(16));
|
|
53
|
+
}
|
|
54
|
+
/**
|
|
55
|
+
* 将 rgb 格式转为 hsv 格式
|
|
56
|
+
* input: r,g,b in [0,1], out: h in [0,360) and s,v in [0,1]
|
|
57
|
+
* @param r 0-1
|
|
58
|
+
* @param g 0-1
|
|
59
|
+
* @param b 0-1
|
|
60
|
+
*/
|
|
61
|
+
static rgb2hsv(r, g, b) {
|
|
62
|
+
let v = Math.max(r, g, b);
|
|
63
|
+
let n = v - Math.min(r, g, b);
|
|
64
|
+
let h = n && (v == r ? (g - b) / n : v == g ? 2 + (b - r) / n : 4 + (r - g) / n);
|
|
65
|
+
return [60 * (h < 0 ? h + 6 : h), v && n / v, v];
|
|
66
|
+
}
|
|
67
|
+
/**
|
|
68
|
+
* 将 hsv 格式转为 rgb 格式
|
|
69
|
+
* input: h in [0,360] and s,v in [0,1] - output: r,g,b in [0,1]
|
|
70
|
+
* @param h 0-360
|
|
71
|
+
* @param s 0-1
|
|
72
|
+
* @param v 0-1
|
|
73
|
+
*/
|
|
74
|
+
static hsv2rgb(h, s, v) {
|
|
75
|
+
let f = (n, k = (n + h / 60) % 6) => v - v * s * Math.max(Math.min(k, 4 - k, 1), 0);
|
|
76
|
+
return [f(5), f(3), f(1)];
|
|
77
|
+
}
|
|
78
|
+
/**
|
|
79
|
+
* hex 转 rgba 格式字符串 可直接用于css
|
|
80
|
+
* @param hex 支持 #fff / #ffffff / fff / ffffff 格式
|
|
81
|
+
* @param alpha 透明度 0-1 默认1(完全不透明)
|
|
82
|
+
* @returns 例: rgba(255,255,255,0.5)
|
|
83
|
+
*/
|
|
84
|
+
static hexToRgba(hex, alpha = 1) {
|
|
85
|
+
const [r, g, b] = this.hexToRgb(hex);
|
|
86
|
+
const validAlpha = Math.max(0, Math.min(1, alpha));
|
|
87
|
+
return `rgba(${r}, ${g}, ${b}, ${validAlpha})`;
|
|
88
|
+
}
|
|
89
|
+
/**
|
|
90
|
+
* 给hex颜色添加透明度,返回 8位带透明通道的hex格式 #RRGGBBAA (CSS常用)
|
|
91
|
+
* @param hex 支持 #fff / #ffffff / fff / ffffff 格式
|
|
92
|
+
* @param alpha 透明度 0-1 默认1(完全不透明)
|
|
93
|
+
* @returns 例: #ffffff80 #ff000033
|
|
94
|
+
*/
|
|
95
|
+
static hexAddAlpha(hex, alpha = 1) {
|
|
96
|
+
let pureHex = hex.replace("#", "");
|
|
97
|
+
pureHex = pureHex.length === 3 ? pureHex.split("").map((char) => char + char).join("") : pureHex;
|
|
98
|
+
const validAlpha = Math.max(0, Math.min(1, alpha));
|
|
99
|
+
const alphaHex = this.twoDigits(Math.round(validAlpha * 255).toString(16));
|
|
100
|
+
return `#${pureHex}${alphaHex}`;
|
|
101
|
+
}
|
|
102
|
+
/**
|
|
103
|
+
* rgba 转 hex 格式
|
|
104
|
+
* @param r 0-255
|
|
105
|
+
* @param g 0-255
|
|
106
|
+
* @param b 0-255
|
|
107
|
+
*/
|
|
108
|
+
static rgbaToHex(r, g, b) {
|
|
109
|
+
return this.rgbToHex(r, g, b);
|
|
110
|
+
}
|
|
111
|
+
/**
|
|
112
|
+
* hsv 转 hex 十六进制颜色
|
|
113
|
+
* @param h 色相 0-360
|
|
114
|
+
* @param s 饱和度 0-1
|
|
115
|
+
* @param v 明度 0-1
|
|
116
|
+
*/
|
|
117
|
+
static hsvToHex(h, s, v) {
|
|
118
|
+
const [r, g, b] = this.hsv2rgb(h, s, v);
|
|
119
|
+
return this.rgbToHex(Math.round(r * 255), Math.round(g * 255), Math.round(b * 255));
|
|
120
|
+
}
|
|
121
|
+
/**
|
|
122
|
+
* hex 转 hsv 格式
|
|
123
|
+
* @param hex 支持 #fff / #ffffff / fff / ffffff 格式
|
|
124
|
+
* @returns [h:0-360, s:0-1, v:0-1]
|
|
125
|
+
*/
|
|
126
|
+
static hexToHsv(hex) {
|
|
127
|
+
const [r, g, b] = this.hexToRgb(hex);
|
|
128
|
+
return this.rgb2hsv(r / 255, g / 255, b / 255);
|
|
129
|
+
}
|
|
130
|
+
/**
|
|
131
|
+
* 颜色加深处理 - 基于hex颜色
|
|
132
|
+
* @param hex 支持 #fff / #ffffff / fff / ffffff 格式
|
|
133
|
+
* @param level 加深程度 0-1 0不变 1最深(接近黑色)
|
|
134
|
+
*/
|
|
135
|
+
static darkenColor(hex, level) {
|
|
136
|
+
const [r, g, b] = this.hexToRgb(hex);
|
|
137
|
+
const clamp = (val) => Math.max(0, Math.min(255, val));
|
|
138
|
+
const darkR = clamp(r - r * level);
|
|
139
|
+
const darkG = clamp(g - g * level);
|
|
140
|
+
const darkB = clamp(b - b * level);
|
|
141
|
+
return this.rgbToHex(darkR, darkG, darkB);
|
|
142
|
+
}
|
|
143
|
+
/**
|
|
144
|
+
* 颜色减淡/提亮处理 - 基于hex颜色
|
|
145
|
+
* @param hex 支持 #fff / #ffffff / fff / ffffff 格式
|
|
146
|
+
* @param level 减淡程度 0-1 0不变 1最亮(接近白色)
|
|
147
|
+
*/
|
|
148
|
+
static lightenColor(hex, level) {
|
|
149
|
+
const [r, g, b] = this.hexToRgb(hex);
|
|
150
|
+
const clamp = (val) => Math.max(0, Math.min(255, val));
|
|
151
|
+
const lightR = clamp(r + (255 - r) * level);
|
|
152
|
+
const lightG = clamp(g + (255 - g) * level);
|
|
153
|
+
const lightB = clamp(b + (255 - b) * level);
|
|
154
|
+
return this.rgbToHex(lightR, lightG, lightB);
|
|
155
|
+
}
|
|
156
|
+
/**
|
|
157
|
+
* 解析8位带透明的hex #RRGGBBAA 为 普通hex + 透明度
|
|
158
|
+
* @param hex8 8位带透明的十六进制颜色 例:#ffffff80
|
|
159
|
+
* @returns { hex: '#ffffff', alpha: 0.5 }
|
|
160
|
+
*/
|
|
161
|
+
static parseHex8(hex8) {
|
|
162
|
+
const pureHex = hex8.replace("#", "");
|
|
163
|
+
if (pureHex.length !== 8)
|
|
164
|
+
return { hex: hex8, alpha: 1 };
|
|
165
|
+
const hex = `#${pureHex.slice(0, 6)}`;
|
|
166
|
+
const alphaHex = pureHex.slice(6);
|
|
167
|
+
const alpha = Math.round(parseInt(alphaHex, 16) / 255 * 100) / 100;
|
|
168
|
+
return { hex, alpha };
|
|
169
|
+
}
|
|
170
|
+
/**
|
|
171
|
+
* rgb 数组 转 rgb/rgba 字符串
|
|
172
|
+
* @param rgb [r,g,b] 0-255
|
|
173
|
+
* @param alpha 透明度0-1 传则返回rgba,不传返回rgb
|
|
174
|
+
*/
|
|
175
|
+
static rgbToStr(rgb, alpha) {
|
|
176
|
+
const [r, g, b] = rgb;
|
|
177
|
+
return alpha !== void 0 ? `rgba(${r}, ${g}, ${b}, ${Math.max(0, Math.min(1, alpha))})` : `rgb(${r}, ${g}, ${b})`;
|
|
178
|
+
}
|
|
179
|
+
/**
|
|
180
|
+
* Hex颜色字符串 转 十进制数值(6位纯颜色值,无透明通道,专用于颜色运算)
|
|
181
|
+
* @param hex 支持 #fff / #ffffff / fff / ffffff 格式
|
|
182
|
+
* @returns 十进制数值 例:#ff0000 → 16711680,非法入参返回 0
|
|
183
|
+
*/
|
|
184
|
+
static hexToNumber(hex) {
|
|
185
|
+
const pureHex = hex.replace("#", "");
|
|
186
|
+
if (!/^[0-9a-fA-F]{3}|[0-9a-fA-F]{6}$/.test(pureHex)) {
|
|
187
|
+
return 0;
|
|
188
|
+
}
|
|
189
|
+
return parseInt(pureHex, 16);
|
|
190
|
+
}
|
|
191
|
+
/**
|
|
192
|
+
* 十进制数值 转回 Hex颜色字符串(无透明通道 标准6位)
|
|
193
|
+
* @param num 十进制数值 例:16711680 → #ff0000
|
|
194
|
+
* @returns 标准6位十六进制颜色 #RRGGBB 格式
|
|
195
|
+
*/
|
|
196
|
+
static numberToHex(num) {
|
|
197
|
+
const r = this.twoDigits((num >> 16 & 255).toString(16));
|
|
198
|
+
const g = this.twoDigits((num >> 8 & 255).toString(16));
|
|
199
|
+
const b = this.twoDigits((num & 255).toString(16));
|
|
200
|
+
return `#${r}${g}${b}`;
|
|
201
|
+
}
|
|
202
|
+
/**
|
|
203
|
+
* ARGB颜色字符串 转 十进制数值(8位带透明通道,专用于带透明的颜色运算)
|
|
204
|
+
* @param argb 支持 #AARRGGBB / AARRGGBB 格式 例:#80FFFFFF、80FFFFFF
|
|
205
|
+
* @returns 十进制数值 例:#80FFFFFF → 2147483647,非法入参/格式错误返回 0
|
|
206
|
+
*/
|
|
207
|
+
static argbToNumber(argb) {
|
|
208
|
+
const pureArgb = argb.replace("#", "");
|
|
209
|
+
if (!/^[0-9a-fA-F]{8}$/.test(pureArgb)) {
|
|
210
|
+
return 0;
|
|
211
|
+
}
|
|
212
|
+
return parseInt(pureArgb, 16);
|
|
213
|
+
}
|
|
214
|
+
/**
|
|
215
|
+
* 十进制数值 转回 ARGB颜色字符串(8位带透明通道,标准#AARRGGBB格式)
|
|
216
|
+
* @param num 十进制数值 例:2147483647 → #80ffffff
|
|
217
|
+
* @returns 标准ARGB颜色字符串 #AARRGGBB 小写格式
|
|
218
|
+
*/
|
|
219
|
+
static numberToArgb(num) {
|
|
220
|
+
const a = this.twoDigits((num >> 24 & 255).toString(16));
|
|
221
|
+
const r = this.twoDigits((num >> 16 & 255).toString(16));
|
|
222
|
+
const g = this.twoDigits((num >> 8 & 255).toString(16));
|
|
223
|
+
const b = this.twoDigits((num & 255).toString(16));
|
|
224
|
+
return `#${a}${r}${g}${b}`;
|
|
225
|
+
}
|
|
226
|
+
/**
|
|
227
|
+
* 生成随机Hex颜色
|
|
228
|
+
* @param withSharp 是否带#号 默认为true
|
|
229
|
+
* @returns 随机hex颜色
|
|
230
|
+
*/
|
|
231
|
+
static randomHexColor(withSharp = true) {
|
|
232
|
+
const hex = this.twoDigits(Math.floor(Math.random() * 16).toString(16)) + this.twoDigits(Math.floor(Math.random() * 16).toString(16)) + this.twoDigits(Math.floor(Math.random() * 16).toString(16)) + this.twoDigits(Math.floor(Math.random() * 16).toString(16)) + this.twoDigits(Math.floor(Math.random() * 16).toString(16)) + this.twoDigits(Math.floor(Math.random() * 16).toString(16));
|
|
233
|
+
return withSharp ? `#${hex}` : hex;
|
|
234
|
+
}
|
|
235
|
+
/**
|
|
236
|
+
* 反色处理 - 取颜色的补色(比如黑色→白色,白色→黑色)
|
|
237
|
+
* @param hex 目标颜色
|
|
238
|
+
* @returns 反色hex
|
|
239
|
+
*/
|
|
240
|
+
static reverseColor(hex) {
|
|
241
|
+
const [r, g, b] = this.hexToRgb(hex);
|
|
242
|
+
return this.rgbToHex(255 - r, 255 - g, 255 - b);
|
|
243
|
+
}
|
|
244
|
+
/**
|
|
245
|
+
* 校验是否为合法的hex颜色
|
|
246
|
+
* @param hex 待校验的颜色字符串
|
|
247
|
+
* @returns true=合法 false=不合法
|
|
248
|
+
*/
|
|
249
|
+
static isHexColor(hex) {
|
|
250
|
+
return /^#?([0-9a-fA-F]{3}|[0-9a-fA-F]{6}|[0-9a-fA-F]{8})$/.test(hex);
|
|
251
|
+
}
|
|
252
|
+
/**
|
|
253
|
+
* 标准6位Hex颜色 转 ARGB 8位颜色格式 ( 核心:ARGB格式是 #AARRGGBB )
|
|
254
|
+
* @param hex 6位标准hex 支持 #ffffff / ffffff / #fff / fff
|
|
255
|
+
* @param alpha 透明度 0~1 默认 1 (完全不透明)
|
|
256
|
+
* @returns 8位ARGB格式颜色 例:#80FFFFFF 半透明白色
|
|
257
|
+
*/
|
|
258
|
+
static hexToArgb(hex, alpha = 1) {
|
|
259
|
+
let pureHex = hex.replace("#", "");
|
|
260
|
+
if (pureHex.length === 3) {
|
|
261
|
+
pureHex = pureHex.split("").map((char) => char + char).join("");
|
|
262
|
+
}
|
|
263
|
+
const validAlpha = Math.max(0, Math.min(1, alpha));
|
|
264
|
+
const alphaHex = this.twoDigits(Math.round(validAlpha * 255).toString(16));
|
|
265
|
+
return `#${alphaHex}${pureHex}`;
|
|
266
|
+
}
|
|
267
|
+
/**
|
|
268
|
+
* ARGB 8位颜色格式 转回 标准6位Hex颜色 + 独立的透明度值 ( 反向解析 )
|
|
269
|
+
* @param argb 8位ARGB格式颜色 必须是 #AARRGGBB 格式 例:#80FFFFFF
|
|
270
|
+
* @returns { hex: '#ffffff', alpha: 0.5 } 标准hex + 0~1的透明度
|
|
271
|
+
*/
|
|
272
|
+
static argbToHex(argb) {
|
|
273
|
+
const pureArgb = argb.replace("#", "");
|
|
274
|
+
if (pureArgb.length !== 8) {
|
|
275
|
+
console.warn("传入的不是合法的ARGB格式,格式必须是 #AARRGGBB");
|
|
276
|
+
return { hex: argb, alpha: 1 };
|
|
277
|
+
}
|
|
278
|
+
const alphaHex = pureArgb.slice(0, 2);
|
|
279
|
+
const hexVal = pureArgb.slice(2);
|
|
280
|
+
const alpha = Math.round(parseInt(alphaHex, 16) / 255 * 100) / 100;
|
|
281
|
+
return { hex: `#${hexVal}`, alpha };
|
|
282
|
+
}
|
|
283
|
+
/**
|
|
284
|
+
* ARGB格式(#AARRGGBB) 转 RRGGBBAA格式(#RRGGBBAA)
|
|
285
|
+
* @param argb #AARRGGBB
|
|
286
|
+
* @returns #RRGGBBAA
|
|
287
|
+
*/
|
|
288
|
+
static argbToRgbaHex(argb) {
|
|
289
|
+
const pureArgb = argb.replace("#", "");
|
|
290
|
+
if (pureArgb.length !== 8)
|
|
291
|
+
return argb;
|
|
292
|
+
return `#${pureArgb.slice(2)}${pureArgb.slice(0, 2)}`;
|
|
293
|
+
}
|
|
294
|
+
/**
|
|
295
|
+
* RRGGBBAA格式(#RRGGBBAA) 转 ARGB格式(#AARRGGBB)
|
|
296
|
+
* @param rgbaHex #RRGGBBAA
|
|
297
|
+
* @returns #AARRGGBB
|
|
298
|
+
*/
|
|
299
|
+
static rgbaHexToArgb(rgbaHex) {
|
|
300
|
+
const pureRgba = rgbaHex.replace("#", "");
|
|
301
|
+
if (pureRgba.length !== 8)
|
|
302
|
+
return rgbaHex;
|
|
303
|
+
return `#${pureRgba.slice(6)}${pureRgba.slice(0, 6)}`;
|
|
304
|
+
}
|
|
305
|
+
/**
|
|
306
|
+
* 调整颜色饱和度
|
|
307
|
+
* @param hex 目标颜色
|
|
308
|
+
* @param level 调整程度 0-2 1=不变 <1=降低饱和度 >1=提高饱和度
|
|
309
|
+
* @returns 调整后的hex颜色
|
|
310
|
+
*/
|
|
311
|
+
static adjustSaturation(hex, level) {
|
|
312
|
+
const [h, s, v] = this.hexToHsv(hex);
|
|
313
|
+
const newS = Math.max(0, Math.min(1, s * level));
|
|
314
|
+
return this.hsvToHex(h, newS, v);
|
|
315
|
+
}
|
|
316
|
+
/**
|
|
317
|
+
* 调整颜色明度
|
|
318
|
+
* @param hex 目标颜色
|
|
319
|
+
* @param level 调整程度 0-2 1=不变 <1=降低明度 >1=提高明度
|
|
320
|
+
* @returns 调整后的hex颜色
|
|
321
|
+
*/
|
|
322
|
+
static adjustBrightness(hex, level) {
|
|
323
|
+
const [h, s, v] = this.hexToHsv(hex);
|
|
324
|
+
const newV = Math.max(0, Math.min(1, v * level));
|
|
325
|
+
return this.hsvToHex(h, s, newV);
|
|
326
|
+
}
|
|
327
|
+
/**
|
|
328
|
+
* 普通6位Hex+透明度 → 直接返回ARGB对应的十进制数值
|
|
329
|
+
* @param hex 支持 #fff / #ffffff 格式
|
|
330
|
+
* @param alpha 透明度 0-1
|
|
331
|
+
* @returns ARGB十进制数值
|
|
332
|
+
*/
|
|
333
|
+
static hexAlphaToArgbNumber(hex, alpha = 1) {
|
|
334
|
+
const argbStr = this.hexToArgb(hex, alpha);
|
|
335
|
+
return this.argbToNumber(argbStr);
|
|
336
|
+
}
|
|
337
|
+
/**
|
|
338
|
+
* ARGB十进制数值 → 解析出 普通Hex + 0-1透明度
|
|
339
|
+
* @param num ARGB十进制数值
|
|
340
|
+
* @returns { hex: '#ffffff', alpha: 0.5 }
|
|
341
|
+
*/
|
|
342
|
+
static argbNumberToHexAlpha(num) {
|
|
343
|
+
const argbStr = this.numberToArgb(num);
|
|
344
|
+
return this.argbToHex(argbStr);
|
|
345
|
+
}
|
|
346
|
+
/**
|
|
347
|
+
* 补零成两位字符
|
|
348
|
+
*/
|
|
349
|
+
static twoDigits(num) {
|
|
350
|
+
const s = num.toString();
|
|
351
|
+
return s.length === 1 ? "0" + s : s;
|
|
352
|
+
}
|
|
353
|
+
};
|
package/dist/cjs/index.d.ts
CHANGED
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
export type * from './eventCenter';
|
|
2
2
|
export { default as CrEventCenter } from './eventCenter';
|
|
3
|
-
export type * from './
|
|
4
|
-
export { default as CrObjUtil } from './
|
|
3
|
+
export type * from './obj';
|
|
4
|
+
export { default as CrObjUtil } from './obj';
|
|
5
5
|
export { default as CrStorage } from './storage';
|
|
6
|
-
export type * from './
|
|
7
|
-
export { default as CrTreeUtil } from './
|
|
6
|
+
export type * from './tree';
|
|
7
|
+
export { default as CrTreeUtil } from './tree';
|
|
8
8
|
export { default as CrUtil } from './util';
|
|
9
|
+
export { default as CrColorUtil } from './color';
|
package/dist/cjs/index.js
CHANGED
|
@@ -29,20 +29,23 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
|
|
|
29
29
|
// src/index.ts
|
|
30
30
|
var src_exports = {};
|
|
31
31
|
__export(src_exports, {
|
|
32
|
+
CrColorUtil: () => import_color.default,
|
|
32
33
|
CrEventCenter: () => import_eventCenter.default,
|
|
33
|
-
CrObjUtil: () =>
|
|
34
|
+
CrObjUtil: () => import_obj.default,
|
|
34
35
|
CrStorage: () => import_storage.default,
|
|
35
|
-
CrTreeUtil: () =>
|
|
36
|
+
CrTreeUtil: () => import_tree.default,
|
|
36
37
|
CrUtil: () => import_util.default
|
|
37
38
|
});
|
|
38
39
|
module.exports = __toCommonJS(src_exports);
|
|
39
40
|
var import_eventCenter = __toESM(require("./eventCenter"));
|
|
40
|
-
var
|
|
41
|
+
var import_obj = __toESM(require("./obj"));
|
|
41
42
|
var import_storage = __toESM(require("./storage"));
|
|
42
|
-
var
|
|
43
|
+
var import_tree = __toESM(require("./tree"));
|
|
43
44
|
var import_util = __toESM(require("./util"));
|
|
45
|
+
var import_color = __toESM(require("./color"));
|
|
44
46
|
// Annotate the CommonJS export names for ESM import in node:
|
|
45
47
|
0 && (module.exports = {
|
|
48
|
+
CrColorUtil,
|
|
46
49
|
CrEventCenter,
|
|
47
50
|
CrObjUtil,
|
|
48
51
|
CrStorage,
|
|
@@ -16,12 +16,12 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
16
16
|
};
|
|
17
17
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
18
18
|
|
|
19
|
-
// src/
|
|
20
|
-
var
|
|
21
|
-
__export(
|
|
19
|
+
// src/obj.ts
|
|
20
|
+
var obj_exports = {};
|
|
21
|
+
__export(obj_exports, {
|
|
22
22
|
default: () => CrObjUtil
|
|
23
23
|
});
|
|
24
|
-
module.exports = __toCommonJS(
|
|
24
|
+
module.exports = __toCommonJS(obj_exports);
|
|
25
25
|
var import_lodash = require("lodash");
|
|
26
26
|
var CrObjUtil = class {
|
|
27
27
|
/**
|
|
@@ -16,12 +16,12 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
16
16
|
};
|
|
17
17
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
18
18
|
|
|
19
|
-
// src/
|
|
20
|
-
var
|
|
21
|
-
__export(
|
|
19
|
+
// src/tree.ts
|
|
20
|
+
var tree_exports = {};
|
|
21
|
+
__export(tree_exports, {
|
|
22
22
|
default: () => CrTreeUtil
|
|
23
23
|
});
|
|
24
|
-
module.exports = __toCommonJS(
|
|
24
|
+
module.exports = __toCommonJS(tree_exports);
|
|
25
25
|
var import_lodash = require("lodash");
|
|
26
26
|
var CrTreeUtil = class {
|
|
27
27
|
/**
|
package/dist/cjs/util.d.ts
CHANGED
|
@@ -91,7 +91,7 @@ export default class CrUtil {
|
|
|
91
91
|
* @param settings.idField 默认值 id
|
|
92
92
|
* @param settings.pidField 默认值 parentId
|
|
93
93
|
* @param settings.childrenField 默认值 children
|
|
94
|
-
* @deprecated 即将移除,使用 {@link
|
|
94
|
+
* @deprecated 即将移除,使用 {@link CrTreeUtil.listToTree} 替代
|
|
95
95
|
* @returns
|
|
96
96
|
*/
|
|
97
97
|
static listToTreeData(listData: any[], settings?: {
|
|
@@ -108,7 +108,7 @@ export default class CrUtil {
|
|
|
108
108
|
* @param settings.idField 默认值 id
|
|
109
109
|
* @param settings.pidField 默认值 parentId
|
|
110
110
|
* @param settings.childrenField 默认值 children
|
|
111
|
-
* @deprecated 即将移除,使用 {@link
|
|
111
|
+
* @deprecated 即将移除,使用 {@link CrTreeUtil.treeToList} 替代
|
|
112
112
|
* @returns
|
|
113
113
|
*/
|
|
114
114
|
static treeDataToListData(treeData: any[], pid?: string | number, settings?: {
|
|
@@ -125,7 +125,7 @@ export default class CrUtil {
|
|
|
125
125
|
* @param settings.valueField 默认值 value
|
|
126
126
|
* @param settings.idField 默认值 id
|
|
127
127
|
* @param settings.pidField 默认值 parentId
|
|
128
|
-
* @deprecated 即将移除,使用 {@link
|
|
128
|
+
* @deprecated 即将移除,使用 {@link CrTreeUtil.getFlatParentDatas} 替代
|
|
129
129
|
* @returns
|
|
130
130
|
*/
|
|
131
131
|
static getParentNodes<T, R extends Record<string, any>>(listData: R[], value: number | string, settings?: {
|
package/dist/cjs/util.js
CHANGED
|
@@ -187,7 +187,7 @@ var CrUtil = class {
|
|
|
187
187
|
* @param settings.idField 默认值 id
|
|
188
188
|
* @param settings.pidField 默认值 parentId
|
|
189
189
|
* @param settings.childrenField 默认值 children
|
|
190
|
-
* @deprecated 即将移除,使用 {@link
|
|
190
|
+
* @deprecated 即将移除,使用 {@link CrTreeUtil.listToTree} 替代
|
|
191
191
|
* @returns
|
|
192
192
|
*/
|
|
193
193
|
static listToTreeData(listData, settings) {
|
|
@@ -250,7 +250,7 @@ var CrUtil = class {
|
|
|
250
250
|
* @param settings.idField 默认值 id
|
|
251
251
|
* @param settings.pidField 默认值 parentId
|
|
252
252
|
* @param settings.childrenField 默认值 children
|
|
253
|
-
* @deprecated 即将移除,使用 {@link
|
|
253
|
+
* @deprecated 即将移除,使用 {@link CrTreeUtil.treeToList} 替代
|
|
254
254
|
* @returns
|
|
255
255
|
*/
|
|
256
256
|
static treeDataToListData(treeData, pid = 0, settings) {
|
|
@@ -292,7 +292,7 @@ var CrUtil = class {
|
|
|
292
292
|
* @param settings.valueField 默认值 value
|
|
293
293
|
* @param settings.idField 默认值 id
|
|
294
294
|
* @param settings.pidField 默认值 parentId
|
|
295
|
-
* @deprecated 即将移除,使用 {@link
|
|
295
|
+
* @deprecated 即将移除,使用 {@link CrTreeUtil.getFlatParentDatas} 替代
|
|
296
296
|
* @returns
|
|
297
297
|
*/
|
|
298
298
|
static getParentNodes(listData, value, settings) {
|