@whitesev/pops 2.0.10 → 2.0.12

package/src/components/prompt/index.ts

@@ -1,7 +1,7 @@
 import { GlobalConfig } from "../../GlobalConfig";
 import { PopsElementHandler } from "../../handler/PopsElementHandler";
 import { PopsHandler } from "../../handler/PopsHandler";
-import { pops } from "../../Pops";
+import { PopsCSS } from "../../PopsCSS";
 import { popsDOMUtils } from "../../utils/PopsDOMUtils";
 import { PopsInstanceUtils } from "../../utils/PopsInstanceUtils";
 import { popsUtils } from "../../utils/PopsUtils";
@@ -21,13 +21,13 @@ export const PopsPrompt = {
 
 		const { $shadowContainer, $shadowRoot } = PopsHandler.handlerShadow(config);
 		PopsHandler.handleInit($shadowRoot, [
-			pops.config.cssText.index,
-			pops.config.cssText.ninePalaceGridPosition,
-			pops.config.cssText.scrollbar,
-			pops.config.cssText.button,
-			pops.config.cssText.anim,
-			pops.config.cssText.common,
-			pops.config.cssText.promptCSS,
+			PopsCSS.index,
+			PopsCSS.ninePalaceGridPosition,
+			PopsCSS.scrollbar,
+			PopsCSS.button,
+			PopsCSS.anim,
+			PopsCSS.common,
+			PopsCSS.promptCSS,
 		]);
 
 		// 先把z-index提取出来

package/src/components/rightClickMenu/config.ts

@@ -1,4 +1,4 @@
-import { pops } from "../../Pops";
+import { PopsIcon } from "../../PopsIcon";
 import type { PopsRightClickMenuDetails } from "./indexType";
 
 export const rightClickMenuConfig =
@@ -8,7 +8,7 @@ export const rightClickMenuConfig =
 			targetSelector: null,
 			data: [
 				{
-					icon: pops.config.iconSVG.search,
+					icon: PopsIcon.getIcon("search")!,
 					iconIsLoading: false,
 					text: "搜索",
 					item: [],
@@ -21,7 +21,7 @@ export const rightClickMenuConfig =
 					},
 				},
 				{
-					icon: pops.config.iconSVG.documentCopy,
+					icon: PopsIcon.getIcon("documentCopy")!,
 					iconIsLoading: false,
 					text: "复制",
 					item: [],
@@ -34,7 +34,7 @@ export const rightClickMenuConfig =
 					},
 				},
 				{
-					icon: pops.config.iconSVG.delete,
+					icon: PopsIcon.getIcon("delete")!,
 					text: "删除",
 					iconIsLoading: false,
 					item: [],
@@ -47,7 +47,7 @@ export const rightClickMenuConfig =
 					},
 				},
 				{
-					icon: pops.config.iconSVG.loading,
+					icon: PopsIcon.getIcon("loading")!,
 					iconIsLoading: true,
 					text: "加载",
 					item: [],
@@ -61,7 +61,7 @@ export const rightClickMenuConfig =
 					},
 				},
 				{
-					icon: pops.config.iconSVG.elemePlus,
+					icon: PopsIcon.getIcon("elemePlus")!,
 					iconIsLoading: true,
 					text: "饿了么",
 					callback(clickEvent, contextMenuEvent, liElement) {
@@ -99,7 +99,7 @@ export const rightClickMenuConfig =
 							},
 							item: [
 								{
-									icon: pops.config.iconSVG.view,
+									icon: PopsIcon.getIcon("view")!,
 									iconIsLoading: false,
 									text: "查看",
 									item: [],

package/src/components/rightClickMenu/index.ts

@@ -1,16 +1,16 @@
 import { OriginPrototype } from "../../Core";
 import { GlobalConfig } from "../../GlobalConfig";
 import { PopsHandler } from "../../handler/PopsHandler";
-import { pops } from "../../Pops";
 import { popsDOMUtils } from "../../utils/PopsDOMUtils";
 import { PopsSafeUtils } from "../../utils/PopsSafeUtils";
 import { popsUtils } from "../../utils/PopsUtils";
 import { rightClickMenuConfig as PopsRightClickMenuConfig } from "./config";
-import type { PopsIcon } from "../../types/icon";
 import type {
 	PopsRightClickMenuDataDetails,
 	PopsRightClickMenuDetails,
 } from "./indexType";
+import { PopsCSS } from "../../PopsCSS";
+import { PopsIcon } from "../../PopsIcon";
 
 export const PopsRightClickMenu = {
 	init(details: PopsRightClickMenuDetails) {
@@ -31,10 +31,10 @@ export const PopsRightClickMenu = {
 		}
 		const { $shadowContainer, $shadowRoot } = PopsHandler.handlerShadow(config);
 		PopsHandler.handleInit($shadowRoot, [
-			pops.config.cssText.index,
-			pops.config.cssText.anim,
-			pops.config.cssText.common,
-			pops.config.cssText.rightClickMenu,
+			PopsCSS.index,
+			PopsCSS.anim,
+			PopsCSS.common,
+			PopsCSS.rightClickMenu,
 		]);
 
 		if (config.style != null) {
@@ -149,8 +149,9 @@ export const PopsRightClickMenu = {
 			/**
 			 * contextmenu事件
 			 * @param event
+			 * @param selectorTarget
 			 */
-			contextMenuEvent(event: PointerEvent) {
+			contextMenuEvent(event: PointerEvent, selectorTarget: HTMLElement) {
 				if (config.preventDefault) {
 					popsDOMUtils.preventEvent(event);
 				}
@@ -158,15 +159,19 @@ export const PopsRightClickMenu = {
 				if (PopsContextMenu.rootElement) {
 					PopsContextMenu.closeAllMenu(PopsContextMenu.rootElement);
 				}
-				let rootElement = PopsContextMenu.showMenu(event, config.data);
+				let rootElement = PopsContextMenu.showMenu(
+					event,
+					config.data,
+					selectorTarget
+				);
 				PopsContextMenu.rootElement = rootElement;
 				if (config.only) {
 					PopsHandler.handlePush(PopsType, {
 						$shadowRoot: $shadowRoot,
 						$shadowContainer: $shadowContainer,
 						guid: guid,
-						animElement: rootElement as HTMLDivElement,
-						popsElement: rootElement as HTMLDivElement,
+						animElement: rootElement,
+						popsElement: rootElement,
 						beforeRemoveCallBack(layerCommonConfig) {
 							PopsContextMenu.closeAllMenu(layerCommonConfig.popsElement);
 						},
@@ -217,7 +222,6 @@ export const PopsRightClickMenu = {
 					popsDOMUtils.off(
 						element,
 						popsDOMUtils.getTransitionEndNameList(),
-						void 0,
 						transitionEndEvent,
 						{
 							capture: true,
@@ -230,7 +234,6 @@ export const PopsRightClickMenu = {
 					popsDOMUtils.on(
 						element,
 						popsDOMUtils.getTransitionEndNameList(),
-						void 0,
 						transitionEndEvent,
 						{
 							capture: true,
@@ -327,10 +330,12 @@ export const PopsRightClickMenu = {
 			 * 显示菜单
 			 * @param menuEvent 触发的事件
 			 * @param _config_
+			 * @param menuListenerRootNode 右键菜单监听的元素
 			 */
 			showMenu(
 				menuEvent: PointerEvent,
-				_config_: PopsRightClickMenuDataDetails[]
+				_config_: PopsRightClickMenuDataDetails[],
+				menuListenerRootNode: HTMLElement
 			) {
 				let menuElement = this.getMenuContainerElement(false);
 				Reflect.set(menuElement, "__menuData__", {
@@ -338,9 +343,10 @@ export const PopsRightClickMenu = {
 				});
 				PopsContextMenu.addMenuLiELement(
 					menuEvent,
-					menuElement as HTMLDivElement,
-					menuElement as HTMLDivElement,
-					_config_
+					menuElement,
+					menuElement,
+					_config_,
+					menuListenerRootNode
 				);
 				/* 先隐藏 */
 				popsDOMUtils.css(menuElement, {
@@ -377,6 +383,7 @@ export const PopsRightClickMenu = {
 			 * @param  _config_
 			 * @param rootElement 根菜单元素
 			 * @param targetLiElement 父li项元素
+			 * @param menuListenerRootNode 右键菜单监听的元素
 			 */
 			showClildMenu(
 				menuEvent: PointerEvent,
@@ -386,7 +393,8 @@ export const PopsRightClickMenu = {
 				},
 				_config_: PopsRightClickMenuDataDetails[],
 				rootElement: HTMLDivElement,
-				targetLiElement: HTMLLIElement
+				targetLiElement: HTMLLIElement,
+				menuListenerRootNode: HTMLElement
 			) {
 				let menuElement = this.getMenuContainerElement(true);
 				Reflect.set(menuElement, "__menuData__", {
@@ -397,10 +405,11 @@ export const PopsRightClickMenu = {
 				let rootElementMenuData = Reflect.get(rootElement, "__menuData__");
 				rootElementMenuData.child.push(menuElement);
 				PopsContextMenu.addMenuLiELement(
-					menuEvent as PointerEvent,
-					rootElement as HTMLDivElement,
-					menuElement as HTMLDivElement,
-					_config_
+					menuEvent,
+					rootElement,
+					menuElement,
+					_config_,
+					menuListenerRootNode
 				);
 				/* 先隐藏 */
 				popsDOMUtils.css(menuElement, {
@@ -430,23 +439,24 @@ export const PopsRightClickMenu = {
 			 * @param rootElement 根元素
 			 * @param menuElement 菜单元素
 			 * @param _config_ 配置
+			 * @param menuListenerRootNode 右键菜单监听的元素
 			 */
 			addMenuLiELement(
 				menuEvent: PointerEvent,
 				rootElement: HTMLDivElement,
 				menuElement: HTMLDivElement,
-				_config_: PopsRightClickMenuDataDetails[]
+				_config_: PopsRightClickMenuDataDetails[],
+				menuListenerRootNode: HTMLElement
 			) {
 				let menuEventTarget = menuEvent.target;
 				let menuULElement = menuElement.querySelector<HTMLUListElement>("ul")!;
 				_config_.forEach((item) => {
 					let menuLiElement =
-						popsUtils.parseTextToDOM<HTMLLIElement>(`<li></li>`);
+						popsDOMUtils.parseTextToDOM<HTMLLIElement>(`<li></li>`);
 					/* 判断有无图标，有就添加进去 */
 					if (typeof item.icon === "string" && item.icon.trim() !== "") {
-						let iconSVGHTML =
-							pops.config.iconSVG[item.icon as PopsIcon] ?? item.icon;
-						let iconElement = popsUtils.parseTextToDOM(
+						let iconSVGHTML = PopsIcon.getIcon(item.icon) ?? item.icon;
+						let iconElement = popsDOMUtils.parseTextToDOM(
 							/*html*/ `<i class="pops-${PopsType}-icon" is-loading="${item.iconIsLoading}">${iconSVGHTML}</i>`
 						);
 						menuLiElement.appendChild(iconElement);
@@ -512,8 +522,9 @@ export const PopsRightClickMenu = {
 								clientY: rect.top,
 							},
 							item.item,
-							rootElement as HTMLDivElement,
-							menuLiElement
+							rootElement,
+							menuLiElement,
+							menuListenerRootNode
 						);
 						(menuLiElement as any).__menuData__ = {
 							child: childMenu,
@@ -536,7 +547,8 @@ export const PopsRightClickMenu = {
 							let callbackResult = await item.callback(
 								clickEvent as PointerEvent,
 								menuEvent,
-								menuLiElement
+								menuLiElement,
+								menuListenerRootNode
 							);
 							if (
 								typeof callbackResult === "boolean" &&

package/src/components/rightClickMenu/indexType.ts

@@ -1,5 +1,5 @@
 import type { PopsCommonConfig } from "../../types/components";
-import type { PopsIcon } from "../../types/icon";
+import type { PopsIconType } from "../../types/icon";
 
 /**
  * pops.rightClickMenu的右键菜单配置
@@ -8,7 +8,7 @@ export interface PopsRightClickMenuDataDetails {
 	/**
 	 * svg图标
 	 */
-	icon: PopsIcon | string;
+	icon: PopsIconType | string;
 	/**
 	 * 图标是否旋转
 	 */
@@ -22,6 +22,7 @@ export interface PopsRightClickMenuDataDetails {
 	 * @param clickEvent 点击菜单的click事件
 	 * @param contextMenuEvent 触发的contextmenu事件
 	 * @param liElement <li>元素
+	 * @param menuListenerRootNode 右键菜单监听的元素
 	 * @returns
 	 * + true(默认) 关闭菜单
 	 * + false 不关闭菜单
@@ -30,7 +31,8 @@ export interface PopsRightClickMenuDataDetails {
 	callback?: (
 		clickEvent: PointerEvent,
 		contextMenuEvent: PointerEvent,
-		liElement: HTMLLIElement
+		liElement: HTMLLIElement,
+		menuListenerRootNode: HTMLElement
 	) => boolean | void | Promise<boolean | void>;
 	/**
 	 * 子项配置

package/src/components/searchSuggestion/index.ts

@@ -1,11 +1,11 @@
 import { PopsHandler } from "../../handler/PopsHandler";
-import { pops } from "../../Pops";
 import { popsDOMUtils } from "../../utils/PopsDOMUtils";
 import { popsUtils } from "../../utils/PopsUtils";
 import { searchSuggestionConfig as PopsSearchSuggestionConfig } from "./config";
 import { GlobalConfig } from "../../GlobalConfig";
 import { PopsSafeUtils } from "../../utils/PopsSafeUtils";
 import type { PopsSearchSuggestionDetails } from "./indexType";
+import { PopsCSS } from "../../PopsCSS";
 
 export const PopsSearchSuggestion = {
 	init(details: PopsSearchSuggestionDetails) {
@@ -29,9 +29,9 @@ export const PopsSearchSuggestion = {
 
 		const { $shadowContainer, $shadowRoot } = PopsHandler.handlerShadow(config);
 		PopsHandler.handleInit($shadowRoot, [
-			pops.config.cssText.index,
-			pops.config.cssText.anim,
-			pops.config.cssText.common,
+			PopsCSS.index,
+			PopsCSS.anim,
+			PopsCSS.common,
 		]);
 
 		if (config.style != null) {
@@ -655,7 +655,7 @@ export const PopsSearchSuggestion = {
 				this.$data.isEmpty = true;
 				this.clearAllSearchItemLi();
 				this.$el.$hintULContainer.appendChild(
-					popsUtils.parseTextToDOM(config.toSearhNotResultHTML)
+					popsDOMUtils.parseTextToDOM(config.toSearhNotResultHTML)
 				);
 				if (config.toHideWithNotResult) {
 					this.hide();

package/src/components/tooltip/index.ts

@@ -1,6 +1,6 @@
 import { GlobalConfig } from "../../GlobalConfig";
 import { PopsHandler } from "../../handler/PopsHandler";
-import { pops } from "../../Pops";
+import { PopsCSS } from "../../PopsCSS";
 import { popsDOMUtils } from "../../utils/PopsDOMUtils";
 import { PopsSafeUtils } from "../../utils/PopsSafeUtils";
 import { popsUtils } from "../../utils/PopsUtils";
@@ -613,10 +613,10 @@ export const PopsTooltip = {
 
 		const { $shadowContainer, $shadowRoot } = PopsHandler.handlerShadow(config);
 		PopsHandler.handleInit($shadowRoot, [
-			pops.config.cssText.index,
-			pops.config.cssText.anim,
-			pops.config.cssText.common,
-			pops.config.cssText.tooltipCSS,
+			PopsCSS.index,
+			PopsCSS.anim,
+			PopsCSS.common,
+			PopsCSS.tooltipCSS,
 		]);
 
 		let toolTip = new ToolTip(config, guid, {

package/src/handler/PopsElementHandler.ts

@@ -1,8 +1,7 @@
 import type { PopsAlertDetails } from "../components/alert/indexType";
 import type { PopsConfirmDetails } from "../components/confirm/indexType";
 import type { PopsIframeDetails } from "../components/iframe/indexType";
-import { pops } from "../Pops";
-import type { PopsIcon } from "../types/icon";
+import type { PopsIconType } from "../types/icon";
 import type {
 	PopsSupportAnim,
 	PopsSupportBottomBtn,
@@ -13,7 +12,8 @@ import type {
 	PopsTypeSupportContent,
 	PopsTypeSupportHeaderTitle,
 } from "../types/main";
-import { popsUtils } from "../utils/PopsUtils";
+import { PopsIcon } from "../PopsIcon";
+import { popsDOMUtils } from "../utils/PopsDOMUtils";
 
 export const PopsElementHandler = {
 	/**
@@ -101,9 +101,7 @@ export const PopsElementHandler = {
 				item = item.toLowerCase();
 				topRightButtonHTML += /*html*/ `
                 <button class="pops-header-control" type="${item}">
-                    <i class="pops-icon">${
-											(pops.config.iconSVG as any)[item]
-										}</i>
+                    <i class="pops-icon">${PopsIcon.getIcon(item)}</i>
                 </button>`;
 			});
 			resultHTML = /*html*/ `
@@ -113,7 +111,7 @@ export const PopsElementHandler = {
 				closeHTML = /*html*/ `
                 <div class="pops-header-controls">
                     <button class="pops-header-control" type="close" data-header>
-                    	<i class="pops-icon">${pops.config.iconSVG["close"]}</i>
+                    	<i class="pops-icon">${PopsIcon.getIcon("close")}</i>
                     </button>
                 </div>`;
 			}
@@ -168,12 +166,12 @@ export const PopsElementHandler = {
 				okButtonSizeClassName = "pops-button-" + config.btn.ok.size;
 			}
 			let okIconHTML = "";
-			let okIcon = __config_confirm.btn.ok!.icon! as PopsIcon | string;
+			let okIcon = __config_confirm.btn.ok!.icon! as PopsIconType | string;
 			if (okIcon !== "") {
 				// 判断图标是否是svg库内的
 				let iconHTML = "";
-				if (okIcon in pops.config.iconSVG) {
-					iconHTML = pops.config.iconSVG[okIcon as PopsIcon];
+				if (PopsIcon.hasIcon(okIcon)) {
+					iconHTML = PopsIcon.getIcon(okIcon)!;
 				} else {
 					iconHTML = okIcon;
 				}
@@ -202,12 +200,14 @@ export const PopsElementHandler = {
 					"pops-button-" + __config_confirm.btn.cancel.size;
 			}
 			let cancelIconHTML = "";
-			let cancelIcon = __config_confirm.btn.cancel!.icon as PopsIcon | string;
+			let cancelIcon = __config_confirm.btn.cancel!.icon as
+				| PopsIconType
+				| string;
 			if (cancelIcon !== "") {
 				let iconHTML = "";
 				// 判断图标是否是svg库内的
-				if (cancelIcon in pops.config.iconSVG) {
-					iconHTML = pops.config.iconSVG[cancelIcon as PopsIcon];
+				if (PopsIcon.hasIcon(cancelIcon)) {
+					iconHTML = PopsIcon.getIcon(cancelIcon)!;
 				} else {
 					iconHTML = cancelIcon;
 				}
@@ -236,12 +236,12 @@ export const PopsElementHandler = {
 					"pops-button-" + __config_confirm.btn.other.size;
 			}
 			let otherIconHTML = "";
-			let otherIcon = __config_confirm.btn.other!.icon as PopsIcon | string;
+			let otherIcon = __config_confirm.btn.other!.icon as PopsIconType | string;
 			if (otherIcon !== "") {
 				let iconHTML = "";
 				// 判断图标是否是svg库内的
-				if (otherIcon in pops.config.iconSVG) {
-					iconHTML = pops.config.iconSVG[otherIcon as PopsIcon];
+				if (PopsIcon.hasIcon(otherIcon)) {
+					iconHTML = PopsIcon.getIcon(otherIcon)!;
 				} else {
 					otherIcon;
 				}
@@ -315,6 +315,6 @@ export const PopsElementHandler = {
 	 * @param html
 	 */
 	parseElement<T extends HTMLElement>(html: string): T {
-		return popsUtils.parseTextToDOM(html);
+		return popsDOMUtils.parseTextToDOM(html);
 	},
 };

package/src/handler/PopsHandler.ts

@@ -7,7 +7,8 @@ import type { PopsLoadingDetails } from "../components/loading/indexType";
 import type { PopsPanelDetails } from "../components/panel/indexType";
 import type { PopsPromptDetails } from "../components/prompt/indexType";
 import { PopsCore } from "../Core";
-import { pops } from "../Pops";
+import { PopsAnimation } from "../PopsAnimation";
+import { PopsLayer } from "../PopsLayer";
 import type { PopsCommonConfig } from "../types/components";
 import { PopsEventDetails, PopsHandlerEventDetails } from "../types/event";
 import { PopsLayerCommonConfig } from "../types/layer";
@@ -50,7 +51,7 @@ export const PopsHandler = {
 		$shadowRoot?: ShadowRoot | HTMLElement,
 		cssText?: string | string[]
 	) {
-		pops.init();
+		PopsAnimation.init();
 		if (!arguments.length) {
 			return;
 		}
@@ -101,7 +102,9 @@ export const PopsHandler = {
 		}
 	) {
 		let result = {
-			maskElement: popsUtils.parseTextToDOM<HTMLDivElement>(details.maskHTML),
+			maskElement: popsDOMUtils.parseTextToDOM<HTMLDivElement>(
+				details.maskHTML
+			),
 		};
 		let isMaskClick = false;
 		/**
@@ -111,7 +114,7 @@ export const PopsHandler = {
 		function clickEvent(event: MouseEvent | PointerEvent) {
 			popsDOMUtils.preventEvent(event);
 			// 获取该类型实例存储列表
-			let targetLayer = pops.config.layer[details.type];
+			let targetLayer = PopsLayer[details.type];
 			function originalRun() {
 				if (details.config.mask!.clickEvent!.toClose) {
 					/* 关闭 */
@@ -400,7 +403,7 @@ export const PopsHandler = {
 			close() {
 				return PopsInstanceUtils.close(
 					mode,
-					pops.config.layer[mode],
+					PopsLayer[mode],
 					guid,
 					config,
 					animElement
@@ -409,7 +412,7 @@ export const PopsHandler = {
 			hide() {
 				return PopsInstanceUtils.hide(
 					mode,
-					pops.config.layer[mode],
+					PopsLayer[mode],
 					guid,
 					config,
 					animElement,
@@ -419,7 +422,7 @@ export const PopsHandler = {
 			show() {
 				return PopsInstanceUtils.show(
 					mode,
-					pops.config.layer[mode],
+					PopsLayer[mode],
 					guid,
 					config,
 					animElement,
@@ -463,7 +466,7 @@ export const PopsHandler = {
 			close() {
 				return PopsInstanceUtils.close(
 					mode,
-					pops.config.layer[mode],
+					PopsLayer[mode],
 					guid,
 					config,
 					animElement
@@ -472,7 +475,7 @@ export const PopsHandler = {
 			hide() {
 				return PopsInstanceUtils.hide(
 					mode,
-					pops.config.layer[mode],
+					PopsLayer[mode],
 					guid,
 					config,
 					animElement,
@@ -482,7 +485,7 @@ export const PopsHandler = {
 			show() {
 				return PopsInstanceUtils.show(
 					mode,
-					pops.config.layer[mode],
+					PopsLayer[mode],
 					guid,
 					config,
 					animElement,
@@ -636,20 +639,20 @@ export const PopsHandler = {
 				type === "tooltip" ||
 				type === "rightClickMenu"
 			) {
-				let layer = pops.config.layer[type as keyof typeof pops.config.layer];
+				let layer = PopsLayer[type as keyof typeof PopsLayer];
 				if (layer) {
 					PopsInstanceUtils.removeInstance([layer], "", true);
 				}
 			} else {
 				PopsInstanceUtils.removeInstance(
 					[
-						pops.config.layer.alert,
-						pops.config.layer.confirm,
-						pops.config.layer.prompt,
-						pops.config.layer.iframe,
-						pops.config.layer.drawer,
-						pops.config.layer.folder,
-						pops.config.layer.panel,
+						PopsLayer.alert,
+						PopsLayer.confirm,
+						PopsLayer.prompt,
+						PopsLayer.iframe,
+						PopsLayer.drawer,
+						PopsLayer.folder,
+						PopsLayer.panel,
 					],
 					"",
 					true
@@ -674,6 +677,6 @@ export const PopsHandler = {
 	 * @param value
 	 */
 	handlePush(type: PopsLayerMode, value: PopsLayerCommonConfig) {
-		pops.config.layer[type].push(value);
+		PopsLayer[type].push(value);
 	},
 };

package/src/types/PopsDOMUtilsEventType.d.ts

@@ -205,23 +205,23 @@ export type PopsDOMUtils_EventType = keyof PopsDOMUtils_Event;
 /**
  * 元素上的events属性
  */
-export interface PopsDOMUtilsEventListenerOptionsAttribute {
+export declare interface PopsDOMUtilsEventListenerOptionsAttribute {
 	/**
-	 * 自定义的ownCallBack
+	 * DOMUtils的ownCallBack，元素上的监听事件就是它，移除事件时也需要传入这个函数
 	 */
-	callback: () => void;
+	callback: (event: Event) => void;
 	/**
 	 * 属性配置
 	 */
-	option: AddEventListenerOptions;
+	option: DOMUtilsEventListenerOption;
 	/**
 	 * 用户添加的事件
 	 */
-	originCallBack: () => void;
+	originCallBack: (event: Event, selectorTarget?: HTMLElement) => void;
 	/**
 	 * 子元素选择器
 	 */
-	selector?: string;
+	selector?: string[];
 }
 
 export type PopsDOMUtilsElementEventType =
@@ -244,3 +244,16 @@ export type ParseHTMLReturnType<T1, T2> = T1 extends true
 		? Document
 		: HTMLElement
 	: HTMLElement;
+
+/**
+ * 事件的额外配置
+ */
+export declare type PopsDOMUtilsEventListenerOption =
+	AddEventListenerOptions & {
+		/**
+		 * 是否使用 event.composedPath() 来代替 event.target
+		 *
+		 * 一般用于设置了selector参数
+		 */
+		isComposedPath?: boolean;
+	};

package/src/types/button.d.ts

@@ -1,5 +1,5 @@
 import { PopsEventDetails, PopsHandlerEventDetails } from "./event";
-import type { PopsIcon } from "./icon";
+import type { PopsIconType } from "./icon";
 
 /**
  * 按钮类型
@@ -79,7 +79,7 @@ export interface PopsButtonDetails<T = {}> {
 	/**
 	 * 图标按钮，如果名字为内置的，则使用内置的，否则为自定义的svg
 	 */
-	icon: PopsIcon;
+	icon: PopsIconType;
 	/**
 	 * 图标按钮是否放在右边
 	 */
@@ -125,7 +125,7 @@ export interface PopsButtonDetailsAnyType<T = {}> {
 	/**
 	 * 图标按钮，如果名字为内置的，则使用内置的，否则为自定义的svg
 	 */
-	icon: PopsIcon;
+	icon: PopsIconType;
 	/**
 	 * 图标按钮是否放在右边
 	 */

package/src/types/icon.d.ts

@@ -1,7 +1,7 @@
 /**
  * 按钮svg图标
  */
-export type PopsIcon =
+export type PopsIconType =
 	| "min"
 	| "mise"
 	| "max"