@gx-design-vue/pro-utils 0.1.4 → 0.2.0-alpha.1

package/dist/dom/scroll.js

@@ -0,0 +1,97 @@
+import { isServer } from "../is/server.js";
+import "../is/index.js";
+import wrapperRaf from "./raf.js";
+
+//#region src/dom/scroll.ts
+function easeInOutCubic(t, b, c, d) {
+	const cc = c - b;
+	t /= d / 2;
+	if (t < 1) return cc / 2 * t * t * t + b;
+	return cc / 2 * ((t -= 2) * t * t + 2) + b;
+}
+function camelize(str) {
+	return str.replace(/[-_](.)/g, (_, char) => char.toUpperCase());
+}
+function getStyle(element, styleName) {
+	if (isServer) return "";
+	if (!element || !styleName) return "";
+	styleName = camelize(styleName);
+	if (styleName === "float") styleName = "cssFloat";
+	try {
+		const style = element.style[styleName];
+		if (style) return style;
+		const computed = document?.defaultView?.getComputedStyle(element, "");
+		return computed ? computed[styleName] : "";
+	} catch {
+		return element.style[styleName];
+	}
+}
+function isScroll(el, isVertical) {
+	if (isServer) return;
+	return (isVertical === null || isVertical === void 0 ? getStyle(el, "overflow") : isVertical ? getStyle(el, "overflow-y") : getStyle(el, "overflow-x")).match(/(scroll|auto|overlay)/);
+}
+function getScrollContainer(el, isVertical) {
+	if (isServer) return;
+	let parent = el;
+	while (parent) {
+		if ([
+			window,
+			document,
+			document.documentElement
+		].includes(parent)) return window;
+		if (isScroll(parent, isVertical)) return parent;
+		parent = parent.parentNode;
+	}
+	return parent;
+}
+function isInContainer(el, container) {
+	if (isServer || !el || !container) return false;
+	const elRect = el.getBoundingClientRect();
+	let containerRect;
+	if ([
+		window,
+		document,
+		document.documentElement,
+		null,
+		void 0
+	].includes(container)) containerRect = {
+		top: 0,
+		right: window.innerWidth,
+		bottom: window.innerHeight,
+		left: 0
+	};
+	else containerRect = container.getBoundingClientRect();
+	return elRect.top < containerRect.bottom && elRect.bottom > containerRect.top && elRect.right > containerRect.left && elRect.left < containerRect.right;
+}
+function isWindow(obj) {
+	return obj !== null && obj !== void 0 && obj === obj.window;
+}
+function getScroll(target, top) {
+	if (typeof window === "undefined") return 0;
+	const method = top ? "scrollTop" : "scrollLeft";
+	let result = 0;
+	if (isWindow(target)) result = target[top ? "pageYOffset" : "pageXOffset"];
+	else if (target instanceof Document) result = target.documentElement[method];
+	else if (target) result = target[method];
+	if (target && !isWindow(target) && typeof result !== "number") result = (target.ownerDocument || target).documentElement?.[method];
+	return result;
+}
+function scrollTo(y, options = {}) {
+	const { getContainer = () => window, callback, duration = 450 } = options;
+	const container = getContainer();
+	const scrollTop = getScroll(container, true);
+	const startTime = Date.now();
+	const frameFunc = () => {
+		const time = Date.now() - startTime;
+		const nextScrollTop = easeInOutCubic(time > duration ? duration : time, scrollTop, y, duration);
+		if (isWindow(container)) container.scrollTo(window.pageXOffset, nextScrollTop);
+		else if (container instanceof HTMLDocument || container.constructor.name === "HTMLDocument") container.documentElement.scrollTop = nextScrollTop;
+		else container.scrollTop = nextScrollTop;
+		if (time < duration) wrapperRaf(frameFunc);
+		else if (typeof callback === "function") callback();
+	};
+	if (container) wrapperRaf(frameFunc);
+}
+
+//#endregion
+export { easeInOutCubic, getScroll, getScrollContainer, isInContainer, isScroll, isWindow, scrollTo };

package/dist/file/config.d.ts

@@ -0,0 +1,13 @@
+//#region src/file/config.d.ts
+/**
+ * 文件类型配置
+ */
+declare const fileTypes: {
+  /** 允许的视频格式 */videoAllowType: string[]; /** 允许的音频格式 */
+  audioAllowType: string[]; /** 图片格式 */
+  imageType: string[]; /** 视频格式 */
+  videoType: string[]; /** 音频格式 */
+  audioType: string[];
+};
+//#endregion
+export { fileTypes };

package/dist/file/config.js

@@ -0,0 +1,81 @@
+//#region src/file/config.ts
+/**
+* 文件类型配置
+*/
+const fileTypes = {
+	videoAllowType: [
+		"mp4",
+		"webm",
+		"ogg"
+	],
+	audioAllowType: [
+		"mp3",
+		"ogg",
+		"wav",
+		"aac",
+		"m4a",
+		"webm"
+	],
+	imageType: [
+		"jpeg",
+		"jpg",
+		"png",
+		"gif",
+		"bmp",
+		"tiff",
+		"tif",
+		"webp",
+		"heic",
+		"heif",
+		"svg",
+		"ico",
+		"raw",
+		"cr2",
+		"nef",
+		"arw",
+		"dng",
+		"psd",
+		"eps"
+	],
+	videoType: [
+		"mp4",
+		"avi",
+		"mov",
+		"wmv",
+		"mkv",
+		"flv",
+		"webm",
+		"mpeg",
+		"mpg",
+		"3gp",
+		"ogv",
+		"mxf",
+		"vob",
+		"rm",
+		"rmvb",
+		"ts",
+		"mts",
+		"m2ts",
+		"divx",
+		"xvid"
+	],
+	audioType: [
+		"mp3",
+		"wav",
+		"aac",
+		"flac",
+		"ogg",
+		"wma",
+		"m4a",
+		"alac",
+		"opus",
+		"amr",
+		"aiff",
+		"au",
+		"pcm",
+		"ape"
+	]
+};
+
+//#endregion
+export { fileTypes };

package/dist/file/convert.d.ts

@@ -0,0 +1,41 @@
+//#region src/file/convert.d.ts
+/**
+ * 获取 Blob URL
+ *
+ * @param blob - Blob 对象
+ * @returns Blob URL
+ */
+declare function getBlobUrl(blob: Blob): string;
+/**
+ * 获取文件 base64 编码
+ *
+ * @param file - 文件对象
+ * @returns base64 字符串
+ */
+declare function getBase64(file: File): Promise<string | ArrayBuffer | null>;
+/**
+ * Data URL 转 Blob 对象
+ *
+ * @param url - Data URL
+ * @returns Blob 对象
+ */
+declare function dataURLtoBlob(url: any): Blob;
+/**
+ * Data URL 转 File 对象
+ *
+ * @param url - Data URL
+ * @param filename - 文件名
+ * @returns File 对象
+ */
+declare function dataURLtoFile(url: string, filename: string): File;
+/**
+ * Blob 转 File 对象
+ *
+ * @param blob - Blob 对象
+ * @param fileName - 文件名
+ * @param fileType - 文件类型
+ * @returns File 对象
+ */
+declare function blobToDataURL(blob: Blob, fileName: string, fileType: string): File;
+//#endregion
+export { blobToDataURL, dataURLtoBlob, dataURLtoFile, getBase64, getBlobUrl };

package/dist/file/convert.js

@@ -0,0 +1,69 @@
+//#region src/file/convert.ts
+/**
+* 获取 Blob URL
+*
+* @param blob - Blob 对象
+* @returns Blob URL
+*/
+function getBlobUrl(blob) {
+	return URL.createObjectURL(blob);
+}
+/**
+* 获取文件 base64 编码
+*
+* @param file - 文件对象
+* @returns base64 字符串
+*/
+function getBase64(file) {
+	return new Promise((resolve, reject) => {
+		const reader = new FileReader();
+		reader.readAsDataURL(file);
+		reader.onload = () => resolve(reader.result);
+		reader.onerror = (error) => reject(error);
+	});
+}
+/**
+* Data URL 转 Blob 对象
+*
+* @param url - Data URL
+* @returns Blob 对象
+*/
+function dataURLtoBlob(url) {
+	const arr = url.split(",");
+	const mime = arr[0].match(/:(.*?);/)[1];
+	const str = atob(arr[1]);
+	let n = str.length;
+	const u8arr = new Uint8Array(n);
+	while (n--) u8arr[n] = str.charCodeAt(n);
+	return new Blob([u8arr], { type: mime });
+}
+/**
+* Data URL 转 File 对象
+*
+* @param url - Data URL
+* @param filename - 文件名
+* @returns File 对象
+*/
+function dataURLtoFile(url, filename) {
+	const arr = url.split(",");
+	const mime = arr[0].match(/:(.*?);/)[1];
+	const str = atob(arr[1]);
+	let n = str.length;
+	const u8arr = new Uint8Array(n);
+	while (n--) u8arr[n] = str.charCodeAt(n);
+	return new File([u8arr], filename, { type: mime });
+}
+/**
+* Blob 转 File 对象
+*
+* @param blob - Blob 对象
+* @param fileName - 文件名
+* @param fileType - 文件类型
+* @returns File 对象
+*/
+function blobToDataURL(blob, fileName, fileType) {
+	return new window.File([blob], fileName, { type: fileType });
+}
+
+//#endregion
+export { blobToDataURL, dataURLtoBlob, dataURLtoFile, getBase64, getBlobUrl };

package/dist/file/index.d.ts

@@ -0,0 +1,5 @@
+import { fileTypes } from "./config.js";
+import { blobToDataURL, dataURLtoBlob, dataURLtoFile, getBase64, getBlobUrl } from "./convert.js";
+import { generateVideoPicture, getMediaInfos, getVideoCoverPicture } from "./media.js";
+import { checkFileType, getFileSuffix, getVideoFileUrl } from "./type.js";
+export { blobToDataURL, checkFileType, dataURLtoBlob, dataURLtoFile, fileTypes, generateVideoPicture, getBase64, getBlobUrl, getFileSuffix, getMediaInfos, getVideoCoverPicture, getVideoFileUrl };

package/dist/file/index.js

@@ -0,0 +1,6 @@
+import { fileTypes } from "./config.js";
+import { blobToDataURL, dataURLtoBlob, dataURLtoFile, getBase64, getBlobUrl } from "./convert.js";
+import { checkFileType, getFileSuffix, getVideoFileUrl } from "./type.js";
+import { generateVideoPicture, getMediaInfos, getVideoCoverPicture } from "./media.js";
+
+export { blobToDataURL, checkFileType, dataURLtoBlob, dataURLtoFile, fileTypes, generateVideoPicture, getBase64, getBlobUrl, getFileSuffix, getMediaInfos, getVideoCoverPicture, getVideoFileUrl };

package/dist/file/media.d.ts

@@ -0,0 +1,35 @@
+import { MediaOptions } from "../typing.js";
+
+//#region src/file/media.d.ts
+/**
+ * 获取媒体信息（图片/视频/音频）
+ *
+ * @param mediaInfo - 媒体信息配置
+ * @returns 媒体详细信息
+ */
+declare function getMediaInfos(mediaInfo: {
+  url: any;
+  fileType?: string;
+}): Promise<MediaOptions>;
+/**
+ * 获取视频封面图
+ *
+ * @param videoInfo - 视频信息
+ * @returns 封面图 base64
+ */
+declare function getVideoCoverPicture(videoInfo: {
+  url: any;
+  currentTime?: number;
+  videoSuffix?: string;
+  videoAllowPlay?: boolean;
+}): Promise<string>;
+/**
+ * 生成视频截图
+ *
+ * @param videoUrl - 视频 URL
+ * @param currentTime - 截图时间点
+ * @returns 截图 base64
+ */
+declare function generateVideoPicture(videoUrl: string, currentTime?: number): Promise<string>;
+//#endregion
+export { generateVideoPicture, getMediaInfos, getVideoCoverPicture };

package/dist/file/media.js

@@ -0,0 +1,161 @@
+import { isBase64 } from "../is/base64.js";
+import "../is/index.js";
+import { fileTypes } from "./config.js";
+import { checkFileType, getFileSuffix } from "./type.js";
+
+//#region src/file/media.ts
+/**
+* 获取媒体信息（图片/视频/音频）
+*
+* @param mediaInfo - 媒体信息配置
+* @returns 媒体详细信息
+*/
+function getMediaInfos(mediaInfo) {
+	const { url = "", fileType = "1" } = mediaInfo || {};
+	let mediaUrl = "";
+	let result = {
+		play: false,
+		height: 0,
+		size: 0,
+		width: 0,
+		duration: 0
+	};
+	function resetResult() {
+		result = {
+			play: false,
+			height: 0,
+			size: 0,
+			width: 0,
+			duration: 0
+		};
+	}
+	if (url instanceof File) mediaUrl = URL.createObjectURL(url);
+	else if (isBase64(url)) mediaUrl = url;
+	else if (url instanceof Blob) mediaUrl = URL.createObjectURL(url);
+	else if (url.includes("https") || url.includes("http")) mediaUrl = fileType === "1" ? url : url;
+	return new Promise((resolve) => {
+		let el;
+		if (fileType === "4") {
+			resolve(result);
+			return;
+		}
+		if (fileType === "1") {
+			el = document.createElement("img");
+			el.src = mediaUrl;
+		} else if (fileType === "2") {
+			el = document.createElement("audio");
+			el.src = mediaUrl;
+		} else if (fileType === "3") {
+			el = document.createElement("video");
+			el.src = mediaUrl;
+		}
+		if (fileType === "1") el.onload = function() {
+			resetResult();
+			result.play = true;
+			result.width = el.width || 0;
+			result.height = el.height || 0;
+			resolve(result);
+			el = null;
+		};
+		else el.oncanplay = function() {
+			resetResult();
+			result.play = true;
+			result.width = el?.videoWidth || 0;
+			result.height = el?.videoHeight || 0;
+			result.duration = el?.duration || 0;
+			resolve(result);
+			el = null;
+		};
+		el.onerror = function() {
+			resetResult();
+			resolve(result);
+			el = null;
+		};
+	});
+}
+/**
+* 获取视频封面图
+*
+* @param videoInfo - 视频信息
+* @returns 封面图 base64
+*/
+async function getVideoCoverPicture(videoInfo) {
+	const { url = "", currentTime, videoSuffix = "", videoAllowPlay = false } = videoInfo;
+	let videoUrl = "";
+	let fileSuffix = videoSuffix;
+	let fileType = "1";
+	let videoPlayInfo;
+	if (url instanceof File) {
+		videoUrl = URL.createObjectURL(url);
+		fileSuffix = getFileSuffix(url.name);
+		fileType = checkFileType(url.name);
+	} else if (url instanceof Blob) {
+		videoUrl = URL.createObjectURL(url);
+		fileType = checkFileType(url);
+	} else if (isBase64(url)) {
+		videoUrl = url;
+		fileType = checkFileType(url);
+	} else if (url.includes("https") || url.includes("http")) {
+		videoUrl = url;
+		fileSuffix = getFileSuffix(url);
+		fileType = checkFileType(url);
+	}
+	if (fileSuffix ? fileTypes.videoAllowType.includes(fileSuffix.toLowerCase()) : false) if (videoAllowPlay) return generateVideoPicture(videoUrl, currentTime);
+	else {
+		videoPlayInfo = await getMediaInfos({
+			url: videoUrl,
+			fileType
+		});
+		if (videoPlayInfo.play) return generateVideoPicture(videoUrl, currentTime);
+		else return new Promise((resolve) => {
+			resolve("");
+		});
+	}
+	else return new Promise((resolve) => {
+		resolve("");
+	});
+}
+/**
+* 生成视频截图
+*
+* @param videoUrl - 视频 URL
+* @param currentTime - 截图时间点
+* @returns 截图 base64
+*/
+async function generateVideoPicture(videoUrl, currentTime = 0) {
+	return new Promise((resolve) => {
+		let video = document.createElement("video");
+		if (video) {
+			video.controls = true;
+			video.muted = true;
+			video.setAttribute("src", videoUrl);
+			video.setAttribute("muted", String(true));
+			video.setAttribute("crossorigin", "anonymous");
+			video.setAttribute("autoplay", String(true));
+			video.addEventListener("loadeddata", async () => {
+				let seekResolve;
+				video?.addEventListener("seeked", async () => {
+					if (seekResolve) seekResolve();
+				});
+				while (currentTime < (video?.duration || 0)) {
+					if (video) video.currentTime = currentTime;
+					await new Promise((r) => seekResolve = r);
+					const canvas = document.createElement("canvas");
+					const scale = .8;
+					const ctx = canvas.getContext("2d");
+					const w = video?.videoWidth || 0 * scale;
+					const h = video?.videoHeight || 0 * scale;
+					const space = 0;
+					canvas.width = video?.videoWidth || 0 * scale;
+					canvas.height = video?.videoHeight || 0 * scale;
+					if (video) ctx.drawImage(video, 0, 0, w + space, h + space);
+					video = null;
+					resolve(w === 0 || h === 0 ? "" : canvas.toDataURL("image/png", 1));
+				}
+			});
+		}
+	});
+}
+
+//#endregion
+export { generateVideoPicture, getMediaInfos, getVideoCoverPicture };

package/dist/file/type.d.ts

@@ -0,0 +1,25 @@
+//#region src/file/type.d.ts
+/**
+ * 获取文件后缀名
+ *
+ * @param url - 文件 URL
+ * @returns 后缀名
+ */
+declare function getFileSuffix(url: string): string;
+/**
+ * 截取视频 URL（去除参数）
+ *
+ * @param url - URL
+ * @returns 处理后的 URL
+ */
+declare function getVideoFileUrl(url: string): string;
+/**
+ * 检查文件类型
+ *
+ * @param url - 文件 URL 或对象
+ * @param type - 指定类型
+ * @returns 文件类型代码：1 图片, 2 音频, 3 视频, 4 其他
+ */
+declare function checkFileType(url: any, type?: '1' | '2' | '3' | '4'): "1" | "2" | "3" | "4";
+//#endregion
+export { checkFileType, getFileSuffix, getVideoFileUrl };

package/dist/file/type.js

@@ -0,0 +1,58 @@
+import { isBase64 } from "../is/base64.js";
+import "../is/index.js";
+import { fileTypes } from "./config.js";
+
+//#region src/file/type.ts
+/**
+* 获取文件后缀名
+*
+* @param url - 文件 URL
+* @returns 后缀名
+*/
+function getFileSuffix(url) {
+	if (!url || typeof url !== "string") return "";
+	const newUrl = getVideoFileUrl(url);
+	const index = newUrl.lastIndexOf(".");
+	return index > 0 ? `${newUrl?.substring?.(index)?.split("?")?.[0]}`?.split(".")?.[1] || "" : "";
+}
+/**
+* 截取视频 URL（去除参数）
+*
+* @param url - URL
+* @returns 处理后的 URL
+*/
+function getVideoFileUrl(url) {
+	if (!url || typeof url !== "string") return "";
+	const index = url.indexOf("?");
+	return index > 0 ? `${url.substring(0, index)}` : url;
+}
+/**
+* 检查文件类型
+*
+* @param url - 文件 URL 或对象
+* @param type - 指定类型
+* @returns 文件类型代码：1 图片, 2 音频, 3 视频, 4 其他
+*/
+function checkFileType(url, type) {
+	if (type) return type;
+	if (!url) return "4";
+	if (url === "data:") return "4";
+	let fileType = "4";
+	if (isBase64(url)) {
+		if (url.includes("data:image/")) fileType = "png";
+		else if (url.includes("data:video/")) fileType = "mp4";
+		else if (url.includes("data:audio/")) fileType = "mp3";
+	} else if (url instanceof Blob) {
+		url = String(url);
+		if (url.includes("image")) fileType = "png";
+		else if (url.includes("video")) fileType = "mp4";
+		else if (url.includes("audio")) fileType = "mp3";
+	} else fileType = getFileSuffix(url).toLowerCase();
+	if (fileTypes.imageType.includes(fileType)) return "1";
+	if (fileTypes.videoType.includes(fileType)) return "3";
+	if (fileTypes.audioType.includes(fileType)) return "2";
+	return "4";
+}
+
+//#endregion
+export { checkFileType, getFileSuffix, getVideoFileUrl };

package/dist/function/copy.d.ts

@@ -0,0 +1,12 @@
+import { RecordType } from "../typing.js";
+
+//#region src/function/copy.d.ts
+/**
+ * 简单深拷贝（使用 JSON 序列化）
+ *
+ * @param data - 要拷贝的数据
+ * @returns 拷贝后的数据
+ */
+declare function deepCopy<T = RecordType>(data: any): T;
+//#endregion
+export { deepCopy };

package/dist/function/copy.js

@@ -0,0 +1,13 @@
+//#region src/function/copy.ts
+/**
+* 简单深拷贝（使用 JSON 序列化）
+*
+* @param data - 要拷贝的数据
+* @returns 拷贝后的数据
+*/
+function deepCopy(data) {
+	return JSON.parse(JSON.stringify(data));
+}
+
+//#endregion
+export { deepCopy };

package/dist/function/getValue.d.ts

@@ -0,0 +1,12 @@
+//#region src/function/getValue.d.ts
+type DeepValueOf<T, K> = K extends `${infer First}:${infer Rest}` ? First extends keyof T ? Rest extends '' ? T[First] : DeepValueOf<T[First], Rest> : undefined : K extends keyof T ? T[K] : undefined;
+/**
+ * 根据 key 从对象中获取值（支持嵌套路径）
+ *
+ * @param object - 目标对象
+ * @param key - 键路径（支持用冒号分隔的嵌套路径）
+ * @returns 获取的值
+ */
+declare function getValueFromObjectByKey<T extends object, K extends string | string[] = string>(object: T, key: K): DeepValueOf<T, K extends string ? K : string> | undefined;
+//#endregion
+export { getValueFromObjectByKey };

package/dist/function/getValue.js

@@ -0,0 +1,19 @@
+//#region src/function/getValue.ts
+/**
+* 根据 key 从对象中获取值（支持嵌套路径）
+*
+* @param object - 目标对象
+* @param key - 键路径（支持用冒号分隔的嵌套路径）
+* @returns 获取的值
+*/
+function getValueFromObjectByKey(object, key) {
+	if (typeof key !== "string" && !Array.isArray(key)) return;
+	const keys = Array.isArray(key) ? key : key.split(":");
+	let currentValue = object;
+	for (let i = 0; i < keys.length; i++) if (currentValue && Object.prototype.hasOwnProperty.call(currentValue, keys[i])) currentValue = currentValue[keys[i]];
+	else return;
+	return currentValue;
+}
+
+//#endregion
+export { getValueFromObjectByKey };

package/dist/function/index.d.ts

@@ -0,0 +1,5 @@
+import { deepCopy } from "./copy.js";
+import { getValueFromObjectByKey } from "./getValue.js";
+import { forInObject, getSymbols, keysOf } from "./object.js";
+import { runFunction } from "./run.js";
+export { deepCopy, forInObject, getSymbols, getValueFromObjectByKey, keysOf, runFunction };

package/dist/function/index.js

@@ -0,0 +1,6 @@
+import { forInObject, getSymbols, keysOf } from "./object.js";
+import { deepCopy } from "./copy.js";
+import { getValueFromObjectByKey } from "./getValue.js";
+import { runFunction } from "./run.js";
+
+export { deepCopy, forInObject, getSymbols, getValueFromObjectByKey, keysOf, runFunction };