@whitesev/utils 1.9.8 → 2.0.1

package/package.json

@@ -1,9 +1,9 @@
 {
   "name": "@whitesev/utils",
-  "version": "1.9.8",
+  "version": "2.0.1",
   "description": "一个常用的工具库",
   "main": "dist/index.cjs.js",
-  "module": "dist/node/index.esm.js",
+  "module": "dist/index.esm.js",
   "types": "dist/types/index.d.ts",
   "jsdelivr": "dist/index.umd.js",
   "exports": {
@@ -15,7 +15,8 @@
     }
   },
   "files": [
-    "dist"
+    "dist",
+    "src"
   ],
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"

package/src/AjaxHookerType.ts

@@ -0,0 +1,155 @@
+import type { HttpxHeaders, HttpxMethod, HttpxStatus } from "./Httpx";
+
+/** 请求的response配置 */
+export declare interface UtilsAjaxHookResponseOptions {
+	/**
+	 * （重定向后的）Url
+	 */
+	finalUrl: string;
+	/**
+	 * 响应码
+	 */
+	status: HttpxStatus;
+	/**
+	 * 响应头
+	 */
+	responseHeaders: HttpxHeaders;
+	/**
+	 * 响应内容
+	 */
+	response?: string | Blob | ArrayBuffer | XMLDocument | FormData;
+	/**
+	 * 响应内容文本
+	 */
+	responseText?: string;
+}
+
+/** hook请求的配置 */
+export declare interface UtilsAjaxHookRequestOptions {
+	/**
+	 * 只读属性。一个字符串，表明请求类型是xhr还是fetch
+	 */
+	type: "xhr";
+	/**
+	 * 请求的Url
+	 */
+	url: string;
+	/**
+	 * 请求的url和method，可以直接修改
+	 */
+	method: HttpxMethod;
+	/**
+	 * 是否取消请求，设置为true即可取消本次请求
+	 */
+	abort: boolean;
+	/**
+	 * 请求头，可以直接修改
+	 */
+	headers: HttpxHeaders;
+	/**
+	 * 请求携带的数据，可以直接修改
+	 */
+	data?: any;
+	/**
+	 * 响应内容，必须通过一个回调函数进行读取和修改。
+	 *
+	 * 响应内容为一个对象，包含finalUrl、status、responseHeaders和被读取的响应数据，除响应数据可修改，其他属性是只读的。
+	 *
+	 * 响应数据是哪个属性取决于哪个属性被读取，xhr可能的属性为response、responseText、responseXML，fetch可能的属性为arrayBuffer、blob、formData、json、text。
+	 *
+	 * 在控制台输出时，xhr响应将包含所有属性，但只有被读取过的属性具有明确的值。修改对应属性即可影响读取结果，进而实现响应数据的修改。
+	 */
+	response?: (res: Required<UtilsAjaxHookResponseOptions>) => void;
+	/**
+	 * 只读属性。异步请求为true，同步请求为false，异步特性无法作用于同步请求
+	 */
+	async: boolean;
+}
+
+/** 过滤规则配置 */
+export declare interface UtilsAjaxHookFilterOptions {
+	/**
+	 * 应是xhr或fetch
+	 */
+	type?: "xhr" | "fetch";
+	/**
+	 * 字符串或正则表达式，无需完全匹配
+	 */
+	url?: string;
+	/**
+	 * 请求方法
+	 */
+	method?: HttpxMethod;
+	/**
+	 * 是否异步
+	 */
+	async?: boolean;
+}
+
+/** Utils.ajaxHooker */
+export declare interface UtilsAjaxHookResult {
+	/**
+     * 劫持
+     * @example
+        ajaxHooker.hook(request => {
+            if (request.url === 'https://www.example.com/') {
+                request.response = res => {
+                    console.log(res);
+                    res.responseText += 'test';
+                };
+            }
+        });
+      * @example
+        // 异步特性无法作用于同步请求，但同步修改仍然有效
+        // 你可以将以上所有可修改属性赋值为Promise，原请求将被阻塞直至Promise完成（若发生reject，数据将不会被修改）
+        // 此特性可用于异步劫持。以下是一个异步修改响应数据的例子
+        ajaxHooker.hook(request => {
+            request.response = res => {
+                const responseText = res.responseText; // 注意保存原数据
+                res.responseText = new Promise(resolve => {
+                    setTimeout(() => {
+                        resolve(responseText + 'test');
+                    }, 3000);
+                });
+            };
+        });
+
+        // 也可以传入async回调函数以实现异步
+        ajaxHooker.hook(async request => {
+            request.data = await modifyData(request.data);
+            request.response = async res => {
+                res.responseText = await modifyResponse(res.responseText);
+            };
+        });
+     */
+	hook(
+		callback: (
+			request: UtilsAjaxHookRequestOptions
+		) => void | Promise<undefined>
+	): void;
+	/**
+     * 过滤
+     * @example
+        // 应于hook方法之前执行，此方法若尽早执行，有助于提升性能。
+        // 为hook方法设置过滤规则，只有符合规则的请求才会触发hook。过滤规则是一个对象数组，参考下例
+        ajaxHooker.filter([
+            {type: 'xhr', url: 'www.example.com', method: 'GET', async: true},
+            {url: /^http/},
+        ]);
+     */
+	filter(filterOptions: UtilsAjaxHookFilterOptions[]): void;
+	/**
+     * 阻止xhr和fetch被改写
+     * @example
+        // 如果库劫持失败，可能是其他代码对xhr/fetch进行了二次劫持，protect方法会尝试阻止xhr和fetch被改写。应于document-start阶段尽早执行，部分网页下可能引发错误，谨慎使用。
+        ajaxHooker.protect();
+     */
+	protect(): void;
+	/**
+     * 取消劫持
+     * @example
+        // 将xhr和fetch恢复至劫持前的状态，调用此方法后，hook方法不再生效。
+        ajaxHooker.unhook();
+     */
+	unhook(): void;
+}

package/src/ColorConversion.ts

@@ -0,0 +1,130 @@
+class ColorConversion {
+	/**
+	 * 判断是否是16进制颜色
+	 * @param str
+	 */
+	isHex(str: string): boolean {
+		if (typeof str !== "string") {
+			return false;
+		}
+		if (!str.match(/^(\#|)[0-9a-fA-F]{6}$/)) {
+			return false;
+		}
+		return true;
+	}
+	/**
+	 * 16进制颜色转rgba
+	 *
+	 * #ff0000 转 rgba(123,123,123, 0.4)
+	 * @param hex
+	 * @param opacity
+	 */
+	hexToRgba(hex: string, opacity: number): string {
+		if (!this.isHex(hex)) {
+			// @ts-ignore
+			throw new TypeError("输入错误的hex", hex);
+		}
+		return hex && hex.replace(/\s+/g, "").length === 7
+			? "rgba(" +
+					parseInt("0x" + hex.slice(1, 3)) +
+					"," +
+					parseInt("0x" + hex.slice(3, 5)) +
+					"," +
+					parseInt("0x" + hex.slice(5, 7)) +
+					"," +
+					opacity +
+					")"
+			: "";
+	}
+	/**
+	 * hex转rgb
+	 * @param str
+	 * @returns
+	 */
+	hexToRgb(str: string) {
+		if (!this.isHex(str)) {
+			// @ts-ignore
+			throw new TypeError("输入错误的hex", str);
+		}
+		/* replace替换查找的到的字符串 */
+		str = str.replace("#", "");
+		/* match得到查询数组 */
+		let hxs = str.match(/../g);
+		for (let index = 0; index < 3; index++) {
+			// @ts-ignore
+			hxs[index] = parseInt(hxs[index], 16);
+		}
+
+		return hxs;
+	}
+	/**
+	 * rgb转hex
+	 * @param redValue
+	 * @param greenValue
+	 * @param blueValue
+	 * @returns
+	 */
+	rgbToHex(
+		redValue: string | number,
+		greenValue: string | number,
+		blueValue: string | number
+	): string {
+		/* 验证输入的rgb值是否合法 */
+		let validPattern = /^\d{1,3}$/;
+		if (
+			!validPattern.test(redValue.toString()) ||
+			!validPattern.test(greenValue.toString()) ||
+			!validPattern.test(blueValue.toString())
+		)
+			throw new TypeError("输入错误的rgb颜色值");
+		let hexs = [
+			redValue.toString(16),
+			greenValue.toString(16),
+			blueValue.toString(16),
+		];
+		for (let index = 0; index < 3; index++)
+			if (hexs[index].length == 1) hexs[index] = "0" + hexs[index];
+		return "#" + hexs.join("");
+	}
+	/**
+	 * 获取颜色变暗或亮
+	 * @param color 颜色
+	 * @param level 0~1.0
+	 * @returns
+	 */
+	getDarkColor(color: string, level: string): string {
+		if (!this.isHex(color)) {
+			// @ts-ignore
+			throw new TypeError("输入错误的hex", color);
+		}
+		let rgbc = this.hexToRgb(color);
+		for (let index = 0; index < 3; index++) {
+			// @ts-ignore
+			rgbc[index] = Math.floor(rgbc[index] * (1 - level));
+		}
+
+		// @ts-ignore
+		return this.rgbToHex(rgbc[0], rgbc[1], rgbc[2]);
+	}
+	/**
+	 * 获取颜色变亮
+	 * @param color 颜色
+	 * @param level 0~1.0
+	 * @returns
+	 */
+	getLightColor(color: string, level: number): string {
+		if (!this.isHex(color)) {
+			// @ts-ignore
+			throw new TypeError("输入错误的hex", color);
+		}
+		let rgbc = this.hexToRgb(color);
+		for (let index = 0; index < 3; index++) {
+			// @ts-ignore
+			rgbc[index] = Math.floor((255 - rgbc[index]) * level + rgbc[index]);
+		}
+		// @ts-ignore
+		return this.rgbToHex(rgbc[0], rgbc[1], rgbc[2]);
+	}
+}
+
+export { ColorConversion };

package/src/Dictionary.ts

@@ -0,0 +1,161 @@
+import { Utils } from "./Utils";
+
+class UtilsDictionary<K, V> {
+	private items: {
+		// @ts-ignore
+		[key: K]: V;
+	} = {};
+	constructor();
+	constructor(key: K, value: V);
+	constructor(key?: K, value?: V) {
+		if (key != null) {
+			this.set(key, value!);
+		}
+	}
+	/**
+	 * 检查是否有某一个键
+	 * @param key 键
+	 */
+	has(key: K): boolean {
+		return Reflect.has(this.items, key as PropertyKey);
+	}
+	/**
+	 * 检查已有的键中是否以xx开头
+	 * @param key 需要匹配的键
+	 */
+	startsWith(key: K): boolean {
+		let allKeys = this.keys();
+		for (const keyName of allKeys) {
+			if (String(keyName).startsWith(String(key))) {
+				return true;
+			}
+		}
+		return false;
+	}
+	/**
+	 * 获取以xx开头的键的值
+	 * @param key 需要匹配的键
+	 */
+	getStartsWith(key: K): V | undefined {
+		let allKeys = this.keys();
+		let result: V | undefined = void 0;
+		for (const keyName of allKeys) {
+			if (String(keyName).startsWith(String(key))) {
+				result = this.get(keyName as K)!;
+				break;
+			}
+		}
+		return result;
+	}
+	/**
+	 * 为字典添加某一个值
+	 * @param key 键
+	 * @param val 值，默认为""
+	 */
+	set(key: K, val: V): void {
+		if (key === void 0) {
+			throw new Error("Utils.Dictionary().set 参数 key 不能为空");
+		}
+		Reflect.set(this.items, key as PropertyKey, val);
+	}
+	/**
+	 * 删除某一个键
+	 * @param key 键
+	 */
+	delete(key: K): boolean {
+		if (this.has(key)) {
+			return Reflect.deleteProperty(this.items, key as string);
+		}
+		return false;
+	}
+	/**
+	 * 获取某个键的值
+	 * https://github.com/microsoft/TypeScript/issues/9619
+	 * 微软到现在都没有修复has和get的联动
+	 * @param key 键
+	 */
+	get(key: K): V {
+		return Reflect.get(this.items, key as PropertyKey) as V;
+	}
+	/**
+	 * 返回字典中的所有值
+	 */
+	values(): V[] {
+		let resultList: V[] = [];
+		for (let prop in this.getItems()) {
+			if (this.has(prop as K)) {
+				resultList.push(this.get(prop as K)!);
+			}
+		}
+		return resultList;
+	}
+	/**
+	 * 清空字典
+	 */
+	clear() {
+		this.items = null as any;
+		this.items = {};
+	}
+	/**
+	 * 获取字典的长度
+	 */
+	size(): number {
+		return Object.keys(this.getItems()).length;
+	}
+	/**
+	 * 获取字典所有的键
+	 */
+	keys(): (string | symbol)[] {
+		return Reflect.ownKeys(this.items);
+	}
+	/**
+	 * 返回字典本身
+	 */
+	getItems(): UtilsDictionary<K, V> {
+		// @ts-ignore
+		return this.items;
+	}
+	/**
+	 * 合并另一个字典
+	 * @param data 需要合并的字典
+	 */
+	concat(data: UtilsDictionary<K, V>) {
+		this.items = Utils.assign(this.items, data.getItems());
+	}
+	forEach(
+		callbackfn: (value: V, key: K, dictionary: UtilsDictionary<K, V>) => void
+	) {
+		for (const key in this.getItems()) {
+			callbackfn(this.get(key as any) as V, key as K, this.getItems() as any);
+		}
+	}
+	/**
+	 * 获取字典的长度，同this.size
+	 */
+	get length() {
+		return this.size();
+	}
+	/**
+	 * 迭代器
+	 */
+	get entries() {
+		let that = this;
+		return function* (): IterableIterator<[K, V]> {
+			let itemKeys = Object.keys(that.getItems());
+			for (const keyName of itemKeys) {
+				yield [keyName as K, that.get(keyName as K) as V];
+			}
+		};
+	}
+	/**
+	 * 是否可遍历
+	 */
+	get [Symbol.iterator]() {
+		let that = this;
+		return function () {
+			return that.entries();
+		};
+	}
+}
+
+export { UtilsDictionary };

package/src/Event.ts

@@ -0,0 +1,189 @@
+/**
+ * 鼠标事件
+ * + https://blog.csdn.net/weixin_68658847/article/details/126939879
+ */
+
+declare interface DOMUtils_MouseEvent {
+	click: MouseEvent | PointerEvent;
+	contextmenu: MouseEvent | PointerEvent;
+	dblclick: MouseEvent | PointerEvent;
+	mousedown: MouseEvent | PointerEvent;
+	mouseenter: MouseEvent | PointerEvent;
+	mouseleave: MouseEvent | PointerEvent;
+	mousemove: MouseEvent | PointerEvent;
+	mouseover: MouseEvent | PointerEvent;
+	mouseout: MouseEvent | PointerEvent;
+	mouseup: MouseEvent | PointerEvent;
+}
+declare type DOMUtils_MouseEventType = keyof DOMUtils_MouseEvent;
+/**
+ * 鼠标事件
+ */
+declare interface DOMUtils_KeyboardEvent {
+	keydown: KeyboardEvent;
+	keypress: KeyboardEvent;
+	keyup: KeyboardEvent;
+}
+declare type DOMUtils_KeyboardEventType = keyof DOMUtils_KeyboardEvent;
+/**
+ * 框架/对象事件
+ */
+declare interface DOMUtils_Frame_Object_Event {
+	abort: Event;
+	beforeunload: Event;
+	error: Event;
+	hashchange: Event;
+	load: Event;
+	pageshow: Event;
+	pagehide: Event;
+	resize: Event;
+	scroll: Event;
+	unload: Event;
+}
+declare type DOMUtils_Frame_Object_EventType =
+	keyof DOMUtils_Frame_Object_Event;
+/**
+ * 表单事件
+ */
+declare interface DOMUtils_FormEvent {
+	blur: Event;
+	change: Event;
+	focus: Event;
+	focusin: Event;
+	focusout: Event;
+	input: Event;
+	reset: Event;
+	search: Event;
+}
+declare type DOMUtils_FormEventType = keyof DOMUtils_FormEvent;
+
+/**
+ * 剪贴板事件
+ */
+declare interface DOMUtils_ClipboardEvent {
+	copy: ClipboardEvent;
+	cut: ClipboardEvent;
+	paste: ClipboardEvent;
+}
+declare type DOMUtils_ClipboardEventType = keyof DOMUtils_ClipboardEvent;
+
+/**
+ * 打印事件
+ */
+declare interface DOMUtils_PrintEvent {
+	afterprint: Event;
+	beforeprint: Event;
+}
+declare type DOMUtils_PrintEventType = keyof DOMUtils_PrintEvent;
+
+/**
+ * 拖动事件
+ */
+declare interface DOMUtils_DragEvent {
+	drag: DragEvent;
+	dragend: DragEvent;
+	dragenter: DragEvent;
+	dragleave: DragEvent;
+	dragover: DragEvent;
+	dragstart: DragEvent;
+	drop: DragEvent;
+}
+declare type DOMUtils_DragEventType = keyof DOMUtils_DragEvent;
+
+/**
+ * 多媒体（Media）事件
+ */
+declare interface DOMUtils_MediaEvent {
+	abort: Event;
+	canplay: Event;
+	canplaythrough: Event;
+	durationchange: Event;
+	emptied: Event;
+	ended: Event;
+	error: Event;
+	loadeddata: Event;
+	loadedmetadata: Event;
+	loadstart: Event;
+	pause: Event;
+	play: Event;
+	playing: Event;
+	progress: Event;
+	ratechange: Event;
+	seeked: Event;
+	seeking: Event;
+	stalled: Event;
+	suspend: Event;
+	timeupdate: Event;
+	volumechange: Event;
+	waiting: Event;
+}
+declare type DOMUtils_MediaEventType = keyof DOMUtils_MediaEvent;
+
+/**
+ * 动画事件
+ */
+declare interface DOMUtils_AnimationEvent {
+	animationend: AnimationEvent;
+	animationiteration: AnimationEvent;
+	animationstart: AnimationEvent;
+}
+declare type DOMUtils_AnimationEventType = keyof DOMUtils_AnimationEvent;
+
+/**
+ * 过渡事件
+ */
+declare interface DOMUtils_TransitionEvent {
+	transitionend: TransitionEvent;
+}
+declare type DOMUtils_TransitionEventType = keyof DOMUtils_TransitionEvent;
+
+/**
+ * 触摸事件
+ */
+declare interface DOMUtils_TouchEvent {
+	touchstart: TouchEvent;
+	touchmove: TouchEvent;
+	touchend: TouchEvent;
+	touchcancel: TouchEvent;
+	touchenter: TouchEvent;
+	touchleave: TouchEvent;
+}
+declare type DOMUtils_TouchEventType = keyof DOMUtils_TouchEvent;
+/**
+ * 其它事件
+ */
+declare interface DOMUtils_OtherEvent {
+	message: Event;
+	online: Event;
+	offline: Event;
+	popstate: Event;
+	show: Event;
+	storage: Event;
+	toggle: Event;
+	wheel: Event;
+	propertychange: Event;
+	fullscreenchange: Event;
+	DOMContentLoaded: Event;
+}
+declare type DOMUtils_OtherEventType = keyof DOMUtils_OtherEvent;
+
+/**
+ * 全部事件
+ */
+export declare type DOMUtils_Event = DOMUtils_MouseEvent &
+	DOMUtils_KeyboardEvent &
+	DOMUtils_Frame_Object_Event &
+	DOMUtils_FormEvent &
+	DOMUtils_ClipboardEvent &
+	DOMUtils_PrintEvent &
+	DOMUtils_DragEvent &
+	DOMUtils_MediaEvent &
+	DOMUtils_AnimationEvent &
+	DOMUtils_TransitionEvent &
+	DOMUtils_TouchEvent &
+	DOMUtils_OtherEvent;
+
+/**
+ * 事件类型
+ */
+export declare type DOMUtils_EventType = keyof DOMUtils_Event;