@whitesev/pops 2.6.1 → 3.0.0

package/src/components/tooltip/index.ts

@@ -5,8 +5,8 @@ import type { PopsType } from "../../types/main";
 import { popsDOMUtils } from "../../utils/PopsDOMUtils";
 import { PopsSafeUtils } from "../../utils/PopsSafeUtils";
 import { popsUtils } from "../../utils/PopsUtils";
-import { PopsTooltipConfig } from "./config";
-import type { PopsToolTipDetails } from "./types/index";
+import { PopsTooltipDefaultConfig } from "./defaultConfig";
+import type { PopsToolTipConfig } from "./types/index";
 
 type ToolTipEventTypeName = "MouseEvent" | "TouchEvent";
 
@@ -19,13 +19,13 @@ export class ToolTip {
     $arrow: null as unknown as HTMLElement,
   };
   $data = {
-    config: null as any as Required<PopsToolTipDetails>,
+    config: null as any as Required<PopsToolTipConfig>,
     guid: null as any as string,
     timeId_close_TouchEvent: <number[]>[],
     timeId_close_MouseEvent: <number[]>[],
   };
   constructor(
-    config: Required<PopsToolTipDetails>,
+    config: Required<PopsToolTipConfig>,
     guid: string,
     ShadowInfo: {
       $shadowContainer: HTMLDivElement;
@@ -86,7 +86,7 @@ export class ToolTip {
     // 添加z-index
     $toolTipContainer.style.zIndex = PopsHandler.handleZIndex(this.$data.config.zIndex).toString();
     if (this.$data.config.style != null) {
-      /* 添加自定义style */
+      // 添加自定义style
       const cssNode = popsDOMUtils.createElement("style", {
         type: "text/css",
         innerHTML: this.$data.config.style,
@@ -173,9 +173,9 @@ export class ToolTip {
 
     const toolTipElement_width = popsDOMUtils.outerWidth(this.$el.$toolTip);
     const toolTipElement_height = popsDOMUtils.outerHeight(this.$el.$toolTip);
-    /* 目标元素的x轴的中间位置 */
+    // 目标元素的x轴的中间位置
     const targetElement_X_center_pos = targetElement_left + targetElement_width / 2 - toolTipElement_width / 2;
-    /* 目标元素的Y轴的中间位置 */
+    // 目标元素的Y轴的中间位置
     const targetElement_Y_center_pos = targetElement_top + targetElement_height / 2 - toolTipElement_height / 2;
 
     let mouseX = 0;
@@ -235,7 +235,7 @@ export class ToolTip {
    */
   changePosition(event?: MouseEvent | TouchEvent | PointerEvent) {
     const positionInfo = this.calcToolTipPosition(
-      this.$data.config.target,
+      this.$data.config.$target,
       this.$data.config.arrowDistance,
       this.$data.config.otherDistance,
       event
@@ -348,7 +348,7 @@ export class ToolTip {
    */
   onShowEvent() {
     popsDOMUtils.on(
-      this.$data.config.target,
+      this.$data.config.$target,
       this.$data.config.triggerShowEventName,
       this.show,
       this.$data.config.eventOption
@@ -358,7 +358,7 @@ export class ToolTip {
    * 取消绑定 显示事件
    */
   offShowEvent() {
-    popsDOMUtils.off(this.$data.config.target, this.$data.config.triggerShowEventName, this.show, {
+    popsDOMUtils.off(this.$data.config.$target, this.$data.config.triggerShowEventName, this.show, {
       capture: true,
     });
   }
@@ -373,7 +373,7 @@ export class ToolTip {
     if (event && event instanceof MouseEvent) {
       const $target = event.composedPath()[0];
       // 如果是目标元素的子元素/tooltip元素的子元素触发的话，那就不管
-      if ($target != this.$data.config.target && $target != this.$el.$toolTip) {
+      if ($target != this.$data.config.$target && $target != this.$el.$toolTip) {
         return;
       }
     }
@@ -418,7 +418,7 @@ export class ToolTip {
    */
   onCloseEvent() {
     popsDOMUtils.on(
-      this.$data.config.target,
+      this.$data.config.$target,
       this.$data.config.triggerCloseEventName,
       this.close,
       this.$data.config.eventOption
@@ -428,7 +428,7 @@ export class ToolTip {
    * 取消绑定 关闭事件
    */
   offCloseEvent() {
-    popsDOMUtils.off(this.$data.config.target, this.$data.config.triggerCloseEventName, this.close, {
+    popsDOMUtils.off(this.$data.config.$target, this.$data.config.triggerCloseEventName, this.close, {
       capture: true,
     });
   }
@@ -537,7 +537,7 @@ export class ToolTip {
   }
 }
 
-export type PopsTooltipResult<T extends PopsToolTipDetails> = {
+export type PopsTooltipResult<T extends PopsToolTipConfig> = {
   guid: string;
   config: T;
   $shadowContainer: HTMLDivElement;
@@ -546,15 +546,15 @@ export type PopsTooltipResult<T extends PopsToolTipDetails> = {
 };
 
 export const PopsTooltip = {
-  init(details: PopsToolTipDetails) {
+  init(__config__: PopsToolTipConfig) {
     const guid = popsUtils.getRandomGUID();
     // 设置当前类型
     const popsType: PopsType = "tooltip";
 
-    let config = PopsTooltipConfig();
+    let config = PopsTooltipDefaultConfig();
     config = popsUtils.assign(config, GlobalConfig.getGlobalConfig());
-    config = popsUtils.assign(config, details);
-    if (!(config.target instanceof HTMLElement)) {
+    config = popsUtils.assign(config, __config__);
+    if (!(config.$target instanceof HTMLElement)) {
       throw new TypeError("config.target 必须是HTMLElement类型");
     }
     config = PopsHandler.handleOnly(popsType, config);
@@ -584,11 +584,11 @@ export const PopsTooltip = {
       $shadowRoot,
     });
     if (config.alwaysShow) {
-      /* 总是显示 */
-      /* 直接显示 */
+      // 总是显示
+      // 直接显示
       toolTip.show();
     } else {
-      /* 事件触发才显示 */
+      // 事件触发才显示
     }
 
     return {

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

@@ -1,5 +1,5 @@
-import type { PopsCommonConfig } from "../../../types/components";
-import type { PopsPanelCommonDetails } from "../../panel/types/components-common";
+import type { PopsGeneralConfig } from "../../../types/components";
+import type { PopsPanelGeneralConfig } from "../../panel/types/components-common";
 
 /** tooltip的出现位置 */
 export type PopsTooltipPosition = "top" | "right" | "bottom" | "left" | "follow";
@@ -7,12 +7,12 @@ export type PopsTooltipPosition = "top" | "right" | "bottom" | "left" | "follow"
 /**
  * pops.tooltip
  */
-export interface PopsToolTipDetails
-  extends Pick<PopsCommonConfig, "useShadowRoot" | "only" | "zIndex" | "style" | "beforeAppendToPageCallBack"> {
+export interface PopsToolTipConfig
+  extends Pick<PopsGeneralConfig, "useShadowRoot" | "only" | "zIndex" | "style" | "beforeAppendToPageCallBack"> {
   /**
    * 目标元素
    */
-  target: HTMLElement;
+  $target: HTMLElement;
   /**
    * 显示的文字
    */
@@ -36,7 +36,7 @@ export interface PopsToolTipDetails
    * + `github-tooltip` github的样式
    * @default ""
    */
-  className?: PopsPanelCommonDetails<any>["className"];
+  className?: PopsPanelGeneralConfig<any>["className"];
   /**
    * 是否使用fixed定位，false则是absolute定位
    *
@@ -69,7 +69,9 @@ export interface PopsToolTipDetails
    * 监听的事件配置
    */
   eventOption?: {
-    [P in keyof AddEventListenerOptions]: AddEventListenerOptions[P];
+    once?: boolean;
+    passive?: boolean;
+    capture?: boolean;
   };
   /**
    * 触发显示前的回调

package/src/config/GlobalConfig.ts

@@ -1,11 +1,11 @@
-import type { PopsCommonConfig, PopsDragConfig } from "../types/components";
+import type { PopsGeneralConfig, PopsDragConfig } from "../types/components";
 
 type EnterReturnType<T> = null | T | (() => T);
 
 type GlobalConfigOption = {
   style?: EnterReturnType<string>;
   zIndex?: EnterReturnType<number> | EnterReturnType<string>;
-} & Partial<PopsCommonConfig> &
+} & Partial<PopsGeneralConfig> &
   Partial<PopsDragConfig>;
 
 type ResultGlobalConfigOption<T> = T extends null | undefined ? never : T extends (...args: any) => infer R ? R : T;

package/src/handler/PopsElementHandler.ts

@@ -1,16 +1,16 @@
-import type { PopsAlertDetails } from "../components/alert/types";
-import type { PopsConfirmDetails } from "../components/confirm/types";
-import type { PopsIframeDetails } from "../components/iframe/types";
+import type { PopsAlertConfig } from "../components/alert/types";
+import type { PopsConfirmConfig } from "../components/confirm/types";
+import type { PopsIframeConfig } from "../components/iframe/types";
 import type { PopsIconType } from "../types/icon";
 import type {
-  PopsSupportAnimDetails,
-  PopsSupportBottomBtnDetails,
-  PopsSupportContentDetails,
-  PopsSupportHeaderTitleDetails,
-  PopsSupportAnimDetailsType,
-  PopsSupportBottomBtnDetailsType,
-  PopsSupportContentDetailsType,
-  PopsSupportHeaderTitleDetailsType,
+  PopsSupportAnimConfig,
+  PopsSupportBottomButtonConfig,
+  PopsSupportContentConfig,
+  PopsSupportHeaderTitleConfig,
+  PopsSupportAnimConfigType,
+  PopsSupportBottomButtonConfigType,
+  PopsSupportContentConfigType,
+  PopsSupportHeaderTitleConfigType,
 } from "../types/main";
 import { PopsIcon } from "../PopsIcon";
 import { popsDOMUtils } from "../utils/PopsDOMUtils";
@@ -40,13 +40,13 @@ export const PopsElementHandler = {
    */
   createAnim(
     guid: string,
-    type: PopsSupportAnimDetailsType,
-    config: PopsSupportAnimDetails[keyof PopsSupportAnimDetails],
+    type: PopsSupportAnimConfigType,
+    config: PopsSupportAnimConfig[keyof PopsSupportAnimConfig],
     html = "",
     bottomBtnHTML = "",
     zIndex: number
   ) {
-    const __config = config as PopsAlertDetails;
+    const __config = config as PopsAlertConfig;
     let popsAnimStyle = "";
     let popsStyle = "";
     const popsPosition = __config.position || "";
@@ -76,22 +76,22 @@ export const PopsElementHandler = {
    * @param config
    */
   createHeader(
-    type: PopsSupportHeaderTitleDetailsType,
-    config: PopsSupportHeaderTitleDetails[keyof PopsSupportHeaderTitleDetails]
+    type: PopsSupportHeaderTitleConfigType,
+    config: PopsSupportHeaderTitleConfig[keyof PopsSupportHeaderTitleConfig]
   ): string {
     if (!config.btn) {
       return "";
     }
-    const confirm_config = config as PopsConfirmDetails;
+    const confirm_config = config as PopsConfirmConfig;
     if (type !== "iframe" && !confirm_config.btn?.close?.enable) {
       return "";
     }
     let resultHTML = "";
     // let btnStyle = "";
     let closeHTML = "";
-    const iframe_config = config as PopsIframeDetails;
+    const iframe_config = config as PopsIframeConfig;
     if (type === "iframe" && iframe_config.topRightButton?.trim() !== "") {
-      /* iframe的 */
+      // iframe的
       let topRightButtonHTML = "";
       iframe_config.topRightButton.split("|").forEach((item: string) => {
         // 最小化、最大化、窗口化、关闭按钮
@@ -124,8 +124,8 @@ export const PopsElementHandler = {
    * @param config 弹窗配置
    */
   createHeaderStyle(
-    type: PopsSupportHeaderTitleDetailsType,
-    config: PopsSupportHeaderTitleDetails[keyof PopsSupportHeaderTitleDetails]
+    type: PopsSupportHeaderTitleConfigType,
+    config: PopsSupportHeaderTitleConfig[keyof PopsSupportHeaderTitleConfig]
   ) {
     return {
       headerStyle: config?.title?.html ? config?.title?.style || "" : "",
@@ -138,14 +138,14 @@ export const PopsElementHandler = {
    * @param config
    */
   createBottom(
-    type: PopsSupportBottomBtnDetailsType,
-    config: Omit<PopsSupportBottomBtnDetails[keyof PopsSupportBottomBtnDetails], "content">
+    type: PopsSupportBottomButtonConfigType,
+    config: Omit<PopsSupportBottomButtonConfig[keyof PopsSupportBottomButtonConfig], "content">
   ): string {
     if (config.btn == null) {
       // 未设置btn参数
       return "";
     }
-    const confirm_config = config as Required<PopsConfirmDetails>;
+    const confirm_config = config as Required<PopsConfirmConfig>;
     if (!(config.btn?.ok?.enable || confirm_config.btn?.cancel?.enable || confirm_config.btn?.other?.enable)) {
       // 确定、取消、其它按钮都未启用直接返回
       return "";
@@ -164,7 +164,7 @@ export const PopsElementHandler = {
       btnStyle += "flex-direction: row-reverse;";
     }
     if (config.btn?.ok?.enable) {
-      /* 处理确定按钮的尺寸问题 */
+      // 处理确定按钮的尺寸问题
       let okButtonSizeClassName = "";
       if (config.btn.ok.size === "large") {
         okButtonSizeClassName = "pops-button-" + config.btn.ok.size;
@@ -196,7 +196,7 @@ export const PopsElementHandler = {
     }
 
     if (confirm_config.btn?.cancel?.enable) {
-      /* 处理取消按钮的尺寸问题 */
+      // 处理取消按钮的尺寸问题
       let cancelButtonSizeClassName = "";
 
       if (confirm_config.btn.cancel.size === "large") {
@@ -229,7 +229,7 @@ export const PopsElementHandler = {
     }
 
     if (confirm_config.btn?.other?.enable) {
-      /* 处理其它按钮的尺寸问题 */
+      // 处理其它按钮的尺寸问题
       let otherButtonSizeClassName = "";
 
       if (confirm_config.btn.other.size === "large") {
@@ -285,12 +285,11 @@ export const PopsElementHandler = {
    * @param config 弹窗配置
    */
   createContentStyle(
-    type: PopsSupportContentDetailsType,
-    config: PopsSupportContentDetails[keyof PopsSupportContentDetails]
+    type: PopsSupportContentConfigType,
+    config: PopsSupportContentConfig[keyof PopsSupportContentConfig]
   ) {
     return {
       contentStyle: (config?.content as any)?.html ? config?.content?.style || "" : "",
-
       contentPStyle: (config?.content as any)?.html ? "" : config?.content?.style || "",
     };
   },

package/src/handler/PopsHandler.ts

@@ -1,18 +1,18 @@
-import type { PopsAlertDetails } from "../components/alert/types";
-import type { PopsConfirmDetails } from "../components/confirm/types";
-import type { PopsDrawerDetails } from "../components/drawer/types";
-import type { PopsFolderDetails } from "../components/folder/types";
-import type { PopsIframeDetails } from "../components/iframe/types";
-import type { PopsLoadingDetails } from "../components/loading/types";
-import type { PopsPanelDetails } from "../components/panel/types";
-import type { PopsPromptDetails } from "../components/prompt/types/index";
+import type { PopsAlertConfig } from "../components/alert/types";
+import type { PopsConfirmConfig } from "../components/confirm/types";
+import type { PopsDrawerConfig } from "../components/drawer/types";
+import type { PopsFolderConfig } from "../components/folder/types";
+import type { PopsIframeConfig } from "../components/iframe/types";
+import type { PopsLoadingConfig } from "../components/loading/types";
+import type { PopsPanelConfig } from "../components/panel/types";
+import type { PopsPromptConfig } from "../components/prompt/types/index";
 import { PopsCore } from "../PopsCore";
 import { PopsAnimation } from "../PopsAnimation";
 import { PopsInstData } from "../PopsInst";
-import type { PopsCommonConfig } from "../types/components";
+import type { PopsGeneralConfig } from "../types/components";
 import type { PopsEventConfig, PopsHandlerEventConfig } from "../types/event";
-import type { PopsInstCommonConfig } from "../types/inst";
-import type { PopsInstStoreType, PopsType, PopsSupportAnimDetailsType, PopsSupportOnlyDetails } from "../types/main";
+import type { PopsInstGeneralConfig } from "../types/inst";
+import type { PopsInstStoreType, PopsType, PopsSupportAnimConfigType, PopsSupportOnlyConfig } from "../types/main";
 import { popsDOMUtils } from "../utils/PopsDOMUtils";
 import { PopsInstanceUtils } from "../utils/PopsInstanceUtils";
 import { popsUtils } from "../utils/PopsUtils";
@@ -21,7 +21,7 @@ export const PopsHandler = {
   /**
    * 创建shadow
    */
-  handlerShadow(config: Pick<PopsCommonConfig, "useShadowRoot">) {
+  handlerShadow(config: Pick<PopsGeneralConfig, "useShadowRoot">) {
     const $shadowContainer = popsDOMUtils.createElement("div", {
       className: "pops-shadow-container",
     });
@@ -110,12 +110,12 @@ export const PopsHandler = {
       type: "alert" | "confirm" | "prompt" | "loading" | "iframe" | "drawer" | "folder" | "panel";
       guid: string;
       config:
-        | Required<PopsAlertDetails>
-        | Required<PopsLoadingDetails>
-        | Required<PopsIframeDetails>
-        | Required<PopsDrawerDetails>
-        | Required<PopsPanelDetails>
-        | Required<PopsFolderDetails>;
+        | Required<PopsAlertConfig>
+        | Required<PopsLoadingConfig>
+        | Required<PopsIframeConfig>
+        | Required<PopsDrawerConfig>
+        | Required<PopsPanelConfig>
+        | Required<PopsFolderConfig>;
       animElement: HTMLElement;
       maskHTML: string;
     }
@@ -134,10 +134,10 @@ export const PopsHandler = {
       const targetInst = PopsInstData[config.type];
       function originalRun() {
         if (config.config.mask!.clickEvent!.toClose) {
-          /* 关闭 */
+          // 关闭
           return PopsInstanceUtils.close(config.config, config.type, targetInst, config.guid, config.animElement);
         } else if (config.config.mask!.clickEvent!.toHide) {
-          /* 隐藏 */
+          // 隐藏
           return PopsInstanceUtils.hide(
             config.config,
             config.type,
@@ -170,20 +170,20 @@ export const PopsHandler = {
             element.hasAttribute("anim")
         );
       }
-      /* 判断按下的元素是否是pops-anim */
+      // 判断按下的元素是否是pops-anim
       popsDOMUtils.on(config.animElement, ["touchstart", "mousedown"], void 0, (event) => {
         const $click = event.composedPath()[0] as HTMLElement;
         isMaskClick = isAnimElement($click);
       });
-      /* 如果有动画层，在动画层上监听点击事件 */
+      // 如果有动画层，在动画层上监听点击事件
       popsDOMUtils.on<MouseEvent | PointerEvent>(config.animElement, "click", void 0, (event) => {
         const $click = event.composedPath()[0] as HTMLElement;
         if (isAnimElement($click) && isMaskClick) {
           return clickEvent(event);
         }
       });
-      /* 在遮罩层监听点击事件 */
-      /* 如果有动画层，那么该点击事件触发不了 */
+      // 在遮罩层监听点击事件
+      // 如果有动画层，那么该点击事件触发不了
       popsDOMUtils.on<MouseEvent | PointerEvent>(result.maskElement, "click", void 0, (event) => {
         isMaskClick = true;
         clickEvent(event);
@@ -196,7 +196,7 @@ export const PopsHandler = {
    * @param animElement
    * @param type
    */
-  handleQueryElement(animElement: HTMLDivElement, type: PopsSupportAnimDetailsType) {
+  handleQueryElement(animElement: HTMLDivElement, type: PopsSupportAnimConfigType) {
     return {
       /**
        * 主元素
@@ -351,14 +351,14 @@ export const PopsHandler = {
    */
   handleEventConfig(
     config:
-      | PopsAlertDetails
-      | PopsDrawerDetails
-      | PopsPromptDetails
-      | PopsConfirmDetails
-      | PopsIframeDetails
-      | PopsLoadingDetails
-      | PopsPanelDetails
-      | PopsFolderDetails,
+      | PopsAlertConfig
+      | PopsDrawerConfig
+      | PopsPromptConfig
+      | PopsConfirmConfig
+      | PopsIframeConfig
+      | PopsLoadingConfig
+      | PopsPanelConfig
+      | PopsFolderConfig,
     guid: string,
     $shadowContainer: HTMLDivElement,
     $shadowRoot: ShadowRoot | HTMLElement,
@@ -398,14 +398,14 @@ export const PopsHandler = {
    */
   handleLoadingEventConfig(
     config:
-      | PopsAlertDetails
-      | PopsDrawerDetails
-      | PopsPromptDetails
-      | PopsConfirmDetails
-      | PopsIframeDetails
-      | PopsLoadingDetails
-      | PopsPanelDetails
-      | PopsFolderDetails,
+      | PopsAlertConfig
+      | PopsDrawerConfig
+      | PopsPromptConfig
+      | PopsConfirmConfig
+      | PopsIframeConfig
+      | PopsLoadingConfig
+      | PopsPanelConfig
+      | PopsFolderConfig,
     guid: string,
     mode: "loading",
     $anim: HTMLDivElement,
@@ -560,7 +560,7 @@ export const PopsHandler = {
    * @param type 当前弹窗类型
    * @param config 配置
    */
-  handleOnly<T extends Required<PopsSupportOnlyDetails[keyof PopsSupportOnlyDetails]>>(type: PopsType, config: T): T {
+  handleOnly<T extends Required<PopsSupportOnlyConfig[keyof PopsSupportOnlyConfig]>>(type: PopsType, config: T): T {
     if (config.only) {
       // .loading
       // .tooltip
@@ -602,7 +602,7 @@ export const PopsHandler = {
    * @param type 当前弹窗类型
    * @param value
    */
-  handlePush(type: PopsInstStoreType, value: PopsInstCommonConfig) {
+  handlePush(type: PopsInstStoreType, value: PopsInstGeneralConfig) {
     PopsInstData[type].push(value);
   },
 };

package/src/types/button.d.ts

@@ -1,6 +1,5 @@
 import type { PopsEventConfig, PopsHandlerEventConfig } from "./event";
 import type { PopsIconType } from "./icon";
-import type { PopsType } from "./main";
 
 /**
  * 按钮类型
@@ -24,56 +23,10 @@ export type PopsButtonStyleType =
  */
 export type PopsButtonSize = "large" | "small";
 
-/**
- * 按钮的点击回调参数event
- */
-export interface PopsBtnCallBackEvent {
-  /**
-   * 元素
-   */
-  element: HTMLElement;
-  /**
-   * 动画元素（包裹着弹窗元素）
-   */
-  animElement: HTMLElement;
-  /**
-   * 弹窗元素
-   */
-  popsElement: HTMLElement;
-  /**
-   * 遮罩层元素
-   */
-  maskElement: HTMLElement | undefined;
-  /**
-   * 按钮调用类型
-   */
-  type: PopsButtonType;
-  /**
-   * 调用的方法
-   */
-  mode: PopsType;
-  /**
-   * 唯一id
-   */
-  guid: string;
-  /**
-   * 关闭弹窗
-   */
-  close(): void;
-  /**
-   * 隐藏弹窗
-   */
-  hide(): void;
-  /**
-   * 显示弹窗
-   */
-  show(): void;
-}
-
 /**
  * 按钮配置
  */
-export interface PopsButtonDetails<T = object> {
+export interface PopsGlobalButtonConfig<T = object> {
   /**
    * 是否启用按钮
    */
@@ -116,7 +69,7 @@ export interface PopsButtonDetails<T = object> {
 /**
  * 按钮配置（匹配任意类型）
  */
-export type PopsButtonDetailsAnyType<T = object> = Omit<PopsButtonDetails<T>, "type"> & {
+export type PopsButtonConfigAnyType<T = object> = Omit<PopsGlobalButtonConfig<T>, "type"> & {
   /**
    * 按钮样式类型
    * @default "default"
@@ -124,56 +77,10 @@ export type PopsButtonDetailsAnyType<T = object> = Omit<PopsButtonDetails<T>, "t
   type: string;
 };
 
-/** prompt的点击回调 */
-export interface PopsPromptButtonDetails extends PopsButtonDetails {
-  callback(
-    eventConfig: PopsHandlerEventConfig & {
-      text: string;
-    },
-    event: PointerEvent | MouseEvent
-  ): void;
-}
-/**
- * 右上角关闭按钮点击回调的配置
- */
-export interface PopsHeaderCloseButtonClickCallBackEvent {
-  /**
-   * 动画元素（包裹着弹窗元素）
-   */
-  animElement: HTMLElement;
-  /**
-   * 遮罩层元素，如果未设置，那么不存在
-   */
-  maskElement?: HTMLElement;
-  /**
-   * 按钮调用类型
-   */
-  type: string;
-  /**
-   * 唯一id
-   */
-  guid: string;
-  /**
-   * 关闭弹窗
-   */
-  close(): void;
-  /**
-   * 隐藏弹窗
-   */
-  hide(): void;
-  /**
-   * 显示弹窗
-   */
-  show(): void;
-  /**
-   * 输入的内容
-   */
-  text: string;
-}
 /**
  * 顶部关闭按钮配置
  */
-export interface PopsHeaderCloseButtonDetails {
+export interface PopsHeaderCloseButtonConfig {
   /**
    * 是否启用按钮
    */
@@ -183,5 +90,5 @@ export interface PopsHeaderCloseButtonDetails {
    *
    * 如果传入该值，那么将不会自动关闭弹窗
    */
-  callback?: (details: PopsEventConfig, event: PointerEvent | MouseEvent) => void;
+  callback?: (eventConfig: PopsEventConfig, event: PointerEvent | MouseEvent) => void;
 }