@whitesev/pops 2.0.6 → 2.0.7

package/dist/types/src/components/rightClickMenu/indexType.d.ts

@@ -37,9 +37,10 @@ export interface PopsRightClickMenuDataDetails {
  */
 export interface PopsRightClickMenuDetails extends Pick<PopsCommonConfig, "useShadowRoot" | "beforeAppendToPageCallBack" | "zIndex" | "style" | "only"> {
     /**
-     * 目标，默认为document.documentElement G
+     * 目标元素
+     * @default document.documentElement
      */
-    target?: HTMLElement | (typeof globalThis & Window) | Window | EventTarget | Node;
+    target?: HTMLElement | Window | EventTarget | Node;
     /**
      * 目标的子元素选择器，默认为空
      */
@@ -50,14 +51,17 @@ export interface PopsRightClickMenuDetails extends Pick<PopsCommonConfig, "useSh
     data: PopsRightClickMenuDataDetails[];
     /**
      * 自定义className，默认为空
+     * @default ""
      */
     className?: string;
     /**
      * 是否启用动画，默认true
+     * @default true
      */
     isAnimation?: boolean;
     /**
      * 是否阻止默认contextmenu事件
+     * @default false
      */
     preventDefault?: boolean;
 }

package/dist/types/src/components/searchSuggestion/index.d.ts

@@ -1,4 +1,142 @@
 import type { PopsSearchSuggestionDetails } from "./indexType";
-export declare class PopsSearchSuggestion {
-    constructor(details: PopsSearchSuggestionDetails);
-}
+export declare const PopsSearchSuggestion: {
+    init(details: PopsSearchSuggestionDetails): {
+        /**
+         * 当前的环境，可以是document，可以是shadowroot，默认是document
+         */
+        selfDocument: Document | ShadowRoot | (Document | ShadowRoot)[];
+        $el: {
+            /** 根元素 */
+            root: HTMLElement;
+            /** ul元素 */
+            $hintULContainer: HTMLUListElement;
+            /** 动态更新CSS */
+            $dynamicCSS: HTMLStyleElement;
+        };
+        $data: {
+            /** 是否结果为空 */
+            isEmpty: boolean;
+        };
+        /**
+         * 初始化
+         */
+        init(parentElement?: HTMLElement): void;
+        /** 初始化元素变量 */
+        initEl(): void;
+        /**
+         * 获取显示出搜索建议框的html
+         */
+        getSearchSelectElement(): HTMLDivElement;
+        /** 动态获取CSS */
+        getDynamicCSS(): string;
+        /**
+         * 获取显示出搜索建议框的每一项的html
+         * @param data 当前项的值
+         * @param index 当前项的下标
+         */
+        getSearchItemLiElement(data: any, index: number): HTMLLIElement;
+        /**
+         * 获取data-value值
+         * @param data
+         */
+        getItemDataValue(data: any): any;
+        /**
+         * 设置搜索建议框每一项的点击事件
+         * @param liElement
+         */
+        setSearchItemClickEvent(liElement: HTMLLIElement): void;
+        /**
+         * 设置搜索建议框每一项的选中事件
+         * @param liElement
+         */
+        setSearchItemSelectEvent(liElement: HTMLLIElement): void;
+        /**
+         * 监听输入框内容改变
+         */
+        setInputChangeEvent(option?: AddEventListenerOptions): void;
+        /**
+         * 移除输入框内容改变的监听
+         */
+        removeInputChangeEvent(option?: AddEventListenerOptions): void;
+        /**
+         * 显示搜索建议框的事件
+         */
+        showEvent(): void;
+        /**
+         * 设置显示搜索建议框的事件
+         */
+        setShowEvent(option?: AddEventListenerOptions): void;
+        /**
+         * 移除显示搜索建议框的事件
+         */
+        removeShowEvent(option?: AddEventListenerOptions): void;
+        /**
+         * 隐藏搜索建议框的事件
+         * @param event
+         */
+        hideEvent(event: PointerEvent | MouseEvent): void;
+        /**
+         * 设置隐藏搜索建议框的事件
+         */
+        setHideEvent(option?: AddEventListenerOptions): void;
+        /**
+         * 移除隐藏搜索建议框的事件
+         */
+        removeHideEvent(option?: AddEventListenerOptions): void;
+        /**
+         * 设置所有监听
+         */
+        setAllEvent(option?: AddEventListenerOptions): void;
+        /**
+         * 移除所有监听
+         */
+        removeAllEvent(option?: AddEventListenerOptions): void;
+        /**
+         * 获取删除按钮的html
+         */
+        getDeleteIconHTML(size?: number, fill?: string): string;
+        /**
+         * 设置当前正在搜索中的提示
+         */
+        setPromptsInSearch(): void;
+        /**
+         * 移除正在搜索中的提示
+         */
+        removePromptsInSearch(): void;
+        /**
+         * 清空所有的搜索结果
+         */
+        clearAllSearchItemLi(): void;
+        /**
+         * 更新搜索建议框的位置(top、left)
+         * 因为目标元素可能是动态隐藏的
+         */
+        changeHintULElementPosition(target?: HTMLElement): void;
+        /**
+         * 更新搜索建议框的width
+         * 因为目标元素可能是动态隐藏的
+         */
+        changeHintULElementWidth(target?: HTMLElement): void;
+        /**
+         * 动态更新CSS
+         */
+        updateDynamicCSS(): void;
+        /**
+         * 更新页面显示的搜索结果
+         * @param data
+         */
+        update(data?: any[]): void;
+        /**
+         * 清空当前的搜索结果并显示无结果
+         */
+        clear(): void;
+        /**
+         * 隐藏搜索建议框
+         */
+        hide(): void;
+        /**
+         * 显示搜索建议框
+         */
+        show(): void;
+    };
+};

package/dist/types/src/components/searchSuggestion/indexType.d.ts

@@ -131,111 +131,3 @@ export interface PopsSearchSuggestionDetails<T = any> extends Pick<PopsCommonCon
      */
     selectCallBack?: (event: MouseEvent, liElement: HTMLLIElement, data: T) => void;
 }
-/**
- * pops.searchSuggestion的函数返回值
- */
-export interface PopsSearchSuggestionResult<T = any> {
-    $el: {
-        /** 根元素 */
-        root: HTMLElement;
-        /** ul元素 */
-        $hintULContainer: HTMLUListElement;
-        /** 动态更新CSS */
-        $dynamicCSS: HTMLStyleElement;
-    };
-    /**
-     * 初始化
-     */
-    init: () => void;
-    /**
-     * 获取显示出搜索建议框的html
-     */
-    getSearchSelectElement: () => HTMLElement;
-    /**
-     * 获取显示出搜索建议框的每一项的html
-     */
-    getSearchItemLiElement: (data: T, index: number) => HTMLElement;
-    /**
-     * 获取data-value值
-     */
-    getItemDataValue: (data: T) => T;
-    /**
-     * 设置搜索建议框每一项的点击事件
-     */
-    setSearchItemClickEvent: (liElement: HTMLLIElement) => void;
-    /**
-     * 监听输入框内容改变
-     */
-    setInputChangeEvent: (option?: AddEventListenerOptions) => void;
-    /**
-     * 移除输入框内容改变的监听
-     */
-    removeInputChangeEvent: (option?: AddEventListenerOptions) => void;
-    /**
-     * 设置显示搜索建议框的事件
-     */
-    setShowEvent: (option?: AddEventListenerOptions) => void;
-    /**
-     * 移除显示搜索建议框的事件
-     */
-    removeShowEvent: (option?: AddEventListenerOptions) => void;
-    /**
-     * 设置隐藏搜索建议框的事件
-     */
-    setHideEvent: (option?: AddEventListenerOptions) => void;
-    /**
-     * 移除隐藏搜索建议框的事件
-     */
-    removeHideEvent: (option?: AddEventListenerOptions) => void;
-    /**
-     * 设置所有监听
-     */
-    setAllEvent: (option?: AddEventListenerOptions) => void;
-    /**
-     * 移除所有监听
-     */
-    removeAllEvent: (option?: AddEventListenerOptions) => void;
-    /**
-     * 获取删除按钮的html
-     */
-    getDeleteIconHTML: (size: number, fill: string) => void;
-    /**
-     * 设置当前正在搜索中的提示
-     */
-    setPromptsInSearch: () => void;
-    /**
-     * 移除正在搜索中的提示
-     */
-    removePromptsInSearch: () => void;
-    /**
-     * 清空所有的搜索结果
-     */
-    clearAllSearchItemLi: () => void;
-    /**
-     * 修改搜索建议框的位置(top、left)
-     * 因为目标元素可能是动态隐藏的
-     */
-    changeHintULElementPosition: () => void;
-    /**
-     * 修改搜索建议框的width
-     * 因为目标元素可能是动态隐藏的
-     */
-    changeHintULElementWidth: () => void;
-    updateDynamicCSS: () => void;
-    /**
-     * 更新页面显示的搜索结果
-     */
-    update: (data: T[]) => void;
-    /**
-     * 清空当前的搜索结果并显示无结果
-     */
-    clear: () => void;
-    /**
-     * 隐藏搜索建议框
-     */
-    hide: () => void;
-    /**
-     * 显示搜索建议框
-     */
-    show: () => void;
-}

package/dist/types/src/components/tooltip/index.d.ts

@@ -171,7 +171,55 @@ export type PopsTooltipResult<T extends PopsToolTipDetails> = {
     $shadowRoot: ShadowRoot;
     toolTip: typeof ToolTip.prototype;
 };
-export declare class PopsTooltip {
-    constructor(details: PopsToolTipDetails);
-}
+export declare const PopsTooltip: {
+    init(details: PopsToolTipDetails): {
+        guid: string;
+        config: {
+            target: HTMLElement;
+            content: string | (() => string);
+            position: import("./indexType").PopsTooltipPosition;
+            className: string;
+            isFixed: boolean;
+            alwaysShow: boolean;
+            delayCloseTime: number;
+            triggerShowEventName: string;
+            triggerCloseEventName: string;
+            eventOption: {
+                once: boolean;
+                passive: boolean;
+                signal: {
+                    readonly aborted: boolean;
+                    onabort: ((this: AbortSignal, ev: Event) => any) | null;
+                    readonly reason: any;
+                    throwIfAborted: () => void;
+                    addEventListener: {
+                        <K extends keyof AbortSignalEventMap>(type: K, listener: (this: AbortSignal, ev: AbortSignalEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+                        (type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+                    };
+                    removeEventListener: {
+                        <K extends keyof AbortSignalEventMap>(type: K, listener: (this: AbortSignal, ev: AbortSignalEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+                        (type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+                    };
+                    dispatchEvent: (event: Event) => boolean;
+                };
+                capture: boolean;
+            };
+            showBeforeCallBack: ($toolTip: HTMLElement) => false | void;
+            showAfterCallBack: ($toolTip: HTMLElement) => void;
+            closeBeforeCallBack: ($toolTip: HTMLElement) => false | void;
+            closeAfterCallBack: ($toolTip: HTMLElement) => void;
+            showArrow: boolean;
+            arrowDistance: number;
+            otherDistance: number;
+            useShadowRoot: boolean;
+            only: boolean;
+            zIndex: number | (() => number);
+            style: string | null;
+            beforeAppendToPageCallBack: ($shadowRoot: ShadowRoot | HTMLElement, $shadowContainer: HTMLDivElement) => void;
+        };
+        $shadowContainer: HTMLDivElement;
+        $shadowRoot: HTMLDivElement | ShadowRoot;
+        toolTip: ToolTip;
+    };
+};
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@whitesev/pops",
-  "version": "2.0.6",
+  "version": "2.0.7",
   "description": "弹窗库",
   "main": "dist/index.cjs.js",
   "module": "dist/index.esm.js",

package/src/Pops.ts

@@ -63,28 +63,24 @@ import { PopsDrawer } from "./components/drawer";
 import type { PopsDrawerDetails } from "./components/drawer/indexType";
 import type { PopsFolderDetails } from "./components/folder/indexType";
 import { PopsFolder } from "./components/folder";
-import type { PopsEventDetails } from "./types/event";
 import type { PopsPanelDetails } from "./components/panel/indexType";
 import { PopsPanel } from "./components/panel";
 import { PopsRightClickMenu } from "./components/rightClickMenu";
 import type { PopsRightClickMenuDetails } from "./components/rightClickMenu/indexType";
 import type { PopsIcon } from "./types/icon";
-import type {
-	PopsSearchSuggestionDetails,
-	PopsSearchSuggestionResult,
-} from "./components/searchSuggestion/indexType";
+import type { PopsSearchSuggestionDetails } from "./components/searchSuggestion/indexType";
 import { PopsSearchSuggestion } from "./components/searchSuggestion";
 import { PopsMathFloatUtils } from "./utils/PopsMathUtils";
 import { PanelHandleContentDetails } from "./components/panel/PanelHandleContentDetails";
 import { GlobalConfig } from "./GlobalConfig";
-import { PopsTooltip, type PopsTooltipResult } from "./components/tooltip";
+import { PopsTooltip } from "./components/tooltip";
 import { PopsSafeUtils } from "./utils/PopsSafeUtils";
 
 class Pops {
 	/** 配置 */
 	config = {
 		/** 版本号 */
-		version: "2025.5.12",
+		version: "2025.5.25",
 		cssText: {
 			/** 主CSS */
 			index: indexCSS,
@@ -240,7 +236,8 @@ class Pops {
 	 * @param details 配置
 	 */
 	alert = (details: PopsAlertDetails) => {
-		return new PopsAlert(details) as PopsEventDetails;
+		let dialog = PopsAlert.init(details);
+		return dialog;
 	};
 
 	/**
@@ -248,7 +245,8 @@ class Pops {
 	 * @param details 配置
 	 */
 	confirm = (details: PopsConfirmDetails) => {
-		return new PopsConfirm(details) as PopsEventDetails;
+		let dialog = PopsConfirm.init(details);
+		return dialog;
 	};
 
 	/**
@@ -256,7 +254,8 @@ class Pops {
 	 * @param details 配置
 	 */
 	prompt = (details: PopsPromptDetails) => {
-		return new PopsPrompt(details) as PopsEventDetails;
+		let dialog = PopsPrompt.init(details);
+		return dialog;
 	};
 
 	/**
@@ -264,10 +263,8 @@ class Pops {
 	 * @param details 配置
 	 */
 	loading = (details: PopsLoadingDetails) => {
-		return new PopsLoading(details) as Omit<
-			PopsEventDetails,
-			"$shadowContainer" | "$shadowRoot"
-		>;
+		let popsLoading = PopsLoading.init(details);
+		return popsLoading;
 	};
 
 	/**
@@ -275,17 +272,16 @@ class Pops {
 	 * @param details 配置
 	 */
 	iframe = (details: PopsIframeDetails) => {
-		return new PopsIframe(details) as PopsEventDetails & {
-			iframeElement: HTMLIFrameElement;
-		};
+		let dialog = PopsIframe.init(details);
+		return dialog;
 	};
 
 	/**
 	 * 提示框
 	 * @param details 配置
 	 */
-	tooltip = <T extends PopsToolTipDetails = PopsToolTipDetails>(details: T) => {
-		let popsTooltip = new PopsTooltip(details) as PopsTooltipResult<T>;
+	tooltip = (details: PopsToolTipDetails) => {
+		let popsTooltip = PopsTooltip.init(details);
 		return popsTooltip;
 	};
 
@@ -294,7 +290,8 @@ class Pops {
 	 * @param details 配置
 	 */
 	drawer = (details: PopsDrawerDetails) => {
-		return new PopsDrawer(details) as PopsEventDetails;
+		let dialog = PopsDrawer.init(details);
+		return dialog;
 	};
 
 	/**
@@ -302,7 +299,8 @@ class Pops {
 	 * @param details 配置
 	 */
 	folder = (details: PopsFolderDetails) => {
-		return new PopsFolder(details) as PopsEventDetails;
+		let dialog = PopsFolder.init(details);
+		return dialog;
 	};
 
 	/**
@@ -310,7 +308,8 @@ class Pops {
 	 * @param details 配置
 	 */
 	panel = (details: PopsPanelDetails) => {
-		return new PopsPanel(details) as PopsEventDetails;
+		let dialog = PopsPanel.init(details);
+		return dialog;
 	};
 
 	/**
@@ -318,7 +317,8 @@ class Pops {
 	 * @param details 配置
 	 */
 	rightClickMenu = (details: PopsRightClickMenuDetails) => {
-		return new PopsRightClickMenu(details) as PopsEventDetails;
+		let popsRightClickMenu = PopsRightClickMenu.init(details);
+		return popsRightClickMenu;
 	};
 
 	/**
@@ -326,7 +326,8 @@ class Pops {
 	 * @param details 配置
 	 */
 	searchSuggestion = <T = any>(details: PopsSearchSuggestionDetails<T>) => {
-		return new PopsSearchSuggestion(details) as PopsSearchSuggestionResult<T>;
+		let popsSearchSuggestion = PopsSearchSuggestion.init(details);
+		return popsSearchSuggestion;
 	};
 }
 

package/src/components/alert/index.ts

@@ -9,8 +9,8 @@ import { PopsAlertConfig } from "./config";
 import type { PopsMode } from "../../types/main";
 import type { PopsAlertDetails } from "./indexType";
 
-export class PopsAlert {
-	constructor(details: PopsAlertDetails) {
+export const PopsAlert = {
+	init(details: PopsAlertDetails) {
 		const guid = popsUtils.getRandomGUID();
 		// 设置当前类型
 		const PopsType: PopsMode = "alert";
@@ -154,6 +154,7 @@ export class PopsAlert {
 			});
 		}
 
-		return PopsHandler.handleResultDetails(eventDetails);
-	}
-}
+		let result = PopsHandler.handleResultDetails(eventDetails);
+		return result;
+	},
+};

package/src/components/confirm/index.ts

@@ -8,8 +8,8 @@ import { popsUtils } from "../../utils/PopsUtils";
 import { PopsConfirmConfig } from "./config";
 import type { PopsConfirmDetails } from "./indexType";
 
-export class PopsConfirm {
-	constructor(details: PopsConfirmDetails) {
+export const PopsConfirm = {
+	init(details: PopsConfirmDetails) {
 		const guid = popsUtils.getRandomGUID();
 		// 设置当前类型
 		const PopsType = "confirm";
@@ -164,6 +164,7 @@ export class PopsConfirm {
 				endCallBack: config.dragEndCallBack,
 			});
 		}
-		return PopsHandler.handleResultDetails(eventDetails);
-	}
-}
+		let result = PopsHandler.handleResultDetails(eventDetails);
+		return result;
+	},
+};

package/src/components/drawer/index.ts

@@ -7,8 +7,8 @@ import { popsUtils } from "../../utils/PopsUtils";
 import { PopsDrawerConfig } from "./config";
 import type { PopsDrawerDetails } from "./indexType";
 
-export class PopsDrawer {
-	constructor(details: PopsDrawerDetails) {
+export const PopsDrawer = {
+	init(details: PopsDrawerDetails) {
 		const guid = popsUtils.getRandomGUID();
 		// 设置当前类型
 		const PopsType = "drawer";
@@ -233,6 +233,7 @@ export class PopsDrawer {
 			$shadowContainer: $shadowContainer,
 			$shadowRoot: $shadowRoot,
 		});
-		return PopsHandler.handleResultDetails(eventDetails);
-	}
-}
+		let result = PopsHandler.handleResultDetails(eventDetails);
+		return result;
+	},
+};

package/src/components/drawer/indexType.ts

@@ -18,36 +18,44 @@ export interface PopsDrawerDetails
 	 */
 	title?: Partial<PopsTitleConfig["title"]> & {
 		/**
-		 * 是否启用，默认true
+		 * 是否启用
+		 * @default true
 		 */
 		enable: boolean;
 	};
 	/**
-	 * 打开的方向，默认为right
+	 * 打开的方向
+	 * @default "right"
 	 */
 	direction?: "top" | "bottom" | "left" | "right";
 	/**
 	 * 窗体的大小; 当使用 number 类型时; 以像素为单位，默认为30%
+	 * @default "30%"
 	 */
 	size?: string | number;
 	/**
 	 * 是否在 Drawer 出现时将 body 滚动锁定，默认为false
+	 * @default false
 	 */
 	lockScroll?: boolean;
 	/**
 	 * 是否可以通过按下 ESC 关闭 Drawer，默认为true
+	 * @default true'
 	 */
 	closeOnPressEscape?: boolean;
 	/**
 	 * 打开的延时时间，单位毫秒，默认为0
+	 * @default 0
 	 */
 	openDelay?: number;
 	/**
 	 * 关闭的延时时间，单位毫秒，默认为0
+	 * @default 0
 	 */
 	closeDelay?: number;
 	/**
 	 * border-radius，根据direction自动适应，默认为5
+	 * @default 5
 	 */
 	borderRadius?: number;
 }

package/src/components/folder/index.ts

@@ -10,8 +10,8 @@ import { PopsFolderConfig } from "./config";
 import { Folder_ICON } from "./folderIcon";
 import type { PopsFolderDataConfig, PopsFolderDetails } from "./indexType";
 
-export class PopsFolder {
-	constructor(details: PopsFolderDetails) {
+export const PopsFolder = {
+	init(details: PopsFolderDetails) {
 		const guid = popsUtils.getRandomGUID();
 		// 设置当前类型
 		const PopsType = "folder";
@@ -1034,6 +1034,7 @@ export class PopsFolder {
 			$shadowContainer: $shadowContainer,
 			$shadowRoot: $shadowRoot,
 		});
-		return PopsHandler.handleResultDetails(eventDetails);
-	}
-}
+		let result = PopsHandler.handleResultDetails(eventDetails);
+		return result;
+	},
+};

package/src/components/folder/indexType.ts

@@ -79,10 +79,13 @@ export interface PopsFolderDetails
 		name: "fileName" | "fileSize" | "latestTime";
 		/**
 		 * 是否降序，默认false（升序）
+		 * @default false
 		 */
 		isDesc: boolean;
 		/**
-		 * 触发排序的回调，如果返回true，则中止内部的排序
+		 * 触发排序的回调
+		 * @returns
+		 * + true 中止内部的排序
 		 */
 		callback?: (
 			targert: HTMLElement,

package/src/components/iframe/index.ts

@@ -10,8 +10,8 @@ import { popsUtils } from "../../utils/PopsUtils";
 import { PopsIframeConfig } from "./config";
 import type { PopsIframeDetails } from "./indexType";
 
-export class PopsIframe {
-	constructor(details: PopsIframeDetails) {
+export const PopsIframe = {
+	init(details: PopsIframeDetails) {
 		const guid = popsUtils.getRandomGUID();
 		// 设置当前类型
 		const PopsType = "iframe";
@@ -331,5 +331,5 @@ export class PopsIframe {
 
 		let result = PopsHandler.handleResultDetails(eventDetails);
 		return result;
-	}
-}
+	},
+};