@whitesev/pops 2.2.0 → 2.2.2

package/src/handler/PopsHandler.ts

@@ -8,15 +8,15 @@ import type { PopsPanelDetails } from "../components/panel/types";
 import type { PopsPromptDetails } from "../components/prompt/types/index";
 import { PopsCore } from "../PopsCore";
 import { PopsAnimation } from "../PopsAnimation";
-import { PopsLayerData } from "../PopsLayer";
+import { PopsInstData } from "../PopsInst";
 import type { PopsCommonConfig } from "../types/components";
 import { PopsEventDetails, PopsHandlerEventDetails } from "../types/event";
-import { PopsLayerCommonConfig } from "../types/layer";
+import { PopsInstCommonConfig } from "../types/inst";
 import type {
-	PopsAllDetails,
-	PopsLayerMode,
-	PopsMode,
+	PopsInstStoreType,
 	PopsType,
+	PopsSupportAnimDetailsType,
+	PopsSupportOnlyDetails,
 } from "../types/main";
 import { popsDOMUtils } from "../utils/PopsDOMUtils";
 import { PopsInstanceUtils } from "../utils/PopsInstanceUtils";
@@ -145,13 +145,13 @@ export const PopsHandler = {
 		function clickEvent(event: MouseEvent | PointerEvent) {
 			popsDOMUtils.preventEvent(event);
 			// 获取该类型实例存储列表
-			let targetLayer = PopsLayerData[details.type];
+			let targetInst = PopsInstData[details.type];
 			function originalRun() {
 				if (details.config.mask!.clickEvent!.toClose) {
 					/* 关闭 */
 					return PopsInstanceUtils.close(
 						details.type,
-						targetLayer,
+						targetInst,
 						details.guid,
 						details.config,
 						details.animElement
@@ -160,7 +160,7 @@ export const PopsHandler = {
 					/* 隐藏 */
 					return PopsInstanceUtils.hide(
 						details.type,
-						targetLayer,
+						targetInst,
 						details.guid,
 						details.config,
 						details.animElement,
@@ -234,7 +234,10 @@ export const PopsHandler = {
 	 * @param animElement
 	 * @param type
 	 */
-	handleQueryElement(animElement: HTMLDivElement, type: PopsType) {
+	handleQueryElement(
+		animElement: HTMLDivElement,
+		type: PopsSupportAnimDetailsType
+	) {
 		return {
 			/**
 			 * 主元素
@@ -408,7 +411,7 @@ export const PopsHandler = {
 		guid: string,
 		$shadowContainer: HTMLDivElement,
 		$shadowRoot: ShadowRoot | HTMLElement,
-		mode: PopsLayerMode,
+		mode: PopsInstStoreType,
 		animElement: HTMLDivElement,
 		popsElement: HTMLDivElement,
 		maskElement: HTMLDivElement,
@@ -434,7 +437,7 @@ export const PopsHandler = {
 			close() {
 				return PopsInstanceUtils.close(
 					mode,
-					PopsLayerData[mode],
+					PopsInstData[mode],
 					guid,
 					config,
 					animElement
@@ -443,7 +446,7 @@ export const PopsHandler = {
 			hide() {
 				return PopsInstanceUtils.hide(
 					mode,
-					PopsLayerData[mode],
+					PopsInstData[mode],
 					guid,
 					config,
 					animElement,
@@ -453,7 +456,7 @@ export const PopsHandler = {
 			show() {
 				return PopsInstanceUtils.show(
 					mode,
-					PopsLayerData[mode],
+					PopsInstData[mode],
 					guid,
 					config,
 					animElement,
@@ -497,7 +500,7 @@ export const PopsHandler = {
 			close() {
 				return PopsInstanceUtils.close(
 					mode,
-					PopsLayerData[mode],
+					PopsInstData[mode],
 					guid,
 					config,
 					animElement
@@ -506,7 +509,7 @@ export const PopsHandler = {
 			hide() {
 				return PopsInstanceUtils.hide(
 					mode,
-					PopsLayerData[mode],
+					PopsInstData[mode],
 					guid,
 					config,
 					animElement,
@@ -516,7 +519,7 @@ export const PopsHandler = {
 			show() {
 				return PopsInstanceUtils.show(
 					mode,
-					PopsLayerData[mode],
+					PopsInstData[mode],
 					guid,
 					config,
 					animElement,
@@ -660,30 +663,33 @@ export const PopsHandler = {
 	 * @param type 当前弹窗类型
 	 * @param config 配置
 	 */
-	handleOnly<T extends Required<PopsAllDetails[keyof PopsAllDetails]>>(
-		type: PopsMode,
-		config: T
-	): T {
+	handleOnly<
+		T extends Required<PopsSupportOnlyDetails[keyof PopsSupportOnlyDetails]>
+	>(type: PopsType, config: T): T {
 		if (config.only) {
+			// .loading
+			// .tooltip
+			// .rightClickMenu
+			// 单独处理
 			if (
 				type === "loading" ||
 				type === "tooltip" ||
 				type === "rightClickMenu"
 			) {
-				let layer = PopsLayerData[type as keyof typeof PopsLayerData];
-				if (layer) {
-					PopsInstanceUtils.removeInstance([layer], "", true);
+				let inst = PopsInstData[type as keyof typeof PopsInstData];
+				if (inst) {
+					PopsInstanceUtils.removeInstance([inst], "", true);
 				}
 			} else {
 				PopsInstanceUtils.removeInstance(
 					[
-						PopsLayerData.alert,
-						PopsLayerData.confirm,
-						PopsLayerData.prompt,
-						PopsLayerData.iframe,
-						PopsLayerData.drawer,
-						PopsLayerData.folder,
-						PopsLayerData.panel,
+						PopsInstData.alert,
+						PopsInstData.confirm,
+						PopsInstData.prompt,
+						PopsInstData.iframe,
+						PopsInstData.drawer,
+						PopsInstData.folder,
+						PopsInstData.panel,
 					],
 					"",
 					true
@@ -707,7 +713,7 @@ export const PopsHandler = {
 	 * @param type 当前弹窗类型
 	 * @param value
 	 */
-	handlePush(type: PopsLayerMode, value: PopsLayerCommonConfig) {
-		PopsLayerData[type].push(value);
+	handlePush(type: PopsInstStoreType, value: PopsInstCommonConfig) {
+		PopsInstData[type].push(value);
 	},
 };

package/src/types/button.d.ts

@@ -1,6 +1,6 @@
 import { PopsEventDetails, PopsHandlerEventDetails } from "./event";
 import type { PopsIconType } from "./icon";
-import type { PopsMode } from "./main";
+import type { PopsType } from "./main";
 
 /**
  * 按钮类型
@@ -51,7 +51,7 @@ export interface PopsBtnCallBackEvent {
 	/**
 	 * 调用的方法
 	 */
-	mode: PopsMode;
+	mode: PopsType;
 	/**
 	 * 唯一id
 	 */

package/src/types/components.d.ts

@@ -21,17 +21,17 @@ export interface PopsTitleConfig {
 		 */
 		text?: string;
 		/**
-		 * 文字的位置
+		 * 标题文字的位置
 		 * @default "left"
 		 */
 		position?: PopsTextAlign;
 		/**
-		 * 文字是否是html
+		 * 标题文字是否是html
 		 * @default false
 		 */
 		html?: boolean;
 		/**
-		 * 文字的自定义CSS
+		 * 自定义CSS
 		 */
 		style?: string;
 	};
@@ -47,12 +47,12 @@ export interface PopsContentConfig {
 		 */
 		text?: string;
 		/**
-		 * 文字是否是html
+		 * 内容文字是否是html
 		 * @default false
 		 */
 		html?: boolean;
 		/**
-		 * 文字的自定义CSS
+		 * 自定义CSS
 		 */
 		style?: string;
 	};

package/src/types/event.d.ts

@@ -1,5 +1,5 @@
 import type { PopsIframeDetails } from "../components/iframe/types";
-import type { PopsMode } from "./main";
+import type { PopsType } from "./main";
 
 /**
  * 事件配置
@@ -12,7 +12,7 @@ export interface PopsIframeEventDetails {
 	/**
 	 * 当前弹窗类型
 	 */
-	mode: PopsMode;
+	mode: PopsType;
 	/**
 	 * 动画层
 	 */
@@ -47,7 +47,7 @@ export interface PopsEventDetails {
 	/** 遮罩层 */
 	maskElement?: HTMLDivElement;
 	/** 当前弹窗类型 */
-	mode: PopsMode;
+	mode: PopsType;
 	guid: string;
 	close: () => Promise<void>;
 	hide: () => Promise<void>;

package/src/types/{layer.d.ts → inst.d.ts}

@@ -1,7 +1,7 @@
 /**
- * config内存储饿实例配置
+ * config实例配置
  */
-export interface PopsLayerConfig {
+export interface PopsInstConfig {
 	/** 固定id */
 	guid: string;
 	/** 动画元素 */
@@ -11,12 +11,14 @@ export interface PopsLayerConfig {
 	/** 遮罩层元素 */
 	maskElement?: HTMLDivElement;
 }
-
-export interface PopsLayerCommonConfig extends PopsLayerConfig {
+/**
+ * config实例通用配置
+ */
+export interface PopsInstCommonConfig extends PopsInstConfig {
 	/** shadow容器 */
 	$shadowContainer: HTMLDivElement;
 	/** shadow容器的shandowRoot */
 	$shadowRoot: ShadowRoot | HTMLElement;
 	/** 移除实例前的回调函数 */
-	beforeRemoveCallBack?: (layerCommonConfig: PopsLayerCommonConfig) => void;
+	beforeRemoveCallBack?: (instCommonConfig: PopsInstCommonConfig) => void;
 }

package/src/types/main.d.ts

@@ -16,13 +16,14 @@ import type { PopsPanelTextAreaDetails } from "../components/panel/types/compone
 import type { PopsPromptDetails } from "../components/prompt/types/index";
 import { PopsRightClickMenuDetails } from "../components/rightClickMenu/types";
 import { PopsToolTipDetails } from "../components/tooltip/types/index";
+import type { PopsSearchSuggestionDetails } from "../components/searchSuggestion/types";
 
 export interface PopsUtilsOwnObject<V extends any> {
 	[key: string]: V | PopsUtilsOwnObject<V>;
 }
 
-/** pops的所有类型配置 10个 */
-export interface PopsAllDetails {
+/** pops所有的类型配置 11个*/
+export interface PopsDetails {
 	alert: PopsAlertDetails;
 	confirm: PopsConfirmDetails;
 	prompt: PopsPromptDetails;
@@ -33,78 +34,55 @@ export interface PopsAllDetails {
 	folder: PopsFolderDetails;
 	panel: PopsPanelDetails;
 	rightClickMenu: PopsRightClickMenuDetails;
+	searchSuggestion: PopsSearchSuggestionDetails;
 }
 
-/** pops的类型配置 8个 */
-export interface PopsTypeDetails {
-	alert: PopsAlertDetails;
-	confirm: PopsConfirmDetails;
-	prompt: PopsPromptDetails;
-	loading: PopsLoadingDetails;
-	iframe: PopsIframeDetails;
-	// tooltip: PopsToolTipDetails;
-	drawer: PopsDrawerDetails;
-	folder: PopsFolderDetails;
-	panel: PopsPanelDetails;
-	// rightClickMenu: PopsRightClickMenuDetails;
-}
+/** pops的类型 */
+export type PopsType = keyof PopsDetails;
 
-/** pops的类型 8个 */
-export type PopsType = keyof PopsTypeDetails;
+/** pops中支持only的配置 */
+export type PopsSupportOnlyDetails = Omit<PopsDetails, "searchSuggestion">;
 
-/** pops所有的类型 10个 */
-export type PopsMode = PopsType | "tooltip" | "rightClickMenu";
+/** 存储实例的类型 */
+export type PopsInstStoreType = keyof Omit<PopsDetails, "searchSuggestion">;
 
-/** 存储实例的类型 9个 */
-export type PopsLayerMode = PopsType | "tooltip" | "rightClickMenu";
+/** pops弹窗支持动画元素的配置 8个 */
+export type PopsSupportAnimDetails = Omit<
+	PopsDetails,
+	"tooltip" | "rightClickMenu" | "searchSuggestion"
+>;
 
-/** pops弹窗支持动画元素的配置 */
-export interface PopsSupportAnim {
-	alert: PopsAlertDetails;
-	confirm: PopsConfirmDetails;
-	prompt: PopsPromptDetails;
-	loading: PopsLoadingDetails;
-	iframe: PopsIframeDetails;
-	drawer: PopsDrawerDetails;
-	folder: PopsFolderDetails;
-	panel: PopsPanelDetails;
-}
 /** pops弹窗支持动画元素的类型 */
-export type PopsTypeSupportAnim = keyof PopsSupportAnim;
+export type PopsSupportAnimDetailsType = keyof PopsSupportAnimDetails;
 
 /** pops弹窗支持标题栏的配置 */
-export interface PopsSupportHeaderTitle {
-	alert: PopsAlertDetails;
-	confirm: PopsConfirmDetails;
-	prompt: PopsPromptDetails;
-	iframe: PopsIframeDetails;
-	drawer: PopsDrawerDetails;
-	folder: PopsFolderDetails;
-	panel: PopsPanelDetails;
-}
+export type PopsSupportHeaderTitleDetails = Pick<
+	PopsDetails,
+	"alert" | "confirm" | "prompt" | "iframe" | "drawer" | "folder" | "panel"
+>;
+
 /** pops弹窗支持标题栏的类型 */
-export type PopsTypeSupportHeaderTitle = keyof PopsSupportHeaderTitle;
+export type PopsSupportHeaderTitleDetailsType =
+	keyof PopsSupportHeaderTitleDetails;
 
 /** pops支持底部按钮的配置 */
-export interface PopsSupportBottomBtn {
-	alert: PopsAlertDetails;
-	confirm: PopsConfirmDetails;
-	prompt: PopsPromptDetails;
-	drawer: PopsDrawerDetails;
-}
+export type PopsSupportBottomBtnDetails = Pick<
+	PopsDetails,
+	"alert" | "confirm" | "prompt" | "drawer"
+>;
+
 /** pops支持底部按钮的类型 */
-export type PopsTypeSupportBottomBtn = keyof PopsSupportHeaderTitle;
+export type PopsSupportBottomBtnDetailsType =
+	keyof PopsSupportHeaderTitleDetails;
 
 /** pops支持中间内容的配置 */
-export interface PopsSupportContent {
-	alert: PopsAlertDetails;
-	confirm: PopsConfirmDetails;
-	prompt: PopsPromptDetails;
-	drawer: PopsDrawerDetails;
-	loading: PopsLoadingDetails;
-}
+export type PopsSupportContentDetails = Pick<
+	PopsDetails,
+	"alert" | "confirm" | "prompt" | "drawer" | "loading"
+>;
+
 /** pops支持中间内容的类型 */
-export type PopsTypeSupportContent = keyof PopsSupportContent;
+export type PopsSupportContentDetailsType = keyof PopsSupportContentDetails;
 
 /** panel的各种类型的配置项 */
 export type PopsPanelFormsTotalDetails =